@billgangcom/theme-lib 1.38.0 → 1.39.0

package/dist/ui.es.js

@@ -1,21 +1,21 @@
-import { j as t, I as v, c as F, a as W, S as Z, T as Ot, C as gt, b as st, u as It, d as $t, D as Nt, e as wt, v as Ct, B as ct, f as mt, P as Bt, g as St, h as Tt, i as Ht, k as bt, l as Pt, m as qt, M as Et, n as Dt, o as zt, p as Ft } from "./index-BRelv8dA.js";
-import { q as ya, L as ka } from "./index-BRelv8dA.js";
+import { j as t, I as v, c as F, a as X, S as tt, T as Ot, C as gt, b as nt, u as It, d as kt, D as $t, e as Nt, v as wt, B as Z, f as _t, P as Ct, g as Bt, h as St, i as Ft, k as Tt, l as Pt, m as qt, M as At, n as Et, o as Dt, p as Vt } from "./index-rUpOzmAy.js";
+import { q as Ta, L as Pa } from "./index-rUpOzmAy.js";
 import p from "react";
 import "@phosphor-icons/react";
-const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1ibay_15", Gt = "_subtitle_1ibay_22", Wt = "_alignmentContent_1ibay_29", Xt = "_alignments_1ibay_37", Jt = "_alignment_1ibay_8", Qt = "_circle_1ibay_60", Kt = "_paddings_1ibay_67", Zt = "_padding_1ibay_67", te = "_active_1ibay_91", ee = "_input_1ibay_98", J = {
-  wrapper: Vt,
-  alignmentBlock: Ut,
-  title: Yt,
-  subtitle: Gt,
+const Ut = "_wrapper_1ibay_2", Yt = "_alignmentBlock_1ibay_8", Gt = "_title_1ibay_15", Xt = "_subtitle_1ibay_22", Wt = "_alignmentContent_1ibay_29", Jt = "_alignments_1ibay_37", Qt = "_alignment_1ibay_8", Kt = "_circle_1ibay_60", Zt = "_paddings_1ibay_67", te = "_padding_1ibay_67", ee = "_active_1ibay_91", se = "_input_1ibay_98", J = {
+  wrapper: Ut,
+  alignmentBlock: Yt,
+  title: Gt,
+  subtitle: Xt,
   alignmentContent: Wt,
-  alignments: Xt,
-  alignment: Jt,
-  circle: Qt,
-  paddings: Kt,
-  padding: Zt,
-  active: te,
-  input: ee
-}, se = [
+  alignments: Jt,
+  alignment: Qt,
+  circle: Kt,
+  paddings: Zt,
+  padding: te,
+  active: ee,
+  input: se
+}, ne = [
   "topLeft",
   "top",
   "topRight",
@@ -25,10 +25,10 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
   "bottomLeft",
   "bottom",
   "bottomRight"
-], ne = ["left", "top", "right", "bottom"], ra = (r) => {
-  const { alignment: a, padding: e, setPadding: s, setAlignment: i } = r;
-  function o(x) {
-    switch (x) {
+], ie = ["left", "top", "right", "bottom"], ga = (r) => {
+  const { alignment: o, padding: e, setPadding: s, setAlignment: i } = r;
+  function a(g) {
+    switch (g) {
       case "left":
       case "topLeft":
       case "bottomLeft":
@@ -45,8 +45,8 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
         return "TextAlignCenter";
     }
   }
-  function l(x) {
-    switch (x) {
+  function l(g) {
+    switch (g) {
       case "left":
         return "AlignLeft";
       case "right":
@@ -63,34 +63,34 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
     /* @__PURE__ */ t.jsxs("div", { className: J.alignmentBlock, children: [
       /* @__PURE__ */ t.jsx("h5", { className: J.subtitle, children: "Alignment" }),
       /* @__PURE__ */ t.jsxs("div", { className: J.alignmentContent, children: [
-        /* @__PURE__ */ t.jsx("div", { className: J.alignments, children: se.map((x) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: J.alignments, children: ne.map((g) => /* @__PURE__ */ t.jsxs(
           "div",
           {
             onClick: () => {
-              i(x);
+              i(g);
             },
             className: J.alignment,
             onMouseEnter: () => {
-              n(x);
+              n(g);
             },
             onMouseLeave: () => {
               n(null);
             },
             children: [
-              x !== a && d !== x && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
-              x !== a && d === x && /* @__PURE__ */ t.jsx(
+              g !== o && d !== g && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
+              g !== o && d === g && /* @__PURE__ */ t.jsx(
                 v,
                 {
-                  name: o(d),
+                  name: a(d),
                   fill: "#c2c2c2",
                   width: 22,
                   height: 22
                 }
               ),
-              x === a && /* @__PURE__ */ t.jsx(
+              g === o && /* @__PURE__ */ t.jsx(
                 v,
                 {
-                  name: o(a),
+                  name: a(o),
                   fill: "#FF3F19",
                   width: 22,
                   height: 22
@@ -98,16 +98,16 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
               )
             ]
           },
-          x
+          g
         )) }),
-        /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: ne.map((x) => /* @__PURE__ */ t.jsxs(
+        /* @__PURE__ */ t.jsx("div", { className: J.paddings, children: ie.map((g) => /* @__PURE__ */ t.jsxs(
           "label",
           {
             className: F(J.padding, {
-              [J.active]: c === x
+              [J.active]: c === g
             }),
             onFocus: () => {
-              b(x);
+              b(g);
             },
             onBlur: () => {
               b(null);
@@ -116,19 +116,19 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
               /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
                 v,
                 {
-                  name: l(x),
+                  name: l(g),
                   width: 20,
                   height: 20
                 }
               ) }),
               /* @__PURE__ */ t.jsx(
-                W,
+                X,
                 {
                   type: "number",
-                  value: String(e[x]),
+                  value: String(e[g]),
                   onChange: (h) => s({
                     ...e,
-                    [x]: Number(h)
+                    [g]: Number(h)
                   }),
                   paddingless: !0,
                   borderless: !0
@@ -136,24 +136,24 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
               )
             ]
           },
-          x
+          g
         )) })
       ] })
     ] })
   ] });
-}, ie = "_title_1jkiw_1", oe = "_subtitle_1jkiw_5", ae = "_header_1jkiw_12", ce = "_text_1jkiw_13", le = "_top_1jkiw_20", re = "_itemsBlock_1jkiw_29", _t = {
-  title: ie,
-  subtitle: oe,
-  header: ae,
-  text: ce,
-  top: le,
-  itemsBlock: re
-}, de = "_typeTexts_167ez_1", ue = "_block_167ez_8", me = "_active_167ez_25", jt = {
-  typeTexts: de,
-  block: ue,
+}, oe = "_title_1jkiw_1", ae = "_subtitle_1jkiw_5", ce = "_header_1jkiw_12", le = "_text_1jkiw_13", re = "_top_1jkiw_20", de = "_itemsBlock_1jkiw_29", ht = {
+  title: oe,
+  subtitle: ae,
+  header: ce,
+  text: le,
+  top: re,
+  itemsBlock: de
+}, ue = "_typeTexts_167ez_1", _e = "_block_167ez_8", me = "_active_167ez_25", jt = {
+  typeTexts: ue,
+  block: _e,
   active: me
-}, _e = ["bold", "italic", "underline", "strike-through", "code"], Lt = (r) => {
-  const { typesText: a, setTypesText: e } = r;
+}, he = ["bold", "italic", "underline", "strike-through", "code"], Lt = (r) => {
+  const { typesText: o, setTypesText: e } = r;
   function s(i) {
     switch (i) {
       case "bold":
@@ -168,25 +168,25 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
         return "TextUnderline";
     }
   }
-  return /* @__PURE__ */ t.jsx("div", { className: jt.typeTexts, children: _e.map((i) => /* @__PURE__ */ t.jsx(
+  return /* @__PURE__ */ t.jsx("div", { className: jt.typeTexts, children: he.map((i) => /* @__PURE__ */ t.jsx(
     "div",
     {
       className: F(jt.block, {
-        [jt.active]: a.includes(i)
+        [jt.active]: o.includes(i)
       }),
       onClick: () => {
-        const o = [...a];
-        if (o.includes(i)) {
-          const l = o.filter((d) => d !== i);
+        const a = [...o];
+        if (a.includes(i)) {
+          const l = a.filter((d) => d !== i);
           e(l);
         } else
-          o.push(i), e(o);
+          a.push(i), e(a);
       },
       children: /* @__PURE__ */ t.jsx(
         v,
         {
           name: s(i),
-          fill: a.includes(i) ? "#252525" : "#757575",
+          fill: o.includes(i) ? "#252525" : "#757575",
           width: 20,
           height: 20
         }
@@ -196,32 +196,32 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
   )) });
 }, Rt = (r) => {
   const {
-    typesText: a,
+    typesText: o,
     isActiveText: e,
     setIsActiveText: s,
     text: i,
-    setText: o,
+    setText: a,
     setTypesText: l,
     title: d,
     subtitle: n = "Items"
   } = r;
-  return /* @__PURE__ */ t.jsxs("div", { className: _t.text, children: [
-    (d || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: _t.top, children: [
-      d && /* @__PURE__ */ t.jsx("h3", { className: _t.title, children: d }),
+  return /* @__PURE__ */ t.jsxs("div", { className: ht.text, children: [
+    (d || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: ht.top, children: [
+      d && /* @__PURE__ */ t.jsx("h3", { className: ht.title, children: d }),
       e !== void 0 && s && /* @__PURE__ */ t.jsx(
-        Z,
+        tt,
         {
           current: e,
           onChange: (c) => s(c)
         }
       )
     ] }),
-    /* @__PURE__ */ t.jsxs("div", { className: _t.itemsBlock, children: [
-      /* @__PURE__ */ t.jsx("h5", { className: _t.subtitle, children: n }),
+    /* @__PURE__ */ t.jsxs("div", { className: ht.itemsBlock, children: [
+      /* @__PURE__ */ t.jsx("h5", { className: ht.subtitle, children: n }),
       /* @__PURE__ */ t.jsx(
         Ot,
         {
-          onChange: (c) => o(c),
+          onChange: (c) => a(c),
           value: i,
           maxLength: 150
         }
@@ -229,48 +229,48 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
       /* @__PURE__ */ t.jsx(
         Lt,
         {
-          typesText: a,
+          typesText: o,
           setTypesText: l
         }
       )
     ] })
   ] });
-}, he = "_title_xma5o_1", pe = "_subtitle_xma5o_5", ge = "_header_xma5o_12", xe = "_text_xma5o_13", fe = "_productsBlock_xma5o_14", be = "_top_xma5o_26", ve = "_itemsBlock_xma5o_35", je = "_typeTexts_xma5o_41", ye = "_block_xma5o_48", ke = "_active_xma5o_61", Ie = "_products_xma5o_14", $e = "_product_xma5o_14", Ne = "_button_xma5o_80", we = "_disabled_xma5o_91", Ce = "_image_xma5o_95", Be = "_info_xma5o_102", Se = "_name_xma5o_114", Te = "_buttons_xma5o_118", Pe = "_modal_xma5o_125", Ae = "_link_xma5o_145", Oe = "_modalOptions_xma5o_151", qe = "_addButton_xma5o_165", Ee = "_deleteButton_xma5o_180", De = "_closeIcon_xma5o_192", M = {
-  title: he,
-  subtitle: pe,
+}, pe = "_title_xma5o_1", xe = "_subtitle_xma5o_5", ge = "_header_xma5o_12", fe = "_text_xma5o_13", be = "_productsBlock_xma5o_14", ve = "_top_xma5o_26", je = "_itemsBlock_xma5o_35", ye = "_typeTexts_xma5o_41", Ie = "_block_xma5o_48", ke = "_active_xma5o_61", $e = "_products_xma5o_14", Ne = "_product_xma5o_14", we = "_button_xma5o_80", Ce = "_disabled_xma5o_91", Be = "_image_xma5o_95", Se = "_info_xma5o_102", Te = "_name_xma5o_114", Pe = "_buttons_xma5o_118", Ae = "_modal_xma5o_125", Me = "_link_xma5o_145", Oe = "_modalOptions_xma5o_151", qe = "_addButton_xma5o_165", Ee = "_deleteButton_xma5o_180", De = "_closeIcon_xma5o_192", R = {
+  title: pe,
+  subtitle: xe,
   header: ge,
-  text: xe,
-  productsBlock: fe,
-  top: be,
-  itemsBlock: ve,
-  typeTexts: je,
-  block: ye,
+  text: fe,
+  productsBlock: be,
+  top: ve,
+  itemsBlock: je,
+  typeTexts: ye,
+  block: Ie,
   active: ke,
-  products: Ie,
-  product: $e,
-  button: Ne,
-  disabled: we,
-  image: Ce,
-  info: Be,
-  name: Se,
-  buttons: Te,
-  modal: Pe,
-  link: Ae,
+  products: $e,
+  product: Ne,
+  button: we,
+  disabled: Ce,
+  image: Be,
+  info: Se,
+  name: Te,
+  buttons: Pe,
+  modal: Ae,
+  link: Me,
   modalOptions: Oe,
   addButton: qe,
   deleteButton: Ee,
   closeIcon: De
 }, Le = p.forwardRef(
-  (r, a) => {
-    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: o, setIsOpenModal: l } = r;
+  (r, o) => {
+    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = r;
     function d(n, c) {
       return n.length > c ? `${n.slice(0, c)}...` : n;
     }
     return /* @__PURE__ */ t.jsxs(
       "div",
       {
-        ref: a,
-        className: M.modal,
+        ref: o,
+        className: R.modal,
         onClick: (n) => {
           n.stopPropagation();
         },
@@ -279,9 +279,9 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
           left: `${i.left}px`
         },
         children: [
-          /* @__PURE__ */ t.jsxs("div", { className: M.top, children: [
-            /* @__PURE__ */ t.jsx("h3", { className: M.title, children: d(e.name, 20) }),
-            /* @__PURE__ */ t.jsx("div", { className: M.closeIcon, children: /* @__PURE__ */ t.jsx(
+          /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
+            /* @__PURE__ */ t.jsx("h3", { className: R.title, children: d(e.name, 20) }),
+            /* @__PURE__ */ t.jsx("div", { className: R.closeIcon, children: /* @__PURE__ */ t.jsx(
               v,
               {
                 name: "X",
@@ -293,7 +293,7 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
               }
             ) })
           ] }),
-          /* @__PURE__ */ t.jsx("div", { className: M.modalOptions, children: o.map((n) => {
+          /* @__PURE__ */ t.jsx("div", { className: R.modalOptions, children: a.map((n) => {
             if (n.type === "image")
               return /* @__PURE__ */ t.jsx(
                 gt,
@@ -335,7 +335,7 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
               );
             if (n.type === "input")
               return /* @__PURE__ */ t.jsx(
-                W,
+                X,
                 {
                   onChange: (c) => {
                     const b = {
@@ -350,9 +350,9 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
                 }
               );
             if (n.type === "inputSwitch")
-              return /* @__PURE__ */ t.jsxs("div", { className: M.link, children: [
+              return /* @__PURE__ */ t.jsxs("div", { className: R.link, children: [
                 /* @__PURE__ */ t.jsx(
-                  W,
+                  X,
                   {
                     onChange: (c) => {
                       const b = {
@@ -367,7 +367,7 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
                   }
                 ),
                 /* @__PURE__ */ t.jsx(
-                  Z,
+                  tt,
                   {
                     current: !!e[n.field.switch] || !1,
                     label: n.switchLabel,
@@ -383,7 +383,7 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
               ] });
             if (n.type === "list")
               return /* @__PURE__ */ t.jsx(
-                Fe,
+                Ve,
                 {
                   items: e[n.field] || [],
                   setItems: (c) => {
@@ -404,7 +404,7 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
               );
             if (n.type === "select")
               return /* @__PURE__ */ t.jsx(
-                st,
+                nt,
                 {
                   options: n.itemsOptions,
                   onChange: (c) => {
@@ -424,19 +424,19 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
       }
     );
   }
-), Re = "_other_g74jx_1", Me = "_subtitle_g74jx_7", He = "_items_g74jx_14", yt = {
+), Re = "_other_g74jx_1", He = "_subtitle_g74jx_7", ze = "_items_g74jx_14", yt = {
   other: Re,
-  subtitle: Me,
-  items: He
+  subtitle: He,
+  items: ze
 }, vt = (r) => {
-  const { items: a, title: e = "Other" } = r;
+  const { items: o, title: e = "Other" } = r;
   return /* @__PURE__ */ t.jsxs("div", { className: yt.other, children: [
     /* @__PURE__ */ t.jsx("h5", { className: yt.subtitle, children: e }),
-    /* @__PURE__ */ t.jsx("div", { className: yt.items, children: a.map((s, i) => /* @__PURE__ */ t.jsx(
-      Z,
+    /* @__PURE__ */ t.jsx("div", { className: yt.items, children: o.map((s, i) => /* @__PURE__ */ t.jsx(
+      tt,
       {
         current: s.isItem,
-        onChange: (o) => s.setIsItem(o),
+        onChange: (a) => s.setIsItem(a),
         label: s.label,
         hasBackground: !0,
         paddingless: !1
@@ -445,18 +445,18 @@ const Vt = "_wrapper_1ibay_2", Ut = "_alignmentBlock_1ibay_8", Yt = "_title_1iba
     )) })
   ] });
 };
-function ze({ product: r, children: a }) {
+function Fe({ product: r, children: o }) {
   const {
     attributes: e,
     listeners: s,
     setNodeRef: i,
-    transform: o,
+    transform: a,
     transition: l,
     isDragging: d
-  } = St({
+  } = Bt({
     id: r.id
   }), n = {
-    transform: Tt.Transform.toString(o),
+    transform: St.Transform.toString(a),
     transition: l
   };
   return /* @__PURE__ */ t.jsx(
@@ -464,82 +464,82 @@ function ze({ product: r, children: a }) {
     {
       ref: i,
       style: n,
-      className: `${M.product} ${d ? M.dragging : ""}`,
+      className: `${R.product} ${d ? R.dragging : ""}`,
       ...e,
       ...s,
-      children: a
+      children: o
     }
   );
 }
-const Fe = (r) => {
+const Ve = (r) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
     setItems: i,
-    other: o,
+    other: a,
     title: l,
     subtitle: d,
     editable: n = !0,
     draggable: c = !1,
     withImage: b = !1,
-    deletable: x = !0,
+    deletable: g = !0,
     addable: h = !0,
-    itemsType: _,
-    itemsPlaceholder: g = "",
+    itemsType: m,
+    itemsPlaceholder: x = "",
     itemsOptions: u,
-    hasRangeSelector: w = !1,
-    rangeSelectorOptions: q,
-    modalOptions: k,
-    addableOptions: L = {},
+    hasRangeSelector: C = !1,
+    rangeSelectorOptions: O,
+    modalOptions: I,
+    addableOptions: D = {},
     limit: B,
     autoScrollInterval: S
-  } = r, [f, D] = p.useState(null), [X, tt] = p.useState({
+  } = r, [f, E] = p.useState(null), [W, et] = p.useState({
     top: 0,
     left: 0
-  }), [y, $] = p.useState(null), E = p.useRef(null), [G, A] = p.useState(!1), H = It(
-    $t(Bt, {
+  }), [y, $] = p.useState(null), q = p.useRef(null), [G, A] = p.useState(!1), H = It(
+    kt(Ct, {
       activationConstraint: {
         distance: 5
       }
     })
   );
   p.useEffect(() => {
-    const m = () => {
-      D(null), A(!1);
+    const _ = () => {
+      E(null), A(!1);
     };
-    return document.body.addEventListener("click", m), D(null), A(!1), () => {
-      D(null), A(!1), document.body.removeEventListener("click", m);
+    return document.body.addEventListener("click", _), E(null), A(!1), () => {
+      E(null), A(!1), document.body.removeEventListener("click", _);
     };
   }, []), p.useEffect(() => {
     if (f) {
-      const m = [...s].map((I) => I.id === f.id ? f : I);
-      i(m);
+      const _ = [...s].map((k) => k.id === f.id ? f : k);
+      i(_);
     }
   }, [f]), p.useEffect(() => {
-    if (E.current && y) {
-      const m = E.current.getBoundingClientRect().height, I = window.innerHeight;
+    if (q.current && y) {
+      const _ = q.current.getBoundingClientRect().height, k = window.innerHeight;
       let T = y.top;
-      T + m > I + window.scrollY - 200 && (T = I + window.scrollY - m - 200), T < 0 && (T = 10), tt({
+      T + _ > k + window.scrollY - 200 && (T = k + window.scrollY - _ - 200), T < 0 && (T = 10), et({
         top: T,
         left: y.left
       });
     }
-  }, [E.current, y]);
-  const K = (m, I) => {
-    m.stopPropagation();
-    const T = m.target.getBoundingClientRect();
+  }, [q.current, y]);
+  const K = (_, k) => {
+    _.stopPropagation();
+    const T = _.target.getBoundingClientRect();
     $({
       top: T.top + window.scrollY,
       left: T.left - 30
-    }), D(I), A(!0);
+    }), E(k), A(!0);
   };
-  function lt(m) {
+  function lt(_) {
     if (b)
-      return m ? /* @__PURE__ */ t.jsx(
+      return _ ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${m[0]}/w=1000`,
+          src: `https://imagedelivery.net/${_[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
@@ -554,17 +554,17 @@ const Fe = (r) => {
         }
       );
   }
-  const j = (m) => {
-    const { active: I, over: T } = m;
-    if (T && I.id !== T.id) {
-      const R = s.findIndex((P) => P.id === I.id), U = s.findIndex((P) => P.id === T.id);
-      if (R !== -1 && U !== -1) {
-        const P = [...s], [rt] = P.splice(R, 1);
+  const j = (_) => {
+    const { active: k, over: T } = _;
+    if (T && k.id !== T.id) {
+      const L = s.findIndex((P) => P.id === k.id), U = s.findIndex((P) => P.id === T.id);
+      if (L !== -1 && U !== -1) {
+        const P = [...s], [rt] = P.splice(L, 1);
         P.splice(U, 0, rt), i(P);
       }
     }
-  }, O = (m, I) => {
-    var R, U;
+  }, M = (_, k) => {
+    var L, U;
     const T = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       c && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         v,
@@ -575,65 +575,65 @@ const Fe = (r) => {
           height: 20
         }
       ) }),
-      _ === "select" && u && /* @__PURE__ */ t.jsx(
-        st,
+      m === "select" && u && /* @__PURE__ */ t.jsx(
+        nt,
         {
           onChange: (P) => {
-            const rt = [...s], ut = u.find((xt) => xt.name === P);
+            const rt = [...s], ut = u.find((ft) => ft.name === P);
             if (!ut) return;
-            const dt = rt.map((xt) => xt.id === m.id ? {
+            const dt = rt.map((ft) => ft.id === _.id ? {
               ...ut,
               name: P
-            } : xt);
-            D({
-              ...m,
+            } : ft);
+            E({
+              ..._,
               name: P
             }), i([...dt]);
           },
-          value: m.name,
+          value: _.name,
           options: u.filter((P) => !s.find((rt) => rt.name === P.name)).map((P) => P.name),
-          leftAddon: lt(m.images)
+          leftAddon: lt(_.images)
         }
       ),
-      _ === "input" && /* @__PURE__ */ t.jsx(
-        W,
+      m === "input" && /* @__PURE__ */ t.jsx(
+        X,
         {
           onChange: (P) => {
-            const ut = [...s].map((dt) => dt.id === m.id ? {
-              ...m,
+            const ut = [...s].map((dt) => dt.id === _.id ? {
+              ..._,
               name: P
             } : dt);
             i([...ut]);
           },
-          value: m.name,
-          placeholder: g
+          value: _.name,
+          placeholder: x
         }
       ),
-      _ === "image" && /* @__PURE__ */ t.jsx(
+      m === "image" && /* @__PURE__ */ t.jsx(
         gt,
         {
           onChange: (P) => {
-            const ut = [...s].map((dt) => dt.id === m.id ? {
-              ...m,
+            const ut = [...s].map((dt) => dt.id === _.id ? {
+              ..._,
               images: P
             } : dt);
             i([...ut]);
           },
-          activeImage: (R = s.find((P) => P.id === m.id)) != null && R.images ? (U = s.find((P) => P.id === m.id)) == null ? void 0 : U.images[0] : void 0
+          activeImage: (L = s.find((P) => P.id === _.id)) != null && L.images ? (U = s.find((P) => P.id === _.id)) == null ? void 0 : U.images[0] : void 0
         }
       ),
-      /* @__PURE__ */ t.jsxs("div", { className: M.buttons, children: [
-        n && /* @__PURE__ */ t.jsx("div", { className: M.deleteButton, children: /* @__PURE__ */ t.jsx(
+      /* @__PURE__ */ t.jsxs("div", { className: R.buttons, children: [
+        n && /* @__PURE__ */ t.jsx("div", { className: R.deleteButton, children: /* @__PURE__ */ t.jsx(
           v,
           {
             name: "Sliders",
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (P) => K(P, m)
+            onClick: (P) => K(P, _)
           }
         ) }),
-        x && /* @__PURE__ */ t.jsx("div", { className: M.deleteButton, children: /* @__PURE__ */ t.jsx(
+        g && /* @__PURE__ */ t.jsx("div", { className: R.deleteButton, children: /* @__PURE__ */ t.jsx(
           v,
           {
             name: "Trash",
@@ -641,68 +641,68 @@ const Fe = (r) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(s.filter((P) => P.id !== m.id))
+            onClick: () => i(s.filter((P) => P.id !== _.id))
           }
         ) })
       ] })
     ] });
     return c ? /* @__PURE__ */ t.jsx(
-      ze,
+      Fe,
       {
-        product: m,
-        index: I,
+        product: _,
+        index: k,
         children: T
       },
-      m.id
+      _.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
-        className: M.product,
+        className: R.product,
         children: T
       },
-      m.id
+      _.id
     );
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: M.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: M.top, children: [
-      l && /* @__PURE__ */ t.jsx("h3", { className: M.title, children: l }),
-      a !== void 0 && /* @__PURE__ */ t.jsx(
-        Z,
+  return /* @__PURE__ */ t.jsxs("div", { className: R.productsBlock, children: [
+    (l || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: R.top, children: [
+      l && /* @__PURE__ */ t.jsx("h3", { className: R.title, children: l }),
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        tt,
         {
-          current: a,
-          onChange: (m) => e == null ? void 0 : e(m)
+          current: o,
+          onChange: (_) => e == null ? void 0 : e(_)
         }
       )
     ] }),
-    f && n && k && G && /* @__PURE__ */ t.jsx(
+    f && n && I && G && /* @__PURE__ */ t.jsx(
       Le,
       {
-        ref: E,
+        ref: q,
         activeItem: f,
-        setActiveItem: D,
-        popupPosition: X,
-        modalOptions: k,
+        setActiveItem: E,
+        popupPosition: W,
+        modalOptions: I,
         setIsOpenModal: A
       }
     ),
-    w && q && /* @__PURE__ */ t.jsx(At, { ...q }),
-    /* @__PURE__ */ t.jsxs("div", { className: M.products, children: [
-      d && /* @__PURE__ */ t.jsx("h5", { className: M.subtitle, children: d }),
+    C && O && /* @__PURE__ */ t.jsx(Mt, { ...O }),
+    /* @__PURE__ */ t.jsxs("div", { className: R.products, children: [
+      d && /* @__PURE__ */ t.jsx("h5", { className: R.subtitle, children: d }),
       c ? /* @__PURE__ */ t.jsx(
-        Nt,
+        $t,
         {
           sensors: H,
           onDragEnd: j,
           children: /* @__PURE__ */ t.jsx(
-            wt,
+            Nt,
             {
-              items: s.map((m) => m.id),
-              strategy: Ct,
-              children: s.map((m, I) => O(m, I))
+              items: s.map((_) => _.id),
+              strategy: wt,
+              children: s.map((_, k) => M(_, k))
             }
           )
         }
-      ) : s.map((m, I) => O(m, I)),
+      ) : s.map((_, k) => M(_, k)),
       h && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -712,42 +712,42 @@ const Fe = (r) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            Z,
             {
               withoutHover: !0,
-              className: F(M.button, {
-                [M.disabled]: !!(B && B <= s.length || s.length === (u == null ? void 0 : u.length))
+              className: F(R.button, {
+                [R.disabled]: !!(B && B <= s.length || s.length === (u == null ? void 0 : u.length))
               }),
               size: "s",
               disabled: !!(B && B <= s.length || s.length === (u == null ? void 0 : u.length)),
               onClick: () => {
-                const m = [...s];
-                let I = null;
+                const _ = [...s];
+                let k = null;
                 if (u) {
                   for (let T = 0; T < u.length; T++)
-                    if (!s.find((R) => R.id === u[T].id)) {
-                      I = u[T];
+                    if (!s.find((L) => L.id === u[T].id)) {
+                      k = u[T];
                       break;
                     }
                 }
-                _ === "select" && u ? m.push({
-                  name: I ? I.name : u[0].name,
-                  id: (I == null ? void 0 : I.id) || u[0].id,
-                  ...L
-                }) : _ === "input" ? m.push({
+                m === "select" && u ? _.push({
+                  name: k ? k.name : u[0].name,
+                  id: (k == null ? void 0 : k.id) || u[0].id,
+                  ...D
+                }) : m === "input" ? _.push({
                   name: "",
-                  id: mt(),
-                  ...L
-                }) : m.push({
+                  id: _t(),
+                  ...D
+                }) : _.push({
                   name: `Image ${s.length + 1}`,
-                  id: mt(),
-                  ...L
-                }), i(m);
+                  id: _t(),
+                  ...D
+                }), i(_);
               },
               style: {
                 width: "fit-content"
               },
-              children: /* @__PURE__ */ t.jsxs("div", { className: M.addButton, children: [
+              children: /* @__PURE__ */ t.jsxs("div", { className: R.addButton, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
                 /* @__PURE__ */ t.jsx(
                   v,
@@ -763,14 +763,14 @@ const Fe = (r) => {
         }
       )
     ] }),
-    o !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: o }),
+    a !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: a }),
     S !== void 0 && /* @__PURE__ */ t.jsx(
-      W,
+      X,
       {
         label: "Auto scroll interval",
         type: "number",
         value: String(S.scrollInterval),
-        onChange: (m) => S.setScrollInterval(Number(m)),
+        onChange: (_) => S.setScrollInterval(Number(_)),
         min: 0.1,
         max: 100,
         style: {
@@ -780,54 +780,54 @@ const Fe = (r) => {
       }
     )
   ] });
-}, Ve = "_title_82zux_1", Ue = "_subtitle_82zux_5", Ye = "_header_82zux_12", Ge = "_text_82zux_13", We = "_productsBlock_82zux_14", Xe = "_top_82zux_26", Je = "_itemsBlock_82zux_35", Qe = "_typeTexts_82zux_41", Ke = "_block_82zux_48", Ze = "_active_82zux_61", ts = "_products_82zux_14", es = "_product_82zux_14", ss = "_button_82zux_80", ns = "_disabled_82zux_91", is = "_image_82zux_95", os = "_info_82zux_102", as = "_name_82zux_114", cs = "_buttons_82zux_118", ls = "_modal_82zux_125", rs = "_link_82zux_145", ds = "_modalOptions_82zux_151", us = "_addButton_82zux_157", ms = "_deleteButton_82zux_179", Q = {
-  title: Ve,
-  subtitle: Ue,
-  header: Ye,
-  text: Ge,
+}, Ue = "_title_82zux_1", Ye = "_subtitle_82zux_5", Ge = "_header_82zux_12", Xe = "_text_82zux_13", We = "_productsBlock_82zux_14", Je = "_top_82zux_26", Qe = "_itemsBlock_82zux_35", Ke = "_typeTexts_82zux_41", Ze = "_block_82zux_48", ts = "_active_82zux_61", es = "_products_82zux_14", ss = "_product_82zux_14", ns = "_button_82zux_80", is = "_disabled_82zux_91", os = "_image_82zux_95", as = "_info_82zux_102", cs = "_name_82zux_114", ls = "_buttons_82zux_118", rs = "_modal_82zux_125", ds = "_link_82zux_145", us = "_modalOptions_82zux_151", _s = "_addButton_82zux_157", ms = "_deleteButton_82zux_179", Q = {
+  title: Ue,
+  subtitle: Ye,
+  header: Ge,
+  text: Xe,
   productsBlock: We,
-  top: Xe,
-  itemsBlock: Je,
-  typeTexts: Qe,
-  block: Ke,
-  active: Ze,
-  products: ts,
-  product: es,
-  button: ss,
-  disabled: ns,
-  image: is,
-  info: os,
-  name: as,
-  buttons: cs,
-  modal: ls,
-  link: rs,
-  modalOptions: ds,
-  addButton: us,
+  top: Je,
+  itemsBlock: Qe,
+  typeTexts: Ke,
+  block: Ze,
+  active: ts,
+  products: es,
+  product: ss,
+  button: ns,
+  disabled: is,
+  image: os,
+  info: as,
+  name: cs,
+  buttons: ls,
+  modal: rs,
+  link: ds,
+  modalOptions: us,
+  addButton: _s,
   deleteButton: ms
-}, da = (r) => {
+}, fa = (r) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
     setItems: i,
-    other: o,
+    other: a,
     title: l,
     subtitle: d,
     draggable: n = !1,
     withImage: c = !1,
     addable: b = !0,
-    itemsOptions: x,
+    itemsOptions: g,
     hasRangeSelector: h = !1,
-    rangeSelectorOptions: _,
-    limit: g,
+    rangeSelectorOptions: m,
+    limit: x,
     autoScrollInterval: u
   } = r;
-  function w(k) {
+  function C(I) {
     if (c)
-      return k ? /* @__PURE__ */ t.jsx(
+      return I ? /* @__PURE__ */ t.jsx(
         "img",
         {
-          src: `https://imagedelivery.net/${k[0]}/w=1000`,
+          src: `https://imagedelivery.net/${I[0]}/w=1000`,
           alt: "image",
           width: 16,
           height: 16
@@ -842,9 +842,9 @@ const Fe = (r) => {
         }
       );
   }
-  const q = (k) => {
-    const L = x.find((S) => S.id === k);
-    if (!L) return;
+  const O = (I) => {
+    const D = g.find((S) => S.id === I);
+    if (!D) return;
     const B = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       n && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         v,
@@ -856,17 +856,17 @@ const Fe = (r) => {
         }
       ) }),
       /* @__PURE__ */ t.jsx(
-        st,
+        nt,
         {
           onChange: (S) => {
-            const f = [...s], D = x.find((y) => y.name === S);
-            if (!D) return;
-            const X = D.id, tt = f.map((y) => y === k ? X : y);
-            i([...tt]);
+            const f = [...s], E = g.find((y) => y.name === S);
+            if (!E) return;
+            const W = E.id, et = f.map((y) => y === I ? W : y);
+            i([...et]);
           },
-          value: L.name,
-          options: x.filter((S) => !s.find((f) => f === S.id)).map((S) => S.name),
-          leftAddon: w(L.images)
+          value: D.name,
+          options: g.filter((S) => !s.find((f) => f === S.id)).map((S) => S.name),
+          leftAddon: C(D.images)
         }
       ),
       /* @__PURE__ */ t.jsx("div", { className: Q.buttons, children: /* @__PURE__ */ t.jsx("div", { className: Q.deleteButton, children: /* @__PURE__ */ t.jsx(
@@ -877,7 +877,7 @@ const Fe = (r) => {
           width: 20,
           height: 20,
           fill: "#C12A2A",
-          onClick: () => i(s.filter((S) => S !== k))
+          onClick: () => i(s.filter((S) => S !== I))
         }
       ) }) })
     ] });
@@ -887,24 +887,24 @@ const Fe = (r) => {
         className: Q.product,
         children: B
       },
-      k
+      I
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: Q.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Q.top, children: [
+    (l || o !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: Q.top, children: [
       l && /* @__PURE__ */ t.jsx("h3", { className: Q.title, children: l }),
-      a !== void 0 && /* @__PURE__ */ t.jsx(
-        Z,
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        tt,
         {
-          current: a,
-          onChange: (k) => e == null ? void 0 : e(k)
+          current: o,
+          onChange: (I) => e == null ? void 0 : e(I)
         }
       )
     ] }),
-    h && _ && /* @__PURE__ */ t.jsx(At, { ..._ }),
+    h && m && /* @__PURE__ */ t.jsx(Mt, { ...m }),
     /* @__PURE__ */ t.jsxs("div", { className: Q.products, children: [
       d && /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: d }),
-      s.map((k) => q(k)),
+      s.map((I) => O(I)),
       b && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -915,25 +915,25 @@ const Fe = (r) => {
             gap: 5
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            Z,
             {
               withoutHover: !0,
               className: F(Q.button, {
-                [Q.disabled]: !!(g && g <= s.length || s.length === x.length)
+                [Q.disabled]: !!(x && x <= s.length || s.length === g.length)
               }),
               size: "s",
-              disabled: !!(g && g <= s.length || s.length === x.length),
+              disabled: !!(x && x <= s.length || s.length === g.length),
               onClick: () => {
-                const k = [...s];
-                let L = null;
-                if (x) {
-                  for (let B = 0; B < x.length; B++)
-                    if (!s.find((S) => S === x[B].id)) {
-                      L = x[B];
+                const I = [...s];
+                let D = null;
+                if (g) {
+                  for (let B = 0; B < g.length; B++)
+                    if (!s.find((S) => S === g[B].id)) {
+                      D = g[B];
                       break;
                     }
                 }
-                k.push((L == null ? void 0 : L.id) || x[0].id), i(k);
+                I.push((D == null ? void 0 : D.id) || g[0].id), i(I);
               },
               style: {
                 width: "fit-content"
@@ -954,14 +954,14 @@ const Fe = (r) => {
         }
       )
     ] }),
-    o !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: o }),
+    a !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: a }),
     u !== void 0 && /* @__PURE__ */ t.jsx(
-      W,
+      X,
       {
         label: "Auto scroll interval",
         type: "number",
         value: String(u.scrollInterval),
-        onChange: (k) => u.setScrollInterval(Number(k)),
+        onChange: (I) => u.setScrollInterval(Number(I)),
         min: 0.1,
         max: 100,
         style: {
@@ -971,41 +971,41 @@ const Fe = (r) => {
       }
     )
   ] });
-}, _s = "_title_wjbkg_1", hs = "_subtitle_wjbkg_5", ps = "_header_wjbkg_12", gs = "_text_wjbkg_13", xs = "_productsBlock_wjbkg_14", fs = "_top_wjbkg_26", bs = "_itemsBlock_wjbkg_35", vs = "_typeTexts_wjbkg_41", js = "_block_wjbkg_48", ys = "_active_wjbkg_61", ks = "_products_wjbkg_14", Is = "_product_wjbkg_14", $s = "_button_wjbkg_80", Ns = "_disabled_wjbkg_91", ws = "_image_wjbkg_95", Cs = "_info_wjbkg_102", Bs = "_name_wjbkg_114", Ss = "_buttons_wjbkg_118", Ts = "_modal_wjbkg_125", Ps = "_link_wjbkg_146", As = "_modalOptions_wjbkg_152", Os = "_addButton_wjbkg_165", qs = "_deleteButton_wjbkg_180", Es = "_closeIcon_wjbkg_192", z = {
-  title: _s,
-  subtitle: hs,
-  header: ps,
+}, hs = "_title_1vfw9_1", ps = "_subtitle_1vfw9_5", xs = "_header_1vfw9_12", gs = "_text_1vfw9_13", fs = "_productsBlock_1vfw9_14", bs = "_top_1vfw9_26", vs = "_itemsBlock_1vfw9_35", js = "_typeTexts_1vfw9_41", ys = "_block_1vfw9_48", Is = "_active_1vfw9_61", ks = "_products_1vfw9_14", $s = "_product_1vfw9_14", Ns = "_button_1vfw9_80", ws = "_disabled_1vfw9_91", Cs = "_image_1vfw9_95", Bs = "_info_1vfw9_102", Ss = "_name_1vfw9_114", Ts = "_buttons_1vfw9_118", Ps = "_modal_1vfw9_125", As = "_link_1vfw9_145", Ms = "_modalOptions_1vfw9_151", Os = "_addButton_1vfw9_164", qs = "_deleteButton_1vfw9_179", Es = "_closeIcon_1vfw9_191", z = {
+  title: hs,
+  subtitle: ps,
+  header: xs,
   text: gs,
-  productsBlock: xs,
-  top: fs,
-  itemsBlock: bs,
-  typeTexts: vs,
-  block: js,
-  active: ys,
+  productsBlock: fs,
+  top: bs,
+  itemsBlock: vs,
+  typeTexts: js,
+  block: ys,
+  active: Is,
   products: ks,
-  product: Is,
-  button: $s,
-  disabled: Ns,
-  image: ws,
-  info: Cs,
-  name: Bs,
-  buttons: Ss,
-  modal: Ts,
-  link: Ps,
-  modalOptions: As,
+  product: $s,
+  button: Ns,
+  disabled: ws,
+  image: Cs,
+  info: Bs,
+  name: Ss,
+  buttons: Ts,
+  modal: Ps,
+  link: As,
+  modalOptions: Ms,
   addButton: Os,
   deleteButton: qs,
   closeIcon: Es
 }, Ds = p.forwardRef(
-  (r, a) => {
-    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: o, setIsOpenModal: l } = r;
+  (r, o) => {
+    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = r;
     function d(n, c) {
       return n.length > c ? `${n.slice(0, c)}...` : n;
     }
     return /* @__PURE__ */ t.jsxs(
       "div",
       {
-        ref: a,
+        ref: o,
         className: z.modal,
         onClick: (n) => {
           n.stopPropagation();
@@ -1030,7 +1030,7 @@ const Fe = (r) => {
               }
             ) })
           ] }),
-          /* @__PURE__ */ t.jsx("div", { className: z.modalOptions, children: o.map((n) => {
+          /* @__PURE__ */ t.jsx("div", { className: z.modalOptions, children: a.map((n) => {
             if (n.type === "image")
               return /* @__PURE__ */ t.jsx(
                 gt,
@@ -1072,7 +1072,7 @@ const Fe = (r) => {
               );
             if (n.type === "input")
               return /* @__PURE__ */ t.jsx(
-                W,
+                X,
                 {
                   onChange: (c) => {
                     const b = {
@@ -1089,7 +1089,7 @@ const Fe = (r) => {
             if (n.type === "inputSwitch")
               return /* @__PURE__ */ t.jsxs("div", { className: z.link, children: [
                 /* @__PURE__ */ t.jsx(
-                  W,
+                  X,
                   {
                     onChange: (c) => {
                       const b = {
@@ -1104,7 +1104,7 @@ const Fe = (r) => {
                   }
                 ),
                 /* @__PURE__ */ t.jsx(
-                  Z,
+                  tt,
                   {
                     current: !!e[n.field.switch] || !1,
                     label: n.switchLabel,
@@ -1120,7 +1120,7 @@ const Fe = (r) => {
               ] });
             if (n.type === "select")
               return /* @__PURE__ */ t.jsx(
-                st,
+                nt,
                 {
                   options: n.itemsOptions,
                   onChange: (c) => {
@@ -1142,16 +1142,16 @@ const Fe = (r) => {
   }
 );
 function Ls(r) {
-  const { product: a, children: e } = r, { attributes: s, listeners: i, setNodeRef: o, transform: l, transition: d, isDragging: n } = St({
-    id: a.id
+  const { product: o, children: e } = r, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: d, isDragging: n } = Bt({
+    id: o.id
   }), c = {
-    transform: Tt.Transform.toString(l),
+    transform: St.Transform.toString(l),
     transition: d
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: o,
+      ref: a,
       style: c,
       className: `${z.product} ${n ? z.dragging : ""}`,
       ...s,
@@ -1160,32 +1160,32 @@ function Ls(r) {
     }
   );
 }
-const ua = (r) => {
+const ba = (r) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
     setItems: i,
-    other: o,
+    other: a,
     title: l,
     subtitle: d,
     editable: n = !0,
     draggable: c = !1,
     withImage: b = !1,
-    deletable: x = !0,
+    deletable: g = !0,
     addable: h = !0,
-    itemsType: _,
-    itemsPlaceholder: g = "",
+    itemsType: m,
+    itemsPlaceholder: x = "",
     itemsOptions: u,
-    hasRangeSelector: w = !1,
-    rangeSelectorOptions: q,
-    modalOptions: k,
-    addableOptions: L = {}
-  } = r, [B, S] = p.useState(null), [f, D] = p.useState({
+    hasRangeSelector: C = !1,
+    rangeSelectorOptions: O,
+    modalOptions: I,
+    addableOptions: D = {}
+  } = r, [B, S] = p.useState(null), [f, E] = p.useState({
     top: 0,
     left: 0
-  }), [X, tt] = p.useState(null), y = p.useRef(null), [$, E] = p.useState(!1), G = It(
-    $t(Bt, {
+  }), [W, et] = p.useState(null), y = p.useRef(null), [$, q] = p.useState(!1), G = It(
+    kt(Ct, {
       activationConstraint: {
         distance: 5
       }
@@ -1193,33 +1193,33 @@ const ua = (r) => {
   );
   p.useEffect(() => {
     const j = () => {
-      S(null), E(!1);
+      S(null), q(!1);
     };
-    return document.body.addEventListener("click", j), S(null), E(!1), () => {
-      S(null), E(!1), document.body.removeEventListener("click", j);
+    return document.body.addEventListener("click", j), S(null), q(!1), () => {
+      S(null), q(!1), document.body.removeEventListener("click", j);
     };
   }, []), p.useEffect(() => {
     if (B) {
-      const j = [...s].map((O) => O.id === B.id ? B : O);
+      const j = [...s].map((M) => M.id === B.id ? B : M);
       i(j);
     }
   }, [B]), p.useEffect(() => {
-    if (y.current && X) {
-      const j = y.current.getBoundingClientRect().height, O = window.innerHeight;
-      let m = X.top;
-      m + j > O + window.scrollY - 200 && (m = O + window.scrollY - j - 200), m < 0 && (m = 10), D({
-        top: m,
-        left: X.left
+    if (y.current && W) {
+      const j = y.current.getBoundingClientRect().height, M = window.innerHeight;
+      let _ = W.top;
+      _ + j > M + window.scrollY - 200 && (_ = M + window.scrollY - j - 200), _ < 0 && (_ = 10), E({
+        top: _,
+        left: W.left
       });
     }
-  }, [y.current, X]);
-  const A = (j, O) => {
+  }, [y.current, W]);
+  const A = (j, M) => {
     j.stopPropagation();
-    const m = j.target.getBoundingClientRect();
-    tt({
-      top: m.top + window.scrollY,
-      left: m.left - 30
-    }), S(O), E(!0);
+    const _ = j.target.getBoundingClientRect();
+    et({
+      top: _.top + window.scrollY,
+      left: _.left - 30
+    }), S(M), q(!0);
   };
   function H(j) {
     if (b)
@@ -1242,17 +1242,17 @@ const ua = (r) => {
       );
   }
   const K = (j) => {
-    const { active: O, over: m } = j;
-    if (m && O.id !== m.id) {
-      const I = s.findIndex((R) => R.id === O.id), T = s.findIndex((R) => R.id === m.id);
-      if (I !== -1 && T !== -1) {
-        const R = [...s], [U] = R.splice(I, 1);
-        R.splice(T, 0, U), i(R);
+    const { active: M, over: _ } = j;
+    if (_ && M.id !== _.id) {
+      const k = s.findIndex((L) => L.id === M.id), T = s.findIndex((L) => L.id === _.id);
+      if (k !== -1 && T !== -1) {
+        const L = [...s], [U] = L.splice(k, 1);
+        L.splice(T, 0, U), i(L);
       }
     }
   }, lt = (j) => {
-    var m;
-    const O = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    var _;
+    const M = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       c && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         v,
         {
@@ -1262,49 +1262,49 @@ const ua = (r) => {
           height: 20
         }
       ) }),
-      _ === "select" && u && /* @__PURE__ */ t.jsx(
-        st,
+      m === "select" && u && /* @__PURE__ */ t.jsx(
+        nt,
         {
-          onChange: (I) => {
-            const R = [...s].map((U) => U.id === j.id ? {
+          onChange: (k) => {
+            const L = [...s].map((U) => U.id === j.id ? {
               ...j,
-              name: I
+              name: k
             } : U);
             S({
               ...j,
-              name: I
-            }), i([...R]);
+              name: k
+            }), i([...L]);
           },
           value: j.name,
-          options: u.filter((I) => !s.find((T) => T.name === I)),
+          options: u.filter((k) => !s.find((T) => T.name === k)),
           leftAddon: H(j.images)
         }
       ),
-      _ === "input" && /* @__PURE__ */ t.jsx(
-        W,
+      m === "input" && /* @__PURE__ */ t.jsx(
+        X,
         {
-          onChange: (I) => {
-            const R = [...s].map((U) => U.id === j.id ? {
+          onChange: (k) => {
+            const L = [...s].map((U) => U.id === j.id ? {
               ...j,
-              name: I
+              name: k
             } : U);
-            i([...R]);
+            i([...L]);
           },
           value: j.name,
-          placeholder: g
+          placeholder: x
         }
       ),
-      _ === "image" && /* @__PURE__ */ t.jsx(
+      m === "image" && /* @__PURE__ */ t.jsx(
         gt,
         {
-          onChange: (I) => {
-            const R = [...s].map((U) => U.id === j.id ? {
+          onChange: (k) => {
+            const L = [...s].map((U) => U.id === j.id ? {
               ...j,
-              images: I
+              images: k
             } : U);
-            i([...R]);
+            i([...L]);
           },
-          activeImage: (m = s.find((I) => I.id === j.id)) == null ? void 0 : m.images[0]
+          activeImage: (_ = s.find((k) => k.id === j.id)) == null ? void 0 : _.images[0]
         }
       ),
       /* @__PURE__ */ t.jsxs("div", { className: z.buttons, children: [
@@ -1315,10 +1315,10 @@ const ua = (r) => {
             hoverable: !0,
             width: 20,
             height: 20,
-            onClick: (I) => A(I, j)
+            onClick: (k) => A(k, j)
           }
         ) }),
-        x && /* @__PURE__ */ t.jsx("div", { className: z.deleteButton, children: /* @__PURE__ */ t.jsx(
+        g && /* @__PURE__ */ t.jsx("div", { className: z.deleteButton, children: /* @__PURE__ */ t.jsx(
           v,
           {
             name: "Trash",
@@ -1326,7 +1326,7 @@ const ua = (r) => {
             width: 20,
             height: 20,
             fill: "#C12A2A",
-            onClick: () => i(s.filter((I) => I.id !== j.id))
+            onClick: () => i(s.filter((k) => k.id !== j.id))
           }
         ) })
       ] })
@@ -1335,53 +1335,53 @@ const ua = (r) => {
       Ls,
       {
         product: j,
-        children: O
+        children: M
       },
       j.id
     ) : /* @__PURE__ */ t.jsx(
       "div",
       {
         className: z.product,
-        children: O
+        children: M
       },
       j.id
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: z.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: z.top, children: [
+    (l || o !== 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(
-        Z,
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        tt,
         {
-          current: a,
+          current: o,
           onChange: (j) => e == null ? void 0 : e(j)
         }
       )
     ] }),
-    B && n && k && $ && /* @__PURE__ */ t.jsx(
+    B && n && I && $ && /* @__PURE__ */ t.jsx(
       Ds,
       {
         ref: y,
         activeItem: B,
         setActiveItem: S,
         popupPosition: f,
-        modalOptions: k,
-        setIsOpenModal: E
+        modalOptions: I,
+        setIsOpenModal: q
       }
     ),
-    w && q && /* @__PURE__ */ t.jsx(At, { ...q }),
+    C && O && /* @__PURE__ */ t.jsx(Mt, { ...O }),
     /* @__PURE__ */ t.jsxs("div", { className: z.products, children: [
       d && /* @__PURE__ */ t.jsx("h5", { className: z.subtitle, children: d }),
       c ? /* @__PURE__ */ t.jsx(
-        Nt,
+        $t,
         {
           sensors: G,
           onDragEnd: K,
           children: /* @__PURE__ */ t.jsx(
-            wt,
+            Nt,
             {
               items: s.map((j) => j.id),
-              strategy: Ct,
+              strategy: wt,
               children: s.map((j) => lt(j))
             }
           )
@@ -1396,36 +1396,36 @@ const ua = (r) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            Z,
             {
               withoutHover: !0,
               className: z.button,
               size: "s",
               onClick: () => {
                 const j = [...s];
-                let O = null;
+                let M = null;
                 if (u) {
-                  for (let m = 0; m < u.length; m++)
-                    if (!s.find((I) => I.name === u[m])) {
-                      O = u[m];
+                  for (let _ = 0; _ < u.length; _++)
+                    if (!s.find((k) => k.name === u[_])) {
+                      M = u[_];
                       break;
                     }
                 }
-                _ === "select" && u ? j.push({
-                  name: O || u[0],
-                  id: mt(),
-                  ...L,
+                m === "select" && u ? j.push({
+                  name: M || u[0],
+                  id: _t(),
+                  ...D,
                   maxSymbols: 100
                   // пример значения
-                }) : _ === "input" ? j.push({
+                }) : m === "input" ? j.push({
                   name: "",
-                  id: mt(),
-                  ...L,
+                  id: _t(),
+                  ...D,
                   maxSymbols: 100
                 }) : j.push({
                   name: `Image ${s.length + 1}`,
-                  id: mt(),
-                  ...L,
+                  id: _t(),
+                  ...D,
                   maxSymbols: 100
                 }), i(j);
               },
@@ -1448,61 +1448,61 @@ const ua = (r) => {
         }
       )
     ] }),
-    o !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: o })
+    a !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: a })
   ] });
-}, Rs = "_title_bn7sv_1", Ms = "_subtitle_bn7sv_5", Hs = "_header_bn7sv_12", zs = "_text_bn7sv_13", Fs = "_productsBlock_bn7sv_14", Vs = "_buttonsBlock_bn7sv_15", Us = "_top_bn7sv_26", Ys = "_itemsBlock_bn7sv_35", Gs = "_typeTexts_bn7sv_41", Ws = "_block_bn7sv_48", Xs = "_active_bn7sv_60", Js = "_products_bn7sv_14", Qs = "_product_bn7sv_14", Ks = "_button_bn7sv_15", Zs = "_image_bn7sv_90", tn = "_info_bn7sv_97", en = "_name_bn7sv_109", sn = "_buttons_bn7sv_15", nn = "_modal_bn7sv_120", on = "_other_bn7sv_139", an = "_options_bn7sv_145", cn = "_closeIcon_bn7sv_153", at = {
+}, Rs = "_title_bn7sv_1", Hs = "_subtitle_bn7sv_5", zs = "_header_bn7sv_12", Fs = "_text_bn7sv_13", Vs = "_productsBlock_bn7sv_14", Us = "_buttonsBlock_bn7sv_15", Ys = "_top_bn7sv_26", Gs = "_itemsBlock_bn7sv_35", Xs = "_typeTexts_bn7sv_41", Ws = "_block_bn7sv_48", Js = "_active_bn7sv_60", Qs = "_products_bn7sv_14", Ks = "_product_bn7sv_14", Zs = "_button_bn7sv_15", tn = "_image_bn7sv_90", en = "_info_bn7sv_97", sn = "_name_bn7sv_109", nn = "_buttons_bn7sv_15", on = "_modal_bn7sv_120", an = "_other_bn7sv_139", cn = "_options_bn7sv_145", ln = "_closeIcon_bn7sv_153", ct = {
   title: Rs,
-  subtitle: Ms,
-  header: Hs,
-  text: zs,
-  productsBlock: Fs,
-  buttonsBlock: Vs,
-  top: Us,
-  itemsBlock: Ys,
-  typeTexts: Gs,
+  subtitle: Hs,
+  header: zs,
+  text: Fs,
+  productsBlock: Vs,
+  buttonsBlock: Us,
+  top: Ys,
+  itemsBlock: Gs,
+  typeTexts: Xs,
   block: Ws,
-  active: Xs,
-  products: Js,
-  product: Qs,
-  button: Ks,
-  image: Zs,
-  info: tn,
-  name: en,
-  buttons: sn,
-  modal: nn,
-  other: on,
-  options: an,
-  closeIcon: cn
-}, ln = p.forwardRef((r, a) => {
-  const { activeButton: e, setActiveButton: s, popupPosition: i } = r, [o, l] = p.useState(e.typesText), [d, n] = p.useState(e.destination), [c, b] = p.useState(e.page), [x, h] = p.useState(e.link || ""), [_, g] = p.useState(e.text || ""), [u, w] = p.useState(e.openInNewTab), { pages: q } = Ht();
+  active: Js,
+  products: Qs,
+  product: Ks,
+  button: Zs,
+  image: tn,
+  info: en,
+  name: sn,
+  buttons: nn,
+  modal: on,
+  other: an,
+  options: cn,
+  closeIcon: ln
+}, rn = p.forwardRef((r, o) => {
+  const { activeButton: e, setActiveButton: s, popupPosition: i } = r, [a, l] = p.useState(e.typesText), [d, n] = p.useState(e.destination), [c, b] = p.useState(e.page), [g, h] = p.useState(e.link || ""), [m, x] = p.useState(e.text || ""), [u, C] = p.useState(e.openInNewTab), { pages: O } = Ft();
   return p.useEffect(() => {
     s({
       ...e,
       ...{
-        text: _,
-        link: x,
+        text: m,
+        link: g,
         destination: d,
-        typesText: o,
+        typesText: a,
         page: c,
         openInNewTab: u
       }
     });
-  }, [o, d, x, _, c, u]), /* @__PURE__ */ t.jsxs(
+  }, [a, d, g, m, c, u]), /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: at.modal,
-      onClick: (k) => {
-        k.stopPropagation();
+      className: ct.modal,
+      onClick: (I) => {
+        I.stopPropagation();
       },
       style: {
         top: `${i.top}px`,
         left: `${i.left}px`
       },
-      ref: a,
+      ref: o,
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: at.top, children: [
-          /* @__PURE__ */ t.jsx("h3", { className: at.title, children: e.type }),
-          /* @__PURE__ */ t.jsx("div", { className: at.closeIcon, children: /* @__PURE__ */ t.jsx(
+        /* @__PURE__ */ t.jsxs("div", { className: ct.top, children: [
+          /* @__PURE__ */ t.jsx("h3", { className: ct.title, children: e.type }),
+          /* @__PURE__ */ t.jsx("div", { className: ct.closeIcon, children: /* @__PURE__ */ t.jsx(
             v,
             {
               name: "X",
@@ -1513,46 +1513,46 @@ const ua = (r) => {
             }
           ) })
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { className: at.options, children: [
+        /* @__PURE__ */ t.jsxs("div", { className: ct.options, children: [
           /* @__PURE__ */ t.jsx(
-            st,
+            nt,
             {
               label: "Destination",
-              onChange: (k) => n(k),
-              options: ["Go to Page", "Open Link"].filter((k) => k !== d),
+              onChange: (I) => n(I),
+              options: ["Go to Page", "Open Link"].filter((I) => I !== d),
               value: d
             }
           ),
           d === "Go to Page" ? /* @__PURE__ */ t.jsx(
-            st,
+            nt,
             {
               label: "Go to",
-              onChange: (k) => b(k),
-              options: q ? Object.values(q).filter((k) => k.name !== c).map((k) => k.name) : [],
+              onChange: (I) => b(I),
+              options: O ? Object.values(O).filter((I) => I.name !== c).map((I) => I.name) : [],
               value: c
             }
           ) : /* @__PURE__ */ t.jsx(
-            W,
+            X,
             {
-              onChange: (k) => h(k),
-              value: x,
+              onChange: (I) => h(I),
+              value: g,
               placeholder: "https://",
               label: "Link"
             }
           ),
           /* @__PURE__ */ t.jsx(
-            Z,
+            tt,
             {
               current: e.openInNewTab,
               label: "Open in new tab",
-              onChange: (k) => w(k)
+              onChange: (I) => C(I)
             }
           ),
           /* @__PURE__ */ t.jsx(
             Ot,
             {
-              onChange: (k) => g(k),
-              value: _,
+              onChange: (I) => x(I),
+              value: m,
               label: "Text",
               maxLength: 150
             }
@@ -1560,7 +1560,7 @@ const ua = (r) => {
           /* @__PURE__ */ t.jsx(
             Lt,
             {
-              typesText: o,
+              typesText: a,
               setTypesText: l
             }
           )
@@ -1568,106 +1568,106 @@ const ua = (r) => {
       ]
     }
   );
-}), rn = "_subtitle_jql1y_1", dn = "_header_jql1y_8", un = "_text_jql1y_9", mn = "_productsBlock_jql1y_10", _n = "_buttonsBlock_jql1y_11", hn = "_top_jql1y_23", pn = "_itemsBlock_jql1y_32", gn = "_typeTexts_jql1y_38", xn = "_block_jql1y_45", fn = "_active_jql1y_58", bn = "_products_jql1y_10", vn = "_product_jql1y_10", jn = "_button_jql1y_11", yn = "_image_jql1y_88", kn = "_info_jql1y_95", In = "_name_jql1y_107", $n = "_buttons_jql1y_11", Nn = "_modal_jql1y_118", wn = "_other_jql1y_138", Cn = "_options_jql1y_144", Bn = "_addButton_jql1y_150", Sn = "_deleteButton_jql1y_165", nt = {
-  subtitle: rn,
-  header: dn,
-  text: un,
+}), dn = "_subtitle_jql1y_1", un = "_header_jql1y_8", _n = "_text_jql1y_9", mn = "_productsBlock_jql1y_10", hn = "_buttonsBlock_jql1y_11", pn = "_top_jql1y_23", xn = "_itemsBlock_jql1y_32", gn = "_typeTexts_jql1y_38", fn = "_block_jql1y_45", bn = "_active_jql1y_58", vn = "_products_jql1y_10", jn = "_product_jql1y_10", yn = "_button_jql1y_11", In = "_image_jql1y_88", kn = "_info_jql1y_95", $n = "_name_jql1y_107", Nn = "_buttons_jql1y_11", wn = "_modal_jql1y_118", Cn = "_other_jql1y_138", Bn = "_options_jql1y_144", Sn = "_addButton_jql1y_150", Tn = "_deleteButton_jql1y_165", it = {
+  subtitle: dn,
+  header: un,
+  text: _n,
   productsBlock: mn,
-  buttonsBlock: _n,
-  top: hn,
-  itemsBlock: pn,
+  buttonsBlock: hn,
+  top: pn,
+  itemsBlock: xn,
   typeTexts: gn,
-  block: xn,
-  active: fn,
-  products: bn,
-  product: vn,
-  button: jn,
-  image: yn,
+  block: fn,
+  active: bn,
+  products: vn,
+  product: jn,
+  button: yn,
+  image: In,
   info: kn,
-  name: In,
-  buttons: $n,
-  modal: Nn,
-  other: wn,
-  options: Cn,
-  addButton: Bn,
-  deleteButton: Sn
-}, Tn = (r) => {
-  const { buttons: a, setButtons: e, deletable: s = !0, addable: i = !0 } = r, [o, l] = p.useState(null), [d, n] = p.useState({
+  name: $n,
+  buttons: Nn,
+  modal: wn,
+  other: Cn,
+  options: Bn,
+  addButton: Sn,
+  deleteButton: Tn
+}, Pn = (r) => {
+  const { buttons: o, setButtons: e, deletable: s = !0, addable: i = !0 } = r, [a, l] = p.useState(null), [d, n] = p.useState({
     top: 0,
     left: 0
-  }), [c, b] = p.useState(null), x = p.useRef(null);
+  }), [c, b] = p.useState(null), g = p.useRef(null);
   p.useEffect(() => {
-    const _ = () => {
+    const m = () => {
       l(null);
     };
-    return document.body.addEventListener("click", _), l(null), () => {
-      l(null), document.body.removeEventListener("click", _);
+    return document.body.addEventListener("click", m), l(null), () => {
+      l(null), document.body.removeEventListener("click", m);
     };
   }, []), p.useEffect(() => {
-    if (o) {
-      const _ = [...a].map((g) => g.id === o.id ? o : g);
-      e(_);
+    if (a) {
+      const m = [...o].map((x) => x.id === a.id ? a : x);
+      e(m);
     }
-  }, [o]), p.useEffect(() => {
-    if (x.current && c) {
-      const _ = x.current.getBoundingClientRect().height, g = window.innerHeight;
+  }, [a]), p.useEffect(() => {
+    if (g.current && c) {
+      const m = g.current.getBoundingClientRect().height, x = window.innerHeight;
       let u = c.top;
-      u + _ > g + window.scrollY - 200 && (u = g + window.scrollY - _ - 200), u < 0 && (u = 10), n({
+      u + m > x + window.scrollY - 200 && (u = x + window.scrollY - m - 200), u < 0 && (u = 10), n({
         top: u,
         left: c.left
       });
     }
-  }, [x.current, c]);
-  const h = (_, g) => {
-    _.stopPropagation();
-    const u = _.target.getBoundingClientRect();
+  }, [g.current, c]);
+  const h = (m, x) => {
+    m.stopPropagation();
+    const u = m.target.getBoundingClientRect();
     b({
       top: u.top + window.scrollY,
       left: u.left - 30
-    }), l(g);
+    }), l(x);
   };
-  return /* @__PURE__ */ t.jsxs("div", { className: nt.products, children: [
-    /* @__PURE__ */ t.jsx("h5", { className: nt.subtitle, children: "Button Type" }),
-    a.map((_) => /* @__PURE__ */ t.jsxs(
+  return /* @__PURE__ */ t.jsxs("div", { className: it.products, children: [
+    /* @__PURE__ */ t.jsx("h5", { className: it.subtitle, children: "Button Type" }),
+    o.map((m) => /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: nt.product,
+        className: it.product,
         children: [
           /* @__PURE__ */ t.jsx(
-            st,
+            nt,
             {
-              onChange: (g) => {
-                const w = [...a].map((q) => q.id === _.id ? {
-                  ..._,
-                  type: g
-                } : q);
-                e(w);
+              onChange: (x) => {
+                const C = [...o].map((O) => O.id === m.id ? {
+                  ...m,
+                  type: x
+                } : O);
+                e(C);
               },
-              value: _.type,
+              value: m.type,
               options: ["Primary", "Secondary", "Tertiary"]
             }
           ),
-          /* @__PURE__ */ t.jsxs("div", { className: nt.buttons, children: [
-            /* @__PURE__ */ t.jsx("div", { className: nt.deleteButton, children: /* @__PURE__ */ t.jsx(
+          /* @__PURE__ */ t.jsxs("div", { className: it.buttons, children: [
+            /* @__PURE__ */ t.jsx("div", { className: it.deleteButton, children: /* @__PURE__ */ t.jsx(
               v,
               {
                 name: "Sliders",
                 hoverable: !0,
                 width: 20,
                 height: 20,
-                onClick: (g) => {
-                  h(g, _);
+                onClick: (x) => {
+                  h(x, m);
                 }
               }
             ) }),
-            s && /* @__PURE__ */ t.jsx("div", { className: nt.deleteButton, children: /* @__PURE__ */ t.jsx(
+            s && /* @__PURE__ */ t.jsx("div", { className: it.deleteButton, children: /* @__PURE__ */ t.jsx(
               v,
               {
                 name: "Trash",
                 hoverable: !0,
                 onClick: () => {
-                  const g = a.filter((u) => u.id !== _.id);
-                  e(g);
+                  const x = o.filter((u) => u.id !== m.id);
+                  e(x);
                 },
                 width: 20,
                 height: 20,
@@ -1677,13 +1677,13 @@ const ua = (r) => {
           ] })
         ]
       },
-      _.id
+      m.id
     )),
-    o && /* @__PURE__ */ t.jsx(
-      ln,
+    a && /* @__PURE__ */ t.jsx(
+      rn,
       {
-        ref: x,
-        activeButton: o,
+        ref: g,
+        activeButton: a,
         setActiveButton: l,
         popupPosition: d
       }
@@ -1697,27 +1697,27 @@ const ua = (r) => {
           justifyContent: "center"
         },
         children: /* @__PURE__ */ t.jsx(
-          ct,
+          Z,
           {
             withoutHover: !0,
-            className: nt.button,
+            className: it.button,
             size: "s",
             onClick: () => {
-              const _ = [...a];
-              _.push({
+              const m = [...o];
+              m.push({
                 type: "Primary",
-                id: mt(),
+                id: _t(),
                 typesText: [],
                 destination: "Go to Page",
                 text: "Button Name",
                 page: "home",
                 openInNewTab: !0
-              }), e(_);
+              }), e(m);
             },
             style: {
               width: "fit-content"
             },
-            children: /* @__PURE__ */ t.jsxs("div", { className: nt.addButton, children: [
+            children: /* @__PURE__ */ t.jsxs("div", { className: it.addButton, children: [
               /* @__PURE__ */ t.jsx("span", { children: "Add Option" }),
               /* @__PURE__ */ t.jsx(
                 v,
@@ -1733,53 +1733,53 @@ const ua = (r) => {
       }
     )
   ] });
-}, ma = (r) => {
-  const { isActiveButtons: a, setIsActiveButtons: e, buttons: s, setButtons: i } = r;
-  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: at.buttonsBlock, children: [
-    /* @__PURE__ */ t.jsxs("div", { className: at.top, children: [
-      /* @__PURE__ */ t.jsx("h3", { className: at.title, children: "Buttons" }),
+}, va = (r) => {
+  const { isActiveButtons: o, setIsActiveButtons: e, buttons: s, setButtons: i } = r;
+  return /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsxs("div", { className: ct.buttonsBlock, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: ct.top, children: [
+      /* @__PURE__ */ t.jsx("h3", { className: ct.title, children: "Buttons" }),
       /* @__PURE__ */ t.jsx(
-        Z,
+        tt,
         {
-          current: a,
-          onChange: (o) => e(o)
+          current: o,
+          onChange: (a) => e(a)
         }
       )
     ] }),
     /* @__PURE__ */ t.jsx(
-      Tn,
+      Pn,
       {
         buttons: s,
         setButtons: i
       }
     )
   ] }) });
-}, Pn = "_wrapper_m18qi_1", An = "_subtitle_m18qi_7", On = "_content_m18qi_14", qn = "_range_m18qi_22", En = "_track_m18qi_27", Dn = "_progress_m18qi_36", Ln = "_dots_m18qi_46", Rn = "_dot_m18qi_46", Mn = "_active_m18qi_65", Hn = "_input_m18qi_77", zn = "_countBlock_m18qi_91", Fn = "_count_m18qi_91", Vn = "_controls_m18qi_107", Un = "_button_m18qi_113", Y = {
-  wrapper: Pn,
-  subtitle: An,
+}, An = "_wrapper_m18qi_1", Mn = "_subtitle_m18qi_7", On = "_content_m18qi_14", qn = "_range_m18qi_22", En = "_track_m18qi_27", Dn = "_progress_m18qi_36", Ln = "_dots_m18qi_46", Rn = "_dot_m18qi_46", Hn = "_active_m18qi_65", zn = "_input_m18qi_77", Fn = "_countBlock_m18qi_91", Vn = "_count_m18qi_91", Un = "_controls_m18qi_107", Yn = "_button_m18qi_113", Y = {
+  wrapper: An,
+  subtitle: Mn,
   content: On,
   range: qn,
   track: En,
   progress: Dn,
   dots: Ln,
   dot: Rn,
-  active: Mn,
-  input: Hn,
-  countBlock: zn,
-  count: Fn,
-  controls: Vn,
-  button: Un
-}, At = (r) => {
-  const { label: a, min: e = 1, max: s = 4, step: i = 1, count: o, setCount: l } = r, [d, n] = p.useState(!1), c = Array.from({ length: (s - e) / i + 1 }), b = (o - e) / (s - e) * 100, x = () => {
-    o < s && l(o + i);
+  active: Hn,
+  input: zn,
+  countBlock: Fn,
+  count: Vn,
+  controls: Un,
+  button: Yn
+}, Mt = (r) => {
+  const { label: o, min: e = 1, max: s = 4, step: i = 1, count: a, setCount: l } = r, [d, n] = p.useState(!1), c = Array.from({ length: (s - e) / i + 1 }), b = (a - e) / (s - e) * 100, g = () => {
+    a < s && l(a + i);
   }, h = () => {
-    o > e && l(o - i);
-  }, _ = (g) => {
-    const u = e + g * i;
+    a > e && l(a - i);
+  }, m = (x) => {
+    const u = e + x * i;
     l(u);
   };
   return /* @__PURE__ */ t.jsxs("div", { className: Y.wrapper, children: [
-    a && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: a }),
+    o && /* @__PURE__ */ t.jsx("h5", { className: Y.subtitle, children: o }),
     /* @__PURE__ */ t.jsxs("div", { className: Y.content, children: [
       /* @__PURE__ */ t.jsxs("div", { className: Y.range, children: [
         /* @__PURE__ */ t.jsx("div", { className: Y.track }),
@@ -1790,15 +1790,15 @@ const ua = (r) => {
             style: { width: `${b}%` }
           }
         ),
-        /* @__PURE__ */ t.jsx("div", { className: Y.dots, children: c.map((g, u) => {
-          const w = u <= (o - e) / i;
+        /* @__PURE__ */ t.jsx("div", { className: Y.dots, children: c.map((x, u) => {
+          const C = u <= (a - e) / i;
           return /* @__PURE__ */ t.jsx(
             "button",
             {
-              onClick: () => _(u),
+              onClick: () => m(u),
               className: F(Y.dot, {
-                [Y.active]: w,
-                [Y.inactive]: !w,
+                [Y.active]: C,
+                [Y.inactive]: !C,
                 [Y.dragging]: d
               }),
               "aria-label": `Set value to ${e + u * i}`
@@ -1813,8 +1813,8 @@ const ua = (r) => {
             min: e,
             max: s,
             step: i,
-            value: o,
-            onChange: (g) => l(Number(g.target.value)),
+            value: a,
+            onChange: (x) => l(Number(x.target.value)),
             onMouseDown: () => n(!0),
             onMouseUp: () => n(!1),
             onTouchStart: () => n(!0),
@@ -1825,25 +1825,25 @@ const ua = (r) => {
       ] }),
       /* @__PURE__ */ t.jsxs("div", { className: Y.countBlock, children: [
         /* @__PURE__ */ t.jsx(
-          W,
+          X,
           {
             type: "number",
             min: e,
             max: s,
             paddingless: !0,
-            onChange: (g) => {
-              const u = Number(g);
+            onChange: (x) => {
+              const u = Number(x);
               u > s ? l(s) : u < e ? l(e) : l(u);
             },
-            value: String(o)
+            value: String(a)
           }
         ),
         /* @__PURE__ */ t.jsxs("div", { className: Y.controls, children: [
           /* @__PURE__ */ t.jsx(
             "button",
             {
-              onClick: x,
-              disabled: o >= s,
+              onClick: g,
+              disabled: a >= s,
               className: Y.button,
               "aria-label": "Increment count",
               children: /* @__PURE__ */ t.jsx(
@@ -1860,7 +1860,7 @@ const ua = (r) => {
             "button",
             {
               onClick: h,
-              disabled: o <= e,
+              disabled: a <= e,
               className: Y.button,
               "aria-label": "Decrement count",
               children: /* @__PURE__ */ t.jsx(
@@ -1877,32 +1877,32 @@ const ua = (r) => {
       ] })
     ] })
   ] });
-}, Yn = "_title_ix5ax_1", Gn = "_subtitle_ix5ax_5", Wn = "_header_ix5ax_12", Xn = "_text_ix5ax_13", Jn = "_productsBlock_ix5ax_14", Qn = "_top_ix5ax_26", Kn = "_itemsBlock_ix5ax_35", Zn = "_typeTexts_ix5ax_41", ti = "_block_ix5ax_48", ei = "_active_ix5ax_61", si = "_products_ix5ax_14", ni = "_product_ix5ax_14", ii = "_button_ix5ax_80", oi = "_image_ix5ax_91", ai = "_info_ix5ax_98", ci = "_name_ix5ax_110", li = "_buttons_ix5ax_114", ri = "_modal_ix5ax_121", di = "_link_ix5ax_141", ui = "_modalOptions_ix5ax_147", mi = "_addButton_ix5ax_160", _i = "_deleteButton_ix5ax_175", hi = "_closeIcon_ix5ax_187", V = {
-  title: Yn,
-  subtitle: Gn,
+}, Gn = "_title_ix5ax_1", Xn = "_subtitle_ix5ax_5", Wn = "_header_ix5ax_12", Jn = "_text_ix5ax_13", Qn = "_productsBlock_ix5ax_14", Kn = "_top_ix5ax_26", Zn = "_itemsBlock_ix5ax_35", ti = "_typeTexts_ix5ax_41", ei = "_block_ix5ax_48", si = "_active_ix5ax_61", ni = "_products_ix5ax_14", ii = "_product_ix5ax_14", oi = "_button_ix5ax_80", ai = "_image_ix5ax_91", ci = "_info_ix5ax_98", li = "_name_ix5ax_110", ri = "_buttons_ix5ax_114", di = "_modal_ix5ax_121", ui = "_link_ix5ax_141", _i = "_modalOptions_ix5ax_147", mi = "_addButton_ix5ax_160", hi = "_deleteButton_ix5ax_175", pi = "_closeIcon_ix5ax_187", V = {
+  title: Gn,
+  subtitle: Xn,
   header: Wn,
-  text: Xn,
-  productsBlock: Jn,
-  top: Qn,
-  itemsBlock: Kn,
-  typeTexts: Zn,
-  block: ti,
-  active: ei,
-  products: si,
-  product: ni,
-  button: ii,
-  image: oi,
-  info: ai,
-  name: ci,
-  buttons: li,
-  modal: ri,
-  link: di,
-  modalOptions: ui,
+  text: Jn,
+  productsBlock: Qn,
+  top: Kn,
+  itemsBlock: Zn,
+  typeTexts: ti,
+  block: ei,
+  active: si,
+  products: ni,
+  product: ii,
+  button: oi,
+  image: ai,
+  info: ci,
+  name: li,
+  buttons: ri,
+  modal: di,
+  link: ui,
+  modalOptions: _i,
   addButton: mi,
-  deleteButton: _i,
-  closeIcon: hi
-}, pi = (r) => {
-  const { activeItem: a, setActiveItem: e, popupPosition: s, setIsOpenModal: i, itemsOptions: o } = r, l = o.find((n) => n.id === a.listingId);
+  deleteButton: hi,
+  closeIcon: pi
+}, xi = (r) => {
+  const { activeItem: o, setActiveItem: e, popupPosition: s, setIsOpenModal: i, itemsOptions: a } = r, l = a.find((n) => n.id === o.listingId);
   if (!l) return null;
   function d(n, c) {
     return n.length > c ? `${n.slice(0, c)}...` : n;
@@ -1940,7 +1940,7 @@ const ua = (r) => {
             activeImage: l.productData.images.length > 0 ? l.productData.images[0].cfId : void 0,
             onChange: (n) => {
               const c = {
-                ...a,
+                ...o,
                 image: n[0]
               };
               e(c);
@@ -1952,16 +1952,16 @@ const ua = (r) => {
   );
 };
 function gi(r) {
-  const { product: a, children: e } = r, { attributes: s, listeners: i, setNodeRef: o, transform: l, transition: d, isDragging: n } = St({
-    id: String(a.listingId)
+  const { product: o, children: e } = r, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: d, isDragging: n } = Bt({
+    id: String(o.listingId)
   }), c = {
-    transform: Tt.Transform.toString(l),
+    transform: St.Transform.toString(l),
     transition: d
   };
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: o,
+      ref: a,
       style: c,
       className: `${V.product} ${n ? V.dragging : ""}`,
       ...s,
@@ -1970,29 +1970,29 @@ function gi(r) {
     }
   );
 }
-const _a = (r) => {
+const ja = (r) => {
   const {
-    isActiveItems: a,
+    isActiveItems: o,
     setIsActiveItems: e,
     items: s,
     setItems: i,
-    other: o,
+    other: a,
     title: l,
     subtitle: d,
     editable: n = !0,
     draggable: c = !1,
     withImage: b = !1,
-    deletable: x = !0,
+    deletable: g = !0,
     addable: h = !0,
-    itemsType: _,
-    itemsOptions: g
-  } = r, [u, w] = p.useState(
+    itemsType: m,
+    itemsOptions: x
+  } = r, [u, C] = p.useState(
     null
-  ), [q, k] = p.useState({
+  ), [O, I] = p.useState({
     top: 0,
     left: 0
-  }), [L, B] = p.useState(!1), S = It(
-    $t(Bt, {
+  }), [D, B] = p.useState(!1), S = It(
+    kt(Ct, {
       activationConstraint: {
         distance: 5
       }
@@ -2000,10 +2000,10 @@ const _a = (r) => {
   );
   p.useEffect(() => {
     const y = () => {
-      w(null), B(!1);
+      C(null), B(!1);
     };
-    return document.body.addEventListener("click", y), w(null), B(!1), () => {
-      w(null), B(!1), document.body.removeEventListener("click", y);
+    return document.body.addEventListener("click", y), C(null), B(!1), () => {
+      C(null), B(!1), document.body.removeEventListener("click", y);
     };
   }, []), p.useEffect(() => {
     if (u) {
@@ -2013,14 +2013,14 @@ const _a = (r) => {
   }, [u]);
   const f = (y, $) => {
     y.stopPropagation();
-    const E = y.target.getBoundingClientRect(), G = 100, A = window.innerHeight;
-    let H = E.top + window.scrollY;
-    H + G > A && (H = A - G - 20), B(!0), k({
+    const q = y.target.getBoundingClientRect(), G = 100, A = window.innerHeight;
+    let H = q.top + window.scrollY;
+    H + G > A && (H = A - G - 20), B(!0), I({
       top: H - 80,
-      left: E.left - 30
-    }), w($);
+      left: q.left - 30
+    }), C($);
   };
-  function D(y) {
+  function E(y) {
     if (b)
       return y ? /* @__PURE__ */ t.jsx(
         "img",
@@ -2040,18 +2040,18 @@ const _a = (r) => {
         }
       );
   }
-  const X = (y) => {
-    const { active: $, over: E } = y;
-    if (E && $.id !== E.id) {
-      const G = s.findIndex((H) => String(H.listingId) === $.id), A = s.findIndex((H) => String(H.listingId) === E.id);
+  const W = (y) => {
+    const { active: $, over: q } = y;
+    if (q && $.id !== q.id) {
+      const G = s.findIndex((H) => String(H.listingId) === $.id), A = s.findIndex((H) => String(H.listingId) === q.id);
       if (G !== -1 && A !== -1) {
         const H = [...s], [K] = H.splice(G, 1);
         H.splice(A, 0, K), i(H);
       }
     }
-  }, tt = (y, $) => {
-    const E = g.find((A) => y.listingId === A.id);
-    if (!E) return null;
+  }, et = (y, $) => {
+    const q = x.find((A) => y.listingId === A.id);
+    if (!q) return null;
     const G = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       c && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
         v,
@@ -2062,24 +2062,24 @@ const _a = (r) => {
           height: 20
         }
       ) }),
-      _ === "select" && /* @__PURE__ */ t.jsx(
-        st,
+      m === "select" && /* @__PURE__ */ t.jsx(
+        nt,
         {
           onChange: (A) => {
-            const H = [...s], K = g.find((O) => O.productData.name === A);
+            const H = [...s], K = x.find((M) => M.productData.name === A);
             if (!K) return;
             const lt = {
               listingId: K.id,
               image: K.productData.images.length > 0 ? K.productData.images[0].cfId : ""
-            }, j = H.map((O) => O.listingId === y.listingId ? lt : O);
-            w(lt), i([...j]);
+            }, j = H.map((M) => M.listingId === y.listingId ? lt : M);
+            C(lt), i([...j]);
           },
-          value: E.productData.name,
+          value: q.productData.name,
           options: [
-            ...g.filter((A) => !s.find((H) => H.listingId === A.id)).map((A) => A.productData.name)
+            ...x.filter((A) => !s.find((H) => H.listingId === A.id)).map((A) => A.productData.name)
           ],
-          leftAddon: D(
-            y.image || E.productData.images.length > 0 && E.productData.images[0].cfId || ""
+          leftAddon: E(
+            y.image || q.productData.images.length > 0 && q.productData.images[0].cfId || ""
           )
         },
         $
@@ -2095,7 +2095,7 @@ const _a = (r) => {
             onClick: (A) => f(A, y)
           }
         ) }),
-        x && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
+        g && /* @__PURE__ */ t.jsx("div", { className: V.deleteButton, children: /* @__PURE__ */ t.jsx(
           v,
           {
             name: "Trash",
@@ -2125,43 +2125,43 @@ const _a = (r) => {
     );
   };
   return /* @__PURE__ */ t.jsxs("div", { className: V.productsBlock, children: [
-    (l || a !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
+    (l || o !== 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(
-        Z,
+      o !== void 0 && /* @__PURE__ */ t.jsx(
+        tt,
         {
-          current: a,
+          current: o,
           onChange: (y) => e == null ? void 0 : e(y)
         }
       )
     ] }),
-    L && u && /* @__PURE__ */ t.jsx(
-      pi,
+    D && u && /* @__PURE__ */ t.jsx(
+      xi,
       {
         activeItem: u,
-        setActiveItem: w,
+        setActiveItem: C,
         setIsOpenModal: B,
-        popupPosition: q,
-        itemsOptions: g
+        popupPosition: O,
+        itemsOptions: x
       }
     ),
     /* @__PURE__ */ t.jsxs("div", { className: V.products, children: [
       d && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: d }),
       c ? /* @__PURE__ */ t.jsx(
-        Nt,
+        $t,
         {
           sensors: S,
-          onDragEnd: X,
+          onDragEnd: W,
           children: /* @__PURE__ */ t.jsx(
-            wt,
+            Nt,
             {
               items: s.map((y) => String(y.listingId)),
-              strategy: Ct,
-              children: s.map((y, $) => tt(y, $))
+              strategy: wt,
+              children: s.map((y, $) => et(y, $))
             }
           )
         }
-      ) : s.map((y, $) => tt(y, $)),
+      ) : s.map((y, $) => et(y, $)),
       h && /* @__PURE__ */ t.jsx(
         "div",
         {
@@ -2171,24 +2171,24 @@ const _a = (r) => {
             justifyContent: "center"
           },
           children: /* @__PURE__ */ t.jsx(
-            ct,
+            Z,
             {
               withoutHover: !0,
               className: V.button,
               size: "s",
               onClick: () => {
                 const y = [...s];
-                for (let $ = 0; $ < g.length; $++)
-                  if (!s.find((E) => E.listingId === g[$].id)) {
+                for (let $ = 0; $ < x.length; $++)
+                  if (!s.find((q) => q.listingId === x[$].id)) {
                     y.push({
-                      listingId: g[$].id,
-                      image: g[$].productData.images.length > 0 ? g[$].productData.images[0].cfId : ""
+                      listingId: x[$].id,
+                      image: x[$].productData.images.length > 0 ? x[$].productData.images[0].cfId : ""
                     });
                     break;
                   }
                 i(y);
               },
-              disabled: s.length === g.length,
+              disabled: s.length === x.length,
               style: {
                 width: "fit-content"
               },
@@ -2208,26 +2208,26 @@ const _a = (r) => {
         }
       )
     ] }),
-    o !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: o })
+    a !== void 0 && /* @__PURE__ */ t.jsx(vt, { items: a })
   ] });
-}, xi = "_options_d1lk6_1", fi = "_price_d1lk6_12", bi = "_oldPrice_d1lk6_19", vi = "_newPrice_d1lk6_27", ji = "_animate_d1lk6_34", yi = "_appearAndBounce_d1lk6_1", ki = "_meta_d1lk6_52", Ii = "_info_d1lk6_58", $i = "_infoRight_d1lk6_66", Ni = "_buttons_d1lk6_73", wi = "_variants_d1lk6_80", Ci = "_variant_d1lk6_80", Bi = "_stock_d1lk6_98", Si = "_variantInfo_d1lk6_105", Ti = "_quantity_d1lk6_111", Pi = "_count_d1lk6_118", Ai = "_focused_d1lk6_135", Oi = "_button_d1lk6_73", qi = "_activeVariant_d1lk6_161", Ei = "_chargeTypes_d1lk6_165", Di = "_charge_d1lk6_165", Li = "_chargeActive_d1lk6_190", Ri = "_title_d1lk6_198", N = {
-  options: xi,
-  price: fi,
-  oldPrice: bi,
-  newPrice: vi,
-  animate: ji,
-  appearAndBounce: yi,
+}, fi = "_options_d1lk6_1", bi = "_price_d1lk6_12", vi = "_oldPrice_d1lk6_19", ji = "_newPrice_d1lk6_27", yi = "_animate_d1lk6_34", Ii = "_appearAndBounce_d1lk6_1", ki = "_meta_d1lk6_52", $i = "_info_d1lk6_58", Ni = "_infoRight_d1lk6_66", wi = "_buttons_d1lk6_73", Ci = "_variants_d1lk6_80", Bi = "_variant_d1lk6_80", Si = "_stock_d1lk6_98", Ti = "_variantInfo_d1lk6_105", Pi = "_quantity_d1lk6_111", Ai = "_count_d1lk6_118", Mi = "_focused_d1lk6_135", Oi = "_button_d1lk6_73", qi = "_activeVariant_d1lk6_161", Ei = "_chargeTypes_d1lk6_165", Di = "_charge_d1lk6_165", Li = "_chargeActive_d1lk6_190", Ri = "_title_d1lk6_198", N = {
+  options: fi,
+  price: bi,
+  oldPrice: vi,
+  newPrice: ji,
+  animate: yi,
+  appearAndBounce: Ii,
   meta: ki,
-  info: Ii,
-  infoRight: $i,
-  buttons: Ni,
-  variants: wi,
-  variant: Ci,
-  stock: Bi,
-  variantInfo: Si,
-  quantity: Ti,
-  count: Pi,
-  focused: Ai,
+  info: $i,
+  infoRight: Ni,
+  buttons: wi,
+  variants: Ci,
+  variant: Bi,
+  stock: Si,
+  variantInfo: Ti,
+  quantity: Pi,
+  count: Ai,
+  focused: Mi,
   button: Oi,
   activeVariant: qi,
   chargeTypes: Ei,
@@ -2235,26 +2235,26 @@ const _a = (r) => {
   chargeActive: Li,
   title: Ri
 };
-var Mt = /* @__PURE__ */ ((r) => (r.ONE_TIME = "One-Time", r.RECURRING = "Subscribe & Save", r))(Mt || {});
-const ha = (r) => {
+var Ht = /* @__PURE__ */ ((r) => (r.ONE_TIME = "One-Time", r.RECURRING = "Subscribe & Save", r))(Ht || {});
+const ya = (r) => {
   var B, S;
-  const { variants: a } = r, [e, s] = p.useState(a[0]), [i, o] = p.useState(e.chargeTypes[0]), l = bt(), [d, n] = p.useState(1), [c, b] = p.useState(!1), { reset: x, addProductToCart: h, getProducts: _ } = Pt(), [g, u] = p.useState(!1);
+  const { variants: o } = r, [e, s] = p.useState(o[0]), [i, a] = p.useState(e.chargeTypes[0]), l = Tt(), [d, n] = p.useState(1), [c, b] = p.useState(!1), { reset: g, addProductToCart: h, getProducts: m } = Pt(), [x, u] = p.useState(!1);
   p.useEffect(() => {
     u(!0);
     const f = setTimeout(() => u(!1), 600);
     return () => clearTimeout(f);
   }, [d]);
-  async function w() {
-    await _(), await h({
+  async function C() {
+    await m(), await h({
       productId: r.id,
       productVariantId: e.id,
       quantity: d
     });
   }
-  function q() {
-    x(), w(), l("/checkout");
+  function O() {
+    g(), C(), l("/checkout");
   }
-  function k(f) {
+  function I(f) {
     if (f >= 864e5) {
       const $ = Math.floor(f / 864e5);
       return `${$} ${$ === 1 ? "day" : "days"}`;
@@ -2269,8 +2269,8 @@ const ha = (r) => {
       return `${$} ${$ === 1 ? "second" : "seconds"}`;
     }
   }
-  function L(f, D) {
-    return f.length > D ? f.slice(0, D) + "..." : f;
+  function D(f, E) {
+    return f.length > E ? f.slice(0, E) + "..." : f;
   }
   return /* @__PURE__ */ t.jsxs("div", { className: N.options, children: [
     e.chargeTypes.length > 1 && /* @__PURE__ */ t.jsx("div", { className: N.chargeTypes, children: e.chargeTypes.map((f) => /* @__PURE__ */ t.jsx(
@@ -2279,13 +2279,13 @@ const ha = (r) => {
         className: F(N.charge, {
           [N.chargeActive]: i === f
         }),
-        onClick: () => o(f),
-        children: Mt[f]
+        onClick: () => a(f),
+        children: Ht[f]
       },
       f
     )) }),
-    /* @__PURE__ */ t.jsx("div", { className: N.variants, children: a.map((f) => {
-      var D;
+    /* @__PURE__ */ t.jsx("div", { className: N.variants, children: o.map((f) => {
+      var E;
       return /* @__PURE__ */ t.jsxs(
         "div",
         {
@@ -2295,14 +2295,14 @@ const ha = (r) => {
           onClick: () => s(f),
           children: [
             /* @__PURE__ */ t.jsxs("div", { className: N.variantInfo, children: [
-              /* @__PURE__ */ t.jsx("span", { className: N.title, children: L(f.name, 15) }),
+              /* @__PURE__ */ t.jsx("span", { className: N.title, children: D(f.name, 15) }),
               /* @__PURE__ */ t.jsxs("span", { children: [
                 "$",
                 i === "ONE_TIME" ? f.price.amount : f.subscriptionSettings ? f.subscriptionSettings.price.amount : "Price Not Found"
               ] })
             ] }),
             /* @__PURE__ */ t.jsx("div", { children: i === "ONE_TIME" && /* @__PURE__ */ t.jsxs("span", { className: N.stock, children: [
-              ((D = f.quantity.restrictions) == null ? void 0 : D.max) || f.quantity.available || 0,
+              ((E = f.quantity.restrictions) == null ? void 0 : E.max) || f.quantity.available || 0,
               " in stock"
             ] }) })
           ]
@@ -2331,7 +2331,7 @@ const ha = (r) => {
           onFocus: () => b(!0),
           onBlur: () => b(!1),
           children: /* @__PURE__ */ t.jsx(
-            W,
+            X,
             {
               type: "number",
               value: String(d),
@@ -2372,13 +2372,13 @@ const ha = (r) => {
               height: 20
             }
           ),
-          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : k(e.deliveryTime) })
+          /* @__PURE__ */ t.jsx("span", { children: !e.deliveryTime || e.deliveryTime === 0 ? "Instant" : I(e.deliveryTime) })
         ] })
       ] }),
       /* @__PURE__ */ t.jsxs("div", { className: N.info, children: [
         /* @__PURE__ */ t.jsx("span", { children: "Price" }),
         /* @__PURE__ */ t.jsx("div", { className: N.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: N.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
+          /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: x }), children: [
             "$ ",
             (e.price.amount || 0) * d
           ] }),
@@ -2386,11 +2386,11 @@ const ha = (r) => {
             "$ ",
             (e.compareAtPrice.amount || 0) * d
           ] })
-        ] }) : /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
+        ] }) : /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: x }), children: [
           "$ ",
           (e.price.amount || 0) * d
         ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: N.price, children: [
-          /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
+          /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: x }), children: [
             "$ ",
             e.subscriptionSettings.price.amount || 0
           ] }),
@@ -2398,7 +2398,7 @@ const ha = (r) => {
             "$ ",
             e.subscriptionSettings.compareAtPrice.amount || 0
           ] })
-        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: g }), children: [
+        ] }) : e.subscriptionSettings && /* @__PURE__ */ t.jsxs("span", { className: F(N.newPrice, { [N.animate]: x }), children: [
           "$ ",
           e.subscriptionSettings.price.amount || 0
         ] }) })
@@ -2406,86 +2406,92 @@ const ha = (r) => {
     ] }),
     /* @__PURE__ */ t.jsxs("div", { className: N.buttons, children: [
       /* @__PURE__ */ t.jsx(
-        ct,
+        Z,
         {
           type: "Primary",
-          onClick: () => q(),
+          onClick: () => O(),
           children: /* @__PURE__ */ t.jsx("span", { children: i === "ONE_TIME" ? "Buy Now" : "Subscribe Now" })
         }
       ),
       i === "ONE_TIME" && /* @__PURE__ */ t.jsx(
-        ct,
+        Z,
         {
           type: "Secondary",
-          onClick: () => w(),
+          onClick: () => C(),
           children: "Add to Cart"
         }
       )
     ] })
   ] });
-}, Mi = "_button_oyh2y_1", Hi = "_login_oyh2y_14", zi = "_signUp_oyh2y_18", Fi = "_buttons_oyh2y_23", Vi = "_modal_oyh2y_32", Ui = "_closing_oyh2y_61", Yi = "_info_oyh2y_85", Gi = "_top_oyh2y_92", Wi = "_title_oyh2y_103", Xi = "_clear_oyh2y_110", Ji = "_activeClear_oyh2y_117", Qi = "_count_oyh2y_121", Ki = "_cart_oyh2y_136", Zi = "_empty_oyh2y_144", to = "_product_oyh2y_170", eo = "_products_oyh2y_179", so = "_image_oyh2y_187", no = "_productInfo_oyh2y_193", io = "_content_oyh2y_200", oo = "_name_oyh2y_206", ao = "_price_oyh2y_212", co = "_productButtons_oyh2y_218", lo = "_productButton_oyh2y_218", ro = "_productCount_oyh2y_238", uo = "_bottom_oyh2y_254", mo = "_subtotal_oyh2y_262", _o = "_block_oyh2y_270", ho = "_shoppingCount_oyh2y_277", po = "_total_oyh2y_297", go = "_link_oyh2y_303", xo = "_userInfo_oyh2y_310", C = {
-  button: Mi,
-  login: Hi,
-  signUp: zi,
-  buttons: Fi,
-  modal: Vi,
-  "slide-in-fade": "_slide-in-fade_oyh2y_1",
-  closing: Ui,
-  "slide-out-fade": "_slide-out-fade_oyh2y_1",
-  info: Yi,
-  top: Gi,
+}, Hi = "_button_1tdo3_1", zi = "_login_1tdo3_14", Fi = "_signUp_1tdo3_18", Vi = "_buttons_1tdo3_23", Ui = "_modal_1tdo3_32", Yi = "_closing_1tdo3_64", Gi = "_info_1tdo3_113", Xi = "_top_1tdo3_120", Wi = "_title_1tdo3_131", Ji = "_clear_1tdo3_138", Qi = "_activeClear_1tdo3_145", Ki = "_count_1tdo3_149", Zi = "_cart_1tdo3_164", to = "_empty_1tdo3_172", eo = "_product_1tdo3_198", so = "_products_1tdo3_207", no = "_image_1tdo3_215", io = "_productInfo_1tdo3_221", oo = "_content_1tdo3_228", ao = "_name_1tdo3_234", co = "_price_1tdo3_240", lo = "_productButtons_1tdo3_246", ro = "_productButton_1tdo3_246", uo = "_productCount_1tdo3_266", _o = "_bottom_1tdo3_282", mo = "_subtotal_1tdo3_290", ho = "_block_1tdo3_298", po = "_shoppingCount_1tdo3_305", xo = "_total_1tdo3_325", go = "_link_1tdo3_331", fo = "_userInfo_1tdo3_338", bo = "_pagesMobileModal_1tdo3_349", vo = "_pagesMobileModalContent_1tdo3_363", jo = "_pagesMobileModalHeader_1tdo3_369", yo = "_pagesMobileModalFooter_1tdo3_379", w = {
+  button: Hi,
+  login: zi,
+  signUp: Fi,
+  buttons: Vi,
+  modal: Ui,
+  "slide-in-fade": "_slide-in-fade_1tdo3_1",
+  "mobile-slide-in-fade": "_mobile-slide-in-fade_1tdo3_1",
+  closing: Yi,
+  "mobile-slide-out-fade": "_mobile-slide-out-fade_1tdo3_1",
+  "slide-out-fade": "_slide-out-fade_1tdo3_1",
+  info: Gi,
+  top: Xi,
   title: Wi,
-  clear: Xi,
-  activeClear: Ji,
-  count: Qi,
-  cart: Ki,
-  empty: Zi,
-  product: to,
-  products: eo,
-  image: so,
-  productInfo: no,
-  content: io,
-  name: oo,
-  price: ao,
-  productButtons: co,
-  productButton: lo,
-  productCount: ro,
-  bottom: uo,
+  clear: Ji,
+  activeClear: Qi,
+  count: Ki,
+  cart: Zi,
+  empty: to,
+  product: eo,
+  products: so,
+  image: no,
+  productInfo: io,
+  content: oo,
+  name: ao,
+  price: co,
+  productButtons: lo,
+  productButton: ro,
+  productCount: uo,
+  bottom: _o,
   subtotal: mo,
-  block: _o,
-  shoppingCount: ho,
-  total: po,
+  block: ho,
+  shoppingCount: po,
+  total: xo,
   link: go,
-  userInfo: xo
-}, fo = "_button_85085_1", bo = "_primary_85085_20", vo = "_primaryHovered_85085_30", jo = "_secondary_85085_34", yo = "_secondaryHovered_85085_44", ko = "_tertiary_85085_48", Io = "_tertiaryHovered_85085_58", $o = "_content_85085_62", it = {
-  button: fo,
-  primary: bo,
-  primaryHovered: vo,
-  secondary: jo,
-  secondaryHovered: yo,
-  tertiary: ko,
-  tertiaryHovered: Io,
-  content: $o
-}, kt = (r) => {
-  const { children: a, onClick: e, style: s, className: i, disabled: o = !1, type: l = "Primary" } = r, { themeSettings: d } = qt();
+  userInfo: fo,
+  pagesMobileModal: bo,
+  pagesMobileModalContent: vo,
+  pagesMobileModalHeader: jo,
+  pagesMobileModalFooter: yo
+}, Io = "_button_85085_1", ko = "_primary_85085_20", $o = "_primaryHovered_85085_30", No = "_secondary_85085_34", wo = "_secondaryHovered_85085_44", Co = "_tertiary_85085_48", Bo = "_tertiaryHovered_85085_58", So = "_content_85085_62", ot = {
+  button: Io,
+  primary: ko,
+  primaryHovered: $o,
+  secondary: No,
+  secondaryHovered: wo,
+  tertiary: Co,
+  tertiaryHovered: Bo,
+  content: So
+}, mt = (r) => {
+  const { children: o, onClick: e, style: s, className: i, disabled: a = !1, type: l = "Primary" } = r, { themeSettings: d } = qt();
   return /* @__PURE__ */ t.jsx(
     "button",
     {
-      className: F(it.button, i, {
-        [it.primary]: l === "Primary",
-        [it.secondary]: l === "Secondary",
-        [it.tertiary]: l === "Tertiary",
-        [it.primaryHovered]: l === "Primary" && !o && d.buttons.primary.hover,
-        [it.secondaryHovered]: l === "Secondary" && !o && d.buttons.secondary.hover,
-        [it.tertiaryHovered]: l === "Tertiary" && !o && d.buttons.tertiary.hover
+      className: F(ot.button, i, {
+        [ot.primary]: l === "Primary",
+        [ot.secondary]: l === "Secondary",
+        [ot.tertiary]: l === "Tertiary",
+        [ot.primaryHovered]: l === "Primary" && !a && d.buttons.primary.hover,
+        [ot.secondaryHovered]: l === "Secondary" && !a && d.buttons.secondary.hover,
+        [ot.tertiaryHovered]: l === "Tertiary" && !a && d.buttons.tertiary.hover
       }),
       onClick: e,
       style: {
         ...s
       },
-      disabled: o,
-      children: l === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: it.content, children: [
-        a,
+      disabled: a,
+      children: l === "Tertiary" ? /* @__PURE__ */ t.jsxs("div", { className: ot.content, children: [
+        o,
         /* @__PURE__ */ t.jsx(
           v,
           {
@@ -2495,126 +2501,103 @@ const ha = (r) => {
             height: 20
           }
         )
-      ] }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: a })
+      ] }) : /* @__PURE__ */ t.jsx(t.Fragment, { children: o })
     }
   );
 };
-class pt extends Error {
+class xt extends Error {
 }
-pt.prototype.name = "InvalidTokenError";
-function No(r) {
-  return decodeURIComponent(atob(r).replace(/(.)/g, (a, e) => {
+xt.prototype.name = "InvalidTokenError";
+function To(r) {
+  return decodeURIComponent(atob(r).replace(/(.)/g, (o, e) => {
     let s = e.charCodeAt(0).toString(16).toUpperCase();
     return s.length < 2 && (s = "0" + s), "%" + s;
   }));
 }
-function wo(r) {
-  let a = r.replace(/-/g, "+").replace(/_/g, "/");
-  switch (a.length % 4) {
+function Po(r) {
+  let o = r.replace(/-/g, "+").replace(/_/g, "/");
+  switch (o.length % 4) {
     case 0:
       break;
     case 2:
-      a += "==";
+      o += "==";
       break;
     case 3:
-      a += "=";
+      o += "=";
       break;
     default:
       throw new Error("base64 string is not of the correct length");
   }
   try {
-    return No(a);
+    return To(o);
   } catch {
-    return atob(a);
+    return atob(o);
   }
 }
-function Co(r, a) {
+function Ao(r, o) {
   if (typeof r != "string")
-    throw new pt("Invalid token specified: must be a string");
-  a || (a = {});
-  const e = a.header === !0 ? 0 : 1, s = r.split(".")[e];
+    throw new xt("Invalid token specified: must be a string");
+  o || (o = {});
+  const e = o.header === !0 ? 0 : 1, s = r.split(".")[e];
   if (typeof s != "string")
-    throw new pt(`Invalid token specified: missing part #${e + 1}`);
+    throw new xt(`Invalid token specified: missing part #${e + 1}`);
   let i;
   try {
-    i = wo(s);
-  } catch (o) {
-    throw new pt(`Invalid token specified: invalid base64 for part #${e + 1} (${o.message})`);
+    i = Po(s);
+  } catch (a) {
+    throw new xt(`Invalid token specified: invalid base64 for part #${e + 1} (${a.message})`);
   }
   try {
     return JSON.parse(i);
-  } catch (o) {
-    throw new pt(`Invalid token specified: invalid json for part #${e + 1} (${o.message})`);
+  } catch (a) {
+    throw new xt(`Invalid token specified: invalid json for part #${e + 1} (${a.message})`);
   }
 }
-const pa = (r) => {
-  const { shopping: a, signUp: e } = r, s = bt();
-  function i(l) {
-    s(l);
-  }
-  const o = JSON.parse(localStorage.getItem("token") || "{}");
-  return /* @__PURE__ */ t.jsxs("div", { className: C.buttons, children: [
-    a && /* @__PURE__ */ t.jsx(Bo, {}),
-    !o.data && /* @__PURE__ */ t.jsx(
-      kt,
-      {
-        onClick: () => i("/customer-dash"),
-        type: "Secondary",
-        style: {
-          padding: 10
-        },
-        children: "Login"
-      }
-    ),
-    !o.data && e && /* @__PURE__ */ t.jsx(
-      kt,
-      {
-        onClick: () => i("/customer-dash"),
-        type: "Primary",
-        style: {
-          padding: 10
-        },
-        children: "Sign Up"
-      }
-    ),
-    o.data && /* @__PURE__ */ t.jsx(Po, { token: o.data })
+const Ia = (r) => {
+  const { shopping: o, signUp: e, isShowUserInfo: s = !0 } = r;
+  return /* @__PURE__ */ t.jsxs("div", { className: w.buttons, children: [
+    o && /* @__PURE__ */ t.jsx(Mo, {}),
+    s && /* @__PURE__ */ t.jsx(zt, { signUp: e })
   ] });
-}, Bo = () => {
-  const [r, a] = p.useState(!1), [e, s] = p.useState([]), { cart: i, getProducts: o } = Pt();
+}, Mo = () => {
+  const [r, o] = p.useState(!1), [e, s] = p.useState([]), { cart: i, getProducts: a } = Pt();
   function l(h) {
-    for (let _ = 0; _ < i.parts.length; _++)
-      for (let g = 0; g < h.variants.length; g++)
-        if (i.parts[_].productVariantId === h.variants[_].id)
-          return i.parts[_].productVariantId;
+    for (let m = 0; m < i.parts.length; m++)
+      for (let x = 0; x < h.variants.length; x++)
+        if (i.parts[m].productVariantId === h.variants[m].id)
+          return i.parts[m].productVariantId;
   }
   function d(h) {
-    for (let _ = 0; _ < i.parts.length; _++)
-      for (let g = 0; g < h.variants.length; g++)
-        if (i.parts[_].productVariantId === h.variants[_].id)
-          return i.parts[_].quantity;
+    for (let m = 0; m < i.parts.length; m++)
+      for (let x = 0; x < h.variants.length; x++)
+        if (i.parts[m].productVariantId === h.variants[m].id)
+          return i.parts[m].quantity;
   }
   p.useEffect(() => {
     (async () => {
-      const _ = i.parts.map((w) => String(w.productId)), u = (await o([..._])).map((w) => ({
-        ...w,
-        activeVariantId: l(w),
-        quantity: d(w)
+      const m = i.parts.map((C) => String(C.productId)), u = (await a([...m])).map((C) => ({
+        ...C,
+        activeVariantId: l(C),
+        quantity: d(C)
       }));
       s(u);
     })();
   }, [i.parts.length]);
   function n(h) {
-    var _;
-    return !h || !(h != null && h.variants) ? !1 : (_ = h.variants.find((g) => g.id === h.activeVariantId)) == null ? void 0 : _.subscriptionSettings;
+    var m;
+    return !h || !(h != null && h.variants) ? !1 : (m = h.variants.find((x) => x.id === h.activeVariantId)) == null ? void 0 : m.subscriptionSettings;
   }
-  const c = i.parts.length > 0 && e.length > 0 && !n(e[0]), [b, x] = p.useState(!1);
+  const c = i.parts.length > 0 && e.length > 0 && !n(e[0]), [b, g] = p.useState(!1);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsxs(
-      "div",
+      mt,
       {
-        className: C.button,
+        type: "Secondary",
+        style: {
+          padding: 10
+        },
         onClick: (h) => {
-          h.stopPropagation(), a(!0), x(!0);
+          h.stopPropagation(), window.location.pathname !== "/admin/builder" && (o(!0), g(!0));
         },
         children: [
           /* @__PURE__ */ t.jsx(
@@ -2624,21 +2607,21 @@ const pa = (r) => {
               fill: "var(--icon-primary)"
             }
           ),
-          c && /* @__PURE__ */ t.jsx("div", { className: C.shoppingCount, children: i.parts.length })
+          c && /* @__PURE__ */ t.jsx("div", { className: w.shoppingCount, children: i.parts.length })
         ]
       }
     ),
     r && /* @__PURE__ */ t.jsx(
-      Et,
+      At,
       {
         close: () => {
-          x(!1), setTimeout(() => {
-            a(!1);
+          g(!1), setTimeout(() => {
+            o(!1);
           }, 300);
         },
         withAnimation: !1,
         children: /* @__PURE__ */ t.jsx(
-          So,
+          Oo,
           {
             activeProducts: e,
             isCartNotEmpty: c,
@@ -2648,8 +2631,8 @@ const pa = (r) => {
       }
     )
   ] });
-}, So = (r) => {
-  const { activeProducts: a, isCartNotEmpty: e, isOpen: s } = r, { cart: i, reset: o, getTotalAndDiscount: l, updateQuantityOfProduct: d } = Pt(), n = bt();
+}, Oo = (r) => {
+  const { activeProducts: o, isCartNotEmpty: e, isOpen: s } = r, { cart: i, reset: a, getTotalAndDiscount: l, updateQuantityOfProduct: d } = Pt(), n = Tt();
   function c(h) {
     n(h);
   }
@@ -2660,7 +2643,7 @@ const pa = (r) => {
       quantity: h.quantity + 1
     });
   }
-  function x(h) {
+  function g(h) {
     d({
       productId: h.id,
       productVariantId: h.activeVariantId,
@@ -2670,35 +2653,35 @@ const pa = (r) => {
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: F(C.modal, {
-        [C.closing]: !s
+      className: F(w.modal, {
+        [w.closing]: !s
       }),
       onClick: (h) => h.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: w.top, children: [
+          /* @__PURE__ */ t.jsxs("div", { className: w.info, children: [
+            /* @__PURE__ */ t.jsx("span", { className: w.title, children: "Cart" }),
+            e && /* @__PURE__ */ t.jsx("div", { className: w.count, children: i.parts.length })
           ] }),
           /* @__PURE__ */ t.jsx(
             "button",
             {
-              className: F(C.clear, {
-                [C.activeClear]: e
+              className: F(w.clear, {
+                [w.activeClear]: e
               }),
               disabled: !e,
-              onClick: o,
+              onClick: a,
               children: "Clear all"
             }
           )
         ] }),
-        e ? /* @__PURE__ */ t.jsxs("div", { className: C.cart, children: [
-          /* @__PURE__ */ t.jsx("div", { className: C.products, children: a.map((h) => /* @__PURE__ */ t.jsxs(
+        e ? /* @__PURE__ */ t.jsxs("div", { className: w.cart, children: [
+          /* @__PURE__ */ t.jsx("div", { className: w.products, children: o.map((h) => /* @__PURE__ */ t.jsxs(
             "div",
             {
-              className: C.product,
+              className: w.product,
               children: [
-                /* @__PURE__ */ t.jsxs("div", { className: C.productInfo, children: [
+                /* @__PURE__ */ t.jsxs("div", { className: w.productInfo, children: [
                   /* @__PURE__ */ t.jsx(
                     "img",
                     {
@@ -2706,25 +2689,25 @@ const pa = (r) => {
                       alt: "image",
                       width: "100%",
                       height: "100%",
-                      className: C.image
+                      className: w.image
                     }
                   ),
-                  /* @__PURE__ */ t.jsxs("div", { className: C.content, children: [
-                    /* @__PURE__ */ t.jsx("div", { className: C.name, children: h.name }),
-                    /* @__PURE__ */ t.jsxs("div", { className: C.price, children: [
+                  /* @__PURE__ */ t.jsxs("div", { className: w.content, children: [
+                    /* @__PURE__ */ t.jsx("div", { className: w.name, children: h.name }),
+                    /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
                       "$",
-                      h.variants.find((_) => _.id === h.activeVariantId).price.amount * ((h == null ? void 0 : h.quantity) || 1)
+                      h.variants.find((m) => m.id === h.activeVariantId).price.amount * ((h == null ? void 0 : h.quantity) || 1)
                     ] })
                   ] })
                 ] }),
-                /* @__PURE__ */ t.jsxs("div", { className: C.productButtons, children: [
+                /* @__PURE__ */ t.jsxs("div", { className: w.productButtons, children: [
                   /* @__PURE__ */ t.jsx(
                     "div",
                     {
                       onClick: () => {
-                        h.quantity !== 1 && x(h);
+                        h.quantity !== 1 && g(h);
                       },
-                      className: C.productButton,
+                      className: w.productButton,
                       children: /* @__PURE__ */ t.jsx(
                         v,
                         {
@@ -2736,12 +2719,12 @@ const pa = (r) => {
                       )
                     }
                   ),
-                  /* @__PURE__ */ t.jsx("div", { className: C.productCount, children: h.quantity }),
+                  /* @__PURE__ */ t.jsx("div", { className: w.productCount, children: h.quantity }),
                   /* @__PURE__ */ t.jsx(
                     "div",
                     {
                       onClick: () => b(h),
-                      className: C.productButton,
+                      className: w.productButton,
                       children: /* @__PURE__ */ t.jsx(
                         v,
                         {
@@ -2758,9 +2741,9 @@ const pa = (r) => {
             },
             h.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: w.bottom, children: [
+            /* @__PURE__ */ t.jsxs("div", { className: w.subtotal, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: w.block, children: [
                 /* @__PURE__ */ t.jsx("span", { children: "Subtotal" }),
                 /* @__PURE__ */ t.jsx(
                   v,
@@ -2772,18 +2755,18 @@ const pa = (r) => {
                   }
                 )
               ] }),
-              /* @__PURE__ */ t.jsxs("div", { className: C.total, children: [
+              /* @__PURE__ */ t.jsxs("div", { className: w.total, children: [
                 "$",
                 l().total
               ] })
             ] }),
-            /* @__PURE__ */ t.jsx(kt, { onClick: () => c("/checkout"), children: "Checkout" })
+            /* @__PURE__ */ t.jsx(mt, { onClick: () => c("/checkout"), children: "Checkout" })
           ] })
-        ] }) : /* @__PURE__ */ t.jsx(To, {})
+        ] }) : /* @__PURE__ */ t.jsx(qo, {})
       ]
     }
   );
-}, To = () => /* @__PURE__ */ t.jsxs("div", { className: C.empty, children: [
+}, qo = () => /* @__PURE__ */ t.jsxs("div", { className: w.empty, children: [
   /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
     v,
     {
@@ -2799,50 +2782,156 @@ const pa = (r) => {
       "a",
       {
         href: "/products",
-        className: C.link,
+        className: w.link,
         children: "view products"
       }
     )
   ] })
-] }), Po = ({ token: r }) => {
-  const [a, e] = p.useState("test-email@gmail.com"), s = bt();
+] }), zt = ({ signUp: r }) => {
+  const o = JSON.parse(localStorage.getItem("token") || "{}"), { data: e } = o;
+  if (!e)
+    return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+      /* @__PURE__ */ t.jsx(
+        mt,
+        {
+          onClick: () => l("/customer-dash"),
+          type: "Secondary",
+          style: {
+            padding: 10
+          },
+          children: "Login"
+        }
+      ),
+      r && /* @__PURE__ */ t.jsx(
+        mt,
+        {
+          onClick: () => l("/customer-dash"),
+          type: "Primary",
+          style: {
+            padding: 10
+          },
+          children: "Sign Up"
+        }
+      )
+    ] });
+  const [s, i] = p.useState("test-email@gmail.com"), a = Tt();
   p.useEffect(() => {
     (async () => {
-      const l = Co(r);
-      e(l.email);
+      const n = Ao(e);
+      i(n.email);
     })();
-  }, [r]);
-  function i(o) {
-    s(o);
+  }, [e]);
+  function l(d) {
+    a(d);
   }
   return /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: C.userInfo,
-      onClick: () => i("/customer-dash"),
-      children: /* @__PURE__ */ t.jsx("div", { children: a || "test-email@gmail.com" })
+      className: w.userInfo,
+      onClick: () => l("/customer-dash"),
+      children: /* @__PURE__ */ t.jsx("div", { children: s || "test-email@gmail.com" })
+    }
+  );
+}, Eo = ({
+  children: r,
+  logo: o,
+  setIsOpen: e,
+  signUp: s
+}) => {
+  const { setIsOpen: i } = Et(), a = () => {
+    i(!1), setTimeout(() => {
+      e(!1), i(!0);
+    }, 300);
+  };
+  return /* @__PURE__ */ t.jsxs(
+    "div",
+    {
+      className: w.pagesMobileModal,
+      onClick: (l) => l.stopPropagation(),
+      children: [
+        /* @__PURE__ */ t.jsxs("div", { className: w.pagesMobileModalHeader, children: [
+          /* @__PURE__ */ t.jsx("div", { children: o }),
+          /* @__PURE__ */ t.jsx(
+            mt,
+            {
+              type: "Secondary",
+              onClick: a,
+              children: /* @__PURE__ */ t.jsx(
+                v,
+                {
+                  name: "X",
+                  fill: "var(--icon-primary)"
+                }
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ t.jsx("div", { className: w.pagesMobileModalContent, children: r }),
+        /* @__PURE__ */ t.jsx("div", { className: w.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(zt, { signUp: s }) })
+      ]
     }
   );
-}, Ao = "_share_11u0d_1", Oo = "_modal_11u0d_8", qo = "_header_11u0d_14", Eo = "_socials_11u0d_24", Do = "_social_11u0d_24", Lo = "_copy_11u0d_34", Ro = "_title_11u0d_41", Mo = "_copyWrapper_11u0d_47", Ho = "_copyText_11u0d_56", ot = {
-  share: Ao,
-  modal: Oo,
-  header: qo,
-  socials: Eo,
-  social: Do,
-  copy: Lo,
-  title: Ro,
-  copyWrapper: Mo,
-  copyText: Ho
-}, ga = () => {
-  const { isOpenModal: r, setIsOpenModal: a } = Dt();
+}, ka = ({
+  children: r,
+  logo: o,
+  signUp: e
+}) => {
+  const [s, i] = p.useState(!1);
+  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    /* @__PURE__ */ t.jsx(Do, { setIsOpenModal: i }),
+    s && /* @__PURE__ */ t.jsx(At, { close: () => i(!1), children: /* @__PURE__ */ t.jsx(
+      Eo,
+      {
+        logo: o,
+        setIsOpen: i,
+        signUp: e,
+        children: r
+      }
+    ) })
+  ] });
+}, Do = (r) => {
+  const { setIsOpenModal: o } = r;
+  return /* @__PURE__ */ t.jsx(
+    mt,
+    {
+      type: "Secondary",
+      style: {
+        padding: 10
+      },
+      onClick: (e) => {
+        e.stopPropagation(), o(!0);
+      },
+      children: /* @__PURE__ */ t.jsx(
+        v,
+        {
+          name: "List",
+          fill: "var(--icon-primary)"
+        }
+      )
+    }
+  );
+}, Lo = "_share_xddz7_1", Ro = "_modal_xddz7_8", Ho = "_header_xddz7_20", zo = "_socials_xddz7_30", Fo = "_social_xddz7_30", Vo = "_copy_xddz7_40", Uo = "_title_xddz7_47", Yo = "_copyWrapper_xddz7_53", Go = "_copyText_xddz7_62", Xo = "_copyTextMobile_xddz7_75", Wo = "_copyTextMiniMobile_xddz7_94", at = {
+  share: Lo,
+  modal: Ro,
+  header: Ho,
+  socials: zo,
+  social: Fo,
+  copy: Vo,
+  title: Uo,
+  copyWrapper: Yo,
+  copyText: Go,
+  copyTextMobile: Xo,
+  copyTextMiniMobile: Wo
+}, $a = () => {
+  const { isOpenModal: r, setIsOpenModal: o } = Dt();
   function e() {
-    a(!0);
+    o(!0);
   }
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
-      ct,
+      Z,
       {
-        className: ot.share,
+        className: at.share,
         onClick: (s) => {
           s.stopPropagation(), e();
         },
@@ -2857,11 +2946,11 @@ const pa = (r) => {
         )
       }
     ),
-    r && /* @__PURE__ */ t.jsx(Et, { close: a, children: /* @__PURE__ */ t.jsx(zo, {}) })
+    r && /* @__PURE__ */ t.jsx(At, { close: o, children: /* @__PURE__ */ t.jsx(Jo, {}) })
   ] });
-}, zo = () => {
-  const { setIsOpenModal: r } = Dt(), { notification: a, setNotification: e } = zt(), { setIsOpen: s } = Ft(), i = window.location.href;
-  function o() {
+}, Jo = () => {
+  const { setIsOpenModal: r } = Dt(), { notification: o, setNotification: e } = Vt(), { setIsOpen: s } = Et(), i = window.location.href;
+  function a() {
     navigator.clipboard.writeText(i), e({
       message: "Link copied to clipboard",
       status: "success"
@@ -2872,14 +2961,17 @@ const pa = (r) => {
       r(!1), s(!0);
     }, 300);
   }
+  function d(n, c) {
+    return n.length > c ? n.slice(0, c) + "..." : n;
+  }
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
-      className: ot.modal,
-      onClick: (d) => d.stopPropagation(),
+      className: at.modal,
+      onClick: (n) => n.stopPropagation(),
       children: [
-        /* @__PURE__ */ t.jsxs("div", { className: ot.header, children: [
-          /* @__PURE__ */ t.jsx("div", { className: ot.title, children: "Copy Product Link" }),
+        /* @__PURE__ */ t.jsxs("div", { className: at.header, children: [
+          /* @__PURE__ */ t.jsx("div", { className: at.title, children: "Copy Product Link" }),
           /* @__PURE__ */ t.jsx(
             v,
             {
@@ -2890,48 +2982,55 @@ const pa = (r) => {
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsxs("div", { className: ot.copyWrapper, children: [
-          /* @__PURE__ */ t.jsx(
-            "div",
+        /* @__PURE__ */ t.jsxs("div", { className: at.copyWrapper, children: [
+          /* @__PURE__ */ t.jsxs(
+            Z,
             {
-              className: F(ot.copy, ot.copyText),
-              onClick: o,
-              children: i
+              type: "Secondary",
+              onClick: a,
+              style: {
+                flex: 1
+              },
+              children: [
+                /* @__PURE__ */ t.jsx("div", { className: at.copyText, children: d(i, 100) }),
+                /* @__PURE__ */ t.jsx("div", { className: at.copyTextMobile, children: d(i, 40) }),
+                /* @__PURE__ */ t.jsx("div", { className: at.copyTextMiniMobile, children: d(i, 20) })
+              ]
             }
           ),
           /* @__PURE__ */ t.jsx(
-            "div",
+            Z,
             {
-              onClick: o,
-              className: ot.copy,
-              children: a ? /* @__PURE__ */ t.jsx(v, { name: "Check" }) : /* @__PURE__ */ t.jsx(v, { name: "Copy" })
+              type: "Secondary",
+              onClick: a,
+              children: o ? /* @__PURE__ */ t.jsx(v, { name: "Check" }) : /* @__PURE__ */ t.jsx(v, { name: "Copy" })
             }
           )
         ] })
       ]
     }
   );
-}, Fo = "_accordion_1s1lq_1", Vo = "_header_1s1lq_9", Uo = "_icon_1s1lq_18", Yo = "_open_1s1lq_21", Go = "_content_1s1lq_25", ht = {
-  accordion: Fo,
-  header: Vo,
-  icon: Uo,
-  open: Yo,
-  content: Go
-}, xa = ({ title: r, content: a }) => {
-  const [e, s] = p.useState(!1), [i, o] = p.useState(0), l = p.useRef(null), d = () => {
+}, Qo = "_accordion_1s1lq_1", Ko = "_header_1s1lq_9", Zo = "_icon_1s1lq_18", ta = "_open_1s1lq_21", ea = "_content_1s1lq_25", pt = {
+  accordion: Qo,
+  header: Ko,
+  icon: Zo,
+  open: ta,
+  content: ea
+}, Na = ({ title: r, content: o }) => {
+  const [e, s] = p.useState(!1), [i, a] = p.useState(0), l = p.useRef(null), d = () => {
     s(!e);
   };
   return p.useEffect(() => {
-    l.current && o(e ? l.current.scrollHeight : 0);
-  }, [e]), /* @__PURE__ */ t.jsxs("div", { className: ht.accordion, children: [
+    l.current && a(e ? l.current.scrollHeight : 0);
+  }, [e]), /* @__PURE__ */ t.jsxs("div", { className: pt.accordion, children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: ht.header,
+        className: pt.header,
         onClick: d,
         children: [
           /* @__PURE__ */ t.jsx("h5", { id: "h5", children: r }),
-          /* @__PURE__ */ t.jsx("div", { className: F(ht.icon, { [ht.open]: e }), children: /* @__PURE__ */ t.jsx(v, { name: "CaretDown" }) })
+          /* @__PURE__ */ t.jsx("div", { className: F(pt.icon, { [pt.open]: e }), children: /* @__PURE__ */ t.jsx(v, { name: "CaretDown" }) })
         ]
       }
     ),
@@ -2939,50 +3038,50 @@ const pa = (r) => {
       "div",
       {
         ref: l,
-        className: ht.content,
+        className: pt.content,
         style: { height: `${i}px` },
-        children: /* @__PURE__ */ t.jsx("p", { id: "p", children: a })
+        children: /* @__PURE__ */ t.jsx("p", { id: "p", children: o })
       }
     )
   ] });
-}, Wo = "_wrapper_p74l6_1", Xo = "_label_p74l6_9", Jo = "_input_p74l6_18", Qo = "_paddingless_p74l6_31", Ko = "_content_p74l6_35", Zo = "_contentBorder_p74l6_48", ta = "_borderless_p74l6_53", ea = "_rightIcon_p74l6_58", et = {
-  wrapper: Wo,
-  label: Xo,
-  input: Jo,
-  paddingless: Qo,
-  content: Ko,
-  contentBorder: Zo,
-  borderless: ta,
-  rightIcon: ea
-}, fa = (r) => {
+}, sa = "_wrapper_p74l6_1", na = "_label_p74l6_9", ia = "_input_p74l6_18", oa = "_paddingless_p74l6_31", aa = "_content_p74l6_35", ca = "_contentBorder_p74l6_48", la = "_borderless_p74l6_53", ra = "_rightIcon_p74l6_58", st = {
+  wrapper: sa,
+  label: na,
+  input: ia,
+  paddingless: oa,
+  content: aa,
+  contentBorder: ca,
+  borderless: la,
+  rightIcon: ra
+}, wa = (r) => {
   const {
-    onChange: a,
+    onChange: o,
     style: e,
     label: s,
     value: i,
-    type: o,
+    type: a,
     min: l,
     max: d,
     placeholder: n,
     disabled: c = !1,
     required: b = !1,
-    regex: x,
+    regex: g,
     paddingless: h = !1,
-    borderless: _ = !1,
-    editable: g = !1,
+    borderless: m = !1,
+    editable: x = !1,
     isSearch: u = !1
-  } = r, { themeSettings: w } = qt(), { inputs: q } = w, [k, L] = p.useState(!1);
+  } = r, { themeSettings: C } = qt(), { inputs: O } = C, [I, D] = p.useState(!1);
   function B(f) {
     return Number(f) < 0 ? String(l) : f;
   }
   function S(f) {
-    return !b || !x ? !0 : new RegExp(x).test(f);
+    return !b || !g ? !0 : new RegExp(g).test(f);
   }
-  return /* @__PURE__ */ t.jsxs("div", { className: et.wrapper, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: st.wrapper, children: [
     s && /* @__PURE__ */ t.jsx(
       "label",
       {
-        className: et.label,
+        className: st.label,
         htmlFor: s,
         children: s
       }
@@ -2990,51 +3089,51 @@ const pa = (r) => {
     /* @__PURE__ */ t.jsxs(
       "div",
       {
-        className: F(et.content, {
-          [et.contentBorder]: q.border.active
+        className: F(st.content, {
+          [st.contentBorder]: O.border.active
         }),
         style: {
-          paddingRight: q.general.height + 15,
+          paddingRight: O.general.height + 15,
           ...e,
-          background: q.field.active ? q.field.color : "transparent"
+          background: O.field.active ? O.field.color : "transparent"
         },
         children: [
           /* @__PURE__ */ t.jsx(
             "input",
             {
               id: s,
-              type: o || "text",
+              type: a || "text",
               onChange: (f) => {
-                if (o === "text") a(f.target.value);
+                if (a === "text") o(f.target.value);
                 else {
-                  const D = B(f.target.value);
-                  a(D);
+                  const E = B(f.target.value);
+                  o(E);
                 }
               },
               value: i,
               autoComplete: "off",
               placeholder: n || "Type something...",
-              className: F(et.input, {
-                [et.required]: k && b && !S(i),
-                [et.paddingless]: h,
-                [et.borderless]: _
+              className: F(st.input, {
+                [st.required]: I && b && !S(i),
+                [st.paddingless]: h,
+                [st.borderless]: m
               }),
-              min: o === "number" ? l : void 0,
-              max: o === "number" ? d : void 0,
+              min: a === "number" ? l : void 0,
+              max: a === "number" ? d : void 0,
               disabled: c,
-              onFocus: () => L(!0)
+              onFocus: () => D(!0)
             }
           ),
-          u && /* @__PURE__ */ t.jsx("div", { className: et.rightIcon, children: /* @__PURE__ */ t.jsx(
+          u && /* @__PURE__ */ t.jsx("div", { className: st.rightIcon, children: /* @__PURE__ */ t.jsx(
             v,
             {
               name: "MagnifyingGlass",
               fill: "var(--icon-secondary)",
-              width: q.general.height,
-              height: q.general.height
+              width: O.general.height,
+              height: O.general.height
             }
           ) }),
-          g && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
+          x && /* @__PURE__ */ t.jsx("div", { children: /* @__PURE__ */ t.jsx(
             v,
             {
               name: "Sliders",
@@ -3047,18 +3146,18 @@ const pa = (r) => {
       }
     )
   ] });
-}, sa = "_wrapper_st58d_1", na = "_label_st58d_10", ia = "_textarea_st58d_18", oa = "_length_st58d_33", ft = {
-  wrapper: sa,
-  label: na,
-  textarea: ia,
-  length: oa
-}, ba = (r) => {
-  const { onChange: a, label: e, value: s, maxLength: i, placeholder: o = "Type something..." } = r, [l, d] = p.useState(s.length);
-  return /* @__PURE__ */ t.jsxs("div", { className: ft.wrapper, children: [
+}, da = "_wrapper_st58d_1", ua = "_label_st58d_10", _a = "_textarea_st58d_18", ma = "_length_st58d_33", bt = {
+  wrapper: da,
+  label: ua,
+  textarea: _a,
+  length: ma
+}, Ca = (r) => {
+  const { onChange: o, label: e, value: s, maxLength: i, placeholder: a = "Type something..." } = r, [l, d] = p.useState(s.length);
+  return /* @__PURE__ */ t.jsxs("div", { className: bt.wrapper, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
       {
-        className: ft.label,
+        className: bt.label,
         htmlFor: e,
         children: e
       }
@@ -3069,14 +3168,14 @@ const pa = (r) => {
         id: e,
         defaultValue: s,
         onChange: (n) => {
-          d(n.target.value.length), a(n.target.value);
+          d(n.target.value.length), o(n.target.value);
         },
-        placeholder: o,
-        className: ft.textarea,
+        placeholder: a,
+        className: bt.textarea,
         maxLength: i
       }
     ),
-    i && /* @__PURE__ */ t.jsxs("div", { className: ft.length, children: [
+    i && /* @__PURE__ */ t.jsxs("div", { className: bt.length, children: [
       l,
       "/",
       i
@@ -3084,34 +3183,37 @@ const pa = (r) => {
   ] });
 };
 export {
-  xa as Accordion,
-  kt as Button,
-  Tn as ButtonTypeSettings,
-  ma as ButtonsSettings,
-  da as CategorySettings,
+  Na as Accordion,
+  Do as BurgerMenuButton,
+  mt as Button,
+  Pn as ButtonTypeSettings,
+  va as ButtonsSettings,
+  fa as CategorySettings,
   gt as ChooseImage,
-  ya as ChooseImageModal,
-  To as EmptyCart,
-  ua as FormSettings,
-  pa as HeaderButtons,
+  Ta as ChooseImageModal,
+  qo as EmptyCart,
+  ba as FormSettings,
+  Ia as HeaderButtons,
   v as Icon,
-  W as InputSettings,
-  fa as InputUI,
-  Fe as ItemsSettings,
-  ra as LayoutSettings,
-  _a as ListingSelector,
-  ka as Loader,
-  Et as Modal,
-  ha as ProductOptions,
-  At as RangeSelector,
-  st as Select,
-  ga as ShareLink,
-  Bo as ShoppingButton,
-  So as ShoppingModalCart,
-  Z as Switch,
+  X as InputSettings,
+  wa as InputUI,
+  Ve as ItemsSettings,
+  ga as LayoutSettings,
+  ja as ListingSelector,
+  Pa as Loader,
+  At as Modal,
+  ka as PagesMobileMenu,
+  Eo as PagesMobileModal,
+  ya as ProductOptions,
+  Mt as RangeSelector,
+  nt as Select,
+  $a as ShareLink,
+  Mo as ShoppingButton,
+  Oo as ShoppingModalCart,
+  tt as Switch,
   Rt as TextSettings,
   Ot as TextareaSettings,
-  ba as TextareaUI,
+  Ca as TextareaUI,
   Lt as TypesText,
-  Po as UserInfo
+  zt as UserInfo
 };