@lanaco/lnc-react-ui 4.0.185 → 4.0.188

package/dist/SalesCampaignsSection.js

@@ -1,19 +1,19 @@
-import { jsx as n, jsxs as s, Fragment as Me } from "react/jsx-runtime";
-import { forwardRef as j, useRef as ye, useEffect as ae, Fragment as Oe, createElement as je, useState as ne, Suspense as Re, memo as Be, useMemo as We } from "react";
+import { jsx as n, jsxs as s, Fragment as Oe } from "react/jsx-runtime";
+import { forwardRef as j, useRef as $e, useEffect as oe, Fragment as je, createElement as Re, useState as te, Suspense as Be, memo as We, useMemo as Fe } from "react";
 import { s as y } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { a as oe, k as te, l as Fe, z as Ge, A as Ve, B as Ae, C as he } from "./utils-Dc5zIpaz.js";
+import { a as ie, k as ae, l as Ge, z as Ve, A as Ae, B as He, C as ue } from "./utils-Dc5zIpaz.js";
 import { M as U } from "./consts-BuFChS64.js";
-import { m as Se } from "./motion-Ckekul_K.js";
 import _e from "./Icon.js";
-import { D as pe } from "./ShopAvatar-4-fCYGEc.js";
-import He from "./Badge.js";
-import { P as a } from "./index-CblbdqjE.js";
-import { u as $e } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-import ue from "./IconButton.js";
-import { u as Ie } from "./useDetectMobile-Bkvj0VMa.js";
-import { I as Ze } from "./index-C0LcDEqa.js";
-import { a as O, c as fe, S as xe, b as w, d as be } from "./style-CXMUA6cI.js";
-const qe = y.a`
+import { D as fe } from "./ShopAvatar-4-fCYGEc.js";
+import Ze from "./Badge.js";
+import { P as o } from "./index-CblbdqjE.js";
+import { u as Ce } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import xe from "./IconButton.js";
+import { u as ke } from "./useDetectMobile-Bkvj0VMa.js";
+import { I as qe } from "./index-C0LcDEqa.js";
+import { m as Xe } from "./motion-Ckekul_K.js";
+import { a as O, c as be, S as ve, b as w, d as we } from "./style-CXMUA6cI.js";
+const Ye = y.a`
   text-decoration: none;
   color: var(--gray-950);
   cursor: pointer;
@@ -28,8 +28,8 @@ const qe = y.a`
     padding: 1rem;
     gap: 0;
   }
-`, Xe = y.div`
-  border-radius: ${(r) => oe(r.theme, "edged")};
+`, Je = y.div`
+  border-radius: ${(r) => ie(r.theme, "edged")};
   height: 13.75rem;
   width: 13.75rem;
   min-width: 13.75rem;
@@ -51,7 +51,7 @@ const qe = y.a`
       transform: scale(1.25);
     }
   }
-`, Ye = y.div`
+`, Ke = y.div`
   flex: 1;
   display: flex;
   flex-direction: column;
@@ -159,13 +159,13 @@ const qe = y.a`
       gap: 0.25rem;
     }
   }
-`, ve = (r = !1, t = !1, o = !1) => `
+`, ye = (r = !1, t = !1, i = !1) => `
     display: flex;
     ${t ? "flex-wrap: wrap;" : ""}
     ${t ? "" : "flex-wrap: nowrap;"}
     ${r ? "align-items: center;" : ""}
-    ${o ? "justify-content: center;" : ""}
-  `, Je = y(Se.a)`
+    ${i ? "justify-content: center;" : ""}
+  `, Qe = y.a`
   text-decoration: none;
   color: var(--gray-950);
   ${(r) => r.hasPermission === !0 && "cursor: pointer"};
@@ -183,14 +183,14 @@ const qe = y.a`
     text-decoration: none;
   }
 
