@billgangcom/theme-lib 1.65.2 → 1.66.1

package/dist/ui.es.js

@@ -1,21 +1,20 @@
-import { j as t, I as v, c as V, a as yt, u as ut, d as mt, P as ht, S as ot, R as St, D as pt, e as _t, v as gt, B as ct, O as It, f as rt, g as st, h as ft, C as xt, i as H, k as Pt, l as Tt, m as lt, n as Mt, o as jt, p as G, L as At, r as vt, t as dt, s as Nt, w as F, x as Ot, M as kt, y as $t, z as Et, A as wt, E as qt, F as Dt, G as Rt } from "./index-CMw6nNKj.js";
-import { Q as Zi, J as ta, N as ea, H as na, T as sa, K as ia } from "./index-CMw6nNKj.js";
-import x from "react";
-import "@phosphor-icons/react";
-const Lt = "_wrapper_1vmyb_2", zt = "_alignmentBlock_1vmyb_8", Ft = "_title_1vmyb_15", Vt = "_subtitle_1vmyb_22", Ut = "_alignmentContent_1vmyb_29", Ht = "_alignments_1vmyb_37", Yt = "_alignment_1vmyb_8", Wt = "_circle_1vmyb_60", Gt = "_paddings_1vmyb_67", Qt = "_padding_1vmyb_67", Xt = "_active_1vmyb_91", Jt = "_input_1vmyb_98", J = {
-  wrapper: Lt,
-  alignmentBlock: zt,
-  title: Ft,
-  subtitle: Vt,
-  alignmentContent: Ut,
-  alignments: Ht,
-  alignment: Yt,
-  circle: Wt,
-  paddings: Gt,
-  padding: Qt,
-  active: Xt,
-  input: Jt
-}, Kt = [
+import { j as t, I as b, c as F, d as It, u as mt, e as ht, P as pt, S as ct, R as St, D as _t, f as gt, v as ft, B as rt, g as it, h as $t, a as wt, O as ut, i as st, k as xt, C as vt, l as Y, m as Mt, n as At, o as lt, p as Ot, r as bt, t as Q, L as Et, w as jt, x as dt, s as Nt, y as L, z as Rt, M as kt, A as qt, E as Dt, F as Bt, G as Pt, H as Lt, J as zt } from "./index-6YsaO6Zm.js";
+import { W as ta, N as ea, U as na, V as sa, K as ia, T as aa, Q as oa } from "./index-6YsaO6Zm.js";
+import f from "react";
+const Ft = "_wrapper_1vmyb_2", Vt = "_alignmentBlock_1vmyb_8", Ut = "_title_1vmyb_15", Ht = "_subtitle_1vmyb_22", Yt = "_alignmentContent_1vmyb_29", Wt = "_alignments_1vmyb_37", Gt = "_alignment_1vmyb_8", Qt = "_circle_1vmyb_60", Xt = "_paddings_1vmyb_67", Jt = "_padding_1vmyb_67", Kt = "_active_1vmyb_91", Zt = "_input_1vmyb_98", K = {
+  wrapper: Ft,
+  alignmentBlock: Vt,
+  title: Ut,
+  subtitle: Ht,
+  alignmentContent: Yt,
+  alignments: Wt,
+  alignment: Gt,
+  circle: Qt,
+  paddings: Xt,
+  padding: Jt,
+  active: Kt,
+  input: Zt
+}, te = [
   "topLeft",
   "top",
   "topRight",
@@ -25,10 +24,10 @@ const Lt = "_wrapper_1vmyb_2", zt = "_alignmentBlock_1vmyb_8", Ft = "_title_1vmy
   "bottomLeft",
   "bottom",
   "bottomRight"
-], Zt = ["left", "top", "right", "bottom"], Oi = (o) => {
-  const { alignment: s, padding: e, setPadding: n, setAlignment: i } = o;
-  function c(l) {
-    switch (l) {
+], ee = ["left", "top", "right", "bottom"], Ei = (o) => {
+  const { alignment: s, padding: e, setPadding: n, setAlignment: a } = o;
+  function c(h) {
+    switch (h) {
       case "left":
       case "topLeft":
       case "bottomLeft":
@@ -45,8 +44,8 @@ const Lt = "_wrapper_1vmyb_2", zt = "_alignmentBlock_1vmyb_8", Ft = "_title_1vmy
         return "TextAlignCenter";
     }
   }
-  function u(l) {
-    switch (l) {
+  function u(h) {
+    switch (h) {
       case "left":
         return "AlignLeft";
       case "right":
@@ -57,29 +56,29 @@ const Lt = "_wrapper_1vmyb_2", zt = "_alignmentBlock_1vmyb_8", Ft = "_title_1vmy
         return "AlignBottom";
     }
   }
-  const [r, m] = x.useState(null), [p, B] = x.useState(null);
-  return /* @__PURE__ */ t.jsxs("div", { className: J.layout, children: [
-    /* @__PURE__ */ t.jsx("h3", { className: J.title, children: "Layout (for Desktop version)" }),
-    /* @__PURE__ */ t.jsxs("div", { className: J.alignmentBlock, children: [
-      /* @__PURE__ */ t.jsx("h5", { className: J.subtitle, children: "Alignment" }),
-      /* @__PURE__ */ t.jsxs("div", { className: J.alignmentContent, children: [
-        /* @__PURE__ */ t.jsx("div", { className: J.alignments, children: Kt.map((l) => /* @__PURE__ */ t.jsxs(
+  const [r, m] = f.useState(null), [_, B] = f.useState(null);
+  return /* @__PURE__ */ t.jsxs("div", { className: K.layout, children: [
+    /* @__PURE__ */ t.jsx("h3", { className: K.title, children: "Layout (for Desktop version)" }),
+    /* @__PURE__ */ t.jsxs("div", { className: K.alignmentBlock, children: [
+      /* @__PURE__ */ t.jsx("h5", { className: K.subtitle, children: "Alignment" }),
+      /* @__PURE__ */ t.jsxs("div", { className: K.alignmentContent, children: [
+        /* @__PURE__ */ t.jsx("div", { className: K.alignments, children: te.map((h) => /* @__PURE__ */ t.jsxs(
           "div",
           {
             onClick: () => {
-              i(l);
+              a(h);
             },
-            className: J.alignment,
+            className: K.alignment,
             onMouseEnter: () => {
-              m(l);
+              m(h);
             },
             onMouseLeave: () => {
               m(null);
             },
             children: [
-              l !== s && r !== l && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
-              l !== s && r === l && /* @__PURE__ */ t.jsx(
-                v,
+              h !== s && r !== h && /* @__PURE__ */ t.jsx("div", { className: K.circle }),
+              h !== s && r === h && /* @__PURE__ */ t.jsx(
+                b,
                 {
                   name: c(r),
                   fill: "#c2c2c2",
@@ -87,8 +86,8 @@ const Lt = "_wrapper_1vmyb_2", zt = "_alignmentBlock_1vmyb_8", Ft = "_title_1vmy
                   height: 22
                 }
               ),
-              l === s && /* @__PURE__ */ t.jsx(
-                v,
+              h === s && /* @__PURE__ */ t.jsx(
+                b,
                 {
                   name: c(s),
                   fill: "#FF3F19",
@@ -98,37 +97,37 @@ const Lt = "_wrapper_1vmyb_2", zt = "_alignmentBlock_1vmyb_8", Ft = "_title_1vmy
               )
             ]
           },
-          l
+          h
         )) }),
-        /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: Zt.map((l) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: K.paddings, children: ee.map((h) => /* @__PURE__ */ t.jsxs(
           "label",
           {
-            className: V(J.padding, {
-              [J.active]: p === l
+            className: F(K.padding, {
+              [K.active]: _ === h
             }),
             onFocus: () => {
-              B(l);
+              B(h);
             },
             onBlur: () => {
               B(null);
             },
             children: [
               /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-                v,
+                b,
                 {
-                  name: u(l),
+                  name: u(h),
                   width: 20,
                   height: 20
                 }
               ) }),
               /* @__PURE__ */ t.jsx(
-                yt,
+                It,
                 {
                   type: "number",
-                  value: String(e[l]),
-                  onChange: (a) => n({
+                  value: String(e[h]),
+                  onChange: (i) => n({
                     ...e,
-                    [l]: Math.min(Number(a), 999)
+                    [h]: Math.min(Number(i), 999)
                   }),
                   max: 999,
                   paddingless: !0,
@@ -137,109 +136,111 @@ const Lt = "_wrapper_1vmyb_2", zt = "_alignmentBlock_1vmyb_8", Ft = "_title_1vmy
               )
             ]
           },
-          l
+          h
         )) })
       ] })
     ] })
   ] });
-}, te = "_title_82zux_1", ee = "_subtitle_82zux_5", ne = "_header_82zux_12", se = "_text_82zux_13", ie = "_productsBlock_82zux_14", ae = "_top_82zux_26", oe = "_itemsBlock_82zux_35", ce = "_typeTexts_82zux_41", re = "_block_82zux_48", le = "_active_82zux_61", de = "_products_82zux_14", ue = "_product_82zux_14", me = "_button_82zux_80", he = "_disabled_82zux_91", pe = "_image_82zux_95", _e = "_info_82zux_102", ge = "_name_82zux_114", fe = "_buttons_82zux_118", xe = "_modal_82zux_125", ve = "_link_82zux_145", je = "_modalOptions_82zux_151", be = "_addButton_82zux_157", ye = "_deleteButton_82zux_179", Q = {
-  title: te,
-  subtitle: ee,
-  header: ne,
-  text: se,
-  productsBlock: ie,
-  top: ae,
-  itemsBlock: oe,
-  typeTexts: ce,
-  block: re,
-  active: le,
-  products: de,
-  product: ue,
-  button: me,
-  disabled: he,
-  image: pe,
-  info: _e,
-  name: ge,
-  buttons: fe,
-  modal: xe,
-  link: ve,
-  modalOptions: je,
-  addButton: be,
-  deleteButton: ye
+}, ne = "_title_82zux_1", se = "_subtitle_82zux_5", ie = "_header_82zux_12", ae = "_text_82zux_13", oe = "_productsBlock_82zux_14", ce = "_top_82zux_26", re = "_itemsBlock_82zux_35", le = "_typeTexts_82zux_41", de = "_block_82zux_48", ue = "_active_82zux_61", me = "_products_82zux_14", he = "_product_82zux_14", pe = "_button_82zux_80", _e = "_disabled_82zux_91", ge = "_image_82zux_95", fe = "_info_82zux_102", xe = "_name_82zux_114", ve = "_buttons_82zux_118", je = "_modal_82zux_125", be = "_link_82zux_145", ye = "_modalOptions_82zux_151", Ie = "_addButton_82zux_157", Ne = "_deleteButton_82zux_179", X = {
+  title: ne,
+  subtitle: se,
+  header: ie,
+  text: ae,
+  productsBlock: oe,
+  top: ce,
+  itemsBlock: re,
+  typeTexts: le,
+  block: de,
+  active: ue,
+  products: me,
+  product: he,
+  button: pe,
+  disabled: _e,
+  image: ge,
+  info: fe,
+  name: xe,
+  buttons: ve,
+  modal: je,
+  link: be,
+  modalOptions: ye,
+  addButton: Ie,
+  deleteButton: Ne
 };
-function Ie({ id: o, children: s }) {
+function ke({ id: o, children: s }) {
   const {
     attributes: e,
     listeners: n,
-    setNodeRef: i,
+    setNodeRef: a,
     transform: c,
     transition: u,
     isDragging: r
-  } = ft({
+  } = xt({
     id: o
   }), m = {
-    transform: xt.Transform.toString(c),
+    transform: vt.Transform.toString(c),
     transition: u
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: i,
+      ref: a,
       style: m,
-      className: `${Q.product} ${r ? Q.dragging : ""}`,
+      className: `${X.product} ${r ? X.dragging : ""}`,
       ...e,
       ...n,
       children: s
     }
   );
 }
-const Ei = (o) => {
+const Ri = (o) => {
   const {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
-    setItems: i,
+    setItems: a,
     other: c,
-    title: u,
-    subtitle: r,
-    draggable: m = !1,
-    withImage: p = !1,
-    addable: B = !0,
-    itemsOptions: l,
-    hasRangeSelector: a = !1,
-    rangeSelectorOptions: j,
-    limit: d,
-    autoScrollInterval: S,
-    deletable: g
-  } = o, k = ut(
-    mt(ht, {
+    tags: u,
+    title: r,
+    subtitle: m,
+    draggable: _ = !1,
+    withImage: B = !1,
+    addable: h = !0,
+    itemsOptions: i,
+    hasRangeSelector: y = !1,
+    rangeSelectorOptions: d,
+    limit: C,
+    autoScrollInterval: v,
+    deletable: N,
+    aspectRatio: I,
+    setAspectRatio: A
+  } = o, x = mt(
+    ht(pt, {
       activationConstraint: {
         distance: 5
       }
     })
-  ), q = (y) => {
-    console.log("Trigger?");
-    const { active: M, over: O } = y;
-    if (O && M.id !== O.id) {
-      const I = n.findIndex(($) => $ === M.id), h = n.findIndex(($) => $ === O.id);
-      if (I !== -1 && h !== -1) {
-        const $ = [...n], [P] = $.splice(I, 1);
-        $.splice(h, 0, P), i($);
+  ), D = (p) => {
+    const { active: g, over: w } = p;
+    if (w && g.id !== w.id) {
+      const S = n.findIndex((q) => q === g.id), P = n.findIndex((q) => q === w.id);
+      if (S !== -1 && P !== -1) {
+        const q = [...n], [j] = q.splice(S, 1);
+        q.splice(P, 0, j), a(q);
       }
     }
   };
-  function E(y) {
-    if (p)
-      return y ? /* @__PURE__ */ t.jsx(
+  function z(p) {
+    if (B)
+      return p ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${y[0]}/w=1000`,
+          src: `https://imagedelivery.net/${p[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        v,
+        b,
         {
           name: "Image",
           width: 16,
@@ -248,12 +249,12 @@ const Ei = (o) => {
         }
       );
   }
-  const f = (y, M = !1) => {
-    const O = l.find((h) => h.id === y);
-    if (!O) return;
-    const I = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      m && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        v,
+  const H = (p, g = !1) => {
+    const w = i.find((P) => P.id === p);
+    if (!w) return;
+    const S = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        b,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -262,77 +263,80 @@ const Ei = (o) => {
         }
       ) }),
       /* @__PURE__ */ t.jsx(
-        rt,
+        it,
         {
-          onChange: (h) => {
-            const $ = [...n], P = l.find((A) => A.name === h);
-            if (!P) return;
-            const b = P.id, N = $.map((A) => A === y ? b : A);
-            i([...N]);
+          onChange: (P) => {
+            const q = [...n], j = i.find((T) => T.name === P);
+            if (!j) return;
+            const M = j.id, V = q.map((T) => T === p ? M : T);
+            a([...V]);
           },
-          value: O.name,
-          options: l.filter((h) => !n.find(($) => $ === h.id)).map((h) => h.name),
-          leftAddon: E(O.images)
+          value: w.name,
+          options: i.filter((P) => !n.find((q) => q === P.id)).map((P) => P.name),
+          leftAddonOptions: i.map((P) => ({
+            value: P.name,
+            addon: z(P.images)
+          }))
         }
       ),
-      M && /* @__PURE__ */ t.jsx("div", { className: Q.buttons, children: /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
-        v,
+      g && /* @__PURE__ */ t.jsx("div", { className: X.buttons, children: /* @__PURE__ */ t.jsx("div", { className: X.deleteButton, children: /* @__PURE__ */ t.jsx(
+        b,
         {
           name: "Trash",
           hoverable: !0,
           width: 20,
           height: 20,
           fill: "#C12A2A",
-          onClick: () => i(n.filter((h) => h !== y))
+          onClick: () => a(n.filter((P) => P !== p))
         }
       ) }) })
     ] });
-    return m ? /* @__PURE__ */ t.jsx(
-      Ie,
+    return _ ? /* @__PURE__ */ t.jsx(
+      ke,
       {
-        id: y,
-        children: I
+        id: p,
+        children: S
       },
       st()
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: Q.product,
-        children: I
+        className: X.product,
+        children: S
       },
       st()
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: Q.productsBlock, children: [
-    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Q.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: Q.title, children: u }),
+  return /* @__PURE__ */ t.jsxs("div", { className: X.productsBlock, children: [
+    (r || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: X.top, children: [
+      r && /* @__PURE__ */ t.jsx("h3", { className: X.title, children: r }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        ot,
+        ct,
         {
           current: s,
-          onChange: (y) => e == null ? void 0 : e(y)
+          onChange: (p) => e == null ? void 0 : e(p)
         }
       )
     ] }),
-    a && j && /* @__PURE__ */ t.jsx(St, { ...j }),
-    /* @__PURE__ */ t.jsxs("div", { className: Q.products, children: [
-      r && /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: r }),
-      m ? /* @__PURE__ */ t.jsx(
-        pt,
+    y && d && /* @__PURE__ */ t.jsx(St, { ...d }),
+    /* @__PURE__ */ t.jsxs("div", { className: X.products, children: [
+      m && /* @__PURE__ */ t.jsx("h5", { className: X.subtitle, children: m }),
+      _ ? /* @__PURE__ */ t.jsx(
+        _t,
         {
-          sensors: k,
-          onDragEnd: q,
+          sensors: x,
+          onDragEnd: D,
           children: /* @__PURE__ */ t.jsx(
-            _t,
+            gt,
             {
               items: n,
-              strategy: gt,
-              children: n.map((y) => f(y, g))
+              strategy: ft,
+              children: n.map((p) => H(p, N))
             }
           )
         }
-      ) : n.map((y) => f(y, g)),
-      B && /* @__PURE__ */ t.jsx(
+      ) : n.map((p) => H(p, N)),
+      h && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -342,33 +346,33 @@ const Ei = (o) => {
             gap: 5
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            rt,
             {
               withoutHover: !0,
-              className: V(Q.button, {
-                [Q.disabled]: !!(d && d <= n.length || n.length === l.length)
+              className: F(X.button, {
+                [X.disabled]: !!(C && C <= n.length || n.length === i.length)
               }),
               size: "s",
-              disabled: !!(d && d <= n.length || n.length === l.length),
+              disabled: !!(C && C <= n.length || n.length === i.length),
               onClick: () => {
-                const y = [...n];
-                let M = null;
-                if (l) {
-                  for (let O = 0; O < l.length; O++)
-                    if (!n.find((I) => I === l[O].id)) {
-                      M = l[O];
+                const p = [...n];
+                let g = null;
+                if (i) {
+                  for (let w = 0; w < i.length; w++)
+                    if (!n.find((S) => S === i[w].id)) {
+                      g = i[w];
                       break;
                     }
                 }
-                y.push((M == null ? void 0 : M.id) || l[0].id), i(y);
+                p.push((g == null ? void 0 : g.id) || i[0].id), a(p);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: Q.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: X.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  v,
+                  b,
                   {
                     name: "Plus",
                     width: 16,
@@ -381,14 +385,37 @@ const Ei = (o) => {
         }
       )
     ] }),
-    c !== void 0 && /* @__PURE__ */ t.jsx(It, { items: c }),
-    S !== void 0 && /* @__PURE__ */ t.jsx(
-      yt,
+    I && A && /* @__PURE__ */ t.jsx(
+      it,
+      {
+        value: I,
+        label: "Aspect Ratio",
+        options: Object.keys($t),
+        onChange: (p) => A(p),
+        leftAddonOptions: wt
+      }
+    ),
+    u !== void 0 && /* @__PURE__ */ t.jsx(
+      ut,
+      {
+        tagsTitle: "Tags",
+        items: u
+      }
+    ),
+    c !== void 0 && /* @__PURE__ */ t.jsx(
+      ut,
+      {
+        otherTitle: "Other",
+        items: c
+      }
+    ),
+    v !== void 0 && /* @__PURE__ */ t.jsx(
+      It,
       {
         label: "Auto scroll interval",
         type: "number",
-        value: String(S.scrollInterval),
-        onChange: (y) => S.setScrollInterval(Number(y)),
+        value: String(v.scrollInterval),
+        onChange: (p) => v.setScrollInterval(Number(p)),
         min: 0.1,
         max: 100,
         style: {
@@ -398,52 +425,52 @@ const Ei = (o) => {
       }
     )
   ] });
-}, Ne = "_title_roi3a_1", ke = "_subtitle_roi3a_5", Ce = "_header_roi3a_12", Se = "_text_roi3a_13", $e = "_productsBlock_roi3a_14", we = "_top_roi3a_26", qe = "_itemsBlock_roi3a_35", Be = "_typeTexts_roi3a_41", Pe = "_block_roi3a_48", Te = "_active_roi3a_61", Me = "_products_roi3a_14", Ae = "_product_roi3a_14", Oe = "_button_roi3a_80", Ee = "_disabled_roi3a_91", De = "_image_roi3a_95", Re = "_info_roi3a_102", Le = "_name_roi3a_114", ze = "_buttons_roi3a_118", Fe = "_modal_roi3a_125", Ve = "_link_roi3a_145", Ue = "_modalOptions_roi3a_151", He = "_addButton_roi3a_164", Ye = "_deleteButton_roi3a_179", We = "_closeIcon_roi3a_191", Y = {
-  title: Ne,
-  subtitle: ke,
-  header: Ce,
-  text: Se,
-  productsBlock: $e,
-  top: we,
-  itemsBlock: qe,
-  typeTexts: Be,
-  block: Pe,
-  active: Te,
-  products: Me,
-  product: Ae,
-  button: Oe,
-  disabled: Ee,
-  image: De,
-  info: Re,
-  name: Le,
-  buttons: ze,
-  modal: Fe,
-  link: Ve,
-  modalOptions: Ue,
-  addButton: He,
-  deleteButton: Ye,
-  closeIcon: We
+}, Ce = "_title_roi3a_1", Se = "_subtitle_roi3a_5", $e = "_header_roi3a_12", we = "_text_roi3a_13", qe = "_productsBlock_roi3a_14", Be = "_top_roi3a_26", Pe = "_itemsBlock_roi3a_35", Te = "_typeTexts_roi3a_41", Me = "_block_roi3a_48", Ae = "_active_roi3a_61", Oe = "_products_roi3a_14", Ee = "_product_roi3a_14", Re = "_button_roi3a_80", De = "_disabled_roi3a_91", Le = "_image_roi3a_95", ze = "_info_roi3a_102", Fe = "_name_roi3a_114", Ve = "_buttons_roi3a_118", Ue = "_modal_roi3a_125", He = "_link_roi3a_145", Ye = "_modalOptions_roi3a_151", We = "_addButton_roi3a_164", Ge = "_deleteButton_roi3a_179", Qe = "_closeIcon_roi3a_191", W = {
+  title: Ce,
+  subtitle: Se,
+  header: $e,
+  text: we,
+  productsBlock: qe,
+  top: Be,
+  itemsBlock: Pe,
+  typeTexts: Te,
+  block: Me,
+  active: Ae,
+  products: Oe,
+  product: Ee,
+  button: Re,
+  disabled: De,
+  image: Le,
+  info: ze,
+  name: Fe,
+  buttons: Ve,
+  modal: Ue,
+  link: He,
+  modalOptions: Ye,
+  addButton: We,
+  deleteButton: Ge,
+  closeIcon: Qe
 };
-function Ge({ product: o, children: s }) {
+function Xe({ product: o, children: s }) {
   const {
     attributes: e,
     listeners: n,
-    setNodeRef: i,
+    setNodeRef: a,
     transform: c,
     transition: u,
     isDragging: r
-  } = ft({
+  } = xt({
     id: o.id
   }), m = {
-    transform: xt.Transform.toString(c),
+    transform: vt.Transform.toString(c),
     transition: u
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: i,
+      ref: a,
       style: m,
-      className: `${Y.product} ${r ? Y.dragging : ""}`,
+      className: `${W.product} ${r ? W.dragging : ""}`,
       ...e,
       ...n,
       children: s
@@ -455,52 +482,52 @@ const Di = (o) => {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
-    setItems: i,
+    setItems: a,
     title: c,
     subtitle: u,
     editable: r = !0,
     draggable: m = !1,
-    deletable: p = !0,
+    deletable: _ = !0,
     addable: B = !0,
-    itemsType: l,
-    itemsOptions: a,
-    addableOptions: j = {},
+    itemsType: h,
+    itemsOptions: i,
+    addableOptions: y = {},
     limit: d
-  } = o, [S, g] = x.useState(null), [k, q] = x.useState(null), E = x.useRef(null), f = ut(
-    mt(ht, {
+  } = o, [C, v] = f.useState(null), [N, I] = f.useState(null), A = f.useRef(null), x = mt(
+    ht(pt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  x.useEffect(() => {
-    if (S) {
-      const I = [...n].map((h) => h.id === S.id ? S : h);
-      i(I);
+  f.useEffect(() => {
+    if (C) {
+      const p = [...n].map((g) => g.id === C.id ? C : g);
+      a(p);
     }
-  }, [S]), x.useEffect(() => {
-    E.current && k && (E.current.getBoundingClientRect().height, k.top);
-  }, [E.current, k]);
-  const y = (I, h) => {
-    I.stopPropagation();
-    const $ = I.target.getBoundingClientRect();
-    q({
-      top: $.top + window.scrollY,
-      left: $.left - 30
-    }), g(h);
-  }, M = (I) => {
-    const { active: h, over: $ } = I;
-    if ($ && h.id !== $.id) {
-      const P = n.findIndex((N) => N.id === h.id), b = n.findIndex((N) => N.id === $.id);
-      if (P !== -1 && b !== -1) {
-        const N = [...n], [A] = N.splice(P, 1);
-        N.splice(b, 0, A), i(N);
+  }, [C]), f.useEffect(() => {
+    A.current && N && (A.current.getBoundingClientRect().height, N.top);
+  }, [A.current, N]);
+  const D = (p, g) => {
+    p.stopPropagation();
+    const w = p.target.getBoundingClientRect();
+    I({
+      top: w.top + window.scrollY,
+      left: w.left - 30
+    }), v(g);
+  }, z = (p) => {
+    const { active: g, over: w } = p;
+    if (w && g.id !== w.id) {
+      const S = n.findIndex((q) => q.id === g.id), P = n.findIndex((q) => q.id === w.id);
+      if (S !== -1 && P !== -1) {
+        const q = [...n], [j] = q.splice(S, 1);
+        q.splice(P, 0, j), a(q);
       }
     }
-  }, O = (I, h) => {
-    const $ = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  }, H = (p, g) => {
+    const w = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       m && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        v,
+        b,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -508,98 +535,98 @@ const Di = (o) => {
           height: 20
         }
       ) }),
-      l === "select" && a && /* @__PURE__ */ t.jsx(
-        rt,
+      h === "select" && i && /* @__PURE__ */ t.jsx(
+        it,
         {
-          onChange: (P) => {
-            const b = [...n], N = a.find((U) => U.name === P);
-            if (!N) return;
-            const A = b.map((U) => U.id === I.id ? {
-              ...N,
+          onChange: (S) => {
+            const P = [...n], q = i.find((M) => M.name === S);
+            if (!q) return;
+            const j = P.map((M) => M.id === p.id ? {
+              ...q,
               name: {
-                "en-US": P
+                "en-US": S
               }
-            } : U);
-            g({
-              ...I,
+            } : M);
+            v({
+              ...p,
               name: {
-                "en-US": P
+                "en-US": S
               }
-            }), i([...A]);
+            }), a([...j]);
           },
-          value: I.name,
-          options: a.filter((P) => !n.find((b) => b.name === P.name)).map((P) => P.name)
+          value: p.name,
+          options: i.filter((S) => !n.find((P) => P.name === S.name)).map((S) => S.name)
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: Y.buttons, children: [
-        r && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
-          v,
+      /* @__PURE__ */ t.jsxs("div", { className: W.buttons, children: [
+        r && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
+          b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (P) => y(P, I)
+            onClick: (S) => D(S, p)
           }
         ) }),
-        p && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
-          v,
+        _ && /* @__PURE__ */ t.jsx("div", { className: W.deleteButton, children: /* @__PURE__ */ t.jsx(
+          b,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(n.filter((P) => P.id !== I.id))
+            onClick: () => a(n.filter((S) => S.id !== p.id))
           }
         ) })
       ] })
     ] });
     return m ? /* @__PURE__ */ t.jsx(
-      Ge,
+      Xe,
       {
-        product: I,
-        index: h,
-        children: $
+        product: p,
+        index: g,
+        children: w
       },
-      I.id
+      p.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: Y.product,
-        children: $
+        className: W.product,
+        children: w
       },
-      I.id
+      p.id
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: Y.productsBlock, children: [
-    (c || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Y.top, children: [
-      c && /* @__PURE__ */ t.jsx("h3", { className: Y.title, children: c }),
+  return /* @__PURE__ */ t.jsxs("div", { className: W.productsBlock, children: [
+    (c || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: W.top, children: [
+      c && /* @__PURE__ */ t.jsx("h3", { className: W.title, children: c }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        ot,
+        ct,
         {
           current: s,
-          onChange: (I) => e == null ? void 0 : e(I)
+          onChange: (p) => e == null ? void 0 : e(p)
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: Y.products, children: [
-      u && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: u }),
+    /* @__PURE__ */ t.jsxs("div", { className: W.products, children: [
+      u && /* @__PURE__ */ t.jsx("h5", { className: W.subtitle, children: u }),
       m ? /* @__PURE__ */ t.jsx(
-        pt,
+        _t,
         {
-          sensors: f,
-          onDragEnd: M,
+          sensors: x,
+          onDragEnd: z,
           children: /* @__PURE__ */ t.jsx(
-            _t,
+            gt,
             {
-              items: n.map((I) => I.id),
-              strategy: gt,
-              children: n.map((I, h) => O(I, h))
+              items: n.map((p) => p.id),
+              strategy: ft,
+              children: n.map((p, g) => H(p, g))
             }
           )
         }
-      ) : n.map((I, h) => O(I, h)),
+      ) : n.map((p, g) => H(p, g)),
       B && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -609,37 +636,37 @@ const Di = (o) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            rt,
             {
               withoutHover: !0,
-              className: V(Y.button, {
-                [Y.disabled]: !!(d && d <= n.length || n.length === (a == null ? void 0 : a.length))
+              className: F(W.button, {
+                [W.disabled]: !!(d && d <= n.length || n.length === (i == null ? void 0 : i.length))
               }),
               size: "s",
-              disabled: !!(d && d <= n.length || n.length === (a == null ? void 0 : a.length)),
+              disabled: !!(d && d <= n.length || n.length === (i == null ? void 0 : i.length)),
               onClick: () => {
-                const I = [...n];
-                let h = null;
-                if (a) {
-                  for (let $ = 0; $ < a.length; $++)
-                    if (!n.find((P) => P.id === a[$].id)) {
-                      h = a[$];
+                const p = [...n];
+                let g = null;
+                if (i) {
+                  for (let w = 0; w < i.length; w++)
+                    if (!n.find((S) => S.id === i[w].id)) {
+                      g = i[w];
                       break;
                     }
                 }
-                l === "select" && a && I.push({
-                  name: h ? h.name : a[0].name,
-                  id: (h == null ? void 0 : h.id) || a[0].id,
-                  ...j
-                }), i(I);
+                h === "select" && i && p.push({
+                  name: g ? g.name : i[0].name,
+                  id: (g == null ? void 0 : g.id) || i[0].id,
+                  ...y
+                }), a(p);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: Y.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: W.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  v,
+                  b,
                   {
                     name: "Plus",
                     width: 16,
@@ -654,99 +681,99 @@ const Di = (o) => {
     ] })
   ] });
 };
-function Qe(o) {
-  const { product: s, children: e } = o, { attributes: n, listeners: i, setNodeRef: c, transform: u, transition: r, isDragging: m } = ft({
+function Je(o) {
+  const { product: s, children: e } = o, { attributes: n, listeners: a, setNodeRef: c, transform: u, transition: r, isDragging: m } = xt({
     id: s.id
-  }), p = {
-    transform: xt.Transform.toString(u),
+  }), _ = {
+    transform: vt.Transform.toString(u),
     transition: r
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: c,
-      style: p,
-      className: `${H.product} ${m ? H.dragging : ""}`,
+      style: _,
+      className: `${Y.product} ${m ? Y.dragging : ""}`,
       ...n,
-      ...i,
+      ...a,
       children: e
     }
   );
 }
-const Ri = (o) => {
+const Li = (o) => {
   const {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
-    setItems: i,
+    setItems: a,
     other: c,
     title: u,
     subtitle: r,
     editable: m = !0,
-    draggable: p = !1,
+    draggable: _ = !1,
     withImage: B = !1,
-    deletable: l = !0,
-    addable: a = !0,
-    itemsType: j,
+    deletable: h = !0,
+    addable: i = !0,
+    itemsType: y,
     itemsPlaceholder: d = "",
-    itemsOptions: S,
-    hasRangeSelector: g = !1,
-    rangeSelectorOptions: k,
-    modalOptions: q,
-    addableOptions: E = {},
-    limit: f
-  } = o, [y, M] = x.useState(null), [O, I] = x.useState({
+    itemsOptions: C,
+    hasRangeSelector: v = !1,
+    rangeSelectorOptions: N,
+    modalOptions: I,
+    addableOptions: A = {},
+    limit: x
+  } = o, [D, z] = f.useState(null), [H, p] = f.useState({
     top: 0,
     left: 0
-  }), [h, $] = x.useState(null), P = x.useRef(null), [b, N] = x.useState(!1), A = ut(
-    mt(ht, {
+  }), [g, w] = f.useState(null), S = f.useRef(null), [P, q] = f.useState(!1), j = mt(
+    ht(pt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  x.useEffect(() => {
-    const _ = () => {
-      M(null), N(!1);
+  f.useEffect(() => {
+    const l = () => {
+      z(null), q(!1);
     };
-    return document.body.addEventListener("click", _), M(null), N(!1), () => {
-      M(null), N(!1), document.body.removeEventListener("click", _);
+    return document.body.addEventListener("click", l), z(null), q(!1), () => {
+      z(null), q(!1), document.body.removeEventListener("click", l);
     };
-  }, []), x.useEffect(() => {
-    if (y) {
-      const _ = [...n].map((R) => R.id === y.id ? y : R);
-      i(_);
+  }, []), f.useEffect(() => {
+    if (D) {
+      const l = [...n].map((E) => E.id === D.id ? D : E);
+      a(l);
     }
-  }, [y]), x.useEffect(() => {
-    if (P.current && h) {
-      const _ = P.current.getBoundingClientRect().height, R = window.innerHeight;
-      let T = h.top;
-      T + _ > R + window.scrollY - 200 && (T = R + window.scrollY - _ - 200), T < 0 && (T = 10), I({
-        top: T,
-        left: h.left
+  }, [D]), f.useEffect(() => {
+    if (S.current && g) {
+      const l = S.current.getBoundingClientRect().height, E = window.innerHeight;
+      let R = g.top;
+      R + l > E + window.scrollY - 200 && (R = E + window.scrollY - l - 200), R < 0 && (R = 10), p({
+        top: R,
+        left: g.left
       });
     }
-  }, [P.current, h]);
-  const U = (_, R) => {
-    _.stopPropagation();
-    const T = _.target.getBoundingClientRect();
-    $({
-      top: T.top + window.scrollY,
-      left: T.left - 30
-    }), M(R), N(!0);
+  }, [S.current, g]);
+  const M = (l, E) => {
+    l.stopPropagation();
+    const R = l.target.getBoundingClientRect();
+    w({
+      top: R.top + window.scrollY,
+      left: R.left - 30
+    }), z(E), q(!0);
   };
-  function D(_) {
+  function V(l) {
     if (B)
-      return _ ? /* @__PURE__ */ t.jsx(
+      return l ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${_[0]}/w=1000`,
+          src: `https://imagedelivery.net/${l[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        v,
+        b,
         {
           name: "Image",
           width: 16,
@@ -755,20 +782,20 @@ const Ri = (o) => {
         }
       );
   }
-  const z = (_) => {
-    const { active: R, over: T } = _;
-    if (T && R.id !== T.id) {
-      const L = n.findIndex((W) => W.id === R.id), nt = n.findIndex((W) => W.id === T.id);
-      if (L !== -1 && nt !== -1) {
-        const W = [...n], [K] = W.splice(L, 1);
-        W.splice(nt, 0, K), i(W);
+  const T = (l) => {
+    const { active: E, over: R } = l;
+    if (R && E.id !== R.id) {
+      const O = n.findIndex((G) => G.id === E.id), nt = n.findIndex((G) => G.id === R.id);
+      if (O !== -1 && nt !== -1) {
+        const G = [...n], [Z] = G.splice(O, 1);
+        G.splice(nt, 0, Z), a(G);
       }
     }
-  }, Z = (_) => {
-    var T;
-    const R = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        v,
+  }, U = (l) => {
+    var R;
+    const E = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        b,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -776,140 +803,145 @@ const Ri = (o) => {
           height: 20
         }
       ) }),
-      j === "select" && S && /* @__PURE__ */ t.jsx(
-        rt,
+      y === "select" && C && /* @__PURE__ */ t.jsx(
+        it,
         {
-          onChange: (L) => {
-            const W = [...n].map((K) => K.id === _.id ? {
-              ..._,
+          onChange: (O) => {
+            const G = [...n].map((Z) => Z.id === l.id ? {
+              ...l,
               name: {
-                "en-US": L
+                "en-US": O
               }
-            } : K);
-            M({
-              ..._,
+            } : Z);
+            z({
+              ...l,
               name: {
-                "en-US": L
+                "en-US": O
               }
-            }), i([...W]);
+            }), a([...G]);
           },
-          value: _.name["en-US"],
-          options: S.filter(
-            (L) => !n.find((nt) => nt.name["en-US"] === L)
+          value: l.name["en-US"],
+          options: C.filter(
+            (O) => !n.find((nt) => nt.name["en-US"] === O)
           ),
-          leftAddon: D(_.images)
+          leftAddonOptions: [
+            {
+              value: l.name["en-US"],
+              addon: V(l.images)
+            }
+          ]
         }
       ),
-      j === "input" && /* @__PURE__ */ t.jsx(
-        yt,
+      y === "input" && /* @__PURE__ */ t.jsx(
+        It,
         {
-          onChange: (L) => {
-            const W = [...n].map((K) => K.id === _.id ? {
-              ..._,
+          onChange: (O) => {
+            const G = [...n].map((Z) => Z.id === l.id ? {
+              ...l,
               name: {
-                "en-US": L
+                "en-US": O
               }
-            } : K);
-            i([...W]);
+            } : Z);
+            a([...G]);
           },
-          value: _.name["en-US"],
+          value: l.name["en-US"],
           placeholder: d
         }
       ),
-      j === "image" && /* @__PURE__ */ t.jsx(
-        Tt,
+      y === "image" && /* @__PURE__ */ t.jsx(
+        At,
         {
-          onChange: (L) => {
-            const W = [...n].map((K) => K.id === _.id ? {
-              ..._,
-              images: L
-            } : K);
-            i([...W]);
+          onChange: (O) => {
+            const G = [...n].map((Z) => Z.id === l.id ? {
+              ...l,
+              images: O
+            } : Z);
+            a([...G]);
           },
-          activeImage: (T = n.find((L) => L.id === _.id)) == null ? void 0 : T.images[0]
+          activeImage: (R = n.find((O) => O.id === l.id)) == null ? void 0 : R.images[0]
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: H.buttons, children: [
-        m && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
-          v,
+      /* @__PURE__ */ t.jsxs("div", { className: Y.buttons, children: [
+        m && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
+          b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (L) => U(L, _)
+            onClick: (O) => M(O, l)
           }
         ) }),
-        l && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
-          v,
+        h && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
+          b,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(n.filter((L) => L.id !== _.id))
+            onClick: () => a(n.filter((O) => O.id !== l.id))
           }
         ) })
       ] })
     ] });
-    return p ? /* @__PURE__ */ t.jsx(
-      Qe,
+    return _ ? /* @__PURE__ */ t.jsx(
+      Je,
       {
-        product: _,
-        children: R
+        product: l,
+        children: E
       },
-      _.id
+      l.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: H.product,
-        children: R
+        className: Y.product,
+        children: E
       },
-      _.id
+      l.id
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: H.productsBlock, children: [
-    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: H.title, children: u }),
+  return /* @__PURE__ */ t.jsxs("div", { className: Y.productsBlock, children: [
+    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Y.top, children: [
+      u && /* @__PURE__ */ t.jsx("h3", { className: Y.title, children: u }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        ot,
+        ct,
         {
           current: s,
-          onChange: (_) => e == null ? void 0 : e(_)
+          onChange: (l) => e == null ? void 0 : e(l)
         }
       )
     ] }),
-    y && m && q && b && /* @__PURE__ */ t.jsx(
-      Pt,
+    D && m && I && P && /* @__PURE__ */ t.jsx(
+      Mt,
       {
-        ref: P,
-        activeItem: y,
-        setActiveItem: M,
-        popupPosition: O,
-        modalOptions: q,
-        setIsOpenModal: N
+        ref: S,
+        activeItem: D,
+        setActiveItem: z,
+        popupPosition: H,
+        modalOptions: I,
+        setIsOpenModal: q
       }
     ),
-    g && k && /* @__PURE__ */ t.jsx(St, { ...k }),
-    /* @__PURE__ */ t.jsxs("div", { className: H.products, children: [
-      r && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: r }),
-      p ? /* @__PURE__ */ t.jsx(
-        pt,
+    v && N && /* @__PURE__ */ t.jsx(St, { ...N }),
+    /* @__PURE__ */ t.jsxs("div", { className: Y.products, children: [
+      r && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: r }),
+      _ ? /* @__PURE__ */ t.jsx(
+        _t,
         {
-          sensors: A,
-          onDragEnd: z,
+          sensors: j,
+          onDragEnd: T,
           children: /* @__PURE__ */ t.jsx(
-            _t,
+            gt,
             {
-              items: n.map((_) => _.id),
-              strategy: gt,
-              children: n.map((_) => Z(_))
+              items: n.map((l) => l.id),
+              strategy: ft,
+              children: n.map((l) => U(l))
             }
           )
         }
-      ) : n.map((_) => Z(_)),
-      a && /* @__PURE__ */ t.jsx(
+      ) : n.map((l) => U(l)),
+      i && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -918,55 +950,55 @@ const Ri = (o) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            rt,
             {
               withoutHover: !0,
-              className: V(H.button, {
-                [H.disabled]: !!(f && f <= n.length)
+              className: F(Y.button, {
+                [Y.disabled]: !!(x && x <= n.length)
               }),
               size: "s",
-              disabled: !!(f && f <= n.length),
+              disabled: !!(x && x <= n.length),
               onClick: () => {
-                const _ = [...n];
-                let R = null;
-                if (S) {
-                  for (let T = 0; T < S.length; T++)
-                    if (!n.find((L) => L.name["en-US"] === S[T])) {
-                      R = S[T];
+                const l = [...n];
+                let E = null;
+                if (C) {
+                  for (let R = 0; R < C.length; R++)
+                    if (!n.find((O) => O.name["en-US"] === C[R])) {
+                      E = C[R];
                       break;
                     }
                 }
-                j === "select" && S ? _.push({
+                y === "select" && C ? l.push({
                   name: {
-                    "en-US": R || S[0]
+                    "en-US": E || C[0]
                   },
                   id: st(),
-                  ...E,
+                  ...A,
                   maxSymbols: 100
                   // пример значения
-                }) : j === "input" ? _.push({
+                }) : y === "input" ? l.push({
                   name: {
                     "en-US": ""
                   },
                   id: st(),
-                  ...E,
+                  ...A,
                   maxSymbols: 100
-                }) : _.push({
+                }) : l.push({
                   name: {
                     "en-US": `Image ${n.length + 1}`
                   },
                   id: st(),
-                  ...E,
+                  ...A,
                   maxSymbols: 100
-                }), i(_);
+                }), a(l);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: H.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: Y.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  v,
+                  b,
                   {
                     name: "Plus",
                     width: 16,
@@ -979,120 +1011,126 @@ const Ri = (o) => {
         }
       )
     ] }),
-    c !== void 0 && /* @__PURE__ */ t.jsx(It, { items: c })
+    c !== void 0 && /* @__PURE__ */ t.jsx(
+      ut,
+      {
+        otherTitle: "Other",
+        items: c
+      }
+    )
   ] });
-}, Xe = "_subtitle_jql1y_1", Je = "_header_jql1y_8", Ke = "_text_jql1y_9", Ze = "_productsBlock_jql1y_10", tn = "_buttonsBlock_jql1y_11", en = "_top_jql1y_23", nn = "_itemsBlock_jql1y_32", sn = "_typeTexts_jql1y_38", an = "_block_jql1y_45", on = "_active_jql1y_58", cn = "_products_jql1y_10", rn = "_product_jql1y_10", ln = "_button_jql1y_11", dn = "_image_jql1y_88", un = "_info_jql1y_95", mn = "_name_jql1y_107", hn = "_buttons_jql1y_11", pn = "_modal_jql1y_118", _n = "_other_jql1y_138", gn = "_options_jql1y_144", fn = "_addButton_jql1y_150", xn = "_deleteButton_jql1y_165", tt = {
-  subtitle: Xe,
-  header: Je,
-  text: Ke,
-  productsBlock: Ze,
-  buttonsBlock: tn,
-  top: en,
-  itemsBlock: nn,
-  typeTexts: sn,
-  block: an,
-  active: on,
-  products: cn,
-  product: rn,
-  button: ln,
-  image: dn,
-  info: un,
-  name: mn,
-  buttons: hn,
-  modal: pn,
-  other: _n,
-  options: gn,
-  addButton: fn,
-  deleteButton: xn
-}, vn = (o) => {
-  const { buttons: s, setButtons: e, deletable: n = !0, addable: i = !0, editableLink: c = !0 } = o, { pages: u } = lt(), [r, m] = x.useState(null), [p, B] = x.useState({
+}, Ke = "_subtitle_jql1y_1", Ze = "_header_jql1y_8", tn = "_text_jql1y_9", en = "_productsBlock_jql1y_10", nn = "_buttonsBlock_jql1y_11", sn = "_top_jql1y_23", an = "_itemsBlock_jql1y_32", on = "_typeTexts_jql1y_38", cn = "_block_jql1y_45", rn = "_active_jql1y_58", ln = "_products_jql1y_10", dn = "_product_jql1y_10", un = "_button_jql1y_11", mn = "_image_jql1y_88", hn = "_info_jql1y_95", pn = "_name_jql1y_107", _n = "_buttons_jql1y_11", gn = "_modal_jql1y_118", fn = "_other_jql1y_138", xn = "_options_jql1y_144", vn = "_addButton_jql1y_150", jn = "_deleteButton_jql1y_165", tt = {
+  subtitle: Ke,
+  header: Ze,
+  text: tn,
+  productsBlock: en,
+  buttonsBlock: nn,
+  top: sn,
+  itemsBlock: an,
+  typeTexts: on,
+  block: cn,
+  active: rn,
+  products: ln,
+  product: dn,
+  button: un,
+  image: mn,
+  info: hn,
+  name: pn,
+  buttons: _n,
+  modal: gn,
+  other: fn,
+  options: xn,
+  addButton: vn,
+  deleteButton: jn
+}, bn = (o) => {
+  const { buttons: s, setButtons: e, deletable: n = !0, addable: a = !0, editableLink: c = !0 } = o, { pages: u } = lt(), [r, m] = f.useState(null), [_, B] = f.useState({
     top: 0,
     left: 0
-  }), [l, a] = x.useState(null), j = x.useRef(null);
-  x.useEffect(() => {
+  }), [h, i] = f.useState(null), y = f.useRef(null);
+  f.useEffect(() => {
     if (r) {
-      const g = [...s].map((k) => k.id === r.id ? r : k);
-      e(g);
+      const v = [...s].map((N) => N.id === r.id ? r : N);
+      e(v);
     }
-  }, [r]), x.useEffect(() => {
-    if (j.current && l) {
-      const g = j.current.getBoundingClientRect().height, k = window.innerHeight;
-      let q = l.top;
-      q + g > k + window.scrollY - 200 && (q = k + window.scrollY - g - 200), q < 0 && (q = 10), B({
-        top: q,
-        left: l.left
+  }, [r]), f.useEffect(() => {
+    if (y.current && h) {
+      const v = y.current.getBoundingClientRect().height, N = window.innerHeight;
+      let I = h.top;
+      I + v > N + window.scrollY - 200 && (I = N + window.scrollY - v - 200), I < 0 && (I = 10), B({
+        top: I,
+        left: h.left
       });
     }
-  }, [j.current, l]);
-  const d = (g, k) => {
-    g.stopPropagation();
-    const q = g.target.getBoundingClientRect();
-    a({
-      top: q.top + window.scrollY - 70,
-      left: q.left - (i ? 30 : 65)
-    }), m(k);
-  }, S = (g, k) => {
-    const q = [...s], E = {
-      ...g,
+  }, [y.current, h]);
+  const d = (v, N) => {
+    v.stopPropagation();
+    const I = v.target.getBoundingClientRect();
+    i({
+      top: I.top + window.scrollY - 70,
+      left: I.left - (a ? 30 : 65)
+    }), m(N);
+  }, C = (v, N) => {
+    const I = [...s], A = {
+      ...v,
       id: Math.random().toString(36).substr(2, 9)
       // Генерируем новый уникальный ID
     };
-    q.splice(k + 1, 0, E), e(q);
+    I.splice(N + 1, 0, A), e(I);
   };
   return /* @__PURE__ */ t.jsxs("div", { className: tt.products, children: [
     /* @__PURE__ */ t.jsx("h5", { className: tt.subtitle, children: "Button Type" }),
-    s.map((g, k) => /* @__PURE__ */ t.jsxs(
+    s.map((v, N) => /* @__PURE__ */ t.jsxs(
       "div",
       {
         className: tt.product,
         children: [
           /* @__PURE__ */ t.jsx(
-            rt,
+            it,
             {
-              onChange: (q) => {
-                const f = [...s].map((y) => y.id === g.id ? {
-                  ...g,
-                  type: q
-                } : y);
-                e(f);
+              onChange: (I) => {
+                const x = [...s].map((D) => D.id === v.id ? {
+                  ...v,
+                  type: I
+                } : D);
+                e(x);
               },
-              value: g.type,
+              value: v.type,
               options: ["Primary", "Secondary", "Tertiary"]
             }
           ),
           /* @__PURE__ */ t.jsxs("div", { className: tt.buttons, children: [
             /* @__PURE__ */ t.jsx("div", { className: tt.deleteButton, children: /* @__PURE__ */ t.jsx(
-              v,
+              b,
               {
                 name: "Copy",
                 hoverable: !0,
                 width: 20,
                 height: 20,
                 onClick: () => {
-                  S(g, k);
+                  C(v, N);
                 }
               }
             ) }),
             /* @__PURE__ */ t.jsx("div", { className: tt.deleteButton, children: /* @__PURE__ */ t.jsx(
-              v,
+              b,
               {
                 name: "Sliders",
                 hoverable: !0,
                 width: 20,
                 height: 20,
-                onClick: (q) => {
-                  d(q, g);
+                onClick: (I) => {
+                  d(I, v);
                 }
               }
             ) }),
             n && /* @__PURE__ */ t.jsx("div", { className: tt.deleteButton, children: /* @__PURE__ */ t.jsx(
-              v,
+              b,
               {
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const q = s.filter((E) => E.id !== g.id);
-                  e(q);
+                  const I = s.filter((A) => A.id !== v.id);
+                  e(I);
                 },
                 width: 20,
                 height: 20,
@@ -1102,19 +1140,19 @@ const Ri = (o) => {
           ] })
         ]
       },
-      g.id
+      v.id
     )),
     r && /* @__PURE__ */ t.jsx(
-      Mt,
+      Ot,
       {
-        ref: j,
+        ref: y,
         activeButton: r,
         setActiveButton: m,
-        popupPosition: p,
+        popupPosition: _,
         editableLink: c
       }
     ),
-    i && /* @__PURE__ */ t.jsx(
+    a && /* @__PURE__ */ t.jsx(
       "div",
       {
         style: {
@@ -1123,14 +1161,14 @@ const Ri = (o) => {
           justifyContent: "center"
         },
         children: /* @__PURE__ */ t.jsx(
-          ct,
+          rt,
           {
             withoutHover: !0,
             className: tt.button,
             size: "s",
             onClick: () => {
-              const g = [...s];
-              c ? g.push({
+              const v = [...s];
+              c ? v.push({
                 type: "Primary",
                 id: st(),
                 typesText: [],
@@ -1140,7 +1178,7 @@ const Ri = (o) => {
                 destination: "Go to Page",
                 page: u ? Object.values(u)[0].path : "/",
                 openInNewTab: !1
-              }) : g.push({
+              }) : v.push({
                 type: "Primary",
                 id: st(),
                 typesText: [],
@@ -1150,7 +1188,7 @@ const Ri = (o) => {
                 destination: "Go to Page",
                 page: u ? Object.values(u)[0].path : "/",
                 openInNewTab: !1
-              }), e(g);
+              }), e(v);
             },
             style: {
               width: "fit-content"
@@ -1158,7 +1196,7 @@ const Ri = (o) => {
             children: /* @__PURE__ */ t.jsxs("div", { className: tt.addButton, children: [
               /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
               /* @__PURE__ */ t.jsx(
-                v,
+                b,
                 {
                   name: "Plus",
                   width: 16,
@@ -1171,21 +1209,21 @@ const Ri = (o) => {
       }
     )
   ] });
-}, Li = (o) => {
+}, zi = (o) => {
   const {
     isActiveButtons: s,
     setIsActiveButtons: e,
     buttons: n,
-    setButtons: i,
+    setButtons: a,
     editableLink: c = !0,
     addable: u = !0,
     deletable: r = !0
   } = o;
-  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: jt.buttonsBlock, children: [
-    /* @__PURE__ */ t.jsxs("div", { className: jt.top, children: [
-      /* @__PURE__ */ t.jsx("h3", { className: jt.title, children: "Buttons" }),
+  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: bt.buttonsBlock, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: bt.top, children: [
+      /* @__PURE__ */ t.jsx("h3", { className: bt.title, children: "Buttons" }),
       /* @__PURE__ */ t.jsx(
-        ot,
+        ct,
         {
           current: s,
           onChange: (m) => e(m)
@@ -1193,10 +1231,10 @@ const Ri = (o) => {
       )
     ] }),
     s && /* @__PURE__ */ t.jsx(
-      vn,
+      bn,
       {
         buttons: n,
-        setButtons: i,
+        setButtons: a,
         editableLink: c,
         addable: u,
         deletable: r
@@ -1204,88 +1242,90 @@ const Ri = (o) => {
     )
   ] }) });
 };
-function jn(o) {
-  const { product: s, children: e } = o, { attributes: n, listeners: i, setNodeRef: c, transform: u, transition: r, isDragging: m } = ft({
+function yn(o) {
+  const { product: s, children: e } = o, { attributes: n, listeners: a, setNodeRef: c, transform: u, transition: r, isDragging: m } = xt({
     id: String(s.listingId)
-  }), p = {
-    transform: xt.Transform.toString(u),
+  }), _ = {
+    transform: vt.Transform.toString(u),
     transition: r
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: c,
-      style: p,
-      className: `${G.product} ${m ? G.dragging : ""}`,
+      style: _,
+      className: `${Q.product} ${m ? Q.dragging : ""}`,
       ...n,
-      ...i,
+      ...a,
       children: e
     }
   );
 }
-const zi = (o) => {
+const Fi = (o) => {
   const {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
-    setItems: i,
+    setItems: a,
     other: c,
     title: u,
     subtitle: r,
     editable: m = !0,
-    draggable: p = !1,
+    draggable: _ = !1,
     withImage: B = !1,
-    deletable: l = !0,
-    addable: a = !0,
-    itemsType: j,
+    deletable: h = !0,
+    addable: i = !0,
+    itemsType: y,
     itemsOptions: d,
-    limit: S
-  } = o, [g, k] = x.useState(
+    limit: C,
+    aspectRatio: v,
+    setAspectRatio: N
+  } = o, [I, A] = f.useState(
     null
-  ), [q, E] = x.useState({
+  ), [x, D] = f.useState({
     top: 0,
     left: 0
-  }), [f, y] = x.useState(!1), M = ut(
-    mt(ht, {
+  }), [z, H] = f.useState(!1), p = mt(
+    ht(pt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  x.useEffect(() => {
-    const b = () => {
-      k(null), y(!1);
+  f.useEffect(() => {
+    const j = () => {
+      A(null), H(!1);
     };
-    return document.body.addEventListener("click", b), k(null), y(!1), () => {
-      k(null), y(!1), document.body.removeEventListener("click", b);
+    return document.body.addEventListener("click", j), A(null), H(!1), () => {
+      A(null), H(!1), document.body.removeEventListener("click", j);
     };
-  }, []), x.useEffect(() => {
-    if (g) {
-      const b = [...n].map((N) => N.listingId === g.listingId ? g : N);
-      i(b);
+  }, []), f.useEffect(() => {
+    if (I) {
+      const j = [...n].map((M) => M.listingId === I.listingId ? I : M);
+      a(j);
     }
-  }, [g]);
-  const O = (b, N) => {
-    b.stopPropagation();
-    const A = b.target.getBoundingClientRect(), U = 100, D = window.innerHeight;
-    let z = A.top + window.scrollY;
-    z + U > D && (z = D - U - 20), y(!0), E({
-      top: z - 80,
-      left: A.left - 30
-    }), k(N);
+  }, [I]);
+  const g = (j, M) => {
+    j.stopPropagation();
+    const V = j.target.getBoundingClientRect(), T = 100, U = window.innerHeight;
+    let l = V.top + window.scrollY;
+    l + T > U && (l = U - T - 20), H(!0), D({
+      top: l - 80,
+      left: V.left - 30
+    }), A(M);
   };
-  function I(b) {
+  function w(j) {
     if (B)
-      return b ? /* @__PURE__ */ t.jsx(
+      return j ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${b}/w=1000`,
+          src: `https://imagedelivery.net/${j}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        v,
+        b,
         {
           name: "Image",
           width: 16,
@@ -1294,21 +1334,21 @@ const zi = (o) => {
         }
       );
   }
-  const h = (b) => {
-    const { active: N, over: A } = b;
-    if (A && N.id !== A.id) {
-      const U = n.findIndex((z) => String(z.listingId) === N.id), D = n.findIndex((z) => String(z.listingId) === A.id);
-      if (U !== -1 && D !== -1) {
-        const z = [...n], [Z] = z.splice(U, 1);
-        z.splice(D, 0, Z), i(z);
+  const S = (j) => {
+    const { active: M, over: V } = j;
+    if (V && M.id !== V.id) {
+      const T = n.findIndex((l) => String(l.listingId) === M.id), U = n.findIndex((l) => String(l.listingId) === V.id);
+      if (T !== -1 && U !== -1) {
+        const l = [...n], [E] = l.splice(T, 1);
+        l.splice(U, 0, E), a(l);
       }
     }
-  }, $ = (b, N) => {
-    const A = d.find((D) => b.listingId === D.id);
-    if (!A) return null;
-    const U = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        v,
+  }, P = (j) => {
+    const M = d.find((T) => j.listingId === T.id);
+    if (!M) return null;
+    const V = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        b,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -1316,108 +1356,111 @@ const zi = (o) => {
           height: 20
         }
       ) }),
-      j === "select" && /* @__PURE__ */ t.jsx(
-        rt,
+      y === "select" && /* @__PURE__ */ t.jsx(
+        it,
         {
-          onChange: (D) => {
-            const z = [...n], Z = d.find((T) => T.productData.name === D);
-            if (!Z) return;
-            const _ = {
-              listingId: Z.id,
-              image: Z.productData.images.length > 0 ? Z.productData.images[0].cfId : ""
-            }, R = z.map((T) => T.listingId === b.listingId ? _ : T);
-            k(_), i([...R]);
+          onChange: (T) => {
+            const U = [...n], l = d.find((O) => O.productData.name === T);
+            if (!l) return;
+            const E = {
+              listingId: l.id,
+              image: l.productData.images.length > 0 ? l.productData.images[0].cfId : ""
+            }, R = U.map((O) => O.listingId === j.listingId ? E : O);
+            A(E), a([...R]);
           },
-          value: A.productData.name,
+          value: M.productData.name,
           options: [
-            ...d.filter((D) => !n.find((z) => z.listingId === D.id)).map((D) => D.productData.name)
+            ...d.filter((T) => !n.find((U) => U.listingId === T.id)).map((T) => T.productData.name)
           ],
-          leftAddon: I(
-            b.image || A.productData.images.length > 0 && A.productData.images[0].cfId || ""
-          )
-        },
-        N
+          leftAddonOptions: d.map((T) => {
+            var U;
+            return {
+              value: T.productData.name,
+              addon: w(((U = T.productData.images[0]) == null ? void 0 : U.cfId) || "")
+            };
+          })
+        }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: G.buttons, children: [
-        m && /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
-          v,
+      /* @__PURE__ */ t.jsxs("div", { className: Q.buttons, children: [
+        m && /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
+          b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (D) => O(D, b)
+            onClick: (T) => g(T, j)
           }
         ) }),
-        l && /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
-          v,
+        h && /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
+          b,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(n.filter((D) => D !== b))
+            onClick: () => a(n.filter((T) => T !== j))
           }
         ) })
       ] })
     ] });
-    return p ? /* @__PURE__ */ t.jsx(
-      jn,
+    return _ ? /* @__PURE__ */ t.jsx(
+      yn,
       {
-        product: b,
-        children: U
+        product: j,
+        children: V
       },
-      b.listingId
+      j.listingId
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: G.product,
-        children: U
+        className: Q.product,
+        children: V
       },
-      b.listingId
+      j.listingId
     );
-  }, P = x.useRef(null);
-  return /* @__PURE__ */ t.jsxs("div", { className: G.productsBlock, children: [
-    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: G.title, children: u }),
+  }, q = f.useRef(null);
+  return /* @__PURE__ */ t.jsxs("div", { className: Q.productsBlock, children: [
+    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Q.top, children: [
+      u && /* @__PURE__ */ t.jsx("h3", { className: Q.title, children: u }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        ot,
+        ct,
         {
           current: s,
-          onChange: (b) => e == null ? void 0 : e(b)
+          onChange: (j) => e == null ? void 0 : e(j)
         }
       )
     ] }),
-    f && g && /* @__PURE__ */ t.jsx(
-      At,
+    z && I && /* @__PURE__ */ t.jsx(
+      Et,
       {
-        ref: P,
-        activeItem: g,
-        setActiveItem: k,
-        setIsOpenModal: y,
-        popupPosition: q,
+        ref: q,
+        activeItem: I,
+        setActiveItem: A,
+        setIsOpenModal: H,
+        popupPosition: x,
         itemsOptions: d
       }
     ),
-    s && /* @__PURE__ */ t.jsxs("div", { className: G.products, children: [
-      r && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: r }),
-      p ? /* @__PURE__ */ t.jsx(
-        pt,
+    s && /* @__PURE__ */ t.jsxs("div", { className: Q.products, children: [
+      r && /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: r }),
+      _ ? /* @__PURE__ */ t.jsx(
+        _t,
         {
-          sensors: M,
-          onDragEnd: h,
+          sensors: p,
+          onDragEnd: S,
           children: /* @__PURE__ */ t.jsx(
-            _t,
+            gt,
             {
-              items: n.map((b) => String(b.listingId)),
-              strategy: gt,
-              children: n.map((b, N) => $(b, N))
+              items: n.map((j) => String(j.listingId)),
+              strategy: ft,
+              children: n.map((j) => P(j))
             }
           )
         }
-      ) : n.map((b, N) => $(b, N)),
-      a && /* @__PURE__ */ t.jsx(
+      ) : n.map((j) => P(j)),
+      i && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -1426,31 +1469,31 @@ const zi = (o) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            rt,
             {
               withoutHover: !0,
-              className: G.button,
+              className: Q.button,
               size: "s",
               onClick: () => {
-                const b = [...n];
-                for (let N = 0; N < d.length; N++)
-                  if (!n.find((A) => A.listingId === d[N].id)) {
-                    b.push({
-                      listingId: d[N].id,
-                      image: d[N].productData.images.length > 0 ? d[N].productData.images[0].cfId : ""
+                const j = [...n];
+                for (let M = 0; M < d.length; M++)
+                  if (!n.find((V) => V.listingId === d[M].id)) {
+                    j.push({
+                      listingId: d[M].id,
+                      image: d[M].productData.images.length > 0 ? d[M].productData.images[0].cfId : ""
                     });
                     break;
                   }
-                i(b);
+                a(j);
               },
-              disabled: n.length === (S || d.length),
+              disabled: n.length === (C || d.length),
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: G.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: Q.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  v,
+                  b,
                   {
                     name: "Plus",
                     width: 16,
@@ -1463,154 +1506,169 @@ const zi = (o) => {
         }
       )
     ] }),
-    s && c !== void 0 && /* @__PURE__ */ t.jsx(It, { items: c })
+    v && N && /* @__PURE__ */ t.jsx(
+      it,
+      {
+        value: v,
+        options: Object.keys($t),
+        onChange: (j) => N(j),
+        leftAddonOptions: wt
+      }
+    ),
+    s && c !== void 0 && /* @__PURE__ */ t.jsx(
+      ut,
+      {
+        otherTitle: "Other",
+        items: c
+      }
+    )
   ] });
-}, bn = "_options_1vlf9_1", yn = "_price_1vlf9_13", In = "_oldPrice_1vlf9_20", Nn = "_newPrice_1vlf9_28", kn = "_animate_1vlf9_35", Cn = "_appearAndBounce_1vlf9_1", Sn = "_meta_1vlf9_53", $n = "_info_1vlf9_59", wn = "_infoRight_1vlf9_67", qn = "_buttons_1vlf9_74", Bn = "_variants_1vlf9_81", Pn = "_variant_1vlf9_81", Tn = "_stock_1vlf9_99", Mn = "_variantInfo_1vlf9_106", An = "_quantity_1vlf9_112", On = "_count_1vlf9_119", En = "_focused_1vlf9_136", Dn = "_button_1vlf9_74", Rn = "_activeVariant_1vlf9_162", Ln = "_chargeTypes_1vlf9_166", zn = "_charge_1vlf9_166", Fn = "_chargeActive_1vlf9_191", Vn = "_title_1vlf9_199", w = {
-  options: bn,
-  price: yn,
-  oldPrice: In,
-  newPrice: Nn,
-  animate: kn,
-  appearAndBounce: Cn,
-  meta: Sn,
-  info: $n,
-  infoRight: wn,
-  buttons: qn,
-  variants: Bn,
-  variant: Pn,
-  stock: Tn,
-  variantInfo: Mn,
-  quantity: An,
-  count: On,
-  focused: En,
-  button: Dn,
-  activeVariant: Rn,
-  chargeTypes: Ln,
-  charge: zn,
-  chargeActive: Fn,
-  title: Vn
+}, In = "_options_1vlf9_1", Nn = "_price_1vlf9_13", kn = "_oldPrice_1vlf9_20", Cn = "_newPrice_1vlf9_28", Sn = "_animate_1vlf9_35", $n = "_appearAndBounce_1vlf9_1", wn = "_meta_1vlf9_53", qn = "_info_1vlf9_59", Bn = "_infoRight_1vlf9_67", Pn = "_buttons_1vlf9_74", Tn = "_variants_1vlf9_81", Mn = "_variant_1vlf9_81", An = "_stock_1vlf9_99", On = "_variantInfo_1vlf9_106", En = "_quantity_1vlf9_112", Rn = "_count_1vlf9_119", Dn = "_focused_1vlf9_136", Ln = "_button_1vlf9_74", zn = "_activeVariant_1vlf9_162", Fn = "_chargeTypes_1vlf9_166", Vn = "_charge_1vlf9_166", Un = "_chargeActive_1vlf9_191", Hn = "_title_1vlf9_199", $ = {
+  options: In,
+  price: Nn,
+  oldPrice: kn,
+  newPrice: Cn,
+  animate: Sn,
+  appearAndBounce: $n,
+  meta: wn,
+  info: qn,
+  infoRight: Bn,
+  buttons: Pn,
+  variants: Tn,
+  variant: Mn,
+  stock: An,
+  variantInfo: On,
+  quantity: En,
+  count: Rn,
+  focused: Dn,
+  button: Ln,
+  activeVariant: zn,
+  chargeTypes: Fn,
+  charge: Vn,
+  chargeActive: Un,
+  title: Hn
 };
 var Ct = /* @__PURE__ */ ((o) => (o.ONE_TIME = "One-Time", o.RECURRING = "Subscribe & Save", o))(Ct || {});
-const Un = (o) => {
-  var q, E;
-  const { variants: s } = o, [e, n] = x.useState(s[0]), [i, c] = x.useState(
+const Yn = (o) => {
+  var I, A;
+  const { variants: s } = o, [e, n] = f.useState(s[0]), [a, c] = f.useState(
     e.chargeTypes ? e.chargeTypes[0] : "ONE_TIME"
-  ), u = vt(), [r, m] = x.useState(1), { products: p, cart: B, reset: l, addProductToCart: a } = dt(), [j, d] = x.useState(!1);
-  console.log(B), x.useEffect(() => {
+  ), u = jt(), [r, m] = f.useState(1), { products: _, cart: B, reset: h, addProductToCart: i } = dt(), [y, d] = f.useState(!1);
+  console.log(B), f.useEffect(() => {
     d(!0);
-    const f = setTimeout(() => d(!1), 600);
-    return () => clearTimeout(f);
+    const x = setTimeout(() => d(!1), 600);
+    return () => clearTimeout(x);
   }, [r]);
-  async function S() {
-    console.log("Products P", p), await a({
+  async function C() {
+    console.log("Products P", _), await i({
       productId: o.id,
       productVariantId: e.id,
       quantity: r
     });
   }
-  function g() {
-    l(), S(), u("/checkout");
+  function v() {
+    h(), C(), u("/checkout");
   }
-  function k(f) {
-    if (f >= 864e5) {
-      const h = Math.floor(f / 864e5);
-      return `${h} ${h === 1 ? "day" : "days"}`;
-    } else if (f >= 36e5) {
-      const h = Math.floor(f / 36e5);
-      return `${h} ${h === 1 ? "hour" : "hours"}`;
-    } else if (f >= 6e4) {
-      const h = Math.floor(f / 6e4);
-      return `${h} ${h === 1 ? "minute" : "minutes"}`;
+  function N(x) {
+    if (x >= 864e5) {
+      const g = Math.floor(x / 864e5);
+      return `${g} ${g === 1 ? "day" : "days"}`;
+    } else if (x >= 36e5) {
+      const g = Math.floor(x / 36e5);
+      return `${g} ${g === 1 ? "hour" : "hours"}`;
+    } else if (x >= 6e4) {
+      const g = Math.floor(x / 6e4);
+      return `${g} ${g === 1 ? "minute" : "minutes"}`;
     } else {
-      const h = Math.floor(f / 1e3);
-      return `${h} ${h === 1 ? "second" : "seconds"}`;
+      const g = Math.floor(x / 1e3);
+      return `${g} ${g === 1 ? "second" : "seconds"}`;
     }
   }
-  return x.useEffect(() => {
+  return f.useEffect(() => {
     e.quantity && e.quantity.available === 0 && m(0);
-  }, [e.quantity.available]), /* @__PURE__ */ t.jsxs("div", { className: w.options, children: [
-    e.chargeTypes && e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: w.chargeTypes, children: e.chargeTypes.map((f) => /* @__PURE__ */ t.jsx(
+  }, [e.quantity.available]), /* @__PURE__ */ t.jsxs("div", { className: $.options, children: [
+    e.chargeTypes && e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: $.chargeTypes, children: e.chargeTypes.map((x) => /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: V(w.charge, {
-          [w.chargeActive]: i === f
+        className: F($.charge, {
+          [$.chargeActive]: a === x
         }),
-        onClick: () => c(f),
-        children: Ct[f]
+        onClick: () => c(x),
+        children: Ct[x]
       },
-      f
+      x
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: w.variants, children: s.map((f) => {
-      var y, M;
+    /* @__PURE__ */ t.jsx("div", { className: $.variants, children: s.map((x) => {
+      var D, z;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
-          className: V(w.variant, {
-            [w.activeVariant]: e.id === f.id
+          className: F($.variant, {
+            [$.activeVariant]: e.id === x.id
           }),
-          onClick: () => n(f),
+          onClick: () => n(x),
           children: [
-            /* @__PURE__ */ t.jsxs("div", { className: w.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: w.title, children: Nt(f.name) }),
+            /* @__PURE__ */ t.jsxs("div", { className: $.variantInfo, children: [
+              /* @__PURE__ */ t.jsx("span", { className: $.title, children: Nt(x.name) }),
               /* @__PURE__ */ t.jsxs("span", { children: [
                 "$",
-                i === "ONE_TIME" ? f.price.amount : f.subscriptionSettings ? f.subscriptionSettings.price.amount : "Price Not Found"
+                a === "ONE_TIME" ? x.price.amount : x.subscriptionSettings ? x.subscriptionSettings.price.amount : "Price Not Found"
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: w.stock, children: [
-              (y = f.quantity.restrictions) != null && y.max || f.quantity.available !== void 0 ? ((M = f.quantity.restrictions) == null ? void 0 : M.max) || f.quantity.available : "∞",
+            /* @__PURE__ */ t.jsx("div", { children: a === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: $.stock, children: [
+              (D = x.quantity.restrictions) != null && D.max || x.quantity.available !== void 0 ? ((z = x.quantity.restrictions) == null ? void 0 : z.max) || x.quantity.available : "∞",
               " ",
               "in stock"
             ] }) })
           ]
         },
-        f.id
+        x.id
       );
     }) }),
-    i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: w.quantity, children: [
+    a === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: $.quantity, children: [
       /* @__PURE__ */ t.jsx(
-        F,
+        L,
         {
           type: "Secondary",
           onClick: () => {
-            r > 1 ? m((f) => f - 1) : m(1);
+            r > 1 ? m((x) => x - 1) : m(1);
           },
-          className: w.button,
+          className: $.button,
           disabled: e.quantity.available && e.quantity.restrictions && r <= e.quantity.restrictions.min || e.quantity.available === 0,
-          children: /* @__PURE__ */ t.jsx(v, { name: "Minus" })
+          children: /* @__PURE__ */ t.jsx(b, { name: "Minus" })
         }
       ),
       /* @__PURE__ */ t.jsx(
-        Ot,
+        Rt,
         {
           type: "number",
           value: String(r),
-          onChange: (f) => m(Number(f)),
-          max: ((q = e.quantity.restrictions) == null ? void 0 : q.max) || e.quantity.available || Number.POSITIVE_INFINITY,
-          min: ((E = e.quantity.restrictions) == null ? void 0 : E.min) || 0,
+          onChange: (x) => m(Number(x)),
+          max: ((I = e.quantity.restrictions) == null ? void 0 : I.max) || e.quantity.available || Number.POSITIVE_INFINITY,
+          min: ((A = e.quantity.restrictions) == null ? void 0 : A.min) || 0,
           centered: !0,
           disabled: e.quantity && e.quantity.available === 0 || Object.keys(e.quantity.restrictions || {}).length !== 0 && r >= e.quantity.restrictions.max
         }
       ),
       /* @__PURE__ */ t.jsx(
-        F,
+        L,
         {
           type: "Secondary",
           onClick: () => {
-            m((f) => f + 1);
+            m((x) => x + 1);
           },
-          className: w.button,
+          className: $.button,
           disabled: !!(e.quantity.available && e.quantity.restrictions && r >= e.quantity.restrictions.max || e.quantity.available === 0),
-          children: /* @__PURE__ */ t.jsx(v, { name: "Plus" })
+          children: /* @__PURE__ */ t.jsx(b, { name: "Plus" })
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: w.meta, children: [
-      /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: $.meta, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: $.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
-        /* @__PURE__ */ t.jsxs("div", { className: w.infoRight, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: $.infoRight, children: [
           /* @__PURE__ */ t.jsx(
-            v,
+            b,
             {
               name: "Lightning",
               fill: "#FF3F19",
@@ -1618,159 +1676,159 @@ const Un = (o) => {
               height: 20
             }
           ),
-          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : k(e.deliveryTime) })
+          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : N(e.deliveryTime) })
         ] })
       ] }),
-      /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: $.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Price" }),
-        /* @__PURE__ */ t.jsx("div", { className: w.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: V(w.newPrice, { [w.animate]: j }), children: [
+        /* @__PURE__ */ t.jsx("div", { className: $.infoRight, children: a === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: $.price, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: F($.newPrice, { [$.animate]: y }), children: [
             "$ ",
             (e.price.amount || 0) * r
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: $.oldPrice, children: [
             "$ ",
             (e.compareAtPrice.amount || 0) * r
           ] })
-        ] }) : /* @__PURE__ */ t.jsxs("span", { className: V(w.newPrice, { [w.animate]: j }), children: [
+        ] }) : /* @__PURE__ */ t.jsxs("span", { className: F($.newPrice, { [$.animate]: y }), children: [
           "$ ",
           (e.price.amount || 0) * r
-        ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: V(w.newPrice, { [w.animate]: j }), children: [
+        ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: $.price, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: F($.newPrice, { [$.animate]: y }), children: [
             "$ ",
             e.subscriptionSettings.price.amount || 0
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: $.oldPrice, children: [
             "$ ",
             e.subscriptionSettings.compareAtPrice.amount || 0
           ] })
-        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: V(w.newPrice, { [w.animate]: j }), children: [
+        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: F($.newPrice, { [$.animate]: y }), children: [
           "$ ",
           e.subscriptionSettings.price.amount || 0
         ] }) })
       ] })
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: w.buttons, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: $.buttons, children: [
       /* @__PURE__ */ t.jsx(
-        F,
+        L,
         {
           type: "Primary",
-          onClick: () => g(),
+          onClick: () => v(),
           disabled: e.quantity && e.quantity.available === 0,
-          children: i === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
+          children: a === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
         }
       ),
-      i === "ONE_TIME" && /* @__PURE__ */ t.jsx(
-        F,
+      a === "ONE_TIME" && /* @__PURE__ */ t.jsx(
+        L,
         {
           type: "Secondary",
-          onClick: () => S(),
+          onClick: () => C(),
           disabled: e.quantity && e.quantity.available === 0,
           children: "Add to Cart"
         }
       )
     ] })
   ] });
-}, Hn = "_button_14q75_1", Yn = "_login_14q75_14", Wn = "_signUp_14q75_18", Gn = "_buttons_14q75_23", Qn = "_modal_14q75_32", Xn = "_closing_14q75_64", Jn = "_info_14q75_113", Kn = "_top_14q75_120", Zn = "_title_14q75_131", ts = "_clear_14q75_138", es = "_activeClear_14q75_145", ns = "_count_14q75_149", ss = "_cart_14q75_164", is = "_empty_14q75_172", as = "_product_14q75_198", os = "_products_14q75_207", cs = "_image_14q75_215", rs = "_productInfo_14q75_230", ls = "_content_14q75_237", ds = "_name_14q75_243", us = "_price_14q75_249", ms = "_productButtons_14q75_255", hs = "_productButton_14q75_255", ps = "_productCount_14q75_272", _s = "_bottom_14q75_289", gs = "_subtotal_14q75_297", fs = "_block_14q75_305", xs = "_shoppingCount_14q75_312", vs = "_total_14q75_332", js = "_link_14q75_338", bs = "_userInfo_14q75_345", ys = "_pagesMobileModal_14q75_356", Is = "_pagesMobileModalContent_14q75_370", Ns = "_pagesMobileModalHeader_14q75_376", ks = "_pagesMobileModalFooter_14q75_386", C = {
-  button: Hn,
-  login: Yn,
-  signUp: Wn,
-  buttons: Gn,
-  modal: Qn,
+}, Wn = "_button_14q75_1", Gn = "_login_14q75_14", Qn = "_signUp_14q75_18", Xn = "_buttons_14q75_23", Jn = "_modal_14q75_32", Kn = "_closing_14q75_64", Zn = "_info_14q75_113", ts = "_top_14q75_120", es = "_title_14q75_131", ns = "_clear_14q75_138", ss = "_activeClear_14q75_145", is = "_count_14q75_149", as = "_cart_14q75_164", os = "_empty_14q75_172", cs = "_product_14q75_198", rs = "_products_14q75_207", ls = "_image_14q75_215", ds = "_productInfo_14q75_230", us = "_content_14q75_237", ms = "_name_14q75_243", hs = "_price_14q75_249", ps = "_productButtons_14q75_255", _s = "_productButton_14q75_255", gs = "_productCount_14q75_272", fs = "_bottom_14q75_289", xs = "_subtotal_14q75_297", vs = "_block_14q75_305", js = "_shoppingCount_14q75_312", bs = "_total_14q75_332", ys = "_link_14q75_338", Is = "_userInfo_14q75_345", Ns = "_pagesMobileModal_14q75_356", ks = "_pagesMobileModalContent_14q75_370", Cs = "_pagesMobileModalHeader_14q75_376", Ss = "_pagesMobileModalFooter_14q75_386", k = {
+  button: Wn,
+  login: Gn,
+  signUp: Qn,
+  buttons: Xn,
+  modal: Jn,
   "slide-in-fade": "_slide-in-fade_14q75_1",
   "mobile-slide-in-fade": "_mobile-slide-in-fade_14q75_1",
-  closing: Xn,
+  closing: Kn,
   "mobile-slide-out-fade": "_mobile-slide-out-fade_14q75_1",
   "slide-out-fade": "_slide-out-fade_14q75_1",
-  info: Jn,
-  top: Kn,
-  title: Zn,
-  clear: ts,
-  activeClear: es,
-  count: ns,
-  cart: ss,
-  empty: is,
-  product: as,
-  products: os,
-  image: cs,
-  productInfo: rs,
-  content: ls,
-  name: ds,
-  price: us,
-  productButtons: ms,
-  productButton: hs,
-  productCount: ps,
-  bottom: _s,
-  subtotal: gs,
-  block: fs,
-  shoppingCount: xs,
-  total: vs,
-  link: js,
-  userInfo: bs,
-  pagesMobileModal: ys,
-  pagesMobileModalContent: Is,
-  pagesMobileModalHeader: Ns,
-  pagesMobileModalFooter: ks
-}, Fi = (o) => {
+  info: Zn,
+  top: ts,
+  title: es,
+  clear: ns,
+  activeClear: ss,
+  count: is,
+  cart: as,
+  empty: os,
+  product: cs,
+  products: rs,
+  image: ls,
+  productInfo: ds,
+  content: us,
+  name: ms,
+  price: hs,
+  productButtons: ps,
+  productButton: _s,
+  productCount: gs,
+  bottom: fs,
+  subtotal: xs,
+  block: vs,
+  shoppingCount: js,
+  total: bs,
+  link: ys,
+  userInfo: Is,
+  pagesMobileModal: Ns,
+  pagesMobileModalContent: ks,
+  pagesMobileModalHeader: Cs,
+  pagesMobileModalFooter: Ss
+}, Vi = (o) => {
   const { shopping: s, signUp: e, isShowUserInfo: n = !0 } = o;
-  return /* @__PURE__ */ t.jsxs("div", { className: C.buttons, children: [
-    s && /* @__PURE__ */ t.jsx(Cs, {}),
-    n && /* @__PURE__ */ t.jsx(Bt, { signUp: e })
+  return /* @__PURE__ */ t.jsxs("div", { className: k.buttons, children: [
+    s && /* @__PURE__ */ t.jsx($s, {}),
+    n && /* @__PURE__ */ t.jsx(Tt, { signUp: e })
   ] });
-}, Cs = () => {
-  const [o, s] = x.useState(!1), [e, n] = x.useState([]), { cart: i } = dt(), { pageContext: c } = lt();
-  function u(a) {
-    if (a.variants.length > 0) {
-      for (let j = 0; j < i.parts.length; j++)
-        for (let d = 0; d < a.variants.length; d++)
-          if (a.variants[d] && i.parts[j].productVariantId === a.variants[d].id)
-            return i.parts[j].productVariantId;
+}, $s = () => {
+  const [o, s] = f.useState(!1), [e, n] = f.useState([]), { cart: a } = dt(), { pageContext: c } = lt();
+  function u(i) {
+    if (i.variants.length > 0) {
+      for (let y = 0; y < a.parts.length; y++)
+        for (let d = 0; d < i.variants.length; d++)
+          if (i.variants[d] && a.parts[y].productVariantId === i.variants[d].id)
+            return a.parts[y].productVariantId;
     }
-    return a.variants[0].id;
+    return i.variants[0].id;
   }
-  function r(a) {
-    for (let j = 0; j < i.parts.length; j++)
-      for (let d = 0; d < a.variants.length; d++)
-        if (a.variants[d] && i.parts[j].productVariantId === a.variants[d].id)
-          return i.parts[j].quantity;
+  function r(i) {
+    for (let y = 0; y < a.parts.length; y++)
+      for (let d = 0; d < i.variants.length; d++)
+        if (i.variants[d] && a.parts[y].productVariantId === i.variants[d].id)
+          return a.parts[y].quantity;
   }
-  x.useEffect(() => {
+  f.useEffect(() => {
     (async () => {
-      var g;
-      const j = i.parts.map((k) => String(k.productId)), S = (((g = c == null ? void 0 : c.products) == null ? void 0 : g.filter((k) => j.includes(String(k.id)))) || []).map((k) => ({
-        ...k,
-        activeVariantId: u(k),
-        quantity: r(k)
+      var v;
+      const y = a.parts.map((N) => String(N.productId)), C = (((v = c == null ? void 0 : c.products) == null ? void 0 : v.filter((N) => y.includes(String(N.id)))) || []).map((N) => ({
+        ...N,
+        activeVariantId: u(N),
+        quantity: r(N)
       }));
-      n(S);
+      n(C);
     })();
-  }, [i.parts]);
-  function m(a) {
-    var j;
-    return !a || !(a != null && a.variants) ? !1 : (j = a.variants.find((d) => d.id === a.activeVariantId)) == null ? void 0 : j.subscriptionSettings;
+  }, [a.parts]);
+  function m(i) {
+    var y;
+    return !i || !(i != null && i.variants) ? !1 : (y = i.variants.find((d) => d.id === i.activeVariantId)) == null ? void 0 : y.subscriptionSettings;
   }
-  const p = i.parts.length > 0 && e.length > 0 && !m(e[0]), [B, l] = x.useState(!1);
+  const _ = a.parts.length > 0 && e.length > 0 && !m(e[0]), [B, h] = f.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsxs(
-      F,
+      L,
       {
         type: "Secondary",
         style: {
           padding: 10,
           position: "relative"
         },
-        onClick: (a) => {
-          a.stopPropagation(), window.location.pathname.includes("/admin/builder") || (s(!0), l(!0));
+        onClick: (i) => {
+          i.stopPropagation(), window.location.pathname.includes("/admin/builder") || (s(!0), h(!0));
         },
         children: [
           /* @__PURE__ */ t.jsx(
-            v,
+            b,
             {
               name: "Handbag",
               fill: "var(--text-primary)"
             }
           ),
-          p && /* @__PURE__ */ t.jsx("div", { className: C.shoppingCount, children: i.parts.length })
+          _ && /* @__PURE__ */ t.jsx("div", { className: k.shoppingCount, children: a.parts.length })
         ]
       }
     ),
@@ -1778,59 +1836,59 @@ const Un = (o) => {
       kt,
       {
         close: () => {
-          l(!1), setTimeout(() => {
+          h(!1), setTimeout(() => {
             s(!1);
           }, 300);
         },
         withAnimation: !1,
         children: /* @__PURE__ */ t.jsx(
-          Ss,
+          ws,
           {
             activeProducts: e,
-            isCartNotEmpty: p,
+            isCartNotEmpty: _,
             isOpen: B
           }
         )
       }
     )
   ] });
-}, Ss = (o) => {
-  const { activeProducts: s, isCartNotEmpty: e, isOpen: n } = o, { cart: i, reset: c, getTotalAndDiscount: u, updateQuantityOfProduct: r } = dt(), m = vt();
-  function p(a) {
-    m(a);
+}, ws = (o) => {
+  const { activeProducts: s, isCartNotEmpty: e, isOpen: n } = o, { cart: a, reset: c, getTotalAndDiscount: u, updateQuantityOfProduct: r } = dt(), m = jt();
+  function _(i) {
+    m(i);
   }
-  function B(a) {
-    a.quantity && r({
-      productId: a.id,
-      productVariantId: a.activeVariantId,
-      quantity: a.quantity + 1
+  function B(i) {
+    i.quantity && r({
+      productId: i.id,
+      productVariantId: i.activeVariantId,
+      quantity: i.quantity + 1
     });
   }
-  function l(a) {
-    a.quantity && r({
-      productId: a.id,
-      productVariantId: a.activeVariantId,
-      quantity: a.quantity - 1
+  function h(i) {
+    i.quantity && r({
+      productId: i.id,
+      productVariantId: i.activeVariantId,
+      quantity: i.quantity - 1
     });
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: V(C.modal, {
-        [C.closing]: !n
+      className: F(k.modal, {
+        [k.closing]: !n
       }),
-      onClick: (a) => a.stopPropagation(),
+      onClick: (i) => i.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: C.top, children: [
-          /* @__PURE__ */ t.jsxs("div", { className: C.info, children: [
-            /* @__PURE__ */ t.jsx("span", { className: C.title, children: "Cart" }),
-            e && /* @__PURE__ */ t.jsx("div", { className: C.count, children: i.parts.length })
+        /* @__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" }),
+            e && /* @__PURE__ */ t.jsx("div", { className: k.count, children: a.parts.length })
           ] }),
           /* @__PURE__ */ t.jsx(
             "button",
             {
-              className: V(C.clear, {
-                [C.activeClear]: e
+              className: F(k.clear, {
+                [k.activeClear]: e
               }),
               disabled: !e,
               onClick: c,
@@ -1838,49 +1896,49 @@ const Un = (o) => {
             }
           )
         ] }),
-        e ? /* @__PURE__ */ t.jsxs("div", { className: C.cart, children: [
-          /* @__PURE__ */ t.jsx("div", { className: C.products, children: s.map((a) => /* @__PURE__ */ t.jsxs(
+        e ? /* @__PURE__ */ t.jsxs("div", { className: k.cart, children: [
+          /* @__PURE__ */ t.jsx("div", { className: k.products, children: s.map((i) => /* @__PURE__ */ t.jsxs(
             "div",
             {
-              className: C.product,
+              className: k.product,
               children: [
-                /* @__PURE__ */ t.jsxs("div", { className: C.productInfo, children: [
-                  a.images.length > 0 ? /* @__PURE__ */ t.jsx(
+                /* @__PURE__ */ t.jsxs("div", { className: k.productInfo, children: [
+                  i.images.length > 0 ? /* @__PURE__ */ t.jsx(
                     "img",
                     {
-                      src: `https://imagedelivery.net/${a.images[0].cfId}/w=500`,
+                      src: `https://imagedelivery.net/${i.images[0].cfId}/w=500`,
                       alt: "image",
                       width: "100%",
                       height: "100%",
-                      className: C.image
+                      className: k.image
                     }
-                  ) : /* @__PURE__ */ t.jsx("div", { className: C.image, children: /* @__PURE__ */ t.jsx(
-                    v,
+                  ) : /* @__PURE__ */ t.jsx("div", { className: k.image, children: /* @__PURE__ */ t.jsx(
+                    b,
                     {
                       name: "Image",
                       fill: "var(--text-secondary)"
                     }
                   ) }),
-                  /* @__PURE__ */ t.jsxs("div", { className: C.content, children: [
-                    /* @__PURE__ */ t.jsx("div", { className: C.name, children: Nt(a.name) }),
-                    /* @__PURE__ */ t.jsxs("div", { className: C.price, children: [
+                  /* @__PURE__ */ t.jsxs("div", { className: k.content, children: [
+                    /* @__PURE__ */ t.jsx("div", { className: k.name, children: Nt(i.name) }),
+                    /* @__PURE__ */ t.jsxs("div", { className: k.price, children: [
                       "$",
-                      a.variants.find((j) => j.id === a.activeVariantId).price.amount * ((a == null ? void 0 : a.quantity) || 1)
+                      i.variants.find((y) => y.id === i.activeVariantId).price.amount * ((i == null ? void 0 : i.quantity) || 1)
                     ] })
                   ] })
                 ] }),
-                /* @__PURE__ */ t.jsxs("div", { className: C.productButtons, children: [
+                /* @__PURE__ */ t.jsxs("div", { className: k.productButtons, children: [
                   /* @__PURE__ */ t.jsx(
-                    F,
+                    L,
                     {
                       type: "Secondary",
                       onClick: () => {
-                        a.quantity !== 1 && l(a);
+                        i.quantity !== 1 && h(i);
                       },
-                      className: C.productButton,
-                      disabled: a.quantity === 1,
+                      className: k.productButton,
+                      disabled: i.quantity === 1,
                       children: /* @__PURE__ */ t.jsx(
-                        v,
+                        b,
                         {
                           name: "Minus",
                           fill: "#757575",
@@ -1890,16 +1948,16 @@ const Un = (o) => {
                       )
                     }
                   ),
-                  /* @__PURE__ */ t.jsx("div", { className: C.productCount, children: a.quantity }),
+                  /* @__PURE__ */ t.jsx("div", { className: k.productCount, children: i.quantity }),
                   /* @__PURE__ */ t.jsx(
-                    F,
+                    L,
                     {
                       type: "Secondary",
-                      onClick: () => B(a),
-                      className: C.productButton,
-                      disabled: a.quantity === a.variants.find((j) => j.id === a.activeVariantId).quantity.available,
+                      onClick: () => B(i),
+                      className: k.productButton,
+                      disabled: i.quantity === i.variants.find((y) => y.id === i.activeVariantId).quantity.available,
                       children: /* @__PURE__ */ t.jsx(
-                        v,
+                        b,
                         {
                           name: "Plus",
                           fill: "#757575",
@@ -1912,14 +1970,14 @@ const Un = (o) => {
                 ] })
               ]
             },
-            a.id
+            i.id
           )) }),
-          /* @__PURE__ */ t.jsxs("div", { className: C.bottom, children: [
-            /* @__PURE__ */ t.jsxs("div", { className: C.subtotal, children: [
-              /* @__PURE__ */ t.jsxs("div", { className: C.block, children: [
+          /* @__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(
-                  v,
+                  b,
                   {
                     name: "Info",
                     width: 20,
@@ -1928,20 +1986,20 @@ const Un = (o) => {
                   }
                 )
               ] }),
-              /* @__PURE__ */ t.jsxs("div", { className: C.total, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: k.total, children: [
                 "$",
                 u().total
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx(F, { onClick: () => p("/checkout"), children: "Checkout" })
+            /* @__PURE__ */ t.jsx(L, { onClick: () => _("/checkout"), children: "Checkout" })
           ] })
-        ] }) : /* @__PURE__ */ t.jsx($s, {})
+        ] }) : /* @__PURE__ */ t.jsx(qs, {})
       ]
     }
   );
-}, $s = () => /* @__PURE__ */ t.jsxs("div", { className: C.empty, children: [
+}, qs = () => /* @__PURE__ */ t.jsxs("div", { className: k.empty, children: [
   /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-    v,
+    b,
     {
       name: "Handbag",
       fill: "var(--text-secondary)"
@@ -1955,20 +2013,20 @@ const Un = (o) => {
       "a",
       {
         href: "/products",
-        className: C.link,
+        className: k.link,
         children: "view products"
       }
     )
   ] })
-] }), Bt = ({ signUp: o, close: s }) => {
-  const e = JSON.parse(localStorage.getItem("token") || "{}"), { data: n } = e, i = vt();
+] }), Tt = ({ signUp: o, close: s }) => {
+  const e = JSON.parse(localStorage.getItem("token") || "{}"), { data: n } = e, a = jt();
   function c(m) {
-    window.location.pathname.includes("/admin/builder") || i(m);
+    window.location.pathname.includes("/admin/builder") || a(m);
   }
   if (!n)
     return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       /* @__PURE__ */ t.jsx(
-        F,
+        L,
         {
           onClick: () => {
             c("/customer-dash"), s == null || s();
@@ -1981,7 +2039,7 @@ const Un = (o) => {
         }
       ),
       o && /* @__PURE__ */ t.jsx(
-        F,
+        L,
         {
           onClick: () => {
             c("/customer-dash"), s == null || s();
@@ -1995,48 +2053,48 @@ const Un = (o) => {
         }
       )
     ] });
-  const [u, r] = x.useState("test-email@gmail.com");
-  return x.useEffect(() => {
+  const [u, r] = f.useState("test-email@gmail.com");
+  return f.useEffect(() => {
     (async () => {
-      const p = Et(n);
-      r(p.email);
+      const _ = Dt(n);
+      r(_.email);
     })();
   }, [n]), /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: C.userInfo,
+      className: k.userInfo,
       onClick: () => {
         c("/customer-dash"), s == null || s();
       },
       children: /* @__PURE__ */ t.jsx("div", { children: u || "test-email@gmail.com" })
     }
   );
-}, ws = ({
+}, Bs = ({
   children: o,
   logo: s,
   setIsOpen: e,
   signUp: n
 }) => {
-  const { setIsOpen: i } = $t(), c = () => {
-    i(!1), setTimeout(() => {
-      e(!1), i(!0);
+  const { setIsOpen: a } = qt(), c = () => {
+    a(!1), setTimeout(() => {
+      e(!1), a(!0);
     }, 300);
   };
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: C.pagesMobileModal,
+      className: k.pagesMobileModal,
       onClick: (u) => u.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: C.pagesMobileModalHeader, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: k.pagesMobileModalHeader, children: [
           /* @__PURE__ */ t.jsx("div", { children: s }),
           /* @__PURE__ */ t.jsx(
-            F,
+            L,
             {
               type: "Secondary",
               onClick: c,
               children: /* @__PURE__ */ t.jsx(
-                v,
+                b,
                 {
                   name: "X",
                   fill: "var(--text-primary)"
@@ -2045,9 +2103,9 @@ const Un = (o) => {
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: C.pagesMobileModalContent, children: o }),
-        /* @__PURE__ */ t.jsx("div", { className: C.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(
-          Bt,
+        /* @__PURE__ */ t.jsx("div", { className: k.pagesMobileModalContent, children: o }),
+        /* @__PURE__ */ t.jsx("div", { className: k.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(
+          Tt,
           {
             signUp: n,
             close: c
@@ -2056,28 +2114,28 @@ const Un = (o) => {
       ]
     }
   );
-}, Vi = ({
+}, Ui = ({
   children: o,
   logo: s,
   signUp: e
 }) => {
-  const [n, i] = x.useState(!1);
+  const [n, a] = f.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx(qs, { setIsOpenModal: i }),
-    n && /* @__PURE__ */ t.jsx(kt, { close: () => i(!1), children: /* @__PURE__ */ t.jsx(
-      ws,
+    /* @__PURE__ */ t.jsx(Ps, { setIsOpenModal: a }),
+    n && /* @__PURE__ */ t.jsx(kt, { close: () => a(!1), children: /* @__PURE__ */ t.jsx(
+      Bs,
       {
         logo: s,
-        setIsOpen: i,
+        setIsOpen: a,
         signUp: e,
         children: o
       }
     ) })
   ] });
-}, qs = (o) => {
+}, Ps = (o) => {
   const { setIsOpenModal: s } = o;
   return /* @__PURE__ */ t.jsx(
-    F,
+    L,
     {
       type: "Secondary",
       style: {
@@ -2087,7 +2145,7 @@ const Un = (o) => {
         e.stopPropagation(), window.location.pathname.includes("/admin/builder") || s(!0);
       },
       children: /* @__PURE__ */ t.jsx(
-        v,
+        b,
         {
           name: "List",
           fill: "var(--text-primary)"
@@ -2095,34 +2153,34 @@ const Un = (o) => {
       )
     }
   );
-}, Bs = "_share_10urc_1", Ps = "_modal_10urc_9", Ts = "_header_10urc_21", Ms = "_socials_10urc_31", As = "_social_10urc_31", Os = "_copy_10urc_41", Es = "_title_10urc_48", Ds = "_copyWrapper_10urc_54", Rs = "_copyText_10urc_63", Ls = "_copyTextMobile_10urc_76", zs = "_copyTextMiniMobile_10urc_95", et = {
-  share: Bs,
-  modal: Ps,
-  header: Ts,
-  socials: Ms,
-  social: As,
-  copy: Os,
-  title: Es,
-  copyWrapper: Ds,
-  copyText: Rs,
-  copyTextMobile: Ls,
-  copyTextMiniMobile: zs
-}, Ui = ({ title: o = "Copy Product Link" }) => {
-  const { isOpenModal: s, setIsOpenModal: e } = wt();
+}, Ts = "_share_10urc_1", Ms = "_modal_10urc_9", As = "_header_10urc_21", Os = "_socials_10urc_31", Es = "_social_10urc_31", Rs = "_copy_10urc_41", Ds = "_title_10urc_48", Ls = "_copyWrapper_10urc_54", zs = "_copyText_10urc_63", Fs = "_copyTextMobile_10urc_76", Vs = "_copyTextMiniMobile_10urc_95", et = {
+  share: Ts,
+  modal: Ms,
+  header: As,
+  socials: Os,
+  social: Es,
+  copy: Rs,
+  title: Ds,
+  copyWrapper: Ls,
+  copyText: zs,
+  copyTextMobile: Fs,
+  copyTextMiniMobile: Vs
+}, Hi = ({ title: o = "Copy Product Link" }) => {
+  const { isOpenModal: s, setIsOpenModal: e } = Bt();
   function n() {
     e(!0);
   }
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
-      F,
+      L,
       {
         className: et.share,
-        onClick: (i) => {
-          i.stopPropagation(), n();
+        onClick: (a) => {
+          a.stopPropagation(), n();
         },
         type: "Secondary",
         children: /* @__PURE__ */ t.jsx(
-          v,
+          b,
           {
             name: "Share",
             fill: "#757575",
@@ -2131,10 +2189,10 @@ const Un = (o) => {
         )
       }
     ),
-    s && /* @__PURE__ */ t.jsx(kt, { close: e, children: /* @__PURE__ */ t.jsx(Fs, { title: o }) })
+    s && /* @__PURE__ */ t.jsx(kt, { close: e, children: /* @__PURE__ */ t.jsx(Us, { title: o }) })
   ] });
-}, Fs = ({ title: o = "Copy Product Link" }) => {
-  const { setIsOpenModal: s } = wt(), { notification: e, setNotification: n } = qt(), { setIsOpen: i } = $t(), c = window.location.href;
+}, Us = ({ title: o = "Copy Product Link" }) => {
+  const { setIsOpenModal: s } = Bt(), { notification: e, setNotification: n } = Pt(), { setIsOpen: a } = qt(), c = window.location.href;
   function u() {
     navigator.clipboard.writeText(c), n({
       message: "Link copied to clipboard",
@@ -2142,23 +2200,23 @@ const Un = (o) => {
     });
   }
   function r() {
-    i(!1), setTimeout(() => {
-      s(!1), i(!0);
+    a(!1), setTimeout(() => {
+      s(!1), a(!0);
     }, 300);
   }
-  function m(p, B) {
-    return p.length > B ? p.slice(0, B) + "..." : p;
+  function m(_, B) {
+    return _.length > B ? _.slice(0, B) + "..." : _;
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: et.modal,
-      onClick: (p) => p.stopPropagation(),
+      onClick: (_) => _.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: et.header, children: [
           /* @__PURE__ */ t.jsx("div", { className: et.title, children: o }),
           /* @__PURE__ */ t.jsx(
-            v,
+            b,
             {
               name: "X",
               fill: "#757575",
@@ -2169,7 +2227,7 @@ const Un = (o) => {
         ] }),
         /* @__PURE__ */ t.jsxs("div", { className: et.copyWrapper, children: [
           /* @__PURE__ */ t.jsxs(
-            F,
+            L,
             {
               type: "Secondary",
               onClick: u,
@@ -2184,38 +2242,38 @@ const Un = (o) => {
             }
           ),
           /* @__PURE__ */ t.jsx(
-            F,
+            L,
             {
               type: "Secondary",
               onClick: u,
-              children: e ? /* @__PURE__ */ t.jsx(v, { name: "Check" }) : /* @__PURE__ */ t.jsx(v, { name: "Copy" })
+              children: e ? /* @__PURE__ */ t.jsx(b, { name: "Check" }) : /* @__PURE__ */ t.jsx(b, { name: "Copy" })
             }
           )
         ] })
       ]
     }
   );
-}, Vs = "_accordion_1s1lq_1", Us = "_header_1s1lq_9", Hs = "_icon_1s1lq_18", Ys = "_open_1s1lq_21", Ws = "_content_1s1lq_25", at = {
-  accordion: Vs,
-  header: Us,
-  icon: Hs,
-  open: Ys,
-  content: Ws
-}, Hi = ({ title: o, content: s, defaultOpen: e = !1 }) => {
-  const [n, i] = x.useState(e), [c, u] = x.useState(0), r = x.useRef(null), m = () => {
-    i(!n);
+}, Hs = "_accordion_1s1lq_1", Ys = "_header_1s1lq_9", Ws = "_icon_1s1lq_18", Gs = "_open_1s1lq_21", Qs = "_content_1s1lq_25", ot = {
+  accordion: Hs,
+  header: Ys,
+  icon: Ws,
+  open: Gs,
+  content: Qs
+}, Yi = ({ title: o, content: s, defaultOpen: e = !1 }) => {
+  const [n, a] = f.useState(e), [c, u] = f.useState(0), r = f.useRef(null), m = () => {
+    a(!n);
   };
-  return x.useEffect(() => {
+  return f.useEffect(() => {
     r.current && u(n ? r.current.scrollHeight : 0);
-  }, [n]), /* @__PURE__ */ t.jsxs("div", { className: at.accordion, children: [
+  }, [n]), /* @__PURE__ */ t.jsxs("div", { className: ot.accordion, children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: at.header,
+        className: ot.header,
         onClick: m,
         children: [
           /* @__PURE__ */ t.jsx("h5", { id: "h5", children: o }),
-          /* @__PURE__ */ t.jsx("div", { className: V(at.icon, { [at.open]: n }), children: /* @__PURE__ */ t.jsx(v, { name: "CaretDown" }) })
+          /* @__PURE__ */ t.jsx("div", { className: F(ot.icon, { [ot.open]: n }), children: /* @__PURE__ */ t.jsx(b, { name: "CaretDown" }) })
         ]
       }
     ),
@@ -2223,13 +2281,13 @@ const Un = (o) => {
       "div",
       {
         ref: r,
-        className: at.content,
+        className: ot.content,
         style: { height: `${c}px` },
         children: /* @__PURE__ */ t.jsx("p", { id: "p", children: s })
       }
     )
   ] });
-}, Yi = ({ children: o, path: s, className: e, target: n = "_self", id: i }) => {
+}, Wi = ({ children: o, path: s, className: e, target: n = "_self", id: a }) => {
   if (window.location.pathname.includes("/admin/builder"))
     return /* @__PURE__ */ t.jsx(
       "div",
@@ -2237,11 +2295,11 @@ const Un = (o) => {
         className: e,
         role: "link",
         style: { cursor: "pointer" },
-        id: i,
+        id: a,
         children: o
       }
     );
-  const c = vt(), u = /^https?:\/\//.test(s), r = (m) => {
+  const c = jt(), u = /^https?:\/\//.test(s), r = (m) => {
     u || n === "_blank" ? n === "_blank" ? window.open(s, "_blank") : window.open(s, "_self") : (m.preventDefault(), c(s));
   };
   return /* @__PURE__ */ t.jsx(
@@ -2251,32 +2309,32 @@ const Un = (o) => {
       className: e,
       role: "link",
       style: { cursor: "pointer" },
-      id: i,
+      id: a,
       children: o
     }
   );
-}, Gs = "_buttonsBlock_1b2rb_1", Qs = "_slideUp_1b2rb_1", Xs = {
-  buttonsBlock: Gs,
-  slideUp: Qs
-}, Wi = (o) => {
-  var p, B;
-  const { setIsOpen: s, setModalType: e, productId: n } = o, { cart: i } = dt(), { pageContext: c } = lt(), u = (p = c == null ? void 0 : c.listings) == null ? void 0 : p.find((l) => l.id === n);
+}, Xs = "_buttonsBlock_1b2rb_1", Js = "_slideUp_1b2rb_1", Ks = {
+  buttonsBlock: Xs,
+  slideUp: Js
+}, Gi = (o) => {
+  var _, B;
+  const { setIsOpen: s, setModalType: e, productId: n } = o, { cart: a } = dt(), { pageContext: c } = lt(), u = (_ = c == null ? void 0 : c.listings) == null ? void 0 : _.find((h) => h.id === n);
   if (!u)
     return null;
   const r = (B = c == null ? void 0 : c.products) == null ? void 0 : B.find(
-    (l) => l.uniquePath === u.productData.uniquePath
+    (h) => h.uniquePath === u.productData.uniquePath
   );
   if (!r)
     return null;
-  const m = i.parts.find((l) => l.productId === r.id);
+  const m = a.parts.find((h) => h.productId === r.id);
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: Xs.buttonsBlock,
-      onClick: (l) => l.stopPropagation(),
+      className: Ks.buttonsBlock,
+      onClick: (h) => h.stopPropagation(),
       children: [
         /* @__PURE__ */ t.jsx(
-          F,
+          L,
           {
             type: "Secondary",
             style: {
@@ -2289,7 +2347,7 @@ const Un = (o) => {
           }
         ),
         /* @__PURE__ */ t.jsx(
-          F,
+          L,
           {
             type: "Primary",
             onClick: () => {
@@ -2301,15 +2359,15 @@ const Un = (o) => {
       ]
     }
   );
-}, Js = "_wrapper_27wzz_1", Ks = "_logo_27wzz_8", Zs = "_info_27wzz_12", bt = {
-  wrapper: Js,
-  logo: Ks,
-  info: Zs
-}, Gi = ({ date: o }) => {
-  const { general: s } = Dt();
+}, Zs = "_wrapper_27wzz_1", ti = "_logo_27wzz_8", ei = "_info_27wzz_12", yt = {
+  wrapper: Zs,
+  logo: ti,
+  info: ei
+}, Qi = ({ date: o }) => {
+  const { general: s } = Lt();
   if (!s) return /* @__PURE__ */ t.jsx(t.Fragment, {});
   function e(n) {
-    const i = new Date(n), c = {
+    const a = new Date(n), c = {
       month: "short",
       day: "2-digit",
       year: "numeric",
@@ -2317,10 +2375,10 @@ const Un = (o) => {
       minute: "2-digit",
       hour12: !1
     };
-    return i.toLocaleDateString("en-US", c);
+    return a.toLocaleDateString("en-US", c);
   }
-  return /* @__PURE__ */ t.jsxs("div", { className: bt.wrapper, children: [
-    /* @__PURE__ */ t.jsx("div", { className: bt.logo, children: s.info.logo ? /* @__PURE__ */ t.jsx(
+  return /* @__PURE__ */ t.jsxs("div", { className: yt.wrapper, children: [
+    /* @__PURE__ */ t.jsx("div", { className: yt.logo, children: s.info.logo ? /* @__PURE__ */ t.jsx(
       "img",
       {
         src: `https://imagedelivery.net/${s.info.logo.cfId}/w=500,h=500`,
@@ -2328,68 +2386,68 @@ const Un = (o) => {
         style: { objectFit: "contain", width: "48px", height: "48px" }
       }
     ) : /* @__PURE__ */ t.jsx(
-      v,
+      b,
       {
         name: "Image",
         width: 48,
         height: 48
       }
     ) }),
-    /* @__PURE__ */ t.jsxs("div", { className: bt.info, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: yt.info, children: [
       /* @__PURE__ */ t.jsx("h3", { id: "h4", children: s.info.name }),
       /* @__PURE__ */ t.jsx("p", { id: "p", children: e(o) })
     ] })
   ] });
-}, ti = "_options_mju90_1", ei = "_price_mju90_12", ni = "_oldPrice_mju90_19", si = "_newPrice_mju90_27", ii = "_animate_mju90_34", ai = "_appearAndBounce_mju90_1", oi = "_meta_mju90_52", ci = "_info_mju90_58", ri = "_infoRight_mju90_66", li = "_buttons_mju90_73", di = "_variants_mju90_80", ui = "_variant_mju90_80", mi = "_stock_mju90_98", hi = "_variantInfo_mju90_105", pi = "_quantity_mju90_111", _i = "_count_mju90_118", gi = "_focused_mju90_135", fi = "_button_mju90_73", xi = "_activeVariant_mju90_161", vi = "_chargeTypes_mju90_165", ji = "_charge_mju90_165", bi = "_chargeActive_mju90_190", yi = "_title_mju90_198", Ii = "_modal_mju90_204", Ni = "_header_mju90_218", X = {
-  options: ti,
-  price: ei,
-  oldPrice: ni,
-  newPrice: si,
-  animate: ii,
-  appearAndBounce: ai,
-  meta: oi,
-  info: ci,
-  infoRight: ri,
-  buttons: li,
-  variants: di,
-  variant: ui,
-  stock: mi,
-  variantInfo: hi,
-  quantity: pi,
-  count: _i,
-  focused: gi,
-  button: fi,
-  activeVariant: xi,
-  chargeTypes: vi,
-  charge: ji,
-  chargeActive: bi,
-  title: yi,
-  modal: Ii,
-  header: Ni
-}, Qi = (o) => {
+}, ni = "_options_mju90_1", si = "_price_mju90_12", ii = "_oldPrice_mju90_19", ai = "_newPrice_mju90_27", oi = "_animate_mju90_34", ci = "_appearAndBounce_mju90_1", ri = "_meta_mju90_52", li = "_info_mju90_58", di = "_infoRight_mju90_66", ui = "_buttons_mju90_73", mi = "_variants_mju90_80", hi = "_variant_mju90_80", pi = "_stock_mju90_98", _i = "_variantInfo_mju90_105", gi = "_quantity_mju90_111", fi = "_count_mju90_118", xi = "_focused_mju90_135", vi = "_button_mju90_73", ji = "_activeVariant_mju90_161", bi = "_chargeTypes_mju90_165", yi = "_charge_mju90_165", Ii = "_chargeActive_mju90_190", Ni = "_title_mju90_198", ki = "_modal_mju90_204", Ci = "_header_mju90_218", J = {
+  options: ni,
+  price: si,
+  oldPrice: ii,
+  newPrice: ai,
+  animate: oi,
+  appearAndBounce: ci,
+  meta: ri,
+  info: li,
+  infoRight: di,
+  buttons: ui,
+  variants: mi,
+  variant: hi,
+  stock: pi,
+  variantInfo: _i,
+  quantity: gi,
+  count: fi,
+  focused: xi,
+  button: vi,
+  activeVariant: ji,
+  chargeTypes: bi,
+  charge: yi,
+  chargeActive: Ii,
+  title: Ni,
+  modal: ki,
+  header: Ci
+}, Xi = (o) => {
   var r, m;
-  const { pageContext: s } = lt(), e = (r = s == null ? void 0 : s.listings) == null ? void 0 : r.find((p) => p.id === o.productId);
+  const { pageContext: s } = lt(), e = (r = s == null ? void 0 : s.listings) == null ? void 0 : r.find((_) => _.id === o.productId);
   if (!e)
     return;
   const n = (m = s == null ? void 0 : s.products) == null ? void 0 : m.find(
-    (p) => p.uniquePath === e.productData.uniquePath
+    (_) => _.uniquePath === e.productData.uniquePath
   );
   if (!n)
     return;
-  const i = n.variants[0], [c, u] = x.useState(
-    i.chargeTypes && i.chargeTypes.length > 1 ? i.chargeTypes[0] : "ONE_TIME"
+  const a = n.variants[0], [c, u] = f.useState(
+    a.chargeTypes && a.chargeTypes.length > 1 ? a.chargeTypes[0] : "ONE_TIME"
   );
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: X.modal,
-      onClick: (p) => p.stopPropagation(),
+      className: J.modal,
+      onClick: (_) => _.stopPropagation(),
       children: [
         o.type === "Add To Cart" && /* @__PURE__ */ t.jsx(
-          ki,
+          Si,
           {
             variants: n.variants,
-            activeVariant: i,
+            activeVariant: a,
             activeChargeType: c,
             setActiveChargeType: u,
             productId: n.id,
@@ -2397,7 +2455,7 @@ const Un = (o) => {
           }
         ),
         o.type === "Buy Now" && /* @__PURE__ */ t.jsx(
-          Ci,
+          $i,
           {
             product: n,
             setIsOpen: o.setIsOpen
@@ -2406,30 +2464,30 @@ const Un = (o) => {
       ]
     }
   );
-}, ki = (o) => {
-  const { variants: s, activeChargeType: e, setActiveChargeType: n, activeVariant: i, productId: c, setIsOpen: u } = o, { cart: r, addProductToCart: m, addProducts: p, updateQuantityOfProduct: B } = dt(), { setNotification: l } = qt(), { pageContext: a } = lt();
-  async function j(d) {
-    const S = r.parts.find(
-      (g) => g.productId === o.productId && g.productVariantId === d
+}, Si = (o) => {
+  const { variants: s, activeChargeType: e, setActiveChargeType: n, activeVariant: a, productId: c, setIsOpen: u } = o, { cart: r, addProductToCart: m, addProducts: _, updateQuantityOfProduct: B } = dt(), { setNotification: h } = Pt(), { pageContext: i } = lt();
+  async function y(d) {
+    const C = r.parts.find(
+      (v) => v.productId === o.productId && v.productVariantId === d
     );
-    S ? B({
+    C ? B({
       productId: c,
       productVariantId: d,
-      quantity: S.quantity + 1
-    }) : (a != null && a.products && await p(a.products), await m({
+      quantity: C.quantity + 1
+    }) : (i != null && i.products && await _(i.products), await m({
       productId: c,
       productVariantId: d,
       quantity: 1
-    })), l({
+    })), h({
       message: "Product added to cart",
       status: "success"
     });
   }
-  return /* @__PURE__ */ t.jsxs("div", { className: X.modal, children: [
-    /* @__PURE__ */ t.jsxs("div", { className: X.header, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: J.modal, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: J.header, children: [
       /* @__PURE__ */ t.jsx("div", { id: "h3", children: "Choose a variant" }),
       /* @__PURE__ */ t.jsx(
-        v,
+        b,
         {
           name: "X",
           width: 24,
@@ -2440,36 +2498,36 @@ const Un = (o) => {
         }
       )
     ] }),
-    i.chargeTypes && i.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: X.chargeTypes, children: i.chargeTypes.map((d) => /* @__PURE__ */ t.jsx(
+    a.chargeTypes && a.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: J.chargeTypes, children: a.chargeTypes.map((d) => /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: V(X.charge, {
-          [X.chargeActive]: e === d
+        className: F(J.charge, {
+          [J.chargeActive]: e === d
         }),
         onClick: () => n(d),
         children: Ct[d]
       },
       d
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: X.variants, children: s.map((d) => {
-      var S, g;
+    /* @__PURE__ */ t.jsx("div", { className: J.variants, children: s.map((d) => {
+      var C, v;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
-          className: V(X.variant),
+          className: F(J.variant),
           onClick: () => {
-            j(d.id), u(!1);
+            y(d.id), u(!1);
           },
           children: [
-            /* @__PURE__ */ t.jsxs("div", { className: X.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: X.title, children: d.name }),
+            /* @__PURE__ */ t.jsxs("div", { className: J.variantInfo, children: [
+              /* @__PURE__ */ t.jsx("span", { className: J.title, children: d.name }),
               /* @__PURE__ */ t.jsxs("span", { children: [
                 "$",
                 e === "ONE_TIME" ? d.price.amount : d.subscriptionSettings ? d.subscriptionSettings.price.amount : "Price Not Found"
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx("div", { children: e === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: X.stock, children: [
-              (S = d.quantity.restrictions) != null && S.max || d.quantity.available !== void 0 ? ((g = d.quantity.restrictions) == null ? void 0 : g.max) || d.quantity.available : "∞",
+            /* @__PURE__ */ t.jsx("div", { children: e === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: J.stock, children: [
+              (C = d.quantity.restrictions) != null && C.max || d.quantity.available !== void 0 ? ((v = d.quantity.restrictions) == null ? void 0 : v.max) || d.quantity.available : "∞",
               " ",
               "in stock"
             ] }) })
@@ -2479,16 +2537,16 @@ const Un = (o) => {
       );
     }) })
   ] });
-}, Ci = (o) => {
+}, $i = (o) => {
   const { product: s, setIsOpen: e } = o;
-  return /* @__PURE__ */ t.jsxs("div", { className: X.modal, children: [
-    /* @__PURE__ */ t.jsxs("div", { className: X.header, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: J.modal, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: J.header, children: [
       /* @__PURE__ */ t.jsxs("div", { id: "h3", children: [
         "Buy ",
         Nt(s.name)
       ] }),
       /* @__PURE__ */ t.jsx(
-        v,
+        b,
         {
           name: "X",
           width: 24,
@@ -2503,32 +2561,32 @@ const Un = (o) => {
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsx(Un, { ...s })
+    /* @__PURE__ */ t.jsx(Yn, { ...s })
   ] });
-}, Si = "_wrapper_1efqk_1", $i = "_label_1efqk_10", wi = "_contentBorder_1efqk_19", qi = "_contentField_1efqk_23", Bi = "_textarea_1efqk_27", Pi = "_length_1efqk_42", it = {
-  wrapper: Si,
-  label: $i,
-  contentBorder: wi,
-  contentField: qi,
-  textarea: Bi,
-  length: Pi
-}, Xi = (o) => {
+}, wi = "_wrapper_1efqk_1", qi = "_label_1efqk_10", Bi = "_contentBorder_1efqk_19", Pi = "_contentField_1efqk_23", Ti = "_textarea_1efqk_27", Mi = "_length_1efqk_42", at = {
+  wrapper: wi,
+  label: qi,
+  contentBorder: Bi,
+  contentField: Pi,
+  textarea: Ti,
+  length: Mi
+}, Ji = (o) => {
   const {
     onChange: s,
     label: e,
     value: n,
-    maxLength: i,
+    maxLength: a,
     placeholder: c = "Type something...",
     type: u = "text"
-  } = o, [r, m] = x.useState(n.length), { themeSettings: p } = Rt();
-  function B(l) {
-    return u === "number" ? l.replace(/[^\d\n]+/g, "") : l;
+  } = o, [r, m] = f.useState(n.length), { themeSettings: _ } = zt();
+  function B(h) {
+    return u === "number" ? h.replace(/[^\d\n]+/g, "") : h;
   }
-  return /* @__PURE__ */ t.jsxs("div", { className: it.wrapper, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: at.wrapper, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
       {
-        className: it.label,
+        className: at.label,
         htmlFor: e,
         children: e
       }
@@ -2538,63 +2596,64 @@ const Un = (o) => {
       {
         id: e,
         value: n,
-        onChange: (l) => {
-          const a = B(l.target.value);
-          m(a.length), s(a);
+        onChange: (h) => {
+          const i = B(h.target.value);
+          m(i.length), s(i);
         },
         placeholder: c,
-        className: V(it.textarea, {
-          [it.contentBorder]: p.inputs.border.active,
-          [it.contentField]: p.inputs.field.active
+        className: F(at.textarea, {
+          [at.contentBorder]: _.inputs.border.active,
+          [at.contentField]: _.inputs.field.active
         }),
-        maxLength: i
+        maxLength: a
       }
     ),
-    i && /* @__PURE__ */ t.jsxs("div", { className: it.length, children: [
+    a && /* @__PURE__ */ t.jsxs("div", { className: at.length, children: [
       r,
       "/",
-      i
+      a
     ] })
   ] });
 };
 export {
-  Hi as Accordion,
-  qs as BurgerMenuButton,
-  F as Button,
-  vn as ButtonTypeSettings,
-  Li as ButtonsSettings,
-  Ei as CategorySettings,
+  Yi as Accordion,
+  Ps as BurgerMenuButton,
+  L as Button,
+  bn as ButtonTypeSettings,
+  zi as ButtonsSettings,
+  Ri as CategorySettings,
   Ct as ChargeTypes,
-  Tt as ChooseImage,
-  Zi as ChooseImageModal,
-  $s as EmptyCart,
-  Ri as FormSettings,
-  Fi as HeaderButtons,
-  v as Icon,
-  yt as InputSettings,
-  Ot as InputUI,
-  ta as ItemsSettings,
-  Oi as LayoutSettings,
-  Yi as Link,
-  zi as ListingSelector,
-  ea as Loader,
-  Gi as MetaInfoPost,
+  At as ChooseImage,
+  ta as ChooseImageModal,
+  qs as EmptyCart,
+  Li as FormSettings,
+  Vi as HeaderButtons,
+  b as Icon,
+  It as InputSettings,
+  Rt as InputUI,
+  ea as ItemsSettings,
+  Ei as LayoutSettings,
+  Wi as Link,
+  Fi as ListingSelector,
+  na as Loader,
+  Qi as MetaInfoPost,
   kt as Modal,
-  Vi as PagesMobileMenu,
-  ws as PagesMobileModal,
+  Ui as PagesMobileMenu,
+  Bs as PagesMobileModal,
   Di as PagesSettings,
-  Wi as ProductCardButtons,
-  Qi as ProductCardModal,
-  Un as ProductOptions,
+  Gi as ProductCardButtons,
+  Xi as ProductCardModal,
+  Yn as ProductOptions,
   St as RangeSelector,
-  rt as Select,
-  Ui as ShareLink,
-  Cs as ShoppingButton,
-  Ss as ShoppingModalCart,
-  ot as Switch,
-  na as TextSettings,
-  sa as TextareaSettings,
-  Xi as TextareaUI,
-  ia as TypesText,
-  Bt as UserInfo
+  it as Select,
+  sa as SelectInfiniteList,
+  Hi as ShareLink,
+  $s as ShoppingButton,
+  ws as ShoppingModalCart,
+  ct as Switch,
+  ia as TextSettings,
+  aa as TextareaSettings,
+  Ji as TextareaUI,
+  oa as TypesText,
+  Tt as UserInfo
 };