@billgangcom/theme-lib 1.63.0 → 1.64.0

package/dist/ui.es.js

@@ -1,21 +1,21 @@
-import { j as t, I as f, c as W, a as ut, S as it, R as kt, B as ot, O as mt, d as at, u as ht, e as pt, P as _t, D as gt, f as ft, v as xt, g as bt, C as jt, h as F, i as wt, k as st, l as $t, m as Bt, n as Pt, o as rt, p as G, L as Mt, r as lt, t as vt, w as H, x as Tt, M as yt, y as Nt, z as qt, A as It, E as At, F as Ot } from "./index-DV89YV-L.js";
-import { N as bi, H as ji, K as vi, G as yi, T as ki, J as Ni } from "./index-DV89YV-L.js";
-import _ from "react";
+import { j as t, I as v, c as V, a as pt, S as ot, R as St, B as ct, O as _t, d as lt, u as gt, e as ft, P as xt, D as vt, f as jt, v as bt, g as yt, C as Nt, h as H, i as Pt, k as at, l as Tt, m as rt, n as Mt, o as mt, p as G, L as At, r as ut, t as dt, s as It, w as F, x as Ot, M as kt, y as wt, z as Et, A as $t, E as qt, F as Dt, G as Rt } from "./index-Dg3k5gYy.js";
+import { Q as Ki, J as Zi, N as ta, H as ea, T as na, K as sa } from "./index-Dg3k5gYy.js";
+import x from "react";
 import "@phosphor-icons/react";
