@billgangcom/theme-lib 1.31.1 → 1.33.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 (20) hide show
  1. package/dist/builder/components/Sidebar/AddSections/BlockColors/index.d.ts +1 -0
  2. package/dist/builder/constants/theme-settings.d.ts +15 -1
  3. package/dist/builder/store/useColorPickerStore.d.ts +19 -0
  4. package/dist/builder/store/useLayersStore.d.ts +1 -1
  5. package/dist/builder/store/useThemeSettingsStore.d.ts +1 -1
  6. package/dist/builder/ui/Button/index.d.ts +1 -0
  7. package/dist/builder/ui/ColorPicker/index.d.ts +1 -0
  8. package/dist/builder.cjs.js +48 -15
  9. package/dist/builder.es.js +2173 -1639
  10. package/dist/index-CZcNDk0w.cjs +146 -0
  11. package/dist/{index-CPy18oiD.js → index-DSREXVyt.js} +13134 -12003
  12. package/dist/lib/index.d.ts +1 -0
  13. package/dist/lib/setupDynamicFonts.d.ts +2 -0
  14. package/dist/ui/ButtonsSettings/index.d.ts +2 -0
  15. package/dist/ui/Input/index.d.ts +1 -2
  16. package/dist/ui.cjs.js +1 -1
  17. package/dist/ui.es.js +1214 -1134
  18. package/package.json +2 -1
  19. package/dist/builder/components/Sidebar/AddSections/SearchSections/index.d.ts +0 -4
  20. 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 V, S as K, T as Ct, C as ht, b as tt, D as jt, H as yt, B as ot, v as lt, u as kt, d as $t, e as qt, f as gt, g as wt, h as St, M as Tt, i as Pt, k as Dt } from "./index-DSREXVyt.js";
