@billgangcom/theme-lib 1.31.0 → 1.32.0

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 (15) hide show
  1. package/dist/builder/components/Sidebar/AddSections/BlockColors/index.d.ts +1 -0
  2. package/dist/builder/store/useLayersStore.d.ts +1 -1
  3. package/dist/builder/ui/Button/index.d.ts +1 -0
  4. package/dist/builder.cjs.js +22 -9
  5. package/dist/builder.es.js +1635 -1502
  6. package/dist/index-8_Sn0J5j.cjs +146 -0
  7. package/dist/{index-CPy18oiD.js → index-CC_0JpL1.js} +13003 -11974
  8. package/dist/lib/index.d.ts +1 -0
  9. package/dist/lib/setupDynamicFonts.d.ts +2 -0
  10. package/dist/ui/Input/index.d.ts +1 -2
  11. package/dist/ui.cjs.js +1 -1
  12. package/dist/ui.es.js +1092 -1033
  13. package/package.json +2 -1
  14. package/dist/builder/components/Sidebar/AddSections/SearchSections/index.d.ts +0 -4
  15. package/dist/index-DWqm1Nf1.cjs +0 -146
package/dist/ui.es.js CHANGED
@@ -1,20 +1,20 @@
1
- import { j as t, I as x, a as X, c as Y, S as K, T as wt, C as ht, b as tt, D as vt, H as jt, B as at, v as ct, u as yt, d as kt, e as gt, f as $t, M as Ct, g as St } from "./index-CPy18oiD.js";
2
- import { h as Fo, L as Uo } from "./index-CPy18oiD.js";
3
- import g from "react";
1
+ import { j as t, I as f, a as W, c as H, S as K, T as wt, C as ht, b as tt, D as vt, H as jt, B as it, v as ct, u as yt, d as kt, e as gt, f as $t, M as Ct, g as St, h as At } from "./index-CC_0JpL1.js";
2
+ import { i as Wo, L as Xo } from "./index-CC_0JpL1.js";
3
+ import _ from "react";
4
4
  import "@phosphor-icons/react";
