@lanaco/lnc-react-ui/dist/CategorySimpleCard-Dr1FxIY9.cjs

React component library

"use strict";const e=require("react/jsx-runtime"),g=require("react"),x=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),n=require("./utils-BK6B_Y9X.cjs"),u=require("./breakpoints-CcVm-gVm.cjs"),p=x.styled.a`
  text-decoration: none;
  display: flex;
  flex-direction: column;
  gap: 0;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--gray-950, #14161a);
  min-height: 12.25rem;
  max-height: 12.25rem;
  border-radius: 0.75rem;
  border: 1px solid var(--gray-95008, rgba(20, 22, 26, 0.08));
  background: var(--white, #fff);
  cursor: pointer;

  transition: var(--transition);

  /* drop-shadow-sm */
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
  overflow: hidden;

  & .card-content {
    padding: 0.75rem;
    ${n.truncateTextInRows(2)}
  }

  & .card-content-2 {
    ${n.truncateTextInRows(2)}
  }

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

  @media ${u.down("S")} {
    min-width: 8.75rem;
    max-width: 8.75rem;

    & .img,
    .skeleton-img {
      min-height: 5.375rem;
      max-height: 5.375rem;
    }
  }
`,f=g.forwardRef((a,s)=>{const{image:c,name:d,urlPrefix:r,urlSufix:t,code:i,uuid:m,onSelectCard:h=()=>{},LinkComponent:o}=a,l=o||"a";return e.jsxs(p,{ref:s,className:"simple-category-card",onClick:()=>h(m),as:l,...o?{to:`${r}${i}${t}`}:{href:`${r}${i}${t}`},children:[e.jsx("img",{src:c}),e.jsx("div",{className:"card-content",children:e.jsx("div",{className:"card-content-2",children:d})})]})});exports.CategorySimpleCard=f;