@lanaco/lnc-react-ui 4.0.185 → 4.0.188

package/dist/GiftCardsSection.js

@@ -1,13 +1,13 @@
 import { jsxs as i, jsx as r, Fragment as R } from "react/jsx-runtime";
-import { forwardRef as v, Suspense as k } from "react";
-import { u as $ } from "./useDetectMobile-Bkvj0VMa.js";
-import { R as I } from "./style-C7FUSHmS.js";
-import { p as N, G as A, k as g } from "./utils-Dc5zIpaz.js";
+import { forwardRef as C, Suspense as $ } from "react";
+import { u as I } from "./useDetectMobile-Bkvj0VMa.js";
+import { R as N } from "./style-C7FUSHmS.js";
+import { p as A, G as L, k as b } from "./utils-Dc5zIpaz.js";
 import W from "./Button.js";
-import { s as p } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { s as g } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as S } from "./consts-BuFChS64.js";
 import { s as T, a as j, S as h, b as o } from "./style-CXMUA6cI.js";
-const z = p.div`
+const z = g.div`
   display: grid;
   grid-template-columns: ${(t) => `repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
@@ -15,7 +15,7 @@ const z = p.div`
   @media (max-width: ${S + "px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`, B = p.a`
+`, B = g.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -38,7 +38,7 @@ const z = p.div`
       transform: scale(1.1);
     }
   }
-`, E = p.div`
+`, E = g.div`
   width: 100%;
   min-height: 11rem;
   max-height: 11rem;
@@ -75,33 +75,39 @@ const z = p.div`
     -webkit-transform: rotate(315deg);
     transform: rotate(315deg);
   }
-`, w = v((t, s) => {
+`, v = C((t, c) => {
   const {
     image: a,
-    text: l,
+    text: m,
     price: d,
     currency: n,
-    onSelectGiftCard: m = () => {
+    onSelectGiftCard: u = () => {
     },
-    selectAction: u
+    selectAction: l,
+    LinkComponent: p
   } = t;
   return /* @__PURE__ */ i(
     B,
     {
-      ref: s,
+      ref: c,
       className: "simple-gift-card",
-      onClick: () => m(d),
-      href: u,
+      onClick: () => u(d),
+      as: p || "a",
+      ...p ? {
+        to: `${l}`
+      } : {
+        href: `${l}`
+      },
       children: [
         /* @__PURE__ */ i(E, { children: [
-          /* @__PURE__ */ r("div", { className: "price-tag", children: d && n && `${N(d)} ${A(n)}` }),
+          /* @__PURE__ */ r("div", { className: "price-tag", children: d && n && `${A(d)} ${L(n)}` }),
           /* @__PURE__ */ r("img", { src: a })
         ] }),
-        /* @__PURE__ */ r("div", { className: "text-wrap", children: l })
+        /* @__PURE__ */ r("div", { className: "text-wrap", children: m })
       ]
     }
   );
-}), L = p(j)`
+}), M = g(j)`
   @media (max-width: ${S + "px"}) {
     flex-direction: column;
 
@@ -113,7 +119,7 @@ const z = p.div`
       }
     }
   }
