@billgangcom/theme-lib 1.55.0 → 1.57.0

package/dist/ui.es.js

@@ -1,5 +1,5 @@
-import { j as t, I as x, c as Y, a as dt, S as ot, R as yt, B as tt, O as ut, b as at, u as mt, d as ht, P as pt, D as _t, e as gt, v as xt, f as ft, C as bt, g as H, h as St, i as it, k as wt, l as Bt, m as $t, n as rt, o as V, L as Pt, p as lt, r as jt, t as G, w as Mt, M as vt, x as Nt, z as Tt, A as kt, E as qt } from "./index-D1p6pZXA.js";
-import { K as hi, G as pi, J as _i, F as gi, T as xi, H as fi } from "./index-D1p6pZXA.js";
+import { j as t, I as g, c as Y, a as dt, S as ot, R as yt, B as tt, O as ut, d as at, u as mt, e as ht, P as pt, D as _t, f as gt, v as xt, g as ft, C as bt, h as H, i as St, k as it, l as wt, m as Bt, n as $t, o as rt, p as V, L as Pt, q as lt, r as jt, t as G, w as Mt, M as vt, x as Nt, y as Tt, z as kt, A as qt } from "./index-Bh-lH7YV.js";
+import { J as hi, F as pi, H as _i, E as gi, T as xi, G as fi } from "./index-Bh-lH7YV.js";
 import _ from "react";
 import "@phosphor-icons/react";
 const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmyb_15", zt = "_subtitle_1vmyb_22", Rt = "_alignmentContent_1vmyb_29", Lt = "_alignments_1vmyb_37", Dt = "_alignment_1vmyb_8", Ht = "_circle_1vmyb_60", Ut = "_paddings_1vmyb_67", Ft = "_padding_1vmyb_67", Vt = "_active_1vmyb_91", Yt = "_input_1vmyb_98", W = {
@@ -25,10 +25,10 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
   "bottomLeft",
   "bottom",
   "bottomRight"
