@billgangcom/theme-lib 1.49.1 → 1.50.0

package/dist/ui.es.js

@@ -1,21 +1,21 @@
-import { j as t, I as b, c as Y, a as tt, S as st, T as zt, b as et, C as bt, u as yt, d as kt, D as $t, e as It, v as Nt, B as ot, f as _t, P as wt, g as Ct, h as St, i as Vt, s as Yt, k as Et, l as Bt, m as Ot, M as Mt, n as Ut, o as Dt, p as Gt } from "./index-TpZnQKML.js";
-import { q as uc, L as mc } from "./index-TpZnQKML.js";
-import g from "react";
+import { j as t, I as b, c as H, a as ut, S as at, R as kt, B as et, O as pt, b as ct, u as mt, d as _t, P as ht, D as gt, e as xt, v as ft, f as bt, C as vt, g as F, h as Bt, i as ot, k as Nt, l as Pt, m as dt, s as Mt, n as It, o as rt, p as jt, M as yt, q as $t, r as Tt, t as St, w as qt } from "./index-C87hOfMQ.js";
+import { A as to, y as eo, L as so, x as no, T as io, z as oo } from "./index-C87hOfMQ.js";
+import x from "react";
 import "@phosphor-icons/react";
-const Xt = "_wrapper_1ibay_2", Wt = "_alignmentBlock_1ibay_8", Jt = "_title_1ibay_15", Qt = "_subtitle_1ibay_22", Kt = "_alignmentContent_1ibay_29", Zt = "_alignments_1ibay_37", te = "_alignment_1ibay_8", ee = "_circle_1ibay_60", se = "_paddings_1ibay_67", ne = "_padding_1ibay_67", ie = "_active_1ibay_91", oe = "_input_1ibay_98", K = {
-  wrapper: Xt,
-  alignmentBlock: Wt,
-  title: Jt,
-  subtitle: Qt,
-  alignmentContent: Kt,
-  alignments: Zt,
-  alignment: te,
-  circle: ee,
-  paddings: se,
-  padding: ne,
-  active: ie,
-  input: oe
-}, ae = [
+const At = "_wrapper_1ibay_2", Ot = "_alignmentBlock_1ibay_8", Et = "_title_1ibay_15", zt = "_subtitle_1ibay_22", Dt = "_alignmentContent_1ibay_29", Rt = "_alignments_1ibay_37", Ht = "_alignment_1ibay_8", Lt = "_circle_1ibay_60", Ut = "_paddings_1ibay_67", Ft = "_padding_1ibay_67", Vt = "_active_1ibay_91", Yt = "_input_1ibay_98", W = {
+  wrapper: At,
+  alignmentBlock: Ot,
+  title: Et,
+  subtitle: zt,
+  alignmentContent: Dt,
+  alignments: Rt,
+  alignment: Ht,
+  circle: Lt,
+  paddings: Ut,
+  padding: Ft,
+  active: Vt,
+  input: Yt
+}, Wt = [
   "topLeft",
   "top",
   "topRight",
@@ -25,10 +25,10 @@ const Xt = "_wrapper_1ibay_2", Wt = "_alignmentBlock_1ibay_8", Jt = "_title_1iba
   "bottomLeft",
   "bottom",
   "bottomRight"
-], ce = ["left", "top", "right", "bottom"], Wa = (d) => {
-  const { alignment: a, padding: e, setPadding: s, setAlignment: i } = d;
-  function c(f) {
-    switch (f) {
+], Gt = ["left", "top", "right", "bottom"], zi = (u) => {
+  const { alignment: o, padding: e, setPadding: s, setAlignment: n } = u;
+  function r(h) {
+    switch (h) {
       case "left":
       case "topLeft":
       case "bottomLeft":
@@ -45,8 +45,8 @@ const Xt = "_wrapper_1ibay_2", Wt = "_alignmentBlock_1ibay_8", Jt = "_title_1iba
         return "TextAlignCenter";
     }
   }
-  function l(f) {
-    switch (f) {
+  function c(h) {
+    switch (h) {
       case "left":
         return "AlignLeft";
       case "right":
@@ -57,40 +57,40 @@ const Xt = "_wrapper_1ibay_2", Wt = "_alignmentBlock_1ibay_8", Jt = "_title_1iba
         return "AlignBottom";
     }
   }
-  const [o, n] = g.useState(null), [m, v] = g.useState(null);
-  return /* @__PURE__ */ t.jsxs("div", { className: K.layout, children: [
-    /* @__PURE__ */ t.jsx("h3", { className: K.title, children: "Layout" }),
-    /* @__PURE__ */ t.jsxs("div", { className: K.alignmentBlock, children: [
-      /* @__PURE__ */ t.jsx("h5", { className: K.subtitle, children: "Alignment" }),
-      /* @__PURE__ */ t.jsxs("div", { className: K.alignmentContent, children: [
-        /* @__PURE__ */ t.jsx("div", { className: K.alignments, children: ae.map((f) => /* @__PURE__ */ t.jsxs(
+  const [a, _] = x.useState(null), [N, B] = x.useState(null);
+  return /* @__PURE__ */ t.jsxs("div", { className: W.layout, children: [
+    /* @__PURE__ */ t.jsx("h3", { className: W.title, children: "Layout" }),
+    /* @__PURE__ */ t.jsxs("div", { className: W.alignmentBlock, children: [
+      /* @__PURE__ */ t.jsx("h5", { className: W.subtitle, children: "Alignment" }),
+      /* @__PURE__ */ t.jsxs("div", { className: W.alignmentContent, children: [
+        /* @__PURE__ */ t.jsx("div", { className: W.alignments, children: Wt.map((h) => /* @__PURE__ */ t.jsxs(
           "div",
           {
             onClick: () => {
-              i(f);
+              n(h);
             },
-            className: K.alignment,
+            className: W.alignment,
             onMouseEnter: () => {
-              n(f);
+              _(h);
             },
             onMouseLeave: () => {
-              n(null);
+              _(null);
             },
             children: [
-              f !== a && o !== f && /* @__PURE__ */ t.jsx("div", { className: K.circle }),
-              f !== a && o === f && /* @__PURE__ */ t.jsx(
+              h !== o && a !== h && /* @__PURE__ */ t.jsx("div", { className: W.circle }),
+              h !== o && a === h && /* @__PURE__ */ t.jsx(
                 b,
                 {
-                  name: c(o),
+                  name: r(a),
                   fill: "#c2c2c2",
                   width: 22,
                   height: 22
                 }
               ),
-              f === a && /* @__PURE__ */ t.jsx(
+              h === o && /* @__PURE__ */ t.jsx(
                 b,
                 {
-                  name: c(a),
+                  name: r(o),
                   fill: "#FF3F19",
                   width: 22,
                   height: 22
@@ -98,37 +98,37 @@ const Xt = "_wrapper_1ibay_2", Wt = "_alignmentBlock_1ibay_8", Jt = "_title_1iba
               )
             ]
           },
-          f
+          h
         )) }),
-        /* @__PURE__ */ t.jsx("div", { className: K.paddings, children: ce.map((f) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: W.paddings, children: Gt.map((h) => /* @__PURE__ */ t.jsxs(
           "label",
           {
-            className: Y(K.padding, {
-              [K.active]: m === f
+            className: H(W.padding, {
+              [W.active]: N === h
             }),
             onFocus: () => {
-              v(f);
+              B(h);
             },
             onBlur: () => {
-              v(null);
+              B(null);
             },
             children: [
               /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
                 b,
                 {
-                  name: l(f),
+                  name: c(h),
                   width: 20,
                   height: 20
                 }
               ) }),
               /* @__PURE__ */ t.jsx(
-                tt,
+                ut,
                 {
                   type: "number",
-                  value: String(e[f]),
-                  onChange: (r) => s({
+                  value: String(e[h]),
+                  onChange: (i) => s({
                     ...e,
-                    [f]: Number(r)
+                    [h]: Number(i)
                   }),
                   paddingless: !0,
                   borderless: !0
@@ -136,759 +136,60 @@ const Xt = "_wrapper_1ibay_2", Wt = "_alignmentBlock_1ibay_8", Jt = "_title_1iba
               )
             ]
           },
-          f
+          h
         )) })
       ] })
     ] })
   ] });
-}, le = "_title_1jkiw_1", re = "_subtitle_1jkiw_5", de = "_header_1jkiw_12", ue = "_text_1jkiw_13", me = "_top_1jkiw_20", _e = "_itemsBlock_1jkiw_29", ht = {
-  title: le,
-  subtitle: re,
-  header: de,
-  text: ue,
-  top: me,
-  itemsBlock: _e
-}, pe = "_typeTexts_167ez_1", he = "_block_167ez_8", ge = "_active_167ez_25", Pt = {
-  typeTexts: pe,
-  block: he,
-  active: ge
-}, fe = ["bold", "italic", "underline", "strike-through", "code"], Lt = (d) => {
-  const { typesText: a, setTypesText: e } = d;
-  function s(i) {
-    switch (i) {
-      case "bold":
-        return "TextB";
-      case "italic":
-        return "TextItalic";
-      case "code":
-        return "CodeSimple";
-      case "strike-through":
-        return "TextStrikethrough";
-      case "underline":
-        return "TextUnderline";
-    }
-  }
-  return /* @__PURE__ */ t.jsx("div", { className: Pt.typeTexts, children: fe.map((i) => /* @__PURE__ */ t.jsx(
-    "div",
-    {
-      className: Y(Pt.block, {
-        [Pt.active]: a.includes(i)
-      }),
-      onClick: () => {
-        const c = [...a];
-        if (c.includes(i)) {
-          const l = c.filter((o) => o !== i);
-          e(l);
-        } else
-          c.push(i), e(c);
-      },
-      children: /* @__PURE__ */ t.jsx(
-        b,
-        {
-          name: s(i),
-          fill: a.includes(i) ? "#252525" : "#757575",
-          width: 20,
-          height: 20
-        }
-      )
-    },
-    String(i)
-  )) });
-}, gt = {
-  h1: "Heading 1",
-  h2: "Heading 2",
-  h3: "Heading 3",
-  h4: "Heading 4",
-  h5: "Heading 5",
-  h6: "Heading 6",
-  p: "Paragraph"
-}, Ht = (d) => {
-  const {
-    typesText: a,
-    isActiveText: e,
-    setIsActiveText: s,
-    text: i,
-    setText: c,
-    setTypesText: l,
-    title: o,
-    subtitle: n = "Items",
-    typeFont: m,
-    setTypeFont: v
-  } = d;
-  return /* @__PURE__ */ t.jsxs("div", { className: ht.text, children: [
-    (o || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: ht.top, children: [
-      o && /* @__PURE__ */ t.jsx("h3", { className: ht.title, children: o }),
-      e !== void 0 && s && /* @__PURE__ */ t.jsx(
-        st,
-        {
-          current: e,
-          onChange: (f) => s(f)
-        }
-      )
-    ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: ht.itemsBlock, children: [
-      /* @__PURE__ */ t.jsx("h5", { className: ht.subtitle, children: n }),
-      /* @__PURE__ */ t.jsx(
-        zt,
-        {
-          onChange: (f) => c(f),
-          value: i,
-          maxLength: 150
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        Lt,
-        {
-          typesText: a,
-          setTypesText: l
-        }
-      ),
-      /* @__PURE__ */ t.jsx(
-        et,
-        {
-          label: "Type Text",
-          options: Object.values(gt).filter(
-            (f) => f !== gt[m]
-          ),
-          onChange: (f) => v(
-            Object.keys(gt).find(
-              (r) => gt[r] === f
-            )
-          ),
-          value: gt[m]
-        }
-      )
-    ] })
-  ] });
-}, xe = "_title_1fz6i_1", be = "_subtitle_1fz6i_5", ve = "_header_1fz6i_12", je = "_text_1fz6i_13", ye = "_productsBlock_1fz6i_14", ke = "_top_1fz6i_26", $e = "_itemsBlock_1fz6i_35", Ie = "_typeTexts_1fz6i_41", Ne = "_block_1fz6i_48", we = "_active_1fz6i_61", Ce = "_products_1fz6i_14", Se = "_product_1fz6i_14", Be = "_button_1fz6i_80", Te = "_disabled_1fz6i_91", Pe = "_image_1fz6i_95", Ae = "_info_1fz6i_102", Oe = "_name_1fz6i_114", Me = "_buttons_1fz6i_118", qe = "_modal_1fz6i_125", ze = "_link_1fz6i_146", Ee = "_modalOptions_1fz6i_152", Ue = "_addButton_1fz6i_165", De = "_deleteButton_1fz6i_180", Le = "_closeIcon_1fz6i_192", R = {
-  title: xe,
-  subtitle: be,
-  header: ve,
-  text: je,
-  productsBlock: ye,
-  top: ke,
-  itemsBlock: $e,
-  typeTexts: Ie,
-  block: Ne,
-  active: we,
-  products: Ce,
-  product: Se,
-  button: Be,
-  disabled: Te,
-  image: Pe,
-  info: Ae,
-  name: Oe,
-  buttons: Me,
-  modal: qe,
-  link: ze,
-  modalOptions: Ee,
-  addButton: Ue,
-  deleteButton: De,
-  closeIcon: Le
-}, He = g.forwardRef(
-  (d, a) => {
-    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: c, setIsOpenModal: l } = d;
-    function o(n, m) {
-      return n.length > m ? `${n.slice(0, m)}...` : n;
-    }
-    return /* @__PURE__ */ t.jsxs(
-      "div",
-      {
-        ref: a,
-        className: R.modal,
-        onClick: (n) => {
-          n.stopPropagation();
-        },
-        style: {
-          top: `${i.top}px`,
-          left: `${i.left}px`
-        },
-        children: [
-          /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
-            /* @__PURE__ */ t.jsx("h3", { className: R.title, children: o(e.name["en-US"], 20) }),
-            /* @__PURE__ */ t.jsx("div", { className: R.closeIcon, children: /* @__PURE__ */ t.jsx(
-              b,
-              {
-                name: "X",
-                height: 20,
-                width: 20,
-                onClick: () => {
-                  s(null), l(!1);
-                }
-              }
-            ) })
-          ] }),
-          /* @__PURE__ */ t.jsx("div", { className: R.modalOptions, children: c.map((n) => {
-            if (n.type === "image")
-              return /* @__PURE__ */ t.jsx(
-                bt,
-                {
-                  label: "Put up an attractive image",
-                  activeImage: e[n.field],
-                  onChange: (m) => {
-                    const v = {
-                      ...e,
-                      [n.field]: m
-                    };
-                    s(v);
-                  }
-                },
-                String(n.field)
-              );
-            if (n.type === "text")
-              return /* @__PURE__ */ t.jsx(
-                Ht,
-                {
-                  typesText: e[n.field.type],
-                  setTypesText: (m) => {
-                    const v = {
-                      ...e,
-                      [n.field.type]: m
-                    };
-                    s(v);
-                  },
-                  text: e[n.field.text]["en-US"] || "",
-                  setText: (m) => {
-                    const v = {
-                      ...e,
-                      [n.field.text]: {
-                        "en-US": m
-                      }
-                    };
-                    s(v);
-                  },
-                  typeFont: e[n.field.typeFont],
-                  setTypeFont: (m) => {
-                    const v = {
-                      ...e,
-                      [n.field.typeFont]: m
-                    };
-                    s(v);
-                  },
-                  subtitle: n.label
-                }
-              );
-            if (n.type === "input")
-              return /* @__PURE__ */ t.jsx(
-                tt,
-                {
-                  onChange: (m) => {
-                    const v = {
-                      ...e,
-                      [n.field]: m
-                    };
-                    s(v);
-                  },
-                  value: e[n.field] || "",
-                  label: n.label,
-                  placeholder: n.placeholder
-                }
-              );
-            if (n.type === "inputSwitch")
-              return /* @__PURE__ */ t.jsxs("div", { className: R.link, children: [
-                /* @__PURE__ */ t.jsx(
-                  tt,
-                  {
-                    onChange: (m) => {
-                      const v = {
-                        ...e,
-                        [n.field.text]: m
-                      };
-                      s(v);
-                    },
-                    value: e[n.field.text] || "",
-                    label: n.inputLabel,
-                    placeholder: n.placeholder
-                  }
-                ),
-                /* @__PURE__ */ t.jsx(
-                  st,
-                  {
-                    current: !!e[n.field.switch] || !1,
-                    label: n.switchLabel,
-                    onChange: (m) => {
-                      const v = {
-                        ...e,
-                        [n.field.switch]: m
-                      };
-                      s(v);
-                    }
-                  }
-                )
-              ] });
-            if (n.type === "list")
-              return /* @__PURE__ */ t.jsx(
-                Ge,
-                {
-                  items: e[n.field] || [],
-                  setItems: (m) => {
-                    const v = {
-                      ...e,
-                      [n.field]: m
-                    };
-                    s(v);
-                  },
-                  itemsType: "select",
-                  draggable: n.draggable || !1,
-                  itemsOptions: n.itemsOptions,
-                  deletable: n.deletable || !1,
-                  editable: n.editable || !1,
-                  subtitle: n.label,
-                  addableOptions: n.addableOptions,
-                  modalOptions: n.modalOptions
-                }
-              );
-            if (n.type === "select")
-              return /* @__PURE__ */ t.jsx(
-                et,
-                {
-                  options: n.itemsOptions,
-                  onChange: (m) => {
-                    const v = {
-                      ...e,
-                      [n.field]: m
-                    };
-                    s(v);
-                  },
-                  label: n.label,
-                  value: e[n.field] || "String",
-                  leftAddon: n.leftAddon && n.leftAddon === "icon" && /* @__PURE__ */ t.jsx(b, { name: e[n.field] }),
-                  switcher: n.switcher ? {
-                    value: !!e[n.switcher],
-                    onChange: (m) => {
-                      if (n.switcher === "isActive") {
-                        const v = {
-                          ...e,
-                          [n.switcher]: m
-                        };
-                        s(v);
-                      }
-                    }
-                  } : void 0
-                }
-              );
-          }) })
-        ]
-      }
-    );
-  }
-), Re = "_other_g74jx_1", Fe = "_subtitle_g74jx_7", Ve = "_items_g74jx_14", At = {
-  other: Re,
-  subtitle: Fe,
-  items: Ve
-}, Tt = (d) => {
-  const { items: a, title: e = "Other" } = d;
-  return /* @__PURE__ */ t.jsxs("div", { className: At.other, children: [
-    /* @__PURE__ */ t.jsx("h5", { className: At.subtitle, children: e }),
-    /* @__PURE__ */ t.jsx("div", { className: At.items, children: a.map((s, i) => /* @__PURE__ */ t.jsx(
-      st,
-      {
-        current: s.isItem,
-        onChange: (c) => s.setIsItem(c),
-        label: s.label,
-        hasBackground: !0,
-        paddingless: !1
-      },
-      i
-    )) })
-  ] });
-};
-function Ye({ product: d, children: a }) {
-  const {
-    attributes: e,
-    listeners: s,
-    setNodeRef: i,
-    transform: c,
-    transition: l,
-    isDragging: o
-  } = Ct({
-    id: d.id
-  }), n = {
-    transform: St.Transform.toString(c),
-    transition: l
-  };
-  return /* @__PURE__ */ t.jsx(
-    "div",
-    {
-      ref: i,
-      style: n,
-      className: `${R.product} ${o ? R.dragging : ""}`,
-      ...e,
-      ...s,
-      children: a
-    }
-  );
-}
-const Ge = (d) => {
-  const {
-    isActiveItems: a,
-    setIsActiveItems: e,
-    items: s,
-    setItems: i,
-    other: c,
-    title: l,
-    subtitle: o,
-    editable: n = !0,
-    draggable: m = !1,
-    withImage: v = !1,
-    deletable: f = !0,
-    addable: r = !0,
-    itemsType: k,
-    itemsPlaceholder: p = "",
-    itemsOptions: _,
-    hasRangeSelector: $ = !1,
-    rangeSelectorOptions: L,
-    modalOptions: M,
-    addableOptions: u = {},
-    limit: S,
-    autoInterval: q
-  } = d, [F, B] = g.useState(null), [j, P] = g.useState({
-    top: 0,
-    left: 0
-  }), [x, I] = g.useState(null), w = g.useRef(null), [D, A] = g.useState(!1), U = yt(
-    kt(wt, {
-      activationConstraint: {
-        distance: 5
-      }
-    })
-  );
-  g.useEffect(() => {
-    const h = () => {
-      B(null), A(!1);
-    };
-    return document.body.addEventListener("click", h), B(null), A(!1), () => {
-      B(null), A(!1), document.body.removeEventListener("click", h);
-    };
-  }, []), g.useEffect(() => {
-    if (F) {
-      const h = [...s].map((N) => N.id === F.id ? F : N);
-      i(h);
-    }
-  }, [F]), g.useEffect(() => {
-    if (w.current && x) {
-      const h = w.current.getBoundingClientRect().height, N = window.innerHeight;
-      let O = x.top;
-      O + h > N + window.scrollY - 200 && (O = N + window.scrollY - h - 200), O < 0 && (O = 10), P({
-        top: O,
-        left: x.left
-      });
-    }
-  }, [w.current, x]);
-  const nt = (h, N) => {
-    h.stopPropagation();
-    const O = h.target.getBoundingClientRect();
-    I({
-      top: O.top + window.scrollY - 70,
-      left: O.left - (r ? 30 : 65)
-    }), B(N), A(!0);
-  };
-  function dt(h) {
-    if (v)
-      return h ? /* @__PURE__ */ t.jsx(
-        "img",
-        {
-          src: `https://imagedelivery.net/${h[0]}/w=1000`,
-          alt: "image",
-          width: 16,
-          height: 16
-        }
-      ) : /* @__PURE__ */ t.jsx(
-        b,
-        {
-          name: "Image",
-          width: 16,
-          height: 16,
-          fill: "#757575"
-        }
-      );
-  }
-  const y = (h) => {
-    const { active: N, over: O } = h;
-    if (O && N.id !== O.id) {
-      const H = s.findIndex((z) => z.id === N.id), X = s.findIndex((z) => z.id === O.id);
-      if (H !== -1 && X !== -1) {
-        const z = [...s], [ut] = z.splice(H, 1);
-        z.splice(X, 0, ut), i(z);
-      }
-    }
-  }, E = (h, N) => {
-    var H, X;
-    const O = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      m && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
-        b,
-        {
-          name: "DotsSixVertical",
-          hoverable: !0,
-          width: 20,
-          height: 20
-        }
-      ) }),
-      k === "select" && _ && /* @__PURE__ */ t.jsx(
-        et,
-        {
-          onChange: (z) => {
-            const ut = [...s], pt = _.find((vt) => vt.name["en-US"] === z);
-            if (!pt) return;
-            const mt = ut.map((vt) => vt.id === h.id ? {
-              ...pt,
-              name: {
-                "en-US": z
-              }
-            } : vt);
-            B({
-              ...h,
-              name: {
-                "en-US": z
-              }
-            }), i([...mt]);
-          },
-          value: h.name["en-US"],
-          options: _.filter((z) => !s.find((ut) => ut.name["en-US"] === z.name["en-US"])).map((z) => z.name["en-US"]),
-          leftAddon: dt(h.images)
-        }
-      ),
-      k === "input" && /* @__PURE__ */ t.jsx(
-        tt,
-        {
-          onChange: (z) => {
-            const pt = [...s].map((mt) => mt.id === h.id ? {
-              ...h,
-              name: {
-                "en-US": z
-              }
-            } : mt);
-            i([...pt]);
-          },
-          value: h.name["en-US"],
-          placeholder: p
-        }
-      ),
-      k === "image" && /* @__PURE__ */ t.jsx(
-        bt,
-        {
-          onChange: (z) => {
-            const pt = [...s].map((mt) => mt.id === h.id ? {
-              ...h,
-              images: z
-            } : mt);
-            i([...pt]);
-          },
-          activeImage: (H = s.find((z) => z.id === h.id)) != null && H.images ? (X = s.find((z) => z.id === h.id)) == null ? void 0 : X.images[0] : void 0
-        }
-      ),
-      /* @__PURE__ */ t.jsxs("div", { className: R.buttons, children: [
-        n && /* @__PURE__ */ t.jsx("div", { className: R.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
-          {
-            name: "Sliders",
-            hoverable: !0,
-            width: 20,
-            height: 20,
-            onClick: (z) => {
-              nt(z, h);
-            }
-          }
-        ) }),
-        f && /* @__PURE__ */ t.jsx("div", { className: R.deleteButton, children: /* @__PURE__ */ t.jsx(
-          b,
-          {
-            name: "Trash",
-            hoverable: !0,
-            width: 20,
-            height: 20,
-            fill: "#C12A2A",
-            onClick: () => i(s.filter((z) => z.id !== h.id))
-          }
-        ) })
-      ] })
-    ] });
-    return m ? /* @__PURE__ */ t.jsx(
-      Ye,
-      {
-        product: h,
-        index: N,
-        children: O
-      },
-      h.id
-    ) : /* @__PURE__ */ t.jsx(
-      "div",
-      {
-        className: R.product,
-        children: O
-      },
-      h.id
-    );
-  };
-  return /* @__PURE__ */ t.jsxs("div", { className: R.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
-      l && /* @__PURE__ */ t.jsx("h3", { className: R.title, children: l }),
-      a !== void 0 && /* @__PURE__ */ t.jsx(
-        st,
-        {
-          current: a,
-          onChange: (h) => e == null ? void 0 : e(h)
-        }
-      )
-    ] }),
-    F && n && M && D && /* @__PURE__ */ t.jsx(
-      He,
-      {
-        ref: w,
-        activeItem: F,
-        setActiveItem: B,
-        popupPosition: j,
-        modalOptions: M,
-        setIsOpenModal: A
-      }
-    ),
-    $ && L && /* @__PURE__ */ t.jsx(qt, { ...L }),
-    /* @__PURE__ */ t.jsxs("div", { className: R.products, children: [
-      o && /* @__PURE__ */ t.jsx("h5", { className: R.subtitle, children: o }),
-      m ? /* @__PURE__ */ t.jsx(
-        $t,
-        {
-          sensors: U,
-          onDragEnd: y,
-          children: /* @__PURE__ */ t.jsx(
-            It,
-            {
-              items: s.map((h) => h.id),
-              strategy: Nt,
-              children: s.map((h, N) => E(h, N))
-            }
-          )
-        }
-      ) : s.map((h, N) => E(h, N)),
-      r && /* @__PURE__ */ t.jsx(
-        "div",
-        {
-          style: {
-            width: "100%",
-            display: "flex",
-            justifyContent: "center"
-          },
-          children: /* @__PURE__ */ t.jsx(
-            ot,
-            {
-              withoutHover: !0,
-              className: Y(R.button, {
-                [R.disabled]: !!(S && S <= s.length || s.length === (_ == null ? void 0 : _.length))
-              }),
-              size: "s",
-              disabled: !!(S && S <= s.length || s.length === (_ == null ? void 0 : _.length)),
-              onClick: () => {
-                const h = [...s];
-                let N = null;
-                if (_) {
-                  for (let O = 0; O < _.length; O++)
-                    if (!s.find((H) => H.id === _[O].id)) {
-                      N = _[O];
-                      break;
-                    }
-                }
-                k === "select" && _ ? h.push({
-                  name: N ? N.name : _[0].name,
-                  id: (N == null ? void 0 : N.id) || _[0].id,
-                  ...u
-                }) : k === "input" ? h.push({
-                  name: {
-                    "en-US": ""
-                  },
-                  id: _t(),
-                  ...u
-                }) : h.push({
-                  name: {
-                    "en-US": `Image ${s.length + 1}`
-                  },
-                  id: _t(),
-                  ...u
-                }), i(h);
-              },
-              style: {
-                width: "fit-content"
-              },
-              children: /* @__PURE__ */ t.jsxs("div", { className: R.addButton, children: [
-                /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
-                /* @__PURE__ */ t.jsx(
-                  b,
-                  {
-                    name: "Plus",
-                    width: 16,
-                    height: 16
-                  }
-                )
-              ] })
-            }
-          )
-        }
-      )
-    ] }),
-    c !== void 0 && /* @__PURE__ */ t.jsx(Tt, { items: c }),
-    q !== void 0 && /* @__PURE__ */ t.jsx(
-      tt,
-      {
-        label: q.title || "Auto scroll interval",
-        type: "number",
-        value: String(q.autoInterval),
-        onChange: (h) => q.setAutoInterval(Number(h)),
-        min: 0.1,
-        max: 100,
-        style: {
-          width: "100%"
-        },
-        postfix: "sec."
-      }
-    )
-  ] });
-}, Xe = "_title_82zux_1", We = "_subtitle_82zux_5", Je = "_header_82zux_12", Qe = "_text_82zux_13", Ke = "_productsBlock_82zux_14", Ze = "_top_82zux_26", ts = "_itemsBlock_82zux_35", es = "_typeTexts_82zux_41", ss = "_block_82zux_48", ns = "_active_82zux_61", is = "_products_82zux_14", os = "_product_82zux_14", as = "_button_82zux_80", cs = "_disabled_82zux_91", ls = "_image_82zux_95", rs = "_info_82zux_102", ds = "_name_82zux_114", us = "_buttons_82zux_118", ms = "_modal_82zux_125", _s = "_link_82zux_145", ps = "_modalOptions_82zux_151", hs = "_addButton_82zux_157", gs = "_deleteButton_82zux_179", Z = {
-  title: Xe,
-  subtitle: We,
-  header: Je,
-  text: Qe,
-  productsBlock: Ke,
-  top: Ze,
-  itemsBlock: ts,
-  typeTexts: es,
-  block: ss,
-  active: ns,
-  products: is,
-  product: os,
-  button: as,
-  disabled: cs,
-  image: ls,
-  info: rs,
-  name: ds,
-  buttons: us,
-  modal: ms,
-  link: _s,
-  modalOptions: ps,
-  addButton: hs,
-  deleteButton: gs
-}, Ja = (d) => {
+}, Xt = "_title_82zux_1", Qt = "_subtitle_82zux_5", Jt = "_header_82zux_12", Kt = "_text_82zux_13", Zt = "_productsBlock_82zux_14", te = "_top_82zux_26", ee = "_itemsBlock_82zux_35", se = "_typeTexts_82zux_41", ne = "_block_82zux_48", ie = "_active_82zux_61", oe = "_products_82zux_14", ae = "_product_82zux_14", ce = "_button_82zux_80", le = "_disabled_82zux_91", re = "_image_82zux_95", de = "_info_82zux_102", ue = "_name_82zux_114", pe = "_buttons_82zux_118", me = "_modal_82zux_125", _e = "_link_82zux_145", he = "_modalOptions_82zux_151", ge = "_addButton_82zux_157", xe = "_deleteButton_82zux_179", G = {
+  title: Xt,
+  subtitle: Qt,
+  header: Jt,
+  text: Kt,
+  productsBlock: Zt,
+  top: te,
+  itemsBlock: ee,
+  typeTexts: se,
+  block: ne,
+  active: ie,
+  products: oe,
+  product: ae,
+  button: ce,
+  disabled: le,
+  image: re,
+  info: de,
+  name: ue,
+  buttons: pe,
+  modal: me,
+  link: _e,
+  modalOptions: he,
+  addButton: ge,
+  deleteButton: xe
+}, Di = (u) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
-    setItems: i,
-    other: c,
-    title: l,
-    subtitle: o,
-    draggable: n = !1,
-    withImage: m = !1,
-    addable: v = !0,
-    itemsOptions: f,
-    hasRangeSelector: r = !1,
-    rangeSelectorOptions: k,
-    limit: p,
-    autoScrollInterval: _,
-    deletable: $
-  } = d;
-  function L(u) {
-    if (m)
-      return u ? /* @__PURE__ */ t.jsx(
+    setItems: n,
+    other: r,
+    title: c,
+    subtitle: a,
+    draggable: _ = !1,
+    withImage: N = !1,
+    addable: B = !0,
+    itemsOptions: h,
+    hasRangeSelector: i = !1,
+    rangeSelectorOptions: j,
+    limit: d,
+    autoScrollInterval: f,
+    deletable: y
+  } = u;
+  function D(l) {
+    if (N)
+      return l ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${u[0]}/w=1000`,
+          src: `https://imagedelivery.net/${l[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
@@ -903,11 +204,11 @@ const Ge = (d) => {
         }
       );
   }
-  const M = (u, S = !1) => {
-    const q = f.find((B) => B.id === u);
-    if (!q) return;
-    const F = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      n && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+  const A = (l, C = !1) => {
+    const M = h.find((w) => w.id === l);
+    if (!M) return;
+    const V = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -917,20 +218,20 @@ const Ge = (d) => {
         }
       ) }),
       /* @__PURE__ */ t.jsx(
-        et,
+        ct,
         {
-          onChange: (B) => {
-            const j = [...s], P = f.find((w) => w.name === B);
-            if (!P) return;
-            const x = P.id, I = j.map((w) => w === u ? x : w);
-            i([...I]);
+          onChange: (w) => {
+            const m = [...s], S = h.find((I) => I.name === w);
+            if (!S) return;
+            const p = S.id, v = m.map((I) => I === l ? p : I);
+            n([...v]);
           },
-          value: q.name,
-          options: f.filter((B) => !s.find((j) => j === B.id)).map((B) => B.name),
-          leftAddon: L(q.images)
+          value: M.name,
+          options: h.filter((w) => !s.find((m) => m === w.id)).map((w) => w.name),
+          leftAddon: D(M.images)
         }
       ),
-      S && /* @__PURE__ */ t.jsx("div", { className: Z.buttons, children: /* @__PURE__ */ t.jsx("div", { className: Z.deleteButton, children: /* @__PURE__ */ t.jsx(
+      C && /* @__PURE__ */ t.jsx("div", { className: G.buttons, children: /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "Trash",
@@ -938,35 +239,35 @@ const Ge = (d) => {
           width: 20,
           height: 20,
           fill: "#C12A2A",
-          onClick: () => i(s.filter((B) => B !== u))
+          onClick: () => n(s.filter((w) => w !== l))
         }
       ) }) })
     ] });
     return /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: Z.product,
-        children: F
+        className: G.product,
+        children: V
       },
-      u
+      l
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: Z.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Z.top, children: [
-      l && /* @__PURE__ */ t.jsx("h3", { className: Z.title, children: l }),
-      a !== void 0 && /* @__PURE__ */ t.jsx(
-        st,
+  return /* @__PURE__ */ t.jsxs("div", { className: G.productsBlock, children: [
+    (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
+      c && /* @__PURE__ */ t.jsx("h3", { className: G.title, children: c }),
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        at,
         {
-          current: a,
-          onChange: (u) => e == null ? void 0 : e(u)
+          current: o,
+          onChange: (l) => e == null ? void 0 : e(l)
         }
       )
     ] }),
-    r && k && /* @__PURE__ */ t.jsx(qt, { ...k }),
-    /* @__PURE__ */ t.jsxs("div", { className: Z.products, children: [
-      o && /* @__PURE__ */ t.jsx("h5", { className: Z.subtitle, children: o }),
-      s.map((u) => M(u, $)),
-      v && /* @__PURE__ */ t.jsx(
+    i && j && /* @__PURE__ */ t.jsx(kt, { ...j }),
+    /* @__PURE__ */ t.jsxs("div", { className: G.products, children: [
+      a && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: a }),
+      s.map((l) => A(l, y)),
+      B && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -976,30 +277,30 @@ const Ge = (d) => {
             gap: 5
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            et,
             {
               withoutHover: !0,
-              className: Y(Z.button, {
-                [Z.disabled]: !!(p && p <= s.length || s.length === f.length)
+              className: H(G.button, {
+                [G.disabled]: !!(d && d <= s.length || s.length === h.length)
               }),
               size: "s",
-              disabled: !!(p && p <= s.length || s.length === f.length),
+              disabled: !!(d && d <= s.length || s.length === h.length),
               onClick: () => {
-                const u = [...s];
-                let S = null;
-                if (f) {
-                  for (let q = 0; q < f.length; q++)
-                    if (!s.find((F) => F === f[q].id)) {
-                      S = f[q];
+                const l = [...s];
+                let C = null;
+                if (h) {
+                  for (let M = 0; M < h.length; M++)
+                    if (!s.find((V) => V === h[M].id)) {
+                      C = h[M];
                       break;
                     }
                 }
-                u.push((S == null ? void 0 : S.id) || f[0].id), i(u);
+                l.push((C == null ? void 0 : C.id) || h[0].id), n(l);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: Z.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: G.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
                   b,
@@ -1015,14 +316,14 @@ const Ge = (d) => {
         }
       )
     ] }),
-    c !== void 0 && /* @__PURE__ */ t.jsx(Tt, { items: c }),
-    _ !== void 0 && /* @__PURE__ */ t.jsx(
-      tt,
+    r !== void 0 && /* @__PURE__ */ t.jsx(pt, { items: r }),
+    f !== void 0 && /* @__PURE__ */ t.jsx(
+      ut,
       {
         label: "Auto scroll interval",
         type: "number",
-        value: String(_.scrollInterval),
-        onChange: (u) => _.setScrollInterval(Number(u)),
+        value: String(f.scrollInterval),
+        onChange: (l) => f.setScrollInterval(Number(l)),
         min: 0.1,
         max: 100,
         style: {
@@ -1032,108 +333,108 @@ const Ge = (d) => {
       }
     )
   ] });
-}, fs = "_title_roi3a_1", xs = "_subtitle_roi3a_5", bs = "_header_roi3a_12", vs = "_text_roi3a_13", js = "_productsBlock_roi3a_14", ys = "_top_roi3a_26", ks = "_itemsBlock_roi3a_35", $s = "_typeTexts_roi3a_41", Is = "_block_roi3a_48", Ns = "_active_roi3a_61", ws = "_products_roi3a_14", Cs = "_product_roi3a_14", Ss = "_button_roi3a_80", Bs = "_disabled_roi3a_91", Ts = "_image_roi3a_95", Ps = "_info_roi3a_102", As = "_name_roi3a_114", Os = "_buttons_roi3a_118", Ms = "_modal_roi3a_125", qs = "_link_roi3a_145", zs = "_modalOptions_roi3a_151", Es = "_addButton_roi3a_164", Us = "_deleteButton_roi3a_179", Ds = "_closeIcon_roi3a_191", J = {
-  title: fs,
-  subtitle: xs,
-  header: bs,
-  text: vs,
-  productsBlock: js,
-  top: ys,
-  itemsBlock: ks,
-  typeTexts: $s,
-  block: Is,
-  active: Ns,
-  products: ws,
-  product: Cs,
-  button: Ss,
-  disabled: Bs,
-  image: Ts,
-  info: Ps,
-  name: As,
-  buttons: Os,
-  modal: Ms,
-  link: qs,
-  modalOptions: zs,
-  addButton: Es,
-  deleteButton: Us,
-  closeIcon: Ds
+}, fe = "_title_roi3a_1", be = "_subtitle_roi3a_5", ve = "_header_roi3a_12", je = "_text_roi3a_13", ye = "_productsBlock_roi3a_14", ke = "_top_roi3a_26", Ne = "_itemsBlock_roi3a_35", Ie = "_typeTexts_roi3a_41", $e = "_block_roi3a_48", Se = "_active_roi3a_61", Ce = "_products_roi3a_14", we = "_product_roi3a_14", Be = "_button_roi3a_80", Pe = "_disabled_roi3a_91", Me = "_image_roi3a_95", Te = "_info_roi3a_102", qe = "_name_roi3a_114", Ae = "_buttons_roi3a_118", Oe = "_modal_roi3a_125", Ee = "_link_roi3a_145", ze = "_modalOptions_roi3a_151", De = "_addButton_roi3a_164", Re = "_deleteButton_roi3a_179", He = "_closeIcon_roi3a_191", L = {
+  title: fe,
+  subtitle: be,
+  header: ve,
+  text: je,
+  productsBlock: ye,
+  top: ke,
+  itemsBlock: Ne,
+  typeTexts: Ie,
+  block: $e,
+  active: Se,
+  products: Ce,
+  product: we,
+  button: Be,
+  disabled: Pe,
+  image: Me,
+  info: Te,
+  name: qe,
+  buttons: Ae,
+  modal: Oe,
+  link: Ee,
+  modalOptions: ze,
+  addButton: De,
+  deleteButton: Re,
+  closeIcon: He
 };
-function Ls({ product: d, children: a }) {
+function Le({ product: u, children: o }) {
   const {
     attributes: e,
     listeners: s,
-    setNodeRef: i,
-    transform: c,
-    transition: l,
-    isDragging: o
-  } = Ct({
-    id: d.id
-  }), n = {
-    transform: St.Transform.toString(c),
-    transition: l
+    setNodeRef: n,
+    transform: r,
+    transition: c,
+    isDragging: a
+  } = bt({
+    id: u.id
+  }), _ = {
+    transform: vt.Transform.toString(r),
+    transition: c
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: i,
-      style: n,
-      className: `${J.product} ${o ? J.dragging : ""}`,
+      ref: n,
+      style: _,
+      className: `${L.product} ${a ? L.dragging : ""}`,
       ...e,
       ...s,
-      children: a
+      children: o
     }
   );
 }
-const Qa = (d) => {
+const Ri = (u) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
-    setItems: i,
-    title: c,
-    subtitle: l,
-    editable: o = !0,
-    draggable: n = !1,
-    deletable: m = !0,
-    addable: v = !0,
-    itemsType: f,
-    itemsOptions: r,
-    addableOptions: k = {},
-    limit: p
-  } = d, [_, $] = g.useState(null), [L, M] = g.useState(null), u = g.useRef(null), S = yt(
-    kt(wt, {
+    setItems: n,
+    title: r,
+    subtitle: c,
+    editable: a = !0,
+    draggable: _ = !1,
+    deletable: N = !0,
+    addable: B = !0,
+    itemsType: h,
+    itemsOptions: i,
+    addableOptions: j = {},
+    limit: d
+  } = u, [f, y] = x.useState(null), [D, A] = x.useState(null), l = x.useRef(null), C = mt(
+    _t(ht, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  g.useEffect(() => {
-    if (_) {
-      const j = [...s].map((P) => P.id === _.id ? _ : P);
-      i(j);
+  x.useEffect(() => {
+    if (f) {
+      const m = [...s].map((S) => S.id === f.id ? f : S);
+      n(m);
     }
-  }, [_]), g.useEffect(() => {
-    u.current && L && (u.current.getBoundingClientRect().height, L.top);
-  }, [u.current, L]);
-  const q = (j, P) => {
-    j.stopPropagation();
-    const x = j.target.getBoundingClientRect();
-    M({
-      top: x.top + window.scrollY,
-      left: x.left - 30
-    }), $(P);
-  }, F = (j) => {
-    const { active: P, over: x } = j;
-    if (x && P.id !== x.id) {
-      const I = s.findIndex((D) => D.id === P.id), w = s.findIndex((D) => D.id === x.id);
-      if (I !== -1 && w !== -1) {
-        const D = [...s], [A] = D.splice(I, 1);
-        D.splice(w, 0, A), i(D);
+  }, [f]), x.useEffect(() => {
+    l.current && D && (l.current.getBoundingClientRect().height, D.top);
+  }, [l.current, D]);
+  const M = (m, S) => {
+    m.stopPropagation();
+    const p = m.target.getBoundingClientRect();
+    A({
+      top: p.top + window.scrollY,
+      left: p.left - 30
+    }), y(S);
+  }, V = (m) => {
+    const { active: S, over: p } = m;
+    if (p && S.id !== p.id) {
+      const v = s.findIndex((O) => O.id === S.id), I = s.findIndex((O) => O.id === p.id);
+      if (v !== -1 && I !== -1) {
+        const O = [...s], [P] = O.splice(v, 1);
+        O.splice(I, 0, P), n(O);
       }
     }
-  }, B = (j, P) => {
-    const x = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      n && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+  }, w = (m, S) => {
+    const p = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      _ && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -1142,41 +443,41 @@ const Qa = (d) => {
           height: 20
         }
       ) }),
-      f === "select" && r && /* @__PURE__ */ t.jsx(
-        et,
+      h === "select" && i && /* @__PURE__ */ t.jsx(
+        ct,
         {
-          onChange: (I) => {
-            const w = [...s], D = r.find((U) => U.name === I);
-            if (!D) return;
-            const A = w.map((U) => U.id === j.id ? {
-              ...D,
+          onChange: (v) => {
+            const I = [...s], O = i.find((T) => T.name === v);
+            if (!O) return;
+            const P = I.map((T) => T.id === m.id ? {
+              ...O,
               name: {
-                "en-US": I
+                "en-US": v
               }
-            } : U);
-            $({
-              ...j,
+            } : T);
+            y({
+              ...m,
               name: {
-                "en-US": I
+                "en-US": v
               }
-            }), i([...A]);
+            }), n([...P]);
           },
-          value: j.name,
-          options: r.filter((I) => !s.find((w) => w.name === I.name)).map((I) => I.name)
+          value: m.name,
+          options: i.filter((v) => !s.find((I) => I.name === v.name)).map((v) => v.name)
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: J.buttons, children: [
-        o && /* @__PURE__ */ t.jsx("div", { className: J.deleteButton, children: /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ t.jsxs("div", { className: L.buttons, children: [
+        a && /* @__PURE__ */ t.jsx("div", { className: L.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (I) => q(I, j)
+            onClick: (v) => M(v, m)
           }
         ) }),
-        m && /* @__PURE__ */ t.jsx("div", { className: J.deleteButton, children: /* @__PURE__ */ t.jsx(
+        N && /* @__PURE__ */ t.jsx("div", { className: L.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Trash",
@@ -1184,57 +485,57 @@ const Qa = (d) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(s.filter((I) => I.id !== j.id))
+            onClick: () => n(s.filter((v) => v.id !== m.id))
           }
         ) })
       ] })
     ] });
-    return n ? /* @__PURE__ */ t.jsx(
-      Ls,
+    return _ ? /* @__PURE__ */ t.jsx(
+      Le,
       {
-        product: j,
-        index: P,
-        children: x
+        product: m,
+        index: S,
+        children: p
       },
-      j.id
+      m.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: J.product,
-        children: x
+        className: L.product,
+        children: p
       },
-      j.id
+      m.id
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: J.productsBlock, children: [
-    (c || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: J.top, children: [
-      c && /* @__PURE__ */ t.jsx("h3", { className: J.title, children: c }),
-      a !== void 0 && /* @__PURE__ */ t.jsx(
-        st,
+  return /* @__PURE__ */ t.jsxs("div", { className: L.productsBlock, children: [
+    (r || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: L.top, children: [
+      r && /* @__PURE__ */ t.jsx("h3", { className: L.title, children: r }),
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        at,
         {
-          current: a,
-          onChange: (j) => e == null ? void 0 : e(j)
+          current: o,
+          onChange: (m) => e == null ? void 0 : e(m)
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: J.products, children: [
-      l && /* @__PURE__ */ t.jsx("h5", { className: J.subtitle, children: l }),
-      n ? /* @__PURE__ */ t.jsx(
-        $t,
+    /* @__PURE__ */ t.jsxs("div", { className: L.products, children: [
+      c && /* @__PURE__ */ t.jsx("h5", { className: L.subtitle, children: c }),
+      _ ? /* @__PURE__ */ t.jsx(
+        gt,
         {
-          sensors: S,
-          onDragEnd: F,
+          sensors: C,
+          onDragEnd: V,
           children: /* @__PURE__ */ t.jsx(
-            It,
+            xt,
             {
-              items: s.map((j) => j.id),
-              strategy: Nt,
-              children: s.map((j, P) => B(j, P))
+              items: s.map((m) => m.id),
+              strategy: ft,
+              children: s.map((m, S) => w(m, S))
             }
           )
         }
-      ) : s.map((j, P) => B(j, P)),
-      v && /* @__PURE__ */ t.jsx(
+      ) : s.map((m, S) => w(m, S)),
+      B && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -1243,34 +544,34 @@ const Qa = (d) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            et,
             {
               withoutHover: !0,
-              className: Y(J.button, {
-                [J.disabled]: !!(p && p <= s.length || s.length === (r == null ? void 0 : r.length))
+              className: H(L.button, {
+                [L.disabled]: !!(d && d <= s.length || s.length === (i == null ? void 0 : i.length))
               }),
               size: "s",
-              disabled: !!(p && p <= s.length || s.length === (r == null ? void 0 : r.length)),
+              disabled: !!(d && d <= s.length || s.length === (i == null ? void 0 : i.length)),
               onClick: () => {
-                const j = [...s];
-                let P = null;
-                if (r) {
-                  for (let x = 0; x < r.length; x++)
-                    if (!s.find((I) => I.id === r[x].id)) {
-                      P = r[x];
+                const m = [...s];
+                let S = null;
+                if (i) {
+                  for (let p = 0; p < i.length; p++)
+                    if (!s.find((v) => v.id === i[p].id)) {
+                      S = i[p];
                       break;
                     }
                 }
-                f === "select" && r && j.push({
-                  name: P ? P.name : r[0].name,
-                  id: (P == null ? void 0 : P.id) || r[0].id,
-                  ...k
-                }), i(j);
+                h === "select" && i && m.push({
+                  name: S ? S.name : i[0].name,
+                  id: (S == null ? void 0 : S.id) || i[0].id,
+                  ...j
+                }), n(m);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: J.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: L.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
                   b,
@@ -1287,269 +588,93 @@ const Qa = (d) => {
       )
     ] })
   ] });
-}, Hs = "_title_5iipd_1", Rs = "_subtitle_5iipd_5", Fs = "_header_5iipd_12", Vs = "_text_5iipd_13", Ys = "_productsBlock_5iipd_14", Gs = "_top_5iipd_26", Xs = "_itemsBlock_5iipd_35", Ws = "_typeTexts_5iipd_41", Js = "_block_5iipd_48", Qs = "_active_5iipd_61", Ks = "_products_5iipd_14", Zs = "_product_5iipd_14", tn = "_button_5iipd_80", en = "_disabled_5iipd_91", sn = "_image_5iipd_95", nn = "_info_5iipd_102", on = "_name_5iipd_114", an = "_buttons_5iipd_118", cn = "_modal_5iipd_125", ln = "_link_5iipd_146", rn = "_modalOptions_5iipd_152", dn = "_addButton_5iipd_165", un = "_deleteButton_5iipd_180", mn = "_closeIcon_5iipd_192", V = {
-  title: Hs,
-  subtitle: Rs,
-  header: Fs,
-  text: Vs,
-  productsBlock: Ys,
-  top: Gs,
-  itemsBlock: Xs,
-  typeTexts: Ws,
-  block: Js,
-  active: Qs,
-  products: Ks,
-  product: Zs,
-  button: tn,
-  disabled: en,
-  image: sn,
-  info: nn,
-  name: on,
-  buttons: an,
-  modal: cn,
-  link: ln,
-  modalOptions: rn,
-  addButton: dn,
-  deleteButton: un,
-  closeIcon: mn
-}, _n = g.forwardRef(
-  (d, a) => {
-    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: c, setIsOpenModal: l } = d;
-    return /* @__PURE__ */ t.jsxs(
-      "div",
-      {
-        ref: a,
-        className: V.modal,
-        onClick: (o) => {
-          o.stopPropagation();
-        },
-        style: {
-          top: `${i.top}px`,
-          left: `${i.left}px`
-        },
-        children: [
-          /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
-            /* @__PURE__ */ t.jsx("h3", { className: V.title, children: e.name["en-US"] }),
-            /* @__PURE__ */ t.jsx("div", { className: V.closeIcon, children: /* @__PURE__ */ t.jsx(
-              b,
-              {
-                name: "X",
-                height: 20,
-                width: 20,
-                hoverable: !0,
-                onClick: () => {
-                  s(null), l(!1);
-                }
-              }
-            ) })
-          ] }),
-          /* @__PURE__ */ t.jsx("div", { className: V.modalOptions, children: c.map((o) => {
-            if (o.type === "image")
-              return /* @__PURE__ */ t.jsx(
-                bt,
-                {
-                  label: "Put up an attractive image",
-                  activeImage: e[o.field],
-                  onChange: (n) => {
-                    const m = {
-                      ...e,
-                      [o.field]: n
-                    };
-                    s(m);
-                  }
-                },
-                String(o.field)
-              );
-            if (o.type === "text")
-              return /* @__PURE__ */ t.jsx(
-                Ht,
-                {
-                  typesText: e[o.field.type],
-                  setTypesText: (n) => {
-                    const m = {
-                      ...e,
-                      [o.field.type]: n
-                    };
-                    s(m);
-                  },
-                  text: e[o.field.text]["en-US"] || "",
-                  setText: (n) => {
-                    const m = {
-                      ...e,
-                      [o.field.text]: {
-                        "en-US": n
-                      }
-                    };
-                    s(m);
-                  },
-                  typeFont: e[o.field.type],
-                  setTypeFont: (n) => {
-                    const m = {
-                      ...e,
-                      [o.field.type]: n
-                    };
-                    s(m);
-                  },
-                  subtitle: o.label
-                }
-              );
-            if (o.type === "input")
-              return /* @__PURE__ */ t.jsx(
-                tt,
-                {
-                  onChange: (n) => {
-                    const m = {
-                      ...e,
-                      [o.field]: n
-                    };
-                    s(m);
-                  },
-                  value: e[o.field] || "",
-                  label: o.label,
-                  placeholder: o.placeholder
-                }
-              );
-            if (o.type === "inputSwitch")
-              return /* @__PURE__ */ t.jsxs("div", { className: V.link, children: [
-                /* @__PURE__ */ t.jsx(
-                  tt,
-                  {
-                    onChange: (n) => {
-                      const m = {
-                        ...e,
-                        [o.field.text]: n
-                      };
-                      s(m);
-                    },
-                    value: e[o.field.text] || "",
-                    label: o.inputLabel,
-                    placeholder: o.placeholder
-                  }
-                ),
-                /* @__PURE__ */ t.jsx(
-                  st,
-                  {
-                    current: !!e[o.field.switch] || !1,
-                    label: o.switchLabel,
-                    onChange: (n) => {
-                      const m = {
-                        ...e,
-                        [o.field.switch]: n
-                      };
-                      s(m);
-                    }
-                  }
-                )
-              ] });
-            if (o.type === "select")
-              return /* @__PURE__ */ t.jsx(
-                et,
-                {
-                  options: o.itemsOptions,
-                  onChange: (n) => {
-                    const m = {
-                      ...e,
-                      [o.field]: n
-                    };
-                    s(m);
-                  },
-                  label: o.label,
-                  value: e[o.field] || "String",
-                  leftAddon: o.leftAddon && o.leftAddon === "icon" && /* @__PURE__ */ t.jsx(b, { name: e[o.field] })
-                }
-              );
-          }) })
-        ]
-      }
-    );
-  }
-);
-function pn(d) {
-  const { product: a, children: e } = d, { attributes: s, listeners: i, setNodeRef: c, transform: l, transition: o, isDragging: n } = Ct({
-    id: a.id
-  }), m = {
-    transform: St.Transform.toString(l),
-    transition: o
+};
+function Ue(u) {
+  const { product: o, children: e } = u, { attributes: s, listeners: n, setNodeRef: r, transform: c, transition: a, isDragging: _ } = bt({
+    id: o.id
+  }), N = {
+    transform: vt.Transform.toString(c),
+    transition: a
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: c,
-      style: m,
-      className: `${V.product} ${n ? V.dragging : ""}`,
+      ref: r,
+      style: N,
+      className: `${F.product} ${_ ? F.dragging : ""}`,
       ...s,
-      ...i,
+      ...n,
       children: e
     }
   );
 }
-const Ka = (d) => {
+const Hi = (u) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
-    setItems: i,
-    other: c,
-    title: l,
-    subtitle: o,
-    editable: n = !0,
-    draggable: m = !1,
-    withImage: v = !1,
-    deletable: f = !0,
-    addable: r = !0,
-    itemsType: k,
-    itemsPlaceholder: p = "",
-    itemsOptions: _,
-    hasRangeSelector: $ = !1,
-    rangeSelectorOptions: L,
-    modalOptions: M,
-    addableOptions: u = {}
-  } = d, [S, q] = g.useState(null), [F, B] = g.useState({
+    setItems: n,
+    other: r,
+    title: c,
+    subtitle: a,
+    editable: _ = !0,
+    draggable: N = !1,
+    withImage: B = !1,
+    deletable: h = !0,
+    addable: i = !0,
+    itemsType: j,
+    itemsPlaceholder: d = "",
+    itemsOptions: f,
+    hasRangeSelector: y = !1,
+    rangeSelectorOptions: D,
+    modalOptions: A,
+    addableOptions: l = {}
+  } = u, [C, M] = x.useState(null), [V, w] = x.useState({
     top: 0,
     left: 0
-  }), [j, P] = g.useState(null), x = g.useRef(null), [I, w] = g.useState(!1), D = yt(
-    kt(wt, {
+  }), [m, S] = x.useState(null), p = x.useRef(null), [v, I] = x.useState(!1), O = mt(
+    _t(ht, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  g.useEffect(() => {
-    const y = () => {
-      q(null), w(!1);
+  x.useEffect(() => {
+    const g = () => {
+      M(null), I(!1);
     };
-    return document.body.addEventListener("click", y), q(null), w(!1), () => {
-      q(null), w(!1), document.body.removeEventListener("click", y);
+    return document.body.addEventListener("click", g), M(null), I(!1), () => {
+      M(null), I(!1), document.body.removeEventListener("click", g);
     };
-  }, []), g.useEffect(() => {
-    if (S) {
-      const y = [...s].map((E) => E.id === S.id ? S : E);
-      i(y);
+  }, []), x.useEffect(() => {
+    if (C) {
+      const g = [...s].map((q) => q.id === C.id ? C : q);
+      n(g);
     }
-  }, [S]), g.useEffect(() => {
-    if (x.current && j) {
-      const y = x.current.getBoundingClientRect().height, E = window.innerHeight;
-      let h = j.top;
-      h + y > E + window.scrollY - 200 && (h = E + window.scrollY - y - 200), h < 0 && (h = 10), B({
-        top: h,
-        left: j.left
+  }, [C]), x.useEffect(() => {
+    if (p.current && m) {
+      const g = p.current.getBoundingClientRect().height, q = window.innerHeight;
+      let E = m.top;
+      E + g > q + window.scrollY - 200 && (E = q + window.scrollY - g - 200), E < 0 && (E = 10), w({
+        top: E,
+        left: m.left
       });
     }
-  }, [x.current, j]);
-  const A = (y, E) => {
-    y.stopPropagation();
-    const h = y.target.getBoundingClientRect();
-    P({
-      top: h.top + window.scrollY,
-      left: h.left - 30
-    }), q(E), w(!0);
+  }, [p.current, m]);
+  const P = (g, q) => {
+    g.stopPropagation();
+    const E = g.target.getBoundingClientRect();
+    S({
+      top: E.top + window.scrollY,
+      left: E.left - 30
+    }), M(q), I(!0);
   };
-  function U(y) {
-    if (v)
-      return y ? /* @__PURE__ */ t.jsx(
+  function T(g) {
+    if (B)
+      return g ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${y[0]}/w=1000`,
+          src: `https://imagedelivery.net/${g[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
@@ -1564,19 +689,19 @@ const Ka = (d) => {
         }
       );
   }
-  const nt = (y) => {
-    const { active: E, over: h } = y;
-    if (h && E.id !== h.id) {
-      const N = s.findIndex((H) => H.id === E.id), O = s.findIndex((H) => H.id === h.id);
-      if (N !== -1 && O !== -1) {
-        const H = [...s], [X] = H.splice(N, 1);
-        H.splice(O, 0, X), i(H);
+  const J = (g) => {
+    const { active: q, over: E } = g;
+    if (E && q.id !== E.id) {
+      const z = s.findIndex((U) => U.id === q.id), st = s.findIndex((U) => U.id === E.id);
+      if (z !== -1 && st !== -1) {
+        const U = [...s], [X] = U.splice(z, 1);
+        U.splice(st, 0, X), n(U);
       }
     }
-  }, dt = (y) => {
-    var h;
-    const E = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      m && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+  }, nt = (g) => {
+    var E;
+    const q = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      N && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -1585,71 +710,71 @@ const Ka = (d) => {
           height: 20
         }
       ) }),
-      k === "select" && _ && /* @__PURE__ */ t.jsx(
-        et,
+      j === "select" && f && /* @__PURE__ */ t.jsx(
+        ct,
         {
-          onChange: (N) => {
-            const H = [...s].map((X) => X.id === y.id ? {
-              ...y,
+          onChange: (z) => {
+            const U = [...s].map((X) => X.id === g.id ? {
+              ...g,
               name: {
-                "en-US": N
+                "en-US": z
               }
             } : X);
-            q({
-              ...y,
+            M({
+              ...g,
               name: {
-                "en-US": N
+                "en-US": z
               }
-            }), i([...H]);
+            }), n([...U]);
           },
-          value: y.name["en-US"],
-          options: _.filter(
-            (N) => !s.find((O) => O.name["en-US"] === N)
+          value: g.name["en-US"],
+          options: f.filter(
+            (z) => !s.find((st) => st.name["en-US"] === z)
           ),
-          leftAddon: U(y.images)
+          leftAddon: T(g.images)
         }
       ),
-      k === "input" && /* @__PURE__ */ t.jsx(
-        tt,
+      j === "input" && /* @__PURE__ */ t.jsx(
+        ut,
         {
-          onChange: (N) => {
-            const H = [...s].map((X) => X.id === y.id ? {
-              ...y,
+          onChange: (z) => {
+            const U = [...s].map((X) => X.id === g.id ? {
+              ...g,
               name: {
-                "en-US": N
+                "en-US": z
               }
             } : X);
-            i([...H]);
+            n([...U]);
           },
-          value: y.name["en-US"],
-          placeholder: p
+          value: g.name["en-US"],
+          placeholder: d
         }
       ),
-      k === "image" && /* @__PURE__ */ t.jsx(
-        bt,
+      j === "image" && /* @__PURE__ */ t.jsx(
+        Nt,
         {
-          onChange: (N) => {
-            const H = [...s].map((X) => X.id === y.id ? {
-              ...y,
-              images: N
+          onChange: (z) => {
+            const U = [...s].map((X) => X.id === g.id ? {
+              ...g,
+              images: z
             } : X);
-            i([...H]);
+            n([...U]);
           },
-          activeImage: (h = s.find((N) => N.id === y.id)) == null ? void 0 : h.images[0]
+          activeImage: (E = s.find((z) => z.id === g.id)) == null ? void 0 : E.images[0]
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: V.buttons, children: [
-        n && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ t.jsxs("div", { className: F.buttons, children: [
+        _ && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (N) => A(N, y)
+            onClick: (z) => P(z, g)
           }
         ) }),
-        f && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
+        h && /* @__PURE__ */ t.jsx("div", { className: F.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Trash",
@@ -1657,68 +782,68 @@ const Ka = (d) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(s.filter((N) => N.id !== y.id))
+            onClick: () => n(s.filter((z) => z.id !== g.id))
           }
         ) })
       ] })
     ] });
-    return m ? /* @__PURE__ */ t.jsx(
-      pn,
+    return N ? /* @__PURE__ */ t.jsx(
+      Ue,
       {
-        product: y,
-        children: E
+        product: g,
+        children: q
       },
-      y.id
+      g.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: V.product,
-        children: E
+        className: F.product,
+        children: q
       },
-      y.id
+      g.id
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: V.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
-      l && /* @__PURE__ */ t.jsx("h3", { className: V.title, children: l }),
-      a !== void 0 && /* @__PURE__ */ t.jsx(
-        st,
+  return /* @__PURE__ */ t.jsxs("div", { className: F.productsBlock, children: [
+    (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: F.top, children: [
+      c && /* @__PURE__ */ t.jsx("h3", { className: F.title, children: c }),
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        at,
         {
-          current: a,
-          onChange: (y) => e == null ? void 0 : e(y)
+          current: o,
+          onChange: (g) => e == null ? void 0 : e(g)
         }
       )
     ] }),
-    S && n && M && I && /* @__PURE__ */ t.jsx(
-      _n,
+    C && _ && A && v && /* @__PURE__ */ t.jsx(
+      Bt,
       {
-        ref: x,
-        activeItem: S,
-        setActiveItem: q,
-        popupPosition: F,
-        modalOptions: M,
-        setIsOpenModal: w
+        ref: p,
+        activeItem: C,
+        setActiveItem: M,
+        popupPosition: V,
+        modalOptions: A,
+        setIsOpenModal: I
       }
     ),
-    $ && L && /* @__PURE__ */ t.jsx(qt, { ...L }),
-    /* @__PURE__ */ t.jsxs("div", { className: V.products, children: [
-      o && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: o }),
-      m ? /* @__PURE__ */ t.jsx(
-        $t,
+    y && D && /* @__PURE__ */ t.jsx(kt, { ...D }),
+    /* @__PURE__ */ t.jsxs("div", { className: F.products, children: [
+      a && /* @__PURE__ */ t.jsx("h5", { className: F.subtitle, children: a }),
+      N ? /* @__PURE__ */ t.jsx(
+        gt,
         {
-          sensors: D,
-          onDragEnd: nt,
+          sensors: O,
+          onDragEnd: J,
           children: /* @__PURE__ */ t.jsx(
-            It,
+            xt,
             {
-              items: s.map((y) => y.id),
-              strategy: Nt,
-              children: s.map((y) => dt(y))
+              items: s.map((g) => g.id),
+              strategy: ft,
+              children: s.map((g) => nt(g))
             }
           )
         }
-      ) : s.map((y) => dt(y)),
-      r && /* @__PURE__ */ t.jsx(
+      ) : s.map((g) => nt(g)),
+      i && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -1727,49 +852,49 @@ const Ka = (d) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            et,
             {
               withoutHover: !0,
-              className: V.button,
+              className: F.button,
               size: "s",
               onClick: () => {
-                const y = [...s];
-                let E = null;
-                if (_) {
-                  for (let h = 0; h < _.length; h++)
-                    if (!s.find((N) => N.name["en-US"] === _[h])) {
-                      E = _[h];
+                const g = [...s];
+                let q = null;
+                if (f) {
+                  for (let E = 0; E < f.length; E++)
+                    if (!s.find((z) => z.name["en-US"] === f[E])) {
+                      q = f[E];
                       break;
                     }
                 }
-                k === "select" && _ ? y.push({
+                j === "select" && f ? g.push({
                   name: {
-                    "en-US": E || _[0]
+                    "en-US": q || f[0]
                   },
-                  id: _t(),
-                  ...u,
+                  id: ot(),
+                  ...l,
                   maxSymbols: 100
                   // пример значения
-                }) : k === "input" ? y.push({
+                }) : j === "input" ? g.push({
                   name: {
                     "en-US": ""
                   },
-                  id: _t(),
-                  ...u,
+                  id: ot(),
+                  ...l,
                   maxSymbols: 100
-                }) : y.push({
+                }) : g.push({
                   name: {
                     "en-US": `Image ${s.length + 1}`
                   },
-                  id: _t(),
-                  ...u,
+                  id: ot(),
+                  ...l,
                   maxSymbols: 100
-                }), i(y);
+                }), n(g);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: V.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: F.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
                   b,
@@ -1785,226 +910,108 @@ const Ka = (d) => {
         }
       )
     ] }),
-    c !== void 0 && /* @__PURE__ */ t.jsx(Tt, { items: c })
+    r !== void 0 && /* @__PURE__ */ t.jsx(pt, { items: r })
   ] });
-}, hn = "_title_hvj8m_1", gn = "_subtitle_hvj8m_5", fn = "_header_hvj8m_12", xn = "_text_hvj8m_13", bn = "_productsBlock_hvj8m_14", vn = "_buttonsBlock_hvj8m_15", jn = "_top_hvj8m_26", yn = "_itemsBlock_hvj8m_35", kn = "_typeTexts_hvj8m_41", $n = "_block_hvj8m_48", In = "_active_hvj8m_60", Nn = "_products_hvj8m_14", wn = "_product_hvj8m_14", Cn = "_button_hvj8m_15", Sn = "_image_hvj8m_90", Bn = "_info_hvj8m_97", Tn = "_name_hvj8m_109", Pn = "_buttons_hvj8m_15", An = "_modal_hvj8m_120", On = "_other_hvj8m_140", Mn = "_options_hvj8m_146", qn = "_closeIcon_hvj8m_154", rt = {
-  title: hn,
-  subtitle: gn,
-  header: fn,
-  text: xn,
-  productsBlock: bn,
-  buttonsBlock: vn,
-  top: jn,
-  itemsBlock: yn,
-  typeTexts: kn,
-  block: $n,
-  active: In,
-  products: Nn,
-  product: wn,
-  button: Cn,
-  image: Sn,
-  info: Bn,
-  name: Tn,
-  buttons: Pn,
-  modal: An,
-  other: On,
-  options: Mn,
-  closeIcon: qn
-}, zn = g.forwardRef((d, a) => {
-  const { activeButton: e, setActiveButton: s, popupPosition: i, editableLink: c = !0 } = d, [l, o] = g.useState(e.typesText), [n, m] = g.useState(e.destination), [v, f] = g.useState(e.page), [r, k] = g.useState(e.link || ""), [p, _] = g.useState(e.text || { "en-US": "" }), [$, L] = g.useState(e.openInNewTab), { pages: M } = Vt();
-  return g.useEffect(() => {
-    s({
-      ...e,
-      ...{
-        text: p,
-        link: r,
-        destination: n,
-        typesText: l,
-        page: v,
-        openInNewTab: $
-      }
-    });
-  }, [l, n, r, p, v, $]), /* @__PURE__ */ t.jsxs(
-    "div",
-    {
-      className: rt.modal,
-      onClick: (u) => {
-        u.stopPropagation();
-      },
-      style: {
-        top: `${i.top}px`,
-        left: `${i.left}px`
-      },
-      ref: a,
-      children: [
-        /* @__PURE__ */ t.jsxs("div", { className: rt.top, children: [
-          /* @__PURE__ */ t.jsx("h3", { className: rt.title, children: e.type }),
-          /* @__PURE__ */ t.jsx("div", { className: rt.closeIcon, children: /* @__PURE__ */ t.jsx(
-            b,
-            {
-              name: "X",
-              height: 20,
-              width: 20,
-              hoverable: !0,
-              onClick: () => s(null)
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ t.jsxs("div", { className: rt.options, children: [
-          c && /* @__PURE__ */ t.jsx(
-            et,
-            {
-              label: "Destination",
-              onChange: (u) => m(u),
-              options: ["Go to Page", "Open Link"].filter((u) => u !== n),
-              value: n
-            }
-          ),
-          c && (n === "Go to Page" ? /* @__PURE__ */ t.jsx(
-            et,
-            {
-              label: "Go to",
-              onChange: (u) => f(u),
-              options: M ? Object.values(M).filter((u) => u.name !== v).map((u) => u.name) : [],
-              value: v
-            }
-          ) : /* @__PURE__ */ t.jsx(
-            tt,
-            {
-              onChange: (u) => k(u),
-              value: r,
-              placeholder: "https://",
-              label: "Link"
-            }
-          )),
-          c && /* @__PURE__ */ t.jsx(
-            st,
-            {
-              current: e.openInNewTab,
-              label: "Open in new tab",
-              onChange: (u) => L(u)
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            zt,
-            {
-              onChange: (u) => _({ "en-US": u }),
-              value: p["en-US"],
-              label: "Text",
-              maxLength: 150
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            Lt,
-            {
-              typesText: l,
-              setTypesText: o
-            }
-          )
-        ] })
-      ]
-    }
-  );
-}), En = "_subtitle_jql1y_1", Un = "_header_jql1y_8", Dn = "_text_jql1y_9", Ln = "_productsBlock_jql1y_10", Hn = "_buttonsBlock_jql1y_11", Rn = "_top_jql1y_23", Fn = "_itemsBlock_jql1y_32", Vn = "_typeTexts_jql1y_38", Yn = "_block_jql1y_45", Gn = "_active_jql1y_58", Xn = "_products_jql1y_10", Wn = "_product_jql1y_10", Jn = "_button_jql1y_11", Qn = "_image_jql1y_88", Kn = "_info_jql1y_95", Zn = "_name_jql1y_107", ti = "_buttons_jql1y_11", ei = "_modal_jql1y_118", si = "_other_jql1y_138", ni = "_options_jql1y_144", ii = "_addButton_jql1y_150", oi = "_deleteButton_jql1y_165", at = {
-  subtitle: En,
-  header: Un,
-  text: Dn,
-  productsBlock: Ln,
-  buttonsBlock: Hn,
-  top: Rn,
-  itemsBlock: Fn,
-  typeTexts: Vn,
-  block: Yn,
-  active: Gn,
-  products: Xn,
-  product: Wn,
-  button: Jn,
-  image: Qn,
-  info: Kn,
-  name: Zn,
-  buttons: ti,
-  modal: ei,
-  other: si,
-  options: ni,
-  addButton: ii,
-  deleteButton: oi
-}, ai = (d) => {
-  const { buttons: a, setButtons: e, deletable: s = !0, addable: i = !0, editableLink: c = !0 } = d, [l, o] = g.useState(null), [n, m] = g.useState({
+}, Fe = "_subtitle_jql1y_1", Ve = "_header_jql1y_8", Ye = "_text_jql1y_9", We = "_productsBlock_jql1y_10", Ge = "_buttonsBlock_jql1y_11", Xe = "_top_jql1y_23", Qe = "_itemsBlock_jql1y_32", Je = "_typeTexts_jql1y_38", Ke = "_block_jql1y_45", Ze = "_active_jql1y_58", ts = "_products_jql1y_10", es = "_product_jql1y_10", ss = "_button_jql1y_11", ns = "_image_jql1y_88", is = "_info_jql1y_95", os = "_name_jql1y_107", as = "_buttons_jql1y_11", cs = "_modal_jql1y_118", ls = "_other_jql1y_138", rs = "_options_jql1y_144", ds = "_addButton_jql1y_150", us = "_deleteButton_jql1y_165", K = {
+  subtitle: Fe,
+  header: Ve,
+  text: Ye,
+  productsBlock: We,
+  buttonsBlock: Ge,
+  top: Xe,
+  itemsBlock: Qe,
+  typeTexts: Je,
+  block: Ke,
+  active: Ze,
+  products: ts,
+  product: es,
+  button: ss,
+  image: ns,
+  info: is,
+  name: os,
+  buttons: as,
+  modal: cs,
+  other: ls,
+  options: rs,
+  addButton: ds,
+  deleteButton: us
+}, ps = (u) => {
+  const { buttons: o, setButtons: e, deletable: s = !0, addable: n = !0, editableLink: r = !0 } = u, [c, a] = x.useState(null), [_, N] = x.useState({
     top: 0,
     left: 0
-  }), [v, f] = g.useState(null), r = g.useRef(null);
-  g.useEffect(() => {
-    const p = () => {
-      o(null);
+  }), [B, h] = x.useState(null), i = x.useRef(null);
+  x.useEffect(() => {
+    const d = () => {
+      a(null);
     };
-    return document.body.addEventListener("click", p), o(null), () => {
-      o(null), document.body.removeEventListener("click", p);
+    return document.body.addEventListener("click", d), a(null), () => {
+      a(null), document.body.removeEventListener("click", d);
     };
-  }, []), g.useEffect(() => {
-    if (l) {
-      const p = [...a].map((_) => _.id === l.id ? l : _);
-      e(p);
+  }, []), x.useEffect(() => {
+    if (c) {
+      const d = [...o].map((f) => f.id === c.id ? c : f);
+      e(d);
     }
-  }, [l]), g.useEffect(() => {
-    if (r.current && v) {
-      const p = r.current.getBoundingClientRect().height, _ = window.innerHeight;
-      let $ = v.top;
-      $ + p > _ + window.scrollY - 200 && ($ = _ + window.scrollY - p - 200), $ < 0 && ($ = 10), m({
-        top: $,
-        left: v.left
+  }, [c]), x.useEffect(() => {
+    if (i.current && B) {
+      const d = i.current.getBoundingClientRect().height, f = window.innerHeight;
+      let y = B.top;
+      y + d > f + window.scrollY - 200 && (y = f + window.scrollY - d - 200), y < 0 && (y = 10), N({
+        top: y,
+        left: B.left
       });
     }
-  }, [r.current, v]);
-  const k = (p, _) => {
-    p.stopPropagation();
-    const $ = p.target.getBoundingClientRect();
-    f({
-      top: $.top + window.scrollY - 70,
-      left: $.left - (i ? 30 : 65)
-    }), o(_);
+  }, [i.current, B]);
+  const j = (d, f) => {
+    d.stopPropagation();
+    const y = d.target.getBoundingClientRect();
+    h({
+      top: y.top + window.scrollY - 70,
+      left: y.left - (n ? 30 : 65)
+    }), a(f);
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: at.products, children: [
-    /* @__PURE__ */ t.jsx("h5", { className: at.subtitle, children: "Button Type" }),
-    a.map((p) => /* @__PURE__ */ t.jsxs(
+  return /* @__PURE__ */ t.jsxs("div", { className: K.products, children: [
+    /* @__PURE__ */ t.jsx("h5", { className: K.subtitle, children: "Button Type" }),
+    o.map((d) => /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: at.product,
+        className: K.product,
         children: [
           /* @__PURE__ */ t.jsx(
-            et,
+            ct,
             {
-              onChange: (_) => {
-                const L = [...a].map((M) => M.id === p.id ? {
-                  ...p,
-                  type: _
-                } : M);
-                e(L);
+              onChange: (f) => {
+                const D = [...o].map((A) => A.id === d.id ? {
+                  ...d,
+                  type: f
+                } : A);
+                e(D);
               },
-              value: p.type,
+              value: d.type,
               options: ["Primary", "Secondary", "Tertiary"]
             }
           ),
-          /* @__PURE__ */ t.jsxs("div", { className: at.buttons, children: [
-            /* @__PURE__ */ t.jsx("div", { className: at.deleteButton, children: /* @__PURE__ */ t.jsx(
+          /* @__PURE__ */ t.jsxs("div", { className: K.buttons, children: [
+            /* @__PURE__ */ t.jsx("div", { className: K.deleteButton, children: /* @__PURE__ */ t.jsx(
               b,
               {
                 name: "Sliders",
                 hoverable: !0,
                 width: 20,
                 height: 20,
-                onClick: (_) => {
-                  k(_, p);
+                onClick: (f) => {
+                  j(f, d);
                 }
               }
             ) }),
-            s && /* @__PURE__ */ t.jsx("div", { className: at.deleteButton, children: /* @__PURE__ */ t.jsx(
+            s && /* @__PURE__ */ t.jsx("div", { className: K.deleteButton, children: /* @__PURE__ */ t.jsx(
               b,
               {
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const _ = a.filter(($) => $.id !== p.id);
-                  e(_);
+                  const f = o.filter((y) => y.id !== d.id);
+                  e(f);
                 },
                 width: 20,
                 height: 20,
@@ -2014,19 +1021,19 @@ const Ka = (d) => {
           ] })
         ]
       },
-      p.id
+      d.id
     )),
-    l && /* @__PURE__ */ t.jsx(
-      zn,
+    c && /* @__PURE__ */ t.jsx(
+      Pt,
       {
-        ref: r,
-        activeButton: l,
-        setActiveButton: o,
-        popupPosition: n,
-        editableLink: c
+        ref: i,
+        activeButton: c,
+        setActiveButton: a,
+        popupPosition: _,
+        editableLink: r
       }
     ),
-    i && /* @__PURE__ */ t.jsx(
+    n && /* @__PURE__ */ t.jsx(
       "div",
       {
         style: {
@@ -2035,16 +1042,16 @@ const Ka = (d) => {
           justifyContent: "center"
         },
         children: /* @__PURE__ */ t.jsx(
-          ot,
+          et,
           {
             withoutHover: !0,
-            className: at.button,
+            className: K.button,
             size: "s",
             onClick: () => {
-              const p = [...a];
-              c ? p.push({
+              const d = [...o];
+              r ? d.push({
                 type: "Primary",
-                id: _t(),
+                id: ot(),
                 typesText: [],
                 text: {
                   "en-US": "Button Name"
@@ -2052,9 +1059,9 @@ const Ka = (d) => {
                 destination: "Go to Page",
                 page: "",
                 openInNewTab: !1
-              }) : p.push({
+              }) : d.push({
                 type: "Primary",
-                id: _t(),
+                id: ot(),
                 typesText: [],
                 text: {
                   "en-US": "Create Ticket"
@@ -2062,12 +1069,12 @@ const Ka = (d) => {
                 destination: "Go to Page",
                 page: "",
                 openInNewTab: !1
-              }), e(p);
+              }), e(d);
             },
             style: {
               width: "fit-content"
             },
-            children: /* @__PURE__ */ t.jsxs("div", { className: at.addButton, children: [
+            children: /* @__PURE__ */ t.jsxs("div", { className: K.addButton, children: [
               /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
               /* @__PURE__ */ t.jsx(
                 b,
@@ -2083,214 +1090,91 @@ const Ka = (d) => {
       }
     )
   ] });
-}, Za = (d) => {
-  const { isActiveButtons: a, setIsActiveButtons: e, buttons: s, setButtons: i, editableLink: c = !0 } = d;
-  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: rt.buttonsBlock, children: [
-    /* @__PURE__ */ t.jsxs("div", { className: rt.top, children: [
-      /* @__PURE__ */ t.jsx("h3", { className: rt.title, children: "Buttons" }),
+}, Li = (u) => {
+  const { isActiveButtons: o, setIsActiveButtons: e, buttons: s, setButtons: n, editableLink: r = !0 } = u;
+  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: dt.buttonsBlock, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: dt.top, children: [
+      /* @__PURE__ */ t.jsx("h3", { className: dt.title, children: "Buttons" }),
       /* @__PURE__ */ t.jsx(
-        st,
+        at,
         {
-          current: a,
-          onChange: (l) => e(l)
+          current: o,
+          onChange: (c) => e(c)
         }
       )
     ] }),
     /* @__PURE__ */ t.jsx(
-      ai,
+      ps,
       {
         buttons: s,
-        setButtons: i,
-        editableLink: c
+        setButtons: n,
+        editableLink: r
       }
     )
   ] }) });
-}, ci = "_wrapper_m18qi_1", li = "_subtitle_m18qi_7", ri = "_content_m18qi_14", di = "_range_m18qi_22", ui = "_track_m18qi_27", mi = "_progress_m18qi_36", _i = "_dots_m18qi_46", pi = "_dot_m18qi_46", hi = "_active_m18qi_65", gi = "_input_m18qi_77", fi = "_countBlock_m18qi_91", xi = "_count_m18qi_91", bi = "_controls_m18qi_107", vi = "_button_m18qi_113", W = {
-  wrapper: ci,
-  subtitle: li,
-  content: ri,
-  range: di,
-  track: ui,
-  progress: mi,
-  dots: _i,
-  dot: pi,
-  active: hi,
-  input: gi,
-  countBlock: fi,
-  count: xi,
-  controls: bi,
-  button: vi
-}, qt = (d) => {
-  const { label: a, min: e = 1, max: s = 4, step: i = 1, count: c, setCount: l } = d, [o, n] = g.useState(!1), m = Array.from({ length: (s - e) / i + 1 }), v = (c - e) / (s - e) * 100, f = () => {
-    c < s && l(c + i);
-  }, r = () => {
-    c > e && l(c - i);
-  }, k = (p) => {
-    const _ = e + p * i;
-    l(_);
-  };
-  return /* @__PURE__ */ t.jsxs("div", { className: W.wrapper, children: [
-    a && /* @__PURE__ */ t.jsx("h5", { className: W.subtitle, children: a }),
-    /* @__PURE__ */ t.jsxs("div", { className: W.content, children: [
-      /* @__PURE__ */ t.jsxs("div", { className: W.range, children: [
-        /* @__PURE__ */ t.jsx("div", { className: W.track }),
-        /* @__PURE__ */ t.jsx(
-          "div",
-          {
-            className: W.progress,
-            style: { width: `${v}%` }
-          }
-        ),
-        /* @__PURE__ */ t.jsx("div", { className: W.dots, children: m.map((p, _) => {
-          const $ = _ <= (c - e) / i;
-          return /* @__PURE__ */ t.jsx(
-            "button",
-            {
-              onClick: () => k(_),
-              className: Y(W.dot, {
-                [W.active]: $,
-                [W.inactive]: !$,
-                [W.dragging]: o
-              }),
-              "aria-label": `Set value to ${e + _ * i}`
-            },
-            _
-          );
-        }) }),
-        /* @__PURE__ */ t.jsx(
-          "input",
-          {
-            type: "range",
-            min: e,
-            max: s,
-            step: i,
-            value: c,
-            onChange: (p) => l(Number(p.target.value)),
-            onMouseDown: () => n(!0),
-            onMouseUp: () => n(!1),
-            onTouchStart: () => n(!0),
-            onTouchEnd: () => n(!1),
-            className: W.input
-          }
-        )
-      ] }),
-      /* @__PURE__ */ t.jsxs("div", { className: W.countBlock, children: [
-        /* @__PURE__ */ t.jsx(
-          tt,
-          {
-            type: "number",
-            min: e,
-            max: s,
-            paddingless: !0,
-            onChange: (p) => {
-              const _ = Number(p);
-              _ > s ? l(s) : _ < e ? l(e) : l(_);
-            },
-            value: String(c)
-          }
-        ),
-        /* @__PURE__ */ t.jsxs("div", { className: W.controls, children: [
-          /* @__PURE__ */ t.jsx(
-            "button",
-            {
-              onClick: f,
-              disabled: c >= s,
-              className: W.button,
-              "aria-label": "Increment count",
-              children: /* @__PURE__ */ t.jsx(
-                b,
-                {
-                  name: "CaretUp",
-                  width: 15,
-                  height: 15
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ t.jsx(
-            "button",
-            {
-              onClick: r,
-              disabled: c <= e,
-              className: W.button,
-              "aria-label": "Decrement count",
-              children: /* @__PURE__ */ t.jsx(
-                b,
-                {
-                  name: "CaretDown",
-                  width: 15,
-                  height: 15
-                }
-              )
-            }
-          )
-        ] })
-      ] })
-    ] })
-  ] });
-}, ji = "_title_1ropb_1", yi = "_subtitle_1ropb_5", ki = "_header_1ropb_12", $i = "_text_1ropb_13", Ii = "_productsBlock_1ropb_14", Ni = "_top_1ropb_26", wi = "_itemsBlock_1ropb_35", Ci = "_typeTexts_1ropb_41", Si = "_block_1ropb_48", Bi = "_active_1ropb_61", Ti = "_products_1ropb_14", Pi = "_product_1ropb_14", Ai = "_button_1ropb_80", Oi = "_image_1ropb_91", Mi = "_info_1ropb_98", qi = "_name_1ropb_110", zi = "_buttons_1ropb_114", Ei = "_modal_1ropb_121", Ui = "_link_1ropb_142", Di = "_modalOptions_1ropb_148", Li = "_addButton_1ropb_161", Hi = "_deleteButton_1ropb_176", Ri = "_closeIcon_1ropb_188", G = {
-  title: ji,
-  subtitle: yi,
-  header: ki,
-  text: $i,
-  productsBlock: Ii,
-  top: Ni,
-  itemsBlock: wi,
-  typeTexts: Ci,
-  block: Si,
-  active: Bi,
-  products: Ti,
-  product: Pi,
-  button: Ai,
-  image: Oi,
-  info: Mi,
-  name: qi,
-  buttons: zi,
-  modal: Ei,
-  link: Ui,
-  modalOptions: Di,
-  addButton: Li,
-  deleteButton: Hi,
-  closeIcon: Ri
-}, Fi = (d) => {
-  const { activeItem: a, setActiveItem: e, popupPosition: s, setIsOpenModal: i, itemsOptions: c } = d, l = c.find((o) => o.id === a.listingId);
-  return l ? /* @__PURE__ */ t.jsxs(
+}, ms = "_title_1ropb_1", _s = "_subtitle_1ropb_5", hs = "_header_1ropb_12", gs = "_text_1ropb_13", xs = "_productsBlock_1ropb_14", fs = "_top_1ropb_26", bs = "_itemsBlock_1ropb_35", vs = "_typeTexts_1ropb_41", js = "_block_1ropb_48", ys = "_active_1ropb_61", ks = "_products_1ropb_14", Ns = "_product_1ropb_14", Is = "_button_1ropb_80", $s = "_image_1ropb_91", Ss = "_info_1ropb_98", Cs = "_name_1ropb_110", ws = "_buttons_1ropb_114", Bs = "_modal_1ropb_121", Ps = "_link_1ropb_142", Ms = "_modalOptions_1ropb_148", Ts = "_addButton_1ropb_161", qs = "_deleteButton_1ropb_176", As = "_closeIcon_1ropb_188", R = {
+  title: ms,
+  subtitle: _s,
+  header: hs,
+  text: gs,
+  productsBlock: xs,
+  top: fs,
+  itemsBlock: bs,
+  typeTexts: vs,
+  block: js,
+  active: ys,
+  products: ks,
+  product: Ns,
+  button: Is,
+  image: $s,
+  info: Ss,
+  name: Cs,
+  buttons: ws,
+  modal: Bs,
+  link: Ps,
+  modalOptions: Ms,
+  addButton: Ts,
+  deleteButton: qs,
+  closeIcon: As
+}, Os = (u) => {
+  const { activeItem: o, setActiveItem: e, popupPosition: s, setIsOpenModal: n, itemsOptions: r } = u, c = r.find((a) => a.id === o.listingId);
+  return c ? /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: G.modal,
-      onClick: (o) => {
-        o.stopPropagation();
+      className: R.modal,
+      onClick: (a) => {
+        a.stopPropagation();
       },
       style: {
         top: `${s.top}px`,
         left: `${s.left}px`
       },
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
-          /* @__PURE__ */ t.jsx("h3", { children: Yt(l.productData.name) }),
-          /* @__PURE__ */ t.jsx("div", { className: G.closeIcon, children: /* @__PURE__ */ t.jsx(
+        /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
+          /* @__PURE__ */ t.jsx("h3", { children: Mt(c.productData.name) }),
+          /* @__PURE__ */ t.jsx("div", { className: R.closeIcon, children: /* @__PURE__ */ t.jsx(
             b,
             {
               name: "X",
               height: 20,
               width: 20,
               onClick: () => {
-                i(!1), e(null);
+                n(!1), e(null);
               }
             }
           ) })
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: G.modalOptions, children: /* @__PURE__ */ t.jsx(
-          bt,
+        /* @__PURE__ */ t.jsx("div", { className: R.modalOptions, children: /* @__PURE__ */ t.jsx(
+          Nt,
           {
             label: "Put up an attractive image",
-            activeImage: l.productData.images.length > 0 ? l.productData.images[0].cfId : void 0,
-            onChange: (o) => {
-              const n = {
-                ...a,
-                image: o[0]
+            activeImage: c.productData.images.length > 0 ? c.productData.images[0].cfId : void 0,
+            onChange: (a) => {
+              const _ = {
+                ...o,
+                image: a[0]
               };
-              e(n);
+              e(_);
             }
           }
         ) })
@@ -2298,81 +1182,81 @@ const Ka = (d) => {
     }
   ) : null;
 };
-function Vi(d) {
-  const { product: a, children: e } = d, { attributes: s, listeners: i, setNodeRef: c, transform: l, transition: o, isDragging: n } = Ct({
-    id: String(a.listingId)
-  }), m = {
-    transform: St.Transform.toString(l),
-    transition: o
+function Es(u) {
+  const { product: o, children: e } = u, { attributes: s, listeners: n, setNodeRef: r, transform: c, transition: a, isDragging: _ } = bt({
+    id: String(o.listingId)
+  }), N = {
+    transform: vt.Transform.toString(c),
+    transition: a
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: c,
-      style: m,
-      className: `${G.product} ${n ? G.dragging : ""}`,
+      ref: r,
+      style: N,
+      className: `${R.product} ${_ ? R.dragging : ""}`,
       ...s,
-      ...i,
+      ...n,
       children: e
     }
   );
 }
-const tc = (d) => {
+const Ui = (u) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
-    setItems: i,
-    other: c,
-    title: l,
-    subtitle: o,
-    editable: n = !0,
-    draggable: m = !1,
-    withImage: v = !1,
-    deletable: f = !0,
-    addable: r = !0,
-    itemsType: k,
-    itemsOptions: p
-  } = d, [_, $] = g.useState(
+    setItems: n,
+    other: r,
+    title: c,
+    subtitle: a,
+    editable: _ = !0,
+    draggable: N = !1,
+    withImage: B = !1,
+    deletable: h = !0,
+    addable: i = !0,
+    itemsType: j,
+    itemsOptions: d
+  } = u, [f, y] = x.useState(
     null
-  ), [L, M] = g.useState({
+  ), [D, A] = x.useState({
     top: 0,
     left: 0
-  }), [u, S] = g.useState(!1), q = yt(
-    kt(wt, {
+  }), [l, C] = x.useState(!1), M = mt(
+    _t(ht, {
       activationConstraint: {
         distance: 5
       }
     })
   );
-  g.useEffect(() => {
-    const x = () => {
-      $(null), S(!1);
+  x.useEffect(() => {
+    const p = () => {
+      y(null), C(!1);
     };
-    return document.body.addEventListener("click", x), $(null), S(!1), () => {
-      $(null), S(!1), document.body.removeEventListener("click", x);
+    return document.body.addEventListener("click", p), y(null), C(!1), () => {
+      y(null), C(!1), document.body.removeEventListener("click", p);
     };
-  }, []), g.useEffect(() => {
-    if (_) {
-      const x = [...s].map((I) => I.listingId === _.listingId ? _ : I);
-      i(x);
+  }, []), x.useEffect(() => {
+    if (f) {
+      const p = [...s].map((v) => v.listingId === f.listingId ? f : v);
+      n(p);
     }
-  }, [_]);
-  const F = (x, I) => {
-    x.stopPropagation();
-    const w = x.target.getBoundingClientRect(), D = 100, A = window.innerHeight;
-    let U = w.top + window.scrollY;
-    U + D > A && (U = A - D - 20), S(!0), M({
-      top: U - 80,
-      left: w.left - 30
-    }), $(I);
+  }, [f]);
+  const V = (p, v) => {
+    p.stopPropagation();
+    const I = p.target.getBoundingClientRect(), O = 100, P = window.innerHeight;
+    let T = I.top + window.scrollY;
+    T + O > P && (T = P - O - 20), C(!0), A({
+      top: T - 80,
+      left: I.left - 30
+    }), y(v);
   };
-  function B(x) {
-    if (v)
-      return x ? /* @__PURE__ */ t.jsx(
+  function w(p) {
+    if (B)
+      return p ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${x}/w=1000`,
+          src: `https://imagedelivery.net/${p}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
@@ -2387,20 +1271,20 @@ const tc = (d) => {
         }
       );
   }
-  const j = (x) => {
-    const { active: I, over: w } = x;
-    if (w && I.id !== w.id) {
-      const D = s.findIndex((U) => String(U.listingId) === I.id), A = s.findIndex((U) => String(U.listingId) === w.id);
-      if (D !== -1 && A !== -1) {
-        const U = [...s], [nt] = U.splice(D, 1);
-        U.splice(A, 0, nt), i(U);
+  const m = (p) => {
+    const { active: v, over: I } = p;
+    if (I && v.id !== I.id) {
+      const O = s.findIndex((T) => String(T.listingId) === v.id), P = s.findIndex((T) => String(T.listingId) === I.id);
+      if (O !== -1 && P !== -1) {
+        const T = [...s], [J] = T.splice(O, 1);
+        T.splice(P, 0, J), n(T);
       }
     }
-  }, P = (x, I) => {
-    const w = p.find((A) => x.listingId === A.id);
-    if (!w) return null;
-    const D = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-      m && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+  }, S = (p, v) => {
+    const I = d.find((P) => p.listingId === P.id);
+    if (!I) return null;
+    const O = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      N && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         b,
         {
           name: "DotsSixVertical",
@@ -2409,40 +1293,40 @@ const tc = (d) => {
           height: 20
         }
       ) }),
-      k === "select" && /* @__PURE__ */ t.jsx(
-        et,
+      j === "select" && /* @__PURE__ */ t.jsx(
+        ct,
         {
-          onChange: (A) => {
-            const U = [...s], nt = p.find((E) => E.productData.name === A);
-            if (!nt) return;
-            const dt = {
-              listingId: nt.id,
-              image: nt.productData.images.length > 0 ? nt.productData.images[0].cfId : ""
-            }, y = U.map((E) => E.listingId === x.listingId ? dt : E);
-            $(dt), i([...y]);
+          onChange: (P) => {
+            const T = [...s], J = d.find((q) => q.productData.name === P);
+            if (!J) return;
+            const nt = {
+              listingId: J.id,
+              image: J.productData.images.length > 0 ? J.productData.images[0].cfId : ""
+            }, g = T.map((q) => q.listingId === p.listingId ? nt : q);
+            y(nt), n([...g]);
           },
-          value: w.productData.name,
+          value: I.productData.name,
           options: [
-            ...p.filter((A) => !s.find((U) => U.listingId === A.id)).map((A) => A.productData.name)
+            ...d.filter((P) => !s.find((T) => T.listingId === P.id)).map((P) => P.productData.name)
           ],
-          leftAddon: B(
-            x.image || w.productData.images.length > 0 && w.productData.images[0].cfId || ""
+          leftAddon: w(
+            p.image || I.productData.images.length > 0 && I.productData.images[0].cfId || ""
           )
         },
-        I
+        v
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: G.buttons, children: [
-        n && /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ t.jsxs("div", { className: R.buttons, children: [
+        _ && /* @__PURE__ */ t.jsx("div", { className: R.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (A) => F(A, x)
+            onClick: (P) => V(P, p)
           }
         ) }),
-        f && /* @__PURE__ */ t.jsx("div", { className: G.deleteButton, children: /* @__PURE__ */ t.jsx(
+        h && /* @__PURE__ */ t.jsx("div", { className: R.deleteButton, children: /* @__PURE__ */ t.jsx(
           b,
           {
             name: "Trash",
@@ -2450,66 +1334,66 @@ const tc = (d) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(s.filter((A) => A !== x))
+            onClick: () => n(s.filter((P) => P !== p))
           }
         ) })
       ] })
     ] });
-    return m ? /* @__PURE__ */ t.jsx(
-      Vi,
+    return N ? /* @__PURE__ */ t.jsx(
+      Es,
       {
-        product: x,
-        children: D
+        product: p,
+        children: O
       },
-      x.listingId
+      p.listingId
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: G.product,
-        children: D
+        className: R.product,
+        children: O
       },
-      x.listingId
+      p.listingId
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: G.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: G.top, children: [
-      l && /* @__PURE__ */ t.jsx("h3", { className: G.title, children: l }),
-      a !== void 0 && /* @__PURE__ */ t.jsx(
-        st,
+  return /* @__PURE__ */ t.jsxs("div", { className: R.productsBlock, children: [
+    (c || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
+      c && /* @__PURE__ */ t.jsx("h3", { className: R.title, children: c }),
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        at,
         {
-          current: a,
-          onChange: (x) => e == null ? void 0 : e(x)
+          current: o,
+          onChange: (p) => e == null ? void 0 : e(p)
         }
       )
     ] }),
-    u && _ && /* @__PURE__ */ t.jsx(
-      Fi,
+    l && f && /* @__PURE__ */ t.jsx(
+      Os,
       {
-        activeItem: _,
-        setActiveItem: $,
-        setIsOpenModal: S,
-        popupPosition: L,
-        itemsOptions: p
+        activeItem: f,
+        setActiveItem: y,
+        setIsOpenModal: C,
+        popupPosition: D,
+        itemsOptions: d
       }
     ),
-    /* @__PURE__ */ t.jsxs("div", { className: G.products, children: [
-      o && /* @__PURE__ */ t.jsx("h5", { className: G.subtitle, children: o }),
-      m ? /* @__PURE__ */ t.jsx(
-        $t,
+    /* @__PURE__ */ t.jsxs("div", { className: R.products, children: [
+      a && /* @__PURE__ */ t.jsx("h5", { className: R.subtitle, children: a }),
+      N ? /* @__PURE__ */ t.jsx(
+        gt,
         {
-          sensors: q,
-          onDragEnd: j,
+          sensors: M,
+          onDragEnd: m,
           children: /* @__PURE__ */ t.jsx(
-            It,
+            xt,
             {
-              items: s.map((x) => String(x.listingId)),
-              strategy: Nt,
-              children: s.map((x, I) => P(x, I))
+              items: s.map((p) => String(p.listingId)),
+              strategy: ft,
+              children: s.map((p, v) => S(p, v))
             }
           )
         }
-      ) : s.map((x, I) => P(x, I)),
-      r && /* @__PURE__ */ t.jsx(
+      ) : s.map((p, v) => S(p, v)),
+      i && /* @__PURE__ */ t.jsx(
         "div",
         {
           style: {
@@ -2518,28 +1402,28 @@ const tc = (d) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ot,
+            et,
             {
               withoutHover: !0,
-              className: G.button,
+              className: R.button,
               size: "s",
               onClick: () => {
-                const x = [...s];
-                for (let I = 0; I < p.length; I++)
-                  if (!s.find((w) => w.listingId === p[I].id)) {
-                    x.push({
-                      listingId: p[I].id,
-                      image: p[I].productData.images.length > 0 ? p[I].productData.images[0].cfId : ""
+                const p = [...s];
+                for (let v = 0; v < d.length; v++)
+                  if (!s.find((I) => I.listingId === d[v].id)) {
+                    p.push({
+                      listingId: d[v].id,
+                      image: d[v].productData.images.length > 0 ? d[v].productData.images[0].cfId : ""
                     });
                     break;
                   }
-                i(x);
+                n(p);
               },
-              disabled: s.length === p.length,
+              disabled: s.length === d.length,
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: G.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: R.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
                   b,
@@ -2555,71 +1439,71 @@ const tc = (d) => {
         }
       )
     ] }),
-    c !== void 0 && /* @__PURE__ */ t.jsx(Tt, { items: c })
+    r !== void 0 && /* @__PURE__ */ t.jsx(pt, { items: r })
   ] });
-}, Yi = "_options_6cemk_1", Gi = "_price_6cemk_12", Xi = "_oldPrice_6cemk_19", Wi = "_newPrice_6cemk_27", Ji = "_animate_6cemk_34", Qi = "_appearAndBounce_6cemk_1", Ki = "_meta_6cemk_52", Zi = "_info_6cemk_58", to = "_infoRight_6cemk_66", eo = "_buttons_6cemk_73", so = "_variants_6cemk_80", no = "_variant_6cemk_80", io = "_stock_6cemk_98", oo = "_variantInfo_6cemk_105", ao = "_quantity_6cemk_111", co = "_count_6cemk_118", lo = "_focused_6cemk_135", ro = "_button_6cemk_73", uo = "_activeVariant_6cemk_161", mo = "_chargeTypes_6cemk_165", _o = "_charge_6cemk_165", po = "_chargeActive_6cemk_190", ho = "_title_6cemk_198", T = {
-  options: Yi,
-  price: Gi,
-  oldPrice: Xi,
-  newPrice: Wi,
-  animate: Ji,
-  appearAndBounce: Qi,
-  meta: Ki,
-  info: Zi,
-  infoRight: to,
-  buttons: eo,
-  variants: so,
-  variant: no,
-  stock: io,
-  variantInfo: oo,
-  quantity: ao,
-  count: co,
-  focused: lo,
-  button: ro,
-  activeVariant: uo,
-  chargeTypes: mo,
-  charge: _o,
-  chargeActive: po,
-  title: ho
-}, go = "_wrapper_c1dht_1", fo = "_label_c1dht_9", xo = "_input_c1dht_18", bo = "_paddingless_c1dht_31", vo = "_content_c1dht_35", jo = "_contentBorder_c1dht_47", yo = "_borderless_c1dht_52", ko = "_rightIcon_c1dht_57", it = {
-  wrapper: go,
-  label: fo,
-  input: xo,
-  paddingless: bo,
-  content: vo,
-  contentBorder: jo,
-  borderless: yo,
-  rightIcon: ko
-}, $o = (d) => {
+}, zs = "_options_6cemk_1", Ds = "_price_6cemk_12", Rs = "_oldPrice_6cemk_19", Hs = "_newPrice_6cemk_27", Ls = "_animate_6cemk_34", Us = "_appearAndBounce_6cemk_1", Fs = "_meta_6cemk_52", Vs = "_info_6cemk_58", Ys = "_infoRight_6cemk_66", Ws = "_buttons_6cemk_73", Gs = "_variants_6cemk_80", Xs = "_variant_6cemk_80", Qs = "_stock_6cemk_98", Js = "_variantInfo_6cemk_105", Ks = "_quantity_6cemk_111", Zs = "_count_6cemk_118", tn = "_focused_6cemk_135", en = "_button_6cemk_73", sn = "_activeVariant_6cemk_161", nn = "_chargeTypes_6cemk_165", on = "_charge_6cemk_165", an = "_chargeActive_6cemk_190", cn = "_title_6cemk_198", $ = {
+  options: zs,
+  price: Ds,
+  oldPrice: Rs,
+  newPrice: Hs,
+  animate: Ls,
+  appearAndBounce: Us,
+  meta: Fs,
+  info: Vs,
+  infoRight: Ys,
+  buttons: Ws,
+  variants: Gs,
+  variant: Xs,
+  stock: Qs,
+  variantInfo: Js,
+  quantity: Ks,
+  count: Zs,
+  focused: tn,
+  button: en,
+  activeVariant: sn,
+  chargeTypes: nn,
+  charge: on,
+  chargeActive: an,
+  title: cn
+}, ln = "_wrapper_c1dht_1", rn = "_label_c1dht_9", dn = "_input_c1dht_18", un = "_paddingless_c1dht_31", pn = "_content_c1dht_35", mn = "_contentBorder_c1dht_47", _n = "_borderless_c1dht_52", hn = "_rightIcon_c1dht_57", Q = {
+  wrapper: ln,
+  label: rn,
+  input: dn,
+  paddingless: un,
+  content: pn,
+  contentBorder: mn,
+  borderless: _n,
+  rightIcon: hn
+}, gn = (u) => {
   const {
-    onChange: a,
+    onChange: o,
     style: e,
     label: s,
-    value: i,
-    type: c,
-    min: l,
-    max: o,
-    placeholder: n,
-    disabled: m = !1,
-    required: v = !1,
-    regex: f,
-    paddingless: r = !1,
-    borderless: k = !1,
-    editable: p = !1,
-    isSearch: _ = !1,
-    centered: $ = !1
-  } = d, { themeSettings: L } = Et(), { inputs: M } = L, [u, S] = g.useState(!1);
-  function q(B) {
-    return Number(B) < 0 ? String(l) : B;
+    value: n,
+    type: r,
+    min: c,
+    max: a,
+    placeholder: _,
+    disabled: N = !1,
+    required: B = !1,
+    regex: h,
+    paddingless: i = !1,
+    borderless: j = !1,
+    editable: d = !1,
+    isSearch: f = !1,
+    centered: y = !1
+  } = u, { themeSettings: D } = It(), { inputs: A } = D, [l, C] = x.useState(!1);
+  function M(w) {
+    return Number(w) < 0 ? String(c) : w;
   }
-  function F(B) {
-    return !v || !f ? !0 : new RegExp(f).test(B);
+  function V(w) {
+    return !B || !h ? !0 : new RegExp(h).test(w);
   }
-  return /* @__PURE__ */ t.jsxs("div", { className: it.wrapper, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: Q.wrapper, children: [
     s && /* @__PURE__ */ t.jsx(
       "label",
       {
-        className: it.label,
+        className: Q.label,
         htmlFor: s,
         children: s
       }
@@ -2627,8 +1511,8 @@ const tc = (d) => {
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: Y(it.content, {
-          [it.contentBorder]: M.border.active
+        className: H(Q.content, {
+          [Q.contentBorder]: A.border.active
         }),
         style: {
           ...e
@@ -2638,43 +1522,43 @@ const tc = (d) => {
             "input",
             {
               id: s,
-              type: c || "text",
-              onChange: (B) => {
-                if (c === "text") a(B.target.value);
+              type: r || "text",
+              onChange: (w) => {
+                if (r === "text") o(w.target.value);
                 else {
-                  const j = q(B.target.value);
-                  a(j);
+                  const m = M(w.target.value);
+                  o(m);
                 }
               },
-              value: i,
+              value: n,
               autoComplete: "off",
-              placeholder: n || "Type something...",
-              className: Y(it.input, {
-                [it.required]: u && v && !F(i),
-                [it.paddingless]: r,
-                [it.borderless]: k
+              placeholder: _ || "Type something...",
+              className: H(Q.input, {
+                [Q.required]: l && B && !V(n),
+                [Q.paddingless]: i,
+                [Q.borderless]: j
               }),
-              min: c === "number" ? l : void 0,
-              max: c === "number" ? o : void 0,
-              disabled: m,
-              onFocus: () => S(!0),
+              min: r === "number" ? c : void 0,
+              max: r === "number" ? a : void 0,
+              disabled: N,
+              onFocus: () => C(!0),
               style: {
-                textAlign: $ ? "center" : "left",
-                background: M.field.active ? M.field.color : "transparent",
-                padding: _ ? `7px ${Number(M.general.size) + 20}px 7px 11px` : "7px 11px"
+                textAlign: y ? "center" : "left",
+                background: A.field.active ? A.field.color : "transparent",
+                padding: f ? `7px ${Number(A.general.size) + 20}px 7px 11px` : "7px 11px"
               }
             }
           ),
-          _ && /* @__PURE__ */ t.jsx("div", { className: it.rightIcon, children: /* @__PURE__ */ t.jsx(
+          f && /* @__PURE__ */ t.jsx("div", { className: Q.rightIcon, children: /* @__PURE__ */ t.jsx(
             b,
             {
               name: "MagnifyingGlass",
               fill: "var(--icon-secondary)",
-              width: M.general.size,
-              height: M.general.size
+              width: A.general.size,
+              height: A.general.size
             }
           ) }),
-          p && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+          d && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
             b,
             {
               name: "Sliders",
@@ -2687,35 +1571,35 @@ const tc = (d) => {
       }
     )
   ] });
-}, Io = "_button_85085_1", No = "_primary_85085_20", wo = "_primaryHovered_85085_30", Co = "_secondary_85085_34", So = "_secondaryHovered_85085_44", Bo = "_tertiary_85085_48", To = "_tertiaryHovered_85085_58", Po = "_content_85085_62", ct = {
-  button: Io,
-  primary: No,
-  primaryHovered: wo,
-  secondary: Co,
-  secondaryHovered: So,
-  tertiary: Bo,
-  tertiaryHovered: To,
-  content: Po
-}, Q = (d) => {
-  const { children: a, onClick: e, style: s, className: i, disabled: c = !1, type: l = "Primary" } = d, { themeSettings: o } = Et();
+}, xn = "_button_85085_1", fn = "_primary_85085_20", bn = "_primaryHovered_85085_30", vn = "_secondary_85085_34", jn = "_secondaryHovered_85085_44", yn = "_tertiary_85085_48", kn = "_tertiaryHovered_85085_58", Nn = "_content_85085_62", Z = {
+  button: xn,
+  primary: fn,
+  primaryHovered: bn,
+  secondary: vn,
+  secondaryHovered: jn,
+  tertiary: yn,
+  tertiaryHovered: kn,
+  content: Nn
+}, Y = (u) => {
+  const { children: o, onClick: e, style: s, className: n, disabled: r = !1, type: c = "Primary" } = u, { themeSettings: a } = It();
   return /* @__PURE__ */ t.jsx(
     "button",
     {
-      className: Y(ct.button, i, {
-        [ct.primary]: l === "Primary",
-        [ct.secondary]: l === "Secondary",
-        [ct.tertiary]: l === "Tertiary",
-        [ct.primaryHovered]: l === "Primary" && !c && o.buttons.primary.hover,
-        [ct.secondaryHovered]: l === "Secondary" && !c && o.buttons.secondary.hover,
-        [ct.tertiaryHovered]: l === "Tertiary" && !c && o.buttons.tertiary.hover
+      className: H(Z.button, n, {
+        [Z.primary]: c === "Primary",
+        [Z.secondary]: c === "Secondary",
+        [Z.tertiary]: c === "Tertiary",
+        [Z.primaryHovered]: c === "Primary" && !r && a.buttons.primary.hover,
+        [Z.secondaryHovered]: c === "Secondary" && !r && a.buttons.secondary.hover,
+        [Z.tertiaryHovered]: c === "Tertiary" && !r && a.buttons.tertiary.hover
       }),
       onClick: e,
       style: {
         ...s
       },
-      disabled: c,
-      children: l === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: ct.content, children: [
-        a,
+      disabled: r,
+      children: c === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: Z.content, children: [
+        o,
         /* @__PURE__ */ t.jsx(
           b,
           {
@@ -2725,126 +1609,126 @@ const tc = (d) => {
             height: 20
           }
         )
-      ] }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: a })
+      ] }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: o })
     }
   );
 };
-var Rt = /* @__PURE__ */ ((d) => (d.ONE_TIME = "One-Time", d.RECURRING = "Subscribe & Save", d))(Rt || {});
-const ec = (d) => {
-  var L, M;
-  const { variants: a } = d, [e, s] = g.useState(a[0]), [i, c] = g.useState(e.chargeTypes[0]), l = Bt(), [o, n] = g.useState(1), { reset: m, addProductToCart: v, getProducts: f } = Ot(), [r, k] = g.useState(!1);
-  g.useEffect(() => {
-    k(!0);
-    const u = setTimeout(() => k(!1), 600);
-    return () => clearTimeout(u);
-  }, [o]);
-  async function p() {
-    await f(), await v({
-      productId: d.id,
+var Ct = /* @__PURE__ */ ((u) => (u.ONE_TIME = "One-Time", u.RECURRING = "Subscribe & Save", u))(Ct || {});
+const Fi = (u) => {
+  var D, A;
+  const { variants: o } = u, [e, s] = x.useState(o[0]), [n, r] = x.useState(e.chargeTypes[0]), c = rt(), [a, _] = x.useState(1), { reset: N, addProductToCart: B, getProducts: h } = jt(), [i, j] = x.useState(!1);
+  x.useEffect(() => {
+    j(!0);
+    const l = setTimeout(() => j(!1), 600);
+    return () => clearTimeout(l);
+  }, [a]);
+  async function d() {
+    await h(), await B({
+      productId: u.id,
       productVariantId: e.id,
-      quantity: o
+      quantity: a
     });
   }
-  function _() {
-    m(), p(), l("/checkout");
+  function f() {
+    N(), d(), c("/checkout");
   }
-  function $(u) {
-    if (u >= 864e5) {
-      const j = Math.floor(u / 864e5);
-      return `${j} ${j === 1 ? "day" : "days"}`;
-    } else if (u >= 36e5) {
-      const j = Math.floor(u / 36e5);
-      return `${j} ${j === 1 ? "hour" : "hours"}`;
-    } else if (u >= 6e4) {
-      const j = Math.floor(u / 6e4);
-      return `${j} ${j === 1 ? "minute" : "minutes"}`;
+  function y(l) {
+    if (l >= 864e5) {
+      const m = Math.floor(l / 864e5);
+      return `${m} ${m === 1 ? "day" : "days"}`;
+    } else if (l >= 36e5) {
+      const m = Math.floor(l / 36e5);
+      return `${m} ${m === 1 ? "hour" : "hours"}`;
+    } else if (l >= 6e4) {
+      const m = Math.floor(l / 6e4);
+      return `${m} ${m === 1 ? "minute" : "minutes"}`;
     } else {
-      const j = Math.floor(u / 1e3);
-      return `${j} ${j === 1 ? "second" : "seconds"}`;
+      const m = Math.floor(l / 1e3);
+      return `${m} ${m === 1 ? "second" : "seconds"}`;
     }
   }
-  return g.useEffect(() => {
-    (e.quantity.available === 0 || !e.quantity.available) && n(0);
-  }, [e.quantity.available]), /* @__PURE__ */ t.jsxs("div", { className: T.options, children: [
-    e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: T.chargeTypes, children: e.chargeTypes.map((u) => /* @__PURE__ */ t.jsx(
+  return x.useEffect(() => {
+    (e.quantity.available === 0 || !e.quantity.available) && _(0);
+  }, [e.quantity.available]), /* @__PURE__ */ t.jsxs("div", { className: $.options, children: [
+    e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: $.chargeTypes, children: e.chargeTypes.map((l) => /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: Y(T.charge, {
-          [T.chargeActive]: i === u
+        className: H($.charge, {
+          [$.chargeActive]: n === l
         }),
-        onClick: () => c(u),
-        children: Rt[u]
+        onClick: () => r(l),
+        children: Ct[l]
       },
-      u
+      l
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: T.variants, children: a.map((u) => {
-      var S;
+    /* @__PURE__ */ t.jsx("div", { className: $.variants, children: o.map((l) => {
+      var C;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
-          className: Y(T.variant, {
-            [T.activeVariant]: e.id === u.id
+          className: H($.variant, {
+            [$.activeVariant]: e.id === l.id
           }),
-          onClick: () => s(u),
+          onClick: () => s(l),
           children: [
-            /* @__PURE__ */ t.jsxs("div", { className: T.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: T.title, children: u.name }),
+            /* @__PURE__ */ t.jsxs("div", { className: $.variantInfo, children: [
+              /* @__PURE__ */ t.jsx("span", { className: $.title, children: l.name }),
               /* @__PURE__ */ t.jsxs("span", { children: [
                 "$",
-                i === "ONE_TIME" ? u.price.amount : u.subscriptionSettings ? u.subscriptionSettings.price.amount : "Price Not Found"
+                n === "ONE_TIME" ? l.price.amount : l.subscriptionSettings ? l.subscriptionSettings.price.amount : "Price Not Found"
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: T.stock, children: [
-              ((S = u.quantity.restrictions) == null ? void 0 : S.max) || u.quantity.available || 0,
+            /* @__PURE__ */ t.jsx("div", { children: n === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: $.stock, children: [
+              ((C = l.quantity.restrictions) == null ? void 0 : C.max) || l.quantity.available || 0,
               " in stock"
             ] }) })
           ]
         },
-        u.id
+        l.id
       );
     }) }),
-    i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: T.quantity, children: [
+    n === "ONE_TIME" && /* @__PURE__ */ t.jsxs("div", { className: $.quantity, children: [
       /* @__PURE__ */ t.jsx(
-        Q,
+        Y,
         {
           type: "Secondary",
           onClick: () => {
-            o > 1 ? n((u) => u - 1) : n(1);
+            a > 1 ? _((l) => l - 1) : _(1);
           },
-          className: T.button,
-          disabled: e.quantity.available === 0 || e.quantity.restrictions && o <= e.quantity.restrictions.min || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
+          className: $.button,
+          disabled: e.quantity.available === 0 || e.quantity.restrictions && a <= e.quantity.restrictions.min || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
           children: /* @__PURE__ */ t.jsx(b, { name: "Minus" })
         }
       ),
       /* @__PURE__ */ t.jsx(
-        $o,
+        gn,
         {
           type: "number",
-          value: String(o),
-          onChange: (u) => n(Number(u)),
-          max: ((L = e.quantity.restrictions) == null ? void 0 : L.max) || e.quantity.available || 1 / 0,
-          min: ((M = e.quantity.restrictions) == null ? void 0 : M.min) || 0,
+          value: String(a),
+          onChange: (l) => _(Number(l)),
+          max: ((D = e.quantity.restrictions) == null ? void 0 : D.max) || e.quantity.available || 1 / 0,
+          min: ((A = e.quantity.restrictions) == null ? void 0 : A.min) || 0,
           centered: !0,
           disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available
         }
       ),
       /* @__PURE__ */ t.jsx(
-        Q,
+        Y,
         {
           type: "Secondary",
           onClick: () => {
-            n((u) => u + 1);
+            _((l) => l + 1);
           },
-          className: T.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),
+          className: $.button,
+          disabled: !!(e.quantity.restrictions && a >= e.quantity.restrictions.max || e.quantity.available !== void 0 && a >= e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available),
           children: /* @__PURE__ */ t.jsx(b, { name: "Plus" })
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: T.meta, children: [
-      /* @__PURE__ */ t.jsxs("div", { className: T.info, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: $.meta, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: $.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Delivery" }),
-        /* @__PURE__ */ t.jsxs("div", { className: T.infoRight, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: $.infoRight, children: [
           /* @__PURE__ */ t.jsx(
             b,
             {
@@ -2854,193 +1738,144 @@ const ec = (d) => {
               height: 20
             }
           ),
-          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : $(e.deliveryTime) })
+          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : y(e.deliveryTime) })
         ] })
       ] }),
-      /* @__PURE__ */ t.jsxs("div", { className: T.info, children: [
+      /* @__PURE__ */ t.jsxs("div", { className: $.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Price" }),
-        /* @__PURE__ */ t.jsx("div", { className: T.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: T.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: Y(T.newPrice, { [T.animate]: r }), children: [
+        /* @__PURE__ */ t.jsx("div", { className: $.infoRight, children: n === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: $.price, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: H($.newPrice, { [$.animate]: i }), children: [
             "$ ",
-            (e.price.amount || 0) * o
+            (e.price.amount || 0) * a
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: T.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: $.oldPrice, children: [
             "$ ",
-            (e.compareAtPrice.amount || 0) * o
+            (e.compareAtPrice.amount || 0) * a
           ] })
-        ] }) : /* @__PURE__ */ t.jsxs("span", { className: Y(T.newPrice, { [T.animate]: r }), children: [
+        ] }) : /* @__PURE__ */ t.jsxs("span", { className: H($.newPrice, { [$.animate]: i }), 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: T.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: Y(T.newPrice, { [T.animate]: r }), children: [
+          (e.price.amount || 0) * a
+        ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: $.price, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: H($.newPrice, { [$.animate]: i }), children: [
             "$ ",
             e.subscriptionSettings.price.amount || 0
           ] }),
-          /* @__PURE__ */ t.jsxs("span", { className: T.oldPrice, children: [
+          /* @__PURE__ */ t.jsxs("span", { className: $.oldPrice, children: [
             "$ ",
             e.subscriptionSettings.compareAtPrice.amount || 0
           ] })
-        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: Y(T.newPrice, { [T.animate]: r }), children: [
+        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: H($.newPrice, { [$.animate]: i }), children: [
           "$ ",
           e.subscriptionSettings.price.amount || 0
         ] }) })
       ] })
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: T.buttons, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: $.buttons, children: [
       /* @__PURE__ */ t.jsx(
-        Q,
+        Y,
         {
           type: "Primary",
-          onClick: () => _(),
+          onClick: () => f(),
           disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
-          children: i === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
+          children: n === "ONE_TIME" ? "Buy Now" : "Subscribe Now"
         }
       ),
-      i === "ONE_TIME" && /* @__PURE__ */ t.jsx(
-        Q,
+      n === "ONE_TIME" && /* @__PURE__ */ t.jsx(
+        Y,
         {
           type: "Secondary",
-          onClick: () => p(),
+          onClick: () => d(),
           disabled: e.quantity.available === 0 || !e.quantity.available || Object.keys(e.quantity.restrictions || {}).length === 0 && !e.quantity.available,
           children: "Add to Cart"
         }
       )
     ] })
   ] });
-}, Ao = "_button_1tdo3_1", Oo = "_login_1tdo3_14", Mo = "_signUp_1tdo3_18", qo = "_buttons_1tdo3_23", zo = "_modal_1tdo3_32", Eo = "_closing_1tdo3_64", Uo = "_info_1tdo3_113", Do = "_top_1tdo3_120", Lo = "_title_1tdo3_131", Ho = "_clear_1tdo3_138", Ro = "_activeClear_1tdo3_145", Fo = "_count_1tdo3_149", Vo = "_cart_1tdo3_164", Yo = "_empty_1tdo3_172", Go = "_product_1tdo3_198", Xo = "_products_1tdo3_207", Wo = "_image_1tdo3_215", Jo = "_productInfo_1tdo3_221", Qo = "_content_1tdo3_228", Ko = "_name_1tdo3_234", Zo = "_price_1tdo3_240", ta = "_productButtons_1tdo3_246", ea = "_productButton_1tdo3_246", sa = "_productCount_1tdo3_266", na = "_bottom_1tdo3_282", ia = "_subtotal_1tdo3_290", oa = "_block_1tdo3_298", aa = "_shoppingCount_1tdo3_305", ca = "_total_1tdo3_325", la = "_link_1tdo3_331", ra = "_userInfo_1tdo3_338", da = "_pagesMobileModal_1tdo3_349", ua = "_pagesMobileModalContent_1tdo3_363", ma = "_pagesMobileModalHeader_1tdo3_369", _a = "_pagesMobileModalFooter_1tdo3_379", C = {
-  button: Ao,
-  login: Oo,
-  signUp: Mo,
-  buttons: qo,
-  modal: zo,
+}, In = "_button_1tdo3_1", $n = "_login_1tdo3_14", Sn = "_signUp_1tdo3_18", Cn = "_buttons_1tdo3_23", wn = "_modal_1tdo3_32", Bn = "_closing_1tdo3_64", Pn = "_info_1tdo3_113", Mn = "_top_1tdo3_120", Tn = "_title_1tdo3_131", qn = "_clear_1tdo3_138", An = "_activeClear_1tdo3_145", On = "_count_1tdo3_149", En = "_cart_1tdo3_164", zn = "_empty_1tdo3_172", Dn = "_product_1tdo3_198", Rn = "_products_1tdo3_207", Hn = "_image_1tdo3_215", Ln = "_productInfo_1tdo3_221", Un = "_content_1tdo3_228", Fn = "_name_1tdo3_234", Vn = "_price_1tdo3_240", Yn = "_productButtons_1tdo3_246", Wn = "_productButton_1tdo3_246", Gn = "_productCount_1tdo3_266", Xn = "_bottom_1tdo3_282", Qn = "_subtotal_1tdo3_290", Jn = "_block_1tdo3_298", Kn = "_shoppingCount_1tdo3_305", Zn = "_total_1tdo3_325", ti = "_link_1tdo3_331", ei = "_userInfo_1tdo3_338", si = "_pagesMobileModal_1tdo3_349", ni = "_pagesMobileModalContent_1tdo3_363", ii = "_pagesMobileModalHeader_1tdo3_369", oi = "_pagesMobileModalFooter_1tdo3_379", k = {
+  button: In,
+  login: $n,
+  signUp: Sn,
+  buttons: Cn,
+  modal: wn,
   "slide-in-fade": "_slide-in-fade_1tdo3_1",
   "mobile-slide-in-fade": "_mobile-slide-in-fade_1tdo3_1",
-  closing: Eo,
+  closing: Bn,
   "mobile-slide-out-fade": "_mobile-slide-out-fade_1tdo3_1",
   "slide-out-fade": "_slide-out-fade_1tdo3_1",
-  info: Uo,
-  top: Do,
-  title: Lo,
-  clear: Ho,
-  activeClear: Ro,
-  count: Fo,
-  cart: Vo,
-  empty: Yo,
-  product: Go,
-  products: Xo,
-  image: Wo,
-  productInfo: Jo,
-  content: Qo,
-  name: Ko,
-  price: Zo,
-  productButtons: ta,
-  productButton: ea,
-  productCount: sa,
-  bottom: na,
-  subtotal: ia,
-  block: oa,
-  shoppingCount: aa,
-  total: ca,
-  link: la,
-  userInfo: ra,
-  pagesMobileModal: da,
-  pagesMobileModalContent: ua,
-  pagesMobileModalHeader: ma,
-  pagesMobileModalFooter: _a
-};
-class xt extends Error {
-}
-xt.prototype.name = "InvalidTokenError";
-function pa(d) {
-  return decodeURIComponent(atob(d).replace(/(.)/g, (a, e) => {
-    let s = e.charCodeAt(0).toString(16).toUpperCase();
-    return s.length < 2 && (s = "0" + s), "%" + s;
-  }));
-}
-function ha(d) {
-  let a = d.replace(/-/g, "+").replace(/_/g, "/");
-  switch (a.length % 4) {
-    case 0:
-      break;
-    case 2:
-      a += "==";
-      break;
-    case 3:
-      a += "=";
-      break;
-    default:
-      throw new Error("base64 string is not of the correct length");
-  }
-  try {
-    return pa(a);
-  } catch {
-    return atob(a);
-  }
-}
-function ga(d, a) {
-  if (typeof d != "string")
-    throw new xt("Invalid token specified: must be a string");
-  a || (a = {});
-  const e = a.header === !0 ? 0 : 1, s = d.split(".")[e];
-  if (typeof s != "string")
-    throw new xt(`Invalid token specified: missing part #${e + 1}`);
-  let i;
-  try {
-    i = ha(s);
-  } catch (c) {
-    throw new xt(`Invalid token specified: invalid base64 for part #${e + 1} (${c.message})`);
-  }
-  try {
-    return JSON.parse(i);
-  } catch (c) {
-    throw new xt(`Invalid token specified: invalid json for part #${e + 1} (${c.message})`);
-  }
-}
-const sc = (d) => {
-  const { shopping: a, signUp: e, isShowUserInfo: s = !0 } = d;
-  return /* @__PURE__ */ t.jsxs("div", { className: C.buttons, children: [
-    a && /* @__PURE__ */ t.jsx(fa, {}),
-    s && /* @__PURE__ */ t.jsx(Ft, { signUp: e })
+  info: Pn,
+  top: Mn,
+  title: Tn,
+  clear: qn,
+  activeClear: An,
+  count: On,
+  cart: En,
+  empty: zn,
+  product: Dn,
+  products: Rn,
+  image: Hn,
+  productInfo: Ln,
+  content: Un,
+  name: Fn,
+  price: Vn,
+  productButtons: Yn,
+  productButton: Wn,
+  productCount: Gn,
+  bottom: Xn,
+  subtotal: Qn,
+  block: Jn,
+  shoppingCount: Kn,
+  total: Zn,
+  link: ti,
+  userInfo: ei,
+  pagesMobileModal: si,
+  pagesMobileModalContent: ni,
+  pagesMobileModalHeader: ii,
+  pagesMobileModalFooter: oi
+}, Vi = (u) => {
+  const { shopping: o, signUp: e, isShowUserInfo: s = !0 } = u;
+  return /* @__PURE__ */ t.jsxs("div", { className: k.buttons, children: [
+    o && /* @__PURE__ */ t.jsx(ai, {}),
+    s && /* @__PURE__ */ t.jsx(wt, { signUp: e })
   ] });
-}, fa = () => {
-  const [d, a] = g.useState(!1), [e, s] = g.useState([]), { cart: i, getProducts: c } = Ot();
-  function l(r) {
-    for (let k = 0; k < i.parts.length; k++)
-      for (let p = 0; p < r.variants.length; p++)
-        if (i.parts[k].productVariantId === r.variants[k].id)
-          return i.parts[k].productVariantId;
+}, ai = () => {
+  const [u, o] = x.useState(!1), [e, s] = x.useState([]), { cart: n, getProducts: r } = jt();
+  function c(i) {
+    for (let j = 0; j < n.parts.length; j++)
+      for (let d = 0; d < i.variants.length; d++)
+        if (n.parts[j].productVariantId === i.variants[j].id)
+          return n.parts[j].productVariantId;
   }
-  function o(r) {
-    for (let k = 0; k < i.parts.length; k++)
-      for (let p = 0; p < r.variants.length; p++)
-        if (i.parts[k].productVariantId === r.variants[k].id)
-          return i.parts[k].quantity;
+  function a(i) {
+    for (let j = 0; j < n.parts.length; j++)
+      for (let d = 0; d < i.variants.length; d++)
+        if (n.parts[j].productVariantId === i.variants[j].id)
+          return n.parts[j].quantity;
   }
-  g.useEffect(() => {
+  x.useEffect(() => {
     (async () => {
-      const k = i.parts.map(($) => String($.productId)), _ = (await c([...k])).map(($) => ({
-        ...$,
-        activeVariantId: l($),
-        quantity: o($)
+      const j = n.parts.map((y) => String(y.productId)), f = (await r([...j])).map((y) => ({
+        ...y,
+        activeVariantId: c(y),
+        quantity: a(y)
       }));
-      s(_);
+      s(f);
     })();
-  }, [i.parts.length]);
-  function n(r) {
-    var k;
-    return !r || !(r != null && r.variants) ? !1 : (k = r.variants.find((p) => p.id === r.activeVariantId)) == null ? void 0 : k.subscriptionSettings;
+  }, [n.parts.length]);
+  function _(i) {
+    var j;
+    return !i || !(i != null && i.variants) ? !1 : (j = i.variants.find((d) => d.id === i.activeVariantId)) == null ? void 0 : j.subscriptionSettings;
   }
-  const m = i.parts.length > 0 && e.length > 0 && !n(e[0]), [v, f] = g.useState(!1);
+  const N = n.parts.length > 0 && e.length > 0 && !_(e[0]), [B, h] = x.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsxs(
-      Q,
+      Y,
       {
         type: "Secondary",
         style: {
           padding: 10
         },
-        onClick: (r) => {
-          r.stopPropagation(), window.location.pathname.includes("/admin/builder") || (a(!0), f(!0));
+        onClick: (i) => {
+          i.stopPropagation(), window.location.pathname.includes("/admin/builder") || (o(!0), h(!0));
         },
         children: [
           /* @__PURE__ */ t.jsx(
@@ -3050,107 +1885,107 @@ const sc = (d) => {
               fill: "var(--icon-primary)"
             }
           ),
-          m && /* @__PURE__ */ t.jsx("div", { className: C.shoppingCount, children: i.parts.length })
+          N && /* @__PURE__ */ t.jsx("div", { className: k.shoppingCount, children: n.parts.length })
         ]
       }
     ),
-    d && /* @__PURE__ */ t.jsx(
-      Mt,
+    u && /* @__PURE__ */ t.jsx(
+      yt,
       {
         close: () => {
-          f(!1), setTimeout(() => {
-            a(!1);
+          h(!1), setTimeout(() => {
+            o(!1);
           }, 300);
         },
         withAnimation: !1,
         children: /* @__PURE__ */ t.jsx(
-          xa,
+          ci,
           {
             activeProducts: e,
-            isCartNotEmpty: m,
-            isOpen: v
+            isCartNotEmpty: N,
+            isOpen: B
           }
         )
       }
     )
   ] });
-}, xa = (d) => {
-  const { activeProducts: a, isCartNotEmpty: e, isOpen: s } = d, { cart: i, reset: c, getTotalAndDiscount: l, updateQuantityOfProduct: o } = Ot(), n = Bt();
-  function m(r) {
-    n(r);
+}, ci = (u) => {
+  const { activeProducts: o, isCartNotEmpty: e, isOpen: s } = u, { cart: n, reset: r, getTotalAndDiscount: c, updateQuantityOfProduct: a } = jt(), _ = rt();
+  function N(i) {
+    _(i);
   }
-  function v(r) {
-    o({
-      productId: r.id,
-      productVariantId: r.activeVariantId,
-      quantity: r.quantity + 1
+  function B(i) {
+    a({
+      productId: i.id,
+      productVariantId: i.activeVariantId,
+      quantity: i.quantity + 1
     });
   }
-  function f(r) {
-    o({
-      productId: r.id,
-      productVariantId: r.activeVariantId,
-      quantity: r.quantity - 1
+  function h(i) {
+    a({
+      productId: i.id,
+      productVariantId: i.activeVariantId,
+      quantity: i.quantity - 1
     });
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: Y(C.modal, {
-        [C.closing]: !s
+      className: H(k.modal, {
+        [k.closing]: !s
       }),
-      onClick: (r) => r.stopPropagation(),
+      onClick: (i) => i.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: C.top, children: [
-          /* @__PURE__ */ t.jsxs("div", { className: C.info, children: [
-            /* @__PURE__ */ t.jsx("span", { className: C.title, children: "Cart" }),
-            e && /* @__PURE__ */ t.jsx("div", { className: C.count, children: i.parts.length })
+        /* @__PURE__ */ t.jsxs("div", { className: k.top, children: [
+          /* @__PURE__ */ t.jsxs("div", { className: k.info, children: [
+            /* @__PURE__ */ t.jsx("span", { className: k.title, children: "Cart" }),
+            e && /* @__PURE__ */ t.jsx("div", { className: k.count, children: n.parts.length })
           ] }),
           /* @__PURE__ */ t.jsx(
             "button",
             {
-              className: Y(C.clear, {
-                [C.activeClear]: e
+              className: H(k.clear, {
+                [k.activeClear]: e
               }),
               disabled: !e,
-              onClick: c,
+              onClick: r,
               children: "Clear all"
             }
           )
         ] }),
-        e ? /* @__PURE__ */ t.jsxs("div", { className: C.cart, children: [
-          /* @__PURE__ */ t.jsx("div", { className: C.products, children: a.map((r) => /* @__PURE__ */ t.jsxs(
+        e ? /* @__PURE__ */ t.jsxs("div", { className: k.cart, children: [
+          /* @__PURE__ */ t.jsx("div", { className: k.products, children: o.map((i) => /* @__PURE__ */ t.jsxs(
             "div",
             {
-              className: C.product,
+              className: k.product,
               children: [
-                /* @__PURE__ */ t.jsxs("div", { className: C.productInfo, children: [
+                /* @__PURE__ */ t.jsxs("div", { className: k.productInfo, children: [
                   /* @__PURE__ */ t.jsx(
                     "img",
                     {
-                      src: `https://imagedelivery.net/${r.images[0].cfId}/w=500`,
+                      src: `https://imagedelivery.net/${i.images[0].cfId}/w=500`,
                       alt: "image",
                       width: "100%",
                       height: "100%",
-                      className: C.image
+                      className: k.image
                     }
                   ),
-                  /* @__PURE__ */ t.jsxs("div", { className: C.content, children: [
-                    /* @__PURE__ */ t.jsx("div", { className: C.name, children: r.name }),
-                    /* @__PURE__ */ t.jsxs("div", { className: C.price, children: [
+                  /* @__PURE__ */ t.jsxs("div", { className: k.content, children: [
+                    /* @__PURE__ */ t.jsx("div", { className: k.name, children: i.name }),
+                    /* @__PURE__ */ t.jsxs("div", { className: k.price, children: [
                       "$",
-                      r.variants.find((k) => k.id === r.activeVariantId).price.amount * ((r == null ? void 0 : r.quantity) || 1)
+                      i.variants.find((j) => j.id === i.activeVariantId).price.amount * ((i == null ? void 0 : i.quantity) || 1)
                     ] })
                   ] })
                 ] }),
-                /* @__PURE__ */ t.jsxs("div", { className: C.productButtons, children: [
+                /* @__PURE__ */ t.jsxs("div", { className: k.productButtons, children: [
                   /* @__PURE__ */ t.jsx(
                     "div",
                     {
                       onClick: () => {
-                        r.quantity !== 1 && f(r);
+                        i.quantity !== 1 && h(i);
                       },
-                      className: C.productButton,
+                      className: k.productButton,
                       children: /* @__PURE__ */ t.jsx(
                         b,
                         {
@@ -3162,12 +1997,12 @@ const sc = (d) => {
                       )
                     }
                   ),
-                  /* @__PURE__ */ t.jsx("div", { className: C.productCount, children: r.quantity }),
+                  /* @__PURE__ */ t.jsx("div", { className: k.productCount, children: i.quantity }),
                   /* @__PURE__ */ t.jsx(
                     "div",
                     {
-                      onClick: () => v(r),
-                      className: C.productButton,
+                      onClick: () => B(i),
+                      className: k.productButton,
                       children: /* @__PURE__ */ t.jsx(
                         b,
                         {
@@ -3182,11 +2017,11 @@ const sc = (d) => {
                 ] })
               ]
             },
-            r.id
+            i.id
           )) }),
-          /* @__PURE__ */ t.jsxs("div", { className: C.bottom, children: [
-            /* @__PURE__ */ t.jsxs("div", { className: C.subtotal, children: [
-              /* @__PURE__ */ t.jsxs("div", { className: C.block, children: [
+          /* @__PURE__ */ t.jsxs("div", { className: k.bottom, children: [
+            /* @__PURE__ */ t.jsxs("div", { className: k.subtotal, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: k.block, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
                 /* @__PURE__ */ t.jsx(
                   b,
@@ -3198,18 +2033,18 @@ const sc = (d) => {
                   }
                 )
               ] }),
-              /* @__PURE__ */ t.jsxs("div", { className: C.total, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: k.total, children: [
                 "$",
-                l().total
+                c().total
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx(Q, { onClick: () => m("/checkout"), children: "Checkout" })
+            /* @__PURE__ */ t.jsx(Y, { onClick: () => N("/checkout"), children: "Checkout" })
           ] })
-        ] }) : /* @__PURE__ */ t.jsx(ba, {})
+        ] }) : /* @__PURE__ */ t.jsx(li, {})
       ]
     }
   );
-}, ba = () => /* @__PURE__ */ t.jsxs("div", { className: C.empty, children: [
+}, li = () => /* @__PURE__ */ t.jsxs("div", { className: k.empty, children: [
   /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
     b,
     {
@@ -3225,22 +2060,22 @@ const sc = (d) => {
       "a",
       {
         href: "/products",
-        className: C.link,
+        className: k.link,
         children: "view products"
       }
     )
   ] })
-] }), Ft = ({ signUp: d }) => {
-  const a = JSON.parse(localStorage.getItem("token") || "{}"), { data: e } = a, s = Bt();
-  function i(o) {
-    window.location.pathname.includes("/admin/builder") || s(o);
+] }), wt = ({ signUp: u }) => {
+  const o = JSON.parse(localStorage.getItem("token") || "{}"), { data: e } = o, s = rt();
+  function n(a) {
+    window.location.pathname.includes("/admin/builder") || s(a);
   }
   if (!e)
     return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       /* @__PURE__ */ t.jsx(
-        Q,
+        Y,
         {
-          onClick: () => i("/customer-dash"),
+          onClick: () => n("/customer-dash"),
           type: "Secondary",
           style: {
             padding: 10
@@ -3248,10 +2083,10 @@ const sc = (d) => {
           children: "Login"
         }
       ),
-      d && /* @__PURE__ */ t.jsx(
-        Q,
+      u && /* @__PURE__ */ t.jsx(
+        Y,
         {
-          onClick: () => i("/customer-dash"),
+          onClick: () => n("/customer-dash"),
           type: "Primary",
           style: {
             padding: 10
@@ -3260,44 +2095,44 @@ const sc = (d) => {
         }
       )
     ] });
-  const [c, l] = g.useState("test-email@gmail.com");
-  return g.useEffect(() => {
+  const [r, c] = x.useState("test-email@gmail.com");
+  return x.useEffect(() => {
     (async () => {
-      const n = ga(e);
-      l(n.email);
+      const _ = Tt(e);
+      c(_.email);
     })();
   }, [e]), /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: C.userInfo,
-      onClick: () => i("/customer-dash"),
-      children: /* @__PURE__ */ t.jsx("div", { children: c || "test-email@gmail.com" })
+      className: k.userInfo,
+      onClick: () => n("/customer-dash"),
+      children: /* @__PURE__ */ t.jsx("div", { children: r || "test-email@gmail.com" })
     }
   );
-}, va = ({
-  children: d,
-  logo: a,
+}, ri = ({
+  children: u,
+  logo: o,
   setIsOpen: e,
   signUp: s
 }) => {
-  const { setIsOpen: i } = Ut(), c = () => {
-    i(!1), setTimeout(() => {
-      e(!1), i(!0);
+  const { setIsOpen: n } = $t(), r = () => {
+    n(!1), setTimeout(() => {
+      e(!1), n(!0);
     }, 300);
   };
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: C.pagesMobileModal,
-      onClick: (l) => l.stopPropagation(),
+      className: k.pagesMobileModal,
+      onClick: (c) => c.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: C.pagesMobileModalHeader, children: [
-          /* @__PURE__ */ t.jsx("div", { children: a }),
+        /* @__PURE__ */ t.jsxs("div", { className: k.pagesMobileModalHeader, children: [
+          /* @__PURE__ */ t.jsx("div", { children: o }),
           /* @__PURE__ */ t.jsx(
-            Q,
+            Y,
             {
               type: "Secondary",
-              onClick: c,
+              onClick: r,
               children: /* @__PURE__ */ t.jsx(
                 b,
                 {
@@ -3308,40 +2143,40 @@ const sc = (d) => {
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: C.pagesMobileModalContent, children: d }),
-        /* @__PURE__ */ t.jsx("div", { className: C.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(Ft, { signUp: s }) })
+        /* @__PURE__ */ t.jsx("div", { className: k.pagesMobileModalContent, children: u }),
+        /* @__PURE__ */ t.jsx("div", { className: k.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(wt, { signUp: s }) })
       ]
     }
   );
-}, nc = ({
-  children: d,
-  logo: a,
+}, Yi = ({
+  children: u,
+  logo: o,
   signUp: e
 }) => {
-  const [s, i] = g.useState(!1);
+  const [s, n] = x.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx(ja, { setIsOpenModal: i }),
-    s && /* @__PURE__ */ t.jsx(Mt, { close: () => i(!1), children: /* @__PURE__ */ t.jsx(
-      va,
+    /* @__PURE__ */ t.jsx(di, { setIsOpenModal: n }),
+    s && /* @__PURE__ */ t.jsx(yt, { close: () => n(!1), children: /* @__PURE__ */ t.jsx(
+      ri,
       {
-        logo: a,
-        setIsOpen: i,
+        logo: o,
+        setIsOpen: n,
         signUp: e,
-        children: d
+        children: u
       }
     ) })
   ] });
-}, ja = (d) => {
-  const { setIsOpenModal: a } = d;
+}, di = (u) => {
+  const { setIsOpenModal: o } = u;
   return /* @__PURE__ */ t.jsx(
-    Q,
+    Y,
     {
       type: "Secondary",
       style: {
         padding: 10
       },
       onClick: (e) => {
-        e.stopPropagation(), a(!0);
+        e.stopPropagation(), o(!0);
       },
       children: /* @__PURE__ */ t.jsx(
         b,
@@ -3352,28 +2187,28 @@ const sc = (d) => {
       )
     }
   );
-}, ya = "_share_xddz7_1", ka = "_modal_xddz7_8", $a = "_header_xddz7_20", Ia = "_socials_xddz7_30", Na = "_social_xddz7_30", wa = "_copy_xddz7_40", Ca = "_title_xddz7_47", Sa = "_copyWrapper_xddz7_53", Ba = "_copyText_xddz7_62", Ta = "_copyTextMobile_xddz7_75", Pa = "_copyTextMiniMobile_xddz7_94", lt = {
-  share: ya,
-  modal: ka,
-  header: $a,
-  socials: Ia,
-  social: Na,
-  copy: wa,
-  title: Ca,
-  copyWrapper: Sa,
-  copyText: Ba,
-  copyTextMobile: Ta,
-  copyTextMiniMobile: Pa
-}, ic = () => {
-  const { isOpenModal: d, setIsOpenModal: a } = Dt();
+}, ui = "_share_xddz7_1", pi = "_modal_xddz7_8", mi = "_header_xddz7_20", _i = "_socials_xddz7_30", hi = "_social_xddz7_30", gi = "_copy_xddz7_40", xi = "_title_xddz7_47", fi = "_copyWrapper_xddz7_53", bi = "_copyText_xddz7_62", vi = "_copyTextMobile_xddz7_75", ji = "_copyTextMiniMobile_xddz7_94", tt = {
+  share: ui,
+  modal: pi,
+  header: mi,
+  socials: _i,
+  social: hi,
+  copy: gi,
+  title: xi,
+  copyWrapper: fi,
+  copyText: bi,
+  copyTextMobile: vi,
+  copyTextMiniMobile: ji
+}, Wi = () => {
+  const { isOpenModal: u, setIsOpenModal: o } = St();
   function e() {
-    a(!0);
+    o(!0);
   }
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
-      ot,
+      et,
       {
-        className: lt.share,
+        className: tt.share,
         onClick: (s) => {
           s.stopPropagation(), e();
         },
@@ -3388,105 +2223,105 @@ const sc = (d) => {
         )
       }
     ),
-    d && /* @__PURE__ */ t.jsx(Mt, { close: a, children: /* @__PURE__ */ t.jsx(Aa, {}) })
+    u && /* @__PURE__ */ t.jsx(yt, { close: o, children: /* @__PURE__ */ t.jsx(yi, {}) })
   ] });
-}, Aa = () => {
-  const { setIsOpenModal: d } = Dt(), { notification: a, setNotification: e } = Gt(), { setIsOpen: s } = Ut(), i = window.location.href;
-  function c() {
-    navigator.clipboard.writeText(i), e({
+}, yi = () => {
+  const { setIsOpenModal: u } = St(), { notification: o, setNotification: e } = qt(), { setIsOpen: s } = $t(), n = window.location.href;
+  function r() {
+    navigator.clipboard.writeText(n), e({
       message: "Link copied to clipboard",
       status: "success"
     });
   }
-  function l() {
+  function c() {
     s(!1), setTimeout(() => {
-      d(!1), s(!0);
+      u(!1), s(!0);
     }, 300);
   }
-  function o(n, m) {
-    return n.length > m ? n.slice(0, m) + "..." : n;
+  function a(_, N) {
+    return _.length > N ? _.slice(0, N) + "..." : _;
   }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: lt.modal,
-      onClick: (n) => n.stopPropagation(),
+      className: tt.modal,
+      onClick: (_) => _.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: lt.header, children: [
-          /* @__PURE__ */ t.jsx("div", { className: lt.title, children: "Copy Product Link" }),
+        /* @__PURE__ */ t.jsxs("div", { className: tt.header, children: [
+          /* @__PURE__ */ t.jsx("div", { className: tt.title, children: "Copy Product Link" }),
           /* @__PURE__ */ t.jsx(
             b,
             {
               name: "X",
               fill: "#757575",
-              onClick: l,
+              onClick: c,
               hoverable: !0
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { className: lt.copyWrapper, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: tt.copyWrapper, children: [
           /* @__PURE__ */ t.jsxs(
-            ot,
+            et,
             {
               type: "Secondary",
-              onClick: c,
+              onClick: r,
               style: {
                 flex: 1
               },
               children: [
-                /* @__PURE__ */ t.jsx("div", { className: lt.copyText, children: o(i, 100) }),
-                /* @__PURE__ */ t.jsx("div", { className: lt.copyTextMobile, children: o(i, 40) }),
-                /* @__PURE__ */ t.jsx("div", { className: lt.copyTextMiniMobile, children: o(i, 20) })
+                /* @__PURE__ */ t.jsx("div", { className: tt.copyText, children: a(n, 100) }),
+                /* @__PURE__ */ t.jsx("div", { className: tt.copyTextMobile, children: a(n, 40) }),
+                /* @__PURE__ */ t.jsx("div", { className: tt.copyTextMiniMobile, children: a(n, 20) })
               ]
             }
           ),
           /* @__PURE__ */ t.jsx(
-            ot,
+            et,
             {
               type: "Secondary",
-              onClick: c,
-              children: a ? /* @__PURE__ */ t.jsx(b, { name: "Check" }) : /* @__PURE__ */ t.jsx(b, { name: "Copy" })
+              onClick: r,
+              children: o ? /* @__PURE__ */ t.jsx(b, { name: "Check" }) : /* @__PURE__ */ t.jsx(b, { name: "Copy" })
             }
           )
         ] })
       ]
     }
   );
-}, Oa = "_accordion_1s1lq_1", Ma = "_header_1s1lq_9", qa = "_icon_1s1lq_18", za = "_open_1s1lq_21", Ea = "_content_1s1lq_25", ft = {
-  accordion: Oa,
-  header: Ma,
-  icon: qa,
-  open: za,
-  content: Ea
-}, oc = ({ title: d, content: a, defaultOpen: e = !1 }) => {
-  const [s, i] = g.useState(e), [c, l] = g.useState(0), o = g.useRef(null), n = () => {
-    i(!s);
+}, ki = "_accordion_1s1lq_1", Ni = "_header_1s1lq_9", Ii = "_icon_1s1lq_18", $i = "_open_1s1lq_21", Si = "_content_1s1lq_25", it = {
+  accordion: ki,
+  header: Ni,
+  icon: Ii,
+  open: $i,
+  content: Si
+}, Gi = ({ title: u, content: o, defaultOpen: e = !1 }) => {
+  const [s, n] = x.useState(e), [r, c] = x.useState(0), a = x.useRef(null), _ = () => {
+    n(!s);
   };
-  return g.useEffect(() => {
-    o.current && l(s ? o.current.scrollHeight : 0);
-  }, [s]), /* @__PURE__ */ t.jsxs("div", { className: ft.accordion, children: [
+  return x.useEffect(() => {
+    a.current && c(s ? a.current.scrollHeight : 0);
+  }, [s]), /* @__PURE__ */ t.jsxs("div", { className: it.accordion, children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: ft.header,
-        onClick: n,
+        className: it.header,
+        onClick: _,
         children: [
-          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: d }),
-          /* @__PURE__ */ t.jsx("div", { className: Y(ft.icon, { [ft.open]: s }), children: /* @__PURE__ */ t.jsx(b, { name: "CaretDown" }) })
+          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: u }),
+          /* @__PURE__ */ t.jsx("div", { className: H(it.icon, { [it.open]: s }), children: /* @__PURE__ */ t.jsx(b, { name: "CaretDown" }) })
         ]
       }
     ),
     /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: o,
-        className: ft.content,
-        style: { height: `${c}px` },
-        children: /* @__PURE__ */ t.jsx("p", { id: "p", children: a })
+        ref: a,
+        className: it.content,
+        style: { height: `${r}px` },
+        children: /* @__PURE__ */ t.jsx("p", { id: "p", children: o })
       }
     )
   ] });
-}, ac = ({ children: d, path: a, className: e, target: s = "_self", id: i }) => {
+}, Xi = ({ children: u, path: o, className: e, target: s = "_self", id: n }) => {
   if (window.location.pathname.includes("/admin/builder"))
     return /* @__PURE__ */ t.jsx(
       "div",
@@ -3494,30 +2329,30 @@ const sc = (d) => {
         className: e,
         role: "link",
         style: { cursor: "pointer" },
-        id: i,
-        children: d
+        id: n,
+        children: u
       }
     );
-  const c = Bt(), l = /^https?:\/\//.test(a), o = (n) => {
-    l || s === "_blank" ? s === "_blank" ? window.open(a, "_blank") : window.location.href = a : (n.preventDefault(), c(a, { replace: !0 }));
+  const r = rt(), c = /^https?:\/\//.test(o), a = (_) => {
+    c || s === "_blank" ? s === "_blank" ? window.open(o, "_blank") : window.location.href = o : (_.preventDefault(), r(o, { replace: !0 }));
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      onClick: o,
+      onClick: a,
       className: e,
       role: "link",
       style: { cursor: "pointer" },
-      id: i,
-      children: d
+      id: n,
+      children: u
     }
   );
-}, Ua = "_buttonsBlock_1b2rb_1", Da = "_slideUp_1b2rb_1", La = {
-  buttonsBlock: Ua,
-  slideUp: Da
-}, cc = () => /* @__PURE__ */ t.jsxs("div", { className: La.buttonsBlock, children: [
+}, Ci = "_buttonsBlock_1b2rb_1", wi = "_slideUp_1b2rb_1", Bi = {
+  buttonsBlock: Ci,
+  slideUp: wi
+}, Qi = () => /* @__PURE__ */ t.jsxs("div", { className: Bi.buttonsBlock, children: [
   /* @__PURE__ */ t.jsx(
-    Q,
+    Y,
     {
       type: "Primary",
       style: {
@@ -3526,19 +2361,19 @@ const sc = (d) => {
       children: "Add to Cart"
     }
   ),
-  /* @__PURE__ */ t.jsx(Q, { type: "Secondary", children: "Buy" })
-] }), Ha = "_wrapper_st58d_1", Ra = "_label_st58d_10", Fa = "_textarea_st58d_18", Va = "_length_st58d_33", jt = {
-  wrapper: Ha,
-  label: Ra,
-  textarea: Fa,
-  length: Va
-}, lc = (d) => {
-  const { onChange: a, label: e, value: s, maxLength: i, placeholder: c = "Type something..." } = d, [l, o] = g.useState(s.length);
-  return /* @__PURE__ */ t.jsxs("div", { className: jt.wrapper, children: [
+  /* @__PURE__ */ t.jsx(Y, { type: "Secondary", children: "Buy" })
+] }), Pi = "_wrapper_st58d_1", Mi = "_label_st58d_10", Ti = "_textarea_st58d_18", qi = "_length_st58d_33", lt = {
+  wrapper: Pi,
+  label: Mi,
+  textarea: Ti,
+  length: qi
+}, Ji = (u) => {
+  const { onChange: o, label: e, value: s, maxLength: n, placeholder: r = "Type something..." } = u, [c, a] = x.useState(s.length);
+  return /* @__PURE__ */ t.jsxs("div", { className: lt.wrapper, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
       {
-        className: jt.label,
+        className: lt.label,
         htmlFor: e,
         children: e
       }
@@ -3548,56 +2383,56 @@ const sc = (d) => {
       {
         id: e,
         defaultValue: s,
-        onChange: (n) => {
-          o(n.target.value.length), a(n.target.value);
+        onChange: (_) => {
+          a(_.target.value.length), o(_.target.value);
         },
-        placeholder: c,
-        className: jt.textarea,
-        maxLength: i
+        placeholder: r,
+        className: lt.textarea,
+        maxLength: n
       }
     ),
-    i && /* @__PURE__ */ t.jsxs("div", { className: jt.length, children: [
-      l,
+    n && /* @__PURE__ */ t.jsxs("div", { className: lt.length, children: [
+      c,
       "/",
-      i
+      n
     ] })
   ] });
 };
 export {
-  oc as Accordion,
-  ja as BurgerMenuButton,
-  Q as Button,
-  ai as ButtonTypeSettings,
-  Za as ButtonsSettings,
-  Ja as CategorySettings,
-  bt as ChooseImage,
-  uc as ChooseImageModal,
-  ba as EmptyCart,
-  Ka as FormSettings,
-  sc as HeaderButtons,
+  Gi as Accordion,
+  di as BurgerMenuButton,
+  Y as Button,
+  ps as ButtonTypeSettings,
+  Li as ButtonsSettings,
+  Di as CategorySettings,
+  Nt as ChooseImage,
+  to as ChooseImageModal,
+  li as EmptyCart,
+  Hi as FormSettings,
+  Vi as HeaderButtons,
   b as Icon,
-  tt as InputSettings,
-  $o as InputUI,
-  Ge as ItemsSettings,
-  Wa as LayoutSettings,
-  ac as Link,
-  tc as ListingSelector,
-  mc as Loader,
-  Mt as Modal,
-  nc as PagesMobileMenu,
-  va as PagesMobileModal,
-  Qa as PagesSettings,
-  cc as ProductCardButtons,
-  ec as ProductOptions,
-  qt as RangeSelector,
-  et as Select,
-  ic as ShareLink,
-  fa as ShoppingButton,
-  xa as ShoppingModalCart,
-  st as Switch,
-  Ht as TextSettings,
-  zt as TextareaSettings,
-  lc as TextareaUI,
-  Lt as TypesText,
-  Ft as UserInfo
+  ut as InputSettings,
+  gn as InputUI,
+  eo as ItemsSettings,
+  zi as LayoutSettings,
+  Xi as Link,
+  Ui as ListingSelector,
+  so as Loader,
+  yt as Modal,
+  Yi as PagesMobileMenu,
+  ri as PagesMobileModal,
+  Ri as PagesSettings,
+  Qi as ProductCardButtons,
+  Fi as ProductOptions,
+  kt as RangeSelector,
+  ct as Select,
+  Wi as ShareLink,
+  ai as ShoppingButton,
+  ci as ShoppingModalCart,
+  at as Switch,
+  no as TextSettings,
+  io as TextareaSettings,
+  Ji as TextareaUI,
+  oo as TypesText,
+  wt as UserInfo
 };