-`, M = ({ keyPrefix: t }) => /* @__PURE__ */ i(L, { children: [
+`, D = ({ keyPrefix: t }) => /* @__PURE__ */ i(M, { children: [
   /* @__PURE__ */ i(h, { alignItems: "center", children: [
     /* @__PURE__ */ r(o, { height: "11rem", borderRadius: "0.75rem" }),
     /* @__PURE__ */ r(
@@ -182,49 +188,50 @@ const z = p.div`
     },
     `${t}-4`
   )
-] }), D = ({
+] }), U = ({
   keyPrefix: t,
-  isLoading: s = !1,
+  isLoading: c = !1,
   fallbackComponent: a = /* @__PURE__ */ r(R, {}),
-  children: l
-}) => /* @__PURE__ */ r(k, { fallbackComponent: a, children: s === !0 ? /* @__PURE__ */ r(M, { keyPrefix: t }) : l }), J = v((t, s) => {
+  children: m
+}) => /* @__PURE__ */ r($, { fallbackComponent: a, children: c === !0 ? /* @__PURE__ */ r(D, { keyPrefix: t }) : m }), K = C((t, c) => {
   const {
     icon: a,
-    title: l,
+    title: m,
     buttonLink: d,
     items: n,
-    isLoading: m = !1,
-    buttonText: u,
-    limit: f = 4,
-    onSelectCard: b = () => {
+    isLoading: u = !1,
+    buttonText: l,
+    limit: p = 4,
+    onSelectCard: f = () => {
     },
-    onButtonAction: C = () => {
-    }
-  } = t, y = $();
-  return /* @__PURE__ */ i(I, { ref: s, children: [
+    onButtonAction: k = () => {
+    },
+    LinkComponent: w
+  } = t, y = I();
+  return /* @__PURE__ */ i(N, { ref: c, children: [
     /* @__PURE__ */ i("div", { className: "regular-title", children: [
       /* @__PURE__ */ i("div", { className: "regular-title-text", children: [
-        g(a) && /* @__PURE__ */ r("i", { className: a }),
-        /* @__PURE__ */ r("span", { children: l })
+        b(a) && /* @__PURE__ */ r("i", { className: a }),
+        /* @__PURE__ */ r("span", { children: m })
       ] }),
-      g(u) && g(d) && !m && /* @__PURE__ */ r(
+      b(l) && b(d) && !u && /* @__PURE__ */ r(
         W,
         {
           type: "button",
           btnType: "tinted",
           color: "neutral",
           onClick: (e) => {
-            var c;
-            (c = e == null ? void 0 : e.target) == null || c.blur(), C(d);
+            var s;
+            (s = e == null ? void 0 : e.target) == null || s.blur(), k(d);
           },
           borderRadius: "curved",
           className: "button-link",
-          children: u
+          children: l
         }
       )
     ] }),
-    /* @__PURE__ */ r(D, { isLoading: m, keyPrefix: "gift-cards-skeleton", children: /* @__PURE__ */ r(z, { limit: f, children: y === !0 ? n == null ? void 0 : n.map((e, c) => /* @__PURE__ */ r(
-      w,
+    /* @__PURE__ */ r(U, { isLoading: u, keyPrefix: "gift-cards-skeleton", children: /* @__PURE__ */ r(z, { limit: p, children: y === !0 ? n == null ? void 0 : n.map((e, s) => /* @__PURE__ */ r(
+      v,
       {
         text: e == null ? void 0 : e.text,
         price: e == null ? void 0 : e.priceTo,
@@ -232,11 +239,12 @@ const z = p.div`
         image: e == null ? void 0 : e.imageUrl,
         uuid: e == null ? void 0 : e.uuid,
         selectAction: e == null ? void 0 : e.selectAction,
-        onSelectGiftCard: (G) => b(e)
+        onSelectGiftCard: (G) => f(e),
+        LinkComponent: w
       },
-      c
-    )) : n == null ? void 0 : n.slice(0, f).map((e, c) => /* @__PURE__ */ r(
-      w,
+      s
+    )) : n == null ? void 0 : n.slice(0, p).map((e, s) => /* @__PURE__ */ r(
+      v,
       {
         text: e == null ? void 0 : e.text,
         price: e == null ? void 0 : e.priceTo,
@@ -244,12 +252,13 @@ const z = p.div`
         image: e == null ? void 0 : e.imageUrl,
         uuid: e == null ? void 0 : e.uuid,
         selectAction: e == null ? void 0 : e.selectAction,
-        onSelectGiftCard: (G) => b(e)
+        onSelectGiftCard: (G) => f(e),
+        LinkComponent: w
       },
-      c
+      s
     )) }) })
   ] });
 });
 export {
-  J as default
+  K as default
 };

package/dist/MasonryGeneralCardsSection.cjs

@@ -1,4 +1,5 @@
-"use strict";const e=require("react/jsx-runtime"),h=require("react"),_=require("./Button.cjs"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),n=require("./utils-RnrgDDZP.cjs"),c=require("./consts-goSZX3xP.cjs"),w=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),i=require("./style-BAcV7F53.cjs"),j=d.styled.div`
+"use strict";const e=require("react/jsx-runtime"),p=require("react"),j=require("./Button.cjs"),s=require("./emotion-styled.browser.esm-BtEseadx.cjs"),i=require("./utils-RnrgDDZP.cjs"),d=require("./consts-goSZX3xP.cjs"),b=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),n=require("./style-BAcV7F53.cjs"),y=s.styled.a`
+  text-decoration: none;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -32,7 +33,7 @@
     width: 24.5rem;
     height: 30rem;
     border-radius: 0.75rem;
-    background-color: ${n.linearGradientAnimation("-90deg")};
+    background-color: ${i.linearGradientAnimation("-90deg")};
   }
 
   & .wrapper__text {
@@ -52,7 +53,7 @@
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${n.truncateTextInRows(2)}
+      ${i.truncateTextInRows(2)}
     }
 
     & .text__tag {
@@ -74,7 +75,7 @@
       font-style: normal;
       font-weight: 400;
       line-height: 1.25rem;
-      ${n.truncateTextInRows(2)}
+      ${i.truncateTextInRows(2)}
     }
 
     & .text__action {
@@ -88,32 +89,32 @@
     }
 
     & .text__title--skeleton {
-      background-color: ${n.linearGradientAnimation("-90deg")};
+      background-color: ${i.linearGradientAnimation("-90deg")};
       height: 1rem;
       width: 9rem;
     }
 
     & .text__description--skeleton {
-      background-color: ${n.linearGradientAnimation("-90deg")};
+      background-color: ${i.linearGradientAnimation("-90deg")};
       height: 1rem;
       width: 12rem;
     }
 
     & .text__action--skeleton {
-      background-color: ${n.linearGradientAnimation("-90deg")};
+      background-color: ${i.linearGradientAnimation("-90deg")};
       height: 2rem;
       width: 9rem;
     }
   }
   cursor: pointer;
 
-  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${d.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__image {
       height: 100%;
       max-height: 14.5rem;
     }
   }
-`,b=h.forwardRef(({title:r,imageUrl:t,description:o,buttonText:a,onSelectCard:m=()=>{},className:g,position:l,tag:s,backgroundColor:p,buttonLink:x},u)=>{const f=w.useTheme();return e.jsx(e.Fragment,{children:e.jsxs(j,{ref:u,theme:f,className:g,position:l,backgroundColor:p,onClick:m,href:`/${x}`,children:[e.jsx("img",{src:t,className:"wrapper__image"}),e.jsxs("div",{className:"wrapper__text",children:[s&&e.jsx("div",{className:"text__tag",children:s}),e.jsx("div",{className:"text__title",children:r}),n.isDefinedNotEmptyString(o)&&e.jsx("div",{className:"text__description",children:o}),n.isDefinedNotEmptyString(a)&&e.jsx(_,{text:a,className:"text__action"})]})]})})}),k=d.styled.div`
+`,k=p.forwardRef(({title:r,imageUrl:t,description:o,buttonText:a,onSelectCard:c=()=>{},className:m,position:g,tag:l,backgroundColor:h,buttonLink:x,LinkComponent:u},f)=>{const _=u||"a",w=b.useTheme();return e.jsx(e.Fragment,{children:e.jsxs(y,{ref:f,theme:w,className:m,position:g,backgroundColor:h,onClick:c,as:_,...u?{to:`/${x}`}:{href:`/${x}`},children:[e.jsx("img",{src:t,className:"wrapper__image"}),e.jsxs("div",{className:"wrapper__text",children:[l&&e.jsx("div",{className:"text__tag",children:l}),e.jsx("div",{className:"text__title",children:r}),i.isDefinedNotEmptyString(o)&&e.jsx("div",{className:"text__description",children:o}),i.isDefinedNotEmptyString(a)&&e.jsx(j,{text:a,className:"text__action"})]})]})})}),S=s.styled.div`
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
@@ -137,7 +138,7 @@
     }
   }
 
-  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${d.MOBILE_SIZE_PX+"px"}) {
     & .regular-title {
       font-size: 1.375rem;
 
@@ -146,7 +147,7 @@
       }
     }
   }
-`,y=d.styled.div`
+`,$=s.styled.div`
   display: grid;
   grid-template-columns: ${r=>"repeat(12,  minmax(0, 1fr))"};
 
@@ -156,7 +157,7 @@
   height: 30rem;
   max-height: 30rem;
 
-  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${d.MOBILE_SIZE_PX+"px"}) {
     display: flex;
     flex-direction: column;
     gap: 1.25rem;
@@ -164,8 +165,8 @@
     height: 100%;
     max-height: 100%;
   }
-`,S=d.styled(i.SkeletonRowWrapper)`
-  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+`,v=s.styled(n.SkeletonRowWrapper)`
+  @media (max-width: ${d.MOBILE_SIZE_PX+"px"}) {
     flex-direction: column;
 
     & .skeleton__big {
@@ -178,4 +179,4 @@
       flex-direction: column;
     }
   }
-`,v=({keyPrefix:r})=>e.jsxs(S,{children:[e.jsx(i.SkeletonColumnWrapper,{children:e.jsx(i.SkeletonLinePlaceholder,{height:"31.25rem",className:"skeleton__big"},`${r}-1`)}),e.jsxs(i.SkeletonColumnWrapper,{children:[e.jsxs(i.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(i.SkeletonLinePlaceholder,{height:"15rem"},`${r}-2`),e.jsx(i.SkeletonLinePlaceholder,{height:"15rem"},`${r}-3`)]}),e.jsxs(i.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(i.SkeletonLinePlaceholder,{height:"15rem"},`${r}-4`),e.jsx(i.SkeletonLinePlaceholder,{height:"15rem"},`${r}-5`)]})]})]}),$=({keyPrefix:r,isLoading:t=!1,fallbackComponent:o=e.jsx(e.Fragment,{}),children:a})=>e.jsx(h.Suspense,{fallbackComponent:o,children:t===!0?e.jsx(v,{keyPrefix:r}):a}),E=h.forwardRef(({title:r,items:t,isLoading:o=!1,limit:a=3,onSelectCard:m=()=>{}},g)=>e.jsxs(k,{ref:g,children:[e.jsx("div",{className:"regular-title",children:e.jsx("div",{className:"regular-title-text",children:e.jsx("span",{children:r})})}),e.jsx($,{isLoading:o,keyPrefix:"masonry-general-cards-skeleton",children:e.jsx(y,{limit:a,children:t&&(t==null?void 0:t.map((l,s)=>e.jsx(b,{...l,onSelectCard:()=>m(l)},`landing-page-masonry-general-card__${s+1}`)))})})]}));module.exports=E;
+`,E=({keyPrefix:r})=>e.jsxs(v,{children:[e.jsx(n.SkeletonColumnWrapper,{children:e.jsx(n.SkeletonLinePlaceholder,{height:"31.25rem",className:"skeleton__big"},`${r}-1`)}),e.jsxs(n.SkeletonColumnWrapper,{children:[e.jsxs(n.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{height:"15rem"},`${r}-2`),e.jsx(n.SkeletonLinePlaceholder,{height:"15rem"},`${r}-3`)]}),e.jsxs(n.SkeletonRowWrapper,{noGradient:!0,children:[e.jsx(n.SkeletonLinePlaceholder,{height:"15rem"},`${r}-4`),e.jsx(n.SkeletonLinePlaceholder,{height:"15rem"},`${r}-5`)]})]})]}),G=({keyPrefix:r,isLoading:t=!1,fallbackComponent:o=e.jsx(e.Fragment,{}),children:a})=>e.jsx(p.Suspense,{fallbackComponent:o,children:t===!0?e.jsx(E,{keyPrefix:r}):a}),N=p.forwardRef(({title:r,items:t,isLoading:o=!1,limit:a=3,onSelectCard:c=()=>{},LinkComponent:m},g)=>e.jsxs(S,{ref:g,children:[e.jsx("div",{className:"regular-title",children:e.jsx("div",{className:"regular-title-text",children:e.jsx("span",{children:r})})}),e.jsx(G,{isLoading:o,keyPrefix:"masonry-general-cards-skeleton",children:e.jsx($,{limit:a,children:t&&(t==null?void 0:t.map((l,h)=>e.jsx(k,{...l,onSelectCard:()=>c(l),LinkComponent:m},`landing-page-masonry-general-card__${h+1}`)))})})]}));module.exports=N;

package/dist/MasonryGeneralCardsSection.js

@@ -1,12 +1,13 @@
-import { jsx as r, Fragment as _, jsxs as i } from "react/jsx-runtime";
-import { forwardRef as w, Suspense as y } from "react";
-import S from "./Button.js";
+import { jsx as r, Fragment as $, jsxs as i } from "react/jsx-runtime";
+import { forwardRef as v, Suspense as N } from "react";
+import C from "./Button.js";
 import { s } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { w as m, o as f, k as u } from "./utils-Dc5zIpaz.js";
-import { M as c } from "./consts-BuFChS64.js";
-import { u as N } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-import { a as p, S as x, b as o } from "./style-CXMUA6cI.js";
-const C = s.div`
+import { w as d, o as _, k as w } from "./utils-Dc5zIpaz.js";
+import { M as m } from "./consts-BuFChS64.js";
+import { u as G } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import { a as f, S as b, b as l } from "./style-CXMUA6cI.js";
+const z = s.a`
+  text-decoration: none;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -52,7 +53,7 @@ const C = s.div`
     width: 24.5rem;
     height: 30rem;
     border-radius: 0.75rem;
-    background-color: ${m("-90deg")};
+    background-color: ${d("-90deg")};
   }
 
   & .wrapper__text {
@@ -72,7 +73,7 @@ const C = s.div`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${f(2)}
+      ${_(2)}
     }
 
     & .text__tag {
@@ -94,7 +95,7 @@ const C = s.div`
       font-style: normal;
       font-weight: 400;
       line-height: 1.25rem;
-      ${f(2)}
+      ${_(2)}
     }
 
     & .text__action {
@@ -108,66 +109,72 @@ const C = s.div`
     }
 
     & .text__title--skeleton {
-      background-color: ${m("-90deg")};
+      background-color: ${d("-90deg")};
       height: 1rem;
       width: 9rem;
     }
 
     & .text__description--skeleton {
-      background-color: ${m("-90deg")};
+      background-color: ${d("-90deg")};
       height: 1rem;
       width: 12rem;
     }
 
     & .text__action--skeleton {
-      background-color: ${m("-90deg")};
+      background-color: ${d("-90deg")};
       height: 2rem;
       width: 9rem;
     }
   }
   cursor: pointer;
 
-  @media (max-width: ${c + "px"}) {
+  @media (max-width: ${m + "px"}) {
     & .wrapper__image {
       height: 100%;
       max-height: 14.5rem;
     }
   }
-`, G = w(
+`, M = v(
   ({
     title: e,
     imageUrl: t,
     description: a,
-    buttonText: n,
-    onSelectCard: g = () => {
+    buttonText: o,
+    onSelectCard: c = () => {
     },
-    className: h,
-    position: l,
-    tag: d,
-    backgroundColor: b,
-    buttonLink: v
-  }, $) => {
-    const k = N();
-    return /* @__PURE__ */ r(_, { children: /* @__PURE__ */ i(
-      C,
+    className: g,
+    position: h,
+    tag: n,
+    backgroundColor: p,
+    buttonLink: x,
+    LinkComponent: u
+  }, y) => {
+    const k = u || "a", S = G();
+    return /* @__PURE__ */ r($, { children: /* @__PURE__ */ i(
+      z,
       {
-        ref: $,
-        theme: k,
-        className: h,
-        position: l,
-        backgroundColor: b,
-        onClick: g,
-        href: `/${v}`,
+        ref: y,
+        theme: S,
+        className: g,
+        position: h,
+        backgroundColor: p,
+        onClick: c,
+        as: k,
+        ...u ? {
+          to: `/${x}`
+        } : {
+          href: `/${x}`
+        },
         children: [
           /* @__PURE__ */ r("img", { src: t, className: "wrapper__image" }),
           /* @__PURE__ */ i("div", { className: "wrapper__text", children: [
-            d && /* @__PURE__ */ r("div", { className: "text__tag", children: d }),
+            n && /* @__PURE__ */ r("div", { className: "text__tag", children: n }),
             /* @__PURE__ */ r("div", { className: "text__title", children: e }),
-            u(a) && /* @__PURE__ */ r("div", { className: "text__description", children: a }),
-            u(n) && /* @__PURE__ */ r(
-              S,
+            w(a) && /* @__PURE__ */ r("div", { className: "text__description", children: a }),
+            w(o) && /* @__PURE__ */ r(
+              C,
               {
-                text: n,
+                text: o,
                 className: "text__action"
               }
             )
@@ -176,7 +183,7 @@ const C = s.div`
       }
     ) });
   }
