@billgangcom/theme-lib 1.40.0 → 1.42.0

package/dist/ui.es.js

@@ -1,5 +1,5 @@
-import { j as t, I as j, c as U, a as K, S as st, T as qt, b as et, C as ft, u as kt, d as $t, D as Nt, e as wt, v as Ct, B as lt, f as _t, P as Bt, g as St, h as Tt, i as Vt, k as Et, l as Pt, m as At, M as Mt, n as Dt, o as Ht, p as Ut } from "./index-DPr-RIBb.js";
-import { q as Pa, L as Aa } from "./index-DPr-RIBb.js";
+import { j as t, I as j, c as U, a as K, S as st, T as qt, b as et, C as ft, u as kt, d as $t, D as Nt, e as wt, v as Ct, B as lt, f as _t, P as Bt, g as St, h as Tt, i as Vt, k as Et, l as Pt, m as At, M as Mt, n as Dt, o as Ht, p as Ut } from "./index-COcbc3Xp.js";
+import { q as Pa, L as Aa } from "./index-COcbc3Xp.js";
 import f from "react";
 import "@phosphor-icons/react";
 const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1ibay_15", Wt = "_subtitle_1ibay_22", Jt = "_alignmentContent_1ibay_29", Qt = "_alignments_1ibay_37", Kt = "_alignment_1ibay_8", Zt = "_circle_1ibay_60", te = "_paddings_1ibay_67", ee = "_padding_1ibay_67", se = "_active_1ibay_91", ne = "_input_1ibay_98", J = {
@@ -25,8 +25,8 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
   "bottomLeft",
   "bottom",
   "bottomRight"
