@lanaco/lnc-react-ui 4.0.130 → 4.0.132

package/dist/BlogListSection.js

@@ -1,14 +1,14 @@
-import { jsxs as a, jsx as t } from "react/jsx-runtime";
-import { forwardRef as v, memo as j, useMemo as I } from "react";
-import w from "./Icon.js";
-import d from "./IconButton.js";
-import P from "./Chip.js";
-import { p as R, s as C, v as z, w as y } from "./utils-BPdU4_1q.js";
-import { P as T } from "./index-3TFXgZHA.js";
-import { s as k } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as $ } from "./consts-BuFChS64.js";
-import { S as L } from "./suspense-large-DrD8xVZi.js";
-const B = k.div`
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import { forwardRef as h, memo as v, useMemo as k } from "react";
+import u from "./Icon.js";
+import c from "./IconButton.js";
+import { p as N, s as I, v as R, w as b } from "./utils-BPdU4_1q.js";
+import { P as j } from "./index-3TFXgZHA.js";
+import { B as P } from "./style-XXDQBreL.js";
+import { s as w } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as T } from "./consts-BuFChS64.js";
+import { S as $ } from "./suspense-large-DrD8xVZi.js";
+const z = w.div`
   display: flex;
   padding: 1rem;
   align-items: center;
@@ -59,27 +59,13 @@ const B = k.div`
         font-weight: 600;
         line-height: 1.5rem;
         letter-spacing: 0.1px;
-        ${R(3)}
+        ${N(3)}
       }
 
       & .wrapper__tags {
         display: flex;
         flex-wrap: wrap;
         gap: 0.25rem;
-
-        & .wrapper__tag {
-          font-size: 0.75rem;
-          font-style: normal;
-          font-weight: 500;
-          line-height: 1rem;
-          letter-spacing: 0.5px;
-          padding: 0.125rem 0.5rem;
-          justify-content: center;
-          align-items: center;
-          gap: 0.25rem;
-          height: 1.25rem;
-          border: 1px solid;
-        }
       }
     }
 
@@ -116,7 +102,7 @@ const B = k.div`
     }
   }
 
