@lanaco/lnc-react-ui/dist/index-Fnc5qY9b.cjs

React component library

"use strict";const e=require("react/jsx-runtime"),c=require("react"),d=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),l=require("./breakpoints-CcVm-gVm.cjs"),w=require("./utils-BK6B_Y9X.cjs"),f=require("./useDetectMobile-DYV6V1yw.cjs"),m=require("./Button.cjs"),y=require("./index-DOkcmaFO.cjs"),v=d.styled.a`
  text-decoration: none;
  color: var(--gray-950);
  display: flex;
  width: 100%;
  gap: 1.25rem;
  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);
  border-radius: 0.75rem;
  border: 1px solid var(--gray-95008);
  overflow: hidden;
  max-height: 11.25rem;
  min-height: 11.25rem;

  &:hover {
    cursor: pointer;
  }

  & img {
    max-height: 11.25rem;
    min-height: 11.25rem;
    min-width: 11.25rem;
    max-width: 11.25rem;
    object-fit: cover;
    width: 100%;
    border-radius: 0.75rem 0 0 0.75rem;
  }

  @media ${l.down("S")} {
    padding: 1rem;
    column-gap: 1.5rem;
    row-gap: 1rem;
    display: grid;
    grid-template-columns: repeat(2, auto);
    max-height: 100%;
    min-height: 100%;
    & .action {
      grid-column: 1 / 3;
    }

    & img {
      max-height: 7.75rem;
      min-height: 7.75rem;
      min-width: 7.75rem;
      max-width: 7.75rem;
      border-radius: 0.75rem;
    }

    & button {
      width: 100%;
      margin-top: auto;
    }
  }
`,j=d.styled.div`
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  color: var(--gray-950, #14161a);

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

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

  & button {
    width: fit-content;
    margin-top: auto;
  }

  @media ${l.down("S")} {
    padding: 0;
  }
`,C=c.forwardRef((g,q)=>{const{title:u,imageUrl:h,text:p,onCardClick:t,buttonText:o,metadata:r,titleSlug:i,LinkComponent:n}=g,x=n||"a",a=f.useDetectMobile(),s=c.useRef();return e.jsxs(v,{ref:s,className:"blog-card","data-accessor":r==null?void 0:r.accessor,name:r==null?void 0:r.name,onClick:b=>t(b,s),as:x,...n?{to:`/blog/${i}`}:{href:`/blog/${i}`},children:[e.jsx(y.ProductImageWrapper,{src:h}),e.jsxs(j,{children:[e.jsx("div",{className:"text-wr-title",children:u}),e.jsx("div",{className:"text-wr",children:p}),a!==!0&&e.jsx(m,{type:"button",btnType:"outline",size:"medium",color:"gray",onClick:t,children:o})]}),a===!0&&e.jsx(m,{className:"action",type:"button",btnType:"outline",size:"medium",color:"gray",onClick:t,children:o})]})});exports.BlogCardLarge=C;