@billgangcom/theme-lib 1.36.0 → 1.37.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.
package/dist/ui.es.js CHANGED
@@ -1,8 +1,8 @@
1
- import { j as t, I as v, c as F, a as X, S as tt, T as Ot, C as gt, b as et, u as $t, d as It, D as Nt, e as wt, v as Ct, B as at, f as mt, P as Bt, g as St, h as Tt, i as Ht, k as bt, l as Pt, m as qt, M as Et, n as Dt, o as zt } from "./index-DwwDB4Kw.js";
2
- import { p as fa, L as xa } from "./index-DwwDB4Kw.js";
3
- import g from "react";
1
+ import { j as t, I as b, c as F, a as W, S as Z, T as Ot, C as gt, b as st, u as It, d as $t, D as Nt, e as wt, v as Ct, B as ct, f as _t, P as Bt, g as St, h as Tt, i as Ht, k as vt, l as Pt, m as qt, M as Et, n as Dt, o as zt } from "./index-CncZkk5o.js";
2
+ import { p as ja, L as ya } from "./index-CncZkk5o.js";
3
+ import p from "react";
4
4
  import "@phosphor-icons/react";
5
- const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibiw_15", Yt = "_subtitle_3ibiw_22", Gt = "_alignmentContent_3ibiw_29", Wt = "_alignments_3ibiw_37", Xt = "_alignment_3ibiw_8", Jt = "_circle_3ibiw_63", Qt = "_paddings_3ibiw_70", Kt = "_padding_3ibiw_70", Zt = "_active_3ibiw_94", te = "_input_3ibiw_101", J = {
5
+ const Ft = "_wrapper_1ibay_2", Vt = "_alignmentBlock_1ibay_8", Ut = "_title_1ibay_15", Yt = "_subtitle_1ibay_22", Gt = "_alignmentContent_1ibay_29", Wt = "_alignments_1ibay_37", Xt = "_alignment_1ibay_8", Jt = "_circle_1ibay_60", Qt = "_paddings_1ibay_67", Kt = "_padding_1ibay_67", Zt = "_active_1ibay_91", te = "_input_1ibay_98", J = {
6
6
  wrapper: Ft,
7
7
  alignmentBlock: Vt,
8
8
  title: Ut,
@@ -25,10 +25,10 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
25
25
  "bottomLeft",
26
26
  "bottom",
27
27
  "bottomRight"
28
- ], se = ["left", "top", "right", "bottom"], ia = (r) => {
29
- const { alignment: c, padding: e, setPadding: s, setAlignment: i } = r;
30
- function a() {
31
- switch (c) {
28
+ ], se = ["left", "top", "right", "bottom"], la = (r) => {
29
+ const { alignment: a, padding: e, setPadding: s, setAlignment: i } = r;
30
+ function o(f) {
31
+ switch (f) {
32
32
  case "left":
33
33
  case "topLeft":
34
34
  case "bottomLeft":
@@ -45,8 +45,8 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
45
45
  return "TextAlignCenter";
46
46
  }
47
47
  }
48
- function l(o) {
49
- switch (o) {
48
+ function l(f) {
49
+ switch (f) {
50
50
  case "left":
51
51
  return "AlignLeft";
52
52
  case "right":
@@ -57,25 +57,40 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
57
57
  return "AlignBottom";
58
58
  }
59
59
  }
60
- const [m, n] = g.useState(null);
60
+ const [d, n] = p.useState(null), [c, v] = p.useState(null);
61
61
  return /* @__PURE__ */ t.jsxs("div", { className: J.layout, children: [
62
62
  /* @__PURE__ */ t.jsx("h3", { className: J.title, children: "Layout" }),
63
63
  /* @__PURE__ */ t.jsxs("div", { className: J.alignmentBlock, children: [
64
64
  /* @__PURE__ */ t.jsx("h5", { className: J.subtitle, children: "Alignment" }),
65
65
  /* @__PURE__ */ t.jsxs("div", { className: J.alignmentContent, children: [
66
- /* @__PURE__ */ t.jsx("div", { className: J.alignments, children: ee.map((o) => /* @__PURE__ */ t.jsxs(
66
+ /* @__PURE__ */ t.jsx("div", { className: J.alignments, children: ee.map((f) => /* @__PURE__ */ t.jsxs(
67
67
  "div",
68
68
  {
69
69
  onClick: () => {
70
- i(o);
70
+ i(f);
71
71
  },
72
72
  className: J.alignment,
73
+ onMouseEnter: () => {
74
+ n(f);
75
+ },
76
+ onMouseLeave: () => {
77
+ n(null);
78
+ },
73
79
  children: [
74
- o !== c && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
75
- o === c && /* @__PURE__ */ t.jsx(
76
- v,
80
+ f !== a && d !== f && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
81
+ f !== a && d === f && /* @__PURE__ */ t.jsx(
82
+ b,
83
+ {
84
+ name: o(d),
85
+ fill: "#c2c2c2",
86
+ width: 22,
87
+ height: 22
88
+ }
89
+ ),
90
+ f === a && /* @__PURE__ */ t.jsx(
91
+ b,
77
92
  {
78
- name: a(),
93
+ name: o(a),
79
94
  fill: "#FF3F19",
80
95
  width: 22,
81
96
  height: 22
@@ -83,37 +98,37 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
83
98
  )
84
99
  ]
85
100
  },
86
- o
101
+ f
87
102
  )) }),
88
- /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: se.map((o) => /* @__PURE__ */ t.jsxs(
103
+ /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: se.map((f) => /* @__PURE__ */ t.jsxs(
89
104
  "label",
90
105
  {
91
106
  className: F(J.padding, {
92
- [J.active]: m === o
107
+ [J.active]: c === f
93
108
  }),
94
109
  onFocus: () => {
95
- n(o);
110
+ v(f);
96
111
  },
97
112
  onBlur: () => {
98
- n(null);
113
+ v(null);
99
114
  },
100
115
  children: [
101
116
  /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
102
- v,
117
+ b,
103
118
  {
104
- name: l(o),
119
+ name: l(f),
105
120
  width: 20,
106
121
  height: 20
107
122
  }
108
123
  ) }),
109
124
  /* @__PURE__ */ t.jsx(
110
- X,
125
+ W,
111
126
  {
112
127
  type: "number",
113
- value: String(e[o]),
114
- onChange: (f) => s({
128
+ value: String(e[f]),
129
+ onChange: (m) => s({
115
130
  ...e,
116
- [o]: Number(f)
131
+ [f]: Number(m)
117
132
  }),
118
133
  paddingless: !0,
119
134
  borderless: !0
@@ -121,7 +136,7 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
121
136
  )
122
137
  ]
123
138
  },
124
- o
139
+ f
125
140
  )) })
126
141
  ] })
127
142
  ] })
@@ -133,12 +148,12 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
133
148
  text: ae,
134
149
  top: ce,
135
150
  itemsBlock: le
136
- }, re = "_typeTexts_167ez_1", de = "_block_167ez_8", ue = "_active_167ez_25", vt = {
151
+ }, re = "_typeTexts_167ez_1", de = "_block_167ez_8", ue = "_active_167ez_25", jt = {
137
152
  typeTexts: re,
138
153
  block: de,
139
154
  active: ue
140
- }, me = ["bold", "italic", "underline", "strike-through", "code"], Lt = (r) => {
141
- const { typesText: c, setTypesText: e } = r;
155
+ }, _e = ["bold", "italic", "underline", "strike-through", "code"], Lt = (r) => {
156
+ const { typesText: a, setTypesText: e } = r;
142
157
  function s(i) {
143
158
  switch (i) {
144
159
  case "bold":
@@ -153,25 +168,25 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
153
168
  return "TextUnderline";
154
169
  }
155
170
  }
156
- return /* @__PURE__ */ t.jsx("div", { className: vt.typeTexts, children: me.map((i) => /* @__PURE__ */ t.jsx(
171
+ return /* @__PURE__ */ t.jsx("div", { className: jt.typeTexts, children: _e.map((i) => /* @__PURE__ */ t.jsx(
157
172
  "div",
158
173
  {
159
- className: F(vt.block, {
160
- [vt.active]: c.includes(i)
174
+ className: F(jt.block, {
175
+ [jt.active]: a.includes(i)
161
176
  }),
162
177
  onClick: () => {
163
- const a = [...c];
164
- if (a.includes(i)) {
165
- const l = a.filter((m) => m !== i);
178
+ const o = [...a];
179
+ if (o.includes(i)) {
180
+ const l = o.filter((d) => d !== i);
166
181
  e(l);
167
182
  } else
168
- a.push(i), e(a);
183
+ o.push(i), e(o);
169
184
  },
170
185
  children: /* @__PURE__ */ t.jsx(
171
- v,
186
+ b,
172
187
  {
173
188
  name: s(i),
174
- fill: c.includes(i) ? "#252525" : "#757575",
189
+ fill: a.includes(i) ? "#252525" : "#757575",
175
190
  width: 20,
176
191
  height: 20
177
192
  }
@@ -181,23 +196,23 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
181
196
  )) });
182
197
  }, Rt = (r) => {
183
198
  const {
184
- typesText: c,
199
+ typesText: a,
185
200
  isActiveText: e,
186
201
  setIsActiveText: s,
187
202
  text: i,
188
- setText: a,
203
+ setText: o,
189
204
  setTypesText: l,
190
- title: m,
205
+ title: d,
191
206
  subtitle: n = "Items"
192
207
  } = r;
193
208
  return /* @__PURE__ */ t.jsxs("div", { className: ht.text, children: [
194
- (m || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: ht.top, children: [
195
- m && /* @__PURE__ */ t.jsx("h3", { className: ht.title, children: m }),
209
+ (d || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: ht.top, children: [
210
+ d && /* @__PURE__ */ t.jsx("h3", { className: ht.title, children: d }),
196
211
  e !== void 0 && s && /* @__PURE__ */ t.jsx(
197
- tt,
212
+ Z,
198
213
  {
199
214
  current: e,
200
- onChange: (o) => s(o)
215
+ onChange: (c) => s(c)
201
216
  }
202
217
  )
203
218
  ] }),
@@ -206,7 +221,7 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
206
221
  /* @__PURE__ */ t.jsx(
207
222
  Ot,
208
223
  {
209
- onChange: (o) => a(o),
224
+ onChange: (c) => o(c),
210
225
  value: i,
211
226
  maxLength: 150
212
227
  }
@@ -214,26 +229,26 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
214
229
  /* @__PURE__ */ t.jsx(
215
230
  Lt,
216
231
  {
217
- typesText: c,
232
+ typesText: a,
218
233
  setTypesText: l
219
234
  }
220
235
  )
221
236
  ] })
222
237
  ] });
223
- }, he = "_title_157lh_1", _e = "_subtitle_157lh_5", pe = "_header_157lh_12", ge = "_text_157lh_13", fe = "_productsBlock_157lh_14", xe = "_top_157lh_26", be = "_itemsBlock_157lh_35", je = "_typeTexts_157lh_41", ve = "_block_157lh_48", ye = "_active_157lh_61", ke = "_products_157lh_14", $e = "_product_157lh_14", Ie = "_button_157lh_80", Ne = "_disabled_157lh_91", we = "_image_157lh_95", Ce = "_info_157lh_102", Be = "_name_157lh_114", Se = "_buttons_157lh_118", Te = "_modal_157lh_125", Pe = "_link_157lh_145", Ae = "_modalOptions_157lh_151", Oe = "_addButton_157lh_163", qe = "_deleteButton_157lh_178", H = {
238
+ }, he = "_title_v8pu8_1", me = "_subtitle_v8pu8_5", pe = "_header_v8pu8_12", ge = "_text_v8pu8_13", fe = "_productsBlock_v8pu8_14", xe = "_top_v8pu8_26", ve = "_itemsBlock_v8pu8_35", be = "_typeTexts_v8pu8_41", je = "_block_v8pu8_48", ye = "_active_v8pu8_61", ke = "_products_v8pu8_14", Ie = "_product_v8pu8_14", $e = "_button_v8pu8_80", Ne = "_disabled_v8pu8_91", we = "_image_v8pu8_95", Ce = "_info_v8pu8_102", Be = "_name_v8pu8_114", Se = "_buttons_v8pu8_118", Te = "_modal_v8pu8_125", Pe = "_link_v8pu8_145", Ae = "_modalOptions_v8pu8_151", Oe = "_addButton_v8pu8_164", qe = "_deleteButton_v8pu8_179", Ee = "_closeIcon_v8pu8_191", M = {
224
239
  title: he,
225
- subtitle: _e,
240
+ subtitle: me,
226
241
  header: pe,
227
242
  text: ge,
228
243
  productsBlock: fe,
229
244
  top: xe,
230
- itemsBlock: be,
231
- typeTexts: je,
232
- block: ve,
245
+ itemsBlock: ve,
246
+ typeTexts: be,
247
+ block: je,
233
248
  active: ye,
234
249
  products: ke,
235
- product: $e,
236
- button: Ie,
250
+ product: Ie,
251
+ button: $e,
237
252
  disabled: Ne,
238
253
  image: we,
239
254
  info: Ce,
@@ -243,18 +258,19 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
243
258
  link: Pe,
244
259
  modalOptions: Ae,
245
260
  addButton: Oe,
246
- deleteButton: qe
247
- }, Ee = g.forwardRef(
248
- (r, c) => {
249
- const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = r;
250
- function m(n, o) {
251
- return n.length > o ? `${n.slice(0, o)}...` : n;
261
+ deleteButton: qe,
262
+ closeIcon: Ee
263
+ }, De = p.forwardRef(
264
+ (r, a) => {
265
+ const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: o, setIsOpenModal: l } = r;
266
+ function d(n, c) {
267
+ return n.length > c ? `${n.slice(0, c)}...` : n;
252
268
  }
253
269
  return /* @__PURE__ */ t.jsxs(
254
270
  "div",
255
271
  {
256
- ref: c,
257
- className: H.modal,
272
+ ref: a,
273
+ className: M.modal,
258
274
  onClick: (n) => {
259
275
  n.stopPropagation();
260
276
  },
@@ -263,34 +279,33 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
263
279
  left: `${i.left}px`
264
280
  },
265
281
  children: [
266
- /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
267
- /* @__PURE__ */ t.jsx("h3", { className: H.title, children: m(e.name, 20) }),
268
- /* @__PURE__ */ t.jsx(
269
- v,
282
+ /* @__PURE__ */ t.jsxs("div", { className: M.top, children: [
283
+ /* @__PURE__ */ t.jsx("h3", { className: M.title, children: d(e.name, 20) }),
284
+ /* @__PURE__ */ t.jsx("div", { className: M.closeIcon, children: /* @__PURE__ */ t.jsx(
285
+ b,
270
286
  {
271
287
  name: "X",
272
288
  height: 20,
273
289
  width: 20,
274
- hoverable: !0,
275
290
  onClick: () => {
276
291
  s(null), l(!1);
277
292
  }
278
293
  }
279
- )
294
+ ) })
280
295
  ] }),
281
- /* @__PURE__ */ t.jsx("div", { className: H.modalOptions, children: a.map((n) => {
296
+ /* @__PURE__ */ t.jsx("div", { className: M.modalOptions, children: o.map((n) => {
282
297
  if (n.type === "image")
283
298
  return /* @__PURE__ */ t.jsx(
284
299
  gt,
285
300
  {
286
301
  label: "Put up an attractive image",
287
302
  activeImage: e[n.field],
288
- onChange: (o) => {
289
- const f = {
303
+ onChange: (c) => {
304
+ const v = {
290
305
  ...e,
291
- [n.field]: o
306
+ [n.field]: c
292
307
  };
293
- s(f);
308
+ s(v);
294
309
  }
295
310
  },
296
311
  String(n.field)
@@ -300,34 +315,34 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
300
315
  Rt,
301
316
  {
302
317
  typesText: e[n.field.type],
303
- setTypesText: (o) => {
304
- const f = {
318
+ setTypesText: (c) => {
319
+ const v = {
305
320
  ...e,
306
- [n.field.type]: o
321
+ [n.field.type]: c
307
322
  };
308
- s(f);
323
+ s(v);
309
324
  },
310
325
  text: e[n.field.text] || "",
311
- setText: (o) => {
312
- const f = {
326
+ setText: (c) => {
327
+ const v = {
313
328
  ...e,
314
- [n.field.text]: o
329
+ [n.field.text]: c
315
330
  };
316
- s(f);
331
+ s(v);
317
332
  },
318
333
  subtitle: n.label
319
334
  }
320
335
  );
321
336
  if (n.type === "input")
322
337
  return /* @__PURE__ */ t.jsx(
323
- X,
338
+ W,
324
339
  {
325
- onChange: (o) => {
326
- const f = {
340
+ onChange: (c) => {
341
+ const v = {
327
342
  ...e,
328
- [n.field]: o
343
+ [n.field]: c
329
344
  };
330
- s(f);
345
+ s(v);
331
346
  },
332
347
  value: e[n.field] || "",
333
348
  label: n.label,
@@ -335,16 +350,16 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
335
350
  }
336
351
  );
337
352
  if (n.type === "inputSwitch")
338
- return /* @__PURE__ */ t.jsxs("div", { className: H.link, children: [
353
+ return /* @__PURE__ */ t.jsxs("div", { className: M.link, children: [
339
354
  /* @__PURE__ */ t.jsx(
340
- X,
355
+ W,
341
356
  {
342
- onChange: (o) => {
343
- const f = {
357
+ onChange: (c) => {
358
+ const v = {
344
359
  ...e,
345
- [n.field.text]: o
360
+ [n.field.text]: c
346
361
  };
347
- s(f);
362
+ s(v);
348
363
  },
349
364
  value: e[n.field.text] || "",
350
365
  label: n.inputLabel,
@@ -352,31 +367,31 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
352
367
  }
353
368
  ),
354
369
  /* @__PURE__ */ t.jsx(
355
- tt,
370
+ Z,
356
371
  {
357
372
  current: !!e[n.field.switch] || !1,
358
373
  label: n.switchLabel,
359
- onChange: (o) => {
360
- const f = {
374
+ onChange: (c) => {
375
+ const v = {
361
376
  ...e,
362
- [n.field.switch]: o
377
+ [n.field.switch]: c
363
378
  };
364
- s(f);
379
+ s(v);
365
380
  }
366
381
  }
367
382
  )
368
383
  ] });
369
384
  if (n.type === "list")
370
385
  return /* @__PURE__ */ t.jsx(
371
- He,
386
+ ze,
372
387
  {
373
388
  items: e[n.field] || [],
374
- setItems: (o) => {
375
- const f = {
389
+ setItems: (c) => {
390
+ const v = {
376
391
  ...e,
377
- [n.field]: o
392
+ [n.field]: c
378
393
  };
379
- s(f);
394
+ s(v);
380
395
  },
381
396
  itemsType: "select",
382
397
  draggable: n.draggable || !1,
@@ -389,19 +404,19 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
389
404
  );
390
405
  if (n.type === "select")
391
406
  return /* @__PURE__ */ t.jsx(
392
- et,
407
+ st,
393
408
  {
394
409
  options: n.itemsOptions,
395
- onChange: (o) => {
396
- const f = {
410
+ onChange: (c) => {
411
+ const v = {
397
412
  ...e,
398
- [n.field]: o
413
+ [n.field]: c
399
414
  };
400
- s(f);
415
+ s(v);
401
416
  },
402
417
  label: n.label,
403
418
  value: e[n.field] || "String",
404
- leftAddon: n.leftAddon && n.leftAddon === "icon" && /* @__PURE__ */ t.jsx(v, { name: e[n.field] })
419
+ leftAddon: n.leftAddon && n.leftAddon === "icon" && /* @__PURE__ */ t.jsx(b, { name: e[n.field] })
405
420
  }
406
421
  );
407
422
  }) })
@@ -409,19 +424,19 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
409
424
  }
410
425
  );
411
426
  }
412
- ), De = "_other_g74jx_1", Le = "_subtitle_g74jx_7", Re = "_items_g74jx_14", yt = {
413
- other: De,
414
- subtitle: Le,
415
- items: Re
416
- }, jt = (r) => {
417
- const { items: c, title: e = "Other" } = r;
427
+ ), Le = "_other_g74jx_1", Re = "_subtitle_g74jx_7", Me = "_items_g74jx_14", yt = {
428
+ other: Le,
429
+ subtitle: Re,
430
+ items: Me
431
+ }, bt = (r) => {
432
+ const { items: a, title: e = "Other" } = r;
418
433
  return /* @__PURE__ */ t.jsxs("div", { className: yt.other, children: [
419
434
  /* @__PURE__ */ t.jsx("h5", { className: yt.subtitle, children: e }),
420
- /* @__PURE__ */ t.jsx("div", { className: yt.items, children: c.map((s, i) => /* @__PURE__ */ t.jsx(
421
- tt,
435
+ /* @__PURE__ */ t.jsx("div", { className: yt.items, children: a.map((s, i) => /* @__PURE__ */ t.jsx(
436
+ Z,
422
437
  {
423
438
  current: s.isItem,
424
- onChange: (a) => s.setIsItem(a),
439
+ onChange: (o) => s.setIsItem(o),
425
440
  label: s.label,
426
441
  hasBackground: !0,
427
442
  paddingless: !1
@@ -430,18 +445,18 @@ const Ft = "_wrapper_3ibiw_2", Vt = "_alignmentBlock_3ibiw_8", Ut = "_title_3ibi
430
445
  )) })
431
446
  ] });
432
447
  };
433
- function Me({ product: r, children: c }) {
448
+ function He({ product: r, children: a }) {
434
449
  const {
435
450
  attributes: e,
436
451
  listeners: s,
437
452
  setNodeRef: i,
438
- transform: a,
453
+ transform: o,
439
454
  transition: l,
440
- isDragging: m
455
+ isDragging: d
441
456
  } = St({
442
457
  id: r.id
443
458
  }), n = {
444
- transform: Tt.Transform.toString(a),
459
+ transform: Tt.Transform.toString(o),
445
460
  transition: l
446
461
  };
447
462
  return /* @__PURE__ */ t.jsx(
@@ -449,88 +464,88 @@ function Me({ product: r, children: c }) {
449
464
  {
450
465
  ref: i,
451
466
  style: n,
452
- className: `${H.product} ${m ? H.dragging : ""}`,
467
+ className: `${M.product} ${d ? M.dragging : ""}`,
453
468
  ...e,
454
469
  ...s,
455
- children: c
470
+ children: a
456
471
  }
457
472
  );
458
473
  }
459
- const He = (r) => {
474
+ const ze = (r) => {
460
475
  const {
461
- isActiveItems: c,
476
+ isActiveItems: a,
462
477
  setIsActiveItems: e,
463
478
  items: s,
464
479
  setItems: i,
465
- other: a,
480
+ other: o,
466
481
  title: l,
467
- subtitle: m,
482
+ subtitle: d,
468
483
  editable: n = !0,
469
- draggable: o = !1,
470
- withImage: f = !1,
471
- deletable: N = !0,
472
- addable: _ = !0,
484
+ draggable: c = !1,
485
+ withImage: v = !1,
486
+ deletable: f = !0,
487
+ addable: m = !0,
473
488
  itemsType: h,
474
- itemsPlaceholder: p = "",
475
- itemsOptions: d,
476
- hasRangeSelector: C = !1,
477
- rangeSelectorOptions: D,
478
- modalOptions: y,
489
+ itemsPlaceholder: g = "",
490
+ itemsOptions: u,
491
+ hasRangeSelector: w = !1,
492
+ rangeSelectorOptions: q,
493
+ modalOptions: k,
479
494
  addableOptions: L = {},
480
495
  limit: B,
481
- autoScrollInterval: T
482
- } = r, [x, k] = g.useState(null), [V, K] = g.useState({
496
+ autoScrollInterval: S
497
+ } = r, [x, D] = p.useState(null), [X, tt] = p.useState({
483
498
  top: 0,
484
499
  left: 0
485
- }), [b, I] = g.useState(null), P = g.useRef(null), [U, q] = g.useState(!1), M = $t(
486
- It(Bt, {
500
+ }), [y, $] = p.useState(null), E = p.useRef(null), [G, A] = p.useState(!1), H = It(
501
+ $t(Bt, {
487
502
  activationConstraint: {
488
503
  distance: 5
489
504
  }
490
505
  })
491
506
  );
492
- g.useEffect(() => {
493
- const u = () => {
494
- k(null), q(!1);
507
+ p.useEffect(() => {
508
+ const _ = () => {
509
+ D(null), A(!1);
495
510
  };
496
- return document.body.addEventListener("click", u), k(null), q(!1), () => {
497
- k(null), q(!1), document.body.removeEventListener("click", u);
511
+ return document.body.addEventListener("click", _), D(null), A(!1), () => {
512
+ D(null), A(!1), document.body.removeEventListener("click", _);
498
513
  };
499
- }, []), g.useEffect(() => {
514
+ }, []), p.useEffect(() => {
500
515
  if (x) {
501
- const u = [...s].map(($) => $.id === x.id ? x : $);
502
- i(u);
516
+ const _ = [...s].map((I) => I.id === x.id ? x : I);
517
+ i(_);
503
518
  }
504
- }, [x]), g.useEffect(() => {
505
- if (P.current && b) {
506
- const u = P.current.getBoundingClientRect().height, $ = window.innerHeight;
507
- let A = b.top;
508
- A + u > $ + window.scrollY - 200 && (A = $ + window.scrollY - u - 200), A < 0 && (A = 10), K({
509
- top: A,
510
- left: b.left
519
+ }, [x]), p.useEffect(() => {
520
+ if (E.current && y) {
521
+ const _ = E.current.getBoundingClientRect().height, I = window.innerHeight;
522
+ let T = y.top;
523
+ T + _ > I + window.scrollY - 200 && (T = I + window.scrollY - _ - 200), T < 0 && (T = 10), tt({
524
+ top: T,
525
+ left: y.left
511
526
  });
512
527
  }
513
- }, [P.current, b]);
514
- const Z = (u, $) => {
515
- u.stopPropagation();
516
- const A = u.target.getBoundingClientRect();
517
- I({
518
- top: A.top + window.scrollY,
519
- left: A.left - 30
520
- }), k($), q(!0);
528
+ }, [E.current, y]);
529
+ const K = (_, I) => {
530
+ _.stopPropagation();
531
+ const T = _.target.getBoundingClientRect();
532
+ $({
533
+ top: T.top + window.scrollY,
534
+ left: T.left - 30
535
+ }), D(I), A(!0);
521
536
  };
522
- function ct(u) {
523
- if (f)
524
- return u ? /* @__PURE__ */ t.jsx(
537
+ function lt(_) {
538
+ if (v)
539
+ return _ ? /* @__PURE__ */ t.jsx(
525
540
  "img",
526
541
  {
527
- src: `https://imagedelivery.net/${u[0]}/w=1000`,
542
+ src: `https://imagedelivery.net/${_[0]}/w=1000`,
528
543
  alt: "image",
529
544
  width: 16,
530
545
  height: 16
531
546
  }
532
547
  ) : /* @__PURE__ */ t.jsx(
533
- v,
548
+ b,
534
549
  {
535
550
  name: "Image",
536
551
  width: 16,
@@ -539,20 +554,20 @@ const He = (r) => {
539
554
  }
540
555
  );
541
556
  }
542
- const j = (u) => {
543
- const { active: $, over: A } = u;
544
- if (A && $.id !== A.id) {
545
- const R = s.findIndex((O) => O.id === $.id), Y = s.findIndex((O) => O.id === A.id);
546
- if (R !== -1 && Y !== -1) {
547
- const O = [...s], [lt] = O.splice(R, 1);
548
- O.splice(Y, 0, lt), i(O);
557
+ const j = (_) => {
558
+ const { active: I, over: T } = _;
559
+ if (T && I.id !== T.id) {
560
+ const R = s.findIndex((P) => P.id === I.id), U = s.findIndex((P) => P.id === T.id);
561
+ if (R !== -1 && U !== -1) {
562
+ const P = [...s], [rt] = P.splice(R, 1);
563
+ P.splice(U, 0, rt), i(P);
549
564
  }
550
565
  }
551
- }, E = (u, $) => {
552
- var R, Y;
553
- const A = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
554
- o && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
555
- v,
566
+ }, O = (_, I) => {
567
+ var R, U;
568
+ const T = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
569
+ c && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
570
+ b,
556
571
  {
557
572
  name: "DotsSixVertical",
558
573
  hoverable: !0,
@@ -560,135 +575,135 @@ const He = (r) => {
560
575
  height: 20
561
576
  }
562
577
  ) }),
563
- h === "select" && d && /* @__PURE__ */ t.jsx(
564
- et,
578
+ h === "select" && u && /* @__PURE__ */ t.jsx(
579
+ st,
565
580
  {
566
- onChange: (O) => {
567
- const lt = [...s], ut = d.find((ft) => ft.name === O);
581
+ onChange: (P) => {
582
+ const rt = [...s], ut = u.find((ft) => ft.name === P);
568
583
  if (!ut) return;
569
- const rt = lt.map((ft) => ft.id === u.id ? {
584
+ const dt = rt.map((ft) => ft.id === _.id ? {
570
585
  ...ut,
571
- name: O
586
+ name: P
572
587
  } : ft);
573
- k({
574
- ...u,
575
- name: O
576
- }), i([...rt]);
588
+ D({
589
+ ..._,
590
+ name: P
591
+ }), i([...dt]);
577
592
  },
578
- value: u.name,
579
- options: d.filter((O) => !s.find((lt) => lt.name === O.name)).map((O) => O.name),
580
- leftAddon: ct(u.images)
593
+ value: _.name,
594
+ options: u.filter((P) => !s.find((rt) => rt.name === P.name)).map((P) => P.name),
595
+ leftAddon: lt(_.images)
581
596
  }
582
597
  ),
583
598
  h === "input" && /* @__PURE__ */ t.jsx(
584
- X,
599
+ W,
585
600
  {
586
- onChange: (O) => {
587
- const ut = [...s].map((rt) => rt.id === u.id ? {
588
- ...u,
589
- name: O
590
- } : rt);
601
+ onChange: (P) => {
602
+ const ut = [...s].map((dt) => dt.id === _.id ? {
603
+ ..._,
604
+ name: P
605
+ } : dt);
591
606
  i([...ut]);
592
607
  },
593
- value: u.name,
594
- placeholder: p
608
+ value: _.name,
609
+ placeholder: g
595
610
  }
596
611
  ),
597
612
  h === "image" && /* @__PURE__ */ t.jsx(
598
613
  gt,
599
614
  {
600
- onChange: (O) => {
601
- const ut = [...s].map((rt) => rt.id === u.id ? {
602
- ...u,
603
- images: O
604
- } : rt);
615
+ onChange: (P) => {
616
+ const ut = [...s].map((dt) => dt.id === _.id ? {
617
+ ..._,
618
+ images: P
619
+ } : dt);
605
620
  i([...ut]);
606
621
  },
607
- activeImage: (R = s.find((O) => O.id === u.id)) != null && R.images ? (Y = s.find((O) => O.id === u.id)) == null ? void 0 : Y.images[0] : void 0
622
+ activeImage: (R = s.find((P) => P.id === _.id)) != null && R.images ? (U = s.find((P) => P.id === _.id)) == null ? void 0 : U.images[0] : void 0
608
623
  }
609
624
  ),
610
- /* @__PURE__ */ t.jsxs("div", { className: H.buttons, children: [
611
- n && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
612
- v,
625
+ /* @__PURE__ */ t.jsxs("div", { className: M.buttons, children: [
626
+ n && /* @__PURE__ */ t.jsx("div", { className: M.deleteButton, children: /* @__PURE__ */ t.jsx(
627
+ b,
613
628
  {
614
629
  name: "Sliders",
615
630
  hoverable: !0,
616
631
  width: 20,
617
632
  height: 20,
618
- onClick: (O) => Z(O, u)
633
+ onClick: (P) => K(P, _)
619
634
  }
620
635
  ) }),
621
- N && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
622
- v,
636
+ f && /* @__PURE__ */ t.jsx("div", { className: M.deleteButton, children: /* @__PURE__ */ t.jsx(
637
+ b,
623
638
  {
624
639
  name: "Trash",
625
640
  hoverable: !0,
626
641
  width: 20,
627
642
  height: 20,
628
643
  fill: "#C12A2A",
629
- onClick: () => i(s.filter((O) => O.id !== u.id))
644
+ onClick: () => i(s.filter((P) => P.id !== _.id))
630
645
  }
631
646
  ) })
632
647
  ] })
633
648
  ] });
634
- return o ? /* @__PURE__ */ t.jsx(
635
- Me,
649
+ return c ? /* @__PURE__ */ t.jsx(
650
+ He,
636
651
  {
637
- product: u,
638
- index: $,
639
- children: A
652
+ product: _,
653
+ index: I,
654
+ children: T
640
655
  },
641
- u.id
656
+ _.id
642
657
  ) : /* @__PURE__ */ t.jsx(
643
658
  "div",
644
659
  {
645
- className: H.product,
646
- children: A
660
+ className: M.product,
661
+ children: T
647
662
  },
648
- u.id
663
+ _.id
649
664
  );
650
665
  };
651
- return /* @__PURE__ */ t.jsxs("div", { className: H.productsBlock, children: [
652
- (l || c !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
653
- l && /* @__PURE__ */ t.jsx("h3", { className: H.title, children: l }),
654
- c !== void 0 && /* @__PURE__ */ t.jsx(
655
- tt,
666
+ return /* @__PURE__ */ t.jsxs("div", { className: M.productsBlock, children: [
667
+ (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: M.top, children: [
668
+ l && /* @__PURE__ */ t.jsx("h3", { className: M.title, children: l }),
669
+ a !== void 0 && /* @__PURE__ */ t.jsx(
670
+ Z,
656
671
  {
657
- current: c,
658
- onChange: (u) => e == null ? void 0 : e(u)
672
+ current: a,
673
+ onChange: (_) => e == null ? void 0 : e(_)
659
674
  }
660
675
  )
661
676
  ] }),
662
- x && n && y && U && /* @__PURE__ */ t.jsx(
663
- Ee,
677
+ x && n && k && G && /* @__PURE__ */ t.jsx(
678
+ De,
664
679
  {
665
- ref: P,
680
+ ref: E,
666
681
  activeItem: x,
667
- setActiveItem: k,
668
- popupPosition: V,
669
- modalOptions: y,
670
- setIsOpenModal: q
682
+ setActiveItem: D,
683
+ popupPosition: X,
684
+ modalOptions: k,
685
+ setIsOpenModal: A
671
686
  }
672
687
  ),
673
- C && D && /* @__PURE__ */ t.jsx(At, { ...D }),
674
- /* @__PURE__ */ t.jsxs("div", { className: H.products, children: [
675
- m && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: m }),
676
- o ? /* @__PURE__ */ t.jsx(
688
+ w && q && /* @__PURE__ */ t.jsx(At, { ...q }),
689
+ /* @__PURE__ */ t.jsxs("div", { className: M.products, children: [
690
+ d && /* @__PURE__ */ t.jsx("h5", { className: M.subtitle, children: d }),
691
+ c ? /* @__PURE__ */ t.jsx(
677
692
  Nt,
678
693
  {
679
- sensors: M,
694
+ sensors: H,
680
695
  onDragEnd: j,
681
696
  children: /* @__PURE__ */ t.jsx(
682
697
  wt,
683
698
  {
684
- items: s.map((u) => u.id),
699
+ items: s.map((_) => _.id),
685
700
  strategy: Ct,
686
- children: s.map((u, $) => E(u, $))
701
+ children: s.map((_, I) => O(_, I))
687
702
  }
688
703
  )
689
704
  }
690
- ) : s.map((u, $) => E(u, $)),
691
- _ && /* @__PURE__ */ t.jsx(
705
+ ) : s.map((_, I) => O(_, I)),
706
+ m && /* @__PURE__ */ t.jsx(
692
707
  "div",
693
708
  {
694
709
  style: {
@@ -697,45 +712,45 @@ const He = (r) => {
697
712
  justifyContent: "center"
698
713
  },
699
714
  children: /* @__PURE__ */ t.jsx(
700
- at,
715
+ ct,
701
716
  {
702
717
  withoutHover: !0,
703
- className: F(H.button, {
704
- [H.disabled]: !!(B && B <= s.length || s.length === (d == null ? void 0 : d.length))
718
+ className: F(M.button, {
719
+ [M.disabled]: !!(B && B <= s.length || s.length === (u == null ? void 0 : u.length))
705
720
  }),
706
721
  size: "s",
707
- disabled: !!(B && B <= s.length || s.length === (d == null ? void 0 : d.length)),
722
+ disabled: !!(B && B <= s.length || s.length === (u == null ? void 0 : u.length)),
708
723
  onClick: () => {
709
- const u = [...s];
710
- let $ = null;
711
- if (d) {
712
- for (let A = 0; A < d.length; A++)
713
- if (!s.find((R) => R.id === d[A].id)) {
714
- $ = d[A];
724
+ const _ = [...s];
725
+ let I = null;
726
+ if (u) {
727
+ for (let T = 0; T < u.length; T++)
728
+ if (!s.find((R) => R.id === u[T].id)) {
729
+ I = u[T];
715
730
  break;
716
731
  }
717
732
  }
718
- h === "select" && d ? u.push({
719
- name: $ ? $.name : d[0].name,
720
- id: ($ == null ? void 0 : $.id) || d[0].id,
733
+ h === "select" && u ? _.push({
734
+ name: I ? I.name : u[0].name,
735
+ id: (I == null ? void 0 : I.id) || u[0].id,
721
736
  ...L
722
- }) : h === "input" ? u.push({
737
+ }) : h === "input" ? _.push({
723
738
  name: "",
724
- id: mt(),
739
+ id: _t(),
725
740
  ...L
726
- }) : u.push({
741
+ }) : _.push({
727
742
  name: `Image ${s.length + 1}`,
728
- id: mt(),
743
+ id: _t(),
729
744
  ...L
730
- }), i(u);
745
+ }), i(_);
731
746
  },
732
747
  style: {
733
748
  width: "fit-content"
734
749
  },
735
- children: /* @__PURE__ */ t.jsxs("div", { className: H.addButton, children: [
750
+ children: /* @__PURE__ */ t.jsxs("div", { className: M.addButton, children: [
736
751
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
737
752
  /* @__PURE__ */ t.jsx(
738
- v,
753
+ b,
739
754
  {
740
755
  name: "Plus",
741
756
  width: 16,
@@ -748,14 +763,14 @@ const He = (r) => {
748
763
  }
749
764
  )
750
765
  ] }),
751
- a !== void 0 && /* @__PURE__ */ t.jsx(jt, { items: a }),
752
- T !== void 0 && /* @__PURE__ */ t.jsx(
753
- X,
766
+ o !== void 0 && /* @__PURE__ */ t.jsx(bt, { items: o }),
767
+ S !== void 0 && /* @__PURE__ */ t.jsx(
768
+ W,
754
769
  {
755
770
  label: "Auto scroll interval",
756
771
  type: "number",
757
- value: String(T.scrollInterval),
758
- onChange: (u) => T.setScrollInterval(Number(u)),
772
+ value: String(S.scrollInterval),
773
+ onChange: (_) => S.setScrollInterval(Number(_)),
759
774
  min: 0.1,
760
775
  max: 100,
761
776
  style: {
@@ -765,60 +780,60 @@ const He = (r) => {
765
780
  }
766
781
  )
767
782
  ] });
768
- }, ze = "_title_82zux_1", Fe = "_subtitle_82zux_5", Ve = "_header_82zux_12", Ue = "_text_82zux_13", Ye = "_productsBlock_82zux_14", Ge = "_top_82zux_26", We = "_itemsBlock_82zux_35", Xe = "_typeTexts_82zux_41", Je = "_block_82zux_48", Qe = "_active_82zux_61", Ke = "_products_82zux_14", Ze = "_product_82zux_14", ts = "_button_82zux_80", es = "_disabled_82zux_91", ss = "_image_82zux_95", ns = "_info_82zux_102", is = "_name_82zux_114", os = "_buttons_82zux_118", as = "_modal_82zux_125", cs = "_link_82zux_145", ls = "_modalOptions_82zux_151", rs = "_addButton_82zux_157", ds = "_deleteButton_82zux_179", Q = {
769
- title: ze,
770
- subtitle: Fe,
771
- header: Ve,
772
- text: Ue,
773
- productsBlock: Ye,
774
- top: Ge,
775
- itemsBlock: We,
776
- typeTexts: Xe,
777
- block: Je,
778
- active: Qe,
779
- products: Ke,
780
- product: Ze,
781
- button: ts,
782
- disabled: es,
783
- image: ss,
784
- info: ns,
785
- name: is,
786
- buttons: os,
787
- modal: as,
788
- link: cs,
789
- modalOptions: ls,
790
- addButton: rs,
791
- deleteButton: ds
792
- }, oa = (r) => {
783
+ }, Fe = "_title_82zux_1", Ve = "_subtitle_82zux_5", Ue = "_header_82zux_12", Ye = "_text_82zux_13", Ge = "_productsBlock_82zux_14", We = "_top_82zux_26", Xe = "_itemsBlock_82zux_35", Je = "_typeTexts_82zux_41", Qe = "_block_82zux_48", Ke = "_active_82zux_61", Ze = "_products_82zux_14", ts = "_product_82zux_14", es = "_button_82zux_80", ss = "_disabled_82zux_91", ns = "_image_82zux_95", is = "_info_82zux_102", os = "_name_82zux_114", as = "_buttons_82zux_118", cs = "_modal_82zux_125", ls = "_link_82zux_145", rs = "_modalOptions_82zux_151", ds = "_addButton_82zux_157", us = "_deleteButton_82zux_179", Q = {
784
+ title: Fe,
785
+ subtitle: Ve,
786
+ header: Ue,
787
+ text: Ye,
788
+ productsBlock: Ge,
789
+ top: We,
790
+ itemsBlock: Xe,
791
+ typeTexts: Je,
792
+ block: Qe,
793
+ active: Ke,
794
+ products: Ze,
795
+ product: ts,
796
+ button: es,
797
+ disabled: ss,
798
+ image: ns,
799
+ info: is,
800
+ name: os,
801
+ buttons: as,
802
+ modal: cs,
803
+ link: ls,
804
+ modalOptions: rs,
805
+ addButton: ds,
806
+ deleteButton: us
807
+ }, ra = (r) => {
793
808
  const {
794
- isActiveItems: c,
809
+ isActiveItems: a,
795
810
  setIsActiveItems: e,
796
811
  items: s,
797
812
  setItems: i,
798
- other: a,
813
+ other: o,
799
814
  title: l,
800
- subtitle: m,
815
+ subtitle: d,
801
816
  draggable: n = !1,
802
- withImage: o = !1,
803
- addable: f = !0,
804
- itemsOptions: N,
805
- hasRangeSelector: _ = !1,
817
+ withImage: c = !1,
818
+ addable: v = !0,
819
+ itemsOptions: f,
820
+ hasRangeSelector: m = !1,
806
821
  rangeSelectorOptions: h,
807
- limit: p,
808
- autoScrollInterval: d
822
+ limit: g,
823
+ autoScrollInterval: u
809
824
  } = r;
810
- function C(y) {
811
- if (o)
812
- return y ? /* @__PURE__ */ t.jsx(
825
+ function w(k) {
826
+ if (c)
827
+ return k ? /* @__PURE__ */ t.jsx(
813
828
  "img",
814
829
  {
815
- src: `https://imagedelivery.net/${y[0]}/w=1000`,
830
+ src: `https://imagedelivery.net/${k[0]}/w=1000`,
816
831
  alt: "image",
817
832
  width: 16,
818
833
  height: 16
819
834
  }
820
835
  ) : /* @__PURE__ */ t.jsx(
821
- v,
836
+ b,
822
837
  {
823
838
  name: "Image",
824
839
  width: 16,
@@ -827,12 +842,12 @@ const He = (r) => {
827
842
  }
828
843
  );
829
844
  }
830
- const D = (y) => {
831
- const L = N.find((T) => T.id === y);
845
+ const q = (k) => {
846
+ const L = f.find((S) => S.id === k);
832
847
  if (!L) return;
833
848
  const B = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
834
849
  n && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
835
- v,
850
+ b,
836
851
  {
837
852
  name: "DotsSixVertical",
838
853
  hoverable: !0,
@@ -841,28 +856,28 @@ const He = (r) => {
841
856
  }
842
857
  ) }),
843
858
  /* @__PURE__ */ t.jsx(
844
- et,
859
+ st,
845
860
  {
846
- onChange: (T) => {
847
- const x = [...s], k = N.find((b) => b.name === T);
848
- if (!k) return;
849
- const V = k.id, K = x.map((b) => b === y ? V : b);
850
- i([...K]);
861
+ onChange: (S) => {
862
+ const x = [...s], D = f.find((y) => y.name === S);
863
+ if (!D) return;
864
+ const X = D.id, tt = x.map((y) => y === k ? X : y);
865
+ i([...tt]);
851
866
  },
852
867
  value: L.name,
853
- options: N.filter((T) => !s.find((x) => x === T.id)).map((T) => T.name),
854
- leftAddon: C(L.images)
868
+ options: f.filter((S) => !s.find((x) => x === S.id)).map((S) => S.name),
869
+ leftAddon: w(L.images)
855
870
  }
856
871
  ),
857
872
  /* @__PURE__ */ t.jsx("div", { className: Q.buttons, children: /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
858
- v,
873
+ b,
859
874
  {
860
875
  name: "Trash",
861
876
  hoverable: !0,
862
877
  width: 20,
863
878
  height: 20,
864
879
  fill: "#C12A2A",
865
- onClick: () => i(s.filter((T) => T !== y))
880
+ onClick: () => i(s.filter((S) => S !== k))
866
881
  }
867
882
  ) }) })
868
883
  ] });
@@ -872,25 +887,25 @@ const He = (r) => {
872
887
  className: Q.product,
873
888
  children: B
874
889
  },
875
- y
890
+ k
876
891
  );
877
892
  };
878
893
  return /* @__PURE__ */ t.jsxs("div", { className: Q.productsBlock, children: [
879
- (l || c !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Q.top, children: [
894
+ (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Q.top, children: [
880
895
  l && /* @__PURE__ */ t.jsx("h3", { className: Q.title, children: l }),
881
- c !== void 0 && /* @__PURE__ */ t.jsx(
882
- tt,
896
+ a !== void 0 && /* @__PURE__ */ t.jsx(
897
+ Z,
883
898
  {
884
- current: c,
885
- onChange: (y) => e == null ? void 0 : e(y)
899
+ current: a,
900
+ onChange: (k) => e == null ? void 0 : e(k)
886
901
  }
887
902
  )
888
903
  ] }),
889
- _ && h && /* @__PURE__ */ t.jsx(At, { ...h }),
904
+ m && h && /* @__PURE__ */ t.jsx(At, { ...h }),
890
905
  /* @__PURE__ */ t.jsxs("div", { className: Q.products, children: [
891
- m && /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: m }),
892
- s.map((y) => D(y)),
893
- f && /* @__PURE__ */ t.jsx(
906
+ d && /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: d }),
907
+ s.map((k) => q(k)),
908
+ v && /* @__PURE__ */ t.jsx(
894
909
  "div",
895
910
  {
896
911
  style: {
@@ -900,25 +915,25 @@ const He = (r) => {
900
915
  gap: 5
901
916
  },
902
917
  children: /* @__PURE__ */ t.jsx(
903
- at,
918
+ ct,
904
919
  {
905
920
  withoutHover: !0,
906
921
  className: F(Q.button, {
907
- [Q.disabled]: !!(p && p <= s.length || s.length === N.length)
922
+ [Q.disabled]: !!(g && g <= s.length || s.length === f.length)
908
923
  }),
909
924
  size: "s",
910
- disabled: !!(p && p <= s.length || s.length === N.length),
925
+ disabled: !!(g && g <= s.length || s.length === f.length),
911
926
  onClick: () => {
912
- const y = [...s];
927
+ const k = [...s];
913
928
  let L = null;
914
- if (N) {
915
- for (let B = 0; B < N.length; B++)
916
- if (!s.find((T) => T === N[B].id)) {
917
- L = N[B];
929
+ if (f) {
930
+ for (let B = 0; B < f.length; B++)
931
+ if (!s.find((S) => S === f[B].id)) {
932
+ L = f[B];
918
933
  break;
919
934
  }
920
935
  }
921
- y.push((L == null ? void 0 : L.id) || N[0].id), i(y);
936
+ k.push((L == null ? void 0 : L.id) || f[0].id), i(k);
922
937
  },
923
938
  style: {
924
939
  width: "fit-content"
@@ -926,7 +941,7 @@ const He = (r) => {
926
941
  children: /* @__PURE__ */ t.jsxs("div", { className: Q.addButton, children: [
927
942
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
928
943
  /* @__PURE__ */ t.jsx(
929
- v,
944
+ b,
930
945
  {
931
946
  name: "Plus",
932
947
  width: 16,
@@ -939,14 +954,14 @@ const He = (r) => {
939
954
  }
940
955
  )
941
956
  ] }),
942
- a !== void 0 && /* @__PURE__ */ t.jsx(jt, { items: a }),
943
- d !== void 0 && /* @__PURE__ */ t.jsx(
944
- X,
957
+ o !== void 0 && /* @__PURE__ */ t.jsx(bt, { items: o }),
958
+ u !== void 0 && /* @__PURE__ */ t.jsx(
959
+ W,
945
960
  {
946
961
  label: "Auto scroll interval",
947
962
  type: "number",
948
- value: String(d.scrollInterval),
949
- onChange: (y) => d.setScrollInterval(Number(y)),
963
+ value: String(u.scrollInterval),
964
+ onChange: (k) => u.setScrollInterval(Number(k)),
950
965
  min: 0.1,
951
966
  max: 100,
952
967
  style: {
@@ -956,40 +971,41 @@ const He = (r) => {
956
971
  }
957
972
  )
958
973
  ] });
959
- }, us = "_title_1wm9m_1", ms = "_subtitle_1wm9m_5", hs = "_header_1wm9m_12", _s = "_text_1wm9m_13", ps = "_productsBlock_1wm9m_14", gs = "_top_1wm9m_26", fs = "_itemsBlock_1wm9m_35", xs = "_typeTexts_1wm9m_41", bs = "_block_1wm9m_48", js = "_active_1wm9m_61", vs = "_products_1wm9m_14", ys = "_product_1wm9m_14", ks = "_button_1wm9m_80", $s = "_disabled_1wm9m_91", Is = "_image_1wm9m_95", Ns = "_info_1wm9m_102", ws = "_name_1wm9m_114", Cs = "_buttons_1wm9m_118", Bs = "_modal_1wm9m_125", Ss = "_link_1wm9m_146", Ts = "_modalOptions_1wm9m_152", Ps = "_addButton_1wm9m_164", As = "_deleteButton_1wm9m_179", z = {
960
- title: us,
961
- subtitle: ms,
962
- header: hs,
963
- text: _s,
964
- productsBlock: ps,
965
- top: gs,
966
- itemsBlock: fs,
967
- typeTexts: xs,
974
+ }, _s = "_title_1lgwl_1", hs = "_subtitle_1lgwl_5", ms = "_header_1lgwl_12", ps = "_text_1lgwl_13", gs = "_productsBlock_1lgwl_14", fs = "_top_1lgwl_26", xs = "_itemsBlock_1lgwl_35", vs = "_typeTexts_1lgwl_41", bs = "_block_1lgwl_48", js = "_active_1lgwl_61", ys = "_products_1lgwl_14", ks = "_product_1lgwl_14", Is = "_button_1lgwl_80", $s = "_disabled_1lgwl_91", Ns = "_image_1lgwl_95", ws = "_info_1lgwl_102", Cs = "_name_1lgwl_114", Bs = "_buttons_1lgwl_118", Ss = "_modal_1lgwl_125", Ts = "_link_1lgwl_146", Ps = "_modalOptions_1lgwl_152", As = "_addButton_1lgwl_164", Os = "_deleteButton_1lgwl_179", qs = "_closeIcon_1lgwl_191", z = {
975
+ title: _s,
976
+ subtitle: hs,
977
+ header: ms,
978
+ text: ps,
979
+ productsBlock: gs,
980
+ top: fs,
981
+ itemsBlock: xs,
982
+ typeTexts: vs,
968
983
  block: bs,
969
984
  active: js,
970
- products: vs,
971
- product: ys,
972
- button: ks,
985
+ products: ys,
986
+ product: ks,
987
+ button: Is,
973
988
  disabled: $s,
974
- image: Is,
975
- info: Ns,
976
- name: ws,
977
- buttons: Cs,
978
- modal: Bs,
979
- link: Ss,
980
- modalOptions: Ts,
981
- addButton: Ps,
982
- deleteButton: As
983
- }, Os = g.forwardRef(
984
- (r, c) => {
985
- const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = r;
986
- function m(n, o) {
987
- return n.length > o ? `${n.slice(0, o)}...` : n;
989
+ image: Ns,
990
+ info: ws,
991
+ name: Cs,
992
+ buttons: Bs,
993
+ modal: Ss,
994
+ link: Ts,
995
+ modalOptions: Ps,
996
+ addButton: As,
997
+ deleteButton: Os,
998
+ closeIcon: qs
999
+ }, Es = p.forwardRef(
1000
+ (r, a) => {
1001
+ const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: o, setIsOpenModal: l } = r;
1002
+ function d(n, c) {
1003
+ return n.length > c ? `${n.slice(0, c)}...` : n;
988
1004
  }
989
1005
  return /* @__PURE__ */ t.jsxs(
990
1006
  "div",
991
1007
  {
992
- ref: c,
1008
+ ref: a,
993
1009
  className: z.modal,
994
1010
  onClick: (n) => {
995
1011
  n.stopPropagation();
@@ -1000,9 +1016,9 @@ const He = (r) => {
1000
1016
  },
1001
1017
  children: [
1002
1018
  /* @__PURE__ */ t.jsxs("div", { className: z.top, children: [
1003
- /* @__PURE__ */ t.jsx("h3", { className: z.title, children: m(e.name, 20) }),
1004
- /* @__PURE__ */ t.jsx(
1005
- v,
1019
+ /* @__PURE__ */ t.jsx("h3", { className: z.title, children: d(e.name, 20) }),
1020
+ /* @__PURE__ */ t.jsx("div", { className: z.closeIcon, children: /* @__PURE__ */ t.jsx(
1021
+ b,
1006
1022
  {
1007
1023
  name: "X",
1008
1024
  height: 20,
@@ -1012,21 +1028,21 @@ const He = (r) => {
1012
1028
  s(null), l(!1);
1013
1029
  }
1014
1030
  }
1015
- )
1031
+ ) })
1016
1032
  ] }),
1017
- /* @__PURE__ */ t.jsx("div", { className: z.modalOptions, children: a.map((n) => {
1033
+ /* @__PURE__ */ t.jsx("div", { className: z.modalOptions, children: o.map((n) => {
1018
1034
  if (n.type === "image")
1019
1035
  return /* @__PURE__ */ t.jsx(
1020
1036
  gt,
1021
1037
  {
1022
1038
  label: "Put up an attractive image",
1023
1039
  activeImage: e[n.field],
1024
- onChange: (o) => {
1025
- const f = {
1040
+ onChange: (c) => {
1041
+ const v = {
1026
1042
  ...e,
1027
- [n.field]: o
1043
+ [n.field]: c
1028
1044
  };
1029
- s(f);
1045
+ s(v);
1030
1046
  }
1031
1047
  },
1032
1048
  String(n.field)
@@ -1036,34 +1052,34 @@ const He = (r) => {
1036
1052
  Rt,
1037
1053
  {
1038
1054
  typesText: e[n.field.type],
1039
- setTypesText: (o) => {
1040
- const f = {
1055
+ setTypesText: (c) => {
1056
+ const v = {
1041
1057
  ...e,
1042
- [n.field.type]: o
1058
+ [n.field.type]: c
1043
1059
  };
1044
- s(f);
1060
+ s(v);
1045
1061
  },
1046
1062
  text: e[n.field.text] || "",
1047
- setText: (o) => {
1048
- const f = {
1063
+ setText: (c) => {
1064
+ const v = {
1049
1065
  ...e,
1050
- [n.field.text]: o
1066
+ [n.field.text]: c
1051
1067
  };
1052
- s(f);
1068
+ s(v);
1053
1069
  },
1054
1070
  subtitle: n.label
1055
1071
  }
1056
1072
  );
1057
1073
  if (n.type === "input")
1058
1074
  return /* @__PURE__ */ t.jsx(
1059
- X,
1075
+ W,
1060
1076
  {
1061
- onChange: (o) => {
1062
- const f = {
1077
+ onChange: (c) => {
1078
+ const v = {
1063
1079
  ...e,
1064
- [n.field]: o
1080
+ [n.field]: c
1065
1081
  };
1066
- s(f);
1082
+ s(v);
1067
1083
  },
1068
1084
  value: e[n.field] || "",
1069
1085
  label: n.label,
@@ -1073,14 +1089,14 @@ const He = (r) => {
1073
1089
  if (n.type === "inputSwitch")
1074
1090
  return /* @__PURE__ */ t.jsxs("div", { className: z.link, children: [
1075
1091
  /* @__PURE__ */ t.jsx(
1076
- X,
1092
+ W,
1077
1093
  {
1078
- onChange: (o) => {
1079
- const f = {
1094
+ onChange: (c) => {
1095
+ const v = {
1080
1096
  ...e,
1081
- [n.field.text]: o
1097
+ [n.field.text]: c
1082
1098
  };
1083
- s(f);
1099
+ s(v);
1084
1100
  },
1085
1101
  value: e[n.field.text] || "",
1086
1102
  label: n.inputLabel,
@@ -1088,35 +1104,35 @@ const He = (r) => {
1088
1104
  }
1089
1105
  ),
1090
1106
  /* @__PURE__ */ t.jsx(
1091
- tt,
1107
+ Z,
1092
1108
  {
1093
1109
  current: !!e[n.field.switch] || !1,
1094
1110
  label: n.switchLabel,
1095
- onChange: (o) => {
1096
- const f = {
1111
+ onChange: (c) => {
1112
+ const v = {
1097
1113
  ...e,
1098
- [n.field.switch]: o
1114
+ [n.field.switch]: c
1099
1115
  };
1100
- s(f);
1116
+ s(v);
1101
1117
  }
1102
1118
  }
1103
1119
  )
1104
1120
  ] });
1105
1121
  if (n.type === "select")
1106
1122
  return /* @__PURE__ */ t.jsx(
1107
- et,
1123
+ st,
1108
1124
  {
1109
1125
  options: n.itemsOptions,
1110
- onChange: (o) => {
1111
- const f = {
1126
+ onChange: (c) => {
1127
+ const v = {
1112
1128
  ...e,
1113
- [n.field]: o
1129
+ [n.field]: c
1114
1130
  };
1115
- s(f);
1131
+ s(v);
1116
1132
  },
1117
1133
  label: n.label,
1118
1134
  value: e[n.field] || "String",
1119
- leftAddon: n.leftAddon && n.leftAddon === "icon" && /* @__PURE__ */ t.jsx(v, { name: e[n.field] })
1135
+ leftAddon: n.leftAddon && n.leftAddon === "icon" && /* @__PURE__ */ t.jsx(b, { name: e[n.field] })
1120
1136
  }
1121
1137
  );
1122
1138
  }) })
@@ -1125,18 +1141,18 @@ const He = (r) => {
1125
1141
  );
1126
1142
  }
1127
1143
  );
1128
- function qs(r) {
1129
- const { product: c, children: e } = r, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: m, isDragging: n } = St({
1130
- id: c.id
1131
- }), o = {
1144
+ function Ds(r) {
1145
+ const { product: a, children: e } = r, { attributes: s, listeners: i, setNodeRef: o, transform: l, transition: d, isDragging: n } = St({
1146
+ id: a.id
1147
+ }), c = {
1132
1148
  transform: Tt.Transform.toString(l),
1133
- transition: m
1149
+ transition: d
1134
1150
  };
1135
1151
  return /* @__PURE__ */ t.jsx(
1136
1152
  "div",
1137
1153
  {
1138
- ref: a,
1139
- style: o,
1154
+ ref: o,
1155
+ style: c,
1140
1156
  className: `${z.product} ${n ? z.dragging : ""}`,
1141
1157
  ...s,
1142
1158
  ...i,
@@ -1144,69 +1160,69 @@ function qs(r) {
1144
1160
  }
1145
1161
  );
1146
1162
  }
1147
- const aa = (r) => {
1163
+ const da = (r) => {
1148
1164
  const {
1149
- isActiveItems: c,
1165
+ isActiveItems: a,
1150
1166
  setIsActiveItems: e,
1151
1167
  items: s,
1152
1168
  setItems: i,
1153
- other: a,
1169
+ other: o,
1154
1170
  title: l,
1155
- subtitle: m,
1171
+ subtitle: d,
1156
1172
  editable: n = !0,
1157
- draggable: o = !1,
1158
- withImage: f = !1,
1159
- deletable: N = !0,
1160
- addable: _ = !0,
1173
+ draggable: c = !1,
1174
+ withImage: v = !1,
1175
+ deletable: f = !0,
1176
+ addable: m = !0,
1161
1177
  itemsType: h,
1162
- itemsPlaceholder: p = "",
1163
- itemsOptions: d,
1164
- hasRangeSelector: C = !1,
1165
- rangeSelectorOptions: D,
1166
- modalOptions: y,
1178
+ itemsPlaceholder: g = "",
1179
+ itemsOptions: u,
1180
+ hasRangeSelector: w = !1,
1181
+ rangeSelectorOptions: q,
1182
+ modalOptions: k,
1167
1183
  addableOptions: L = {}
1168
- } = r, [B, T] = g.useState(null), [x, k] = g.useState({
1184
+ } = r, [B, S] = p.useState(null), [x, D] = p.useState({
1169
1185
  top: 0,
1170
1186
  left: 0
1171
- }), [V, K] = g.useState(null), b = g.useRef(null), [I, P] = g.useState(!1), U = $t(
1172
- It(Bt, {
1187
+ }), [X, tt] = p.useState(null), y = p.useRef(null), [$, E] = p.useState(!1), G = It(
1188
+ $t(Bt, {
1173
1189
  activationConstraint: {
1174
1190
  distance: 5
1175
1191
  }
1176
1192
  })
1177
1193
  );
1178
- g.useEffect(() => {
1194
+ p.useEffect(() => {
1179
1195
  const j = () => {
1180
- T(null), P(!1);
1196
+ S(null), E(!1);
1181
1197
  };
1182
- return document.body.addEventListener("click", j), T(null), P(!1), () => {
1183
- T(null), P(!1), document.body.removeEventListener("click", j);
1198
+ return document.body.addEventListener("click", j), S(null), E(!1), () => {
1199
+ S(null), E(!1), document.body.removeEventListener("click", j);
1184
1200
  };
1185
- }, []), g.useEffect(() => {
1201
+ }, []), p.useEffect(() => {
1186
1202
  if (B) {
1187
- const j = [...s].map((E) => E.id === B.id ? B : E);
1203
+ const j = [...s].map((O) => O.id === B.id ? B : O);
1188
1204
  i(j);
1189
1205
  }
1190
- }, [B]), g.useEffect(() => {
1191
- if (b.current && V) {
1192
- const j = b.current.getBoundingClientRect().height, E = window.innerHeight;
1193
- let u = V.top;
1194
- u + j > E + window.scrollY - 200 && (u = E + window.scrollY - j - 200), u < 0 && (u = 10), k({
1195
- top: u,
1196
- left: V.left
1206
+ }, [B]), p.useEffect(() => {
1207
+ if (y.current && X) {
1208
+ const j = y.current.getBoundingClientRect().height, O = window.innerHeight;
1209
+ let _ = X.top;
1210
+ _ + j > O + window.scrollY - 200 && (_ = O + window.scrollY - j - 200), _ < 0 && (_ = 10), D({
1211
+ top: _,
1212
+ left: X.left
1197
1213
  });
1198
1214
  }
1199
- }, [b.current, V]);
1200
- const q = (j, E) => {
1215
+ }, [y.current, X]);
1216
+ const A = (j, O) => {
1201
1217
  j.stopPropagation();
1202
- const u = j.target.getBoundingClientRect();
1203
- K({
1204
- top: u.top + window.scrollY,
1205
- left: u.left - 30
1206
- }), T(E), P(!0);
1218
+ const _ = j.target.getBoundingClientRect();
1219
+ tt({
1220
+ top: _.top + window.scrollY,
1221
+ left: _.left - 30
1222
+ }), S(O), E(!0);
1207
1223
  };
1208
- function M(j) {
1209
- if (f)
1224
+ function H(j) {
1225
+ if (v)
1210
1226
  return j ? /* @__PURE__ */ t.jsx(
1211
1227
  "img",
1212
1228
  {
@@ -1216,7 +1232,7 @@ const aa = (r) => {
1216
1232
  height: 16
1217
1233
  }
1218
1234
  ) : /* @__PURE__ */ t.jsx(
1219
- v,
1235
+ b,
1220
1236
  {
1221
1237
  name: "Image",
1222
1238
  width: 16,
@@ -1225,20 +1241,20 @@ const aa = (r) => {
1225
1241
  }
1226
1242
  );
1227
1243
  }
1228
- const Z = (j) => {
1229
- const { active: E, over: u } = j;
1230
- if (u && E.id !== u.id) {
1231
- const $ = s.findIndex((R) => R.id === E.id), A = s.findIndex((R) => R.id === u.id);
1232
- if ($ !== -1 && A !== -1) {
1233
- const R = [...s], [Y] = R.splice($, 1);
1234
- R.splice(A, 0, Y), i(R);
1244
+ const K = (j) => {
1245
+ const { active: O, over: _ } = j;
1246
+ if (_ && O.id !== _.id) {
1247
+ const I = s.findIndex((R) => R.id === O.id), T = s.findIndex((R) => R.id === _.id);
1248
+ if (I !== -1 && T !== -1) {
1249
+ const R = [...s], [U] = R.splice(I, 1);
1250
+ R.splice(T, 0, U), i(R);
1235
1251
  }
1236
1252
  }
1237
- }, ct = (j) => {
1238
- var u;
1239
- const E = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1240
- o && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
1241
- v,
1253
+ }, lt = (j) => {
1254
+ var _;
1255
+ const O = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
1256
+ c && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
1257
+ b,
1242
1258
  {
1243
1259
  name: "DotsSixVertical",
1244
1260
  hoverable: !0,
@@ -1246,132 +1262,132 @@ const aa = (r) => {
1246
1262
  height: 20
1247
1263
  }
1248
1264
  ) }),
1249
- h === "select" && d && /* @__PURE__ */ t.jsx(
1250
- et,
1265
+ h === "select" && u && /* @__PURE__ */ t.jsx(
1266
+ st,
1251
1267
  {
1252
- onChange: ($) => {
1253
- const R = [...s].map((Y) => Y.id === j.id ? {
1268
+ onChange: (I) => {
1269
+ const R = [...s].map((U) => U.id === j.id ? {
1254
1270
  ...j,
1255
- name: $
1256
- } : Y);
1257
- T({
1271
+ name: I
1272
+ } : U);
1273
+ S({
1258
1274
  ...j,
1259
- name: $
1275
+ name: I
1260
1276
  }), i([...R]);
1261
1277
  },
1262
1278
  value: j.name,
1263
- options: d.filter(($) => !s.find((A) => A.name === $)),
1264
- leftAddon: M(j.images)
1279
+ options: u.filter((I) => !s.find((T) => T.name === I)),
1280
+ leftAddon: H(j.images)
1265
1281
  }
1266
1282
  ),
1267
1283
  h === "input" && /* @__PURE__ */ t.jsx(
1268
- X,
1284
+ W,
1269
1285
  {
1270
- onChange: ($) => {
1271
- const R = [...s].map((Y) => Y.id === j.id ? {
1286
+ onChange: (I) => {
1287
+ const R = [...s].map((U) => U.id === j.id ? {
1272
1288
  ...j,
1273
- name: $
1274
- } : Y);
1289
+ name: I
1290
+ } : U);
1275
1291
  i([...R]);
1276
1292
  },
1277
1293
  value: j.name,
1278
- placeholder: p
1294
+ placeholder: g
1279
1295
  }
1280
1296
  ),
1281
1297
  h === "image" && /* @__PURE__ */ t.jsx(
1282
1298
  gt,
1283
1299
  {
1284
- onChange: ($) => {
1285
- const R = [...s].map((Y) => Y.id === j.id ? {
1300
+ onChange: (I) => {
1301
+ const R = [...s].map((U) => U.id === j.id ? {
1286
1302
  ...j,
1287
- images: $
1288
- } : Y);
1303
+ images: I
1304
+ } : U);
1289
1305
  i([...R]);
1290
1306
  },
1291
- activeImage: (u = s.find(($) => $.id === j.id)) == null ? void 0 : u.images[0]
1307
+ activeImage: (_ = s.find((I) => I.id === j.id)) == null ? void 0 : _.images[0]
1292
1308
  }
1293
1309
  ),
1294
1310
  /* @__PURE__ */ t.jsxs("div", { className: z.buttons, children: [
1295
1311
  n && /* @__PURE__ */ t.jsx("div", { className: z.deleteButton, children: /* @__PURE__ */ t.jsx(
1296
- v,
1312
+ b,
1297
1313
  {
1298
1314
  name: "Sliders",
1299
1315
  hoverable: !0,
1300
1316
  width: 20,
1301
1317
  height: 20,
1302
- onClick: ($) => q($, j)
1318
+ onClick: (I) => A(I, j)
1303
1319
  }
1304
1320
  ) }),
1305
- N && /* @__PURE__ */ t.jsx("div", { className: z.deleteButton, children: /* @__PURE__ */ t.jsx(
1306
- v,
1321
+ f && /* @__PURE__ */ t.jsx("div", { className: z.deleteButton, children: /* @__PURE__ */ t.jsx(
1322
+ b,
1307
1323
  {
1308
1324
  name: "Trash",
1309
1325
  hoverable: !0,
1310
1326
  width: 20,
1311
1327
  height: 20,
1312
1328
  fill: "#C12A2A",
1313
- onClick: () => i(s.filter(($) => $.id !== j.id))
1329
+ onClick: () => i(s.filter((I) => I.id !== j.id))
1314
1330
  }
1315
1331
  ) })
1316
1332
  ] })
1317
1333
  ] });
1318
- return o ? /* @__PURE__ */ t.jsx(
1319
- qs,
1334
+ return c ? /* @__PURE__ */ t.jsx(
1335
+ Ds,
1320
1336
  {
1321
1337
  product: j,
1322
- children: E
1338
+ children: O
1323
1339
  },
1324
1340
  j.id
1325
1341
  ) : /* @__PURE__ */ t.jsx(
1326
1342
  "div",
1327
1343
  {
1328
1344
  className: z.product,
1329
- children: E
1345
+ children: O
1330
1346
  },
1331
1347
  j.id
1332
1348
  );
1333
1349
  };
1334
1350
  return /* @__PURE__ */ t.jsxs("div", { className: z.productsBlock, children: [
1335
- (l || c !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: z.top, children: [
1351
+ (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: z.top, children: [
1336
1352
  l && /* @__PURE__ */ t.jsx("h3", { className: z.title, children: l }),
1337
- c !== void 0 && /* @__PURE__ */ t.jsx(
1338
- tt,
1353
+ a !== void 0 && /* @__PURE__ */ t.jsx(
1354
+ Z,
1339
1355
  {
1340
- current: c,
1356
+ current: a,
1341
1357
  onChange: (j) => e == null ? void 0 : e(j)
1342
1358
  }
1343
1359
  )
1344
1360
  ] }),
1345
- B && n && y && I && /* @__PURE__ */ t.jsx(
1346
- Os,
1361
+ B && n && k && $ && /* @__PURE__ */ t.jsx(
1362
+ Es,
1347
1363
  {
1348
- ref: b,
1364
+ ref: y,
1349
1365
  activeItem: B,
1350
- setActiveItem: T,
1366
+ setActiveItem: S,
1351
1367
  popupPosition: x,
1352
- modalOptions: y,
1353
- setIsOpenModal: P
1368
+ modalOptions: k,
1369
+ setIsOpenModal: E
1354
1370
  }
1355
1371
  ),
1356
- C && D && /* @__PURE__ */ t.jsx(At, { ...D }),
1372
+ w && q && /* @__PURE__ */ t.jsx(At, { ...q }),
1357
1373
  /* @__PURE__ */ t.jsxs("div", { className: z.products, children: [
1358
- m && /* @__PURE__ */ t.jsx("h5", { className: z.subtitle, children: m }),
1359
- o ? /* @__PURE__ */ t.jsx(
1374
+ d && /* @__PURE__ */ t.jsx("h5", { className: z.subtitle, children: d }),
1375
+ c ? /* @__PURE__ */ t.jsx(
1360
1376
  Nt,
1361
1377
  {
1362
- sensors: U,
1363
- onDragEnd: Z,
1378
+ sensors: G,
1379
+ onDragEnd: K,
1364
1380
  children: /* @__PURE__ */ t.jsx(
1365
1381
  wt,
1366
1382
  {
1367
1383
  items: s.map((j) => j.id),
1368
1384
  strategy: Ct,
1369
- children: s.map((j) => ct(j))
1385
+ children: s.map((j) => lt(j))
1370
1386
  }
1371
1387
  )
1372
1388
  }
1373
- ) : s.map((j) => ct(j)),
1374
- _ && /* @__PURE__ */ t.jsx(
1389
+ ) : s.map((j) => lt(j)),
1390
+ m && /* @__PURE__ */ t.jsx(
1375
1391
  "div",
1376
1392
  {
1377
1393
  style: {
@@ -1380,35 +1396,35 @@ const aa = (r) => {
1380
1396
  justifyContent: "center"
1381
1397
  },
1382
1398
  children: /* @__PURE__ */ t.jsx(
1383
- at,
1399
+ ct,
1384
1400
  {
1385
1401
  withoutHover: !0,
1386
1402
  className: z.button,
1387
1403
  size: "s",
1388
1404
  onClick: () => {
1389
1405
  const j = [...s];
1390
- let E = null;
1391
- if (d) {
1392
- for (let u = 0; u < d.length; u++)
1393
- if (!s.find(($) => $.name === d[u])) {
1394
- E = d[u];
1406
+ let O = null;
1407
+ if (u) {
1408
+ for (let _ = 0; _ < u.length; _++)
1409
+ if (!s.find((I) => I.name === u[_])) {
1410
+ O = u[_];
1395
1411
  break;
1396
1412
  }
1397
1413
  }
1398
- h === "select" && d ? j.push({
1399
- name: E || d[0],
1400
- id: mt(),
1414
+ h === "select" && u ? j.push({
1415
+ name: O || u[0],
1416
+ id: _t(),
1401
1417
  ...L,
1402
1418
  maxSymbols: 100
1403
1419
  // пример значения
1404
1420
  }) : h === "input" ? j.push({
1405
1421
  name: "",
1406
- id: mt(),
1422
+ id: _t(),
1407
1423
  ...L,
1408
1424
  maxSymbols: 100
1409
1425
  }) : j.push({
1410
1426
  name: `Image ${s.length + 1}`,
1411
- id: mt(),
1427
+ id: _t(),
1412
1428
  ...L,
1413
1429
  maxSymbols: 100
1414
1430
  }), i(j);
@@ -1419,7 +1435,7 @@ const aa = (r) => {
1419
1435
  children: /* @__PURE__ */ t.jsxs("div", { className: z.addButton, children: [
1420
1436
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
1421
1437
  /* @__PURE__ */ t.jsx(
1422
- v,
1438
+ b,
1423
1439
  {
1424
1440
  name: "Plus",
1425
1441
  width: 16,
@@ -1432,61 +1448,62 @@ const aa = (r) => {
1432
1448
  }
1433
1449
  )
1434
1450
  ] }),
1435
- a !== void 0 && /* @__PURE__ */ t.jsx(jt, { items: a })
1451
+ o !== void 0 && /* @__PURE__ */ t.jsx(bt, { items: o })
1436
1452
  ] });
1437
- }, Es = "_title_174ru_1", Ds = "_subtitle_174ru_5", Ls = "_header_174ru_12", Rs = "_text_174ru_13", Ms = "_productsBlock_174ru_14", Hs = "_buttonsBlock_174ru_15", zs = "_top_174ru_26", Fs = "_itemsBlock_174ru_35", Vs = "_typeTexts_174ru_41", Us = "_block_174ru_48", Ys = "_active_174ru_60", Gs = "_products_174ru_14", Ws = "_product_174ru_14", Xs = "_button_174ru_15", Js = "_image_174ru_90", Qs = "_info_174ru_97", Ks = "_name_174ru_109", Zs = "_buttons_174ru_15", tn = "_modal_174ru_120", en = "_other_174ru_139", sn = "_options_174ru_145", dt = {
1438
- title: Es,
1439
- subtitle: Ds,
1440
- header: Ls,
1441
- text: Rs,
1442
- productsBlock: Ms,
1443
- buttonsBlock: Hs,
1444
- top: zs,
1445
- itemsBlock: Fs,
1446
- typeTexts: Vs,
1447
- block: Us,
1448
- active: Ys,
1449
- products: Gs,
1450
- product: Ws,
1451
- button: Xs,
1452
- image: Js,
1453
- info: Qs,
1454
- name: Ks,
1455
- buttons: Zs,
1456
- modal: tn,
1457
- other: en,
1458
- options: sn
1459
- }, nn = g.forwardRef((r, c) => {
1460
- const { activeButton: e, setActiveButton: s, popupPosition: i } = r, [a, l] = g.useState(e.typesText), [m, n] = g.useState(e.destination), [o, f] = g.useState(e.page), [N, _] = g.useState(e.link || ""), [h, p] = g.useState(e.text || ""), [d, C] = g.useState(e.openInNewTab), { pages: D } = Ht();
1461
- return g.useEffect(() => {
1453
+ }, Ls = "_title_bn7sv_1", Rs = "_subtitle_bn7sv_5", Ms = "_header_bn7sv_12", Hs = "_text_bn7sv_13", zs = "_productsBlock_bn7sv_14", Fs = "_buttonsBlock_bn7sv_15", Vs = "_top_bn7sv_26", Us = "_itemsBlock_bn7sv_35", Ys = "_typeTexts_bn7sv_41", Gs = "_block_bn7sv_48", Ws = "_active_bn7sv_60", Xs = "_products_bn7sv_14", Js = "_product_bn7sv_14", Qs = "_button_bn7sv_15", Ks = "_image_bn7sv_90", Zs = "_info_bn7sv_97", tn = "_name_bn7sv_109", en = "_buttons_bn7sv_15", sn = "_modal_bn7sv_120", nn = "_other_bn7sv_139", on = "_options_bn7sv_145", an = "_closeIcon_bn7sv_153", at = {
1454
+ title: Ls,
1455
+ subtitle: Rs,
1456
+ header: Ms,
1457
+ text: Hs,
1458
+ productsBlock: zs,
1459
+ buttonsBlock: Fs,
1460
+ top: Vs,
1461
+ itemsBlock: Us,
1462
+ typeTexts: Ys,
1463
+ block: Gs,
1464
+ active: Ws,
1465
+ products: Xs,
1466
+ product: Js,
1467
+ button: Qs,
1468
+ image: Ks,
1469
+ info: Zs,
1470
+ name: tn,
1471
+ buttons: en,
1472
+ modal: sn,
1473
+ other: nn,
1474
+ options: on,
1475
+ closeIcon: an
1476
+ }, cn = p.forwardRef((r, a) => {
1477
+ const { activeButton: e, setActiveButton: s, popupPosition: i } = r, [o, l] = p.useState(e.typesText), [d, n] = p.useState(e.destination), [c, v] = p.useState(e.page), [f, m] = p.useState(e.link || ""), [h, g] = p.useState(e.text || ""), [u, w] = p.useState(e.openInNewTab), { pages: q } = Ht();
1478
+ return p.useEffect(() => {
1462
1479
  s({
1463
1480
  ...e,
1464
1481
  ...{
1465
1482
  text: h,
1466
- link: N,
1467
- destination: m,
1468
- typesText: a,
1469
- page: o,
1470
- openInNewTab: d
1483
+ link: f,
1484
+ destination: d,
1485
+ typesText: o,
1486
+ page: c,
1487
+ openInNewTab: u
1471
1488
  }
1472
1489
  });
1473
- }, [a, m, N, h, o, d]), /* @__PURE__ */ t.jsxs(
1490
+ }, [o, d, f, h, c, u]), /* @__PURE__ */ t.jsxs(
1474
1491
  "div",
1475
1492
  {
1476
- className: dt.modal,
1477
- onClick: (y) => {
1478
- y.stopPropagation();
1493
+ className: at.modal,
1494
+ onClick: (k) => {
1495
+ k.stopPropagation();
1479
1496
  },
1480
1497
  style: {
1481
1498
  top: `${i.top}px`,
1482
1499
  left: `${i.left}px`
1483
1500
  },
1484
- ref: c,
1501
+ ref: a,
1485
1502
  children: [
1486
- /* @__PURE__ */ t.jsxs("div", { className: dt.top, children: [
1487
- /* @__PURE__ */ t.jsx("h3", { className: dt.title, children: e.type }),
1488
- /* @__PURE__ */ t.jsx(
1489
- v,
1503
+ /* @__PURE__ */ t.jsxs("div", { className: at.top, children: [
1504
+ /* @__PURE__ */ t.jsx("h3", { className: at.title, children: e.type }),
1505
+ /* @__PURE__ */ t.jsx("div", { className: at.closeIcon, children: /* @__PURE__ */ t.jsx(
1506
+ b,
1490
1507
  {
1491
1508
  name: "X",
1492
1509
  height: 20,
@@ -1494,47 +1511,47 @@ const aa = (r) => {
1494
1511
  hoverable: !0,
1495
1512
  onClick: () => s(null)
1496
1513
  }
1497
- )
1514
+ ) })
1498
1515
  ] }),
1499
- /* @__PURE__ */ t.jsxs("div", { className: dt.options, children: [
1516
+ /* @__PURE__ */ t.jsxs("div", { className: at.options, children: [
1500
1517
  /* @__PURE__ */ t.jsx(
1501
- et,
1518
+ st,
1502
1519
  {
1503
1520
  label: "Destination",
1504
- onChange: (y) => n(y),
1505
- options: ["Go to Page", "Open Link"].filter((y) => y !== m),
1506
- value: m
1521
+ onChange: (k) => n(k),
1522
+ options: ["Go to Page", "Open Link"].filter((k) => k !== d),
1523
+ value: d
1507
1524
  }
1508
1525
  ),
1509
- m === "Go to Page" ? /* @__PURE__ */ t.jsx(
1510
- et,
1526
+ d === "Go to Page" ? /* @__PURE__ */ t.jsx(
1527
+ st,
1511
1528
  {
1512
1529
  label: "Go to",
1513
- onChange: (y) => f(y),
1514
- options: D ? Object.values(D).filter((y) => y.name !== o).map((y) => y.name) : [],
1515
- value: o
1530
+ onChange: (k) => v(k),
1531
+ options: q ? Object.values(q).filter((k) => k.name !== c).map((k) => k.name) : [],
1532
+ value: c
1516
1533
  }
1517
1534
  ) : /* @__PURE__ */ t.jsx(
1518
- X,
1535
+ W,
1519
1536
  {
1520
- onChange: (y) => _(y),
1521
- value: N,
1537
+ onChange: (k) => m(k),
1538
+ value: f,
1522
1539
  placeholder: "https://",
1523
1540
  label: "Link"
1524
1541
  }
1525
1542
  ),
1526
1543
  /* @__PURE__ */ t.jsx(
1527
- tt,
1544
+ Z,
1528
1545
  {
1529
1546
  current: e.openInNewTab,
1530
1547
  label: "Open in new tab",
1531
- onChange: (y) => C(y)
1548
+ onChange: (k) => w(k)
1532
1549
  }
1533
1550
  ),
1534
1551
  /* @__PURE__ */ t.jsx(
1535
1552
  Ot,
1536
1553
  {
1537
- onChange: (y) => p(y),
1554
+ onChange: (k) => g(k),
1538
1555
  value: h,
1539
1556
  label: "Text",
1540
1557
  maxLength: 150
@@ -1543,7 +1560,7 @@ const aa = (r) => {
1543
1560
  /* @__PURE__ */ t.jsx(
1544
1561
  Lt,
1545
1562
  {
1546
- typesText: a,
1563
+ typesText: o,
1547
1564
  setTypesText: l
1548
1565
  }
1549
1566
  )
@@ -1551,106 +1568,106 @@ const aa = (r) => {
1551
1568
  ]
1552
1569
  }
1553
1570
  );
1554
- }), on = "_subtitle_jql1y_1", an = "_header_jql1y_8", cn = "_text_jql1y_9", ln = "_productsBlock_jql1y_10", rn = "_buttonsBlock_jql1y_11", dn = "_top_jql1y_23", un = "_itemsBlock_jql1y_32", mn = "_typeTexts_jql1y_38", hn = "_block_jql1y_45", _n = "_active_jql1y_58", pn = "_products_jql1y_10", gn = "_product_jql1y_10", fn = "_button_jql1y_11", xn = "_image_jql1y_88", bn = "_info_jql1y_95", jn = "_name_jql1y_107", vn = "_buttons_jql1y_11", yn = "_modal_jql1y_118", kn = "_other_jql1y_138", $n = "_options_jql1y_144", In = "_addButton_jql1y_150", Nn = "_deleteButton_jql1y_165", st = {
1555
- subtitle: on,
1556
- header: an,
1557
- text: cn,
1558
- productsBlock: ln,
1559
- buttonsBlock: rn,
1560
- top: dn,
1561
- itemsBlock: un,
1562
- typeTexts: mn,
1563
- block: hn,
1564
- active: _n,
1565
- products: pn,
1566
- product: gn,
1567
- button: fn,
1568
- image: xn,
1569
- info: bn,
1570
- name: jn,
1571
- buttons: vn,
1572
- modal: yn,
1573
- other: kn,
1574
- options: $n,
1575
- addButton: In,
1576
- deleteButton: Nn
1577
- }, wn = (r) => {
1578
- const { buttons: c, setButtons: e, deletable: s = !0, addable: i = !0 } = r, [a, l] = g.useState(null), [m, n] = g.useState({
1571
+ }), ln = "_subtitle_jql1y_1", rn = "_header_jql1y_8", dn = "_text_jql1y_9", un = "_productsBlock_jql1y_10", _n = "_buttonsBlock_jql1y_11", hn = "_top_jql1y_23", mn = "_itemsBlock_jql1y_32", pn = "_typeTexts_jql1y_38", gn = "_block_jql1y_45", fn = "_active_jql1y_58", xn = "_products_jql1y_10", vn = "_product_jql1y_10", bn = "_button_jql1y_11", jn = "_image_jql1y_88", yn = "_info_jql1y_95", kn = "_name_jql1y_107", In = "_buttons_jql1y_11", $n = "_modal_jql1y_118", Nn = "_other_jql1y_138", wn = "_options_jql1y_144", Cn = "_addButton_jql1y_150", Bn = "_deleteButton_jql1y_165", nt = {
1572
+ subtitle: ln,
1573
+ header: rn,
1574
+ text: dn,
1575
+ productsBlock: un,
1576
+ buttonsBlock: _n,
1577
+ top: hn,
1578
+ itemsBlock: mn,
1579
+ typeTexts: pn,
1580
+ block: gn,
1581
+ active: fn,
1582
+ products: xn,
1583
+ product: vn,
1584
+ button: bn,
1585
+ image: jn,
1586
+ info: yn,
1587
+ name: kn,
1588
+ buttons: In,
1589
+ modal: $n,
1590
+ other: Nn,
1591
+ options: wn,
1592
+ addButton: Cn,
1593
+ deleteButton: Bn
1594
+ }, Sn = (r) => {
1595
+ const { buttons: a, setButtons: e, deletable: s = !0, addable: i = !0 } = r, [o, l] = p.useState(null), [d, n] = p.useState({
1579
1596
  top: 0,
1580
1597
  left: 0
1581
- }), [o, f] = g.useState(null), N = g.useRef(null);
1582
- g.useEffect(() => {
1598
+ }), [c, v] = p.useState(null), f = p.useRef(null);
1599
+ p.useEffect(() => {
1583
1600
  const h = () => {
1584
1601
  l(null);
1585
1602
  };
1586
1603
  return document.body.addEventListener("click", h), l(null), () => {
1587
1604
  l(null), document.body.removeEventListener("click", h);
1588
1605
  };
1589
- }, []), g.useEffect(() => {
1590
- if (a) {
1591
- const h = [...c].map((p) => p.id === a.id ? a : p);
1606
+ }, []), p.useEffect(() => {
1607
+ if (o) {
1608
+ const h = [...a].map((g) => g.id === o.id ? o : g);
1592
1609
  e(h);
1593
1610
  }
1594
- }, [a]), g.useEffect(() => {
1595
- if (N.current && o) {
1596
- const h = N.current.getBoundingClientRect().height, p = window.innerHeight;
1597
- let d = o.top;
1598
- d + h > p + window.scrollY - 200 && (d = p + window.scrollY - h - 200), d < 0 && (d = 10), n({
1599
- top: d,
1600
- left: o.left
1611
+ }, [o]), p.useEffect(() => {
1612
+ if (f.current && c) {
1613
+ const h = f.current.getBoundingClientRect().height, g = window.innerHeight;
1614
+ let u = c.top;
1615
+ u + h > g + window.scrollY - 200 && (u = g + window.scrollY - h - 200), u < 0 && (u = 10), n({
1616
+ top: u,
1617
+ left: c.left
1601
1618
  });
1602
1619
  }
1603
- }, [N.current, o]);
1604
- const _ = (h, p) => {
1620
+ }, [f.current, c]);
1621
+ const m = (h, g) => {
1605
1622
  h.stopPropagation();
1606
- const d = h.target.getBoundingClientRect();
1607
- f({
1608
- top: d.top + window.scrollY,
1609
- left: d.left - 30
1610
- }), l(p);
1623
+ const u = h.target.getBoundingClientRect();
1624
+ v({
1625
+ top: u.top + window.scrollY,
1626
+ left: u.left - 30
1627
+ }), l(g);
1611
1628
  };
1612
- return /* @__PURE__ */ t.jsxs("div", { className: st.products, children: [
1613
- /* @__PURE__ */ t.jsx("h5", { className: st.subtitle, children: "Button Type" }),
1614
- c.map((h) => /* @__PURE__ */ t.jsxs(
1629
+ return /* @__PURE__ */ t.jsxs("div", { className: nt.products, children: [
1630
+ /* @__PURE__ */ t.jsx("h5", { className: nt.subtitle, children: "Button Type" }),
1631
+ a.map((h) => /* @__PURE__ */ t.jsxs(
1615
1632
  "div",
1616
1633
  {
1617
- className: st.product,
1634
+ className: nt.product,
1618
1635
  children: [
1619
1636
  /* @__PURE__ */ t.jsx(
1620
- et,
1637
+ st,
1621
1638
  {
1622
- onChange: (p) => {
1623
- const C = [...c].map((D) => D.id === h.id ? {
1639
+ onChange: (g) => {
1640
+ const w = [...a].map((q) => q.id === h.id ? {
1624
1641
  ...h,
1625
- type: p
1626
- } : D);
1627
- e(C);
1642
+ type: g
1643
+ } : q);
1644
+ e(w);
1628
1645
  },
1629
1646
  value: h.type,
1630
1647
  options: ["Primary", "Secondary", "Tertiary"]
1631
1648
  }
1632
1649
  ),
1633
- /* @__PURE__ */ t.jsxs("div", { className: st.buttons, children: [
1634
- /* @__PURE__ */ t.jsx("div", { className: st.deleteButton, children: /* @__PURE__ */ t.jsx(
1635
- v,
1650
+ /* @__PURE__ */ t.jsxs("div", { className: nt.buttons, children: [
1651
+ /* @__PURE__ */ t.jsx("div", { className: nt.deleteButton, children: /* @__PURE__ */ t.jsx(
1652
+ b,
1636
1653
  {
1637
1654
  name: "Sliders",
1638
1655
  hoverable: !0,
1639
1656
  width: 20,
1640
1657
  height: 20,
1641
- onClick: (p) => {
1642
- _(p, h);
1658
+ onClick: (g) => {
1659
+ m(g, h);
1643
1660
  }
1644
1661
  }
1645
1662
  ) }),
1646
- s && /* @__PURE__ */ t.jsx("div", { className: st.deleteButton, children: /* @__PURE__ */ t.jsx(
1647
- v,
1663
+ s && /* @__PURE__ */ t.jsx("div", { className: nt.deleteButton, children: /* @__PURE__ */ t.jsx(
1664
+ b,
1648
1665
  {
1649
1666
  name: "Trash",
1650
1667
  hoverable: !0,
1651
1668
  onClick: () => {
1652
- const p = c.filter((d) => d.id !== h.id);
1653
- e(p);
1669
+ const g = a.filter((u) => u.id !== h.id);
1670
+ e(g);
1654
1671
  },
1655
1672
  width: 20,
1656
1673
  height: 20,
@@ -1662,13 +1679,13 @@ const aa = (r) => {
1662
1679
  },
1663
1680
  h.id
1664
1681
  )),
1665
- a && /* @__PURE__ */ t.jsx(
1666
- nn,
1682
+ o && /* @__PURE__ */ t.jsx(
1683
+ cn,
1667
1684
  {
1668
- ref: N,
1669
- activeButton: a,
1685
+ ref: f,
1686
+ activeButton: o,
1670
1687
  setActiveButton: l,
1671
- popupPosition: m
1688
+ popupPosition: d
1672
1689
  }
1673
1690
  ),
1674
1691
  i && /* @__PURE__ */ t.jsx(
@@ -1680,16 +1697,16 @@ const aa = (r) => {
1680
1697
  justifyContent: "center"
1681
1698
  },
1682
1699
  children: /* @__PURE__ */ t.jsx(
1683
- at,
1700
+ ct,
1684
1701
  {
1685
1702
  withoutHover: !0,
1686
- className: st.button,
1703
+ className: nt.button,
1687
1704
  size: "s",
1688
1705
  onClick: () => {
1689
- const h = [...c];
1706
+ const h = [...a];
1690
1707
  h.push({
1691
1708
  type: "Primary",
1692
- id: mt(),
1709
+ id: _t(),
1693
1710
  typesText: [],
1694
1711
  destination: "Go to Page",
1695
1712
  text: "Button Name",
@@ -1700,10 +1717,10 @@ const aa = (r) => {
1700
1717
  style: {
1701
1718
  width: "fit-content"
1702
1719
  },
1703
- children: /* @__PURE__ */ t.jsxs("div", { className: st.addButton, children: [
1720
+ children: /* @__PURE__ */ t.jsxs("div", { className: nt.addButton, children: [
1704
1721
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
1705
1722
  /* @__PURE__ */ t.jsx(
1706
- v,
1723
+ b,
1707
1724
  {
1708
1725
  name: "Plus",
1709
1726
  width: 16,
@@ -1716,77 +1733,77 @@ const aa = (r) => {
1716
1733
  }
1717
1734
  )
1718
1735
  ] });
1719
- }, ca = (r) => {
1720
- const { isActiveButtons: c, setIsActiveButtons: e, buttons: s, setButtons: i } = r;
1721
- return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: dt.buttonsBlock, children: [
1722
- /* @__PURE__ */ t.jsxs("div", { className: dt.top, children: [
1723
- /* @__PURE__ */ t.jsx("h3", { className: dt.title, children: "Buttons" }),
1736
+ }, ua = (r) => {
1737
+ const { isActiveButtons: a, setIsActiveButtons: e, buttons: s, setButtons: i } = r;
1738
+ return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: at.buttonsBlock, children: [
1739
+ /* @__PURE__ */ t.jsxs("div", { className: at.top, children: [
1740
+ /* @__PURE__ */ t.jsx("h3", { className: at.title, children: "Buttons" }),
1724
1741
  /* @__PURE__ */ t.jsx(
1725
- tt,
1742
+ Z,
1726
1743
  {
1727
- current: c,
1728
- onChange: (a) => e(a)
1744
+ current: a,
1745
+ onChange: (o) => e(o)
1729
1746
  }
1730
1747
  )
1731
1748
  ] }),
1732
1749
  /* @__PURE__ */ t.jsx(
1733
- wn,
1750
+ Sn,
1734
1751
  {
1735
1752
  buttons: s,
1736
1753
  setButtons: i
1737
1754
  }
1738
1755
  )
1739
1756
  ] }) });
1740
- }, Cn = "_wrapper_m18qi_1", Bn = "_subtitle_m18qi_7", Sn = "_content_m18qi_14", Tn = "_range_m18qi_22", Pn = "_track_m18qi_27", An = "_progress_m18qi_36", On = "_dots_m18qi_46", qn = "_dot_m18qi_46", En = "_active_m18qi_65", Dn = "_input_m18qi_77", Ln = "_countBlock_m18qi_91", Rn = "_count_m18qi_91", Mn = "_controls_m18qi_107", Hn = "_button_m18qi_113", G = {
1741
- wrapper: Cn,
1742
- subtitle: Bn,
1743
- content: Sn,
1744
- range: Tn,
1745
- track: Pn,
1746
- progress: An,
1747
- dots: On,
1748
- dot: qn,
1749
- active: En,
1750
- input: Dn,
1751
- countBlock: Ln,
1752
- count: Rn,
1753
- controls: Mn,
1754
- button: Hn
1757
+ }, Tn = "_wrapper_m18qi_1", Pn = "_subtitle_m18qi_7", An = "_content_m18qi_14", On = "_range_m18qi_22", qn = "_track_m18qi_27", En = "_progress_m18qi_36", Dn = "_dots_m18qi_46", Ln = "_dot_m18qi_46", Rn = "_active_m18qi_65", Mn = "_input_m18qi_77", Hn = "_countBlock_m18qi_91", zn = "_count_m18qi_91", Fn = "_controls_m18qi_107", Vn = "_button_m18qi_113", Y = {
1758
+ wrapper: Tn,
1759
+ subtitle: Pn,
1760
+ content: An,
1761
+ range: On,
1762
+ track: qn,
1763
+ progress: En,
1764
+ dots: Dn,
1765
+ dot: Ln,
1766
+ active: Rn,
1767
+ input: Mn,
1768
+ countBlock: Hn,
1769
+ count: zn,
1770
+ controls: Fn,
1771
+ button: Vn
1755
1772
  }, At = (r) => {
1756
- const { label: c, min: e = 1, max: s = 4, step: i = 1, count: a, setCount: l } = r, [m, n] = g.useState(!1), o = Array.from({ length: (s - e) / i + 1 }), f = (a - e) / (s - e) * 100, N = () => {
1757
- a < s && l(a + i);
1758
- }, _ = () => {
1759
- a > e && l(a - i);
1760
- }, h = (p) => {
1761
- const d = e + p * i;
1762
- l(d);
1773
+ const { label: a, min: e = 1, max: s = 4, step: i = 1, count: o, setCount: l } = r, [d, n] = p.useState(!1), c = Array.from({ length: (s - e) / i + 1 }), v = (o - e) / (s - e) * 100, f = () => {
1774
+ o < s && l(o + i);
1775
+ }, m = () => {
1776
+ o > e && l(o - i);
1777
+ }, h = (g) => {
1778
+ const u = e + g * i;
1779
+ l(u);
1763
1780
  };
1764
- return /* @__PURE__ */ t.jsxs("div", { className: G.wrapper, children: [
1765
- c && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: c }),
1766
- /* @__PURE__ */ t.jsxs("div", { className: G.content, children: [
1767
- /* @__PURE__ */ t.jsxs("div", { className: G.range, children: [
1768
- /* @__PURE__ */ t.jsx("div", { className: G.track }),
1781
+ return /* @__PURE__ */ t.jsxs("div", { className: Y.wrapper, children: [
1782
+ a && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: a }),
1783
+ /* @__PURE__ */ t.jsxs("div", { className: Y.content, children: [
1784
+ /* @__PURE__ */ t.jsxs("div", { className: Y.range, children: [
1785
+ /* @__PURE__ */ t.jsx("div", { className: Y.track }),
1769
1786
  /* @__PURE__ */ t.jsx(
1770
1787
  "div",
1771
1788
  {
1772
- className: G.progress,
1773
- style: { width: `${f}%` }
1789
+ className: Y.progress,
1790
+ style: { width: `${v}%` }
1774
1791
  }
1775
1792
  ),
1776
- /* @__PURE__ */ t.jsx("div", { className: G.dots, children: o.map((p, d) => {
1777
- const C = d <= (a - e) / i;
1793
+ /* @__PURE__ */ t.jsx("div", { className: Y.dots, children: c.map((g, u) => {
1794
+ const w = u <= (o - e) / i;
1778
1795
  return /* @__PURE__ */ t.jsx(
1779
1796
  "button",
1780
1797
  {
1781
- onClick: () => h(d),
1782
- className: F(G.dot, {
1783
- [G.active]: C,
1784
- [G.inactive]: !C,
1785
- [G.dragging]: m
1798
+ onClick: () => h(u),
1799
+ className: F(Y.dot, {
1800
+ [Y.active]: w,
1801
+ [Y.inactive]: !w,
1802
+ [Y.dragging]: d
1786
1803
  }),
1787
- "aria-label": `Set value to ${e + d * i}`
1804
+ "aria-label": `Set value to ${e + u * i}`
1788
1805
  },
1789
- d
1806
+ u
1790
1807
  );
1791
1808
  }) }),
1792
1809
  /* @__PURE__ */ t.jsx(
@@ -1796,41 +1813,41 @@ const aa = (r) => {
1796
1813
  min: e,
1797
1814
  max: s,
1798
1815
  step: i,
1799
- value: a,
1800
- onChange: (p) => l(Number(p.target.value)),
1816
+ value: o,
1817
+ onChange: (g) => l(Number(g.target.value)),
1801
1818
  onMouseDown: () => n(!0),
1802
1819
  onMouseUp: () => n(!1),
1803
1820
  onTouchStart: () => n(!0),
1804
1821
  onTouchEnd: () => n(!1),
1805
- className: G.input
1822
+ className: Y.input
1806
1823
  }
1807
1824
  )
1808
1825
  ] }),
1809
- /* @__PURE__ */ t.jsxs("div", { className: G.countBlock, children: [
1826
+ /* @__PURE__ */ t.jsxs("div", { className: Y.countBlock, children: [
1810
1827
  /* @__PURE__ */ t.jsx(
1811
- X,
1828
+ W,
1812
1829
  {
1813
1830
  type: "number",
1814
1831
  min: e,
1815
1832
  max: s,
1816
1833
  paddingless: !0,
1817
- onChange: (p) => {
1818
- const d = Number(p);
1819
- d > s ? l(s) : d < e ? l(e) : l(d);
1834
+ onChange: (g) => {
1835
+ const u = Number(g);
1836
+ u > s ? l(s) : u < e ? l(e) : l(u);
1820
1837
  },
1821
- value: String(a)
1838
+ value: String(o)
1822
1839
  }
1823
1840
  ),
1824
- /* @__PURE__ */ t.jsxs("div", { className: G.controls, children: [
1841
+ /* @__PURE__ */ t.jsxs("div", { className: Y.controls, children: [
1825
1842
  /* @__PURE__ */ t.jsx(
1826
1843
  "button",
1827
1844
  {
1828
- onClick: N,
1829
- disabled: a >= s,
1830
- className: G.button,
1845
+ onClick: f,
1846
+ disabled: o >= s,
1847
+ className: Y.button,
1831
1848
  "aria-label": "Increment count",
1832
1849
  children: /* @__PURE__ */ t.jsx(
1833
- v,
1850
+ b,
1834
1851
  {
1835
1852
  name: "CaretUp",
1836
1853
  width: 15,
@@ -1842,12 +1859,12 @@ const aa = (r) => {
1842
1859
  /* @__PURE__ */ t.jsx(
1843
1860
  "button",
1844
1861
  {
1845
- onClick: _,
1846
- disabled: a <= e,
1847
- className: G.button,
1862
+ onClick: m,
1863
+ disabled: o <= e,
1864
+ className: Y.button,
1848
1865
  "aria-label": "Decrement count",
1849
1866
  children: /* @__PURE__ */ t.jsx(
1850
- v,
1867
+ b,
1851
1868
  {
1852
1869
  name: "CaretDown",
1853
1870
  width: 15,
@@ -1860,39 +1877,40 @@ const aa = (r) => {
1860
1877
  ] })
1861
1878
  ] })
1862
1879
  ] });
1863
- }, zn = "_title_1lejm_1", Fn = "_subtitle_1lejm_5", Vn = "_header_1lejm_12", Un = "_text_1lejm_13", Yn = "_productsBlock_1lejm_14", Gn = "_top_1lejm_26", Wn = "_itemsBlock_1lejm_35", Xn = "_typeTexts_1lejm_41", Jn = "_block_1lejm_48", Qn = "_active_1lejm_61", Kn = "_products_1lejm_14", Zn = "_product_1lejm_14", ti = "_button_1lejm_80", ei = "_image_1lejm_91", si = "_info_1lejm_98", ni = "_name_1lejm_110", ii = "_buttons_1lejm_114", oi = "_modal_1lejm_121", ai = "_link_1lejm_141", ci = "_modalOptions_1lejm_147", li = "_addButton_1lejm_159", ri = "_deleteButton_1lejm_174", W = {
1864
- title: zn,
1865
- subtitle: Fn,
1866
- header: Vn,
1867
- text: Un,
1868
- productsBlock: Yn,
1869
- top: Gn,
1870
- itemsBlock: Wn,
1871
- typeTexts: Xn,
1872
- block: Jn,
1873
- active: Qn,
1874
- products: Kn,
1875
- product: Zn,
1876
- button: ti,
1877
- image: ei,
1878
- info: si,
1879
- name: ni,
1880
- buttons: ii,
1881
- modal: oi,
1882
- link: ai,
1883
- modalOptions: ci,
1884
- addButton: li,
1885
- deleteButton: ri
1886
- }, di = (r) => {
1887
- const { activeItem: c, setActiveItem: e, popupPosition: s, setIsOpenModal: i, itemsOptions: a } = r, l = a.find((n) => n.id === c.listingId);
1880
+ }, Un = "_title_12elg_1", Yn = "_subtitle_12elg_5", Gn = "_header_12elg_12", Wn = "_text_12elg_13", Xn = "_productsBlock_12elg_14", Jn = "_top_12elg_26", Qn = "_itemsBlock_12elg_35", Kn = "_typeTexts_12elg_41", Zn = "_block_12elg_48", ti = "_active_12elg_61", ei = "_products_12elg_14", si = "_product_12elg_14", ni = "_button_12elg_80", ii = "_image_12elg_91", oi = "_info_12elg_98", ai = "_name_12elg_110", ci = "_buttons_12elg_114", li = "_modal_12elg_121", ri = "_link_12elg_141", di = "_modalOptions_12elg_147", ui = "_addButton_12elg_159", _i = "_deleteButton_12elg_174", hi = "_closeIcon_12elg_186", V = {
1881
+ title: Un,
1882
+ subtitle: Yn,
1883
+ header: Gn,
1884
+ text: Wn,
1885
+ productsBlock: Xn,
1886
+ top: Jn,
1887
+ itemsBlock: Qn,
1888
+ typeTexts: Kn,
1889
+ block: Zn,
1890
+ active: ti,
1891
+ products: ei,
1892
+ product: si,
1893
+ button: ni,
1894
+ image: ii,
1895
+ info: oi,
1896
+ name: ai,
1897
+ buttons: ci,
1898
+ modal: li,
1899
+ link: ri,
1900
+ modalOptions: di,
1901
+ addButton: ui,
1902
+ deleteButton: _i,
1903
+ closeIcon: hi
1904
+ }, mi = (r) => {
1905
+ const { activeItem: a, setActiveItem: e, popupPosition: s, setIsOpenModal: i, itemsOptions: o } = r, l = o.find((n) => n.id === a.listingId);
1888
1906
  if (!l) return null;
1889
- function m(n, o) {
1890
- return n.length > o ? `${n.slice(0, o)}...` : n;
1907
+ function d(n, c) {
1908
+ return n.length > c ? `${n.slice(0, c)}...` : n;
1891
1909
  }
1892
1910
  return /* @__PURE__ */ t.jsxs(
1893
1911
  "div",
1894
1912
  {
1895
- className: W.modal,
1913
+ className: V.modal,
1896
1914
  onClick: (n) => {
1897
1915
  n.stopPropagation();
1898
1916
  },
@@ -1901,32 +1919,31 @@ const aa = (r) => {
1901
1919
  left: `${s.left}px`
1902
1920
  },
1903
1921
  children: [
1904
- /* @__PURE__ */ t.jsxs("div", { className: W.top, children: [
1905
- /* @__PURE__ */ t.jsx("h3", { children: m(l.productData.name, 20) }),
1906
- /* @__PURE__ */ t.jsx(
1907
- v,
1922
+ /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
1923
+ /* @__PURE__ */ t.jsx("h3", { children: d(l.productData.name, 20) }),
1924
+ /* @__PURE__ */ t.jsx("div", { className: V.closeIcon, children: /* @__PURE__ */ t.jsx(
1925
+ b,
1908
1926
  {
1909
1927
  name: "X",
1910
1928
  height: 20,
1911
1929
  width: 20,
1912
- hoverable: !0,
1913
1930
  onClick: () => {
1914
1931
  i(!1), e(null);
1915
1932
  }
1916
1933
  }
1917
- )
1934
+ ) })
1918
1935
  ] }),
1919
- /* @__PURE__ */ t.jsx("div", { className: W.modalOptions, children: /* @__PURE__ */ t.jsx(
1936
+ /* @__PURE__ */ t.jsx("div", { className: V.modalOptions, children: /* @__PURE__ */ t.jsx(
1920
1937
  gt,
1921
1938
  {
1922
1939
  label: "Put up an attractive image",
1923
1940
  activeImage: l.productData.images.length > 0 ? l.productData.images[0].cfId : void 0,
1924
1941
  onChange: (n) => {
1925
- const o = {
1926
- ...c,
1942
+ const c = {
1943
+ ...a,
1927
1944
  image: n[0]
1928
1945
  };
1929
- e(o);
1946
+ e(c);
1930
1947
  }
1931
1948
  }
1932
1949
  ) })
@@ -1934,87 +1951,87 @@ const aa = (r) => {
1934
1951
  }
1935
1952
  );
1936
1953
  };
1937
- function ui(r) {
1938
- const { product: c, children: e } = r, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: m, isDragging: n } = St({
1939
- id: String(c.listingId)
1940
- }), o = {
1954
+ function pi(r) {
1955
+ const { product: a, children: e } = r, { attributes: s, listeners: i, setNodeRef: o, transform: l, transition: d, isDragging: n } = St({
1956
+ id: String(a.listingId)
1957
+ }), c = {
1941
1958
  transform: Tt.Transform.toString(l),
1942
- transition: m
1959
+ transition: d
1943
1960
  };
1944
1961
  return /* @__PURE__ */ t.jsx(
1945
1962
  "div",
1946
1963
  {
1947
- ref: a,
1948
- style: o,
1949
- className: `${W.product} ${n ? W.dragging : ""}`,
1964
+ ref: o,
1965
+ style: c,
1966
+ className: `${V.product} ${n ? V.dragging : ""}`,
1950
1967
  ...s,
1951
1968
  ...i,
1952
1969
  children: e
1953
1970
  }
1954
1971
  );
1955
1972
  }
1956
- const la = (r) => {
1973
+ const _a = (r) => {
1957
1974
  const {
1958
- isActiveItems: c,
1975
+ isActiveItems: a,
1959
1976
  setIsActiveItems: e,
1960
1977
  items: s,
1961
1978
  setItems: i,
1962
- other: a,
1979
+ other: o,
1963
1980
  title: l,
1964
- subtitle: m,
1981
+ subtitle: d,
1965
1982
  editable: n = !0,
1966
- draggable: o = !1,
1967
- withImage: f = !1,
1968
- deletable: N = !0,
1969
- addable: _ = !0,
1983
+ draggable: c = !1,
1984
+ withImage: v = !1,
1985
+ deletable: f = !0,
1986
+ addable: m = !0,
1970
1987
  itemsType: h,
1971
- itemsOptions: p
1972
- } = r, [d, C] = g.useState(
1988
+ itemsOptions: g
1989
+ } = r, [u, w] = p.useState(
1973
1990
  null
1974
- ), [D, y] = g.useState({
1991
+ ), [q, k] = p.useState({
1975
1992
  top: 0,
1976
1993
  left: 0
1977
- }), [L, B] = g.useState(!1), T = $t(
1978
- It(Bt, {
1994
+ }), [L, B] = p.useState(!1), S = It(
1995
+ $t(Bt, {
1979
1996
  activationConstraint: {
1980
1997
  distance: 5
1981
1998
  }
1982
1999
  })
1983
2000
  );
1984
- g.useEffect(() => {
1985
- const b = () => {
1986
- C(null), B(!1);
2001
+ p.useEffect(() => {
2002
+ const y = () => {
2003
+ w(null), B(!1);
1987
2004
  };
1988
- return document.body.addEventListener("click", b), C(null), B(!1), () => {
1989
- C(null), B(!1), document.body.removeEventListener("click", b);
2005
+ return document.body.addEventListener("click", y), w(null), B(!1), () => {
2006
+ w(null), B(!1), document.body.removeEventListener("click", y);
1990
2007
  };
1991
- }, []), g.useEffect(() => {
1992
- if (d) {
1993
- const b = [...s].map((I) => I.listingId === d.listingId ? d : I);
1994
- i(b);
2008
+ }, []), p.useEffect(() => {
2009
+ if (u) {
2010
+ const y = [...s].map(($) => $.listingId === u.listingId ? u : $);
2011
+ i(y);
1995
2012
  }
1996
- }, [d]);
1997
- const x = (b, I) => {
1998
- b.stopPropagation();
1999
- const P = b.target.getBoundingClientRect(), U = 100, q = window.innerHeight;
2000
- let M = P.top + window.scrollY;
2001
- M + U > q && (M = q - U - 20), B(!0), y({
2002
- top: M - 80,
2003
- left: P.left - 30
2004
- }), C(I);
2013
+ }, [u]);
2014
+ const x = (y, $) => {
2015
+ y.stopPropagation();
2016
+ const E = y.target.getBoundingClientRect(), G = 100, A = window.innerHeight;
2017
+ let H = E.top + window.scrollY;
2018
+ H + G > A && (H = A - G - 20), B(!0), k({
2019
+ top: H - 80,
2020
+ left: E.left - 30
2021
+ }), w($);
2005
2022
  };
2006
- function k(b) {
2007
- if (f)
2008
- return b ? /* @__PURE__ */ t.jsx(
2023
+ function D(y) {
2024
+ if (v)
2025
+ return y ? /* @__PURE__ */ t.jsx(
2009
2026
  "img",
2010
2027
  {
2011
- src: `https://imagedelivery.net/${b}/w=1000`,
2028
+ src: `https://imagedelivery.net/${y}/w=1000`,
2012
2029
  alt: "image",
2013
2030
  width: 16,
2014
2031
  height: 16
2015
2032
  }
2016
2033
  ) : /* @__PURE__ */ t.jsx(
2017
- v,
2034
+ b,
2018
2035
  {
2019
2036
  name: "Image",
2020
2037
  width: 16,
@@ -2023,21 +2040,21 @@ const la = (r) => {
2023
2040
  }
2024
2041
  );
2025
2042
  }
2026
- const V = (b) => {
2027
- const { active: I, over: P } = b;
2028
- if (P && I.id !== P.id) {
2029
- const U = s.findIndex((M) => String(M.listingId) === I.id), q = s.findIndex((M) => String(M.listingId) === P.id);
2030
- if (U !== -1 && q !== -1) {
2031
- const M = [...s], [Z] = M.splice(U, 1);
2032
- M.splice(q, 0, Z), i(M);
2043
+ const X = (y) => {
2044
+ const { active: $, over: E } = y;
2045
+ if (E && $.id !== E.id) {
2046
+ const G = s.findIndex((H) => String(H.listingId) === $.id), A = s.findIndex((H) => String(H.listingId) === E.id);
2047
+ if (G !== -1 && A !== -1) {
2048
+ const H = [...s], [K] = H.splice(G, 1);
2049
+ H.splice(A, 0, K), i(H);
2033
2050
  }
2034
2051
  }
2035
- }, K = (b, I) => {
2036
- const P = p.find((q) => b.listingId === q.id);
2037
- if (!P) return null;
2038
- const U = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2039
- o && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
2040
- v,
2052
+ }, tt = (y, $) => {
2053
+ const E = g.find((A) => y.listingId === A.id);
2054
+ if (!E) return null;
2055
+ const G = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2056
+ c && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
2057
+ b,
2041
2058
  {
2042
2059
  name: "DotsSixVertical",
2043
2060
  hoverable: !0,
@@ -2046,106 +2063,106 @@ const la = (r) => {
2046
2063
  }
2047
2064
  ) }),
2048
2065
  h === "select" && /* @__PURE__ */ t.jsx(
2049
- et,
2066
+ st,
2050
2067
  {
2051
- onChange: (q) => {
2052
- const M = [...s], Z = p.find((E) => E.productData.name === q);
2053
- if (!Z) return;
2054
- const ct = {
2055
- listingId: Z.id,
2056
- image: Z.productData.images.length > 0 ? Z.productData.images[0].cfId : ""
2057
- }, j = M.map((E) => E.listingId === b.listingId ? ct : E);
2058
- C(ct), i([...j]);
2068
+ onChange: (A) => {
2069
+ const H = [...s], K = g.find((O) => O.productData.name === A);
2070
+ if (!K) return;
2071
+ const lt = {
2072
+ listingId: K.id,
2073
+ image: K.productData.images.length > 0 ? K.productData.images[0].cfId : ""
2074
+ }, j = H.map((O) => O.listingId === y.listingId ? lt : O);
2075
+ w(lt), i([...j]);
2059
2076
  },
2060
- value: P.productData.name,
2077
+ value: E.productData.name,
2061
2078
  options: [
2062
- ...p.filter((q) => !s.find((M) => M.listingId === q.id)).map((q) => q.productData.name)
2079
+ ...g.filter((A) => !s.find((H) => H.listingId === A.id)).map((A) => A.productData.name)
2063
2080
  ],
2064
- leftAddon: k(
2065
- b.image || P.productData.images.length > 0 && P.productData.images[0].cfId || ""
2081
+ leftAddon: D(
2082
+ y.image || E.productData.images.length > 0 && E.productData.images[0].cfId || ""
2066
2083
  )
2067
2084
  },
2068
- I
2085
+ $
2069
2086
  ),
2070
- /* @__PURE__ */ t.jsxs("div", { className: W.buttons, children: [
2071
- n && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
2072
- v,
2087
+ /* @__PURE__ */ t.jsxs("div", { className: V.buttons, children: [
2088
+ n && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
2089
+ b,
2073
2090
  {
2074
2091
  name: "Sliders",
2075
2092
  hoverable: !0,
2076
2093
  width: 20,
2077
2094
  height: 20,
2078
- onClick: (q) => x(q, b)
2095
+ onClick: (A) => x(A, y)
2079
2096
  }
2080
2097
  ) }),
2081
- N && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
2082
- v,
2098
+ f && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
2099
+ b,
2083
2100
  {
2084
2101
  name: "Trash",
2085
2102
  hoverable: !0,
2086
2103
  width: 20,
2087
2104
  height: 20,
2088
2105
  fill: "#C12A2A",
2089
- onClick: () => i(s.filter((q) => q !== b))
2106
+ onClick: () => i(s.filter((A) => A !== y))
2090
2107
  }
2091
2108
  ) })
2092
2109
  ] })
2093
2110
  ] });
2094
- return o ? /* @__PURE__ */ t.jsx(
2095
- ui,
2111
+ return c ? /* @__PURE__ */ t.jsx(
2112
+ pi,
2096
2113
  {
2097
- product: b,
2098
- children: U
2114
+ product: y,
2115
+ children: G
2099
2116
  },
2100
- b.listingId
2117
+ y.listingId
2101
2118
  ) : /* @__PURE__ */ t.jsx(
2102
2119
  "div",
2103
2120
  {
2104
- className: W.product,
2105
- children: U
2121
+ className: V.product,
2122
+ children: G
2106
2123
  },
2107
- b.listingId
2124
+ y.listingId
2108
2125
  );
2109
2126
  };
2110
- return /* @__PURE__ */ t.jsxs("div", { className: W.productsBlock, children: [
2111
- (l || c !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: W.top, children: [
2112
- l && /* @__PURE__ */ t.jsx("h3", { className: W.title, children: l }),
2113
- c !== void 0 && /* @__PURE__ */ t.jsx(
2114
- tt,
2127
+ return /* @__PURE__ */ t.jsxs("div", { className: V.productsBlock, children: [
2128
+ (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
2129
+ l && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: l }),
2130
+ a !== void 0 && /* @__PURE__ */ t.jsx(
2131
+ Z,
2115
2132
  {
2116
- current: c,
2117
- onChange: (b) => e == null ? void 0 : e(b)
2133
+ current: a,
2134
+ onChange: (y) => e == null ? void 0 : e(y)
2118
2135
  }
2119
2136
  )
2120
2137
  ] }),
2121
- L && d && /* @__PURE__ */ t.jsx(
2122
- di,
2138
+ L && u && /* @__PURE__ */ t.jsx(
2139
+ mi,
2123
2140
  {
2124
- activeItem: d,
2125
- setActiveItem: C,
2141
+ activeItem: u,
2142
+ setActiveItem: w,
2126
2143
  setIsOpenModal: B,
2127
- popupPosition: D,
2128
- itemsOptions: p
2144
+ popupPosition: q,
2145
+ itemsOptions: g
2129
2146
  }
2130
2147
  ),
2131
- /* @__PURE__ */ t.jsxs("div", { className: W.products, children: [
2132
- m && /* @__PURE__ */ t.jsx("h5", { className: W.subtitle, children: m }),
2133
- o ? /* @__PURE__ */ t.jsx(
2148
+ /* @__PURE__ */ t.jsxs("div", { className: V.products, children: [
2149
+ d && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: d }),
2150
+ c ? /* @__PURE__ */ t.jsx(
2134
2151
  Nt,
2135
2152
  {
2136
- sensors: T,
2137
- onDragEnd: V,
2153
+ sensors: S,
2154
+ onDragEnd: X,
2138
2155
  children: /* @__PURE__ */ t.jsx(
2139
2156
  wt,
2140
2157
  {
2141
- items: s.map((b) => String(b.listingId)),
2158
+ items: s.map((y) => String(y.listingId)),
2142
2159
  strategy: Ct,
2143
- children: s.map((b, I) => K(b, I))
2160
+ children: s.map((y, $) => tt(y, $))
2144
2161
  }
2145
2162
  )
2146
2163
  }
2147
- ) : s.map((b, I) => K(b, I)),
2148
- _ && /* @__PURE__ */ t.jsx(
2164
+ ) : s.map((y, $) => tt(y, $)),
2165
+ m && /* @__PURE__ */ t.jsx(
2149
2166
  "div",
2150
2167
  {
2151
2168
  style: {
@@ -2154,31 +2171,31 @@ const la = (r) => {
2154
2171
  justifyContent: "center"
2155
2172
  },
2156
2173
  children: /* @__PURE__ */ t.jsx(
2157
- at,
2174
+ ct,
2158
2175
  {
2159
2176
  withoutHover: !0,
2160
- className: W.button,
2177
+ className: V.button,
2161
2178
  size: "s",
2162
2179
  onClick: () => {
2163
- const b = [...s];
2164
- for (let I = 0; I < p.length; I++)
2165
- if (!s.find((P) => P.listingId === p[I].id)) {
2166
- b.push({
2167
- listingId: p[I].id,
2168
- image: p[I].productData.images.length > 0 ? p[I].productData.images[0].cfId : ""
2180
+ const y = [...s];
2181
+ for (let $ = 0; $ < g.length; $++)
2182
+ if (!s.find((E) => E.listingId === g[$].id)) {
2183
+ y.push({
2184
+ listingId: g[$].id,
2185
+ image: g[$].productData.images.length > 0 ? g[$].productData.images[0].cfId : ""
2169
2186
  });
2170
2187
  break;
2171
2188
  }
2172
- i(b);
2189
+ i(y);
2173
2190
  },
2174
- disabled: s.length === p.length,
2191
+ disabled: s.length === g.length,
2175
2192
  style: {
2176
2193
  width: "fit-content"
2177
2194
  },
2178
- children: /* @__PURE__ */ t.jsxs("div", { className: W.addButton, children: [
2195
+ children: /* @__PURE__ */ t.jsxs("div", { className: V.addButton, children: [
2179
2196
  /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
2180
2197
  /* @__PURE__ */ t.jsx(
2181
- v,
2198
+ b,
2182
2199
  {
2183
2200
  name: "Plus",
2184
2201
  width: 16,
@@ -2191,101 +2208,101 @@ const la = (r) => {
2191
2208
  }
2192
2209
  )
2193
2210
  ] }),
2194
- a !== void 0 && /* @__PURE__ */ t.jsx(jt, { items: a })
2211
+ o !== void 0 && /* @__PURE__ */ t.jsx(bt, { items: o })
2195
2212
  ] });
2196
- }, mi = "_options_d1lk6_1", hi = "_price_d1lk6_12", _i = "_oldPrice_d1lk6_19", pi = "_newPrice_d1lk6_27", gi = "_animate_d1lk6_34", fi = "_appearAndBounce_d1lk6_1", xi = "_meta_d1lk6_52", bi = "_info_d1lk6_58", ji = "_infoRight_d1lk6_66", vi = "_buttons_d1lk6_73", yi = "_variants_d1lk6_80", ki = "_variant_d1lk6_80", $i = "_stock_d1lk6_98", Ii = "_variantInfo_d1lk6_105", Ni = "_quantity_d1lk6_111", wi = "_count_d1lk6_118", Ci = "_focused_d1lk6_135", Bi = "_button_d1lk6_73", Si = "_activeVariant_d1lk6_161", Ti = "_chargeTypes_d1lk6_165", Pi = "_charge_d1lk6_165", Ai = "_chargeActive_d1lk6_190", Oi = "_title_d1lk6_198", w = {
2197
- options: mi,
2198
- price: hi,
2199
- oldPrice: _i,
2200
- newPrice: pi,
2201
- animate: gi,
2202
- appearAndBounce: fi,
2203
- meta: xi,
2204
- info: bi,
2205
- infoRight: ji,
2206
- buttons: vi,
2207
- variants: yi,
2208
- variant: ki,
2209
- stock: $i,
2210
- variantInfo: Ii,
2211
- quantity: Ni,
2212
- count: wi,
2213
- focused: Ci,
2214
- button: Bi,
2215
- activeVariant: Si,
2216
- chargeTypes: Ti,
2217
- charge: Pi,
2218
- chargeActive: Ai,
2219
- title: Oi
2213
+ }, gi = "_options_d1lk6_1", fi = "_price_d1lk6_12", xi = "_oldPrice_d1lk6_19", vi = "_newPrice_d1lk6_27", bi = "_animate_d1lk6_34", ji = "_appearAndBounce_d1lk6_1", yi = "_meta_d1lk6_52", ki = "_info_d1lk6_58", Ii = "_infoRight_d1lk6_66", $i = "_buttons_d1lk6_73", Ni = "_variants_d1lk6_80", wi = "_variant_d1lk6_80", Ci = "_stock_d1lk6_98", Bi = "_variantInfo_d1lk6_105", Si = "_quantity_d1lk6_111", Ti = "_count_d1lk6_118", Pi = "_focused_d1lk6_135", Ai = "_button_d1lk6_73", Oi = "_activeVariant_d1lk6_161", qi = "_chargeTypes_d1lk6_165", Ei = "_charge_d1lk6_165", Di = "_chargeActive_d1lk6_190", Li = "_title_d1lk6_198", N = {
2214
+ options: gi,
2215
+ price: fi,
2216
+ oldPrice: xi,
2217
+ newPrice: vi,
2218
+ animate: bi,
2219
+ appearAndBounce: ji,
2220
+ meta: yi,
2221
+ info: ki,
2222
+ infoRight: Ii,
2223
+ buttons: $i,
2224
+ variants: Ni,
2225
+ variant: wi,
2226
+ stock: Ci,
2227
+ variantInfo: Bi,
2228
+ quantity: Si,
2229
+ count: Ti,
2230
+ focused: Pi,
2231
+ button: Ai,
2232
+ activeVariant: Oi,
2233
+ chargeTypes: qi,
2234
+ charge: Ei,
2235
+ chargeActive: Di,
2236
+ title: Li
2220
2237
  };
2221
2238
  var Mt = /* @__PURE__ */ ((r) => (r.ONE_TIME = "One-Time", r.RECURRING = "Subscribe & Save", r))(Mt || {});
2222
- const ra = (r) => {
2223
- var B, T;
2224
- const { variants: c } = r, [e, s] = g.useState(c[0]), [i, a] = g.useState(e.chargeTypes[0]), l = bt(), [m, n] = g.useState(1), [o, f] = g.useState(!1), { reset: N, addProductToCart: _, getProducts: h } = Pt(), [p, d] = g.useState(!1);
2225
- g.useEffect(() => {
2226
- d(!0);
2227
- const x = setTimeout(() => d(!1), 600);
2239
+ const ha = (r) => {
2240
+ var B, S;
2241
+ const { variants: a } = r, [e, s] = p.useState(a[0]), [i, o] = p.useState(e.chargeTypes[0]), l = vt(), [d, n] = p.useState(1), [c, v] = p.useState(!1), { reset: f, addProductToCart: m, getProducts: h } = Pt(), [g, u] = p.useState(!1);
2242
+ p.useEffect(() => {
2243
+ u(!0);
2244
+ const x = setTimeout(() => u(!1), 600);
2228
2245
  return () => clearTimeout(x);
2229
- }, [m]);
2230
- async function C() {
2231
- await h(), await _({
2246
+ }, [d]);
2247
+ async function w() {
2248
+ await h(), await m({
2232
2249
  productId: r.id,
2233
2250
  productVariantId: e.id,
2234
- quantity: m
2251
+ quantity: d
2235
2252
  });
2236
2253
  }
2237
- function D() {
2238
- N(), C(), l("/checkout");
2254
+ function q() {
2255
+ f(), w(), l("/checkout");
2239
2256
  }
2240
- function y(x) {
2257
+ function k(x) {
2241
2258
  if (x >= 864e5) {
2242
- const I = Math.floor(x / 864e5);
2243
- return `${I} ${I === 1 ? "day" : "days"}`;
2259
+ const $ = Math.floor(x / 864e5);
2260
+ return `${$} ${$ === 1 ? "day" : "days"}`;
2244
2261
  } else if (x >= 36e5) {
2245
- const I = Math.floor(x / 36e5);
2246
- return `${I} ${I === 1 ? "hour" : "hours"}`;
2262
+ const $ = Math.floor(x / 36e5);
2263
+ return `${$} ${$ === 1 ? "hour" : "hours"}`;
2247
2264
  } else if (x >= 6e4) {
2248
- const I = Math.floor(x / 6e4);
2249
- return `${I} ${I === 1 ? "minute" : "minutes"}`;
2265
+ const $ = Math.floor(x / 6e4);
2266
+ return `${$} ${$ === 1 ? "minute" : "minutes"}`;
2250
2267
  } else {
2251
- const I = Math.floor(x / 1e3);
2252
- return `${I} ${I === 1 ? "second" : "seconds"}`;
2268
+ const $ = Math.floor(x / 1e3);
2269
+ return `${$} ${$ === 1 ? "second" : "seconds"}`;
2253
2270
  }
2254
2271
  }
2255
- function L(x, k) {
2256
- return x.length > k ? x.slice(0, k) + "..." : x;
2272
+ function L(x, D) {
2273
+ return x.length > D ? x.slice(0, D) + "..." : x;
2257
2274
  }
2258
- return /* @__PURE__ */ t.jsxs("div", { className: w.options, children: [
2259
- e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: w.chargeTypes, children: e.chargeTypes.map((x) => /* @__PURE__ */ t.jsx(
2275
+ return /* @__PURE__ */ t.jsxs("div", { className: N.options, children: [
2276
+ e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: N.chargeTypes, children: e.chargeTypes.map((x) => /* @__PURE__ */ t.jsx(
2260
2277
  "div",
2261
2278
  {
2262
- className: F(w.charge, {
2263
- [w.chargeActive]: i === x
2279
+ className: F(N.charge, {
2280
+ [N.chargeActive]: i === x
2264
2281
  }),
2265
- onClick: () => a(x),
2282
+ onClick: () => o(x),
2266
2283
  children: Mt[x]
2267
2284
  },
2268
2285
  x
2269
2286
  )) }),
2270
- /* @__PURE__ */ t.jsx("div", { className: w.variants, children: c.map((x) => {
2271
- var k;
2287
+ /* @__PURE__ */ t.jsx("div", { className: N.variants, children: a.map((x) => {
2288
+ var D;
2272
2289
  return /* @__PURE__ */ t.jsxs(
2273
2290
  "div",
2274
2291
  {
2275
- className: F(w.variant, {
2276
- [w.activeVariant]: e.id === x.id
2292
+ className: F(N.variant, {
2293
+ [N.activeVariant]: e.id === x.id
2277
2294
  }),
2278
2295
  onClick: () => s(x),
2279
2296
  children: [
2280
- /* @__PURE__ */ t.jsxs("div", { className: w.variantInfo, children: [
2281
- /* @__PURE__ */ t.jsx("span", { className: w.title, children: L(x.name, 15) }),
2297
+ /* @__PURE__ */ t.jsxs("div", { className: N.variantInfo, children: [
2298
+ /* @__PURE__ */ t.jsx("span", { className: N.title, children: L(x.name, 15) }),
2282
2299
  /* @__PURE__ */ t.jsxs("span", { children: [
2283
2300
  "$",
2284
2301
  i === "ONE_TIME" ? x.price.amount : x.subscriptionSettings ? x.subscriptionSettings.price.amount : "Price Not Found"
2285
2302
  ] })
2286
2303
  ] }),
2287
- /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: w.stock, children: [
2288
- ((k = x.quantity.restrictions) == null ? void 0 : k.max) || x.quantity.available || 0,
2304
+ /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: N.stock, children: [
2305
+ ((D = x.quantity.restrictions) == null ? void 0 : D.max) || x.quantity.available || 0,
2289
2306
  " in stock"
2290
2307
  ] }) })
2291
2308
  ]
@@ -2293,34 +2310,34 @@ const ra = (r) => {
2293
2310
  x.id
2294
2311
  );
2295
2312
  }) }),
2296
- i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: w.quantity, children: [
2313
+ i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: N.quantity, children: [
2297
2314
  /* @__PURE__ */ t.jsx(
2298
2315
  "button",
2299
2316
  {
2300
2317
  onClick: () => {
2301
- m > 1 ? n((x) => x - 1) : n(1);
2318
+ d > 1 ? n((x) => x - 1) : n(1);
2302
2319
  },
2303
- className: w.button,
2304
- disabled: e.quantity.restrictions && m <= e.quantity.restrictions.min,
2305
- children: /* @__PURE__ */ t.jsx(v, { name: "Minus" })
2320
+ className: N.button,
2321
+ disabled: e.quantity.restrictions && d <= e.quantity.restrictions.min,
2322
+ children: /* @__PURE__ */ t.jsx(b, { name: "Minus" })
2306
2323
  }
2307
2324
  ),
2308
2325
  /* @__PURE__ */ t.jsx(
2309
2326
  "label",
2310
2327
  {
2311
- className: F(w.count, {
2312
- [w.focused]: o
2328
+ className: F(N.count, {
2329
+ [N.focused]: c
2313
2330
  }),
2314
- onFocus: () => f(!0),
2315
- onBlur: () => f(!1),
2331
+ onFocus: () => v(!0),
2332
+ onBlur: () => v(!1),
2316
2333
  children: /* @__PURE__ */ t.jsx(
2317
- X,
2334
+ W,
2318
2335
  {
2319
2336
  type: "number",
2320
- value: String(m),
2337
+ value: String(d),
2321
2338
  onChange: (x) => n(Number(x)),
2322
2339
  max: ((B = e.quantity.restrictions) == null ? void 0 : B.max) || e.quantity.available || 1 / 0,
2323
- min: ((T = e.quantity.restrictions) == null ? void 0 : T.min) || 0,
2340
+ min: ((S = e.quantity.restrictions) == null ? void 0 : S.min) || 0,
2324
2341
  style: {
2325
2342
  backgroundColor: "transparent",
2326
2343
  border: "none",
@@ -2336,18 +2353,18 @@ const ra = (r) => {
2336
2353
  onClick: () => {
2337
2354
  n((x) => x + 1);
2338
2355
  },
2339
- className: w.button,
2340
- disabled: !!(e.quantity.restrictions && m >= e.quantity.restrictions.max || e.quantity.available && m >= e.quantity.available),
2341
- children: /* @__PURE__ */ t.jsx(v, { name: "Plus" })
2356
+ className: N.button,
2357
+ disabled: !!(e.quantity.restrictions && d >= e.quantity.restrictions.max || e.quantity.available && d >= e.quantity.available),
2358
+ children: /* @__PURE__ */ t.jsx(b, { name: "Plus" })
2342
2359
  }
2343
2360
  )
2344
2361
  ] }),
2345
- /* @__PURE__ */ t.jsxs("div", { className: w.meta, children: [
2346
- /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
2362
+ /* @__PURE__ */ t.jsxs("div", { className: N.meta, children: [
2363
+ /* @__PURE__ */ t.jsxs("div", { className: N.info, children: [
2347
2364
  /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
2348
- /* @__PURE__ */ t.jsxs("div", { className: w.infoRight, children: [
2365
+ /* @__PURE__ */ t.jsxs("div", { className: N.infoRight, children: [
2349
2366
  /* @__PURE__ */ t.jsx(
2350
- v,
2367
+ b,
2351
2368
  {
2352
2369
  name: "Lightning",
2353
2370
  fill: "#FF3F19",
@@ -2355,121 +2372,121 @@ const ra = (r) => {
2355
2372
  height: 20
2356
2373
  }
2357
2374
  ),
2358
- /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : y(e.deliveryTime) })
2375
+ /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : k(e.deliveryTime) })
2359
2376
  ] })
2360
2377
  ] }),
2361
- /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
2378
+ /* @__PURE__ */ t.jsxs("div", { className: N.info, children: [
2362
2379
  /* @__PURE__ */ t.jsx("span", { children: "Price" }),
2363
- /* @__PURE__ */ t.jsx("div", { className: w.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
2364
- /* @__PURE__ */ t.jsxs("span", { className: F(w.newPrice, { [w.animate]: p }), children: [
2380
+ /* @__PURE__ */ t.jsx("div", { className: N.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: N.price, children: [
2381
+ /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
2365
2382
  "$ ",
2366
- (e.price.amount || 0) * m
2383
+ (e.price.amount || 0) * d
2367
2384
  ] }),
2368
- /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
2385
+ /* @__PURE__ */ t.jsxs("span", { className: N.oldPrice, children: [
2369
2386
  "$ ",
2370
- (e.compareAtPrice.amount || 0) * m
2387
+ (e.compareAtPrice.amount || 0) * d
2371
2388
  ] })
2372
- ] }) : /* @__PURE__ */ t.jsxs("span", { className: F(w.newPrice, { [w.animate]: p }), children: [
2389
+ ] }) : /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
2373
2390
  "$ ",
2374
- (e.price.amount || 0) * m
2375
- ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
2376
- /* @__PURE__ */ t.jsxs("span", { className: F(w.newPrice, { [w.animate]: p }), children: [
2391
+ (e.price.amount || 0) * d
2392
+ ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: N.price, children: [
2393
+ /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
2377
2394
  "$ ",
2378
2395
  e.subscriptionSettings.price.amount || 0
2379
2396
  ] }),
2380
- /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
2397
+ /* @__PURE__ */ t.jsxs("span", { className: N.oldPrice, children: [
2381
2398
  "$ ",
2382
2399
  e.subscriptionSettings.compareAtPrice.amount || 0
2383
2400
  ] })
2384
- ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: F(w.newPrice, { [w.animate]: p }), children: [
2401
+ ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
2385
2402
  "$ ",
2386
2403
  e.subscriptionSettings.price.amount || 0
2387
2404
  ] }) })
2388
2405
  ] })
2389
2406
  ] }),
2390
- /* @__PURE__ */ t.jsxs("div", { className: w.buttons, children: [
2407
+ /* @__PURE__ */ t.jsxs("div", { className: N.buttons, children: [
2391
2408
  /* @__PURE__ */ t.jsx(
2392
- at,
2409
+ ct,
2393
2410
  {
2394
2411
  type: "Primary",
2395
- onClick: () => D(),
2412
+ onClick: () => q(),
2396
2413
  children: /* @__PURE__ */ t.jsx("span", { children: i === "ONE_TIME" ? "Buy Now" : "Subscribe Now" })
2397
2414
  }
2398
2415
  ),
2399
2416
  i === "ONE_TIME" && /* @__PURE__ */ t.jsx(
2400
- at,
2417
+ ct,
2401
2418
  {
2402
2419
  type: "Secondary",
2403
- onClick: () => C(),
2420
+ onClick: () => w(),
2404
2421
  children: "Add to Cart"
2405
2422
  }
2406
2423
  )
2407
2424
  ] })
2408
2425
  ] });
2409
- }, qi = "_button_oyh2y_1", Ei = "_login_oyh2y_14", Di = "_signUp_oyh2y_18", Li = "_buttons_oyh2y_23", Ri = "_modal_oyh2y_32", Mi = "_closing_oyh2y_61", Hi = "_info_oyh2y_85", zi = "_top_oyh2y_92", Fi = "_title_oyh2y_103", Vi = "_clear_oyh2y_110", Ui = "_activeClear_oyh2y_117", Yi = "_count_oyh2y_121", Gi = "_cart_oyh2y_136", Wi = "_empty_oyh2y_144", Xi = "_product_oyh2y_170", Ji = "_products_oyh2y_179", Qi = "_image_oyh2y_187", Ki = "_productInfo_oyh2y_193", Zi = "_content_oyh2y_200", to = "_name_oyh2y_206", eo = "_price_oyh2y_212", so = "_productButtons_oyh2y_218", no = "_productButton_oyh2y_218", io = "_productCount_oyh2y_238", oo = "_bottom_oyh2y_254", ao = "_subtotal_oyh2y_262", co = "_block_oyh2y_270", lo = "_shoppingCount_oyh2y_277", ro = "_total_oyh2y_297", uo = "_link_oyh2y_303", mo = "_userInfo_oyh2y_310", S = {
2410
- button: qi,
2411
- login: Ei,
2412
- signUp: Di,
2413
- buttons: Li,
2414
- modal: Ri,
2426
+ }, Ri = "_button_oyh2y_1", Mi = "_login_oyh2y_14", Hi = "_signUp_oyh2y_18", zi = "_buttons_oyh2y_23", Fi = "_modal_oyh2y_32", Vi = "_closing_oyh2y_61", Ui = "_info_oyh2y_85", Yi = "_top_oyh2y_92", Gi = "_title_oyh2y_103", Wi = "_clear_oyh2y_110", Xi = "_activeClear_oyh2y_117", Ji = "_count_oyh2y_121", Qi = "_cart_oyh2y_136", Ki = "_empty_oyh2y_144", Zi = "_product_oyh2y_170", to = "_products_oyh2y_179", eo = "_image_oyh2y_187", so = "_productInfo_oyh2y_193", no = "_content_oyh2y_200", io = "_name_oyh2y_206", oo = "_price_oyh2y_212", ao = "_productButtons_oyh2y_218", co = "_productButton_oyh2y_218", lo = "_productCount_oyh2y_238", ro = "_bottom_oyh2y_254", uo = "_subtotal_oyh2y_262", _o = "_block_oyh2y_270", ho = "_shoppingCount_oyh2y_277", mo = "_total_oyh2y_297", po = "_link_oyh2y_303", go = "_userInfo_oyh2y_310", C = {
2427
+ button: Ri,
2428
+ login: Mi,
2429
+ signUp: Hi,
2430
+ buttons: zi,
2431
+ modal: Fi,
2415
2432
  "slide-in-fade": "_slide-in-fade_oyh2y_1",
2416
- closing: Mi,
2433
+ closing: Vi,
2417
2434
  "slide-out-fade": "_slide-out-fade_oyh2y_1",
2418
- info: Hi,
2419
- top: zi,
2420
- title: Fi,
2421
- clear: Vi,
2422
- activeClear: Ui,
2423
- count: Yi,
2424
- cart: Gi,
2425
- empty: Wi,
2426
- product: Xi,
2427
- products: Ji,
2428
- image: Qi,
2429
- productInfo: Ki,
2430
- content: Zi,
2431
- name: to,
2432
- price: eo,
2433
- productButtons: so,
2434
- productButton: no,
2435
- productCount: io,
2436
- bottom: oo,
2437
- subtotal: ao,
2438
- block: co,
2439
- shoppingCount: lo,
2440
- total: ro,
2441
- link: uo,
2442
- userInfo: mo
2443
- }, ho = "_button_85085_1", _o = "_primary_85085_20", po = "_primaryHovered_85085_30", go = "_secondary_85085_34", fo = "_secondaryHovered_85085_44", xo = "_tertiary_85085_48", bo = "_tertiaryHovered_85085_58", jo = "_content_85085_62", nt = {
2444
- button: ho,
2445
- primary: _o,
2446
- primaryHovered: po,
2447
- secondary: go,
2448
- secondaryHovered: fo,
2449
- tertiary: xo,
2450
- tertiaryHovered: bo,
2451
- content: jo
2435
+ info: Ui,
2436
+ top: Yi,
2437
+ title: Gi,
2438
+ clear: Wi,
2439
+ activeClear: Xi,
2440
+ count: Ji,
2441
+ cart: Qi,
2442
+ empty: Ki,
2443
+ product: Zi,
2444
+ products: to,
2445
+ image: eo,
2446
+ productInfo: so,
2447
+ content: no,
2448
+ name: io,
2449
+ price: oo,
2450
+ productButtons: ao,
2451
+ productButton: co,
2452
+ productCount: lo,
2453
+ bottom: ro,
2454
+ subtotal: uo,
2455
+ block: _o,
2456
+ shoppingCount: ho,
2457
+ total: mo,
2458
+ link: po,
2459
+ userInfo: go
2460
+ }, fo = "_button_85085_1", xo = "_primary_85085_20", vo = "_primaryHovered_85085_30", bo = "_secondary_85085_34", jo = "_secondaryHovered_85085_44", yo = "_tertiary_85085_48", ko = "_tertiaryHovered_85085_58", Io = "_content_85085_62", it = {
2461
+ button: fo,
2462
+ primary: xo,
2463
+ primaryHovered: vo,
2464
+ secondary: bo,
2465
+ secondaryHovered: jo,
2466
+ tertiary: yo,
2467
+ tertiaryHovered: ko,
2468
+ content: Io
2452
2469
  }, kt = (r) => {
2453
- const { children: c, onClick: e, style: s, className: i, disabled: a = !1, type: l = "Primary" } = r, { themeSettings: m } = qt();
2470
+ const { children: a, onClick: e, style: s, className: i, disabled: o = !1, type: l = "Primary" } = r, { themeSettings: d } = qt();
2454
2471
  return /* @__PURE__ */ t.jsx(
2455
2472
  "button",
2456
2473
  {
2457
- className: F(nt.button, i, {
2458
- [nt.primary]: l === "Primary",
2459
- [nt.secondary]: l === "Secondary",
2460
- [nt.tertiary]: l === "Tertiary",
2461
- [nt.primaryHovered]: l === "Primary" && !a && m.buttons.primary.hover,
2462
- [nt.secondaryHovered]: l === "Secondary" && !a && m.buttons.secondary.hover,
2463
- [nt.tertiaryHovered]: l === "Tertiary" && !a && m.buttons.tertiary.hover
2474
+ className: F(it.button, i, {
2475
+ [it.primary]: l === "Primary",
2476
+ [it.secondary]: l === "Secondary",
2477
+ [it.tertiary]: l === "Tertiary",
2478
+ [it.primaryHovered]: l === "Primary" && !o && d.buttons.primary.hover,
2479
+ [it.secondaryHovered]: l === "Secondary" && !o && d.buttons.secondary.hover,
2480
+ [it.tertiaryHovered]: l === "Tertiary" && !o && d.buttons.tertiary.hover
2464
2481
  }),
2465
2482
  onClick: e,
2466
2483
  style: {
2467
2484
  ...s
2468
2485
  },
2469
- disabled: a,
2470
- children: l === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: nt.content, children: [
2486
+ disabled: o,
2487
+ children: l === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: it.content, children: [
2471
2488
  /* @__PURE__ */ t.jsx(
2472
- v,
2489
+ b,
2473
2490
  {
2474
2491
  name: "ArrowRight",
2475
2492
  fill: "#757575",
@@ -2477,68 +2494,68 @@ const ra = (r) => {
2477
2494
  height: 20
2478
2495
  }
2479
2496
  ),
2480
- c
2481
- ] }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: c })
2497
+ a
2498
+ ] }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: a })
2482
2499
  }
2483
2500
  );
2484
2501
  };
2485
2502
  class pt extends Error {
2486
2503
  }
2487
2504
  pt.prototype.name = "InvalidTokenError";
2488
- function vo(r) {
2489
- return decodeURIComponent(atob(r).replace(/(.)/g, (c, e) => {
2505
+ function $o(r) {
2506
+ return decodeURIComponent(atob(r).replace(/(.)/g, (a, e) => {
2490
2507
  let s = e.charCodeAt(0).toString(16).toUpperCase();
2491
2508
  return s.length < 2 && (s = "0" + s), "%" + s;
2492
2509
  }));
2493
2510
  }
2494
- function yo(r) {
2495
- let c = r.replace(/-/g, "+").replace(/_/g, "/");
2496
- switch (c.length % 4) {
2511
+ function No(r) {
2512
+ let a = r.replace(/-/g, "+").replace(/_/g, "/");
2513
+ switch (a.length % 4) {
2497
2514
  case 0:
2498
2515
  break;
2499
2516
  case 2:
2500
- c += "==";
2517
+ a += "==";
2501
2518
  break;
2502
2519
  case 3:
2503
- c += "=";
2520
+ a += "=";
2504
2521
  break;
2505
2522
  default:
2506
2523
  throw new Error("base64 string is not of the correct length");
2507
2524
  }
2508
2525
  try {
2509
- return vo(c);
2526
+ return $o(a);
2510
2527
  } catch {
2511
- return atob(c);
2528
+ return atob(a);
2512
2529
  }
2513
2530
  }
2514
- function ko(r, c) {
2531
+ function wo(r, a) {
2515
2532
  if (typeof r != "string")
2516
2533
  throw new pt("Invalid token specified: must be a string");
2517
- c || (c = {});
2518
- const e = c.header === !0 ? 0 : 1, s = r.split(".")[e];
2534
+ a || (a = {});
2535
+ const e = a.header === !0 ? 0 : 1, s = r.split(".")[e];
2519
2536
  if (typeof s != "string")
2520
2537
  throw new pt(`Invalid token specified: missing part #${e + 1}`);
2521
2538
  let i;
2522
2539
  try {
2523
- i = yo(s);
2524
- } catch (a) {
2525
- throw new pt(`Invalid token specified: invalid base64 for part #${e + 1} (${a.message})`);
2540
+ i = No(s);
2541
+ } catch (o) {
2542
+ throw new pt(`Invalid token specified: invalid base64 for part #${e + 1} (${o.message})`);
2526
2543
  }
2527
2544
  try {
2528
2545
  return JSON.parse(i);
2529
- } catch (a) {
2530
- throw new pt(`Invalid token specified: invalid json for part #${e + 1} (${a.message})`);
2546
+ } catch (o) {
2547
+ throw new pt(`Invalid token specified: invalid json for part #${e + 1} (${o.message})`);
2531
2548
  }
2532
2549
  }
2533
- const da = (r) => {
2534
- const { shopping: c, signUp: e } = r, s = bt();
2550
+ const ma = (r) => {
2551
+ const { shopping: a, signUp: e } = r, s = vt();
2535
2552
  function i(l) {
2536
2553
  s(l);
2537
2554
  }
2538
- const a = JSON.parse(localStorage.getItem("token") || "{}");
2539
- return /* @__PURE__ */ t.jsxs("div", { className: S.buttons, children: [
2540
- c && /* @__PURE__ */ t.jsx($o, {}),
2541
- !a.data && /* @__PURE__ */ t.jsx(
2555
+ const o = JSON.parse(localStorage.getItem("token") || "{}");
2556
+ return /* @__PURE__ */ t.jsxs("div", { className: C.buttons, children: [
2557
+ a && /* @__PURE__ */ t.jsx(Co, {}),
2558
+ !o.data && /* @__PURE__ */ t.jsx(
2542
2559
  kt,
2543
2560
  {
2544
2561
  onClick: () => i("/customer-dash"),
@@ -2549,7 +2566,7 @@ const da = (r) => {
2549
2566
  children: "Login"
2550
2567
  }
2551
2568
  ),
2552
- !a.data && e && /* @__PURE__ */ t.jsx(
2569
+ !o.data && e && /* @__PURE__ */ t.jsx(
2553
2570
  kt,
2554
2571
  {
2555
2572
  onClick: () => i("/customer-dash"),
@@ -2560,54 +2577,54 @@ const da = (r) => {
2560
2577
  children: "Sign Up"
2561
2578
  }
2562
2579
  ),
2563
- a.data && /* @__PURE__ */ t.jsx(wo, { token: a.data })
2580
+ o.data && /* @__PURE__ */ t.jsx(To, { token: o.data })
2564
2581
  ] });
2565
- }, $o = () => {
2566
- const [r, c] = g.useState(!1), [e, s] = g.useState([]), { cart: i, getProducts: a } = Pt();
2567
- function l(_) {
2582
+ }, Co = () => {
2583
+ const [r, a] = p.useState(!1), [e, s] = p.useState([]), { cart: i, getProducts: o } = Pt();
2584
+ function l(m) {
2568
2585
  for (let h = 0; h < i.parts.length; h++)
2569
- for (let p = 0; p < _.variants.length; p++)
2570
- if (i.parts[h].productVariantId === _.variants[h].id)
2586
+ for (let g = 0; g < m.variants.length; g++)
2587
+ if (i.parts[h].productVariantId === m.variants[h].id)
2571
2588
  return i.parts[h].productVariantId;
2572
2589
  }
2573
- function m(_) {
2590
+ function d(m) {
2574
2591
  for (let h = 0; h < i.parts.length; h++)
2575
- for (let p = 0; p < _.variants.length; p++)
2576
- if (i.parts[h].productVariantId === _.variants[h].id)
2592
+ for (let g = 0; g < m.variants.length; g++)
2593
+ if (i.parts[h].productVariantId === m.variants[h].id)
2577
2594
  return i.parts[h].quantity;
2578
2595
  }
2579
- g.useEffect(() => {
2596
+ p.useEffect(() => {
2580
2597
  (async () => {
2581
- const h = i.parts.map((C) => String(C.productId)), d = (await a([...h])).map((C) => ({
2582
- ...C,
2583
- activeVariantId: l(C),
2584
- quantity: m(C)
2598
+ const h = i.parts.map((w) => String(w.productId)), u = (await o([...h])).map((w) => ({
2599
+ ...w,
2600
+ activeVariantId: l(w),
2601
+ quantity: d(w)
2585
2602
  }));
2586
- s(d);
2603
+ s(u);
2587
2604
  })();
2588
2605
  }, [i.parts.length]);
2589
- function n(_) {
2606
+ function n(m) {
2590
2607
  var h;
2591
- return !_ || !(_ != null && _.variants) ? !1 : (h = _.variants.find((p) => p.id === _.activeVariantId)) == null ? void 0 : h.subscriptionSettings;
2608
+ return !m || !(m != null && m.variants) ? !1 : (h = m.variants.find((g) => g.id === m.activeVariantId)) == null ? void 0 : h.subscriptionSettings;
2592
2609
  }
2593
- const o = i.parts.length > 0 && e.length > 0 && !n(e[0]), [f, N] = g.useState(!1);
2610
+ const c = i.parts.length > 0 && e.length > 0 && !n(e[0]), [v, f] = p.useState(!1);
2594
2611
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2595
2612
  /* @__PURE__ */ t.jsxs(
2596
2613
  "div",
2597
2614
  {
2598
- className: S.button,
2599
- onClick: (_) => {
2600
- _.stopPropagation(), c(!0), N(!0);
2615
+ className: C.button,
2616
+ onClick: (m) => {
2617
+ m.stopPropagation(), a(!0), f(!0);
2601
2618
  },
2602
2619
  children: [
2603
2620
  /* @__PURE__ */ t.jsx(
2604
- v,
2621
+ b,
2605
2622
  {
2606
2623
  name: "Handbag",
2607
2624
  fill: "var(--icon-primary)"
2608
2625
  }
2609
2626
  ),
2610
- o && /* @__PURE__ */ t.jsx("div", { className: S.shoppingCount, children: i.parts.length })
2627
+ c && /* @__PURE__ */ t.jsx("div", { className: C.shoppingCount, children: i.parts.length })
2611
2628
  ]
2612
2629
  }
2613
2630
  ),
@@ -2615,100 +2632,100 @@ const da = (r) => {
2615
2632
  Et,
2616
2633
  {
2617
2634
  close: () => {
2618
- N(!1), setTimeout(() => {
2619
- c(!1);
2635
+ f(!1), setTimeout(() => {
2636
+ a(!1);
2620
2637
  }, 300);
2621
2638
  },
2622
2639
  children: /* @__PURE__ */ t.jsx(
2623
- Io,
2640
+ Bo,
2624
2641
  {
2625
2642
  activeProducts: e,
2626
- isCartNotEmpty: o,
2627
- isOpen: f
2643
+ isCartNotEmpty: c,
2644
+ isOpen: v
2628
2645
  }
2629
2646
  )
2630
2647
  }
2631
2648
  )
2632
2649
  ] });
2633
- }, Io = (r) => {
2634
- const { activeProducts: c, isCartNotEmpty: e, isOpen: s } = r, { cart: i, reset: a, getTotalAndDiscount: l, updateQuantityOfProduct: m } = Pt(), n = bt();
2635
- function o(_) {
2636
- n(_);
2650
+ }, Bo = (r) => {
2651
+ const { activeProducts: a, isCartNotEmpty: e, isOpen: s } = r, { cart: i, reset: o, getTotalAndDiscount: l, updateQuantityOfProduct: d } = Pt(), n = vt();
2652
+ function c(m) {
2653
+ n(m);
2637
2654
  }
2638
- function f(_) {
2639
- m({
2640
- productId: _.id,
2641
- productVariantId: _.activeVariantId,
2642
- quantity: _.quantity + 1
2655
+ function v(m) {
2656
+ d({
2657
+ productId: m.id,
2658
+ productVariantId: m.activeVariantId,
2659
+ quantity: m.quantity + 1
2643
2660
  });
2644
2661
  }
2645
- function N(_) {
2646
- m({
2647
- productId: _.id,
2648
- productVariantId: _.activeVariantId,
2649
- quantity: _.quantity - 1
2662
+ function f(m) {
2663
+ d({
2664
+ productId: m.id,
2665
+ productVariantId: m.activeVariantId,
2666
+ quantity: m.quantity - 1
2650
2667
  });
2651
2668
  }
2652
2669
  return /* @__PURE__ */ t.jsxs(
2653
2670
  "div",
2654
2671
  {
2655
- className: F(S.modal, {
2656
- [S.closing]: !s
2672
+ className: F(C.modal, {
2673
+ [C.closing]: !s
2657
2674
  }),
2658
- onClick: (_) => _.stopPropagation(),
2675
+ onClick: (m) => m.stopPropagation(),
2659
2676
  children: [
2660
- /* @__PURE__ */ t.jsxs("div", { className: S.top, children: [
2661
- /* @__PURE__ */ t.jsxs("div", { className: S.info, children: [
2662
- /* @__PURE__ */ t.jsx("span", { className: S.title, children: "Cart" }),
2663
- e && /* @__PURE__ */ t.jsx("div", { className: S.count, children: i.parts.length })
2677
+ /* @__PURE__ */ t.jsxs("div", { className: C.top, children: [
2678
+ /* @__PURE__ */ t.jsxs("div", { className: C.info, children: [
2679
+ /* @__PURE__ */ t.jsx("span", { className: C.title, children: "Cart" }),
2680
+ e && /* @__PURE__ */ t.jsx("div", { className: C.count, children: i.parts.length })
2664
2681
  ] }),
2665
2682
  /* @__PURE__ */ t.jsx(
2666
2683
  "button",
2667
2684
  {
2668
- className: F(S.clear, {
2669
- [S.activeClear]: e
2685
+ className: F(C.clear, {
2686
+ [C.activeClear]: e
2670
2687
  }),
2671
2688
  disabled: !e,
2672
- onClick: a,
2689
+ onClick: o,
2673
2690
  children: "Clear all"
2674
2691
  }
2675
2692
  )
2676
2693
  ] }),
2677
- e ? /* @__PURE__ */ t.jsxs("div", { className: S.cart, children: [
2678
- /* @__PURE__ */ t.jsx("div", { className: S.products, children: c.map((_) => /* @__PURE__ */ t.jsxs(
2694
+ e ? /* @__PURE__ */ t.jsxs("div", { className: C.cart, children: [
2695
+ /* @__PURE__ */ t.jsx("div", { className: C.products, children: a.map((m) => /* @__PURE__ */ t.jsxs(
2679
2696
  "div",
2680
2697
  {
2681
- className: S.product,
2698
+ className: C.product,
2682
2699
  children: [
2683
- /* @__PURE__ */ t.jsxs("div", { className: S.productInfo, children: [
2700
+ /* @__PURE__ */ t.jsxs("div", { className: C.productInfo, children: [
2684
2701
  /* @__PURE__ */ t.jsx(
2685
2702
  "img",
2686
2703
  {
2687
- src: `https://imagedelivery.net/${_.images[0].cfId}/w=500`,
2704
+ src: `https://imagedelivery.net/${m.images[0].cfId}/w=500`,
2688
2705
  alt: "image",
2689
2706
  width: "100%",
2690
2707
  height: "100%",
2691
- className: S.image
2708
+ className: C.image
2692
2709
  }
2693
2710
  ),
2694
- /* @__PURE__ */ t.jsxs("div", { className: S.content, children: [
2695
- /* @__PURE__ */ t.jsx("div", { className: S.name, children: _.name }),
2696
- /* @__PURE__ */ t.jsxs("div", { className: S.price, children: [
2711
+ /* @__PURE__ */ t.jsxs("div", { className: C.content, children: [
2712
+ /* @__PURE__ */ t.jsx("div", { className: C.name, children: m.name }),
2713
+ /* @__PURE__ */ t.jsxs("div", { className: C.price, children: [
2697
2714
  "$",
2698
- _.variants.find((h) => h.id === _.activeVariantId).price.amount * ((_ == null ? void 0 : _.quantity) || 1)
2715
+ m.variants.find((h) => h.id === m.activeVariantId).price.amount * ((m == null ? void 0 : m.quantity) || 1)
2699
2716
  ] })
2700
2717
  ] })
2701
2718
  ] }),
2702
- /* @__PURE__ */ t.jsxs("div", { className: S.productButtons, children: [
2719
+ /* @__PURE__ */ t.jsxs("div", { className: C.productButtons, children: [
2703
2720
  /* @__PURE__ */ t.jsx(
2704
2721
  "div",
2705
2722
  {
2706
2723
  onClick: () => {
2707
- _.quantity !== 1 && N(_);
2724
+ m.quantity !== 1 && f(m);
2708
2725
  },
2709
- className: S.productButton,
2726
+ className: C.productButton,
2710
2727
  children: /* @__PURE__ */ t.jsx(
2711
- v,
2728
+ b,
2712
2729
  {
2713
2730
  name: "Minus",
2714
2731
  fill: "#757575",
@@ -2718,14 +2735,14 @@ const da = (r) => {
2718
2735
  )
2719
2736
  }
2720
2737
  ),
2721
- /* @__PURE__ */ t.jsx("div", { className: S.productCount, children: _.quantity }),
2738
+ /* @__PURE__ */ t.jsx("div", { className: C.productCount, children: m.quantity }),
2722
2739
  /* @__PURE__ */ t.jsx(
2723
2740
  "div",
2724
2741
  {
2725
- onClick: () => f(_),
2726
- className: S.productButton,
2742
+ onClick: () => v(m),
2743
+ className: C.productButton,
2727
2744
  children: /* @__PURE__ */ t.jsx(
2728
- v,
2745
+ b,
2729
2746
  {
2730
2747
  name: "Plus",
2731
2748
  fill: "#757575",
@@ -2738,14 +2755,14 @@ const da = (r) => {
2738
2755
  ] })
2739
2756
  ]
2740
2757
  },
2741
- _.id
2758
+ m.id
2742
2759
  )) }),
2743
- /* @__PURE__ */ t.jsxs("div", { className: S.bottom, children: [
2744
- /* @__PURE__ */ t.jsxs("div", { className: S.subtotal, children: [
2745
- /* @__PURE__ */ t.jsxs("div", { className: S.block, children: [
2760
+ /* @__PURE__ */ t.jsxs("div", { className: C.bottom, children: [
2761
+ /* @__PURE__ */ t.jsxs("div", { className: C.subtotal, children: [
2762
+ /* @__PURE__ */ t.jsxs("div", { className: C.block, children: [
2746
2763
  /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
2747
2764
  /* @__PURE__ */ t.jsx(
2748
- v,
2765
+ b,
2749
2766
  {
2750
2767
  name: "Info",
2751
2768
  width: 20,
@@ -2754,20 +2771,20 @@ const da = (r) => {
2754
2771
  }
2755
2772
  )
2756
2773
  ] }),
2757
- /* @__PURE__ */ t.jsxs("div", { className: S.total, children: [
2774
+ /* @__PURE__ */ t.jsxs("div", { className: C.total, children: [
2758
2775
  "$",
2759
2776
  l().total
2760
2777
  ] })
2761
2778
  ] }),
2762
- /* @__PURE__ */ t.jsx(kt, { onClick: () => o("/checkout"), children: "Checkout" })
2779
+ /* @__PURE__ */ t.jsx(kt, { onClick: () => c("/checkout"), children: "Checkout" })
2763
2780
  ] })
2764
- ] }) : /* @__PURE__ */ t.jsx(No, {})
2781
+ ] }) : /* @__PURE__ */ t.jsx(So, {})
2765
2782
  ]
2766
2783
  }
2767
2784
  );
2768
- }, No = () => /* @__PURE__ */ t.jsxs("div", { className: S.empty, children: [
2785
+ }, So = () => /* @__PURE__ */ t.jsxs("div", { className: C.empty, children: [
2769
2786
  /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
2770
- v,
2787
+ b,
2771
2788
  {
2772
2789
  name: "Handbag",
2773
2790
  fill: "var(--icon-secondary)"
@@ -2781,48 +2798,48 @@ const da = (r) => {
2781
2798
  "a",
2782
2799
  {
2783
2800
  href: "/products",
2784
- className: S.link,
2801
+ className: C.link,
2785
2802
  children: "view products"
2786
2803
  }
2787
2804
  )
2788
2805
  ] })
2789
- ] }), wo = ({ token: r }) => {
2790
- const [c, e] = g.useState("test-email@gmail.com"), s = bt();
2791
- g.useEffect(() => {
2806
+ ] }), To = ({ token: r }) => {
2807
+ const [a, e] = p.useState("test-email@gmail.com"), s = vt();
2808
+ p.useEffect(() => {
2792
2809
  (async () => {
2793
- const l = ko(r);
2810
+ const l = wo(r);
2794
2811
  e(l.email);
2795
2812
  })();
2796
2813
  }, [r]);
2797
- function i(a) {
2798
- s(a);
2814
+ function i(o) {
2815
+ s(o);
2799
2816
  }
2800
2817
  return /* @__PURE__ */ t.jsx(
2801
2818
  "div",
2802
2819
  {
2803
- className: S.userInfo,
2820
+ className: C.userInfo,
2804
2821
  onClick: () => i("/customer-dash"),
2805
- children: /* @__PURE__ */ t.jsx("div", { children: c || "test-email@gmail.com" })
2822
+ children: /* @__PURE__ */ t.jsx("div", { children: a || "test-email@gmail.com" })
2806
2823
  }
2807
2824
  );
2808
- }, Co = "_share_11u0d_1", Bo = "_modal_11u0d_8", So = "_header_11u0d_14", To = "_socials_11u0d_24", Po = "_social_11u0d_24", Ao = "_copy_11u0d_34", Oo = "_title_11u0d_41", qo = "_copyWrapper_11u0d_47", Eo = "_copyText_11u0d_56", ot = {
2809
- share: Co,
2810
- modal: Bo,
2811
- header: So,
2812
- socials: To,
2813
- social: Po,
2814
- copy: Ao,
2815
- title: Oo,
2816
- copyWrapper: qo,
2817
- copyText: Eo
2818
- }, ua = () => {
2819
- const { isOpenModal: r, setIsOpenModal: c } = Dt();
2825
+ }, Po = "_share_11u0d_1", Ao = "_modal_11u0d_8", Oo = "_header_11u0d_14", qo = "_socials_11u0d_24", Eo = "_social_11u0d_24", Do = "_copy_11u0d_34", Lo = "_title_11u0d_41", Ro = "_copyWrapper_11u0d_47", Mo = "_copyText_11u0d_56", ot = {
2826
+ share: Po,
2827
+ modal: Ao,
2828
+ header: Oo,
2829
+ socials: qo,
2830
+ social: Eo,
2831
+ copy: Do,
2832
+ title: Lo,
2833
+ copyWrapper: Ro,
2834
+ copyText: Mo
2835
+ }, pa = () => {
2836
+ const { isOpenModal: r, setIsOpenModal: a } = Dt();
2820
2837
  function e() {
2821
- c(!0);
2838
+ a(!0);
2822
2839
  }
2823
2840
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
2824
2841
  /* @__PURE__ */ t.jsx(
2825
- at,
2842
+ ct,
2826
2843
  {
2827
2844
  className: ot.share,
2828
2845
  onClick: (s) => {
@@ -2830,7 +2847,7 @@ const da = (r) => {
2830
2847
  },
2831
2848
  type: "Secondary",
2832
2849
  children: /* @__PURE__ */ t.jsx(
2833
- v,
2850
+ b,
2834
2851
  {
2835
2852
  name: "Share",
2836
2853
  fill: "#757575",
@@ -2839,10 +2856,10 @@ const da = (r) => {
2839
2856
  )
2840
2857
  }
2841
2858
  ),
2842
- r && /* @__PURE__ */ t.jsx(Et, { close: c, children: /* @__PURE__ */ t.jsx(Do, {}) })
2859
+ r && /* @__PURE__ */ t.jsx(Et, { close: a, children: /* @__PURE__ */ t.jsx(Ho, {}) })
2843
2860
  ] });
2844
- }, Do = () => {
2845
- const { setIsOpenModal: r } = Dt(), { notification: c, setNotification: e } = zt(), s = window.location.href;
2861
+ }, Ho = () => {
2862
+ const { setIsOpenModal: r } = Dt(), { notification: a, setNotification: e } = zt(), s = window.location.href;
2846
2863
  function i() {
2847
2864
  navigator.clipboard.writeText(s), e({
2848
2865
  message: "Link copied to clipboard",
@@ -2853,12 +2870,12 @@ const da = (r) => {
2853
2870
  "div",
2854
2871
  {
2855
2872
  className: ot.modal,
2856
- onClick: (a) => a.stopPropagation(),
2873
+ onClick: (o) => o.stopPropagation(),
2857
2874
  children: [
2858
2875
  /* @__PURE__ */ t.jsxs("div", { className: ot.header, children: [
2859
2876
  /* @__PURE__ */ t.jsx("div", { className: ot.title, children: "Copy Product Link" }),
2860
2877
  /* @__PURE__ */ t.jsx(
2861
- v,
2878
+ b,
2862
2879
  {
2863
2880
  name: "X",
2864
2881
  fill: "#757575",
@@ -2881,34 +2898,34 @@ const da = (r) => {
2881
2898
  {
2882
2899
  onClick: i,
2883
2900
  className: ot.copy,
2884
- children: c ? /* @__PURE__ */ t.jsx(v, { name: "Check" }) : /* @__PURE__ */ t.jsx(v, { name: "Copy" })
2901
+ children: a ? /* @__PURE__ */ t.jsx(b, { name: "Check" }) : /* @__PURE__ */ t.jsx(b, { name: "Copy" })
2885
2902
  }
2886
2903
  )
2887
2904
  ] })
2888
2905
  ]
2889
2906
  }
2890
2907
  );
2891
- }, Lo = "_accordion_1s1lq_1", Ro = "_header_1s1lq_9", Mo = "_icon_1s1lq_18", Ho = "_open_1s1lq_21", zo = "_content_1s1lq_25", _t = {
2892
- accordion: Lo,
2893
- header: Ro,
2894
- icon: Mo,
2895
- open: Ho,
2896
- content: zo
2897
- }, ma = ({ title: r, content: c }) => {
2898
- const [e, s] = g.useState(!1), [i, a] = g.useState(0), l = g.useRef(null), m = () => {
2908
+ }, zo = "_accordion_1s1lq_1", Fo = "_header_1s1lq_9", Vo = "_icon_1s1lq_18", Uo = "_open_1s1lq_21", Yo = "_content_1s1lq_25", mt = {
2909
+ accordion: zo,
2910
+ header: Fo,
2911
+ icon: Vo,
2912
+ open: Uo,
2913
+ content: Yo
2914
+ }, ga = ({ title: r, content: a }) => {
2915
+ const [e, s] = p.useState(!1), [i, o] = p.useState(0), l = p.useRef(null), d = () => {
2899
2916
  s(!e);
2900
2917
  };
2901
- return g.useEffect(() => {
2902
- l.current && a(e ? l.current.scrollHeight : 0);
2903
- }, [e]), /* @__PURE__ */ t.jsxs("div", { className: _t.accordion, children: [
2918
+ return p.useEffect(() => {
2919
+ l.current && o(e ? l.current.scrollHeight : 0);
2920
+ }, [e]), /* @__PURE__ */ t.jsxs("div", { className: mt.accordion, children: [
2904
2921
  /* @__PURE__ */ t.jsxs(
2905
2922
  "div",
2906
2923
  {
2907
- className: _t.header,
2908
- onClick: m,
2924
+ className: mt.header,
2925
+ onClick: d,
2909
2926
  children: [
2910
2927
  /* @__PURE__ */ t.jsx("h5", { id: "h5", children: r }),
2911
- /* @__PURE__ */ t.jsx("div", { className: F(_t.icon, { [_t.open]: e }), children: /* @__PURE__ */ t.jsx(v, { name: "CaretDown" }) })
2928
+ /* @__PURE__ */ t.jsx("div", { className: F(mt.icon, { [mt.open]: e }), children: /* @__PURE__ */ t.jsx(b, { name: "CaretDown" }) })
2912
2929
  ]
2913
2930
  }
2914
2931
  ),
@@ -2916,65 +2933,50 @@ const da = (r) => {
2916
2933
  "div",
2917
2934
  {
2918
2935
  ref: l,
2919
- className: _t.content,
2936
+ className: mt.content,
2920
2937
  style: { height: `${i}px` },
2921
- children: /* @__PURE__ */ t.jsx("p", { id: "p", children: c })
2938
+ children: /* @__PURE__ */ t.jsx("p", { id: "p", children: a })
2922
2939
  }
2923
2940
  )
2924
2941
  ] });
2925
- }, Fo = "_wrapper_1r14x_1", Vo = "_label_1r14x_9", Uo = "_input_1r14x_18", Yo = "_required_1r14x_35", Go = "_paddingless_1r14x_39", Wo = "_content_1r14x_43", Xo = "_borderless_1r14x_58", Jo = "_rightIcon_1r14x_63", it = {
2926
- wrapper: Fo,
2927
- label: Vo,
2928
- input: Uo,
2929
- required: Yo,
2930
- paddingless: Go,
2931
- content: Wo,
2932
- borderless: Xo,
2933
- rightIcon: Jo
2934
- }, ha = (r) => {
2942
+ }, Go = "_wrapper_p74l6_1", Wo = "_label_p74l6_9", Xo = "_input_p74l6_18", Jo = "_paddingless_p74l6_31", Qo = "_content_p74l6_35", Ko = "_contentBorder_p74l6_48", Zo = "_borderless_p74l6_53", ta = "_rightIcon_p74l6_58", et = {
2943
+ wrapper: Go,
2944
+ label: Wo,
2945
+ input: Xo,
2946
+ paddingless: Jo,
2947
+ content: Qo,
2948
+ contentBorder: Ko,
2949
+ borderless: Zo,
2950
+ rightIcon: ta
2951
+ }, fa = (r) => {
2935
2952
  const {
2936
- onChange: c,
2953
+ onChange: a,
2937
2954
  style: e,
2938
2955
  label: s,
2939
2956
  value: i,
2940
- type: a,
2957
+ type: o,
2941
2958
  min: l,
2942
- max: m,
2959
+ max: d,
2943
2960
  placeholder: n,
2944
- disabled: o = !1,
2945
- required: f = !1,
2946
- regex: N,
2947
- paddingless: _ = !1,
2961
+ disabled: c = !1,
2962
+ required: v = !1,
2963
+ regex: f,
2964
+ paddingless: m = !1,
2948
2965
  borderless: h = !1,
2949
- editable: p = !1,
2950
- isSearch: d = !1
2951
- } = r, { themeSettings: C } = qt(), { inputs: D } = C, [y, L] = g.useState(!1);
2952
- function B(k, V) {
2953
- if (k.startsWith("#")) {
2954
- let I, P, U;
2955
- return k.length === 7 ? (I = parseInt(k.slice(1, 3), 16), P = parseInt(k.slice(3, 5), 16), U = parseInt(k.slice(5, 7), 16)) : k.length === 4 && (I = parseInt(k[1] + k[1], 16), P = parseInt(k[2] + k[2], 16), U = parseInt(k[3] + k[3], 16)), `rgba(${I}, ${P}, ${U}, ${V})`;
2956
- }
2957
- const b = {
2958
- black: "#000000",
2959
- white: "#ffffff",
2960
- red: "#ff0000",
2961
- green: "#00ff00",
2962
- blue: "#0000ff"
2963
- // Можно добавить больше цветов
2964
- }[k.toLowerCase()];
2965
- return b ? B(b, V) : k;
2966
+ editable: g = !1,
2967
+ isSearch: u = !1
2968
+ } = r, { themeSettings: w } = qt(), { inputs: q } = w, [k, L] = p.useState(!1);
2969
+ function B(x) {
2970
+ return Number(x) < 0 ? String(l) : x;
2966
2971
  }
2967
- function T(k) {
2968
- return Number(k) < 0 ? String(l) : k;
2972
+ function S(x) {
2973
+ return !v || !f ? !0 : new RegExp(f).test(x);
2969
2974
  }
2970
- function x(k) {
2971
- return !f || !N ? !0 : new RegExp(N).test(k);
2972
- }
2973
- return /* @__PURE__ */ t.jsxs("div", { className: it.wrapper, children: [
2975
+ return /* @__PURE__ */ t.jsxs("div", { className: et.wrapper, children: [
2974
2976
  s && /* @__PURE__ */ t.jsx(
2975
2977
  "label",
2976
2978
  {
2977
- className: it.label,
2979
+ className: et.label,
2978
2980
  htmlFor: s,
2979
2981
  children: s
2980
2982
  }
@@ -2982,50 +2984,52 @@ const da = (r) => {
2982
2984
  /* @__PURE__ */ t.jsxs(
2983
2985
  "div",
2984
2986
  {
2985
- className: it.content,
2987
+ className: F(et.content, {
2988
+ [et.contentBorder]: q.border.active
2989
+ }),
2986
2990
  style: {
2987
- paddingRight: D.general.height + 15,
2991
+ paddingRight: q.general.height + 15,
2988
2992
  ...e,
2989
- backgroundColor: B(D.field.color, D.field.opacity / 100)
2993
+ background: q.field.active ? q.field.color : "transparent"
2990
2994
  },
2991
2995
  children: [
2992
2996
  /* @__PURE__ */ t.jsx(
2993
2997
  "input",
2994
2998
  {
2995
2999
  id: s,
2996
- type: a || "text",
2997
- onChange: (k) => {
2998
- if (a === "text") c(k.target.value);
3000
+ type: o || "text",
3001
+ onChange: (x) => {
3002
+ if (o === "text") a(x.target.value);
2999
3003
  else {
3000
- const V = T(k.target.value);
3001
- c(V);
3004
+ const D = B(x.target.value);
3005
+ a(D);
3002
3006
  }
3003
3007
  },
3004
3008
  value: i,
3005
3009
  autoComplete: "off",
3006
3010
  placeholder: n || "Type something...",
3007
- className: F(it.input, {
3008
- [it.required]: y && f && !x(i),
3009
- [it.paddingless]: _,
3010
- [it.borderless]: h
3011
+ className: F(et.input, {
3012
+ [et.required]: k && v && !S(i),
3013
+ [et.paddingless]: m,
3014
+ [et.borderless]: h
3011
3015
  }),
3012
- min: a === "number" ? l : void 0,
3013
- max: a === "number" ? m : void 0,
3014
- disabled: o,
3016
+ min: o === "number" ? l : void 0,
3017
+ max: o === "number" ? d : void 0,
3018
+ disabled: c,
3015
3019
  onFocus: () => L(!0)
3016
3020
  }
3017
3021
  ),
3018
- d && /* @__PURE__ */ t.jsx("div", { className: it.rightIcon, children: /* @__PURE__ */ t.jsx(
3019
- v,
3022
+ u && /* @__PURE__ */ t.jsx("div", { className: et.rightIcon, children: /* @__PURE__ */ t.jsx(
3023
+ b,
3020
3024
  {
3021
3025
  name: "MagnifyingGlass",
3022
3026
  fill: "var(--icon-secondary)",
3023
- width: D.general.height,
3024
- height: D.general.height
3027
+ width: q.general.height,
3028
+ height: q.general.height
3025
3029
  }
3026
3030
  ) }),
3027
- p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
3028
- v,
3031
+ g && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
3032
+ b,
3029
3033
  {
3030
3034
  name: "Sliders",
3031
3035
  width: 20,
@@ -3037,13 +3041,13 @@ const da = (r) => {
3037
3041
  }
3038
3042
  )
3039
3043
  ] });
3040
- }, Qo = "_wrapper_st58d_1", Ko = "_label_st58d_10", Zo = "_textarea_st58d_18", ta = "_length_st58d_33", xt = {
3041
- wrapper: Qo,
3042
- label: Ko,
3043
- textarea: Zo,
3044
- length: ta
3045
- }, _a = (r) => {
3046
- const { onChange: c, label: e, value: s, maxLength: i, placeholder: a = "Type something..." } = r, [l, m] = g.useState(s.length);
3044
+ }, ea = "_wrapper_st58d_1", sa = "_label_st58d_10", na = "_textarea_st58d_18", ia = "_length_st58d_33", xt = {
3045
+ wrapper: ea,
3046
+ label: sa,
3047
+ textarea: na,
3048
+ length: ia
3049
+ }, xa = (r) => {
3050
+ const { onChange: a, label: e, value: s, maxLength: i, placeholder: o = "Type something..." } = r, [l, d] = p.useState(s.length);
3047
3051
  return /* @__PURE__ */ t.jsxs("div", { className: xt.wrapper, children: [
3048
3052
  e && /* @__PURE__ */ t.jsx(
3049
3053
  "label",
@@ -3059,9 +3063,9 @@ const da = (r) => {
3059
3063
  id: e,
3060
3064
  defaultValue: s,
3061
3065
  onChange: (n) => {
3062
- m(n.target.value.length), c(n.target.value);
3066
+ d(n.target.value.length), a(n.target.value);
3063
3067
  },
3064
- placeholder: a,
3068
+ placeholder: o,
3065
3069
  className: xt.textarea,
3066
3070
  maxLength: i
3067
3071
  }
@@ -3074,34 +3078,34 @@ const da = (r) => {
3074
3078
  ] });
3075
3079
  };
3076
3080
  export {
3077
- ma as Accordion,
3081
+ ga as Accordion,
3078
3082
  kt as Button,
3079
- wn as ButtonTypeSettings,
3080
- ca as ButtonsSettings,
3081
- oa as CategorySettings,
3083
+ Sn as ButtonTypeSettings,
3084
+ ua as ButtonsSettings,
3085
+ ra as CategorySettings,
3082
3086
  gt as ChooseImage,
3083
- fa as ChooseImageModal,
3084
- No as EmptyCart,
3085
- aa as FormSettings,
3086
- da as HeaderButtons,
3087
- v as Icon,
3088
- X as InputSettings,
3089
- ha as InputUI,
3090
- He as ItemsSettings,
3091
- ia as LayoutSettings,
3092
- la as ListingSelector,
3093
- xa as Loader,
3087
+ ja as ChooseImageModal,
3088
+ So as EmptyCart,
3089
+ da as FormSettings,
3090
+ ma as HeaderButtons,
3091
+ b as Icon,
3092
+ W as InputSettings,
3093
+ fa as InputUI,
3094
+ ze as ItemsSettings,
3095
+ la as LayoutSettings,
3096
+ _a as ListingSelector,
3097
+ ya as Loader,
3094
3098
  Et as Modal,
3095
- ra as ProductOptions,
3099
+ ha as ProductOptions,
3096
3100
  At as RangeSelector,
3097
- et as Select,
3098
- ua as ShareLink,
3099
- $o as ShoppingButton,
3100
- Io as ShoppingModalCart,
3101
- tt as Switch,
3101
+ st as Select,
3102
+ pa as ShareLink,
3103
+ Co as ShoppingButton,
3104
+ Bo as ShoppingModalCart,
3105
+ Z as Switch,
3102
3106
  Rt as TextSettings,
3103
3107
  Ot as TextareaSettings,
3104
- _a as TextareaUI,
3108
+ xa as TextareaUI,
3105
3109
  Lt as TypesText,
3106
- wo as UserInfo
3110
+ To as UserInfo
3107
3111
  };