@lanaco/lnc-react-ui 4.0.169 → 4.0.171

package/dist/BlogSingleSection.cjs

@@ -1 +1,16 @@
-"use strict";const r=require("react/jsx-runtime"),o=require("react"),g=require("./index-BGTtoLxz.cjs"),a=require("./skeleton-BdbB-LdT.cjs"),c=({limit:t=1,isLoading:l=!1,keyPrefix:n})=>r.jsx(r.Fragment,{children:Array.from({length:t},(e,s)=>r.jsx(a.BlogCardLargeSkeleton,{isLoading:l},`${n}-skeleton-product-card-${s}`))}),x=({children:t,fallbackComponent:l=r.jsx(r.Fragment,{}),isLoading:n=!1,limit:e,keyPrefix:s})=>r.jsx(o.Suspense,{fallbackComponent:l,children:n===!0?r.jsx(c,{isLoading:n,limit:e,keyPrefix:s}):t}),d=o.forwardRef((t,l)=>{const{isLoading:n,item:e,onSelectCard:s=()=>{},getImage:u=()=>{}}=t;return r.jsx(x,{isLoading:n,limit:1,keyPrefix:"explore-landing",children:r.jsx(g.BlogCardLarge,{ref:l,title:e==null?void 0:e.title,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,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>s(e==null?void 0:e.titleSlug)})})});module.exports=d;
+"use strict";const r=require("react/jsx-runtime"),s=require("react"),u=require("./index-D69SKc-n.cjs"),l=require("./style-BAcV7F53.cjs"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),c=require("./consts-goSZX3xP.cjs"),d=g.styled(l.SkeletonColumnWrapper)`
+  @media (max-width: ${c.MOBILE_SIZE_PX+"px"}) {
+    & > div {
+      height: 13.25rem;
+
+      background: linear-gradient(
+        to right,
+        transparent 0%,
+        #f4f6fb 40%,
+        #f4f6fb 100%
+      );
+
+      box-shadow: none;
+    }
+  }
+`,x=({keyPrefix:n})=>r.jsx(d,{children:r.jsx(l.SkeletonLinePlaceholder,{height:"11.25rem",borderRadius:"0.75rem"},`${n}-1`)}),S=({keyPrefix:n,isLoading:t=!1,fallbackComponent:o=r.jsx(r.Fragment,{}),children:e})=>r.jsx(s.Suspense,{fallbackComponent:o,children:t===!0?r.jsx(x,{keyPrefix:n}):e}),h=s.forwardRef((n,t)=>{const{isLoading:o,item:e,onSelectCard:i=()=>{},getImage:a=()=>{}}=n;return r.jsx(S,{isLoading:o,keyPrefix:"blogs-single-skeleton",children:r.jsx(u.BlogCardLarge,{ref:t,title:e==null?void 0:e.title,imageUrl:a(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,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>i(e==null?void 0:e.titleSlug)})})});module.exports=h;

package/dist/BlogSingleSection.js

@@ -1,56 +1,58 @@
-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-1Dm1i6WK.js";
-import { B as c } from "./skeleton-CQPwIEP0.js";
-const f = ({ limit: o = 1, isLoading: t = !1, keyPrefix: l }) => /* @__PURE__ */ e(a, { children: Array.from({ length: o }, (r, n) => /* @__PURE__ */ e(
-  c,
-  {
-    isLoading: t
-  },
-  `${l}-skeleton-product-card-${n}`
-)) }), i = ({
-  children: o,
-  fallbackComponent: t = /* @__PURE__ */ e(a, {}),
-  isLoading: l = !1,
-  limit: r,
-  keyPrefix: n
-}) => /* @__PURE__ */ e(s, { fallbackComponent: t, children: l === !0 ? /* @__PURE__ */ e(
+import { jsx as r, Fragment as s } from "react/jsx-runtime";
+import { Suspense as i, forwardRef as g } from "react";
+import { B as d } from "./index-DFdPWO4O.js";
+import { S as u, b as f } from "./style-CXMUA6cI.js";
+import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as p } from "./consts-BuFChS64.js";
+const S = c(u)`
+  @media (max-width: ${p + "px"}) {
+    & > div {
+      height: 13.25rem;
+
+      background: linear-gradient(
+        to right,
+        transparent 0%,
+        #f4f6fb 40%,
+        #f4f6fb 100%
+      );
+
+      box-shadow: none;
+    }
+  }
+`, h = ({ keyPrefix: o }) => /* @__PURE__ */ r(S, { children: /* @__PURE__ */ r(
   f,
   {
-    isLoading: l,
-    limit: r,
-    keyPrefix: n
-  }
-) : o }), k = u((o, t) => {
+    height: "11.25rem",
+    borderRadius: "0.75rem"
+  },
+  `${o}-1`
+) }), b = ({
+  keyPrefix: o,
+  isLoading: t = !1,
+  fallbackComponent: n = /* @__PURE__ */ r(s, {}),
+  children: e
+}) => /* @__PURE__ */ r(i, { fallbackComponent: n, children: t === !0 ? /* @__PURE__ */ r(h, { keyPrefix: o }) : e }), w = g((o, t) => {
   const {
-    isLoading: l,
-    item: r,
-    onSelectCard: n = () => {
+    isLoading: n,
+    item: e,
+    onSelectCard: l = () => {
     },
-    getImage: g = () => {
+    getImage: a = () => {
     }
   } = o;
-  return /* @__PURE__ */ e(
-    i,
+  return /* @__PURE__ */ r(b, { isLoading: n, keyPrefix: "blogs-single-skeleton", children: /* @__PURE__ */ r(
+    d,
     {
-      isLoading: l,
-      limit: 1,
-      keyPrefix: "explore-landing",
-      children: /* @__PURE__ */ e(
-        d,
-        {
-          ref: t,
-          title: r == null ? void 0 : r.title,
-          imageUrl: g(r == null ? void 0 : r.imageUrl, r == null ? void 0 : r.uuid) || null,
-          text: r == null ? void 0 : r.description,
-          titleSlug: r == null ? void 0 : r.titleSlug,
-          buttonText: r == null ? void 0 : r.buttonText,
-          onCardClick: () => n(r == null ? void 0 : r.titleSlug)
-        }
-      )
+      ref: t,
+      title: e == null ? void 0 : e.title,
+      imageUrl: a(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,
+      buttonText: e == null ? void 0 : e.buttonText,
+      onCardClick: () => l(e == null ? void 0 : e.titleSlug)
     }
-  );
+  ) });
 });
 export {
-  k as default
+  w as default
 };

package/dist/BlogsSectionDetailed.cjs

@@ -1,12 +1,12 @@
-"use strict";const t=require("react/jsx-runtime"),d=require("react"),k=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),A=require("./useDetectMobile-zkbzoOGV.cjs"),i=require("./utils-Dl9xPH4c.cjs"),R=require("./style-Db3VFbfP.cjs"),$=require("./Button.cjs"),B=require("./index-BueKsXT8.cjs"),D=k.styled.div`
+"use strict";const t=require("react/jsx-runtime"),u=require("react"),N=require("./emotion-styled.browser.esm-BtEseadx.cjs"),R=require("./consts-goSZX3xP.cjs"),T=require("./useDetectMobile-zkbzoOGV.cjs"),a=require("./utils-Dl9xPH4c.cjs"),C=require("./style-Db3VFbfP.cjs"),O=require("./Button.cjs"),q=require("./index-BueKsXT8.cjs"),L=require("./index-D-3I_Ppj.cjs"),B=N.styled.div`
   display: grid;
-  grid-template-columns: ${s=>`repeat(${s.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${o=>`repeat(${o.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${S.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${R.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`,C=k.styled.div`
+`,D=N.styled.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -37,24 +37,17 @@
     width: 100%;
   }
 
-  & .skeleton-img {
-    width: 100%;
-    max-height: 12.5rem;
-    min-height: 12.5rem;
-    background-color: ${i.linearGradientAnimation("-90deg")};
-  }
-
   & .tags-wr {
     display: flex;
     flex-wrap: wrap;
     gap: 0.5rem;
   }
 
-  @media (max-width: ${S.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${R.MOBILE_SIZE_PX+"px"}) {
     max-height: 100%;
     min-height: 100%;
   }
-`,T=k.styled.div`
+`,A=N.styled.div`
   display: flex;
   flex-direction: column;
   gap: 0;
@@ -65,24 +58,12 @@
     font-size: 1rem;
   }
 
-  & .info-wr-skeleton {
-    background-color: ${i.linearGradientAnimation("-90deg")};
-    height: 1rem;
-    width: 100%;
-  }
-
-  & .skeleton-title {
-    background-color: ${i.linearGradientAnimation("-90deg")};
-    height: 1.5rem;
-    width: 70%;
-  }
-
   & .text-wr {
     font-weight: 400;
     font-size: 0.875rem;
     flex: 1;
     color: var(--gray-700, #4e555f);
-    ${i.truncateTextInRows(2)}
+    ${a.truncateTextInRows(2)}
   }
 
   & .info-wr {
@@ -111,4 +92,4 @@
     align-items: center;
     gap: 1rem;
   }
-`,q=d.forwardRef((s,m)=>{const{title:n,imageUrl:g,text:c,numberOfLikes:a,numberOfComments:j,timeToRead:f,publishedAt:u,tags:o,onCardClick:w,timeToReadText:h="{0} min read",metadata:l}=s,b=d.useRef();return t.jsxs(C,{ref:b,className:"blog-card","data-accessor":l==null?void 0:l.accessor,name:l==null?void 0:l.name,onClick:r=>w(r,b),children:[t.jsx(B.ProductImageWrapper,{src:g}),t.jsxs("div",{className:"blog-card-content",children:[t.jsxs(T,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[i.formatLocaleDateString(u)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),f&&h?`${i.formatString(h,f)}`:"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:i.getRoundedNumber(a)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:i.getRoundedNumber(j)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:n}),t.jsx("div",{className:"text-wr",children:c})]}),o&&t.jsx("div",{className:"tags-wr",children:o==null?void 0:o.map((r,N)=>t.jsx(R.BlogTag,{color:r==null?void 0:r.color,children:r==null?void 0:r.name},N))})]})]})}),L=d.forwardRef(({},s)=>t.jsxs(C,{className:"blog-card",children:[t.jsx("div",{className:"skeleton-img"}),t.jsxs(T,{children:[t.jsx("div",{className:"info-wr"}),t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"info-wr-skeleton"})]})]})),E=({limit:s=3,isLoading:m=!1,keyPrefix:n})=>t.jsx(t.Fragment,{children:Array.from({length:s},(g,c)=>t.jsx(L,{isLoading:m},`${n}-skeleton-product-card-${c}`))}),I=({children:s,fallbackComponent:m=t.jsx(t.Fragment,{}),isLoading:n=!1,limit:g,keyPrefix:c})=>t.jsx(d.Suspense,{fallbackComponent:m,children:n===!0?t.jsx(E,{isLoading:n,limit:g,keyPrefix:c}):s}),v=d.memo(q),M=d.forwardRef((s,m)=>{const{icon:n,title:g,onButtonAction:c,items:a,buttonText:j,timeToReadText:f,limit:u=3,onSelectCard:o=()=>{},isLoading:w=!1,buttonLink:h,getImage:l=()=>{},componentName:b}=s,r=A.useDetectMobile(),N=d.useMemo(()=>t.jsx(t.Fragment,{children:r===!0?a==null?void 0:a.map((e,p)=>t.jsx(v,{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:f,tags:e==null?void 0:e.tags,onCardClick:(O,y)=>o(e==null?void 0:e.titleSlug,y),imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,metadata:{name:b,accessor:e==null?void 0:e.accessor}},p)):a==null?void 0:a.slice(0,u).map((e,p)=>t.jsx(v,{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:f,onCardClick:(O,y)=>o(e==null?void 0:e.titleSlug,y),metadata:{name:b,accessor:e==null?void 0:e.accessor}},p))}),[a,r,u,o]);return t.jsxs(R.RegulatTitleSectionWrapper,{ref:m,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[i.isDefinedNotEmptyString(n)&&t.jsx("i",{className:n}),t.jsx("span",{children:g})]}),i.isDefinedNotEmptyString(j)&&i.isDefinedNotEmptyString(h)&&t.jsx($,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var p;(p=e==null?void 0:e.target)==null||p.blur(),c(h)},borderRadius:"curved",className:"button-link",children:j})]}),t.jsx(D,{limit:u,children:t.jsx(I,{isLoading:w,limit:u,keyPrefix:"explore-landing",children:N})})]})});module.exports=M;
+`,E=u.forwardRef((o,v)=>{const{title:p,imageUrl:b,text:j,numberOfLikes:i,numberOfComments:f,timeToRead:c,publishedAt:d,tags:n,onCardClick:h,timeToReadText:m="{0} min read",metadata:s}=o,g=u.useRef();return t.jsxs(D,{ref:g,className:"blog-card","data-accessor":s==null?void 0:s.accessor,name:s==null?void 0:s.name,onClick:r=>h(r,g),children:[t.jsx(q.ProductImageWrapper,{src:b}),t.jsxs("div",{className:"blog-card-content",children:[t.jsxs(A,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[a.formatLocaleDateString(d)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),c&&m?`${a.formatString(m,c)}`:"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:a.getRoundedNumber(i)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:a.getRoundedNumber(f)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:p}),t.jsx("div",{className:"text-wr",children:j})]}),n&&t.jsx("div",{className:"tags-wr",children:n==null?void 0:n.map((r,w)=>t.jsx(C.BlogTag,{color:r==null?void 0:r.color,children:r==null?void 0:r.name},w))})]})]})}),S=u.memo(E),I=u.forwardRef((o,v)=>{const{icon:p,title:b,onButtonAction:j,items:i,buttonText:f,timeToReadText:c,limit:d=3,onSelectCard:n=()=>{},isLoading:h=!1,buttonLink:m,getImage:s=()=>{},componentName:g}=o,r=T.useDetectMobile(),w=u.useMemo(()=>t.jsx(t.Fragment,{children:r===!0?i==null?void 0:i.map((e,l)=>t.jsx(S,{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:c,tags:e==null?void 0:e.tags,onCardClick:(k,y)=>n(e==null?void 0:e.titleSlug,y),imageUrl:s(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,metadata:{name:g,accessor:e==null?void 0:e.accessor}},l)):i==null?void 0:i.slice(0,d).map((e,l)=>t.jsx(S,{title:e==null?void 0:e.title,imageUrl:s(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:c,onCardClick:(k,y)=>n(e==null?void 0:e.titleSlug,y),metadata:{name:g,accessor:e==null?void 0:e.accessor}},l))}),[i,r,d,n]);return t.jsxs(C.RegulatTitleSectionWrapper,{ref:v,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[a.isDefinedNotEmptyString(p)&&t.jsx("i",{className:p}),t.jsx("span",{children:b})]}),a.isDefinedNotEmptyString(f)&&a.isDefinedNotEmptyString(m)&&!h&&t.jsx(O,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var l;(l=e==null?void 0:e.target)==null||l.blur(),j(m)},borderRadius:"curved",className:"button-link",children:f})]}),t.jsx(L.SuspenseBlogsSectionDetailed,{isLoading:h,keyPrefix:"blogs-detailed-skeleton",children:t.jsx(B,{limit:d,children:w})})]})});module.exports=I;

package/dist/BlogsSectionDetailed.js

@@ -1,21 +1,22 @@
-import { jsxs as t, jsx as r, Fragment as C } from "react/jsx-runtime";
-import { forwardRef as S, useRef as D, Suspense as z, memo as M, useMemo as P } from "react";
-import { s as R } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as $ } from "./consts-BuFChS64.js";
-import { u as j } from "./useDetectMobile-Bkvj0VMa.js";
-import { o as y, p as I, v as U, s as W, w as T, k as N } from "./utils-BdsZgOUE.js";
-import { B as E, R as _ } from "./style-DKAOBWn3.js";
-import G from "./Button.js";
-import { P as F } from "./index-CF3HhgvN.js";
-const X = R.div`
+import { jsxs as r, jsx as t, Fragment as B } from "react/jsx-runtime";
+import { forwardRef as R, useRef as L, memo as A, useMemo as z } from "react";
+import { s as N } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as T } from "./consts-BuFChS64.js";
+import { u as D } from "./useDetectMobile-Bkvj0VMa.js";
+import { o as M, s as $, q as j, v as C, k as y } from "./utils-DHfRApMf.js";
+import { B as I, R as P } from "./style-D3pIrH3v.js";
+import U from "./Button.js";
+import { P as W } from "./index-BbltNcou.js";
+import { S as E } from "./index-BovNbKxB.js";
+const _ = N.div`
   display: grid;
-  grid-template-columns: ${(a) => `repeat(${a.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${(s) => `repeat(${s.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${$ + "px"}) {
+  @media (max-width: ${T + "px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`, B = R.div`
+`, q = N.div`
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -46,24 +47,17 @@ const X = R.div`
     width: 100%;
   }
 
-  & .skeleton-img {
-    width: 100%;
-    max-height: 12.5rem;
-    min-height: 12.5rem;
-    background-color: ${y("-90deg")};
-  }
-
   & .tags-wr {
     display: flex;
     flex-wrap: wrap;
     gap: 0.5rem;
   }
 
-  @media (max-width: ${$ + "px"}) {
+  @media (max-width: ${T + "px"}) {
     max-height: 100%;
     min-height: 100%;
   }
-`, A = R.div`
+`, F = N.div`
   display: flex;
   flex-direction: column;
   gap: 0;
@@ -74,24 +68,12 @@ const X = R.div`
     font-size: 1rem;
   }
 
-  & .info-wr-skeleton {
-    background-color: ${y("-90deg")};
-    height: 1rem;
-    width: 100%;
-  }
-
-  & .skeleton-title {
-    background-color: ${y("-90deg")};
-    height: 1.5rem;
-    width: 70%;
-  }
-
   & .text-wr {
     font-weight: 400;
     font-size: 0.875rem;
     flex: 1;
     color: var(--gray-700, #4e555f);
-    ${I(2)}
+    ${M(2)}
   }
 
   & .info-wr {
@@ -120,107 +102,78 @@ const X = R.div`
     align-items: center;
     gap: 1rem;
   }
-`, Z = S((a, c) => {
+`, G = R((s, k) => {
   const {
-    title: n,
-    imageUrl: d,
-    text: m,
-    numberOfLikes: l,
-    numberOfComments: b,
-    timeToRead: f,
-    publishedAt: g,
-    tags: s,
-    onCardClick: w,
-    timeToReadText: u = "{0} min read",
-    metadata: o
-  } = a, h = D();
-  return (
-    // <BlogCardDetailedSkeleton />
-    /* @__PURE__ */ t(
-      B,
-      {
-        ref: h,
-        className: "blog-card",
-        "data-accessor": o == null ? void 0 : o.accessor,
-        name: o == null ? void 0 : o.name,
-        onClick: (i) => w(i, h),
-        children: [
-          /* @__PURE__ */ r(F, { src: d }),
-          /* @__PURE__ */ t("div", { className: "blog-card-content", children: [
-            /* @__PURE__ */ t(A, { children: [
-              /* @__PURE__ */ t("div", { className: "info-wr", children: [
-                /* @__PURE__ */ t("div", { className: "info-wr-1", children: [
-                  /* @__PURE__ */ t("span", { children: [
-                    W(g),
-                    " "
-                  ] }),
-                  /* @__PURE__ */ r("span", { className: "small-dot", children: "●" }),
-                  f && u ? `${U(u, f)}` : "N/A"
+    title: g,
+    imageUrl: h,
+    text: b,
+    numberOfLikes: a,
+    numberOfComments: f,
+    timeToRead: m,
+    publishedAt: c,
+    tags: n,
+    onCardClick: u,
+    timeToReadText: d = "{0} min read",
+    metadata: l
+  } = s, p = L();
+  return /* @__PURE__ */ r(
+    q,
+    {
+      ref: p,
+      className: "blog-card",
+      "data-accessor": l == null ? void 0 : l.accessor,
+      name: l == null ? void 0 : l.name,
+      onClick: (i) => u(i, p),
+      children: [
+        /* @__PURE__ */ t(W, { src: h }),
+        /* @__PURE__ */ r("div", { className: "blog-card-content", children: [
+          /* @__PURE__ */ r(F, { children: [
+            /* @__PURE__ */ r("div", { className: "info-wr", children: [
+              /* @__PURE__ */ r("div", { className: "info-wr-1", children: [
+                /* @__PURE__ */ r("span", { children: [
+                  j(c),
+                  " "
                 ] }),
-                /* @__PURE__ */ t("div", { className: "info-wr-2", children: [
-                  /* @__PURE__ */ t("span", { className: "info-wr-1", children: [
-                    /* @__PURE__ */ r("i", { className: "mng mng-lnc-thumbs-up--filled" }),
-                    /* @__PURE__ */ r("span", { children: T(l) })
-                  ] }),
-                  /* @__PURE__ */ t("span", { className: "info-wr-1", children: [
-                    /* @__PURE__ */ r("i", { className: "mng mng-lnc-messages-filled" }),
-                    /* @__PURE__ */ r("span", { children: T(b) })
-                  ] })
-                ] })
+                /* @__PURE__ */ t("span", { className: "small-dot", children: "●" }),
+                m && d ? `${$(d, m)}` : "N/A"
               ] }),
-              /* @__PURE__ */ r("div", { className: "text-wr-title", children: n }),
-              /* @__PURE__ */ r("div", { className: "text-wr", children: m })
+              /* @__PURE__ */ r("div", { className: "info-wr-2", children: [
+                /* @__PURE__ */ r("span", { className: "info-wr-1", children: [
+                  /* @__PURE__ */ t("i", { className: "mng mng-lnc-thumbs-up--filled" }),
+                  /* @__PURE__ */ t("span", { children: C(a) })
+                ] }),
+                /* @__PURE__ */ r("span", { className: "info-wr-1", children: [
+                  /* @__PURE__ */ t("i", { className: "mng mng-lnc-messages-filled" }),
+                  /* @__PURE__ */ t("span", { children: C(f) })
+                ] })
+              ] })
             ] }),
-            s && /* @__PURE__ */ r("div", { className: "tags-wr", children: s == null ? void 0 : s.map((i, k) => /* @__PURE__ */ r(E, { color: i == null ? void 0 : i.color, children: i == null ? void 0 : i.name }, k)) })
-          ] })
-        ]
-      }
-    )
+            /* @__PURE__ */ t("div", { className: "text-wr-title", children: g }),
+            /* @__PURE__ */ t("div", { className: "text-wr", children: b })
+          ] }),
+          n && /* @__PURE__ */ t("div", { className: "tags-wr", children: n == null ? void 0 : n.map((i, w) => /* @__PURE__ */ t(I, { color: i == null ? void 0 : i.color, children: i == null ? void 0 : i.name }, w)) })
+        ] })
+      ]
+    }
   );
-}), q = S(({}, a) => /* @__PURE__ */ t(B, { className: "blog-card", children: [
-  /* @__PURE__ */ r("div", { className: "skeleton-img" }),
-  /* @__PURE__ */ t(A, { children: [
-    /* @__PURE__ */ r("div", { className: "info-wr" }),
-    /* @__PURE__ */ r("div", { className: "skeleton-title" }),
-    /* @__PURE__ */ r("div", { className: "info-wr-skeleton" })
-  ] })
-] })), H = ({ limit: a = 3, isLoading: c = !1, keyPrefix: n }) => /* @__PURE__ */ r(C, { children: Array.from({ length: a }, (d, m) => /* @__PURE__ */ r(
-  q,
-  {
-    isLoading: c
-  },
-  `${n}-skeleton-product-card-${m}`
-)) }), J = ({
-  children: a,
-  fallbackComponent: c = /* @__PURE__ */ r(C, {}),
-  isLoading: n = !1,
-  limit: d,
-  keyPrefix: m
-}) => /* @__PURE__ */ r(z, { fallbackComponent: c, children: n === !0 ? /* @__PURE__ */ r(
-  H,
-  {
-    isLoading: n,
-    limit: d,
-    keyPrefix: m
-  }
-) : a }), O = M(Z), ae = S((a, c) => {
+}), S = A(G), te = R((s, k) => {
   const {
-    icon: n,
-    title: d,
-    onButtonAction: m,
-    items: l,
-    buttonText: b,
-    timeToReadText: f,
-    limit: g = 3,
-    onSelectCard: s = () => {
+    icon: g,
+    title: h,
+    onButtonAction: b,
+    items: a,
+    buttonText: f,
+    timeToReadText: m,
+    limit: c = 3,
+    onSelectCard: n = () => {
     },
-    isLoading: w = !1,
-    buttonLink: u,
-    getImage: o = () => {
+    isLoading: u = !1,
+    buttonLink: d,
+    getImage: l = () => {
     },
-    componentName: h
-  } = a, i = j(), k = P(() => /* @__PURE__ */ r(C, { children: i === !0 ? l == null ? void 0 : l.map((e, p) => /* @__PURE__ */ r(
-    O,
+    componentName: p
+  } = s, i = D(), w = z(() => /* @__PURE__ */ t(B, { children: i === !0 ? a == null ? void 0 : a.map((e, o) => /* @__PURE__ */ t(
+    S,
     {
       title: e == null ? void 0 : e.title,
       text: e == null ? void 0 : e.description,
@@ -229,18 +182,18 @@ const X = R.div`
       numberOfComments: e == null ? void 0 : e.numberOfComments,
       publishedAt: e == null ? void 0 : e.publishedAt,
       timeToRead: e == null ? void 0 : e.timeToRead,
-      timeToReadText: f,
+      timeToReadText: m,
       tags: e == null ? void 0 : e.tags,
-      onCardClick: (L, v) => s(e == null ? void 0 : e.titleSlug, v),
-      imageUrl: o(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
-      metadata: { name: h, accessor: e == null ? void 0 : e.accessor }
+      onCardClick: (O, v) => n(e == null ? void 0 : e.titleSlug, v),
+      imageUrl: l(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
+      metadata: { name: p, accessor: e == null ? void 0 : e.accessor }
     },
-    p
-  )) : l == null ? void 0 : l.slice(0, g).map((e, p) => /* @__PURE__ */ r(
-    O,
+    o
+  )) : a == null ? void 0 : a.slice(0, c).map((e, o) => /* @__PURE__ */ t(
+    S,
     {
       title: e == null ? void 0 : e.title,
-      imageUrl: o(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
+      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,
@@ -248,45 +201,44 @@ const X = R.div`
       numberOfComments: e == null ? void 0 : e.numberOfComments,
       publishedAt: e == null ? void 0 : e.publishedAt,
       timeToRead: e == null ? void 0 : e.timeToRead,
-      timeToReadText: f,
-      onCardClick: (L, v) => s(e == null ? void 0 : e.titleSlug, v),
-      metadata: { name: h, accessor: e == null ? void 0 : e.accessor }
+      timeToReadText: m,
+      onCardClick: (O, v) => n(e == null ? void 0 : e.titleSlug, v),
+      metadata: { name: p, accessor: e == null ? void 0 : e.accessor }
     },
-    p
-  )) }), [l, i, g, s]);
-  return /* @__PURE__ */ t(_, { ref: c, children: [
-    /* @__PURE__ */ t("div", { className: "regular-title", children: [
-      /* @__PURE__ */ t("div", { className: "regular-title-text", children: [
-        N(n) && /* @__PURE__ */ r("i", { className: n }),
-        /* @__PURE__ */ r("span", { children: d })
+    o
+  )) }), [a, i, c, n]);
+  return /* @__PURE__ */ r(P, { ref: k, children: [
+    /* @__PURE__ */ r("div", { className: "regular-title", children: [
+      /* @__PURE__ */ r("div", { className: "regular-title-text", children: [
+        y(g) && /* @__PURE__ */ t("i", { className: g }),
+        /* @__PURE__ */ t("span", { children: h })
       ] }),
-      N(b) && N(u) && /* @__PURE__ */ r(
-        G,
+      y(f) && y(d) && !u && /* @__PURE__ */ t(
+        U,
         {
           type: "button",
           btnType: "tinted",
           color: "neutral",
           onClick: (e) => {
-            var p;
-            (p = e == null ? void 0 : e.target) == null || p.blur(), m(u);
+            var o;
+            (o = e == null ? void 0 : e.target) == null || o.blur(), b(d);
           },
           borderRadius: "curved",
           className: "button-link",
-          children: b
+          children: f
         }
       )
     ] }),
-    /* @__PURE__ */ r(X, { limit: g, children: /* @__PURE__ */ r(
-      J,
+    /* @__PURE__ */ t(
+      E,
       {
-        isLoading: w,
-        limit: g,
-        keyPrefix: "explore-landing",
-        children: k
+        isLoading: u,
+        keyPrefix: "blogs-detailed-skeleton",
+        children: /* @__PURE__ */ t(_, { limit: c, children: w })
       }
-    ) })
+    )
   ] });
 });
 export {
-  ae as default
+  te as default
 };

package/dist/BlogsSectionLarge.cjs

@@ -1,9 +1,24 @@
-"use strict";const r=require("react/jsx-runtime"),a=require("react"),q=require("./emotion-styled.browser.esm-BtEseadx.cjs"),C=require("./consts-goSZX3xP.cjs"),f=require("./useDetectMobile-zkbzoOGV.cjs"),j=require("./index-BGTtoLxz.cjs"),L=require("./suspense-large-CFmcSzX-.cjs"),M=q.styled.div`
+"use strict";const t=require("react/jsx-runtime"),n=require("react"),S=require("./emotion-styled.browser.esm-BtEseadx.cjs"),b=require("./consts-goSZX3xP.cjs"),L=require("./useDetectMobile-zkbzoOGV.cjs"),k=require("./index-D69SKc-n.cjs"),d=require("./style-BAcV7F53.cjs"),C=S.styled.div`
   display: grid;
-  grid-template-columns: ${o=>`repeat(${o.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${i=>`repeat(${i.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${C.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`,m=a.memo(j.BlogCardLarge),B=a.forwardRef((o,g)=>{const{items:t,onSelectCard:s=()=>{},limit:i=2,isLoading:p=!1,getImage:c=()=>{},componentName:u}=o,d=f.useDetectMobile(),S=a.useMemo(()=>r.jsx(r.Fragment,{children:d===!0?t==null?void 0:t.map((e,l)=>r.jsx(m,{title:e==null?void 0:e.title,imageUrl:c(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,buttonText:e==null?void 0:e.buttonText,onCardClick:(b,n)=>s(e==null?void 0:e.titleSlug,n),metadata:{name:u,accessor:e==null?void 0:e.accessor}},l)):t==null?void 0:t.slice(0,i).map((e,l)=>r.jsx(m,{title:e==null?void 0:e.title,imageUrl:c(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,buttonText:e==null?void 0:e.buttonText,onCardClick:(b,n)=>s(e==null?void 0:e.titleSlug,n),metadata:{name:u,accessor:e==null?void 0:e.accessor}},l))}),[t,d,i,s]);return r.jsx(M,{ref:g,limit:i,children:r.jsx(L.SuspenseBlogLarge,{isLoading:p,limit:i,keyPrefix:"explore-landing",children:S})})});module.exports=B;
+`,q=S.styled(d.SkeletonRowWrapper)`
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
+    flex-direction: column;
+
+    & > div {
+      background: linear-gradient(
+        to right,
+        transparent 0%,
+        #f4f6fb 40%,
+        #f4f6fb 100%
+      );
+
+      box-shadow: none;
+    }
+  }
+`,B=({keyPrefix:i})=>t.jsxs(q,{children:[t.jsx(d.SkeletonLinePlaceholder,{height:"11.25rem",borderRadius:"0.75rem"},`${i}-1`),t.jsx(d.SkeletonLinePlaceholder,{height:"11.25rem",borderRadius:"0.75rem"},`${i}-2`)]}),M=({keyPrefix:i,isLoading:s=!1,fallbackComponent:r=t.jsx(t.Fragment,{}),children:o})=>t.jsx(n.Suspense,{fallbackComponent:r,children:s===!0?t.jsx(B,{keyPrefix:i}):o}),p=n.memo(k.BlogCardLarge),w=n.forwardRef((i,s)=>{const{items:r,onSelectCard:o=()=>{},limit:l=2,isLoading:h=!1,getImage:u=()=>{},componentName:m}=i,g=L.useDetectMobile(),f=n.useMemo(()=>t.jsx(t.Fragment,{children:g===!0?r==null?void 0:r.map((e,a)=>t.jsx(p,{title:e==null?void 0:e.title,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,buttonText:e==null?void 0:e.buttonText,onCardClick:(j,c)=>o(e==null?void 0:e.titleSlug,c),metadata:{name:m,accessor:e==null?void 0:e.accessor}},a)):r==null?void 0:r.slice(0,l).map((e,a)=>t.jsx(p,{title:e==null?void 0:e.title,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,buttonText:e==null?void 0:e.buttonText,onCardClick:(j,c)=>o(e==null?void 0:e.titleSlug,c),metadata:{name:m,accessor:e==null?void 0:e.accessor}},a))}),[r,g,l,o]);return t.jsx(M,{isLoading:h,keyPrefix:"blogs-large-skeleton",children:t.jsx(C,{ref:s,limit:l,children:f})})});module.exports=w;