-], oe = ["left", "top", "right", "bottom"], ba = (r) => {
-  const { alignment: o, padding: e, setPadding: s, setAlignment: i } = r;
+], oe = ["left", "top", "right", "bottom"], ba = (d) => {
+  const { alignment: o, padding: e, setPadding: s, setAlignment: i } = d;
   function a(h) {
     switch (h) {
       case "left":
@@ -57,7 +57,7 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
         return "AlignBottom";
     }
   }
-  const [d, n] = f.useState(null), [c, x] = f.useState(null);
+  const [r, n] = f.useState(null), [c, x] = f.useState(null);
   return /* @__PURE__ */ t.jsxs("div", { className: J.layout, children: [
     /* @__PURE__ */ t.jsx("h3", { className: J.title, children: "Layout" }),
     /* @__PURE__ */ t.jsxs("div", { className: J.alignmentBlock, children: [
@@ -77,11 +77,11 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
               n(null);
             },
             children: [
-              h !== o && d !== h && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
-              h !== o && d === h && /* @__PURE__ */ t.jsx(
+              h !== o && r !== h && /* @__PURE__ */ t.jsx("div", { className: J.circle }),
+              h !== o && r === h && /* @__PURE__ */ t.jsx(
                 j,
                 {
-                  name: a(d),
+                  name: a(r),
                   fill: "#c2c2c2",
                   width: 22,
                   height: 22
@@ -152,8 +152,8 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
   typeTexts: me,
   block: _e,
   active: he
-}, pe = ["bold", "italic", "underline", "strike-through", "code"], Lt = (r) => {
-  const { typesText: o, setTypesText: e } = r;
+}, pe = ["bold", "italic", "underline", "strike-through", "code"], Lt = (d) => {
+  const { typesText: o, setTypesText: e } = d;
   function s(i) {
     switch (i) {
       case "bold":
@@ -177,7 +177,7 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
       onClick: () => {
         const a = [...o];
         if (a.includes(i)) {
-          const l = a.filter((d) => d !== i);
+          const l = a.filter((r) => r !== i);
           e(l);
         } else
           a.push(i), e(a);
@@ -202,7 +202,7 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
   h5: "Heading 5",
   h6: "Heading 6",
   p: "Paragraph"
-}, Rt = (r) => {
+}, Rt = (d) => {
   const {
     typesText: o,
     isActiveText: e,
@@ -210,14 +210,14 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
     text: i,
     setText: a,
     setTypesText: l,
-    title: d,
+    title: r,
     subtitle: n = "Items",
     typeFont: c,
     setTypeFont: x
-  } = r;
+  } = 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 }),
+    (r || e !== void 0) && /* @__PURE__ */ t.jsxs("div", { className: ht.top, children: [
+      r && /* @__PURE__ */ t.jsx("h3", { className: ht.title, children: r }),
       e !== void 0 && s && /* @__PURE__ */ t.jsx(
         st,
         {
@@ -286,9 +286,9 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
   deleteButton: De,
   closeIcon: He
 }, Le = f.forwardRef(
-  (r, o) => {
-    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = r;
-    function d(n, c) {
+  (d, o) => {
+    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = d;
+    function r(n, c) {
       return n.length > c ? `${n.slice(0, c)}...` : n;
     }
     return /* @__PURE__ */ t.jsxs(
@@ -305,7 +305,7 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
         },
         children: [
           /* @__PURE__ */ t.jsxs("div", { className: H.top, children: [
-            /* @__PURE__ */ t.jsx("h3", { className: H.title, children: d(e.name, 20) }),
+            /* @__PURE__ */ t.jsx("h3", { className: H.title, children: r(e.name, 20) }),
             /* @__PURE__ */ t.jsx("div", { className: H.closeIcon, children: /* @__PURE__ */ t.jsx(
               j,
               {
@@ -461,8 +461,8 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
   other: Re,
   subtitle: ze,
   items: Fe
-}, jt = (r) => {
-  const { items: o, title: e = "Other" } = r;
+}, jt = (d) => {
+  const { items: o, title: e = "Other" } = d;
   return /* @__PURE__ */ t.jsxs("div", { className: It.other, children: [
     /* @__PURE__ */ t.jsx("h5", { className: It.subtitle, children: e }),
     /* @__PURE__ */ t.jsx("div", { className: It.items, children: o.map((s, i) => /* @__PURE__ */ t.jsx(
@@ -478,16 +478,16 @@ const Yt = "_wrapper_1ibay_2", Gt = "_alignmentBlock_1ibay_8", Xt = "_title_1iba
     )) })
   ] });
 };
-function Ve({ product: r, children: o }) {
+function Ve({ product: d, children: o }) {
   const {
     attributes: e,
     listeners: s,
     setNodeRef: i,
     transform: a,
     transition: l,
-    isDragging: d
+    isDragging: r
   } = St({
-    id: r.id
+    id: d.id
   }), n = {
     transform: Tt.Transform.toString(a),
     transition: l
@@ -497,14 +497,14 @@ function Ve({ product: r, children: o }) {
     {
       ref: i,
       style: n,
-      className: `${H.product} ${d ? H.dragging : ""}`,
+      className: `${H.product} ${r ? H.dragging : ""}`,
       ...e,
       ...s,
       children: o
     }
   );
 }
-const Ue = (r) => {
+const Ue = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -512,7 +512,7 @@ const Ue = (r) => {
     setItems: i,
     other: a,
     title: l,
-    subtitle: d,
+    subtitle: r,
     editable: n = !0,
     draggable: c = !1,
     withImage: x = !1,
@@ -527,7 +527,7 @@ const Ue = (r) => {
     addableOptions: O = {},
     limit: g,
     autoScrollInterval: $
-  } = r, [F, q] = f.useState(null), [X, D] = f.useState({
+  } = d, [F, q] = f.useState(null), [X, D] = f.useState({
     top: 0,
     left: 0
   }), [I, A] = f.useState(null), M = f.useRef(null), [W, T] = f.useState(!1), R = kt(
@@ -720,7 +720,7 @@ const Ue = (r) => {
     ),
     C && L && /* @__PURE__ */ t.jsx(Ot, { ...L }),
     /* @__PURE__ */ t.jsxs("div", { className: H.products, children: [
-      d && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: d }),
+      r && /* @__PURE__ */ t.jsx("h5", { className: H.subtitle, children: r }),
       c ? /* @__PURE__ */ t.jsx(
         Nt,
         {
@@ -837,7 +837,7 @@ const Ue = (r) => {
   modalOptions: ms,
   addButton: _s,
   deleteButton: hs
-}, va = (r) => {
+}, va = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -845,7 +845,7 @@ const Ue = (r) => {
     setItems: i,
     other: a,
     title: l,
-    subtitle: d,
+    subtitle: r,
     draggable: n = !1,
     withImage: c = !1,
     addable: x = !0,
@@ -854,7 +854,7 @@ const Ue = (r) => {
     rangeSelectorOptions: _,
     limit: b,
     autoScrollInterval: u
-  } = r;
+  } = d;
   function C(v) {
     if (c)
       return v ? /* @__PURE__ */ t.jsx(
@@ -936,7 +936,7 @@ const Ue = (r) => {
     ] }),
     p && _ && /* @__PURE__ */ t.jsx(Ot, { ..._ }),
     /* @__PURE__ */ t.jsxs("div", { className: Q.products, children: [
-      d && /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: d }),
+      r && /* @__PURE__ */ t.jsx("h5", { className: Q.subtitle, children: r }),
       s.map((v) => L(v)),
       x && /* @__PURE__ */ t.jsx(
         "div",
@@ -1030,9 +1030,9 @@ const Ue = (r) => {
   deleteButton: Es,
   closeIcon: Ds
 }, Hs = f.forwardRef(
-  (r, o) => {
-    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = r;
-    function d(n, c) {
+  (d, o) => {
+    const { activeItem: e, setActiveItem: s, popupPosition: i, modalOptions: a, setIsOpenModal: l } = d;
+    function r(n, c) {
       return n.length > c ? `${n.slice(0, c)}...` : n;
     }
     return /* @__PURE__ */ t.jsxs(
@@ -1049,7 +1049,7 @@ const Ue = (r) => {
         },
         children: [
           /* @__PURE__ */ t.jsxs("div", { className: z.top, children: [
-            /* @__PURE__ */ t.jsx("h3", { className: z.title, children: d(e.name, 20) }),
+            /* @__PURE__ */ t.jsx("h3", { className: z.title, children: r(e.name, 20) }),
             /* @__PURE__ */ t.jsx("div", { className: z.closeIcon, children: /* @__PURE__ */ t.jsx(
               j,
               {
@@ -1182,12 +1182,12 @@ const Ue = (r) => {
     );
   }
 );
-function Ls(r) {
-  const { product: o, children: e } = r, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: d, isDragging: n } = St({
+function Ls(d) {
+  const { product: o, children: e } = d, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: r, isDragging: n } = St({
     id: o.id
   }), c = {
     transform: Tt.Transform.toString(l),
-    transition: d
+    transition: r
   };
   return /* @__PURE__ */ t.jsx(
     "div",
@@ -1201,7 +1201,7 @@ function Ls(r) {
     }
   );
 }
-const ja = (r) => {
+const ja = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -1209,7 +1209,7 @@ const ja = (r) => {
     setItems: i,
     other: a,
     title: l,
-    subtitle: d,
+    subtitle: r,
     editable: n = !0,
     draggable: c = !1,
     withImage: x = !1,
@@ -1222,7 +1222,7 @@ const ja = (r) => {
     rangeSelectorOptions: L,
     modalOptions: v,
     addableOptions: O = {}
-  } = r, [g, $] = f.useState(null), [F, q] = f.useState({
+  } = d, [g, $] = f.useState(null), [F, q] = f.useState({
     top: 0,
     left: 0
   }), [X, D] = f.useState(null), I = f.useRef(null), [A, M] = f.useState(!1), W = kt(
@@ -1412,7 +1412,7 @@ const ja = (r) => {
     ),
     C && L && /* @__PURE__ */ t.jsx(Ot, { ...L }),
     /* @__PURE__ */ t.jsxs("div", { className: z.products, children: [
-      d && /* @__PURE__ */ t.jsx("h5", { className: z.subtitle, children: d }),
+      r && /* @__PURE__ */ t.jsx("h5", { className: z.subtitle, children: r }),
       c ? /* @__PURE__ */ t.jsx(
         Nt,
         {
@@ -1514,21 +1514,21 @@ const ja = (r) => {
   other: cn,
   options: ln,
   closeIcon: rn
-}, dn = f.forwardRef((r, o) => {
-  const { activeButton: e, setActiveButton: s, popupPosition: i } = r, [a, l] = f.useState(e.typesText), [d, n] = f.useState(e.destination), [c, x] = f.useState(e.page), [h, p] = f.useState(e.link || ""), [_, b] = f.useState(e.text || ""), [u, C] = f.useState(e.openInNewTab), { pages: L } = Vt();
+}, dn = f.forwardRef((d, o) => {
+  const { activeButton: e, setActiveButton: s, popupPosition: i } = d, [a, l] = f.useState(e.typesText), [r, n] = f.useState(e.destination), [c, x] = f.useState(e.page), [h, p] = f.useState(e.link || ""), [_, b] = f.useState(e.text || ""), [u, C] = f.useState(e.openInNewTab), { pages: L } = Vt();
   return f.useEffect(() => {
     s({
       ...e,
       ...{
         text: _,
         link: h,
-        destination: d,
+        destination: r,
         typesText: a,
         page: c,
         openInNewTab: u
       }
     });
-  }, [a, d, h, _, c, u]), /* @__PURE__ */ t.jsxs(
+  }, [a, r, h, _, c, u]), /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: ct.modal,
@@ -1560,11 +1560,11 @@ const ja = (r) => {
             {
               label: "Destination",
               onChange: (v) => n(v),
-              options: ["Go to Page", "Open Link"].filter((v) => v !== d),
-              value: d
+              options: ["Go to Page", "Open Link"].filter((v) => v !== r),
+              value: r
             }
           ),
-          d === "Go to Page" ? /* @__PURE__ */ t.jsx(
+          r === "Go to Page" ? /* @__PURE__ */ t.jsx(
             et,
             {
               label: "Go to",
@@ -1632,8 +1632,8 @@ const ja = (r) => {
   options: Sn,
   addButton: Tn,
   deleteButton: Pn
-}, An = (r) => {
-  const { buttons: o, setButtons: e, deletable: s = !0, addable: i = !0 } = r, [a, l] = f.useState(null), [d, n] = f.useState({
+}, An = (d) => {
+  const { buttons: o, setButtons: e, deletable: s = !0, addable: i = !0 } = d, [a, l] = f.useState(null), [r, n] = f.useState({
     top: 0,
     left: 0
   }), [c, x] = f.useState(null), h = f.useRef(null);
@@ -1726,7 +1726,7 @@ const ja = (r) => {
         ref: h,
         activeButton: a,
         setActiveButton: l,
-        popupPosition: d
+        popupPosition: r
       }
     ),
     i && /* @__PURE__ */ t.jsx(
@@ -1774,8 +1774,8 @@ const ja = (r) => {
       }
     )
   ] });
-}, ya = (r) => {
-  const { isActiveButtons: o, setIsActiveButtons: e, buttons: s, setButtons: i } = r;
+}, ya = (d) => {
+  const { isActiveButtons: o, setIsActiveButtons: e, buttons: s, setButtons: i } = d;
   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" }),
@@ -1810,8 +1810,8 @@ const ja = (r) => {
   count: Un,
   controls: Yn,
   button: Gn
-}, Ot = (r) => {
-  const { label: o, min: e = 1, max: s = 4, step: i = 1, count: a, setCount: l } = r, [d, n] = f.useState(!1), c = Array.from({ length: (s - e) / i + 1 }), x = (a - e) / (s - e) * 100, h = () => {
+}, Ot = (d) => {
+  const { label: o, min: e = 1, max: s = 4, step: i = 1, count: a, setCount: l } = d, [r, n] = f.useState(!1), c = Array.from({ length: (s - e) / i + 1 }), x = (a - e) / (s - e) * 100, h = () => {
     a < s && l(a + i);
   }, p = () => {
     a > e && l(a - i);
@@ -1840,7 +1840,7 @@ const ja = (r) => {
               className: U(G.dot, {
                 [G.active]: C,
                 [G.inactive]: !C,
-                [G.dragging]: d
+                [G.dragging]: r
               }),
               "aria-label": `Set value to ${e + u * i}`
             },
@@ -1942,10 +1942,10 @@ const ja = (r) => {
   addButton: hi,
   deleteButton: pi,
   closeIcon: xi
-}, gi = (r) => {
-  const { activeItem: o, setActiveItem: e, popupPosition: s, setIsOpenModal: i, itemsOptions: a } = r, l = a.find((n) => n.id === o.listingId);
+}, gi = (d) => {
+  const { activeItem: o, setActiveItem: e, popupPosition: s, setIsOpenModal: i, itemsOptions: a } = d, l = a.find((n) => n.id === o.listingId);
   if (!l) return null;
-  function d(n, c) {
+  function r(n, c) {
     return n.length > c ? `${n.slice(0, c)}...` : n;
   }
   return /* @__PURE__ */ t.jsxs(
@@ -1961,7 +1961,7 @@ const ja = (r) => {
       },
       children: [
         /* @__PURE__ */ t.jsxs("div", { className: V.top, children: [
-          /* @__PURE__ */ t.jsx("h3", { children: d(l.productData.name, 20) }),
+          /* @__PURE__ */ t.jsx("h3", { children: r(l.productData.name, 20) }),
           /* @__PURE__ */ t.jsx("div", { className: V.closeIcon, children: /* @__PURE__ */ t.jsx(
             j,
             {
@@ -1992,12 +1992,12 @@ const ja = (r) => {
     }
   );
 };
-function fi(r) {
-  const { product: o, children: e } = r, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: d, isDragging: n } = St({
+function fi(d) {
+  const { product: o, children: e } = d, { attributes: s, listeners: i, setNodeRef: a, transform: l, transition: r, isDragging: n } = St({
     id: String(o.listingId)
   }), c = {
     transform: Tt.Transform.toString(l),
-    transition: d
+    transition: r
   };
   return /* @__PURE__ */ t.jsx(
     "div",
@@ -2011,7 +2011,7 @@ function fi(r) {
     }
   );
 }
-const Ia = (r) => {
+const Ia = (d) => {
   const {
     isActiveItems: o,
     setIsActiveItems: e,
@@ -2019,7 +2019,7 @@ const Ia = (r) => {
     setItems: i,
     other: a,
     title: l,
-    subtitle: d,
+    subtitle: r,
     editable: n = !0,
     draggable: c = !1,
     withImage: x = !1,
@@ -2027,7 +2027,7 @@ const Ia = (r) => {
     addable: p = !0,
     itemsType: _,
     itemsOptions: b
-  } = r, [u, C] = f.useState(
+  } = d, [u, C] = f.useState(
     null
   ), [L, v] = f.useState({
     top: 0,
@@ -2187,7 +2187,7 @@ const Ia = (r) => {
       }
     ),
     /* @__PURE__ */ t.jsxs("div", { className: V.products, children: [
-      d && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: d }),
+      r && /* @__PURE__ */ t.jsx("h5", { className: V.subtitle, children: r }),
       c ? /* @__PURE__ */ t.jsx(
         Nt,
         {
@@ -2284,7 +2284,7 @@ const Ia = (r) => {
   contentBorder: Gi,
   borderless: Xi,
   rightIcon: Wi
-}, Ji = (r) => {
+}, Ji = (d) => {
   const {
     onChange: o,
     style: e,
@@ -2292,7 +2292,7 @@ const Ia = (r) => {
     value: i,
     type: a,
     min: l,
-    max: d,
+    max: r,
     placeholder: n,
     disabled: c = !1,
     required: x = !1,
@@ -2302,7 +2302,7 @@ const Ia = (r) => {
     editable: b = !1,
     isSearch: u = !1,
     centered: C = !1
-  } = r, { themeSettings: L } = Et(), { inputs: v } = L, [O, g] = f.useState(!1);
+  } = d, { themeSettings: L } = Et(), { inputs: v } = L, [O, g] = f.useState(!1);
   function $(q) {
     return Number(q) < 0 ? String(l) : q;
   }
@@ -2351,7 +2351,7 @@ const Ia = (r) => {
                 [nt.borderless]: _
               }),
               min: a === "number" ? l : void 0,
-              max: a === "number" ? d : void 0,
+              max: a === "number" ? r : void 0,
               disabled: c,
               onFocus: () => g(!0),
               style: {
@@ -2390,8 +2390,8 @@ const Ia = (r) => {
   tertiary: so,
   tertiaryHovered: no,
   content: io
-}, tt = (r) => {
-  const { children: o, onClick: e, style: s, className: i, disabled: a = !1, type: l = "Primary" } = r, { themeSettings: d } = Et();
+}, tt = (d) => {
+  const { children: o, onClick: e, style: s, className: i, disabled: a = !1, type: l = "Primary" } = d, { themeSettings: r } = Et();
   return /* @__PURE__ */ t.jsx(
     "button",
     {
@@ -2399,9 +2399,9 @@ const Ia = (r) => {
         [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
+        [ot.primaryHovered]: l === "Primary" && !a && r.buttons.primary.hover,
+        [ot.secondaryHovered]: l === "Secondary" && !a && r.buttons.secondary.hover,
+        [ot.tertiaryHovered]: l === "Tertiary" && !a && r.buttons.tertiary.hover
       }),
       onClick: e,
       style: {
@@ -2414,7 +2414,7 @@ const Ia = (r) => {
           j,
           {
             name: "ArrowRight",
-            fill: "#757575",
+            fill: "var(--icon-tertiary)",
             width: 20,
             height: 20
           }
@@ -2423,20 +2423,20 @@ const Ia = (r) => {
     }
   );
 };
-var zt = /* @__PURE__ */ ((r) => (r.ONE_TIME = "One-Time", r.RECURRING = "Subscribe & Save", r))(zt || {});
-const ka = (r) => {
+var zt = /* @__PURE__ */ ((d) => (d.ONE_TIME = "One-Time", d.RECURRING = "Subscribe & Save", d))(zt || {});
+const ka = (d) => {
   var v, O;
-  const { variants: o } = r, [e, s] = f.useState(o[0]), [i, a] = f.useState(e.chargeTypes[0]), l = Pt(), [d, n] = f.useState(1), { reset: c, addProductToCart: x, getProducts: h } = At(), [p, _] = f.useState(!1);
+  const { variants: o } = d, [e, s] = f.useState(o[0]), [i, a] = f.useState(e.chargeTypes[0]), l = Pt(), [r, n] = f.useState(1), { reset: c, addProductToCart: x, getProducts: h } = At(), [p, _] = f.useState(!1);
   f.useEffect(() => {
     _(!0);
     const g = setTimeout(() => _(!1), 600);
     return () => clearTimeout(g);
-  }, [d]);
+  }, [r]);
   async function b() {
     await h(), await x({
-      productId: r.id,
+      productId: d.id,
       productVariantId: e.id,
-      quantity: d
+      quantity: r
     });
   }
   function u() {
@@ -2504,10 +2504,10 @@ const ka = (r) => {
         {
           type: "Secondary",
           onClick: () => {
-            d > 1 ? n((g) => g - 1) : n(1);
+            r > 1 ? n((g) => g - 1) : n(1);
           },
           className: w.button,
-          disabled: e.quantity.restrictions && d <= e.quantity.restrictions.min,
+          disabled: e.quantity.restrictions && r <= e.quantity.restrictions.min,
           children: /* @__PURE__ */ t.jsx(j, { name: "Minus" })
         }
       ),
@@ -2515,7 +2515,7 @@ const ka = (r) => {
         Ji,
         {
           type: "number",
-          value: String(d),
+          value: String(r),
           onChange: (g) => n(Number(g)),
           max: ((v = e.quantity.restrictions) == null ? void 0 : v.max) || e.quantity.available || 1 / 0,
           min: ((O = e.quantity.restrictions) == null ? void 0 : O.min) || 0,
@@ -2530,7 +2530,7 @@ const ka = (r) => {
             n((g) => g + 1);
           },
           className: w.button,
-          disabled: !!(e.quantity.restrictions && d >= e.quantity.restrictions.max || e.quantity.available && d >= e.quantity.available),
+          disabled: !!(e.quantity.restrictions && r >= e.quantity.restrictions.max || e.quantity.available && r >= e.quantity.available),
           children: /* @__PURE__ */ t.jsx(j, { name: "Plus" })
         }
       )
@@ -2556,15 +2556,15 @@ const ka = (r) => {
         /* @__PURE__ */ t.jsx("div", { className: w.infoRight, children: i === "ONE_TIME" ? e.compareAtPrice && (e.compareAtPrice.amount || 0) - (e.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
           /* @__PURE__ */ t.jsxs("span", { className: U(w.newPrice, { [w.animate]: p }), children: [
             "$ ",
-            (e.price.amount || 0) * d
+            (e.price.amount || 0) * r
           ] }),
           /* @__PURE__ */ t.jsxs("span", { className: w.oldPrice, children: [
             "$ ",
-            (e.compareAtPrice.amount || 0) * d
+            (e.compareAtPrice.amount || 0) * r
           ] })
         ] }) : /* @__PURE__ */ t.jsxs("span", { className: U(w.newPrice, { [w.animate]: p }), children: [
           "$ ",
-          (e.price.amount || 0) * d
+          (e.price.amount || 0) * r
         ] }) : e.subscriptionSettings && e.subscriptionSettings.compareAtPrice && (e.subscriptionSettings.compareAtPrice.amount || 0) - (e.subscriptionSettings.price.amount || 0) > 0 ? /* @__PURE__ */ t.jsxs("div", { className: w.price, children: [
           /* @__PURE__ */ t.jsxs("span", { className: U(w.newPrice, { [w.animate]: p }), children: [
             "$ ",
@@ -2643,14 +2643,14 @@ const ka = (r) => {
 class gt extends Error {
 }
 gt.prototype.name = "InvalidTokenError";
-function Ro(r) {
-  return decodeURIComponent(atob(r).replace(/(.)/g, (o, e) => {
+function Ro(d) {
+  return decodeURIComponent(atob(d).replace(/(.)/g, (o, e) => {
     let s = e.charCodeAt(0).toString(16).toUpperCase();
     return s.length < 2 && (s = "0" + s), "%" + s;
   }));
 }
-function zo(r) {
-  let o = r.replace(/-/g, "+").replace(/_/g, "/");
+function zo(d) {
+  let o = d.replace(/-/g, "+").replace(/_/g, "/");
   switch (o.length % 4) {
     case 0:
       break;
@@ -2669,11 +2669,11 @@ function zo(r) {
     return atob(o);
   }
 }
-function Fo(r, o) {
-  if (typeof r != "string")
+function Fo(d, o) {
+  if (typeof d != "string")
     throw new gt("Invalid token specified: must be a string");
   o || (o = {});
-  const e = o.header === !0 ? 0 : 1, s = r.split(".")[e];
+  const e = o.header === !0 ? 0 : 1, s = d.split(".")[e];
   if (typeof s != "string")
     throw new gt(`Invalid token specified: missing part #${e + 1}`);
   let i;
@@ -2688,21 +2688,21 @@ function Fo(r, o) {
     throw new gt(`Invalid token specified: invalid json for part #${e + 1} (${a.message})`);
   }
 }
-const $a = (r) => {
-  const { shopping: o, signUp: e, isShowUserInfo: s = !0 } = r;
+const $a = (d) => {
+  const { shopping: o, signUp: e, isShowUserInfo: s = !0 } = d;
   return /* @__PURE__ */ t.jsxs("div", { className: N.buttons, children: [
     o && /* @__PURE__ */ t.jsx(Vo, {}),
     s && /* @__PURE__ */ t.jsx(Ft, { signUp: e })
   ] });
 }, Vo = () => {
-  const [r, o] = f.useState(!1), [e, s] = f.useState([]), { cart: i, getProducts: a } = At();
+  const [d, o] = f.useState(!1), [e, s] = f.useState([]), { cart: i, getProducts: a } = At();
   function l(p) {
     for (let _ = 0; _ < i.parts.length; _++)
       for (let b = 0; b < p.variants.length; b++)
         if (i.parts[_].productVariantId === p.variants[_].id)
           return i.parts[_].productVariantId;
   }
-  function d(p) {
+  function r(p) {
     for (let _ = 0; _ < i.parts.length; _++)
       for (let b = 0; b < p.variants.length; b++)
         if (i.parts[_].productVariantId === p.variants[_].id)
@@ -2713,7 +2713,7 @@ const $a = (r) => {
       const _ = i.parts.map((C) => String(C.productId)), u = (await a([..._])).map((C) => ({
         ...C,
         activeVariantId: l(C),
-        quantity: d(C)
+        quantity: r(C)
       }));
       s(u);
     })();
@@ -2746,7 +2746,7 @@ const $a = (r) => {
         ]
       }
     ),
-    r && /* @__PURE__ */ t.jsx(
+    d && /* @__PURE__ */ t.jsx(
       Mt,
       {
         close: () => {
@@ -2766,20 +2766,20 @@ const $a = (r) => {
       }
     )
   ] });
-}, Uo = (r) => {
-  const { activeProducts: o, isCartNotEmpty: e, isOpen: s } = r, { cart: i, reset: a, getTotalAndDiscount: l, updateQuantityOfProduct: d } = At(), n = Pt();
+}, Uo = (d) => {
+  const { activeProducts: o, isCartNotEmpty: e, isOpen: s } = d, { cart: i, reset: a, getTotalAndDiscount: l, updateQuantityOfProduct: r } = At(), n = Pt();
   function c(p) {
     n(p);
   }
   function x(p) {
-    d({
+    r({
       productId: p.id,
       productVariantId: p.activeVariantId,
       quantity: p.quantity + 1
     });
   }
   function h(p) {
-    d({
+    r({
       productId: p.id,
       productVariantId: p.activeVariantId,
       quantity: p.quantity - 1
@@ -2922,14 +2922,17 @@ const $a = (r) => {
       }
     )
   ] })
-] }), Ft = ({ signUp: r }) => {
-  const o = JSON.parse(localStorage.getItem("token") || "{}"), { data: e } = o;
+] }), Ft = ({ signUp: d }) => {
+  const o = JSON.parse(localStorage.getItem("token") || "{}"), { data: e } = o, s = Pt();
+  function i(r) {
+    s(r);
+  }
   if (!e)
     return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
       /* @__PURE__ */ t.jsx(
         tt,
         {
-          onClick: () => l("/customer-dash"),
+          onClick: () => i("/customer-dash"),
           type: "Secondary",
           style: {
             padding: 10
@@ -2937,10 +2940,10 @@ const $a = (r) => {
           children: "Login"
         }
       ),
-      r && /* @__PURE__ */ t.jsx(
+      d && /* @__PURE__ */ t.jsx(
         tt,
         {
-          onClick: () => l("/customer-dash"),
+          onClick: () => i("/customer-dash"),
           type: "Primary",
           style: {
             padding: 10
@@ -2949,26 +2952,22 @@ const $a = (r) => {
         }
       )
     ] });
-  const [s, i] = f.useState("test-email@gmail.com"), a = Pt();
-  f.useEffect(() => {
+  const [a, l] = f.useState("test-email@gmail.com");
+  return f.useEffect(() => {
     (async () => {
       const n = Fo(e);
-      i(n.email);
+      l(n.email);
     })();
-  }, [e]);
-  function l(d) {
-    a(d);
-  }
-  return /* @__PURE__ */ t.jsx(
+  }, [e]), /* @__PURE__ */ t.jsx(
     "div",
     {
       className: N.userInfo,
-      onClick: () => l("/customer-dash"),
-      children: /* @__PURE__ */ t.jsx("div", { children: s || "test-email@gmail.com" })
+      onClick: () => i("/customer-dash"),
+      children: /* @__PURE__ */ t.jsx("div", { children: a || "test-email@gmail.com" })
     }
   );
 }, Go = ({
-  children: r,
+  children: d,
   logo: o,
   setIsOpen: e,
   signUp: s
@@ -3001,13 +3000,13 @@ const $a = (r) => {
             }
           )
         ] }),
-        /* @__PURE__ */ t.jsx("div", { className: N.pagesMobileModalContent, children: r }),
+        /* @__PURE__ */ t.jsx("div", { className: N.pagesMobileModalContent, children: d }),
         /* @__PURE__ */ t.jsx("div", { className: N.pagesMobileModalFooter, children: /* @__PURE__ */ t.jsx(Ft, { signUp: s }) })
       ]
     }
   );
 }, Na = ({
-  children: r,
+  children: d,
   logo: o,
   signUp: e
 }) => {
@@ -3020,12 +3019,12 @@ const $a = (r) => {
         logo: o,
         setIsOpen: i,
         signUp: e,
-        children: r
+        children: d
       }
     ) })
   ] });
-}, Xo = (r) => {
-  const { setIsOpenModal: o } = r;
+}, Xo = (d) => {
+  const { setIsOpenModal: o } = d;
   return /* @__PURE__ */ t.jsx(
     tt,
     {
@@ -3058,7 +3057,7 @@ const $a = (r) => {
   copyTextMobile: ia,
   copyTextMiniMobile: oa
 }, wa = () => {
-  const { isOpenModal: r, setIsOpenModal: o } = Ht();
+  const { isOpenModal: d, setIsOpenModal: o } = Ht();
   function e() {
     o(!0);
   }
@@ -3081,10 +3080,10 @@ const $a = (r) => {
         )
       }
     ),
-    r && /* @__PURE__ */ t.jsx(Mt, { close: o, children: /* @__PURE__ */ t.jsx(aa, {}) })
+    d && /* @__PURE__ */ t.jsx(Mt, { close: o, children: /* @__PURE__ */ t.jsx(aa, {}) })
   ] });
 }, aa = () => {
-  const { setIsOpenModal: r } = Ht(), { notification: o, setNotification: e } = Ut(), { setIsOpen: s } = Dt(), i = window.location.href;
+  const { setIsOpenModal: d } = Ht(), { notification: o, setNotification: e } = Ut(), { setIsOpen: s } = Dt(), i = window.location.href;
   function a() {
     navigator.clipboard.writeText(i), e({
       message: "Link copied to clipboard",
@@ -3093,10 +3092,10 @@ const $a = (r) => {
   }
   function l() {
     s(!1), setTimeout(() => {
-      r(!1), s(!0);
+      d(!1), s(!0);
     }, 300);
   }
-  function d(n, c) {
+  function r(n, c) {
     return n.length > c ? n.slice(0, c) + "..." : n;
   }
   return /* @__PURE__ */ t.jsxs(
@@ -3127,9 +3126,9 @@ const $a = (r) => {
                 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", { className: at.copyText, children: r(i, 100) }),
+                /* @__PURE__ */ t.jsx("div", { className: at.copyTextMobile, children: r(i, 40) }),
+                /* @__PURE__ */ t.jsx("div", { className: at.copyTextMiniMobile, children: r(i, 20) })
               ]
             }
           ),
@@ -3151,30 +3150,30 @@ const $a = (r) => {
   icon: ra,
   open: da,
   content: ua
-}, Ca = ({ title: r, content: o }) => {
-  const [e, s] = f.useState(!1), [i, a] = f.useState(0), l = f.useRef(null), d = () => {
-    s(!e);
+}, Ca = ({ title: d, content: o, defaultOpen: e = !1 }) => {
+  const [s, i] = f.useState(e), [a, l] = f.useState(0), r = f.useRef(null), n = () => {
+    i(!s);
   };
   return f.useEffect(() => {
-    l.current && a(e ? l.current.scrollHeight : 0);
-  }, [e]), /* @__PURE__ */ t.jsxs("div", { className: xt.accordion, children: [
+    r.current && l(s ? r.current.scrollHeight : 0);
+  }, [s]), /* @__PURE__ */ t.jsxs("div", { className: xt.accordion, children: [
     /* @__PURE__ */ t.jsxs(
       "div",
       {
         className: xt.header,
-        onClick: d,
+        onClick: n,
         children: [
-          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: r }),
-          /* @__PURE__ */ t.jsx("div", { className: U(xt.icon, { [xt.open]: e }), children: /* @__PURE__ */ t.jsx(j, { name: "CaretDown" }) })
+          /* @__PURE__ */ t.jsx("h5", { id: "h5", children: d }),
+          /* @__PURE__ */ t.jsx("div", { className: U(xt.icon, { [xt.open]: s }), children: /* @__PURE__ */ t.jsx(j, { name: "CaretDown" }) })
         ]
       }
     ),
     /* @__PURE__ */ t.jsx(
       "div",
       {
-        ref: l,
+        ref: r,
         className: xt.content,
-        style: { height: `${i}px` },
+        style: { height: `${a}px` },
         children: /* @__PURE__ */ t.jsx("p", { id: "p", children: o })
       }
     )
@@ -3184,8 +3183,8 @@ const $a = (r) => {
   label: _a,
   textarea: ha,
   length: pa
-}, Ba = (r) => {
-  const { onChange: o, label: e, value: s, maxLength: i, placeholder: a = "Type something..." } = r, [l, d] = f.useState(s.length);
+}, Ba = (d) => {
+  const { onChange: o, label: e, value: s, maxLength: i, placeholder: a = "Type something..." } = d, [l, r] = f.useState(s.length);
   return /* @__PURE__ */ t.jsxs("div", { className: vt.wrapper, children: [
     e && /* @__PURE__ */ t.jsx(
       "label",
@@ -3201,7 +3200,7 @@ const $a = (r) => {
         id: e,
         defaultValue: s,
         onChange: (n) => {
-          d(n.target.value.length), o(n.target.value);
+          r(n.target.value.length), o(n.target.value);
         },
         placeholder: a,
         className: vt.textarea,