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

React component library

"use strict";const a=require("react/jsx-runtime"),s=require("react"),L=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),u=require("./breakpoints-CcVm-gVm.cjs"),T=require("./useDetectMobile-DYV6V1yw.cjs"),D=require("./Button.cjs"),j=require("./index-BLapl_Sv.cjs"),Q=L.styled.div`
  padding: 1.75rem 3rem;
  display: grid;
  grid-template-columns: ${t=>`repeat(${t.limit||5},  minmax(0, 1fr))`};

  gap: 2.97rem;

  border: 1.5px solid var(--danger-600, #e11d48);
  background-color: var(--danger-50, #fff1f2);
  position: relative;
  border-radius: 0.75rem;
  position: relative;

  & .urgent-tag {
    position: absolute;
    left: 1rem;
    top: -0.75rem;
    min-height: 1.5rem;
    max-height: 1.5rem;
    border-radius: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.25rem;
    gap: 0.12rem;
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--white, #fff);
    background-color: var(--danger-600, #e11d48);
  }

  & .show-more {
    grid-column: 1 / 3;
  }

  & .product-card {
    max-width: ${t=>`calc(${100/t.desktopCols}% - ${(t.desktopCols-1)*t.columnGapRem/t.desktopCols}rem)`};

    animation-duration: 0.2s;
    animation-name: animate-fade;
    animation-delay: 0.2s;
    animation-fill-mode: backwards;
    transition: all 0.25s ease;

    @keyframes animate-fade {
      0% {
        transform: scale(0.9);
        -webkit-transform: scale(0.9);
      }
      100% {
        transform: scale(1);
        -webkit-transform: scale(1);
      }
    }
  }

  @media ${u.down("M")} {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 2rem 2rem;
    gap: 1.5rem;
  }

  @media ${u.down("S")} {
    grid-template-columns: repeat(2, 1fr);
    padding: 2rem 1.25rem;
    gap: 1.19rem;

    & .product-card {
      & img {
        width: 100%;
        height: 100%;
      }
    }
  }

  @media ${u.down("XS")} {
    display: flex;
    flex-direction: column;
  }
`,N=s.memo(j.DetailedProductCard),R=s.forwardRef((t,q)=>{const{items:r,limit:n=5,limitMobile:l=4,onSelectCard:g=()=>{},title:P="Urgent sale",showLessText:U="Show less",showMoreText:F="Show more",isLoading:p=!1,getImage:h=()=>{},negotiableText:f,freeText:b,onBookmark:k=()=>{},actionComponent:S,componentName:C,sponsoredText:y,LinkComponent:w}=t,d=T.useDetectMobile(),[o,v]=s.useState(!1),M=s.useMemo(()=>{var i;return a.jsx(a.Fragment,{children:d===!0?(i=r==null?void 0:r.slice(0,o===!0?r==null?void 0:r.length:l))==null?void 0:i.map((e,m)=>a.jsx(N,{sellerName:e==null?void 0:e.sellerName,name:e==null?void 0:e.name,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,categoryCode:e==null?void 0:e.categoryCode,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,sponsored:e==null?void 0:e.sponsored,onSelectCard:($,c)=>g({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:c}),nameSlug:e==null?void 0:e.nameSlug,image:e==null?void 0:e.image,imageUrl:h(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,imageComponent:e==null?void 0:e.imageComponent,negotiableText:f,freeText:b,onBookmark:k,actionComponent:S,bookmarked:e==null?void 0:e.bookmarked,bookmarkLists:e==null?void 0:e.bookmarkLists,metadata:{name:C,accessor:e==null?void 0:e.accessor},tags:e==null?void 0:e.tags,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,hasQuantities:e==null?void 0:e.hasQuantities,status:e==null?void 0:e.status,trade:e==null?void 0:e.trade,forCart:e==null?void 0:e.forCart,sponsoredText:y,LinkComponent:w,hasFreeShipping:e==null?void 0:e.hasFreeShipping},m)):r==null?void 0:r.slice(0,n).map((e,m)=>a.jsx(N,{name:e==null?void 0:e.name,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,categoryCode:e==null?void 0:e.categoryCode,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,sponsored:e==null?void 0:e.sponsored,onSelectCard:($,c)=>g({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:c}),nameSlug:e==null?void 0:e.nameSlug,image:e==null?void 0:e.image,imageUrl:h(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,imageComponent:e==null?void 0:e.imageComponent,negotiableText:f,freeText:b,onBookmark:k,actionComponent:S,bookmarked:e==null?void 0:e.bookmarked,bookmarkLists:e==null?void 0:e.bookmarkLists,metadata:{name:C,accessor:e==null?void 0:e.accessor},tags:e==null?void 0:e.tags,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,hasQuantities:e==null?void 0:e.hasQuantities,status:e==null?void 0:e.status,trade:e==null?void 0:e.trade,forCart:e==null?void 0:e.forCart,sponsoredText:y,sellerName:e==null?void 0:e.sellerName,LinkComponent:w,hasFreeShipping:e==null?void 0:e.hasFreeShipping},m))})},[r,d,n,l,o]);return a.jsx(j.SuspenseDetailedProductCard,{isLoading:p,keyPrefix:"urgent-sale-products-skeleton",children:a.jsxs(Q,{ref:q,limit:n,className:"lp-section lp-urgent-sale-products-section",children:[a.jsxs("div",{className:"urgent-tag",children:[a.jsx("i",{className:"mng mng-lnc-bolt-filled"}),a.jsx("span",{children:P})]})," ",M," ",d===!0&&l<(r==null?void 0:r.length)&&!p&&a.jsx(D,{className:"show-more",btnType:"basic",type:"button",color:"neutral",onClick:i=>{var e;(e=i==null?void 0:i.target)==null||e.blur(),v(!o)},children:o===!0?U:F})]})})});module.exports=R;