@billgangcom/theme-lib 1.71.3 → 1.71.4

package/dist/ui.es.js

@@ -1,6 +1,6 @@
-import { j as t, I as b, c as F, d as Nt, e as pt, g as mt, P as gt, S as lt, h as Pt, D as ft, i as xt, v as _t, B as dt, k as at, a as kt, l as wt, O as ht, m as J, n as jt, C as vt, o as V, p as qt, q as At, r as yt, t as Dt, w as bt, x as W, L as Et, y as Ct, z as St, A as ot, s as it, f as Q, E as zt, F as E, G as Rt, M as ut, H as Lt, J as ct, K as Tt, N as Ut, Q as Mt, T as Ht, U as Bt, V as Ft } from "./index-ChzUc1hG.js";
-import { a3 as Zn, $ as ti, Z as ei, a2 as si, Y as ni, _ as ii, W as ai, X as oi, a0 as ci, a1 as ri } from "./index-ChzUc1hG.js";
-import x from "react";
+import { j as t, I, c as H, d as Nt, e as pt, g as mt, P as gt, S as lt, h as wt, D as ft, i as xt, v as _t, B as dt, k as at, a as Pt, l as kt, O as ht, m as J, n as yt, C as jt, o as V, p as Ot, q as At, r as vt, t as Dt, w as bt, x as W, L as Et, y as Ct, z as St, A as ct, s as it, f as Q, E as Rt, F as R, G as Lt, M as ut, H as Ut, J as rt, K as Tt, N as zt, Q as Mt, T as Ft, U as Bt, V as Ht } from "./index-PIQNHMY6.js";
+import { a4 as ti, $ as ei, Z as si, a3 as ni, a2 as ii, Y as ai, _ as oi, W as ci, X as ri, a0 as li, a1 as di } from "./index-PIQNHMY6.js";
+import y from "react";
 import "react-dom";
 const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23", Wt = "_alignmentContent_kh9z8_30", Xt = "_alignments_kh9z8_39", Qt = "_alignment_kh9z8_30", Jt = "_circle_kh9z8_64", Kt = "_paddings_kh9z8_71", Zt = "_padding_kh9z8_71", te = "_active_kh9z8_97", G = {
   block: Vt,
@@ -23,16 +23,16 @@ const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23",
   "bottomLeft",
   "bottom",
   "bottomRight"