5
- const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5j_15", Dt = "_subtitle_9rr5j_22", zt = "_alignmentContent_9rr5j_29", Et = "_alignments_9rr5j_37", Lt = "_alignment_9rr5j_8", Rt = "_circle_9rr5j_58", Mt = "_paddings_9rr5j_65", Ht = "_padding_9rr5j_65", Vt = "_input_9rr5j_84", J = {
6
- wrapper: qt,
7
- alignmentBlock: At,
8
- title: Ot,
9
- subtitle: Dt,
10
- alignmentContent: zt,
11
- alignments: Et,
12
- alignment: Lt,
13
- circle: Rt,
14
- paddings: Mt,
15
- padding: Ht,
16
- input: Vt
17
- }, Ft = [
5
+ const Ot = "_wrapper_9rr5j_2", qt = "_alignmentBlock_9rr5j_8", Dt = "_title_9rr5j_15", Et = "_subtitle_9rr5j_22", Lt = "_alignmentContent_9rr5j_29", Rt = "_alignments_9rr5j_37", Mt = "_alignment_9rr5j_8", Ht = "_circle_9rr5j_58", Ft = "_paddings_9rr5j_65", Vt = "_padding_9rr5j_65", Ut = "_input_9rr5j_84", J = {
6
+ wrapper: Ot,
7
+ alignmentBlock: qt,
8
+ title: Dt,
9
+ subtitle: Et,
10
+ alignmentContent: Lt,
11
+ alignments: Rt,
12
+ alignment: Mt,
13
+ circle: Ht,
14
+ paddings: Ft,
15
+ padding: Vt,
16
+ input: Ut
17
+ }, zt = [
18
18
  "topLeft",
19
19
  "top",
20
20
  "topRight",
@@ -24,7 +24,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
24
24
  "bottomLeft",
25
25
  "bottom",
26
26
  "bottomRight"
27
- ], Ut = ["left", "top", "right", "bottom"], To = (u) => {
27
+ ], Yt = ["left", "top", "right", "bottom"], qo = (u) => {
28
28
  const { alignment: o, padding: e, setPadding: n, setAlignment: i } = u;
29
29
  function a() {
30
30
  switch (o) {
@@ -61,7 +61,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
61
61
  /* @__PURE__ */ t.jsxs("div", { className: J.alignmentBlock, children: [
62
62
  /* @__PURE__ */ t.jsx("h5", { className: J.subtitle, children: "Alignment" }),
63
63
  /* @__PURE__ */ t.jsxs("div", { className: J.alignmentContent, children: [
64
- /* @__PURE__ */ t.jsx("div", { className: J.alignments, children: Ft.map((s) => /* @__PURE__ */ t.jsxs(
64
+ /* @__PURE__ */ t.jsx("div", { className: J.alignments, children: zt.map((s) => /* @__PURE__ */ t.jsxs(
65
65
  "div",
66
66
  {
67
67
  onClick: () => {
@@ -71,7 +71,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
71
71
  children: [
72
72
  s !== o && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
73
73
  s === o && /* @__PURE__ */ t.jsx(
74
- x,
74
+ f,
75
75
  {
76
76
  name: a(),
77
77
  fill: "#FF3F19",
@@ -83,13 +83,13 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
83
83
  },
84
84
  s
85
85
  )) }),
86
- /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: Ut.map((s) => /* @__PURE__ */ t.jsxs(
86
+ /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: Yt.map((s) => /* @__PURE__ */ t.jsxs(
87
87
  "label",
88
88
  {
89
89
  className: J.padding,
90
90
  children: [
91
91
  /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
92
- x,
92
+ f,
93
93
  {
94
94
  name: c(s),
95
95
  width: 20,
@@ -97,7 +97,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
97
97
  }
98
98
  ) }),
99
99
  /* @__PURE__ */ t.jsx(
100
- X,
100
+ W,
101
101
  {
102
102
  type: "text",
103
103
  value: String(e[s]),
@@ -116,18 +116,18 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
116
116
  ] })
117
117
  ] })
118
118
  ] });
119
- }, Yt = "_title_18dz7_1", Gt = "_subtitle_18dz7_5", Wt = "_header_18dz7_12", Xt = "_text_18dz7_13", Jt = "_top_18dz7_21", Qt = "_itemsBlock_18dz7_30", rt = {
120
- title: Yt,
121
- subtitle: Gt,
122
- header: Wt,
123
- text: Xt,
124
- top: Jt,
125
- itemsBlock: Qt
126
- }, Kt = "_typeTexts_rcw8p_1", Zt = "_block_rcw8p_8", te = "_active_rcw8p_21", ft = {
127
- typeTexts: Kt,
128
- block: Zt,
129
- active: te
130
- }, ee = ["bold", "italic", "underline", "strike-through", "code"], Pt = (u) => {
119
+ }, Gt = "_title_18dz7_1", Wt = "_subtitle_18dz7_5", Xt = "_header_18dz7_12", Jt = "_text_18dz7_13", Qt = "_top_18dz7_21", Kt = "_itemsBlock_18dz7_30", rt = {
120
+ title: Gt,
121
+ subtitle: Wt,
122
+ header: Xt,
123
+ text: Jt,
124
+ top: Qt,
125
+ itemsBlock: Kt
126
+ }, Zt = "_typeTexts_rcw8p_1", te = "_block_rcw8p_8", ee = "_active_rcw8p_21", ft = {
127
+ typeTexts: Zt,
128
+ block: te,
129
+ active: ee
130
+ }, se = ["bold", "italic", "underline", "strike-through", "code"], Tt = (u) => {
131
131
  const { typesText: o, setTypesText: e } = u;
132
132
  function n(i) {
133
133
  switch (i) {
@@ -143,10 +143,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
143
143
  return "TextUnderline";
144
144
  }
145
145
  }
146
- return /* @__PURE__ */ t.jsx("div", { className: ft.typeTexts, children: ee.map((i) => /* @__PURE__ */ t.jsx(
146
+ return /* @__PURE__ */ t.jsx("div", { className: ft.typeTexts, children: se.map((i) => /* @__PURE__ */ t.jsx(
147
147
  "div",
148
148
  {
149
- className: Y(ft.block, {
149
+ className: H(ft.block, {
150
150
  [ft.active]: o.includes(i)
151
151
  }),
152
152
  onClick: () => {
@@ -158,7 +158,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
158
158
  a.push(i), e(a);
159
159
  },
160
160
  children: /* @__PURE__ */ t.jsx(
161
- x,
161
+ f,
162
162
  {
163
163
  name: n(i),
164
164
  fill: o.includes(i) ? "#252525" : "#757575",
@@ -169,7 +169,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
169
169
  },
170
170
  String(i)
171
171
  )) });
172
- }, Tt = (u) => {
172
+ }, Bt = (u) => {
173
173
  const {
174
174
  typesText: o,
175
175
  isActiveText: e,
@@ -202,7 +202,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
202
202
  }
203
203
  ),
204
204
  /* @__PURE__ */ t.jsx(
205
- Pt,
205
+ Tt,
206
206
  {
207
207
  typesText: o,
208
208
  setTypesText: c
@@ -210,36 +210,36 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
210
210
  )
211
211
  ] })
212
212
  ] });
213
- }, se = "_title_1tzq7_1", ne = "_subtitle_1tzq7_5", ie = "_header_1tzq7_12", oe = "_text_1tzq7_13", ae = "_productsBlock_1tzq7_14", ce = "_top_1tzq7_26", le = "_itemsBlock_1tzq7_35", re = "_typeTexts_1tzq7_41", de = "_block_1tzq7_48", ue = "_active_1tzq7_61", me = "_products_1tzq7_14", _e = "_product_1tzq7_14", he = "_button_1tzq7_80", pe = "_disabled_1tzq7_91", ge = "_image_1tzq7_95", xe = "_info_1tzq7_102", fe = "_name_1tzq7_114", be = "_buttons_1tzq7_118", ve = "_modal_1tzq7_125", je = "_link_1tzq7_147", ye = "_modalOptions_1tzq7_153", R = {
214
- title: se,
215
- subtitle: ne,
216
- header: ie,
217
- text: oe,
218
- productsBlock: ae,
219
- top: ce,
220
- itemsBlock: le,
221
- typeTexts: re,
222
- block: de,
223
- active: ue,
213
+ }, ne = "_title_fyopx_1", ie = "_subtitle_fyopx_5", oe = "_header_fyopx_12", ae = "_text_fyopx_13", ce = "_productsBlock_fyopx_14", le = "_top_fyopx_26", re = "_itemsBlock_fyopx_35", de = "_typeTexts_fyopx_41", ue = "_block_fyopx_48", pe = "_active_fyopx_61", me = "_products_fyopx_14", he = "_product_fyopx_14", _e = "_button_fyopx_80", ge = "_disabled_fyopx_91", xe = "_image_fyopx_95", fe = "_info_fyopx_102", be = "_name_fyopx_114", ve = "_buttons_fyopx_118", je = "_modal_fyopx_125", ye = "_link_fyopx_145", ke = "_modalOptions_fyopx_151", V = {
214
+ title: ne,
215
+ subtitle: ie,
216
+ header: oe,
217
+ text: ae,
218
+ productsBlock: ce,
219
+ top: le,
220
+ itemsBlock: re,
221
+ typeTexts: de,
222
+ block: ue,
223
+ active: pe,
224
224
  products: me,
225
- product: _e,
226
- button: he,
227
- disabled: pe,
228
- image: ge,
229
- info: xe,
230
- name: fe,
231
- buttons: be,
232
- modal: ve,
233
- link: je,
234
- modalOptions: ye
235
- }, ke = g.forwardRef(
225
+ product: he,
226
+ button: _e,
227
+ disabled: ge,
228
+ image: xe,
229
+ info: fe,
230
+ name: be,
231
+ buttons: ve,
232
+ modal: je,
233
+ link: ye,
234
+ modalOptions: ke
235
+ }, $e = _.forwardRef(
236
236
  (u, o) => {
237
237
  const { activeItem: e, setActiveItem: n, popupPosition: i, modalOptions: a, setIsOpenModal: c } = u;
238
- return console.log(e), /* @__PURE__ */ t.jsxs(
238
+ return /* @__PURE__ */ t.jsxs(
239
239
  "div",
240
240
  {
241
241
  ref: o,
242
- className: R.modal,
242
+ className: V.modal,
243
243
  onClick: (s) => {
244
244
  s.stopPropagation();
245
245
  },
@@ -248,10 +248,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
248
248
  left: `${i.left}px`
249
249
  },
250
250
  children: [
251
- /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
252
- /* @__PURE__ */ t.jsx("h3", { className: R.title, children: e.name }),
251
+ /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
252
+ /* @__PURE__ */ t.jsx("h3", { className: V.title, children: e.name }),
253
253
  /* @__PURE__ */ t.jsx(
254
- x,
254
+ f,
255
255
  {
256
256
  name: "X",
257
257
  height: 20,
@@ -263,7 +263,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
263
263
  }
264
264
  )
265
265
  ] }),
266
- /* @__PURE__ */ t.jsx("div", { className: R.modalOptions, children: a.map((s) => {
266
+ /* @__PURE__ */ t.jsx("div", { className: V.modalOptions, children: a.map((s) => {
267
267
  if (s.type === "image")
268
268
  return /* @__PURE__ */ t.jsx(
269
269
  ht,
@@ -282,7 +282,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
282
282
  );
283
283
  if (s.type === "text")
284
284
  return /* @__PURE__ */ t.jsx(
285
- Tt,
285
+ Bt,
286
286
  {
287
287
  typesText: e[s.field.type],
288
288
  setTypesText: (l) => {
@@ -305,7 +305,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
305
305
  );
306
306
  if (s.type === "input")
307
307
  return /* @__PURE__ */ t.jsx(
308
- X,
308
+ W,
309
309
  {
310
310
  onChange: (l) => {
311
311
  const d = {
@@ -320,9 +320,9 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
320
320
  }
321
321
  );
322
322
  if (s.type === "inputSwitch")
323
- return /* @__PURE__ */ t.jsxs("div", { className: R.link, children: [
323
+ return /* @__PURE__ */ t.jsxs("div", { className: V.link, children: [
324
324
  /* @__PURE__ */ t.jsx(
325
- X,
325
+ W,
326
326
  {
327
327
  onChange: (l) => {
328
328
  const d = {
@@ -353,7 +353,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
353
353
  ] });
354
354
  if (s.type === "list")
355
355
  return /* @__PURE__ */ t.jsx(
356
- Ce,
356
+ Se,
357
357
  {
358
358
  items: e[s.field] || [],
359
359
  setItems: (l) => {
@@ -385,7 +385,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
385
385
  },
386
386
  label: s.label,
387
387
  value: e[s.field] || "String",
388
- leftAddon: s.leftAddon && s.leftAddon === "icon" && /* @__PURE__ */ t.jsx(x, { name: e[s.field] })
388
+ leftAddon: s.leftAddon && s.leftAddon === "icon" && /* @__PURE__ */ t.jsx(f, { name: e[s.field] })
389
389
  }
390
390
  );
391
391
  }) })
@@ -393,10 +393,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
393
393
  }
394
394
  );
395
395
  }
396
- ), $e = "_other_g74jx_1", Ne = "_subtitle_g74jx_7", Ie = "_items_g74jx_14", bt = {
397
- other: $e,
398
- subtitle: Ne,
399
- items: Ie
396
+ ), Ne = "_other_g74jx_1", Ie = "_subtitle_g74jx_7", we = "_items_g74jx_14", bt = {
397
+ other: Ne,
398
+ subtitle: Ie,
399
+ items: we
400
400
  }, xt = (u) => {
401
401
  const { items: o, title: e = "Other" } = u;
402
402
  return /* @__PURE__ */ t.jsxs("div", { className: bt.other, children: [
@@ -413,7 +413,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
413
413
  i
414
414
  )) })
415
415
  ] });
416
- }, we = (u) => {
416
+ }, Ce = (u) => {
417
417
  const { index: o, moveProduct: e, children: n } = u, [, i] = yt({
418
418
  accept: "product",
419
419
  hover(s) {
@@ -430,11 +430,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
430
430
  "div",
431
431
  {
432
432
  ref: (s) => c(i(s)),
433
- className: `${R.product} ${a ? R.dragging : ""}`,
433
+ className: `${V.product} ${a ? V.dragging : ""}`,
434
434
  children: n
435
435
  }
436
436
  );
437
- }, Ce = (u) => {
437
+ }, Se = (u) => {
438
438
  const {
439
439
  isActiveItems: o,
440
440
  setIsActiveItems: e,
@@ -445,67 +445,67 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
445
445
  subtitle: s,
446
446
  editable: l = !0,
447
447
  draggable: d = !1,
448
- withImage: v = !1,
448
+ withImage: k = !1,
449
449
  deletable: r = !0,
450
- addable: w = !0,
450
+ addable: B = !0,
451
451
  itemsType: h,
452
- itemsPlaceholder: p = "",
453
- itemsOptions: _,
454
- hasRangeSelector: q = !1,
455
- rangeSelectorOptions: b,
456
- modalOptions: T,
457
- addableOptions: O = {},
458
- limit: N,
459
- autoScrollInterval: C
460
- } = u, [B, V] = g.useState(null), [G, j] = g.useState({
452
+ itemsPlaceholder: g = "",
453
+ itemsOptions: m,
454
+ hasRangeSelector: O = !1,
455
+ rangeSelectorOptions: R,
456
+ modalOptions: P,
457
+ addableOptions: q = {},
458
+ limit: C,
459
+ autoScrollInterval: S
460
+ } = u, [x, v] = _.useState(null), [M, y] = _.useState({
461
461
  top: 0,
462
462
  left: 0
463
- }), [y, E] = g.useState(null), D = g.useRef(null), [z, M] = g.useState(!1), et = (m, I) => {
464
- const k = [...n], [W] = k.splice(m, 1);
465
- k.splice(I, 0, W), i(k);
463
+ }), [j, I] = _.useState(null), D = _.useRef(null), [E, U] = _.useState(!1), et = (p, T) => {
464
+ const $ = [...n], [X] = $.splice(p, 1);
465
+ $.splice(T, 0, X), i($);
466
466
  };
467
- g.useEffect(() => {
468
- const m = () => {
469
- V(null), M(!1);
467
+ _.useEffect(() => {
468
+ const p = () => {
469
+ v(null), U(!1);
470
470
  };
471
- return document.body.addEventListener("click", m), V(null), M(!1), () => {
472
- V(null), M(!1), document.body.removeEventListener("click", m);
471
+ return document.body.addEventListener("click", p), v(null), U(!1), () => {
472
+ v(null), U(!1), document.body.removeEventListener("click", p);
473
473
  };
474
- }, []), g.useEffect(() => {
475
- if (B) {
476
- const m = [...n].map((I) => I.id === B.id ? B : I);
477
- i(m);
474
+ }, []), _.useEffect(() => {
475
+ if (x) {
476
+ const p = [...n].map((T) => T.id === x.id ? x : T);
477
+ i(p);
478
478
  }
479
- }, [B]), g.useEffect(() => {
480
- if (D.current && y) {
481
- const m = D.current.getBoundingClientRect().height, I = window.innerHeight;
482
- let k = y.top;
483
- console.log(k, m, I, window.scrollY), k + m > I + window.scrollY && (k = I + window.scrollY - m - 200), k < 0 && (k = 10), j({
484
- top: k,
485
- left: y.left
479
+ }, [x]), _.useEffect(() => {
480
+ if (D.current && j) {
481
+ const p = D.current.getBoundingClientRect().height, T = window.innerHeight;
482
+ let $ = j.top;
483
+ $ + p > T + window.scrollY && ($ = T + window.scrollY - p - 200), $ < 0 && ($ = 10), y({
484
+ top: $,
485
+ left: j.left
486
486
  });
487
487
  }
488
- }, [D.current, y]);
489
- const it = (m, I) => {
490
- m.stopPropagation();
491
- const k = m.target.getBoundingClientRect();
492
- E({
493
- top: k.top + window.scrollY,
494
- left: k.left - 30
495
- }), V(I), M(!0);
488
+ }, [D.current, j]);
489
+ const ot = (p, T) => {
490
+ p.stopPropagation();
491
+ const $ = p.target.getBoundingClientRect();
492
+ I({
493
+ top: $.top + window.scrollY,
494
+ left: $.left - 30
495
+ }), v(T), U(!0);
496
496
  };
497
- function f(m) {
498
- if (v)
499
- return m ? /* @__PURE__ */ t.jsx(
497
+ function b(p) {
498
+ if (k)
499
+ return p ? /* @__PURE__ */ t.jsx(
500
500
  "img",
501
501
  {
502
- src: `https://imagedelivery.net/${m[0]}/w=1000`,
502
+ src: `https://imagedelivery.net/${p[0]}/w=1000`,
503
503
  alt: "image",
504
504
  width: 16,
505
505
  height: 16
506
506
  }
507
507
  ) : /* @__PURE__ */ t.jsx(
508
- x,
508
+ f,
509
509
  {
510
510
  name: "Image",
511
511
  width: 16,
@@ -514,11 +514,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
514
514
  }
515
515
  );
516
516
  }
517
- const S = (m, I) => {
518
- var W;
519
- const k = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
517
+ const A = (p, T) => {
518
+ var X;
519
+ const $ = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
520
520
  d && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
521
- x,
521
+ f,
522
522
  {
523
523
  name: "DotsSixVertical",
524
524
  hoverable: !0,
@@ -529,152 +529,153 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
529
529
  h === "select" && /* @__PURE__ */ t.jsx(
530
530
  tt,
531
531
  {
532
- onChange: (A) => {
533
- const lt = [...n].map((st) => st.id === m.id ? {
534
- ...m,
535
- name: A
532
+ onChange: (L) => {
533
+ const lt = [...n].map((st) => st.id === p.id ? {
534
+ ...p,
535
+ name: L
536
536
  } : st);
537
- V({
538
- ...m,
539
- name: A
537
+ v({
538
+ ...p,
539
+ name: L
540
540
  }), i([...lt]);
541
541
  },
542
- value: m.name,
543
- options: _.filter((A) => !n.find((F) => F.name === A.name)).map((A) => A.name),
544
- leftAddon: f(m.images)
542
+ value: p.name,
543
+ options: m.filter((L) => !n.find((Y) => Y.name === L.name)).map((L) => L.name),
544
+ leftAddon: b(p.images)
545
545
  }
546
546
  ),
547
547
  h === "input" && /* @__PURE__ */ t.jsx(
548
- X,
548
+ W,
549
549
  {
550
- onChange: (A) => {
551
- const lt = [...n].map((st) => st.id === m.id ? {
552
- ...m,
553
- name: A
550
+ onChange: (L) => {
551
+ const lt = [...n].map((st) => st.id === p.id ? {
552
+ ...p,
553
+ name: L
554
554
  } : st);
555
555
  i([...lt]);
556
556
  },
557
- value: m.name,
558
- placeholder: p
557
+ value: p.name,
558
+ placeholder: g
559
559
  }
560
560
  ),
561
561
  h === "image" && /* @__PURE__ */ t.jsx(
562
562
  ht,
563
563
  {
564
- onChange: (A) => {
565
- const lt = [...n].map((st) => st.id === m.id ? {
566
- ...m,
567
- images: A
564
+ onChange: (L) => {
565
+ const lt = [...n].map((st) => st.id === p.id ? {
566
+ ...p,
567
+ images: L
568
568
  } : st);
569
569
  i([...lt]);
570
570
  },
571
- activeImage: (W = n.find((A) => A.id === m.id)) == null ? void 0 : W.images[0]
571
+ activeImage: (X = n.find((L) => L.id === p.id)) == null ? void 0 : X.images[0]
572
572
  }
573
573
  ),
574
- /* @__PURE__ */ t.jsxs("div", { className: R.buttons, children: [
574
+ /* @__PURE__ */ t.jsxs("div", { className: V.buttons, children: [
575
575
  l && /* @__PURE__ */ t.jsx(
576
- x,
576
+ f,
577
577
  {
578
578
  name: "Sliders",
579
579
  hoverable: !0,
580
580
  width: 20,
581
581
  height: 20,
582
- onClick: (A) => it(A, m)
582
+ onClick: (L) => ot(L, p)
583
583
  }
584
584
  ),
585
585
  r && /* @__PURE__ */ t.jsx(
586
- x,
586
+ f,
587
587
  {
588
588
  name: "Trash",
589
589
  hoverable: !0,
590
590
  width: 20,
591
591
  height: 20,
592
592
  fill: "#C12A2A",
593
- onClick: () => i(n.filter((A) => A.id !== m.id))
593
+ onClick: () => i(n.filter((L) => L.id !== p.id))
594
594
  }
595
595
  )
596
596
  ] })
597
597
  ] });
598
598
  return d ? /* @__PURE__ */ t.jsx(
599
- we,
599
+ Ce,
600
600
  {
601
- product: m,
602
- index: I,
601
+ product: p,
602
+ index: T,
603
603
  moveProduct: et,
604
- children: k
604
+ children: $
605
605
  },
606
- m.id
606
+ p.id
607
607
  ) : /* @__PURE__ */ t.jsx(
608
608
  "div",
609
609
  {
610
- className: R.product,
611
- children: k
610
+ className: V.product,
611
+ children: $
612
612
  },
613
- m.id
613
+ p.id
614
614
  );
615
615
  };
616
- return /* @__PURE__ */ t.jsxs("div", { className: R.productsBlock, children: [
617
- (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
618
- c && /* @__PURE__ */ t.jsx("h3", { className: R.title, children: c }),
616
+ return /* @__PURE__ */ t.jsxs("div", { className: V.productsBlock, children: [
617
+ (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
618
+ c && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: c }),
619
619
  o !== void 0 && /* @__PURE__ */ t.jsx(
620
620
  K,
621
621
  {
622
622
  current: o,
623
- onChange: (m) => e == null ? void 0 : e(m)
623
+ onChange: (p) => e == null ? void 0 : e(p)
624
624
  }
625
625
  )
626
626
  ] }),
627
- B && l && T && z && /* @__PURE__ */ t.jsx(
628
- ke,
627
+ x && l && P && E && /* @__PURE__ */ t.jsx(
628
+ $e,
629
629
  {
630
630
  ref: D,
631
- activeItem: B,
632
- setActiveItem: V,
633
- popupPosition: G,
634
- modalOptions: T,
635
- setIsOpenModal: M
631
+ activeItem: x,
632
+ setActiveItem: v,
633
+ popupPosition: M,
634
+ modalOptions: P,
635
+ setIsOpenModal: U
636
636
  }
637
637
  ),
638
- q && b && /* @__PURE__ */ t.jsx(Nt, { ...b }),
639
- /* @__PURE__ */ t.jsxs("div", { className: R.products, children: [
640
- s && /* @__PURE__ */ t.jsx("h5", { className: R.subtitle, children: s }),
641
- d ? /* @__PURE__ */ t.jsx(vt, { backend: jt, children: n.map((m, I) => S(m, I)) }) : n.map((m, I) => S(m, I)),
642
- w && /* @__PURE__ */ t.jsxs(
643
- at,
638
+ O && R && /* @__PURE__ */ t.jsx(Nt, { ...R }),
639
+ /* @__PURE__ */ t.jsxs("div", { className: V.products, children: [
640
+ s && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: s }),
641
+ d ? /* @__PURE__ */ t.jsx(vt, { backend: jt, children: n.map((p, T) => A(p, T)) }) : n.map((p, T) => A(p, T)),
642
+ B && /* @__PURE__ */ t.jsxs(
643
+ it,
644
644
  {
645
- className: Y(R.button, {
646
- [R.disabled]: !!(N && N <= n.length || n.length === (_ == null ? void 0 : _.length))
645
+ withoutHover: !0,
646
+ className: H(V.button, {
647
+ [V.disabled]: !!(C && C <= n.length || n.length === (m == null ? void 0 : m.length))
647
648
  }),
648
649
  size: "s",
649
- disabled: !!(N && N <= n.length || n.length === (_ == null ? void 0 : _.length)),
650
+ disabled: !!(C && C <= n.length || n.length === (m == null ? void 0 : m.length)),
650
651
  onClick: () => {
651
- const m = [...n];
652
- let I = null;
653
- if (_) {
654
- for (let k = 0; k < _.length; k++)
655
- if (!n.find((W) => W.id === _[k].id)) {
656
- I = _[k];
652
+ const p = [...n];
653
+ let T = null;
654
+ if (m) {
655
+ for (let $ = 0; $ < m.length; $++)
656
+ if (!n.find((X) => X.id === m[$].id)) {
657
+ T = m[$];
657
658
  break;
658
659
  }
659
660
  }
660
- h === "select" ? m.push({
661
- name: I ? I.name : _[0].name,
662
- id: (I == null ? void 0 : I.id) || _[0].id,
663
- ...O
664
- }) : h === "input" ? m.push({
661
+ h === "select" ? p.push({
662
+ name: T ? T.name : m[0].name,
663
+ id: (T == null ? void 0 : T.id) || m[0].id,
664
+ ...q
665
+ }) : h === "input" ? p.push({
665
666
  name: "",
666
667
  id: ct(),
667
- ...O
668
- }) : m.push({
668
+ ...q
669
+ }) : p.push({
669
670
  name: `Image ${n.length + 1}`,
670
671
  id: ct(),
671
- ...O
672
- }), i(m);
672
+ ...q
673
+ }), i(p);
673
674
  },
674
675
  children: [
675
676
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
676
677
  /* @__PURE__ */ t.jsx(
677
- x,
678
+ f,
678
679
  {
679
680
  name: "Plus",
680
681
  width: 16,
@@ -686,13 +687,13 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
686
687
  )
687
688
  ] }),
688
689
  a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a }),
689
- C !== void 0 && /* @__PURE__ */ t.jsx(
690
- X,
690
+ S !== void 0 && /* @__PURE__ */ t.jsx(
691
+ W,
691
692
  {
692
693
  label: "Auto scroll interval",
693
694
  type: "number",
694
- value: String(C.scrollInterval),
695
- onChange: (m) => C.setScrollInterval(Number(m)),
695
+ value: String(S.scrollInterval),
696
+ onChange: (p) => S.setScrollInterval(Number(p)),
696
697
  min: 0.1,
697
698
  max: 100,
698
699
  style: {
@@ -702,29 +703,29 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
702
703
  }
703
704
  )
704
705
  ] });
705
- }, Se = "_title_fyopx_1", Pe = "_subtitle_fyopx_5", Te = "_header_fyopx_12", Be = "_text_fyopx_13", qe = "_productsBlock_fyopx_14", Ae = "_top_fyopx_26", Oe = "_itemsBlock_fyopx_35", De = "_typeTexts_fyopx_41", ze = "_block_fyopx_48", Ee = "_active_fyopx_61", Le = "_products_fyopx_14", Re = "_product_fyopx_14", Me = "_button_fyopx_80", He = "_disabled_fyopx_91", Ve = "_image_fyopx_95", Fe = "_info_fyopx_102", Ue = "_name_fyopx_114", Ye = "_buttons_fyopx_118", Ge = "_modal_fyopx_125", We = "_link_fyopx_145", Xe = "_modalOptions_fyopx_151", Z = {
706
- title: Se,
707
- subtitle: Pe,
708
- header: Te,
709
- text: Be,
710
- productsBlock: qe,
711
- top: Ae,
712
- itemsBlock: Oe,
713
- typeTexts: De,
714
- block: ze,
715
- active: Ee,
716
- products: Le,
717
- product: Re,
718
- button: Me,
719
- disabled: He,
720
- image: Ve,
721
- info: Fe,
722
- name: Ue,
723
- buttons: Ye,
724
- modal: Ge,
725
- link: We,
726
- modalOptions: Xe
727
- }, Bo = (u) => {
706
+ }, Te = "_title_fyopx_1", Be = "_subtitle_fyopx_5", Pe = "_header_fyopx_12", Ae = "_text_fyopx_13", Oe = "_productsBlock_fyopx_14", qe = "_top_fyopx_26", De = "_itemsBlock_fyopx_35", Ee = "_typeTexts_fyopx_41", Le = "_block_fyopx_48", Re = "_active_fyopx_61", Me = "_products_fyopx_14", He = "_product_fyopx_14", Fe = "_button_fyopx_80", Ve = "_disabled_fyopx_91", Ue = "_image_fyopx_95", ze = "_info_fyopx_102", Ye = "_name_fyopx_114", Ge = "_buttons_fyopx_118", We = "_modal_fyopx_125", Xe = "_link_fyopx_145", Je = "_modalOptions_fyopx_151", Z = {
707
+ title: Te,
708
+ subtitle: Be,
709
+ header: Pe,
710
+ text: Ae,
711
+ productsBlock: Oe,
712
+ top: qe,
713
+ itemsBlock: De,
714
+ typeTexts: Ee,
715
+ block: Le,
716
+ active: Re,
717
+ products: Me,
718
+ product: He,
719
+ button: Fe,
720
+ disabled: Ve,
721
+ image: Ue,
722
+ info: ze,
723
+ name: Ye,
724
+ buttons: Ge,
725
+ modal: We,
726
+ link: Xe,
727
+ modalOptions: Je
728
+ }, Do = (u) => {
728
729
  const {
729
730
  isActiveItems: o,
730
731
  setIsActiveItems: e,
@@ -735,25 +736,25 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
735
736
  subtitle: s,
736
737
  draggable: l = !1,
737
738
  withImage: d = !1,
738
- addable: v = !0,
739
+ addable: k = !0,
739
740
  itemsOptions: r,
740
- hasRangeSelector: w = !1,
741
+ hasRangeSelector: B = !1,
741
742
  rangeSelectorOptions: h,
742
- limit: p,
743
- autoScrollInterval: _
743
+ limit: g,
744
+ autoScrollInterval: m
744
745
  } = u;
745
- function q(T) {
746
+ function O(P) {
746
747
  if (d)
747
- return T ? /* @__PURE__ */ t.jsx(
748
+ return P ? /* @__PURE__ */ t.jsx(
748
749
  "img",
749
750
  {
750
- src: `https://imagedelivery.net/${T[0]}/w=1000`,
751
+ src: `https://imagedelivery.net/${P[0]}/w=1000`,
751
752
  alt: "image",
752
753
  width: 16,
753
754
  height: 16
754
755
  }
755
756
  ) : /* @__PURE__ */ t.jsx(
756
- x,
757
+ f,
757
758
  {
758
759
  name: "Image",
759
760
  width: 16,
@@ -762,12 +763,12 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
762
763
  }
763
764
  );
764
765
  }
765
- const b = (T) => {
766
- const O = r.find((C) => C.id === T);
767
- if (!O) return;
768
- const N = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
766
+ const R = (P) => {
767
+ const q = r.find((S) => S.id === P);
768
+ if (!q) return;
769
+ const C = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
769
770
  l && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
770
- x,
771
+ f,
771
772
  {
772
773
  name: "DotsSixVertical",
773
774
  hoverable: !0,
@@ -778,26 +779,26 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
778
779
  /* @__PURE__ */ t.jsx(
779
780
  tt,
780
781
  {
781
- onChange: (C) => {
782
- const B = [...n], V = r.find((y) => y.name === C);
783
- if (!V) return;
784
- const G = V.id, j = B.map((y) => y === T ? G : y);
785
- i([...j]);
782
+ onChange: (S) => {
783
+ const x = [...n], v = r.find((j) => j.name === S);
784
+ if (!v) return;
785
+ const M = v.id, y = x.map((j) => j === P ? M : j);
786
+ i([...y]);
786
787
  },
787
- value: O.name,
788
- options: r.filter((C) => !n.find((B) => B === C.id)).map((C) => C.name),
789
- leftAddon: q(O.images)
788
+ value: q.name,
789
+ options: r.filter((S) => !n.find((x) => x === S.id)).map((S) => S.name),
790
+ leftAddon: O(q.images)
790
791
  }
791
792
  ),
792
793
  /* @__PURE__ */ t.jsx("div", { className: Z.buttons, children: /* @__PURE__ */ t.jsx(
793
- x,
794
+ f,
794
795
  {
795
796
  name: "Trash",
796
797
  hoverable: !0,
797
798
  width: 20,
798
799
  height: 20,
799
800
  fill: "#C12A2A",
800
- onClick: () => i(n.filter((C) => C !== T))
801
+ onClick: () => i(n.filter((S) => S !== P))
801
802
  }
802
803
  ) })
803
804
  ] });
@@ -805,9 +806,9 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
805
806
  "div",
806
807
  {
807
808
  className: Z.product,
808
- children: N
809
+ children: C
809
810
  },
810
- T
811
+ P
811
812
  );
812
813
  };
813
814
  return /* @__PURE__ */ t.jsxs("div", { className: Z.productsBlock, children: [
@@ -817,38 +818,39 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
817
818
  K,
818
819
  {
819
820
  current: o,
820
- onChange: (T) => e == null ? void 0 : e(T)
821
+ onChange: (P) => e == null ? void 0 : e(P)
821
822
  }
822
823
  )
823
824
  ] }),
824
- w && h && /* @__PURE__ */ t.jsx(Nt, { ...h }),
825
+ B && h && /* @__PURE__ */ t.jsx(Nt, { ...h }),
825
826
  /* @__PURE__ */ t.jsxs("div", { className: Z.products, children: [
826
827
  s && /* @__PURE__ */ t.jsx("h5", { className: Z.subtitle, children: s }),
827
- n.map((T) => b(T)),
828
- v && /* @__PURE__ */ t.jsxs(
829
- at,
828
+ n.map((P) => R(P)),
829
+ k && /* @__PURE__ */ t.jsxs(
830
+ it,
830
831
  {
831
- className: Y(Z.button, {
832
- [Z.disabled]: !!(p && p <= n.length || n.length === r.length)
832
+ withoutHover: !0,
833
+ className: H(Z.button, {
834
+ [Z.disabled]: !!(g && g <= n.length || n.length === r.length)
833
835
  }),
834
836
  size: "s",
835
- disabled: !!(p && p <= n.length || n.length === r.length),
837
+ disabled: !!(g && g <= n.length || n.length === r.length),
836
838
  onClick: () => {
837
- const T = [...n];
838
- let O = null;
839
+ const P = [...n];
840
+ let q = null;
839
841
  if (r) {
840
- for (let N = 0; N < r.length; N++)
841
- if (!n.find((C) => C === r[N].id)) {
842
- O = r[N];
842
+ for (let C = 0; C < r.length; C++)
843
+ if (!n.find((S) => S === r[C].id)) {
844
+ q = r[C];
843
845
  break;
844
846
  }
845
847
  }
846
- T.push((O == null ? void 0 : O.id) || r[0].id), i(T);
848
+ P.push((q == null ? void 0 : q.id) || r[0].id), i(P);
847
849
  },
848
850
  children: [
849
851
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
850
852
  /* @__PURE__ */ t.jsx(
851
- x,
853
+ f,
852
854
  {
853
855
  name: "Plus",
854
856
  width: 16,
@@ -860,13 +862,13 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
860
862
  )
861
863
  ] }),
862
864
  a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a }),
863
- _ !== void 0 && /* @__PURE__ */ t.jsx(
864
- X,
865
+ m !== void 0 && /* @__PURE__ */ t.jsx(
866
+ W,
865
867
  {
866
868
  label: "Auto scroll interval",
867
869
  type: "number",
868
- value: String(_.scrollInterval),
869
- onChange: (T) => _.setScrollInterval(Number(T)),
870
+ value: String(m.scrollInterval),
871
+ onChange: (P) => m.setScrollInterval(Number(P)),
870
872
  min: 0.1,
871
873
  max: 100,
872
874
  style: {
@@ -876,36 +878,36 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
876
878
  }
877
879
  )
878
880
  ] });
879
- }, Je = "_title_1tzq7_1", Qe = "_subtitle_1tzq7_5", Ke = "_header_1tzq7_12", Ze = "_text_1tzq7_13", ts = "_productsBlock_1tzq7_14", es = "_top_1tzq7_26", ss = "_itemsBlock_1tzq7_35", ns = "_typeTexts_1tzq7_41", is = "_block_1tzq7_48", os = "_active_1tzq7_61", as = "_products_1tzq7_14", cs = "_product_1tzq7_14", ls = "_button_1tzq7_80", rs = "_disabled_1tzq7_91", ds = "_image_1tzq7_95", us = "_info_1tzq7_102", ms = "_name_1tzq7_114", _s = "_buttons_1tzq7_118", hs = "_modal_1tzq7_125", ps = "_link_1tzq7_147", gs = "_modalOptions_1tzq7_153", H = {
880
- title: Je,
881
- subtitle: Qe,
882
- header: Ke,
883
- text: Ze,
884
- productsBlock: ts,
885
- top: es,
886
- itemsBlock: ss,
887
- typeTexts: ns,
888
- block: is,
889
- active: os,
890
- products: as,
891
- product: cs,
892
- button: ls,
893
- disabled: rs,
894
- image: ds,
895
- info: us,
881
+ }, Qe = "_title_fyopx_1", Ke = "_subtitle_fyopx_5", Ze = "_header_fyopx_12", ts = "_text_fyopx_13", es = "_productsBlock_fyopx_14", ss = "_top_fyopx_26", ns = "_itemsBlock_fyopx_35", is = "_typeTexts_fyopx_41", os = "_block_fyopx_48", as = "_active_fyopx_61", cs = "_products_fyopx_14", ls = "_product_fyopx_14", rs = "_button_fyopx_80", ds = "_disabled_fyopx_91", us = "_image_fyopx_95", ps = "_info_fyopx_102", ms = "_name_fyopx_114", hs = "_buttons_fyopx_118", _s = "_modal_fyopx_125", gs = "_link_fyopx_145", xs = "_modalOptions_fyopx_151", z = {
882
+ title: Qe,
883
+ subtitle: Ke,
884
+ header: Ze,
885
+ text: ts,
886
+ productsBlock: es,
887
+ top: ss,
888
+ itemsBlock: ns,
889
+ typeTexts: is,
890
+ block: os,
891
+ active: as,
892
+ products: cs,
893
+ product: ls,
894
+ button: rs,
895
+ disabled: ds,
896
+ image: us,
897
+ info: ps,
896
898
  name: ms,
897
- buttons: _s,
898
- modal: hs,
899
- link: ps,
900
- modalOptions: gs
901
- }, xs = g.forwardRef(
899
+ buttons: hs,
900
+ modal: _s,
901
+ link: gs,
902
+ modalOptions: xs
903
+ }, fs = _.forwardRef(
902
904
  (u, o) => {
903
905
  const { activeItem: e, setActiveItem: n, popupPosition: i, modalOptions: a, setIsOpenModal: c } = u;
904
- return console.log(e), /* @__PURE__ */ t.jsxs(
906
+ return /* @__PURE__ */ t.jsxs(
905
907
  "div",
906
908
  {
907
909
  ref: o,
908
- className: H.modal,
910
+ className: z.modal,
909
911
  onClick: (s) => {
910
912
  s.stopPropagation();
911
913
  },
@@ -914,10 +916,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
914
916
  left: `${i.left}px`
915
917
  },
916
918
  children: [
917
- /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
918
- /* @__PURE__ */ t.jsx("h3", { className: H.title, children: e.name }),
919
+ /* @__PURE__ */ t.jsxs("div", { className: z.top, children: [
920
+ /* @__PURE__ */ t.jsx("h3", { className: z.title, children: e.name }),
919
921
  /* @__PURE__ */ t.jsx(
920
- x,
922
+ f,
921
923
  {
922
924
  name: "X",
923
925
  height: 20,
@@ -929,7 +931,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
929
931
  }
930
932
  )
931
933
  ] }),
932
- /* @__PURE__ */ t.jsx("div", { className: H.modalOptions, children: a.map((s) => {
934
+ /* @__PURE__ */ t.jsx("div", { className: z.modalOptions, children: a.map((s) => {
933
935
  if (s.type === "image")
934
936
  return /* @__PURE__ */ t.jsx(
935
937
  ht,
@@ -948,7 +950,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
948
950
  );
949
951
  if (s.type === "text")
950
952
  return /* @__PURE__ */ t.jsx(
951
- Tt,
953
+ Bt,
952
954
  {
953
955
  typesText: e[s.field.type],
954
956
  setTypesText: (l) => {
@@ -971,7 +973,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
971
973
  );
972
974
  if (s.type === "input")
973
975
  return /* @__PURE__ */ t.jsx(
974
- X,
976
+ W,
975
977
  {
976
978
  onChange: (l) => {
977
979
  const d = {
@@ -986,9 +988,9 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
986
988
  }
987
989
  );
988
990
  if (s.type === "inputSwitch")
989
- return /* @__PURE__ */ t.jsxs("div", { className: H.link, children: [
991
+ return /* @__PURE__ */ t.jsxs("div", { className: z.link, children: [
990
992
  /* @__PURE__ */ t.jsx(
991
- X,
993
+ W,
992
994
  {
993
995
  onChange: (l) => {
994
996
  const d = {
@@ -1031,7 +1033,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1031
1033
  },
1032
1034
  label: s.label,
1033
1035
  value: e[s.field] || "String",
1034
- leftAddon: s.leftAddon && s.leftAddon === "icon" && /* @__PURE__ */ t.jsx(x, { name: e[s.field] })
1036
+ leftAddon: s.leftAddon && s.leftAddon === "icon" && /* @__PURE__ */ t.jsx(f, { name: e[s.field] })
1035
1037
  }
1036
1038
  );
1037
1039
  }) })
@@ -1039,7 +1041,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1039
1041
  }
1040
1042
  );
1041
1043
  }
1042
- ), fs = (u) => {
1044
+ ), bs = (u) => {
1043
1045
  const { index: o, moveProduct: e, children: n } = u, [, i] = yt({
1044
1046
  accept: "product",
1045
1047
  hover(s) {
@@ -1056,11 +1058,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1056
1058
  "div",
1057
1059
  {
1058
1060
  ref: (s) => c(i(s)),
1059
- className: `${H.product} ${a ? H.dragging : ""}`,
1061
+ className: `${z.product} ${a ? z.dragging : ""}`,
1060
1062
  children: n
1061
1063
  }
1062
1064
  );
1063
- }, qo = (u) => {
1065
+ }, Eo = (u) => {
1064
1066
  const {
1065
1067
  isActiveItems: o,
1066
1068
  setIsActiveItems: e,
@@ -1071,65 +1073,65 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1071
1073
  subtitle: s,
1072
1074
  editable: l = !0,
1073
1075
  draggable: d = !1,
1074
- withImage: v = !1,
1076
+ withImage: k = !1,
1075
1077
  deletable: r = !0,
1076
- addable: w = !0,
1078
+ addable: B = !0,
1077
1079
  itemsType: h,
1078
- itemsPlaceholder: p = "",
1079
- itemsOptions: _,
1080
- hasRangeSelector: q = !1,
1081
- rangeSelectorOptions: b,
1082
- modalOptions: T,
1083
- addableOptions: O = {}
1084
- } = u, [N, C] = g.useState(null), [B, V] = g.useState({
1080
+ itemsPlaceholder: g = "",
1081
+ itemsOptions: m,
1082
+ hasRangeSelector: O = !1,
1083
+ rangeSelectorOptions: R,
1084
+ modalOptions: P,
1085
+ addableOptions: q = {}
1086
+ } = u, [C, S] = _.useState(null), [x, v] = _.useState({
1085
1087
  top: 0,
1086
1088
  left: 0
1087
- }), [G, j] = g.useState(null), y = g.useRef(null), [E, D] = g.useState(!1), z = (f, S) => {
1088
- const m = [...n], [I] = m.splice(f, 1);
1089
- m.splice(S, 0, I), i(m);
1089
+ }), [M, y] = _.useState(null), j = _.useRef(null), [I, D] = _.useState(!1), E = (b, A) => {
1090
+ const p = [...n], [T] = p.splice(b, 1);
1091
+ p.splice(A, 0, T), i(p);
1090
1092
  };
1091
- g.useEffect(() => {
1092
- const f = () => {
1093
- C(null), D(!1);
1093
+ _.useEffect(() => {
1094
+ const b = () => {
1095
+ S(null), D(!1);
1094
1096
  };
1095
- return document.body.addEventListener("click", f), C(null), D(!1), () => {
1096
- C(null), D(!1), document.body.removeEventListener("click", f);
1097
+ return document.body.addEventListener("click", b), S(null), D(!1), () => {
1098
+ S(null), D(!1), document.body.removeEventListener("click", b);
1097
1099
  };
1098
- }, []), g.useEffect(() => {
1099
- if (N) {
1100
- const f = [...n].map((S) => S.id === N.id ? N : S);
1101
- i(f);
1100
+ }, []), _.useEffect(() => {
1101
+ if (C) {
1102
+ const b = [...n].map((A) => A.id === C.id ? C : A);
1103
+ i(b);
1102
1104
  }
1103
- }, [N]), g.useEffect(() => {
1104
- if (y.current && G) {
1105
- const f = y.current.getBoundingClientRect().height, S = window.innerHeight;
1106
- let m = G.top;
1107
- console.log(m, f, S, window.scrollY), m + f > S + window.scrollY && (m = S + window.scrollY - f - 200), m < 0 && (m = 10), V({
1108
- top: m,
1109
- left: G.left
1105
+ }, [C]), _.useEffect(() => {
1106
+ if (j.current && M) {
1107
+ const b = j.current.getBoundingClientRect().height, A = window.innerHeight;
1108
+ let p = M.top;
1109
+ p + b > A + window.scrollY && (p = A + window.scrollY - b - 200), p < 0 && (p = 10), v({
1110
+ top: p,
1111
+ left: M.left
1110
1112
  });
1111
1113
  }
1112
- }, [y.current, G]);
1113
- const M = (f, S) => {
1114
- f.stopPropagation();
1115
- const m = f.target.getBoundingClientRect();
1116
- j({
1117
- top: m.top + window.scrollY,
1118
- left: m.left - 30
1119
- }), C(S), D(!0);
1114
+ }, [j.current, M]);
1115
+ const U = (b, A) => {
1116
+ b.stopPropagation();
1117
+ const p = b.target.getBoundingClientRect();
1118
+ y({
1119
+ top: p.top + window.scrollY,
1120
+ left: p.left - 30
1121
+ }), S(A), D(!0);
1120
1122
  };
1121
- function et(f) {
1122
- if (v)
1123
- return f ? /* @__PURE__ */ t.jsx(
1123
+ function et(b) {
1124
+ if (k)
1125
+ return b ? /* @__PURE__ */ t.jsx(
1124
1126
  "img",
1125
1127
  {
1126
- src: `https://imagedelivery.net/${f[0]}/w=1000`,
1128
+ src: `https://imagedelivery.net/${b[0]}/w=1000`,
1127
1129
  alt: "image",
1128
1130
  width: 16,
1129
1131
  height: 16
1130
1132
  }
1131
1133
  ) : /* @__PURE__ */ t.jsx(
1132
- x,
1134
+ f,
1133
1135
  {
1134
1136
  name: "Image",
1135
1137
  width: 16,
@@ -1138,11 +1140,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1138
1140
  }
1139
1141
  );
1140
1142
  }
1141
- const it = (f, S) => {
1142
- var I;
1143
- const m = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1143
+ const ot = (b, A) => {
1144
+ var T;
1145
+ const p = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1144
1146
  d && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
1145
- x,
1147
+ f,
1146
1148
  {
1147
1149
  name: "DotsSixVertical",
1148
1150
  hoverable: !0,
@@ -1153,149 +1155,150 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1153
1155
  h === "select" && /* @__PURE__ */ t.jsx(
1154
1156
  tt,
1155
1157
  {
1156
- onChange: (k) => {
1157
- const A = [...n].map((F) => F.id === f.id ? {
1158
- ...f,
1159
- name: k
1160
- } : F);
1161
- C({
1162
- ...f,
1163
- name: k
1164
- }), i([...A]);
1158
+ onChange: ($) => {
1159
+ const L = [...n].map((Y) => Y.id === b.id ? {
1160
+ ...b,
1161
+ name: $
1162
+ } : Y);
1163
+ S({
1164
+ ...b,
1165
+ name: $
1166
+ }), i([...L]);
1165
1167
  },
1166
- value: f.name,
1167
- options: _.filter((k) => !n.find((W) => W.name === k)),
1168
- leftAddon: et(f.images)
1168
+ value: b.name,
1169
+ options: m.filter(($) => !n.find((X) => X.name === $)),
1170
+ leftAddon: et(b.images)
1169
1171
  }
1170
1172
  ),
1171
1173
  h === "input" && /* @__PURE__ */ t.jsx(
1172
- X,
1174
+ W,
1173
1175
  {
1174
- onChange: (k) => {
1175
- const A = [...n].map((F) => F.id === f.id ? {
1176
- ...f,
1177
- name: k
1178
- } : F);
1179
- i([...A]);
1176
+ onChange: ($) => {
1177
+ const L = [...n].map((Y) => Y.id === b.id ? {
1178
+ ...b,
1179
+ name: $
1180
+ } : Y);
1181
+ i([...L]);
1180
1182
  },
1181
- value: f.name,
1182
- placeholder: p
1183
+ value: b.name,
1184
+ placeholder: g
1183
1185
  }
1184
1186
  ),
1185
1187
  h === "image" && /* @__PURE__ */ t.jsx(
1186
1188
  ht,
1187
1189
  {
1188
- onChange: (k) => {
1189
- const A = [...n].map((F) => F.id === f.id ? {
1190
- ...f,
1191
- images: k
1192
- } : F);
1193
- i([...A]);
1190
+ onChange: ($) => {
1191
+ const L = [...n].map((Y) => Y.id === b.id ? {
1192
+ ...b,
1193
+ images: $
1194
+ } : Y);
1195
+ i([...L]);
1194
1196
  },
1195
- activeImage: (I = n.find((k) => k.id === f.id)) == null ? void 0 : I.images[0]
1197
+ activeImage: (T = n.find(($) => $.id === b.id)) == null ? void 0 : T.images[0]
1196
1198
  }
1197
1199
  ),
1198
- /* @__PURE__ */ t.jsxs("div", { className: H.buttons, children: [
1200
+ /* @__PURE__ */ t.jsxs("div", { className: z.buttons, children: [
1199
1201
  l && /* @__PURE__ */ t.jsx(
1200
- x,
1202
+ f,
1201
1203
  {
1202
1204
  name: "Sliders",
1203
1205
  hoverable: !0,
1204
1206
  width: 20,
1205
1207
  height: 20,
1206
- onClick: (k) => M(k, f)
1208
+ onClick: ($) => U($, b)
1207
1209
  }
1208
1210
  ),
1209
1211
  r && /* @__PURE__ */ t.jsx(
1210
- x,
1212
+ f,
1211
1213
  {
1212
1214
  name: "Trash",
1213
1215
  hoverable: !0,
1214
1216
  width: 20,
1215
1217
  height: 20,
1216
1218
  fill: "#C12A2A",
1217
- onClick: () => i(n.filter((k) => k.id !== f.id))
1219
+ onClick: () => i(n.filter(($) => $.id !== b.id))
1218
1220
  }
1219
1221
  )
1220
1222
  ] })
1221
1223
  ] });
1222
1224
  return d ? /* @__PURE__ */ t.jsx(
1223
- fs,
1225
+ bs,
1224
1226
  {
1225
- product: f,
1226
- index: S,
1227
- moveProduct: z,
1228
- children: m
1227
+ product: b,
1228
+ index: A,
1229
+ moveProduct: E,
1230
+ children: p
1229
1231
  },
1230
- f.id
1232
+ b.id
1231
1233
  ) : /* @__PURE__ */ t.jsx(
1232
1234
  "div",
1233
1235
  {
1234
- className: H.product,
1235
- children: m
1236
+ className: z.product,
1237
+ children: p
1236
1238
  },
1237
- f.id
1239
+ b.id
1238
1240
  );
1239
1241
  };
1240
- return /* @__PURE__ */ t.jsxs("div", { className: H.productsBlock, children: [
1241
- (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
1242
- c && /* @__PURE__ */ t.jsx("h3", { className: H.title, children: c }),
1242
+ return /* @__PURE__ */ t.jsxs("div", { className: z.productsBlock, children: [
1243
+ (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: z.top, children: [
1244
+ c && /* @__PURE__ */ t.jsx("h3", { className: z.title, children: c }),
1243
1245
  o !== void 0 && /* @__PURE__ */ t.jsx(
1244
1246
  K,
1245
1247
  {
1246
1248
  current: o,
1247
- onChange: (f) => e == null ? void 0 : e(f)
1249
+ onChange: (b) => e == null ? void 0 : e(b)
1248
1250
  }
1249
1251
  )
1250
1252
  ] }),
1251
- N && l && T && E && /* @__PURE__ */ t.jsx(
1252
- xs,
1253
+ C && l && P && I && /* @__PURE__ */ t.jsx(
1254
+ fs,
1253
1255
  {
1254
- ref: y,
1255
- activeItem: N,
1256
- setActiveItem: C,
1257
- popupPosition: B,
1258
- modalOptions: T,
1256
+ ref: j,
1257
+ activeItem: C,
1258
+ setActiveItem: S,
1259
+ popupPosition: x,
1260
+ modalOptions: P,
1259
1261
  setIsOpenModal: D
1260
1262
  }
1261
1263
  ),
1262
- q && b && /* @__PURE__ */ t.jsx(Nt, { ...b }),
1263
- /* @__PURE__ */ t.jsxs("div", { className: H.products, children: [
1264
- s && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: s }),
1265
- d ? /* @__PURE__ */ t.jsx(vt, { backend: jt, children: n.map((f, S) => it(f, S)) }) : n.map((f, S) => it(f, S)),
1266
- w && /* @__PURE__ */ t.jsxs(
1267
- at,
1264
+ O && R && /* @__PURE__ */ t.jsx(Nt, { ...R }),
1265
+ /* @__PURE__ */ t.jsxs("div", { className: z.products, children: [
1266
+ s && /* @__PURE__ */ t.jsx("h5", { className: z.subtitle, children: s }),
1267
+ d ? /* @__PURE__ */ t.jsx(vt, { backend: jt, children: n.map((b, A) => ot(b, A)) }) : n.map((b, A) => ot(b, A)),
1268
+ B && /* @__PURE__ */ t.jsxs(
1269
+ it,
1268
1270
  {
1269
- className: H.button,
1271
+ withoutHover: !0,
1272
+ className: z.button,
1270
1273
  size: "s",
1271
1274
  onClick: () => {
1272
- const f = [...n];
1273
- let S = null;
1274
- if (_) {
1275
- for (let m = 0; m < _.length; m++)
1276
- if (!n.find((I) => I.name === _[m])) {
1277
- S = _[m];
1275
+ const b = [...n];
1276
+ let A = null;
1277
+ if (m) {
1278
+ for (let p = 0; p < m.length; p++)
1279
+ if (!n.find((T) => T.name === m[p])) {
1280
+ A = m[p];
1278
1281
  break;
1279
1282
  }
1280
1283
  }
1281
- h === "select" ? f.push({
1282
- name: S || _[0],
1284
+ h === "select" ? b.push({
1285
+ name: A || m[0],
1283
1286
  id: ct(),
1284
- ...O
1285
- }) : h === "input" ? f.push({
1287
+ ...q
1288
+ }) : h === "input" ? b.push({
1286
1289
  name: "",
1287
1290
  id: ct(),
1288
- ...O
1289
- }) : f.push({
1291
+ ...q
1292
+ }) : b.push({
1290
1293
  name: `Image ${n.length + 1}`,
1291
1294
  id: ct(),
1292
- ...O
1293
- }), i(f);
1295
+ ...q
1296
+ }), i(b);
1294
1297
  },
1295
1298
  children: [
1296
1299
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
1297
1300
  /* @__PURE__ */ t.jsx(
1298
- x,
1301
+ f,
1299
1302
  {
1300
1303
  name: "Plus",
1301
1304
  width: 16,
@@ -1308,31 +1311,31 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1308
1311
  ] }),
1309
1312
  a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a })
1310
1313
  ] });
1311
- }, bs = "_title_dkxs6_1", vs = "_subtitle_dkxs6_5", js = "_header_dkxs6_12", ys = "_text_dkxs6_13", ks = "_productsBlock_dkxs6_14", $s = "_buttonsBlock_dkxs6_15", Ns = "_top_dkxs6_26", Is = "_itemsBlock_dkxs6_35", ws = "_typeTexts_dkxs6_41", Cs = "_block_dkxs6_48", Ss = "_active_dkxs6_60", Ps = "_products_dkxs6_14", Ts = "_product_dkxs6_14", Bs = "_button_dkxs6_15", qs = "_image_dkxs6_90", As = "_info_dkxs6_97", Os = "_name_dkxs6_109", Ds = "_buttons_dkxs6_15", zs = "_modal_dkxs6_120", Es = "_other_dkxs6_140", Ls = "_options_dkxs6_146", ot = {
1312
- title: bs,
1313
- subtitle: vs,
1314
- header: js,
1315
- text: ys,
1316
- productsBlock: ks,
1317
- buttonsBlock: $s,
1318
- top: Ns,
1319
- itemsBlock: Is,
1320
- typeTexts: ws,
1321
- block: Cs,
1322
- active: Ss,
1323
- products: Ps,
1324
- product: Ts,
1325
- button: Bs,
1326
- image: qs,
1327
- info: As,
1328
- name: Os,
1329
- buttons: Ds,
1330
- modal: zs,
1331
- other: Es,
1332
- options: Ls
1333
- }, Rs = g.forwardRef((u, o) => {
1334
- const { activeButton: e, setActiveButton: n, popupPosition: i } = u, [a, c] = g.useState(e.typesText), [s, l] = g.useState(e.destination), [d, v] = g.useState(e.link || ""), [r, w] = g.useState(e.text || "");
1335
- return g.useEffect(() => {
1314
+ }, vs = "_title_dkxs6_1", js = "_subtitle_dkxs6_5", ys = "_header_dkxs6_12", ks = "_text_dkxs6_13", $s = "_productsBlock_dkxs6_14", Ns = "_buttonsBlock_dkxs6_15", Is = "_top_dkxs6_26", ws = "_itemsBlock_dkxs6_35", Cs = "_typeTexts_dkxs6_41", Ss = "_block_dkxs6_48", Ts = "_active_dkxs6_60", Bs = "_products_dkxs6_14", Ps = "_product_dkxs6_14", As = "_button_dkxs6_15", Os = "_image_dkxs6_90", qs = "_info_dkxs6_97", Ds = "_name_dkxs6_109", Es = "_buttons_dkxs6_15", Ls = "_modal_dkxs6_120", Rs = "_other_dkxs6_140", Ms = "_options_dkxs6_146", at = {
1315
+ title: vs,
1316
+ subtitle: js,
1317
+ header: ys,
1318
+ text: ks,
1319
+ productsBlock: $s,
1320
+ buttonsBlock: Ns,
1321
+ top: Is,
1322
+ itemsBlock: ws,
1323
+ typeTexts: Cs,
1324
+ block: Ss,
1325
+ active: Ts,
1326
+ products: Bs,
1327
+ product: Ps,
1328
+ button: As,
1329
+ image: Os,
1330
+ info: qs,
1331
+ name: Ds,
1332
+ buttons: Es,
1333
+ modal: Ls,
1334
+ other: Rs,
1335
+ options: Ms
1336
+ }, Hs = _.forwardRef((u, o) => {
1337
+ const { activeButton: e, setActiveButton: n, popupPosition: i } = u, [a, c] = _.useState(e.typesText), [s, l] = _.useState(e.destination), [d, k] = _.useState(e.link || ""), [r, B] = _.useState(e.text || "");
1338
+ return _.useEffect(() => {
1336
1339
  n({
1337
1340
  ...e,
1338
1341
  ...{
@@ -1345,7 +1348,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1345
1348
  }, [a, s, d, r]), /* @__PURE__ */ t.jsxs(
1346
1349
  "div",
1347
1350
  {
1348
- className: ot.modal,
1351
+ className: at.modal,
1349
1352
  onClick: (h) => {
1350
1353
  h.stopPropagation();
1351
1354
  },
@@ -1355,10 +1358,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1355
1358
  },
1356
1359
  ref: o,
1357
1360
  children: [
1358
- /* @__PURE__ */ t.jsxs("div", { className: ot.top, children: [
1359
- /* @__PURE__ */ t.jsx("h3", { className: ot.title, children: e.type }),
1361
+ /* @__PURE__ */ t.jsxs("div", { className: at.top, children: [
1362
+ /* @__PURE__ */ t.jsx("h3", { className: at.title, children: e.type }),
1360
1363
  /* @__PURE__ */ t.jsx(
1361
- x,
1364
+ f,
1362
1365
  {
1363
1366
  name: "X",
1364
1367
  height: 20,
@@ -1368,7 +1371,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1368
1371
  }
1369
1372
  )
1370
1373
  ] }),
1371
- /* @__PURE__ */ t.jsxs("div", { className: ot.options, children: [
1374
+ /* @__PURE__ */ t.jsxs("div", { className: at.options, children: [
1372
1375
  /* @__PURE__ */ t.jsx(
1373
1376
  tt,
1374
1377
  {
@@ -1388,9 +1391,9 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1388
1391
  value: "Homepage"
1389
1392
  }
1390
1393
  ) : /* @__PURE__ */ t.jsx(
1391
- X,
1394
+ W,
1392
1395
  {
1393
- onChange: (h) => v(h),
1396
+ onChange: (h) => k(h),
1394
1397
  value: d,
1395
1398
  placeholder: "https://",
1396
1399
  label: "Link"
@@ -1406,14 +1409,14 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1406
1409
  /* @__PURE__ */ t.jsx(
1407
1410
  wt,
1408
1411
  {
1409
- onChange: (h) => w(h),
1412
+ onChange: (h) => B(h),
1410
1413
  value: r,
1411
1414
  label: "Text",
1412
1415
  maxLength: 150
1413
1416
  }
1414
1417
  ),
1415
1418
  /* @__PURE__ */ t.jsx(
1416
- Pt,
1419
+ Tt,
1417
1420
  {
1418
1421
  typesText: a,
1419
1422
  setTypesText: c
@@ -1423,61 +1426,61 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1423
1426
  ]
1424
1427
  }
1425
1428
  );
1426
- }), Ms = "_subtitle_m8qel_1", Hs = "_header_m8qel_8", Vs = "_text_m8qel_9", Fs = "_productsBlock_m8qel_10", Us = "_buttonsBlock_m8qel_11", Ys = "_top_m8qel_23", Gs = "_itemsBlock_m8qel_32", Ws = "_typeTexts_m8qel_38", Xs = "_block_m8qel_45", Js = "_active_m8qel_58", Qs = "_products_m8qel_10", Ks = "_product_m8qel_10", Zs = "_button_m8qel_11", tn = "_image_m8qel_88", en = "_info_m8qel_95", sn = "_name_m8qel_107", nn = "_buttons_m8qel_11", on = "_modal_m8qel_118", an = "_other_m8qel_137", cn = "_options_m8qel_143", dt = {
1427
- subtitle: Ms,
1428
- header: Hs,
1429
- text: Vs,
1430
- productsBlock: Fs,
1431
- buttonsBlock: Us,
1432
- top: Ys,
1433
- itemsBlock: Gs,
1434
- typeTexts: Ws,
1435
- block: Xs,
1436
- active: Js,
1437
- products: Qs,
1438
- product: Ks,
1439
- button: Zs,
1440
- image: tn,
1441
- info: en,
1442
- name: sn,
1443
- buttons: nn,
1444
- modal: on,
1445
- other: an,
1446
- options: cn
1447
- }, ln = (u) => {
1448
- const { buttons: o, setButtons: e, deletable: n = !0, addable: i = !0 } = u, [a, c] = g.useState(null), [s, l] = g.useState({
1429
+ }), Fs = "_subtitle_m8qel_1", Vs = "_header_m8qel_8", Us = "_text_m8qel_9", zs = "_productsBlock_m8qel_10", Ys = "_buttonsBlock_m8qel_11", Gs = "_top_m8qel_23", Ws = "_itemsBlock_m8qel_32", Xs = "_typeTexts_m8qel_38", Js = "_block_m8qel_45", Qs = "_active_m8qel_58", Ks = "_products_m8qel_10", Zs = "_product_m8qel_10", tn = "_button_m8qel_11", en = "_image_m8qel_88", sn = "_info_m8qel_95", nn = "_name_m8qel_107", on = "_buttons_m8qel_11", an = "_modal_m8qel_118", cn = "_other_m8qel_137", ln = "_options_m8qel_143", dt = {
1430
+ subtitle: Fs,
1431
+ header: Vs,
1432
+ text: Us,
1433
+ productsBlock: zs,
1434
+ buttonsBlock: Ys,
1435
+ top: Gs,
1436
+ itemsBlock: Ws,
1437
+ typeTexts: Xs,
1438
+ block: Js,
1439
+ active: Qs,
1440
+ products: Ks,
1441
+ product: Zs,
1442
+ button: tn,
1443
+ image: en,
1444
+ info: sn,
1445
+ name: nn,
1446
+ buttons: on,
1447
+ modal: an,
1448
+ other: cn,
1449
+ options: ln
1450
+ }, rn = (u) => {
1451
+ const { buttons: o, setButtons: e, deletable: n = !0, addable: i = !0 } = u, [a, c] = _.useState(null), [s, l] = _.useState({
1449
1452
  top: 0,
1450
1453
  left: 0
1451
- }), [d, v] = g.useState(null), r = g.useRef(null);
1452
- g.useEffect(() => {
1454
+ }), [d, k] = _.useState(null), r = _.useRef(null);
1455
+ _.useEffect(() => {
1453
1456
  const h = () => {
1454
1457
  c(null);
1455
1458
  };
1456
1459
  return document.body.addEventListener("click", h), c(null), () => {
1457
1460
  c(null), document.body.removeEventListener("click", h);
1458
1461
  };
1459
- }, []), g.useEffect(() => {
1462
+ }, []), _.useEffect(() => {
1460
1463
  if (a) {
1461
- const h = [...o].map((p) => p.id === a.id ? a : p);
1464
+ const h = [...o].map((g) => g.id === a.id ? a : g);
1462
1465
  e(h);
1463
1466
  }
1464
- }, [a]), g.useEffect(() => {
1467
+ }, [a]), _.useEffect(() => {
1465
1468
  if (r.current && d) {
1466
- const h = r.current.getBoundingClientRect().height, p = window.innerHeight;
1467
- let _ = d.top;
1468
- console.log(_, h, p, window.scrollY), _ + h > p + window.scrollY && (_ = p + window.scrollY - h - 200), _ < 0 && (_ = 10), l({
1469
- top: _,
1469
+ const h = r.current.getBoundingClientRect().height, g = window.innerHeight;
1470
+ let m = d.top;
1471
+ m + h > g + window.scrollY && (m = g + window.scrollY - h - 200), m < 0 && (m = 10), l({
1472
+ top: m,
1470
1473
  left: d.left
1471
1474
  });
1472
1475
  }
1473
1476
  }, [r.current, d]);
1474
- const w = (h, p) => {
1477
+ const B = (h, g) => {
1475
1478
  h.stopPropagation();
1476
- const _ = h.target.getBoundingClientRect();
1477
- v({
1478
- top: _.top + window.scrollY,
1479
- left: _.left - 30
1480
- }), c(p);
1479
+ const m = h.target.getBoundingClientRect();
1480
+ k({
1481
+ top: m.top + window.scrollY,
1482
+ left: m.left - 30
1483
+ }), c(g);
1481
1484
  };
1482
1485
  return /* @__PURE__ */ t.jsxs("div", { className: dt.products, children: [
1483
1486
  /* @__PURE__ */ t.jsx("h5", { className: dt.subtitle, children: "Button Type" }),
@@ -1489,12 +1492,12 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1489
1492
  /* @__PURE__ */ t.jsx(
1490
1493
  tt,
1491
1494
  {
1492
- onChange: (p) => {
1493
- const q = [...o].map((b) => b.id === h.id ? {
1495
+ onChange: (g) => {
1496
+ const O = [...o].map((R) => R.id === h.id ? {
1494
1497
  ...h,
1495
- type: p
1496
- } : b);
1497
- e(q);
1498
+ type: g
1499
+ } : R);
1500
+ e(O);
1498
1501
  },
1499
1502
  value: h.type,
1500
1503
  options: ["Primary", "Secondary", "Tertiary"]
@@ -1502,25 +1505,25 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1502
1505
  ),
1503
1506
  /* @__PURE__ */ t.jsxs("div", { className: dt.buttons, children: [
1504
1507
  /* @__PURE__ */ t.jsx(
1505
- x,
1508
+ f,
1506
1509
  {
1507
1510
  name: "Sliders",
1508
1511
  hoverable: !0,
1509
1512
  width: 20,
1510
1513
  height: 20,
1511
- onClick: (p) => {
1512
- w(p, h);
1514
+ onClick: (g) => {
1515
+ B(g, h);
1513
1516
  }
1514
1517
  }
1515
1518
  ),
1516
1519
  n && /* @__PURE__ */ t.jsx(
1517
- x,
1520
+ f,
1518
1521
  {
1519
1522
  name: "Trash",
1520
1523
  hoverable: !0,
1521
1524
  onClick: () => {
1522
- const p = o.filter((_) => _.id !== h.id);
1523
- e(p);
1525
+ const g = o.filter((m) => m.id !== h.id);
1526
+ e(g);
1524
1527
  },
1525
1528
  width: 20,
1526
1529
  height: 20,
@@ -1533,7 +1536,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1533
1536
  h.id
1534
1537
  )),
1535
1538
  a && /* @__PURE__ */ t.jsx(
1536
- Rs,
1539
+ Hs,
1537
1540
  {
1538
1541
  ref: r,
1539
1542
  activeButton: a,
@@ -1542,8 +1545,9 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1542
1545
  }
1543
1546
  ),
1544
1547
  i && /* @__PURE__ */ t.jsxs(
1545
- at,
1548
+ it,
1546
1549
  {
1550
+ withoutHover: !0,
1547
1551
  className: dt.button,
1548
1552
  size: "s",
1549
1553
  onClick: () => {
@@ -1559,7 +1563,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1559
1563
  children: [
1560
1564
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
1561
1565
  /* @__PURE__ */ t.jsx(
1562
- x,
1566
+ f,
1563
1567
  {
1564
1568
  name: "Plus",
1565
1569
  width: 16,
@@ -1570,11 +1574,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1570
1574
  }
1571
1575
  )
1572
1576
  ] });
1573
- }, Ao = (u) => {
1577
+ }, Lo = (u) => {
1574
1578
  const { isActiveButtons: o, setIsActiveButtons: e, buttons: n, setButtons: i } = u;
1575
- return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: ot.buttonsBlock, children: [
1576
- /* @__PURE__ */ t.jsxs("div", { className: ot.top, children: [
1577
- /* @__PURE__ */ t.jsx("h3", { className: ot.title, children: "Buttons" }),
1579
+ return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: at.buttonsBlock, children: [
1580
+ /* @__PURE__ */ t.jsxs("div", { className: at.top, children: [
1581
+ /* @__PURE__ */ t.jsx("h3", { className: at.title, children: "Buttons" }),
1578
1582
  /* @__PURE__ */ t.jsx(
1579
1583
  K,
1580
1584
  {
@@ -1584,63 +1588,63 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1584
1588
  )
1585
1589
  ] }),
1586
1590
  /* @__PURE__ */ t.jsx(
1587
- ln,
1591
+ rn,
1588
1592
  {
1589
1593
  buttons: n,
1590
1594
  setButtons: i
1591
1595
  }
1592
1596
  )
1593
1597
  ] }) });
1594
- }, rn = "_wrapper_m18qi_1", dn = "_subtitle_m18qi_7", un = "_content_m18qi_14", mn = "_range_m18qi_22", _n = "_track_m18qi_27", hn = "_progress_m18qi_36", pn = "_dots_m18qi_46", gn = "_dot_m18qi_46", xn = "_active_m18qi_65", fn = "_input_m18qi_77", bn = "_countBlock_m18qi_91", vn = "_count_m18qi_91", jn = "_controls_m18qi_107", yn = "_button_m18qi_113", L = {
1595
- wrapper: rn,
1596
- subtitle: dn,
1597
- content: un,
1598
+ }, dn = "_wrapper_m18qi_1", un = "_subtitle_m18qi_7", pn = "_content_m18qi_14", mn = "_range_m18qi_22", hn = "_track_m18qi_27", _n = "_progress_m18qi_36", gn = "_dots_m18qi_46", xn = "_dot_m18qi_46", fn = "_active_m18qi_65", bn = "_input_m18qi_77", vn = "_countBlock_m18qi_91", jn = "_count_m18qi_91", yn = "_controls_m18qi_107", kn = "_button_m18qi_113", F = {
1599
+ wrapper: dn,
1600
+ subtitle: un,
1601
+ content: pn,
1598
1602
  range: mn,
1599
- track: _n,
1600
- progress: hn,
1601
- dots: pn,
1602
- dot: gn,
1603
- active: xn,
1604
- input: fn,
1605
- countBlock: bn,
1606
- count: vn,
1607
- controls: jn,
1608
- button: yn
1603
+ track: hn,
1604
+ progress: _n,
1605
+ dots: gn,
1606
+ dot: xn,
1607
+ active: fn,
1608
+ input: bn,
1609
+ countBlock: vn,
1610
+ count: jn,
1611
+ controls: yn,
1612
+ button: kn
1609
1613
  }, Nt = (u) => {
1610
- const { label: o, min: e = 1, max: n = 4, step: i = 1, count: a, setCount: c } = u, [s, l] = g.useState(!1), d = Array.from({ length: (n - e) / i + 1 }), v = (a - e) / (n - e) * 100, r = () => {
1614
+ const { label: o, min: e = 1, max: n = 4, step: i = 1, count: a, setCount: c } = u, [s, l] = _.useState(!1), d = Array.from({ length: (n - e) / i + 1 }), k = (a - e) / (n - e) * 100, r = () => {
1611
1615
  a < n && c(a + i);
1612
- }, w = () => {
1616
+ }, B = () => {
1613
1617
  a > e && c(a - i);
1614
- }, h = (p) => {
1615
- const _ = e + p * i;
1616
- c(_);
1618
+ }, h = (g) => {
1619
+ const m = e + g * i;
1620
+ c(m);
1617
1621
  };
1618
- return /* @__PURE__ */ t.jsxs("div", { className: L.wrapper, children: [
1619
- o && /* @__PURE__ */ t.jsx("h5", { className: L.subtitle, children: o }),
1620
- /* @__PURE__ */ t.jsxs("div", { className: L.content, children: [
1621
- /* @__PURE__ */ t.jsxs("div", { className: L.range, children: [
1622
- /* @__PURE__ */ t.jsx("div", { className: L.track }),
1622
+ return /* @__PURE__ */ t.jsxs("div", { className: F.wrapper, children: [
1623
+ o && /* @__PURE__ */ t.jsx("h5", { className: F.subtitle, children: o }),
1624
+ /* @__PURE__ */ t.jsxs("div", { className: F.content, children: [
1625
+ /* @__PURE__ */ t.jsxs("div", { className: F.range, children: [
1626
+ /* @__PURE__ */ t.jsx("div", { className: F.track }),
1623
1627
  /* @__PURE__ */ t.jsx(
1624
1628
  "div",
1625
1629
  {
1626
- className: L.progress,
1627
- style: { width: `${v}%` }
1630
+ className: F.progress,
1631
+ style: { width: `${k}%` }
1628
1632
  }
1629
1633
  ),
1630
- /* @__PURE__ */ t.jsx("div", { className: L.dots, children: d.map((p, _) => {
1631
- const q = _ <= (a - e) / i;
1634
+ /* @__PURE__ */ t.jsx("div", { className: F.dots, children: d.map((g, m) => {
1635
+ const O = m <= (a - e) / i;
1632
1636
  return /* @__PURE__ */ t.jsx(
1633
1637
  "button",
1634
1638
  {
1635
- onClick: () => h(_),
1636
- className: Y(L.dot, {
1637
- [L.active]: q,
1638
- [L.inactive]: !q,
1639
- [L.dragging]: s
1639
+ onClick: () => h(m),
1640
+ className: H(F.dot, {
1641
+ [F.active]: O,
1642
+ [F.inactive]: !O,
1643
+ [F.dragging]: s
1640
1644
  }),
1641
- "aria-label": `Set value to ${e + _ * i}`
1645
+ "aria-label": `Set value to ${e + m * i}`
1642
1646
  },
1643
- _
1647
+ m
1644
1648
  );
1645
1649
  }) }),
1646
1650
  /* @__PURE__ */ t.jsx(
@@ -1651,40 +1655,40 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1651
1655
  max: n,
1652
1656
  step: i,
1653
1657
  value: a,
1654
- onChange: (p) => c(Number(p.target.value)),
1658
+ onChange: (g) => c(Number(g.target.value)),
1655
1659
  onMouseDown: () => l(!0),
1656
1660
  onMouseUp: () => l(!1),
1657
1661
  onTouchStart: () => l(!0),
1658
1662
  onTouchEnd: () => l(!1),
1659
- className: L.input
1663
+ className: F.input
1660
1664
  }
1661
1665
  )
1662
1666
  ] }),
1663
- /* @__PURE__ */ t.jsxs("div", { className: L.countBlock, children: [
1667
+ /* @__PURE__ */ t.jsxs("div", { className: F.countBlock, children: [
1664
1668
  /* @__PURE__ */ t.jsx(
1665
- X,
1669
+ W,
1666
1670
  {
1667
1671
  type: "number",
1668
1672
  min: e,
1669
1673
  max: n,
1670
1674
  paddingless: !0,
1671
- onChange: (p) => {
1672
- const _ = Number(p);
1673
- _ > n ? c(n) : _ < e ? c(e) : c(_);
1675
+ onChange: (g) => {
1676
+ const m = Number(g);
1677
+ m > n ? c(n) : m < e ? c(e) : c(m);
1674
1678
  },
1675
1679
  value: String(a)
1676
1680
  }
1677
1681
  ),
1678
- /* @__PURE__ */ t.jsxs("div", { className: L.controls, children: [
1682
+ /* @__PURE__ */ t.jsxs("div", { className: F.controls, children: [
1679
1683
  /* @__PURE__ */ t.jsx(
1680
1684
  "button",
1681
1685
  {
1682
1686
  onClick: r,
1683
1687
  disabled: a >= n,
1684
- className: L.button,
1688
+ className: F.button,
1685
1689
  "aria-label": "Increment count",
1686
1690
  children: /* @__PURE__ */ t.jsx(
1687
- x,
1691
+ f,
1688
1692
  {
1689
1693
  name: "CaretUp",
1690
1694
  width: 15,
@@ -1696,12 +1700,12 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1696
1700
  /* @__PURE__ */ t.jsx(
1697
1701
  "button",
1698
1702
  {
1699
- onClick: w,
1703
+ onClick: B,
1700
1704
  disabled: a <= e,
1701
- className: L.button,
1705
+ className: F.button,
1702
1706
  "aria-label": "Decrement count",
1703
1707
  children: /* @__PURE__ */ t.jsx(
1704
- x,
1708
+ f,
1705
1709
  {
1706
1710
  name: "CaretDown",
1707
1711
  width: 15,
@@ -1714,28 +1718,28 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1714
1718
  ] })
1715
1719
  ] })
1716
1720
  ] });
1717
- }, kn = "_title_1hw31_1", $n = "_subtitle_1hw31_5", Nn = "_header_1hw31_12", In = "_text_1hw31_13", wn = "_productsBlock_1hw31_14", Cn = "_top_1hw31_26", Sn = "_itemsBlock_1hw31_35", Pn = "_typeTexts_1hw31_41", Tn = "_block_1hw31_48", Bn = "_active_1hw31_61", qn = "_products_1hw31_14", An = "_product_1hw31_14", On = "_button_1hw31_80", Dn = "_image_1hw31_91", zn = "_info_1hw31_98", En = "_name_1hw31_110", Ln = "_buttons_1hw31_114", Rn = "_modal_1hw31_121", Mn = "_link_1hw31_141", Hn = "_modalOptions_1hw31_147", U = {
1718
- title: kn,
1719
- subtitle: $n,
1720
- header: Nn,
1721
- text: In,
1722
- productsBlock: wn,
1723
- top: Cn,
1724
- itemsBlock: Sn,
1725
- typeTexts: Pn,
1726
- block: Tn,
1727
- active: Bn,
1728
- products: qn,
1729
- product: An,
1730
- button: On,
1731
- image: Dn,
1732
- info: zn,
1733
- name: En,
1734
- buttons: Ln,
1735
- modal: Rn,
1736
- link: Mn,
1737
- modalOptions: Hn
1738
- }, Vn = (u) => {
1721
+ }, $n = "_title_1hw31_1", Nn = "_subtitle_1hw31_5", In = "_header_1hw31_12", wn = "_text_1hw31_13", Cn = "_productsBlock_1hw31_14", Sn = "_top_1hw31_26", Tn = "_itemsBlock_1hw31_35", Bn = "_typeTexts_1hw31_41", Pn = "_block_1hw31_48", An = "_active_1hw31_61", On = "_products_1hw31_14", qn = "_product_1hw31_14", Dn = "_button_1hw31_80", En = "_image_1hw31_91", Ln = "_info_1hw31_98", Rn = "_name_1hw31_110", Mn = "_buttons_1hw31_114", Hn = "_modal_1hw31_121", Fn = "_link_1hw31_141", Vn = "_modalOptions_1hw31_147", G = {
1722
+ title: $n,
1723
+ subtitle: Nn,
1724
+ header: In,
1725
+ text: wn,
1726
+ productsBlock: Cn,
1727
+ top: Sn,
1728
+ itemsBlock: Tn,
1729
+ typeTexts: Bn,
1730
+ block: Pn,
1731
+ active: An,
1732
+ products: On,
1733
+ product: qn,
1734
+ button: Dn,
1735
+ image: En,
1736
+ info: Ln,
1737
+ name: Rn,
1738
+ buttons: Mn,
1739
+ modal: Hn,
1740
+ link: Fn,
1741
+ modalOptions: Vn
1742
+ }, Un = (u) => {
1739
1743
  const { activeItem: o, setActiveItem: e, popupPosition: n, setIsOpenModal: i, itemsOptions: a } = u, c = a.find((l) => l.id === o.listingId);
1740
1744
  if (!c) return null;
1741
1745
  function s(l, d) {
@@ -1744,7 +1748,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1744
1748
  return /* @__PURE__ */ t.jsxs(
1745
1749
  "div",
1746
1750
  {
1747
- className: U.modal,
1751
+ className: G.modal,
1748
1752
  onClick: (l) => {
1749
1753
  l.stopPropagation();
1750
1754
  },
@@ -1753,10 +1757,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1753
1757
  left: `${n.left}px`
1754
1758
  },
1755
1759
  children: [
1756
- /* @__PURE__ */ t.jsxs("div", { className: U.top, children: [
1760
+ /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
1757
1761
  /* @__PURE__ */ t.jsx("h3", { children: s(c.productData.name, 20) }),
1758
1762
  /* @__PURE__ */ t.jsx(
1759
- x,
1763
+ f,
1760
1764
  {
1761
1765
  name: "X",
1762
1766
  height: 20,
@@ -1768,7 +1772,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1768
1772
  }
1769
1773
  )
1770
1774
  ] }),
1771
- /* @__PURE__ */ t.jsx("div", { className: U.modalOptions, children: /* @__PURE__ */ t.jsx(
1775
+ /* @__PURE__ */ t.jsx("div", { className: G.modalOptions, children: /* @__PURE__ */ t.jsx(
1772
1776
  ht,
1773
1777
  {
1774
1778
  label: "Put up an attractive image",
@@ -1785,7 +1789,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1785
1789
  ]
1786
1790
  }
1787
1791
  );
1788
- }, Fn = (u) => {
1792
+ }, zn = (u) => {
1789
1793
  const { index: o, moveProduct: e, children: n } = u, [, i] = yt({
1790
1794
  accept: "product",
1791
1795
  hover(s) {
@@ -1802,11 +1806,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1802
1806
  "div",
1803
1807
  {
1804
1808
  ref: (s) => c(i(s)),
1805
- className: `${U.product} ${a ? U.dragging : ""}`,
1809
+ className: `${G.product} ${a ? G.dragging : ""}`,
1806
1810
  children: n
1807
1811
  }
1808
1812
  );
1809
- }, Oo = (u) => {
1813
+ }, Ro = (u) => {
1810
1814
  const {
1811
1815
  isActiveItems: o,
1812
1816
  setIsActiveItems: e,
@@ -1817,52 +1821,52 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1817
1821
  subtitle: s,
1818
1822
  editable: l = !0,
1819
1823
  draggable: d = !1,
1820
- withImage: v = !1,
1824
+ withImage: k = !1,
1821
1825
  deletable: r = !0,
1822
- addable: w = !0,
1826
+ addable: B = !0,
1823
1827
  itemsType: h,
1824
- itemsOptions: p
1825
- } = u, [_, q] = g.useState(null), [b, T] = g.useState({
1828
+ itemsOptions: g
1829
+ } = u, [m, O] = _.useState(null), [R, P] = _.useState({
1826
1830
  top: 0,
1827
1831
  left: 0
1828
- }), [O, N] = g.useState(!1), C = (j, y) => {
1829
- const E = [...n], [D] = E.splice(j, 1);
1830
- E.splice(y, 0, D), i(E);
1832
+ }), [q, C] = _.useState(!1), S = (y, j) => {
1833
+ const I = [...n], [D] = I.splice(y, 1);
1834
+ I.splice(j, 0, D), i(I);
1831
1835
  };
1832
- g.useEffect(() => {
1833
- const j = () => {
1834
- q(null), N(!1);
1836
+ _.useEffect(() => {
1837
+ const y = () => {
1838
+ O(null), C(!1);
1835
1839
  };
1836
- return document.body.addEventListener("click", j), q(null), N(!1), () => {
1837
- q(null), N(!1), document.body.removeEventListener("click", j);
1840
+ return document.body.addEventListener("click", y), O(null), C(!1), () => {
1841
+ O(null), C(!1), document.body.removeEventListener("click", y);
1838
1842
  };
1839
- }, []), g.useEffect(() => {
1840
- if (_) {
1841
- const j = [...n].map((y) => y.listingId === _.listingId ? _ : y);
1842
- i(j);
1843
+ }, []), _.useEffect(() => {
1844
+ if (m) {
1845
+ const y = [...n].map((j) => j.listingId === m.listingId ? m : j);
1846
+ i(y);
1843
1847
  }
1844
- }, [_]);
1845
- const B = (j, y) => {
1846
- j.stopPropagation();
1847
- const E = j.target.getBoundingClientRect(), D = 100, z = window.innerHeight;
1848
- let M = E.top + window.scrollY;
1849
- M + D > z && (M = z - D - 20), N(!0), T({
1850
- top: M - 80,
1851
- left: E.left - 30
1852
- }), q(y);
1848
+ }, [m]);
1849
+ const x = (y, j) => {
1850
+ y.stopPropagation();
1851
+ const I = y.target.getBoundingClientRect(), D = 100, E = window.innerHeight;
1852
+ let U = I.top + window.scrollY;
1853
+ U + D > E && (U = E - D - 20), C(!0), P({
1854
+ top: U - 80,
1855
+ left: I.left - 30
1856
+ }), O(j);
1853
1857
  };
1854
- function V(j) {
1855
- if (v)
1856
- return j ? /* @__PURE__ */ t.jsx(
1858
+ function v(y) {
1859
+ if (k)
1860
+ return y ? /* @__PURE__ */ t.jsx(
1857
1861
  "img",
1858
1862
  {
1859
- src: `https://imagedelivery.net/${j}/w=1000`,
1863
+ src: `https://imagedelivery.net/${y}/w=1000`,
1860
1864
  alt: "image",
1861
1865
  width: 16,
1862
1866
  height: 16
1863
1867
  }
1864
1868
  ) : /* @__PURE__ */ t.jsx(
1865
- x,
1869
+ f,
1866
1870
  {
1867
1871
  name: "Image",
1868
1872
  width: 16,
@@ -1871,129 +1875,130 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1871
1875
  }
1872
1876
  );
1873
1877
  }
1874
- const G = (j, y) => {
1875
- const E = p.find((z) => j.listingId === z.id);
1876
- if (!E) return null;
1878
+ const M = (y, j) => {
1879
+ const I = g.find((E) => y.listingId === E.id);
1880
+ if (!I) return null;
1877
1881
  const D = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1878
1882
  d && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
1879
- x,
1883
+ f,
1880
1884
  {
1881
1885
  name: "DotsSixVertical",
1882
1886
  hoverable: !0,
1883
1887
  width: 20,
1884
1888
  height: 20
1885
1889
  }
1886
- ) }, y),
1890
+ ) }, j),
1887
1891
  h === "select" && /* @__PURE__ */ t.jsx(
1888
1892
  tt,
1889
1893
  {
1890
- onChange: (z) => {
1891
- const M = [...n], et = p.find((S) => S.productData.name === z);
1894
+ onChange: (E) => {
1895
+ const U = [...n], et = g.find((A) => A.productData.name === E);
1892
1896
  if (!et) return;
1893
- const it = {
1897
+ const ot = {
1894
1898
  listingId: et.id,
1895
1899
  image: et.productData.images.length > 0 ? et.productData.images[0].cfId : ""
1896
- }, f = M.map((S) => S.listingId === j.listingId ? it : S);
1897
- q(it), i([...f]);
1900
+ }, b = U.map((A) => A.listingId === y.listingId ? ot : A);
1901
+ O(ot), i([...b]);
1898
1902
  },
1899
- value: E.productData.name,
1903
+ value: I.productData.name,
1900
1904
  options: [
1901
- ...p.filter((z) => !n.find((M) => M.listingId === z.id)).map((z) => z.productData.name)
1905
+ ...g.filter((E) => !n.find((U) => U.listingId === E.id)).map((E) => E.productData.name)
1902
1906
  ],
1903
- leftAddon: V(
1904
- j.image || E.productData.images.length > 0 && E.productData.images[0].cfId || ""
1907
+ leftAddon: v(
1908
+ y.image || I.productData.images.length > 0 && I.productData.images[0].cfId || ""
1905
1909
  )
1906
1910
  },
1907
- y
1911
+ j
1908
1912
  ),
1909
- /* @__PURE__ */ t.jsxs("div", { className: U.buttons, children: [
1913
+ /* @__PURE__ */ t.jsxs("div", { className: G.buttons, children: [
1910
1914
  l && /* @__PURE__ */ t.jsx(
1911
- x,
1915
+ f,
1912
1916
  {
1913
1917
  name: "Sliders",
1914
1918
  hoverable: !0,
1915
1919
  width: 20,
1916
1920
  height: 20,
1917
- onClick: (z) => B(z, j)
1921
+ onClick: (E) => x(E, y)
1918
1922
  }
1919
1923
  ),
1920
1924
  r && /* @__PURE__ */ t.jsx(
1921
- x,
1925
+ f,
1922
1926
  {
1923
1927
  name: "Trash",
1924
1928
  hoverable: !0,
1925
1929
  width: 20,
1926
1930
  height: 20,
1927
1931
  fill: "#C12A2A",
1928
- onClick: () => i(n.filter((z) => z !== j))
1932
+ onClick: () => i(n.filter((E) => E !== y))
1929
1933
  }
1930
1934
  )
1931
1935
  ] })
1932
1936
  ] });
1933
1937
  return d ? /* @__PURE__ */ t.jsx(
1934
- Fn,
1938
+ zn,
1935
1939
  {
1936
- product: j,
1937
- index: y,
1938
- moveProduct: C,
1940
+ product: y,
1941
+ index: j,
1942
+ moveProduct: S,
1939
1943
  children: D
1940
1944
  },
1941
- j.listingId
1945
+ y.listingId
1942
1946
  ) : /* @__PURE__ */ t.jsx(
1943
1947
  "div",
1944
1948
  {
1945
- className: U.product,
1949
+ className: G.product,
1946
1950
  children: D
1947
1951
  },
1948
- j.listingId
1952
+ y.listingId
1949
1953
  );
1950
1954
  };
1951
- return /* @__PURE__ */ t.jsxs("div", { className: U.productsBlock, children: [
1952
- (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: U.top, children: [
1953
- c && /* @__PURE__ */ t.jsx("h3", { className: U.title, children: c }),
1955
+ return /* @__PURE__ */ t.jsxs("div", { className: G.productsBlock, children: [
1956
+ (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
1957
+ c && /* @__PURE__ */ t.jsx("h3", { className: G.title, children: c }),
1954
1958
  o !== void 0 && /* @__PURE__ */ t.jsx(
1955
1959
  K,
1956
1960
  {
1957
1961
  current: o,
1958
- onChange: (j) => e == null ? void 0 : e(j)
1962
+ onChange: (y) => e == null ? void 0 : e(y)
1959
1963
  }
1960
1964
  )
1961
1965
  ] }),
1962
- O && _ && /* @__PURE__ */ t.jsx(
1963
- Vn,
1966
+ q && m && /* @__PURE__ */ t.jsx(
1967
+ Un,
1964
1968
  {
1965
- activeItem: _,
1966
- setActiveItem: q,
1967
- setIsOpenModal: N,
1968
- popupPosition: b,
1969
- itemsOptions: p
1969
+ activeItem: m,
1970
+ setActiveItem: O,
1971
+ setIsOpenModal: C,
1972
+ popupPosition: R,
1973
+ itemsOptions: g
1970
1974
  }
1971
1975
  ),
1972
- /* @__PURE__ */ t.jsxs("div", { className: U.products, children: [
1973
- s && /* @__PURE__ */ t.jsx("h5", { className: U.subtitle, children: s }),
1974
- d ? /* @__PURE__ */ t.jsx(vt, { backend: jt, children: n.map((j, y) => G(j, y)) }) : n.map((j, y) => G(j, y)),
1975
- w && /* @__PURE__ */ t.jsxs(
1976
- at,
1976
+ /* @__PURE__ */ t.jsxs("div", { className: G.products, children: [
1977
+ s && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: s }),
1978
+ d ? /* @__PURE__ */ t.jsx(vt, { backend: jt, children: n.map((y, j) => M(y, j)) }) : n.map((y, j) => M(y, j)),
1979
+ B && /* @__PURE__ */ t.jsxs(
1980
+ it,
1977
1981
  {
1978
- className: U.button,
1982
+ withoutHover: !0,
1983
+ className: G.button,
1979
1984
  size: "s",
1980
1985
  onClick: () => {
1981
- const j = [...n];
1982
- for (let y = 0; y < p.length; y++)
1983
- if (!n.find((E) => E.listingId === p[y].id)) {
1984
- j.push({
1985
- listingId: p[y].id,
1986
- image: p[y].productData.images.length > 0 ? p[y].productData.images[0].cfId : ""
1986
+ const y = [...n];
1987
+ for (let j = 0; j < g.length; j++)
1988
+ if (!n.find((I) => I.listingId === g[j].id)) {
1989
+ y.push({
1990
+ listingId: g[j].id,
1991
+ image: g[j].productData.images.length > 0 ? g[j].productData.images[0].cfId : ""
1987
1992
  });
1988
1993
  break;
1989
1994
  }
1990
- i(j);
1995
+ i(y);
1991
1996
  },
1992
- disabled: n.length === p.length,
1997
+ disabled: n.length === g.length,
1993
1998
  children: [
1994
1999
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
1995
2000
  /* @__PURE__ */ t.jsx(
1996
- x,
2001
+ f,
1997
2002
  {
1998
2003
  name: "Plus",
1999
2004
  width: 16,
@@ -2006,133 +2011,161 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
2006
2011
  ] }),
2007
2012
  a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a })
2008
2013
  ] });
2009
- }, Un = "_options_1u21a_1", Yn = "_price_1u21a_12", Gn = "_oldPrice_1u21a_19", Wn = "_newPrice_1u21a_27", Xn = "_meta_1u21a_34", Jn = "_info_1u21a_40", Qn = "_infoRight_1u21a_48", Kn = "_buttons_1u21a_55", Zn = "_variants_1u21a_62", ti = "_variant_1u21a_62", ei = "_stock_1u21a_79", si = "_variantInfo_1u21a_86", ni = "_quantity_1u21a_92", ii = "_count_1u21a_99", oi = "_button_1u21a_55", ai = "_activeVariant_1u21a_124", ci = "_chargeTypes_1u21a_128", li = "_charge_1u21a_128", ri = "_chargeActive_1u21a_149", di = "_title_1u21a_154", P = {
2010
- options: Un,
2011
- price: Yn,
2012
- oldPrice: Gn,
2013
- newPrice: Wn,
2014
- meta: Xn,
2015
- info: Jn,
2016
- infoRight: Qn,
2017
- buttons: Kn,
2018
- variants: Zn,
2019
- variant: ti,
2020
- stock: ei,
2021
- variantInfo: si,
2022
- quantity: ni,
2023
- count: ii,
2024
- button: oi,
2025
- activeVariant: ai,
2026
- chargeTypes: ci,
2027
- charge: li,
2028
- chargeActive: ri,
2029
- title: di
2014
+ }, Yn = "_options_1w11v_1", Gn = "_price_1w11v_12", Wn = "_oldPrice_1w11v_19", Xn = "_newPrice_1w11v_27", Jn = "_animate_1w11v_34", Qn = "_appearAndBounce_1w11v_1", Kn = "_meta_1w11v_52", Zn = "_info_1w11v_58", ti = "_infoRight_1w11v_66", ei = "_buttons_1w11v_73", si = "_variants_1w11v_80", ni = "_variant_1w11v_80", ii = "_stock_1w11v_97", oi = "_variantInfo_1w11v_104", ai = "_quantity_1w11v_110", ci = "_count_1w11v_117", li = "_focused_1w11v_134", ri = "_button_1w11v_73", di = "_activeVariant_1w11v_160", ui = "_chargeTypes_1w11v_164", pi = "_charge_1w11v_164", mi = "_chargeActive_1w11v_185", hi = "_title_1w11v_190", w = {
2015
+ options: Yn,
2016
+ price: Gn,
2017
+ oldPrice: Wn,
2018
+ newPrice: Xn,
2019
+ animate: Jn,
2020
+ appearAndBounce: Qn,
2021
+ meta: Kn,
2022
+ info: Zn,
2023
+ infoRight: ti,
2024
+ buttons: ei,
2025
+ variants: si,
2026
+ variant: ni,
2027
+ stock: ii,
2028
+ variantInfo: oi,
2029
+ quantity: ai,
2030
+ count: ci,
2031
+ focused: li,
2032
+ button: ri,
2033
+ activeVariant: di,
2034
+ chargeTypes: ui,
2035
+ charge: pi,
2036
+ chargeActive: mi,
2037
+ title: hi
2030
2038
  };
2031
- var Bt = /* @__PURE__ */ ((u) => (u.ONE_TIME = "One-Time", u.RECURRING = "Subscribe & Save", u))(Bt || {});
2032
- const Do = (u) => {
2033
- var _, q;
2034
- const { variants: o } = u, [e, n] = g.useState(o[0]), [i, a] = g.useState(e.chargeTypes[0]), c = gt(), [s, l] = g.useState(1), { reset: d, addProductToCart: v, getProducts: r } = $t();
2035
- async function w() {
2036
- await r(), await v({
2039
+ var Pt = /* @__PURE__ */ ((u) => (u.ONE_TIME = "One-Time", u.RECURRING = "Subscribe & Save", u))(Pt || {});
2040
+ const Mo = (u) => {
2041
+ var C, S;
2042
+ const { variants: o } = u, [e, n] = _.useState(o[0]), [i, a] = _.useState(e.chargeTypes[0]), c = gt(), [s, l] = _.useState(1), [d, k] = _.useState(!1), { reset: r, addProductToCart: B, getProducts: h } = $t(), [g, m] = _.useState(!1);
2043
+ _.useEffect(() => {
2044
+ m(!0);
2045
+ const x = setTimeout(() => m(!1), 600);
2046
+ return () => clearTimeout(x);
2047
+ }, [s]);
2048
+ async function O() {
2049
+ await h(), await B({
2037
2050
  productId: u.id,
2038
2051
  productVariantId: e.id,
2039
2052
  quantity: s
2040
2053
  });
2041
2054
  }
2042
- function h() {
2043
- d(), w(), c("/checkout");
2055
+ function R() {
2056
+ r(), O(), c("/checkout");
2044
2057
  }
2045
- function p(b) {
2046
- if (b >= 864e5) {
2047
- const B = Math.floor(b / 864e5);
2048
- return `${B} ${B === 1 ? "day" : "days"}`;
2049
- } else if (b >= 36e5) {
2050
- const B = Math.floor(b / 36e5);
2051
- return `${B} ${B === 1 ? "hour" : "hours"}`;
2052
- } else if (b >= 6e4) {
2053
- const B = Math.floor(b / 6e4);
2054
- return `${B} ${B === 1 ? "minute" : "minutes"}`;
2058
+ function P(x) {
2059
+ if (x >= 864e5) {
2060
+ const I = Math.floor(x / 864e5);
2061
+ return `${I} ${I === 1 ? "day" : "days"}`;
2062
+ } else if (x >= 36e5) {
2063
+ const I = Math.floor(x / 36e5);
2064
+ return `${I} ${I === 1 ? "hour" : "hours"}`;
2065
+ } else if (x >= 6e4) {
2066
+ const I = Math.floor(x / 6e4);
2067
+ return `${I} ${I === 1 ? "minute" : "minutes"}`;
2055
2068
  } else {
2056
- const B = Math.floor(b / 1e3);
2057
- return `${B} ${B === 1 ? "second" : "seconds"}`;
2069
+ const I = Math.floor(x / 1e3);
2070
+ return `${I} ${I === 1 ? "second" : "seconds"}`;
2058
2071
  }
2059
2072
  }
2060
- return /* @__PURE__ */ t.jsxs("div", { className: P.options, children: [
2061
- e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: P.chargeTypes, children: e.chargeTypes.map((b) => /* @__PURE__ */ t.jsx(
2062
- "div",
2063
- {
2064
- className: Y(P.charge, {
2065
- [P.chargeActive]: i === b
2066
- }),
2067
- onClick: () => a(b),
2068
- children: Bt[b]
2069
- },
2070
- b
2071
- )) }),
2072
- /* @__PURE__ */ t.jsx("div", { className: P.variants, children: o.map((b) => /* @__PURE__ */ t.jsxs(
2073
+ function q(x, v) {
2074
+ return x.length > v ? x.slice(0, v) + "..." : x;
2075
+ }
2076
+ return /* @__PURE__ */ t.jsxs("div", { className: w.options, children: [
2077
+ e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: w.chargeTypes, children: e.chargeTypes.map((x) => /* @__PURE__ */ t.jsx(
2073
2078
  "div",
2074
2079
  {
2075
- className: Y(P.variant, {
2076
- [P.activeVariant]: e.id === b.id
2080
+ className: H(w.charge, {
2081
+ [w.chargeActive]: i === x
2077
2082
  }),
2078
- onClick: () => n(b),
2079
- children: [
2080
- /* @__PURE__ */ t.jsxs("div", { className: P.variantInfo, children: [
2081
- /* @__PURE__ */ t.jsx("span", { className: P.title, children: b.name }),
2082
- /* @__PURE__ */ t.jsxs("span", { children: [
2083
- "$",
2084
- i === "ONE_TIME" ? b.price.amount : b.subscriptionSettings ? b.subscriptionSettings.price.amount : "Price Not Found"
2085
- ] })
2086
- ] }),
2087
- /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: P.stock, children: [
2088
- b.quantity.restrictions ? b.quantity.restrictions.max || 0 : "Stock Not Found",
2089
- " ",
2090
- "in stock"
2091
- ] }) })
2092
- ]
2083
+ onClick: () => a(x),
2084
+ children: Pt[x]
2093
2085
  },
2094
- b.id
2086
+ x
2095
2087
  )) }),
2096
- i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: P.quantity, children: [
2088
+ /* @__PURE__ */ t.jsx("div", { className: w.variants, children: o.map((x) => {
2089
+ var v;
2090
+ return /* @__PURE__ */ t.jsxs(
2091
+ "div",
2092
+ {
2093
+ className: H(w.variant, {
2094
+ [w.activeVariant]: e.id === x.id
2095
+ }),
2096
+ onClick: () => n(x),
2097
+ children: [
2098
+ /* @__PURE__ */ t.jsxs("div", { className: w.variantInfo, children: [
2099
+ /* @__PURE__ */ t.jsx("span", { className: w.title, children: q(x.name, 15) }),
2100
+ /* @__PURE__ */ t.jsxs("span", { children: [
2101
+ "$",
2102
+ i === "ONE_TIME" ? x.price.amount : x.subscriptionSettings ? x.subscriptionSettings.price.amount : "Price Not Found"
2103
+ ] })
2104
+ ] }),
2105
+ /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: w.stock, children: [
2106
+ ((v = x.quantity.restrictions) == null ? void 0 : v.max) || x.quantity.available || 0,
2107
+ " in stock"
2108
+ ] }) })
2109
+ ]
2110
+ },
2111
+ x.id
2112
+ );
2113
+ }) }),
2114
+ i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: w.quantity, children: [
2097
2115
  /* @__PURE__ */ t.jsx(
2098
2116
  "button",
2099
2117
  {
2100
2118
  onClick: () => {
2101
- s > 1 ? l((b) => b - 1) : l(1);
2119
+ s > 1 ? l((x) => x - 1) : l(1);
2102
2120
  },
2103
- className: P.button,
2121
+ className: w.button,
2104
2122
  disabled: e.quantity.restrictions && s <= e.quantity.restrictions.min,
2105
- children: /* @__PURE__ */ t.jsx(x, { name: "Minus" })
2123
+ children: /* @__PURE__ */ t.jsx(f, { name: "Minus" })
2106
2124
  }
2107
2125
  ),
2108
2126
  /* @__PURE__ */ t.jsx(
2109
- "input",
2127
+ "label",
2110
2128
  {
2111
- className: P.count,
2112
- value: s,
2113
- onChange: (b) => l(Number(b.target.value)),
2114
- max: ((_ = e.quantity.restrictions) == null ? void 0 : _.max) || 1 / 0,
2115
- min: ((q = e.quantity.restrictions) == null ? void 0 : q.min) || 0
2129
+ className: H(w.count, {
2130
+ [w.focused]: d
2131
+ }),
2132
+ onFocus: () => k(!0),
2133
+ onBlur: () => k(!1),
2134
+ children: /* @__PURE__ */ t.jsx(
2135
+ W,
2136
+ {
2137
+ type: "number",
2138
+ value: String(s),
2139
+ onChange: (x) => l(Number(x)),
2140
+ max: ((C = e.quantity.restrictions) == null ? void 0 : C.max) || e.quantity.available || 1 / 0,
2141
+ min: ((S = e.quantity.restrictions) == null ? void 0 : S.min) || 0,
2142
+ style: {
2143
+ backgroundColor: "transparent",
2144
+ border: "none",
2145
+ textAlign: "center"
2146
+ }
2147
+ }
2148
+ )
2116
2149
  }
2117
2150
  ),
2118
2151
  /* @__PURE__ */ t.jsx(
2119
2152
  "button",
2120
2153
  {
2121
2154
  onClick: () => {
2122
- l((b) => b + 1);
2155
+ l((x) => x + 1);
2123
2156
  },
2124
- className: P.button,
2125
- disabled: e.quantity.restrictions && s >= e.quantity.restrictions.max,
2126
- children: /* @__PURE__ */ t.jsx(x, { name: "Plus" })
2157
+ className: w.button,
2158
+ disabled: !!(e.quantity.restrictions && s >= e.quantity.restrictions.max || e.quantity.available && s >= e.quantity.available),
2159
+ children: /* @__PURE__ */ t.jsx(f, { name: "Plus" })
2127
2160
  }
2128
2161
  )
2129
2162
  ] }),
2130
- /* @__PURE__ */ t.jsxs("div", { className: P.meta, children: [
2131
- /* @__PURE__ */ t.jsxs("div", { className: P.info, children: [
2163
+ /* @__PURE__ */ t.jsxs("div", { className: w.meta, children: [
2164
+ /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
2132
2165
  /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
2133
- /* @__PURE__ */ t.jsxs("div", { className: P.infoRight, children: [
2166
+ /* @__PURE__ */ t.jsxs("div", { className: w.infoRight, children: [
2134
2167
  /* @__PURE__ */ t.jsx(
2135
- x,
2168
+ f,
2136
2169
  {
2137
2170
  name: "Lightning",
2138
2171
  fill: "#FF3F19",
@@ -2140,100 +2173,100 @@ const Do = (u) => {
2140
2173
  height: 20
2141
2174
  }
2142
2175
  ),
2143
- /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : p(e.deliveryTime) })
2176
+ /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : P(e.deliveryTime) })
2144
2177
  ] })
2145
2178
  ] }),
2146
- /* @__PURE__ */ t.jsxs("div", { className: P.info, children: [
2179
+ /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
2147
2180
  /* @__PURE__ */ t.jsx("span", { children: "Price" }),
2148
- /* @__PURE__ */ t.jsx("div", { className: P.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: P.price, children: [
2149
- /* @__PURE__ */ t.jsxs("span", { className: P.newPrice, children: [
2181
+ /* @__PURE__ */ t.jsx("div", { className: w.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
2182
+ /* @__PURE__ */ t.jsxs("span", { className: H(w.newPrice, { [w.animate]: g }), children: [
2150
2183
  "$ ",
2151
2184
  (e.price.amount || 0) * s
2152
2185
  ] }),
2153
- /* @__PURE__ */ t.jsxs("span", { className: P.oldPrice, children: [
2186
+ /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
2154
2187
  "$ ",
2155
2188
  (e.compareAtPrice.amount || 0) * s
2156
2189
  ] })
2157
- ] }) : /* @__PURE__ */ t.jsxs("span", { className: P.newPrice, children: [
2190
+ ] }) : /* @__PURE__ */ t.jsxs("span", { className: H(w.newPrice, { [w.animate]: g }), children: [
2158
2191
  "$ ",
2159
2192
  (e.price.amount || 0) * s
2160
- ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: P.price, children: [
2161
- /* @__PURE__ */ t.jsxs("span", { className: P.newPrice, children: [
2193
+ ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
2194
+ /* @__PURE__ */ t.jsxs("span", { className: H(w.newPrice, { [w.animate]: g }), children: [
2162
2195
  "$ ",
2163
2196
  e.subscriptionSettings.price.amount || 0
2164
2197
  ] }),
2165
- /* @__PURE__ */ t.jsxs("span", { className: P.oldPrice, children: [
2198
+ /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
2166
2199
  "$ ",
2167
2200
  e.subscriptionSettings.compareAtPrice.amount || 0
2168
2201
  ] })
2169
- ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: P.newPrice, children: [
2202
+ ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: H(w.newPrice, { [w.animate]: g }), children: [
2170
2203
  "$ ",
2171
2204
  e.subscriptionSettings.price.amount || 0
2172
2205
  ] }) })
2173
2206
  ] })
2174
2207
  ] }),
2175
- /* @__PURE__ */ t.jsxs("div", { className: P.buttons, children: [
2208
+ /* @__PURE__ */ t.jsxs("div", { className: w.buttons, children: [
2176
2209
  /* @__PURE__ */ t.jsx(
2177
- at,
2210
+ it,
2178
2211
  {
2179
2212
  type: "Primary",
2180
- onClick: () => h(),
2213
+ onClick: () => R(),
2181
2214
  children: /* @__PURE__ */ t.jsx("span", { children: i === "ONE_TIME" ? "Buy Now" : "Subscribe Now" })
2182
2215
  }
2183
2216
  ),
2184
2217
  i === "ONE_TIME" && /* @__PURE__ */ t.jsx(
2185
- at,
2218
+ it,
2186
2219
  {
2187
2220
  type: "Secondary",
2188
- onClick: () => w(),
2221
+ onClick: () => O(),
2189
2222
  children: "Add to Cart"
2190
2223
  }
2191
2224
  )
2192
2225
  ] })
2193
2226
  ] });
2194
- }, ui = "_button_1x9be_1", mi = "_login_1x9be_14", _i = "_signUp_1x9be_18", hi = "_buttons_1x9be_23", pi = "_modal_1x9be_32", gi = "_info_1x9be_48", xi = "_top_1x9be_55", fi = "_title_1x9be_66", bi = "_clear_1x9be_72", vi = "_activeClear_1x9be_79", ji = "_count_1x9be_83", yi = "_cart_1x9be_98", ki = "_empty_1x9be_106", $i = "_product_1x9be_132", Ni = "_products_1x9be_141", Ii = "_image_1x9be_149", wi = "_productInfo_1x9be_155", Ci = "_content_1x9be_162", Si = "_name_1x9be_168", Pi = "_price_1x9be_174", Ti = "_productButtons_1x9be_180", Bi = "_productButton_1x9be_180", qi = "_productCount_1x9be_200", Ai = "_bottom_1x9be_216", Oi = "_subtotal_1x9be_224", Di = "_block_1x9be_232", zi = "_shoppingCount_1x9be_239", Ei = "_total_1x9be_259", Li = "_link_1x9be_265", Ri = "_userInfo_1x9be_272", $ = {
2195
- button: ui,
2196
- login: mi,
2197
- signUp: _i,
2198
- buttons: hi,
2199
- modal: pi,
2200
- info: gi,
2201
- top: xi,
2202
- title: fi,
2203
- clear: bi,
2204
- activeClear: vi,
2205
- count: ji,
2206
- cart: yi,
2207
- empty: ki,
2208
- product: $i,
2209
- products: Ni,
2210
- image: Ii,
2211
- productInfo: wi,
2212
- content: Ci,
2213
- name: Si,
2214
- price: Pi,
2215
- productButtons: Ti,
2216
- productButton: Bi,
2217
- productCount: qi,
2218
- bottom: Ai,
2219
- subtotal: Oi,
2220
- block: Di,
2221
- shoppingCount: zi,
2222
- total: Ei,
2223
- link: Li,
2224
- userInfo: Ri
2225
- }, Mi = "_button_15mga_1", Hi = "_primary_15mga_19", Vi = "_secondary_15mga_24", Fi = "_tertiary_15mga_29", Ui = "_content_15mga_34", ut = {
2226
- button: Mi,
2227
- primary: Hi,
2228
- secondary: Vi,
2229
- tertiary: Fi,
2230
- content: Ui
2231
- }, Yi = (u) => {
2227
+ }, _i = "_button_1x9be_1", gi = "_login_1x9be_14", xi = "_signUp_1x9be_18", fi = "_buttons_1x9be_23", bi = "_modal_1x9be_32", vi = "_info_1x9be_48", ji = "_top_1x9be_55", yi = "_title_1x9be_66", ki = "_clear_1x9be_72", $i = "_activeClear_1x9be_79", Ni = "_count_1x9be_83", Ii = "_cart_1x9be_98", wi = "_empty_1x9be_106", Ci = "_product_1x9be_132", Si = "_products_1x9be_141", Ti = "_image_1x9be_149", Bi = "_productInfo_1x9be_155", Pi = "_content_1x9be_162", Ai = "_name_1x9be_168", Oi = "_price_1x9be_174", qi = "_productButtons_1x9be_180", Di = "_productButton_1x9be_180", Ei = "_productCount_1x9be_200", Li = "_bottom_1x9be_216", Ri = "_subtotal_1x9be_224", Mi = "_block_1x9be_232", Hi = "_shoppingCount_1x9be_239", Fi = "_total_1x9be_259", Vi = "_link_1x9be_265", Ui = "_userInfo_1x9be_272", N = {
2228
+ button: _i,
2229
+ login: gi,
2230
+ signUp: xi,
2231
+ buttons: fi,
2232
+ modal: bi,
2233
+ info: vi,
2234
+ top: ji,
2235
+ title: yi,
2236
+ clear: ki,
2237
+ activeClear: $i,
2238
+ count: Ni,
2239
+ cart: Ii,
2240
+ empty: wi,
2241
+ product: Ci,
2242
+ products: Si,
2243
+ image: Ti,
2244
+ productInfo: Bi,
2245
+ content: Pi,
2246
+ name: Ai,
2247
+ price: Oi,
2248
+ productButtons: qi,
2249
+ productButton: Di,
2250
+ productCount: Ei,
2251
+ bottom: Li,
2252
+ subtotal: Ri,
2253
+ block: Mi,
2254
+ shoppingCount: Hi,
2255
+ total: Fi,
2256
+ link: Vi,
2257
+ userInfo: Ui
2258
+ }, zi = "_button_15mga_1", Yi = "_primary_15mga_19", Gi = "_secondary_15mga_24", Wi = "_tertiary_15mga_29", Xi = "_content_15mga_34", ut = {
2259
+ button: zi,
2260
+ primary: Yi,
2261
+ secondary: Gi,
2262
+ tertiary: Wi,
2263
+ content: Xi
2264
+ }, Ji = (u) => {
2232
2265
  const { children: o, onClick: e, style: n, className: i, disabled: a = !1, type: c = "Primary" } = u;
2233
2266
  return /* @__PURE__ */ t.jsx(
2234
2267
  "button",
2235
2268
  {
2236
- className: Y(ut.button, i, {
2269
+ className: H(ut.button, i, {
2237
2270
  [ut.primary]: c === "Primary",
2238
2271
  [ut.secondary]: c === "Secondary",
2239
2272
  [ut.tertiary]: c === "Tertiary"
@@ -2245,7 +2278,7 @@ const Do = (u) => {
2245
2278
  disabled: a,
2246
2279
  children: c === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: ut.content, children: [
2247
2280
  /* @__PURE__ */ t.jsx(
2248
- x,
2281
+ f,
2249
2282
  {
2250
2283
  name: "ArrowRight",
2251
2284
  fill: "#757575",
@@ -2258,16 +2291,16 @@ const Do = (u) => {
2258
2291
  }
2259
2292
  );
2260
2293
  };
2261
- class _t extends Error {
2294
+ class mt extends Error {
2262
2295
  }
2263
- _t.prototype.name = "InvalidTokenError";
2264
- function Gi(u) {
2296
+ mt.prototype.name = "InvalidTokenError";
2297
+ function Qi(u) {
2265
2298
  return decodeURIComponent(atob(u).replace(/(.)/g, (o, e) => {
2266
2299
  let n = e.charCodeAt(0).toString(16).toUpperCase();
2267
2300
  return n.length < 2 && (n = "0" + n), "%" + n;
2268
2301
  }));
2269
2302
  }
2270
- function Wi(u) {
2303
+ function Ki(u) {
2271
2304
  let o = u.replace(/-/g, "+").replace(/_/g, "/");
2272
2305
  switch (o.length % 4) {
2273
2306
  case 0:
@@ -2282,42 +2315,42 @@ function Wi(u) {
2282
2315
  throw new Error("base64 string is not of the correct length");
2283
2316
  }
2284
2317
  try {
2285
- return Gi(o);
2318
+ return Qi(o);
2286
2319
  } catch {
2287
2320
  return atob(o);
2288
2321
  }
2289
2322
  }
2290
- function Xi(u, o) {
2323
+ function Zi(u, o) {
2291
2324
  if (typeof u != "string")
2292
- throw new _t("Invalid token specified: must be a string");
2325
+ throw new mt("Invalid token specified: must be a string");
2293
2326
  o || (o = {});
2294
2327
  const e = o.header === !0 ? 0 : 1, n = u.split(".")[e];
2295
2328
  if (typeof n != "string")
2296
- throw new _t(`Invalid token specified: missing part #${e + 1}`);
2329
+ throw new mt(`Invalid token specified: missing part #${e + 1}`);
2297
2330
  let i;
2298
2331
  try {
2299
- i = Wi(n);
2332
+ i = Ki(n);
2300
2333
  } catch (a) {
2301
- throw new _t(`Invalid token specified: invalid base64 for part #${e + 1} (${a.message})`);
2334
+ throw new mt(`Invalid token specified: invalid base64 for part #${e + 1} (${a.message})`);
2302
2335
  }
2303
2336
  try {
2304
2337
  return JSON.parse(i);
2305
2338
  } catch (a) {
2306
- throw new _t(`Invalid token specified: invalid json for part #${e + 1} (${a.message})`);
2339
+ throw new mt(`Invalid token specified: invalid json for part #${e + 1} (${a.message})`);
2307
2340
  }
2308
2341
  }
2309
- const zo = (u) => {
2342
+ const Ho = (u) => {
2310
2343
  const { shopping: o, signUp: e } = u, n = gt();
2311
2344
  function i(c) {
2312
2345
  n(c);
2313
2346
  }
2314
2347
  const a = JSON.parse(localStorage.getItem("token") || "{}");
2315
- return /* @__PURE__ */ t.jsxs("div", { className: $.buttons, children: [
2316
- o && /* @__PURE__ */ t.jsx(Ji, {}),
2348
+ return /* @__PURE__ */ t.jsxs("div", { className: N.buttons, children: [
2349
+ o && /* @__PURE__ */ t.jsx(to, {}),
2317
2350
  !a.data && /* @__PURE__ */ t.jsx(
2318
2351
  "div",
2319
2352
  {
2320
- className: Y($.button, $.login),
2353
+ className: H(N.button, N.login),
2321
2354
  onClick: () => i("/customer-dash"),
2322
2355
  children: "Login"
2323
2356
  }
@@ -2325,71 +2358,71 @@ const zo = (u) => {
2325
2358
  !a.data && e && /* @__PURE__ */ t.jsx(
2326
2359
  "div",
2327
2360
  {
2328
- className: Y($.button, $.login, $.signUp),
2361
+ className: H(N.button, N.login, N.signUp),
2329
2362
  onClick: () => i("/customer-dash"),
2330
2363
  children: "Sign Up"
2331
2364
  }
2332
2365
  ),
2333
- a.data && /* @__PURE__ */ t.jsx(Zi, { token: a.data })
2366
+ a.data && /* @__PURE__ */ t.jsx(no, { token: a.data })
2334
2367
  ] });
2335
- }, Ji = () => {
2336
- const [u, o] = g.useState(!1), [e, n] = g.useState([]), { cart: i, getProducts: a } = $t();
2337
- function c(v) {
2368
+ }, to = () => {
2369
+ const [u, o] = _.useState(!1), [e, n] = _.useState([]), { cart: i, getProducts: a } = $t();
2370
+ function c(k) {
2338
2371
  for (let r = 0; r < i.parts.length; r++)
2339
- for (let w = 0; w < v.variants.length; w++)
2340
- if (i.parts[r].productVariantId === v.variants[r].id)
2372
+ for (let B = 0; B < k.variants.length; B++)
2373
+ if (i.parts[r].productVariantId === k.variants[r].id)
2341
2374
  return i.parts[r].productVariantId;
2342
2375
  }
2343
- function s(v) {
2376
+ function s(k) {
2344
2377
  for (let r = 0; r < i.parts.length; r++)
2345
- for (let w = 0; w < v.variants.length; w++)
2346
- if (i.parts[r].productVariantId === v.variants[r].id)
2378
+ for (let B = 0; B < k.variants.length; B++)
2379
+ if (i.parts[r].productVariantId === k.variants[r].id)
2347
2380
  return i.parts[r].quantity;
2348
2381
  }
2349
- g.useEffect(() => {
2382
+ _.useEffect(() => {
2350
2383
  (async () => {
2351
- const r = i.parts.map((p) => String(p.productId)), h = (await a([...r])).map((p) => ({
2352
- ...p,
2353
- activeVariantId: c(p),
2354
- quantity: s(p)
2384
+ const r = i.parts.map((g) => String(g.productId)), h = (await a([...r])).map((g) => ({
2385
+ ...g,
2386
+ activeVariantId: c(g),
2387
+ quantity: s(g)
2355
2388
  }));
2356
2389
  n(h);
2357
2390
  })();
2358
2391
  }, [i]);
2359
- function l(v) {
2392
+ function l(k) {
2360
2393
  var r;
2361
- return !v || !(v != null && v.variants) ? !1 : (r = v.variants.find((w) => w.id === v.activeVariantId)) == null ? void 0 : r.subscriptionSettings;
2394
+ return !k || !(k != null && k.variants) ? !1 : (r = k.variants.find((B) => B.id === k.activeVariantId)) == null ? void 0 : r.subscriptionSettings;
2362
2395
  }
2363
2396
  const d = i.parts.length > 0 && e.length > 0 && !l(e[0]);
2364
2397
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2365
2398
  /* @__PURE__ */ t.jsxs(
2366
2399
  "div",
2367
2400
  {
2368
- className: $.button,
2369
- onClick: (v) => {
2370
- v.stopPropagation(), o(!0);
2401
+ className: N.button,
2402
+ onClick: (k) => {
2403
+ k.stopPropagation(), o(!0);
2371
2404
  },
2372
2405
  children: [
2373
2406
  /* @__PURE__ */ t.jsx(
2374
- x,
2407
+ f,
2375
2408
  {
2376
2409
  name: "Handbag",
2377
2410
  fill: "var(--icon-primary)"
2378
2411
  }
2379
2412
  ),
2380
- d && /* @__PURE__ */ t.jsx("div", { className: $.shoppingCount, children: i.parts.length })
2413
+ d && /* @__PURE__ */ t.jsx("div", { className: N.shoppingCount, children: i.parts.length })
2381
2414
  ]
2382
2415
  }
2383
2416
  ),
2384
2417
  u && /* @__PURE__ */ t.jsx(Ct, { close: o, children: /* @__PURE__ */ t.jsx(
2385
- Qi,
2418
+ eo,
2386
2419
  {
2387
2420
  activeProducts: e,
2388
2421
  isCartNotEmpty: d
2389
2422
  }
2390
2423
  ) })
2391
2424
  ] });
2392
- }, Qi = (u) => {
2425
+ }, eo = (u) => {
2393
2426
  const { activeProducts: o, isCartNotEmpty: e } = u, { cart: n, reset: i, getTotalAndDiscount: a, updateQuantityOfProduct: c } = $t(), s = gt();
2394
2427
  function l(r) {
2395
2428
  s(r);
@@ -2401,7 +2434,7 @@ const zo = (u) => {
2401
2434
  quantity: r.quantity + 1
2402
2435
  });
2403
2436
  }
2404
- function v(r) {
2437
+ function k(r) {
2405
2438
  c({
2406
2439
  productId: r.id,
2407
2440
  productVariantId: r.activeVariantId,
@@ -2411,19 +2444,19 @@ const zo = (u) => {
2411
2444
  return /* @__PURE__ */ t.jsxs(
2412
2445
  "div",
2413
2446
  {
2414
- className: $.modal,
2447
+ className: N.modal,
2415
2448
  onClick: (r) => r.stopPropagation(),
2416
2449
  children: [
2417
- /* @__PURE__ */ t.jsxs("div", { className: $.top, children: [
2418
- /* @__PURE__ */ t.jsxs("div", { className: $.info, children: [
2419
- /* @__PURE__ */ t.jsx("span", { className: $.title, children: "Cart" }),
2420
- e && /* @__PURE__ */ t.jsx("div", { className: $.count, children: n.parts.length })
2450
+ /* @__PURE__ */ t.jsxs("div", { className: N.top, children: [
2451
+ /* @__PURE__ */ t.jsxs("div", { className: N.info, children: [
2452
+ /* @__PURE__ */ t.jsx("span", { className: N.title, children: "Cart" }),
2453
+ e && /* @__PURE__ */ t.jsx("div", { className: N.count, children: n.parts.length })
2421
2454
  ] }),
2422
2455
  /* @__PURE__ */ t.jsx(
2423
2456
  "button",
2424
2457
  {
2425
- className: Y($.clear, {
2426
- [$.activeClear]: e
2458
+ className: H(N.clear, {
2459
+ [N.activeClear]: e
2427
2460
  }),
2428
2461
  disabled: !e,
2429
2462
  onClick: () => i(),
@@ -2431,13 +2464,13 @@ const zo = (u) => {
2431
2464
  }
2432
2465
  )
2433
2466
  ] }),
2434
- e ? /* @__PURE__ */ t.jsxs("div", { className: $.cart, children: [
2435
- /* @__PURE__ */ t.jsx("div", { className: $.products, children: o.map((r) => /* @__PURE__ */ t.jsxs(
2467
+ e ? /* @__PURE__ */ t.jsxs("div", { className: N.cart, children: [
2468
+ /* @__PURE__ */ t.jsx("div", { className: N.products, children: o.map((r) => /* @__PURE__ */ t.jsxs(
2436
2469
  "div",
2437
2470
  {
2438
- className: $.product,
2471
+ className: N.product,
2439
2472
  children: [
2440
- /* @__PURE__ */ t.jsxs("div", { className: $.productInfo, children: [
2473
+ /* @__PURE__ */ t.jsxs("div", { className: N.productInfo, children: [
2441
2474
  /* @__PURE__ */ t.jsx(
2442
2475
  "img",
2443
2476
  {
@@ -2445,27 +2478,27 @@ const zo = (u) => {
2445
2478
  alt: "image",
2446
2479
  width: "100%",
2447
2480
  height: "100%",
2448
- className: $.image
2481
+ className: N.image
2449
2482
  }
2450
2483
  ),
2451
- /* @__PURE__ */ t.jsxs("div", { className: $.content, children: [
2452
- /* @__PURE__ */ t.jsx("div", { className: $.name, children: r.name }),
2453
- /* @__PURE__ */ t.jsxs("div", { className: $.price, children: [
2484
+ /* @__PURE__ */ t.jsxs("div", { className: N.content, children: [
2485
+ /* @__PURE__ */ t.jsx("div", { className: N.name, children: r.name }),
2486
+ /* @__PURE__ */ t.jsxs("div", { className: N.price, children: [
2454
2487
  "$",
2455
- r.variants.find((w) => w.id === r.activeVariantId).price.amount * ((r == null ? void 0 : r.quantity) || 1)
2488
+ r.variants.find((B) => B.id === r.activeVariantId).price.amount * ((r == null ? void 0 : r.quantity) || 1)
2456
2489
  ] })
2457
2490
  ] })
2458
2491
  ] }),
2459
- /* @__PURE__ */ t.jsxs("div", { className: $.productButtons, children: [
2492
+ /* @__PURE__ */ t.jsxs("div", { className: N.productButtons, children: [
2460
2493
  /* @__PURE__ */ t.jsx(
2461
2494
  "div",
2462
2495
  {
2463
2496
  onClick: () => {
2464
- r.quantity !== 1 && v(r);
2497
+ r.quantity !== 1 && k(r);
2465
2498
  },
2466
- className: $.productButton,
2499
+ className: N.productButton,
2467
2500
  children: /* @__PURE__ */ t.jsx(
2468
- x,
2501
+ f,
2469
2502
  {
2470
2503
  name: "Minus",
2471
2504
  fill: "#757575",
@@ -2475,14 +2508,14 @@ const zo = (u) => {
2475
2508
  )
2476
2509
  }
2477
2510
  ),
2478
- /* @__PURE__ */ t.jsx("div", { className: $.productCount, children: r.quantity }),
2511
+ /* @__PURE__ */ t.jsx("div", { className: N.productCount, children: r.quantity }),
2479
2512
  /* @__PURE__ */ t.jsx(
2480
2513
  "div",
2481
2514
  {
2482
2515
  onClick: () => d(r),
2483
- className: $.productButton,
2516
+ className: N.productButton,
2484
2517
  children: /* @__PURE__ */ t.jsx(
2485
- x,
2518
+ f,
2486
2519
  {
2487
2520
  name: "Plus",
2488
2521
  fill: "#757575",
@@ -2497,12 +2530,12 @@ const zo = (u) => {
2497
2530
  },
2498
2531
  r.id
2499
2532
  )) }),
2500
- /* @__PURE__ */ t.jsxs("div", { className: $.bottom, children: [
2501
- /* @__PURE__ */ t.jsxs("div", { className: $.subtotal, children: [
2502
- /* @__PURE__ */ t.jsxs("div", { className: $.block, children: [
2533
+ /* @__PURE__ */ t.jsxs("div", { className: N.bottom, children: [
2534
+ /* @__PURE__ */ t.jsxs("div", { className: N.subtotal, children: [
2535
+ /* @__PURE__ */ t.jsxs("div", { className: N.block, children: [
2503
2536
  /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
2504
2537
  /* @__PURE__ */ t.jsx(
2505
- x,
2538
+ f,
2506
2539
  {
2507
2540
  name: "Info",
2508
2541
  width: 20,
@@ -2511,19 +2544,19 @@ const zo = (u) => {
2511
2544
  }
2512
2545
  )
2513
2546
  ] }),
2514
- /* @__PURE__ */ t.jsxs("div", { className: $.total, children: [
2547
+ /* @__PURE__ */ t.jsxs("div", { className: N.total, children: [
2515
2548
  "$",
2516
2549
  a().total
2517
2550
  ] })
2518
2551
  ] }),
2519
- /* @__PURE__ */ t.jsx(Yi, { onClick: () => l("/checkout"), children: "Checkout" })
2552
+ /* @__PURE__ */ t.jsx(Ji, { onClick: () => l("/checkout"), children: "Checkout" })
2520
2553
  ] })
2521
- ] }) : /* @__PURE__ */ t.jsx(Ki, {})
2554
+ ] }) : /* @__PURE__ */ t.jsx(so, {})
2522
2555
  ]
2523
2556
  }
2524
2557
  );
2525
- }, Ki = () => /* @__PURE__ */ t.jsxs("div", { className: $.empty, children: [
2526
- /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(x, { name: "Handbag" }) }),
2558
+ }, so = () => /* @__PURE__ */ t.jsxs("div", { className: N.empty, children: [
2559
+ /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(f, { name: "Handbag" }) }),
2527
2560
  /* @__PURE__ */ t.jsx("span", { children: "Your cart is empty" }),
2528
2561
  /* @__PURE__ */ t.jsxs("span", { children: [
2529
2562
  "Check out the store's products and add them",
@@ -2532,16 +2565,16 @@ const zo = (u) => {
2532
2565
  "a",
2533
2566
  {
2534
2567
  href: "/products",
2535
- className: $.link,
2568
+ className: N.link,
2536
2569
  children: "here"
2537
2570
  }
2538
2571
  )
2539
2572
  ] })
2540
- ] }), Zi = ({ token: u }) => {
2541
- const [o, e] = g.useState("test-email@gmail.com"), n = gt();
2542
- g.useEffect(() => {
2573
+ ] }), no = ({ token: u }) => {
2574
+ const [o, e] = _.useState("test-email@gmail.com"), n = gt();
2575
+ _.useEffect(() => {
2543
2576
  (async () => {
2544
- const c = Xi(u);
2577
+ const c = Zi(u);
2545
2578
  e(c.email);
2546
2579
  })();
2547
2580
  }, [u]);
@@ -2551,36 +2584,37 @@ const zo = (u) => {
2551
2584
  return /* @__PURE__ */ t.jsx(
2552
2585
  "div",
2553
2586
  {
2554
- className: $.userInfo,
2587
+ className: N.userInfo,
2555
2588
  onClick: () => i("/customer-dash"),
2556
2589
  children: /* @__PURE__ */ t.jsx("div", { children: o || "test-email@gmail.com" })
2557
2590
  }
2558
2591
  );
2559
- }, to = "_share_9g414_1", eo = "_modal_9g414_8", so = "_header_9g414_14", no = "_socials_9g414_24", io = "_social_9g414_24", oo = "_copy_9g414_34", ao = "_title_9g414_41", co = "_copyWrapper_9g414_47", lo = "_copyText_9g414_56", Q = {
2560
- share: to,
2561
- modal: eo,
2562
- header: so,
2563
- socials: no,
2564
- social: io,
2565
- copy: oo,
2566
- title: ao,
2567
- copyWrapper: co,
2568
- copyText: lo
2569
- }, Eo = () => {
2592
+ }, io = "_share_9g414_1", oo = "_modal_9g414_8", ao = "_header_9g414_14", co = "_socials_9g414_24", lo = "_social_9g414_24", ro = "_copy_9g414_34", uo = "_title_9g414_41", po = "_copyWrapper_9g414_47", mo = "_copyText_9g414_56", Q = {
2593
+ share: io,
2594
+ modal: oo,
2595
+ header: ao,
2596
+ socials: co,
2597
+ social: lo,
2598
+ copy: ro,
2599
+ title: uo,
2600
+ copyWrapper: po,
2601
+ copyText: mo
2602
+ }, Fo = () => {
2570
2603
  const { isOpenModal: u, setIsOpenModal: o } = St();
2571
2604
  function e() {
2572
2605
  o(!0);
2573
2606
  }
2574
2607
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2575
2608
  /* @__PURE__ */ t.jsx(
2576
- "div",
2609
+ it,
2577
2610
  {
2578
2611
  className: Q.share,
2579
2612
  onClick: (n) => {
2580
2613
  n.stopPropagation(), e();
2581
2614
  },
2615
+ type: "Secondary",
2582
2616
  children: /* @__PURE__ */ t.jsx(
2583
- x,
2617
+ f,
2584
2618
  {
2585
2619
  name: "Share",
2586
2620
  fill: "#757575"
@@ -2588,7 +2622,7 @@ const zo = (u) => {
2588
2622
  )
2589
2623
  }
2590
2624
  ),
2591
- u && /* @__PURE__ */ t.jsx(Ct, { close: o, children: /* @__PURE__ */ t.jsx(ro, {}) })
2625
+ u && /* @__PURE__ */ t.jsx(Ct, { close: o, children: /* @__PURE__ */ t.jsx(ho, {}) })
2592
2626
  ] });
2593
2627
  }, It = {
2594
2628
  facebook: "FacebookLogo",
@@ -2597,7 +2631,7 @@ const zo = (u) => {
2597
2631
  instagram: "InstagramLogo",
2598
2632
  discord: "MessengerLogo",
2599
2633
  tiktok: "TiktokLogo"
2600
- }, ro = () => {
2634
+ }, ho = () => {
2601
2635
  const { setIsOpenModal: u } = St(), o = window.location.href;
2602
2636
  function e() {
2603
2637
  navigator.clipboard.writeText(o);
@@ -2611,7 +2645,7 @@ const zo = (u) => {
2611
2645
  /* @__PURE__ */ t.jsxs("div", { className: Q.header, children: [
2612
2646
  /* @__PURE__ */ t.jsx("div", { className: Q.title, children: "Share this Post" }),
2613
2647
  /* @__PURE__ */ t.jsx(
2614
- x,
2648
+ f,
2615
2649
  {
2616
2650
  name: "X",
2617
2651
  fill: "#757575",
@@ -2619,12 +2653,12 @@ const zo = (u) => {
2619
2653
  }
2620
2654
  )
2621
2655
  ] }),
2622
- /* @__PURE__ */ t.jsx("div", { className: Q.socials, children: Object.keys(It).map((n) => /* @__PURE__ */ t.jsx("div", { className: Q.social, children: /* @__PURE__ */ t.jsx(x, { name: It[n] }) })) }),
2656
+ /* @__PURE__ */ t.jsx("div", { className: Q.socials, children: Object.keys(It).map((n) => /* @__PURE__ */ t.jsx("div", { className: Q.social, children: /* @__PURE__ */ t.jsx(f, { name: It[n] }) })) }),
2623
2657
  /* @__PURE__ */ t.jsxs("div", { className: Q.copyWrapper, children: [
2624
2658
  /* @__PURE__ */ t.jsx(
2625
2659
  "div",
2626
2660
  {
2627
- className: Y(Q.copy, Q.copyText),
2661
+ className: H(Q.copy, Q.copyText),
2628
2662
  onClick: e,
2629
2663
  children: o
2630
2664
  }
@@ -2634,34 +2668,34 @@ const zo = (u) => {
2634
2668
  {
2635
2669
  onClick: e,
2636
2670
  className: Q.copy,
2637
- children: /* @__PURE__ */ t.jsx(x, { name: "Copy" })
2671
+ children: /* @__PURE__ */ t.jsx(f, { name: "Copy" })
2638
2672
  }
2639
2673
  )
2640
2674
  ] })
2641
2675
  ]
2642
2676
  }
2643
2677
  );
2644
- }, uo = "_accordion_9e4oa_1", mo = "_header_9e4oa_9", _o = "_icon_9e4oa_18", ho = "_open_9e4oa_21", po = "_content_9e4oa_25", mt = {
2645
- accordion: uo,
2646
- header: mo,
2647
- icon: _o,
2648
- open: ho,
2649
- content: po
2650
- }, Lo = ({ title: u, content: o }) => {
2651
- const [e, n] = g.useState(!1), [i, a] = g.useState(0), c = g.useRef(null), s = () => {
2678
+ }, _o = "_accordion_9e4oa_1", go = "_header_9e4oa_9", xo = "_icon_9e4oa_18", fo = "_open_9e4oa_21", bo = "_content_9e4oa_25", pt = {
2679
+ accordion: _o,
2680
+ header: go,
2681
+ icon: xo,
2682
+ open: fo,
2683
+ content: bo
2684
+ }, Vo = ({ title: u, content: o }) => {
2685
+ const [e, n] = _.useState(!1), [i, a] = _.useState(0), c = _.useRef(null), s = () => {
2652
2686
  n(!e);
2653
2687
  };
2654
- return g.useEffect(() => {
2688
+ return _.useEffect(() => {
2655
2689
  c.current && a(e ? c.current.scrollHeight : 0);
2656
- }, [e]), /* @__PURE__ */ t.jsxs("div", { className: mt.accordion, children: [
2690
+ }, [e]), /* @__PURE__ */ t.jsxs("div", { className: pt.accordion, children: [
2657
2691
  /* @__PURE__ */ t.jsxs(
2658
2692
  "div",
2659
2693
  {
2660
- className: mt.header,
2694
+ className: pt.header,
2661
2695
  onClick: s,
2662
2696
  children: [
2663
- /* @__PURE__ */ t.jsx("h3", { children: u }),
2664
- /* @__PURE__ */ t.jsx("div", { className: Y(mt.icon, { [mt.open]: e }), children: /* @__PURE__ */ t.jsx(x, { name: "CaretDown" }) })
2697
+ /* @__PURE__ */ t.jsx("h5", { id: "h5", children: u }),
2698
+ /* @__PURE__ */ t.jsx("div", { className: H(pt.icon, { [pt.open]: e }), children: /* @__PURE__ */ t.jsx(f, { name: "CaretDown" }) })
2665
2699
  ]
2666
2700
  }
2667
2701
  ),
@@ -2669,22 +2703,22 @@ const zo = (u) => {
2669
2703
  "div",
2670
2704
  {
2671
2705
  ref: c,
2672
- className: mt.content,
2706
+ className: pt.content,
2673
2707
  style: { height: `${i}px` },
2674
- children: /* @__PURE__ */ t.jsx("p", { children: o })
2708
+ children: /* @__PURE__ */ t.jsx("p", { id: "p", children: o })
2675
2709
  }
2676
2710
  )
2677
2711
  ] });
2678
- }, go = "_wrapper_a11w3_1", xo = "_label_a11w3_9", fo = "_input_a11w3_17", bo = "_required_a11w3_40", vo = "_paddingless_a11w3_44", jo = "_content_a11w3_48", yo = "_borderless_a11w3_56", ko = "_rightIcon_a11w3_61", nt = {
2679
- wrapper: go,
2680
- label: xo,
2681
- input: fo,
2682
- required: bo,
2683
- paddingless: vo,
2684
- content: jo,
2685
- borderless: yo,
2686
- rightIcon: ko
2687
- }, Ro = (u) => {
2712
+ }, vo = "_wrapper_1r14x_1", jo = "_label_1r14x_9", yo = "_input_1r14x_18", ko = "_required_1r14x_35", $o = "_paddingless_1r14x_39", No = "_content_1r14x_43", Io = "_borderless_1r14x_58", wo = "_rightIcon_1r14x_63", nt = {
2713
+ wrapper: vo,
2714
+ label: jo,
2715
+ input: yo,
2716
+ required: ko,
2717
+ paddingless: $o,
2718
+ content: No,
2719
+ borderless: Io,
2720
+ rightIcon: wo
2721
+ }, Uo = (u) => {
2688
2722
  const {
2689
2723
  onChange: o,
2690
2724
  style: e,
@@ -2695,18 +2729,33 @@ const zo = (u) => {
2695
2729
  max: s,
2696
2730
  placeholder: l,
2697
2731
  disabled: d = !1,
2698
- required: v = !1,
2732
+ required: k = !1,
2699
2733
  regex: r,
2700
- paddingless: w = !1,
2734
+ paddingless: B = !1,
2701
2735
  borderless: h = !1,
2702
- editable: p = !1,
2703
- isSearch: _ = !1
2704
- } = u, [q, b] = g.useState(!1);
2705
- function T(N) {
2706
- return Number(N) < 0 ? String(c) : N;
2736
+ editable: g = !1,
2737
+ isSearch: m = !1
2738
+ } = u, { themeSettings: O } = At(), { inputs: R } = O, [P, q] = _.useState(!1);
2739
+ function C(v, M) {
2740
+ if (v.startsWith("#")) {
2741
+ let I, D, E;
2742
+ return v.length === 7 ? (I = parseInt(v.slice(1, 3), 16), D = parseInt(v.slice(3, 5), 16), E = parseInt(v.slice(5, 7), 16)) : v.length === 4 && (I = parseInt(v[1] + v[1], 16), D = parseInt(v[2] + v[2], 16), E = parseInt(v[3] + v[3], 16)), `rgba(${I}, ${D}, ${E}, ${M})`;
2743
+ }
2744
+ const j = {
2745
+ black: "#000000",
2746
+ white: "#ffffff",
2747
+ red: "#ff0000",
2748
+ green: "#00ff00",
2749
+ blue: "#0000ff"
2750
+ // Можно добавить больше цветов
2751
+ }[v.toLowerCase()];
2752
+ return j ? C(j, M) : v;
2707
2753
  }
2708
- function O(N) {
2709
- return !v || !r ? !0 : new RegExp(r).test(N);
2754
+ function S(v) {
2755
+ return Number(v) < 0 ? String(c) : v;
2756
+ }
2757
+ function x(v) {
2758
+ return !k || !r ? !0 : new RegExp(r).test(v);
2710
2759
  }
2711
2760
  return /* @__PURE__ */ t.jsxs("div", { className: nt.wrapper, children: [
2712
2761
  n && /* @__PURE__ */ t.jsx(
@@ -2717,66 +2766,76 @@ const zo = (u) => {
2717
2766
  children: n
2718
2767
  }
2719
2768
  ),
2720
- /* @__PURE__ */ t.jsxs("div", { className: nt.content, children: [
2721
- /* @__PURE__ */ t.jsx(
2722
- "input",
2723
- {
2724
- id: n,
2725
- type: a || "text",
2726
- onChange: (N) => {
2727
- if (a === "text") o(N.target.value);
2728
- else {
2729
- const C = T(N.target.value);
2730
- o(C);
2769
+ /* @__PURE__ */ t.jsxs(
2770
+ "div",
2771
+ {
2772
+ className: nt.content,
2773
+ style: {
2774
+ paddingRight: R.general.height + 15,
2775
+ ...e,
2776
+ backgroundColor: C(R.field.color, R.field.opacity / 100)
2777
+ },
2778
+ children: [
2779
+ /* @__PURE__ */ t.jsx(
2780
+ "input",
2781
+ {
2782
+ id: n,
2783
+ type: a || "text",
2784
+ onChange: (v) => {
2785
+ if (a === "text") o(v.target.value);
2786
+ else {
2787
+ const M = S(v.target.value);
2788
+ o(M);
2789
+ }
2790
+ },
2791
+ value: i,
2792
+ autoComplete: "off",
2793
+ placeholder: l || "Type something...",
2794
+ className: H(nt.input, {
2795
+ [nt.required]: P && k && !x(i),
2796
+ [nt.paddingless]: B,
2797
+ [nt.borderless]: h
2798
+ }),
2799
+ min: a === "number" ? c : void 0,
2800
+ max: a === "number" ? s : void 0,
2801
+ disabled: d,
2802
+ onFocus: () => q(!0)
2731
2803
  }
2732
- },
2733
- value: i,
2734
- autoComplete: "off",
2735
- placeholder: l || "Type something...",
2736
- className: Y(nt.input, {
2737
- [nt.required]: q && v && !O(i),
2738
- [nt.paddingless]: w,
2739
- [nt.borderless]: h
2740
- }),
2741
- min: a === "number" ? c : void 0,
2742
- max: a === "number" ? s : void 0,
2743
- disabled: d,
2744
- onFocus: () => b(!0),
2745
- style: e
2746
- }
2747
- ),
2748
- _ && /* @__PURE__ */ t.jsx("div", { className: nt.rightIcon, children: /* @__PURE__ */ t.jsx(
2749
- x,
2750
- {
2751
- name: "MagnifyingGlass",
2752
- fill: "var(--icon-secondary)",
2753
- width: 20,
2754
- height: 20
2755
- }
2756
- ) }),
2757
- p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
2758
- x,
2759
- {
2760
- name: "Sliders",
2761
- width: 20,
2762
- height: 20,
2763
- hoverable: !0
2764
- }
2765
- ) })
2766
- ] })
2804
+ ),
2805
+ m && /* @__PURE__ */ t.jsx("div", { className: nt.rightIcon, children: /* @__PURE__ */ t.jsx(
2806
+ f,
2807
+ {
2808
+ name: "MagnifyingGlass",
2809
+ fill: "var(--icon-secondary)",
2810
+ width: R.general.height,
2811
+ height: R.general.height
2812
+ }
2813
+ ) }),
2814
+ g && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
2815
+ f,
2816
+ {
2817
+ name: "Sliders",
2818
+ width: 20,
2819
+ height: 20,
2820
+ hoverable: !0
2821
+ }
2822
+ ) })
2823
+ ]
2824
+ }
2825
+ )
2767
2826
  ] });
2768
- }, $o = "_wrapper_st58d_1", No = "_label_st58d_10", Io = "_textarea_st58d_18", wo = "_length_st58d_33", pt = {
2769
- wrapper: $o,
2770
- label: No,
2771
- textarea: Io,
2772
- length: wo
2773
- }, Mo = (u) => {
2774
- const { onChange: o, label: e, value: n, maxLength: i, placeholder: a = "Type something..." } = u, [c, s] = g.useState(n.length);
2775
- return /* @__PURE__ */ t.jsxs("div", { className: pt.wrapper, children: [
2827
+ }, Co = "_wrapper_st58d_1", So = "_label_st58d_10", To = "_textarea_st58d_18", Bo = "_length_st58d_33", _t = {
2828
+ wrapper: Co,
2829
+ label: So,
2830
+ textarea: To,
2831
+ length: Bo
2832
+ }, zo = (u) => {
2833
+ const { onChange: o, label: e, value: n, maxLength: i, placeholder: a = "Type something..." } = u, [c, s] = _.useState(n.length);
2834
+ return /* @__PURE__ */ t.jsxs("div", { className: _t.wrapper, children: [
2776
2835
  e && /* @__PURE__ */ t.jsx(
2777
2836
  "label",
2778
2837
  {
2779
- className: pt.label,
2838
+ className: _t.label,
2780
2839
  htmlFor: e,
2781
2840
  children: e
2782
2841
  }
@@ -2790,11 +2849,11 @@ const zo = (u) => {
2790
2849
  s(l.target.value.length), o(l.target.value);
2791
2850
  },
2792
2851
  placeholder: a,
2793
- className: pt.textarea,
2852
+ className: _t.textarea,
2794
2853
  maxLength: i
2795
2854
  }
2796
2855
  ),
2797
- i && /* @__PURE__ */ t.jsxs("div", { className: pt.length, children: [
2856
+ i && /* @__PURE__ */ t.jsxs("div", { className: _t.length, children: [
2798
2857
  c,
2799
2858
  "/",
2800
2859
  i
@@ -2802,34 +2861,34 @@ const zo = (u) => {
2802
2861
  ] });
2803
2862
  };
2804
2863
  export {
2805
- Lo as Accordion,
2806
- Yi as Button,
2807
- ln as ButtonTypeSettings,
2808
- Ao as ButtonsSettings,
2809
- Bo as CategorySettings,
2864
+ Vo as Accordion,
2865
+ Ji as Button,
2866
+ rn as ButtonTypeSettings,
2867
+ Lo as ButtonsSettings,
2868
+ Do as CategorySettings,
2810
2869
  ht as ChooseImage,
2811
- Fo as ChooseImageModal,
2812
- Ki as EmptyCart,
2813
- qo as FormSettings,
2814
- zo as HeaderButtons,
2815
- x as Icon,
2816
- X as InputSettings,
2817
- Ro as InputUI,
2818
- Ce as ItemsSettings,
2819
- To as LayoutSettings,
2820
- Oo as ListingSelector,
2821
- Uo as Loader,
2870
+ Wo as ChooseImageModal,
2871
+ so as EmptyCart,
2872
+ Eo as FormSettings,
2873
+ Ho as HeaderButtons,
2874
+ f as Icon,
2875
+ W as InputSettings,
2876
+ Uo as InputUI,
2877
+ Se as ItemsSettings,
2878
+ qo as LayoutSettings,
2879
+ Ro as ListingSelector,
2880
+ Xo as Loader,
2822
2881
  Ct as Modal,
2823
- Do as ProductOptions,
2882
+ Mo as ProductOptions,
2824
2883
  Nt as RangeSelector,
2825
2884
  tt as Select,
2826
- Eo as ShareLink,
2827
- Ji as ShoppingButton,
2828
- Qi as ShoppingModalCart,
2885
+ Fo as ShareLink,
2886
+ to as ShoppingButton,
2887
+ eo as ShoppingModalCart,
2829
2888
  K as Switch,
2830
- Tt as TextSettings,
2889
+ Bt as TextSettings,
2831
2890
  wt as TextareaSettings,
2832
- Mo as TextareaUI,
2833
- Pt as TypesText,
2834
- Zi as UserInfo
2891
+ zo as TextareaUI,
2892
+ Tt as TypesText,
2893
+ no as UserInfo
2835
2894
  };