-], Wt = ["left", "top", "right", "bottom"], Kn = (r) => {
-  const { alignment: i, padding: e, setPadding: s, setAlignment: n } = r;
-  function h(c) {
-    switch (c) {
+], Wt = ["left", "top", "right", "bottom"], Qn = (d) => {
+  const { alignment: i, padding: e, setPadding: s, setAlignment: n } = d;
+  function p(l) {
+    switch (l) {
       case "left":
       case "topLeft":
       case "bottomLeft":
@@ -45,8 +45,8 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
         return "TextAlignCenter";
     }
   }
-  function u(c) {
-    switch (c) {
+  function m(l) {
+    switch (l) {
       case "left":
         return "AlignLeft";
       case "right":
@@ -57,40 +57,40 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
         return "AlignBottom";
     }
   }
-  const [o, d] = _.useState(null), [f, $] = _.useState(null);
+  const [o, u] = _.useState(null), [f, $] = _.useState(null);
   return /* @__PURE__ */ t.jsxs("div", { className: W.layout, children: [
     /* @__PURE__ */ t.jsx("h3", { className: W.title, children: "Layout" }),
     /* @__PURE__ */ t.jsxs("div", { className: W.alignmentBlock, children: [
       /* @__PURE__ */ t.jsx("h5", { className: W.subtitle, children: "Alignment" }),
       /* @__PURE__ */ t.jsxs("div", { className: W.alignmentContent, children: [
-        /* @__PURE__ */ t.jsx("div", { className: W.alignments, children: Gt.map((c) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: W.alignments, children: Gt.map((l) => /* @__PURE__ */ t.jsxs(
           "div",
           {
             onClick: () => {
-              n(c);
+              n(l);
             },
             className: W.alignment,
             onMouseEnter: () => {
-              d(c);
+              u(l);
             },
             onMouseLeave: () => {
-              d(null);
+              u(null);
             },
             children: [
-              c !== i && o !== c && /* @__PURE__ */ t.jsx("div", { className: W.circle }),
-              c !== i && o === c && /* @__PURE__ */ t.jsx(
-                x,
+              l !== i && o !== l && /* @__PURE__ */ t.jsx("div", { className: W.circle }),
+              l !== i && o === l && /* @__PURE__ */ t.jsx(
+                g,
                 {
-                  name: h(o),
+                  name: p(o),
                   fill: "#c2c2c2",
                   width: 22,
                   height: 22
                 }
               ),
-              c === i && /* @__PURE__ */ t.jsx(
-                x,
+              l === i && /* @__PURE__ */ t.jsx(
+                g,
                 {
-                  name: h(i),
+                  name: p(i),
                   fill: "#FF3F19",
                   width: 22,
                   height: 22
@@ -98,25 +98,25 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
               )
             ]
           },
-          c
+          l
         )) }),
-        /* @__PURE__ */ t.jsx("div", { className: W.paddings, children: Wt.map((c) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: W.paddings, children: Wt.map((l) => /* @__PURE__ */ t.jsxs(
           "label",
           {
             className: Y(W.padding, {
-              [W.active]: f === c
+              [W.active]: f === l
             }),
             onFocus: () => {
-              $(c);
+              $(l);
             },
             onBlur: () => {
               $(null);
             },
             children: [
               /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-                x,
+                g,
                 {
-                  name: u(c),
+                  name: m(l),
                   width: 20,
                   height: 20
                 }
@@ -125,10 +125,10 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
                 dt,
                 {
                   type: "number",
-                  value: String(e[c]),
-                  onChange: (l) => s({
+                  value: String(e[l]),
+                  onChange: (r) => s({
                     ...e,
-                    [c]: Math.min(Number(l), 999)
+                    [l]: Math.min(Number(r), 999)
                   }),
                   max: 999,
                   paddingless: !0,
@@ -137,16 +137,16 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
               )
             ]
           },
-          c
+          l
         )) })
       ] })
     ] })
   ] });
-}, Jt = "_title_82zux_1", Xt = "_subtitle_82zux_5", Kt = "_header_82zux_12", Qt = "_text_82zux_13", Zt = "_productsBlock_82zux_14", te = "_top_82zux_26", ee = "_itemsBlock_82zux_35", se = "_typeTexts_82zux_41", ne = "_block_82zux_48", ie = "_active_82zux_61", oe = "_products_82zux_14", ae = "_product_82zux_14", ce = "_button_82zux_80", le = "_disabled_82zux_91", re = "_image_82zux_95", de = "_info_82zux_102", ue = "_name_82zux_114", me = "_buttons_82zux_118", he = "_modal_82zux_125", pe = "_link_82zux_145", _e = "_modalOptions_82zux_151", ge = "_addButton_82zux_157", xe = "_deleteButton_82zux_179", J = {
+}, Jt = "_title_82zux_1", Xt = "_subtitle_82zux_5", Qt = "_header_82zux_12", Kt = "_text_82zux_13", Zt = "_productsBlock_82zux_14", te = "_top_82zux_26", ee = "_itemsBlock_82zux_35", se = "_typeTexts_82zux_41", ne = "_block_82zux_48", ie = "_active_82zux_61", oe = "_products_82zux_14", ae = "_product_82zux_14", ce = "_button_82zux_80", le = "_disabled_82zux_91", re = "_image_82zux_95", de = "_info_82zux_102", ue = "_name_82zux_114", me = "_buttons_82zux_118", he = "_modal_82zux_125", pe = "_link_82zux_145", _e = "_modalOptions_82zux_151", ge = "_addButton_82zux_157", xe = "_deleteButton_82zux_179", J = {
   title: Jt,
   subtitle: Xt,
-  header: Kt,
-  text: Qt,
+  header: Qt,
+  text: Kt,
   productsBlock: Zt,
   top: te,
   itemsBlock: ee,
@@ -166,37 +166,37 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
   modalOptions: _e,
   addButton: ge,
   deleteButton: xe
-}, Qn = (r) => {
+}, Kn = (d) => {
   const {
     isActiveItems: i,
     setIsActiveItems: e,
     items: s,
     setItems: n,
-    other: h,
-    title: u,
+    other: p,
+    title: m,
     subtitle: o,
-    draggable: d = !1,
+    draggable: u = !1,
     withImage: f = !1,
     addable: $ = !0,
-    itemsOptions: c,
-    hasRangeSelector: l = !1,
-    rangeSelectorOptions: M,
+    itemsOptions: l,
+    hasRangeSelector: r = !1,
+    rangeSelectorOptions: T,
     limit: w,
-    autoScrollInterval: p,
-    deletable: I
-  } = r;
-  function B(v) {
+    autoScrollInterval: C,
+    deletable: x
+  } = d;
+  function B(b) {
     if (f)
-      return v ? /* @__PURE__ */ t.jsx(
+      return b ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${v[0]}/w=1000`,
+          src: `https://imagedelivery.net/${b[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        x,
+        g,
         {
           name: "Image",
           width: 16,
@@ -205,12 +205,12 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
         }
       );
   }
-  const g = (v, q = !1) => {
-    const A = c.find((S) => S.id === v);
-    if (!A) return;
+  const a = (b, q = !1) => {
+    const M = l.find((S) => S.id === b);
+    if (!M) return;
     const L = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      d && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        x,
+      u && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        g,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -222,25 +222,25 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
         at,
         {
           onChange: (S) => {
-            const b = [...s], N = c.find((j) => j.name === S);
+            const j = [...s], N = l.find((v) => v.name === S);
             if (!N) return;
-            const O = N.id, a = b.map((j) => j === v ? O : j);
-            n([...a]);
+            const O = N.id, c = j.map((v) => v === b ? O : v);
+            n([...c]);
           },
-          value: A.name,
-          options: c.filter((S) => !s.find((b) => b === S.id)).map((S) => S.name),
-          leftAddon: B(A.images)
+          value: M.name,
+          options: l.filter((S) => !s.find((j) => j === S.id)).map((S) => S.name),
+          leftAddon: B(M.images)
         }
       ),
       q && /* @__PURE__ */ t.jsx("div", { className: J.buttons, children: /* @__PURE__ */ t.jsx("div", { className: J.deleteButton, children: /* @__PURE__ */ t.jsx(
-        x,
+        g,
         {
           name: "Trash",
           hoverable: !0,
           width: 20,
           height: 20,
           fill: "#C12A2A",
-          onClick: () => n(s.filter((S) => S !== v))
+          onClick: () => n(s.filter((S) => S !== b))
         }
       ) }) })
     ] });
@@ -250,24 +250,24 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
         className: J.product,
         children: L
       },
-      v
+      b
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: J.productsBlock, children: [
-    (u || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: J.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: J.title, children: u }),
+    (m || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: J.top, children: [
+      m && /* @__PURE__ */ t.jsx("h3", { className: J.title, children: m }),
       i !== void 0 && /* @__PURE__ */ t.jsx(
         ot,
         {
           current: i,
-          onChange: (v) => e == null ? void 0 : e(v)
+          onChange: (b) => e == null ? void 0 : e(b)
         }
       )
     ] }),
-    l && M && /* @__PURE__ */ t.jsx(yt, { ...M }),
+    r && T && /* @__PURE__ */ t.jsx(yt, { ...T }),
     /* @__PURE__ */ t.jsxs("div", { className: J.products, children: [
       o && /* @__PURE__ */ t.jsx("h5", { className: J.subtitle, children: o }),
-      s.map((v) => g(v, I)),
+      s.map((b) => a(b, x)),
       $ && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -282,21 +282,21 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
             {
               withoutHover: !0,
               className: Y(J.button, {
-                [J.disabled]: !!(w && w <= s.length || s.length === c.length)
+                [J.disabled]: !!(w && w <= s.length || s.length === l.length)
               }),
               size: "s",
-              disabled: !!(w && w <= s.length || s.length === c.length),
+              disabled: !!(w && w <= s.length || s.length === l.length),
               onClick: () => {
-                const v = [...s];
+                const b = [...s];
                 let q = null;
-                if (c) {
-                  for (let A = 0; A < c.length; A++)
-                    if (!s.find((L) => L === c[A].id)) {
-                      q = c[A];
+                if (l) {
+                  for (let M = 0; M < l.length; M++)
+                    if (!s.find((L) => L === l[M].id)) {
+                      q = l[M];
                       break;
                     }
                 }
-                v.push((q == null ? void 0 : q.id) || c[0].id), n(v);
+                b.push((q == null ? void 0 : q.id) || l[0].id), n(b);
               },
               style: {
                 width: "fit-content"
@@ -304,7 +304,7 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
               children: /* @__PURE__ */ t.jsxs("div", { className: J.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  x,
+                  g,
                   {
                     name: "Plus",
                     width: 16,
@@ -317,14 +317,14 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
         }
       )
     ] }),
-    h !== void 0 && /* @__PURE__ */ t.jsx(ut, { items: h }),
-    p !== void 0 && /* @__PURE__ */ t.jsx(
+    p !== void 0 && /* @__PURE__ */ t.jsx(ut, { items: p }),
+    C !== void 0 && /* @__PURE__ */ t.jsx(
       dt,
       {
         label: "Auto scroll interval",
         type: "number",
-        value: String(p.scrollInterval),
-        onChange: (v) => p.setScrollInterval(Number(v)),
+        value: String(C.scrollInterval),
+        onChange: (b) => C.setScrollInterval(Number(b)),
         min: 0.1,
         max: 100,
         style: {
@@ -360,25 +360,25 @@ const At = "_wrapper_1vmyb_2", Ot = "_alignmentBlock_1vmyb_8", Et = "_title_1vmy
   deleteButton: Le,
   closeIcon: De
 };
-function He({ product: r, children: i }) {
+function He({ product: d, children: i }) {
   const {
     attributes: e,
     listeners: s,
     setNodeRef: n,
-    transform: h,
-    transition: u,
+    transform: p,
+    transition: m,
     isDragging: o
   } = ft({
-    id: r.id
-  }), d = {
-    transform: bt.Transform.toString(h),
-    transition: u
+    id: d.id
+  }), u = {
+    transform: bt.Transform.toString(p),
+    transition: m
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: n,
-      style: d,
+      style: u,
       className: `${U.product} ${o ? U.dragging : ""}`,
       ...e,
       ...s,
@@ -386,23 +386,23 @@ function He({ product: r, children: i }) {
     }
   );
 }
-const Zn = (r) => {
+const Zn = (d) => {
   const {
     isActiveItems: i,
     setIsActiveItems: e,
     items: s,
     setItems: n,
-    title: h,
-    subtitle: u,
+    title: p,
+    subtitle: m,
     editable: o = !0,
-    draggable: d = !1,
+    draggable: u = !1,
     deletable: f = !0,
     addable: $ = !0,
-    itemsType: c,
-    itemsOptions: l,
-    addableOptions: M = {},
+    itemsType: l,
+    itemsOptions: r,
+    addableOptions: T = {},
     limit: w
-  } = r, [p, I] = _.useState(null), [B, g] = _.useState(null), v = _.useRef(null), q = mt(
+  } = d, [C, x] = _.useState(null), [B, a] = _.useState(null), b = _.useRef(null), q = mt(
     ht(pt, {
       activationConstraint: {
         distance: 5
@@ -410,33 +410,33 @@ const Zn = (r) => {
     })
   );
   _.useEffect(() => {
-    if (p) {
-      const b = [...s].map((N) => N.id === p.id ? p : N);
-      n(b);
+    if (C) {
+      const j = [...s].map((N) => N.id === C.id ? C : N);
+      n(j);
     }
-  }, [p]), _.useEffect(() => {
-    v.current && B && (v.current.getBoundingClientRect().height, B.top);
-  }, [v.current, B]);
-  const A = (b, N) => {
-    b.stopPropagation();
-    const O = b.target.getBoundingClientRect();
-    g({
+  }, [C]), _.useEffect(() => {
+    b.current && B && (b.current.getBoundingClientRect().height, B.top);
+  }, [b.current, B]);
+  const M = (j, N) => {
+    j.stopPropagation();
+    const O = j.target.getBoundingClientRect();
+    a({
       top: O.top + window.scrollY,
       left: O.left - 30
-    }), I(N);
-  }, L = (b) => {
-    const { active: N, over: O } = b;
+    }), x(N);
+  }, L = (j) => {
+    const { active: N, over: O } = j;
     if (O && N.id !== O.id) {
-      const a = s.findIndex((C) => C.id === N.id), j = s.findIndex((C) => C.id === O.id);
-      if (a !== -1 && j !== -1) {
-        const C = [...s], [D] = C.splice(a, 1);
-        C.splice(j, 0, D), n(C);
+      const c = s.findIndex((I) => I.id === N.id), v = s.findIndex((I) => I.id === O.id);
+      if (c !== -1 && v !== -1) {
+        const I = [...s], [D] = I.splice(c, 1);
+        I.splice(v, 0, D), n(I);
       }
     }
-  }, S = (b, N) => {
+  }, S = (j, N) => {
     const O = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      d && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        x,
+      u && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        g,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -444,84 +444,84 @@ const Zn = (r) => {
           height: 20
         }
       ) }),
-      c === "select" && l && /* @__PURE__ */ t.jsx(
+      l === "select" && r && /* @__PURE__ */ t.jsx(
         at,
         {
-          onChange: (a) => {
-            const j = [...s], C = l.find((P) => P.name === a);
-            if (!C) return;
-            const D = j.map((P) => P.id === b.id ? {
-              ...C,
+          onChange: (c) => {
+            const v = [...s], I = r.find((P) => P.name === c);
+            if (!I) return;
+            const D = v.map((P) => P.id === j.id ? {
+              ...I,
               name: {
-                "en-US": a
+                "en-US": c
               }
             } : P);
-            I({
-              ...b,
+            x({
+              ...j,
               name: {
-                "en-US": a
+                "en-US": c
               }
             }), n([...D]);
           },
-          value: b.name,
-          options: l.filter((a) => !s.find((j) => j.name === a.name)).map((a) => a.name)
+          value: j.name,
+          options: r.filter((c) => !s.find((v) => v.name === c.name)).map((c) => c.name)
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: U.buttons, children: [
         o && /* @__PURE__ */ t.jsx("div", { className: U.deleteButton, children: /* @__PURE__ */ t.jsx(
-          x,
+          g,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (a) => A(a, b)
+            onClick: (c) => M(c, j)
           }
         ) }),
         f && /* @__PURE__ */ t.jsx("div", { className: U.deleteButton, children: /* @__PURE__ */ t.jsx(
-          x,
+          g,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => n(s.filter((a) => a.id !== b.id))
+            onClick: () => n(s.filter((c) => c.id !== j.id))
           }
         ) })
       ] })
     ] });
-    return d ? /* @__PURE__ */ t.jsx(
+    return u ? /* @__PURE__ */ t.jsx(
       He,
       {
-        product: b,
+        product: j,
         index: N,
         children: O
       },
-      b.id
+      j.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: U.product,
         children: O
       },
-      b.id
+      j.id
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: U.productsBlock, children: [
-    (h || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: U.top, children: [
-      h && /* @__PURE__ */ t.jsx("h3", { className: U.title, children: h }),
+    (p || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: U.top, children: [
+      p && /* @__PURE__ */ t.jsx("h3", { className: U.title, children: p }),
       i !== void 0 && /* @__PURE__ */ t.jsx(
         ot,
         {
           current: i,
-          onChange: (b) => e == null ? void 0 : e(b)
+          onChange: (j) => e == null ? void 0 : e(j)
         }
       )
     ] }),
     /* @__PURE__ */ t.jsxs("div", { className: U.products, children: [
-      u && /* @__PURE__ */ t.jsx("h5", { className: U.subtitle, children: u }),
-      d ? /* @__PURE__ */ t.jsx(
+      m && /* @__PURE__ */ t.jsx("h5", { className: U.subtitle, children: m }),
+      u ? /* @__PURE__ */ t.jsx(
         _t,
         {
           sensors: q,
@@ -529,13 +529,13 @@ const Zn = (r) => {
           children: /* @__PURE__ */ t.jsx(
             gt,
             {
-              items: s.map((b) => b.id),
+              items: s.map((j) => j.id),
               strategy: xt,
-              children: s.map((b, N) => S(b, N))
+              children: s.map((j, N) => S(j, N))
             }
           )
         }
-      ) : s.map((b, N) => S(b, N)),
+      ) : s.map((j, N) => S(j, N)),
       $ && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -549,25 +549,25 @@ const Zn = (r) => {
             {
               withoutHover: !0,
               className: Y(U.button, {
-                [U.disabled]: !!(w && w <= s.length || s.length === (l == null ? void 0 : l.length))
+                [U.disabled]: !!(w && w <= s.length || s.length === (r == null ? void 0 : r.length))
               }),
               size: "s",
-              disabled: !!(w && w <= s.length || s.length === (l == null ? void 0 : l.length)),
+              disabled: !!(w && w <= s.length || s.length === (r == null ? void 0 : r.length)),
               onClick: () => {
-                const b = [...s];
+                const j = [...s];
                 let N = null;
-                if (l) {
-                  for (let O = 0; O < l.length; O++)
-                    if (!s.find((a) => a.id === l[O].id)) {
-                      N = l[O];
+                if (r) {
+                  for (let O = 0; O < r.length; O++)
+                    if (!s.find((c) => c.id === r[O].id)) {
+                      N = r[O];
                       break;
                     }
                 }
-                c === "select" && l && b.push({
-                  name: N ? N.name : l[0].name,
-                  id: (N == null ? void 0 : N.id) || l[0].id,
-                  ...M
-                }), n(b);
+                l === "select" && r && j.push({
+                  name: N ? N.name : r[0].name,
+                  id: (N == null ? void 0 : N.id) || r[0].id,
+                  ...T
+                }), n(j);
               },
               style: {
                 width: "fit-content"
@@ -575,7 +575,7 @@ const Zn = (r) => {
               children: /* @__PURE__ */ t.jsxs("div", { className: U.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  x,
+                  g,
                   {
                     name: "Plus",
                     width: 16,
@@ -590,51 +590,51 @@ const Zn = (r) => {
     ] })
   ] });
 };
-function Ue(r) {
-  const { product: i, children: e } = r, { attributes: s, listeners: n, setNodeRef: h, transform: u, transition: o, isDragging: d } = ft({
+function Ue(d) {
+  const { product: i, children: e } = d, { attributes: s, listeners: n, setNodeRef: p, transform: m, transition: o, isDragging: u } = ft({
     id: i.id
   }), f = {
-    transform: bt.Transform.toString(u),
+    transform: bt.Transform.toString(m),
     transition: o
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: h,
+      ref: p,
       style: f,
-      className: `${H.product} ${d ? H.dragging : ""}`,
+      className: `${H.product} ${u ? H.dragging : ""}`,
       ...s,
       ...n,
       children: e
     }
   );
 }
-const ti = (r) => {
+const ti = (d) => {
   const {
     isActiveItems: i,
     setIsActiveItems: e,
     items: s,
     setItems: n,
-    other: h,
-    title: u,
+    other: p,
+    title: m,
     subtitle: o,
-    editable: d = !0,
+    editable: u = !0,
     draggable: f = !1,
     withImage: $ = !1,
-    deletable: c = !0,
-    addable: l = !0,
-    itemsType: M,
+    deletable: l = !0,
+    addable: r = !0,
+    itemsType: T,
     itemsPlaceholder: w = "",
-    itemsOptions: p,
-    hasRangeSelector: I = !1,
+    itemsOptions: C,
+    hasRangeSelector: x = !1,
     rangeSelectorOptions: B,
-    modalOptions: g,
-    addableOptions: v = {},
+    modalOptions: a,
+    addableOptions: b = {},
     limit: q
-  } = r, [A, L] = _.useState(null), [S, b] = _.useState({
+  } = d, [M, L] = _.useState(null), [S, j] = _.useState({
     top: 0,
     left: 0
-  }), [N, O] = _.useState(null), a = _.useRef(null), [j, C] = _.useState(!1), D = mt(
+  }), [N, O] = _.useState(null), c = _.useRef(null), [v, I] = _.useState(!1), D = mt(
     ht(pt, {
       activationConstraint: {
         distance: 5
@@ -642,47 +642,47 @@ const ti = (r) => {
     })
   );
   _.useEffect(() => {
-    const m = () => {
-      L(null), C(!1);
+    const h = () => {
+      L(null), I(!1);
     };
-    return document.body.addEventListener("click", m), L(null), C(!1), () => {
-      L(null), C(!1), document.body.removeEventListener("click", m);
+    return document.body.addEventListener("click", h), L(null), I(!1), () => {
+      L(null), I(!1), document.body.removeEventListener("click", h);
     };
   }, []), _.useEffect(() => {
-    if (A) {
-      const m = [...s].map((T) => T.id === A.id ? A : T);
-      n(m);
+    if (M) {
+      const h = [...s].map((A) => A.id === M.id ? M : A);
+      n(h);
     }
-  }, [A]), _.useEffect(() => {
-    if (a.current && N) {
-      const m = a.current.getBoundingClientRect().height, T = window.innerHeight;
+  }, [M]), _.useEffect(() => {
+    if (c.current && N) {
+      const h = c.current.getBoundingClientRect().height, A = window.innerHeight;
       let E = N.top;
-      E + m > T + window.scrollY - 200 && (E = T + window.scrollY - m - 200), E < 0 && (E = 10), b({
+      E + h > A + window.scrollY - 200 && (E = A + window.scrollY - h - 200), E < 0 && (E = 10), j({
         top: E,
         left: N.left
       });
     }
-  }, [a.current, N]);
-  const P = (m, T) => {
-    m.stopPropagation();
-    const E = m.target.getBoundingClientRect();
+  }, [c.current, N]);
+  const P = (h, A) => {
+    h.stopPropagation();
+    const E = h.target.getBoundingClientRect();
     O({
       top: E.top + window.scrollY,
       left: E.left - 30
-    }), L(T), C(!0);
+    }), L(A), I(!0);
   };
-  function R(m) {
+  function R(h) {
     if ($)
-      return m ? /* @__PURE__ */ t.jsx(
+      return h ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${m[0]}/w=1000`,
+          src: `https://imagedelivery.net/${h[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        x,
+        g,
         {
           name: "Image",
           width: 16,
@@ -691,20 +691,20 @@ const ti = (r) => {
         }
       );
   }
-  const K = (m) => {
-    const { active: T, over: E } = m;
-    if (E && T.id !== E.id) {
-      const z = s.findIndex((F) => F.id === T.id), et = s.findIndex((F) => F.id === E.id);
+  const K = (h) => {
+    const { active: A, over: E } = h;
+    if (E && A.id !== E.id) {
+      const z = s.findIndex((F) => F.id === A.id), et = s.findIndex((F) => F.id === E.id);
       if (z !== -1 && et !== -1) {
         const F = [...s], [X] = F.splice(z, 1);
         F.splice(et, 0, X), n(F);
       }
     }
-  }, st = (m) => {
+  }, st = (h) => {
     var E;
-    const T = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    const A = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       f && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        x,
+        g,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -712,79 +712,79 @@ const ti = (r) => {
           height: 20
         }
       ) }),
-      M === "select" && p && /* @__PURE__ */ t.jsx(
+      T === "select" && C && /* @__PURE__ */ t.jsx(
         at,
         {
           onChange: (z) => {
-            const F = [...s].map((X) => X.id === m.id ? {
-              ...m,
+            const F = [...s].map((X) => X.id === h.id ? {
+              ...h,
               name: {
                 "en-US": z
               }
             } : X);
             L({
-              ...m,
+              ...h,
               name: {
                 "en-US": z
               }
             }), n([...F]);
           },
-          value: m.name["en-US"],
-          options: p.filter(
+          value: h.name["en-US"],
+          options: C.filter(
             (z) => !s.find((et) => et.name["en-US"] === z)
           ),
-          leftAddon: R(m.images)
+          leftAddon: R(h.images)
         }
       ),
-      M === "input" && /* @__PURE__ */ t.jsx(
+      T === "input" && /* @__PURE__ */ t.jsx(
         dt,
         {
           onChange: (z) => {
-            const F = [...s].map((X) => X.id === m.id ? {
-              ...m,
+            const F = [...s].map((X) => X.id === h.id ? {
+              ...h,
               name: {
                 "en-US": z
               }
             } : X);
             n([...F]);
           },
-          value: m.name["en-US"],
+          value: h.name["en-US"],
           placeholder: w
         }
       ),
-      M === "image" && /* @__PURE__ */ t.jsx(
+      T === "image" && /* @__PURE__ */ t.jsx(
         wt,
         {
           onChange: (z) => {
-            const F = [...s].map((X) => X.id === m.id ? {
-              ...m,
+            const F = [...s].map((X) => X.id === h.id ? {
+              ...h,
               images: z
             } : X);
             n([...F]);
           },
-          activeImage: (E = s.find((z) => z.id === m.id)) == null ? void 0 : E.images[0]
+          activeImage: (E = s.find((z) => z.id === h.id)) == null ? void 0 : E.images[0]
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: H.buttons, children: [
-        d && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
-          x,
+        u && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
+          g,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (z) => P(z, m)
+            onClick: (z) => P(z, h)
           }
         ) }),
-        c && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
-          x,
+        l && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
+          g,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => n(s.filter((z) => z.id !== m.id))
+            onClick: () => n(s.filter((z) => z.id !== h.id))
           }
         ) })
       ] })
@@ -792,42 +792,42 @@ const ti = (r) => {
     return f ? /* @__PURE__ */ t.jsx(
       Ue,
       {
-        product: m,
-        children: T
+        product: h,
+        children: A
       },
-      m.id
+      h.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: H.product,
-        children: T
+        children: A
       },
-      m.id
+      h.id
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: H.productsBlock, children: [
-    (u || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: H.title, children: u }),
+    (m || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
+      m && /* @__PURE__ */ t.jsx("h3", { className: H.title, children: m }),
       i !== void 0 && /* @__PURE__ */ t.jsx(
         ot,
         {
           current: i,
-          onChange: (m) => e == null ? void 0 : e(m)
+          onChange: (h) => e == null ? void 0 : e(h)
         }
       )
     ] }),
-    A && d && g && j && /* @__PURE__ */ t.jsx(
+    M && u && a && v && /* @__PURE__ */ t.jsx(
       St,
       {
-        ref: a,
-        activeItem: A,
+        ref: c,
+        activeItem: M,
         setActiveItem: L,
         popupPosition: S,
-        modalOptions: g,
-        setIsOpenModal: C
+        modalOptions: a,
+        setIsOpenModal: I
       }
     ),
-    I && B && /* @__PURE__ */ t.jsx(yt, { ...B }),
+    x && B && /* @__PURE__ */ t.jsx(yt, { ...B }),
     /* @__PURE__ */ t.jsxs("div", { className: H.products, children: [
       o && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: o }),
       f ? /* @__PURE__ */ t.jsx(
@@ -838,14 +838,14 @@ const ti = (r) => {
           children: /* @__PURE__ */ t.jsx(
             gt,
             {
-              items: s.map((m) => m.id),
+              items: s.map((h) => h.id),
               strategy: xt,
-              children: s.map((m) => st(m))
+              children: s.map((h) => st(h))
             }
           )
         }
-      ) : s.map((m) => st(m)),
-      l && /* @__PURE__ */ t.jsx(
+      ) : s.map((h) => st(h)),
+      r && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -863,38 +863,38 @@ const ti = (r) => {
               size: "s",
               disabled: !!(q && q <= s.length),
               onClick: () => {
-                const m = [...s];
-                let T = null;
-                if (p) {
-                  for (let E = 0; E < p.length; E++)
-                    if (!s.find((z) => z.name["en-US"] === p[E])) {
-                      T = p[E];
+                const h = [...s];
+                let A = null;
+                if (C) {
+                  for (let E = 0; E < C.length; E++)
+                    if (!s.find((z) => z.name["en-US"] === C[E])) {
+                      A = C[E];
                       break;
                     }
                 }
-                M === "select" && p ? m.push({
+                T === "select" && C ? h.push({
                   name: {
-                    "en-US": T || p[0]
+                    "en-US": A || C[0]
                   },
                   id: it(),
-                  ...v,
+                  ...b,
                   maxSymbols: 100
                   // пример значения
-                }) : M === "input" ? m.push({
+                }) : T === "input" ? h.push({
                   name: {
                     "en-US": ""
                   },
                   id: it(),
-                  ...v,
+                  ...b,
                   maxSymbols: 100
-                }) : m.push({
+                }) : h.push({
                   name: {
                     "en-US": `Image ${s.length + 1}`
                   },
                   id: it(),
-                  ...v,
+                  ...b,
                   maxSymbols: 100
-                }), n(m);
+                }), n(h);
               },
               style: {
                 width: "fit-content"
@@ -902,7 +902,7 @@ const ti = (r) => {
               children: /* @__PURE__ */ t.jsxs("div", { className: H.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  x,
+                  g,
                   {
                     name: "Plus",
                     width: 16,
@@ -915,9 +915,9 @@ const ti = (r) => {
         }
       )
     ] }),
-    h !== void 0 && /* @__PURE__ */ t.jsx(ut, { items: h })
+    p !== void 0 && /* @__PURE__ */ t.jsx(ut, { items: p })
   ] });
-}, Fe = "_subtitle_jql1y_1", Ve = "_header_jql1y_8", Ye = "_text_jql1y_9", Ge = "_productsBlock_jql1y_10", We = "_buttonsBlock_jql1y_11", Je = "_top_jql1y_23", Xe = "_itemsBlock_jql1y_32", Ke = "_typeTexts_jql1y_38", Qe = "_block_jql1y_45", Ze = "_active_jql1y_58", ts = "_products_jql1y_10", es = "_product_jql1y_10", ss = "_button_jql1y_11", ns = "_image_jql1y_88", is = "_info_jql1y_95", os = "_name_jql1y_107", as = "_buttons_jql1y_11", cs = "_modal_jql1y_118", ls = "_other_jql1y_138", rs = "_options_jql1y_144", ds = "_addButton_jql1y_150", us = "_deleteButton_jql1y_165", Q = {
+}, Fe = "_subtitle_jql1y_1", Ve = "_header_jql1y_8", Ye = "_text_jql1y_9", Ge = "_productsBlock_jql1y_10", We = "_buttonsBlock_jql1y_11", Je = "_top_jql1y_23", Xe = "_itemsBlock_jql1y_32", Qe = "_typeTexts_jql1y_38", Ke = "_block_jql1y_45", Ze = "_active_jql1y_58", ts = "_products_jql1y_10", es = "_product_jql1y_10", ss = "_button_jql1y_11", ns = "_image_jql1y_88", is = "_info_jql1y_95", os = "_name_jql1y_107", as = "_buttons_jql1y_11", cs = "_modal_jql1y_118", ls = "_other_jql1y_138", rs = "_options_jql1y_144", ds = "_addButton_jql1y_150", us = "_deleteButton_jql1y_165", Q = {
   subtitle: Fe,
   header: Ve,
   text: Ye,
@@ -925,8 +925,8 @@ const ti = (r) => {
   buttonsBlock: We,
   top: Je,
   itemsBlock: Xe,
-  typeTexts: Ke,
-  block: Qe,
+  typeTexts: Qe,
+  block: Ke,
   active: Ze,
   products: ts,
   product: es,
@@ -940,37 +940,44 @@ const ti = (r) => {
   options: rs,
   addButton: ds,
   deleteButton: us
-}, ms = (r) => {
-  const { buttons: i, setButtons: e, deletable: s = !0, addable: n = !0, editableLink: h = !0 } = r, { pages: u } = Bt(), [o, d] = _.useState(null), [f, $] = _.useState({
+}, ms = (d) => {
+  const { buttons: i, setButtons: e, deletable: s = !0, addable: n = !0, editableLink: p = !0 } = d, { pages: m } = Bt(), [o, u] = _.useState(null), [f, $] = _.useState({
     top: 0,
     left: 0
-  }), [c, l] = _.useState(null), M = _.useRef(null);
+  }), [l, r] = _.useState(null), T = _.useRef(null);
   _.useEffect(() => {
     if (o) {
-      const p = [...i].map((I) => I.id === o.id ? o : I);
-      e(p);
+      const x = [...i].map((B) => B.id === o.id ? o : B);
+      e(x);
     }
   }, [o]), _.useEffect(() => {
-    if (M.current && c) {
-      const p = M.current.getBoundingClientRect().height, I = window.innerHeight;
-      let B = c.top;
-      B + p > I + window.scrollY - 200 && (B = I + window.scrollY - p - 200), B < 0 && (B = 10), $({
-        top: B,
-        left: c.left
+    if (T.current && l) {
+      const x = T.current.getBoundingClientRect().height, B = window.innerHeight;
+      let a = l.top;
+      a + x > B + window.scrollY - 200 && (a = B + window.scrollY - x - 200), a < 0 && (a = 10), $({
+        top: a,
+        left: l.left
       });
     }
-  }, [M.current, c]);
-  const w = (p, I) => {
-    p.stopPropagation();
-    const B = p.target.getBoundingClientRect();
-    l({
-      top: B.top + window.scrollY - 70,
-      left: B.left - (n ? 30 : 65)
-    }), d(I);
+  }, [T.current, l]);
+  const w = (x, B) => {
+    x.stopPropagation();
+    const a = x.target.getBoundingClientRect();
+    r({
+      top: a.top + window.scrollY - 70,
+      left: a.left - (n ? 30 : 65)
+    }), u(B);
+  }, C = (x, B) => {
+    const a = [...i], b = {
+      ...x,
+      id: Math.random().toString(36).substr(2, 9)
+      // Генерируем новый уникальный ID
+    };
+    a.splice(B + 1, 0, b), e(a);
   };
   return /* @__PURE__ */ t.jsxs("div", { className: Q.products, children: [
     /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: "Button Type" }),
-    i.map((p) => /* @__PURE__ */ t.jsxs(
+    i.map((x, B) => /* @__PURE__ */ t.jsxs(
       "div",
       {
         className: Q.product,
@@ -978,38 +985,50 @@ const ti = (r) => {
           /* @__PURE__ */ t.jsx(
             at,
             {
-              onChange: (I) => {
-                const g = [...i].map((v) => v.id === p.id ? {
-                  ...p,
-                  type: I
-                } : v);
-                e(g);
+              onChange: (a) => {
+                const q = [...i].map((M) => M.id === x.id ? {
+                  ...x,
+                  type: a
+                } : M);
+                e(q);
               },
-              value: p.type,
+              value: x.type,
               options: ["Primary", "Secondary", "Tertiary"]
             }
           ),
           /* @__PURE__ */ t.jsxs("div", { className: Q.buttons, children: [
             /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
-              x,
+              g,
+              {
+                name: "Copy",
+                hoverable: !0,
+                width: 20,
+                height: 20,
+                onClick: () => {
+                  C(x, B);
+                }
+              }
+            ) }),
+            /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
+              g,
               {
                 name: "Sliders",
                 hoverable: !0,
                 width: 20,
                 height: 20,
-                onClick: (I) => {
-                  w(I, p);
+                onClick: (a) => {
+                  w(a, x);
                 }
               }
             ) }),
             s && /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
-              x,
+              g,
               {
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const I = i.filter((B) => B.id !== p.id);
-                  e(I);
+                  const a = i.filter((b) => b.id !== x.id);
+                  e(a);
                 },
                 width: 20,
                 height: 20,
@@ -1019,16 +1038,16 @@ const ti = (r) => {
           ] })
         ]
       },
-      p.id
+      x.id
     )),
     o && /* @__PURE__ */ t.jsx(
       $t,
       {
-        ref: M,
+        ref: T,
         activeButton: o,
-        setActiveButton: d,
+        setActiveButton: u,
         popupPosition: f,
-        editableLink: h
+        editableLink: p
       }
     ),
     n && /* @__PURE__ */ t.jsx(
@@ -1046,8 +1065,8 @@ const ti = (r) => {
             className: Q.button,
             size: "s",
             onClick: () => {
-              const p = [...i];
-              h ? p.push({
+              const x = [...i];
+              p ? x.push({
                 type: "Primary",
                 id: it(),
                 typesText: [],
@@ -1055,9 +1074,9 @@ const ti = (r) => {
                   "en-US": "Button Name"
                 },
                 destination: "Go to Page",
-                page: u ? Object.values(u)[0].name : "Home",
+                page: m ? Object.values(m)[0].name : "Home",
                 openInNewTab: !1
-              }) : p.push({
+              }) : x.push({
                 type: "Primary",
                 id: it(),
                 typesText: [],
@@ -1065,9 +1084,9 @@ const ti = (r) => {
                   "en-US": "Create Ticket"
                 },
                 destination: "Go to Page",
-                page: u ? Object.values(u)[0].name : "Home",
+                page: m ? Object.values(m)[0].name : "Home",
                 openInNewTab: !1
-              }), e(p);
+              }), e(x);
             },
             style: {
               width: "fit-content"
@@ -1075,7 +1094,7 @@ const ti = (r) => {
             children: /* @__PURE__ */ t.jsxs("div", { className: Q.addButton, children: [
               /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
               /* @__PURE__ */ t.jsx(
-                x,
+                g,
                 {
                   name: "Plus",
                   width: 16,
@@ -1088,16 +1107,16 @@ const ti = (r) => {
       }
     )
   ] });
-}, ei = (r) => {
+}, ei = (d) => {
   const {
     isActiveButtons: i,
     setIsActiveButtons: e,
     buttons: s,
     setButtons: n,
-    editableLink: h = !0,
-    addable: u = !0,
+    editableLink: p = !0,
+    addable: m = !0,
     deletable: o = !0
-  } = r;
+  } = d;
   return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: rt.buttonsBlock, children: [
     /* @__PURE__ */ t.jsxs("div", { className: rt.top, children: [
       /* @__PURE__ */ t.jsx("h3", { className: rt.title, children: "Buttons" }),
@@ -1105,7 +1124,7 @@ const ti = (r) => {
         ot,
         {
           current: i,
-          onChange: (d) => e(d)
+          onChange: (u) => e(u)
         }
       )
     ] }),
@@ -1114,54 +1133,54 @@ const ti = (r) => {
       {
         buttons: s,
         setButtons: n,
-        editableLink: h,
-        addable: u,
+        editableLink: p,
+        addable: m,
         deletable: o
       }
     )
   ] }) });
 };
-function hs(r) {
-  const { product: i, children: e } = r, { attributes: s, listeners: n, setNodeRef: h, transform: u, transition: o, isDragging: d } = ft({
+function hs(d) {
+  const { product: i, children: e } = d, { attributes: s, listeners: n, setNodeRef: p, transform: m, transition: o, isDragging: u } = ft({
     id: String(i.listingId)
   }), f = {
-    transform: bt.Transform.toString(u),
+    transform: bt.Transform.toString(m),
     transition: o
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: h,
+      ref: p,
       style: f,
-      className: `${V.product} ${d ? V.dragging : ""}`,
+      className: `${V.product} ${u ? V.dragging : ""}`,
       ...s,
       ...n,
       children: e
     }
   );
 }
-const si = (r) => {
+const si = (d) => {
   const {
     isActiveItems: i,
     setIsActiveItems: e,
     items: s,
     setItems: n,
-    other: h,
-    title: u,
+    other: p,
+    title: m,
     subtitle: o,
-    editable: d = !0,
+    editable: u = !0,
     draggable: f = !1,
     withImage: $ = !1,
-    deletable: c = !0,
-    addable: l = !0,
-    itemsType: M,
+    deletable: l = !0,
+    addable: r = !0,
+    itemsType: T,
     itemsOptions: w
-  } = r, [p, I] = _.useState(
+  } = d, [C, x] = _.useState(
     null
-  ), [B, g] = _.useState({
+  ), [B, a] = _.useState({
     top: 0,
     left: 0
-  }), [v, q] = _.useState(!1), A = mt(
+  }), [b, q] = _.useState(!1), M = mt(
     ht(pt, {
       activationConstraint: {
         distance: 5
@@ -1169,39 +1188,39 @@ const si = (r) => {
     })
   );
   _.useEffect(() => {
-    const a = () => {
-      I(null), q(!1);
+    const c = () => {
+      x(null), q(!1);
     };
-    return document.body.addEventListener("click", a), I(null), q(!1), () => {
-      I(null), q(!1), document.body.removeEventListener("click", a);
+    return document.body.addEventListener("click", c), x(null), q(!1), () => {
+      x(null), q(!1), document.body.removeEventListener("click", c);
     };
   }, []), _.useEffect(() => {
-    if (p) {
-      const a = [...s].map((j) => j.listingId === p.listingId ? p : j);
-      n(a);
+    if (C) {
+      const c = [...s].map((v) => v.listingId === C.listingId ? C : v);
+      n(c);
     }
-  }, [p]);
-  const L = (a, j) => {
-    a.stopPropagation();
-    const C = a.target.getBoundingClientRect(), D = 100, P = window.innerHeight;
-    let R = C.top + window.scrollY;
-    R + D > P && (R = P - D - 20), q(!0), g({
+  }, [C]);
+  const L = (c, v) => {
+    c.stopPropagation();
+    const I = c.target.getBoundingClientRect(), D = 100, P = window.innerHeight;
+    let R = I.top + window.scrollY;
+    R + D > P && (R = P - D - 20), q(!0), a({
       top: R - 80,
-      left: C.left - 30
-    }), I(j);
+      left: I.left - 30
+    }), x(v);
   };
-  function S(a) {
+  function S(c) {
     if ($)
-      return a ? /* @__PURE__ */ t.jsx(
+      return c ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${a}/w=1000`,
+          src: `https://imagedelivery.net/${c}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        x,
+        g,
         {
           name: "Image",
           width: 16,
@@ -1210,21 +1229,21 @@ const si = (r) => {
         }
       );
   }
-  const b = (a) => {
-    const { active: j, over: C } = a;
-    if (C && j.id !== C.id) {
-      const D = s.findIndex((R) => String(R.listingId) === j.id), P = s.findIndex((R) => String(R.listingId) === C.id);
+  const j = (c) => {
+    const { active: v, over: I } = c;
+    if (I && v.id !== I.id) {
+      const D = s.findIndex((R) => String(R.listingId) === v.id), P = s.findIndex((R) => String(R.listingId) === I.id);
       if (D !== -1 && P !== -1) {
         const R = [...s], [K] = R.splice(D, 1);
         R.splice(P, 0, K), n(R);
       }
     }
-  }, N = (a, j) => {
-    const C = w.find((P) => a.listingId === P.id);
-    if (!C) return null;
+  }, N = (c, v) => {
+    const I = w.find((P) => c.listingId === P.id);
+    if (!I) return null;
     const D = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       f && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        x,
+        g,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -1232,48 +1251,48 @@ const si = (r) => {
           height: 20
         }
       ) }),
-      M === "select" && /* @__PURE__ */ t.jsx(
+      T === "select" && /* @__PURE__ */ t.jsx(
         at,
         {
           onChange: (P) => {
-            const R = [...s], K = w.find((T) => T.productData.name === P);
+            const R = [...s], K = w.find((A) => A.productData.name === P);
             if (!K) return;
             const st = {
               listingId: K.id,
               image: K.productData.images.length > 0 ? K.productData.images[0].cfId : ""
-            }, m = R.map((T) => T.listingId === a.listingId ? st : T);
-            I(st), n([...m]);
+            }, h = R.map((A) => A.listingId === c.listingId ? st : A);
+            x(st), n([...h]);
           },
-          value: C.productData.name,
+          value: I.productData.name,
           options: [
             ...w.filter((P) => !s.find((R) => R.listingId === P.id)).map((P) => P.productData.name)
           ],
           leftAddon: S(
-            a.image || C.productData.images.length > 0 && C.productData.images[0].cfId || ""
+            c.image || I.productData.images.length > 0 && I.productData.images[0].cfId || ""
           )
         },
-        j
+        v
       ),
       /* @__PURE__ */ t.jsxs("div", { className: V.buttons, children: [
-        d && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
-          x,
+        u && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
+          g,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (P) => L(P, a)
+            onClick: (P) => L(P, c)
           }
         ) }),
-        c && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
-          x,
+        l && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
+          g,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => n(s.filter((P) => P !== a))
+            onClick: () => n(s.filter((P) => P !== c))
           }
         ) })
       ] })
@@ -1281,36 +1300,36 @@ const si = (r) => {
     return f ? /* @__PURE__ */ t.jsx(
       hs,
       {
-        product: a,
+        product: c,
         children: D
       },
-      a.listingId
+      c.listingId
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: V.product,
         children: D
       },
-      a.listingId
+      c.listingId
     );
   }, O = _.useRef(null);
   return /* @__PURE__ */ t.jsxs("div", { className: V.productsBlock, children: [
-    (u || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: u }),
+    (m || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
+      m && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: m }),
       i !== void 0 && /* @__PURE__ */ t.jsx(
         ot,
         {
           current: i,
-          onChange: (a) => e == null ? void 0 : e(a)
+          onChange: (c) => e == null ? void 0 : e(c)
         }
       )
     ] }),
-    v && p && /* @__PURE__ */ t.jsx(
+    b && C && /* @__PURE__ */ t.jsx(
       Pt,
       {
         ref: O,
-        activeItem: p,
-        setActiveItem: I,
+        activeItem: C,
+        setActiveItem: x,
         setIsOpenModal: q,
         popupPosition: B,
         itemsOptions: w
@@ -1321,19 +1340,19 @@ const si = (r) => {
       f ? /* @__PURE__ */ t.jsx(
         _t,
         {
-          sensors: A,
-          onDragEnd: b,
+          sensors: M,
+          onDragEnd: j,
           children: /* @__PURE__ */ t.jsx(
             gt,
             {
-              items: s.map((a) => String(a.listingId)),
+              items: s.map((c) => String(c.listingId)),
               strategy: xt,
-              children: s.map((a, j) => N(a, j))
+              children: s.map((c, v) => N(c, v))
             }
           )
         }
-      ) : s.map((a, j) => N(a, j)),
-      l && /* @__PURE__ */ t.jsx(
+      ) : s.map((c, v) => N(c, v)),
+      r && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -1348,16 +1367,16 @@ const si = (r) => {
               className: V.button,
               size: "s",
               onClick: () => {
-                const a = [...s];
-                for (let j = 0; j < w.length; j++)
-                  if (!s.find((C) => C.listingId === w[j].id)) {
-                    a.push({
-                      listingId: w[j].id,
-                      image: w[j].productData.images.length > 0 ? w[j].productData.images[0].cfId : ""
+                const c = [...s];
+                for (let v = 0; v < w.length; v++)
+                  if (!s.find((I) => I.listingId === w[v].id)) {
+                    c.push({
+                      listingId: w[v].id,
+                      image: w[v].productData.images.length > 0 ? w[v].productData.images[0].cfId : ""
                     });
                     break;
                   }
-                n(a);
+                n(c);
               },
               disabled: s.length === w.length,
               style: {
@@ -1366,7 +1385,7 @@ const si = (r) => {
               children: /* @__PURE__ */ t.jsxs("div", { className: V.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  x,
+                  g,
                   {
                     name: "Plus",
                     width: 16,
@@ -1379,7 +1398,7 @@ const si = (r) => {
         }
       )
     ] }),
-    i && h !== void 0 && /* @__PURE__ */ t.jsx(ut, { items: h })
+    i && p !== void 0 && /* @__PURE__ */ t.jsx(ut, { items: p })
   ] });
 }, ps = "_options_6cemk_1", _s = "_price_6cemk_12", gs = "_oldPrice_6cemk_19", xs = "_newPrice_6cemk_27", fs = "_animate_6cemk_34", bs = "_appearAndBounce_6cemk_1", js = "_meta_6cemk_52", vs = "_info_6cemk_58", ys = "_infoRight_6cemk_66", Ns = "_buttons_6cemk_73", ks = "_variants_6cemk_80", Is = "_variant_6cemk_80", Cs = "_stock_6cemk_98", Ss = "_variantInfo_6cemk_105", ws = "_quantity_6cemk_111", Bs = "_count_6cemk_118", $s = "_focused_6cemk_135", Ps = "_button_6cemk_73", Ms = "_activeVariant_6cemk_161", Ts = "_chargeTypes_6cemk_165", qs = "_charge_6cemk_165", As = "_chargeActive_6cemk_190", Os = "_title_6cemk_198", k = {
   options: ps,
@@ -1406,78 +1425,78 @@ const si = (r) => {
   chargeActive: As,
   title: Os
 };
-var It = /* @__PURE__ */ ((r) => (r.ONE_TIME = "One-Time", r.RECURRING = "Subscribe & Save", r))(It || {});
-const ni = (r) => {
-  var I, B;
-  const { variants: i } = r, [e, s] = _.useState(i[0]), [n, h] = _.useState(e.chargeTypes[0]), u = lt(), [o, d] = _.useState(1), { reset: f, addProductToCart: $ } = jt(), [c, l] = _.useState(!1);
+var It = /* @__PURE__ */ ((d) => (d.ONE_TIME = "One-Time", d.RECURRING = "Subscribe & Save", d))(It || {});
+const ni = (d) => {
+  var x, B;
+  const { variants: i } = d, [e, s] = _.useState(i[0]), [n, p] = _.useState(e.chargeTypes[0]), m = lt(), [o, u] = _.useState(1), { reset: f, addProductToCart: $ } = jt(), [l, r] = _.useState(!1);
   _.useEffect(() => {
-    l(!0);
-    const g = setTimeout(() => l(!1), 600);
-    return () => clearTimeout(g);
+    r(!0);
+    const a = setTimeout(() => r(!1), 600);
+    return () => clearTimeout(a);
   }, [o]);
-  async function M() {
+  async function T() {
     await $({
-      productId: r.id,
+      productId: d.id,
       productVariantId: e.id,
       quantity: o
     });
   }
   function w() {
-    f(), M(), u("/checkout");
+    f(), T(), m("/checkout");
   }
-  function p(g) {
-    if (g >= 864e5) {
-      const S = Math.floor(g / 864e5);
+  function C(a) {
+    if (a >= 864e5) {
+      const S = Math.floor(a / 864e5);
       return `${S} ${S === 1 ? "day" : "days"}`;
-    } else if (g >= 36e5) {
-      const S = Math.floor(g / 36e5);
+    } else if (a >= 36e5) {
+      const S = Math.floor(a / 36e5);
       return `${S} ${S === 1 ? "hour" : "hours"}`;
-    } else if (g >= 6e4) {
-      const S = Math.floor(g / 6e4);
+    } else if (a >= 6e4) {
+      const S = Math.floor(a / 6e4);
       return `${S} ${S === 1 ? "minute" : "minutes"}`;
     } else {
-      const S = Math.floor(g / 1e3);
+      const S = Math.floor(a / 1e3);
       return `${S} ${S === 1 ? "second" : "seconds"}`;
     }
   }
   return _.useEffect(() => {
-    (e.quantity.available === 0 || !e.quantity.available) && d(0);
+    (e.quantity.available === 0 || !e.quantity.available) && u(0);
   }, [e.quantity.available]), /* @__PURE__ */ t.jsxs("div", { className: k.options, children: [
-    e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: k.chargeTypes, children: e.chargeTypes.map((g) => /* @__PURE__ */ t.jsx(
+    e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: k.chargeTypes, children: e.chargeTypes.map((a) => /* @__PURE__ */ t.jsx(
       "div",
       {
         className: Y(k.charge, {
-          [k.chargeActive]: n === g
+          [k.chargeActive]: n === a
         }),
-        onClick: () => h(g),
-        children: It[g]
+        onClick: () => p(a),
+        children: It[a]
       },
-      g
+      a
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: k.variants, children: i.map((g) => {
-      var v;
+    /* @__PURE__ */ t.jsx("div", { className: k.variants, children: i.map((a) => {
+      var b;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
           className: Y(k.variant, {
-            [k.activeVariant]: e.id === g.id
+            [k.activeVariant]: e.id === a.id
           }),
-          onClick: () => s(g),
+          onClick: () => s(a),
           children: [
             /* @__PURE__ */ t.jsxs("div", { className: k.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: k.title, children: g.name }),
+              /* @__PURE__ */ t.jsx("span", { className: k.title, children: a.name }),
               /* @__PURE__ */ t.jsxs("span", { children: [
                 "$",
-                n === "ONE_TIME" ? g.price.amount : g.subscriptionSettings ? g.subscriptionSettings.price.amount : "Price Not Found"
+                n === "ONE_TIME" ? a.price.amount : a.subscriptionSettings ? a.subscriptionSettings.price.amount : "Price Not Found"
               ] })
             ] }),
             /* @__PURE__ */ t.jsx("div", { children: n === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: k.stock, children: [
-              ((v = g.quantity.restrictions) == null ? void 0 : v.max) || g.quantity.available || 0,
+              ((b = a.quantity.restrictions) == null ? void 0 : b.max) || a.quantity.available || 0,
               " in stock"
             ] }) })
           ]
         },
-        g.id
+        a.id
       );
     }) }),
     n === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: k.quantity, children: [
@@ -1486,11 +1505,11 @@ const ni = (r) => {
         {
           type: "Secondary",
           onClick: () => {
-            o > 1 ? d((g) => g - 1) : d(1);
+            o > 1 ? u((a) => a - 1) : u(1);
           },
           className: k.button,
           disabled: e.quantity.available === 0 || e.quantity.restrictions && o <= e.quantity.restrictions.min || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
-          children: /* @__PURE__ */ t.jsx(x, { name: "Minus" })
+          children: /* @__PURE__ */ t.jsx(g, { name: "Minus" })
         }
       ),
       /* @__PURE__ */ t.jsx(
@@ -1498,8 +1517,8 @@ const ni = (r) => {
         {
           type: "number",
           value: String(o),
-          onChange: (g) => d(Number(g)),
-          max: ((I = e.quantity.restrictions) == null ? void 0 : I.max) || e.quantity.available || 1 / 0,
+          onChange: (a) => u(Number(a)),
+          max: ((x = e.quantity.restrictions) == null ? void 0 : x.max) || e.quantity.available || 1 / 0,
           min: ((B = e.quantity.restrictions) == null ? void 0 : B.min) || 0,
           centered: !0,
           disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available
@@ -1510,11 +1529,11 @@ const ni = (r) => {
         {
           type: "Secondary",
           onClick: () => {
-            d((g) => g + 1);
+            u((a) => a + 1);
           },
           className: k.button,
           disabled: !!(e.quantity.restrictions && o >= e.quantity.restrictions.max || e.quantity.available !== void 0 && o >= e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available),
-          children: /* @__PURE__ */ t.jsx(x, { name: "Plus" })
+          children: /* @__PURE__ */ t.jsx(g, { name: "Plus" })
         }
       )
     ] }),
@@ -1523,7 +1542,7 @@ const ni = (r) => {
         /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
         /* @__PURE__ */ t.jsxs("div", { className: k.infoRight, children: [
           /* @__PURE__ */ t.jsx(
-            x,
+            g,
             {
               name: "Lightning",
               fill: "#FF3F19",
@@ -1531,13 +1550,13 @@ const ni = (r) => {
               height: 20
             }
           ),
-          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : p(e.deliveryTime) })
+          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : C(e.deliveryTime) })
         ] })
       ] }),
       /* @__PURE__ */ t.jsxs("div", { className: k.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Price" }),
         /* @__PURE__ */ t.jsx("div", { className: k.infoRight, children: n === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: k.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: c }), children: [
+          /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: l }), children: [
             "$ ",
             (e.price.amount || 0) * o
           ] }),
@@ -1545,11 +1564,11 @@ const ni = (r) => {
             "$ ",
             (e.compareAtPrice.amount || 0) * o
           ] })
-        ] }) : /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: c }), children: [
+        ] }) : /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: l }), children: [
           "$ ",
           (e.price.amount || 0) * o
         ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: k.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: c }), children: [
+          /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: l }), children: [
             "$ ",
             e.subscriptionSettings.price.amount || 0
           ] }),
@@ -1557,7 +1576,7 @@ const ni = (r) => {
             "$ ",
             e.subscriptionSettings.compareAtPrice.amount || 0
           ] })
-        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: c }), children: [
+        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: Y(k.newPrice, { [k.animate]: l }), children: [
           "$ ",
           e.subscriptionSettings.price.amount || 0
         ] }) })
@@ -1577,14 +1596,14 @@ const ni = (r) => {
         G,
         {
           type: "Secondary",
-          onClick: () => M(),
+          onClick: () => T(),
           disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
           children: "Add to Cart"
         }
       )
     ] })
   ] });
-}, Es = "_button_1tdo3_1", zs = "_login_1tdo3_14", Rs = "_signUp_1tdo3_18", Ls = "_buttons_1tdo3_23", Ds = "_modal_1tdo3_32", Hs = "_closing_1tdo3_64", Us = "_info_1tdo3_113", Fs = "_top_1tdo3_120", Vs = "_title_1tdo3_131", Ys = "_clear_1tdo3_138", Gs = "_activeClear_1tdo3_145", Ws = "_count_1tdo3_149", Js = "_cart_1tdo3_164", Xs = "_empty_1tdo3_172", Ks = "_product_1tdo3_198", Qs = "_products_1tdo3_207", Zs = "_image_1tdo3_215", tn = "_productInfo_1tdo3_221", en = "_content_1tdo3_228", sn = "_name_1tdo3_234", nn = "_price_1tdo3_240", on = "_productButtons_1tdo3_246", an = "_productButton_1tdo3_246", cn = "_productCount_1tdo3_266", ln = "_bottom_1tdo3_282", rn = "_subtotal_1tdo3_290", dn = "_block_1tdo3_298", un = "_shoppingCount_1tdo3_305", mn = "_total_1tdo3_325", hn = "_link_1tdo3_331", pn = "_userInfo_1tdo3_338", _n = "_pagesMobileModal_1tdo3_349", gn = "_pagesMobileModalContent_1tdo3_363", xn = "_pagesMobileModalHeader_1tdo3_369", fn = "_pagesMobileModalFooter_1tdo3_379", y = {
+}, Es = "_button_1tdo3_1", zs = "_login_1tdo3_14", Rs = "_signUp_1tdo3_18", Ls = "_buttons_1tdo3_23", Ds = "_modal_1tdo3_32", Hs = "_closing_1tdo3_64", Us = "_info_1tdo3_113", Fs = "_top_1tdo3_120", Vs = "_title_1tdo3_131", Ys = "_clear_1tdo3_138", Gs = "_activeClear_1tdo3_145", Ws = "_count_1tdo3_149", Js = "_cart_1tdo3_164", Xs = "_empty_1tdo3_172", Qs = "_product_1tdo3_198", Ks = "_products_1tdo3_207", Zs = "_image_1tdo3_215", tn = "_productInfo_1tdo3_221", en = "_content_1tdo3_228", sn = "_name_1tdo3_234", nn = "_price_1tdo3_240", on = "_productButtons_1tdo3_246", an = "_productButton_1tdo3_246", cn = "_productCount_1tdo3_266", ln = "_bottom_1tdo3_282", rn = "_subtotal_1tdo3_290", dn = "_block_1tdo3_298", un = "_shoppingCount_1tdo3_305", mn = "_total_1tdo3_325", hn = "_link_1tdo3_331", pn = "_userInfo_1tdo3_338", _n = "_pagesMobileModal_1tdo3_349", gn = "_pagesMobileModalContent_1tdo3_363", xn = "_pagesMobileModalHeader_1tdo3_369", fn = "_pagesMobileModalFooter_1tdo3_379", y = {
   button: Es,
   login: zs,
   signUp: Rs,
@@ -1603,8 +1622,8 @@ const ni = (r) => {
   count: Ws,
   cart: Js,
   empty: Xs,
-  product: Ks,
-  products: Qs,
+  product: Qs,
+  products: Ks,
   image: Zs,
   productInfo: tn,
   content: en,
@@ -1624,19 +1643,19 @@ const ni = (r) => {
   pagesMobileModalContent: gn,
   pagesMobileModalHeader: xn,
   pagesMobileModalFooter: fn
-}, ii = (r) => {
-  const { shopping: i, signUp: e, isShowUserInfo: s = !0 } = r;
+}, ii = (d) => {
+  const { shopping: i, signUp: e, isShowUserInfo: s = !0 } = d;
   return /* @__PURE__ */ t.jsxs("div", { className: y.buttons, children: [
     i && /* @__PURE__ */ t.jsx(bn, {}),
     s && /* @__PURE__ */ t.jsx(Ct, { signUp: e })
   ] });
 }, bn = () => {
-  const [r, i] = _.useState(!1), [e, s] = _.useState([]), { cart: n } = jt();
-  function h(f) {
+  const [d, i] = _.useState(!1), [e, s] = _.useState([]), { cart: n } = jt();
+  function p(f) {
     var $;
-    return !f || !(f != null && f.variants) ? !1 : ($ = f.variants.find((c) => c.id === f.activeVariantId)) == null ? void 0 : $.subscriptionSettings;
+    return !f || !(f != null && f.variants) ? !1 : ($ = f.variants.find((l) => l.id === f.activeVariantId)) == null ? void 0 : $.subscriptionSettings;
   }
-  const u = n.parts.length > 0 && e.length > 0 && !h(e[0]), [o, d] = _.useState(!1);
+  const m = n.parts.length > 0 && e.length > 0 && !p(e[0]), [o, u] = _.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsxs(
       G,
@@ -1646,25 +1665,25 @@ const ni = (r) => {
           padding: 10
         },
         onClick: (f) => {
-          f.stopPropagation(), window.location.pathname.includes("/admin/builder") || (i(!0), d(!0));
+          f.stopPropagation(), window.location.pathname.includes("/admin/builder") || (i(!0), u(!0));
         },
         children: [
           /* @__PURE__ */ t.jsx(
-            x,
+            g,
             {
               name: "Handbag",
               fill: "var(--icon-primary)"
             }
           ),
-          u && /* @__PURE__ */ t.jsx("div", { className: y.shoppingCount, children: n.parts.length })
+          m && /* @__PURE__ */ t.jsx("div", { className: y.shoppingCount, children: n.parts.length })
         ]
       }
     ),
-    r && /* @__PURE__ */ t.jsx(
+    d && /* @__PURE__ */ t.jsx(
       vt,
       {
         close: () => {
-          d(!1), setTimeout(() => {
+          u(!1), setTimeout(() => {
             i(!1);
           }, 300);
         },
@@ -1673,30 +1692,30 @@ const ni = (r) => {
           jn,
           {
             activeProducts: e,
-            isCartNotEmpty: u,
+            isCartNotEmpty: m,
             isOpen: o
           }
         )
       }
     )
   ] });
-}, jn = (r) => {
-  const { activeProducts: i, isCartNotEmpty: e, isOpen: s } = r, { cart: n, reset: h, getTotalAndDiscount: u, updateQuantityOfProduct: o } = jt(), d = lt();
-  function f(l) {
-    d(l);
+}, jn = (d) => {
+  const { activeProducts: i, isCartNotEmpty: e, isOpen: s } = d, { cart: n, reset: p, getTotalAndDiscount: m, updateQuantityOfProduct: o } = jt(), u = lt();
+  function f(r) {
+    u(r);
   }
-  function $(l) {
+  function $(r) {
     o({
-      productId: l.id,
-      productVariantId: l.activeVariantId,
-      quantity: l.quantity + 1
+      productId: r.id,
+      productVariantId: r.activeVariantId,
+      quantity: r.quantity + 1
     });
   }
-  function c(l) {
+  function l(r) {
     o({
-      productId: l.id,
-      productVariantId: l.activeVariantId,
-      quantity: l.quantity - 1
+      productId: r.id,
+      productVariantId: r.activeVariantId,
+      quantity: r.quantity - 1
     });
   }
   return /* @__PURE__ */ t.jsxs(
@@ -1705,7 +1724,7 @@ const ni = (r) => {
       className: Y(y.modal, {
         [y.closing]: !s
       }),
-      onClick: (l) => l.stopPropagation(),
+      onClick: (r) => r.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: y.top, children: [
           /* @__PURE__ */ t.jsxs("div", { className: y.info, children: [
@@ -1719,13 +1738,13 @@ const ni = (r) => {
                 [y.activeClear]: e
               }),
               disabled: !e,
-              onClick: h,
+              onClick: p,
               children: "Clear all"
             }
           )
         ] }),
         e ? /* @__PURE__ */ t.jsxs("div", { className: y.cart, children: [
-          /* @__PURE__ */ t.jsx("div", { className: y.products, children: i.map((l) => /* @__PURE__ */ t.jsxs(
+          /* @__PURE__ */ t.jsx("div", { className: y.products, children: i.map((r) => /* @__PURE__ */ t.jsxs(
             "div",
             {
               className: y.product,
@@ -1734,7 +1753,7 @@ const ni = (r) => {
                   /* @__PURE__ */ t.jsx(
                     "img",
                     {
-                      src: `https://imagedelivery.net/${l.images[0].cfId}/w=500`,
+                      src: `https://imagedelivery.net/${r.images[0].cfId}/w=500`,
                       alt: "image",
                       width: "100%",
                       height: "100%",
@@ -1742,10 +1761,10 @@ const ni = (r) => {
                     }
                   ),
                   /* @__PURE__ */ t.jsxs("div", { className: y.content, children: [
-                    /* @__PURE__ */ t.jsx("div", { className: y.name, children: l.name }),
+                    /* @__PURE__ */ t.jsx("div", { className: y.name, children: r.name }),
                     /* @__PURE__ */ t.jsxs("div", { className: y.price, children: [
                       "$",
-                      l.variants.find((M) => M.id === l.activeVariantId).price.amount * ((l == null ? void 0 : l.quantity) || 1)
+                      r.variants.find((T) => T.id === r.activeVariantId).price.amount * ((r == null ? void 0 : r.quantity) || 1)
                     ] })
                   ] })
                 ] }),
@@ -1754,11 +1773,11 @@ const ni = (r) => {
                     "div",
                     {
                       onClick: () => {
-                        l.quantity !== 1 && c(l);
+                        r.quantity !== 1 && l(r);
                       },
                       className: y.productButton,
                       children: /* @__PURE__ */ t.jsx(
-                        x,
+                        g,
                         {
                           name: "Minus",
                           fill: "#757575",
@@ -1768,14 +1787,14 @@ const ni = (r) => {
                       )
                     }
                   ),
-                  /* @__PURE__ */ t.jsx("div", { className: y.productCount, children: l.quantity }),
+                  /* @__PURE__ */ t.jsx("div", { className: y.productCount, children: r.quantity }),
                   /* @__PURE__ */ t.jsx(
                     "div",
                     {
-                      onClick: () => $(l),
+                      onClick: () => $(r),
                       className: y.productButton,
                       children: /* @__PURE__ */ t.jsx(
-                        x,
+                        g,
                         {
                           name: "Plus",
                           fill: "#757575",
@@ -1788,14 +1807,14 @@ const ni = (r) => {
                 ] })
               ]
             },
-            l.id
+            r.id
           )) }),
           /* @__PURE__ */ t.jsxs("div", { className: y.bottom, children: [
             /* @__PURE__ */ t.jsxs("div", { className: y.subtotal, children: [
               /* @__PURE__ */ t.jsxs("div", { className: y.block, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
                 /* @__PURE__ */ t.jsx(
-                  x,
+                  g,
                   {
                     name: "Info",
                     width: 20,
@@ -1806,7 +1825,7 @@ const ni = (r) => {
               ] }),
               /* @__PURE__ */ t.jsxs("div", { className: y.total, children: [
                 "$",
-                u().total
+                m().total
               ] })
             ] }),
             /* @__PURE__ */ t.jsx(G, { onClick: () => f("/checkout"), children: "Checkout" })
@@ -1817,7 +1836,7 @@ const ni = (r) => {
   );
 }, vn = () => /* @__PURE__ */ t.jsxs("div", { className: y.empty, children: [
   /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-    x,
+    g,
     {
       name: "Handbag",
       fill: "var(--icon-secondary)"
@@ -1836,7 +1855,7 @@ const ni = (r) => {
       }
     )
   ] })
-] }), Ct = ({ signUp: r }) => {
+] }), Ct = ({ signUp: d }) => {
   const i = JSON.parse(localStorage.getItem("token") || "{}"), { data: e } = i, s = lt();
   function n(o) {
     window.location.pathname.includes("/admin/builder") || s(o);
@@ -1854,7 +1873,7 @@ const ni = (r) => {
           children: "Login"
         }
       ),
-      r && /* @__PURE__ */ t.jsx(
+      d && /* @__PURE__ */ t.jsx(
         G,
         {
           onClick: () => n("/customer-dash"),
@@ -1867,27 +1886,27 @@ const ni = (r) => {
         }
       )
     ] });
-  const [h, u] = _.useState("test-email@gmail.com");
+  const [p, m] = _.useState("test-email@gmail.com");
   return _.useEffect(() => {
     (async () => {
-      const d = Tt(e);
-      u(d.email);
+      const u = Tt(e);
+      m(u.email);
     })();
   }, [e]), /* @__PURE__ */ t.jsx(
     "div",
     {
       className: y.userInfo,
       onClick: () => n("/customer-dash"),
-      children: /* @__PURE__ */ t.jsx("div", { children: h || "test-email@gmail.com" })
+      children: /* @__PURE__ */ t.jsx("div", { children: p || "test-email@gmail.com" })
     }
   );
 }, yn = ({
-  children: r,
+  children: d,
   logo: i,
   setIsOpen: e,
   signUp: s
 }) => {
-  const { setIsOpen: n } = Nt(), h = () => {
+  const { setIsOpen: n } = Nt(), p = () => {
     n(!1), setTimeout(() => {
       e(!1), n(!0);
     }, 300);
@@ -1896,7 +1915,7 @@ const ni = (r) => {
     "div",
     {
       className: y.pagesMobileModal,
-      onClick: (u) => u.stopPropagation(),
+      onClick: (m) => m.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: y.pagesMobileModalHeader, children: [
           /* @__PURE__ */ t.jsx("div", { children: i }),
@@ -1904,9 +1923,9 @@ const ni = (r) => {
             G,
             {
               type: "Secondary",
-              onClick: h,
+              onClick: p,
               children: /* @__PURE__ */ t.jsx(
-                x,
+                g,
                 {
                   name: "X",
                   fill: "var(--icon-primary)"
@@ -1915,13 +1934,13 @@ const ni = (r) => {
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: y.pagesMobileModalContent, children: r }),
+        /* @__PURE__ */ t.jsx("div", { className: y.pagesMobileModalContent, children: d }),
         /* @__PURE__ */ t.jsx("div", { className: y.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(Ct, { signUp: s }) })
       ]
     }
   );
 }, oi = ({
-  children: r,
+  children: d,
   logo: i,
   signUp: e
 }) => {
@@ -1934,12 +1953,12 @@ const ni = (r) => {
         logo: i,
         setIsOpen: n,
         signUp: e,
-        children: r
+        children: d
       }
     ) })
   ] });
-}, Nn = (r) => {
-  const { setIsOpenModal: i } = r;
+}, Nn = (d) => {
+  const { setIsOpenModal: i } = d;
   return /* @__PURE__ */ t.jsx(
     G,
     {
@@ -1951,7 +1970,7 @@ const ni = (r) => {
         e.stopPropagation(), i(!0);
       },
       children: /* @__PURE__ */ t.jsx(
-        x,
+        g,
         {
           name: "List",
           fill: "var(--icon-primary)"
@@ -1972,7 +1991,7 @@ const ni = (r) => {
   copyTextMobile: Tn,
   copyTextMiniMobile: qn
 }, ai = () => {
-  const { isOpenModal: r, setIsOpenModal: i } = kt();
+  const { isOpenModal: d, setIsOpenModal: i } = kt();
   function e() {
     i(!0);
   }
@@ -1986,7 +2005,7 @@ const ni = (r) => {
         },
         type: "Secondary",
         children: /* @__PURE__ */ t.jsx(
-          x,
+          g,
           {
             name: "Share",
             fill: "#757575",
@@ -1995,38 +2014,38 @@ const ni = (r) => {
         )
       }
     ),
-    r && /* @__PURE__ */ t.jsx(vt, { close: i, children: /* @__PURE__ */ t.jsx(An, {}) })
+    d && /* @__PURE__ */ t.jsx(vt, { close: i, children: /* @__PURE__ */ t.jsx(An, {}) })
   ] });
 }, An = () => {
-  const { setIsOpenModal: r } = kt(), { notification: i, setNotification: e } = qt(), { setIsOpen: s } = Nt(), n = window.location.href;
-  function h() {
+  const { setIsOpenModal: d } = kt(), { notification: i, setNotification: e } = qt(), { setIsOpen: s } = Nt(), n = window.location.href;
+  function p() {
     navigator.clipboard.writeText(n), e({
       message: "Link copied to clipboard",
       status: "success"
     });
   }
-  function u() {
+  function m() {
     s(!1), setTimeout(() => {
-      r(!1), s(!0);
+      d(!1), s(!0);
     }, 300);
   }
-  function o(d, f) {
-    return d.length > f ? d.slice(0, f) + "..." : d;
+  function o(u, f) {
+    return u.length > f ? u.slice(0, f) + "..." : u;
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: Z.modal,
-      onClick: (d) => d.stopPropagation(),
+      onClick: (u) => u.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: Z.header, children: [
           /* @__PURE__ */ t.jsx("div", { className: Z.title, children: "Copy Product Link" }),
           /* @__PURE__ */ t.jsx(
-            x,
+            g,
             {
               name: "X",
               fill: "#757575",
-              onClick: u,
+              onClick: m,
               hoverable: !0
             }
           )
@@ -2036,7 +2055,7 @@ const ni = (r) => {
             tt,
             {
               type: "Secondary",
-              onClick: h,
+              onClick: p,
               style: {
                 flex: 1
               },
@@ -2051,8 +2070,8 @@ const ni = (r) => {
             tt,
             {
               type: "Secondary",
-              onClick: h,
-              children: i ? /* @__PURE__ */ t.jsx(x, { name: "Check" }) : /* @__PURE__ */ t.jsx(x, { name: "Copy" })
+              onClick: p,
+              children: i ? /* @__PURE__ */ t.jsx(g, { name: "Check" }) : /* @__PURE__ */ t.jsx(g, { name: "Copy" })
             }
           )
         ] })
@@ -2065,21 +2084,21 @@ const ni = (r) => {
   icon: zn,
   open: Rn,
   content: Ln
-}, ci = ({ title: r, content: i, defaultOpen: e = !1 }) => {
-  const [s, n] = _.useState(e), [h, u] = _.useState(0), o = _.useRef(null), d = () => {
+}, ci = ({ title: d, content: i, defaultOpen: e = !1 }) => {
+  const [s, n] = _.useState(e), [p, m] = _.useState(0), o = _.useRef(null), u = () => {
     n(!s);
   };
   return _.useEffect(() => {
-    o.current && u(s ? o.current.scrollHeight : 0);
+    o.current && m(s ? o.current.scrollHeight : 0);
   }, [s]), /* @__PURE__ */ t.jsxs("div", { className: nt.accordion, children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
         className: nt.header,
-        onClick: d,
+        onClick: u,
         children: [
-          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: r }),
-          /* @__PURE__ */ t.jsx("div", { className: Y(nt.icon, { [nt.open]: s }), children: /* @__PURE__ */ t.jsx(x, { name: "CaretDown" }) })
+          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: d }),
+          /* @__PURE__ */ t.jsx("div", { className: Y(nt.icon, { [nt.open]: s }), children: /* @__PURE__ */ t.jsx(g, { name: "CaretDown" }) })
         ]
       }
     ),
@@ -2088,12 +2107,12 @@ const ni = (r) => {
       {
         ref: o,
         className: nt.content,
-        style: { height: `${h}px` },
+        style: { height: `${p}px` },
         children: /* @__PURE__ */ t.jsx("p", { id: "p", children: i })
       }
     )
   ] });
-}, li = ({ children: r, path: i, className: e, target: s = "_self", id: n }) => {
+}, li = ({ children: d, path: i, className: e, target: s = "_self", id: n }) => {
   if (window.location.pathname.includes("/admin/builder"))
     return /* @__PURE__ */ t.jsx(
       "div",
@@ -2102,11 +2121,11 @@ const ni = (r) => {
         role: "link",
         style: { cursor: "pointer" },
         id: n,
-        children: r
+        children: d
       }
     );
-  const h = lt(), u = /^https?:\/\//.test(i), o = (d) => {
-    u || s === "_blank" ? s === "_blank" ? window.open(i, "_blank") : window.location.href = i : (d.preventDefault(), h(i, { replace: !0 }));
+  const p = lt(), m = /^https?:\/\//.test(i), o = (u) => {
+    m || s === "_blank" ? s === "_blank" ? window.open(i, "_blank") : window.location.href = i : (u.preventDefault(), p(i, { replace: !0 }));
   };
   return /* @__PURE__ */ t.jsx(
     "div",
@@ -2116,7 +2135,7 @@ const ni = (r) => {
       role: "link",
       style: { cursor: "pointer" },
       id: n,
-      children: r
+      children: d
     }
   );
 }, Dn = "_buttonsBlock_1b2rb_1", Hn = "_slideUp_1b2rb_1", Un = {
@@ -2139,17 +2158,17 @@ const ni = (r) => {
   label: Vn,
   textarea: Yn,
   length: Gn
-}, di = (r) => {
+}, di = (d) => {
   const {
     onChange: i,
     label: e,
     value: s,
     maxLength: n,
-    placeholder: h = "Type something...",
-    type: u = "text"
-  } = r, [o, d] = _.useState(s.length);
+    placeholder: p = "Type something...",
+    type: m = "text"
+  } = d, [o, u] = _.useState(s.length);
   function f($) {
-    return u === "number" ? $.replace(/[^\d\n]+/g, "") : $;
+    return m === "number" ? $.replace(/[^\d\n]+/g, "") : $;
   }
   return /* @__PURE__ */ t.jsxs("div", { className: ct.wrapper, children: [
     e && /* @__PURE__ */ t.jsx(
@@ -2166,10 +2185,10 @@ const ni = (r) => {
         id: e,
         value: s,
         onChange: ($) => {
-          const c = f($.target.value);
-          d(c.length), i(c);
+          const l = f($.target.value);
+          u(l.length), i(l);
         },
-        placeholder: h,
+        placeholder: p,
         className: ct.textarea,
         maxLength: n
       }
@@ -2187,17 +2206,17 @@ export {
   G as Button,
   ms as ButtonTypeSettings,
   ei as ButtonsSettings,
-  Qn as CategorySettings,
+  Kn as CategorySettings,
   wt as ChooseImage,
   hi as ChooseImageModal,
   vn as EmptyCart,
   ti as FormSettings,
   ii as HeaderButtons,
-  x as Icon,
+  g as Icon,
   dt as InputSettings,
   Mt as InputUI,
   pi as ItemsSettings,
-  Kn as LayoutSettings,
+  Qn as LayoutSettings,
   li as Link,
   si as ListingSelector,
   _i as Loader,