-const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmyb_15", Lt = "_subtitle_1vmyb_22", zt = "_alignmentContent_1vmyb_29", Ut = "_alignments_1vmyb_37", Ht = "_alignment_1vmyb_8", Ft = "_circle_1vmyb_60", Vt = "_paddings_1vmyb_67", Yt = "_padding_1vmyb_67", Gt = "_active_1vmyb_91", Wt = "_input_1vmyb_98", J = {
-  wrapper: Et,
-  alignmentBlock: Dt,
-  title: Rt,
-  subtitle: Lt,
-  alignmentContent: zt,
-  alignments: Ut,
-  alignment: Ht,
-  circle: Ft,
-  paddings: Vt,
-  padding: Yt,
-  active: Gt,
-  input: Wt
-}, Jt = [
+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", X = {
+  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 = [
   "topLeft",
   "top",
   "topRight",
@@ -25,10 +25,10 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
   "bottomLeft",
   "bottom",
   "bottomRight"
-], Xt = ["left", "top", "right", "bottom"], ni = (r) => {
-  const { alignment: s, padding: e, setPadding: n, setAlignment: i } = r;
-  function d(c) {
-    switch (c) {
+], Zt = ["left", "top", "right", "bottom"], Ai = (o) => {
+  const { alignment: s, padding: e, setPadding: n, setAlignment: i } = o;
+  function c(r) {
+    switch (r) {
       case "left":
       case "topLeft":
       case "bottomLeft":
@@ -45,8 +45,8 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
         return "TextAlignCenter";
     }
   }
-  function u(c) {
-    switch (c) {
+  function u(r) {
+    switch (r) {
       case "left":
         return "AlignLeft";
       case "right":
@@ -57,40 +57,40 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
         return "AlignBottom";
     }
   }
-  const [o, m] = _.useState(null), [g, C] = _.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: Jt.map((c) => /* @__PURE__ */ t.jsxs(
+  const [l, m] = x.useState(null), [p, B] = x.useState(null);
+  return /* @__PURE__ */ t.jsxs("div", { className: X.layout, children: [
+    /* @__PURE__ */ t.jsx("h3", { className: X.title, children: "Layout (for Desktop version)" }),
+    /* @__PURE__ */ t.jsxs("div", { className: X.alignmentBlock, children: [
+      /* @__PURE__ */ t.jsx("h5", { className: X.subtitle, children: "Alignment" }),
+      /* @__PURE__ */ t.jsxs("div", { className: X.alignmentContent, children: [
+        /* @__PURE__ */ t.jsx("div", { className: X.alignments, children: Kt.map((r) => /* @__PURE__ */ t.jsxs(
           "div",
           {
             onClick: () => {
-              i(c);
+              i(r);
             },
-            className: J.alignment,
+            className: X.alignment,
             onMouseEnter: () => {
-              m(c);
+              m(r);
             },
             onMouseLeave: () => {
               m(null);
             },
             children: [
-              c !== s && o !== c && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
-              c !== s && o === c && /* @__PURE__ */ t.jsx(
-                f,
+              r !== s && l !== r && /* @__PURE__ */ t.jsx("div", { className: X.circle }),
+              r !== s && l === r && /* @__PURE__ */ t.jsx(
+                v,
                 {
-                  name: d(o),
+                  name: c(l),
                   fill: "#c2c2c2",
                   width: 22,
                   height: 22
                 }
               ),
-              c === s && /* @__PURE__ */ t.jsx(
-                f,
+              r === s && /* @__PURE__ */ t.jsx(
+                v,
                 {
-                  name: d(s),
+                  name: c(s),
                   fill: "#FF3F19",
                   width: 22,
                   height: 22
@@ -98,37 +98,37 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
               )
             ]
           },
-          c
+          r
         )) }),
-        /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: Xt.map((c) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: X.paddings, children: Zt.map((r) => /* @__PURE__ */ t.jsxs(
           "label",
           {
-            className: W(J.padding, {
-              [J.active]: g === c
+            className: V(X.padding, {
+              [X.active]: p === r
             }),
             onFocus: () => {
-              C(c);
+              B(r);
             },
             onBlur: () => {
-              C(null);
+              B(null);
             },
             children: [
               /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-                f,
+                v,
                 {
-                  name: u(c),
+                  name: u(r),
                   width: 20,
                   height: 20
                 }
               ) }),
               /* @__PURE__ */ t.jsx(
-                ut,
+                pt,
                 {
                   type: "number",
-                  value: String(e[c]),
-                  onChange: (l) => n({
+                  value: String(e[r]),
+                  onChange: (a) => n({
                     ...e,
-                    [c]: Math.min(Number(l), 999)
+                    [r]: Math.min(Number(a), 999)
                   }),
                   max: 999,
                   paddingless: !0,
@@ -137,66 +137,66 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
               )
             ]
           },
-          c
+          r
         )) })
       ] })
     ] })
   ] });
-}, Kt = "_title_82zux_1", Qt = "_subtitle_82zux_5", Zt = "_header_82zux_12", te = "_text_82zux_13", ee = "_productsBlock_82zux_14", ne = "_top_82zux_26", se = "_itemsBlock_82zux_35", ie = "_typeTexts_82zux_41", oe = "_block_82zux_48", ae = "_active_82zux_61", ce = "_products_82zux_14", le = "_product_82zux_14", re = "_button_82zux_80", de = "_disabled_82zux_91", ue = "_image_82zux_95", me = "_info_82zux_102", he = "_name_82zux_114", pe = "_buttons_82zux_118", _e = "_modal_82zux_125", ge = "_link_82zux_145", fe = "_modalOptions_82zux_151", xe = "_addButton_82zux_157", be = "_deleteButton_82zux_179", X = {
-  title: Kt,
-  subtitle: Qt,
-  header: Zt,
-  text: te,
-  productsBlock: ee,
-  top: ne,
-  itemsBlock: se,
-  typeTexts: ie,
-  block: oe,
-  active: ae,
-  products: ce,
-  product: le,
-  button: re,
-  disabled: de,
-  image: ue,
-  info: me,
-  name: he,
-  buttons: pe,
-  modal: _e,
-  link: ge,
-  modalOptions: fe,
-  addButton: xe,
-  deleteButton: be
-}, si = (r) => {
+}, 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", le = "_block_82zux_48", re = "_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", J = {
+  title: te,
+  subtitle: ee,
+  header: ne,
+  text: se,
+  productsBlock: ie,
+  top: ae,
+  itemsBlock: oe,
+  typeTexts: ce,
+  block: le,
+  active: re,
+  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
+}, Oi = (o) => {
   const {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
     setItems: i,
-    other: d,
+    other: c,
     title: u,
-    subtitle: o,
+    subtitle: l,
     draggable: m = !1,
-    withImage: g = !1,
-    addable: C = !0,
-    itemsOptions: c,
-    hasRangeSelector: l = !1,
-    rangeSelectorOptions: T,
-    limit: $,
-    autoScrollInterval: M,
-    deletable: x
-  } = r;
-  function N(j) {
-    if (g)
-      return j ? /* @__PURE__ */ t.jsx(
+    withImage: p = !1,
+    addable: B = !0,
+    itemsOptions: r,
+    hasRangeSelector: a = !1,
+    rangeSelectorOptions: j,
+    limit: d,
+    autoScrollInterval: S,
+    deletable: g
+  } = o;
+  function y(k) {
+    if (p)
+      return k ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${j[0]}/w=1000`,
+          src: `https://imagedelivery.net/${k[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        f,
+        v,
         {
           name: "Image",
           width: 16,
@@ -205,12 +205,12 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
         }
       );
   }
-  const a = (j, R = !1) => {
-    const w = c.find((S) => S.id === j);
-    if (!w) return;
-    const z = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  const q = (k, h = !1) => {
+    const $ = r.find((L) => L.id === k);
+    if (!$) return;
+    const R = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       m && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        f,
+        v,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -219,56 +219,56 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
         }
       ) }),
       /* @__PURE__ */ t.jsx(
-        at,
+        lt,
         {
-          onChange: (S) => {
-            const v = [...n], I = c.find((p) => p.name === S);
-            if (!I) return;
-            const q = I.id, B = v.map((p) => p === j ? q : p);
-            i([...B]);
+          onChange: (L) => {
+            const I = [...n], b = r.find((f) => f.name === L);
+            if (!b) return;
+            const M = b.id, P = I.map((f) => f === k ? M : f);
+            i([...P]);
           },
-          value: w.name,
-          options: c.filter((S) => !n.find((v) => v === S.id)).map((S) => S.name),
-          leftAddon: N(w.images)
+          value: $.name,
+          options: r.filter((L) => !n.find((I) => I === L.id)).map((L) => L.name),
+          leftAddon: y($.images)
         }
       ),
-      R && /* @__PURE__ */ t.jsx("div", { className: X.buttons, children: /* @__PURE__ */ t.jsx("div", { className: X.deleteButton, children: /* @__PURE__ */ t.jsx(
-        f,
+      h && /* @__PURE__ */ t.jsx("div", { className: J.buttons, children: /* @__PURE__ */ t.jsx("div", { className: J.deleteButton, children: /* @__PURE__ */ t.jsx(
+        v,
         {
           name: "Trash",
           hoverable: !0,
           width: 20,
           height: 20,
           fill: "#C12A2A",
-          onClick: () => i(n.filter((S) => S !== j))
+          onClick: () => i(n.filter((L) => L !== k))
         }
       ) }) })
     ] });
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: X.product,
-        children: z
+        className: J.product,
+        children: R
       },
-      j
+      k
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: X.productsBlock, children: [
-    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: X.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: X.title, children: u }),
+  return /* @__PURE__ */ t.jsxs("div", { className: J.productsBlock, children: [
+    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: J.top, children: [
+      u && /* @__PURE__ */ t.jsx("h3", { className: J.title, children: u }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        it,
+        ot,
         {
           current: s,
-          onChange: (j) => e == null ? void 0 : e(j)
+          onChange: (k) => e == null ? void 0 : e(k)
         }
       )
     ] }),
-    l && T && /* @__PURE__ */ t.jsx(kt, { ...T }),
-    /* @__PURE__ */ t.jsxs("div", { className: X.products, children: [
-      o && /* @__PURE__ */ t.jsx("h5", { className: X.subtitle, children: o }),
-      n.map((j) => a(j, x)),
-      C && /* @__PURE__ */ t.jsx(
+    a && j && /* @__PURE__ */ t.jsx(St, { ...j }),
+    /* @__PURE__ */ t.jsxs("div", { className: J.products, children: [
+      l && /* @__PURE__ */ t.jsx("h5", { className: J.subtitle, children: l }),
+      n.map((k) => q(k, g)),
+      B && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -278,33 +278,33 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
             gap: 5
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            ct,
             {
               withoutHover: !0,
-              className: W(X.button, {
-                [X.disabled]: !!($ && $ <= n.length || n.length === c.length)
+              className: V(J.button, {
+                [J.disabled]: !!(d && d <= n.length || n.length === r.length)
               }),
               size: "s",
-              disabled: !!($ && $ <= n.length || n.length === c.length),
+              disabled: !!(d && d <= n.length || n.length === r.length),
               onClick: () => {
-                const j = [...n];
-                let R = null;
-                if (c) {
-                  for (let w = 0; w < c.length; w++)
-                    if (!n.find((z) => z === c[w].id)) {
-                      R = c[w];
+                const k = [...n];
+                let h = null;
+                if (r) {
+                  for (let $ = 0; $ < r.length; $++)
+                    if (!n.find((R) => R === r[$].id)) {
+                      h = r[$];
                       break;
                     }
                 }
-                j.push((R == null ? void 0 : R.id) || c[0].id), i(j);
+                k.push((h == null ? void 0 : h.id) || r[0].id), i(k);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: X.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: J.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  f,
+                  v,
                   {
                     name: "Plus",
                     width: 16,
@@ -317,14 +317,14 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
         }
       )
     ] }),
-    d !== void 0 && /* @__PURE__ */ t.jsx(mt, { items: d }),
-    M !== void 0 && /* @__PURE__ */ t.jsx(
-      ut,
+    c !== void 0 && /* @__PURE__ */ t.jsx(_t, { items: c }),
+    S !== void 0 && /* @__PURE__ */ t.jsx(
+      pt,
       {
         label: "Auto scroll interval",
         type: "number",
-        value: String(M.scrollInterval),
-        onChange: (j) => M.setScrollInterval(Number(j)),
+        value: String(S.scrollInterval),
+        onChange: (k) => S.setScrollInterval(Number(k)),
         min: 0.1,
         max: 100,
         style: {
@@ -334,44 +334,44 @@ const Et = "_wrapper_1vmyb_2", Dt = "_alignmentBlock_1vmyb_8", Rt = "_title_1vmy
       }
     )
   ] });
-}, je = "_title_roi3a_1", ve = "_subtitle_roi3a_5", ye = "_header_roi3a_12", ke = "_text_roi3a_13", Ne = "_productsBlock_roi3a_14", Ie = "_top_roi3a_26", Se = "_itemsBlock_roi3a_35", Ce = "_typeTexts_roi3a_41", we = "_block_roi3a_48", $e = "_active_roi3a_61", Be = "_products_roi3a_14", Pe = "_product_roi3a_14", Me = "_button_roi3a_80", Te = "_disabled_roi3a_91", qe = "_image_roi3a_95", Ae = "_info_roi3a_102", Oe = "_name_roi3a_114", Ee = "_buttons_roi3a_118", De = "_modal_roi3a_125", Re = "_link_roi3a_145", Le = "_modalOptions_roi3a_151", ze = "_addButton_roi3a_164", Ue = "_deleteButton_roi3a_179", He = "_closeIcon_roi3a_191", V = {
-  title: je,
-  subtitle: ve,
-  header: ye,
-  text: ke,
-  productsBlock: Ne,
-  top: Ie,
-  itemsBlock: Se,
-  typeTexts: Ce,
-  block: we,
-  active: $e,
-  products: Be,
-  product: Pe,
-  button: Me,
-  disabled: Te,
-  image: qe,
-  info: Ae,
-  name: Oe,
-  buttons: Ee,
-  modal: De,
-  link: Re,
-  modalOptions: Le,
-  addButton: ze,
-  deleteButton: Ue,
-  closeIcon: He
+}, Ne = "_title_roi3a_1", Ie = "_subtitle_roi3a_5", ke = "_header_roi3a_12", Ce = "_text_roi3a_13", Se = "_productsBlock_roi3a_14", we = "_top_roi3a_26", $e = "_itemsBlock_roi3a_35", qe = "_typeTexts_roi3a_41", Be = "_block_roi3a_48", Pe = "_active_roi3a_61", Te = "_products_roi3a_14", Me = "_product_roi3a_14", Ae = "_button_roi3a_80", Oe = "_disabled_roi3a_91", Ee = "_image_roi3a_95", De = "_info_roi3a_102", Re = "_name_roi3a_114", Le = "_buttons_roi3a_118", ze = "_modal_roi3a_125", Fe = "_link_roi3a_145", Ve = "_modalOptions_roi3a_151", Ue = "_addButton_roi3a_164", He = "_deleteButton_roi3a_179", Ye = "_closeIcon_roi3a_191", Y = {
+  title: Ne,
+  subtitle: Ie,
+  header: ke,
+  text: Ce,
+  productsBlock: Se,
+  top: we,
+  itemsBlock: $e,
+  typeTexts: qe,
+  block: Be,
+  active: Pe,
+  products: Te,
+  product: Me,
+  button: Ae,
+  disabled: Oe,
+  image: Ee,
+  info: De,
+  name: Re,
+  buttons: Le,
+  modal: ze,
+  link: Fe,
+  modalOptions: Ve,
+  addButton: Ue,
+  deleteButton: He,
+  closeIcon: Ye
 };
-function Fe({ product: r, children: s }) {
+function We({ product: o, children: s }) {
   const {
     attributes: e,
     listeners: n,
     setNodeRef: i,
-    transform: d,
+    transform: c,
     transition: u,
-    isDragging: o
-  } = bt({
-    id: r.id
+    isDragging: l
+  } = yt({
+    id: o.id
   }), m = {
-    transform: jt.Transform.toString(d),
+    transform: Nt.Transform.toString(c),
     transition: u
   };
   return /* @__PURE__ */ t.jsx(
@@ -379,64 +379,64 @@ function Fe({ product: r, children: s }) {
     {
       ref: i,
       style: m,
-      className: `${V.product} ${o ? V.dragging : ""}`,
+      className: `${Y.product} ${l ? Y.dragging : ""}`,
       ...e,
       ...n,
       children: s
     }
   );
 }
-const ii = (r) => {
+const Ei = (o) => {
   const {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
     setItems: i,
-    title: d,
+    title: c,
     subtitle: u,
-    editable: o = !0,
+    editable: l = !0,
     draggable: m = !1,
-    deletable: g = !0,
-    addable: C = !0,
-    itemsType: c,
-    itemsOptions: l,
-    addableOptions: T = {},
-    limit: $
-  } = r, [M, x] = _.useState(null), [N, a] = _.useState(null), j = _.useRef(null), R = ht(
-    pt(_t, {
+    deletable: p = !0,
+    addable: B = !0,
+    itemsType: r,
+    itemsOptions: a,
+    addableOptions: j = {},
+    limit: d
+  } = o, [S, g] = x.useState(null), [y, q] = x.useState(null), k = x.useRef(null), h = gt(
+    ft(xt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  _.useEffect(() => {
-    if (M) {
-      const v = [...n].map((I) => I.id === M.id ? M : I);
-      i(v);
+  x.useEffect(() => {
+    if (S) {
+      const I = [...n].map((b) => b.id === S.id ? S : b);
+      i(I);
     }
-  }, [M]), _.useEffect(() => {
-    j.current && N && (j.current.getBoundingClientRect().height, N.top);
-  }, [j.current, N]);
-  const w = (v, I) => {
-    v.stopPropagation();
-    const q = v.target.getBoundingClientRect();
-    a({
-      top: q.top + window.scrollY,
-      left: q.left - 30
-    }), x(I);
-  }, z = (v) => {
-    const { active: I, over: q } = v;
-    if (q && I.id !== q.id) {
-      const B = n.findIndex((b) => b.id === I.id), p = n.findIndex((b) => b.id === q.id);
-      if (B !== -1 && p !== -1) {
-        const b = [...n], [A] = b.splice(B, 1);
-        b.splice(p, 0, A), i(b);
+  }, [S]), x.useEffect(() => {
+    k.current && y && (k.current.getBoundingClientRect().height, y.top);
+  }, [k.current, y]);
+  const $ = (I, b) => {
+    I.stopPropagation();
+    const M = I.target.getBoundingClientRect();
+    q({
+      top: M.top + window.scrollY,
+      left: M.left - 30
+    }), g(b);
+  }, R = (I) => {
+    const { active: b, over: M } = I;
+    if (M && b.id !== M.id) {
+      const P = n.findIndex((N) => N.id === b.id), f = n.findIndex((N) => N.id === M.id);
+      if (P !== -1 && f !== -1) {
+        const N = [...n], [A] = N.splice(P, 1);
+        N.splice(f, 0, A), i(N);
       }
     }
-  }, S = (v, I) => {
-    const q = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+  }, L = (I, b) => {
+    const M = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       m && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        f,
+        v,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -444,99 +444,99 @@ const ii = (r) => {
           height: 20
         }
       ) }),
-      c === "select" && l && /* @__PURE__ */ t.jsx(
-        at,
+      r === "select" && a && /* @__PURE__ */ t.jsx(
+        lt,
         {
-          onChange: (B) => {
-            const p = [...n], b = l.find((U) => U.name === B);
-            if (!b) return;
-            const A = p.map((U) => U.id === v.id ? {
-              ...b,
+          onChange: (P) => {
+            const f = [...n], N = a.find((U) => U.name === P);
+            if (!N) return;
+            const A = f.map((U) => U.id === I.id ? {
+              ...N,
               name: {
-                "en-US": B
+                "en-US": P
               }
             } : U);
-            x({
-              ...v,
+            g({
+              ...I,
               name: {
-                "en-US": B
+                "en-US": P
               }
             }), i([...A]);
           },
-          value: v.name,
-          options: l.filter((B) => !n.find((p) => p.name === B.name)).map((B) => B.name)
+          value: I.name,
+          options: a.filter((P) => !n.find((f) => f.name === P.name)).map((P) => P.name)
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: V.buttons, children: [
-        o && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
-          f,
+      /* @__PURE__ */ t.jsxs("div", { className: Y.buttons, children: [
+        l && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
+          v,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (B) => w(B, v)
+            onClick: (P) => $(P, I)
           }
         ) }),
-        g && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
-          f,
+        p && /* @__PURE__ */ t.jsx("div", { className: Y.deleteButton, children: /* @__PURE__ */ t.jsx(
+          v,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(n.filter((B) => B.id !== v.id))
+            onClick: () => i(n.filter((P) => P.id !== I.id))
           }
         ) })
       ] })
     ] });
     return m ? /* @__PURE__ */ t.jsx(
-      Fe,
+      We,
       {
-        product: v,
-        index: I,
-        children: q
+        product: I,
+        index: b,
+        children: M
       },
-      v.id
+      I.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: V.product,
-        children: q
+        className: Y.product,
+        children: M
       },
-      v.id
+      I.id
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: V.productsBlock, children: [
-    (d || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
-      d && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: d }),
+  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 }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        it,
+        ot,
         {
           current: s,
-          onChange: (v) => e == null ? void 0 : e(v)
+          onChange: (I) => e == null ? void 0 : e(I)
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: V.products, children: [
-      u && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: u }),
+    /* @__PURE__ */ t.jsxs("div", { className: Y.products, children: [
+      u && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: u }),
       m ? /* @__PURE__ */ t.jsx(
-        gt,
+        vt,
         {
-          sensors: R,
-          onDragEnd: z,
+          sensors: h,
+          onDragEnd: R,
           children: /* @__PURE__ */ t.jsx(
-            ft,
+            jt,
             {
-              items: n.map((v) => v.id),
-              strategy: xt,
-              children: n.map((v, I) => S(v, I))
+              items: n.map((I) => I.id),
+              strategy: bt,
+              children: n.map((I, b) => L(I, b))
             }
           )
         }
-      ) : n.map((v, I) => S(v, I)),
-      C && /* @__PURE__ */ t.jsx(
+      ) : n.map((I, b) => L(I, b)),
+      B && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -545,37 +545,37 @@ const ii = (r) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            ct,
             {
               withoutHover: !0,
-              className: W(V.button, {
-                [V.disabled]: !!($ && $ <= n.length || n.length === (l == null ? void 0 : l.length))
+              className: V(Y.button, {
+                [Y.disabled]: !!(d && d <= n.length || n.length === (a == null ? void 0 : a.length))
               }),
               size: "s",
-              disabled: !!($ && $ <= n.length || n.length === (l == null ? void 0 : l.length)),
+              disabled: !!(d && d <= n.length || n.length === (a == null ? void 0 : a.length)),
               onClick: () => {
-                const v = [...n];
-                let I = null;
-                if (l) {
-                  for (let q = 0; q < l.length; q++)
-                    if (!n.find((B) => B.id === l[q].id)) {
-                      I = l[q];
+                const I = [...n];
+                let b = null;
+                if (a) {
+                  for (let M = 0; M < a.length; M++)
+                    if (!n.find((P) => P.id === a[M].id)) {
+                      b = a[M];
                       break;
                     }
                 }
-                c === "select" && l && v.push({
-                  name: I ? I.name : l[0].name,
-                  id: (I == null ? void 0 : I.id) || l[0].id,
-                  ...T
-                }), i(v);
+                r === "select" && a && I.push({
+                  name: b ? b.name : a[0].name,
+                  id: (b == null ? void 0 : b.id) || a[0].id,
+                  ...j
+                }), i(I);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: V.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: Y.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  f,
+                  v,
                   {
                     name: "Plus",
                     width: 16,
@@ -590,99 +590,99 @@ const ii = (r) => {
     ] })
   ] });
 };
-function Ve(r) {
-  const { product: s, children: e } = r, { attributes: n, listeners: i, setNodeRef: d, transform: u, transition: o, isDragging: m } = bt({
+function Ge(o) {
+  const { product: s, children: e } = o, { attributes: n, listeners: i, setNodeRef: c, transform: u, transition: l, isDragging: m } = yt({
     id: s.id
-  }), g = {
-    transform: jt.Transform.toString(u),
-    transition: o
+  }), p = {
+    transform: Nt.Transform.toString(u),
+    transition: l
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: d,
-      style: g,
-      className: `${F.product} ${m ? F.dragging : ""}`,
+      ref: c,
+      style: p,
+      className: `${H.product} ${m ? H.dragging : ""}`,
       ...n,
       ...i,
       children: e
     }
   );
 }
-const oi = (r) => {
+const Di = (o) => {
   const {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
     setItems: i,
-    other: d,
+    other: c,
     title: u,
-    subtitle: o,
+    subtitle: l,
     editable: m = !0,
-    draggable: g = !1,
-    withImage: C = !1,
-    deletable: c = !0,
-    addable: l = !0,
-    itemsType: T,
-    itemsPlaceholder: $ = "",
-    itemsOptions: M,
-    hasRangeSelector: x = !1,
-    rangeSelectorOptions: N,
-    modalOptions: a,
-    addableOptions: j = {},
-    limit: R
-  } = r, [w, z] = _.useState(null), [S, v] = _.useState({
+    draggable: p = !1,
+    withImage: B = !1,
+    deletable: r = !0,
+    addable: a = !0,
+    itemsType: j,
+    itemsPlaceholder: d = "",
+    itemsOptions: S,
+    hasRangeSelector: g = !1,
+    rangeSelectorOptions: y,
+    modalOptions: q,
+    addableOptions: k = {},
+    limit: h
+  } = o, [$, R] = x.useState(null), [L, I] = x.useState({
     top: 0,
     left: 0
-  }), [I, q] = _.useState(null), B = _.useRef(null), [p, b] = _.useState(!1), A = ht(
-    pt(_t, {
+  }), [b, M] = x.useState(null), P = x.useRef(null), [f, N] = x.useState(!1), A = gt(
+    ft(xt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  _.useEffect(() => {
-    const h = () => {
-      z(null), b(!1);
+  x.useEffect(() => {
+    const _ = () => {
+      R(null), N(!1);
     };
-    return document.body.addEventListener("click", h), z(null), b(!1), () => {
-      z(null), b(!1), document.body.removeEventListener("click", h);
+    return document.body.addEventListener("click", _), R(null), N(!1), () => {
+      R(null), N(!1), document.body.removeEventListener("click", _);
     };
-  }, []), _.useEffect(() => {
-    if (w) {
-      const h = [...n].map((E) => E.id === w.id ? w : E);
-      i(h);
+  }, []), x.useEffect(() => {
+    if ($) {
+      const _ = [...n].map((E) => E.id === $.id ? $ : E);
+      i(_);
     }
-  }, [w]), _.useEffect(() => {
-    if (B.current && I) {
-      const h = B.current.getBoundingClientRect().height, E = window.innerHeight;
-      let P = I.top;
-      P + h > E + window.scrollY - 200 && (P = E + window.scrollY - h - 200), P < 0 && (P = 10), v({
-        top: P,
-        left: I.left
+  }, [$]), x.useEffect(() => {
+    if (P.current && b) {
+      const _ = P.current.getBoundingClientRect().height, E = window.innerHeight;
+      let T = b.top;
+      T + _ > E + window.scrollY - 200 && (T = E + window.scrollY - _ - 200), T < 0 && (T = 10), I({
+        top: T,
+        left: b.left
       });
     }
-  }, [B.current, I]);
-  const U = (h, E) => {
-    h.stopPropagation();
-    const P = h.target.getBoundingClientRect();
-    q({
-      top: P.top + window.scrollY,
-      left: P.left - 30
-    }), z(E), b(!0);
+  }, [P.current, b]);
+  const U = (_, E) => {
+    _.stopPropagation();
+    const T = _.target.getBoundingClientRect();
+    M({
+      top: T.top + window.scrollY,
+      left: T.left - 30
+    }), R(E), N(!0);
   };
-  function O(h) {
-    if (C)
-      return h ? /* @__PURE__ */ t.jsx(
+  function O(_) {
+    if (B)
+      return _ ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${h[0]}/w=1000`,
+          src: `https://imagedelivery.net/${_[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        f,
+        v,
         {
           name: "Image",
           width: 16,
@@ -691,20 +691,20 @@ const oi = (r) => {
         }
       );
   }
-  const L = (h) => {
-    const { active: E, over: P } = h;
-    if (P && E.id !== P.id) {
-      const D = n.findIndex((Y) => Y.id === E.id), et = n.findIndex((Y) => Y.id === P.id);
-      if (D !== -1 && et !== -1) {
-        const Y = [...n], [K] = Y.splice(D, 1);
-        Y.splice(et, 0, K), i(Y);
+  const z = (_) => {
+    const { active: E, over: T } = _;
+    if (T && E.id !== T.id) {
+      const D = n.findIndex((W) => W.id === E.id), nt = n.findIndex((W) => W.id === T.id);
+      if (D !== -1 && nt !== -1) {
+        const W = [...n], [K] = W.splice(D, 1);
+        W.splice(nt, 0, K), i(W);
       }
     }
-  }, Q = (h) => {
-    var P;
+  }, Z = (_) => {
+    var T;
     const E = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      g && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        f,
+      p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        v,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -712,140 +712,140 @@ const oi = (r) => {
           height: 20
         }
       ) }),
-      T === "select" && M && /* @__PURE__ */ t.jsx(
-        at,
+      j === "select" && S && /* @__PURE__ */ t.jsx(
+        lt,
         {
           onChange: (D) => {
-            const Y = [...n].map((K) => K.id === h.id ? {
-              ...h,
+            const W = [...n].map((K) => K.id === _.id ? {
+              ..._,
               name: {
                 "en-US": D
               }
             } : K);
-            z({
-              ...h,
+            R({
+              ..._,
               name: {
                 "en-US": D
               }
-            }), i([...Y]);
+            }), i([...W]);
           },
-          value: h.name["en-US"],
-          options: M.filter(
-            (D) => !n.find((et) => et.name["en-US"] === D)
+          value: _.name["en-US"],
+          options: S.filter(
+            (D) => !n.find((nt) => nt.name["en-US"] === D)
           ),
-          leftAddon: O(h.images)
+          leftAddon: O(_.images)
         }
       ),
-      T === "input" && /* @__PURE__ */ t.jsx(
-        ut,
+      j === "input" && /* @__PURE__ */ t.jsx(
+        pt,
         {
           onChange: (D) => {
-            const Y = [...n].map((K) => K.id === h.id ? {
-              ...h,
+            const W = [...n].map((K) => K.id === _.id ? {
+              ..._,
               name: {
                 "en-US": D
               }
             } : K);
-            i([...Y]);
+            i([...W]);
           },
-          value: h.name["en-US"],
-          placeholder: $
+          value: _.name["en-US"],
+          placeholder: d
         }
       ),
-      T === "image" && /* @__PURE__ */ t.jsx(
-        $t,
+      j === "image" && /* @__PURE__ */ t.jsx(
+        Tt,
         {
           onChange: (D) => {
-            const Y = [...n].map((K) => K.id === h.id ? {
-              ...h,
+            const W = [...n].map((K) => K.id === _.id ? {
+              ..._,
               images: D
             } : K);
-            i([...Y]);
+            i([...W]);
           },
-          activeImage: (P = n.find((D) => D.id === h.id)) == null ? void 0 : P.images[0]
+          activeImage: (T = n.find((D) => D.id === _.id)) == null ? void 0 : T.images[0]
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: F.buttons, children: [
-        m && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
-          f,
+      /* @__PURE__ */ t.jsxs("div", { className: H.buttons, children: [
+        m && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
+          v,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (D) => U(D, h)
+            onClick: (D) => U(D, _)
           }
         ) }),
-        c && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
-          f,
+        r && /* @__PURE__ */ t.jsx("div", { className: H.deleteButton, children: /* @__PURE__ */ t.jsx(
+          v,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(n.filter((D) => D.id !== h.id))
+            onClick: () => i(n.filter((D) => D.id !== _.id))
           }
         ) })
       ] })
     ] });
-    return g ? /* @__PURE__ */ t.jsx(
-      Ve,
+    return p ? /* @__PURE__ */ t.jsx(
+      Ge,
       {
-        product: h,
+        product: _,
         children: E
       },
-      h.id
+      _.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: F.product,
+        className: H.product,
         children: E
       },
-      h.id
+      _.id
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: F.productsBlock, children: [
-    (u || s !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: F.top, children: [
-      u && /* @__PURE__ */ t.jsx("h3", { className: F.title, children: u }),
+  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 }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        it,
+        ot,
         {
           current: s,
-          onChange: (h) => e == null ? void 0 : e(h)
+          onChange: (_) => e == null ? void 0 : e(_)
         }
       )
     ] }),
-    w && m && a && p && /* @__PURE__ */ t.jsx(
-      wt,
+    $ && m && q && f && /* @__PURE__ */ t.jsx(
+      Pt,
       {
-        ref: B,
-        activeItem: w,
-        setActiveItem: z,
-        popupPosition: S,
-        modalOptions: a,
-        setIsOpenModal: b
+        ref: P,
+        activeItem: $,
+        setActiveItem: R,
+        popupPosition: L,
+        modalOptions: q,
+        setIsOpenModal: N
       }
     ),
-    x && N && /* @__PURE__ */ t.jsx(kt, { ...N }),
-    /* @__PURE__ */ t.jsxs("div", { className: F.products, children: [
-      o && /* @__PURE__ */ t.jsx("h5", { className: F.subtitle, children: o }),
-      g ? /* @__PURE__ */ t.jsx(
-        gt,
+    g && y && /* @__PURE__ */ t.jsx(St, { ...y }),
+    /* @__PURE__ */ t.jsxs("div", { className: H.products, children: [
+      l && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: l }),
+      p ? /* @__PURE__ */ t.jsx(
+        vt,
         {
           sensors: A,
-          onDragEnd: L,
+          onDragEnd: z,
           children: /* @__PURE__ */ t.jsx(
-            ft,
+            jt,
             {
-              items: n.map((h) => h.id),
-              strategy: xt,
-              children: n.map((h) => Q(h))
+              items: n.map((_) => _.id),
+              strategy: bt,
+              children: n.map((_) => Z(_))
             }
           )
         }
-      ) : n.map((h) => Q(h)),
-      l && /* @__PURE__ */ t.jsx(
+      ) : n.map((_) => Z(_)),
+      a && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -854,55 +854,55 @@ const oi = (r) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            ct,
             {
               withoutHover: !0,
-              className: W(F.button, {
-                [F.disabled]: !!(R && R <= n.length)
+              className: V(H.button, {
+                [H.disabled]: !!(h && h <= n.length)
               }),
               size: "s",
-              disabled: !!(R && R <= n.length),
+              disabled: !!(h && h <= n.length),
               onClick: () => {
-                const h = [...n];
+                const _ = [...n];
                 let E = null;
-                if (M) {
-                  for (let P = 0; P < M.length; P++)
-                    if (!n.find((D) => D.name["en-US"] === M[P])) {
-                      E = M[P];
+                if (S) {
+                  for (let T = 0; T < S.length; T++)
+                    if (!n.find((D) => D.name["en-US"] === S[T])) {
+                      E = S[T];
                       break;
                     }
                 }
-                T === "select" && M ? h.push({
+                j === "select" && S ? _.push({
                   name: {
-                    "en-US": E || M[0]
+                    "en-US": E || S[0]
                   },
-                  id: st(),
-                  ...j,
+                  id: at(),
+                  ...k,
                   maxSymbols: 100
                   // пример значения
-                }) : T === "input" ? h.push({
+                }) : j === "input" ? _.push({
                   name: {
                     "en-US": ""
                   },
-                  id: st(),
-                  ...j,
+                  id: at(),
+                  ...k,
                   maxSymbols: 100
-                }) : h.push({
+                }) : _.push({
                   name: {
                     "en-US": `Image ${n.length + 1}`
                   },
-                  id: st(),
-                  ...j,
+                  id: at(),
+                  ...k,
                   maxSymbols: 100
-                }), i(h);
+                }), i(_);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: F.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: H.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  f,
+                  v,
                   {
                     name: "Plus",
                     width: 16,
@@ -915,120 +915,120 @@ const oi = (r) => {
         }
       )
     ] }),
-    d !== void 0 && /* @__PURE__ */ t.jsx(mt, { items: d })
+    c !== void 0 && /* @__PURE__ */ t.jsx(_t, { items: c })
   ] });
-}, Ye = "_subtitle_jql1y_1", Ge = "_header_jql1y_8", We = "_text_jql1y_9", Je = "_productsBlock_jql1y_10", Xe = "_buttonsBlock_jql1y_11", Ke = "_top_jql1y_23", Qe = "_itemsBlock_jql1y_32", Ze = "_typeTexts_jql1y_38", tn = "_block_jql1y_45", en = "_active_jql1y_58", nn = "_products_jql1y_10", sn = "_product_jql1y_10", on = "_button_jql1y_11", an = "_image_jql1y_88", cn = "_info_jql1y_95", ln = "_name_jql1y_107", rn = "_buttons_jql1y_11", dn = "_modal_jql1y_118", un = "_other_jql1y_138", mn = "_options_jql1y_144", hn = "_addButton_jql1y_150", pn = "_deleteButton_jql1y_165", Z = {
-  subtitle: Ye,
-  header: Ge,
-  text: We,
-  productsBlock: Je,
-  buttonsBlock: Xe,
-  top: Ke,
-  itemsBlock: Qe,
-  typeTexts: Ze,
-  block: tn,
-  active: en,
-  products: nn,
-  product: sn,
-  button: on,
-  image: an,
-  info: cn,
-  name: ln,
-  buttons: rn,
-  modal: dn,
-  other: un,
-  options: mn,
-  addButton: hn,
-  deleteButton: pn
-}, _n = (r) => {
-  const { buttons: s, setButtons: e, deletable: n = !0, addable: i = !0, editableLink: d = !0 } = r, { pages: u } = Bt(), [o, m] = _.useState(null), [g, C] = _.useState({
+}, Qe = "_subtitle_jql1y_1", Xe = "_header_jql1y_8", Je = "_text_jql1y_9", Ke = "_productsBlock_jql1y_10", Ze = "_buttonsBlock_jql1y_11", tn = "_top_jql1y_23", en = "_itemsBlock_jql1y_32", nn = "_typeTexts_jql1y_38", sn = "_block_jql1y_45", an = "_active_jql1y_58", on = "_products_jql1y_10", cn = "_product_jql1y_10", ln = "_button_jql1y_11", rn = "_image_jql1y_88", dn = "_info_jql1y_95", un = "_name_jql1y_107", mn = "_buttons_jql1y_11", hn = "_modal_jql1y_118", pn = "_other_jql1y_138", _n = "_options_jql1y_144", gn = "_addButton_jql1y_150", fn = "_deleteButton_jql1y_165", tt = {
+  subtitle: Qe,
+  header: Xe,
+  text: Je,
+  productsBlock: Ke,
+  buttonsBlock: Ze,
+  top: tn,
+  itemsBlock: en,
+  typeTexts: nn,
+  block: sn,
+  active: an,
+  products: on,
+  product: cn,
+  button: ln,
+  image: rn,
+  info: dn,
+  name: un,
+  buttons: mn,
+  modal: hn,
+  other: pn,
+  options: _n,
+  addButton: gn,
+  deleteButton: fn
+}, xn = (o) => {
+  const { buttons: s, setButtons: e, deletable: n = !0, addable: i = !0, editableLink: c = !0 } = o, { pages: u } = rt(), [l, m] = x.useState(null), [p, B] = x.useState({
     top: 0,
     left: 0
-  }), [c, l] = _.useState(null), T = _.useRef(null);
-  _.useEffect(() => {
-    if (o) {
-      const x = [...s].map((N) => N.id === o.id ? o : N);
-      e(x);
+  }), [r, a] = x.useState(null), j = x.useRef(null);
+  x.useEffect(() => {
+    if (l) {
+      const g = [...s].map((y) => y.id === l.id ? l : y);
+      e(g);
     }
-  }, [o]), _.useEffect(() => {
-    if (T.current && c) {
-      const x = T.current.getBoundingClientRect().height, N = window.innerHeight;
-      let a = c.top;
-      a + x > N + window.scrollY - 200 && (a = N + window.scrollY - x - 200), a < 0 && (a = 10), C({
-        top: a,
-        left: c.left
+  }, [l]), x.useEffect(() => {
+    if (j.current && r) {
+      const g = j.current.getBoundingClientRect().height, y = window.innerHeight;
+      let q = r.top;
+      q + g > y + window.scrollY - 200 && (q = y + window.scrollY - g - 200), q < 0 && (q = 10), B({
+        top: q,
+        left: r.left
       });
     }
-  }, [T.current, c]);
-  const $ = (x, N) => {
-    x.stopPropagation();
-    const a = x.target.getBoundingClientRect();
-    l({
-      top: a.top + window.scrollY - 70,
-      left: a.left - (i ? 30 : 65)
-    }), m(N);
-  }, M = (x, N) => {
-    const a = [...s], j = {
-      ...x,
+  }, [j.current, r]);
+  const d = (g, y) => {
+    g.stopPropagation();
+    const q = g.target.getBoundingClientRect();
+    a({
+      top: q.top + window.scrollY - 70,
+      left: q.left - (i ? 30 : 65)
+    }), m(y);
+  }, S = (g, y) => {
+    const q = [...s], k = {
+      ...g,
       id: Math.random().toString(36).substr(2, 9)
       // Генерируем новый уникальный ID
     };
-    a.splice(N + 1, 0, j), e(a);
+    q.splice(y + 1, 0, k), e(q);
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: Z.products, children: [
-    /* @__PURE__ */ t.jsx("h5", { className: Z.subtitle, children: "Button Type" }),
-    s.map((x, N) => /* @__PURE__ */ t.jsxs(
+  return /* @__PURE__ */ t.jsxs("div", { className: tt.products, children: [
+    /* @__PURE__ */ t.jsx("h5", { className: tt.subtitle, children: "Button Type" }),
+    s.map((g, y) => /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: Z.product,
+        className: tt.product,
         children: [
           /* @__PURE__ */ t.jsx(
-            at,
+            lt,
             {
-              onChange: (a) => {
-                const R = [...s].map((w) => w.id === x.id ? {
-                  ...x,
-                  type: a
-                } : w);
-                e(R);
+              onChange: (q) => {
+                const h = [...s].map(($) => $.id === g.id ? {
+                  ...g,
+                  type: q
+                } : $);
+                e(h);
               },
-              value: x.type,
+              value: g.type,
               options: ["Primary", "Secondary", "Tertiary"]
             }
           ),
-          /* @__PURE__ */ t.jsxs("div", { className: Z.buttons, children: [
-            /* @__PURE__ */ t.jsx("div", { className: Z.deleteButton, children: /* @__PURE__ */ t.jsx(
-              f,
+          /* @__PURE__ */ t.jsxs("div", { className: tt.buttons, children: [
+            /* @__PURE__ */ t.jsx("div", { className: tt.deleteButton, children: /* @__PURE__ */ t.jsx(
+              v,
               {
                 name: "Copy",
                 hoverable: !0,
                 width: 20,
                 height: 20,
                 onClick: () => {
-                  M(x, N);
+                  S(g, y);
                 }
               }
             ) }),
-            /* @__PURE__ */ t.jsx("div", { className: Z.deleteButton, children: /* @__PURE__ */ t.jsx(
-              f,
+            /* @__PURE__ */ t.jsx("div", { className: tt.deleteButton, children: /* @__PURE__ */ t.jsx(
+              v,
               {
                 name: "Sliders",
                 hoverable: !0,
                 width: 20,
                 height: 20,
-                onClick: (a) => {
-                  $(a, x);
+                onClick: (q) => {
+                  d(q, g);
                 }
               }
             ) }),
-            n && /* @__PURE__ */ t.jsx("div", { className: Z.deleteButton, children: /* @__PURE__ */ t.jsx(
-              f,
+            n && /* @__PURE__ */ t.jsx("div", { className: tt.deleteButton, children: /* @__PURE__ */ t.jsx(
+              v,
               {
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const a = s.filter((j) => j.id !== x.id);
-                  e(a);
+                  const q = s.filter((k) => k.id !== g.id);
+                  e(q);
                 },
                 width: 20,
                 height: 20,
@@ -1038,16 +1038,16 @@ const oi = (r) => {
           ] })
         ]
       },
-      x.id
+      g.id
     )),
-    o && /* @__PURE__ */ t.jsx(
-      Pt,
+    l && /* @__PURE__ */ t.jsx(
+      Mt,
       {
-        ref: T,
-        activeButton: o,
+        ref: j,
+        activeButton: l,
         setActiveButton: m,
-        popupPosition: g,
-        editableLink: d
+        popupPosition: p,
+        editableLink: c
       }
     ),
     i && /* @__PURE__ */ t.jsx(
@@ -1059,16 +1059,16 @@ const oi = (r) => {
           justifyContent: "center"
         },
         children: /* @__PURE__ */ t.jsx(
-          ot,
+          ct,
           {
             withoutHover: !0,
-            className: Z.button,
+            className: tt.button,
             size: "s",
             onClick: () => {
-              const x = [...s];
-              d ? x.push({
+              const g = [...s];
+              c ? g.push({
                 type: "Primary",
-                id: st(),
+                id: at(),
                 typesText: [],
                 text: {
                   "en-US": "Button Name"
@@ -1076,9 +1076,9 @@ const oi = (r) => {
                 destination: "Go to Page",
                 page: u ? Object.values(u)[0].path : "/",
                 openInNewTab: !1
-              }) : x.push({
+              }) : g.push({
                 type: "Primary",
-                id: st(),
+                id: at(),
                 typesText: [],
                 text: {
                   "en-US": "Create Ticket"
@@ -1086,15 +1086,15 @@ const oi = (r) => {
                 destination: "Go to Page",
                 page: u ? Object.values(u)[0].path : "/",
                 openInNewTab: !1
-              }), e(x);
+              }), e(g);
             },
             style: {
               width: "fit-content"
             },
-            children: /* @__PURE__ */ t.jsxs("div", { className: Z.addButton, children: [
+            children: /* @__PURE__ */ t.jsxs("div", { className: tt.addButton, children: [
               /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
               /* @__PURE__ */ t.jsx(
-                f,
+                v,
                 {
                   name: "Plus",
                   width: 16,
@@ -1107,21 +1107,21 @@ const oi = (r) => {
       }
     )
   ] });
-}, ai = (r) => {
+}, Ri = (o) => {
   const {
     isActiveButtons: s,
     setIsActiveButtons: e,
     buttons: n,
     setButtons: i,
-    editableLink: d = !0,
+    editableLink: c = !0,
     addable: u = !0,
-    deletable: o = !0
-  } = r;
-  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: rt.buttonsBlock, children: [
-    /* @__PURE__ */ t.jsxs("div", { className: rt.top, children: [
-      /* @__PURE__ */ t.jsx("h3", { className: rt.title, children: "Buttons" }),
+    deletable: l = !0
+  } = o;
+  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: mt.buttonsBlock, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: mt.top, children: [
+      /* @__PURE__ */ t.jsx("h3", { className: mt.title, children: "Buttons" }),
       /* @__PURE__ */ t.jsx(
-        it,
+        ot,
         {
           current: s,
           onChange: (m) => e(m)
@@ -1129,29 +1129,29 @@ const oi = (r) => {
       )
     ] }),
     s && /* @__PURE__ */ t.jsx(
-      _n,
+      xn,
       {
         buttons: n,
         setButtons: i,
-        editableLink: d,
+        editableLink: c,
         addable: u,
-        deletable: o
+        deletable: l
       }
     )
   ] }) });
 };
-function gn(r) {
-  const { product: s, children: e } = r, { attributes: n, listeners: i, setNodeRef: d, transform: u, transition: o, isDragging: m } = bt({
+function vn(o) {
+  const { product: s, children: e } = o, { attributes: n, listeners: i, setNodeRef: c, transform: u, transition: l, isDragging: m } = yt({
     id: String(s.listingId)
-  }), g = {
-    transform: jt.Transform.toString(u),
-    transition: o
+  }), p = {
+    transform: Nt.Transform.toString(u),
+    transition: l
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: d,
-      style: g,
+      ref: c,
+      style: p,
       className: `${G.product} ${m ? G.dragging : ""}`,
       ...n,
       ...i,
@@ -1159,69 +1159,69 @@ function gn(r) {
     }
   );
 }
-const ci = (r) => {
+const Li = (o) => {
   const {
     isActiveItems: s,
     setIsActiveItems: e,
     items: n,
     setItems: i,
-    other: d,
+    other: c,
     title: u,
-    subtitle: o,
+    subtitle: l,
     editable: m = !0,
-    draggable: g = !1,
-    withImage: C = !1,
-    deletable: c = !0,
-    addable: l = !0,
-    itemsType: T,
-    itemsOptions: $,
-    limit: M
-  } = r, [x, N] = _.useState(
+    draggable: p = !1,
+    withImage: B = !1,
+    deletable: r = !0,
+    addable: a = !0,
+    itemsType: j,
+    itemsOptions: d,
+    limit: S
+  } = o, [g, y] = x.useState(
     null
-  ), [a, j] = _.useState({
+  ), [q, k] = x.useState({
     top: 0,
     left: 0
-  }), [R, w] = _.useState(!1), z = ht(
-    pt(_t, {
+  }), [h, $] = x.useState(!1), R = gt(
+    ft(xt, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  _.useEffect(() => {
-    const p = () => {
-      N(null), w(!1);
+  x.useEffect(() => {
+    const f = () => {
+      y(null), $(!1);
     };
-    return document.body.addEventListener("click", p), N(null), w(!1), () => {
-      N(null), w(!1), document.body.removeEventListener("click", p);
+    return document.body.addEventListener("click", f), y(null), $(!1), () => {
+      y(null), $(!1), document.body.removeEventListener("click", f);
     };
-  }, []), _.useEffect(() => {
-    if (x) {
-      const p = [...n].map((b) => b.listingId === x.listingId ? x : b);
-      i(p);
+  }, []), x.useEffect(() => {
+    if (g) {
+      const f = [...n].map((N) => N.listingId === g.listingId ? g : N);
+      i(f);
     }
-  }, [x]);
-  const S = (p, b) => {
-    p.stopPropagation();
-    const A = p.target.getBoundingClientRect(), U = 100, O = window.innerHeight;
-    let L = A.top + window.scrollY;
-    L + U > O && (L = O - U - 20), w(!0), j({
-      top: L - 80,
+  }, [g]);
+  const L = (f, N) => {
+    f.stopPropagation();
+    const A = f.target.getBoundingClientRect(), U = 100, O = window.innerHeight;
+    let z = A.top + window.scrollY;
+    z + U > O && (z = O - U - 20), $(!0), k({
+      top: z - 80,
       left: A.left - 30
-    }), N(b);
+    }), y(N);
   };
-  function v(p) {
-    if (C)
-      return p ? /* @__PURE__ */ t.jsx(
+  function I(f) {
+    if (B)
+      return f ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${p}/w=1000`,
+          src: `https://imagedelivery.net/${f}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
         }
       ) : /* @__PURE__ */ t.jsx(
-        f,
+        v,
         {
           name: "Image",
           width: 16,
@@ -1230,21 +1230,21 @@ const ci = (r) => {
         }
       );
   }
-  const I = (p) => {
-    const { active: b, over: A } = p;
-    if (A && b.id !== A.id) {
-      const U = n.findIndex((L) => String(L.listingId) === b.id), O = n.findIndex((L) => String(L.listingId) === A.id);
+  const b = (f) => {
+    const { active: N, over: A } = f;
+    if (A && N.id !== A.id) {
+      const U = n.findIndex((z) => String(z.listingId) === N.id), O = n.findIndex((z) => String(z.listingId) === A.id);
       if (U !== -1 && O !== -1) {
-        const L = [...n], [Q] = L.splice(U, 1);
-        L.splice(O, 0, Q), i(L);
+        const z = [...n], [Z] = z.splice(U, 1);
+        z.splice(O, 0, Z), i(z);
       }
     }
-  }, q = (p, b) => {
-    const A = $.find((O) => p.listingId === O.id);
+  }, M = (f, N) => {
+    const A = d.find((O) => f.listingId === O.id);
     if (!A) return null;
     const U = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      g && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        f,
+      p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+        v,
         {
           name: "DotsSixVertical",
           hoverable: !0,
@@ -1252,108 +1252,108 @@ const ci = (r) => {
           height: 20
         }
       ) }),
-      T === "select" && /* @__PURE__ */ t.jsx(
-        at,
+      j === "select" && /* @__PURE__ */ t.jsx(
+        lt,
         {
           onChange: (O) => {
-            const L = [...n], Q = $.find((P) => P.productData.name === O);
-            if (!Q) return;
-            const h = {
-              listingId: Q.id,
-              image: Q.productData.images.length > 0 ? Q.productData.images[0].cfId : ""
-            }, E = L.map((P) => P.listingId === p.listingId ? h : P);
-            N(h), i([...E]);
+            const z = [...n], Z = d.find((T) => T.productData.name === O);
+            if (!Z) return;
+            const _ = {
+              listingId: Z.id,
+              image: Z.productData.images.length > 0 ? Z.productData.images[0].cfId : ""
+            }, E = z.map((T) => T.listingId === f.listingId ? _ : T);
+            y(_), i([...E]);
           },
           value: A.productData.name,
           options: [
-            ...$.filter((O) => !n.find((L) => L.listingId === O.id)).map((O) => O.productData.name)
+            ...d.filter((O) => !n.find((z) => z.listingId === O.id)).map((O) => O.productData.name)
           ],
-          leftAddon: v(
-            p.image || A.productData.images.length > 0 && A.productData.images[0].cfId || ""
+          leftAddon: I(
+            f.image || A.productData.images.length > 0 && A.productData.images[0].cfId || ""
           )
         },
-        b
+        N
       ),
       /* @__PURE__ */ t.jsxs("div", { className: G.buttons, children: [
         m && /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
-          f,
+          v,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (O) => S(O, p)
+            onClick: (O) => L(O, f)
           }
         ) }),
-        c && /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
-          f,
+        r && /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
+          v,
           {
             name: "Trash",
             hoverable: !0,
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(n.filter((O) => O !== p))
+            onClick: () => i(n.filter((O) => O !== f))
           }
         ) })
       ] })
     ] });
-    return g ? /* @__PURE__ */ t.jsx(
-      gn,
+    return p ? /* @__PURE__ */ t.jsx(
+      vn,
       {
-        product: p,
+        product: f,
         children: U
       },
-      p.listingId
+      f.listingId
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: G.product,
         children: U
       },
-      p.listingId
+      f.listingId
     );
-  }, B = _.useRef(null);
+  }, 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 }),
       s !== void 0 && /* @__PURE__ */ t.jsx(
-        it,
+        ot,
         {
           current: s,
-          onChange: (p) => e == null ? void 0 : e(p)
+          onChange: (f) => e == null ? void 0 : e(f)
         }
       )
     ] }),
-    R && x && /* @__PURE__ */ t.jsx(
-      Mt,
+    h && g && /* @__PURE__ */ t.jsx(
+      At,
       {
-        ref: B,
-        activeItem: x,
-        setActiveItem: N,
-        setIsOpenModal: w,
-        popupPosition: a,
-        itemsOptions: $
+        ref: P,
+        activeItem: g,
+        setActiveItem: y,
+        setIsOpenModal: $,
+        popupPosition: q,
+        itemsOptions: d
       }
     ),
     s && /* @__PURE__ */ t.jsxs("div", { className: G.products, children: [
-      o && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: o }),
-      g ? /* @__PURE__ */ t.jsx(
-        gt,
+      l && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: l }),
+      p ? /* @__PURE__ */ t.jsx(
+        vt,
         {
-          sensors: z,
-          onDragEnd: I,
+          sensors: R,
+          onDragEnd: b,
           children: /* @__PURE__ */ t.jsx(
-            ft,
+            jt,
             {
-              items: n.map((p) => String(p.listingId)),
-              strategy: xt,
-              children: n.map((p, b) => q(p, b))
+              items: n.map((f) => String(f.listingId)),
+              strategy: bt,
+              children: n.map((f, N) => M(f, N))
             }
           )
         }
-      ) : n.map((p, b) => q(p, b)),
-      l && /* @__PURE__ */ t.jsx(
+      ) : n.map((f, N) => M(f, N)),
+      a && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -1362,31 +1362,31 @@ const ci = (r) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            ct,
             {
               withoutHover: !0,
               className: G.button,
               size: "s",
               onClick: () => {
-                const p = [...n];
-                for (let b = 0; b < $.length; b++)
-                  if (!n.find((A) => A.listingId === $[b].id)) {
-                    p.push({
-                      listingId: $[b].id,
-                      image: $[b].productData.images.length > 0 ? $[b].productData.images[0].cfId : ""
+                const f = [...n];
+                for (let N = 0; N < d.length; N++)
+                  if (!n.find((A) => A.listingId === d[N].id)) {
+                    f.push({
+                      listingId: d[N].id,
+                      image: d[N].productData.images.length > 0 ? d[N].productData.images[0].cfId : ""
                     });
                     break;
                   }
-                i(p);
+                i(f);
               },
-              disabled: n.length === (M || $.length),
+              disabled: n.length === (S || d.length),
               style: {
                 width: "fit-content"
               },
               children: /* @__PURE__ */ t.jsxs("div", { className: G.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
-                  f,
+                  v,
                   {
                     name: "Plus",
                     width: 16,
@@ -1399,151 +1399,154 @@ const ci = (r) => {
         }
       )
     ] }),
-    s && d !== void 0 && /* @__PURE__ */ t.jsx(mt, { items: d })
+    s && c !== void 0 && /* @__PURE__ */ t.jsx(_t, { items: c })
   ] });
-}, fn = "_options_6cemk_1", xn = "_price_6cemk_12", bn = "_oldPrice_6cemk_19", jn = "_newPrice_6cemk_27", vn = "_animate_6cemk_34", yn = "_appearAndBounce_6cemk_1", kn = "_meta_6cemk_52", Nn = "_info_6cemk_58", In = "_infoRight_6cemk_66", Sn = "_buttons_6cemk_73", Cn = "_variants_6cemk_80", wn = "_variant_6cemk_80", $n = "_stock_6cemk_98", Bn = "_variantInfo_6cemk_105", Pn = "_quantity_6cemk_111", Mn = "_count_6cemk_118", Tn = "_focused_6cemk_135", qn = "_button_6cemk_73", An = "_activeVariant_6cemk_161", On = "_chargeTypes_6cemk_165", En = "_charge_6cemk_165", Dn = "_chargeActive_6cemk_190", Rn = "_title_6cemk_198", k = {
-  options: fn,
-  price: xn,
-  oldPrice: bn,
-  newPrice: jn,
-  animate: vn,
-  appearAndBounce: yn,
-  meta: kn,
-  info: Nn,
-  infoRight: In,
-  buttons: Sn,
-  variants: Cn,
-  variant: wn,
-  stock: $n,
-  variantInfo: Bn,
-  quantity: Pn,
-  count: Mn,
-  focused: Tn,
-  button: qn,
-  activeVariant: An,
-  chargeTypes: On,
-  charge: En,
-  chargeActive: Dn,
-  title: Rn
+}, jn = "_options_1vlf9_1", bn = "_price_1vlf9_13", yn = "_oldPrice_1vlf9_20", Nn = "_newPrice_1vlf9_28", In = "_animate_1vlf9_35", kn = "_appearAndBounce_1vlf9_1", Cn = "_meta_1vlf9_53", Sn = "_info_1vlf9_59", wn = "_infoRight_1vlf9_67", $n = "_buttons_1vlf9_74", qn = "_variants_1vlf9_81", Bn = "_variant_1vlf9_81", Pn = "_stock_1vlf9_99", Tn = "_variantInfo_1vlf9_106", Mn = "_quantity_1vlf9_112", An = "_count_1vlf9_119", On = "_focused_1vlf9_136", En = "_button_1vlf9_74", Dn = "_activeVariant_1vlf9_162", Rn = "_chargeTypes_1vlf9_166", Ln = "_charge_1vlf9_166", zn = "_chargeActive_1vlf9_191", Fn = "_title_1vlf9_199", w = {
+  options: jn,
+  price: bn,
+  oldPrice: yn,
+  newPrice: Nn,
+  animate: In,
+  appearAndBounce: kn,
+  meta: Cn,
+  info: Sn,
+  infoRight: wn,
+  buttons: $n,
+  variants: qn,
+  variant: Bn,
+  stock: Pn,
+  variantInfo: Tn,
+  quantity: Mn,
+  count: An,
+  focused: On,
+  button: En,
+  activeVariant: Dn,
+  chargeTypes: Rn,
+  charge: Ln,
+  chargeActive: zn,
+  title: Fn
 };
-var St = /* @__PURE__ */ ((r) => (r.ONE_TIME = "One-Time", r.RECURRING = "Subscribe & Save", r))(St || {});
-const li = (r) => {
-  var x, N;
-  const { variants: s } = r, [e, n] = _.useState(s[0]), [i, d] = _.useState(e.chargeTypes[0]), u = lt(), [o, m] = _.useState(1), { reset: g, addProductToCart: C } = vt(), [c, l] = _.useState(!1);
-  _.useEffect(() => {
-    l(!0);
-    const a = setTimeout(() => l(!1), 600);
-    return () => clearTimeout(a);
-  }, [o]);
-  async function T() {
-    await C({
-      productId: r.id,
+var Ct = /* @__PURE__ */ ((o) => (o.ONE_TIME = "One-Time", o.RECURRING = "Subscribe & Save", o))(Ct || {});
+const Vn = (o) => {
+  var q, k;
+  const { variants: s } = o, [e, n] = x.useState(s[0]), [i, c] = x.useState(
+    e.chargeTypes ? e.chargeTypes[0] : "ONE_TIME"
+  ), u = ut(), [l, m] = x.useState(1), { products: p, cart: B, reset: r, addProductToCart: a } = dt(), [j, d] = x.useState(!1);
+  console.log(B), x.useEffect(() => {
+    d(!0);
+    const h = setTimeout(() => d(!1), 600);
+    return () => clearTimeout(h);
+  }, [l]);
+  async function S() {
+    console.log("Products P", p), await a({
+      productId: o.id,
       productVariantId: e.id,
-      quantity: o
+      quantity: l
     });
   }
-  function $() {
-    g(), T(), u("/checkout");
+  function g() {
+    r(), S(), u("/checkout");
   }
-  function M(a) {
-    if (a >= 864e5) {
-      const S = Math.floor(a / 864e5);
-      return `${S} ${S === 1 ? "day" : "days"}`;
-    } else if (a >= 36e5) {
-      const S = Math.floor(a / 36e5);
-      return `${S} ${S === 1 ? "hour" : "hours"}`;
-    } else if (a >= 6e4) {
-      const S = Math.floor(a / 6e4);
-      return `${S} ${S === 1 ? "minute" : "minutes"}`;
+  function y(h) {
+    if (h >= 864e5) {
+      const b = Math.floor(h / 864e5);
+      return `${b} ${b === 1 ? "day" : "days"}`;
+    } else if (h >= 36e5) {
+      const b = Math.floor(h / 36e5);
+      return `${b} ${b === 1 ? "hour" : "hours"}`;
+    } else if (h >= 6e4) {
+      const b = Math.floor(h / 6e4);
+      return `${b} ${b === 1 ? "minute" : "minutes"}`;
     } else {
-      const S = Math.floor(a / 1e3);
-      return `${S} ${S === 1 ? "second" : "seconds"}`;
+      const b = Math.floor(h / 1e3);
+      return `${b} ${b === 1 ? "second" : "seconds"}`;
     }
   }
-  return _.useEffect(() => {
-    (e.quantity.available === 0 || !e.quantity.available) && m(0);
-  }, [e.quantity.available]), /* @__PURE__ */ t.jsxs("div", { className: k.options, children: [
-    e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: k.chargeTypes, children: e.chargeTypes.map((a) => /* @__PURE__ */ t.jsx(
+  return x.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((h) => /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: W(k.charge, {
-          [k.chargeActive]: i === a
+        className: V(w.charge, {
+          [w.chargeActive]: i === h
         }),
-        onClick: () => d(a),
-        children: St[a]
+        onClick: () => c(h),
+        children: Ct[h]
       },
-      a
+      h
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: k.variants, children: s.map((a) => {
-      var j;
+    /* @__PURE__ */ t.jsx("div", { className: w.variants, children: s.map((h) => {
+      var $, R;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
-          className: W(k.variant, {
-            [k.activeVariant]: e.id === a.id
+          className: V(w.variant, {
+            [w.activeVariant]: e.id === h.id
           }),
-          onClick: () => n(a),
+          onClick: () => n(h),
           children: [
-            /* @__PURE__ */ t.jsxs("div", { className: k.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: k.title, children: a.name }),
+            /* @__PURE__ */ t.jsxs("div", { className: w.variantInfo, children: [
+              /* @__PURE__ */ t.jsx("span", { className: w.title, children: It(h.name) }),
               /* @__PURE__ */ t.jsxs("span", { children: [
                 "$",
-                i === "ONE_TIME" ? a.price.amount : a.subscriptionSettings ? a.subscriptionSettings.price.amount : "Price Not Found"
+                i === "ONE_TIME" ? h.price.amount : h.subscriptionSettings ? h.subscriptionSettings.price.amount : "Price Not Found"
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: k.stock, children: [
-              ((j = a.quantity.restrictions) == null ? void 0 : j.max) || a.quantity.available || 0,
-              " in stock"
+            /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: w.stock, children: [
+              ($ = h.quantity.restrictions) != null && $.max || h.quantity.available !== void 0 ? ((R = h.quantity.restrictions) == null ? void 0 : R.max) || h.quantity.available : "∞",
+              " ",
+              "in stock"
             ] }) })
           ]
         },
-        a.id
+        h.id
       );
     }) }),
-    i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: k.quantity, children: [
+    i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: w.quantity, children: [
       /* @__PURE__ */ t.jsx(
-        H,
+        F,
         {
           type: "Secondary",
           onClick: () => {
-            o > 1 ? m((a) => a - 1) : m(1);
+            l > 1 ? m((h) => h - 1) : m(1);
           },
-          className: k.button,
-          disabled: e.quantity.available === 0 || e.quantity.restrictions && o <= e.quantity.restrictions.min || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
-          children: /* @__PURE__ */ t.jsx(f, { name: "Minus" })
+          className: w.button,
+          disabled: e.quantity.available && e.quantity.restrictions && l <= e.quantity.restrictions.min || e.quantity.available === 0,
+          children: /* @__PURE__ */ t.jsx(v, { name: "Minus" })
         }
       ),
       /* @__PURE__ */ t.jsx(
-        Tt,
+        Ot,
         {
           type: "number",
-          value: String(o),
-          onChange: (a) => m(Number(a)),
-          max: ((x = e.quantity.restrictions) == null ? void 0 : x.max) || e.quantity.available || 1 / 0,
-          min: ((N = e.quantity.restrictions) == null ? void 0 : N.min) || 0,
+          value: String(l),
+          onChange: (h) => m(Number(h)),
+          max: ((q = e.quantity.restrictions) == null ? void 0 : q.max) || e.quantity.available || Number.POSITIVE_INFINITY,
+          min: ((k = e.quantity.restrictions) == null ? void 0 : k.min) || 0,
           centered: !0,
-          disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available
+          disabled: e.quantity && e.quantity.available === 0 || Object.keys(e.quantity.restrictions || {}).length !== 0 && l >= e.quantity.restrictions.max
         }
       ),
       /* @__PURE__ */ t.jsx(
-        H,
+        F,
         {
           type: "Secondary",
           onClick: () => {
-            m((a) => a + 1);
+            m((h) => h + 1);
           },
-          className: k.button,
-          disabled: !!(e.quantity.restrictions && o >= e.quantity.restrictions.max || e.quantity.available !== void 0 && o >= e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available),
-          children: /* @__PURE__ */ t.jsx(f, { name: "Plus" })
+          className: w.button,
+          disabled: !!(e.quantity.available && e.quantity.restrictions && l >= e.quantity.restrictions.max || e.quantity.available === 0),
+          children: /* @__PURE__ */ t.jsx(v, { name: "Plus" })
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: k.meta, children: [
-      /* @__PURE__ */ t.jsxs("div", { className: k.info, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: w.meta, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
-        /* @__PURE__ */ t.jsxs("div", { className: k.infoRight, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: w.infoRight, children: [
           /* @__PURE__ */ t.jsx(
-            f,
+            v,
             {
               name: "Lightning",
               fill: "#FF3F19",
@@ -1551,234 +1554,269 @@ const li = (r) => {
               height: 20
             }
           ),
-          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : M(e.deliveryTime) })
+          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : y(e.deliveryTime) })
         ] })
       ] }),
-      /* @__PURE__ */ t.jsxs("div", { className: k.info, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Price" }),
-        /* @__PURE__ */ t.jsx("div", { className: k.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: k.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: W(k.newPrice, { [k.animate]: c }), children: [
+        /* @__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: [
             "$ ",
-            (e.price.amount || 0) * o
+            (e.price.amount || 0) * l
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: k.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
             "$ ",
-            (e.compareAtPrice.amount || 0) * o
+            (e.compareAtPrice.amount || 0) * l
           ] })
-        ] }) : /* @__PURE__ */ t.jsxs("span", { className: W(k.newPrice, { [k.animate]: c }), children: [
+        ] }) : /* @__PURE__ */ t.jsxs("span", { className: V(w.newPrice, { [w.animate]: j }), children: [
           "$ ",
-          (e.price.amount || 0) * o
-        ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: k.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: W(k.newPrice, { [k.animate]: c }), children: [
+          (e.price.amount || 0) * l
+        ] }) : 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.price.amount || 0
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: k.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
             "$ ",
             e.subscriptionSettings.compareAtPrice.amount || 0
           ] })
-        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: W(k.newPrice, { [k.animate]: c }), children: [
+        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: V(w.newPrice, { [w.animate]: j }), children: [
           "$ ",
           e.subscriptionSettings.price.amount || 0
         ] }) })
       ] })
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: k.buttons, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: w.buttons, children: [
       /* @__PURE__ */ t.jsx(
-        H,
+        F,
         {
           type: "Primary",
-          onClick: () => $(),
-          disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
+          onClick: () => g(),
+          disabled: e.quantity && e.quantity.available === 0,
           children: i === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
         }
       ),
       i === "ONE_TIME" && /* @__PURE__ */ t.jsx(
-        H,
+        F,
         {
           type: "Secondary",
-          onClick: () => T(),
-          disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
+          onClick: () => S(),
+          disabled: e.quantity && e.quantity.available === 0,
           children: "Add to Cart"
         }
       )
     ] })
   ] });
-}, Ln = "_button_ekti4_1", zn = "_login_ekti4_14", Un = "_signUp_ekti4_18", Hn = "_buttons_ekti4_23", Fn = "_modal_ekti4_32", Vn = "_closing_ekti4_64", Yn = "_info_ekti4_113", Gn = "_top_ekti4_120", Wn = "_title_ekti4_131", Jn = "_clear_ekti4_138", Xn = "_activeClear_ekti4_145", Kn = "_count_ekti4_149", Qn = "_cart_ekti4_164", Zn = "_empty_ekti4_172", ts = "_product_ekti4_198", es = "_products_ekti4_207", ns = "_image_ekti4_215", ss = "_productInfo_ekti4_221", is = "_content_ekti4_228", os = "_name_ekti4_234", as = "_price_ekti4_240", cs = "_productButtons_ekti4_246", ls = "_productButton_ekti4_246", rs = "_productCount_ekti4_266", ds = "_bottom_ekti4_282", us = "_subtotal_ekti4_290", ms = "_block_ekti4_298", hs = "_shoppingCount_ekti4_305", ps = "_total_ekti4_325", _s = "_link_ekti4_331", gs = "_userInfo_ekti4_338", fs = "_pagesMobileModal_ekti4_349", xs = "_pagesMobileModalContent_ekti4_363", bs = "_pagesMobileModalHeader_ekti4_369", js = "_pagesMobileModalFooter_ekti4_379", y = {
-  button: Ln,
-  login: zn,
-  signUp: Un,
-  buttons: Hn,
-  modal: Fn,
-  "slide-in-fade": "_slide-in-fade_ekti4_1",
-  "mobile-slide-in-fade": "_mobile-slide-in-fade_ekti4_1",
-  closing: Vn,
-  "mobile-slide-out-fade": "_mobile-slide-out-fade_ekti4_1",
-  "slide-out-fade": "_slide-out-fade_ekti4_1",
-  info: Yn,
-  top: Gn,
-  title: Wn,
-  clear: Jn,
-  activeClear: Xn,
-  count: Kn,
-  cart: Qn,
-  empty: Zn,
-  product: ts,
-  products: es,
-  image: ns,
-  productInfo: ss,
-  content: is,
-  name: os,
-  price: as,
-  productButtons: cs,
-  productButton: ls,
-  productCount: rs,
-  bottom: ds,
-  subtotal: us,
-  block: ms,
-  shoppingCount: hs,
-  total: ps,
-  link: _s,
-  userInfo: gs,
-  pagesMobileModal: fs,
-  pagesMobileModalContent: xs,
-  pagesMobileModalHeader: bs,
-  pagesMobileModalFooter: js
-}, ri = (r) => {
-  const { shopping: s, signUp: e, isShowUserInfo: n = !0 } = r;
-  return /* @__PURE__ */ t.jsxs("div", { className: y.buttons, children: [
-    s && /* @__PURE__ */ t.jsx(vs, {}),
-    n && /* @__PURE__ */ t.jsx(Ct, { signUp: e })
+}, Un = "_button_14q75_1", Hn = "_login_14q75_14", Yn = "_signUp_14q75_18", Wn = "_buttons_14q75_23", Gn = "_modal_14q75_32", Qn = "_closing_14q75_64", Xn = "_info_14q75_113", Jn = "_top_14q75_120", Kn = "_title_14q75_131", Zn = "_clear_14q75_138", ts = "_activeClear_14q75_145", es = "_count_14q75_149", ns = "_cart_14q75_164", ss = "_empty_14q75_172", is = "_product_14q75_198", as = "_products_14q75_207", os = "_image_14q75_215", cs = "_productInfo_14q75_230", ls = "_content_14q75_237", rs = "_name_14q75_243", ds = "_price_14q75_249", us = "_productButtons_14q75_255", ms = "_productButton_14q75_255", hs = "_productCount_14q75_272", ps = "_bottom_14q75_289", _s = "_subtotal_14q75_297", gs = "_block_14q75_305", fs = "_shoppingCount_14q75_312", xs = "_total_14q75_332", vs = "_link_14q75_338", js = "_userInfo_14q75_345", bs = "_pagesMobileModal_14q75_356", ys = "_pagesMobileModalContent_14q75_370", Ns = "_pagesMobileModalHeader_14q75_376", Is = "_pagesMobileModalFooter_14q75_386", C = {
+  button: Un,
+  login: Hn,
+  signUp: Yn,
+  buttons: Wn,
+  modal: Gn,
+  "slide-in-fade": "_slide-in-fade_14q75_1",
+  "mobile-slide-in-fade": "_mobile-slide-in-fade_14q75_1",
+  closing: Qn,
+  "mobile-slide-out-fade": "_mobile-slide-out-fade_14q75_1",
+  "slide-out-fade": "_slide-out-fade_14q75_1",
+  info: Xn,
+  top: Jn,
+  title: Kn,
+  clear: Zn,
+  activeClear: ts,
+  count: es,
+  cart: ns,
+  empty: ss,
+  product: is,
+  products: as,
+  image: os,
+  productInfo: cs,
+  content: ls,
+  name: rs,
+  price: ds,
+  productButtons: us,
+  productButton: ms,
+  productCount: hs,
+  bottom: ps,
+  subtotal: _s,
+  block: gs,
+  shoppingCount: fs,
+  total: xs,
+  link: vs,
+  userInfo: js,
+  pagesMobileModal: bs,
+  pagesMobileModalContent: ys,
+  pagesMobileModalHeader: Ns,
+  pagesMobileModalFooter: Is
+}, zi = (o) => {
+  const { shopping: s, signUp: e, isShowUserInfo: n = !0 } = o;
+  return /* @__PURE__ */ t.jsxs("div", { className: C.buttons, children: [
+    s && /* @__PURE__ */ t.jsx(ks, {}),
+    n && /* @__PURE__ */ t.jsx(Bt, { signUp: e })
   ] });
-}, vs = () => {
-  const [r, s] = _.useState(!1), [e, n] = _.useState([]), { cart: i } = vt();
-  function d(g) {
-    var C;
-    return !g || !(g != null && g.variants) ? !1 : (C = g.variants.find((c) => c.id === g.activeVariantId)) == null ? void 0 : C.subscriptionSettings;
+}, ks = () => {
+  const [o, s] = x.useState(!1), [e, n] = x.useState([]), { cart: i } = dt(), { pageContext: c } = rt();
+  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;
+    }
+    return a.variants[0].id;
   }
-  const u = i.parts.length > 0 && e.length > 0 && !d(e[0]), [o, m] = _.useState(!1);
+  function l(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;
+  }
+  x.useEffect(() => {
+    (async () => {
+      var g;
+      const j = i.parts.map((y) => String(y.productId)), S = (((g = c == null ? void 0 : c.products) == null ? void 0 : g.filter((y) => j.includes(String(y.id)))) || []).map((y) => ({
+        ...y,
+        activeVariantId: u(y),
+        quantity: l(y)
+      }));
+      n(S);
+    })();
+  }, [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;
+  }
+  const p = i.parts.length > 0 && e.length > 0 && !m(e[0]), [B, r] = x.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsxs(
-      H,
+      F,
       {
         type: "Secondary",
         style: {
-          padding: 10
+          padding: 10,
+          position: "relative"
         },
-        onClick: (g) => {
-          g.stopPropagation(), window.location.pathname.includes("/admin/builder") || (s(!0), m(!0));
+        onClick: (a) => {
+          a.stopPropagation(), window.location.pathname.includes("/admin/builder") || (s(!0), r(!0));
         },
         children: [
           /* @__PURE__ */ t.jsx(
-            f,
+            v,
             {
               name: "Handbag",
               fill: "var(--text-primary)"
             }
           ),
-          u && /* @__PURE__ */ t.jsx("div", { className: y.shoppingCount, children: i.parts.length })
+          p && /* @__PURE__ */ t.jsx("div", { className: C.shoppingCount, children: i.parts.length })
         ]
       }
     ),
-    r && /* @__PURE__ */ t.jsx(
-      yt,
+    o && /* @__PURE__ */ t.jsx(
+      kt,
       {
         close: () => {
-          m(!1), setTimeout(() => {
+          r(!1), setTimeout(() => {
             s(!1);
           }, 300);
         },
         withAnimation: !1,
         children: /* @__PURE__ */ t.jsx(
-          ys,
+          Cs,
           {
             activeProducts: e,
-            isCartNotEmpty: u,
-            isOpen: o
+            isCartNotEmpty: p,
+            isOpen: B
           }
         )
       }
     )
   ] });
-}, ys = (r) => {
-  const { activeProducts: s, isCartNotEmpty: e, isOpen: n } = r, { cart: i, reset: d, getTotalAndDiscount: u, updateQuantityOfProduct: o } = vt(), m = lt();
-  function g(l) {
-    m(l);
+}, Cs = (o) => {
+  const { activeProducts: s, isCartNotEmpty: e, isOpen: n } = o, { cart: i, reset: c, getTotalAndDiscount: u, updateQuantityOfProduct: l } = dt(), m = ut();
+  function p(a) {
+    m(a);
   }
-  function C(l) {
-    o({
-      productId: l.id,
-      productVariantId: l.activeVariantId,
-      quantity: l.quantity + 1
+  function B(a) {
+    a.quantity && l({
+      productId: a.id,
+      productVariantId: a.activeVariantId,
+      quantity: a.quantity + 1
     });
   }
-  function c(l) {
-    o({
-      productId: l.id,
-      productVariantId: l.activeVariantId,
-      quantity: l.quantity - 1
+  function r(a) {
+    a.quantity && l({
+      productId: a.id,
+      productVariantId: a.activeVariantId,
+      quantity: a.quantity - 1
     });
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: W(y.modal, {
-        [y.closing]: !n
+      className: V(C.modal, {
+        [C.closing]: !n
       }),
-      onClick: (l) => l.stopPropagation(),
+      onClick: (a) => a.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: y.top, children: [
-          /* @__PURE__ */ t.jsxs("div", { className: y.info, children: [
-            /* @__PURE__ */ t.jsx("span", { className: y.title, children: "Cart" }),
-            e && /* @__PURE__ */ t.jsx("div", { className: y.count, children: i.parts.length })
+        /* @__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.jsx(
             "button",
             {
-              className: W(y.clear, {
-                [y.activeClear]: e
+              className: V(C.clear, {
+                [C.activeClear]: e
               }),
               disabled: !e,
-              onClick: d,
+              onClick: c,
               children: "Clear all"
             }
           )
         ] }),
-        e ? /* @__PURE__ */ t.jsxs("div", { className: y.cart, children: [
-          /* @__PURE__ */ t.jsx("div", { className: y.products, children: s.map((l) => /* @__PURE__ */ t.jsxs(
+        e ? /* @__PURE__ */ t.jsxs("div", { className: C.cart, children: [
+          /* @__PURE__ */ t.jsx("div", { className: C.products, children: s.map((a) => /* @__PURE__ */ t.jsxs(
             "div",
             {
-              className: y.product,
+              className: C.product,
               children: [
-                /* @__PURE__ */ t.jsxs("div", { className: y.productInfo, children: [
-                  /* @__PURE__ */ t.jsx(
+                /* @__PURE__ */ t.jsxs("div", { className: C.productInfo, children: [
+                  a.images.length > 0 ? /* @__PURE__ */ t.jsx(
                     "img",
                     {
-                      src: `https://imagedelivery.net/${l.images[0].cfId}/w=500`,
+                      src: `https://imagedelivery.net/${a.images[0].cfId}/w=500`,
                       alt: "image",
                       width: "100%",
                       height: "100%",
-                      className: y.image
+                      className: C.image
                     }
-                  ),
-                  /* @__PURE__ */ t.jsxs("div", { className: y.content, children: [
-                    /* @__PURE__ */ t.jsx("div", { className: y.name, children: l.name }),
-                    /* @__PURE__ */ t.jsxs("div", { className: y.price, children: [
+                  ) : /* @__PURE__ */ t.jsx("div", { className: C.image, children: /* @__PURE__ */ t.jsx(
+                    v,
+                    {
+                      name: "Image",
+                      fill: "var(--text-secondary)"
+                    }
+                  ) }),
+                  /* @__PURE__ */ t.jsxs("div", { className: C.content, children: [
+                    /* @__PURE__ */ t.jsx("div", { className: C.name, children: It(a.name) }),
+                    /* @__PURE__ */ t.jsxs("div", { className: C.price, children: [
                       "$",
-                      l.variants.find((T) => T.id === l.activeVariantId).price.amount * ((l == null ? void 0 : l.quantity) || 1)
+                      a.variants.find((j) => j.id === a.activeVariantId).price.amount * ((a == null ? void 0 : a.quantity) || 1)
                     ] })
                   ] })
                 ] }),
-                /* @__PURE__ */ t.jsxs("div", { className: y.productButtons, children: [
+                /* @__PURE__ */ t.jsxs("div", { className: C.productButtons, children: [
                   /* @__PURE__ */ t.jsx(
-                    "div",
+                    F,
                     {
+                      type: "Secondary",
                       onClick: () => {
-                        l.quantity !== 1 && c(l);
+                        a.quantity !== 1 && r(a);
                       },
-                      className: y.productButton,
+                      className: C.productButton,
+                      disabled: a.quantity === 1,
                       children: /* @__PURE__ */ t.jsx(
-                        f,
+                        v,
                         {
                           name: "Minus",
                           fill: "#757575",
@@ -1788,14 +1826,16 @@ const li = (r) => {
                       )
                     }
                   ),
-                  /* @__PURE__ */ t.jsx("div", { className: y.productCount, children: l.quantity }),
+                  /* @__PURE__ */ t.jsx("div", { className: C.productCount, children: a.quantity }),
                   /* @__PURE__ */ t.jsx(
-                    "div",
+                    F,
                     {
-                      onClick: () => C(l),
-                      className: y.productButton,
+                      type: "Secondary",
+                      onClick: () => B(a),
+                      className: C.productButton,
+                      disabled: a.quantity === a.variants.find((j) => j.id === a.activeVariantId).quantity.available,
                       children: /* @__PURE__ */ t.jsx(
-                        f,
+                        v,
                         {
                           name: "Plus",
                           fill: "#757575",
@@ -1808,14 +1848,14 @@ const li = (r) => {
                 ] })
               ]
             },
-            l.id
+            a.id
           )) }),
-          /* @__PURE__ */ t.jsxs("div", { className: y.bottom, children: [
-            /* @__PURE__ */ t.jsxs("div", { className: y.subtotal, children: [
-              /* @__PURE__ */ t.jsxs("div", { className: y.block, children: [
+          /* @__PURE__ */ t.jsxs("div", { className: C.bottom, children: [
+            /* @__PURE__ */ t.jsxs("div", { className: C.subtotal, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: C.block, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
                 /* @__PURE__ */ t.jsx(
-                  f,
+                  v,
                   {
                     name: "Info",
                     width: 20,
@@ -1824,20 +1864,20 @@ const li = (r) => {
                   }
                 )
               ] }),
-              /* @__PURE__ */ t.jsxs("div", { className: y.total, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: C.total, children: [
                 "$",
                 u().total
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx(H, { onClick: () => g("/checkout"), children: "Checkout" })
+            /* @__PURE__ */ t.jsx(F, { onClick: () => p("/checkout"), children: "Checkout" })
           ] })
-        ] }) : /* @__PURE__ */ t.jsx(ks, {})
+        ] }) : /* @__PURE__ */ t.jsx(Ss, {})
       ]
     }
   );
-}, ks = () => /* @__PURE__ */ t.jsxs("div", { className: y.empty, children: [
+}, Ss = () => /* @__PURE__ */ t.jsxs("div", { className: C.empty, children: [
   /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-    f,
+    v,
     {
       name: "Handbag",
       fill: "var(--text-secondary)"
@@ -1851,23 +1891,23 @@ const li = (r) => {
       "a",
       {
         href: "/products",
-        className: y.link,
+        className: C.link,
         children: "view products"
       }
     )
   ] })
-] }), Ct = ({ signUp: r, close: s }) => {
-  const e = JSON.parse(localStorage.getItem("token") || "{}"), { data: n } = e, i = lt();
-  function d(m) {
+] }), Bt = ({ signUp: o, close: s }) => {
+  const e = JSON.parse(localStorage.getItem("token") || "{}"), { data: n } = e, i = ut();
+  function c(m) {
     window.location.pathname.includes("/admin/builder") || i(m);
   }
   if (!n)
     return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       /* @__PURE__ */ t.jsx(
-        H,
+        F,
         {
           onClick: () => {
-            d("/customer-dash"), s == null || s();
+            c("/customer-dash"), s == null || s();
           },
           type: "Secondary",
           style: {
@@ -1876,11 +1916,11 @@ const li = (r) => {
           children: "Login"
         }
       ),
-      r && /* @__PURE__ */ t.jsx(
-        H,
+      o && /* @__PURE__ */ t.jsx(
+        F,
         {
           onClick: () => {
-            d("/customer-dash"), s == null || s();
+            c("/customer-dash"), s == null || s();
           },
           type: "Primary",
           style: {
@@ -1891,29 +1931,29 @@ const li = (r) => {
         }
       )
     ] });
-  const [u, o] = _.useState("test-email@gmail.com");
-  return _.useEffect(() => {
+  const [u, l] = x.useState("test-email@gmail.com");
+  return x.useEffect(() => {
     (async () => {
-      const g = qt(n);
-      o(g.email);
+      const p = Et(n);
+      l(p.email);
     })();
   }, [n]), /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: y.userInfo,
+      className: C.userInfo,
       onClick: () => {
-        d("/customer-dash"), s == null || s();
+        c("/customer-dash"), s == null || s();
       },
       children: /* @__PURE__ */ t.jsx("div", { children: u || "test-email@gmail.com" })
     }
   );
-}, Ns = ({
-  children: r,
+}, ws = ({
+  children: o,
   logo: s,
   setIsOpen: e,
   signUp: n
 }) => {
-  const { setIsOpen: i } = Nt(), d = () => {
+  const { setIsOpen: i } = wt(), c = () => {
     i(!1), setTimeout(() => {
       e(!1), i(!0);
     }, 300);
@@ -1921,18 +1961,18 @@ const li = (r) => {
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: y.pagesMobileModal,
+      className: C.pagesMobileModal,
       onClick: (u) => u.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: y.pagesMobileModalHeader, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: C.pagesMobileModalHeader, children: [
           /* @__PURE__ */ t.jsx("div", { children: s }),
           /* @__PURE__ */ t.jsx(
-            H,
+            F,
             {
               type: "Secondary",
-              onClick: d,
+              onClick: c,
               children: /* @__PURE__ */ t.jsx(
-                f,
+                v,
                 {
                   name: "X",
                   fill: "var(--text-primary)"
@@ -1941,39 +1981,39 @@ const li = (r) => {
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: y.pagesMobileModalContent, children: r }),
-        /* @__PURE__ */ t.jsx("div", { className: y.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(
-          Ct,
+        /* @__PURE__ */ t.jsx("div", { className: C.pagesMobileModalContent, children: o }),
+        /* @__PURE__ */ t.jsx("div", { className: C.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(
+          Bt,
           {
             signUp: n,
-            close: d
+            close: c
           }
         ) })
       ]
     }
   );
-}, di = ({
-  children: r,
+}, Fi = ({
+  children: o,
   logo: s,
   signUp: e
 }) => {
-  const [n, i] = _.useState(!1);
+  const [n, i] = x.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx(Is, { setIsOpenModal: i }),
-    n && /* @__PURE__ */ t.jsx(yt, { close: () => i(!1), children: /* @__PURE__ */ t.jsx(
-      Ns,
+    /* @__PURE__ */ t.jsx($s, { setIsOpenModal: i }),
+    n && /* @__PURE__ */ t.jsx(kt, { close: () => i(!1), children: /* @__PURE__ */ t.jsx(
+      ws,
       {
         logo: s,
         setIsOpen: i,
         signUp: e,
-        children: r
+        children: o
       }
     ) })
   ] });
-}, Is = (r) => {
-  const { setIsOpenModal: s } = r;
+}, $s = (o) => {
+  const { setIsOpenModal: s } = o;
   return /* @__PURE__ */ t.jsx(
-    H,
+    F,
     {
       type: "Secondary",
       style: {
@@ -1983,7 +2023,7 @@ const li = (r) => {
         e.stopPropagation(), window.location.pathname.includes("/admin/builder") || s(!0);
       },
       children: /* @__PURE__ */ t.jsx(
-        f,
+        v,
         {
           name: "List",
           fill: "var(--text-primary)"
@@ -1991,34 +2031,34 @@ const li = (r) => {
       )
     }
   );
-}, Ss = "_share_10urc_1", Cs = "_modal_10urc_9", ws = "_header_10urc_21", $s = "_socials_10urc_31", Bs = "_social_10urc_31", Ps = "_copy_10urc_41", Ms = "_title_10urc_48", Ts = "_copyWrapper_10urc_54", qs = "_copyText_10urc_63", As = "_copyTextMobile_10urc_76", Os = "_copyTextMiniMobile_10urc_95", tt = {
-  share: Ss,
-  modal: Cs,
-  header: ws,
-  socials: $s,
-  social: Bs,
-  copy: Ps,
-  title: Ms,
-  copyWrapper: Ts,
-  copyText: qs,
-  copyTextMobile: As,
-  copyTextMiniMobile: Os
-}, ui = ({ title: r = "Copy Product Link" }) => {
-  const { isOpenModal: s, setIsOpenModal: e } = It();
+}, qs = "_share_10urc_1", Bs = "_modal_10urc_9", Ps = "_header_10urc_21", Ts = "_socials_10urc_31", Ms = "_social_10urc_31", As = "_copy_10urc_41", Os = "_title_10urc_48", Es = "_copyWrapper_10urc_54", Ds = "_copyText_10urc_63", Rs = "_copyTextMobile_10urc_76", Ls = "_copyTextMiniMobile_10urc_95", et = {
+  share: qs,
+  modal: Bs,
+  header: Ps,
+  socials: Ts,
+  social: Ms,
+  copy: As,
+  title: Os,
+  copyWrapper: Es,
+  copyText: Ds,
+  copyTextMobile: Rs,
+  copyTextMiniMobile: Ls
+}, Vi = ({ title: o = "Copy Product Link" }) => {
+  const { isOpenModal: s, setIsOpenModal: e } = $t();
   function n() {
     e(!0);
   }
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
-      H,
+      F,
       {
-        className: tt.share,
+        className: et.share,
         onClick: (i) => {
           i.stopPropagation(), n();
         },
         type: "Secondary",
         children: /* @__PURE__ */ t.jsx(
-          f,
+          v,
           {
             name: "Share",
             fill: "#757575",
@@ -2027,45 +2067,45 @@ const li = (r) => {
         )
       }
     ),
-    s && /* @__PURE__ */ t.jsx(yt, { close: e, children: /* @__PURE__ */ t.jsx(Es, { title: r }) })
+    s && /* @__PURE__ */ t.jsx(kt, { close: e, children: /* @__PURE__ */ t.jsx(zs, { title: o }) })
   ] });
-}, Es = ({ title: r = "Copy Product Link" }) => {
-  const { setIsOpenModal: s } = It(), { notification: e, setNotification: n } = At(), { setIsOpen: i } = Nt(), d = window.location.href;
+}, zs = ({ title: o = "Copy Product Link" }) => {
+  const { setIsOpenModal: s } = $t(), { notification: e, setNotification: n } = qt(), { setIsOpen: i } = wt(), c = window.location.href;
   function u() {
-    navigator.clipboard.writeText(d), n({
+    navigator.clipboard.writeText(c), n({
       message: "Link copied to clipboard",
       status: "success"
     });
   }
-  function o() {
+  function l() {
     i(!1), setTimeout(() => {
       s(!1), i(!0);
     }, 300);
   }
-  function m(g, C) {
-    return g.length > C ? g.slice(0, C) + "..." : g;
+  function m(p, B) {
+    return p.length > B ? p.slice(0, B) + "..." : p;
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: tt.modal,
-      onClick: (g) => g.stopPropagation(),
+      className: et.modal,
+      onClick: (p) => p.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: tt.header, children: [
-          /* @__PURE__ */ t.jsx("div", { className: tt.title, children: r }),
+        /* @__PURE__ */ t.jsxs("div", { className: et.header, children: [
+          /* @__PURE__ */ t.jsx("div", { className: et.title, children: o }),
           /* @__PURE__ */ t.jsx(
-            f,
+            v,
             {
               name: "X",
               fill: "#757575",
-              onClick: o,
+              onClick: l,
               hoverable: !0
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { className: tt.copyWrapper, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: et.copyWrapper, children: [
           /* @__PURE__ */ t.jsxs(
-            H,
+            F,
             {
               type: "Secondary",
               onClick: u,
@@ -2073,59 +2113,59 @@ const li = (r) => {
                 flex: 1
               },
               children: [
-                /* @__PURE__ */ t.jsx("div", { className: tt.copyText, children: m(d, 100) }),
-                /* @__PURE__ */ t.jsx("div", { className: tt.copyTextMobile, children: m(d, 40) }),
-                /* @__PURE__ */ t.jsx("div", { className: tt.copyTextMiniMobile, children: m(d, 20) })
+                /* @__PURE__ */ t.jsx("div", { className: et.copyText, children: m(c, 100) }),
+                /* @__PURE__ */ t.jsx("div", { className: et.copyTextMobile, children: m(c, 40) }),
+                /* @__PURE__ */ t.jsx("div", { className: et.copyTextMiniMobile, children: m(c, 20) })
               ]
             }
           ),
           /* @__PURE__ */ t.jsx(
-            H,
+            F,
             {
               type: "Secondary",
               onClick: u,
-              children: e ? /* @__PURE__ */ t.jsx(f, { name: "Check" }) : /* @__PURE__ */ t.jsx(f, { name: "Copy" })
+              children: e ? /* @__PURE__ */ t.jsx(v, { name: "Check" }) : /* @__PURE__ */ t.jsx(v, { name: "Copy" })
             }
           )
         ] })
       ]
     }
   );
-}, Ds = "_accordion_1s1lq_1", Rs = "_header_1s1lq_9", Ls = "_icon_1s1lq_18", zs = "_open_1s1lq_21", Us = "_content_1s1lq_25", nt = {
-  accordion: Ds,
-  header: Rs,
-  icon: Ls,
-  open: zs,
-  content: Us
-}, mi = ({ title: r, content: s, defaultOpen: e = !1 }) => {
-  const [n, i] = _.useState(e), [d, u] = _.useState(0), o = _.useRef(null), m = () => {
+}, Fs = "_accordion_1s1lq_1", Vs = "_header_1s1lq_9", Us = "_icon_1s1lq_18", Hs = "_open_1s1lq_21", Ys = "_content_1s1lq_25", it = {
+  accordion: Fs,
+  header: Vs,
+  icon: Us,
+  open: Hs,
+  content: Ys
+}, Ui = ({ title: o, content: s, defaultOpen: e = !1 }) => {
+  const [n, i] = x.useState(e), [c, u] = x.useState(0), l = x.useRef(null), m = () => {
     i(!n);
   };
-  return _.useEffect(() => {
-    o.current && u(n ? o.current.scrollHeight : 0);
-  }, [n]), /* @__PURE__ */ t.jsxs("div", { className: nt.accordion, children: [
+  return x.useEffect(() => {
+    l.current && u(n ? l.current.scrollHeight : 0);
+  }, [n]), /* @__PURE__ */ t.jsxs("div", { className: it.accordion, children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: nt.header,
+        className: it.header,
         onClick: m,
         children: [
-          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: r }),
-          /* @__PURE__ */ t.jsx("div", { className: W(nt.icon, { [nt.open]: n }), children: /* @__PURE__ */ t.jsx(f, { name: "CaretDown" }) })
+          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: o }),
+          /* @__PURE__ */ t.jsx("div", { className: V(it.icon, { [it.open]: n }), children: /* @__PURE__ */ t.jsx(v, { name: "CaretDown" }) })
         ]
       }
     ),
     /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: o,
-        className: nt.content,
-        style: { height: `${d}px` },
+        ref: l,
+        className: it.content,
+        style: { height: `${c}px` },
         children: /* @__PURE__ */ t.jsx("p", { id: "p", children: s })
       }
     )
   ] });
-}, hi = ({ children: r, path: s, className: e, target: n = "_self", id: i }) => {
+}, Hi = ({ children: o, path: s, className: e, target: n = "_self", id: i }) => {
   if (window.location.pathname.includes("/admin/builder"))
     return /* @__PURE__ */ t.jsx(
       "div",
@@ -2134,47 +2174,78 @@ const li = (r) => {
         role: "link",
         style: { cursor: "pointer" },
         id: i,
-        children: r
+        children: o
       }
     );
-  const d = lt(), u = /^https?:\/\//.test(s), o = (m) => {
-    u || n === "_blank" ? n === "_blank" ? window.open(s, "_blank") : window.history.pushState({}, "", s) : (m.preventDefault(), d(s));
+  const c = ut(), u = /^https?:\/\//.test(s), l = (m) => {
+    u || n === "_blank" ? n === "_blank" ? window.open(s, "_blank") : window.open(s, "_self") : (m.preventDefault(), c(s));
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      onClick: o,
+      onClick: l,
       className: e,
       role: "link",
       style: { cursor: "pointer" },
       id: i,
-      children: r
+      children: o
     }
   );
-}, Hs = "_buttonsBlock_1b2rb_1", Fs = "_slideUp_1b2rb_1", Vs = {
-  buttonsBlock: Hs,
-  slideUp: Fs
-}, pi = () => /* @__PURE__ */ t.jsxs("div", { className: Vs.buttonsBlock, children: [
-  /* @__PURE__ */ t.jsx(
-    H,
+}, Ws = "_buttonsBlock_1b2rb_1", Gs = "_slideUp_1b2rb_1", Qs = {
+  buttonsBlock: Ws,
+  slideUp: Gs
+}, Yi = (o) => {
+  var p, B;
+  const { setIsOpen: s, setModalType: e, productId: n } = o, { cart: i } = dt(), { pageContext: c } = rt(), u = (p = c == null ? void 0 : c.listings) == null ? void 0 : p.find((r) => r.id === n);
+  if (!u)
+    return null;
+  const l = (B = c == null ? void 0 : c.products) == null ? void 0 : B.find(
+    (r) => r.uniquePath === u.productData.uniquePath
+  );
+  if (!l)
+    return null;
+  const m = i.parts.find((r) => r.productId === l.id);
+  return /* @__PURE__ */ t.jsxs(
+    "div",
     {
-      type: "Primary",
-      style: {
-        width: "100%"
-      },
-      children: "Add to Cart"
+      className: Qs.buttonsBlock,
+      onClick: (r) => r.stopPropagation(),
+      children: [
+        /* @__PURE__ */ t.jsx(
+          F,
+          {
+            type: "Secondary",
+            style: {
+              width: "100%"
+            },
+            onClick: () => {
+              e("Add To Cart"), s(!0);
+            },
+            children: m ? "Add More" : "Add To Cart"
+          }
+        ),
+        /* @__PURE__ */ t.jsx(
+          F,
+          {
+            type: "Primary",
+            onClick: () => {
+              e("Buy Now"), s(!0);
+            },
+            children: "Buy"
+          }
+        )
+      ]
     }
-  ),
-  /* @__PURE__ */ t.jsx(H, { type: "Secondary", children: "Buy" })
-] }), Ys = "_wrapper_27wzz_1", Gs = "_logo_27wzz_8", Ws = "_info_27wzz_12", dt = {
-  wrapper: Ys,
-  logo: Gs,
-  info: Ws
-}, _i = ({ date: r }) => {
-  const { general: s } = Ot();
+  );
+}, Xs = "_wrapper_27wzz_1", Js = "_logo_27wzz_8", Ks = "_info_27wzz_12", ht = {
+  wrapper: Xs,
+  logo: Js,
+  info: Ks
+}, Wi = ({ date: o }) => {
+  const { general: s } = Dt();
   if (!s) return /* @__PURE__ */ t.jsx(t.Fragment, {});
   function e(n) {
-    const i = new Date(n), d = {
+    const i = new Date(n), c = {
       month: "short",
       day: "2-digit",
       year: "numeric",
@@ -2182,10 +2253,10 @@ const li = (r) => {
       minute: "2-digit",
       hour12: !1
     };
-    return i.toLocaleDateString("en-US", d);
+    return i.toLocaleDateString("en-US", c);
   }
-  return /* @__PURE__ */ t.jsxs("div", { className: dt.wrapper, children: [
-    /* @__PURE__ */ t.jsx("div", { className: dt.logo, children: s.info.logo ? /* @__PURE__ */ t.jsx(
+  return /* @__PURE__ */ t.jsxs("div", { className: ht.wrapper, children: [
+    /* @__PURE__ */ t.jsx("div", { className: ht.logo, children: s.info.logo ? /* @__PURE__ */ t.jsx(
       "img",
       {
         src: `https://imagedelivery.net/${s.info.logo.cfId}/w=500,h=500`,
@@ -2193,40 +2264,207 @@ const li = (r) => {
         style: { objectFit: "contain", width: "48px", height: "48px" }
       }
     ) : /* @__PURE__ */ t.jsx(
-      f,
+      v,
       {
         name: "Image",
         width: 48,
         height: 48
       }
     ) }),
-    /* @__PURE__ */ t.jsxs("div", { className: dt.info, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: ht.info, children: [
       /* @__PURE__ */ t.jsx("h3", { id: "h4", children: s.info.name }),
-      /* @__PURE__ */ t.jsx("p", { id: "p", children: e(r) })
+      /* @__PURE__ */ t.jsx("p", { id: "p", children: e(o) })
     ] })
   ] });
-}, Js = "_wrapper_st58d_1", Xs = "_label_st58d_10", Ks = "_textarea_st58d_18", Qs = "_length_st58d_33", ct = {
-  wrapper: Js,
-  label: Xs,
-  textarea: Ks,
-  length: Qs
-}, gi = (r) => {
+}, Zs = "_options_mju90_1", ti = "_price_mju90_12", ei = "_oldPrice_mju90_19", ni = "_newPrice_mju90_27", si = "_animate_mju90_34", ii = "_appearAndBounce_mju90_1", ai = "_meta_mju90_52", oi = "_info_mju90_58", ci = "_infoRight_mju90_66", li = "_buttons_mju90_73", ri = "_variants_mju90_80", di = "_variant_mju90_80", ui = "_stock_mju90_98", mi = "_variantInfo_mju90_105", hi = "_quantity_mju90_111", pi = "_count_mju90_118", _i = "_focused_mju90_135", gi = "_button_mju90_73", fi = "_activeVariant_mju90_161", xi = "_chargeTypes_mju90_165", vi = "_charge_mju90_165", ji = "_chargeActive_mju90_190", bi = "_title_mju90_198", yi = "_modal_mju90_204", Ni = "_header_mju90_218", Q = {
+  options: Zs,
+  price: ti,
+  oldPrice: ei,
+  newPrice: ni,
+  animate: si,
+  appearAndBounce: ii,
+  meta: ai,
+  info: oi,
+  infoRight: ci,
+  buttons: li,
+  variants: ri,
+  variant: di,
+  stock: ui,
+  variantInfo: mi,
+  quantity: hi,
+  count: pi,
+  focused: _i,
+  button: gi,
+  activeVariant: fi,
+  chargeTypes: xi,
+  charge: vi,
+  chargeActive: ji,
+  title: bi,
+  modal: yi,
+  header: Ni
+}, Gi = (o) => {
+  var l, m;
+  const { pageContext: s } = rt(), e = (l = s == null ? void 0 : s.listings) == null ? void 0 : l.find((p) => p.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
+  );
+  if (!n)
+    return;
+  const i = n.variants[0], [c, u] = x.useState(
+    i.chargeTypes && i.chargeTypes.length > 1 ? i.chargeTypes[0] : "ONE_TIME"
+  );
+  return /* @__PURE__ */ t.jsxs(
+    "div",
+    {
+      className: Q.modal,
+      onClick: (p) => p.stopPropagation(),
+      children: [
+        o.type === "Add To Cart" && /* @__PURE__ */ t.jsx(
+          Ii,
+          {
+            variants: n.variants,
+            activeVariant: i,
+            activeChargeType: c,
+            setActiveChargeType: u,
+            productId: n.id,
+            setIsOpen: o.setIsOpen
+          }
+        ),
+        o.type === "Buy Now" && /* @__PURE__ */ t.jsx(
+          ki,
+          {
+            product: n,
+            setIsOpen: o.setIsOpen
+          }
+        )
+      ]
+    }
+  );
+}, Ii = (o) => {
+  const { variants: s, activeChargeType: e, setActiveChargeType: n, activeVariant: i, productId: c, setIsOpen: u } = o, { cart: l, addProductToCart: m, addProducts: p, updateQuantityOfProduct: B } = dt(), { setNotification: r } = qt(), { pageContext: a } = rt();
+  async function j(d) {
+    const S = l.parts.find(
+      (g) => g.productId === o.productId && g.productVariantId === d
+    );
+    S ? B({
+      productId: c,
+      productVariantId: d,
+      quantity: S.quantity + 1
+    }) : (a != null && a.products && await p(a.products), await m({
+      productId: c,
+      productVariantId: d,
+      quantity: 1
+    })), r({
+      message: "Product added to cart",
+      status: "success"
+    });
+  }
+  return /* @__PURE__ */ t.jsxs("div", { className: Q.modal, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: Q.header, children: [
+      /* @__PURE__ */ t.jsx("div", { id: "h3", children: "Choose a variant" }),
+      /* @__PURE__ */ t.jsx(
+        v,
+        {
+          name: "X",
+          width: 24,
+          height: 24,
+          fill: "var(--text-secondary)",
+          hoverable: !0,
+          onClick: () => u(!1)
+        }
+      )
+    ] }),
+    i.chargeTypes && i.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: Q.chargeTypes, children: i.chargeTypes.map((d) => /* @__PURE__ */ t.jsx(
+      "div",
+      {
+        className: V(Q.charge, {
+          [Q.chargeActive]: e === d
+        }),
+        onClick: () => n(d),
+        children: Ct[d]
+      },
+      d
+    )) }),
+    /* @__PURE__ */ t.jsx("div", { className: Q.variants, children: s.map((d) => {
+      var S, g;
+      return /* @__PURE__ */ t.jsxs(
+        "div",
+        {
+          className: V(Q.variant),
+          onClick: () => {
+            j(d.id), u(!1);
+          },
+          children: [
+            /* @__PURE__ */ t.jsxs("div", { className: Q.variantInfo, children: [
+              /* @__PURE__ */ t.jsx("span", { className: Q.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: Q.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 : "∞",
+              " ",
+              "in stock"
+            ] }) })
+          ]
+        },
+        d.id
+      );
+    }) })
+  ] });
+}, ki = (o) => {
+  const { product: s, setIsOpen: e } = o;
+  return /* @__PURE__ */ t.jsxs("div", { className: Q.modal, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: Q.header, children: [
+      /* @__PURE__ */ t.jsxs("div", { id: "h3", children: [
+        "Buy ",
+        It(s.name)
+      ] }),
+      /* @__PURE__ */ t.jsx(
+        v,
+        {
+          name: "X",
+          width: 24,
+          height: 24,
+          fill: "var(--text-secondary)",
+          hoverable: !0,
+          onClick: () => e(!1),
+          style: {
+            minWidth: 24,
+            minHeight: 24
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ t.jsx(Vn, { ...s })
+  ] });
+}, Ci = "_wrapper_1efqk_1", Si = "_label_1efqk_10", wi = "_contentBorder_1efqk_19", $i = "_contentField_1efqk_23", qi = "_textarea_1efqk_27", Bi = "_length_1efqk_42", st = {
+  wrapper: Ci,
+  label: Si,
+  contentBorder: wi,
+  contentField: $i,
+  textarea: qi,
+  length: Bi
+}, Qi = (o) => {
   const {
     onChange: s,
     label: e,
     value: n,
     maxLength: i,
-    placeholder: d = "Type something...",
+    placeholder: c = "Type something...",
     type: u = "text"
-  } = r, [o, m] = _.useState(n.length);
-  function g(C) {
-    return u === "number" ? C.replace(/[^\d\n]+/g, "") : C;
+  } = o, [l, m] = x.useState(n.length), { themeSettings: p } = Rt();
+  function B(r) {
+    return u === "number" ? r.replace(/[^\d\n]+/g, "") : r;
   }
-  return /* @__PURE__ */ t.jsxs("div", { className: ct.wrapper, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: st.wrapper, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
       {
-        className: ct.label,
+        className: st.label,
         htmlFor: e,
         children: e
       }
@@ -2236,58 +2474,63 @@ const li = (r) => {
       {
         id: e,
         value: n,
-        onChange: (C) => {
-          const c = g(C.target.value);
-          m(c.length), s(c);
+        onChange: (r) => {
+          const a = B(r.target.value);
+          m(a.length), s(a);
         },
-        placeholder: d,
-        className: ct.textarea,
+        placeholder: c,
+        className: V(st.textarea, {
+          [st.contentBorder]: p.inputs.border.active,
+          [st.contentField]: p.inputs.field.active
+        }),
         maxLength: i
       }
     ),
-    i && /* @__PURE__ */ t.jsxs("div", { className: ct.length, children: [
-      o,
+    i && /* @__PURE__ */ t.jsxs("div", { className: st.length, children: [
+      l,
       "/",
       i
     ] })
   ] });
 };
 export {
-  mi as Accordion,
-  Is as BurgerMenuButton,
-  H as Button,
-  _n as ButtonTypeSettings,
-  ai as ButtonsSettings,
-  si as CategorySettings,
-  $t as ChooseImage,
-  bi as ChooseImageModal,
-  ks as EmptyCart,
-  oi as FormSettings,
-  ri as HeaderButtons,
-  f as Icon,
-  ut as InputSettings,
-  Tt as InputUI,
-  ji as ItemsSettings,
-  ni as LayoutSettings,
-  hi as Link,
-  ci as ListingSelector,
-  vi as Loader,
-  _i as MetaInfoPost,
-  yt as Modal,
-  di as PagesMobileMenu,
-  Ns as PagesMobileModal,
-  ii as PagesSettings,
-  pi as ProductCardButtons,
-  li as ProductOptions,
-  kt as RangeSelector,
-  at as Select,
-  ui as ShareLink,
-  vs as ShoppingButton,
-  ys as ShoppingModalCart,
-  it as Switch,
-  yi as TextSettings,
-  ki as TextareaSettings,
-  gi as TextareaUI,
-  Ni as TypesText,
-  Ct as UserInfo
+  Ui as Accordion,
+  $s as BurgerMenuButton,
+  F as Button,
+  xn as ButtonTypeSettings,
+  Ri as ButtonsSettings,
+  Oi as CategorySettings,
+  Ct as ChargeTypes,
+  Tt as ChooseImage,
+  Ki as ChooseImageModal,
+  Ss as EmptyCart,
+  Di as FormSettings,
+  zi as HeaderButtons,
+  v as Icon,
+  pt as InputSettings,
+  Ot as InputUI,
+  Zi as ItemsSettings,
+  Ai as LayoutSettings,
+  Hi as Link,
+  Li as ListingSelector,
+  ta as Loader,
+  Wi as MetaInfoPost,
+  kt as Modal,
+  Fi as PagesMobileMenu,
+  ws as PagesMobileModal,
+  Ei as PagesSettings,
+  Yi as ProductCardButtons,
+  Gi as ProductCardModal,
+  Vn as ProductOptions,
+  St as RangeSelector,
+  lt as Select,
+  Vi as ShareLink,
+  ks as ShoppingButton,
+  Cs as ShoppingModalCart,
+  ot as Switch,
+  ea as TextSettings,
+  na as TextareaSettings,
+  Qi as TextareaUI,
+  sa as TypesText,
+  Bt as UserInfo
 };