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