@billgangcom/theme-lib 1.52.1 → 1.52.3

package/dist/ui.es.js

@@ -1,8 +1,8 @@
-import { j as t, I as b, c as V, a as rt, S as it, R as vt, B as tt, O as dt, b as ot, u as ut, d as mt, P as ht, D as pt, e as _t, v as gt, f as ft, C as xt, g as U, h as Ct, i as nt, k as St, l as wt, m as $t, n as lt, o as F, L as Bt, p as ct, q as bt, r as Y, t as Pt, M as jt, w as yt, x as Mt, y as Nt, z as Tt } from "./index-B2Rk8_zm.js";
-import { H as mi, E as hi, G as pi, A as _i, T as gi, F as fi } from "./index-B2Rk8_zm.js";
+import { j as t, I as b, c as V, a as rt, S as it, R as vt, B as tt, O as dt, b as ot, u as ut, d as mt, P as ht, D as pt, e as _t, v as gt, f as ft, C as xt, g as U, h as Ct, i as nt, k as St, l as wt, m as $t, n as lt, o as F, L as Bt, p as ct, q as bt, r as Y, t as Pt, M as jt, w as yt, x as Mt, y as Nt, z as Tt } from "./index-hseNJ-Jo.js";
+import { H as mi, E as hi, G as pi, A as _i, T as gi, F as fi } from "./index-hseNJ-Jo.js";
 import f from "react";
 import "@phosphor-icons/react";
-const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1ibay_15", Et = "_subtitle_1ibay_22", zt = "_alignmentContent_1ibay_29", Rt = "_alignments_1ibay_37", Dt = "_alignment_1ibay_8", Lt = "_circle_1ibay_60", Ht = "_paddings_1ibay_67", Ut = "_padding_1ibay_67", Ft = "_active_1ibay_91", Vt = "_input_1ibay_98", W = {
+const qt = "_wrapper_1vmyb_2", At = "_alignmentBlock_1vmyb_8", Ot = "_title_1vmyb_15", Et = "_subtitle_1vmyb_22", zt = "_alignmentContent_1vmyb_29", Rt = "_alignments_1vmyb_37", Dt = "_alignment_1vmyb_8", Lt = "_circle_1vmyb_60", Ht = "_paddings_1vmyb_67", Ut = "_padding_1vmyb_67", Ft = "_active_1vmyb_91", Vt = "_input_1vmyb_98", W = {
   wrapper: qt,
   alignmentBlock: At,
   title: Ot,
@@ -25,10 +25,10 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
   "bottomLeft",
   "bottom",
   "bottomRight"
-], Wt = ["left", "top", "right", "bottom"], Xn = (r) => {
-  const { alignment: o, padding: e, setPadding: s, setAlignment: n } = r;
-  function g(d) {
-    switch (d) {
+], Wt = ["left", "top", "right", "bottom"], Xn = (d) => {
+  const { alignment: o, padding: e, setPadding: s, setAlignment: n } = d;
+  function g(l) {
+    switch (l) {
       case "left":
       case "topLeft":
       case "bottomLeft":
@@ -45,8 +45,8 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
         return "TextAlignCenter";
     }
   }
-  function h(d) {
-    switch (d) {
+  function h(l) {
+    switch (l) {
       case "left":
         return "AlignLeft";
       case "right":
@@ -57,28 +57,28 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
         return "AlignBottom";
     }
   }
-  const [c, p] = f.useState(null), [I, O] = f.useState(null);
+  const [c, _] = f.useState(null), [k, M] = 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: Yt.map((d) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: W.alignments, children: Yt.map((l) => /* @__PURE__ */ t.jsxs(
           "div",
           {
             onClick: () => {
-              n(d);
+              n(l);
             },
             className: W.alignment,
             onMouseEnter: () => {
-              p(d);
+              _(l);
             },
             onMouseLeave: () => {
-              p(null);
+              _(null);
             },
             children: [
-              d !== o && c !== d && /* @__PURE__ */ t.jsx("div", { className: W.circle }),
-              d !== o && c === d && /* @__PURE__ */ t.jsx(
+              l !== o && c !== l && /* @__PURE__ */ t.jsx("div", { className: W.circle }),
+              l !== o && c === l && /* @__PURE__ */ t.jsx(
                 b,
                 {
                   name: g(c),
@@ -87,7 +87,7 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
                   height: 22
                 }
               ),
-              d === o && /* @__PURE__ */ t.jsx(
+              l === o && /* @__PURE__ */ t.jsx(
                 b,
                 {
                   name: g(o),
@@ -98,25 +98,25 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
               )
             ]
           },
-          d
+          l
         )) }),
-        /* @__PURE__ */ t.jsx("div", { className: W.paddings, children: Wt.map((d) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: W.paddings, children: Wt.map((l) => /* @__PURE__ */ t.jsxs(
           "label",
           {
             className: V(W.padding, {
-              [W.active]: I === d
+              [W.active]: k === l
             }),
             onFocus: () => {
-              O(d);
+              M(l);
             },
             onBlur: () => {
-              O(null);
+              M(null);
             },
             children: [
               /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
                 b,
                 {
-                  name: h(d),
+                  name: h(l),
                   width: 20,
                   height: 20
                 }
@@ -125,18 +125,19 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
                 rt,
                 {
                   type: "number",
-                  value: String(e[d]),
+                  value: String(e[l]),
                   onChange: (i) => s({
                     ...e,
-                    [d]: Number(i)
+                    [l]: Math.min(Number(i), 999)
                   }),
+                  max: 999,
                   paddingless: !0,
                   borderless: !0
                 }
               )
             ]
           },
-          d
+          l
         )) })
       ] })
     ] })
@@ -165,7 +166,7 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
   modalOptions: pe,
   addButton: _e,
   deleteButton: ge
-}, Jn = (r) => {
+}, Jn = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -174,18 +175,18 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
     other: g,
     title: h,
     subtitle: c,
-    draggable: p = !1,
-    withImage: I = !1,
-    addable: O = !0,
-    itemsOptions: d,
+    draggable: _ = !1,
+    withImage: k = !1,
+    addable: M = !0,
+    itemsOptions: l,
     hasRangeSelector: i = !1,
     rangeSelectorOptions: x,
     limit: v,
-    autoScrollInterval: _,
+    autoScrollInterval: p,
     deletable: y
