@lanaco/lnc-react-ui 4.0.185 → 4.0.188

package/dist/BlogsSectionSimple.js

@@ -1,23 +1,23 @@
-import { jsxs as c, jsx as r, Fragment as M } from "react/jsx-runtime";
-import { forwardRef as k, useRef as T, memo as $, useMemo as I } from "react";
-import { s as b } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as C } from "./consts-BuFChS64.js";
+import { jsxs as p, jsx as r, Fragment as T } from "react/jsx-runtime";
+import { forwardRef as C, useRef as $, memo as L, useMemo as I } from "react";
+import { s as y } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as B } from "./consts-BuFChS64.js";
 import { u as P } from "./useDetectMobile-Bkvj0VMa.js";
-import { w as U, o as W, k as w } from "./utils-Dc5zIpaz.js";
-import { B as z, R as L } from "./style-C7FUSHmS.js";
-import j from "./Button.js";
-import D from "./Link.js";
-import { P as E } from "./index-C_NnINik.js";
-import { S as A } from "./index-BovNbKxB.js";
-const G = b.div`
+import { w as U, o as W, k as v } from "./utils-Dc5zIpaz.js";
+import { B as z, R as j } from "./style-C7FUSHmS.js";
+import D from "./Button.js";
+import E from "./Link.js";
+import { P as A } from "./index-C_NnINik.js";
+import { S as G } from "./index-BovNbKxB.js";
+const _ = y.div`
   display: grid;
   grid-template-columns: ${(n) => `repeat(${n.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${C + "px"}) {
+  @media (max-width: ${B + "px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`, _ = b.a`
+`, F = y.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -69,9 +69,9 @@ const G = b.div`
     padding: 1rem;
   }
 
-  @media (max-width: ${C + "px"}) {
+  @media (max-width: ${B + "px"}) {
   }
-`, F = b.div`
+`, O = y.div`
   padding: 1rem 1rem 0 1rem;
   display: flex;
   flex-direction: column;
@@ -91,98 +91,103 @@ const G = b.div`
     color: var(--gray-700, #4e555f);
     ${W(3)}
   }
-`, O = k((n, v) => {
+`, X = C((n, k) => {
   const {
-    title: d,
-    imageUrl: u,
-    text: f,
+    title: g,
+    imageUrl: h,
+    text: b,
     options: a,
     onCardClick: m,
     readMoreText: o = "Read more",
     metadata: i,
-    titleSlug: p
-  } = n, s = T();
-  return /* @__PURE__ */ c(
-    _,
+    titleSlug: s,
+    LinkComponent: c
+  } = n, u = c || "a", d = $();
+  return /* @__PURE__ */ p(
+    F,
     {
-      ref: s,
+      ref: d,
       name: i == null ? void 0 : i.name,
       "data-accessor": i == null ? void 0 : i.name,
       className: "blog-card",
-      onClick: (t) => m(t, s),
-      href: `/blog/${p}`,
+      onClick: (t) => m(t, d),
+      as: u,
+      ...c ? { to: `/blog/${s}` } : { href: `/blog/${s}` },
       children: [
-        /* @__PURE__ */ r(E, { src: u }),
-        /* @__PURE__ */ c(F, { children: [
-          /* @__PURE__ */ r("div", { className: "text-wr-title", children: d }),
-          /* @__PURE__ */ r("div", { className: "text-wr", children: f })
+        /* @__PURE__ */ r(A, { src: h }),
+        /* @__PURE__ */ p(O, { children: [
+          /* @__PURE__ */ r("div", { className: "text-wr-title", children: g }),
+          /* @__PURE__ */ r("div", { className: "text-wr", children: b })
         ] }),
-        a && /* @__PURE__ */ r("div", { className: "tags-wr", children: a == null ? void 0 : a.map((t, g) => /* @__PURE__ */ r(z, { color: t == null ? void 0 : t.color, children: t == null ? void 0 : t.name }, g)) }),
-        /* @__PURE__ */ r(D, { className: "action", color: "gray", onClick: m, children: o })
+        a && /* @__PURE__ */ r("div", { className: "tags-wr", children: a == null ? void 0 : a.map((t, f) => /* @__PURE__ */ r(z, { color: t == null ? void 0 : t.color, children: t == null ? void 0 : t.name }, f)) }),
+        /* @__PURE__ */ r(E, { className: "action", color: "gray", onClick: m, children: o })
       ]
     }
   );
-}), S = $(O), re = k((n, v) => {
+}), S = L(X), te = C((n, k) => {
   const {
-    icon: d,
-    title: u,
-    onButtonAction: f = () => {
+    icon: g,
+    title: h,
+    onButtonAction: b = () => {
     },
     onSelectCard: a = () => {
     },
     buttonLink: m,
     items: o,
     buttonText: i,
-    limit: p = 3,
-    isLoading: s = !1,
-    getImage: t = () => {
+    limit: s = 3,
+    isLoading: c = !1,
+    getImage: u = () => {
     },
-    readMoreText: g = "Read more",
-    componentName: y
-  } = n, B = P(), N = I(() => /* @__PURE__ */ r(M, { children: B === !0 ? o == null ? void 0 : o.map((e, l) => /* @__PURE__ */ r(
+    readMoreText: d = "Read more",
+    componentName: t,
+    LinkComponent: f
+  } = n, N = P(), R = I(() => /* @__PURE__ */ r(T, { children: N === !0 ? o == null ? void 0 : o.map((e, l) => /* @__PURE__ */ r(
     S,
     {
       isBlog: !0,
       title: e == null ? void 0 : e.title,
-      imageUrl: t(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
+      imageUrl: u(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
       text: e == null ? void 0 : e.description,
       titleSlug: e == null ? void 0 : e.titleSlug,
-      readMoreText: g,
+      readMoreText: d,
       options: e == null ? void 0 : e.options,
-      onCardClick: (R, h) => a(e == null ? void 0 : e.titleSlug, h),
-      metadata: { name: y, accessor: e == null ? void 0 : e.accessor }
+      onCardClick: (M, w) => a(e == null ? void 0 : e.titleSlug, w),
+      metadata: { name: t, accessor: e == null ? void 0 : e.accessor },
+      LinkComponent: f
     },
     l
-  )) : o == null ? void 0 : o.slice(0, p).map((e, l) => /* @__PURE__ */ r(
+  )) : o == null ? void 0 : o.slice(0, s).map((e, l) => /* @__PURE__ */ r(
     S,
     {
       isBlog: !0,
       title: e == null ? void 0 : e.title,
-      imageUrl: t(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
+      imageUrl: u(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
       text: e == null ? void 0 : e.description,
       titleSlug: e == null ? void 0 : e.titleSlug,
-      readMoreText: g,
+      readMoreText: d,
       options: e == null ? void 0 : e.options,
-      onCardClick: (R, h) => a(e == null ? void 0 : e.titleSlug, h),
-      metadata: { name: y, accessor: e == null ? void 0 : e.accessor }
+      onCardClick: (M, w) => a(e == null ? void 0 : e.titleSlug, w),
+      metadata: { name: t, accessor: e == null ? void 0 : e.accessor },
+      LinkComponent: f
     },
     l
   )) }), [o]);
-  return /* @__PURE__ */ c(L, { ref: v, children: [
-    /* @__PURE__ */ c("div", { className: "regular-title", children: [
-      /* @__PURE__ */ c("div", { className: "regular-title-text", children: [
-        w(d) && /* @__PURE__ */ r("i", { className: d }),
-        /* @__PURE__ */ r("span", { children: u })
+  return /* @__PURE__ */ p(j, { ref: k, children: [
+    /* @__PURE__ */ p("div", { className: "regular-title", children: [
+      /* @__PURE__ */ p("div", { className: "regular-title-text", children: [
+        v(g) && /* @__PURE__ */ r("i", { className: g }),
+        /* @__PURE__ */ r("span", { children: h })
       ] }),
-      w(i) && w(m) && !s && /* @__PURE__ */ r(
-        j,
+      v(i) && v(m) && !c && /* @__PURE__ */ r(
+        D,
         {
           type: "button",
           btnType: "tinted",
           color: "neutral",
           onClick: (e) => {
             var l;
-            (l = e == null ? void 0 : e.target) == null || l.blur(), f(m);
+            (l = e == null ? void 0 : e.target) == null || l.blur(), b(m);
           },
           borderRadius: "curved",
           className: "button-link",
@@ -191,15 +196,15 @@ const G = b.div`
       )
     ] }),
     /* @__PURE__ */ r(
-      A,
+      G,
       {
-        isLoading: s,
+        isLoading: c,
         keyPrefix: "blogs-simple-skeleton",
-        children: /* @__PURE__ */ r(G, { limit: p, children: N })
+        children: /* @__PURE__ */ r(_, { limit: s, children: R })
       }
     )
   ] });
 });
 export {
-  re as default
+  te as default
 };

package/dist/BlogsSectionSimpleCentered.cjs

@@ -1,13 +1,13 @@
-"use strict";const t=require("react/jsx-runtime"),u=require("react"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),f=require("./consts-goSZX3xP.cjs"),w=require("./useDetectMobile-zkbzoOGV.cjs"),j=require("./utils-RnrgDDZP.cjs"),y=require("./Button.cjs"),S=require("./index-uwl7BjRF.cjs"),h=require("./style-BAcV7F53.cjs"),C=g.styled.div`
+"use strict";const t=require("react/jsx-runtime"),u=require("react"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),b=require("./consts-goSZX3xP.cjs"),C=require("./useDetectMobile-zkbzoOGV.cjs"),k=require("./utils-RnrgDDZP.cjs"),y=require("./Button.cjs"),S=require("./index-uwl7BjRF.cjs"),p=require("./style-BAcV7F53.cjs"),v=g.styled.div`
   display: grid;
   grid-template-columns: ${r=>`repeat(${r.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
   margin: auto;
   width: fit-content;
-  @media (max-width: ${f.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`,k=g.styled.a`
+`,R=g.styled.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -45,10 +45,10 @@
     object-fit: cover;
   }
 
-  @media (max-width: ${f.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
     max-width: unset;
   }
-`,v=g.styled.div`
+`,$=g.styled.div`
   text-align: center;
   display: flex;
   flex-direction: column;
@@ -69,10 +69,10 @@
     font-weight: 400;
     line-height: 1.25rem;
     letter-spacing: 0.0156rem;
-    ${j.truncateTextInRows(3)}
+    ${k.truncateTextInRows(3)}
   }
-`,b=u.forwardRef((r,l)=>{const{title:n,image:o,text:c,buttonText:p,onCardClick:d,metadata:i,link:e}=r,s=u.useRef(),m=a=>{d(a,s)};return t.jsxs(k,{ref:s,name:i==null?void 0:i.name,"data-accessor":i==null?void 0:i.accessor,className:"blog-card",onClick:m,href:`/${e}`,children:[t.jsx(S.ProductImageWrapper,{src:o}),t.jsxs(v,{children:[t.jsx("div",{className:"text-wr-title",children:n}),t.jsx("div",{className:"text-wr",children:c})]}),t.jsx(y,{borderRadius:"curved",color:"gray",type:"button",btnType:"outline",onClick:m,size:"medium",children:p})]})}),R=g.styled(h.SkeletonRowWrapper)`
-  @media (max-width: ${f.MOBILE_SIZE_PX+"px"}) {
+`,w=u.forwardRef((r,l)=>{const{title:n,image:o,text:c,buttonText:f,onCardClick:d,metadata:i,link:m,LinkComponent:e}=r,a=e||"a",h=u.useRef(),s=j=>{d(j,h)};return t.jsxs(R,{ref:h,name:i==null?void 0:i.name,"data-accessor":i==null?void 0:i.accessor,className:"blog-card",onClick:s,as:a,...e?{to:`/${m}`}:{href:`/${m}`},children:[t.jsx(S.ProductImageWrapper,{src:o}),t.jsxs($,{children:[t.jsx("div",{className:"text-wr-title",children:n}),t.jsx("div",{className:"text-wr",children:c})]}),t.jsx(y,{borderRadius:"curved",color:"gray",type:"button",btnType:"outline",onClick:s,size:"medium",children:f})]})}),q=g.styled(p.SkeletonRowWrapper)`
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
     flex-direction: column;
 
     & > div {
@@ -88,4 +88,4 @@
       box-shadow: none;
     }
   }
-`,$=({keyPrefix:r})=>t.jsxs(R,{justifyContent:"center",alignItems:"center",children:[t.jsx(h.SkeletonLinePlaceholder,{height:"24.75rem",width:"18.5rem",borderRadius:"0.75rem"},`${r}-1`),t.jsx(h.SkeletonLinePlaceholder,{height:"24.75rem",width:"18.5rem",borderRadius:"0.75rem"},`${r}-2`),t.jsx(h.SkeletonLinePlaceholder,{height:"24.75rem",width:"18.5rem",borderRadius:"0.75rem"},`${r}-3`)]}),q=({keyPrefix:r,isLoading:l=!1,fallbackComponent:n=t.jsx(t.Fragment,{}),children:o})=>t.jsx(u.Suspense,{fallbackComponent:n,children:l===!0?t.jsx($,{keyPrefix:r}):o}),I=u.forwardRef((r,l)=>{const{items:n,limit:o=3,onSelectCard:c=()=>{},isLoading:p=!1,componentName:d}=r,i=w.useDetectMobile();return t.jsx(q,{isLoading:p,keyPrefix:"blogs-simple-centered-skeleton",children:t.jsx(C,{ref:l,limit:o,children:t.jsx(t.Fragment,{children:i===!0?n==null?void 0:n.map((e,s)=>t.jsx(b,{title:e==null?void 0:e.title,image:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(m,a)=>c(e,a),metadata:{name:d,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link},s)):n==null?void 0:n.slice(0,o).map((e,s)=>t.jsx(b,{title:e==null?void 0:e.title,image:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(m,a)=>c(e,a),metadata:{name:d,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link},s))})})})});module.exports=I;
+`,I=({keyPrefix:r})=>t.jsxs(q,{justifyContent:"center",alignItems:"center",children:[t.jsx(p.SkeletonLinePlaceholder,{height:"24.75rem",width:"18.5rem",borderRadius:"0.75rem"},`${r}-1`),t.jsx(p.SkeletonLinePlaceholder,{height:"24.75rem",width:"18.5rem",borderRadius:"0.75rem"},`${r}-2`),t.jsx(p.SkeletonLinePlaceholder,{height:"24.75rem",width:"18.5rem",borderRadius:"0.75rem"},`${r}-3`)]}),L=({keyPrefix:r,isLoading:l=!1,fallbackComponent:n=t.jsx(t.Fragment,{}),children:o})=>t.jsx(u.Suspense,{fallbackComponent:n,children:l===!0?t.jsx(I,{keyPrefix:r}):o}),B=u.forwardRef((r,l)=>{const{items:n,limit:o=3,onSelectCard:c=()=>{},isLoading:f=!1,componentName:d,LinkComponent:i}=r,m=C.useDetectMobile();return t.jsx(L,{isLoading:f,keyPrefix:"blogs-simple-centered-skeleton",children:t.jsx(v,{ref:l,limit:o,children:t.jsx(t.Fragment,{children:m===!0?n==null?void 0:n.map((e,a)=>t.jsx(w,{title:e==null?void 0:e.title,image:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(h,s)=>c(e,s),metadata:{name:d,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link,LinkComponent:i},a)):n==null?void 0:n.slice(0,o).map((e,a)=>t.jsx(w,{title:e==null?void 0:e.title,image:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(h,s)=>c(e,s),metadata:{name:d,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link,LinkComponent:i},a))})})})});module.exports=B;

package/dist/BlogsSectionSimpleCentered.js

@@ -1,22 +1,22 @@
-import { jsxs as f, jsx as t, Fragment as w } from "react/jsx-runtime";
-import { forwardRef as C, useRef as k, Suspense as y } from "react";
-import { s as p } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as u } from "./consts-BuFChS64.js";
-import { u as S } from "./useDetectMobile-Bkvj0VMa.js";
-import { o as v } from "./utils-Dc5zIpaz.js";
-import $ from "./Button.js";
-import { P as R } from "./index-C_NnINik.js";
-import { a as T, b as h } from "./style-CXMUA6cI.js";
-const B = p.div`
+import { jsxs as u, jsx as t, Fragment as C } from "react/jsx-runtime";
+import { forwardRef as k, useRef as S, Suspense as v } from "react";
+import { s as g } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as b } from "./consts-BuFChS64.js";
+import { u as $ } from "./useDetectMobile-Bkvj0VMa.js";
+import { o as R } from "./utils-Dc5zIpaz.js";
+import T from "./Button.js";
+import { P as B } from "./index-C_NnINik.js";
+import { a as I, b as f } from "./style-CXMUA6cI.js";
+const L = g.div`
   display: grid;
   grid-template-columns: ${(r) => `repeat(${r.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
   margin: auto;
   width: fit-content;
-  @media (max-width: ${u + "px"}) {
+  @media (max-width: ${b + "px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`, I = p.a`
+`, W = g.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -54,10 +54,10 @@ const B = p.div`
     object-fit: cover;
   }
 
-  @media (max-width: ${u + "px"}) {
+  @media (max-width: ${b + "px"}) {
     max-width: unset;
   }
-`, W = p.div`
+`, j = g.div`
   text-align: center;
   display: flex;
   flex-direction: column;
@@ -78,44 +78,54 @@ const B = p.div`
     font-weight: 400;
     line-height: 1.25rem;
     letter-spacing: 0.0156rem;
-    ${v(3)}
+    ${R(3)}
   }
-`, b = C((r, m) => {
-  const { title: i, image: o, text: s, buttonText: g, onCardClick: d, metadata: n, link: e } = r, a = k(), c = (l) => {
-    d(l, a);
+`, w = k((r, l) => {
+  const {
+    title: i,
+    image: o,
+    text: s,
+    buttonText: h,
+    onCardClick: d,
+    metadata: n,
+    link: c,
+    LinkComponent: e
+  } = r, m = e || "a", p = S(), a = (y) => {
+    d(y, p);
   };
-  return /* @__PURE__ */ f(
-    I,
+  return /* @__PURE__ */ u(
+    W,
     {
-      ref: a,
+      ref: p,
       name: n == null ? void 0 : n.name,
       "data-accessor": n == null ? void 0 : n.accessor,
       className: "blog-card",
-      onClick: c,
-      href: `/${e}`,
+      onClick: a,
+      as: m,
+      ...e ? { to: `/${c}` } : { href: `/${c}` },
       children: [
-        /* @__PURE__ */ t(R, { src: o }),
-        /* @__PURE__ */ f(W, { children: [
+        /* @__PURE__ */ t(B, { src: o }),
+        /* @__PURE__ */ u(j, { children: [
           /* @__PURE__ */ t("div", { className: "text-wr-title", children: i }),
           /* @__PURE__ */ t("div", { className: "text-wr", children: s })
         ] }),
         /* @__PURE__ */ t(
-          $,
+          T,
           {
             borderRadius: "curved",
             color: "gray",
             type: "button",
             btnType: "outline",
-            onClick: c,
+            onClick: a,
             size: "medium",
-            children: g
+            children: h
           }
         )
       ]
     }
   );
-}), j = p(T)`
-  @media (max-width: ${u + "px"}) {
+}), z = g(I)`
+  @media (max-width: ${b + "px"}) {
     flex-direction: column;
 
     & > div {
@@ -131,9 +141,9 @@ const B = p.div`
       box-shadow: none;
     }
   }
-`, z = ({ keyPrefix: r }) => /* @__PURE__ */ f(j, { justifyContent: "center", alignItems: "center", children: [
+`, M = ({ keyPrefix: r }) => /* @__PURE__ */ u(z, { justifyContent: "center", alignItems: "center", children: [
   /* @__PURE__ */ t(
-    h,
+    f,
     {
       height: "24.75rem",
       width: "18.5rem",
@@ -142,7 +152,7 @@ const B = p.div`
     `${r}-1`
   ),
   /* @__PURE__ */ t(
-    h,
+    f,
     {
       height: "24.75rem",
       width: "18.5rem",
@@ -151,7 +161,7 @@ const B = p.div`
     `${r}-2`
   ),
   /* @__PURE__ */ t(
-    h,
+    f,
     {
       height: "24.75rem",
       width: "18.5rem",
@@ -159,53 +169,56 @@ const B = p.div`
     },
     `${r}-3`
   )
-] }), M = ({
+] }), N = ({
   keyPrefix: r,
-  isLoading: m = !1,
-  fallbackComponent: i = /* @__PURE__ */ t(w, {}),
+  isLoading: l = !1,
+  fallbackComponent: i = /* @__PURE__ */ t(C, {}),
   children: o
-}) => /* @__PURE__ */ t(y, { fallbackComponent: i, children: m === !0 ? /* @__PURE__ */ t(z, { keyPrefix: r }) : o }), X = C((r, m) => {
+}) => /* @__PURE__ */ t(v, { fallbackComponent: i, children: l === !0 ? /* @__PURE__ */ t(M, { keyPrefix: r }) : o }), q = k((r, l) => {
   const {
     items: i,
     limit: o = 3,
     onSelectCard: s = () => {
     },
-    isLoading: g = !1,
-    componentName: d
-  } = r, n = S();
+    isLoading: h = !1,
+    componentName: d,
+    LinkComponent: n
+  } = r, c = $();
   return /* @__PURE__ */ t(
-    M,
+    N,
     {
-      isLoading: g,
+      isLoading: h,
       keyPrefix: "blogs-simple-centered-skeleton",
-      children: /* @__PURE__ */ t(B, { ref: m, limit: o, children: /* @__PURE__ */ t(w, { children: n === !0 ? i == null ? void 0 : i.map((e, a) => /* @__PURE__ */ t(
-        b,
+      children: /* @__PURE__ */ t(L, { ref: l, limit: o, children: /* @__PURE__ */ t(C, { children: c === !0 ? i == null ? void 0 : i.map((e, m) => /* @__PURE__ */ t(
+        w,
         {
           title: e == null ? void 0 : e.title,
           image: (e == null ? void 0 : e.image) || null,
           text: e == null ? void 0 : e.text,
           buttonText: e == null ? void 0 : e.buttonText,
-          onCardClick: (c, l) => s(e, l),
+          onCardClick: (p, a) => s(e, a),
           metadata: { name: d, accessor: e == null ? void 0 : e.accessor },
-          link: e == null ? void 0 : e.link
+          link: e == null ? void 0 : e.link,
+          LinkComponent: n
         },
-        a
-      )) : i == null ? void 0 : i.slice(0, o).map((e, a) => /* @__PURE__ */ t(
-        b,
+        m
+      )) : i == null ? void 0 : i.slice(0, o).map((e, m) => /* @__PURE__ */ t(
+        w,
         {
           title: e == null ? void 0 : e.title,
           image: (e == null ? void 0 : e.image) || null,
           text: e == null ? void 0 : e.text,
           buttonText: e == null ? void 0 : e.buttonText,
-          onCardClick: (c, l) => s(e, l),
+          onCardClick: (p, a) => s(e, a),
           metadata: { name: d, accessor: e == null ? void 0 : e.accessor },
-          link: e == null ? void 0 : e.link
+          link: e == null ? void 0 : e.link,
+          LinkComponent: n
         },
-        a
+        m
       )) }) })
     }
   );
 });
 export {
-  X as default
+  q as default
 };

package/dist/BlogsSectionWithFilters.cjs

@@ -1,12 +1,12 @@
-"use strict";const t=require("react/jsx-runtime"),a=require("react"),j=require("./emotion-styled.browser.esm-BtEseadx.cjs"),w=require("./consts-goSZX3xP.cjs"),L=require("./useDetectMobile-zkbzoOGV.cjs"),b=require("./utils-RnrgDDZP.cjs"),W=require("./style-CkcozOY6.cjs"),T=require("./Button.cjs"),E=require("./Link.cjs"),I=require("./index-uwl7BjRF.cjs"),M=require("./index-CSNxZFTX.cjs"),s=require("./style-BAcV7F53.cjs"),P=j.styled.div`
+"use strict";const t=require("react/jsx-runtime"),a=require("react"),S=require("./emotion-styled.browser.esm-BtEseadx.cjs"),C=require("./consts-goSZX3xP.cjs"),W=require("./useDetectMobile-zkbzoOGV.cjs"),k=require("./utils-RnrgDDZP.cjs"),T=require("./style-CkcozOY6.cjs"),E=require("./Button.cjs"),I=require("./Link.cjs"),M=require("./index-uwl7BjRF.cjs"),P=require("./index-CSNxZFTX.cjs"),s=require("./style-BAcV7F53.cjs"),O=S.styled.div`
   display: grid;
   grid-template-columns: ${r=>`repeat(${r.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${C.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`,O=j.styled.a`
+`,z=S.styled.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -39,9 +39,9 @@
     margin-top: auto;
   }
 
-  @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${C.MOBILE_SIZE_PX+"px"}) {
   }
-`,z=j.styled.div`
+`,D=S.styled.div`
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
@@ -56,10 +56,10 @@
     font-weight: 400;
     font-size: 0.875rem;
     color: var(--gray-700, #4e555f);
-    ${b.truncateTextInRows(3)}
+    ${k.truncateTextInRows(3)}
   }
-`,D=a.forwardRef((r,u)=>{const{title:l,imageUrl:c,text:n,buttonText:h,onCardClick:d,metadata:i,link:f}=r,p=a.useRef(),m=g=>{d(g,p)};return t.jsxs(O,{ref:p,name:i==null?void 0:i.name,"data-accessor":i==null?void 0:i.accessor,className:"blog-card",onClick:m,href:`/${f}`,children:[t.jsxs(z,{children:[t.jsx("div",{className:"text-wr-title",children:l}),t.jsx("div",{className:"text-wr",children:n}),t.jsx(E,{color:"gray",onClick:m,children:h})]}),t.jsx(I.ProductImageWrapper,{src:c})]})}),F=j.styled(s.SkeletonColumnWrapper)`
-  @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
+`,F=a.forwardRef((r,h)=>{const{title:l,imageUrl:c,text:i,buttonText:p,onCardClick:d,metadata:o,link:m,LinkComponent:g}=r,b=g||"a",u=a.useRef(),j=f=>{d(f,u)};return t.jsxs(z,{ref:u,name:o==null?void 0:o.name,"data-accessor":o==null?void 0:o.accessor,className:"blog-card",onClick:j,to:`/${m}`,as:b,...g?{to:`/${m}`}:{href:`/${m}`},children:[t.jsxs(D,{children:[t.jsx("div",{className:"text-wr-title",children:l}),t.jsx("div",{className:"text-wr",children:i}),t.jsx(I,{color:"gray",onClick:j,children:p})]}),t.jsx(M.ProductImageWrapper,{src:c})]})}),A=S.styled(s.SkeletonColumnWrapper)`
+  @media (max-width: ${C.MOBILE_SIZE_PX+"px"}) {
     & .skeleton__tags {
       & > div {
         width: 100%;
@@ -81,4 +81,4 @@
       }
     }
   }
-`,A=({keyPrefix:r})=>t.jsxs(F,{children:[t.jsxs(s.SkeletonRowWrapper,{className:"skeleton__tags",children:[t.jsx(s.SkeletonLinePlaceholder,{height:"2.25rem",width:"128px",borderRadius:"1rem"},`${r}-1`),t.jsx(s.SkeletonLinePlaceholder,{height:"2.25rem",width:"128px",borderRadius:"1rem"},`${r}-2`),t.jsx(s.SkeletonLinePlaceholder,{height:"2.25rem",width:"128px",borderRadius:"1rem"},`${r}-3`)]}),t.jsxs(s.SkeletonRowWrapper,{className:"skeleton__cards",children:[t.jsx(s.SkeletonLinePlaceholder,{height:"10.375rem",borderRadius:"0.75rem"},`${r}-4`),t.jsx(s.SkeletonLinePlaceholder,{height:"10.375rem",borderRadius:"0.75rem"},`${r}-5`),t.jsx(s.SkeletonLinePlaceholder,{height:"10.375rem",borderRadius:"0.75rem"},`${r}-6`)]})]}),U=({keyPrefix:r,isLoading:u=!1,fallbackComponent:l=t.jsx(t.Fragment,{}),children:c})=>t.jsx(a.Suspense,{fallbackComponent:l,children:u===!0?t.jsx(A,{keyPrefix:r}):c}),C=a.memo(D),X=a.forwardRef((r,u)=>{const{icon:l,title:c,items:n,buttonText:h,limit:d=3,options:i,selectedOption:f=[],onButtonAction:p=()=>{},buttonLink:m,onSelectOption:g=()=>{},onSelectAll:_=()=>{},isLoading:v=!1,onSelectCard:y=()=>{},productsToolbarName:$="All",allButton:N=!1,componentName:x}=r,R=L.useDetectMobile(),q=a.useMemo(()=>{var o;return t.jsx(t.Fragment,{children:R===!0?n==null?void 0:n.map((e,S)=>t.jsx(C,{title:e==null?void 0:e.title,imageUrl:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(B,k)=>y(e,k),metadata:{name:x,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link},S)):(o=n==null?void 0:n.slice(0,d))==null?void 0:o.map((e,S)=>t.jsx(C,{title:e==null?void 0:e.title,imageUrl:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(B,k)=>y(e,k),metadata:{name:x,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link},S))})},[n,R,d]);return t.jsxs(W.TitleWithOptionsSectionWrapper,{ref:u,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[b.isDefinedNotEmptyString(l)&&t.jsx("i",{className:l}),t.jsx("span",{children:c})]}),b.isDefinedNotEmptyString(h)&&b.isDefinedNotEmptyString(m)&&!v&&t.jsx(T,{type:"button",btnType:"tinted",color:"neutral",onClick:o=>{var e;(e=o==null?void 0:o.target)==null||e.blur(),p(m)},borderRadius:"curved",children:h})]}),t.jsxs(U,{isLoading:v,keyPrefix:"blogs-with-filters-skeleton",children:[(i==null?void 0:i.length)>0&&t.jsx(M.SelectBar,{items:i,selectedIds:f,onRemove:o=>{g(o)},onSelect:o=>{g(o)},onSelectAll:_,labelKey:"name",valueKey:"code",noMargin:!0,productsToolbarName:$,allButton:N}),t.jsx(P,{limit:d,children:q})]})]})});module.exports=X;
+`,U=({keyPrefix:r})=>t.jsxs(A,{children:[t.jsxs(s.SkeletonRowWrapper,{className:"skeleton__tags",children:[t.jsx(s.SkeletonLinePlaceholder,{height:"2.25rem",width:"128px",borderRadius:"1rem"},`${r}-1`),t.jsx(s.SkeletonLinePlaceholder,{height:"2.25rem",width:"128px",borderRadius:"1rem"},`${r}-2`),t.jsx(s.SkeletonLinePlaceholder,{height:"2.25rem",width:"128px",borderRadius:"1rem"},`${r}-3`)]}),t.jsxs(s.SkeletonRowWrapper,{className:"skeleton__cards",children:[t.jsx(s.SkeletonLinePlaceholder,{height:"10.375rem",borderRadius:"0.75rem"},`${r}-4`),t.jsx(s.SkeletonLinePlaceholder,{height:"10.375rem",borderRadius:"0.75rem"},`${r}-5`),t.jsx(s.SkeletonLinePlaceholder,{height:"10.375rem",borderRadius:"0.75rem"},`${r}-6`)]})]}),X=({keyPrefix:r,isLoading:h=!1,fallbackComponent:l=t.jsx(t.Fragment,{}),children:c})=>t.jsx(a.Suspense,{fallbackComponent:l,children:h===!0?t.jsx(U,{keyPrefix:r}):c}),_=a.memo(F),Z=a.forwardRef((r,h)=>{const{icon:l,title:c,items:i,buttonText:p,limit:d=3,options:o,selectedOption:m=[],onButtonAction:g=()=>{},buttonLink:b,onSelectOption:u=()=>{},onSelectAll:j=()=>{},isLoading:f=!1,onSelectCard:y=()=>{},productsToolbarName:L="All",allButton:N=!1,componentName:x,LinkComponent:R}=r,$=W.useDetectMobile(),q=a.useMemo(()=>{var n;return t.jsx(t.Fragment,{children:$===!0?i==null?void 0:i.map((e,w)=>t.jsx(_,{title:e==null?void 0:e.title,imageUrl:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(B,v)=>y(e,v),metadata:{name:x,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link,LinkComponent:R},w)):(n=i==null?void 0:i.slice(0,d))==null?void 0:n.map((e,w)=>t.jsx(_,{title:e==null?void 0:e.title,imageUrl:(e==null?void 0:e.image)||null,text:e==null?void 0:e.text,buttonText:e==null?void 0:e.buttonText,onCardClick:(B,v)=>y(e,v),metadata:{name:x,accessor:e==null?void 0:e.accessor},link:e==null?void 0:e.link,LinkComponent:R},w))})},[i,$,d]);return t.jsxs(T.TitleWithOptionsSectionWrapper,{ref:h,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[k.isDefinedNotEmptyString(l)&&t.jsx("i",{className:l}),t.jsx("span",{children:c})]}),k.isDefinedNotEmptyString(p)&&k.isDefinedNotEmptyString(b)&&!f&&t.jsx(E,{type:"button",btnType:"tinted",color:"neutral",onClick:n=>{var e;(e=n==null?void 0:n.target)==null||e.blur(),g(b)},borderRadius:"curved",children:p})]}),t.jsxs(X,{isLoading:f,keyPrefix:"blogs-with-filters-skeleton",children:[(o==null?void 0:o.length)>0&&t.jsx(P.SelectBar,{items:o,selectedIds:m,onRemove:n=>{u(n)},onSelect:n=>{u(n)},onSelectAll:j,labelKey:"name",valueKey:"code",noMargin:!0,productsToolbarName:L,allButton:N}),t.jsx(O,{limit:d,children:q})]})]})});module.exports=Z;