2
+ import { l as Zo, L as ta } from "./index-DSREXVyt.js";
3
+ import h 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 Et = "_wrapper_9rr5j_2", Lt = "_alignmentBlock_9rr5j_8", Rt = "_title_9rr5j_15", Mt = "_subtitle_9rr5j_22", Ht = "_alignmentContent_9rr5j_29", Ft = "_alignments_9rr5j_37", Vt = "_alignment_9rr5j_8", Ut = "_circle_9rr5j_58", zt = "_paddings_9rr5j_65", Yt = "_padding_9rr5j_65", Gt = "_input_9rr5j_84", J = {
6
+ wrapper: Et,
7
+ alignmentBlock: Lt,
8
+ title: Rt,
9
+ subtitle: Mt,
10
+ alignmentContent: Ht,
11
+ alignments: Ft,
12
+ alignment: Vt,
13
+ circle: Ut,
14
+ paddings: zt,
15
+ padding: Yt,
16
+ input: Gt
17
+ }, Wt = [
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
+ ], Xt = ["left", "top", "right", "bottom"], Mo = (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: Wt.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: Xt.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
+ }, Jt = "_title_18dz7_1", Qt = "_subtitle_18dz7_5", Kt = "_header_18dz7_12", Zt = "_text_18dz7_13", te = "_top_18dz7_21", ee = "_itemsBlock_18dz7_30", dt = {
120
+ title: Jt,
121
+ subtitle: Qt,
122
+ header: Kt,
123
+ text: Zt,
124
+ top: te,
125
+ itemsBlock: ee
126
+ }, se = "_typeTexts_rcw8p_1", ne = "_block_rcw8p_8", ie = "_active_rcw8p_21", xt = {
127
+ typeTexts: se,
128
+ block: ne,
129
+ active: ie
130
+ }, oe = ["bold", "italic", "underline", "strike-through", "code"], Bt = (u) => {
131
131
  const { typesText: o, setTypesText: e } = u;
132
132
  function n(i) {
133
133
  switch (i) {
@@ -143,11 +143,11 @@ 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: xt.typeTexts, children: oe.map((i) => /* @__PURE__ */ t.jsx(
147
147
  "div",
148
148
  {
149
- className: Y(ft.block, {
150
- [ft.active]: o.includes(i)
149
+ className: V(xt.block, {
150
+ [xt.active]: o.includes(i)
151
151
  }),
152
152
  onClick: () => {
153
153
  const a = [...o];
@@ -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
+ }, At = (u) => {
173
173
  const {
174
174
  typesText: o,
175
175
  isActiveText: e,
@@ -180,9 +180,9 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
180
180
  title: s,
181
181
  subtitle: l = "Items"
182
182
  } = u;
183
- return /* @__PURE__ */ t.jsxs("div", { className: rt.text, children: [
184
- (s || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: rt.top, children: [
185
- s && /* @__PURE__ */ t.jsx("h3", { className: rt.title, children: s }),
183
+ return /* @__PURE__ */ t.jsxs("div", { className: dt.text, children: [
184
+ (s || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: dt.top, children: [
185
+ s && /* @__PURE__ */ t.jsx("h3", { className: dt.title, children: s }),
186
186
  e !== void 0 && n && /* @__PURE__ */ t.jsx(
187
187
  K,
188
188
  {
@@ -191,10 +191,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
191
191
  }
192
192
  )
193
193
  ] }),
194
- /* @__PURE__ */ t.jsxs("div", { className: rt.itemsBlock, children: [
195
- /* @__PURE__ */ t.jsx("h5", { className: rt.subtitle, children: l }),
194
+ /* @__PURE__ */ t.jsxs("div", { className: dt.itemsBlock, children: [
195
+ /* @__PURE__ */ t.jsx("h5", { className: dt.subtitle, children: l }),
196
196
  /* @__PURE__ */ t.jsx(
197
- wt,
197
+ Ct,
198
198
  {
199
199
  onChange: (d) => a(d),
200
200
  value: i,
@@ -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
+ Bt,
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,
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(
213
+ }, ae = "_title_fyopx_1", ce = "_subtitle_fyopx_5", le = "_header_fyopx_12", re = "_text_fyopx_13", de = "_productsBlock_fyopx_14", ue = "_top_fyopx_26", pe = "_itemsBlock_fyopx_35", me = "_typeTexts_fyopx_41", he = "_block_fyopx_48", _e = "_active_fyopx_61", ge = "_products_fyopx_14", fe = "_product_fyopx_14", xe = "_button_fyopx_80", be = "_disabled_fyopx_91", ve = "_image_fyopx_95", je = "_info_fyopx_102", ye = "_name_fyopx_114", ke = "_buttons_fyopx_118", $e = "_modal_fyopx_125", we = "_link_fyopx_145", Ne = "_modalOptions_fyopx_151", F = {
214
+ title: ae,
215
+ subtitle: ce,
216
+ header: le,
217
+ text: re,
218
+ productsBlock: de,
219
+ top: ue,
220
+ itemsBlock: pe,
221
+ typeTexts: me,
222
+ block: he,
223
+ active: _e,
224
+ products: ge,
225
+ product: fe,
226
+ button: xe,
227
+ disabled: be,
228
+ image: ve,
229
+ info: je,
230
+ name: ye,
231
+ buttons: ke,
232
+ modal: $e,
233
+ link: we,
234
+ modalOptions: Ne
235
+ }, Ie = h.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: F.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: F.top, children: [
252
+ /* @__PURE__ */ t.jsx("h3", { className: F.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: F.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
+ At,
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: F.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
+ Be,
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,11 +393,11 @@ 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
400
- }, xt = (u) => {
396
+ ), Ce = "_other_g74jx_1", Se = "_subtitle_g74jx_7", Te = "_items_g74jx_14", bt = {
397
+ other: Ce,
398
+ subtitle: Se,
399
+ items: Te
400
+ }, ft = (u) => {
401
401
  const { items: o, title: e = "Other" } = u;
402
402
  return /* @__PURE__ */ t.jsxs("div", { className: bt.other, children: [
403
403
  /* @__PURE__ */ t.jsx("h5", { className: bt.subtitle, children: e }),
@@ -413,13 +413,13 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
413
413
  i
414
414
  )) })
415
415
  ] });
416
- }, we = (u) => {
417
- const { index: o, moveProduct: e, children: n } = u, [, i] = yt({
416
+ }, Pe = (u) => {
417
+ const { index: o, moveProduct: e, children: n } = u, [, i] = kt({
418
418
  accept: "product",
419
419
  hover(s) {
420
420
  s.index !== o && (e(s.index, o), s.index = o);
421
421
  }
422
- }), [{ isDragging: a }, c] = kt({
422
+ }), [{ isDragging: a }, c] = $t({
423
423
  type: "product",
424
424
  item: { index: o },
425
425
  collect: (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: `${F.product} ${a ? F.dragging : ""}`,
434
434
  children: n
435
435
  }
436
436
  );
437
- }, Ce = (u) => {
437
+ }, Be = (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: $ = !1,
449
449
  deletable: r = !0,
450
- addable: w = !0,
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({
450
+ addable: B = !0,
451
+ itemsType: x,
452
+ itemsPlaceholder: _ = "",
453
+ itemsOptions: m,
454
+ hasRangeSelector: O = !1,
455
+ rangeSelectorOptions: q,
456
+ modalOptions: b,
457
+ addableOptions: D = {},
458
+ limit: C,
459
+ autoScrollInterval: S
460
+ } = u, [g, j] = h.useState(null), [M, k] = h.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
+ }), [y, N] = h.useState(null), E = h.useRef(null), [L, U] = h.useState(!1), et = (p, T) => {
464
+ const w = [...n], [X] = w.splice(p, 1);
465
+ w.splice(T, 0, X), i(w);
466
466
  };
467
- g.useEffect(() => {
468
- const m = () => {
469
- V(null), M(!1);
467
+ h.useEffect(() => {
468
+ const p = () => {
469
+ j(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), j(null), U(!1), () => {
472
+ j(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
+ }, []), h.useEffect(() => {
475
+ if (g) {
476
+ const p = [...n].map((T) => T.id === g.id ? g : 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,
479
+ }, [g]), h.useEffect(() => {
480
+ if (E.current && y) {
481
+ const p = E.current.getBoundingClientRect().height, T = window.innerHeight;
482
+ let w = y.top;
483
+ w + p > T + window.scrollY && (w = T + window.scrollY - p - 200), w < 0 && (w = 10), k({
484
+ top: w,
485
485
  left: y.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
+ }, [E.current, y]);
489
+ const at = (p, T) => {
490
+ p.stopPropagation();
491
+ const w = p.target.getBoundingClientRect();
492
+ N({
493
+ top: w.top + window.scrollY,
494
+ left: w.left - 30
495
+ }), j(T), U(!0);
496
496
  };
497
- function f(m) {
498
- if (v)
499
- return m ? /* @__PURE__ */ t.jsx(
497
+ function v(p) {
498
+ if ($)
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 w = /* @__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,
@@ -526,155 +526,156 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
526
526
  height: 20
527
527
  }
528
528
  ) }),
529
- h === "select" && /* @__PURE__ */ t.jsx(
529
+ x === "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: (R) => {
533
+ const rt = [...n].map((st) => st.id === p.id ? {
534
+ ...p,
535
+ name: R
536
536
  } : st);
537
- V({
538
- ...m,
539
- name: A
540
- }), i([...lt]);
537
+ j({
538
+ ...p,
539
+ name: R
540
+ }), i([...rt]);
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((R) => !n.find((Y) => Y.name === R.name)).map((R) => R.name),
544
+ leftAddon: v(p.images)
545
545
  }
546
546
  ),
547
- h === "input" && /* @__PURE__ */ t.jsx(
548
- X,
547
+ x === "input" && /* @__PURE__ */ t.jsx(
548
+ W,
549
549
  {
550
- onChange: (A) => {
551
- const lt = [...n].map((st) => st.id === m.id ? {
552
- ...m,
553
- name: A
550
+ onChange: (R) => {
551
+ const rt = [...n].map((st) => st.id === p.id ? {
552
+ ...p,
553
+ name: R
554
554
  } : st);
555
- i([...lt]);
555
+ i([...rt]);
556
556
  },
557
- value: m.name,
558
- placeholder: p
557
+ value: p.name,
558
+ placeholder: _
559
559
  }
560
560
  ),
561
- h === "image" && /* @__PURE__ */ t.jsx(
561
+ x === "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: (R) => {
565
+ const rt = [...n].map((st) => st.id === p.id ? {
566
+ ...p,
567
+ images: R
568
568
  } : st);
569
- i([...lt]);
569
+ i([...rt]);
570
570
  },
571
- activeImage: (W = n.find((A) => A.id === m.id)) == null ? void 0 : W.images[0]
571
+ activeImage: (X = n.find((R) => R.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: F.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: (R) => at(R, 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((R) => R.id !== p.id))
594
594
  }
595
595
  )
596
596
  ] })
597
597
  ] });
598
598
  return d ? /* @__PURE__ */ t.jsx(
599
- we,
599
+ Pe,
600
600
  {
601
- product: m,
602
- index: I,
601
+ product: p,
602
+ index: T,
603
603
  moveProduct: et,
604
- children: k
604
+ children: w
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: F.product,
611
+ children: w
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: F.productsBlock, children: [
617
+ (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: F.top, children: [
618
+ c && /* @__PURE__ */ t.jsx("h3", { className: F.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
+ g && l && b && L && /* @__PURE__ */ t.jsx(
628
+ Ie,
629
629
  {
630
- ref: D,
631
- activeItem: B,
632
- setActiveItem: V,
633
- popupPosition: G,
634
- modalOptions: T,
635
- setIsOpenModal: M
630
+ ref: E,
631
+ activeItem: g,
632
+ setActiveItem: j,
633
+ popupPosition: M,
634
+ modalOptions: b,
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 && q && /* @__PURE__ */ t.jsx(Nt, { ...q }),
639
+ /* @__PURE__ */ t.jsxs("div", { className: F.products, children: [
640
+ s && /* @__PURE__ */ t.jsx("h5", { className: F.subtitle, children: s }),
641
+ d ? /* @__PURE__ */ t.jsx(jt, { backend: yt, children: n.map((p, T) => A(p, T)) }) : n.map((p, T) => A(p, T)),
642
+ B && /* @__PURE__ */ t.jsxs(
643
+ ot,
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: V(F.button, {
647
+ [F.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 w = 0; w < m.length; w++)
656
+ if (!n.find((X) => X.id === m[w].id)) {
657
+ T = m[w];
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
+ x === "select" ? p.push({
662
+ name: T ? T.name : m[0].name,
663
+ id: (T == null ? void 0 : T.id) || m[0].id,
664
+ ...D
665
+ }) : x === "input" ? p.push({
665
666
  name: "",
666
- id: ct(),
667
- ...O
668
- }) : m.push({
667
+ id: lt(),
668
+ ...D
669
+ }) : p.push({
669
670
  name: `Image ${n.length + 1}`,
670
- id: ct(),
671
- ...O
672
- }), i(m);
671
+ id: lt(),
672
+ ...D
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,
@@ -685,14 +686,14 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
685
686
  }
686
687
  )
687
688
  ] }),
688
- a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a }),
689
- C !== void 0 && /* @__PURE__ */ t.jsx(
690
- X,
689
+ a !== void 0 && /* @__PURE__ */ t.jsx(ft, { items: a }),
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
+ }, Ae = "_title_fyopx_1", Oe = "_subtitle_fyopx_5", qe = "_header_fyopx_12", De = "_text_fyopx_13", Ee = "_productsBlock_fyopx_14", Le = "_top_fyopx_26", Re = "_itemsBlock_fyopx_35", Me = "_typeTexts_fyopx_41", He = "_block_fyopx_48", Fe = "_active_fyopx_61", Ve = "_products_fyopx_14", Ue = "_product_fyopx_14", ze = "_button_fyopx_80", Ye = "_disabled_fyopx_91", Ge = "_image_fyopx_95", We = "_info_fyopx_102", Xe = "_name_fyopx_114", Je = "_buttons_fyopx_118", Qe = "_modal_fyopx_125", Ke = "_link_fyopx_145", Ze = "_modalOptions_fyopx_151", Z = {
707
+ title: Ae,
708
+ subtitle: Oe,
709
+ header: qe,
710
+ text: De,
711
+ productsBlock: Ee,
712
+ top: Le,
713
+ itemsBlock: Re,
714
+ typeTexts: Me,
715
+ block: He,
716
+ active: Fe,
717
+ products: Ve,
718
+ product: Ue,
719
+ button: ze,
720
+ disabled: Ye,
721
+ image: Ge,
722
+ info: We,
723
+ name: Xe,
724
+ buttons: Je,
725
+ modal: Qe,
726
+ link: Ke,
727
+ modalOptions: Ze
728
+ }, Ho = (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: $ = !0,
739
740
  itemsOptions: r,
740
- hasRangeSelector: w = !1,
741
- rangeSelectorOptions: h,
742
- limit: p,
743
- autoScrollInterval: _
741
+ hasRangeSelector: B = !1,
742
+ rangeSelectorOptions: x,
743
+ limit: _,
744
+ autoScrollInterval: m
744
745
  } = u;
745
- function q(T) {
746
+ function O(b) {
746
747
  if (d)
747
- return T ? /* @__PURE__ */ t.jsx(
748
+ return b ? /* @__PURE__ */ t.jsx(
748
749
  "img",
749
750
  {
750
- src: `https://imagedelivery.net/${T[0]}/w=1000`,
751
+ src: `https://imagedelivery.net/${b[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 q = (b) => {
767
+ const D = r.find((S) => S.id === b);
768
+ if (!D) 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 g = [...n], j = r.find((y) => y.name === S);
784
+ if (!j) return;
785
+ const M = j.id, k = g.map((y) => y === b ? M : y);
786
+ i([...k]);
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: D.name,
789
+ options: r.filter((S) => !n.find((g) => g === S.id)).map((S) => S.name),
790
+ leftAddon: O(D.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 !== b))
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
+ b
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: (b) => e == null ? void 0 : e(b)
821
822
  }
822
823
  )
823
824
  ] }),
824
- w && h && /* @__PURE__ */ t.jsx(Nt, { ...h }),
825
+ B && x && /* @__PURE__ */ t.jsx(Nt, { ...x }),
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((b) => q(b)),
829
+ $ && /* @__PURE__ */ t.jsxs(
830
+ ot,
830
831
  {
831
- className: Y(Z.button, {
832
- [Z.disabled]: !!(p && p <= n.length || n.length === r.length)
832
+ withoutHover: !0,
833
+ className: V(Z.button, {
834
+ [Z.disabled]: !!(_ && _ <= n.length || n.length === r.length)
833
835
  }),
834
836
  size: "s",
835
- disabled: !!(p && p <= n.length || n.length === r.length),
837
+ disabled: !!(_ && _ <= n.length || n.length === r.length),
836
838
  onClick: () => {
837
- const T = [...n];
838
- let O = null;
839
+ const b = [...n];
840
+ let D = 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
+ D = r[C];
843
845
  break;
844
846
  }
845
847
  }
846
- T.push((O == null ? void 0 : O.id) || r[0].id), i(T);
848
+ b.push((D == null ? void 0 : D.id) || r[0].id), i(b);
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,
@@ -859,14 +861,14 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
859
861
  }
860
862
  )
861
863
  ] }),
862
- a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a }),
863
- _ !== void 0 && /* @__PURE__ */ t.jsx(
864
- X,
864
+ a !== void 0 && /* @__PURE__ */ t.jsx(ft, { items: a }),
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: (b) => m.setScrollInterval(Number(b)),
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,
896
- name: ms,
897
- buttons: _s,
898
- modal: hs,
899
- link: ps,
900
- modalOptions: gs
901
- }, xs = g.forwardRef(
881
+ }, ts = "_title_fyopx_1", es = "_subtitle_fyopx_5", ss = "_header_fyopx_12", ns = "_text_fyopx_13", is = "_productsBlock_fyopx_14", os = "_top_fyopx_26", as = "_itemsBlock_fyopx_35", cs = "_typeTexts_fyopx_41", ls = "_block_fyopx_48", rs = "_active_fyopx_61", ds = "_products_fyopx_14", us = "_product_fyopx_14", ps = "_button_fyopx_80", ms = "_disabled_fyopx_91", hs = "_image_fyopx_95", _s = "_info_fyopx_102", gs = "_name_fyopx_114", fs = "_buttons_fyopx_118", xs = "_modal_fyopx_125", bs = "_link_fyopx_145", vs = "_modalOptions_fyopx_151", z = {
882
+ title: ts,
883
+ subtitle: es,
884
+ header: ss,
885
+ text: ns,
886
+ productsBlock: is,
887
+ top: os,
888
+ itemsBlock: as,
889
+ typeTexts: cs,
890
+ block: ls,
891
+ active: rs,
892
+ products: ds,
893
+ product: us,
894
+ button: ps,
895
+ disabled: ms,
896
+ image: hs,
897
+ info: _s,
898
+ name: gs,
899
+ buttons: fs,
900
+ modal: xs,
901
+ link: bs,
902
+ modalOptions: vs
903
+ }, js = h.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
+ At,
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,13 +1041,13 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1039
1041
  }
1040
1042
  );
1041
1043
  }
1042
- ), fs = (u) => {
1043
- const { index: o, moveProduct: e, children: n } = u, [, i] = yt({
1044
+ ), ys = (u) => {
1045
+ const { index: o, moveProduct: e, children: n } = u, [, i] = kt({
1044
1046
  accept: "product",
1045
1047
  hover(s) {
1046
1048
  s.index !== o && (e(s.index, o), s.index = o);
1047
1049
  }
1048
- }), [{ isDragging: a }, c] = kt({
1050
+ }), [{ isDragging: a }, c] = $t({
1049
1051
  type: "product",
1050
1052
  item: { index: o },
1051
1053
  collect: (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
+ }, Fo = (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: $ = !1,
1075
1077
  deletable: r = !0,
1076
- addable: w = !0,
1077
- 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({
1078
+ addable: B = !0,
1079
+ itemsType: x,
1080
+ itemsPlaceholder: _ = "",
1081
+ itemsOptions: m,
1082
+ hasRangeSelector: O = !1,
1083
+ rangeSelectorOptions: q,
1084
+ modalOptions: b,
1085
+ addableOptions: D = {}
1086
+ } = u, [C, S] = h.useState(null), [g, j] = h.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, k] = h.useState(null), y = h.useRef(null), [N, E] = h.useState(!1), L = (v, A) => {
1090
+ const p = [...n], [T] = p.splice(v, 1);
1091
+ p.splice(A, 0, T), i(p);
1090
1092
  };
1091
- g.useEffect(() => {
1092
- const f = () => {
1093
- C(null), D(!1);
1093
+ h.useEffect(() => {
1094
+ const v = () => {
1095
+ S(null), E(!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", v), S(null), E(!1), () => {
1098
+ S(null), E(!1), document.body.removeEventListener("click", v);
1097
1099
  };
1098
- }, []), g.useEffect(() => {
1099
- if (N) {
1100
- const f = [...n].map((S) => S.id === N.id ? N : S);
1101
- i(f);
1100
+ }, []), h.useEffect(() => {
1101
+ if (C) {
1102
+ const v = [...n].map((A) => A.id === C.id ? C : A);
1103
+ i(v);
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]), h.useEffect(() => {
1106
+ if (y.current && M) {
1107
+ const v = y.current.getBoundingClientRect().height, A = window.innerHeight;
1108
+ let p = M.top;
1109
+ p + v > A + window.scrollY && (p = A + window.scrollY - v - 200), p < 0 && (p = 10), j({
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
+ }, [y.current, M]);
1115
+ const U = (v, A) => {
1116
+ v.stopPropagation();
1117
+ const p = v.target.getBoundingClientRect();
1118
+ k({
1119
+ top: p.top + window.scrollY,
1120
+ left: p.left - 30
1121
+ }), S(A), E(!0);
1120
1122
  };
1121
- function et(f) {
1122
- if (v)
1123
- return f ? /* @__PURE__ */ t.jsx(
1123
+ function et(v) {
1124
+ if ($)
1125
+ return v ? /* @__PURE__ */ t.jsx(
1124
1126
  "img",
1125
1127
  {
1126
- src: `https://imagedelivery.net/${f[0]}/w=1000`,
1128
+ src: `https://imagedelivery.net/${v[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 at = (v, 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,
@@ -1150,152 +1152,153 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1150
1152
  height: 20
1151
1153
  }
1152
1154
  ) }),
1153
- h === "select" && /* @__PURE__ */ t.jsx(
1155
+ x === "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: (w) => {
1159
+ const R = [...n].map((Y) => Y.id === v.id ? {
1160
+ ...v,
1161
+ name: w
1162
+ } : Y);
1163
+ S({
1164
+ ...v,
1165
+ name: w
1166
+ }), i([...R]);
1165
1167
  },
1166
- value: f.name,
1167
- options: _.filter((k) => !n.find((W) => W.name === k)),
1168
- leftAddon: et(f.images)
1168
+ value: v.name,
1169
+ options: m.filter((w) => !n.find((X) => X.name === w)),
1170
+ leftAddon: et(v.images)
1169
1171
  }
1170
1172
  ),
1171
- h === "input" && /* @__PURE__ */ t.jsx(
1172
- X,
1173
+ x === "input" && /* @__PURE__ */ t.jsx(
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: (w) => {
1177
+ const R = [...n].map((Y) => Y.id === v.id ? {
1178
+ ...v,
1179
+ name: w
1180
+ } : Y);
1181
+ i([...R]);
1180
1182
  },
1181
- value: f.name,
1182
- placeholder: p
1183
+ value: v.name,
1184
+ placeholder: _
1183
1185
  }
1184
1186
  ),
1185
- h === "image" && /* @__PURE__ */ t.jsx(
1187
+ x === "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: (w) => {
1191
+ const R = [...n].map((Y) => Y.id === v.id ? {
1192
+ ...v,
1193
+ images: w
1194
+ } : Y);
1195
+ i([...R]);
1194
1196
  },
1195
- activeImage: (I = n.find((k) => k.id === f.id)) == null ? void 0 : I.images[0]
1197
+ activeImage: (T = n.find((w) => w.id === v.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: (w) => U(w, v)
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((w) => w.id !== v.id))
1218
1220
  }
1219
1221
  )
1220
1222
  ] })
1221
1223
  ] });
1222
1224
  return d ? /* @__PURE__ */ t.jsx(
1223
- fs,
1225
+ ys,
1224
1226
  {
1225
- product: f,
1226
- index: S,
1227
- moveProduct: z,
1228
- children: m
1227
+ product: v,
1228
+ index: A,
1229
+ moveProduct: L,
1230
+ children: p
1229
1231
  },
1230
- f.id
1232
+ v.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
+ v.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: (v) => e == null ? void 0 : e(v)
1248
1250
  }
1249
1251
  )
1250
1252
  ] }),
1251
- N && l && T && E && /* @__PURE__ */ t.jsx(
1252
- xs,
1253
+ C && l && b && N && /* @__PURE__ */ t.jsx(
1254
+ js,
1253
1255
  {
1254
1256
  ref: y,
1255
- activeItem: N,
1256
- setActiveItem: C,
1257
- popupPosition: B,
1258
- modalOptions: T,
1259
- setIsOpenModal: D
1257
+ activeItem: C,
1258
+ setActiveItem: S,
1259
+ popupPosition: g,
1260
+ modalOptions: b,
1261
+ setIsOpenModal: E
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 && q && /* @__PURE__ */ t.jsx(Nt, { ...q }),
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(jt, { backend: yt, children: n.map((v, A) => at(v, A)) }) : n.map((v, A) => at(v, A)),
1268
+ B && /* @__PURE__ */ t.jsxs(
1269
+ ot,
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 v = [...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],
1283
- id: ct(),
1284
- ...O
1285
- }) : h === "input" ? f.push({
1284
+ x === "select" ? v.push({
1285
+ name: A || m[0],
1286
+ id: lt(),
1287
+ ...D
1288
+ }) : x === "input" ? v.push({
1286
1289
  name: "",
1287
- id: ct(),
1288
- ...O
1289
- }) : f.push({
1290
+ id: lt(),
1291
+ ...D
1292
+ }) : v.push({
1290
1293
  name: `Image ${n.length + 1}`,
1291
- id: ct(),
1292
- ...O
1293
- }), i(f);
1294
+ id: lt(),
1295
+ ...D
1296
+ }), i(v);
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,
@@ -1306,48 +1309,50 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1306
1309
  }
1307
1310
  )
1308
1311
  ] }),
1309
- a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a })
1312
+ a !== void 0 && /* @__PURE__ */ t.jsx(ft, { 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
+ }, ks = "_title_dkxs6_1", $s = "_subtitle_dkxs6_5", ws = "_header_dkxs6_12", Ns = "_text_dkxs6_13", Is = "_productsBlock_dkxs6_14", Cs = "_buttonsBlock_dkxs6_15", Ss = "_top_dkxs6_26", Ts = "_itemsBlock_dkxs6_35", Ps = "_typeTexts_dkxs6_41", Bs = "_block_dkxs6_48", As = "_active_dkxs6_60", Os = "_products_dkxs6_14", qs = "_product_dkxs6_14", Ds = "_button_dkxs6_15", Es = "_image_dkxs6_90", Ls = "_info_dkxs6_97", Rs = "_name_dkxs6_109", Ms = "_buttons_dkxs6_15", Hs = "_modal_dkxs6_120", Fs = "_other_dkxs6_140", Vs = "_options_dkxs6_146", ct = {
1315
+ title: ks,
1316
+ subtitle: $s,
1317
+ header: ws,
1318
+ text: Ns,
1319
+ productsBlock: Is,
1320
+ buttonsBlock: Cs,
1321
+ top: Ss,
1322
+ itemsBlock: Ts,
1323
+ typeTexts: Ps,
1324
+ block: Bs,
1325
+ active: As,
1326
+ products: Os,
1327
+ product: qs,
1328
+ button: Ds,
1329
+ image: Es,
1330
+ info: Ls,
1331
+ name: Rs,
1332
+ buttons: Ms,
1333
+ modal: Hs,
1334
+ other: Fs,
1335
+ options: Vs
1336
+ }, Us = h.forwardRef((u, o) => {
1337
+ const { activeButton: e, setActiveButton: n, popupPosition: i } = u, [a, c] = h.useState(e.typesText), [s, l] = h.useState(e.destination), [d, $] = h.useState(e.page), [r, B] = h.useState(e.link || ""), [x, _] = h.useState(e.text || ""), [m, O] = h.useState(e.openInNewTab), { pages: q } = qt();
1338
+ return h.useEffect(() => {
1336
1339
  n({
1337
1340
  ...e,
1338
1341
  ...{
1339
- text: r,
1340
- link: d,
1342
+ text: x,
1343
+ link: r,
1341
1344
  destination: s,
1342
- typesText: a
1345
+ typesText: a,
1346
+ page: d,
1347
+ openInNewTab: m
1343
1348
  }
1344
1349
  });
1345
- }, [a, s, d, r]), /* @__PURE__ */ t.jsxs(
1350
+ }, [a, s, r, x, d, m]), /* @__PURE__ */ t.jsxs(
1346
1351
  "div",
1347
1352
  {
1348
- className: ot.modal,
1349
- onClick: (h) => {
1350
- h.stopPropagation();
1353
+ className: ct.modal,
1354
+ onClick: (b) => {
1355
+ b.stopPropagation();
1351
1356
  },
1352
1357
  style: {
1353
1358
  top: `${i.top}px`,
@@ -1355,10 +1360,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1355
1360
  },
1356
1361
  ref: o,
1357
1362
  children: [
1358
- /* @__PURE__ */ t.jsxs("div", { className: ot.top, children: [
1359
- /* @__PURE__ */ t.jsx("h3", { className: ot.title, children: e.type }),
1363
+ /* @__PURE__ */ t.jsxs("div", { className: ct.top, children: [
1364
+ /* @__PURE__ */ t.jsx("h3", { className: ct.title, children: e.type }),
1360
1365
  /* @__PURE__ */ t.jsx(
1361
- x,
1366
+ f,
1362
1367
  {
1363
1368
  name: "X",
1364
1369
  height: 20,
@@ -1368,13 +1373,13 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1368
1373
  }
1369
1374
  )
1370
1375
  ] }),
1371
- /* @__PURE__ */ t.jsxs("div", { className: ot.options, children: [
1376
+ /* @__PURE__ */ t.jsxs("div", { className: ct.options, children: [
1372
1377
  /* @__PURE__ */ t.jsx(
1373
1378
  tt,
1374
1379
  {
1375
1380
  label: "Destination",
1376
- onChange: (h) => l(h),
1377
- options: ["Go to Page", "Open Link"],
1381
+ onChange: (b) => l(b),
1382
+ options: ["Go to Page", "Open Link"].filter((b) => b !== s),
1378
1383
  value: s
1379
1384
  }
1380
1385
  ),
@@ -1382,16 +1387,15 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1382
1387
  tt,
1383
1388
  {
1384
1389
  label: "Go to",
1385
- onChange: () => {
1386
- },
1387
- options: [],
1388
- value: "Homepage"
1390
+ onChange: (b) => $(b),
1391
+ options: q ? Object.values(q).filter((b) => b.name !== d).map((b) => b.name) : [],
1392
+ value: d
1389
1393
  }
1390
1394
  ) : /* @__PURE__ */ t.jsx(
1391
- X,
1395
+ W,
1392
1396
  {
1393
- onChange: (h) => v(h),
1394
- value: d,
1397
+ onChange: (b) => B(b),
1398
+ value: r,
1395
1399
  placeholder: "https://",
1396
1400
  label: "Link"
1397
1401
  }
@@ -1399,21 +1403,22 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1399
1403
  /* @__PURE__ */ t.jsx(
1400
1404
  K,
1401
1405
  {
1402
- current: !1,
1403
- label: "Open in new tab"
1406
+ current: e.openInNewTab,
1407
+ label: "Open in new tab",
1408
+ onChange: (b) => O(b)
1404
1409
  }
1405
1410
  ),
1406
1411
  /* @__PURE__ */ t.jsx(
1407
- wt,
1412
+ Ct,
1408
1413
  {
1409
- onChange: (h) => w(h),
1410
- value: r,
1414
+ onChange: (b) => _(b),
1415
+ value: x,
1411
1416
  label: "Text",
1412
1417
  maxLength: 150
1413
1418
  }
1414
1419
  ),
1415
1420
  /* @__PURE__ */ t.jsx(
1416
- Pt,
1421
+ Bt,
1417
1422
  {
1418
1423
  typesText: a,
1419
1424
  setTypesText: c
@@ -1423,104 +1428,104 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1423
1428
  ]
1424
1429
  }
1425
1430
  );
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({
1431
+ }), zs = "_subtitle_m8qel_1", Ys = "_header_m8qel_8", Gs = "_text_m8qel_9", Ws = "_productsBlock_m8qel_10", Xs = "_buttonsBlock_m8qel_11", Js = "_top_m8qel_23", Qs = "_itemsBlock_m8qel_32", Ks = "_typeTexts_m8qel_38", Zs = "_block_m8qel_45", tn = "_active_m8qel_58", en = "_products_m8qel_10", sn = "_product_m8qel_10", nn = "_button_m8qel_11", on = "_image_m8qel_88", an = "_info_m8qel_95", cn = "_name_m8qel_107", ln = "_buttons_m8qel_11", rn = "_modal_m8qel_118", dn = "_other_m8qel_137", un = "_options_m8qel_143", ut = {
1432
+ subtitle: zs,
1433
+ header: Ys,
1434
+ text: Gs,
1435
+ productsBlock: Ws,
1436
+ buttonsBlock: Xs,
1437
+ top: Js,
1438
+ itemsBlock: Qs,
1439
+ typeTexts: Ks,
1440
+ block: Zs,
1441
+ active: tn,
1442
+ products: en,
1443
+ product: sn,
1444
+ button: nn,
1445
+ image: on,
1446
+ info: an,
1447
+ name: cn,
1448
+ buttons: ln,
1449
+ modal: rn,
1450
+ other: dn,
1451
+ options: un
1452
+ }, pn = (u) => {
1453
+ const { buttons: o, setButtons: e, deletable: n = !0, addable: i = !0 } = u, [a, c] = h.useState(null), [s, l] = h.useState({
1449
1454
  top: 0,
1450
1455
  left: 0
1451
- }), [d, v] = g.useState(null), r = g.useRef(null);
1452
- g.useEffect(() => {
1453
- const h = () => {
1456
+ }), [d, $] = h.useState(null), r = h.useRef(null);
1457
+ h.useEffect(() => {
1458
+ const x = () => {
1454
1459
  c(null);
1455
1460
  };
1456
- return document.body.addEventListener("click", h), c(null), () => {
1457
- c(null), document.body.removeEventListener("click", h);
1461
+ return document.body.addEventListener("click", x), c(null), () => {
1462
+ c(null), document.body.removeEventListener("click", x);
1458
1463
  };
1459
- }, []), g.useEffect(() => {
1464
+ }, []), h.useEffect(() => {
1460
1465
  if (a) {
1461
- const h = [...o].map((p) => p.id === a.id ? a : p);
1462
- e(h);
1466
+ const x = [...o].map((_) => _.id === a.id ? a : _);
1467
+ e(x);
1463
1468
  }
1464
- }, [a]), g.useEffect(() => {
1469
+ }, [a]), h.useEffect(() => {
1465
1470
  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: _,
1471
+ const x = r.current.getBoundingClientRect().height, _ = window.innerHeight;
1472
+ let m = d.top;
1473
+ m + x > _ + window.scrollY && (m = _ + window.scrollY - x - 200), m < 0 && (m = 10), l({
1474
+ top: m,
1470
1475
  left: d.left
1471
1476
  });
1472
1477
  }
1473
1478
  }, [r.current, d]);
1474
- const w = (h, p) => {
1475
- h.stopPropagation();
1476
- const _ = h.target.getBoundingClientRect();
1477
- v({
1478
- top: _.top + window.scrollY,
1479
- left: _.left - 30
1480
- }), c(p);
1479
+ const B = (x, _) => {
1480
+ x.stopPropagation();
1481
+ const m = x.target.getBoundingClientRect();
1482
+ $({
1483
+ top: m.top + window.scrollY,
1484
+ left: m.left - 30
1485
+ }), c(_);
1481
1486
  };
1482
- return /* @__PURE__ */ t.jsxs("div", { className: dt.products, children: [
1483
- /* @__PURE__ */ t.jsx("h5", { className: dt.subtitle, children: "Button Type" }),
1484
- o.map((h) => /* @__PURE__ */ t.jsxs(
1487
+ return /* @__PURE__ */ t.jsxs("div", { className: ut.products, children: [
1488
+ /* @__PURE__ */ t.jsx("h5", { className: ut.subtitle, children: "Button Type" }),
1489
+ o.map((x) => /* @__PURE__ */ t.jsxs(
1485
1490
  "div",
1486
1491
  {
1487
- className: dt.product,
1492
+ className: ut.product,
1488
1493
  children: [
1489
1494
  /* @__PURE__ */ t.jsx(
1490
1495
  tt,
1491
1496
  {
1492
- onChange: (p) => {
1493
- const q = [...o].map((b) => b.id === h.id ? {
1494
- ...h,
1495
- type: p
1496
- } : b);
1497
- e(q);
1497
+ onChange: (_) => {
1498
+ const O = [...o].map((q) => q.id === x.id ? {
1499
+ ...x,
1500
+ type: _
1501
+ } : q);
1502
+ e(O);
1498
1503
  },
1499
- value: h.type,
1504
+ value: x.type,
1500
1505
  options: ["Primary", "Secondary", "Tertiary"]
1501
1506
  }
1502
1507
  ),
1503
- /* @__PURE__ */ t.jsxs("div", { className: dt.buttons, children: [
1508
+ /* @__PURE__ */ t.jsxs("div", { className: ut.buttons, children: [
1504
1509
  /* @__PURE__ */ t.jsx(
1505
- x,
1510
+ f,
1506
1511
  {
1507
1512
  name: "Sliders",
1508
1513
  hoverable: !0,
1509
1514
  width: 20,
1510
1515
  height: 20,
1511
- onClick: (p) => {
1512
- w(p, h);
1516
+ onClick: (_) => {
1517
+ B(_, x);
1513
1518
  }
1514
1519
  }
1515
1520
  ),
1516
1521
  n && /* @__PURE__ */ t.jsx(
1517
- x,
1522
+ f,
1518
1523
  {
1519
1524
  name: "Trash",
1520
1525
  hoverable: !0,
1521
1526
  onClick: () => {
1522
- const p = o.filter((_) => _.id !== h.id);
1523
- e(p);
1527
+ const _ = o.filter((m) => m.id !== x.id);
1528
+ e(_);
1524
1529
  },
1525
1530
  width: 20,
1526
1531
  height: 20,
@@ -1530,10 +1535,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1530
1535
  ] })
1531
1536
  ]
1532
1537
  },
1533
- h.id
1538
+ x.id
1534
1539
  )),
1535
1540
  a && /* @__PURE__ */ t.jsx(
1536
- Rs,
1541
+ Us,
1537
1542
  {
1538
1543
  ref: r,
1539
1544
  activeButton: a,
@@ -1542,24 +1547,27 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1542
1547
  }
1543
1548
  ),
1544
1549
  i && /* @__PURE__ */ t.jsxs(
1545
- at,
1550
+ ot,
1546
1551
  {
1547
- className: dt.button,
1552
+ withoutHover: !0,
1553
+ className: ut.button,
1548
1554
  size: "s",
1549
1555
  onClick: () => {
1550
- const h = [...o];
1551
- h.push({
1556
+ const x = [...o];
1557
+ x.push({
1552
1558
  type: "Primary",
1553
- id: ct(),
1559
+ id: lt(),
1554
1560
  typesText: [],
1555
1561
  destination: "Go to Page",
1556
- text: "Button Name"
1557
- }), e(h);
1562
+ text: "Button Name",
1563
+ page: "home",
1564
+ openInNewTab: !0
1565
+ }), e(x);
1558
1566
  },
1559
1567
  children: [
1560
1568
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
1561
1569
  /* @__PURE__ */ t.jsx(
1562
- x,
1570
+ f,
1563
1571
  {
1564
1572
  name: "Plus",
1565
1573
  width: 16,
@@ -1570,11 +1578,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1570
1578
  }
1571
1579
  )
1572
1580
  ] });
1573
- }, Ao = (u) => {
1581
+ }, Vo = (u) => {
1574
1582
  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" }),
1583
+ return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: ct.buttonsBlock, children: [
1584
+ /* @__PURE__ */ t.jsxs("div", { className: ct.top, children: [
1585
+ /* @__PURE__ */ t.jsx("h3", { className: ct.title, children: "Buttons" }),
1578
1586
  /* @__PURE__ */ t.jsx(
1579
1587
  K,
1580
1588
  {
@@ -1584,63 +1592,63 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1584
1592
  )
1585
1593
  ] }),
1586
1594
  /* @__PURE__ */ t.jsx(
1587
- ln,
1595
+ pn,
1588
1596
  {
1589
1597
  buttons: n,
1590
1598
  setButtons: i
1591
1599
  }
1592
1600
  )
1593
1601
  ] }) });
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
- 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
1602
+ }, mn = "_wrapper_m18qi_1", hn = "_subtitle_m18qi_7", _n = "_content_m18qi_14", gn = "_range_m18qi_22", fn = "_track_m18qi_27", xn = "_progress_m18qi_36", bn = "_dots_m18qi_46", vn = "_dot_m18qi_46", jn = "_active_m18qi_65", yn = "_input_m18qi_77", kn = "_countBlock_m18qi_91", $n = "_count_m18qi_91", wn = "_controls_m18qi_107", Nn = "_button_m18qi_113", H = {
1603
+ wrapper: mn,
1604
+ subtitle: hn,
1605
+ content: _n,
1606
+ range: gn,
1607
+ track: fn,
1608
+ progress: xn,
1609
+ dots: bn,
1610
+ dot: vn,
1611
+ active: jn,
1612
+ input: yn,
1613
+ countBlock: kn,
1614
+ count: $n,
1615
+ controls: wn,
1616
+ button: Nn
1609
1617
  }, 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 = () => {
1618
+ const { label: o, min: e = 1, max: n = 4, step: i = 1, count: a, setCount: c } = u, [s, l] = h.useState(!1), d = Array.from({ length: (n - e) / i + 1 }), $ = (a - e) / (n - e) * 100, r = () => {
1611
1619
  a < n && c(a + i);
1612
- }, w = () => {
1620
+ }, B = () => {
1613
1621
  a > e && c(a - i);
1614
- }, h = (p) => {
1615
- const _ = e + p * i;
1616
- c(_);
1622
+ }, x = (_) => {
1623
+ const m = e + _ * i;
1624
+ c(m);
1617
1625
  };
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 }),
1626
+ return /* @__PURE__ */ t.jsxs("div", { className: H.wrapper, children: [
1627
+ o && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: o }),
1628
+ /* @__PURE__ */ t.jsxs("div", { className: H.content, children: [
1629
+ /* @__PURE__ */ t.jsxs("div", { className: H.range, children: [
1630
+ /* @__PURE__ */ t.jsx("div", { className: H.track }),
1623
1631
  /* @__PURE__ */ t.jsx(
1624
1632
  "div",
1625
1633
  {
1626
- className: L.progress,
1627
- style: { width: `${v}%` }
1634
+ className: H.progress,
1635
+ style: { width: `${$}%` }
1628
1636
  }
1629
1637
  ),
1630
- /* @__PURE__ */ t.jsx("div", { className: L.dots, children: d.map((p, _) => {
1631
- const q = _ <= (a - e) / i;
1638
+ /* @__PURE__ */ t.jsx("div", { className: H.dots, children: d.map((_, m) => {
1639
+ const O = m <= (a - e) / i;
1632
1640
  return /* @__PURE__ */ t.jsx(
1633
1641
  "button",
1634
1642
  {
1635
- onClick: () => h(_),
1636
- className: Y(L.dot, {
1637
- [L.active]: q,
1638
- [L.inactive]: !q,
1639
- [L.dragging]: s
1643
+ onClick: () => x(m),
1644
+ className: V(H.dot, {
1645
+ [H.active]: O,
1646
+ [H.inactive]: !O,
1647
+ [H.dragging]: s
1640
1648
  }),
1641
- "aria-label": `Set value to ${e + _ * i}`
1649
+ "aria-label": `Set value to ${e + m * i}`
1642
1650
  },
1643
- _
1651
+ m
1644
1652
  );
1645
1653
  }) }),
1646
1654
  /* @__PURE__ */ t.jsx(
@@ -1651,40 +1659,40 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1651
1659
  max: n,
1652
1660
  step: i,
1653
1661
  value: a,
1654
- onChange: (p) => c(Number(p.target.value)),
1662
+ onChange: (_) => c(Number(_.target.value)),
1655
1663
  onMouseDown: () => l(!0),
1656
1664
  onMouseUp: () => l(!1),
1657
1665
  onTouchStart: () => l(!0),
1658
1666
  onTouchEnd: () => l(!1),
1659
- className: L.input
1667
+ className: H.input
1660
1668
  }
1661
1669
  )
1662
1670
  ] }),
1663
- /* @__PURE__ */ t.jsxs("div", { className: L.countBlock, children: [
1671
+ /* @__PURE__ */ t.jsxs("div", { className: H.countBlock, children: [
1664
1672
  /* @__PURE__ */ t.jsx(
1665
- X,
1673
+ W,
1666
1674
  {
1667
1675
  type: "number",
1668
1676
  min: e,
1669
1677
  max: n,
1670
1678
  paddingless: !0,
1671
- onChange: (p) => {
1672
- const _ = Number(p);
1673
- _ > n ? c(n) : _ < e ? c(e) : c(_);
1679
+ onChange: (_) => {
1680
+ const m = Number(_);
1681
+ m > n ? c(n) : m < e ? c(e) : c(m);
1674
1682
  },
1675
1683
  value: String(a)
1676
1684
  }
1677
1685
  ),
1678
- /* @__PURE__ */ t.jsxs("div", { className: L.controls, children: [
1686
+ /* @__PURE__ */ t.jsxs("div", { className: H.controls, children: [
1679
1687
  /* @__PURE__ */ t.jsx(
1680
1688
  "button",
1681
1689
  {
1682
1690
  onClick: r,
1683
1691
  disabled: a >= n,
1684
- className: L.button,
1692
+ className: H.button,
1685
1693
  "aria-label": "Increment count",
1686
1694
  children: /* @__PURE__ */ t.jsx(
1687
- x,
1695
+ f,
1688
1696
  {
1689
1697
  name: "CaretUp",
1690
1698
  width: 15,
@@ -1696,12 +1704,12 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1696
1704
  /* @__PURE__ */ t.jsx(
1697
1705
  "button",
1698
1706
  {
1699
- onClick: w,
1707
+ onClick: B,
1700
1708
  disabled: a <= e,
1701
- className: L.button,
1709
+ className: H.button,
1702
1710
  "aria-label": "Decrement count",
1703
1711
  children: /* @__PURE__ */ t.jsx(
1704
- x,
1712
+ f,
1705
1713
  {
1706
1714
  name: "CaretDown",
1707
1715
  width: 15,
@@ -1714,28 +1722,28 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1714
1722
  ] })
1715
1723
  ] })
1716
1724
  ] });
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) => {
1725
+ }, In = "_title_1hw31_1", Cn = "_subtitle_1hw31_5", Sn = "_header_1hw31_12", Tn = "_text_1hw31_13", Pn = "_productsBlock_1hw31_14", Bn = "_top_1hw31_26", An = "_itemsBlock_1hw31_35", On = "_typeTexts_1hw31_41", qn = "_block_1hw31_48", Dn = "_active_1hw31_61", En = "_products_1hw31_14", Ln = "_product_1hw31_14", Rn = "_button_1hw31_80", Mn = "_image_1hw31_91", Hn = "_info_1hw31_98", Fn = "_name_1hw31_110", Vn = "_buttons_1hw31_114", Un = "_modal_1hw31_121", zn = "_link_1hw31_141", Yn = "_modalOptions_1hw31_147", G = {
1726
+ title: In,
1727
+ subtitle: Cn,
1728
+ header: Sn,
1729
+ text: Tn,
1730
+ productsBlock: Pn,
1731
+ top: Bn,
1732
+ itemsBlock: An,
1733
+ typeTexts: On,
1734
+ block: qn,
1735
+ active: Dn,
1736
+ products: En,
1737
+ product: Ln,
1738
+ button: Rn,
1739
+ image: Mn,
1740
+ info: Hn,
1741
+ name: Fn,
1742
+ buttons: Vn,
1743
+ modal: Un,
1744
+ link: zn,
1745
+ modalOptions: Yn
1746
+ }, Gn = (u) => {
1739
1747
  const { activeItem: o, setActiveItem: e, popupPosition: n, setIsOpenModal: i, itemsOptions: a } = u, c = a.find((l) => l.id === o.listingId);
1740
1748
  if (!c) return null;
1741
1749
  function s(l, d) {
@@ -1744,7 +1752,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1744
1752
  return /* @__PURE__ */ t.jsxs(
1745
1753
  "div",
1746
1754
  {
1747
- className: U.modal,
1755
+ className: G.modal,
1748
1756
  onClick: (l) => {
1749
1757
  l.stopPropagation();
1750
1758
  },
@@ -1753,10 +1761,10 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1753
1761
  left: `${n.left}px`
1754
1762
  },
1755
1763
  children: [
1756
- /* @__PURE__ */ t.jsxs("div", { className: U.top, children: [
1764
+ /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
1757
1765
  /* @__PURE__ */ t.jsx("h3", { children: s(c.productData.name, 20) }),
1758
1766
  /* @__PURE__ */ t.jsx(
1759
- x,
1767
+ f,
1760
1768
  {
1761
1769
  name: "X",
1762
1770
  height: 20,
@@ -1768,7 +1776,7 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1768
1776
  }
1769
1777
  )
1770
1778
  ] }),
1771
- /* @__PURE__ */ t.jsx("div", { className: U.modalOptions, children: /* @__PURE__ */ t.jsx(
1779
+ /* @__PURE__ */ t.jsx("div", { className: G.modalOptions, children: /* @__PURE__ */ t.jsx(
1772
1780
  ht,
1773
1781
  {
1774
1782
  label: "Put up an attractive image",
@@ -1785,13 +1793,13 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1785
1793
  ]
1786
1794
  }
1787
1795
  );
1788
- }, Fn = (u) => {
1789
- const { index: o, moveProduct: e, children: n } = u, [, i] = yt({
1796
+ }, Wn = (u) => {
1797
+ const { index: o, moveProduct: e, children: n } = u, [, i] = kt({
1790
1798
  accept: "product",
1791
1799
  hover(s) {
1792
1800
  s.index !== o && (e(s.index, o), s.index = o);
1793
1801
  }
1794
- }), [{ isDragging: a }, c] = kt({
1802
+ }), [{ isDragging: a }, c] = $t({
1795
1803
  type: "product",
1796
1804
  item: { index: o },
1797
1805
  collect: (s) => ({
@@ -1802,11 +1810,11 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1802
1810
  "div",
1803
1811
  {
1804
1812
  ref: (s) => c(i(s)),
1805
- className: `${U.product} ${a ? U.dragging : ""}`,
1813
+ className: `${G.product} ${a ? G.dragging : ""}`,
1806
1814
  children: n
1807
1815
  }
1808
1816
  );
1809
- }, Oo = (u) => {
1817
+ }, Uo = (u) => {
1810
1818
  const {
1811
1819
  isActiveItems: o,
1812
1820
  setIsActiveItems: e,
@@ -1817,52 +1825,52 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1817
1825
  subtitle: s,
1818
1826
  editable: l = !0,
1819
1827
  draggable: d = !1,
1820
- withImage: v = !1,
1828
+ withImage: $ = !1,
1821
1829
  deletable: r = !0,
1822
- addable: w = !0,
1823
- itemsType: h,
1824
- itemsOptions: p
1825
- } = u, [_, q] = g.useState(null), [b, T] = g.useState({
1830
+ addable: B = !0,
1831
+ itemsType: x,
1832
+ itemsOptions: _
1833
+ } = u, [m, O] = h.useState(null), [q, b] = h.useState({
1826
1834
  top: 0,
1827
1835
  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);
1836
+ }), [D, C] = h.useState(!1), S = (k, y) => {
1837
+ const N = [...n], [E] = N.splice(k, 1);
1838
+ N.splice(y, 0, E), i(N);
1831
1839
  };
1832
- g.useEffect(() => {
1833
- const j = () => {
1834
- q(null), N(!1);
1840
+ h.useEffect(() => {
1841
+ const k = () => {
1842
+ O(null), C(!1);
1835
1843
  };
1836
- return document.body.addEventListener("click", j), q(null), N(!1), () => {
1837
- q(null), N(!1), document.body.removeEventListener("click", j);
1844
+ return document.body.addEventListener("click", k), O(null), C(!1), () => {
1845
+ O(null), C(!1), document.body.removeEventListener("click", k);
1838
1846
  };
1839
- }, []), g.useEffect(() => {
1840
- if (_) {
1841
- const j = [...n].map((y) => y.listingId === _.listingId ? _ : y);
1842
- i(j);
1847
+ }, []), h.useEffect(() => {
1848
+ if (m) {
1849
+ const k = [...n].map((y) => y.listingId === m.listingId ? m : y);
1850
+ i(k);
1843
1851
  }
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);
1852
+ }, [m]);
1853
+ const g = (k, y) => {
1854
+ k.stopPropagation();
1855
+ const N = k.target.getBoundingClientRect(), E = 100, L = window.innerHeight;
1856
+ let U = N.top + window.scrollY;
1857
+ U + E > L && (U = L - E - 20), C(!0), b({
1858
+ top: U - 80,
1859
+ left: N.left - 30
1860
+ }), O(y);
1853
1861
  };
1854
- function V(j) {
1855
- if (v)
1856
- return j ? /* @__PURE__ */ t.jsx(
1862
+ function j(k) {
1863
+ if ($)
1864
+ return k ? /* @__PURE__ */ t.jsx(
1857
1865
  "img",
1858
1866
  {
1859
- src: `https://imagedelivery.net/${j}/w=1000`,
1867
+ src: `https://imagedelivery.net/${k}/w=1000`,
1860
1868
  alt: "image",
1861
1869
  width: 16,
1862
1870
  height: 16
1863
1871
  }
1864
1872
  ) : /* @__PURE__ */ t.jsx(
1865
- x,
1873
+ f,
1866
1874
  {
1867
1875
  name: "Image",
1868
1876
  width: 16,
@@ -1871,12 +1879,12 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1871
1879
  }
1872
1880
  );
1873
1881
  }
1874
- const G = (j, y) => {
1875
- const E = p.find((z) => j.listingId === z.id);
1876
- if (!E) return null;
1877
- const D = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1882
+ const M = (k, y) => {
1883
+ const N = _.find((L) => k.listingId === L.id);
1884
+ if (!N) return null;
1885
+ const E = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1878
1886
  d && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
1879
- x,
1887
+ f,
1880
1888
  {
1881
1889
  name: "DotsSixVertical",
1882
1890
  hoverable: !0,
@@ -1884,116 +1892,117 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
1884
1892
  height: 20
1885
1893
  }
1886
1894
  ) }, y),
1887
- h === "select" && /* @__PURE__ */ t.jsx(
1895
+ x === "select" && /* @__PURE__ */ t.jsx(
1888
1896
  tt,
1889
1897
  {
1890
- onChange: (z) => {
1891
- const M = [...n], et = p.find((S) => S.productData.name === z);
1898
+ onChange: (L) => {
1899
+ const U = [...n], et = _.find((A) => A.productData.name === L);
1892
1900
  if (!et) return;
1893
- const it = {
1901
+ const at = {
1894
1902
  listingId: et.id,
1895
1903
  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]);
1904
+ }, v = U.map((A) => A.listingId === k.listingId ? at : A);
1905
+ O(at), i([...v]);
1898
1906
  },
1899
- value: E.productData.name,
1907
+ value: N.productData.name,
1900
1908
  options: [
1901
- ...p.filter((z) => !n.find((M) => M.listingId === z.id)).map((z) => z.productData.name)
1909
+ ..._.filter((L) => !n.find((U) => U.listingId === L.id)).map((L) => L.productData.name)
1902
1910
  ],
1903
- leftAddon: V(
1904
- j.image || E.productData.images.length > 0 && E.productData.images[0].cfId || ""
1911
+ leftAddon: j(
1912
+ k.image || N.productData.images.length > 0 && N.productData.images[0].cfId || ""
1905
1913
  )
1906
1914
  },
1907
1915
  y
1908
1916
  ),
1909
- /* @__PURE__ */ t.jsxs("div", { className: U.buttons, children: [
1917
+ /* @__PURE__ */ t.jsxs("div", { className: G.buttons, children: [
1910
1918
  l && /* @__PURE__ */ t.jsx(
1911
- x,
1919
+ f,
1912
1920
  {
1913
1921
  name: "Sliders",
1914
1922
  hoverable: !0,
1915
1923
  width: 20,
1916
1924
  height: 20,
1917
- onClick: (z) => B(z, j)
1925
+ onClick: (L) => g(L, k)
1918
1926
  }
1919
1927
  ),
1920
1928
  r && /* @__PURE__ */ t.jsx(
1921
- x,
1929
+ f,
1922
1930
  {
1923
1931
  name: "Trash",
1924
1932
  hoverable: !0,
1925
1933
  width: 20,
1926
1934
  height: 20,
1927
1935
  fill: "#C12A2A",
1928
- onClick: () => i(n.filter((z) => z !== j))
1936
+ onClick: () => i(n.filter((L) => L !== k))
1929
1937
  }
1930
1938
  )
1931
1939
  ] })
1932
1940
  ] });
1933
1941
  return d ? /* @__PURE__ */ t.jsx(
1934
- Fn,
1942
+ Wn,
1935
1943
  {
1936
- product: j,
1944
+ product: k,
1937
1945
  index: y,
1938
- moveProduct: C,
1939
- children: D
1946
+ moveProduct: S,
1947
+ children: E
1940
1948
  },
1941
- j.listingId
1949
+ k.listingId
1942
1950
  ) : /* @__PURE__ */ t.jsx(
1943
1951
  "div",
1944
1952
  {
1945
- className: U.product,
1946
- children: D
1953
+ className: G.product,
1954
+ children: E
1947
1955
  },
1948
- j.listingId
1956
+ k.listingId
1949
1957
  );
1950
1958
  };
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 }),
1959
+ return /* @__PURE__ */ t.jsxs("div", { className: G.productsBlock, children: [
1960
+ (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
1961
+ c && /* @__PURE__ */ t.jsx("h3", { className: G.title, children: c }),
1954
1962
  o !== void 0 && /* @__PURE__ */ t.jsx(
1955
1963
  K,
1956
1964
  {
1957
1965
  current: o,
1958
- onChange: (j) => e == null ? void 0 : e(j)
1966
+ onChange: (k) => e == null ? void 0 : e(k)
1959
1967
  }
1960
1968
  )
1961
1969
  ] }),
1962
- O && _ && /* @__PURE__ */ t.jsx(
1963
- Vn,
1970
+ D && m && /* @__PURE__ */ t.jsx(
1971
+ Gn,
1964
1972
  {
1965
- activeItem: _,
1966
- setActiveItem: q,
1967
- setIsOpenModal: N,
1968
- popupPosition: b,
1969
- itemsOptions: p
1973
+ activeItem: m,
1974
+ setActiveItem: O,
1975
+ setIsOpenModal: C,
1976
+ popupPosition: q,
1977
+ itemsOptions: _
1970
1978
  }
1971
1979
  ),
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,
1980
+ /* @__PURE__ */ t.jsxs("div", { className: G.products, children: [
1981
+ s && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: s }),
1982
+ d ? /* @__PURE__ */ t.jsx(jt, { backend: yt, children: n.map((k, y) => M(k, y)) }) : n.map((k, y) => M(k, y)),
1983
+ B && /* @__PURE__ */ t.jsxs(
1984
+ ot,
1977
1985
  {
1978
- className: U.button,
1986
+ withoutHover: !0,
1987
+ className: G.button,
1979
1988
  size: "s",
1980
1989
  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 : ""
1990
+ const k = [...n];
1991
+ for (let y = 0; y < _.length; y++)
1992
+ if (!n.find((N) => N.listingId === _[y].id)) {
1993
+ k.push({
1994
+ listingId: _[y].id,
1995
+ image: _[y].productData.images.length > 0 ? _[y].productData.images[0].cfId : ""
1987
1996
  });
1988
1997
  break;
1989
1998
  }
1990
- i(j);
1999
+ i(k);
1991
2000
  },
1992
- disabled: n.length === p.length,
2001
+ disabled: n.length === _.length,
1993
2002
  children: [
1994
2003
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
1995
2004
  /* @__PURE__ */ t.jsx(
1996
- x,
2005
+ f,
1997
2006
  {
1998
2007
  name: "Plus",
1999
2008
  width: 16,
@@ -2004,135 +2013,163 @@ const qt = "_wrapper_9rr5j_2", At = "_alignmentBlock_9rr5j_8", Ot = "_title_9rr5
2004
2013
  }
2005
2014
  )
2006
2015
  ] }),
2007
- a !== void 0 && /* @__PURE__ */ t.jsx(xt, { items: a })
2016
+ a !== void 0 && /* @__PURE__ */ t.jsx(ft, { items: a })
2008
2017
  ] });
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
2018
+ }, Xn = "_options_1w11v_1", Jn = "_price_1w11v_12", Qn = "_oldPrice_1w11v_19", Kn = "_newPrice_1w11v_27", Zn = "_animate_1w11v_34", ti = "_appearAndBounce_1w11v_1", ei = "_meta_1w11v_52", si = "_info_1w11v_58", ni = "_infoRight_1w11v_66", ii = "_buttons_1w11v_73", oi = "_variants_1w11v_80", ai = "_variant_1w11v_80", ci = "_stock_1w11v_97", li = "_variantInfo_1w11v_104", ri = "_quantity_1w11v_110", di = "_count_1w11v_117", ui = "_focused_1w11v_134", pi = "_button_1w11v_73", mi = "_activeVariant_1w11v_160", hi = "_chargeTypes_1w11v_164", _i = "_charge_1w11v_164", gi = "_chargeActive_1w11v_185", fi = "_title_1w11v_190", I = {
2019
+ options: Xn,
2020
+ price: Jn,
2021
+ oldPrice: Qn,
2022
+ newPrice: Kn,
2023
+ animate: Zn,
2024
+ appearAndBounce: ti,
2025
+ meta: ei,
2026
+ info: si,
2027
+ infoRight: ni,
2028
+ buttons: ii,
2029
+ variants: oi,
2030
+ variant: ai,
2031
+ stock: ci,
2032
+ variantInfo: li,
2033
+ quantity: ri,
2034
+ count: di,
2035
+ focused: ui,
2036
+ button: pi,
2037
+ activeVariant: mi,
2038
+ chargeTypes: hi,
2039
+ charge: _i,
2040
+ chargeActive: gi,
2041
+ title: fi
2030
2042
  };
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({
2043
+ var Ot = /* @__PURE__ */ ((u) => (u.ONE_TIME = "One-Time", u.RECURRING = "Subscribe & Save", u))(Ot || {});
2044
+ const zo = (u) => {
2045
+ var C, S;
2046
+ const { variants: o } = u, [e, n] = h.useState(o[0]), [i, a] = h.useState(e.chargeTypes[0]), c = gt(), [s, l] = h.useState(1), [d, $] = h.useState(!1), { reset: r, addProductToCart: B, getProducts: x } = wt(), [_, m] = h.useState(!1);
2047
+ h.useEffect(() => {
2048
+ m(!0);
2049
+ const g = setTimeout(() => m(!1), 600);
2050
+ return () => clearTimeout(g);
2051
+ }, [s]);
2052
+ async function O() {
2053
+ await x(), await B({
2037
2054
  productId: u.id,
2038
2055
  productVariantId: e.id,
2039
2056
  quantity: s
2040
2057
  });
2041
2058
  }
2042
- function h() {
2043
- d(), w(), c("/checkout");
2059
+ function q() {
2060
+ r(), O(), c("/checkout");
2044
2061
  }
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"}`;
2062
+ function b(g) {
2063
+ if (g >= 864e5) {
2064
+ const N = Math.floor(g / 864e5);
2065
+ return `${N} ${N === 1 ? "day" : "days"}`;
2066
+ } else if (g >= 36e5) {
2067
+ const N = Math.floor(g / 36e5);
2068
+ return `${N} ${N === 1 ? "hour" : "hours"}`;
2069
+ } else if (g >= 6e4) {
2070
+ const N = Math.floor(g / 6e4);
2071
+ return `${N} ${N === 1 ? "minute" : "minutes"}`;
2055
2072
  } else {
2056
- const B = Math.floor(b / 1e3);
2057
- return `${B} ${B === 1 ? "second" : "seconds"}`;
2073
+ const N = Math.floor(g / 1e3);
2074
+ return `${N} ${N === 1 ? "second" : "seconds"}`;
2058
2075
  }
2059
2076
  }
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(
2077
+ function D(g, j) {
2078
+ return g.length > j ? g.slice(0, j) + "..." : g;
2079
+ }
2080
+ return /* @__PURE__ */ t.jsxs("div", { className: I.options, children: [
2081
+ e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: I.chargeTypes, children: e.chargeTypes.map((g) => /* @__PURE__ */ t.jsx(
2073
2082
  "div",
2074
2083
  {
2075
- className: Y(P.variant, {
2076
- [P.activeVariant]: e.id === b.id
2084
+ className: V(I.charge, {
2085
+ [I.chargeActive]: i === g
2077
2086
  }),
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
- ]
2087
+ onClick: () => a(g),
2088
+ children: Ot[g]
2093
2089
  },
2094
- b.id
2090
+ g
2095
2091
  )) }),
2096
- i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: P.quantity, children: [
2092
+ /* @__PURE__ */ t.jsx("div", { className: I.variants, children: o.map((g) => {
2093
+ var j;
2094
+ return /* @__PURE__ */ t.jsxs(
2095
+ "div",
2096
+ {
2097
+ className: V(I.variant, {
2098
+ [I.activeVariant]: e.id === g.id
2099
+ }),
2100
+ onClick: () => n(g),
2101
+ children: [
2102
+ /* @__PURE__ */ t.jsxs("div", { className: I.variantInfo, children: [
2103
+ /* @__PURE__ */ t.jsx("span", { className: I.title, children: D(g.name, 15) }),
2104
+ /* @__PURE__ */ t.jsxs("span", { children: [
2105
+ "$",
2106
+ i === "ONE_TIME" ? g.price.amount : g.subscriptionSettings ? g.subscriptionSettings.price.amount : "Price Not Found"
2107
+ ] })
2108
+ ] }),
2109
+ /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: I.stock, children: [
2110
+ ((j = g.quantity.restrictions) == null ? void 0 : j.max) || g.quantity.available || 0,
2111
+ " in stock"
2112
+ ] }) })
2113
+ ]
2114
+ },
2115
+ g.id
2116
+ );
2117
+ }) }),
2118
+ i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: I.quantity, children: [
2097
2119
  /* @__PURE__ */ t.jsx(
2098
2120
  "button",
2099
2121
  {
2100
2122
  onClick: () => {
2101
- s > 1 ? l((b) => b - 1) : l(1);
2123
+ s > 1 ? l((g) => g - 1) : l(1);
2102
2124
  },
2103
- className: P.button,
2125
+ className: I.button,
2104
2126
  disabled: e.quantity.restrictions && s <= e.quantity.restrictions.min,
2105
- children: /* @__PURE__ */ t.jsx(x, { name: "Minus" })
2127
+ children: /* @__PURE__ */ t.jsx(f, { name: "Minus" })
2106
2128
  }
2107
2129
  ),
2108
2130
  /* @__PURE__ */ t.jsx(
2109
- "input",
2131
+ "label",
2110
2132
  {
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
2133
+ className: V(I.count, {
2134
+ [I.focused]: d
2135
+ }),
2136
+ onFocus: () => $(!0),
2137
+ onBlur: () => $(!1),
2138
+ children: /* @__PURE__ */ t.jsx(
2139
+ W,
2140
+ {
2141
+ type: "number",
2142
+ value: String(s),
2143
+ onChange: (g) => l(Number(g)),
2144
+ max: ((C = e.quantity.restrictions) == null ? void 0 : C.max) || e.quantity.available || 1 / 0,
2145
+ min: ((S = e.quantity.restrictions) == null ? void 0 : S.min) || 0,
2146
+ style: {
2147
+ backgroundColor: "transparent",
2148
+ border: "none",
2149
+ textAlign: "center"
2150
+ }
2151
+ }
2152
+ )
2116
2153
  }
2117
2154
  ),
2118
2155
  /* @__PURE__ */ t.jsx(
2119
2156
  "button",
2120
2157
  {
2121
2158
  onClick: () => {
2122
- l((b) => b + 1);
2159
+ l((g) => g + 1);
2123
2160
  },
2124
- className: P.button,
2125
- disabled: e.quantity.restrictions && s >= e.quantity.restrictions.max,
2126
- children: /* @__PURE__ */ t.jsx(x, { name: "Plus" })
2161
+ className: I.button,
2162
+ disabled: !!(e.quantity.restrictions && s >= e.quantity.restrictions.max || e.quantity.available && s >= e.quantity.available),
2163
+ children: /* @__PURE__ */ t.jsx(f, { name: "Plus" })
2127
2164
  }
2128
2165
  )
2129
2166
  ] }),
2130
- /* @__PURE__ */ t.jsxs("div", { className: P.meta, children: [
2131
- /* @__PURE__ */ t.jsxs("div", { className: P.info, children: [
2167
+ /* @__PURE__ */ t.jsxs("div", { className: I.meta, children: [
2168
+ /* @__PURE__ */ t.jsxs("div", { className: I.info, children: [
2132
2169
  /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
2133
- /* @__PURE__ */ t.jsxs("div", { className: P.infoRight, children: [
2170
+ /* @__PURE__ */ t.jsxs("div", { className: I.infoRight, children: [
2134
2171
  /* @__PURE__ */ t.jsx(
2135
- x,
2172
+ f,
2136
2173
  {
2137
2174
  name: "Lightning",
2138
2175
  fill: "#FF3F19",
@@ -2140,112 +2177,118 @@ const Do = (u) => {
2140
2177
  height: 20
2141
2178
  }
2142
2179
  ),
2143
- /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : p(e.deliveryTime) })
2180
+ /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : b(e.deliveryTime) })
2144
2181
  ] })
2145
2182
  ] }),
2146
- /* @__PURE__ */ t.jsxs("div", { className: P.info, children: [
2183
+ /* @__PURE__ */ t.jsxs("div", { className: I.info, children: [
2147
2184
  /* @__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: [
2185
+ /* @__PURE__ */ t.jsx("div", { className: I.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: I.price, children: [
2186
+ /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: _ }), children: [
2150
2187
  "$ ",
2151
2188
  (e.price.amount || 0) * s
2152
2189
  ] }),
2153
- /* @__PURE__ */ t.jsxs("span", { className: P.oldPrice, children: [
2190
+ /* @__PURE__ */ t.jsxs("span", { className: I.oldPrice, children: [
2154
2191
  "$ ",
2155
2192
  (e.compareAtPrice.amount || 0) * s
2156
2193
  ] })
2157
- ] }) : /* @__PURE__ */ t.jsxs("span", { className: P.newPrice, children: [
2194
+ ] }) : /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: _ }), children: [
2158
2195
  "$ ",
2159
2196
  (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: [
2197
+ ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: I.price, children: [
2198
+ /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: _ }), children: [
2162
2199
  "$ ",
2163
2200
  e.subscriptionSettings.price.amount || 0
2164
2201
  ] }),
2165
- /* @__PURE__ */ t.jsxs("span", { className: P.oldPrice, children: [
2202
+ /* @__PURE__ */ t.jsxs("span", { className: I.oldPrice, children: [
2166
2203
  "$ ",
2167
2204
  e.subscriptionSettings.compareAtPrice.amount || 0
2168
2205
  ] })
2169
- ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: P.newPrice, children: [
2206
+ ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: _ }), children: [
2170
2207
  "$ ",
2171
2208
  e.subscriptionSettings.price.amount || 0
2172
2209
  ] }) })
2173
2210
  ] })
2174
2211
  ] }),
2175
- /* @__PURE__ */ t.jsxs("div", { className: P.buttons, children: [
2212
+ /* @__PURE__ */ t.jsxs("div", { className: I.buttons, children: [
2176
2213
  /* @__PURE__ */ t.jsx(
2177
- at,
2214
+ ot,
2178
2215
  {
2179
2216
  type: "Primary",
2180
- onClick: () => h(),
2217
+ onClick: () => q(),
2181
2218
  children: /* @__PURE__ */ t.jsx("span", { children: i === "ONE_TIME" ? "Buy Now" : "Subscribe Now" })
2182
2219
  }
2183
2220
  ),
2184
2221
  i === "ONE_TIME" && /* @__PURE__ */ t.jsx(
2185
- at,
2222
+ ot,
2186
2223
  {
2187
2224
  type: "Secondary",
2188
- onClick: () => w(),
2225
+ onClick: () => O(),
2189
2226
  children: "Add to Cart"
2190
2227
  }
2191
2228
  )
2192
2229
  ] })
2193
2230
  ] });
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) => {
2232
- const { children: o, onClick: e, style: n, className: i, disabled: a = !1, type: c = "Primary" } = u;
2231
+ }, xi = "_button_1861a_1", bi = "_login_1861a_14", vi = "_signUp_1861a_18", ji = "_buttons_1861a_23", yi = "_modal_1861a_32", ki = "_info_1861a_60", $i = "_top_1861a_67", wi = "_title_1861a_78", Ni = "_clear_1861a_84", Ii = "_activeClear_1861a_91", Ci = "_count_1861a_95", Si = "_cart_1861a_110", Ti = "_empty_1861a_118", Pi = "_product_1861a_144", Bi = "_products_1861a_153", Ai = "_image_1861a_161", Oi = "_productInfo_1861a_167", qi = "_content_1861a_174", Di = "_name_1861a_180", Ei = "_price_1861a_186", Li = "_productButtons_1861a_192", Ri = "_productButton_1861a_192", Mi = "_productCount_1861a_212", Hi = "_bottom_1861a_228", Fi = "_subtotal_1861a_236", Vi = "_block_1861a_244", Ui = "_shoppingCount_1861a_251", zi = "_total_1861a_271", Yi = "_link_1861a_277", Gi = "_userInfo_1861a_284", P = {
2232
+ button: xi,
2233
+ login: bi,
2234
+ signUp: vi,
2235
+ buttons: ji,
2236
+ modal: yi,
2237
+ info: ki,
2238
+ top: $i,
2239
+ title: wi,
2240
+ clear: Ni,
2241
+ activeClear: Ii,
2242
+ count: Ci,
2243
+ cart: Si,
2244
+ empty: Ti,
2245
+ product: Pi,
2246
+ products: Bi,
2247
+ image: Ai,
2248
+ productInfo: Oi,
2249
+ content: qi,
2250
+ name: Di,
2251
+ price: Ei,
2252
+ productButtons: Li,
2253
+ productButton: Ri,
2254
+ productCount: Mi,
2255
+ bottom: Hi,
2256
+ subtotal: Fi,
2257
+ block: Vi,
2258
+ shoppingCount: Ui,
2259
+ total: zi,
2260
+ link: Yi,
2261
+ userInfo: Gi
2262
+ }, Wi = "_button_bymeg_1", Xi = "_primary_bymeg_19", Ji = "_primaryHovered_bymeg_30", Qi = "_secondary_bymeg_34", Ki = "_secondaryHovered_bymeg_44", Zi = "_tertiary_bymeg_48", to = "_tertiaryHovered_bymeg_58", eo = "_content_bymeg_62", nt = {
2263
+ button: Wi,
2264
+ primary: Xi,
2265
+ primaryHovered: Ji,
2266
+ secondary: Qi,
2267
+ secondaryHovered: Ki,
2268
+ tertiary: Zi,
2269
+ tertiaryHovered: to,
2270
+ content: eo
2271
+ }, vt = (u) => {
2272
+ const { children: o, onClick: e, style: n, className: i, disabled: a = !1, type: c = "Primary" } = u, { themeSettings: s } = St();
2233
2273
  return /* @__PURE__ */ t.jsx(
2234
2274
  "button",
2235
2275
  {
2236
- className: Y(ut.button, i, {
2237
- [ut.primary]: c === "Primary",
2238
- [ut.secondary]: c === "Secondary",
2239
- [ut.tertiary]: c === "Tertiary"
2276
+ className: V(nt.button, i, {
2277
+ [nt.primary]: c === "Primary",
2278
+ [nt.secondary]: c === "Secondary",
2279
+ [nt.tertiary]: c === "Tertiary",
2280
+ [nt.primaryHovered]: c === "Primary" && !a && s.buttons.primary.hover,
2281
+ [nt.secondaryHovered]: c === "Secondary" && !a && s.buttons.secondary.hover,
2282
+ [nt.tertiaryHovered]: c === "Tertiary" && !a && s.buttons.tertiary.hover
2240
2283
  }),
2241
2284
  onClick: e,
2242
2285
  style: {
2243
2286
  ...n
2244
2287
  },
2245
2288
  disabled: a,
2246
- children: c === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: ut.content, children: [
2289
+ children: c === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: nt.content, children: [
2247
2290
  /* @__PURE__ */ t.jsx(
2248
- x,
2291
+ f,
2249
2292
  {
2250
2293
  name: "ArrowRight",
2251
2294
  fill: "#757575",
@@ -2258,16 +2301,16 @@ const Do = (u) => {
2258
2301
  }
2259
2302
  );
2260
2303
  };
2261
- class _t extends Error {
2304
+ class mt extends Error {
2262
2305
  }
2263
- _t.prototype.name = "InvalidTokenError";
2264
- function Gi(u) {
2306
+ mt.prototype.name = "InvalidTokenError";
2307
+ function so(u) {
2265
2308
  return decodeURIComponent(atob(u).replace(/(.)/g, (o, e) => {
2266
2309
  let n = e.charCodeAt(0).toString(16).toUpperCase();
2267
2310
  return n.length < 2 && (n = "0" + n), "%" + n;
2268
2311
  }));
2269
2312
  }
2270
- function Wi(u) {
2313
+ function no(u) {
2271
2314
  let o = u.replace(/-/g, "+").replace(/_/g, "/");
2272
2315
  switch (o.length % 4) {
2273
2316
  case 0:
@@ -2282,115 +2325,121 @@ function Wi(u) {
2282
2325
  throw new Error("base64 string is not of the correct length");
2283
2326
  }
2284
2327
  try {
2285
- return Gi(o);
2328
+ return so(o);
2286
2329
  } catch {
2287
2330
  return atob(o);
2288
2331
  }
2289
2332
  }
2290
- function Xi(u, o) {
2333
+ function io(u, o) {
2291
2334
  if (typeof u != "string")
2292
- throw new _t("Invalid token specified: must be a string");
2335
+ throw new mt("Invalid token specified: must be a string");
2293
2336
  o || (o = {});
2294
2337
  const e = o.header === !0 ? 0 : 1, n = u.split(".")[e];
2295
2338
  if (typeof n != "string")
2296
- throw new _t(`Invalid token specified: missing part #${e + 1}`);
2339
+ throw new mt(`Invalid token specified: missing part #${e + 1}`);
2297
2340
  let i;
2298
2341
  try {
2299
- i = Wi(n);
2342
+ i = no(n);
2300
2343
  } catch (a) {
2301
- throw new _t(`Invalid token specified: invalid base64 for part #${e + 1} (${a.message})`);
2344
+ throw new mt(`Invalid token specified: invalid base64 for part #${e + 1} (${a.message})`);
2302
2345
  }
2303
2346
  try {
2304
2347
  return JSON.parse(i);
2305
2348
  } catch (a) {
2306
- throw new _t(`Invalid token specified: invalid json for part #${e + 1} (${a.message})`);
2349
+ throw new mt(`Invalid token specified: invalid json for part #${e + 1} (${a.message})`);
2307
2350
  }
2308
2351
  }
2309
- const zo = (u) => {
2352
+ const Yo = (u) => {
2310
2353
  const { shopping: o, signUp: e } = u, n = gt();
2311
2354
  function i(c) {
2312
2355
  n(c);
2313
2356
  }
2314
2357
  const a = JSON.parse(localStorage.getItem("token") || "{}");
2315
- return /* @__PURE__ */ t.jsxs("div", { className: $.buttons, children: [
2316
- o && /* @__PURE__ */ t.jsx(Ji, {}),
2358
+ return /* @__PURE__ */ t.jsxs("div", { className: P.buttons, children: [
2359
+ o && /* @__PURE__ */ t.jsx(oo, {}),
2317
2360
  !a.data && /* @__PURE__ */ t.jsx(
2318
- "div",
2361
+ vt,
2319
2362
  {
2320
- className: Y($.button, $.login),
2321
2363
  onClick: () => i("/customer-dash"),
2364
+ type: "Secondary",
2365
+ style: {
2366
+ padding: 10
2367
+ },
2322
2368
  children: "Login"
2323
2369
  }
2324
2370
  ),
2325
2371
  !a.data && e && /* @__PURE__ */ t.jsx(
2326
- "div",
2372
+ vt,
2327
2373
  {
2328
- className: Y($.button, $.login, $.signUp),
2329
2374
  onClick: () => i("/customer-dash"),
2375
+ type: "Primary",
2376
+ style: {
2377
+ padding: 10
2378
+ },
2330
2379
  children: "Sign Up"
2331
2380
  }
2332
2381
  ),
2333
- a.data && /* @__PURE__ */ t.jsx(Zi, { token: a.data })
2382
+ a.data && /* @__PURE__ */ t.jsx(lo, { token: a.data })
2334
2383
  ] });
2335
- }, Ji = () => {
2336
- const [u, o] = g.useState(!1), [e, n] = g.useState([]), { cart: i, getProducts: a } = $t();
2337
- function c(v) {
2384
+ }, oo = () => {
2385
+ const [u, o] = h.useState(!1), [e, n] = h.useState([]), { cart: i, getProducts: a } = wt();
2386
+ function c($) {
2338
2387
  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)
2388
+ for (let B = 0; B < $.variants.length; B++)
2389
+ if (i.parts[r].productVariantId === $.variants[r].id)
2341
2390
  return i.parts[r].productVariantId;
2342
2391
  }
2343
- function s(v) {
2392
+ function s($) {
2344
2393
  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)
2394
+ for (let B = 0; B < $.variants.length; B++)
2395
+ if (i.parts[r].productVariantId === $.variants[r].id)
2347
2396
  return i.parts[r].quantity;
2348
2397
  }
2349
- g.useEffect(() => {
2398
+ h.useEffect(() => {
2350
2399
  (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)
2400
+ const r = i.parts.map((_) => String(_.productId)), x = (await a([...r])).map((_) => ({
2401
+ ..._,
2402
+ activeVariantId: c(_),
2403
+ quantity: s(_)
2355
2404
  }));
2356
- n(h);
2405
+ n(x);
2357
2406
  })();
2358
2407
  }, [i]);
2359
- function l(v) {
2408
+ function l($) {
2360
2409
  var r;
2361
- return !v || !(v != null && v.variants) ? !1 : (r = v.variants.find((w) => w.id === v.activeVariantId)) == null ? void 0 : r.subscriptionSettings;
2410
+ return !$ || !($ != null && $.variants) ? !1 : (r = $.variants.find((B) => B.id === $.activeVariantId)) == null ? void 0 : r.subscriptionSettings;
2362
2411
  }
2363
2412
  const d = i.parts.length > 0 && e.length > 0 && !l(e[0]);
2364
2413
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2365
2414
  /* @__PURE__ */ t.jsxs(
2366
2415
  "div",
2367
2416
  {
2368
- className: $.button,
2369
- onClick: (v) => {
2370
- v.stopPropagation(), o(!0);
2417
+ className: P.button,
2418
+ onClick: ($) => {
2419
+ $.stopPropagation(), window.location.pathname !== "/admin/builder" && o(!0);
2371
2420
  },
2372
2421
  children: [
2373
2422
  /* @__PURE__ */ t.jsx(
2374
- x,
2423
+ f,
2375
2424
  {
2376
2425
  name: "Handbag",
2377
2426
  fill: "var(--icon-primary)"
2378
2427
  }
2379
2428
  ),
2380
- d && /* @__PURE__ */ t.jsx("div", { className: $.shoppingCount, children: i.parts.length })
2429
+ d && /* @__PURE__ */ t.jsx("div", { className: P.shoppingCount, children: i.parts.length })
2381
2430
  ]
2382
2431
  }
2383
2432
  ),
2384
- u && /* @__PURE__ */ t.jsx(Ct, { close: o, children: /* @__PURE__ */ t.jsx(
2385
- Qi,
2433
+ u && /* @__PURE__ */ t.jsx(Tt, { close: o, children: /* @__PURE__ */ t.jsx(
2434
+ ao,
2386
2435
  {
2387
2436
  activeProducts: e,
2388
2437
  isCartNotEmpty: d
2389
2438
  }
2390
2439
  ) })
2391
2440
  ] });
2392
- }, Qi = (u) => {
2393
- const { activeProducts: o, isCartNotEmpty: e } = u, { cart: n, reset: i, getTotalAndDiscount: a, updateQuantityOfProduct: c } = $t(), s = gt();
2441
+ }, ao = (u) => {
2442
+ const { activeProducts: o, isCartNotEmpty: e } = u, { cart: n, reset: i, getTotalAndDiscount: a, updateQuantityOfProduct: c } = wt(), s = gt();
2394
2443
  function l(r) {
2395
2444
  s(r);
2396
2445
  }
@@ -2401,7 +2450,7 @@ const zo = (u) => {
2401
2450
  quantity: r.quantity + 1
2402
2451
  });
2403
2452
  }
2404
- function v(r) {
2453
+ function $(r) {
2405
2454
  c({
2406
2455
  productId: r.id,
2407
2456
  productVariantId: r.activeVariantId,
@@ -2411,19 +2460,19 @@ const zo = (u) => {
2411
2460
  return /* @__PURE__ */ t.jsxs(
2412
2461
  "div",
2413
2462
  {
2414
- className: $.modal,
2463
+ className: P.modal,
2415
2464
  onClick: (r) => r.stopPropagation(),
2416
2465
  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 })
2466
+ /* @__PURE__ */ t.jsxs("div", { className: P.top, children: [
2467
+ /* @__PURE__ */ t.jsxs("div", { className: P.info, children: [
2468
+ /* @__PURE__ */ t.jsx("span", { className: P.title, children: "Cart" }),
2469
+ e && /* @__PURE__ */ t.jsx("div", { className: P.count, children: n.parts.length })
2421
2470
  ] }),
2422
2471
  /* @__PURE__ */ t.jsx(
2423
2472
  "button",
2424
2473
  {
2425
- className: Y($.clear, {
2426
- [$.activeClear]: e
2474
+ className: V(P.clear, {
2475
+ [P.activeClear]: e
2427
2476
  }),
2428
2477
  disabled: !e,
2429
2478
  onClick: () => i(),
@@ -2431,13 +2480,13 @@ const zo = (u) => {
2431
2480
  }
2432
2481
  )
2433
2482
  ] }),
2434
- e ? /* @__PURE__ */ t.jsxs("div", { className: $.cart, children: [
2435
- /* @__PURE__ */ t.jsx("div", { className: $.products, children: o.map((r) => /* @__PURE__ */ t.jsxs(
2483
+ e ? /* @__PURE__ */ t.jsxs("div", { className: P.cart, children: [
2484
+ /* @__PURE__ */ t.jsx("div", { className: P.products, children: o.map((r) => /* @__PURE__ */ t.jsxs(
2436
2485
  "div",
2437
2486
  {
2438
- className: $.product,
2487
+ className: P.product,
2439
2488
  children: [
2440
- /* @__PURE__ */ t.jsxs("div", { className: $.productInfo, children: [
2489
+ /* @__PURE__ */ t.jsxs("div", { className: P.productInfo, children: [
2441
2490
  /* @__PURE__ */ t.jsx(
2442
2491
  "img",
2443
2492
  {
@@ -2445,27 +2494,27 @@ const zo = (u) => {
2445
2494
  alt: "image",
2446
2495
  width: "100%",
2447
2496
  height: "100%",
2448
- className: $.image
2497
+ className: P.image
2449
2498
  }
2450
2499
  ),
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: [
2500
+ /* @__PURE__ */ t.jsxs("div", { className: P.content, children: [
2501
+ /* @__PURE__ */ t.jsx("div", { className: P.name, children: r.name }),
2502
+ /* @__PURE__ */ t.jsxs("div", { className: P.price, children: [
2454
2503
  "$",
2455
- r.variants.find((w) => w.id === r.activeVariantId).price.amount * ((r == null ? void 0 : r.quantity) || 1)
2504
+ r.variants.find((B) => B.id === r.activeVariantId).price.amount * ((r == null ? void 0 : r.quantity) || 1)
2456
2505
  ] })
2457
2506
  ] })
2458
2507
  ] }),
2459
- /* @__PURE__ */ t.jsxs("div", { className: $.productButtons, children: [
2508
+ /* @__PURE__ */ t.jsxs("div", { className: P.productButtons, children: [
2460
2509
  /* @__PURE__ */ t.jsx(
2461
2510
  "div",
2462
2511
  {
2463
2512
  onClick: () => {
2464
- r.quantity !== 1 && v(r);
2513
+ r.quantity !== 1 && $(r);
2465
2514
  },
2466
- className: $.productButton,
2515
+ className: P.productButton,
2467
2516
  children: /* @__PURE__ */ t.jsx(
2468
- x,
2517
+ f,
2469
2518
  {
2470
2519
  name: "Minus",
2471
2520
  fill: "#757575",
@@ -2475,14 +2524,14 @@ const zo = (u) => {
2475
2524
  )
2476
2525
  }
2477
2526
  ),
2478
- /* @__PURE__ */ t.jsx("div", { className: $.productCount, children: r.quantity }),
2527
+ /* @__PURE__ */ t.jsx("div", { className: P.productCount, children: r.quantity }),
2479
2528
  /* @__PURE__ */ t.jsx(
2480
2529
  "div",
2481
2530
  {
2482
2531
  onClick: () => d(r),
2483
- className: $.productButton,
2532
+ className: P.productButton,
2484
2533
  children: /* @__PURE__ */ t.jsx(
2485
- x,
2534
+ f,
2486
2535
  {
2487
2536
  name: "Plus",
2488
2537
  fill: "#757575",
@@ -2497,12 +2546,12 @@ const zo = (u) => {
2497
2546
  },
2498
2547
  r.id
2499
2548
  )) }),
2500
- /* @__PURE__ */ t.jsxs("div", { className: $.bottom, children: [
2501
- /* @__PURE__ */ t.jsxs("div", { className: $.subtotal, children: [
2502
- /* @__PURE__ */ t.jsxs("div", { className: $.block, children: [
2549
+ /* @__PURE__ */ t.jsxs("div", { className: P.bottom, children: [
2550
+ /* @__PURE__ */ t.jsxs("div", { className: P.subtotal, children: [
2551
+ /* @__PURE__ */ t.jsxs("div", { className: P.block, children: [
2503
2552
  /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
2504
2553
  /* @__PURE__ */ t.jsx(
2505
- x,
2554
+ f,
2506
2555
  {
2507
2556
  name: "Info",
2508
2557
  width: 20,
@@ -2511,19 +2560,19 @@ const zo = (u) => {
2511
2560
  }
2512
2561
  )
2513
2562
  ] }),
2514
- /* @__PURE__ */ t.jsxs("div", { className: $.total, children: [
2563
+ /* @__PURE__ */ t.jsxs("div", { className: P.total, children: [
2515
2564
  "$",
2516
2565
  a().total
2517
2566
  ] })
2518
2567
  ] }),
2519
- /* @__PURE__ */ t.jsx(Yi, { onClick: () => l("/checkout"), children: "Checkout" })
2568
+ /* @__PURE__ */ t.jsx(vt, { onClick: () => l("/checkout"), children: "Checkout" })
2520
2569
  ] })
2521
- ] }) : /* @__PURE__ */ t.jsx(Ki, {})
2570
+ ] }) : /* @__PURE__ */ t.jsx(co, {})
2522
2571
  ]
2523
2572
  }
2524
2573
  );
2525
- }, Ki = () => /* @__PURE__ */ t.jsxs("div", { className: $.empty, children: [
2526
- /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(x, { name: "Handbag" }) }),
2574
+ }, co = () => /* @__PURE__ */ t.jsxs("div", { className: P.empty, children: [
2575
+ /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(f, { name: "Handbag" }) }),
2527
2576
  /* @__PURE__ */ t.jsx("span", { children: "Your cart is empty" }),
2528
2577
  /* @__PURE__ */ t.jsxs("span", { children: [
2529
2578
  "Check out the store's products and add them",
@@ -2532,16 +2581,16 @@ const zo = (u) => {
2532
2581
  "a",
2533
2582
  {
2534
2583
  href: "/products",
2535
- className: $.link,
2584
+ className: P.link,
2536
2585
  children: "here"
2537
2586
  }
2538
2587
  )
2539
2588
  ] })
2540
- ] }), Zi = ({ token: u }) => {
2541
- const [o, e] = g.useState("test-email@gmail.com"), n = gt();
2542
- g.useEffect(() => {
2589
+ ] }), lo = ({ token: u }) => {
2590
+ const [o, e] = h.useState("test-email@gmail.com"), n = gt();
2591
+ h.useEffect(() => {
2543
2592
  (async () => {
2544
- const c = Xi(u);
2593
+ const c = io(u);
2545
2594
  e(c.email);
2546
2595
  })();
2547
2596
  }, [u]);
@@ -2551,44 +2600,46 @@ const zo = (u) => {
2551
2600
  return /* @__PURE__ */ t.jsx(
2552
2601
  "div",
2553
2602
  {
2554
- className: $.userInfo,
2603
+ className: P.userInfo,
2555
2604
  onClick: () => i("/customer-dash"),
2556
2605
  children: /* @__PURE__ */ t.jsx("div", { children: o || "test-email@gmail.com" })
2557
2606
  }
2558
2607
  );
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 = () => {
2570
- const { isOpenModal: u, setIsOpenModal: o } = St();
2608
+ }, ro = "_share_9g414_1", uo = "_modal_9g414_8", po = "_header_9g414_14", mo = "_socials_9g414_24", ho = "_social_9g414_24", _o = "_copy_9g414_34", go = "_title_9g414_41", fo = "_copyWrapper_9g414_47", xo = "_copyText_9g414_56", Q = {
2609
+ share: ro,
2610
+ modal: uo,
2611
+ header: po,
2612
+ socials: mo,
2613
+ social: ho,
2614
+ copy: _o,
2615
+ title: go,
2616
+ copyWrapper: fo,
2617
+ copyText: xo
2618
+ }, Go = () => {
2619
+ const { isOpenModal: u, setIsOpenModal: o } = Pt();
2571
2620
  function e() {
2572
2621
  o(!0);
2573
2622
  }
2574
2623
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2575
2624
  /* @__PURE__ */ t.jsx(
2576
- "div",
2625
+ ot,
2577
2626
  {
2578
2627
  className: Q.share,
2579
2628
  onClick: (n) => {
2580
2629
  n.stopPropagation(), e();
2581
2630
  },
2631
+ type: "Secondary",
2582
2632
  children: /* @__PURE__ */ t.jsx(
2583
- x,
2633
+ f,
2584
2634
  {
2585
2635
  name: "Share",
2586
- fill: "#757575"
2636
+ fill: "#757575",
2637
+ hoverable: !0
2587
2638
  }
2588
2639
  )
2589
2640
  }
2590
2641
  ),
2591
- u && /* @__PURE__ */ t.jsx(Ct, { close: o, children: /* @__PURE__ */ t.jsx(ro, {}) })
2642
+ u && /* @__PURE__ */ t.jsx(Tt, { close: o, children: /* @__PURE__ */ t.jsx(bo, {}) })
2592
2643
  ] });
2593
2644
  }, It = {
2594
2645
  facebook: "FacebookLogo",
@@ -2597,71 +2648,75 @@ const zo = (u) => {
2597
2648
  instagram: "InstagramLogo",
2598
2649
  discord: "MessengerLogo",
2599
2650
  tiktok: "TiktokLogo"
2600
- }, ro = () => {
2601
- const { setIsOpenModal: u } = St(), o = window.location.href;
2602
- function e() {
2603
- navigator.clipboard.writeText(o);
2651
+ }, bo = () => {
2652
+ const { setIsOpenModal: u } = Pt(), { notification: o, setNotification: e } = Dt(), n = window.location.href;
2653
+ function i() {
2654
+ navigator.clipboard.writeText(n), e({
2655
+ message: "Link copied to clipboard",
2656
+ status: "success"
2657
+ });
2604
2658
  }
2605
2659
  return /* @__PURE__ */ t.jsxs(
2606
2660
  "div",
2607
2661
  {
2608
2662
  className: Q.modal,
2609
- onClick: (n) => n.stopPropagation(),
2663
+ onClick: (a) => a.stopPropagation(),
2610
2664
  children: [
2611
2665
  /* @__PURE__ */ t.jsxs("div", { className: Q.header, children: [
2612
2666
  /* @__PURE__ */ t.jsx("div", { className: Q.title, children: "Share this Post" }),
2613
2667
  /* @__PURE__ */ t.jsx(
2614
- x,
2668
+ f,
2615
2669
  {
2616
2670
  name: "X",
2617
2671
  fill: "#757575",
2618
- onClick: () => u(!1)
2672
+ onClick: () => u(!1),
2673
+ hoverable: !0
2619
2674
  }
2620
2675
  )
2621
2676
  ] }),
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] }) })) }),
2677
+ /* @__PURE__ */ t.jsx("div", { className: Q.socials, children: Object.keys(It).map((a) => /* @__PURE__ */ t.jsx("div", { className: Q.social, children: /* @__PURE__ */ t.jsx(f, { name: It[a] }) })) }),
2623
2678
  /* @__PURE__ */ t.jsxs("div", { className: Q.copyWrapper, children: [
2624
2679
  /* @__PURE__ */ t.jsx(
2625
2680
  "div",
2626
2681
  {
2627
- className: Y(Q.copy, Q.copyText),
2628
- onClick: e,
2629
- children: o
2682
+ className: V(Q.copy, Q.copyText),
2683
+ onClick: i,
2684
+ children: n
2630
2685
  }
2631
2686
  ),
2632
2687
  /* @__PURE__ */ t.jsx(
2633
2688
  "div",
2634
2689
  {
2635
- onClick: e,
2690
+ onClick: i,
2636
2691
  className: Q.copy,
2637
- children: /* @__PURE__ */ t.jsx(x, { name: "Copy" })
2692
+ children: o ? /* @__PURE__ */ t.jsx(f, { name: "Check" }) : /* @__PURE__ */ t.jsx(f, { name: "Copy" })
2638
2693
  }
2639
2694
  )
2640
2695
  ] })
2641
2696
  ]
2642
2697
  }
2643
2698
  );
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 = () => {
2699
+ }, vo = "_accordion_1s1lq_1", jo = "_header_1s1lq_9", yo = "_icon_1s1lq_18", ko = "_open_1s1lq_21", $o = "_content_1s1lq_25", pt = {
2700
+ accordion: vo,
2701
+ header: jo,
2702
+ icon: yo,
2703
+ open: ko,
2704
+ content: $o
2705
+ }, Wo = ({ title: u, content: o }) => {
2706
+ const [e, n] = h.useState(!1), [i, a] = h.useState(0), c = h.useRef(null), s = () => {
2652
2707
  n(!e);
2653
2708
  };
2654
- return g.useEffect(() => {
2709
+ return h.useEffect(() => {
2655
2710
  c.current && a(e ? c.current.scrollHeight : 0);
2656
- }, [e]), /* @__PURE__ */ t.jsxs("div", { className: mt.accordion, children: [
2711
+ }, [e]), /* @__PURE__ */ t.jsxs("div", { className: pt.accordion, children: [
2657
2712
  /* @__PURE__ */ t.jsxs(
2658
2713
  "div",
2659
2714
  {
2660
- className: mt.header,
2715
+ className: pt.header,
2661
2716
  onClick: s,
2662
2717
  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" }) })
2718
+ /* @__PURE__ */ t.jsx("h5", { id: "h5", children: u }),
2719
+ /* @__PURE__ */ t.jsx("div", { className: V(pt.icon, { [pt.open]: e }), children: /* @__PURE__ */ t.jsx(f, { name: "CaretDown" }) })
2665
2720
  ]
2666
2721
  }
2667
2722
  ),
@@ -2669,22 +2724,22 @@ const zo = (u) => {
2669
2724
  "div",
2670
2725
  {
2671
2726
  ref: c,
2672
- className: mt.content,
2727
+ className: pt.content,
2673
2728
  style: { height: `${i}px` },
2674
- children: /* @__PURE__ */ t.jsx("p", { children: o })
2729
+ children: /* @__PURE__ */ t.jsx("p", { id: "p", children: o })
2675
2730
  }
2676
2731
  )
2677
2732
  ] });
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) => {
2733
+ }, wo = "_wrapper_1r14x_1", No = "_label_1r14x_9", Io = "_input_1r14x_18", Co = "_required_1r14x_35", So = "_paddingless_1r14x_39", To = "_content_1r14x_43", Po = "_borderless_1r14x_58", Bo = "_rightIcon_1r14x_63", it = {
2734
+ wrapper: wo,
2735
+ label: No,
2736
+ input: Io,
2737
+ required: Co,
2738
+ paddingless: So,
2739
+ content: To,
2740
+ borderless: Po,
2741
+ rightIcon: Bo
2742
+ }, Xo = (u) => {
2688
2743
  const {
2689
2744
  onChange: o,
2690
2745
  style: e,
@@ -2695,88 +2750,113 @@ const zo = (u) => {
2695
2750
  max: s,
2696
2751
  placeholder: l,
2697
2752
  disabled: d = !1,
2698
- required: v = !1,
2753
+ required: $ = !1,
2699
2754
  regex: r,
2700
- paddingless: w = !1,
2701
- 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;
2755
+ paddingless: B = !1,
2756
+ borderless: x = !1,
2757
+ editable: _ = !1,
2758
+ isSearch: m = !1
2759
+ } = u, { themeSettings: O } = St(), { inputs: q } = O, [b, D] = h.useState(!1);
2760
+ function C(j, M) {
2761
+ if (j.startsWith("#")) {
2762
+ let N, E, L;
2763
+ return j.length === 7 ? (N = parseInt(j.slice(1, 3), 16), E = parseInt(j.slice(3, 5), 16), L = parseInt(j.slice(5, 7), 16)) : j.length === 4 && (N = parseInt(j[1] + j[1], 16), E = parseInt(j[2] + j[2], 16), L = parseInt(j[3] + j[3], 16)), `rgba(${N}, ${E}, ${L}, ${M})`;
2764
+ }
2765
+ const y = {
2766
+ black: "#000000",
2767
+ white: "#ffffff",
2768
+ red: "#ff0000",
2769
+ green: "#00ff00",
2770
+ blue: "#0000ff"
2771
+ // Можно добавить больше цветов
2772
+ }[j.toLowerCase()];
2773
+ return y ? C(y, M) : j;
2707
2774
  }
2708
- function O(N) {
2709
- return !v || !r ? !0 : new RegExp(r).test(N);
2775
+ function S(j) {
2776
+ return Number(j) < 0 ? String(c) : j;
2710
2777
  }
2711
- return /* @__PURE__ */ t.jsxs("div", { className: nt.wrapper, children: [
2778
+ function g(j) {
2779
+ return !$ || !r ? !0 : new RegExp(r).test(j);
2780
+ }
2781
+ return /* @__PURE__ */ t.jsxs("div", { className: it.wrapper, children: [
2712
2782
  n && /* @__PURE__ */ t.jsx(
2713
2783
  "label",
2714
2784
  {
2715
- className: nt.label,
2785
+ className: it.label,
2716
2786
  htmlFor: n,
2717
2787
  children: n
2718
2788
  }
2719
2789
  ),
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);
2790
+ /* @__PURE__ */ t.jsxs(
2791
+ "div",
2792
+ {
2793
+ className: it.content,
2794
+ style: {
2795
+ paddingRight: q.general.height + 15,
2796
+ ...e,
2797
+ backgroundColor: C(q.field.color, q.field.opacity / 100)
2798
+ },
2799
+ children: [
2800
+ /* @__PURE__ */ t.jsx(
2801
+ "input",
2802
+ {
2803
+ id: n,
2804
+ type: a || "text",
2805
+ onChange: (j) => {
2806
+ if (a === "text") o(j.target.value);
2807
+ else {
2808
+ const M = S(j.target.value);
2809
+ o(M);
2810
+ }
2811
+ },
2812
+ value: i,
2813
+ autoComplete: "off",
2814
+ placeholder: l || "Type something...",
2815
+ className: V(it.input, {
2816
+ [it.required]: b && $ && !g(i),
2817
+ [it.paddingless]: B,
2818
+ [it.borderless]: x
2819
+ }),
2820
+ min: a === "number" ? c : void 0,
2821
+ max: a === "number" ? s : void 0,
2822
+ disabled: d,
2823
+ onFocus: () => D(!0)
2731
2824
  }
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
- ] })
2825
+ ),
2826
+ m && /* @__PURE__ */ t.jsx("div", { className: it.rightIcon, children: /* @__PURE__ */ t.jsx(
2827
+ f,
2828
+ {
2829
+ name: "MagnifyingGlass",
2830
+ fill: "var(--icon-secondary)",
2831
+ width: q.general.height,
2832
+ height: q.general.height
2833
+ }
2834
+ ) }),
2835
+ _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
2836
+ f,
2837
+ {
2838
+ name: "Sliders",
2839
+ width: 20,
2840
+ height: 20,
2841
+ hoverable: !0
2842
+ }
2843
+ ) })
2844
+ ]
2845
+ }
2846
+ )
2767
2847
  ] });
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: [
2848
+ }, Ao = "_wrapper_st58d_1", Oo = "_label_st58d_10", qo = "_textarea_st58d_18", Do = "_length_st58d_33", _t = {
2849
+ wrapper: Ao,
2850
+ label: Oo,
2851
+ textarea: qo,
2852
+ length: Do
2853
+ }, Jo = (u) => {
2854
+ const { onChange: o, label: e, value: n, maxLength: i, placeholder: a = "Type something..." } = u, [c, s] = h.useState(n.length);
2855
+ return /* @__PURE__ */ t.jsxs("div", { className: _t.wrapper, children: [
2776
2856
  e && /* @__PURE__ */ t.jsx(
2777
2857
  "label",
2778
2858
  {
2779
- className: pt.label,
2859
+ className: _t.label,
2780
2860
  htmlFor: e,
2781
2861
  children: e
2782
2862
  }
@@ -2790,11 +2870,11 @@ const zo = (u) => {
2790
2870
  s(l.target.value.length), o(l.target.value);
2791
2871
  },
2792
2872
  placeholder: a,
2793
- className: pt.textarea,
2873
+ className: _t.textarea,
2794
2874
  maxLength: i
2795
2875
  }
2796
2876
  ),
2797
- i && /* @__PURE__ */ t.jsxs("div", { className: pt.length, children: [
2877
+ i && /* @__PURE__ */ t.jsxs("div", { className: _t.length, children: [
2798
2878
  c,
2799
2879
  "/",
2800
2880
  i
@@ -2802,34 +2882,34 @@ const zo = (u) => {
2802
2882
  ] });
2803
2883
  };
2804
2884
  export {
2805
- Lo as Accordion,
2806
- Yi as Button,
2807
- ln as ButtonTypeSettings,
2808
- Ao as ButtonsSettings,
2809
- Bo as CategorySettings,
2885
+ Wo as Accordion,
2886
+ vt as Button,
2887
+ pn as ButtonTypeSettings,
2888
+ Vo as ButtonsSettings,
2889
+ Ho as CategorySettings,
2810
2890
  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,
2822
- Ct as Modal,
2823
- Do as ProductOptions,
2891
+ Zo as ChooseImageModal,
2892
+ co as EmptyCart,
2893
+ Fo as FormSettings,
2894
+ Yo as HeaderButtons,
2895
+ f as Icon,
2896
+ W as InputSettings,
2897
+ Xo as InputUI,
2898
+ Be as ItemsSettings,
2899
+ Mo as LayoutSettings,
2900
+ Uo as ListingSelector,
2901
+ ta as Loader,
2902
+ Tt as Modal,
2903
+ zo as ProductOptions,
2824
2904
  Nt as RangeSelector,
2825
2905
  tt as Select,
2826
- Eo as ShareLink,
2827
- Ji as ShoppingButton,
2828
- Qi as ShoppingModalCart,
2906
+ Go as ShareLink,
2907
+ oo as ShoppingButton,
2908
+ ao as ShoppingModalCart,
2829
2909
  K as Switch,
2830
- Tt as TextSettings,
2831
- wt as TextareaSettings,
2832
- Mo as TextareaUI,
2833
- Pt as TypesText,
2834
- Zi as UserInfo
2910
+ At as TextSettings,
2911
+ Ct as TextareaSettings,
2912
+ Jo as TextareaUI,
2913
+ Bt as TypesText,
2914
+ lo as UserInfo
2835
2915
  };