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

React component library

"use strict";const t=require("react/jsx-runtime"),j=require("react"),v=require("./useDetectMobile-DYV6V1yw.cjs"),k=require("./style-cJUZrJoG.cjs"),m=require("./utils-BK6B_Y9X.cjs"),$=require("./Button.cjs"),h=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),f=require("./breakpoints-CcVm-gVm.cjs"),g=require("./style-17Ie7d9D.cjs"),N=h.styled.div`
  display: grid;
  grid-template-columns: ${r=>`repeat(${r.limit},  minmax(0, 1fr))`};
  gap: 1.25rem;

  @media ${f.down("M")} {
    grid-template-columns: repeat(2, 1fr);
  }

  @media ${f.down("S")} {
    grid-template-columns: repeat(2, 1fr);
  }

  @media ${f.down("XS")} {
    grid-template-columns: repeat(1, 1fr);
  }
`,R=h.styled.a`
  text-decoration: none;
  color: var(--gray-950);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: var(--transition);

  & .text-wrap {
    text-align: center;
  }
  & img {
    transition: var(--transition, all 0.3s ease);
    overflow: hidden;
  }
  &:hover {
    & img {
      transform: scale(1.1);
    }
  }
`,q=h.styled.div`
  width: 100%;
  min-height: 11rem;
  max-height: 11rem;
  position: relative;
  border-radius: 0.75rem;
  border: 1px solid var(--warning-500, #f59e0b);
  overflow: hidden;

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

  & .price-tag {
    display: flex;
    align-items: center;
    justify-content: center;
    filter: drop-shadow(1px 1px 0px #b45309);
    background-color: var(--warning-500, #f59e0b);
    color: var(--white, #fff);
    width: 75.35525%;
    height: 2.5rem;
    font-weight: 600;
    font-size: 0.875rem;
    position: absolute;
    left: -4.5rem;
    top: 1rem;
    z-index: 2;

    -moz-transform: rotate(315deg);
    -o-transform: rotate(315deg);
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
  }
`,b=j.forwardRef((r,n)=>{const{image:o,text:c,price:s,currency:i,onSelectGiftCard:u=()=>{},selectAction:l,LinkComponent:d}=r,p=d||"a";return t.jsxs(R,{ref:n,className:"simple-gift-card",onClick:()=>u(s),as:p,...d?{to:`${l}`}:{href:`${l}`},children:[t.jsxs(q,{children:[t.jsx("div",{className:"price-tag",children:s&&i&&`${m.formatPrice(s)} ${m.GetCurrencySymbol(i)}`}),t.jsx("img",{src:o})]}),t.jsx("div",{className:"text-wrap",children:c})]})}),G=h.styled(g.SkeletonAnimationContainer)`
  @media ${f.down("S")} {
    flex-direction: column;

    & > div {
      flex-direction: column;
    }
  }
`,A=({keyPrefix:r})=>t.jsx(G,{children:[1,2,3,4].map(n=>t.jsxs(g.SkeletonColumnContainer,{alignItems:"center",children:[t.jsx(g.SkeletonRect,{width:"100%",height:"11rem",borderRadius:"0.75rem"}),t.jsx(g.SkeletonRect,{height:"1.25rem",borderRadius:"0.75rem",width:"5rem"})]},`${r}-${n}`))}),D=({keyPrefix:r,isLoading:n=!1,fallbackComponent:o=t.jsx(t.Fragment,{}),children:c})=>t.jsx(j.Suspense,{fallbackComponent:o,children:n===!0?t.jsx(A,{keyPrefix:r}):c}),T=j.forwardRef((r,n)=>{const{icon:o,title:c,buttonLink:s,items:i,isLoading:u=!1,buttonText:l,limit:d=4,onSelectCard:p=()=>{},onButtonAction:w=()=>{},LinkComponent:y}=r,S=v.useDetectMobile();return t.jsxs(k.RegulatTitleSectionWrapper,{ref:n,className:"lp-section lp-gift-cards-section",children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[m.isDefinedNotEmptyString(o)&&t.jsx("i",{className:o}),t.jsx("span",{children:c})]}),m.isDefinedNotEmptyString(l)&&m.isDefinedNotEmptyString(s)&&!u&&t.jsx($,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var a;(a=e==null?void 0:e.target)==null||a.blur(),w(s)},borderRadius:"curved",className:"button-link",children:l})]}),t.jsx(D,{isLoading:u,keyPrefix:"gift-cards-skeleton",children:t.jsx(N,{limit:d,children:S===!0?i==null?void 0:i.map((e,a)=>t.jsx(b,{text:e==null?void 0:e.text,price:e==null?void 0:e.priceTo,currency:e==null?void 0:e.currencyIsoCode,image:e==null?void 0:e.imageUrl,uuid:e==null?void 0:e.uuid,selectAction:e==null?void 0:e.selectAction,onSelectGiftCard:C=>p(e),LinkComponent:y},a)):i==null?void 0:i.slice(0,d).map((e,a)=>t.jsx(b,{text:e==null?void 0:e.text,price:e==null?void 0:e.priceTo,currency:e==null?void 0:e.currencyIsoCode,image:e==null?void 0:e.imageUrl,uuid:e==null?void 0:e.uuid,selectAction:e==null?void 0:e.selectAction,onSelectGiftCard:C=>p(e),LinkComponent:y},a))})})]})});module.exports=T;