@lanaco/lnc-react-ui 4.0.204 → 4.0.206

package/dist/FieldOfInterestsMasonrySection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),p=require("react"),x=require("./utils-RnrgDDZP.cjs"),N=require("./Icon.cjs"),j=require("./emotion-styled.browser.esm-BtEseadx.cjs"),v=require("./consts-goSZX3xP.cjs"),P=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),n=require("./style-BAcV7F53.cjs"),q=j.styled.a`
+"use strict";const e=require("react/jsx-runtime"),w=require("react"),x=require("./utils-RnrgDDZP.cjs"),M=require("./Icon.cjs"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),j=require("./consts-goSZX3xP.cjs"),q=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),n=require("./style-BAcV7F53.cjs"),N=v.styled.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -53,7 +53,7 @@
     }
   }
 
-  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${j.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__content {
       & .wrapper__title {
         font-size: 0.875rem;
@@ -65,7 +65,7 @@
       }
     }
   }
-`,O=j.styled.div`
+`,z=v.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -116,7 +116,7 @@
     }
   }
 
-  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${j.MOBILE_SIZE_PX+"px"}) {
     max-width: unset;
     min-width: unset;
     flex-direction: row;
@@ -156,7 +156,7 @@
       max-width: unset;
     }
   }
-`,z=p.forwardRef(({text:t,isActive:o=!1,icon:i,onSelectCard:a=()=>{}},h)=>e.jsxs(O,{ref:h,className:o?"active":"",onClick:a,children:[e.jsx(N,{icon:i,className:"wrapper__icon"}),e.jsx("div",{className:"wrapper__text",children:t})]})),R=p.forwardRef(({image:t,imageComponent:o,title:i,description:a,className:h,onSelectCard:k=()=>{},link:f,LinkComponent:g},b)=>{const m=g||"a",{theme:w}=P.useTheme();return e.jsxs(q,{ref:b,theme:w,className:h,onClick:k,as:m,...g?{to:`/${f}`}:{href:`/${f}`},children:[x.isDefined(o)?o:e.jsx("img",{src:t,className:"wrapper__image"}),e.jsxs("div",{className:"wrapper__content",children:[i&&e.jsx("div",{className:"wrapper__title",children:i}),a&&e.jsx("div",{className:"wrapper__description",children:a})]})]})}),W=j.styled.div`
+`,P=w.forwardRef(({text:t,isActive:s=!1,icon:i,onSelectCard:o=()=>{}},c)=>e.jsxs(z,{ref:c,className:s?"active":"",onClick:o,children:[e.jsx(M,{icon:i,className:"wrapper__icon"}),e.jsx("div",{className:"wrapper__text",children:t})]})),R=w.forwardRef(({image:t,imageComponent:s,title:i,description:o,className:c,onSelectCard:k=()=>{},link:g,LinkComponent:f},b)=>{const m=f||"a",{theme:h}=q.useTheme();return e.jsxs(N,{ref:b,theme:h,className:c,onClick:k,as:m,...f?{to:`/${g}`}:{href:`/${g}`},children:[x.isDefined(s)?s:e.jsx("img",{src:t,className:"wrapper__image"}),e.jsxs("div",{className:"wrapper__content",children:[i&&e.jsx("div",{className:"wrapper__title",children:i}),o&&e.jsx("div",{className:"wrapper__description",children:o})]})]})}),O=v.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -194,6 +194,7 @@
 
   & .wrapper__tags {
     display: flex;
+    flex-wrap: wrap;
     justify-content: center;
     gap: 0.75rem;
   }
@@ -211,41 +212,21 @@
     }
   }
 
-  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${j.MOBILE_SIZE_PX+"px"}) {
     gap: 1rem;
 
-    & .wrapper__tags {
-      overflow-x: scroll;
-      justify-content: flex-start;
-      width: 100%;
-
-      -webkit-overflow-scrolling: touch;
-      ::-webkit-scrollbar {
-        -webkit-appearance: none;
-      }
-      -ms-overflow-style: none;
-      /* Internet Explorer 10+ */
-      scrollbar-width: none;
-      /* Firefox */
-
-      &::-webkit-scrollbar {
-        display: none;
-        /* Safari and Chrome */
-      }
-    }
-
     & .wrapper__cards {
       grid-template-columns: ${t=>`repeat(${t==null?void 0:t.limitCardsForMobile}, minmax(0, 1fr))`};
     }
   }
-`,I=j.styled(n.SkeletonRowWrapper)`
+`,F=v.styled(n.SkeletonRowWrapper)`
   &.skeleton__tags {
     max-width: 50rem;
   }
 
-  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${j.MOBILE_SIZE_PX+"px"}) {
     &.skeleton__tags {
       overflow-x: hidden;
     }
   }
-`,T=({keyPrefix:t})=>e.jsxs(I,{className:"skeleton__tags",children:[e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-1`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-2`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-3`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-4`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-5`)]}),B=({keyPrefix:t,isLoading:o=!1,fallbackComponent:i=e.jsx(e.Fragment,{}),children:a})=>e.jsx(p.Suspense,{fallbackComponent:i,children:o===!0?e.jsx(T,{keyPrefix:t}):a}),G=({keyPrefix:t})=>e.jsxs(I,{className:"skeleton__cards",children:[e.jsx(n.SkeletonLinePlaceholder,{height:"13.75rem"},`${t}-1`),e.jsx(n.SkeletonLinePlaceholder,{height:"13.75rem"},`${t}-2`),e.jsx(n.SkeletonLinePlaceholder,{height:"13.75rem"},`${t}-3`)]}),X=({keyPrefix:t,isLoading:o=!1,fallbackComponent:i=e.jsx(e.Fragment,{}),children:a})=>e.jsx(p.Suspense,{fallbackComponent:i,children:o===!0?e.jsx(G,{keyPrefix:t}):a}),Z=p.forwardRef(({title:t,subtitle:o,tags:i=[],items:a=[],limitTags:h=5,limitTagsForMobile:k=5,limit:f=3,limitForMobile:g=2,selectedTag:b,onSelectTag:m=()=>{},onSelectCard:w=()=>{},className:_,isLoadingTags:C=!1,isLoadingCards:$=!1,LinkComponent:E},L)=>(p.useLayoutEffect(()=>{if(!x.isDefinedNotEmptyString(_))return;const r=()=>{const c=document==null?void 0:document.querySelector(`.${_} .wrapper__cards`),l=c==null?void 0:c.querySelectorAll(".wrapper__card");l==null||l.forEach(y=>{const M=y.getBoundingClientRect().height,F=Math.ceil((M+10)/20);y.style.gridRowEnd=`span ${F}`});const S=l==null?void 0:l[(l==null?void 0:l.length)-1];if(S){const y=S.offsetTop+S.offsetHeight;c.style.height=`${y}px`}},d=document==null?void 0:document.querySelector(`.${_} .wrapper__cards`),s=d==null?void 0:d.querySelectorAll(".wrapper__image");let u=0;return(s==null?void 0:s.length)===0?r():(s==null||s.forEach(c=>{c.complete?u++:c.addEventListener("load",()=>{u++,u===(s==null?void 0:s.length)&&r()})}),u===(s==null?void 0:s.length)&&r()),window.addEventListener("resize",r),()=>{window.removeEventListener("resize",r)}},[_,a,$]),e.jsxs(W,{ref:L,limitTags:h,limitTagsForMobile:k,limitCards:f,limitCardsForMobile:g,className:_,numberOfTags:i==null?void 0:i.length,children:[e.jsxs("div",{className:"wrapper__heading",children:[t&&e.jsx("div",{className:"wrapper__title",children:t}),o&&e.jsx("div",{className:"wrapper__subtitle",children:o})]}),e.jsx(B,{isLoading:C,keyPrefix:"field-of-interests-masonry-tag",children:e.jsx("div",{className:"wrapper__tags__external",children:e.jsx("div",{className:"wrapper__tags",children:i==null?void 0:i.map((r,d)=>e.jsx(z,{icon:r==null?void 0:r.icon,text:r==null?void 0:r.title,isActive:(r==null?void 0:r.code)===b,onSelectCard:()=>m==null?void 0:m(r)},`field-of-interests-masonry-tag__${d+1}`))})})}),e.jsx(X,{isLoading:$,keyPrefix:"field-of-interests-masonry-card",children:e.jsx("div",{className:"wrapper__cards",children:a==null?void 0:a.map((r,d)=>e.jsx(R,{image:r==null?void 0:r.image,imageComponent:r==null?void 0:r.imageComponent,title:r==null?void 0:r.title,description:r==null?void 0:r.description,onSelectCard:()=>w==null?void 0:w(r),className:"wrapper__card",link:r==null?void 0:r.link,LinkComponent:E},`field-of-interests-with-tags-card__${d+1}`))})})]})));module.exports=Z;
+`,W=({keyPrefix:t})=>e.jsxs(F,{className:"skeleton__tags",children:[e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-1`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-2`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-3`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-4`),e.jsxs(n.SkeletonColumnWrapper,{alignItems:"center",gap:"0.5rem",noGradient:!0,children:[e.jsx(n.SkeletonCirclePlaceholder,{width:"2.75rem",height:"2.75rem"}),e.jsx(n.SkeletonLinePlaceholder,{height:"1.5rem",width:"8rem"})]},`${t}-5`)]}),T=({keyPrefix:t,isLoading:s=!1,fallbackComponent:i=e.jsx(e.Fragment,{}),children:o})=>e.jsx(w.Suspense,{fallbackComponent:i,children:s===!0?e.jsx(W,{keyPrefix:t}):o}),B=w.forwardRef(({title:t,subtitle:s,tags:i=[],items:o=[],limitTags:c=5,limitTagsForMobile:k=5,limit:g=3,limitForMobile:f=2,selectedTag:b,onSelectTag:m=()=>{},onSelectCard:h=()=>{},className:_,isLoadingTags:$=!1,LinkComponent:I},C)=>(w.useLayoutEffect(()=>{if(!x.isDefinedNotEmptyString(_))return;const r=()=>{const d=document==null?void 0:document.querySelector(`.${_} .wrapper__cards`),l=d==null?void 0:d.querySelectorAll(".wrapper__card");l==null||l.forEach(y=>{const E=y.getBoundingClientRect().height,L=Math.ceil((E+10)/20);y.style.gridRowEnd=`span ${L}`});const S=l==null?void 0:l[(l==null?void 0:l.length)-1];if(S){const y=S.offsetTop+S.offsetHeight;d.style.height=`${y}px`}},p=document==null?void 0:document.querySelector(`.${_} .wrapper__cards`),a=p==null?void 0:p.querySelectorAll(".wrapper__image");let u=0;return(a==null?void 0:a.length)===0?r():(a==null||a.forEach(d=>{d.complete?u++:d.addEventListener("load",()=>{u++,u===(a==null?void 0:a.length)&&r()})}),u===(a==null?void 0:a.length)&&r()),window.addEventListener("resize",r),()=>{window.removeEventListener("resize",r)}},[_,o]),e.jsxs(O,{ref:C,limitTags:c,limitTagsForMobile:k,limitCards:g,limitCardsForMobile:f,className:_,numberOfTags:i==null?void 0:i.length,children:[e.jsxs("div",{className:"wrapper__heading",children:[t&&e.jsx("div",{className:"wrapper__title",children:t}),s&&e.jsx("div",{className:"wrapper__subtitle",children:s})]}),e.jsx(T,{isLoading:$,keyPrefix:"field-of-interests-masonry-tag",children:e.jsx("div",{className:"wrapper__tags__external",children:e.jsx("div",{className:"wrapper__tags",children:i==null?void 0:i.map((r,p)=>e.jsx(P,{icon:r==null?void 0:r.icon,text:r==null?void 0:r.title,isActive:(r==null?void 0:r.code)===b,onSelectCard:()=>m==null?void 0:m(r)},`field-of-interests-masonry-tag__${p+1}`))})})}),e.jsx("div",{className:"wrapper__cards",children:o==null?void 0:o.map((r,p)=>e.jsx(R,{image:r==null?void 0:r.image,imageComponent:r==null?void 0:r.imageComponent,title:r==null?void 0:r.title,description:r==null?void 0:r.description,onSelectCard:()=>h==null?void 0:h(r),className:"wrapper__card",link:r==null?void 0:r.link,LinkComponent:I},`field-of-interests-with-tags-card__${p+1}`))})]})));module.exports=B;

package/dist/FieldOfInterestsMasonrySection.js

@@ -1,12 +1,12 @@
-import { jsxs as o, jsx as r, Fragment as z } from "react/jsx-runtime";
-import { forwardRef as S, Suspense as E, useLayoutEffect as j } from "react";
-import { m as N, l as q, k as T } from "./utils-DtEfC-TX.js";
-import A from "./Icon.js";
+import { jsxs as o, jsx as r, Fragment as O } from "react/jsx-runtime";
+import { forwardRef as M, Suspense as G, useLayoutEffect as R } from "react";
+import { m as z, l as W, k as q } from "./utils-DtEfC-TX.js";
+import T from "./Icon.js";
 import { s as b } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as $ } from "./consts-BuFChS64.js";
-import { u as B } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-import { S as D, b as _, d as g, a as p } from "./style-BwQ4djFC.js";
-const H = b.a`
+import { u as j } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import { S as A, b as f, d as _, a as g } from "./style-BwQ4djFC.js";
+const B = b.a`
   text-decoration: none;
   color: var(--gray-950);
   display: flex;
@@ -47,7 +47,7 @@ const H = b.a`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${N(2)}
+      ${z(2)}
     }
 
     & .wrapper__description {
@@ -57,7 +57,7 @@ const H = b.a`
       font-weight: 400;
       line-height: 1rem;
       letter-spacing: 0.025rem;
-      ${N(2)}
+      ${z(2)}
     }
   }
 