-  } = r;
+  } = d;
   function w(a) {
-    if (I)
+    if (k)
       return a ? /* @__PURE__ */ t.jsx(
         "img",
         {
@@ -205,10 +206,10 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
       );
   }
   const L = (a, $ = !1) => {
-    const T = d.find((E) => E.id === a);
-    if (!T) return;
+    const q = l.find((E) => E.id === a);
+    if (!q) return;
     const Q = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+      _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -221,14 +222,14 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
         ot,
         {
           onChange: (E) => {
-            const u = [...s], C = d.find((j) => j.name === E);
+            const u = [...s], C = l.find((j) => j.name === E);
             if (!C) return;
-            const M = C.id, l = u.map((j) => j === a ? M : j);
-            n([...l]);
+            const T = C.id, r = u.map((j) => j === a ? T : j);
+            n([...r]);
           },
-          value: T.name,
-          options: d.filter((E) => !s.find((u) => u === E.id)).map((E) => E.name),
-          leftAddon: w(T.images)
+          value: q.name,
+          options: l.filter((E) => !s.find((u) => u === E.id)).map((E) => E.name),
+          leftAddon: w(q.images)
         }
       ),
       $ && /* @__PURE__ */ t.jsx("div", { className: G.buttons, children: /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
@@ -267,7 +268,7 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
     /* @__PURE__ */ t.jsxs("div", { className: G.products, children: [
       c && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: c }),
       s.map((a) => L(a, y)),
-      O && /* @__PURE__ */ t.jsx(
+      M && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -281,21 +282,21 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
             {
               withoutHover: !0,
               className: V(G.button, {
-                [G.disabled]: !!(v && v <= s.length || s.length === d.length)
+                [G.disabled]: !!(v && v <= s.length || s.length === l.length)
               }),
               size: "s",
-              disabled: !!(v && v <= s.length || s.length === d.length),
+              disabled: !!(v && v <= s.length || s.length === l.length),
               onClick: () => {
                 const a = [...s];
                 let $ = null;
-                if (d) {
-                  for (let T = 0; T < d.length; T++)
-                    if (!s.find((Q) => Q === d[T].id)) {
-                      $ = d[T];
+                if (l) {
+                  for (let q = 0; q < l.length; q++)
+                    if (!s.find((Q) => Q === l[q].id)) {
+                      $ = l[q];
                       break;
                     }
                 }
-                a.push(($ == null ? void 0 : $.id) || d[0].id), n(a);
+                a.push(($ == null ? void 0 : $.id) || l[0].id), n(a);
               },
               style: {
                 width: "fit-content"
@@ -317,13 +318,13 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
       )
     ] }),
     g !== void 0 && /* @__PURE__ */ t.jsx(dt, { items: g }),
-    _ !== void 0 && /* @__PURE__ */ t.jsx(
+    p !== void 0 && /* @__PURE__ */ t.jsx(
       rt,
       {
         label: "Auto scroll interval",
         type: "number",
-        value: String(_.scrollInterval),
-        onChange: (a) => _.setScrollInterval(Number(a)),
+        value: String(p.scrollInterval),
+        onChange: (a) => p.setScrollInterval(Number(a)),
         min: 0.1,
         max: 100,
         style: {
@@ -359,7 +360,7 @@ const qt = "_wrapper_1ibay_2", At = "_alignmentBlock_1ibay_8", Ot = "_title_1iba
   deleteButton: Re,
   closeIcon: De
 };
-function Le({ product: r, children: o }) {
+function Le({ product: d, children: o }) {
   const {
     attributes: e,
     listeners: s,
@@ -368,8 +369,8 @@ function Le({ product: r, children: o }) {
     transition: h,
     isDragging: c
   } = ft({
-    id: r.id
-  }), p = {
+    id: d.id
+  }), _ = {
     transform: xt.Transform.toString(g),
     transition: h
   };
@@ -377,7 +378,7 @@ function Le({ product: r, children: o }) {
     "div",
     {
       ref: n,
-      style: p,
+      style: _,
       className: `${D.product} ${c ? D.dragging : ""}`,
       ...e,
       ...s,
@@ -385,7 +386,7 @@ function Le({ product: r, children: o }) {
     }
   );
 }
-const Kn = (r) => {
+const Kn = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -394,14 +395,14 @@ const Kn = (r) => {
     title: g,
     subtitle: h,
     editable: c = !0,
-    draggable: p = !1,
-    deletable: I = !0,
-    addable: O = !0,
-    itemsType: d,
+    draggable: _ = !1,
+    deletable: k = !0,
+    addable: M = !0,
+    itemsType: l,
     itemsOptions: i,
     addableOptions: x = {},
     limit: v
-  } = r, [_, y] = f.useState(null), [w, L] = f.useState(null), a = f.useRef(null), $ = ut(
+  } = d, [p, y] = f.useState(null), [w, L] = f.useState(null), a = f.useRef(null), $ = ut(
     mt(ht, {
       activationConstraint: {
         distance: 5
@@ -409,32 +410,32 @@ const Kn = (r) => {
     })
   );
   f.useEffect(() => {
-    if (_) {
-      const u = [...s].map((C) => C.id === _.id ? _ : C);
+    if (p) {
+      const u = [...s].map((C) => C.id === p.id ? p : C);
       n(u);
     }
-  }, [_]), f.useEffect(() => {
+  }, [p]), f.useEffect(() => {
     a.current && w && (a.current.getBoundingClientRect().height, w.top);
   }, [a.current, w]);
-  const T = (u, C) => {
+  const q = (u, C) => {
     u.stopPropagation();
-    const M = u.target.getBoundingClientRect();
+    const T = u.target.getBoundingClientRect();
     L({
-      top: M.top + window.scrollY,
-      left: M.left - 30
+      top: T.top + window.scrollY,
+      left: T.left - 30
     }), y(C);
   }, Q = (u) => {
-    const { active: C, over: M } = u;
-    if (M && C.id !== M.id) {
-      const l = s.findIndex((S) => S.id === C.id), j = s.findIndex((S) => S.id === M.id);
-      if (l !== -1 && j !== -1) {
-        const S = [...s], [R] = S.splice(l, 1);
+    const { active: C, over: T } = u;
+    if (T && C.id !== T.id) {
+      const r = s.findIndex((S) => S.id === C.id), j = s.findIndex((S) => S.id === T.id);
+      if (r !== -1 && j !== -1) {
+        const S = [...s], [R] = S.splice(r, 1);
         S.splice(j, 0, R), n(S);
       }
     }
   }, E = (u, C) => {
-    const M = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+    const T = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -443,27 +444,27 @@ const Kn = (r) => {
           height: 20
         }
       ) }),
-      d === "select" && i && /* @__PURE__ */ t.jsx(
+      l === "select" && i && /* @__PURE__ */ t.jsx(
         ot,
         {
-          onChange: (l) => {
-            const j = [...s], S = i.find((P) => P.name === l);
+          onChange: (r) => {
+            const j = [...s], S = i.find((P) => P.name === r);
             if (!S) return;
             const R = j.map((P) => P.id === u.id ? {
               ...S,
               name: {
-                "en-US": l
+                "en-US": r
               }
             } : P);
             y({
               ...u,
               name: {
-                "en-US": l
+                "en-US": r
               }
             }), n([...R]);
           },
           value: u.name,
-          options: i.filter((l) => !s.find((j) => j.name === l.name)).map((l) => l.name)
+          options: i.filter((r) => !s.find((j) => j.name === r.name)).map((r) => r.name)
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: D.buttons, children: [
@@ -474,10 +475,10 @@ const Kn = (r) => {
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (l) => T(l, u)
+            onClick: (r) => q(r, u)
           }
         ) }),
-        I && /* @__PURE__ */ t.jsx("div", { className: D.deleteButton, children: /* @__PURE__ */ t.jsx(
+        k && /* @__PURE__ */ t.jsx("div", { className: D.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Trash",
@@ -485,24 +486,24 @@ const Kn = (r) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => n(s.filter((l) => l.id !== u.id))
+            onClick: () => n(s.filter((r) => r.id !== u.id))
           }
         ) })
       ] })
     ] });
-    return p ? /* @__PURE__ */ t.jsx(
+    return _ ? /* @__PURE__ */ t.jsx(
       Le,
       {
         product: u,
         index: C,
-        children: M
+        children: T
       },
       u.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: D.product,
-        children: M
+        children: T
       },
       u.id
     );
@@ -520,7 +521,7 @@ const Kn = (r) => {
     ] }),
     /* @__PURE__ */ t.jsxs("div", { className: D.products, children: [
       h && /* @__PURE__ */ t.jsx("h5", { className: D.subtitle, children: h }),
-      p ? /* @__PURE__ */ t.jsx(
+      _ ? /* @__PURE__ */ t.jsx(
         pt,
         {
           sensors: $,
@@ -535,7 +536,7 @@ const Kn = (r) => {
           )
         }
       ) : s.map((u, C) => E(u, C)),
-      O && /* @__PURE__ */ t.jsx(
+      M && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -556,13 +557,13 @@ const Kn = (r) => {
                 const u = [...s];
                 let C = null;
                 if (i) {
-                  for (let M = 0; M < i.length; M++)
-                    if (!s.find((l) => l.id === i[M].id)) {
-                      C = i[M];
+                  for (let T = 0; T < i.length; T++)
+                    if (!s.find((r) => r.id === i[T].id)) {
+                      C = i[T];
                       break;
                     }
                 }
-                d === "select" && i && u.push({
+                l === "select" && i && u.push({
                   name: C ? C.name : i[0].name,
                   id: (C == null ? void 0 : C.id) || i[0].id,
                   ...x
@@ -589,10 +590,10 @@ const Kn = (r) => {
     ] })
   ] });
 };
-function He(r) {
-  const { product: o, children: e } = r, { attributes: s, listeners: n, setNodeRef: g, transform: h, transition: c, isDragging: p } = ft({
+function He(d) {
+  const { product: o, children: e } = d, { attributes: s, listeners: n, setNodeRef: g, transform: h, transition: c, isDragging: _ } = ft({
     id: o.id
-  }), I = {
+  }), k = {
     transform: xt.Transform.toString(h),
     transition: c
   };
@@ -600,15 +601,15 @@ function He(r) {
     "div",
     {
       ref: g,
-      style: I,
-      className: `${U.product} ${p ? U.dragging : ""}`,
+      style: k,
+      className: `${U.product} ${_ ? U.dragging : ""}`,
       ...s,
       ...n,
       children: e
     }
   );
 }
-const Zn = (r) => {
+const Zn = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -617,22 +618,22 @@ const Zn = (r) => {
     other: g,
     title: h,
     subtitle: c,
-    editable: p = !0,
-    draggable: I = !1,
-    withImage: O = !1,
-    deletable: d = !0,
+    editable: _ = !0,
+    draggable: k = !1,
+    withImage: M = !1,
+    deletable: l = !0,
     addable: i = !0,
     itemsType: x,
     itemsPlaceholder: v = "",
-    itemsOptions: _,
+    itemsOptions: p,
     hasRangeSelector: y = !1,
     rangeSelectorOptions: w,
     modalOptions: L,
     addableOptions: a = {}
-  } = r, [$, T] = f.useState(null), [Q, E] = f.useState({
+  } = d, [$, q] = f.useState(null), [Q, E] = f.useState({
     top: 0,
     left: 0
-  }), [u, C] = f.useState(null), M = f.useRef(null), [l, j] = f.useState(!1), S = ut(
+  }), [u, C] = f.useState(null), T = f.useRef(null), [r, j] = f.useState(!1), S = ut(
     mt(ht, {
       activationConstraint: {
         distance: 5
@@ -641,36 +642,36 @@ const Zn = (r) => {
   );
   f.useEffect(() => {
     const m = () => {
-      T(null), j(!1);
+      q(null), j(!1);
     };
-    return document.body.addEventListener("click", m), T(null), j(!1), () => {
-      T(null), j(!1), document.body.removeEventListener("click", m);
+    return document.body.addEventListener("click", m), q(null), j(!1), () => {
+      q(null), j(!1), document.body.removeEventListener("click", m);
     };
   }, []), f.useEffect(() => {
     if ($) {
-      const m = [...s].map((q) => q.id === $.id ? $ : q);
+      const m = [...s].map((A) => A.id === $.id ? $ : A);
       n(m);
     }
   }, [$]), f.useEffect(() => {
-    if (M.current && u) {
-      const m = M.current.getBoundingClientRect().height, q = window.innerHeight;
+    if (T.current && u) {
+      const m = T.current.getBoundingClientRect().height, A = window.innerHeight;
       let B = u.top;
-      B + m > q + window.scrollY - 200 && (B = q + window.scrollY - m - 200), B < 0 && (B = 10), E({
+      B + m > A + window.scrollY - 200 && (B = A + window.scrollY - m - 200), B < 0 && (B = 10), E({
         top: B,
         left: u.left
       });
     }
-  }, [M.current, u]);
-  const R = (m, q) => {
+  }, [T.current, u]);
+  const R = (m, A) => {
     m.stopPropagation();
     const B = m.target.getBoundingClientRect();
     C({
       top: B.top + window.scrollY,
       left: B.left - 30
-    }), T(q), j(!0);
+    }), q(A), j(!0);
   };
   function P(m) {
-    if (O)
+    if (M)
       return m ? /* @__PURE__ */ t.jsx(
         "img",
         {
@@ -690,18 +691,18 @@ const Zn = (r) => {
       );
   }
   const z = (m) => {
-    const { active: q, over: B } = m;
-    if (B && q.id !== B.id) {
-      const A = s.findIndex((H) => H.id === q.id), et = s.findIndex((H) => H.id === B.id);
-      if (A !== -1 && et !== -1) {
-        const H = [...s], [X] = H.splice(A, 1);
+    const { active: A, over: B } = m;
+    if (B && A.id !== B.id) {
+      const O = s.findIndex((H) => H.id === A.id), et = s.findIndex((H) => H.id === B.id);
+      if (O !== -1 && et !== -1) {
+        const H = [...s], [X] = H.splice(O, 1);
         H.splice(et, 0, X), n(H);
       }
     }
   }, J = (m) => {
     var B;
-    const q = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      I && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+    const A = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      k && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -710,26 +711,26 @@ const Zn = (r) => {
           height: 20
         }
       ) }),
-      x === "select" && _ && /* @__PURE__ */ t.jsx(
+      x === "select" && p && /* @__PURE__ */ t.jsx(
         ot,
         {
-          onChange: (A) => {
+          onChange: (O) => {
             const H = [...s].map((X) => X.id === m.id ? {
               ...m,
               name: {
-                "en-US": A
+                "en-US": O
               }
             } : X);
-            T({
+            q({
               ...m,
               name: {
-                "en-US": A
+                "en-US": O
               }
             }), n([...H]);
           },
           value: m.name["en-US"],
-          options: _.filter(
-            (A) => !s.find((et) => et.name["en-US"] === A)
+          options: p.filter(
+            (O) => !s.find((et) => et.name["en-US"] === O)
           ),
           leftAddon: P(m.images)
         }
@@ -737,11 +738,11 @@ const Zn = (r) => {
       x === "input" && /* @__PURE__ */ t.jsx(
         rt,
         {
-          onChange: (A) => {
+          onChange: (O) => {
             const H = [...s].map((X) => X.id === m.id ? {
               ...m,
               name: {
-                "en-US": A
+                "en-US": O
               }
             } : X);
             n([...H]);
@@ -753,28 +754,28 @@ const Zn = (r) => {
       x === "image" && /* @__PURE__ */ t.jsx(
         St,
         {
-          onChange: (A) => {
+          onChange: (O) => {
             const H = [...s].map((X) => X.id === m.id ? {
               ...m,
-              images: A
+              images: O
             } : X);
             n([...H]);
           },
-          activeImage: (B = s.find((A) => A.id === m.id)) == null ? void 0 : B.images[0]
+          activeImage: (B = s.find((O) => O.id === m.id)) == null ? void 0 : B.images[0]
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: U.buttons, children: [
-        p && /* @__PURE__ */ t.jsx("div", { className: U.deleteButton, children: /* @__PURE__ */ t.jsx(
+        _ && /* @__PURE__ */ t.jsx("div", { className: U.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (A) => R(A, m)
+            onClick: (O) => R(O, m)
           }
         ) }),
-        d && /* @__PURE__ */ t.jsx("div", { className: U.deleteButton, children: /* @__PURE__ */ t.jsx(
+        l && /* @__PURE__ */ t.jsx("div", { className: U.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Trash",
@@ -782,23 +783,23 @@ const Zn = (r) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => n(s.filter((A) => A.id !== m.id))
+            onClick: () => n(s.filter((O) => O.id !== m.id))
           }
         ) })
       ] })
     ] });
-    return I ? /* @__PURE__ */ t.jsx(
+    return k ? /* @__PURE__ */ t.jsx(
       He,
       {
         product: m,
-        children: q
+        children: A
       },
       m.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: U.product,
-        children: q
+        children: A
       },
       m.id
     );
@@ -814,12 +815,12 @@ const Zn = (r) => {
         }
       )
     ] }),
-    $ && p && L && l && /* @__PURE__ */ t.jsx(
+    $ && _ && L && r && /* @__PURE__ */ t.jsx(
       Ct,
       {
-        ref: M,
+        ref: T,
         activeItem: $,
-        setActiveItem: T,
+        setActiveItem: q,
         popupPosition: Q,
         modalOptions: L,
         setIsOpenModal: j
@@ -828,7 +829,7 @@ const Zn = (r) => {
     y && w && /* @__PURE__ */ t.jsx(vt, { ...w }),
     /* @__PURE__ */ t.jsxs("div", { className: U.products, children: [
       c && /* @__PURE__ */ t.jsx("h5", { className: U.subtitle, children: c }),
-      I ? /* @__PURE__ */ t.jsx(
+      k ? /* @__PURE__ */ t.jsx(
         pt,
         {
           sensors: S,
@@ -859,17 +860,17 @@ const Zn = (r) => {
               size: "s",
               onClick: () => {
                 const m = [...s];
-                let q = null;
-                if (_) {
-                  for (let B = 0; B < _.length; B++)
-                    if (!s.find((A) => A.name["en-US"] === _[B])) {
-                      q = _[B];
+                let A = null;
+                if (p) {
+                  for (let B = 0; B < p.length; B++)
+                    if (!s.find((O) => O.name["en-US"] === p[B])) {
+                      A = p[B];
                       break;
                     }
                 }
-                x === "select" && _ ? m.push({
+                x === "select" && p ? m.push({
                   name: {
-                    "en-US": q || _[0]
+                    "en-US": A || p[0]
                   },
                   id: nt(),
                   ...a,
@@ -935,37 +936,37 @@ const Zn = (r) => {
   options: ls,
   addButton: rs,
   deleteButton: ds
-}, us = (r) => {
-  const { buttons: o, setButtons: e, deletable: s = !0, addable: n = !0, editableLink: g = !0 } = r, { pages: h } = wt(), [c, p] = f.useState(null), [I, O] = f.useState({
+}, us = (d) => {
+  const { buttons: o, setButtons: e, deletable: s = !0, addable: n = !0, editableLink: g = !0 } = d, { pages: h } = wt(), [c, _] = f.useState(null), [k, M] = f.useState({
     top: 0,
     left: 0
-  }), [d, i] = f.useState(null), x = f.useRef(null);
+  }), [l, i] = f.useState(null), x = f.useRef(null);
   f.useEffect(() => {
     if (c) {
-      const _ = [...o].map((y) => y.id === c.id ? c : y);
-      e(_);
+      const p = [...o].map((y) => y.id === c.id ? c : y);
+      e(p);
     }
   }, [c]), f.useEffect(() => {
-    if (x.current && d) {
-      const _ = x.current.getBoundingClientRect().height, y = window.innerHeight;
-      let w = d.top;
-      w + _ > y + window.scrollY - 200 && (w = y + window.scrollY - _ - 200), w < 0 && (w = 10), O({
+    if (x.current && l) {
+      const p = x.current.getBoundingClientRect().height, y = window.innerHeight;
+      let w = l.top;
+      w + p > y + window.scrollY - 200 && (w = y + window.scrollY - p - 200), w < 0 && (w = 10), M({
         top: w,
-        left: d.left
+        left: l.left
       });
     }
-  }, [x.current, d]);
-  const v = (_, y) => {
-    _.stopPropagation();
-    const w = _.target.getBoundingClientRect();
+  }, [x.current, l]);
+  const v = (p, y) => {
+    p.stopPropagation();
+    const w = p.target.getBoundingClientRect();
     i({
       top: w.top + window.scrollY - 70,
       left: w.left - (n ? 30 : 65)
-    }), p(y);
+    }), _(y);
   };
   return /* @__PURE__ */ t.jsxs("div", { className: K.products, children: [
     /* @__PURE__ */ t.jsx("h5", { className: K.subtitle, children: "Button Type" }),
-    o.map((_) => /* @__PURE__ */ t.jsxs(
+    o.map((p) => /* @__PURE__ */ t.jsxs(
       "div",
       {
         className: K.product,
@@ -974,13 +975,13 @@ const Zn = (r) => {
             ot,
             {
               onChange: (y) => {
-                const L = [...o].map((a) => a.id === _.id ? {
-                  ..._,
+                const L = [...o].map((a) => a.id === p.id ? {
+                  ...p,
                   type: y
                 } : a);
                 e(L);
               },
-              value: _.type,
+              value: p.type,
               options: ["Primary", "Secondary", "Tertiary"]
             }
           ),
@@ -993,7 +994,7 @@ const Zn = (r) => {
                 width: 20,
                 height: 20,
                 onClick: (y) => {
-                  v(y, _);
+                  v(y, p);
                 }
               }
             ) }),
@@ -1003,7 +1004,7 @@ const Zn = (r) => {
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const y = o.filter((w) => w.id !== _.id);
+                  const y = o.filter((w) => w.id !== p.id);
                   e(y);
                 },
                 width: 20,
@@ -1014,15 +1015,15 @@ const Zn = (r) => {
           ] })
         ]
       },
-      _.id
+      p.id
     )),
     c && /* @__PURE__ */ t.jsx(
       $t,
       {
         ref: x,
         activeButton: c,
-        setActiveButton: p,
-        popupPosition: I,
+        setActiveButton: _,
+        popupPosition: k,
         editableLink: g
       }
     ),
@@ -1041,8 +1042,8 @@ const Zn = (r) => {
             className: K.button,
             size: "s",
             onClick: () => {
-              const _ = [...o];
-              g ? _.push({
+              const p = [...o];
+              g ? p.push({
                 type: "Primary",
                 id: nt(),
                 typesText: [],
@@ -1052,7 +1053,7 @@ const Zn = (r) => {
                 destination: "Go to Page",
                 page: h ? Object.values(h)[0].name : "Home",
                 openInNewTab: !1
-              }) : _.push({
+              }) : p.push({
                 type: "Primary",
                 id: nt(),
                 typesText: [],
@@ -1062,7 +1063,7 @@ const Zn = (r) => {
                 destination: "Go to Page",
                 page: h ? Object.values(h)[0].name : "Home",
                 openInNewTab: !1
-              }), e(_);
+              }), e(p);
             },
             style: {
               width: "fit-content"
@@ -1083,8 +1084,8 @@ const Zn = (r) => {
       }
     )
   ] });
-}, ti = (r) => {
-  const { isActiveButtons: o, setIsActiveButtons: e, buttons: s, setButtons: n, editableLink: g = !0 } = r;
+}, ti = (d) => {
+  const { isActiveButtons: o, setIsActiveButtons: e, buttons: s, setButtons: n, editableLink: g = !0 } = d;
   return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: lt.buttonsBlock, children: [
     /* @__PURE__ */ t.jsxs("div", { className: lt.top, children: [
       /* @__PURE__ */ t.jsx("h3", { className: lt.title, children: "Buttons" }),
@@ -1106,10 +1107,10 @@ const Zn = (r) => {
     )
   ] }) });
 };
-function ms(r) {
-  const { product: o, children: e } = r, { attributes: s, listeners: n, setNodeRef: g, transform: h, transition: c, isDragging: p } = ft({
+function ms(d) {
+  const { product: o, children: e } = d, { attributes: s, listeners: n, setNodeRef: g, transform: h, transition: c, isDragging: _ } = ft({
     id: String(o.listingId)
-  }), I = {
+  }), k = {
     transform: xt.Transform.toString(h),
     transition: c
   };
@@ -1117,15 +1118,15 @@ function ms(r) {
     "div",
     {
       ref: g,
-      style: I,
-      className: `${F.product} ${p ? F.dragging : ""}`,
+      style: k,
+      className: `${F.product} ${_ ? F.dragging : ""}`,
       ...s,
       ...n,
       children: e
     }
   );
 }
-const ei = (r) => {
+const ei = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -1134,19 +1135,19 @@ const ei = (r) => {
     other: g,
     title: h,
     subtitle: c,
-    editable: p = !0,
-    draggable: I = !1,
-    withImage: O = !1,
-    deletable: d = !0,
+    editable: _ = !0,
+    draggable: k = !1,
+    withImage: M = !1,
+    deletable: l = !0,
     addable: i = !0,
     itemsType: x,
     itemsOptions: v
-  } = r, [_, y] = f.useState(
+  } = d, [p, y] = f.useState(
     null
   ), [w, L] = f.useState({
     top: 0,
     left: 0
-  }), [a, $] = f.useState(!1), T = ut(
+  }), [a, $] = f.useState(!1), q = ut(
     mt(ht, {
       activationConstraint: {
         distance: 5
@@ -1154,33 +1155,33 @@ const ei = (r) => {
     })
   );
   f.useEffect(() => {
-    const l = () => {
+    const r = () => {
       y(null), $(!1);
     };
-    return document.body.addEventListener("click", l), y(null), $(!1), () => {
-      y(null), $(!1), document.body.removeEventListener("click", l);
+    return document.body.addEventListener("click", r), y(null), $(!1), () => {
+      y(null), $(!1), document.body.removeEventListener("click", r);
     };
   }, []), f.useEffect(() => {
-    if (_) {
-      const l = [...s].map((j) => j.listingId === _.listingId ? _ : j);
-      n(l);
+    if (p) {
+      const r = [...s].map((j) => j.listingId === p.listingId ? p : j);
+      n(r);
     }
-  }, [_]);
-  const Q = (l, j) => {
-    l.stopPropagation();
-    const S = l.target.getBoundingClientRect(), R = 100, P = window.innerHeight;
+  }, [p]);
+  const Q = (r, j) => {
+    r.stopPropagation();
+    const S = r.target.getBoundingClientRect(), R = 100, P = window.innerHeight;
     let z = S.top + window.scrollY;
     z + R > P && (z = P - R - 20), $(!0), L({
       top: z - 80,
       left: S.left - 30
     }), y(j);
   };
-  function E(l) {
-    if (O)
-      return l ? /* @__PURE__ */ t.jsx(
+  function E(r) {
+    if (M)
+      return r ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${l}/w=1000`,
+          src: `https://imagedelivery.net/${r}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
@@ -1195,8 +1196,8 @@ const ei = (r) => {
         }
       );
   }
-  const u = (l) => {
-    const { active: j, over: S } = l;
+  const u = (r) => {
+    const { active: j, over: S } = r;
     if (S && j.id !== S.id) {
       const R = s.findIndex((z) => String(z.listingId) === j.id), P = s.findIndex((z) => String(z.listingId) === S.id);
       if (R !== -1 && P !== -1) {
@@ -1204,11 +1205,11 @@ const ei = (r) => {
         z.splice(P, 0, J), n(z);
       }
     }
-  }, C = (l, j) => {
-    const S = v.find((P) => l.listingId === P.id);
+  }, C = (r, j) => {
+    const S = v.find((P) => r.listingId === P.id);
     if (!S) return null;
     const R = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      I && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+      k && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -1226,31 +1227,31 @@ const ei = (r) => {
             const m = {
               listingId: J.id,
               image: J.productData.images.length > 0 ? J.productData.images[0].cfId : ""
-            }, q = z.map((B) => B.listingId === l.listingId ? m : B);
-            y(m), n([...q]);
+            }, A = z.map((B) => B.listingId === r.listingId ? m : B);
+            y(m), n([...A]);
           },
           value: S.productData.name,
           options: [
             ...v.filter((P) => !s.find((z) => z.listingId === P.id)).map((P) => P.productData.name)
           ],
           leftAddon: E(
-            l.image || S.productData.images.length > 0 && S.productData.images[0].cfId || ""
+            r.image || S.productData.images.length > 0 && S.productData.images[0].cfId || ""
           )
         },
         j
       ),
       /* @__PURE__ */ t.jsxs("div", { className: F.buttons, children: [
-        p && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
+        _ && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (P) => Q(P, l)
+            onClick: (P) => Q(P, r)
           }
         ) }),
-        d && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
+        l && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Trash",
@@ -1258,27 +1259,27 @@ const ei = (r) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => n(s.filter((P) => P !== l))
+            onClick: () => n(s.filter((P) => P !== r))
           }
         ) })
       ] })
     ] });
-    return I ? /* @__PURE__ */ t.jsx(
+    return k ? /* @__PURE__ */ t.jsx(
       ms,
       {
-        product: l,
+        product: r,
         children: R
       },
-      l.listingId
+      r.listingId
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: F.product,
         children: R
       },
-      l.listingId
+      r.listingId
     );
-  }, M = f.useRef(null);
+  }, T = f.useRef(null);
   return /* @__PURE__ */ t.jsxs("div", { className: F.productsBlock, children: [
     (h || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: F.top, children: [
       h && /* @__PURE__ */ t.jsx("h3", { className: F.title, children: h }),
@@ -1286,15 +1287,15 @@ const ei = (r) => {
         it,
         {
           current: o,
-          onChange: (l) => e == null ? void 0 : e(l)
+          onChange: (r) => e == null ? void 0 : e(r)
         }
       )
     ] }),
-    a && _ && /* @__PURE__ */ t.jsx(
+    a && p && /* @__PURE__ */ t.jsx(
       Bt,
       {
-        ref: M,
-        activeItem: _,
+        ref: T,
+        activeItem: p,
         setActiveItem: y,
         setIsOpenModal: $,
         popupPosition: w,
@@ -1303,21 +1304,21 @@ const ei = (r) => {
     ),
     o && /* @__PURE__ */ t.jsxs("div", { className: F.products, children: [
       c && /* @__PURE__ */ t.jsx("h5", { className: F.subtitle, children: c }),
-      I ? /* @__PURE__ */ t.jsx(
+      k ? /* @__PURE__ */ t.jsx(
         pt,
         {
-          sensors: T,
+          sensors: q,
           onDragEnd: u,
           children: /* @__PURE__ */ t.jsx(
             _t,
             {
-              items: s.map((l) => String(l.listingId)),
+              items: s.map((r) => String(r.listingId)),
               strategy: gt,
-              children: s.map((l, j) => C(l, j))
+              children: s.map((r, j) => C(r, j))
             }
           )
         }
-      ) : s.map((l, j) => C(l, j)),
+      ) : s.map((r, j) => C(r, j)),
       i && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -1333,16 +1334,16 @@ const ei = (r) => {
               className: F.button,
               size: "s",
               onClick: () => {
-                const l = [...s];
+                const r = [...s];
                 for (let j = 0; j < v.length; j++)
                   if (!s.find((S) => S.listingId === v[j].id)) {
-                    l.push({
+                    r.push({
                       listingId: v[j].id,
                       image: v[j].productData.images.length > 0 ? v[j].productData.images[0].cfId : ""
                     });
                     break;
                   }
-                n(l);
+                n(r);
               },
               disabled: s.length === v.length,
               style: {
@@ -1366,7 +1367,7 @@ const ei = (r) => {
     ] }),
     o && g !== void 0 && /* @__PURE__ */ t.jsx(dt, { items: g })
   ] });
-}, hs = "_options_6cemk_1", ps = "_price_6cemk_12", _s = "_oldPrice_6cemk_19", gs = "_newPrice_6cemk_27", fs = "_animate_6cemk_34", xs = "_appearAndBounce_6cemk_1", bs = "_meta_6cemk_52", js = "_info_6cemk_58", vs = "_infoRight_6cemk_66", ys = "_buttons_6cemk_73", Ns = "_variants_6cemk_80", ks = "_variant_6cemk_80", Is = "_stock_6cemk_98", Cs = "_variantInfo_6cemk_105", Ss = "_quantity_6cemk_111", ws = "_count_6cemk_118", $s = "_focused_6cemk_135", Bs = "_button_6cemk_73", Ps = "_activeVariant_6cemk_161", Ms = "_chargeTypes_6cemk_165", Ts = "_charge_6cemk_165", qs = "_chargeActive_6cemk_190", As = "_title_6cemk_198", k = {
+}, hs = "_options_6cemk_1", ps = "_price_6cemk_12", _s = "_oldPrice_6cemk_19", gs = "_newPrice_6cemk_27", fs = "_animate_6cemk_34", xs = "_appearAndBounce_6cemk_1", bs = "_meta_6cemk_52", js = "_info_6cemk_58", vs = "_infoRight_6cemk_66", ys = "_buttons_6cemk_73", Ns = "_variants_6cemk_80", ks = "_variant_6cemk_80", Is = "_stock_6cemk_98", Cs = "_variantInfo_6cemk_105", Ss = "_quantity_6cemk_111", ws = "_count_6cemk_118", $s = "_focused_6cemk_135", Bs = "_button_6cemk_73", Ps = "_activeVariant_6cemk_161", Ms = "_chargeTypes_6cemk_165", Ts = "_charge_6cemk_165", qs = "_chargeActive_6cemk_190", As = "_title_6cemk_198", I = {
   options: hs,
   price: ps,
   oldPrice: _s,
@@ -1391,24 +1392,24 @@ const ei = (r) => {
   chargeActive: qs,
   title: As
 };
-var kt = /* @__PURE__ */ ((r) => (r.ONE_TIME = "One-Time", r.RECURRING = "Subscribe & Save", r))(kt || {});
-const si = (r) => {
+var kt = /* @__PURE__ */ ((d) => (d.ONE_TIME = "One-Time", d.RECURRING = "Subscribe & Save", d))(kt || {});
+const si = (d) => {
   var w, L;
-  const { variants: o } = r, [e, s] = f.useState(o[0]), [n, g] = f.useState(e.chargeTypes[0]), h = ct(), [c, p] = f.useState(1), { reset: I, addProductToCart: O, getProducts: d } = bt(), [i, x] = f.useState(!1);
+  const { variants: o } = d, [e, s] = f.useState(o[0]), [n, g] = f.useState(e.chargeTypes[0]), h = ct(), [c, _] = f.useState(1), { reset: k, addProductToCart: M, getProducts: l } = bt(), [i, x] = f.useState(!1);
   f.useEffect(() => {
     x(!0);
     const a = setTimeout(() => x(!1), 600);
     return () => clearTimeout(a);
   }, [c]);
   async function v() {
-    await d(), await O({
-      productId: r.id,
+    await l(), await M({
+      productId: d.id,
       productVariantId: e.id,
       quantity: c
     });
   }
-  function _() {
-    I(), v(), h("/checkout");
+  function p() {
+    k(), v(), h("/checkout");
   }
   function y(a) {
     if (a >= 864e5) {
@@ -1426,37 +1427,37 @@ const si = (r) => {
     }
   }
   return f.useEffect(() => {
-    (e.quantity.available === 0 || !e.quantity.available) && p(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((a) => /* @__PURE__ */ t.jsx(
+    (e.quantity.available === 0 || !e.quantity.available) && _(0);
+  }, [e.quantity.available]), /* @__PURE__ */ t.jsxs("div", { className: I.options, children: [
+    e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: I.chargeTypes, children: e.chargeTypes.map((a) => /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: V(k.charge, {
-          [k.chargeActive]: n === a
+        className: V(I.charge, {
+          [I.chargeActive]: n === a
         }),
         onClick: () => g(a),
         children: kt[a]
       },
       a
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: k.variants, children: o.map((a) => {
+    /* @__PURE__ */ t.jsx("div", { className: I.variants, children: o.map((a) => {
       var $;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
-          className: V(k.variant, {
-            [k.activeVariant]: e.id === a.id
+          className: V(I.variant, {
+            [I.activeVariant]: e.id === a.id
           }),
           onClick: () => s(a),
           children: [
-            /* @__PURE__ */ t.jsxs("div", { className: k.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: k.title, children: a.name }),
+            /* @__PURE__ */ t.jsxs("div", { className: I.variantInfo, children: [
+              /* @__PURE__ */ t.jsx("span", { className: I.title, children: a.name }),
               /* @__PURE__ */ t.jsxs("span", { children: [
                 "$",
                 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: [
+            /* @__PURE__ */ t.jsx("div", { children: n === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: I.stock, children: [
               (($ = a.quantity.restrictions) == null ? void 0 : $.max) || a.quantity.available || 0,
               " in stock"
             ] }) })
@@ -1465,15 +1466,15 @@ const si = (r) => {
         a.id
       );
     }) }),
-    n === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: k.quantity, children: [
+    n === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: I.quantity, children: [
       /* @__PURE__ */ t.jsx(
         Y,
         {
           type: "Secondary",
           onClick: () => {
-            c > 1 ? p((a) => a - 1) : p(1);
+            c > 1 ? _((a) => a - 1) : _(1);
           },
-          className: k.button,
+          className: I.button,
           disabled: e.quantity.available === 0 || e.quantity.restrictions && c <= e.quantity.restrictions.min || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
           children: /* @__PURE__ */ t.jsx(b, { name: "Minus" })
         }
@@ -1483,7 +1484,7 @@ const si = (r) => {
         {
           type: "number",
           value: String(c),
-          onChange: (a) => p(Number(a)),
+          onChange: (a) => _(Number(a)),
           max: ((w = e.quantity.restrictions) == null ? void 0 : w.max) || e.quantity.available || 1 / 0,
           min: ((L = e.quantity.restrictions) == null ? void 0 : L.min) || 0,
           centered: !0,
@@ -1495,18 +1496,18 @@ const si = (r) => {
         {
           type: "Secondary",
           onClick: () => {
-            p((a) => a + 1);
+            _((a) => a + 1);
           },
-          className: k.button,
+          className: I.button,
           disabled: !!(e.quantity.restrictions && c >= e.quantity.restrictions.max || e.quantity.available !== void 0 && c >= e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available),
           children: /* @__PURE__ */ t.jsx(b, { name: "Plus" })
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: k.meta, children: [
-      /* @__PURE__ */ t.jsxs("div", { className: k.info, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: I.meta, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: I.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
-        /* @__PURE__ */ t.jsxs("div", { className: k.infoRight, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: I.infoRight, children: [
           /* @__PURE__ */ t.jsx(
             b,
             {
@@ -1519,41 +1520,41 @@ const si = (r) => {
           /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : y(e.deliveryTime) })
         ] })
       ] }),
-      /* @__PURE__ */ t.jsxs("div", { className: k.info, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: I.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: V(k.newPrice, { [k.animate]: i }), children: [
+        /* @__PURE__ */ t.jsx("div", { className: I.infoRight, children: n === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: I.price, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: i }), children: [
             "$ ",
             (e.price.amount || 0) * c
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: k.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: I.oldPrice, children: [
             "$ ",
             (e.compareAtPrice.amount || 0) * c
           ] })
-        ] }) : /* @__PURE__ */ t.jsxs("span", { className: V(k.newPrice, { [k.animate]: i }), children: [
+        ] }) : /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: i }), children: [
           "$ ",
           (e.price.amount || 0) * c
-        ] }) : 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: V(k.newPrice, { [k.animate]: i }), children: [
+        ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: I.price, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: i }), children: [
             "$ ",
             e.subscriptionSettings.price.amount || 0
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: k.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: I.oldPrice, children: [
             "$ ",
             e.subscriptionSettings.compareAtPrice.amount || 0
           ] })
-        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: V(k.newPrice, { [k.animate]: i }), children: [
+        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: V(I.newPrice, { [I.animate]: i }), children: [
           "$ ",
           e.subscriptionSettings.price.amount || 0
         ] }) })
       ] })
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: k.buttons, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: I.buttons, children: [
       /* @__PURE__ */ t.jsx(
         Y,
         {
           type: "Primary",
-          onClick: () => _(),
+          onClick: () => p(),
           disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
           children: n === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
         }
@@ -1609,14 +1610,14 @@ const si = (r) => {
   pagesMobileModalContent: _n,
   pagesMobileModalHeader: gn,
   pagesMobileModalFooter: fn
-}, ni = (r) => {
-  const { shopping: o, signUp: e, isShowUserInfo: s = !0 } = r;
+}, ni = (d) => {
+  const { shopping: o, signUp: e, isShowUserInfo: s = !0 } = d;
   return /* @__PURE__ */ t.jsxs("div", { className: N.buttons, children: [
     o && /* @__PURE__ */ t.jsx(xn, {}),
     s && /* @__PURE__ */ t.jsx(It, { signUp: e })
   ] });
 }, xn = () => {
-  const [r, o] = f.useState(!1), [e, s] = f.useState([]), { cart: n, getProducts: g } = bt();
+  const [d, o] = f.useState(!1), [e, s] = f.useState([]), { cart: n, getProducts: g } = bt();
   function h(i) {
     for (let x = 0; x < n.parts.length; x++)
       for (let v = 0; v < i.variants.length; v++)
@@ -1631,19 +1632,19 @@ const si = (r) => {
   }
   f.useEffect(() => {
     (async () => {
-      const x = n.parts.map((y) => String(y.productId)), _ = (await g([...x])).map((y) => ({
+      const x = n.parts.map((y) => String(y.productId)), p = (await g([...x])).map((y) => ({
         ...y,
         activeVariantId: h(y),
         quantity: c(y)
       }));
-      s(_);
+      s(p);
     })();
   }, [n.parts.length]);
-  function p(i) {
+  function _(i) {
     var x;
     return !i || !(i != null && i.variants) ? !1 : (x = i.variants.find((v) => v.id === i.activeVariantId)) == null ? void 0 : x.subscriptionSettings;
   }
-  const I = n.parts.length > 0 && e.length > 0 && !p(e[0]), [O, d] = f.useState(!1);
+  const k = n.parts.length > 0 && e.length > 0 && !_(e[0]), [M, l] = f.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsxs(
       Y,
@@ -1653,7 +1654,7 @@ const si = (r) => {
           padding: 10
         },
         onClick: (i) => {
-          i.stopPropagation(), window.location.pathname.includes("/admin/builder") || (o(!0), d(!0));
+          i.stopPropagation(), window.location.pathname.includes("/admin/builder") || (o(!0), l(!0));
         },
         children: [
           /* @__PURE__ */ t.jsx(
@@ -1663,15 +1664,15 @@ const si = (r) => {
               fill: "var(--icon-primary)"
             }
           ),
-          I && /* @__PURE__ */ t.jsx("div", { className: N.shoppingCount, children: n.parts.length })
+          k && /* @__PURE__ */ t.jsx("div", { className: N.shoppingCount, children: n.parts.length })
         ]
       }
     ),
-    r && /* @__PURE__ */ t.jsx(
+    d && /* @__PURE__ */ t.jsx(
       jt,
       {
         close: () => {
-          d(!1), setTimeout(() => {
+          l(!1), setTimeout(() => {
             o(!1);
           }, 300);
         },
@@ -1680,26 +1681,26 @@ const si = (r) => {
           bn,
           {
             activeProducts: e,
-            isCartNotEmpty: I,
-            isOpen: O
+            isCartNotEmpty: k,
+            isOpen: M
           }
         )
       }
     )
   ] });
-}, bn = (r) => {
-  const { activeProducts: o, isCartNotEmpty: e, isOpen: s } = r, { cart: n, reset: g, getTotalAndDiscount: h, updateQuantityOfProduct: c } = bt(), p = ct();
-  function I(i) {
-    p(i);
+}, bn = (d) => {
+  const { activeProducts: o, isCartNotEmpty: e, isOpen: s } = d, { cart: n, reset: g, getTotalAndDiscount: h, updateQuantityOfProduct: c } = bt(), _ = ct();
+  function k(i) {
+    _(i);
   }
-  function O(i) {
+  function M(i) {
     c({
       productId: i.id,
       productVariantId: i.activeVariantId,
       quantity: i.quantity + 1
     });
   }
-  function d(i) {
+  function l(i) {
     c({
       productId: i.id,
       productVariantId: i.activeVariantId,
@@ -1761,7 +1762,7 @@ const si = (r) => {
                     "div",
                     {
                       onClick: () => {
-                        i.quantity !== 1 && d(i);
+                        i.quantity !== 1 && l(i);
                       },
                       className: N.productButton,
                       children: /* @__PURE__ */ t.jsx(
@@ -1779,7 +1780,7 @@ const si = (r) => {
                   /* @__PURE__ */ t.jsx(
                     "div",
                     {
-                      onClick: () => O(i),
+                      onClick: () => M(i),
                       className: N.productButton,
                       children: /* @__PURE__ */ t.jsx(
                         b,
@@ -1816,7 +1817,7 @@ const si = (r) => {
                 h().total
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx(Y, { onClick: () => I("/checkout"), children: "Checkout" })
+            /* @__PURE__ */ t.jsx(Y, { onClick: () => k("/checkout"), children: "Checkout" })
           ] })
         ] }) : /* @__PURE__ */ t.jsx(jn, {})
       ]
@@ -1843,7 +1844,7 @@ const si = (r) => {
       }
     )
   ] })
-] }), It = ({ signUp: r }) => {
+] }), It = ({ signUp: d }) => {
   const o = JSON.parse(localStorage.getItem("token") || "{}"), { data: e } = o, s = ct();
   function n(c) {
     window.location.pathname.includes("/admin/builder") || s(c);
@@ -1861,7 +1862,7 @@ const si = (r) => {
           children: "Login"
         }
       ),
-      r && /* @__PURE__ */ t.jsx(
+      d && /* @__PURE__ */ t.jsx(
         Y,
         {
           onClick: () => n("/customer-dash"),
@@ -1877,8 +1878,8 @@ const si = (r) => {
   const [g, h] = f.useState("test-email@gmail.com");
   return f.useEffect(() => {
     (async () => {
-      const p = Mt(e);
-      h(p.email);
+      const _ = Mt(e);
+      h(_.email);
     })();
   }, [e]), /* @__PURE__ */ t.jsx(
     "div",
@@ -1889,7 +1890,7 @@ const si = (r) => {
     }
   );
 }, vn = ({
-  children: r,
+  children: d,
   logo: o,
   setIsOpen: e,
   signUp: s
@@ -1922,13 +1923,13 @@ const si = (r) => {
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: N.pagesMobileModalContent, children: r }),
+        /* @__PURE__ */ t.jsx("div", { className: N.pagesMobileModalContent, children: d }),
         /* @__PURE__ */ t.jsx("div", { className: N.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(It, { signUp: s }) })
       ]
     }
   );
 }, ii = ({
-  children: r,
+  children: d,
   logo: o,
   signUp: e
 }) => {
@@ -1941,12 +1942,12 @@ const si = (r) => {
         logo: o,
         setIsOpen: n,
         signUp: e,
-        children: r
+        children: d
       }
     ) })
   ] });
-}, yn = (r) => {
-  const { setIsOpenModal: o } = r;
+}, yn = (d) => {
+  const { setIsOpenModal: o } = d;
   return /* @__PURE__ */ t.jsx(
     Y,
     {
@@ -1979,7 +1980,7 @@ const si = (r) => {
   copyTextMobile: Mn,
   copyTextMiniMobile: Tn
 }, oi = () => {
-  const { isOpenModal: r, setIsOpenModal: o } = Nt();
+  const { isOpenModal: d, setIsOpenModal: o } = Nt();
   function e() {
     o(!0);
   }
@@ -2002,10 +2003,10 @@ const si = (r) => {
         )
       }
     ),
-    r && /* @__PURE__ */ t.jsx(jt, { close: o, children: /* @__PURE__ */ t.jsx(qn, {}) })
+    d && /* @__PURE__ */ t.jsx(jt, { close: o, children: /* @__PURE__ */ t.jsx(qn, {}) })
   ] });
 }, qn = () => {
-  const { setIsOpenModal: r } = Nt(), { notification: o, setNotification: e } = Tt(), { setIsOpen: s } = yt(), n = window.location.href;
+  const { setIsOpenModal: d } = Nt(), { notification: o, setNotification: e } = Tt(), { setIsOpen: s } = yt(), n = window.location.href;
   function g() {
     navigator.clipboard.writeText(n), e({
       message: "Link copied to clipboard",
@@ -2014,17 +2015,17 @@ const si = (r) => {
   }
   function h() {
     s(!1), setTimeout(() => {
-      r(!1), s(!0);
+      d(!1), s(!0);
     }, 300);
   }
-  function c(p, I) {
-    return p.length > I ? p.slice(0, I) + "..." : p;
+  function c(_, k) {
+    return _.length > k ? _.slice(0, k) + "..." : _;
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: Z.modal,
-      onClick: (p) => p.stopPropagation(),
+      onClick: (_) => _.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: Z.header, children: [
           /* @__PURE__ */ t.jsx("div", { className: Z.title, children: "Copy Product Link" }),
@@ -2072,8 +2073,8 @@ const si = (r) => {
   icon: En,
   open: zn,
   content: Rn
-}, ai = ({ title: r, content: o, defaultOpen: e = !1 }) => {
-  const [s, n] = f.useState(e), [g, h] = f.useState(0), c = f.useRef(null), p = () => {
+}, ai = ({ title: d, content: o, defaultOpen: e = !1 }) => {
+  const [s, n] = f.useState(e), [g, h] = f.useState(0), c = f.useRef(null), _ = () => {
     n(!s);
   };
   return f.useEffect(() => {
@@ -2083,9 +2084,9 @@ const si = (r) => {
       "div",
       {
         className: st.header,
-        onClick: p,
+        onClick: _,
         children: [
-          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: r }),
+          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: d }),
           /* @__PURE__ */ t.jsx("div", { className: V(st.icon, { [st.open]: s }), children: /* @__PURE__ */ t.jsx(b, { name: "CaretDown" }) })
         ]
       }
@@ -2100,7 +2101,7 @@ const si = (r) => {
       }
     )
   ] });
-}, ci = ({ children: r, path: o, className: e, target: s = "_self", id: n }) => {
+}, ci = ({ children: d, path: o, className: e, target: s = "_self", id: n }) => {
   if (window.location.pathname.includes("/admin/builder"))
     return /* @__PURE__ */ t.jsx(
       "div",
@@ -2109,11 +2110,11 @@ const si = (r) => {
         role: "link",
         style: { cursor: "pointer" },
         id: n,
-        children: r
+        children: d
       }
     );
-  const g = ct(), h = /^https?:\/\//.test(o), c = (p) => {
-    h || s === "_blank" ? s === "_blank" ? window.open(o, "_blank") : window.location.href = o : (p.preventDefault(), g(o, { replace: !0 }));
+  const g = ct(), h = /^https?:\/\//.test(o), c = (_) => {
+    h || s === "_blank" ? s === "_blank" ? window.open(o, "_blank") : window.location.href = o : (_.preventDefault(), g(o, { replace: !0 }));
   };
   return /* @__PURE__ */ t.jsx(
     "div",
@@ -2123,7 +2124,7 @@ const si = (r) => {
       role: "link",
       style: { cursor: "pointer" },
       id: n,
-      children: r
+      children: d
     }
   );
 }, Dn = "_buttonsBlock_1b2rb_1", Ln = "_slideUp_1b2rb_1", Hn = {
@@ -2146,8 +2147,18 @@ const si = (r) => {
   label: Fn,
   textarea: Vn,
   length: Yn
-}, ri = (r) => {
-  const { onChange: o, label: e, value: s, maxLength: n, placeholder: g = "Type something..." } = r, [h, c] = f.useState(s.length);
+}, ri = (d) => {
+  const {
+    onChange: o,
+    label: e,
+    value: s,
+    maxLength: n,
+    placeholder: g = "Type something...",
+    type: h = "text"
+  } = d, [c, _] = f.useState(s.length);
+  function k(M) {
+    return h === "number" ? M.replace(/[^\d\n]+/g, "") : M;
+  }
   return /* @__PURE__ */ t.jsxs("div", { className: at.wrapper, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
@@ -2161,9 +2172,10 @@ const si = (r) => {
       "textarea",
       {
         id: e,
-        defaultValue: s,
-        onChange: (p) => {
-          c(p.target.value.length), o(p.target.value);
+        value: s,
+        onChange: (M) => {
+          const l = k(M.target.value);
+          _(l.length), o(l);
         },
         placeholder: g,
         className: at.textarea,
@@ -2171,7 +2183,7 @@ const si = (r) => {
       }
     ),
     n && /* @__PURE__ */ t.jsxs("div", { className: at.length, children: [
-      h,
+      c,
       "/",
       n
     ] })