-], se = ["left", "top", "right", "bottom"], Dn = (h) => {
+], se = ["left", "top", "right", "bottom"], En = (h) => {
   const {
-    alignment: i,
+    alignment: n,
     padding: a,
     setPadding: s,
     setAlignment: e,
     isAlignment: r = !0,
-    isPadding: c = !0
+    isPadding: o = !0
   } = h;
-  function f(d) {
+  function x(d) {
     switch (d) {
       case "left":
       case "topLeft":
@@ -50,7 +50,7 @@ const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23",
         return "TextAlignCenter";
     }
   }
-  function j(d) {
+  function v(d) {
     switch (d) {
       case "left":
         return "AlignLeft";
@@ -62,7 +62,7 @@ const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23",
         return "AlignBottom";
     }
   }
-  const [v, T] = x.useState(null), [_, m] = x.useState(null);
+  const [b, M] = y.useState(null), [j, m] = y.useState(null);
   return /* @__PURE__ */ t.jsxs("div", { className: G.layout, children: [
     /* @__PURE__ */ t.jsx("h3", { className: G.title, children: "Layout (for Desktop version)" }),
     /* @__PURE__ */ t.jsxs("div", { className: G.alignmentContent, children: [
@@ -76,26 +76,26 @@ const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23",
             },
             className: G.alignment,
             onMouseEnter: () => {
-              T(d);
+              M(d);
             },
             onMouseLeave: () => {
-              T(null);
+              M(null);
             },
             children: [
-              d !== i && v !== d && /* @__PURE__ */ t.jsx("div", { className: G.circle }),
-              d !== i && v === d && /* @__PURE__ */ t.jsx(
-                b,
+              d !== n && b !== d && /* @__PURE__ */ t.jsx("div", { className: G.circle }),
+              d !== n && b === d && /* @__PURE__ */ t.jsx(
+                I,
                 {
-                  name: f(v),
+                  name: x(b),
                   fill: "#c2c2c2",
                   width: 22,
                   height: 22
                 }
               ),
-              d === i && /* @__PURE__ */ t.jsx(
-                b,
+              d === n && /* @__PURE__ */ t.jsx(
+                I,
                 {
-                  name: f(i),
+                  name: x(n),
                   fill: "#FF3F19",
                   width: 22,
                   height: 22
@@ -106,13 +106,13 @@ const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23",
           d
         )) })
       ] }),
-      c && /* @__PURE__ */ t.jsxs("div", { className: G.block, children: [
+      o && /* @__PURE__ */ t.jsxs("div", { className: G.block, children: [
         /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: "Paddings" }),
         /* @__PURE__ */ t.jsx("div", { className: G.paddings, children: se.map((d) => /* @__PURE__ */ t.jsxs(
           "label",
           {
-            className: F(G.padding, {
-              [G.active]: _ === d
+            className: H(G.padding, {
+              [G.active]: j === d
             }),
             onFocus: () => {
               m(d);
@@ -122,9 +122,9 @@ const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23",
             },
             children: [
               /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-                b,
+                I,
                 {
-                  name: j(d),
+                  name: v(d),
                   width: 20,
                   height: 20
                 }
@@ -163,71 +163,71 @@ const Vt = "_block_kh9z8_8", Yt = "_title_kh9z8_16", Gt = "_subtitle_kh9z8_23",
   addButton: he,
   deleteButton: pe
 };
-function me({ id: h, children: i }) {
+function me({ id: h, children: n }) {
   const {
     attributes: a,
     listeners: s,
     setNodeRef: e,
     transform: r,
-    transition: c,
-    isDragging: f
-  } = jt({
+    transition: o,
+    isDragging: x
+  } = yt({
     id: h
-  }), j = {
-    transform: vt.Transform.toString(r),
-    transition: c
+  }), v = {
+    transform: jt.Transform.toString(r),
+    transition: o
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: e,
-      style: j,
-      className: `${X.product} ${f ? X.dragging : ""}`,
+      style: v,
+      className: `${X.product} ${x ? X.dragging : ""}`,
       ...a,
       ...s,
-      children: i
+      children: n
     }
   );
 }
-const En = (h) => {
+const Rn = (h) => {
   const {
-    isActiveItems: i,
+    isActiveItems: n,
     setIsActiveItems: a,
     items: s,
     setItems: e,
     other: r,
-    tags: c,
-    title: f,
-    subtitle: j,
-    draggable: v = !1,
-    withImage: T = !1,
-    addable: _ = !0,
+    tags: o,
+    title: x,
+    subtitle: v,
+    draggable: b = !1,
+    withImage: M = !1,
+    addable: j = !0,
     itemsOptions: m,
     hasRangeSelector: d = !1,
     rangeSelectorOptions: l,
-    limit: n,
-    autoScrollInterval: o,
-    deletable: C,
-    aspectRatio: y,
-    setAspectRatio: M
-  } = h, U = pt(
+    limit: g,
+    autoScrollInterval: c,
+    deletable: i,
+    aspectRatio: _,
+    setAspectRatio: S
+  } = h, L = pt(
     mt(gt, {
       activationConstraint: {
         distance: 5
       }
     })
-  ), z = (p) => {
-    const { active: S, over: w } = p;
-    if (w && S.id !== w.id) {
-      const O = s.findIndex((q) => q === S.id), N = s.findIndex((q) => q === w.id);
-      if (O !== -1 && N !== -1) {
-        const q = [...s], [I] = q.splice(O, 1);
-        q.splice(N, 0, I), e(q);
+  ), E = (p) => {
+    const { active: w, over: T } = p;
+    if (T && w.id !== T.id) {
+      const $ = s.findIndex((O) => O === w.id), C = s.findIndex((O) => O === T.id);
+      if ($ !== -1 && C !== -1) {
+        const O = [...s], [N] = O.splice($, 1);
+        O.splice(C, 0, N), e(O);
       }
     }
   };
   function K(p) {
-    if (T)
+    if (M)
       return p ? /* @__PURE__ */ t.jsx(
         "img",
         {
@@ -237,7 +237,7 @@ const En = (h) => {
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        b,
+        I,
         {
           name: "Image",
           width: 16,
@@ -246,12 +246,12 @@ const En = (h) => {
         }
       );
   }
-  const g = (p, S = !1) => {
-    const w = m.find((N) => N.id === p);
-    if (!w) return;
-    const O = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      v && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        b,
+  const f = (p, w = !1) => {
+    const T = m.find((C) => C.id === p);
+    if (!T) return;
+    const $ = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      b && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        I,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -262,78 +262,78 @@ const En = (h) => {
       /* @__PURE__ */ t.jsx(
         at,
         {
-          onChange: (N) => {
-            const q = [...s], I = m.find((u) => u.name === N);
-            if (!I) return;
-            const A = I.id, H = q.map((u) => u === p ? A : u);
-            e([...H]);
+          onChange: (C) => {
+            const O = [...s], N = m.find((u) => u.name === C);
+            if (!N) return;
+            const A = N.id, F = O.map((u) => u === p ? A : u);
+            e([...F]);
           },
-          value: w.name,
-          options: m.filter((N) => !s.find((q) => q === N.id)).map((N) => N.name),
-          leftAddonOptions: m.map((N) => ({
-            value: N.name,
-            addon: K(N.images)
+          value: T.name,
+          options: m.filter((C) => !s.find((O) => O === C.id)).map((C) => C.name),
+          leftAddonOptions: m.map((C) => ({
+            value: C.name,
+            addon: K(C.images)
           }))
         }
       ),
-      S && /* @__PURE__ */ t.jsx("div", { className: X.buttons, children: /* @__PURE__ */ t.jsx("div", { className: X.deleteButton, children: /* @__PURE__ */ t.jsx(
-        b,
+      w && /* @__PURE__ */ t.jsx("div", { className: X.buttons, children: /* @__PURE__ */ t.jsx("div", { className: X.deleteButton, children: /* @__PURE__ */ t.jsx(
+        I,
         {
           name: "Trash",
           hoverable: !0,
           width: 20,
           height: 20,
           fill: "#C12A2A",
-          onClick: () => e(s.filter((N) => N !== p))
+          onClick: () => e(s.filter((C) => C !== p))
         }
       ) }) })
     ] });
-    return v ? /* @__PURE__ */ t.jsx(
+    return b ? /* @__PURE__ */ t.jsx(
       me,
       {
         id: p,
-        children: O
+        children: $
       },
       J()
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: X.product,
-        children: O
+        children: $
       },
       J()
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: X.productsBlock, children: [
-    (f || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: X.top, children: [
-      f && /* @__PURE__ */ t.jsx("h3", { className: X.title, children: f }),
-      i !== void 0 && /* @__PURE__ */ t.jsx(
+    (x || n !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: X.top, children: [
+      x && /* @__PURE__ */ t.jsx("h3", { className: X.title, children: x }),
+      n !== void 0 && /* @__PURE__ */ t.jsx(
         lt,
         {
-          current: i,
+          current: n,
           onChange: (p) => a == null ? void 0 : a(p)
         }
       )
     ] }),
-    d && l && /* @__PURE__ */ t.jsx(Pt, { ...l }),
+    d && l && /* @__PURE__ */ t.jsx(wt, { ...l }),
     /* @__PURE__ */ t.jsxs("div", { className: X.products, children: [
-      j && /* @__PURE__ */ t.jsx("h5", { className: X.subtitle, children: j }),
-      v ? /* @__PURE__ */ t.jsx(
+      v && /* @__PURE__ */ t.jsx("h5", { className: X.subtitle, children: v }),
+      b ? /* @__PURE__ */ t.jsx(
         ft,
         {
-          sensors: U,
-          onDragEnd: z,
+          sensors: L,
+          onDragEnd: E,
           children: /* @__PURE__ */ t.jsx(
             xt,
             {
               items: s,
               strategy: _t,
-              children: s.map((p) => g(p, C))
+              children: s.map((p) => f(p, i))
             }
           )
         }
-      ) : s.map((p) => g(p, C)),
-      _ && /* @__PURE__ */ t.jsx(
+      ) : s.map((p) => f(p, i)),
+      j && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -346,22 +346,22 @@ const En = (h) => {
             dt,
             {
               withoutHover: !0,
-              className: F(X.button, {
-                [X.disabled]: !!(n && n <= s.length || s.length === m.length)
+              className: H(X.button, {
+                [X.disabled]: !!(g && g <= s.length || s.length === m.length)
               }),
               size: "s",
-              disabled: !!(n && n <= s.length || s.length === m.length),
+              disabled: !!(g && g <= s.length || s.length === m.length),
               onClick: () => {
                 const p = [...s];
-                let S = null;
+                let w = null;
                 if (m) {
-                  for (let w = 0; w < m.length; w++)
-                    if (!s.find((O) => O === m[w].id)) {
-                      S = m[w];
+                  for (let T = 0; T < m.length; T++)
+                    if (!s.find(($) => $ === m[T].id)) {
+                      w = m[T];
                       break;
                     }
                 }
-                p.push((S == null ? void 0 : S.id) || m[0].id), e(p);
+                p.push((w == null ? void 0 : w.id) || m[0].id), e(p);
               },
               style: {
                 width: "fit-content"
@@ -369,7 +369,7 @@ const En = (h) => {
               children: /* @__PURE__ */ t.jsxs("div", { className: X.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  b,
+                  I,
                   {
                     name: "Plus",
                     width: 16,
@@ -382,21 +382,21 @@ const En = (h) => {
         }
       )
     ] }),
-    y && M && /* @__PURE__ */ t.jsx(
+    _ && S && /* @__PURE__ */ t.jsx(
       at,
       {
-        value: y,
+        value: _,
         label: "Aspect Ratio",
-        options: Object.keys(wt),
-        onChange: (p) => M(p),
-        leftAddonOptions: kt
+        options: Object.keys(kt),
+        onChange: (p) => S(p),
+        leftAddonOptions: Pt
       }
     ),
-    c !== void 0 && /* @__PURE__ */ t.jsx(
+    o !== void 0 && /* @__PURE__ */ t.jsx(
       ht,
       {
         tagsTitle: "Tags",
-        items: c
+        items: o
       }
     ),
     r !== void 0 && /* @__PURE__ */ t.jsx(
@@ -406,13 +406,13 @@ const En = (h) => {
         items: r
       }
     ),
-    o !== void 0 && /* @__PURE__ */ t.jsx(
+    c !== void 0 && /* @__PURE__ */ t.jsx(
       Nt,
       {
         label: "Auto scroll interval",
         type: "number",
-        value: String(o.scrollInterval),
-        onChange: (p) => o.setScrollInterval(Number(p)),
+        value: String(c.scrollInterval),
+        onChange: (p) => c.setScrollInterval(Number(p)),
         min: 0.1,
         max: 100,
         style: {
@@ -422,96 +422,96 @@ const En = (h) => {
       }
     )
   ] });
-}, ge = "_title_roi3a_1", fe = "_subtitle_roi3a_5", xe = "_productsBlock_roi3a_14", _e = "_top_roi3a_26", je = "_products_roi3a_14", ve = "_product_roi3a_14", ye = "_button_roi3a_80", be = "_disabled_roi3a_91", Ie = "_buttons_roi3a_118", Ne = "_addButton_roi3a_164", Ce = "_deleteButton_roi3a_179", Y = {
+}, ge = "_title_roi3a_1", fe = "_subtitle_roi3a_5", xe = "_productsBlock_roi3a_14", _e = "_top_roi3a_26", ye = "_products_roi3a_14", je = "_product_roi3a_14", ve = "_button_roi3a_80", be = "_disabled_roi3a_91", Ie = "_buttons_roi3a_118", Ne = "_addButton_roi3a_164", Ce = "_deleteButton_roi3a_179", Y = {
   title: ge,
   subtitle: fe,
   productsBlock: xe,
   top: _e,
-  products: je,
-  product: ve,
-  button: ye,
+  products: ye,
+  product: je,
+  button: ve,
   disabled: be,
   buttons: Ie,
   addButton: Ne,
   deleteButton: Ce
 };
-function Se({ product: h, children: i }) {
+function Se({ product: h, children: n }) {
   const {
     attributes: a,
     listeners: s,
     setNodeRef: e,
     transform: r,
-    transition: c,
-    isDragging: f
-  } = jt({
+    transition: o,
+    isDragging: x
+  } = yt({
     id: h.id
-  }), j = {
-    transform: vt.Transform.toString(r),
-    transition: c
+  }), v = {
+    transform: jt.Transform.toString(r),
+    transition: o
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: e,
-      style: j,
-      className: `${Y.product} ${f ? Y.dragging : ""}`,
+      style: v,
+      className: `${Y.product} ${x ? Y.dragging : ""}`,
       ...a,
       ...s,
-      children: i
+      children: n
     }
   );
 }
-const zn = (h) => {
+const Ln = (h) => {
   const {
-    isActiveItems: i,
+    isActiveItems: n,
     setIsActiveItems: a,
     items: s,
     setItems: e,
     title: r,
-    subtitle: c,
-    editable: f = !0,
-    draggable: j = !1,
-    deletable: v = !0,
-    addable: T = !0,
-    itemsType: _,
+    subtitle: o,
+    editable: x = !0,
+    draggable: v = !1,
+    deletable: b = !0,
+    addable: M = !0,
+    itemsType: j,
     itemsOptions: m,
     addableOptions: d = {},
     limit: l
-  } = h, [n, o] = x.useState(null), [C, y] = x.useState(null), M = x.useRef(null), U = pt(
+  } = h, [g, c] = y.useState(null), [i, _] = y.useState(null), S = y.useRef(null), L = pt(
     mt(gt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  x.useEffect(() => {
-    if (n) {
-      const p = [...s].map((S) => S.id === n.id ? n : S);
+  y.useEffect(() => {
+    if (g) {
+      const p = [...s].map((w) => w.id === g.id ? g : w);
       e(p);
     }
-  }, [n]), x.useEffect(() => {
-    M.current && C && (M.current.getBoundingClientRect().height, C.top);
-  }, [M.current, C]);
-  const z = (p, S) => {
+  }, [g]), y.useEffect(() => {
+    S.current && i && (S.current.getBoundingClientRect().height, i.top);
+  }, [S.current, i]);
+  const E = (p, w) => {
     p.stopPropagation();
-    const w = p.target.getBoundingClientRect();
-    y({
-      top: w.top + window.scrollY,
-      left: w.left - 30
-    }), o(S);
+    const T = p.target.getBoundingClientRect();
+    _({
+      top: T.top + window.scrollY,
+      left: T.left - 30
+    }), c(w);
   }, K = (p) => {
-    const { active: S, over: w } = p;
-    if (w && S.id !== w.id) {
-      const O = s.findIndex((q) => q.id === S.id), N = s.findIndex((q) => q.id === w.id);
-      if (O !== -1 && N !== -1) {
-        const q = [...s], [I] = q.splice(O, 1);
-        q.splice(N, 0, I), e(q);
+    const { active: w, over: T } = p;
+    if (T && w.id !== T.id) {
+      const $ = s.findIndex((O) => O.id === w.id), C = s.findIndex((O) => O.id === T.id);
+      if ($ !== -1 && C !== -1) {
+        const O = [...s], [N] = O.splice($, 1);
+        O.splice(C, 0, N), e(O);
       }
     }
-  }, g = (p, S) => {
-    const w = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      j && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        b,
+  }, f = (p, w) => {
+    const T = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      v && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        I,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -519,99 +519,99 @@ const zn = (h) => {
           height: 20
         }
       ) }),
-      _ === "select" && m && /* @__PURE__ */ t.jsx(
+      j === "select" && m && /* @__PURE__ */ t.jsx(
         at,
         {
-          onChange: (O) => {
-            const N = [...s], q = m.find((A) => A.name === O);
-            if (!q) return;
-            const I = N.map((A) => A.id === p.id ? {
-              ...q,
+          onChange: ($) => {
+            const C = [...s], O = m.find((A) => A.name === $);
+            if (!O) return;
+            const N = C.map((A) => A.id === p.id ? {
+              ...O,
               name: {
-                "en-US": O
+                "en-US": $
               }
             } : A);
-            o({
+            c({
               ...p,
               name: {
-                "en-US": O
+                "en-US": $
               }
-            }), e([...I]);
+            }), e([...N]);
           },
           value: p.name,
-          options: m.filter((O) => !s.find((N) => N.name === O.name)).map((O) => O.name)
+          options: m.filter(($) => !s.find((C) => C.name === $.name)).map(($) => $.name)
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: Y.buttons, children: [
-        f && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
+        x && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
+          I,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (O) => z(O, p)
+            onClick: ($) => E($, p)
           }
         ) }),
-        v && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
+        b && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
+          I,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => e(s.filter((O) => O.id !== p.id))
+            onClick: () => e(s.filter(($) => $.id !== p.id))
           }
         ) })
       ] })
     ] });
-    return j ? /* @__PURE__ */ t.jsx(
+    return v ? /* @__PURE__ */ t.jsx(
       Se,
       {
         product: p,
-        index: S,
-        children: w
+        index: w,
+        children: T
       },
       p.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: Y.product,
-        children: w
+        children: T
       },
       p.id
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: Y.productsBlock, children: [
-    (r || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Y.top, children: [
+    (r || n !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Y.top, children: [
       r && /* @__PURE__ */ t.jsx("h3", { className: Y.title, children: r }),
-      i !== void 0 && /* @__PURE__ */ t.jsx(
+      n !== void 0 && /* @__PURE__ */ t.jsx(
         lt,
         {
-          current: i,
+          current: n,
           onChange: (p) => a == null ? void 0 : a(p)
         }
       )
     ] }),
     /* @__PURE__ */ t.jsxs("div", { className: Y.products, children: [
-      c && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: c }),
-      j ? /* @__PURE__ */ t.jsx(
+      o && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: o }),
+      v ? /* @__PURE__ */ t.jsx(
         ft,
         {
-          sensors: U,
+          sensors: L,
           onDragEnd: K,
           children: /* @__PURE__ */ t.jsx(
             xt,
             {
               items: s.map((p) => p.id),
               strategy: _t,
-              children: s.map((p, S) => g(p, S))
+              children: s.map((p, w) => f(p, w))
             }
           )
         }
-      ) : s.map((p, S) => g(p, S)),
-      T && /* @__PURE__ */ t.jsx(
+      ) : s.map((p, w) => f(p, w)),
+      M && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -623,24 +623,24 @@ const zn = (h) => {
             dt,
             {
               withoutHover: !0,
-              className: F(Y.button, {
+              className: H(Y.button, {
                 [Y.disabled]: !!(l && l <= s.length || s.length === (m == null ? void 0 : m.length))
               }),
               size: "s",
               disabled: !!(l && l <= s.length || s.length === (m == null ? void 0 : m.length)),
               onClick: () => {
                 const p = [...s];
-                let S = null;
+                let w = null;
                 if (m) {
-                  for (let w = 0; w < m.length; w++)
-                    if (!s.find((O) => O.id === m[w].id)) {
-                      S = m[w];
+                  for (let T = 0; T < m.length; T++)
+                    if (!s.find(($) => $.id === m[T].id)) {
+                      w = m[T];
                       break;
                     }
                 }
-                _ === "select" && m && p.push({
-                  name: S ? S.name : m[0].name,
-                  id: (S == null ? void 0 : S.id) || m[0].id,
+                j === "select" && m && p.push({
+                  name: w ? w.name : m[0].name,
+                  id: (w == null ? void 0 : w.id) || m[0].id,
                   ...d
                 }), e(p);
               },
@@ -650,7 +650,7 @@ const zn = (h) => {
               children: /* @__PURE__ */ t.jsxs("div", { className: Y.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  b,
+                  I,
                   {
                     name: "Plus",
                     width: 16,
@@ -665,99 +665,99 @@ const zn = (h) => {
     ] })
   ] });
 };
-function Pe(h) {
-  const { product: i, children: a } = h, { attributes: s, listeners: e, setNodeRef: r, transform: c, transition: f, isDragging: j } = jt({
-    id: i.id
-  }), v = {
-    transform: vt.Transform.toString(c),
-    transition: f
+function we(h) {
+  const { product: n, children: a } = h, { attributes: s, listeners: e, setNodeRef: r, transform: o, transition: x, isDragging: v } = yt({
+    id: n.id
+  }), b = {
+    transform: jt.Transform.toString(o),
+    transition: x
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: r,
-      style: v,
-      className: `${V.product} ${j ? V.dragging : ""}`,
+      style: b,
+      className: `${V.product} ${v ? V.dragging : ""}`,
       ...s,
       ...e,
       children: a
     }
   );
 }
-const Rn = (h) => {
+const Un = (h) => {
   const {
-    isActiveItems: i,
+    isActiveItems: n,
     setIsActiveItems: a,
     items: s,
     setItems: e,
     other: r,
-    title: c,
-    subtitle: f,
-    editable: j = !0,
-    draggable: v = !1,
-    deletable: T = !0,
-    addable: _ = !0,
+    title: o,
+    subtitle: x,
+    editable: v = !0,
+    draggable: b = !1,
+    deletable: M = !0,
+    addable: j = !0,
     itemsType: m,
     itemsPlaceholder: d = "",
     itemsOptions: l,
-    hasRangeSelector: n = !1,
-    rangeSelectorOptions: o,
-    modalOptions: C,
-    addableOptions: y = {},
-    limit: M
-  } = h, [U, z] = x.useState(null), [K, g] = x.useState({
+    hasRangeSelector: g = !1,
+    rangeSelectorOptions: c,
+    modalOptions: i,
+    addableOptions: _ = {},
+    limit: S
+  } = h, [L, E] = y.useState(null), [K, f] = y.useState({
     top: 0,
     left: 0
-  }), [p, S] = x.useState(null), w = x.useRef(null), [O, N] = x.useState(!1), q = pt(
+  }), [p, w] = y.useState(null), T = y.useRef(null), [$, C] = y.useState(!1), O = pt(
     mt(gt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  x.useEffect(() => {
+  y.useEffect(() => {
     const u = () => {
-      z(null), N(!1);
+      E(null), C(!1);
     };
-    return document.body.addEventListener("click", u), z(null), N(!1), () => {
-      z(null), N(!1), document.body.removeEventListener("click", u);
+    return document.body.addEventListener("click", u), E(null), C(!1), () => {
+      E(null), C(!1), document.body.removeEventListener("click", u);
     };
-  }, []), x.useEffect(() => {
-    if (U) {
-      const u = [...s].map(($) => $.id === U.id ? U : $);
+  }, []), y.useEffect(() => {
+    if (L) {
+      const u = [...s].map((q) => q.id === L.id ? L : q);
       e(u);
     }
-  }, [U]), x.useEffect(() => {
-    if (w.current && p) {
-      const u = w.current.getBoundingClientRect().height, $ = window.innerHeight;
+  }, [L]), y.useEffect(() => {
+    if (T.current && p) {
+      const u = T.current.getBoundingClientRect().height, q = window.innerHeight;
       let P = p.top;
-      P + u > $ + window.scrollY - 200 && (P = $ + window.scrollY - u - 200), P < 0 && (P = 10), g({
+      P + u > q + window.scrollY - 200 && (P = q + window.scrollY - u - 200), P < 0 && (P = 10), f({
         top: P,
         left: p.left
       });
     }
-  }, [w.current, p]);
-  const I = (u, $) => {
+  }, [T.current, p]);
+  const N = (u, q) => {
     u.stopPropagation();
     const P = u.target.getBoundingClientRect();
-    S({
+    w({
       top: P.top + window.scrollY,
       left: P.left - 30
-    }), z($), N(!0);
+    }), E(q), C(!0);
   }, A = (u) => {
-    const { active: $, over: P } = u;
-    if (P && $.id !== P.id) {
-      const D = s.findIndex((R) => R.id === $.id), et = s.findIndex((R) => R.id === P.id);
+    const { active: q, over: P } = u;
+    if (P && q.id !== P.id) {
+      const D = s.findIndex((U) => U.id === q.id), et = s.findIndex((U) => U.id === P.id);
       if (D !== -1 && et !== -1) {
-        const R = [...s], [Z] = R.splice(D, 1);
-        R.splice(et, 0, Z), e(R);
+        const U = [...s], [Z] = U.splice(D, 1);
+        U.splice(et, 0, Z), e(U);
       }
     }
-  }, H = (u) => {
+  }, F = (u) => {
     var P;
-    const $ = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      v && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        b,
+    const q = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      b && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        I,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -769,18 +769,18 @@ const Rn = (h) => {
         at,
         {
           onChange: (D) => {
-            const R = [...s].map((Z) => Z.id === u.id ? {
+            const U = [...s].map((Z) => Z.id === u.id ? {
               ...u,
               name: {
                 "en-US": D
               }
             } : Z);
-            z({
+            E({
               ...u,
               name: {
                 "en-US": D
               }
-            }), e([...R]);
+            }), e([...U]);
           },
           value: u.name["en-US"],
           options: l.filter(
@@ -792,13 +792,13 @@ const Rn = (h) => {
         Nt,
         {
           onChange: (D) => {
-            const R = [...s].map((Z) => Z.id === u.id ? {
+            const U = [...s].map((Z) => Z.id === u.id ? {
               ...u,
               name: {
                 "en-US": D
               }
             } : Z);
-            e([...R]);
+            e([...U]);
           },
           value: u.name["en-US"],
           placeholder: d
@@ -808,28 +808,28 @@ const Rn = (h) => {
         At,
         {
           onChange: (D) => {
-            const R = [...s].map((Z) => Z.id === u.id ? {
+            const U = [...s].map((Z) => Z.id === u.id ? {
               ...u,
               images: D
             } : Z);
-            e([...R]);
+            e([...U]);
           },
           activeImage: (P = s.find((D) => D.id === u.id)) == null ? void 0 : P.images[0]
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: V.buttons, children: [
-        j && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
+        v && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
+          I,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (D) => I(D, u)
+            onClick: (D) => N(D, u)
           }
         ) }),
-        T && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
+        M && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
+          I,
           {
             name: "Trash",
             hoverable: !0,
@@ -841,63 +841,63 @@ const Rn = (h) => {
         ) })
       ] })
     ] });
-    return v ? /* @__PURE__ */ t.jsx(
-      Pe,
+    return b ? /* @__PURE__ */ t.jsx(
+      we,
       {
         product: u,
-        children: $
+        children: q
       },
       u.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: V.product,
-        children: $
+        children: q
       },
       u.id
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: V.productsBlock, children: [
-    (c || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
-      c && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: c }),
-      i !== void 0 && /* @__PURE__ */ t.jsx(
+    (o || n !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
+      o && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: o }),
+      n !== void 0 && /* @__PURE__ */ t.jsx(
         lt,
         {
-          current: i,
+          current: n,
           onChange: (u) => a == null ? void 0 : a(u)
         }
       )
     ] }),
-    U && j && C && O && /* @__PURE__ */ t.jsx(
-      qt,
+    L && v && i && $ && /* @__PURE__ */ t.jsx(
+      Ot,
       {
-        ref: w,
-        activeItem: U,
-        setActiveItem: z,
+        ref: T,
+        activeItem: L,
+        setActiveItem: E,
         popupPosition: K,
-        modalOptions: C,
-        setIsOpenModal: N
+        modalOptions: i,
+        setIsOpenModal: C
       }
     ),
-    n && o && /* @__PURE__ */ t.jsx(Pt, { ...o }),
+    g && c && /* @__PURE__ */ t.jsx(wt, { ...c }),
     /* @__PURE__ */ t.jsxs("div", { className: V.products, children: [
-      f && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: f }),
-      v ? /* @__PURE__ */ t.jsx(
+      x && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: x }),
+      b ? /* @__PURE__ */ t.jsx(
         ft,
         {
-          sensors: q,
+          sensors: O,
           onDragEnd: A,
           children: /* @__PURE__ */ t.jsx(
             xt,
             {
               items: s.map((u) => u.id),
               strategy: _t,
-              children: s.map((u) => H(u))
+              children: s.map((u) => F(u))
             }
           )
         }
-      ) : s.map((u) => H(u)),
-      _ && /* @__PURE__ */ t.jsx(
+      ) : s.map((u) => F(u)),
+      j && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -909,27 +909,27 @@ const Rn = (h) => {
             dt,
             {
               withoutHover: !0,
-              className: F(V.button, {
-                [V.disabled]: !!(M && M <= s.length)
+              className: H(V.button, {
+                [V.disabled]: !!(S && S <= s.length)
               }),
               size: "s",
-              disabled: !!(M && M <= s.length),
+              disabled: !!(S && S <= s.length),
               onClick: () => {
                 const u = [...s];
-                let $ = null;
+                let q = null;
                 if (l) {
                   for (let P = 0; P < l.length; P++)
                     if (!s.find((D) => D.name["en-US"] === l[P])) {
-                      $ = l[P];
+                      q = l[P];
                       break;
                     }
                 }
                 m === "select" && l ? u.push({
                   name: {
-                    "en-US": $ || l[0]
+                    "en-US": q || l[0]
                   },
                   id: J(),
-                  ...y,
+                  ..._,
                   maxSymbols: 100
                   // пример значения
                 }) : m === "input" ? u.push({
@@ -937,14 +937,14 @@ const Rn = (h) => {
                     "en-US": ""
                   },
                   id: J(),
-                  ...y,
+                  ..._,
                   maxSymbols: 100
                 }) : u.push({
                   name: {
                     "en-US": `Image ${s.length + 1}`
                   },
                   id: J(),
-                  ...y,
+                  ..._,
                   maxSymbols: 100
                 }), e(u);
               },
@@ -954,7 +954,7 @@ const Rn = (h) => {
               children: /* @__PURE__ */ t.jsxs("div", { className: V.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  b,
+                  I,
                   {
                     name: "Plus",
                     width: 16,
@@ -975,52 +975,52 @@ const Rn = (h) => {
       }
     )
   ] });
-}, ke = "_subtitle_jql1y_1", we = "_products_jql1y_10", Te = "_product_jql1y_10", Me = "_button_jql1y_11", Be = "_buttons_jql1y_11", $e = "_addButton_jql1y_150", Oe = "_deleteButton_jql1y_165", st = {
-  subtitle: ke,
-  products: we,
+}, Pe = "_subtitle_jql1y_1", ke = "_products_jql1y_10", Te = "_product_jql1y_10", Me = "_button_jql1y_11", Be = "_buttons_jql1y_11", qe = "_addButton_jql1y_150", $e = "_deleteButton_jql1y_165", st = {
+  subtitle: Pe,
+  products: ke,
   product: Te,
   button: Me,
   buttons: Be,
-  addButton: $e,
-  deleteButton: Oe
-}, qe = (h) => {
-  const { buttons: i, setButtons: a, deletable: s = !0, addable: e = !0, editableLink: r = !0 } = h, { pages: c } = yt(), [f, j] = x.useState(null), [v, T] = x.useState({
+  addButton: qe,
+  deleteButton: $e
+}, Oe = (h) => {
+  const { buttons: n, setButtons: a, deletable: s = !0, addable: e = !0, editableLink: r = !0 } = h, { pages: o } = vt(), [x, v] = y.useState(null), [b, M] = y.useState({
     top: 0,
     left: 0
-  }), [_, m] = x.useState(null), d = x.useRef(null);
-  x.useEffect(() => {
-    if (f) {
-      const o = [...i].map((C) => C.id === f.id ? f : C);
-      a(o);
+  }), [j, m] = y.useState(null), d = y.useRef(null);
+  y.useEffect(() => {
+    if (x) {
+      const c = [...n].map((i) => i.id === x.id ? x : i);
+      a(c);
     }
-  }, [f]), x.useEffect(() => {
-    if (d.current && _) {
-      const o = d.current.getBoundingClientRect().height, C = window.innerHeight;
-      let y = _.top;
-      y + o > C + window.scrollY - 200 && (y = C + window.scrollY - o - 200), y < 0 && (y = 10), T({
-        top: y,
-        left: _.left
+  }, [x]), y.useEffect(() => {
+    if (d.current && j) {
+      const c = d.current.getBoundingClientRect().height, i = window.innerHeight;
+      let _ = j.top;
+      _ + c > i + window.scrollY - 200 && (_ = i + window.scrollY - c - 200), _ < 0 && (_ = 10), M({
+        top: _,
+        left: j.left
       });
     }
-  }, [d.current, _]);
-  const l = (o, C) => {
-    o.stopPropagation();
-    const y = o.target.getBoundingClientRect();
+  }, [d.current, j]);
+  const l = (c, i) => {
+    c.stopPropagation();
+    const _ = c.target.getBoundingClientRect();
     m({
-      top: y.top + window.scrollY - 70,
-      left: y.left - (e ? 30 : 65)
-    }), j(C);
-  }, n = (o, C) => {
-    const y = [...i], M = {
-      ...o,
+      top: _.top + window.scrollY - 70,
+      left: _.left - (e ? 30 : 65)
+    }), v(i);
+  }, g = (c, i) => {
+    const _ = [...n], S = {
+      ...c,
       id: Math.random().toString(36).substr(2, 9)
       // Генерируем новый уникальный ID
     };
-    y.splice(C + 1, 0, M), a(y);
+    _.splice(i + 1, 0, S), a(_);
   };
   return /* @__PURE__ */ t.jsxs("div", { className: st.products, children: [
     /* @__PURE__ */ t.jsx("h5", { className: st.subtitle, children: "Button Type" }),
-    i.map((o, C) => /* @__PURE__ */ t.jsxs(
+    n.map((c, i) => /* @__PURE__ */ t.jsxs(
       "div",
       {
         className: st.product,
@@ -1028,50 +1028,50 @@ const Rn = (h) => {
           /* @__PURE__ */ t.jsx(
             at,
             {
-              onChange: (y) => {
-                const U = [...i].map((z) => z.id === o.id ? {
-                  ...o,
-                  type: y
-                } : z);
-                a(U);
+              onChange: (_) => {
+                const L = [...n].map((E) => E.id === c.id ? {
+                  ...c,
+                  type: _
+                } : E);
+                a(L);
               },
-              value: o.type,
+              value: c.type,
               options: ["Primary", "Secondary", "Tertiary"]
             }
           ),
           /* @__PURE__ */ t.jsxs("div", { className: st.buttons, children: [
             /* @__PURE__ */ t.jsx("div", { className: st.deleteButton, children: /* @__PURE__ */ t.jsx(
-              b,
+              I,
               {
                 name: "Copy",
                 hoverable: !0,
                 width: 20,
                 height: 20,
                 onClick: () => {
-                  n(o, C);
+                  g(c, i);
                 }
               }
             ) }),
             /* @__PURE__ */ t.jsx("div", { className: st.deleteButton, children: /* @__PURE__ */ t.jsx(
-              b,
+              I,
               {
                 name: "Sliders",
                 hoverable: !0,
                 width: 20,
                 height: 20,
-                onClick: (y) => {
-                  l(y, o);
+                onClick: (_) => {
+                  l(_, c);
                 }
               }
             ) }),
             s && /* @__PURE__ */ t.jsx("div", { className: st.deleteButton, children: /* @__PURE__ */ t.jsx(
-              b,
+              I,
               {
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const y = i.filter((M) => M.id !== o.id);
-                  a(y);
+                  const _ = n.filter((S) => S.id !== c.id);
+                  a(_);
                 },
                 width: 20,
                 height: 20,
@@ -1081,15 +1081,15 @@ const Rn = (h) => {
           ] })
         ]
       },
-      o.id
+      c.id
     )),
-    f && /* @__PURE__ */ t.jsx(
+    x && /* @__PURE__ */ t.jsx(
       Dt,
       {
         ref: d,
-        activeButton: f,
-        setActiveButton: j,
-        popupPosition: v,
+        activeButton: x,
+        setActiveButton: v,
+        popupPosition: b,
         editableLink: r
       }
     ),
@@ -1108,8 +1108,8 @@ const Rn = (h) => {
             className: st.button,
             size: "s",
             onClick: () => {
-              const o = [...i];
-              r ? o.push({
+              const c = [...n];
+              r ? c.push({
                 type: "Primary",
                 id: J(),
                 typesText: [],
@@ -1117,9 +1117,9 @@ const Rn = (h) => {
                   "en-US": "Button Name"
                 },
                 destination: "Go to Page",
-                page: c ? Object.values(c)[0].path : "/",
+                page: o ? Object.values(o)[0].path : "/",
                 openInNewTab: !1
-              }) : o.push({
+              }) : c.push({
                 type: "Primary",
                 id: J(),
                 typesText: [],
@@ -1127,9 +1127,9 @@ const Rn = (h) => {
                   "en-US": "Create Ticket"
                 },
                 destination: "Go to Page",
-                page: c ? Object.values(c)[0].path : "/",
+                page: o ? Object.values(o)[0].path : "/",
                 openInNewTab: !1
-              }), a(o);
+              }), a(c);
             },
             style: {
               width: "fit-content"
@@ -1137,7 +1137,7 @@ const Rn = (h) => {
             children: /* @__PURE__ */ t.jsxs("div", { className: st.addButton, children: [
               /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
               /* @__PURE__ */ t.jsx(
-                b,
+                I,
                 {
                   name: "Plus",
                   width: 16,
@@ -1150,15 +1150,15 @@ const Rn = (h) => {
       }
     )
   ] });
-}, Ln = (h) => {
+}, zn = (h) => {
   const {
-    isActiveButtons: i,
+    isActiveButtons: n,
     setIsActiveButtons: a,
     buttons: s,
     setButtons: e,
     editableLink: r = !0,
-    addable: c = !0,
-    deletable: f = !0
+    addable: o = !0,
+    deletable: x = !0
   } = h;
   return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: bt.buttonsBlock, children: [
     /* @__PURE__ */ t.jsxs("div", { className: bt.top, children: [
@@ -1166,107 +1166,107 @@ const Rn = (h) => {
       /* @__PURE__ */ t.jsx(
         lt,
         {
-          current: i,
-          onChange: (j) => a(j)
+          current: n,
+          onChange: (v) => a(v)
         }
       )
     ] }),
-    i && /* @__PURE__ */ t.jsx(
-      qe,
+    n && /* @__PURE__ */ t.jsx(
+      Oe,
       {
         buttons: s,
         setButtons: e,
         editableLink: r,
-        addable: c,
-        deletable: f
+        addable: o,
+        deletable: x
       }
     )
   ] }) });
 };
 function Ae(h) {
-  const { product: i, children: a } = h, { attributes: s, listeners: e, setNodeRef: r, transform: c, transition: f, isDragging: j } = jt({
-    id: String(i.listingId)
-  }), v = {
-    transform: vt.Transform.toString(c),
-    transition: f
+  const { product: n, children: a } = h, { attributes: s, listeners: e, setNodeRef: r, transform: o, transition: x, isDragging: v } = yt({
+    id: String(n.listingId)
+  }), b = {
+    transform: jt.Transform.toString(o),
+    transition: x
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: r,
-      style: v,
-      className: `${W.product} ${j ? W.dragging : ""}`,
+      style: b,
+      className: `${W.product} ${v ? W.dragging : ""}`,
       ...s,
       ...e,
       children: a
     }
   );
 }
-const Un = (h) => {
+const Fn = (h) => {
   const {
-    isActiveItems: i,
+    isActiveItems: n,
     setIsActiveItems: a,
     items: s,
     setItems: e,
     other: r,
-    title: c,
-    subtitle: f,
-    editable: j = !0,
-    draggable: v = !1,
-    withImage: T = !1,
-    deletable: _ = !0,
+    title: o,
+    subtitle: x,
+    editable: v = !0,
+    draggable: b = !1,
+    withImage: M = !1,
+    deletable: j = !0,
     addable: m = !0,
     itemsType: d,
     itemsOptions: l,
-    limit: n,
-    aspectRatio: o,
-    setAspectRatio: C
-  } = h, [y, M] = x.useState(
+    limit: g,
+    aspectRatio: c,
+    setAspectRatio: i
+  } = h, [_, S] = y.useState(
     null
-  ), [U, z] = x.useState({
+  ), [L, E] = y.useState({
     top: 0,
     left: 0
-  }), [K, g] = x.useState(!1), p = pt(
+  }), [K, f] = y.useState(!1), p = pt(
     mt(gt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  x.useEffect(() => {
-    const I = () => {
-      M(null), g(!1);
+  y.useEffect(() => {
+    const N = () => {
+      S(null), f(!1);
     };
-    return document.body.addEventListener("click", I), M(null), g(!1), () => {
-      M(null), g(!1), document.body.removeEventListener("click", I);
+    return document.body.addEventListener("click", N), S(null), f(!1), () => {
+      S(null), f(!1), document.body.removeEventListener("click", N);
     };
-  }, []), x.useEffect(() => {
-    if (y) {
-      const I = [...s].map((A) => A.listingId === y.listingId ? y : A);
-      e(I);
+  }, []), y.useEffect(() => {
+    if (_) {
+      const N = [...s].map((A) => A.listingId === _.listingId ? _ : A);
+      e(N);
     }
-  }, [y]);
-  const S = (I, A) => {
-    I.stopPropagation();
-    const H = I.target.getBoundingClientRect(), u = 100, $ = window.innerHeight;
-    let P = H.top + window.scrollY;
-    P + u > $ && (P = $ - u - 20), g(!0), z({
+  }, [_]);
+  const w = (N, A) => {
+    N.stopPropagation();
+    const F = N.target.getBoundingClientRect(), u = 100, q = window.innerHeight;
+    let P = F.top + window.scrollY;
+    P + u > q && (P = q - u - 20), f(!0), E({
       top: P - 80,
-      left: H.left - 30
-    }), M(A);
+      left: F.left - 30
+    }), S(A);
   };
-  function w(I) {
-    if (T)
-      return I ? /* @__PURE__ */ t.jsx(
+  function T(N) {
+    if (M)
+      return N ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${I}/w=1000`,
+          src: `https://imagedelivery.net/${N}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        b,
+        I,
         {
           name: "Image",
           width: 16,
@@ -1275,21 +1275,21 @@ const Un = (h) => {
         }
       );
   }
-  const O = (I) => {
-    const { active: A, over: H } = I;
-    if (H && A.id !== H.id) {
-      const u = s.findIndex((P) => String(P.listingId) === A.id), $ = s.findIndex((P) => String(P.listingId) === H.id);
-      if (u !== -1 && $ !== -1) {
+  const $ = (N) => {
+    const { active: A, over: F } = N;
+    if (F && A.id !== F.id) {
+      const u = s.findIndex((P) => String(P.listingId) === A.id), q = s.findIndex((P) => String(P.listingId) === F.id);
+      if (u !== -1 && q !== -1) {
         const P = [...s], [D] = P.splice(u, 1);
-        P.splice($, 0, D), e(P);
+        P.splice(q, 0, D), e(P);
       }
     }
-  }, N = (I) => {
-    const A = l.find((u) => I.listingId === u.id);
+  }, C = (N) => {
+    const A = l.find((u) => N.listingId === u.id);
     if (!A) return null;
-    const H = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      v && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        b,
+    const F = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      b && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        I,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -1301,106 +1301,106 @@ const Un = (h) => {
         at,
         {
           onChange: (u) => {
-            const $ = [...s], P = l.find((R) => R.productData.name === u);
+            const q = [...s], P = l.find((U) => U.productData.name === u);
             if (!P) return;
             const D = {
               listingId: P.id,
               image: P.productData.images.length > 0 ? P.productData.images[0].cfId : ""
-            }, et = $.map((R) => R.listingId === I.listingId ? D : R);
-            M(D), e([...et]);
+            }, et = q.map((U) => U.listingId === N.listingId ? D : U);
+            S(D), e([...et]);
           },
           value: A.productData.name,
           options: [
-            ...l.filter((u) => !s.find(($) => $.listingId === u.id)).map((u) => u.productData.name)
+            ...l.filter((u) => !s.find((q) => q.listingId === u.id)).map((u) => u.productData.name)
           ],
           leftAddonOptions: l.map((u) => {
-            var $;
+            var q;
             return {
               value: u.productData.name,
-              addon: w((($ = u.productData.images[0]) == null ? void 0 : $.cfId) || "")
+              addon: T(((q = u.productData.images[0]) == null ? void 0 : q.cfId) || "")
             };
           })
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: W.buttons, children: [
-        j && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
+        v && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
+          I,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (u) => S(u, I)
+            onClick: (u) => w(u, N)
           }
         ) }),
-        _ && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
+        j && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
+          I,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => e(s.filter((u) => u !== I))
+            onClick: () => e(s.filter((u) => u !== N))
           }
         ) })
       ] })
     ] });
-    return v ? /* @__PURE__ */ t.jsx(
+    return b ? /* @__PURE__ */ t.jsx(
       Ae,
       {
-        product: I,
-        children: H
+        product: N,
+        children: F
       },
-      I.listingId
+      N.listingId
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: W.product,
-        children: H
+        children: F
       },
-      I.listingId
+      N.listingId
     );
-  }, q = x.useRef(null);
+  }, O = y.useRef(null);
   return /* @__PURE__ */ t.jsxs("div", { className: W.productsBlock, children: [
-    (c || i !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: W.top, children: [
-      c && /* @__PURE__ */ t.jsx("h3", { className: W.title, children: c }),
-      i !== void 0 && /* @__PURE__ */ t.jsx(
+    (o || n !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: W.top, children: [
+      o && /* @__PURE__ */ t.jsx("h3", { className: W.title, children: o }),
+      n !== void 0 && /* @__PURE__ */ t.jsx(
         lt,
         {
-          current: i,
-          onChange: (I) => a == null ? void 0 : a(I)
+          current: n,
+          onChange: (N) => a == null ? void 0 : a(N)
         }
       )
     ] }),
-    K && y && /* @__PURE__ */ t.jsx(
+    K && _ && /* @__PURE__ */ t.jsx(
       Et,
       {
-        ref: q,
-        activeItem: y,
-        setActiveItem: M,
-        setIsOpenModal: g,
-        popupPosition: U,
+        ref: O,
+        activeItem: _,
+        setActiveItem: S,
+        setIsOpenModal: f,
+        popupPosition: L,
         itemsOptions: l
       }
     ),
-    i && /* @__PURE__ */ t.jsxs("div", { className: W.products, children: [
-      f && /* @__PURE__ */ t.jsx("h5", { className: W.subtitle, children: f }),
-      v ? /* @__PURE__ */ t.jsx(
+    n && /* @__PURE__ */ t.jsxs("div", { className: W.products, children: [
+      x && /* @__PURE__ */ t.jsx("h5", { className: W.subtitle, children: x }),
+      b ? /* @__PURE__ */ t.jsx(
         ft,
         {
           sensors: p,
-          onDragEnd: O,
+          onDragEnd: $,
           children: /* @__PURE__ */ t.jsx(
             xt,
             {
-              items: s.map((I) => String(I.listingId)),
+              items: s.map((N) => String(N.listingId)),
               strategy: _t,
-              children: s.map((I) => N(I))
+              children: s.map((N) => C(N))
             }
           )
         }
-      ) : s.map((I) => N(I)),
+      ) : s.map((N) => C(N)),
       m && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -1416,25 +1416,25 @@ const Un = (h) => {
               className: W.button,
               size: "s",
               onClick: () => {
-                const I = [...s];
+                const N = [...s];
                 for (let A = 0; A < l.length; A++)
-                  if (!s.find((H) => H.listingId === l[A].id)) {
-                    I.push({
+                  if (!s.find((F) => F.listingId === l[A].id)) {
+                    N.push({
                       listingId: l[A].id,
                       image: l[A].productData.images.length > 0 ? l[A].productData.images[0].cfId : ""
                     });
                     break;
                   }
-                e(I);
+                e(N);
               },
-              disabled: s.length === (n || l.length),
+              disabled: s.length === (g || l.length),
               style: {
                 width: "fit-content"
               },
               children: /* @__PURE__ */ t.jsxs("div", { className: W.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  b,
+                  I,
                   {
                     name: "Plus",
                     width: 16,
@@ -1447,16 +1447,16 @@ const Un = (h) => {
         }
       )
     ] }),
-    o && C && /* @__PURE__ */ t.jsx(
+    c && i && /* @__PURE__ */ t.jsx(
       at,
       {
-        value: o,
-        options: Object.keys(wt),
-        onChange: (I) => C(I),
-        leftAddonOptions: kt
+        value: c,
+        options: Object.keys(kt),
+        onChange: (N) => i(N),
+        leftAddonOptions: Pt
       }
     ),
-    i && r !== void 0 && /* @__PURE__ */ t.jsx(
+    n && r !== void 0 && /* @__PURE__ */ t.jsx(
       ht,
       {
         otherTitle: "Other",
@@ -1464,15 +1464,15 @@ const Un = (h) => {
       }
     )
   ] });
-}, De = "_options_167h8_1", Ee = "_price_167h8_18", ze = "_oldPrice_167h8_25", Re = "_newPrice_167h8_33", Le = "_animate_167h8_40", Ue = "_meta_167h8_58", He = "_info_167h8_64", Fe = "_infoRight_167h8_73", Ve = "_buttons_167h8_80", Ye = "_variants_167h8_87", Ge = "_variant_167h8_87", We = "_stock_167h8_105", Xe = "_variantInfo_167h8_112", Qe = "_quantity_167h8_119", Je = "_button_167h8_80", Ke = "_activeVariant_167h8_165", Ze = "_chargeTypes_167h8_169", ts = "_charge_167h8_169", es = "_chargeActive_167h8_194", ss = "_title_167h8_202", B = {
+}, De = "_options_wqtfh_1", Ee = "_price_wqtfh_18", Re = "_oldPrice_wqtfh_25", Le = "_newPrice_wqtfh_34", Ue = "_animate_wqtfh_42", ze = "_meta_wqtfh_60", Fe = "_info_wqtfh_66", He = "_infoRight_wqtfh_75", Ve = "_buttons_wqtfh_82", Ye = "_variants_wqtfh_89", Ge = "_variant_wqtfh_89", We = "_stock_wqtfh_107", Xe = "_variantInfo_wqtfh_114", Qe = "_quantity_wqtfh_121", Je = "_button_wqtfh_82", Ke = "_activeVariant_wqtfh_167", Ze = "_chargeTypes_wqtfh_171", ts = "_charge_wqtfh_171", es = "_chargeActive_wqtfh_196", ss = "_title_wqtfh_204", B = {
   options: De,
   price: Ee,
-  oldPrice: ze,
-  newPrice: Re,
-  animate: Le,
-  meta: Ue,
-  info: He,
-  infoRight: Fe,
+  oldPrice: Re,
+  newPrice: Le,
+  animate: Ue,
+  meta: ze,
+  info: Fe,
+  infoRight: He,
   buttons: Ve,
   variants: Ye,
   variant: Ge,
@@ -1486,160 +1486,181 @@ const Un = (h) => {
   chargeActive: es,
   title: ss
 };
-var $t = /* @__PURE__ */ ((h) => (h.ONE_TIME = "One-Time", h.RECURRING = "Subscribe & Save", h))($t || {});
+var qt = /* @__PURE__ */ ((h) => (h.ONE_TIME = "One-Time", h.RECURRING = "Subscribe & Save", h))(qt || {});
 const ns = (h) => {
-  var z, K;
-  const { product: i, setIsOpen: a } = h, { variants: s } = i, [e, r] = x.useState(s[0]), [c, f] = x.useState(
+  var E, K;
+  const { product: n, setIsOpen: a } = h, { variants: s } = n, [e, r] = y.useState(s[0]), [o, x] = y.useState(
     e.chargeTypes ? e.chargeTypes[0] : "ONE_TIME"
-  ), { notifications: j, setNotifications: v } = Ct(), T = St(), [_, m] = x.useState(1), { cart: d, reset: l, addProductToCart: n } = ot(), [o, C] = x.useState(!1);
-  x.useEffect(() => {
-    C(!0);
-    const g = setTimeout(() => C(!1), 600);
-    return () => clearTimeout(g);
-  }, [_]);
-  async function y() {
+  ), { notifications: v, setNotifications: b } = Ct(), M = St(), [j, m] = y.useState(1), { cart: d, reset: l, addProductToCart: g } = ct(), [c, i] = y.useState(!1);
+  y.useEffect(() => {
+    i(!0);
+    const f = setTimeout(() => i(!1), 600);
+    return () => clearTimeout(f);
+  }, [j]);
+  async function _() {
     try {
-      n({
-        productId: i.id,
+      g({
+        productId: n.id,
         productVariantId: e.id,
-        chargeType: c,
-        quantity: _
-      }), v([
-        ...j,
+        chargeType: o,
+        quantity: j
+      }), b([
+        ...v,
         {
           id: J(),
           message: "Product added to cart",
           status: "success"
         }
       ]);
-    } catch (g) {
-      v([
-        ...j,
+    } catch (f) {
+      b([
+        ...v,
         {
           id: J(),
-          message: `Product failed to add to cart: ${g}`,
+          message: `Product failed to add to cart: ${f}`,
           status: "error"
         }
       ]);
     }
     a == null || a(!1);
   }
-  function M() {
-    l(), y(), T("/checkout");
+  function S() {
+    l(), _(), M("/checkout");
   }
-  function U(g) {
-    if (g >= 864e5) {
-      const N = Math.floor(g / 864e5);
-      return `${N} ${N === 1 ? "day" : "days"}`;
-    } else if (g >= 36e5) {
-      const N = Math.floor(g / 36e5);
-      return `${N} ${N === 1 ? "hour" : "hours"}`;
-    } else if (g >= 6e4) {
-      const N = Math.floor(g / 6e4);
-      return `${N} ${N === 1 ? "minute" : "minutes"}`;
+  function L(f) {
+    if (f >= 864e5) {
+      const C = Math.floor(f / 864e5);
+      return `${C} ${C === 1 ? "day" : "days"}`;
+    } else if (f >= 36e5) {
+      const C = Math.floor(f / 36e5);
+      return `${C} ${C === 1 ? "hour" : "hours"}`;
+    } else if (f >= 6e4) {
+      const C = Math.floor(f / 6e4);
+      return `${C} ${C === 1 ? "minute" : "minutes"}`;
     } else {
-      const N = Math.floor(g / 1e3);
-      return `${N} ${N === 1 ? "second" : "seconds"}`;
+      const C = Math.floor(f / 1e3);
+      return `${C} ${C === 1 ? "second" : "seconds"}`;
     }
   }
-  return x.useEffect(() => {
+  return y.useEffect(() => {
     e.quantity && e.quantity.available === 0 ? m(0) : m(1);
-  }, [e.quantity.available]), x.useEffect(() => {
-    e.chargeTypes && f(
-      e.chargeTypes.includes(c) ? c : e.chargeTypes[0]
+  }, [e.quantity.available]), y.useEffect(() => {
+    e.chargeTypes && x(
+      e.chargeTypes.includes(o) ? o : e.chargeTypes[0]
     );
   }, [e.chargeTypes]), /* @__PURE__ */ t.jsxs("div", { className: B.options, children: [
-    e.chargeTypes && e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: B.chargeTypes, children: e.chargeTypes.map((g) => /* @__PURE__ */ t.jsx(
+    e.chargeTypes && e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: B.chargeTypes, children: e.chargeTypes.map((f) => /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: F(B.charge, {
-          [B.chargeActive]: c === g
+        className: H(B.charge, {
+          [B.chargeActive]: o === f
         }),
-        onClick: () => f(g),
-        children: $t[g]
+        onClick: () => x(f),
+        children: qt[f]
       },
-      g
+      f
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: B.variants, children: s.filter((g) => {
+    /* @__PURE__ */ t.jsx("div", { className: B.variants, children: s.filter((f) => {
       var p;
-      return (p = g.chargeTypes) == null ? void 0 : p.includes(c);
-    }).map((g) => {
-      var p, S;
+      return (p = f.chargeTypes) == null ? void 0 : p.includes(o);
+    }).map((f) => {
+      var p, w;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
-          className: F(B.variant, {
-            [B.activeVariant]: e.id === g.id
+          className: H(B.variant, {
+            [B.activeVariant]: e.id === f.id
           }),
-          onClick: () => r(g),
+          onClick: () => r(f),
           children: [
             /* @__PURE__ */ t.jsxs("div", { className: B.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: B.title, children: it(g.name) }),
-              /* @__PURE__ */ t.jsxs("span", { children: [
+              /* @__PURE__ */ t.jsx(
+                "span",
+                {
+                  className: B.title,
+                  id: "h4",
+                  children: it(f.name)
+                }
+              ),
+              /* @__PURE__ */ t.jsxs("span", { id: "md", children: [
                 Q({
-                  amount: c === "ONE_TIME" ? g.price.amount : g.subscriptionSettings ? g.subscriptionSettings.price.amount : 0,
-                  currency: c === "ONE_TIME" ? g.price.currency : g.subscriptionSettings ? g.subscriptionSettings.price.currency : "USD"
+                  amount: o === "ONE_TIME" ? f.price.amount : f.subscriptionSettings ? f.subscriptionSettings.price.amount : 0,
+                  currency: o === "ONE_TIME" ? f.price.currency : f.subscriptionSettings ? f.subscriptionSettings.price.currency : "USD"
                 }),
                 " ",
-                c === "RECURRING" && g.subscriptionSettings && ` / ${zt(g.subscriptionSettings.recurringIntervalDays || 0)}`
+                o === "RECURRING" && f.subscriptionSettings && ` / ${Rt(f.subscriptionSettings.recurringIntervalDays || 0)}`
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx("div", { children: c === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: B.stock, children: [
-              (p = g.quantity.restrictions) != null && p.max || g.quantity.available !== void 0 ? ((S = g.quantity.restrictions) == null ? void 0 : S.max) || g.quantity.available : "∞",
-              " ",
-              "in stock"
-            ] }) })
+            /* @__PURE__ */ t.jsx("div", { id: "md", children: o === "ONE_TIME" && /* @__PURE__ */ t.jsxs(
+              "span",
+              {
+                className: B.stock,
+                id: "md",
+                children: [
+                  (p = f.quantity.restrictions) != null && p.max || f.quantity.available !== void 0 ? ((w = f.quantity.restrictions) == null ? void 0 : w.max) || f.quantity.available : "∞",
+                  " ",
+                  "in stock"
+                ]
+              }
+            ) })
           ]
         },
-        g.id
+        f.id
       );
     }) }),
-    c === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: B.quantity, children: [
-      /* @__PURE__ */ t.jsx(
-        E,
-        {
-          type: "Secondary",
-          onClick: () => {
-            _ > 1 ? m((g) => g - 1) : m(1);
-          },
-          className: B.button,
-          disabled: e.quantity.available && e.quantity.restrictions && _ <= e.quantity.restrictions.min || e.quantity.available === 0,
-          children: /* @__PURE__ */ t.jsx(b, { name: "Minus" })
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        Rt,
-        {
-          type: "number",
-          value: String(_),
-          onChange: (g) => {
-            e.quantity.available && Number(g) > e.quantity.available ? m(e.quantity.available) : m(Number(g));
-          },
-          max: ((z = e.quantity.restrictions) == null ? void 0 : z.max) || e.quantity.available || Number.POSITIVE_INFINITY,
-          min: ((K = e.quantity.restrictions) == null ? void 0 : K.min) || 0,
-          centered: !0,
-          disabled: e.quantity && e.quantity.available === 0 || Object.keys(e.quantity.restrictions || {}).length !== 0 && _ >= e.quantity.restrictions.max
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        E,
-        {
-          type: "Secondary",
-          onClick: () => {
-            m((g) => g + 1);
-          },
-          className: B.button,
-          disabled: !!(e.quantity.available && e.quantity.restrictions && _ >= e.quantity.restrictions.max || e.quantity.available === 0 || e.quantity.available && _ >= e.quantity.available),
-          children: /* @__PURE__ */ t.jsx(b, { name: "Plus" })
-        }
-      )
-    ] }),
+    o === "ONE_TIME" && /* @__PURE__ */ t.jsxs(
+      "div",
+      {
+        className: B.quantity,
+        id: "md",
+        children: [
+          /* @__PURE__ */ t.jsx(
+            R,
+            {
+              type: "Secondary",
+              onClick: () => {
+                j > 1 ? m((f) => f - 1) : m(1);
+              },
+              className: B.button,
+              disabled: e.quantity.available && e.quantity.restrictions && j <= e.quantity.restrictions.min || e.quantity.available === 0,
+              children: /* @__PURE__ */ t.jsx(I, { name: "Minus" })
+            }
+          ),
+          /* @__PURE__ */ t.jsx(
+            Lt,
+            {
+              type: "number",
+              value: String(j),
+              onChange: (f) => {
+                e.quantity.available && Number(f) > e.quantity.available ? m(e.quantity.available) : m(Number(f));
+              },
+              max: ((E = e.quantity.restrictions) == null ? void 0 : E.max) || e.quantity.available || Number.POSITIVE_INFINITY,
+              min: ((K = e.quantity.restrictions) == null ? void 0 : K.min) || 0,
+              centered: !0,
+              disabled: e.quantity && e.quantity.available === 0 || Object.keys(e.quantity.restrictions || {}).length !== 0 && j >= e.quantity.restrictions.max
+            }
+          ),
+          /* @__PURE__ */ t.jsx(
+            R,
+            {
+              type: "Secondary",
+              onClick: () => {
+                m((f) => f + 1);
+              },
+              className: B.button,
+              disabled: !!(e.quantity.available && e.quantity.restrictions && j >= e.quantity.restrictions.max || e.quantity.available === 0 || e.quantity.available && j >= e.quantity.available),
+              children: /* @__PURE__ */ t.jsx(I, { name: "Plus" })
+            }
+          )
+        ]
+      }
+    ),
     /* @__PURE__ */ t.jsxs("div", { className: B.meta, children: [
       /* @__PURE__ */ t.jsxs("div", { className: B.info, children: [
-        /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
+        /* @__PURE__ */ t.jsx("span", { id: "md", children: "Delivery" }),
         /* @__PURE__ */ t.jsxs("div", { className: B.infoRight, children: [
           /* @__PURE__ */ t.jsx(
-            b,
+            I,
             {
               name: "Lightning",
               fill: "var(--text-action)",
@@ -1647,62 +1668,111 @@ const ns = (h) => {
               height: 20
             }
           ),
-          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : U(e.deliveryTime) })
+          /* @__PURE__ */ t.jsx("span", { id: "md", children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : L(e.deliveryTime) })
         ] })
       ] }),
       /* @__PURE__ */ t.jsxs("div", { className: B.info, children: [
-        /* @__PURE__ */ t.jsx("span", { children: "Price" }),
-        /* @__PURE__ */ t.jsx("div", { className: B.infoRight, children: c === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: B.price, children: [
-          /* @__PURE__ */ t.jsx("span", { className: F(B.newPrice, { [B.animate]: o }), children: Q({
-            amount: e.price.amount * _,
-            currency: e.price.currency
-          }) }),
-          /* @__PURE__ */ t.jsx("span", { className: B.oldPrice, children: Q({
-            amount: e.compareAtPrice.amount * _,
-            currency: e.compareAtPrice.currency
-          }) })
-        ] }) : /* @__PURE__ */ t.jsx("span", { className: F(B.newPrice, { [B.animate]: o }), children: Q({
-          amount: e.price.amount * _,
-          currency: e.price.currency
-        }) }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: B.price, children: [
-          /* @__PURE__ */ t.jsx("span", { className: F(B.newPrice, { [B.animate]: o }), children: Q({
-            amount: e.subscriptionSettings.price.amount * _,
-            currency: e.subscriptionSettings.price.currency
-          }) }),
-          /* @__PURE__ */ t.jsx("span", { className: B.oldPrice, children: Q({
-            amount: e.subscriptionSettings.compareAtPrice.amount * _,
-            currency: e.subscriptionSettings.compareAtPrice.currency
-          }) })
-        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsx("span", { className: F(B.newPrice, { [B.animate]: o }), children: Q({
-          amount: e.subscriptionSettings.price.amount * _,
-          currency: e.subscriptionSettings.price.currency
-        }) }) })
+        /* @__PURE__ */ t.jsx("span", { id: "md", children: "Price" }),
+        /* @__PURE__ */ t.jsx("div", { className: B.infoRight, children: o === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs(
+          "div",
+          {
+            className: B.price,
+            id: "md",
+            children: [
+              /* @__PURE__ */ t.jsx("span", { className: H(B.newPrice, { [B.animate]: c }), children: Q({
+                amount: e.price.amount * j,
+                currency: e.price.currency
+              }) }),
+              /* @__PURE__ */ t.jsx(
+                "span",
+                {
+                  className: B.oldPrice,
+                  id: "md",
+                  children: Q({
+                    amount: e.compareAtPrice.amount * j,
+                    currency: e.compareAtPrice.currency
+                  })
+                }
+              )
+            ]
+          }
+        ) : /* @__PURE__ */ t.jsx(
+          "span",
+          {
+            className: H(B.newPrice, { [B.animate]: c }),
+            id: "md",
+            children: Q({
+              amount: e.price.amount * j,
+              currency: e.price.currency
+            })
+          }
+        ) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs(
+          "div",
+          {
+            className: B.price,
+            id: "md",
+            children: [
+              /* @__PURE__ */ t.jsx(
+                "span",
+                {
+                  className: H(B.newPrice, { [B.animate]: c }),
+                  id: "md",
+                  children: Q({
+                    amount: e.subscriptionSettings.price.amount * j,
+                    currency: e.subscriptionSettings.price.currency
+                  })
+                }
+              ),
+              /* @__PURE__ */ t.jsx(
+                "span",
+                {
+                  className: B.oldPrice,
+                  id: "md",
+                  children: Q({
+                    amount: e.subscriptionSettings.compareAtPrice.amount * j,
+                    currency: e.subscriptionSettings.compareAtPrice.currency
+                  })
+                }
+              )
+            ]
+          }
+        ) : e.subscriptionSettings && /* @__PURE__ */ t.jsx(
+          "span",
+          {
+            className: H(B.newPrice, { [B.animate]: c }),
+            id: "md",
+            children: Q({
+              amount: e.subscriptionSettings.price.amount * j,
+              currency: e.subscriptionSettings.price.currency
+            })
+          }
+        ) })
       ] })
     ] }),
     /* @__PURE__ */ t.jsxs("div", { className: B.buttons, children: [
       /* @__PURE__ */ t.jsx(
-        E,
+        R,
         {
           type: "Primary",
-          onClick: () => M(),
+          onClick: () => S(),
           disabled: e.quantity && e.quantity.available === 0,
-          children: c === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
+          children: o === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
         }
       ),
-      c === "ONE_TIME" && /* @__PURE__ */ t.jsx(
-        E,
+      o === "ONE_TIME" && /* @__PURE__ */ t.jsx(
+        R,
         {
           type: "Secondary",
-          onClick: () => y(),
+          onClick: () => _(),
           disabled: e.quantity && e.quantity.available === 0,
           children: d.parts.some(
-            (g) => g.productId === i.id && g.productVariantId === e.id
+            (f) => f.productId === n.id && f.productVariantId === e.id
           ) ? "Add More" : "Add to Cart"
         }
       )
     ] })
   ] });
-}, is = "_buttons_3z0t7_23", as = "_modal_3z0t7_32", os = "_closing_3z0t7_65", cs = "_info_3z0t7_114", rs = "_top_3z0t7_121", ls = "_title_3z0t7_132", ds = "_clear_3z0t7_139", us = "_activeClear_3z0t7_146", hs = "_count_3z0t7_150", ps = "_cart_3z0t7_165", ms = "_empty_3z0t7_173", gs = "_product_3z0t7_199", fs = "_products_3z0t7_208", xs = "_image_3z0t7_216", _s = "_productInfo_3z0t7_233", js = "_content_3z0t7_240", vs = "_name_3z0t7_246", ys = "_price_3z0t7_252", bs = "_productButtons_3z0t7_258", Is = "_productButton_3z0t7_258", Ns = "_productCount_3z0t7_275", Cs = "_bottom_3z0t7_292", Ss = "_subtotal_3z0t7_300", Ps = "_block_3z0t7_308", ks = "_shoppingCount_3z0t7_315", ws = "_total_3z0t7_335", Ts = "_link_3z0t7_341", Ms = "_userInfo_3z0t7_348", Bs = "_pagesMobileModal_3z0t7_360", $s = "_pagesMobileModalContent_3z0t7_374", Os = "_pagesMobileModalHeader_3z0t7_380", qs = "_pagesMobileModalFooter_3z0t7_390", As = "_pageLink_3z0t7_397", Ds = "_rightButtons_3z0t7_406", k = {
+}, is = "_buttons_1uy6y_23", as = "_modal_1uy6y_32", os = "_closing_1uy6y_65", cs = "_info_1uy6y_114", rs = "_top_1uy6y_121", ls = "_title_1uy6y_132", ds = "_clear_1uy6y_139", us = "_activeClear_1uy6y_146", hs = "_count_1uy6y_150", ps = "_cart_1uy6y_165", ms = "_empty_1uy6y_173", gs = "_product_1uy6y_199", fs = "_products_1uy6y_208", xs = "_image_1uy6y_216", _s = "_productInfo_1uy6y_233", ys = "_content_1uy6y_240", js = "_name_1uy6y_246", vs = "_price_1uy6y_252", bs = "_productButtons_1uy6y_258", Is = "_productButton_1uy6y_258", Ns = "_productCount_1uy6y_275", Cs = "_bottom_1uy6y_292", Ss = "_subtotal_1uy6y_300", ws = "_block_1uy6y_308", Ps = "_shoppingCount_1uy6y_315", ks = "_total_1uy6y_335", Ts = "_link_1uy6y_341", Ms = "_userInfo_1uy6y_348", Bs = "_pagesMobileModal_1uy6y_360", qs = "_pagesMobileModalContent_1uy6y_374", $s = "_pagesMobileModalHeader_1uy6y_380", Os = "_pagesMobileModalFooter_1uy6y_390", As = "_pageLink_1uy6y_397", Ds = "_rightButtons_1uy6y_406", k = {
   buttons: is,
   modal: as,
   closing: os,
@@ -1718,78 +1788,79 @@ const ns = (h) => {
   products: fs,
   image: xs,
   productInfo: _s,
-  content: js,
-  name: vs,
-  price: ys,
+  content: ys,
+  name: js,
+  price: vs,
   productButtons: bs,
   productButton: Is,
   productCount: Ns,
   bottom: Cs,
   subtotal: Ss,
-  block: Ps,
-  shoppingCount: ks,
-  total: ws,
+  block: ws,
+  shoppingCount: Ps,
+  total: ks,
   link: Ts,
   userInfo: Ms,
   pagesMobileModal: Bs,
-  pagesMobileModalContent: $s,
-  pagesMobileModalHeader: Os,
-  pagesMobileModalFooter: qs,
+  pagesMobileModalContent: qs,
+  pagesMobileModalHeader: $s,
+  pagesMobileModalFooter: Os,
   pageLink: As,
-  rightButtons: Ds
+  rightButtons: Ds,
+  delete: "_delete_1uy6y_413"
 }, Hn = (h) => {
-  const { shopping: i, signUp: a, isShowUserInfo: s = !0 } = h;
-  return /* @__PURE__ */ t.jsxs("div", { className: k.buttons, children: [
-    i && /* @__PURE__ */ t.jsx(Es, {}),
-    s && /* @__PURE__ */ t.jsx(Ot, { signUp: a })
-  ] });
+  const { shopping: n, signUp: a, isShowUserInfo: s = !0 } = h;
+  return /* @__PURE__ */ t.jsx(t.Fragment, { children: (n || s) && /* @__PURE__ */ t.jsxs("div", { className: k.buttons, children: [
+    n && /* @__PURE__ */ t.jsx(Es, {}),
+    s && /* @__PURE__ */ t.jsx($t, { signUp: a })
+  ] }) });
 }, Es = () => {
-  const [h, i] = x.useState(!1), [a, s] = x.useState([]), [e, r] = x.useState(!1), { cart: c, products: f } = ot();
-  function j(l) {
+  const [h, n] = y.useState(!1), [a, s] = y.useState([]), [e, r] = y.useState(!1), { cart: o, products: x } = ct();
+  function v(l) {
     if (l.variants.length > 0) {
-      for (let n = 0; n < c.parts.length; n++)
-        for (let o = 0; o < l.variants.length; o++)
-          if (l.variants[o] && c.parts[n].productVariantId === l.variants[o].id)
-            return c.parts[n].productVariantId;
+      for (let g = 0; g < o.parts.length; g++)
+        for (let c = 0; c < l.variants.length; c++)
+          if (l.variants[c] && o.parts[g].productVariantId === l.variants[c].id)
+            return o.parts[g].productVariantId;
     }
     return l.variants[0].id;
   }
-  function v(l) {
-    for (let n = 0; n < c.parts.length; n++)
-      for (let o = 0; o < l.variants.length; o++)
-        if (l.variants[o] && c.parts[n].productVariantId === l.variants[o].id)
-          return c.parts[n].quantity;
+  function b(l) {
+    for (let g = 0; g < o.parts.length; g++)
+      for (let c = 0; c < l.variants.length; c++)
+        if (l.variants[c] && o.parts[g].productVariantId === l.variants[c].id)
+          return o.parts[g].quantity;
   }
-  const T = (l) => {
-    for (let n = 0; n < c.parts.length; n++)
-      for (let o = 0; o < l.variants.length; o++)
-        if (l.variants[o] && c.parts[n].productVariantId === l.variants[o].id)
-          return c.parts[n].chargeType;
+  const M = (l) => {
+    for (let g = 0; g < o.parts.length; g++)
+      for (let c = 0; c < l.variants.length; c++)
+        if (l.variants[c] && o.parts[g].productVariantId === l.variants[c].id)
+          return o.parts[g].chargeType;
     return "ONE_TIME";
   };
-  x.useEffect(() => {
+  y.useEffect(() => {
     (async () => {
-      const n = c.parts.map((y) => String(y.productId)), C = (f.filter((y) => n.includes(String(y.id))) || []).map((y) => ({
-        ...y,
-        activeVariantId: j(y),
-        quantity: v(y),
-        chargeType: T(y)
+      const g = o.parts.map((_) => String(_.productId)), i = (x.filter((_) => g.includes(String(_.id))) || []).map((_) => ({
+        ..._,
+        activeVariantId: v(_),
+        quantity: b(_),
+        chargeType: M(_)
       }));
-      s(C);
+      s(i);
     })();
-  }, [c.parts]);
-  function _(l) {
+  }, [o.parts]);
+  function j(l) {
     return !l || !(l != null && l.variants) ? !1 : l.chargeType === "RECURRING";
   }
-  const m = c.parts.length > 0 && a.length > 0 && !_(a[0]);
+  const m = o.parts.length > 0 && a.length > 0 && !j(a[0]);
   function d() {
     r(!1), setTimeout(() => {
-      i(!1);
+      n(!1);
     }, 300);
   }
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsxs(
-      E,
+      R,
       {
         type: "Secondary",
         style: {
@@ -1797,16 +1868,16 @@ const ns = (h) => {
           position: "relative"
         },
         onClick: (l) => {
-          l.stopPropagation(), window.location.pathname.includes("/admin/builder") || (i(!0), r(!0));
+          l.stopPropagation(), window.location.pathname.includes("/admin/builder") || (n(!0), r(!0));
         },
         children: [
           /* @__PURE__ */ t.jsx(
-            b,
+            I,
             {
               name: "Handbag"
             }
           ),
-          m && /* @__PURE__ */ t.jsx("div", { className: k.shoppingCount, children: c.parts.length })
+          m && /* @__PURE__ */ t.jsx("div", { className: k.shoppingCount, children: o.parts.length })
         ]
       }
     ),
@@ -1816,7 +1887,7 @@ const ns = (h) => {
         close: d,
         withAnimation: !1,
         children: /* @__PURE__ */ t.jsx(
-          zs,
+          Rs,
           {
             activeProducts: a,
             isCartNotEmpty: m,
@@ -1827,55 +1898,78 @@ const ns = (h) => {
       }
     )
   ] });
-}, zs = (h) => {
-  var d, l;
-  const { activeProducts: i, isCartNotEmpty: a, isOpen: s, close: e } = h, { cart: r, reset: c, getTotalAndDiscount: f, updateQuantityOfProduct: j } = ot(), v = St();
-  function T(n, o) {
-    v(n, { replace: o });
+}, Rs = (h) => {
+  var g, c;
+  const { activeProducts: n, isCartNotEmpty: a, isOpen: s, close: e } = h, { cart: r, reset: o, getTotalAndDiscount: x, updateQuantityOfProduct: v, removeProduct: b } = ct(), M = St();
+  function j(i, _) {
+    M(i, { replace: _ });
   }
-  function _(n) {
-    n.quantity && j({
-      productId: n.id,
-      productVariantId: n.activeVariantId,
-      quantity: n.quantity + 1,
-      chargeType: n.chargeType
+  function m(i) {
+    i.quantity && v({
+      productId: i.id,
+      productVariantId: i.activeVariantId,
+      quantity: i.quantity + 1,
+      chargeType: i.chargeType
     });
   }
-  function m(n) {
-    n.quantity && j({
-      productId: n.id,
-      productVariantId: n.activeVariantId,
-      quantity: n.quantity - 1,
-      chargeType: n.chargeType
+  function d(i) {
+    i.quantity && v({
+      productId: i.id,
+      productVariantId: i.activeVariantId,
+      quantity: i.quantity - 1,
+      chargeType: i.chargeType
+    });
+  }
+  function l(i) {
+    b({
+      productId: i.id,
+      productVariantId: i.activeVariantId,
+      quantity: i.quantity || 1,
+      chargeType: i.chargeType
     });
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: F(k.modal, {
+      className: H(k.modal, {
         [k.closing]: !s
       }),
-      onClick: (n) => n.stopPropagation(),
+      onClick: (i) => i.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: k.top, children: [
           /* @__PURE__ */ t.jsxs("div", { className: k.info, children: [
-            /* @__PURE__ */ t.jsx("span", { className: k.title, children: "Cart" }),
-            a && /* @__PURE__ */ t.jsx("div", { className: k.count, children: r.parts.length })
+            /* @__PURE__ */ t.jsx(
+              "span",
+              {
+                className: k.title,
+                id: "h4",
+                children: "Cart"
+              }
+            ),
+            a && /* @__PURE__ */ t.jsx(
+              "div",
+              {
+                className: k.count,
+                id: "md",
+                children: r.parts.length
+              }
+            )
           ] }),
           /* @__PURE__ */ t.jsxs("div", { className: k.rightButtons, children: [
             a && /* @__PURE__ */ t.jsx(
               "button",
               {
-                className: F(k.clear, {
+                className: H(k.clear, {
                   [k.activeClear]: a
                 }),
                 disabled: !a,
-                onClick: c,
+                onClick: o,
+                id: "md",
                 children: "Clear all"
               }
             ),
             /* @__PURE__ */ t.jsx(
-              b,
+              I,
               {
                 name: "X",
                 onClick: e,
@@ -1888,91 +1982,126 @@ const ns = (h) => {
           ] })
         ] }),
         a ? /* @__PURE__ */ t.jsxs("div", { className: k.cart, children: [
-          /* @__PURE__ */ t.jsx("div", { className: k.products, children: [...new Map(i.map((n) => [n.id, n])).values()].map((n) => /* @__PURE__ */ t.jsxs(
-            "div",
-            {
-              className: k.product,
-              children: [
-                /* @__PURE__ */ t.jsxs("div", { className: k.productInfo, children: [
-                  n.images.length > 0 ? /* @__PURE__ */ t.jsx(
-                    "img",
-                    {
-                      src: `https://imagedelivery.net/${n.images[0].cfId}/w=500`,
-                      alt: "image",
-                      width: "100%",
-                      height: "100%",
-                      className: k.image
-                    }
-                  ) : /* @__PURE__ */ t.jsx("div", { className: k.image, children: /* @__PURE__ */ t.jsx(
-                    b,
-                    {
-                      name: "Image",
-                      fill: "var(--text-secondary)"
-                    }
-                  ) }),
-                  /* @__PURE__ */ t.jsxs("div", { className: k.content, children: [
-                    /* @__PURE__ */ t.jsx("div", { className: k.name, children: it(n.name) }),
-                    /* @__PURE__ */ t.jsx("div", { className: k.price, children: Q({
-                      amount: n.variants.find(
-                        (o) => o.id === n.activeVariantId
-                      ).price.amount * ((n == null ? void 0 : n.quantity) || 1),
-                      currency: n.variants.find(
-                        (o) => o.id === n.activeVariantId
-                      ).price.currency
-                    }) })
+          /* @__PURE__ */ t.jsx("div", { className: k.products, children: [...new Map(n.map((i) => [i.id, i])).values()].map((i) => {
+            var _;
+            return /* @__PURE__ */ t.jsxs(
+              "div",
+              {
+                className: k.product,
+                children: [
+                  /* @__PURE__ */ t.jsxs("div", { className: k.productInfo, children: [
+                    i.images.length > 0 ? /* @__PURE__ */ t.jsx(
+                      "img",
+                      {
+                        src: `https://imagedelivery.net/${i.images[0].cfId}/w=500`,
+                        alt: "image",
+                        width: "100%",
+                        height: "100%",
+                        className: k.image
+                      }
+                    ) : /* @__PURE__ */ t.jsx("div", { className: k.image, children: /* @__PURE__ */ t.jsx(
+                      I,
+                      {
+                        name: "Image",
+                        fill: "var(--text-secondary)"
+                      }
+                    ) }),
+                    /* @__PURE__ */ t.jsxs("div", { className: k.content, children: [
+                      /* @__PURE__ */ t.jsx("div", { className: k.name, children: it(i.name) }),
+                      /* @__PURE__ */ t.jsx("div", { className: k.price, children: Q({
+                        amount: i.variants.find(
+                          (S) => S.id === i.activeVariantId
+                        ).price.amount * ((i == null ? void 0 : i.quantity) || 1),
+                        currency: i.variants.find(
+                          (S) => S.id === i.activeVariantId
+                        ).price.currency
+                      }) })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ t.jsxs("div", { className: k.productButtons, children: [
+                    /* @__PURE__ */ t.jsx(
+                      R,
+                      {
+                        type: "Secondary",
+                        onClick: () => {
+                          i.quantity !== 1 && d(i);
+                        },
+                        className: k.productButton,
+                        disabled: i.quantity === 1,
+                        children: /* @__PURE__ */ t.jsx(
+                          I,
+                          {
+                            name: "Minus",
+                            fill: "#757575",
+                            width: 20,
+                            height: 20
+                          }
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ t.jsx(
+                      "input",
+                      {
+                        className: k.productCount,
+                        type: "number",
+                        value: ((_ = i.quantity) == null ? void 0 : _.toString()) || "",
+                        onChange: (S) => {
+                          const L = Math.min(
+                            Number(S.target.value),
+                            i.variants.find((E) => E.id === i.activeVariantId).quantity.available || 1 / 0
+                          );
+                          L < 1 || v({
+                            productId: i.id,
+                            productVariantId: i.activeVariantId,
+                            quantity: L,
+                            chargeType: i.chargeType
+                          });
+                        },
+                        min: 1,
+                        max: i.variants.find((S) => S.id === i.activeVariantId).quantity.available || 1 / 0
+                      }
+                    ),
+                    /* @__PURE__ */ t.jsx(
+                      R,
+                      {
+                        type: "Secondary",
+                        onClick: () => m(i),
+                        className: k.productButton,
+                        disabled: i.quantity === i.variants.find((S) => S.id === i.activeVariantId).quantity.available,
+                        children: /* @__PURE__ */ t.jsx(
+                          I,
+                          {
+                            name: "Plus",
+                            fill: "#757575",
+                            width: 20,
+                            height: 20
+                          }
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ t.jsx("div", { className: k.delete, children: /* @__PURE__ */ t.jsx(
+                      I,
+                      {
+                        name: "Trash",
+                        fill: "var(--text-action)",
+                        width: 20,
+                        height: 20,
+                        onClick: () => l(i),
+                        hoverable: !0
+                      }
+                    ) })
                   ] })
-                ] }),
-                /* @__PURE__ */ t.jsxs("div", { className: k.productButtons, children: [
-                  /* @__PURE__ */ t.jsx(
-                    E,
-                    {
-                      type: "Secondary",
-                      onClick: () => {
-                        n.quantity !== 1 && m(n);
-                      },
-                      className: k.productButton,
-                      disabled: n.quantity === 1,
-                      children: /* @__PURE__ */ t.jsx(
-                        b,
-                        {
-                          name: "Minus",
-                          fill: "#757575",
-                          width: 20,
-                          height: 20
-                        }
-                      )
-                    }
-                  ),
-                  /* @__PURE__ */ t.jsx("div", { className: k.productCount, children: n.quantity }),
-                  /* @__PURE__ */ t.jsx(
-                    E,
-                    {
-                      type: "Secondary",
-                      onClick: () => _(n),
-                      className: k.productButton,
-                      disabled: n.quantity === n.variants.find((o) => o.id === n.activeVariantId).quantity.available,
-                      children: /* @__PURE__ */ t.jsx(
-                        b,
-                        {
-                          name: "Plus",
-                          fill: "#757575",
-                          width: 20,
-                          height: 20
-                        }
-                      )
-                    }
-                  )
-                ] })
-              ]
-            },
-            n.id
-          )) }),
+                ]
+              },
+              i.id
+            );
+          }) }),
           /* @__PURE__ */ t.jsxs("div", { className: k.bottom, children: [
             /* @__PURE__ */ t.jsxs("div", { className: k.subtotal, children: [
               /* @__PURE__ */ t.jsxs("div", { className: k.block, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
                 /* @__PURE__ */ t.jsx(
-                  b,
+                  I,
                   {
                     name: "Info",
                     width: 20,
@@ -1982,26 +2111,26 @@ const ns = (h) => {
                 )
               ] }),
               /* @__PURE__ */ t.jsx("div", { className: k.total, children: Q({
-                amount: f().total,
-                currency: r.parts.length > 0 && ((l = (d = i.find((n) => n.id === r.parts[0].productId)) == null ? void 0 : d.variants.find((n) => n.id === r.parts[0].productVariantId)) == null ? void 0 : l.price.currency) || "USD"
+                amount: x().total,
+                currency: r.parts.length > 0 && ((c = (g = n.find((i) => i.id === r.parts[0].productId)) == null ? void 0 : g.variants.find((i) => i.id === r.parts[0].productVariantId)) == null ? void 0 : c.price.currency) || "USD"
               }) })
             ] }),
-            /* @__PURE__ */ t.jsx(E, { onClick: () => T("/checkout", !1), children: "Checkout" })
+            /* @__PURE__ */ t.jsx(R, { onClick: () => j("/checkout", !1), children: "Checkout" })
           ] })
-        ] }) : /* @__PURE__ */ t.jsx(Rs, {})
+        ] }) : /* @__PURE__ */ t.jsx(Ls, {})
       ]
     }
   );
-}, Rs = () => /* @__PURE__ */ t.jsxs("div", { className: k.empty, children: [
+}, Ls = () => /* @__PURE__ */ t.jsxs("div", { className: k.empty, children: [
   /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-    b,
+    I,
     {
       name: "Handbag",
       fill: "var(--text-secondary)"
     }
   ) }),
-  /* @__PURE__ */ t.jsx("span", { children: "Empty Cart" }),
-  /* @__PURE__ */ t.jsxs("span", { children: [
+  /* @__PURE__ */ t.jsx("span", { id: "h5", children: "Empty Cart" }),
+  /* @__PURE__ */ t.jsxs("span", { id: "md", children: [
     "You don’t have any items in your shopping cart yet,",
     " ",
     /* @__PURE__ */ t.jsx(
@@ -2009,38 +2138,39 @@ const ns = (h) => {
       {
         href: "/products",
         className: k.link,
+        id: "md",
         children: "view products"
       }
     )
   ] })
-] }), Ot = ({ signUp: h, close: i }) => {
-  const { token: a } = Lt(), s = St(), [e, r] = x.useState("test-email@gmail.com");
-  x.useEffect(() => {
+] }), $t = ({ signUp: h, close: n }) => {
+  const { token: a } = Ut(), s = St(), [e, r] = y.useState("test-email@gmail.com");
+  y.useEffect(() => {
     a && (async () => {
       if (!a) return;
-      const j = Ut(a);
-      r(j.email);
+      const v = zt(a);
+      r(v.email);
     })();
   }, [a]);
-  function c(f) {
-    window.location.pathname.includes("/admin/builder") || s(f);
+  function o(x) {
+    window.location.pathname.includes("/admin/builder") || s(x);
   }
   return a ? /* @__PURE__ */ t.jsx(
-    E,
+    R,
     {
       type: "Secondary",
       className: k.userInfo,
       onClick: () => {
-        c("/customer-dash"), i == null || i();
+        o("/customer-dash"), n == null || n();
       },
       children: /* @__PURE__ */ t.jsx("div", { children: e || "test-email@gmail.com" })
     }
   ) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
-      E,
+      R,
       {
         onClick: () => {
-          c("/customer-dash"), i == null || i();
+          o("/customer-dash"), n == null || n();
         },
         type: "Secondary",
         style: {
@@ -2050,10 +2180,10 @@ const ns = (h) => {
       }
     ),
     h && /* @__PURE__ */ t.jsx(
-      E,
+      R,
       {
         onClick: () => {
-          c("/customer-dash"), i == null || i();
+          o("/customer-dash"), n == null || n();
         },
         type: "Primary",
         style: {
@@ -2064,35 +2194,35 @@ const ns = (h) => {
       }
     )
   ] });
-}, Ls = ({
+}, Us = ({
   logo: h,
-  setIsOpen: i,
+  setIsOpen: n,
   signUp: a,
   pages: s
 }) => {
-  const { setIsOpen: e } = ct(), r = () => {
+  const { setIsOpen: e } = rt(), r = () => {
     e(!1), setTimeout(() => {
-      i(!1), e(!0);
+      n(!1), e(!0);
     }, 300);
   };
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: k.pagesMobileModal,
-      onClick: (c) => c.stopPropagation(),
+      onClick: (o) => o.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: k.pagesMobileModalHeader, children: [
           /* @__PURE__ */ t.jsx("div", { children: h }),
           /* @__PURE__ */ t.jsx(
-            E,
+            R,
             {
               type: "Secondary",
               onClick: r,
-              children: /* @__PURE__ */ t.jsx(b, { name: "X" })
+              children: /* @__PURE__ */ t.jsx(I, { name: "X" })
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: k.pagesMobileModalContent, children: s.length > 0 && s.map((c) => /* @__PURE__ */ t.jsx(
+        /* @__PURE__ */ t.jsx("div", { className: k.pagesMobileModalContent, children: s.length > 0 && s.map((o) => /* @__PURE__ */ t.jsx(
           "div",
           {
             className: k.pageLink,
@@ -2100,15 +2230,15 @@ const ns = (h) => {
             children: /* @__PURE__ */ t.jsx(
               Tt,
               {
-                path: c.path,
-                children: c.name["en-US"]
+                path: o.path,
+                children: o.name["en-US"]
               },
-              c.id
+              o.id
             )
           }
         )) }),
         /* @__PURE__ */ t.jsx("div", { className: k.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(
-          Ot,
+          $t,
           {
             signUp: a,
             close: r
@@ -2117,59 +2247,59 @@ const ns = (h) => {
       ]
     }
   );
-}, Fn = ({ logo: h, signUp: i, pages: a }) => {
-  const [s, e] = x.useState(!1);
+}, Vn = ({ logo: h, signUp: n, pages: a }) => {
+  const [s, e] = y.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx(Us, { setIsOpenModal: e }),
+    /* @__PURE__ */ t.jsx(zs, { setIsOpenModal: e }),
     s && /* @__PURE__ */ t.jsx(
       ut,
       {
         close: () => e(!1),
         hasPadding: !1,
         children: /* @__PURE__ */ t.jsx(
-          Ls,
+          Us,
           {
             logo: h,
             setIsOpen: e,
-            signUp: i,
+            signUp: n,
             pages: a
           }
         )
       }
     )
   ] });
-}, Us = (h) => {
-  const { setIsOpenModal: i } = h;
+}, zs = (h) => {
+  const { setIsOpenModal: n } = h;
   return /* @__PURE__ */ t.jsx(
-    E,
+    R,
     {
       type: "Secondary",
       style: {
         padding: 10
       },
       onClick: (a) => {
-        a.stopPropagation(), window.location.pathname.includes("/admin/builder") || i(!0);
+        a.stopPropagation(), window.location.pathname.includes("/admin/builder") || n(!0);
       },
-      children: /* @__PURE__ */ t.jsx(b, { name: "List" })
+      children: /* @__PURE__ */ t.jsx(I, { name: "List" })
     }
   );
-}, Hs = "_share_onabp_1", Fs = "_modal_onabp_8", Vs = "_header_onabp_20", Ys = "_title_onabp_46", Gs = "_copyWrapper_onabp_53", Ws = "_copyText_onabp_62", Xs = "_copyTextMobile_onabp_75", Qs = "_copyTextMiniMobile_onabp_94", nt = {
-  share: Hs,
-  modal: Fs,
+}, Fs = "_share_onabp_1", Hs = "_modal_onabp_8", Vs = "_header_onabp_20", Ys = "_title_onabp_46", Gs = "_copyWrapper_onabp_53", Ws = "_copyText_onabp_62", Xs = "_copyTextMobile_onabp_75", Qs = "_copyTextMiniMobile_onabp_94", nt = {
+  share: Fs,
+  modal: Hs,
   header: Vs,
   title: Ys,
   copyWrapper: Gs,
   copyText: Ws,
   copyTextMobile: Xs,
   copyTextMiniMobile: Qs
-}, Vn = ({ title: h = "Copy Product Link" }) => {
-  const { isOpenModal: i, setIsOpenModal: a } = Mt();
+}, Yn = ({ title: h = "Copy Product Link" }) => {
+  const { isOpenModal: n, setIsOpenModal: a } = Mt();
   function s() {
     a(!0);
   }
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
-      E,
+      R,
       {
         className: nt.share,
         onClick: (e) => {
@@ -2177,7 +2307,7 @@ const ns = (h) => {
         },
         type: "Secondary",
         children: /* @__PURE__ */ t.jsx(
-          b,
+          I,
           {
             name: "Share",
             fill: "#757575",
@@ -2186,11 +2316,11 @@ const ns = (h) => {
         )
       }
     ),
-    i && /* @__PURE__ */ t.jsx(ut, { close: a, children: /* @__PURE__ */ t.jsx(Js, { title: h }) })
+    n && /* @__PURE__ */ t.jsx(ut, { close: a, children: /* @__PURE__ */ t.jsx(Js, { title: h }) })
   ] });
 }, Js = ({ title: h = "Copy Product Link" }) => {
-  const { setIsOpenModal: i } = Mt(), { notifications: a, setNotifications: s } = Ct(), { setIsOpen: e } = ct(), r = window.location.href;
-  function c() {
+  const { setIsOpenModal: n } = Mt(), { notifications: a, setNotifications: s } = Ct(), { setIsOpen: e } = rt(), r = window.location.href;
+  function o() {
     navigator.clipboard.writeText(r), s([
       ...a,
       {
@@ -2200,134 +2330,163 @@ const ns = (h) => {
       }
     ]);
   }
-  function f() {
+  function x() {
     e(!1), setTimeout(() => {
-      i(!1), e(!0);
+      n(!1), e(!0);
     }, 300);
   }
-  function j(v, T) {
-    return v.length > T ? v.slice(0, T) + "..." : v;
+  function v(b, M) {
+    return b.length > M ? b.slice(0, M) + "..." : b;
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: nt.modal,
-      onClick: (v) => v.stopPropagation(),
+      onClick: (b) => b.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: nt.header, children: [
-          /* @__PURE__ */ t.jsx("div", { className: nt.title, children: h }),
           /* @__PURE__ */ t.jsx(
-            b,
+            "div",
+            {
+              className: nt.title,
+              id: "h4",
+              children: h
+            }
+          ),
+          /* @__PURE__ */ t.jsx(
+            I,
             {
               name: "X",
               fill: "#757575",
-              onClick: f,
+              onClick: x,
               hoverable: !0
             }
           )
         ] }),
         /* @__PURE__ */ t.jsxs("div", { className: nt.copyWrapper, children: [
           /* @__PURE__ */ t.jsxs(
-            E,
+            R,
             {
               type: "Secondary",
-              onClick: c,
+              onClick: o,
               style: {
                 flex: 1
               },
               children: [
-                /* @__PURE__ */ t.jsx("div", { className: nt.copyText, children: j(r, 100) }),
-                /* @__PURE__ */ t.jsx("div", { className: nt.copyTextMobile, children: j(r, 40) }),
-                /* @__PURE__ */ t.jsx("div", { className: nt.copyTextMiniMobile, children: j(r, 20) })
+                /* @__PURE__ */ t.jsx(
+                  "div",
+                  {
+                    className: nt.copyText,
+                    id: "md",
+                    children: v(r, 100)
+                  }
+                ),
+                /* @__PURE__ */ t.jsx(
+                  "div",
+                  {
+                    className: nt.copyTextMobile,
+                    id: "md",
+                    children: v(r, 40)
+                  }
+                ),
+                /* @__PURE__ */ t.jsx(
+                  "div",
+                  {
+                    className: nt.copyTextMiniMobile,
+                    id: "md",
+                    children: v(r, 20)
+                  }
+                )
               ]
             }
           ),
           /* @__PURE__ */ t.jsx(
-            E,
+            R,
             {
               type: "Secondary",
-              onClick: c,
+              onClick: o,
               children: a.find(
-                (v) => v.message === "Link copied to clipboard"
-              ) ? /* @__PURE__ */ t.jsx(b, { name: "Check" }) : /* @__PURE__ */ t.jsx(b, { name: "Copy" })
+                (b) => b.message === "Link copied to clipboard"
+              ) ? /* @__PURE__ */ t.jsx(I, { name: "Check" }) : /* @__PURE__ */ t.jsx(I, { name: "Copy" })
             }
           )
         ] })
       ]
     }
   );
-}, Ks = "_accordion_1to77_1", Zs = "_header_1to77_9", tn = "_icon_1to77_18", en = "_open_1to77_21", sn = "_content_1to77_25", rt = {
+}, Ks = "_accordion_mdmvg_1", Zs = "_header_mdmvg_12", tn = "_icon_mdmvg_21", en = "_open_mdmvg_24", sn = "_content_mdmvg_28", nn = "_contentOpen_mdmvg_36", ot = {
   accordion: Ks,
   header: Zs,
   icon: tn,
   open: en,
-  content: sn
-}, Yn = ({ title: h, content: i, defaultOpen: a = !1 }) => {
-  const [s, e] = x.useState(a), [r, c] = x.useState(0), f = x.useRef(null), j = () => {
+  content: sn,
+  contentOpen: nn
+}, Gn = ({ title: h, content: n, defaultOpen: a = !1 }) => {
+  const [s, e] = y.useState(a), [r, o] = y.useState(0), x = y.useRef(null), v = () => {
     e(!s);
   };
-  return x.useEffect(() => {
-    f.current && c(s ? f.current.scrollHeight : 0);
-  }, [s]), /* @__PURE__ */ t.jsxs("div", { className: rt.accordion, children: [
+  return y.useEffect(() => {
+    x.current && o(s ? x.current.scrollHeight + 30 : 0);
+  }, [s]), /* @__PURE__ */ t.jsxs("div", { className: ot.accordion, children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: rt.header,
-        onClick: j,
+        className: ot.header,
+        onClick: v,
         children: [
           /* @__PURE__ */ t.jsx("h5", { id: "h5", children: h }),
-          /* @__PURE__ */ t.jsx("div", { className: F(rt.icon, { [rt.open]: s }), children: /* @__PURE__ */ t.jsx(b, { name: "CaretDown" }) })
+          /* @__PURE__ */ t.jsx("div", { className: H(ot.icon, { [ot.open]: s }), children: /* @__PURE__ */ t.jsx(I, { name: "CaretDown" }) })
         ]
       }
     ),
     /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: f,
-        className: rt.content,
+        ref: x,
+        className: H(ot.content, { [ot.contentOpen]: s }),
         style: { height: `${r}px` },
-        children: /* @__PURE__ */ t.jsx("p", { id: "p", children: i })
+        children: /* @__PURE__ */ t.jsx("p", { id: "md", children: n })
       }
     )
   ] });
-}, nn = "_buttonsBlock_1b2rb_1", an = {
-  buttonsBlock: nn
-}, Gn = (h) => {
-  var v, T;
-  const { setIsOpen: i, setModalType: a, productId: s } = h, { cart: e } = ot(), { pageContext: r } = yt(), c = (v = r == null ? void 0 : r.listings) == null ? void 0 : v.find((_) => _.id === s);
-  if (!c)
+}, an = "_buttonsBlock_1b2rb_1", on = {
+  buttonsBlock: an
+}, Wn = (h) => {
+  var b, M;
+  const { setIsOpen: n, setModalType: a, productId: s } = h, { cart: e } = ct(), { pageContext: r } = vt(), o = (b = r == null ? void 0 : r.listings) == null ? void 0 : b.find((j) => j.id === s);
+  if (!o)
     return null;
-  const f = (T = r == null ? void 0 : r.products) == null ? void 0 : T.find(
-    (_) => _.uniquePath === c.productData.uniquePath
+  const x = (M = r == null ? void 0 : r.products) == null ? void 0 : M.find(
+    (j) => j.uniquePath === o.productData.uniquePath
   );
-  if (!f)
+  if (!x)
     return null;
-  const j = e.parts.find((_) => _.productId === f.id);
+  const v = e.parts.find((j) => j.productId === x.id);
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: an.buttonsBlock,
-      onClick: (_) => _.stopPropagation(),
+      className: on.buttonsBlock,
+      onClick: (j) => j.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsx(
-          E,
+          R,
           {
             type: "Secondary",
             style: {
               width: "100%"
             },
             onClick: () => {
-              a("Add To Cart"), i(!0);
+              a("Add To Cart"), n(!0);
             },
-            children: j ? "Add More" : "Add To Cart"
+            children: v ? "Add More" : "Add To Cart"
           }
         ),
         /* @__PURE__ */ t.jsx(
-          E,
+          R,
           {
             type: "Primary",
             onClick: () => {
-              a("Buy Now"), i(!0);
+              a("Buy Now"), n(!0);
             },
             children: "Buy"
           }
@@ -2335,13 +2494,13 @@ const ns = (h) => {
       ]
     }
   );
-}, on = "_wrapper_27wzz_1", cn = "_logo_27wzz_8", rn = "_info_27wzz_12", It = {
-  wrapper: on,
-  logo: cn,
-  info: rn
-}, Wn = ({ date: h }) => {
-  const { general: i } = Ht();
-  if (!i) return /* @__PURE__ */ t.jsx(t.Fragment, {});
+}, cn = "_wrapper_27wzz_1", rn = "_logo_27wzz_8", ln = "_info_27wzz_12", It = {
+  wrapper: cn,
+  logo: rn,
+  info: ln
+}, Xn = ({ date: h }) => {
+  const { general: n } = Ft();
+  if (!n) return /* @__PURE__ */ t.jsx(t.Fragment, {});
   function a(s) {
     const e = new Date(s), r = {
       month: "short",
@@ -2354,15 +2513,15 @@ const ns = (h) => {
     return e.toLocaleDateString("en-US", r);
   }
   return /* @__PURE__ */ t.jsxs("div", { className: It.wrapper, children: [
-    /* @__PURE__ */ t.jsx("div", { className: It.logo, children: i.info.logo ? /* @__PURE__ */ t.jsx(
+    /* @__PURE__ */ t.jsx("div", { className: It.logo, children: n.info.logo ? /* @__PURE__ */ t.jsx(
       "img",
       {
-        src: `https://imagedelivery.net/${i.info.logo.cfId}/w=500,h=500`,
+        src: `https://imagedelivery.net/${n.info.logo.cfId}/w=500,h=500`,
         alt: "image",
         style: { objectFit: "contain", width: "48px", height: "48px" }
       }
     ) : /* @__PURE__ */ t.jsx(
-      b,
+      I,
       {
         name: "Image",
         width: 48,
@@ -2370,37 +2529,37 @@ const ns = (h) => {
       }
     ) }),
     /* @__PURE__ */ t.jsxs("div", { className: It.info, children: [
-      /* @__PURE__ */ t.jsx("h3", { id: "h4", children: i.info.name }),
+      /* @__PURE__ */ t.jsx("h3", { id: "h4", children: n.info.name }),
       /* @__PURE__ */ t.jsx("p", { id: "p", children: a(h) })
     ] })
   ] });
-}, ln = "_variants_hphv8_80", dn = "_variant_hphv8_80", un = "_stock_hphv8_98", hn = "_variantInfo_hphv8_105", pn = "_title_hphv8_199", mn = "_modal_hphv8_205", gn = "_header_hphv8_225", fn = "_productOptions_hphv8_233", xn = "_loading_hphv8_237", tt = {
-  variants: ln,
-  variant: dn,
-  stock: un,
-  variantInfo: hn,
-  title: pn,
-  modal: mn,
-  header: gn,
-  productOptions: fn,
-  loading: xn
-}, Xn = (h) => {
+}, dn = "_variants_pwm2c_82", un = "_variant_pwm2c_82", hn = "_stock_pwm2c_100", pn = "_variantInfo_pwm2c_107", mn = "_title_pwm2c_201", gn = "_modal_pwm2c_207", fn = "_header_pwm2c_227", xn = "_productOptions_pwm2c_235", _n = "_loading_pwm2c_239", tt = {
+  variants: dn,
+  variant: un,
+  stock: hn,
+  variantInfo: pn,
+  title: mn,
+  modal: gn,
+  header: fn,
+  productOptions: xn,
+  loading: _n
+}, Qn = (h) => {
   var m;
-  const { pageContext: i } = yt(), a = (m = i == null ? void 0 : i.listings) == null ? void 0 : m.find((d) => d.id === h.productId), [s, e] = x.useState(!0), [r, c] = x.useState(null), f = (r == null ? void 0 : r.variants[0]) || null, [j, v] = x.useState(
+  const { pageContext: n } = vt(), a = (m = n == null ? void 0 : n.listings) == null ? void 0 : m.find((d) => d.id === h.productId), [s, e] = y.useState(!0), [r, o] = y.useState(null), x = (r == null ? void 0 : r.variants[0]) || null, [v, b] = y.useState(
     "ONE_TIME"
-  ), { addProducts: T } = ot(), { setIsOpen: _ } = ct();
-  return x.useEffect(() => {
+  ), { addProducts: M } = ct(), { setIsOpen: j } = rt();
+  return y.useEffect(() => {
     (async () => {
       e(!0);
-      const l = await Ft(
+      const l = await Ht(
         encodeURIComponent(
           `/product/${a.productData.uniquePath}`
         )
       );
-      T(l == null ? void 0 : l.data.products), c(l == null ? void 0 : l.data.products[0]), e(!1);
+      M(l == null ? void 0 : l.data.products), o(l == null ? void 0 : l.data.products[0]), e(!1);
     })();
-  }, []), x.useEffect(() => {
-    _(!0);
+  }, []), y.useEffect(() => {
+    j(!0);
   }, []), /* @__PURE__ */ t.jsx(ut, { close: h.setIsOpen, children: /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -2408,13 +2567,13 @@ const ns = (h) => {
       onClick: (d) => d.stopPropagation(),
       children: [
         s && /* @__PURE__ */ t.jsx("div", { className: tt.loading, children: /* @__PURE__ */ t.jsx(Bt, {}) }),
-        h.type === "Add To Cart" && r && f && !s && /* @__PURE__ */ t.jsx(
-          _n,
+        h.type === "Add To Cart" && r && x && !s && /* @__PURE__ */ t.jsx(
+          yn,
           {
             variants: r.variants,
-            activeVariant: f,
-            activeChargeType: j,
-            setActiveChargeType: v,
+            activeVariant: x,
+            activeChargeType: v,
+            setActiveChargeType: b,
             productId: r.id,
             setIsOpen: h.setIsOpen
           }
@@ -2429,52 +2588,52 @@ const ns = (h) => {
       ]
     }
   ) });
-}, _n = (h) => {
-  const { variants: i, activeChargeType: a, productId: s, setIsOpen: e } = h, { cart: r, addProductToCart: c, addProducts: f, updateQuantityOfProduct: j } = ot(), { notifications: v, setNotifications: T } = Ct(), { pageContext: _ } = yt(), { setIsOpen: m } = ct(), d = () => {
+}, yn = (h) => {
+  const { variants: n, activeChargeType: a, productId: s, setIsOpen: e } = h, { cart: r, addProductToCart: o, addProducts: x, updateQuantityOfProduct: v } = ct(), { notifications: b, setNotifications: M } = Ct(), { pageContext: j } = vt(), { setIsOpen: m } = rt(), d = () => {
     m(!1), setTimeout(() => {
       e(!1);
     }, 300);
   };
-  async function l(n) {
-    const o = i.find((M) => M.id === n), C = r.parts.find(
-      (M) => M.productId === h.productId && M.productVariantId === n
+  async function l(g) {
+    const c = n.find((S) => S.id === g), i = r.parts.find(
+      (S) => S.productId === h.productId && S.productVariantId === g
     );
-    if ((o == null ? void 0 : o.quantity.available) && (o == null ? void 0 : o.quantity.restrictions) && ((C == null ? void 0 : C.quantity) || 0) + 1 > (o == null ? void 0 : o.quantity.restrictions.max) || (o == null ? void 0 : o.quantity.available) === 0 || (o == null ? void 0 : o.quantity.available) && ((C == null ? void 0 : C.quantity) || 0) + 1 > (o == null ? void 0 : o.quantity.available)) {
-      T([
-        ...v,
+    if ((c == null ? void 0 : c.quantity.available) && (c == null ? void 0 : c.quantity.restrictions) && ((i == null ? void 0 : i.quantity) || 0) + 1 > (c == null ? void 0 : c.quantity.restrictions.max) || (c == null ? void 0 : c.quantity.available) === 0 || (c == null ? void 0 : c.quantity.available) && ((i == null ? void 0 : i.quantity) || 0) + 1 > (c == null ? void 0 : c.quantity.available)) {
+      M([
+        ...b,
         { id: J(), message: "Product is out of stock", status: "error" }
       ]);
       return;
     }
-    if (C)
-      j({
+    if (i)
+      v({
         productId: s,
-        productVariantId: n,
-        quantity: C.quantity + 1,
+        productVariantId: g,
+        quantity: i.quantity + 1,
         chargeType: a
       });
     else {
-      _ != null && _.products && f(_.products);
+      j != null && j.products && x(j.products);
       try {
-        c({
+        o({
           productId: s,
-          productVariantId: n,
+          productVariantId: g,
           quantity: 1,
           chargeType: a
-        }), T([
-          ...v,
+        }), M([
+          ...b,
           {
             id: J(),
             message: "Product added to cart",
             status: "success"
           }
         ]);
-      } catch (M) {
-        T([
-          ...v,
+      } catch (S) {
+        M([
+          ...b,
           {
             id: J(),
-            message: `Product failed to add to cart: ${M}`,
+            message: `Product failed to add to cart: ${S}`,
             status: "error"
           }
         ]);
@@ -2485,7 +2644,7 @@ const ns = (h) => {
     /* @__PURE__ */ t.jsxs("div", { className: tt.header, children: [
       /* @__PURE__ */ t.jsx("div", { id: "h3", children: "Choose a Variant" }),
       /* @__PURE__ */ t.jsx(
-        b,
+        I,
         {
           name: "X",
           width: 24,
@@ -2496,39 +2655,53 @@ const ns = (h) => {
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsx("div", { className: tt.variants, children: i.filter((n) => {
-      var o;
-      return (o = n.chargeTypes) == null ? void 0 : o.includes(a);
-    }).map((n) => {
-      var o, C, y;
+    /* @__PURE__ */ t.jsx("div", { className: tt.variants, children: n.filter((g) => {
+      var c;
+      return (c = g.chargeTypes) == null ? void 0 : c.includes(a);
+    }).map((g) => {
+      var c, i, _;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
-          className: F(tt.variant),
+          className: H(tt.variant),
           onClick: () => {
-            l(n.id), e(!1);
+            l(g.id), e(!1);
           },
           children: [
             /* @__PURE__ */ t.jsxs("div", { className: tt.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: tt.title, children: n.name }),
-              /* @__PURE__ */ t.jsx("span", { children: Q({
-                amount: a === "ONE_TIME" ? n.price.amount : n.subscriptionSettings ? n.subscriptionSettings.price.amount : 0,
-                currency: a === "ONE_TIME" ? n.price.currency : ((o = n.subscriptionSettings) == null ? void 0 : o.price.currency) || "USD"
+              /* @__PURE__ */ t.jsx(
+                "span",
+                {
+                  className: tt.title,
+                  id: "h4",
+                  children: g.name
+                }
+              ),
+              /* @__PURE__ */ t.jsx("span", { id: "md", children: Q({
+                amount: a === "ONE_TIME" ? g.price.amount : g.subscriptionSettings ? g.subscriptionSettings.price.amount : 0,
+                currency: a === "ONE_TIME" ? g.price.currency : ((c = g.subscriptionSettings) == null ? void 0 : c.price.currency) || "USD"
               }) })
             ] }),
-            /* @__PURE__ */ t.jsx("div", { children: a === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: tt.stock, children: [
-              (C = n.quantity.restrictions) != null && C.max || n.quantity.available !== void 0 ? ((y = n.quantity.restrictions) == null ? void 0 : y.max) || n.quantity.available : "∞",
-              " ",
-              "in stock"
-            ] }) })
+            /* @__PURE__ */ t.jsx("div", { id: "md", children: a === "ONE_TIME" && /* @__PURE__ */ t.jsxs(
+              "span",
+              {
+                className: tt.stock,
+                id: "md",
+                children: [
+                  (i = g.quantity.restrictions) != null && i.max || g.quantity.available !== void 0 ? ((_ = g.quantity.restrictions) == null ? void 0 : _.max) || g.quantity.available : "∞",
+                  " ",
+                  "in stock"
+                ]
+              }
+            ) })
           ]
         },
-        n.id
+        g.id
       );
     }) })
   ] });
 }, jn = (h) => {
-  const { product: i, setIsOpen: a } = h, { setIsOpen: s } = ct(), e = () => {
+  const { product: n, setIsOpen: a } = h, { setIsOpen: s } = rt(), e = () => {
     s(!1), setTimeout(() => {
       a(!1);
     }, 300);
@@ -2537,10 +2710,10 @@ const ns = (h) => {
     /* @__PURE__ */ t.jsxs("div", { className: tt.header, children: [
       /* @__PURE__ */ t.jsxs("div", { id: "h3", children: [
         "Buy ",
-        it(i.name)
+        it(n.name)
       ] }),
       /* @__PURE__ */ t.jsx(
-        b,
+        I,
         {
           name: "X",
           width: 24,
@@ -2558,67 +2731,67 @@ const ns = (h) => {
     /* @__PURE__ */ t.jsx("div", { className: tt.productOptions, children: /* @__PURE__ */ t.jsx(
       ns,
       {
-        product: i,
+        product: n,
         setIsOpen: a
       }
     ) })
   ] });
-}, vn = "_contentModal_1q42e_1", yn = "_modalTop_1q42e_13", bn = "_loading_1q42e_19", In = "_modalCards_1q42e_27", Nn = "_modalImage_1q42e_32", Cn = "_card_1q42e_37", Sn = "_cardInfo_1q42e_49", Pn = "_cardButtons_1q42e_56", kn = "_title_1q42e_62", wn = "_blockImage_1q42e_69", Tn = "_short_1q42e_78", Mn = "_price_1q42e_82", Bn = "_oldPrice_1q42e_89", $n = "_newPrice_1q42e_97", L = {
+}, vn = "_contentModal_1ptti_1", bn = "_modalTop_1ptti_13", In = "_loading_1ptti_19", Nn = "_modalCards_1ptti_27", Cn = "_modalImage_1ptti_32", Sn = "_card_1ptti_37", wn = "_cardInfo_1ptti_49", Pn = "_cardButtons_1ptti_56", kn = "_title_1ptti_62", Tn = "_blockImage_1ptti_69", Mn = "_short_1ptti_78", Bn = "_price_1ptti_82", qn = "_oldPrice_1ptti_89", $n = "_newPrice_1ptti_98", z = {
   contentModal: vn,
-  modalTop: yn,
-  loading: bn,
-  modalCards: In,
-  modalImage: Nn,
-  card: Cn,
-  cardInfo: Sn,
+  modalTop: bn,
+  loading: In,
+  modalCards: Nn,
+  modalImage: Cn,
+  card: Sn,
+  cardInfo: wn,
   cardButtons: Pn,
   title: kn,
-  blockImage: wn,
-  short: Tn,
-  price: Mn,
-  oldPrice: Bn,
+  blockImage: Tn,
+  short: Mn,
+  price: Bn,
+  oldPrice: qn,
   newPrice: $n
-}, Qn = (h) => {
+}, Jn = (h) => {
   const {
-    setIsOpen: i,
+    setIsOpen: n,
     pageContext: a,
     groupData: s,
     setProductId: e,
     setIsProductModalOpen: r,
-    setShowDropdown: c
-  } = h, [f, j] = x.useState(null), [v, T] = x.useState(!0), { setIsOpen: _ } = ct();
-  x.useEffect(() => {
+    setShowDropdown: o
+  } = h, [x, v] = y.useState(null), [b, M] = y.useState(!0), { setIsOpen: j } = rt();
+  y.useEffect(() => {
     var l;
-    T(!0);
+    M(!0);
     const d = (l = a.listings) == null ? void 0 : l.filter(
-      (n) => s.listingIdList.includes(n.id)
+      (g) => s.listingIdList.includes(g.id)
     );
-    d && j([...d]), T(!1);
-  }, [a]), x.useEffect(() => {
-    _(!0);
+    d && v([...d]), M(!1);
+  }, [a]), y.useEffect(() => {
+    j(!0);
   }, []);
   const m = () => {
-    _(!1), setTimeout(() => {
-      i(!1);
+    j(!1), setTimeout(() => {
+      n(!1);
     }, 300);
   };
-  return /* @__PURE__ */ t.jsx(ut, { close: () => i(!1), children: /* @__PURE__ */ t.jsxs(
+  return /* @__PURE__ */ t.jsx(ut, { close: () => n(!1), children: /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: L.contentModal,
+      className: z.contentModal,
       onClick: (d) => d.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: L.modalTop, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: z.modalTop, children: [
           /* @__PURE__ */ t.jsx(
             "span",
             {
-              className: L.title,
+              className: z.title,
               id: "h4",
               children: it(s.name)
             }
           ),
           /* @__PURE__ */ t.jsx(
-            b,
+            I,
             {
               name: "X",
               hoverable: !0,
@@ -2627,10 +2800,10 @@ const ns = (h) => {
             }
           )
         ] }),
-        !v && f && /* @__PURE__ */ t.jsx("div", { className: L.modalCards, children: f.map((d) => /* @__PURE__ */ t.jsxs(
+        !b && x && /* @__PURE__ */ t.jsx("div", { className: z.modalCards, children: x.map((d) => /* @__PURE__ */ t.jsxs(
           "div",
           {
-            className: L.card,
+            className: z.card,
             children: [
               /* @__PURE__ */ t.jsx("div", { children: d.productData.images[0] ? /* @__PURE__ */ t.jsx(
                 "img",
@@ -2639,63 +2812,91 @@ const ns = (h) => {
                   alt: "",
                   width: 64,
                   height: 64,
-                  className: L.modalImage
+                  className: z.modalImage
                 }
-              ) : /* @__PURE__ */ t.jsx("div", { className: F(L.blockImage, L.modalImage), children: /* @__PURE__ */ t.jsx(b, { name: "Image" }) }) }),
-              /* @__PURE__ */ t.jsxs("div", { className: L.cardInfo, children: [
+              ) : /* @__PURE__ */ t.jsx("div", { className: H(z.blockImage, z.modalImage), children: /* @__PURE__ */ t.jsx(I, { name: "Image" }) }) }),
+              /* @__PURE__ */ t.jsxs("div", { className: z.cardInfo, children: [
                 /* @__PURE__ */ t.jsx(
                   "div",
                   {
-                    className: L.name,
+                    className: z.name,
                     id: "h5",
                     children: d.productData.compareAtPrice && (d.productData.compareAtPrice.amount || 0) - (d.productData.minPrice.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
                       it(d.productData.name),
-                      /* @__PURE__ */ t.jsxs("span", { className: L.price, children: [
-                        /* @__PURE__ */ t.jsx("span", { className: L.newPrice, children: Q({
-                          amount: d.productData.minPrice.amount,
-                          currency: d.productData.minPrice.currency
-                        }) }),
-                        /* @__PURE__ */ t.jsx("span", { className: L.oldPrice, children: Q({
-                          amount: d.productData.compareAtPrice.amount,
-                          currency: d.productData.compareAtPrice.currency
-                        }) })
-                      ] })
+                      /* @__PURE__ */ t.jsxs(
+                        "span",
+                        {
+                          className: z.price,
+                          id: "md",
+                          children: [
+                            /* @__PURE__ */ t.jsx(
+                              "span",
+                              {
+                                className: z.newPrice,
+                                id: "md",
+                                children: Q({
+                                  amount: d.productData.minPrice.amount,
+                                  currency: d.productData.minPrice.currency
+                                })
+                              }
+                            ),
+                            /* @__PURE__ */ t.jsx(
+                              "span",
+                              {
+                                className: z.oldPrice,
+                                id: "md",
+                                children: Q({
+                                  amount: d.productData.compareAtPrice.amount,
+                                  currency: d.productData.compareAtPrice.currency
+                                })
+                              }
+                            )
+                          ]
+                        }
+                      )
                     ] }) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
                       it(d.productData.name),
-                      /* @__PURE__ */ t.jsx("span", { className: L.newPrice, children: Q({
-                        amount: d.productData.minPrice.amount,
-                        currency: d.productData.minPrice.currency
-                      }) })
+                      /* @__PURE__ */ t.jsx(
+                        "span",
+                        {
+                          className: z.newPrice,
+                          id: "md",
+                          children: Q({
+                            amount: d.productData.minPrice.amount,
+                            currency: d.productData.minPrice.currency
+                          })
+                        }
+                      )
                     ] })
                   }
                 ),
                 d.productData.shortDescription && /* @__PURE__ */ t.jsx(
                   "span",
                   {
-                    className: L.short,
+                    className: z.short,
                     id: "md",
                     children: it(d.productData.shortDescription)
                   }
                 )
               ] }),
-              /* @__PURE__ */ t.jsxs("div", { className: L.cardButtons, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: z.cardButtons, children: [
                 /* @__PURE__ */ t.jsx(
-                  E,
+                  R,
                   {
                     type: "Secondary",
                     onClick: () => {
-                      e(d.id), i(!1), r(!0);
+                      e(d.id), n(!1), r(!0);
                     },
                     children: "Buy"
                   }
                 ),
                 /* @__PURE__ */ t.jsx(Tt, { path: `/product/${d.productData.uniquePath}`, children: /* @__PURE__ */ t.jsx(
-                  E,
+                  R,
                   {
                     type: "Primary",
                     style: { whiteSpace: "nowrap" },
                     onClick: () => {
-                      c(!1), m();
+                      o(!1), m();
                     },
                     children: "View Details"
                   }
@@ -2705,54 +2906,55 @@ const ns = (h) => {
           },
           d.id
         )) }),
-        v && /* @__PURE__ */ t.jsx("div", { className: L.loading, children: /* @__PURE__ */ t.jsx(Bt, {}) })
+        b && /* @__PURE__ */ t.jsx("div", { className: z.loading, children: /* @__PURE__ */ t.jsx(Bt, {}) })
       ]
     }
   ) });
 };
 export {
-  Yn as Accordion,
-  Us as BurgerMenuButton,
-  E as Button,
-  qe as ButtonTypeSettings,
-  Ln as ButtonsSettings,
-  En as CategorySettings,
-  $t as ChargeTypes,
+  Gn as Accordion,
+  zs as BurgerMenuButton,
+  R as Button,
+  Oe as ButtonTypeSettings,
+  zn as ButtonsSettings,
+  Rn as CategorySettings,
+  qt as ChargeTypes,
   At as ChooseImage,
-  Zn as ChooseImageModal,
-  Rs as EmptyCart,
-  Rn as FormSettings,
-  Qn as GroupCardModal,
+  ti as ChooseImageModal,
+  Ls as EmptyCart,
+  Un as FormSettings,
+  Jn as GroupCardModal,
   Hn as HeaderButtons,
-  b as Icon,
+  I as Icon,
   Nt as InputSettings,
-  Rt as InputUI,
-  ti as ItemsSettings,
-  Dn as LayoutSettings,
+  Lt as InputUI,
+  ei as ItemsSettings,
+  En as LayoutSettings,
   Tt as Link,
-  Un as ListingSelector,
+  Fn as ListingSelector,
   Bt as Loader,
-  Wn as MetaInfoPost,
+  Xn as MetaInfoPost,
   ut as Modal,
-  Fn as PagesMobileMenu,
-  Ls as PagesMobileModal,
-  zn as PagesSettings,
-  Gn as ProductCardButtons,
-  Xn as ProductCardModal,
+  Vn as PagesMobileMenu,
+  Us as PagesMobileModal,
+  Ln as PagesSettings,
+  Wn as ProductCardButtons,
+  Qn as ProductCardModal,
   ns as ProductOptions,
-  ei as RadioUI,
-  Pt as RangeSelector,
+  si as RadioUI,
+  wt as RangeSelector,
   at as Select,
-  si as SelectInfiniteList,
-  ni as SelectUI,
-  Vn as ShareLink,
+  ni as SelectInfiniteList,
+  ii as SelectTypeText,
+  ai as SelectUI,
+  Yn as ShareLink,
   Es as ShoppingButton,
-  zs as ShoppingModalCart,
+  Rs as ShoppingModalCart,
   lt as Switch,
-  ii as TextSettings,
-  ai as TextareaSettings,
-  oi as TextareaUI,
-  ci as TypesText,
-  Ot as UserInfo,
-  ri as Wrapper
+  oi as TextSettings,
+  ci as TextareaSettings,
+  ri as TextareaUI,
+  li as TypesText,
+  $t as UserInfo,
+  di as Wrapper
 };