@@ -73,7 +73,7 @@ const H = b.a`
       }
     }
   }
-`, X = b.div`
+`, D = b.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -114,7 +114,7 @@ const H = b.a`
     font-weight: 400;
     line-height: 1.5rem;
     max-width: 8rem;
-    ${N(2)}
+    ${z(2)}
   }
 
   &.active {
@@ -164,53 +164,53 @@ const H = b.a`
       max-width: unset;
     }
   }
-`, Z = S(
-  ({ text: t, isActive: l = !1, icon: i, onSelectCard: n = () => {
-  } }, h) => /* @__PURE__ */ o(
-    X,
+`, H = M(
+  ({ text: t, isActive: l = !1, icon: i, onSelectCard: a = () => {
+  } }, d) => /* @__PURE__ */ o(
+    D,
     {
-      ref: h,
+      ref: d,
       className: l ? "active" : "",
-      onClick: n,
+      onClick: a,
       children: [
-        /* @__PURE__ */ r(A, { icon: i, className: "wrapper__icon" }),
+        /* @__PURE__ */ r(T, { icon: i, className: "wrapper__icon" }),
         /* @__PURE__ */ r("div", { className: "wrapper__text", children: t })
       ]
     }
   )
-), J = S(
+), X = M(
   ({
     image: t,
     imageComponent: l,
     title: i,
-    description: n,
-    className: h,
+    description: a,
+    className: d,
     onSelectCard: k = () => {
     },
     link: u,
     LinkComponent: x
   }, I) => {
-    const c = x || "a", { theme: f } = B();
+    const h = x || "a", { theme: c } = j();
     return /* @__PURE__ */ o(
-      H,
+      B,
       {
         ref: I,
-        theme: f,
-        className: h,
+        theme: c,
+        className: d,
         onClick: k,
-        as: c,
+        as: h,
         ...x ? { to: `/${u}` } : { href: `/${u}` },
         children: [
-          q(l) ? l : /* @__PURE__ */ r("img", { src: t, className: "wrapper__image" }),
+          W(l) ? l : /* @__PURE__ */ r("img", { src: t, className: "wrapper__image" }),
           /* @__PURE__ */ o("div", { className: "wrapper__content", children: [
             i && /* @__PURE__ */ r("div", { className: "wrapper__title", children: i }),
-            n && /* @__PURE__ */ r("div", { className: "wrapper__description", children: n })
+            a && /* @__PURE__ */ r("div", { className: "wrapper__description", children: a })
           ] })
         ]
       }
     );
   }
-), K = b.div`
+), Z = b.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -248,6 +248,7 @@ const H = b.a`
 
   & .wrapper__tags {
     display: flex;
+    flex-wrap: wrap;
     justify-content: center;
     gap: 0.75rem;
   }