-  @media (max-width: ${$ + "px"}) {
+  @media (max-width: ${T + "px"}) {
     flex-direction: column;
     padding: 0;
     background: transparent;
@@ -166,48 +152,42 @@ const B = k.div`
       }
     }
   }
-`, M = v(
+`, B = h(
   ({
     title: p,
     imageUrl: n,
-    options: i,
-    publishedAt: l,
-    timeToReadText: o = "{0} min read",
-    timeToRead: s = 0,
-    numberOfLikes: g = 0,
+    options: a,
+    publishedAt: o,
+    timeToReadText: l = "{0} min read",
+    timeToRead: d = 0,
+    numberOfLikes: m = 0,
     numberOfComments: f = 0,
-    isBookmarked: c = !1,
-    onSelectCard: b = () => {
-    },
-    onSelectOption: _ = () => {
+    isBookmarked: g = !1,
+    onSelectCard: _ = () => {
     },
     onBookmark: e = () => {
     },
-    onShare: m = () => {
+    onShare: s = () => {
     }
-  }, h) => /* @__PURE__ */ a(B, { onClick: b, className: "blog-card-item", children: [
-    /* @__PURE__ */ t(T, { src: n, className: "wrapper__image" }),
-    /* @__PURE__ */ a("div", { className: "wrapper__content", children: [
-      /* @__PURE__ */ a("div", { className: "wrapper__subcontent", children: [
+  }, O) => /* @__PURE__ */ i(z, { onClick: _, className: "blog-card-item", children: [
+    /* @__PURE__ */ t(j, { src: n, className: "wrapper__image" }),
+    /* @__PURE__ */ i("div", { className: "wrapper__content", children: [
+      /* @__PURE__ */ i("div", { className: "wrapper__subcontent", children: [
         /* @__PURE__ */ t("div", { className: "wrapper__title", children: p }),
-        /* @__PURE__ */ a("div", { className: "wrapper__tags-action", children: [
-          /* @__PURE__ */ t("div", { className: "wrapper__tags", children: i && (i == null ? void 0 : i.map((r, N) => /* @__PURE__ */ t(
+        /* @__PURE__ */ i("div", { className: "wrapper__tags-action", children: [
+          /* @__PURE__ */ t("div", { className: "wrapper__tags", children: a && (a == null ? void 0 : a.map((r, y) => /* @__PURE__ */ t(
             P,
             {
-              label: r == null ? void 0 : r.name,
               color: r == null ? void 0 : r.color,
-              className: "wrapper__tag",
-              onClick: (u) => {
-                u == null || u.stopPropagation(), _(r == null ? void 0 : r.code);
-              }
+              children: r == null ? void 0 : r.name
             },
-            `blog-card-sponsored-option__${N + 1}`
+            `blog-card-sponsored-option__${y + 1}`
           ))) }),
-          /* @__PURE__ */ a("div", { className: "info__content mobile-only", children: [
+          /* @__PURE__ */ i("div", { className: "info__content mobile-only", children: [
             /* @__PURE__ */ t(
-              d,
+              c,
               {
-                icon: c ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
+                icon: g ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
                 borderRadius: "curved",
                 btnType: "basic",
                 color: "neutral",
@@ -217,41 +197,41 @@ const B = k.div`
               }
             ),
             /* @__PURE__ */ t(
-              d,
+              c,
               {
                 icon: " mng-lnc-share",
                 borderRadius: "curved",
                 btnType: "basic",
                 color: "neutral",
                 onClick: (r) => {
-                  r == null || r.stopPropagation(), m();
+                  r == null || r.stopPropagation(), s();
                 }
               }
             )
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ a("div", { className: "wrapper__info", children: [
-        /* @__PURE__ */ a("div", { className: "info__content", children: [
-          /* @__PURE__ */ t("div", { className: "info__text", children: `${C(
-            l
-          )} • ${z(o, s)}` }),
-          /* @__PURE__ */ a("div", { className: "info__text", children: [
-            /* @__PURE__ */ a("div", { children: [
-              /* @__PURE__ */ t(w, { icon: " mng-lnc-thumbs-up--filled", sizeInUnits: "1rem" }),
-              y(g)
+      /* @__PURE__ */ i("div", { className: "wrapper__info", children: [
+        /* @__PURE__ */ i("div", { className: "info__content", children: [
+          /* @__PURE__ */ t("div", { className: "info__text", children: `${I(
+            o
+          )} • ${R(l, d)}` }),
+          /* @__PURE__ */ i("div", { className: "info__text", children: [
+            /* @__PURE__ */ i("div", { children: [
+              /* @__PURE__ */ t(u, { icon: " mng-lnc-thumbs-up--filled", sizeInUnits: "1rem" }),
+              b(m)
             ] }),
-            /* @__PURE__ */ a("div", { children: [
-              /* @__PURE__ */ t(w, { icon: " mng-lnc-messages-filled", sizeInUnits: "1rem" }),
-              y(f)
+            /* @__PURE__ */ i("div", { children: [
+              /* @__PURE__ */ t(u, { icon: " mng-lnc-messages-filled", sizeInUnits: "1rem" }),
+              b(f)
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ a("div", { className: "info__content desktop-only", children: [
+        /* @__PURE__ */ i("div", { className: "info__content desktop-only", children: [
           /* @__PURE__ */ t(
-            d,
+            c,
             {
-              icon: c ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
+              icon: g ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
               borderRadius: "curved",
               btnType: "basic",
               color: "neutral",
@@ -261,14 +241,14 @@ const B = k.div`
             }
           ),
           /* @__PURE__ */ t(
-            d,
+            c,
             {
               icon: " mng-lnc-share",
               borderRadius: "curved",
               btnType: "basic",
               color: "neutral",
               onClick: (r) => {
-                r == null || r.stopPropagation(), m();
+                r == null || r.stopPropagation(), s();
               }
             }
           )
@@ -276,7 +256,7 @@ const B = k.div`
       ] })
     ] })
   ] })
-), U = k.div`
+), C = w.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -300,25 +280,23 @@ const B = k.div`
       bottom: -1.25rem;
     }
   }
-`, W = j(M), J = v(
+`, L = v(B), F = h(
   ({
     timeToReadText: p = "{0} min read",
     items: n,
-    onSelectCard: i = () => {
-    },
-    onSelectOption: l = () => {
+    onSelectCard: a = () => {
     },
     onShare: o = () => {
     },
-    onBookmark: s = () => {
+    onBookmark: l = () => {
     },
-    isLoading: g = !1,
-    getImage: f = () => {
+    isLoading: d = !1,
+    getImage: m = () => {
     },
-    isSeparated: c = !0
-  }, b) => {
-    const _ = I(() => n == null ? void 0 : n.map((e, m) => /* @__PURE__ */ t(
-      W,
+    isSeparated: f = !0
+  }, g) => {
+    const _ = k(() => n == null ? void 0 : n.map((e, s) => /* @__PURE__ */ t(
+      L,
       {
         title: e == null ? void 0 : e.title,
         titleSlug: e == null ? void 0 : e.titleSlug,
@@ -330,18 +308,17 @@ const B = k.div`
         numberOfComments: e == null ? void 0 : e.numberOfComments,
         isSponsored: e == null ? void 0 : e.isSponsored,
         isBookmarked: e == null ? void 0 : e.isBookmarked,
-        onSelectCard: () => i == null ? void 0 : i(e),
-        onSelectOption: (h) => l == null ? void 0 : l(h),
+        onSelectCard: () => a == null ? void 0 : a(e),
         onShare: () => o == null ? void 0 : o(e),
-        onBookmark: () => s == null ? void 0 : s(e),
-        imageUrl: f(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null
+        onBookmark: () => l == null ? void 0 : l(e),
+        imageUrl: m(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null
       },
-      `blog-card-item__${m + 1}`
+      `blog-card-item__${s + 1}`
     )), [n]);
-    return /* @__PURE__ */ t(U, { className: c ? "separated" : "", children: /* @__PURE__ */ t(
-      L,
+    return /* @__PURE__ */ t(C, { className: f ? "separated" : "", children: /* @__PURE__ */ t(
+      $,
       {
-        isLoading: g,
+        isLoading: d,
         limit: 5,
         keyPrefix: "blog-section",
         children: _
@@ -350,5 +327,5 @@ const B = k.div`
   }
 );
 export {
-  J as default
+  F as default
 };

package/dist/BlogSingleSection.js

@@ -1,6 +1,6 @@
 import { jsx as e, Fragment as a } from "react/jsx-runtime";
 import { Suspense as s, forwardRef as u } from "react";
-import { B as d } from "./index-EE-IJbC3.js";
+import { B as d } from "./index-DJ545v7b.js";
 import { B as c } from "./skeleton-PMiYQLOs.js";
 const f = ({ limit: o = 1, isLoading: t = !1, keyPrefix: l }) => /* @__PURE__ */ e(a, { children: Array.from({ length: o }, (r, n) => /* @__PURE__ */ e(
   c,

package/dist/BlogsSectionDetailed.cjs

@@ -16,7 +16,6 @@
   border-radius: 0.75rem;
   border: 1px solid var(--gray-95008, #14161a14);
   overflow: hidden;
-  max-height: 21.5625rem;
   min-height: 21.5625rem;
   cursor: pointer;
   &:hover {
@@ -39,6 +38,7 @@
   & .tags-wr {
     margin-top: auto;
     display: flex;
+    flex-wrap: wrap;
 
     gap: 0.5rem;
     padding: 0 1rem 1rem 1rem;
@@ -47,9 +47,6 @@
   @media (max-width: ${k.MOBILE_SIZE_PX+"px"}) {
     max-height: 100%;
     min-height: 100%;
-    & .tags-wr {
-      flex-wrap: wrap;
-    }
   }
 `,S=w.styled.div`
   padding: 1rem 1rem 0 1rem;
@@ -110,4 +107,4 @@
     align-items: center;
     gap: 1rem;
   }
-`,$=u.forwardRef((i,a)=>{const{title:s,imageUrl:m,text:o,numberOfLikes:n,numberOfComments:h,timeToRead:p,publishedAt:c,tags:d,onCardClick:j,timeToReadText:f="{0} min read"}=i;return t.jsxs(v,{ref:a,className:"blog-card",onClick:j,children:[t.jsx(O.ProductImageWrapper,{src:m}),t.jsxs(S,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[r.formatLocaleDateString(c)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),p&&f?`${r.formatString(f,p)}`:"N/A"]}),t.jsxs("div",{className:"info-wr-2",children:[t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-thumbs-up--filled"}),t.jsx("span",{children:r.getRoundedNumber(n)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:r.getRoundedNumber(h)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:s}),t.jsx("div",{className:"text-wr",children:o})]}),t.jsx("div",{className:"tags-wr",children:d==null?void 0:d.map((l,b)=>t.jsx(y.BlogTag,{color:l==null?void 0:l.color,children:l==null?void 0:l.name},b))})]})}),D=u.forwardRef(({},i)=>t.jsxs(v,{className:"blog-card",children:[t.jsx("div",{className:"skeleton-img"}),t.jsxs(S,{children:[t.jsx("div",{className:"info-wr"}),t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"info-wr-skeleton"})]})]})),q=({limit:i=3,isLoading:a=!1,keyPrefix:s})=>t.jsx(t.Fragment,{children:Array.from({length:i},(m,o)=>t.jsx(D,{isLoading:a},`${s}-skeleton-product-card-${o}`))}),B=({children:i,fallbackComponent:a=t.jsx(t.Fragment,{}),isLoading:s=!1,limit:m,keyPrefix:o})=>t.jsx(u.Suspense,{fallbackComponent:a,children:s===!0?t.jsx(q,{isLoading:s,limit:m,keyPrefix:o}):i}),N=u.memo($),L=u.forwardRef((i,a)=>{const{icon:s,title:m,onButtonAction:o,items:n,buttonText:h,timeToReadText:p,limit:c=3,onSelectCard:d=()=>{},isLoading:j=!1,buttonLink:f,getImage:l=()=>{}}=i,b=R.useDetectMobile(),C=u.useMemo(()=>t.jsx(t.Fragment,{children:b===!0?n==null?void 0:n.map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,tags:e==null?void 0:e.tags,onCardClick:()=>d(e==null?void 0:e.titleSlug),imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},g)):n==null?void 0:n.slice(0,c).map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,imageUrl:l(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,tags:e==null?void 0:e.tags,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,onCardClick:()=>d(e==null?void 0:e.titleSlug)},g))}),[n,b,c,d]);return t.jsxs(y.RegulatTitleSectionWrapper,{ref:a,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[r.isDefinedNotEmptyString(s)&&t.jsx("i",{className:s}),t.jsx("span",{children:m})]}),r.isDefinedNotEmptyString(h)&&r.isDefinedNotEmptyString(f)&&t.jsx(T,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var g;(g=e==null?void 0:e.target)==null||g.blur(),o(f)},borderRadius:"curved",className:"button-link",children:h})]}),t.jsx(A,{limit:c,children:t.jsx(B,{isLoading:j,limit:c,keyPrefix:"explore-landing",children:C})})]})});module.exports=L;
+`,$=u.forwardRef((i,o)=>{const{title:s,imageUrl:m,text:d,numberOfLikes:n,numberOfComments:h,timeToRead:p,publishedAt:c,tags:a,onCardClick:j,timeToReadText:f="{0} min read"}=i;return t.jsxs(v,{ref:o,className:"blog-card",onClick:j,children:[t.jsx(O.ProductImageWrapper,{src:m}),t.jsxs(S,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[r.formatLocaleDateString(c)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),p&&f?`${r.formatString(f,p)}`:"N/A"]}),t.jsxs("div",{className:"info-wr-2",children:[t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-thumbs-up--filled"}),t.jsx("span",{children:r.getRoundedNumber(n)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:r.getRoundedNumber(h)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:s}),t.jsx("div",{className:"text-wr",children:d})]}),a&&t.jsx("div",{className:"tags-wr",children:a==null?void 0:a.map((l,b)=>t.jsx(y.BlogTag,{color:l==null?void 0:l.color,children:l==null?void 0:l.name},b))})]})}),D=u.forwardRef(({},i)=>t.jsxs(v,{className:"blog-card",children:[t.jsx("div",{className:"skeleton-img"}),t.jsxs(S,{children:[t.jsx("div",{className:"info-wr"}),t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"info-wr-skeleton"})]})]})),q=({limit:i=3,isLoading:o=!1,keyPrefix:s})=>t.jsx(t.Fragment,{children:Array.from({length:i},(m,d)=>t.jsx(D,{isLoading:o},`${s}-skeleton-product-card-${d}`))}),B=({children:i,fallbackComponent:o=t.jsx(t.Fragment,{}),isLoading:s=!1,limit:m,keyPrefix:d})=>t.jsx(u.Suspense,{fallbackComponent:o,children:s===!0?t.jsx(q,{isLoading:s,limit:m,keyPrefix:d}):i}),N=u.memo($),L=u.forwardRef((i,o)=>{const{icon:s,title:m,onButtonAction:d,items:n,buttonText:h,timeToReadText:p,limit:c=3,onSelectCard:a=()=>{},isLoading:j=!1,buttonLink:f,getImage:l=()=>{}}=i,b=R.useDetectMobile(),C=u.useMemo(()=>t.jsx(t.Fragment,{children:b===!0?n==null?void 0:n.map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,tags:e==null?void 0:e.tags,onCardClick:()=>a(e==null?void 0:e.titleSlug),imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},g)):n==null?void 0:n.slice(0,c).map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,imageUrl:l(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,tags:e==null?void 0:e.tags,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,onCardClick:()=>a(e==null?void 0:e.titleSlug)},g))}),[n,b,c,a]);return t.jsxs(y.RegulatTitleSectionWrapper,{ref:o,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[r.isDefinedNotEmptyString(s)&&t.jsx("i",{className:s}),t.jsx("span",{children:m})]}),r.isDefinedNotEmptyString(h)&&r.isDefinedNotEmptyString(f)&&t.jsx(T,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var g;(g=e==null?void 0:e.target)==null||g.blur(),d(f)},borderRadius:"curved",className:"button-link",children:h})]}),t.jsx(A,{limit:c,children:t.jsx(B,{isLoading:j,limit:c,keyPrefix:"explore-landing",children:C})})]})});module.exports=L;

package/dist/BlogsSectionDetailed.js

@@ -25,7 +25,6 @@ const E = y.div`
   border-radius: 0.75rem;
   border: 1px solid var(--gray-95008, #14161a14);
   overflow: hidden;
-  max-height: 21.5625rem;
   min-height: 21.5625rem;
   cursor: pointer;
   &:hover {
@@ -48,6 +47,7 @@ const E = y.div`
   & .tags-wr {
     margin-top: auto;
     display: flex;
+    flex-wrap: wrap;
 
     gap: 0.5rem;
     padding: 0 1rem 1rem 1rem;
@@ -56,9 +56,6 @@ const E = y.div`
   @media (max-width: ${T + "px"}) {
     max-height: 100%;
     min-height: 100%;
-    & .tags-wr {
-      flex-wrap: wrap;
-    }
   }
 `, O = y.div`
   padding: 1rem 1rem 0 1rem;
@@ -119,22 +116,22 @@ const E = y.div`
     align-items: center;
     gap: 1rem;
   }
-`, _ = N((i, o) => {
+`, _ = N((i, s) => {
   const {
     title: a,
     imageUrl: d,
-    text: s,
+    text: m,
     numberOfLikes: l,
     numberOfComments: f,
     timeToRead: p,
     publishedAt: c,
-    tags: m,
+    tags: o,
     onCardClick: b,
     timeToReadText: u = "{0} min read"
   } = i;
   return (
     // <BlogCardDetailedSkeleton />
-    /* @__PURE__ */ t(R, { ref: o, className: "blog-card", onClick: b, children: [
+    /* @__PURE__ */ t(R, { ref: s, className: "blog-card", onClick: b, children: [
       /* @__PURE__ */ r(j, { src: d }),
       /* @__PURE__ */ t(O, { children: [
         /* @__PURE__ */ t("div", { className: "info-wr", children: [
@@ -158,9 +155,9 @@ const E = y.div`
           ] })
         ] }),
         /* @__PURE__ */ r("div", { className: "text-wr-title", children: a }),
-        /* @__PURE__ */ r("div", { className: "text-wr", children: s })
+        /* @__PURE__ */ r("div", { className: "text-wr", children: m })
       ] }),
-      /* @__PURE__ */ r("div", { className: "tags-wr", children: m == null ? void 0 : m.map((n, h) => /* @__PURE__ */ r(I, { color: n == null ? void 0 : n.color, children: n == null ? void 0 : n.name }, h)) })
+      o && /* @__PURE__ */ r("div", { className: "tags-wr", children: o == null ? void 0 : o.map((n, h) => /* @__PURE__ */ r(I, { color: n == null ? void 0 : n.color, children: n == null ? void 0 : n.name }, h)) })
     ] })
   );
 }), G = N(({}, i) => /* @__PURE__ */ t(R, { className: "blog-card", children: [
@@ -170,35 +167,35 @@ const E = y.div`
     /* @__PURE__ */ r("div", { className: "skeleton-title" }),
     /* @__PURE__ */ r("div", { className: "info-wr-skeleton" })
   ] })
-] })), F = ({ limit: i = 3, isLoading: o = !1, keyPrefix: a }) => /* @__PURE__ */ r(v, { children: Array.from({ length: i }, (d, s) => /* @__PURE__ */ r(
+] })), F = ({ limit: i = 3, isLoading: s = !1, keyPrefix: a }) => /* @__PURE__ */ r(v, { children: Array.from({ length: i }, (d, m) => /* @__PURE__ */ r(
   G,
   {
-    isLoading: o
+    isLoading: s
   },
-  `${a}-skeleton-product-card-${s}`
+  `${a}-skeleton-product-card-${m}`
 )) }), X = ({
   children: i,
-  fallbackComponent: o = /* @__PURE__ */ r(v, {}),
+  fallbackComponent: s = /* @__PURE__ */ r(v, {}),
   isLoading: a = !1,
   limit: d,
-  keyPrefix: s
-}) => /* @__PURE__ */ r(A, { fallbackComponent: o, children: a === !0 ? /* @__PURE__ */ r(
+  keyPrefix: m
+}) => /* @__PURE__ */ r(A, { fallbackComponent: s, children: a === !0 ? /* @__PURE__ */ r(
   F,
   {
     isLoading: a,
     limit: d,
-    keyPrefix: s
+    keyPrefix: m
   }
-) : i }), S = B(_), ee = N((i, o) => {
+) : i }), S = B(_), ee = N((i, s) => {
   const {
     icon: a,
     title: d,
-    onButtonAction: s,
+    onButtonAction: m,
     items: l,
     buttonText: f,
     timeToReadText: p,
     limit: c = 3,
-    onSelectCard: m = () => {
+    onSelectCard: o = () => {
     },
     isLoading: b = !1,
     buttonLink: u,
@@ -216,7 +213,7 @@ const E = y.div`
       timeToRead: e == null ? void 0 : e.timeToRead,
       timeToReadText: p,
       tags: e == null ? void 0 : e.tags,
-      onCardClick: () => m(e == null ? void 0 : e.titleSlug),
+      onCardClick: () => o(e == null ? void 0 : e.titleSlug),
       imageUrl: n(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null
     },
     g
@@ -233,11 +230,11 @@ const E = y.div`
       publishedAt: e == null ? void 0 : e.publishedAt,
       timeToRead: e == null ? void 0 : e.timeToRead,
       timeToReadText: p,
-      onCardClick: () => m(e == null ? void 0 : e.titleSlug)
+      onCardClick: () => o(e == null ? void 0 : e.titleSlug)
     },
     g
-  )) }), [l, h, c, m]);
-  return /* @__PURE__ */ t(U, { ref: o, children: [
+  )) }), [l, h, c, o]);
+  return /* @__PURE__ */ t(U, { ref: s, children: [
     /* @__PURE__ */ t("div", { className: "regular-title", children: [
       /* @__PURE__ */ t("div", { className: "regular-title-text", children: [
         w(a) && /* @__PURE__ */ r("i", { className: a }),
@@ -251,7 +248,7 @@ const E = y.div`
           color: "neutral",
           onClick: (e) => {
             var g;
-            (g = e == null ? void 0 : e.target) == null || g.blur(), s(u);
+            (g = e == null ? void 0 : e.target) == null || g.blur(), m(u);
           },
           borderRadius: "curved",
           className: "button-link",

package/dist/BlogsSectionLarge.js

@@ -3,7 +3,7 @@ import { memo as c, forwardRef as f, useMemo as S } from "react";
 import { s as C } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as b } from "./consts-BuFChS64.js";
 import { u as B } from "./useDetectMobile-Bkvj0VMa.js";
-import { B as M } from "./index-EE-IJbC3.js";
+import { B as M } from "./index-DJ545v7b.js";
 import { S as L } from "./suspense-large-DrD8xVZi.js";
 const h = C.div`
   display: grid;

package/dist/BlogsSectionSimple.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),c=require("react"),p=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-goSZX3xP.cjs"),N=require("./useDetectMobile-zkbzoOGV.cjs"),u=require("./utils-DmMdPm9O.cjs"),q=require("./style-C_BRvopE.cjs"),x=require("./Button.cjs"),R=require("./Link.cjs"),M=require("./index-DiIeF_76.cjs"),B=p.styled.div`
+"use strict";const r=require("react/jsx-runtime"),m=require("react"),h=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-goSZX3xP.cjs"),q=require("./useDetectMobile-zkbzoOGV.cjs"),p=require("./utils-DmMdPm9O.cjs"),S=require("./style-C_BRvopE.cjs"),R=require("./Button.cjs"),B=require("./Link.cjs"),M=require("./index-DiIeF_76.cjs"),T=h.styled.div`
   display: grid;
   grid-template-columns: ${t=>`repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
@@ -6,7 +6,7 @@
   @media (max-width: ${y.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`,S=p.styled.div`
+`,b=h.styled.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -16,7 +16,6 @@
   border-radius: 0.75rem;
   border: 1px solid var(--gray-95008);
   overflow: hidden;
-  max-height: 21.5625rem;
   min-height: 21.5625rem;
   cursor: pointer;
 
@@ -34,7 +33,7 @@
     width: 100%;
     max-height: 12.5625rem;
     min-height: 12.5625rem;
-    background-color: ${u.linearGradientAnimation("-90deg")};
+    background-color: ${p.linearGradientAnimation("-90deg")};
   }
 
   & .action {
@@ -52,9 +51,17 @@
     }
   }
 
+  & .tags-wr {
+    display: flex;
+    flex-wrap: wrap;
+
+    gap: 0.5rem;
+    padding: 1rem;
+  }
+
   @media (max-width: ${y.MOBILE_SIZE_PX+"px"}) {
   }
-`,b=p.styled.div`
+`,v=h.styled.div`
   padding: 1rem 1rem 0 1rem;
   display: flex;
   flex-direction: column;
@@ -72,6 +79,6 @@
     font-size: 0.875rem;
     flex: 1;
     color: var(--gray-700, #4e555f);
-    ${u.truncateTextInRows(3)}
+    ${p.truncateTextInRows(3)}
   }
-`,$=c.forwardRef((t,l)=>{const{title:i,imageUrl:s,text:o,onCardClick:d,readMoreText:m="Read more"}=t;return r.jsxs(S,{ref:l,className:"blog-card",onClick:d,children:[r.jsx(M.ProductImageWrapper,{src:s}),r.jsxs(b,{children:[r.jsx("div",{className:"text-wr-title",children:i}),r.jsx("div",{className:"text-wr",children:o})]}),r.jsx(R,{className:"action",color:"gray",onClick:d,children:m})]})}),I=c.forwardRef(({},t)=>r.jsxs(S,{className:"product-card",children:[r.jsx("div",{className:"skeleton-img"}),r.jsx("div",{className:"card-title"}),r.jsx(b,{})]})),P=({limit:t=3,isLoading:l=!1,keyPrefix:i})=>r.jsx(r.Fragment,{children:Array.from({length:t},(s,o)=>r.jsx(I,{isLoading:l},`${i}-skeleton-product-card-${o}`))}),T=({children:t,fallbackComponent:l=r.jsx(r.Fragment,{}),isLoading:i=!1,limit:s,keyPrefix:o})=>r.jsx(c.Suspense,{fallbackComponent:l,children:i===!0?r.jsx(P,{isLoading:i,limit:s,keyPrefix:o}):t}),j=c.memo($),_=c.forwardRef((t,l)=>{const{icon:i,title:s,onButtonAction:o=()=>{},onSelectCard:d=()=>{},buttonLink:m,items:n,buttonText:v,limit:g=3,isLoading:w=!1,getImage:h=()=>{},readMoreText:f="Read more"}=t,k=N.useDetectMobile(),C=c.useMemo(()=>r.jsx(r.Fragment,{children:k===!0?n==null?void 0:n.map((e,a)=>r.jsx(j,{title:e==null?void 0:e.title,imageUrl:h(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:f,onCardClick:()=>d(e==null?void 0:e.titleSlug)},a)):n==null?void 0:n.slice(0,g).map((e,a)=>r.jsx(j,{title:e==null?void 0:e.title,imageUrl:h(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:f,onCardClick:()=>d(e==null?void 0:e.titleSlug)},a))}),[n]);return r.jsxs(q.RegulatTitleSectionWrapper,{ref:l,children:[r.jsxs("div",{className:"regular-title",children:[r.jsxs("div",{className:"regular-title-text",children:[u.isDefinedNotEmptyString(i)&&r.jsx("i",{className:i}),r.jsx("span",{children:s})]}),u.isDefinedNotEmptyString(m)&&r.jsx(x,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var a;(a=e==null?void 0:e.target)==null||a.blur(),o(m)},borderRadius:"curved",className:"button-link",children:v})]}),r.jsx(B,{limit:g,children:r.jsx(T,{isLoading:w,limit:g,keyPrefix:"explore-landing",children:C})})]})});module.exports=_;
+`,$=m.forwardRef((t,s)=>{const{title:i,imageUrl:c,text:n,options:a,onCardClick:g,readMoreText:o="Read more"}=t;return r.jsxs(b,{ref:s,className:"blog-card",onClick:g,children:[r.jsx(M.ProductImageWrapper,{src:c}),r.jsxs(v,{children:[r.jsx("div",{className:"text-wr-title",children:i}),r.jsx("div",{className:"text-wr",children:n})]}),a&&r.jsx("div",{className:"tags-wr",children:a==null?void 0:a.map((l,u)=>r.jsx(S.BlogTag,{color:l==null?void 0:l.color,children:l==null?void 0:l.name},u))}),r.jsx(B,{className:"action",color:"gray",onClick:g,children:o})]})}),I=m.forwardRef(({},t)=>r.jsxs(b,{className:"product-card",children:[r.jsx("div",{className:"skeleton-img"}),r.jsx("div",{className:"card-title"}),r.jsx(v,{})]})),P=({limit:t=3,isLoading:s=!1,keyPrefix:i})=>r.jsx(r.Fragment,{children:Array.from({length:t},(c,n)=>r.jsx(I,{isLoading:s},`${i}-skeleton-product-card-${n}`))}),_=({children:t,fallbackComponent:s=r.jsx(r.Fragment,{}),isLoading:i=!1,limit:c,keyPrefix:n})=>r.jsx(m.Suspense,{fallbackComponent:s,children:i===!0?r.jsx(P,{isLoading:i,limit:c,keyPrefix:n}):t}),w=m.memo($),E=m.forwardRef((t,s)=>{const{icon:i,title:c,onButtonAction:n=()=>{},onSelectCard:a=()=>{},buttonLink:g,items:o,buttonText:l,limit:u=3,isLoading:k=!1,getImage:f=()=>{},readMoreText:j="Read more"}=t,N=q.useDetectMobile(),C=m.useMemo(()=>r.jsx(r.Fragment,{children:N===!0?o==null?void 0:o.map((e,d)=>r.jsx(w,{title:e==null?void 0:e.title,imageUrl:f(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:j,options:e==null?void 0:e.options,onCardClick:()=>a(e==null?void 0:e.titleSlug)},d)):o==null?void 0:o.slice(0,u).map((e,d)=>r.jsx(w,{title:e==null?void 0:e.title,imageUrl:f(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:j,options:e==null?void 0:e.options,onCardClick:()=>a(e==null?void 0:e.titleSlug)},d))}),[o]);return r.jsxs(S.RegulatTitleSectionWrapper,{ref:s,children:[r.jsxs("div",{className:"regular-title",children:[r.jsxs("div",{className:"regular-title-text",children:[p.isDefinedNotEmptyString(i)&&r.jsx("i",{className:i}),r.jsx("span",{children:c})]}),p.isDefinedNotEmptyString(g)&&r.jsx(R,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var d;(d=e==null?void 0:e.target)==null||d.blur(),n(g)},borderRadius:"curved",className:"button-link",children:l})]}),r.jsx(T,{limit:u,children:r.jsx(_,{isLoading:k,limit:u,keyPrefix:"explore-landing",children:C})})]})});module.exports=E;