@lanaco/lnc-react-ui/dist/BlogsSectionDetailed.cjs

React component library

"use strict";const r=require("react/jsx-runtime"),m=require("react"),w=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),v=require("./consts-CtNoHdBj.cjs"),S=require("./useDetectMobile-D6d5LpdL.cjs"),c=require("./utils-NZLCh-J5.cjs"),y=require("./style-DN1qT8BE.cjs"),C=require("./Button.cjs"),D=w.newStyled.div`
  display: grid;
  grid-template-columns: ${t=>`repeat(${t.limit},  minmax(0, 1fr))`};
  gap: 1.25rem;

  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
    grid-template-columns: repeat(1, 1fr);
  }
`,k=w.newStyled.div`
  display: flex;
  flex-direction: column;
  width: 100%;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1),
    0px 1px 2px 0px rgba(0, 0, 0, 0.06);
  background-color: var(--white, #fff);
  border-radius: 0.75rem;
  border: 1px solid var(--gray-95008, #14161a14);
  overflow: hidden;
  max-height: 21.5625rem;
  min-height: 21.5625rem;
  cursor: pointer;
  &:hover {
    & .text-wr-title {
      color: var(--primary-500, #f59e0b);
      transition: var(--transition);
    }
  }

  & img {
    max-height: 11.0625rem;
    min-height: 11.0625rem;
    object-fit: cover;
    width: 100%;
  }

  & .skeleton-img {
    width: 100%;
    max-height: 11.0625rem;
    min-height: 11.0625rem;
    background-color: ${c.linearGradientAnimation("-90deg")};
  }

  & .tags-wr {
    margin-top: auto;
    display: flex;
    gap: 0.5rem;
    padding: 0 1rem 1rem 1rem;
  }

  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
  }
`,N=w.newStyled.div`
  padding: 1rem 1rem 0 1rem;
  display: flex;
  flex-direction: column;
  gap: 0;
  color: var(--gray-950, #14161a);
  border-top: 1px solid var(--gray-95008, #14161a14);

  & .text-wr-title {
    font-weight: 600;
    font-size: 1rem;
  }

  & .info-wr-skeleton {
    background-color: ${c.linearGradientAnimation("-90deg")};
    height: 1rem;
    width: 100%;
  }

  & .skeleton-title {
    background-color: ${c.linearGradientAnimation("-90deg")};
    height: 1.5rem;
    width: 70%;
  }

  & .text-wr {
    font-weight: 400;
    font-size: 0.875rem;
    flex: 1;
    color: var(--gray-700, #4e555f);
    ${c.truncateTextInRows(2)}
  }

  & .info-wr {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    justify-content: space-between;
    color: var(--gray-600, #676e79);
    font-size: 0.75rem;
    font-weight: 400;

    & .mng {
      font-size: 0.875rem;
      color: var(--gray-300, #c4c8cf);
    }
  }

  & .info-wr-1 {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }

  & .info-wr-2 {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
`,O=m.forwardRef((t,l)=>{const{title:i,image:d,text:n,numberOfLikes:s,numberOfComments:p,readDuration:o,datePublished:g,tags:u,onCardClick:h,timeToReadText:f="read"}=t;return r.jsxs(k,{ref:l,className:"blog-card",onClick:h,children:[r.jsx("img",{src:d}),r.jsxs(N,{children:[r.jsxs("div",{className:"info-wr",children:[r.jsxs("div",{className:"info-wr-1",children:[r.jsx("span",{children:g}),r.jsx("span",{className:"small-dot",children:"●"}),o&&f?`${o} ${f}`:"N/A"]}),r.jsxs("div",{className:"info-wr-2",children:[r.jsxs("span",{className:"info-wr-1",children:[r.jsx("i",{className:"mng mng-lnc-thumbs-up--filled"}),r.jsx("span",{children:s})]}),r.jsxs("span",{className:"info-wr-1",children:[r.jsx("i",{className:"mng mng-lnc-messages-filled"}),r.jsx("span",{children:p})]})]})]}),r.jsx("div",{className:"text-wr-title",children:i}),r.jsx("div",{className:"text-wr",children:n})]}),r.jsx("div",{className:"tags-wr",children:u==null?void 0:u.map((a,e)=>r.jsx(y.BlogTag,{color:a==null?void 0:a.color,children:a==null?void 0:a.name},e))})]})}),$=m.forwardRef(({},t)=>r.jsxs(k,{className:"blog-card",children:[r.jsx("div",{className:"skeleton-img"}),r.jsxs(N,{children:[r.jsx("div",{className:"info-wr"}),r.jsx("div",{className:"skeleton-title"}),r.jsx("div",{className:"info-wr-skeleton"})]})]})),B=({limit:t=3,isLoading:l=!1,keyPrefix:i})=>r.jsx(r.Fragment,{children:Array.from({length:t},(d,n)=>r.jsx($,{isLoading:l},`${i}-skeleton-product-card-${n}`))}),P=({children:t,fallbackComponent:l=r.jsx(r.Fragment,{}),isLoading:i=!1,limit:d,keyPrefix:n})=>r.jsx(m.Suspense,{fallbackComponent:l,children:i===!0?r.jsx(B,{isLoading:i,limit:d,keyPrefix:n}):t}),b=m.memo(O),R=m.forwardRef((t,l)=>{const{icon:i,title:d,onButtonAction:n,items:s,buttonText:p,limit:o=3,onSelectCard:g=()=>{},isLoading:u=!1,buttonLink:h}=t,f=S.useDetectMobile(),a=m.useMemo(()=>r.jsx(r.Fragment,{children:f===!0?s==null?void 0:s.map((e,j)=>r.jsx(b,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,datePublished:e==null?void 0:e.date,readDuration:e==null?void 0:e.readDuration,tags:e==null?void 0:e.tags,onCardClick:()=>g(e==null?void 0:e.uuid)},j)):s==null?void 0:s.slice(0,o).map((e,j)=>r.jsx(b,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,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,datePublished:e==null?void 0:e.date,readDuration:e==null?void 0:e.readDuration,onCardClick:()=>g(e==null?void 0:e.uuid)},j))}),[s,f,o,g]);return r.jsxs(y.RegulatTitleSectionWrapper,{ref:l,children:[r.jsxs("div",{className:"regular-title",children:[r.jsxs("div",{className:"regular-title-text",children:[c.isDefinedNotEmptyString(i)&&r.jsx("i",{className:i}),r.jsx("span",{children:d})]}),c.isDefinedNotEmptyString(n)&&r.jsx(C,{type:"button",btnType:"tinted",color:"gray",onClick:()=>n(h),borderRadius:"curved",children:p})]}),r.jsx(D,{limit:o,children:r.jsx(P,{isLoading:u,limit:o,keyPrefix:"explore-landing",children:a})})]})});module.exports=R;