-), z = s.div`
+), j = s.div`
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
@@ -200,7 +207,7 @@ const C = s.div`
     }
   }
 
-  @media (max-width: ${c + "px"}) {
+  @media (max-width: ${m + "px"}) {
     & .regular-title {
       font-size: 1.375rem;
 
@@ -209,7 +216,7 @@ const C = s.div`
       }
     }
   }
-`, M = s.div`
+`, E = s.div`
   display: grid;
   grid-template-columns: ${(e) => "repeat(12,  minmax(0, 1fr))"};
 
@@ -219,7 +226,7 @@ const C = s.div`
   height: 30rem;
   max-height: 30rem;
 
-  @media (max-width: ${c + "px"}) {
+  @media (max-width: ${m + "px"}) {
     display: flex;
     flex-direction: column;
     gap: 1.25rem;
@@ -227,8 +234,8 @@ const C = s.div`
     height: 100%;
     max-height: 100%;
   }
-`, j = s(p)`
-  @media (max-width: ${c + "px"}) {
+`, W = s(f)`
+  @media (max-width: ${m + "px"}) {
     flex-direction: column;
 
     & .skeleton__big {
@@ -241,51 +248,59 @@ const C = s.div`
       flex-direction: column;
     }
   }
-`, E = ({ keyPrefix: e }) => /* @__PURE__ */ i(j, { children: [
-  /* @__PURE__ */ r(x, { children: /* @__PURE__ */ r(
-    o,
+`, R = ({ keyPrefix: e }) => /* @__PURE__ */ i(W, { children: [
+  /* @__PURE__ */ r(b, { children: /* @__PURE__ */ r(
+    l,
     {
       height: "31.25rem",
       className: "skeleton__big"
     },
     `${e}-1`
   ) }),
-  /* @__PURE__ */ i(x, { children: [
-    /* @__PURE__ */ i(p, { noGradient: !0, children: [
-      /* @__PURE__ */ r(o, { height: "15rem" }, `${e}-2`),
-      /* @__PURE__ */ r(o, { height: "15rem" }, `${e}-3`)
+  /* @__PURE__ */ i(b, { children: [
+    /* @__PURE__ */ i(f, { noGradient: !0, children: [
+      /* @__PURE__ */ r(l, { height: "15rem" }, `${e}-2`),
+      /* @__PURE__ */ r(l, { height: "15rem" }, `${e}-3`)
     ] }),
-    /* @__PURE__ */ i(p, { noGradient: !0, children: [
-      /* @__PURE__ */ r(o, { height: "15rem" }, `${e}-4`),
-      /* @__PURE__ */ r(o, { height: "15rem" }, `${e}-5`)
+    /* @__PURE__ */ i(f, { noGradient: !0, children: [
+      /* @__PURE__ */ r(l, { height: "15rem" }, `${e}-4`),
+      /* @__PURE__ */ r(l, { height: "15rem" }, `${e}-5`)
     ] })
   ] })
-] }), W = ({
+] }), I = ({
   keyPrefix: e,
   isLoading: t = !1,
-  fallbackComponent: a = /* @__PURE__ */ r(_, {}),
-  children: n
-}) => /* @__PURE__ */ r(y, { fallbackComponent: a, children: t === !0 ? /* @__PURE__ */ r(E, { keyPrefix: e }) : n }), O = w(
-  ({ title: e, items: t, isLoading: a = !1, limit: n = 3, onSelectCard: g = () => {
-  } }, h) => /* @__PURE__ */ i(z, { ref: h, children: [
+  fallbackComponent: a = /* @__PURE__ */ r($, {}),
+  children: o
+}) => /* @__PURE__ */ r(N, { fallbackComponent: a, children: t === !0 ? /* @__PURE__ */ r(R, { keyPrefix: e }) : o }), Z = v(
+  ({
+    title: e,
+    items: t,
+    isLoading: a = !1,
+    limit: o = 3,
+    onSelectCard: c = () => {
+    },
+    LinkComponent: g
+  }, h) => /* @__PURE__ */ i(j, { ref: h, children: [
     /* @__PURE__ */ r("div", { className: "regular-title", children: /* @__PURE__ */ r("div", { className: "regular-title-text", children: /* @__PURE__ */ r("span", { children: e }) }) }),
     /* @__PURE__ */ r(
-      W,
+      I,
       {
         isLoading: a,
         keyPrefix: "masonry-general-cards-skeleton",
-        children: /* @__PURE__ */ r(M, { limit: n, children: t && (t == null ? void 0 : t.map((l, d) => /* @__PURE__ */ r(
-          G,
+        children: /* @__PURE__ */ r(E, { limit: o, children: t && (t == null ? void 0 : t.map((n, p) => /* @__PURE__ */ r(
+          M,
           {
-            ...l,
-            onSelectCard: () => g(l)
+            ...n,
+            onSelectCard: () => c(n),
+            LinkComponent: g
           },
-          `landing-page-masonry-general-card__${d + 1}`
+          `landing-page-masonry-general-card__${p + 1}`
         ))) })
       }
     )
   ] })
 );
 export {
-  O as default
+  Z as default
 };

package/dist/OverlayGeneralCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const n=require("react/jsx-runtime"),d=require("react"),x=require("./Button.cjs"),f=require("./emotion-styled.browser.esm-BtEseadx.cjs"),g=require("./consts-goSZX3xP.cjs"),_=require("./index-D-3I_Ppj.cjs"),u=f.styled.a`
+"use strict";const n=require("react/jsx-runtime"),f=require("react"),u=require("./Button.cjs"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),h=require("./consts-goSZX3xP.cjs"),m=require("./index-D-3I_Ppj.cjs"),y=g.styled.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -62,7 +62,7 @@
     }
   }
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${h.MOBILE_SIZE_PX+"px"}) {
     padding: 2rem;
     min-height: 17.5rem;
     width: 100%;
@@ -85,7 +85,7 @@
       }
     }
   }
-`,m=d.forwardRef(({title:r,description:t,buttonText:i,imageUrl:s,backgroundColor:l="none",handleSelectCard:a=()=>{},handleButtonAction:e=()=>{},selectAction:c},h)=>n.jsxs(u,{ref:h,backgroundImage:s,backgroundColor:l,onClick:a,href:`/${c}`,children:[n.jsxs("div",{className:"section__text",children:[r&&n.jsx("div",{className:"section__title",children:r}),t&&n.jsx("div",{className:"section__description",children:t})]}),n.jsx(x,{text:i,onClick:o=>{o==null||o.preventDefault(),o==null||o.stopPropagation(),e()},borderRadius:"regular",color:"gray",className:"section__action"})]})),y=f.styled.div`
+`,v=f.forwardRef(({title:r,description:t,buttonText:s,imageUrl:a,backgroundColor:l="none",handleSelectCard:c=()=>{},handleButtonAction:d=()=>{},selectAction:e,LinkComponent:i},x)=>{const _=i||"a";return n.jsxs(y,{ref:x,backgroundImage:a,backgroundColor:l,onClick:c,as:_,...i?{to:`/${e}`}:{href:`/${e}`},children:[n.jsxs("div",{className:"section__text",children:[r&&n.jsx("div",{className:"section__title",children:r}),t&&n.jsx("div",{className:"section__description",children:t})]}),n.jsx(u,{text:s,onClick:o=>{o==null||o.preventDefault(),o==null||o.stopPropagation(),d()},borderRadius:"regular",color:"gray",className:"section__action"})]})}),p=g.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -124,7 +124,7 @@
     }
   }
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${h.MOBILE_SIZE_PX+"px"}) {
     & .section__title {
       font-size: 1.375rem;
       line-height: 1.75rem;
@@ -134,4 +134,4 @@
       flex-direction: column;
     }
   }
-`,v=d.forwardRef(({title:r,items:t,isLoading:i=!1,onSelectCard:s=()=>{},onButtonAction:l=()=>{}},a)=>n.jsxs(y,{ref:a,children:[n.jsx("div",{className:"section__title",children:r}),n.jsx(_.SuspenseBlogsSectionDetailed,{isLoading:i,keyPrefix:"overlay-general-cards-skeleton",children:n.jsx("div",{className:"section__items",children:t==null?void 0:t.map((e,c)=>n.jsx(m,{title:e==null?void 0:e.title,description:e==null?void 0:e.description,imageUrl:e==null?void 0:e.imageUrl,buttonText:e==null?void 0:e.buttonText,backgroundColor:e==null?void 0:e.backgroundColor,handleSelectCard:()=>s(e),handleButtonAction:()=>l(e),selectAction:e==null?void 0:e.selectAction},`overlay-general-card__${c+1}`))})})]}));module.exports=v;
+`,b=f.forwardRef(({title:r,items:t,isLoading:s=!1,onSelectCard:a=()=>{},onButtonAction:l=()=>{},LinkComponent:c},d)=>n.jsxs(p,{ref:d,children:[n.jsx("div",{className:"section__title",children:r}),n.jsx(m.SuspenseBlogsSectionDetailed,{isLoading:s,keyPrefix:"overlay-general-cards-skeleton",children:n.jsx("div",{className:"section__items",children:t==null?void 0:t.map((e,i)=>n.jsx(v,{title:e==null?void 0:e.title,description:e==null?void 0:e.description,imageUrl:e==null?void 0:e.imageUrl,buttonText:e==null?void 0:e.buttonText,backgroundColor:e==null?void 0:e.backgroundColor,handleSelectCard:()=>a(e),handleButtonAction:()=>l(e),selectAction:e==null?void 0:e.selectAction,LinkComponent:c},`overlay-general-card__${i+1}`))})})]}));module.exports=b;