@@ -268,31 +269,11 @@ const H = b.a`
   @media (max-width: ${$ + "px"}) {
     gap: 1rem;
 
-    & .wrapper__tags {
-      overflow-x: scroll;
-      justify-content: flex-start;
-      width: 100%;
-
-      -webkit-overflow-scrolling: touch;
-      ::-webkit-scrollbar {
-        -webkit-appearance: none;
-      }
-      -ms-overflow-style: none;
-      /* Internet Explorer 10+ */
-      scrollbar-width: none;
-      /* Firefox */
-
-      &::-webkit-scrollbar {
-        display: none;
-        /* Safari and Chrome */
-      }
-    }
-
     & .wrapper__cards {
       grid-template-columns: ${(t) => `repeat(${t == null ? void 0 : t.limitCardsForMobile}, minmax(0, 1fr))`};
     }
   }
-`, F = b(D)`
+`, J = b(A)`
   &.skeleton__tags {
     max-width: 50rem;
   }
@@ -302,132 +283,123 @@ const H = b.a`
       overflow-x: hidden;
     }
   }
-`, Q = ({ keyPrefix: t }) => /* @__PURE__ */ o(F, { className: "skeleton__tags", children: [
+`, K = ({ keyPrefix: t }) => /* @__PURE__ */ o(J, { className: "skeleton__tags", children: [
   /* @__PURE__ */ o(
-    _,
+    f,
     {
       alignItems: "center",
       gap: "0.5rem",
       children: [
-        /* @__PURE__ */ r(g, { width: "2.75rem", height: "2.75rem" }),
-        /* @__PURE__ */ r(p, { height: "1.5rem", width: "8rem" })
+        /* @__PURE__ */ r(_, { width: "2.75rem", height: "2.75rem" }),
+        /* @__PURE__ */ r(g, { height: "1.5rem", width: "8rem" })
       ]
     },
     `${t}-1`
   ),
   /* @__PURE__ */ o(
-    _,
+    f,
     {
       alignItems: "center",
       gap: "0.5rem",
       noGradient: !0,
       children: [
-        /* @__PURE__ */ r(g, { width: "2.75rem", height: "2.75rem" }),
-        /* @__PURE__ */ r(p, { height: "1.5rem", width: "8rem" })
+        /* @__PURE__ */ r(_, { width: "2.75rem", height: "2.75rem" }),
+        /* @__PURE__ */ r(g, { height: "1.5rem", width: "8rem" })
       ]
     },
     `${t}-2`
   ),
   /* @__PURE__ */ o(
-    _,
+    f,
     {
       alignItems: "center",
       gap: "0.5rem",
       noGradient: !0,
       children: [
-        /* @__PURE__ */ r(g, { width: "2.75rem", height: "2.75rem" }),
-        /* @__PURE__ */ r(p, { height: "1.5rem", width: "8rem" })
+        /* @__PURE__ */ r(_, { width: "2.75rem", height: "2.75rem" }),
+        /* @__PURE__ */ r(g, { height: "1.5rem", width: "8rem" })
       ]
     },
     `${t}-3`
   ),
   /* @__PURE__ */ o(
-    _,
+    f,
     {
       alignItems: "center",
       gap: "0.5rem",
       noGradient: !0,
       children: [
-        /* @__PURE__ */ r(g, { width: "2.75rem", height: "2.75rem" }),
-        /* @__PURE__ */ r(p, { height: "1.5rem", width: "8rem" })
+        /* @__PURE__ */ r(_, { width: "2.75rem", height: "2.75rem" }),
+        /* @__PURE__ */ r(g, { height: "1.5rem", width: "8rem" })
       ]
     },
     `${t}-4`
   ),
   /* @__PURE__ */ o(
-    _,
+    f,
     {
       alignItems: "center",
       gap: "0.5rem",
       noGradient: !0,
       children: [
-        /* @__PURE__ */ r(g, { width: "2.75rem", height: "2.75rem" }),
-        /* @__PURE__ */ r(p, { height: "1.5rem", width: "8rem" })
+        /* @__PURE__ */ r(_, { width: "2.75rem", height: "2.75rem" }),
+        /* @__PURE__ */ r(g, { height: "1.5rem", width: "8rem" })
       ]
     },
     `${t}-5`
   )
-] }), U = ({
+] }), P = ({
   keyPrefix: t,
   isLoading: l = !1,
-  fallbackComponent: i = /* @__PURE__ */ r(z, {}),
-  children: n
-}) => /* @__PURE__ */ r(E, { fallbackComponent: i, children: l === !0 ? /* @__PURE__ */ r(Q, { keyPrefix: t }) : n }), V = ({ keyPrefix: t }) => /* @__PURE__ */ o(F, { className: "skeleton__cards", children: [
-  /* @__PURE__ */ r(p, { height: "13.75rem" }, `${t}-1`),
-  /* @__PURE__ */ r(p, { height: "13.75rem" }, `${t}-2`),
-  /* @__PURE__ */ r(p, { height: "13.75rem" }, `${t}-3`)
-] }), Y = ({
-  keyPrefix: t,
-  isLoading: l = !1,
-  fallbackComponent: i = /* @__PURE__ */ r(z, {}),
-  children: n
-}) => /* @__PURE__ */ r(E, { fallbackComponent: i, children: l === !0 ? /* @__PURE__ */ r(V, { keyPrefix: t }) : n }), le = S(
+  fallbackComponent: i = /* @__PURE__ */ r(O, {}),
+  children: a
+}) => /* @__PURE__ */ r(G, { fallbackComponent: i, children: l === !0 ? /* @__PURE__ */ r(K, { keyPrefix: t }) : a }), ne = M(
   ({
     title: t,
     subtitle: l,
     tags: i = [],
-    items: n = [],
-    limitTags: h = 5,
+    items: a = [],
+    limitTags: d = 5,
     limitTagsForMobile: k = 5,
     limit: u = 3,
     limitForMobile: x = 2,
     selectedTag: I,
-    onSelectTag: c = () => {
+    onSelectTag: h = () => {
     },
-    onSelectCard: f = () => {
+    onSelectCard: c = () => {
     },
     className: w,
-    isLoadingTags: O = !1,
-    isLoadingCards: C = !1,
-    LinkComponent: L
-  }, G) => (j(() => {
-    if (!T(w))
+    isLoadingTags: C = !1,
+    // isLoadingCards = false,
+    LinkComponent: E
+  }, S) => (R(() => {
+    if (!q(w))
       return;
     const e = () => {
       const m = document == null ? void 0 : document.querySelector(`.${w} .wrapper__cards`), s = m == null ? void 0 : m.querySelectorAll(".wrapper__card");
-      s == null || s.forEach((v) => {
-        const R = v.getBoundingClientRect().height, W = Math.ceil((R + 10) / 20);
-        v.style.gridRowEnd = `span ${W}`;
+      s == null || s.forEach((y) => {
+        const F = y.getBoundingClientRect().height, L = Math.ceil((F + 10) / 20);
+        y.style.gridRowEnd = `span ${L}`;
       });
-      const M = s == null ? void 0 : s[(s == null ? void 0 : s.length) - 1];
-      if (M) {
-        const v = M.offsetTop + M.offsetHeight;
-        m.style.height = `${v}px`;
+      const N = s == null ? void 0 : s[(s == null ? void 0 : s.length) - 1];
+      if (N) {
+        const y = N.offsetTop + N.offsetHeight;
+        m.style.height = `${y}px`;
       }
-    }, d = document == null ? void 0 : document.querySelector(`.${w} .wrapper__cards`), a = d == null ? void 0 : d.querySelectorAll(".wrapper__image");
-    let y = 0;
-    return (a == null ? void 0 : a.length) === 0 ? e() : (a == null || a.forEach((m) => {
-      m.complete ? y++ : m.addEventListener("load", () => {
-        y++, y === (a == null ? void 0 : a.length) && e();
+    }, p = document == null ? void 0 : document.querySelector(`.${w} .wrapper__cards`), n = p == null ? void 0 : p.querySelectorAll(".wrapper__image");
+    let v = 0;
+    return (n == null ? void 0 : n.length) === 0 ? e() : (n == null || n.forEach((m) => {
+      m.complete ? v++ : m.addEventListener("load", () => {
+        v++, v === (n == null ? void 0 : n.length) && e();
       });
-    }), y === (a == null ? void 0 : a.length) && e()), window.addEventListener("resize", e), () => {
+    }), v === (n == null ? void 0 : n.length) && e()), window.addEventListener("resize", e), () => {
       window.removeEventListener("resize", e);
     };
-  }, [w, n, C]), /* @__PURE__ */ o(
-    K,
+  }, [w, a]), /* @__PURE__ */ o(
+    Z,
     {
-      ref: G,
-      limitTags: h,
+      ref: S,
+      limitTags: d,
       limitTagsForMobile: k,
       limitCards: u,
       limitCardsForMobile: x,
@@ -439,47 +411,40 @@ const H = b.a`
           l && /* @__PURE__ */ r("div", { className: "wrapper__subtitle", children: l })
         ] }),
         /* @__PURE__ */ r(
-          U,
+          P,
           {
-            isLoading: O,
+            isLoading: C,
             keyPrefix: "field-of-interests-masonry-tag",
-            children: /* @__PURE__ */ r("div", { className: "wrapper__tags__external", children: /* @__PURE__ */ r("div", { className: "wrapper__tags", children: i == null ? void 0 : i.map((e, d) => /* @__PURE__ */ r(
-              Z,
+            children: /* @__PURE__ */ r("div", { className: "wrapper__tags__external", children: /* @__PURE__ */ r("div", { className: "wrapper__tags", children: i == null ? void 0 : i.map((e, p) => /* @__PURE__ */ r(
+              H,
               {
                 icon: e == null ? void 0 : e.icon,
                 text: e == null ? void 0 : e.title,
                 isActive: (e == null ? void 0 : e.code) === I,
-                onSelectCard: () => c == null ? void 0 : c(e)
+                onSelectCard: () => h == null ? void 0 : h(e)
               },
-              `field-of-interests-masonry-tag__${d + 1}`
+              `field-of-interests-masonry-tag__${p + 1}`
             )) }) })
           }
         ),
-        /* @__PURE__ */ r(
-          Y,
+        /* @__PURE__ */ r("div", { className: "wrapper__cards", children: a == null ? void 0 : a.map((e, p) => /* @__PURE__ */ r(
+          X,
           {
-            isLoading: C,
-            keyPrefix: "field-of-interests-masonry-card",
-            children: /* @__PURE__ */ r("div", { className: "wrapper__cards", children: n == null ? void 0 : n.map((e, d) => /* @__PURE__ */ r(
-              J,
-              {
-                image: e == null ? void 0 : e.image,
-                imageComponent: e == null ? void 0 : e.imageComponent,
-                title: e == null ? void 0 : e.title,
-                description: e == null ? void 0 : e.description,
-                onSelectCard: () => f == null ? void 0 : f(e),
-                className: "wrapper__card",
-                link: e == null ? void 0 : e.link,
-                LinkComponent: L
-              },
-              `field-of-interests-with-tags-card__${d + 1}`
-            )) })
-          }
-        )
+            image: e == null ? void 0 : e.image,
+            imageComponent: e == null ? void 0 : e.imageComponent,
+            title: e == null ? void 0 : e.title,
+            description: e == null ? void 0 : e.description,
+            onSelectCard: () => c == null ? void 0 : c(e),
+            className: "wrapper__card",
+            link: e == null ? void 0 : e.link,
+            LinkComponent: E
+          },
+          `field-of-interests-with-tags-card__${p + 1}`
+        )) })
       ]
     }
   ))
 );
 export {
-  le as default
+  ne as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lanaco/lnc-react-ui",
-  "version": "4.0.204",
+  "version": "4.0.206",
   "description": "React component library",
   "type": "module",
   "keywords": [