-  ${ve(!0)}
+  ${ye(!0)}
   gap: 0.5rem;
   padding: 0.5rem;
   color: var(--gray-950, #14161a);
   font-weight: 500;
   font-size: 1rem;
   line-height: 1.5rem;
-  border-radius: ${(r) => oe(r.theme, "slight")};
+  border-radius: ${(r) => ie(r.theme, "slight")};
   transition: all 0.25s ease;
   & .description {
     font-size: 0.85rem;
@@ -199,7 +199,7 @@ const qe = y.a`
     font-weight: 400;
   }
   & .logo-wrapper {
-    ${ve(!0, !1, !0)}
+    ${ye(!0, !1, !0)}
     flex-shrink: 0;
     border-radius: 999px;
 
@@ -242,14 +242,14 @@ const qe = y.a`
     padding: 0;
     font-size: 0.875rem;
   }
-`, Ke = y.div`
+`, er = y.div`
   position: absolute;
   top: 0.5rem;
   ${(r) => r.alignToLeft === !0 ? "left: 0.5rem;" : "right: 0.5rem;"}
   display: flex;
   gap: 0.25rem;
-`, Qe = y.div`
-  border-radius: ${(r) => oe(r.theme, r.borderRadius || "slight")};
+`, rr = y.div`
+  border-radius: ${(r) => ie(r.theme, r.borderRadius || "slight")};
   background-color: ${(r) => r == null ? void 0 : r.color};
   color: white;
   height: 1.5rem;
@@ -264,77 +264,79 @@ const qe = y.a`
   & i {
     font-size: 0.813rem;
   }
-`, er = j(({ src: r, ...t }, o) => {
-  const i = ye();
-  return ae(() => {
-    var h;
+`, nr = j(({ src: r, ...t }, i) => {
+  const a = $e();
+  return oe(() => {
+    var p;
     const d = (l) => {
-      l.target.src = pe, l.onerror = null;
+      l.target.src = fe, l.onerror = null;
     };
-    return (h = i == null ? void 0 : i.current) == null || h.addEventListener("error", d), () => {
+    return (p = a == null ? void 0 : a.current) == null || p.addEventListener("error", d), () => {
       var l;
-      (l = i == null ? void 0 : i.current) == null || l.removeEventListener("error", d);
+      (l = a == null ? void 0 : a.current) == null || l.removeEventListener("error", d);
     };
-  }, []), /* @__PURE__ */ n(Oe, { ref: o, children: te(r) ? /* @__PURE__ */ n("img", { ref: i, src: r, ...t }) : /* @__PURE__ */ n("img", { src: pe, ...t }) });
-}), ke = (r) => {
+  }, []), /* @__PURE__ */ n(je, { ref: i, children: ae(r) ? /* @__PURE__ */ n("img", { ref: a, src: r, ...t }) : /* @__PURE__ */ n("img", { src: fe, ...t }) });
+}), Ie = (r) => {
   const {
     uuid: t,
-    hasPermission: o = !0,
-    isUser: i,
+    hasPermission: i = !0,
+    isUser: a,
     image: d,
-    imageComponent: h,
+    imageComponent: p,
     name: l,
-    notifications: $ = 0,
-    color: c = "primary",
-    size: p = "large",
-    style: m,
-    disabled: N,
-    onClick: u = () => {
+    notifications: _ = 0,
+    color: m = "primary",
+    size: h = "large",
+    style: g,
+    disabled: k,
+    onClick: f = () => {
     },
     isActive: v,
-    className: D,
-    shopCategory: T,
+    className: I,
+    shopCategory: N,
     // new
-    themeData: S
-  } = r, f = {
-    theme: $e(),
-    color: c,
-    size: p,
-    style: m,
-    disabled: N
+    themeData: S,
+    LinkComponent: c
+  } = r, x = c || "a", E = {
+    theme: Ce(),
+    color: m,
+    size: h,
+    style: g,
+    disabled: k
   };
-  return /* @__PURE__ */ je(
-    Je,
+  return /* @__PURE__ */ Re(
+    Qe,
     {
-      onClick: (x) => {
-        x == null || x.preventDefault(), x.stopPropagation(), o === !0 && (u == null || u());
+      onClick: (u) => {
+        u == null || u.preventDefault(), u.stopPropagation(), i === !0 && (f == null || f());
       },
-      ...f,
+      ...E,
       key: l,
-      className: `profile-item ${D}`,
-      hasPermission: o,
+      className: `profile-item ${I}`,
+      hasPermission: i,
       isActive: v,
       themeColor: (S == null ? void 0 : S.code) || "transparent",
-      href: `/${i ? "user" : "shop"}/${t}`
+      as: x,
+      ...c ? { to: `/${a ? "user" : "shop"}/${t}` } : { href: `/${a ? "user" : "shop"}/${t}` }
     },
-    /* @__PURE__ */ n("div", { className: "logo-wrapper", children: Fe(h) ? h : d }),
+    /* @__PURE__ */ n("div", { className: "logo-wrapper", children: Ge(p) ? p : d }),
     /* @__PURE__ */ s("div", { children: [
       /* @__PURE__ */ n("div", { className: "name", children: l }),
-      !i && /* @__PURE__ */ n("div", { className: "description", children: T }),
-      $ > 0 && /* @__PURE__ */ n("div", { className: "notifications-number", children: /* @__PURE__ */ n(He, { className: "badge", color: "danger", size: "small", children: $ > 99 ? "99+" : $ }) })
+      !a && /* @__PURE__ */ n("div", { className: "description", children: N }),
+      _ > 0 && /* @__PURE__ */ n("div", { className: "notifications-number", children: /* @__PURE__ */ n(Ze, { className: "badge", color: "danger", size: "small", children: _ > 99 ? "99+" : _ }) })
     ] })
   );
 };
-ke.propTypes = {
-  id: a.any,
-  isUserProfile: a.bool,
-  themeColor: a.string,
-  image: a.any,
-  name: a.string,
-  notifications: a.number,
-  style: a.object,
-  className: a.string,
-  color: a.oneOf([
+Ie.propTypes = {
+  id: o.any,
+  isUserProfile: o.bool,
+  themeColor: o.string,
+  image: o.any,
+  name: o.string,
+  notifications: o.number,
+  style: o.object,
+  className: o.string,
+  color: o.oneOf([
     "primary",
     "secondary",
     "success",
@@ -343,99 +345,101 @@ ke.propTypes = {
     "information",
     "neutral"
   ]),
-  size: a.oneOf(["large"]),
-  onSelect: a.func,
-  hasPermission: a.bool
+  size: o.oneOf(["large"]),
+  onSelect: o.func,
+  hasPermission: o.bool
 };
-const we = (r) => {
+const Se = (r) => {
   if (r !== void 0) {
-    const t = new Date(r), o = t.getFullYear(), i = t.getMonth() + 1;
-    return `${String(t.getDate()).padStart(2)}. ${i}. ${o}.`;
+    const t = new Date(r), i = t.getFullYear(), a = t.getMonth() + 1;
+    return `${String(t.getDate()).padStart(2)}. ${a}. ${i}.`;
   }
-}, rr = j((r, t) => {
-  var me;
-  const o = $e(), {
-    uuid: i,
+}, tr = j((r, t) => {
+  var he;
+  const i = Ce(), {
+    uuid: a,
     shopUuid: d,
-    title: h = "",
+    title: p = "",
     // description,
     // badges,
     coverPhoto: l,
-    onSelect: $,
+    onSelect: _,
     // status,
-    startDate: c,
-    endDate: p,
-    salesPackages: m,
-    shopName: N,
-    shopCategory: u,
+    startDate: m,
+    endDate: h,
+    salesPackages: g,
+    shopName: k,
+    shopCategory: f,
     shopImage: v,
-    shopImageComponent: D,
-    className: T,
+    shopImageComponent: I,
+    className: N,
     onSelectCard: S = () => {
     },
-    onSelectShop: g = () => {
+    onSelectShop: c = () => {
     },
-    upcoming: f = !1,
-    upcomingCampaignText: x,
-    campaignSingleText: A,
-    salesCampaignTypes: I = [],
-    startsInPrefixTextPlural: H,
-    startsinSuffixTextPlural: Z,
-    startsInPrefixTextSingular: q,
-    startsinSuffixTextSingular: ie,
-    endsInPrefixTextPlural: X,
-    endsinSuffixTextPlural: Y,
+    upcoming: x = !1,
+    upcomingCampaignText: D,
+    campaignSingleText: E,
+    salesCampaignTypes: u = [],
+    startsInPrefixTextPlural: V,
+    startsinSuffixTextPlural: A,
+    startsInPrefixTextSingular: H,
+    startsinSuffixTextSingular: se,
+    endsInPrefixTextPlural: Z,
+    endsinSuffixTextPlural: q,
     endsInPrefixTextSingular: R,
-    endsinSuffixTextSingular: J,
-    endedText: se,
-    themeData: B,
-    numberOfListings: E,
-    numberOfListingsTextSingular: W,
-    numberOfListingsTextPlural: e,
-    metadata: k,
-    ...le
-  } = r, F = ye(), M = Ge(c, p), K = M !== -1 && (M == null ? void 0 : M.isEnded) === !0, Q = M !== -1 && !K, ee = Ve(c), z = Ae(p), De = z !== null && z <= 2 && z > 0, ce = he(p), de = ce ? new Date(ce) : null, Te = /* @__PURE__ */ new Date(), re = de ? de.getTime() - Te.getTime() : null, G = re !== null && re > 0 && re < 24 * 60 * 60 * 1e3, ge = (b, L, C, _, P) => C === 1 ? `${b} ${C} ${_}` : `${L} ${C} ${P}`, Pe = () => {
-    if (!p) return null;
-    const b = he(p), L = b ? new Date(b) : null;
+    endsinSuffixTextSingular: X,
+    endedText: Y,
+    themeData: le,
+    numberOfListings: P,
+    numberOfListingsTextSingular: J,
+    numberOfListingsTextPlural: B,
+    metadata: e,
+    LinkComponent: W,
+    ...ce
+  } = r, K = W || "a", de = $e(), M = Ve(m, h), Q = M !== -1 && (M == null ? void 0 : M.isEnded) === !0, ee = M !== -1 && !Q, re = Ae(m), z = He(h), Te = z !== null && z <= 2 && z > 0, me = ue(h), ge = me ? new Date(me) : null, Pe = /* @__PURE__ */ new Date(), ne = ge ? ge.getTime() - Pe.getTime() : null, F = ne !== null && ne > 0 && ne < 24 * 60 * 60 * 1e3, pe = (b, L, C, $, T) => C === 1 ? `${b} ${C} ${$}` : `${L} ${C} ${T}`, ze = () => {
+    if (!h) return null;
+    const b = ue(h), L = b ? new Date(b) : null;
     if (!L) return null;
-    const C = ze, _ = L.getTime() - C.getTime();
-    if (_ <= 0) return null;
-    const P = Math.floor(_ / (1e3 * 60 * 60)), Ue = Math.floor(_ % (1e3 * 60 * 60) / (1e3 * 60)), Ee = Math.floor(_ % (1e3 * 60) / 1e3);
-    return { hours: P, minutes: Ue, seconds: Ee };
-  }, [ze, Le] = ne(/* @__PURE__ */ new Date());
-  ae(() => {
-    if (!G) return;
+    const C = Le, $ = L.getTime() - C.getTime();
+    if ($ <= 0) return null;
+    const T = Math.floor($ / (1e3 * 60 * 60)), Ee = Math.floor($ % (1e3 * 60 * 60) / (1e3 * 60)), Me = Math.floor($ % (1e3 * 60) / 1e3);
+    return { hours: T, minutes: Ee, seconds: Me };
+  }, [Le, Ue] = te(/* @__PURE__ */ new Date());
+  oe(() => {
+    if (!F) return;
     const b = setInterval(() => {
-      Le(/* @__PURE__ */ new Date());
+      Ue(/* @__PURE__ */ new Date());
     }, 1e3);
     return () => clearInterval(b);
-  }, [G]);
-  const V = G ? Pe() : null;
+  }, [F]);
+  const G = F ? ze() : null;
   return /* @__PURE__ */ s(
-    qe,
+    Ye,
     {
-      ref: F,
-      theme: o,
-      className: T,
-      name: k == null ? void 0 : k.name,
-      "data-accessor": k == null ? void 0 : k.accessor,
-      onClick: (b) => S(b, F),
-      href: `/shop/${d}/campaign/${i}`,
-      ...le,
+      ref: de,
+      theme: i,
+      className: N,
+      name: e == null ? void 0 : e.name,
+      "data-accessor": e == null ? void 0 : e.accessor,
+      onClick: (b) => S(b, de),
+      as: K,
+      ...W ? { to: `/shop/${d}/campaign/${a}` } : { href: `/shop/${d}/campaign/${a}` },
+      ...ce,
       children: [
-        /* @__PURE__ */ s(Xe, { theme: o, children: [
+        /* @__PURE__ */ s(Je, { theme: i, children: [
           /* @__PURE__ */ n("img", { src: l }),
-          /* @__PURE__ */ n(Ke, { children: m == null ? void 0 : m.map((b, L) => {
-            var C, _;
+          /* @__PURE__ */ n(er, { children: g == null ? void 0 : g.map((b, L) => {
+            var C, $;
             return /* @__PURE__ */ n(
-              Qe,
+              rr,
               {
-                color: (C = I == null ? void 0 : I.find((P) => P.value === b)) == null ? void 0 : C.color,
-                theme: o,
+                color: (C = u == null ? void 0 : u.find((T) => T.value === b)) == null ? void 0 : C.color,
+                theme: i,
                 children: /* @__PURE__ */ n(
                   _e,
                   {
-                    icon: (_ = I == null ? void 0 : I.find((P) => P.value === b)) == null ? void 0 : _.icon
+                    icon: ($ = u == null ? void 0 : u.find((T) => T.value === b)) == null ? void 0 : $.icon
                   }
                 )
               },
@@ -443,20 +447,20 @@ const we = (r) => {
             );
           }) })
         ] }),
-        /* @__PURE__ */ s(Ye, { theme: o, children: [
+        /* @__PURE__ */ s(Ke, { theme: i, children: [
           /* @__PURE__ */ n("div", { className: "text-block-wrapper", children: /* @__PURE__ */ s("div", { className: "title-block-wrapper", children: [
-            /* @__PURE__ */ n("div", { className: "campaign-title", children: (me = f ? x : A) == null ? void 0 : me.toUpperCase() }),
-            /* @__PURE__ */ n("div", { className: "campaign-title-text", children: h }),
-            p && c && /* @__PURE__ */ s("div", { className: "campaign-date", children: [
-              we(c),
+            /* @__PURE__ */ n("div", { className: "campaign-title", children: (he = x ? D : E) == null ? void 0 : he.toUpperCase() }),
+            /* @__PURE__ */ n("div", { className: "campaign-title-text", children: p }),
+            h && m && /* @__PURE__ */ s("div", { className: "campaign-date", children: [
+              Se(m),
               " - ",
-              we(p)
+              Se(h)
             ] }),
             /* @__PURE__ */ s("div", { className: "timestamp-text", children: [
-              E > 0 && /* @__PURE__ */ s("span", { className: "listings-text", children: [
-                E,
+              P > 0 && /* @__PURE__ */ s("span", { className: "listings-text", children: [
+                P,
                 " ",
-                E === 1 ? W : e,
+                P === 1 ? J : B,
                 " ",
                 "∙",
                 " "
@@ -464,52 +468,52 @@ const we = (r) => {
               /* @__PURE__ */ n(
                 "span",
                 {
-                  className: `duration-text ${De ? "urgent" : ""} ${Q ? "" : "starts-in"}`,
-                  children: G && V ? /* @__PURE__ */ s("div", { className: "countdown-timer", children: [
+                  className: `duration-text ${Te ? "urgent" : ""} ${ee ? "" : "starts-in"}`,
+                  children: F && G ? /* @__PURE__ */ s("div", { className: "countdown-timer", children: [
                     R,
                     " ",
-                    V.hours.toString().padStart(2, "0"),
+                    G.hours.toString().padStart(2, "0"),
                     ":",
-                    V.minutes.toString().padStart(2, "0"),
+                    G.minutes.toString().padStart(2, "0"),
                     ":",
-                    V.seconds.toString().padStart(2, "0")
-                  ] }) : Q && !K && z !== null && z > 0 ? ge(
+                    G.seconds.toString().padStart(2, "0")
+                  ] }) : ee && !Q && z !== null && z > 0 ? pe(
                     R,
-                    X,
+                    Z,
                     z,
-                    J,
-                    Y
-                  ) : K ? se || "Završena" : !Q && ee !== null && ee > 0 ? ge(
-                    q,
+                    X,
+                    q
+                  ) : Q ? Y || "Završena" : !ee && re !== null && re > 0 ? pe(
                     H,
-                    ee,
-                    ie,
-                    Z
+                    V,
+                    re,
+                    se,
+                    A
                   ) : null
                 }
               )
             ] })
           ] }) }),
           /* @__PURE__ */ n(
-            ke,
+            Ie,
             {
               hasPermission: !0,
-              image: /* @__PURE__ */ n(er, { src: v }),
-              imageComponent: D,
-              themeData: B,
+              image: /* @__PURE__ */ n(nr, { src: v }),
+              imageComponent: I,
+              themeData: le,
               isActive: !0,
               isUser: !1,
-              name: N,
-              shopCategory: u,
+              name: k,
+              shopCategory: f,
               uuid: d,
-              onClick: () => g(d)
+              onClick: () => c(d)
             }
           )
         ] })
       ]
     }
   );
-}), nr = y.div`
+}), ar = y.div`
   margin: 0 auto;
   display: flex;
   flex-direction: column;
@@ -560,7 +564,7 @@ const we = (r) => {
       }
     }
   }
-`, tr = y(Se.div)`
+`, or = y(Xe.div)`
   display: grid;
   grid-template-columns: repeat(${(r) => r == null ? void 0 : r.numOfColumns}, 1fr);
   gap: 1.5rem;
@@ -588,36 +592,36 @@ const we = (r) => {
       /* Safari and Chrome */
     }
   }
-`, Ce = j(
+`, Ne = j(
   ({
     icon: r,
     title: t,
-    numOfSlides: o = 2,
-    showNavigation: i = !0,
+    numOfSlides: i = 2,
+    showNavigation: a = !0,
     hasNextPage: d = !1,
-    handleFetchNextPage: h = () => {
+    handleFetchNextPage: p = () => {
     },
     children: l
-  }, $) => {
-    const [c, p] = ne(0), [m, N] = ne(1), u = Ie(), v = (l == null ? void 0 : l.length) ?? 1;
-    ae(() => {
-      const g = () => {
-        N(o);
+  }, _) => {
+    const [m, h] = te(0), [g, k] = te(1), f = ke(), v = (l == null ? void 0 : l.length) ?? 1;
+    oe(() => {
+      const c = () => {
+        k(i);
       };
-      return window.addEventListener("resize", g), g(), () => window.removeEventListener("resize", g);
+      return window.addEventListener("resize", c), c(), () => window.removeEventListener("resize", c);
     }, []);
-    const D = u ? l : l == null ? void 0 : l.slice(c, c + m), T = (g) => {
+    const I = f ? l : l == null ? void 0 : l.slice(m, m + g), N = (c) => {
+      var D;
+      (D = c == null ? void 0 : c.target) == null || D.blur();
+      const x = m + g;
+      x < v && h(x), x + g >= v && d && p();
+    }, S = (c) => {
       var x;
-      (x = g == null ? void 0 : g.target) == null || x.blur();
-      const f = c + m;
-      f < v && p(f), f + m >= v && d && h();
-    }, S = (g) => {
-      var f;
-      (f = g == null ? void 0 : g.target) == null || f.blur(), c - m >= 0 && p(c - m);
+      (x = c == null ? void 0 : c.target) == null || x.blur(), m - g >= 0 && h(m - g);
     };
-    return /* @__PURE__ */ s(nr, { ref: $, children: [
+    return /* @__PURE__ */ s(ar, { ref: _, children: [
       /* @__PURE__ */ n("div", { className: "scrollable-section__header", children: /* @__PURE__ */ s("div", { className: "scrollable-section__title", children: [
-        te(r) && /* @__PURE__ */ n(
+        ae(r) && /* @__PURE__ */ n(
           _e,
           {
             icon: r,
@@ -626,16 +630,16 @@ const we = (r) => {
             className: "title__icon"
           }
         ),
-        te(t) && /* @__PURE__ */ s("div", { className: "title__text", children: [
+        ae(t) && /* @__PURE__ */ s("div", { className: "title__text", children: [
           " ",
           t
         ] })
       ] }) }),
       /* @__PURE__ */ s(
-        tr,
+        or,
         {
-          numOfColumns: o,
-          ...!u && {
+          numOfColumns: i,
+          ...!f && {
             animate: {
               x: 0,
               opacity: 1
@@ -646,50 +650,50 @@ const we = (r) => {
             }
           },
           children: [
-            D,
-            u && d && /* @__PURE__ */ n(Ze, { onIsVisible: h })
+            I,
+            f && d && /* @__PURE__ */ n(qe, { onIsVisible: p })
           ]
         },
-        `scrollable-section__content-${c}`
+        `scrollable-section__content-${m}`
       ),
-      i && v > m && !u && /* @__PURE__ */ s("div", { className: "scrollable-section__navigation", children: [
+      a && v > g && !f && /* @__PURE__ */ s("div", { className: "scrollable-section__navigation", children: [
         /* @__PURE__ */ n(
-          ue,
+          xe,
           {
             icon: "angle-left",
             borderRadius: "curved",
             btnType: "tinted",
             color: "neutral",
             className: "navigation__arrow",
-            disabled: c === 0,
+            disabled: m === 0,
             onClick: S
           }
         ),
         /* @__PURE__ */ n(
-          ue,
+          xe,
           {
             icon: "angle-right",
             borderRadius: "curved",
             btnType: "tinted",
             color: "neutral",
             className: "navigation__arrow",
-            disabled: c + m >= v,
-            onClick: T
+            disabled: m + g >= v,
+            onClick: N
           }
         )
       ] })
     ] });
   }
 );
-Ce.propTypes = {
-  icon: a.string,
-  title: a.string,
-  numOfSlides: a.number,
-  numOfSlidesForMobile: a.number,
-  handleFetchNextPage: a.func,
-  showNavigation: a.bool
+Ne.propTypes = {
+  icon: o.string,
+  title: o.string,
+  numOfSlides: o.number,
+  numOfSlidesForMobile: o.number,
+  handleFetchNextPage: o.func,
+  showNavigation: o.bool
 };
-const ar = y.div`
+const ir = y.div`
   display: flex;
   flex: 1;
   width: 100%;
@@ -706,33 +710,33 @@ const ar = y.div`
     border-radius: 1.25rem;
     object-fit: cover;
   }
-`, Ne = j(
+`, De = j(
   ({
     sectionName: r,
     imageUrl: t,
-    maxHeight: o = "16.25rem",
-    className: i = "",
+    maxHeight: i = "16.25rem",
+    className: a = "",
     handleClick: d = () => {
     }
-  }, h) => /* @__PURE__ */ n(
-    ar,
+  }, p) => /* @__PURE__ */ n(
+    ir,
     {
-      ref: h,
-      maxHeight: o,
+      ref: p,
+      maxHeight: i,
       onClick: d,
-      className: `itemless-banner ${i}`,
+      className: `itemless-banner ${a}`,
       children: /* @__PURE__ */ n("img", { src: t, alt: `itemless-banner__${r}` })
     }
   )
 );
-Ne.propTypes = {
-  sectionName: a.string,
-  imageUrl: a.string,
-  maxHeight: a.string,
-  className: a.string,
-  handleClick: a.func
+De.propTypes = {
+  sectionName: o.string,
+  imageUrl: o.string,
+  maxHeight: o.string,
+  className: o.string,
+  handleClick: o.func
 };
-const or = y(O)`
+const sr = y(O)`
   @media (max-width: ${U + "px"}) {
     flex-direction: column;
 
@@ -747,10 +751,10 @@ const or = y(O)`
       }
     }
   }
-`, ir = ({ keyPrefix: r }) => /* @__PURE__ */ s(or, { children: [
+`, lr = ({ keyPrefix: r }) => /* @__PURE__ */ s(sr, { children: [
   /* @__PURE__ */ s(O, { children: [
     /* @__PURE__ */ n(
-      fe,
+      be,
       {
         width: "13.75rem",
         height: "13.75rem",
@@ -758,20 +762,20 @@ const or = y(O)`
       },
       `${r}-1`
     ),
-    /* @__PURE__ */ s(xe, { noGradient: !0, children: [
+    /* @__PURE__ */ s(ve, { noGradient: !0, children: [
       /* @__PURE__ */ n(w, { height: "1rem" }),
       /* @__PURE__ */ n(w, { height: "1.75rem" }),
       /* @__PURE__ */ n(w, { height: "1.25rem" }),
       /* @__PURE__ */ n(w, { height: "2rem" }),
       /* @__PURE__ */ s(O, { alignItems: "center", noGradient: !0, children: [
-        /* @__PURE__ */ n(be, { width: "2.5rem", height: "2.5rem" }),
+        /* @__PURE__ */ n(we, { width: "2.5rem", height: "2.5rem" }),
         /* @__PURE__ */ n(w, { width: "5rem", height: "1.25rem" })
       ] })
     ] })
   ] }),
   /* @__PURE__ */ s(O, { noGradient: !0, children: [
     /* @__PURE__ */ n(
-      fe,
+      be,
       {
         width: "13.75rem",
         height: "13.75rem",
@@ -779,66 +783,67 @@ const or = y(O)`
       },
       `${r}-2`
     ),
-    /* @__PURE__ */ s(xe, { noGradient: !0, children: [
+    /* @__PURE__ */ s(ve, { noGradient: !0, children: [
       /* @__PURE__ */ n(w, { height: "1rem" }),
       /* @__PURE__ */ n(w, { height: "1.75rem" }),
       /* @__PURE__ */ n(w, { height: "1.25rem" }),
       /* @__PURE__ */ n(w, { height: "2rem" }),
       /* @__PURE__ */ s(O, { alignItems: "center", noGradient: !0, children: [
-        /* @__PURE__ */ n(be, { width: "2.5rem", height: "2.5rem" }),
+        /* @__PURE__ */ n(we, { width: "2.5rem", height: "2.5rem" }),
         /* @__PURE__ */ n(w, { width: "5rem", height: "1.25rem" })
       ] })
     ] })
   ] })
-] }), sr = ({
+] }), cr = ({
   keyPrefix: r,
   isLoading: t = !1,
-  fallbackComponent: o = /* @__PURE__ */ n(Me, {}),
-  children: i
-}) => /* @__PURE__ */ n(Re, { fallbackComponent: o, children: t === !0 ? /* @__PURE__ */ n(ir, { keyPrefix: r }) : i }), lr = Be(rr), $r = j(
+  fallbackComponent: i = /* @__PURE__ */ n(Oe, {}),
+  children: a
+}) => /* @__PURE__ */ n(Be, { fallbackComponent: i, children: t === !0 ? /* @__PURE__ */ n(lr, { keyPrefix: r }) : a }), dr = We(tr), kr = j(
   ({
     sellerType: r = "Shop",
     items: t = [],
-    title: o,
-    icon: i,
+    title: i,
+    icon: a,
     isLoading: d,
-    onSelectCard: h = () => {
+    onSelectCard: p = () => {
     },
     onSelectShop: l = () => {
     },
-    getImage: $ = () => {
+    getImage: _ = () => {
     },
-    campaignSingleText: c,
-    upcomingCampaignText: p,
-    salesCampaignTypes: m = [],
-    startsInPrefixTextPlural: N,
-    startsinSuffixTextPlural: u,
+    campaignSingleText: m,
+    upcomingCampaignText: h,
+    salesCampaignTypes: g = [],
+    startsInPrefixTextPlural: k,
+    startsinSuffixTextPlural: f,
     startsInPrefixTextSingular: v,
-    startsinSuffixTextSingular: D,
-    endsInPrefixTextPlural: T,
+    startsinSuffixTextSingular: I,
+    endsInPrefixTextPlural: N,
     endsinSuffixTextPlural: S,
-    endsInPrefixTextSingular: g,
-    endsinSuffixTextSingular: f,
-    endedText: x,
-    numOfSlides: A = 2,
-    showNavigation: I = !0,
-    numberOfListingsTextSingular: H,
-    numberOfListingsTextPlural: Z,
-    itemlessImageUrl: q,
-    itemlessLink: ie,
-    handleItemlessLink: X = () => {
+    endsInPrefixTextSingular: c,
+    endsinSuffixTextSingular: x,
+    endedText: D,
+    numOfSlides: E = 2,
+    showNavigation: u = !0,
+    numberOfListingsTextSingular: V,
+    numberOfListingsTextPlural: A,
+    itemlessImageUrl: H,
+    itemlessLink: se,
+    handleItemlessLink: Z = () => {
     },
-    componentName: Y,
+    componentName: q,
     hasNextPage: R = !1,
-    handleFetchNextPage: J = () => {
-    }
-  }, se) => {
-    const B = Ie(), E = We(() => {
-      let W = t == null ? void 0 : t.map((e, k) => /* @__PURE__ */ n(
-        lr,
+    handleFetchNextPage: X = () => {
+    },
+    LinkComponent: Y
+  }, le) => {
+    const P = ke(), J = Fe(() => {
+      let B = t == null ? void 0 : t.map((e, W) => /* @__PURE__ */ n(
+        dr,
         {
           className: "campaign-item",
-          coverPhoto: $(
+          coverPhoto: _(
             e == null ? void 0 : e.coverPhoto,
             (e == null ? void 0 : e.uuid) || (e == null ? void 0 : e.campaignUuid)
           ),
@@ -854,64 +859,65 @@ const or = y(O)`
           startDate: e == null ? void 0 : e.startDate,
           title: e == null ? void 0 : e.name,
           uuid: e == null ? void 0 : e.campaignUuid,
-          onSelectCard: (le, F) => h(e == null ? void 0 : e.campaignUuid, e == null ? void 0 : e.shopUuid, F),
+          onSelectCard: (ce, K) => p(e == null ? void 0 : e.campaignUuid, e == null ? void 0 : e.shopUuid, K),
           onSelectShop: () => l(e == null ? void 0 : e.shopUuid),
-          campaignSingleText: c,
-          upcomingCampaignText: p,
+          campaignSingleText: m,
+          upcomingCampaignText: h,
           upcoming: e == null ? void 0 : e.upcoming,
-          salesCampaignTypes: m,
-          startsInPrefixTextPlural: N,
-          startsinSuffixTextPlural: u,
+          salesCampaignTypes: g,
+          startsInPrefixTextPlural: k,
+          startsinSuffixTextPlural: f,
           startsInPrefixTextSingular: v,
-          startsinSuffixTextSingular: D,
-          endsInPrefixTextPlural: T,
+          startsinSuffixTextSingular: I,
+          endsInPrefixTextPlural: N,
           endsinSuffixTextPlural: S,
-          endsInPrefixTextSingular: g,
-          endsinSuffixTextSingular: f,
-          endedText: x,
+          endsInPrefixTextSingular: c,
+          endsinSuffixTextSingular: x,
+          endedText: D,
           themeData: e == null ? void 0 : e.themeData,
           numberOfListings: e == null ? void 0 : e.numberOfListings,
-          numberOfListingsTextSingular: H,
-          numberOfListingsTextPlural: Z,
-          metadata: { name: Y, accessor: e == null ? void 0 : e.accessor }
+          numberOfListingsTextSingular: V,
+          numberOfListingsTextPlural: A,
+          metadata: { name: q, accessor: e == null ? void 0 : e.accessor },
+          LinkComponent: Y
         },
-        `campaign__item__${k}__${e == null ? void 0 : e.startDate}___${e == null ? void 0 : e.endDate}`
+        `campaign__item__${W}__${e == null ? void 0 : e.startDate}___${e == null ? void 0 : e.endDate}`
       ));
-      return (t == null ? void 0 : t.length) < 2 && !B ? [
-        ...W,
+      return (t == null ? void 0 : t.length) < 2 && !P ? [
+        ...B,
         /* @__PURE__ */ n(
-          Ne,
+          De,
           {
-            imageUrl: q,
+            imageUrl: H,
             className: "campaign-item",
-            handleClick: X
+            handleClick: Z
           },
           "itemless-campaign-section-banner"
         )
-      ] : W;
+      ] : B;
     }, [t]);
     return /* @__PURE__ */ n(
-      sr,
+      cr,
       {
         isLoading: d,
         keyPrefix: "sales-campaign-skeleton",
         children: /* @__PURE__ */ n(
-          Ce,
+          Ne,
           {
-            icon: i,
-            title: o,
-            numOfSlides: A,
-            showNavigation: I,
+            icon: a,
+            title: i,
+            numOfSlides: E,
+            showNavigation: u,
             hasNextPage: R,
-            handleFetchNextPage: J,
-            children: E
+            handleFetchNextPage: X,
+            children: J
           },
-          `sales-campaign-section__${B}`
+          `sales-campaign-section__${P}`
         )
       }
     );
   }
 );
 export {
-  $r as default
+  kr as default
 };