@lanaco/lnc-react-ui 4.0.138 → 4.0.139

package/dist/DetailedProductsSection.cjs

@@ -1,13 +1,13 @@
-"use strict";const i=require("react/jsx-runtime"),s=require("react"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),D=require("./consts-goSZX3xP.cjs"),U=require("./Button.cjs"),y=require("./utils-Dl9xPH4c.cjs"),M=require("./useDetectMobile-zkbzoOGV.cjs"),F=require("./style-CyHewQxg.cjs"),h=require("./suspense-product-card-detailed-BJLmsTWB.cjs"),T=require("./index-D0xXo7W6.cjs"),E=v.styled.div`
+"use strict";const i=require("react/jsx-runtime"),s=require("react"),k=require("./emotion-styled.browser.esm-BtEseadx.cjs"),v=require("./consts-goSZX3xP.cjs"),D=require("./Button.cjs"),y=require("./utils-Dl9xPH4c.cjs"),U=require("./useDetectMobile-zkbzoOGV.cjs"),M=require("./style-CyHewQxg.cjs"),C=require("./suspense-product-card-detailed-DXSdrL-5.cjs"),F=require("./index-D0xXo7W6.cjs"),T=k.styled.div`
   display: grid;
-  grid-template-columns: ${r=>`repeat(${r.limit},  minmax(0, 1fr))`};
-  gap: ${r=>(r==null?void 0:r.gap)||"1.25rem"};
+  grid-template-columns: ${l=>`repeat(${l.limit},  minmax(0, 1fr))`};
+  gap: 1.25rem;
 
   & .button-link {
     white-space: nowrap;
   }
 
-  @media (max-width: ${D.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
     display: flex;
     gap: 1rem;
     overflow-x: auto;
@@ -26,4 +26,4 @@
       /* Safari and Chrome */
     }
   }
-`,S=s.memo(h.DetailedProductCard),R=s.forwardRef((r,f)=>{const{icon:a,title:j,buttonLink:c,items:t,buttonText:w,limit:o=4,gap:C,onSelectCard:u=()=>{},onButtonAction:P=()=>{},isLoading:N=!1,getImage:d=()=>{},negotiableText:m,freeText:g,options:l,onSelectOption:p=()=>{},productsToolbarName:q="All"}=r,b=M.useDetectMobile(),k=s.useMemo(()=>i.jsx(i.Fragment,{children:b===!0?t==null?void 0:t.map((e,n)=>i.jsx(S,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>u(e==null?void 0:e.uuid),imageUrl:d(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g},n)):t==null?void 0:t.slice(0,o).map((e,n)=>i.jsx(S,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>u(e==null?void 0:e.uuid),imageUrl:d(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g},n))}),[t,b,o]);return i.jsxs(F.TitleWithOptionsSectionWrapper,{ref:f,children:[i.jsxs("div",{className:"regular-title",children:[i.jsxs("div",{className:"regular-title-text",children:[y.isDefinedNotEmptyString(a)&&i.jsx("i",{className:a}),i.jsx("span",{children:j})]}),y.isDefinedNotEmptyString(c)&&i.jsx(U,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var n;(n=e==null?void 0:e.target)==null||n.blur(),P(c)},borderRadius:"curved",className:"button-link",children:w})]}),(l==null?void 0:l.length)>0&&i.jsx(T.SelectBar,{items:l,onRemove:e=>{p(e)},onSelect:e=>{p(e)},labelKey:"name",valueKey:"code",noMargin:!0,productsToolbarName:q}),i.jsx(E,{limit:o,gap:C,children:i.jsx(h.SuspenseDetailedProductCard,{isLoading:N,limit:o,keyPrefix:"explore-landing",children:k})})]})});module.exports=R;
+`,S=s.memo(C.DetailedProductCard),E=s.forwardRef((l,h)=>{const{icon:a,title:f,buttonLink:c,items:t,buttonText:q,limit:o=4,onSelectCard:d=()=>{},onButtonAction:j=()=>{},isLoading:w=!1,getImage:u=()=>{},negotiableText:m,freeText:g,options:n,onSelectOption:p=()=>{},productsToolbarName:P="All"}=l,b=U.useDetectMobile(),N=s.useMemo(()=>i.jsx(i.Fragment,{children:b===!0?t==null?void 0:t.map((e,r)=>i.jsx(S,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>d(e==null?void 0:e.uuid),imageUrl:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g,tags:e==null?void 0:e.tags,categoryCode:e==null?void 0:e.categoryCode,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,trade:e==null?void 0:e.trade},r)):t==null?void 0:t.slice(0,o).map((e,r)=>i.jsx(S,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,sellingPrice:e==null?void 0:e.sellingPrice,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>d(e==null?void 0:e.uuid),imageUrl:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:g,tags:e==null?void 0:e.tags,categoryCode:e==null?void 0:e.categoryCode,condition:e==null?void 0:e.condition,quantity:e==null?void 0:e.quantity,trade:e==null?void 0:e.trade},r))}),[t,b,o]);return i.jsxs(M.TitleWithOptionsSectionWrapper,{ref:h,children:[i.jsxs("div",{className:"regular-title",children:[i.jsxs("div",{className:"regular-title-text",children:[y.isDefinedNotEmptyString(a)&&i.jsx("i",{className:a}),i.jsx("span",{children:f})]}),y.isDefinedNotEmptyString(c)&&i.jsx(D,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var r;(r=e==null?void 0:e.target)==null||r.blur(),j(c)},borderRadius:"curved",className:"button-link",children:q})]}),(n==null?void 0:n.length)>0&&i.jsx(F.SelectBar,{items:n,onRemove:e=>{p(e)},onSelect:e=>{p(e)},labelKey:"name",valueKey:"code",noMargin:!0,productsToolbarName:P}),i.jsx(T,{limit:o,children:i.jsx(C.SuspenseDetailedProductCard,{isLoading:w,limit:o,keyPrefix:"explore-landing",children:N})})]})});module.exports=E;

package/dist/DetailedProductsSection.js

@@ -1,23 +1,23 @@
-import { jsx as i, Fragment as U, jsxs as a } from "react/jsx-runtime";
-import { memo as M, forwardRef as T, useMemo as D } from "react";
-import { s as F } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as B } from "./consts-BuFChS64.js";
-import E from "./Button.js";
+import { jsx as i, Fragment as v, jsxs as l } from "react/jsx-runtime";
+import { memo as U, forwardRef as M, useMemo as T } from "react";
+import { s as D } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as F } from "./consts-BuFChS64.js";
+import q from "./Button.js";
 import { k as f } from "./utils-BdsZgOUE.js";
-import { u as I } from "./useDetectMobile-Bkvj0VMa.js";
-import { T as $ } from "./style-DFPWLJBr.js";
-import { D as L, S as O } from "./suspense-product-card-detailed-D6191kXr.js";
-import { S as R } from "./index-Dweo-G3H.js";
-const W = F.div`
+import { u as B } from "./useDetectMobile-Bkvj0VMa.js";
+import { T as E } from "./style-DFPWLJBr.js";
+import { D as I, S as L } from "./suspense-product-card-detailed-DIWv_91e.js";
+import { S as O } from "./index-Dweo-G3H.js";
+const R = D.div`
   display: grid;
-  grid-template-columns: ${(r) => `repeat(${r.limit},  minmax(0, 1fr))`};
-  gap: ${(r) => (r == null ? void 0 : r.gap) || "1.25rem"};
+  grid-template-columns: ${(n) => `repeat(${n.limit},  minmax(0, 1fr))`};
+  gap: 1.25rem;
 
   & .button-link {
     white-space: nowrap;
   }
 
-  @media (max-width: ${B + "px"}) {
+  @media (max-width: ${F + "px"}) {
     display: flex;
     gap: 1rem;
     overflow-x: auto;
@@ -36,32 +36,31 @@ const W = F.div`
       /* Safari and Chrome */
     }
   }
-`, S = M(L), J = T((r, h) => {
+`, y = U(I), H = M((n, S) => {
   const {
     icon: s,
-    title: y,
+    title: C,
     buttonLink: d,
-    items: o,
-    buttonText: w,
-    limit: l = 4,
-    gap: C,
+    items: t,
+    buttonText: h,
+    limit: o = 4,
     onSelectCard: c = () => {
     },
-    onButtonAction: P = () => {
+    onButtonAction: w = () => {
     },
-    isLoading: k = !1,
+    isLoading: P = !1,
     getImage: m = () => {
     },
     negotiableText: u,
     freeText: p,
-    options: n,
+    options: a,
     onSelectOption: g = () => {
     },
-    productsToolbarName: N = "All"
-  } = r, b = I(), v = D(() => /* @__PURE__ */ i(U, { children: b === !0 ? o == null ? void 0 : o.map((e, t) => /* @__PURE__ */ i(
-    S,
+    productsToolbarName: k = "All"
+  } = n, b = B(), N = T(() => /* @__PURE__ */ i(v, { children: b === !0 ? t == null ? void 0 : t.map((e, r) => /* @__PURE__ */ i(
+    y,
     {
-      title: e == null ? void 0 : e.name,
+      title: e == null ? void 0 : e.title,
       price: e == null ? void 0 : e.price,
       sellingPrice: e == null ? void 0 : e.sellingPrice,
       currency: e == null ? void 0 : e.currency,
@@ -75,13 +74,18 @@ const W = F.div`
       isFree: e == null ? void 0 : e.isFree,
       isNegotiable: e == null ? void 0 : e.isNegotiable,
       negotiableText: u,
-      freeText: p
+      freeText: p,
+      tags: e == null ? void 0 : e.tags,
+      categoryCode: e == null ? void 0 : e.categoryCode,
+      condition: e == null ? void 0 : e.condition,
+      quantity: e == null ? void 0 : e.quantity,
+      trade: e == null ? void 0 : e.trade
     },
-    t
-  )) : o == null ? void 0 : o.slice(0, l).map((e, t) => /* @__PURE__ */ i(
-    S,
+    r
+  )) : t == null ? void 0 : t.slice(0, o).map((e, r) => /* @__PURE__ */ i(
+    y,
     {
-      title: e == null ? void 0 : e.name,
+      title: e == null ? void 0 : e.title,
       price: e == null ? void 0 : e.price,
       sellingPrice: e == null ? void 0 : e.sellingPrice,
       currency: e == null ? void 0 : e.currency,
@@ -96,36 +100,41 @@ const W = F.div`
       isFree: e == null ? void 0 : e.isFree,
       isNegotiable: e == null ? void 0 : e.isNegotiable,
       negotiableText: u,
-      freeText: p
+      freeText: p,
+      tags: e == null ? void 0 : e.tags,
+      categoryCode: e == null ? void 0 : e.categoryCode,
+      condition: e == null ? void 0 : e.condition,
+      quantity: e == null ? void 0 : e.quantity,
+      trade: e == null ? void 0 : e.trade
     },
-    t
-  )) }), [o, b, l]);
-  return /* @__PURE__ */ a($, { ref: h, children: [
-    /* @__PURE__ */ a("div", { className: "regular-title", children: [
-      /* @__PURE__ */ a("div", { className: "regular-title-text", children: [
+    r
+  )) }), [t, b, o]);
+  return /* @__PURE__ */ l(E, { ref: S, children: [
+    /* @__PURE__ */ l("div", { className: "regular-title", children: [
+      /* @__PURE__ */ l("div", { className: "regular-title-text", children: [
         f(s) && /* @__PURE__ */ i("i", { className: s }),
-        /* @__PURE__ */ i("span", { children: y })
+        /* @__PURE__ */ i("span", { children: C })
       ] }),
       f(d) && /* @__PURE__ */ i(
-        E,
+        q,
         {
           type: "button",
           btnType: "tinted",
           color: "neutral",
           onClick: (e) => {
-            var t;
-            (t = e == null ? void 0 : e.target) == null || t.blur(), P(d);
+            var r;
+            (r = e == null ? void 0 : e.target) == null || r.blur(), w(d);
           },
           borderRadius: "curved",
           className: "button-link",
-          children: w
+          children: h
         }
       )
     ] }),
-    (n == null ? void 0 : n.length) > 0 && /* @__PURE__ */ i(
-      R,
+    (a == null ? void 0 : a.length) > 0 && /* @__PURE__ */ i(
+      O,
       {
-        items: n,
+        items: a,
         onRemove: (e) => {
           g(e);
         },
@@ -135,20 +144,20 @@ const W = F.div`
         labelKey: "name",
         valueKey: "code",
         noMargin: !0,
-        productsToolbarName: N
+        productsToolbarName: k
       }
     ),
-    /* @__PURE__ */ i(W, { limit: l, gap: C, children: /* @__PURE__ */ i(
-      O,
+    /* @__PURE__ */ i(R, { limit: o, children: /* @__PURE__ */ i(
+      L,
       {
-        isLoading: k,
-        limit: l,
+        isLoading: P,
+        limit: o,
         keyPrefix: "explore-landing",
-        children: v
+        children: N
       }
     ) })
   ] });
 });
 export {
-  J as default
+  H as default
 };

package/dist/UrgentSaleProductsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const i=require("react/jsx-runtime"),n=require("react"),P=require("./emotion-styled.browser.esm-BtEseadx.cjs"),f=require("./consts-goSZX3xP.cjs"),v=require("./useDetectMobile-zkbzoOGV.cjs"),q=require("./Button.cjs"),b=require("./suspense-product-card-detailed-BJLmsTWB.cjs"),C=P.styled.div`
+"use strict";const i=require("react/jsx-runtime"),n=require("react"),P=require("./emotion-styled.browser.esm-BtEseadx.cjs"),f=require("./consts-goSZX3xP.cjs"),v=require("./useDetectMobile-zkbzoOGV.cjs"),q=require("./Button.cjs"),b=require("./suspense-product-card-detailed-DXSdrL-5.cjs"),C=P.styled.div`
   padding: 1.75rem 3rem;
   display: grid;
   grid-template-columns: ${t=>`repeat(${t.limit||5},  minmax(0, 1fr))`};

package/dist/UrgentSaleProductsSection.js

@@ -4,7 +4,7 @@ import { s as C } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as L, S as F } from "./consts-BuFChS64.js";
 import { u as I } from "./useDetectMobile-Bkvj0VMa.js";
 import T from "./Button.js";
-import { D as _, S as D } from "./suspense-product-card-detailed-D6191kXr.js";
+import { D as _, S as D } from "./suspense-product-card-detailed-DIWv_91e.js";
 const E = C.div`
   padding: 1.75rem 3rem;
   display: grid;

package/dist/suspense-product-card-detailed-DIWv_91e.js

@@ -0,0 +1,475 @@
+import { jsxs as o, jsx as r, Fragment as S } from "react/jsx-runtime";
+import { forwardRef as V, useState as x, Suspense as ee } from "react";
+import { p as re, t as I, o as u, l as oe, q as D, G as j } from "./utils-BdsZgOUE.js";
+import { s as w } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { P as ne } from "./index-CF3HhgvN.js";
+import v from "./Badge.js";
+import ae from "./Popover.js";
+import te from "./PopoverTrigger.js";
+import ie from "./PopoverContent.js";
+import { u as se } from "./useDetectMobile-Bkvj0VMa.js";
+import { M as W } from "./consts-BuFChS64.js";
+const G = w.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  cursor: pointer;
+
+  & .wrapper-card-1 {
+    display: flex;
+    flex-direction: column;
+    gap: 0.38rem;
+  }
+
+  & .wrapper-card-2 {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+  }
+
+  & .wrapper-card-3 {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.25rem;
+  }
+
+  & .tag {
+    height: 1.5rem;
+    gap: 0.25rem;
+    padding: 0.25rem 0.375rem;
+    border-radius: 0.375rem;
+    background: #f9fafb;
+    border: 1px solid var(--gray-95012, #14161a1f);
+    font-weight: 400;
+    font-size: 0.75rem;
+    line-height: 1rem;
+    letter-spacing: 0.025rem;
+    color: var(--gray-950, #14161a);
+
+    &.tag-sponsored {
+      & i {
+        color: var(--yellow-500, #f59e0b);
+      }
+    }
+  }
+
+  & .tag-mobile {
+    font-weight: 400;
+    font-size: 0.75rem;
+    line-height: 1rem;
+    letter-spacing: 0.025rem;
+    color: var(--gray-600, #676e79);
+  }
+
+  & .card-title {
+    font-size: 0.875rem;
+    font-weight: 600;
+    ${re(2)}
+  }
+
+  & .price-text {
+    font-size: 1rem;
+    font-weight: 600;
+    ${I()}
+    display: flex;
+    align-items: end;
+    gap: 0.5rem;
+
+    & .full-price {
+      text-decoration: line-through;
+      font-size: 0.75rem;
+      font-weight: 400;
+      padding-bottom: 0.125rem;
+      color: var(--danger-600, #e11d48);
+    }
+  }
+
+  & .location-text {
+    font-size: 0.75rem;
+    font-weight: 400;
+    color: var(--gray-600, #676e79);
+    ${I()}
+  }
+
+  & .tags-wrapper {
+    display: flex;
+    gap: 0.5rem;
+  }
+
+  & .skeleton-img {
+    background-color: ${u("-90deg")};
+    border-radius: 0.75rem;
+    border: 1px solid white;
+  }
+
+  & .skeleton-title {
+    background-color: ${u("-90deg")};
+    width: 100%;
+    height: 2.5rem;
+  }
+
+  & .skeleton-tags {
+    background-color: ${u("-90deg")};
+    width: 80%;
+    height: 1.5rem;
+  }
+
+  & .skeleton-price {
+    background-color: ${u("-90deg")};
+    width: 50%;
+    height: 2.5rem;
+  }
+
+  & .skeleton-sponsored {
+    background-color: ${u("-90deg")};
+    width: 50%;
+    height: 1rem;
+  }
+
+  & .tags-popover__trigger {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.25rem;
+  }
+
+  @media (max-width: ${W + "px"}) {
+    & .price-text {
+      font-size: 0.875rem;
+      font-weight: 600;
+
+      & .full-price {
+        display: none;
+      }
+    }
+  }
+
+  &:hover .product-image-wrapper img {
+    transform: scale(1.1);
+  }
+`, ce = w.div`
+  position: relative;
+  overflow: hidden;
+  border-radius: 0.75rem;
+  width: 100%;
+  aspect-ratio: 1 / 1;
+  border: 1px solid #0c15201f;
+
+  & img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    border-radius: 0.75rem;
+    transition: var(--transition, all 0.3s ease);
+  }
+
+  @media (max-width: ${W + "px"}) {
+    & img {
+      width: 8.875rem;
+      height: 8.875rem;
+      min-width: 8.875rem;
+      min-height: 8.875rem;
+      object-fit: cover;
+    }
+  }
+`, le = w.div`
+  background: var(--white, #fff);
+  z-index: 1;
+
+  border: 1px solid var(--gray-200, #dddfe4);
+  border-radius: 0.5rem;
+  line-height: 1rem;
+  position: absolute;
+  padding: 0.5rem 0.75rem;
+  top: 0.5rem;
+  left: 25%;
+  transform: translateX(-50%);
+  min-width: 10rem;
+
+  &::before,
+  &::after {
+    content: "";
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    border-style: solid;
+    border-width: 0.625rem;
+  }
+
+  &::after {
+    top: -1.1875rem;
+    border-color: transparent transparent var(--white, #fff) transparent;
+  }
+
+  &::before {
+    top: -1.25rem;
+    border-color: transparent transparent var(--gray-200, #dddfe4) transparent;
+  }
+
+  & .tags-popover__content {
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: column;
+    gap: 0.375rem;
+    font-size: 0.75rem;
+    font-weight: 400;
+
+    & .tags-popover__name {
+      color: var(--gray-600, #676e79);
+    }
+
+    & .tags-popover__value {
+      color: var(--gray-950, #14161a);
+    }
+  }
+`, de = w.div`
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+  color: var(--gray-500);
+  font-size:  0.75rem;
+  font-weight: 500;
+
+  & i {
+    font-size: 1rem;
+    color: var(--warning-500, #F59E0B);
+  }
+`, me = V(({ sponsoredText: a = "Sponsored" }, i) => /* @__PURE__ */ o(de, { ref: i, className: "sponsored-line", children: [
+  /* @__PURE__ */ r("i", { className: "mng-lnc-paw2" }),
+  /* @__PURE__ */ r("span", { children: a })
+] })), pe = "Vehicles_Cars", ge = "Vehicles_Motorcycles", ue = "Vehicles_Trucks", he = "Vehicles_AgriculturalMachines_Tractors", fe = "Vehicles_ConstructionMachines", ve = "Vehicles_Bus", we = "Vehicles_Campers", ye = "RealEstates_", n = {
+  Mileage: {
+    icon: "mng-lnc-road",
+    measure: "km"
+  },
+  YearOfProduction: {
+    icon: "mng-lnc-calendar",
+    measure: ""
+  },
+  Fuel: {
+    icon: "mng-lnc-gas-station",
+    measure: ""
+  },
+  EnginePowerKW: {
+    icon: "mng-lnc-engine",
+    measure: "kW"
+  },
+  Transmission: {
+    icon: "mng-lnc-transmission",
+    measure: ""
+  },
+  Model: {
+    icon: "mng-lnc-application",
+    measure: ""
+  },
+  Brand: {
+    icon: "mng-lnc-car--front",
+    measure: ""
+  },
+  SurfaceArea: {
+    icon: "mng-lnc-right-angle",
+    measure: ""
+  },
+  Floor: {
+    icon: "mng-lnc-elevator",
+    measure: ""
+  },
+  FurnishedCondition: {
+    icon: "mng-lnc-sofa-01",
+    measure: ""
+  },
+  AdType: {
+    icon: "mng-lnc-notes",
+    measure: ""
+  },
+  NumberOfRooms: {
+    icon: "mng-lnc-meeting-room",
+    measure: ""
+  },
+  HeatingType: {
+    icon: "mng-lnc-heat",
+    measure: ""
+  },
+  AirConditioning: {
+    icon: "mng-lnc-air-conditioner",
+    measure: ""
+  },
+  Type: {
+    icon: "mng-lnc-house-building",
+    measure: ""
+  },
+  Parking: {
+    icon: "mng-lnc-parking-area-circle",
+    measure: ""
+  },
+  Internet: {
+    icon: "mng-lnc-wifi-02",
+    measure: ""
+  },
+  State: {
+    icon: "mng-lnc-settings-1",
+    measure: ""
+  },
+  NumberOfPremises: {
+    icon: "mng-lnc-meeting-room",
+    measure: ""
+  },
+  Pool: {
+    icon: "mng-lnc-pool",
+    measure: ""
+  },
+  Approach: {
+    icon: "mng-lnc-driveway",
+    measure: ""
+  },
+  NumberOfBeds: {
+    icon: "mng-lnc-bed",
+    measure: ""
+  },
+  Kitchen: {
+    icon: "mng-lnc-fridge",
+    measure: ""
+  },
+  BathroomToilet: {
+    icon: "mng-lnc-bath",
+    measure: ""
+  },
+  default: {
+    icon: " mng-lnc-clock--filled",
+    measure: ""
+  }
+}, Be = V((a, i) => {
+  const {
+    title: s,
+    price: c = 0,
+    sellingPrice: t,
+    currency: h,
+    isNegotiable: y,
+    isFree: b,
+    imageUrl: X,
+    location: q,
+    isSponsored: E,
+    imageComponent: M,
+    onSelectCard: U = () => {
+    },
+    freeText: Y = "Free",
+    negotiableText: A = "Negotiable",
+    tags: l = [],
+    categoryCode: _,
+    condition: C,
+    quantity: N,
+    trade: k
+  } = a, P = se(), T = [
+    pe,
+    ge,
+    ue,
+    he,
+    fe,
+    ve,
+    we,
+    ye
+  ].some(
+    (e) => _ == null ? void 0 : _.includes(e)
+  ), [K, z] = x(!1), L = () => {
+    z(!0);
+  }, H = () => {
+    z(!1);
+  }, Z = () => /* @__PURE__ */ r("div", { className: "tags-popover__trigger", children: l == null ? void 0 : l.map((e, d) => {
+    var m, p, g, R, F;
+    const $ = ((m = n == null ? void 0 : n[e == null ? void 0 : e.code]) == null ? void 0 : m.icon) ?? ((p = n == null ? void 0 : n.default) == null ? void 0 : p.icon) ?? "", O = ((g = e == null ? void 0 : e.measurementUnit) == null ? void 0 : g.symbol) ?? ((R = n == null ? void 0 : n[e == null ? void 0 : e.code]) == null ? void 0 : R.measure) ?? "", f = [(e == null ? void 0 : e.value) ?? ((F = e == null ? void 0 : e.multiOptions) == null ? void 0 : F[0]) ?? "", O].filter(Boolean).join(" ");
+    return P ? /* @__PURE__ */ o("div", { className: "tag-mobile", children: [
+      f,
+      d === 0 ? " · " : ""
+    ] }) : /* @__PURE__ */ o(
+      v,
+      {
+        className: `tag ${E ? "tag-sponsored" : ""}`,
+        children: [
+          /* @__PURE__ */ r("i", { className: $ }),
+          f
+        ]
+      },
+      `detailed-products-section-tag__${d + 1}`
+    );
+  }) }), J = () => /* @__PURE__ */ r("div", { className: "tags-popover__content", children: l == null ? void 0 : l.map((e, d) => {
+    var m, p, g;
+    const $ = ((m = e == null ? void 0 : e.measurementUnit) == null ? void 0 : m.symbol) ?? ((p = n == null ? void 0 : n[e == null ? void 0 : e.code]) == null ? void 0 : p.measure) ?? "", B = [(e == null ? void 0 : e.value) ?? ((g = e == null ? void 0 : e.multiOptions) == null ? void 0 : g[0]) ?? "", $].filter(Boolean).join(" "), f = e == null ? void 0 : e.name;
+    return /* @__PURE__ */ o("div", { children: [
+      /* @__PURE__ */ r("span", { className: "tags-popover__name", children: `${f}: ` }),
+      /* @__PURE__ */ r("span", { className: "tags-popover__value", children: B })
+    ] }, `detailed-products-section-tag-dropdown__${d + 1}`);
+  }) }), Q = () => P ? [C, N, k].map((e, d) => /* @__PURE__ */ o("div", { className: "tag-mobile", children: [
+    e,
+    d === 0 ? " · " : ""
+  ] })) : /* @__PURE__ */ o(S, { children: [
+    C && /* @__PURE__ */ r(v, { className: "tag", children: C }, "detailed-products-section-tag__condition"),
+    N && /* @__PURE__ */ r(v, { className: "tag", children: N }, "detailed-products-section-tag__quantity"),
+    k && /* @__PURE__ */ r(v, { className: "tag", children: k }, "detailed-products-section-tag__trade")
+  ] });
+  return (
+    // <LandingPageProductCardSkeleton />
+    /* @__PURE__ */ o(G, { ref: i, className: "product-card", onClick: U, children: [
+      /* @__PURE__ */ r(ce, { className: "product-image-wrapper", children: oe(M) ? M : /* @__PURE__ */ r(ne, { src: X }) }),
+      /* @__PURE__ */ r("div", { className: "wrapper-card-1", children: /* @__PURE__ */ r("div", { className: "card-title", children: s }) }),
+      /* @__PURE__ */ o("div", { className: "wrapper-card-3", children: [
+        T && /* @__PURE__ */ r(
+          "div",
+          {
+            ...P ? {} : {
+              onMouseEnter: L,
+              onMouseLeave: H
+            },
+            children: /* @__PURE__ */ o(ae, { placement: "bottom", open: K, children: [
+              /* @__PURE__ */ r(te, { children: Z() }),
+              /* @__PURE__ */ r(ie, { style: { all: "unset" }, children: /* @__PURE__ */ r(le, { children: J() }) })
+            ] })
+          }
+        ),
+        !T && Q()
+      ] }),
+      /* @__PURE__ */ o("div", { className: "wrapper-card-2", children: [
+        /* @__PURE__ */ o("div", { className: "price-text", children: [
+          t > 0 && h && y !== !0 && b !== !0 && /* @__PURE__ */ r("div", { children: `${D(t)} ${j(h)}` }),
+          c > 0 && h && y !== !0 && b !== !0 && c !== t && /* @__PURE__ */ r("div", { className: `${t > 0 ? "full-price" : ""}`, children: `${D(c)} ${j(h)}` }),
+          y && A,
+          b && Y
+        ] }),
+        /* @__PURE__ */ r("div", { className: "location-text", children: q })
+      ] }),
+      E === !0 && /* @__PURE__ */ r(me, {})
+    ] })
+  );
+}), be = V(({}, a) => /* @__PURE__ */ o(G, { className: "product-card", children: [
+  /* @__PURE__ */ r("img", { className: "skeleton-img" }),
+  /* @__PURE__ */ o("div", { className: "wrapper-card-1", children: [
+    /* @__PURE__ */ r("div", { className: "skeleton-title" }),
+    /* @__PURE__ */ r("div", { className: "skeleton-tags" })
+  ] }),
+  /* @__PURE__ */ o("div", { className: "wrapper-card-1", children: [
+    /* @__PURE__ */ r("div", { className: "skeleton-price" }),
+    /* @__PURE__ */ r("div", { className: "skeleton-sponsored" })
+  ] })
+] })), _e = ({ limit: a = 5, isLoading: i = !1, keyPrefix: s }) => /* @__PURE__ */ r(S, { children: Array.from({ length: a }, (c, t) => /* @__PURE__ */ r(
+  be,
+  {
+    isLoading: i
+  },
+  `${s}-skeleton-product-card-${t}`
+)) }), Re = ({
+  children: a,
+  fallbackComponent: i = /* @__PURE__ */ r(S, {}),
+  isLoading: s = !1,
+  limit: c,
+  keyPrefix: t
+}) => /* @__PURE__ */ r(ee, { fallbackComponent: i, children: s === !0 ? /* @__PURE__ */ r(
+  _e,
+  {
+    isLoading: s,
+    limit: c,
+    keyPrefix: t
+  }
+) : a });
+export {
+  Be as D,
+  Re as S
+};

package/dist/suspense-product-card-detailed-DXSdrL-5.cjs

@@ -0,0 +1,226 @@
+"use strict";const e=require("react/jsx-runtime"),u=require("react"),n=require("./utils-Dl9xPH4c.cjs"),w=require("./emotion-styled.browser.esm-BtEseadx.cjs"),Y=require("./index-BueKsXT8.cjs"),v=require("./Badge.cjs"),K=require("./Popover.cjs"),Z=require("./PopoverTrigger.cjs"),H=require("./PopoverContent.cjs"),J=require("./useDetectMobile-zkbzoOGV.cjs"),q=require("./consts-goSZX3xP.cjs"),O=w.styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  cursor: pointer;
+
+  & .wrapper-card-1 {
+    display: flex;
+    flex-direction: column;
+    gap: 0.38rem;
+  }
+
+  & .wrapper-card-2 {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+  }
+
+  & .wrapper-card-3 {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.25rem;
+  }
+
+  & .tag {
+    height: 1.5rem;
+    gap: 0.25rem;
+    padding: 0.25rem 0.375rem;
+    border-radius: 0.375rem;
+    background: #f9fafb;
+    border: 1px solid var(--gray-95012, #14161a1f);
+    font-weight: 400;
+    font-size: 0.75rem;
+    line-height: 1rem;
+    letter-spacing: 0.025rem;
+    color: var(--gray-950, #14161a);
+
+    &.tag-sponsored {
+      & i {
+        color: var(--yellow-500, #f59e0b);
+      }
+    }
+  }
+
+  & .tag-mobile {
+    font-weight: 400;
+    font-size: 0.75rem;
+    line-height: 1rem;
+    letter-spacing: 0.025rem;
+    color: var(--gray-600, #676e79);
+  }
+
+  & .card-title {
+    font-size: 0.875rem;
+    font-weight: 600;
+    ${n.truncateTextInRows(2)}
+  }
+
+  & .price-text {
+    font-size: 1rem;
+    font-weight: 600;
+    ${n.truncateText()}
+    display: flex;
+    align-items: end;
+    gap: 0.5rem;
+
+    & .full-price {
+      text-decoration: line-through;
+      font-size: 0.75rem;
+      font-weight: 400;
+      padding-bottom: 0.125rem;
+      color: var(--danger-600, #e11d48);
+    }
+  }
+
+  & .location-text {
+    font-size: 0.75rem;
+    font-weight: 400;
+    color: var(--gray-600, #676e79);
+    ${n.truncateText()}
+  }
+
+  & .tags-wrapper {
+    display: flex;
+    gap: 0.5rem;
+  }
+
+  & .skeleton-img {
+    background-color: ${n.linearGradientAnimation("-90deg")};
+    border-radius: 0.75rem;
+    border: 1px solid white;
+  }
+
+  & .skeleton-title {
+    background-color: ${n.linearGradientAnimation("-90deg")};
+    width: 100%;
+    height: 2.5rem;
+  }
+
+  & .skeleton-tags {
+    background-color: ${n.linearGradientAnimation("-90deg")};
+    width: 80%;
+    height: 1.5rem;
+  }
+
+  & .skeleton-price {
+    background-color: ${n.linearGradientAnimation("-90deg")};
+    width: 50%;
+    height: 2.5rem;
+  }
+
+  & .skeleton-sponsored {
+    background-color: ${n.linearGradientAnimation("-90deg")};
+    width: 50%;
+    height: 1rem;
+  }
+
+  & .tags-popover__trigger {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.25rem;
+  }
+
+  @media (max-width: ${q.MOBILE_SIZE_PX+"px"}) {
+    & .price-text {
+      font-size: 0.875rem;
+      font-weight: 600;
+
+      & .full-price {
+        display: none;
+      }
+    }
+  }
+
+  &:hover .product-image-wrapper img {
+    transform: scale(1.1);
+  }
+`,Q=w.styled.div`
+  position: relative;
+  overflow: hidden;
+  border-radius: 0.75rem;
+  width: 100%;
+  aspect-ratio: 1 / 1;
+  border: 1px solid #0c15201f;
+
+  & img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    border-radius: 0.75rem;
+    transition: var(--transition, all 0.3s ease);
+  }
+
+  @media (max-width: ${q.MOBILE_SIZE_PX+"px"}) {
+    & img {
+      width: 8.875rem;
+      height: 8.875rem;
+      min-width: 8.875rem;
+      min-height: 8.875rem;
+      object-fit: cover;
+    }
+  }
+`,ee=w.styled.div`
+  background: var(--white, #fff);
+  z-index: 1;
+
+  border: 1px solid var(--gray-200, #dddfe4);
+  border-radius: 0.5rem;
+  line-height: 1rem;
+  position: absolute;
+  padding: 0.5rem 0.75rem;
+  top: 0.5rem;
+  left: 25%;
+  transform: translateX(-50%);
+  min-width: 10rem;
+
+  &::before,
+  &::after {
+    content: "";
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    border-style: solid;
+    border-width: 0.625rem;
+  }
+
+  &::after {
+    top: -1.1875rem;
+    border-color: transparent transparent var(--white, #fff) transparent;
+  }
+
+  &::before {
+    top: -1.25rem;
+    border-color: transparent transparent var(--gray-200, #dddfe4) transparent;
+  }
+
+  & .tags-popover__content {
+    display: flex;
+    flex-wrap: wrap;
+    flex-direction: column;
+    gap: 0.375rem;
+    font-size: 0.75rem;
+    font-weight: 400;
+
+    & .tags-popover__name {
+      color: var(--gray-600, #676e79);
+    }
+
+    & .tags-popover__value {
+      color: var(--gray-950, #14161a);
+    }
+  }
+`,re=w.styled.div`
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+  color: var(--gray-500);
+  font-size:  0.75rem;
+  font-weight: 500;
+
+  & i {
+    font-size: 1rem;
+    color: var(--warning-500, #F59E0B);
+  }
+`,ne=u.forwardRef(({sponsoredText:t="Sponsored"},a)=>e.jsxs(re,{ref:a,className:"sponsored-line",children:[e.jsx("i",{className:"mng-lnc-paw2"}),e.jsx("span",{children:t})]})),oe="Vehicles_Cars",te="Vehicles_Motorcycles",se="Vehicles_Trucks",ae="Vehicles_AgriculturalMachines_Tractors",ie="Vehicles_ConstructionMachines",ce="Vehicles_Bus",le="Vehicles_Campers",de="RealEstates_",o={Mileage:{icon:"mng-lnc-road",measure:"km"},YearOfProduction:{icon:"mng-lnc-calendar",measure:""},Fuel:{icon:"mng-lnc-gas-station",measure:""},EnginePowerKW:{icon:"mng-lnc-engine",measure:"kW"},Transmission:{icon:"mng-lnc-transmission",measure:""},Model:{icon:"mng-lnc-application",measure:""},Brand:{icon:"mng-lnc-car--front",measure:""},SurfaceArea:{icon:"mng-lnc-right-angle",measure:""},Floor:{icon:"mng-lnc-elevator",measure:""},FurnishedCondition:{icon:"mng-lnc-sofa-01",measure:""},AdType:{icon:"mng-lnc-notes",measure:""},NumberOfRooms:{icon:"mng-lnc-meeting-room",measure:""},HeatingType:{icon:"mng-lnc-heat",measure:""},AirConditioning:{icon:"mng-lnc-air-conditioner",measure:""},Type:{icon:"mng-lnc-house-building",measure:""},Parking:{icon:"mng-lnc-parking-area-circle",measure:""},Internet:{icon:"mng-lnc-wifi-02",measure:""},State:{icon:"mng-lnc-settings-1",measure:""},NumberOfPremises:{icon:"mng-lnc-meeting-room",measure:""},Pool:{icon:"mng-lnc-pool",measure:""},Approach:{icon:"mng-lnc-driveway",measure:""},NumberOfBeds:{icon:"mng-lnc-bed",measure:""},Kitchen:{icon:"mng-lnc-fridge",measure:""},BathroomToilet:{icon:"mng-lnc-bath",measure:""},default:{icon:" mng-lnc-clock--filled",measure:""}},me=u.forwardRef((t,a)=>{const{title:i,price:c=0,sellingPrice:s,currency:h,isNegotiable:y,isFree:j,imageUrl:z,location:B,isSponsored:P,imageComponent:$,onSelectCard:F=()=>{},freeText:I="Free",negotiableText:D="Negotiable",tags:l=[],categoryCode:b,condition:_,quantity:x,trade:C}=t,N=J.useDetectMobile(),S=[oe,te,se,ae,ie,ce,le,de].some(r=>b==null?void 0:b.includes(r)),[G,E]=u.useState(!1),A=()=>{E(!0)},W=()=>{E(!1)},X=()=>e.jsx("div",{className:"tags-popover__trigger",children:l==null?void 0:l.map((r,d)=>{var m,p,g,R,T;const k=((m=o==null?void 0:o[r==null?void 0:r.code])==null?void 0:m.icon)??((p=o==null?void 0:o.default)==null?void 0:p.icon)??"",V=((g=r==null?void 0:r.measurementUnit)==null?void 0:g.symbol)??((R=o==null?void 0:o[r==null?void 0:r.code])==null?void 0:R.measure)??"",f=[(r==null?void 0:r.value)??((T=r==null?void 0:r.multiOptions)==null?void 0:T[0])??"",V].filter(Boolean).join(" ");return N?e.jsxs("div",{className:"tag-mobile",children:[f,d===0?" · ":""]}):e.jsxs(v,{className:`tag ${P?"tag-sponsored":""}`,children:[e.jsx("i",{className:k}),f]},`detailed-products-section-tag__${d+1}`)})}),L=()=>e.jsx("div",{className:"tags-popover__content",children:l==null?void 0:l.map((r,d)=>{var m,p,g;const k=((m=r==null?void 0:r.measurementUnit)==null?void 0:m.symbol)??((p=o==null?void 0:o[r==null?void 0:r.code])==null?void 0:p.measure)??"",M=[(r==null?void 0:r.value)??((g=r==null?void 0:r.multiOptions)==null?void 0:g[0])??"",k].filter(Boolean).join(" "),f=r==null?void 0:r.name;return e.jsxs("div",{children:[e.jsx("span",{className:"tags-popover__name",children:`${f}: `}),e.jsx("span",{className:"tags-popover__value",children:M})]},`detailed-products-section-tag-dropdown__${d+1}`)})}),U=()=>N?[_,x,C].map((r,d)=>e.jsxs("div",{className:"tag-mobile",children:[r,d===0?" · ":""]})):e.jsxs(e.Fragment,{children:[_&&e.jsx(v,{className:"tag",children:_},"detailed-products-section-tag__condition"),x&&e.jsx(v,{className:"tag",children:x},"detailed-products-section-tag__quantity"),C&&e.jsx(v,{className:"tag",children:C},"detailed-products-section-tag__trade")]});return e.jsxs(O,{ref:a,className:"product-card",onClick:F,children:[e.jsx(Q,{className:"product-image-wrapper",children:n.isDefined($)?$:e.jsx(Y.ProductImageWrapper,{src:z})}),e.jsx("div",{className:"wrapper-card-1",children:e.jsx("div",{className:"card-title",children:i})}),e.jsxs("div",{className:"wrapper-card-3",children:[S&&e.jsx("div",{...N?{}:{onMouseEnter:A,onMouseLeave:W},children:e.jsxs(K,{placement:"bottom",open:G,children:[e.jsx(Z,{children:X()}),e.jsx(H,{style:{all:"unset"},children:e.jsx(ee,{children:L()})})]})}),!S&&U()]}),e.jsxs("div",{className:"wrapper-card-2",children:[e.jsxs("div",{className:"price-text",children:[s>0&&h&&y!==!0&&j!==!0&&e.jsx("div",{children:`${n.formatPrice(s)} ${n.GetCurrencySymbol(h)}`}),c>0&&h&&y!==!0&&j!==!0&&c!==s&&e.jsx("div",{className:`${s>0?"full-price":""}`,children:`${n.formatPrice(c)} ${n.GetCurrencySymbol(h)}`}),y&&D,j&&I]}),e.jsx("div",{className:"location-text",children:B})]}),P===!0&&e.jsx(ne,{})]})}),pe=u.forwardRef(({},t)=>e.jsxs(O,{className:"product-card",children:[e.jsx("img",{className:"skeleton-img"}),e.jsxs("div",{className:"wrapper-card-1",children:[e.jsx("div",{className:"skeleton-title"}),e.jsx("div",{className:"skeleton-tags"})]}),e.jsxs("div",{className:"wrapper-card-1",children:[e.jsx("div",{className:"skeleton-price"}),e.jsx("div",{className:"skeleton-sponsored"})]})]})),ge=({limit:t=5,isLoading:a=!1,keyPrefix:i})=>e.jsx(e.Fragment,{children:Array.from({length:t},(c,s)=>e.jsx(pe,{isLoading:a},`${i}-skeleton-product-card-${s}`))}),ue=({children:t,fallbackComponent:a=e.jsx(e.Fragment,{}),isLoading:i=!1,limit:c,keyPrefix:s})=>e.jsx(u.Suspense,{fallbackComponent:a,children:i===!0?e.jsx(ge,{isLoading:i,limit:c,keyPrefix:s}):t});exports.DetailedProductCard=me;exports.SuspenseDetailedProductCard=ue;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lanaco/lnc-react-ui",
-  "version": "4.0.138",
+  "version": "4.0.139",
   "description": "React component library",
   "type": "module",
   "keywords": [

package/dist/suspense-product-card-detailed-BJLmsTWB.cjs

@@ -1,131 +0,0 @@
-"use strict";const e=require("react/jsx-runtime"),c=require("react"),r=require("./utils-Dl9xPH4c.cjs"),p=require("./emotion-styled.browser.esm-BtEseadx.cjs"),k=require("./index-BueKsXT8.cjs"),u=require("./consts-goSZX3xP.cjs"),x=p.styled.div`
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-  cursor: pointer;
-
-  & .wrapper-card-1 {
-    display: flex;
-    flex-direction: column;
-    gap: 0.38rem;
-  }
-
-  & .wrapper-card-2 {
-    display: flex;
-    flex-direction: column;
-    gap: 0;
-  }
-
-  & .card-title {
-    font-size: 0.875rem;
-    font-weight: 600;
-    ${r.truncateTextInRows(2)}
-  }
-
-  & .price-text {
-    font-size: 1rem;
-    font-weight: 600;
-    ${r.truncateText()}
-    display: flex;
-    align-items: end;
-    gap: 0.5rem;
-    & .full-price {
-      text-decoration: line-through;
-      font-size: 0.75rem;
-      font-weight: 400;
-      padding-bottom: 0.125rem;
-      color: var(--gray-600, #676e79);
-    }
-  }
-
-  & .location-text {
-    font-size: 0.75rem;
-    font-weight: 400;
-    color: var(--gray-600, #676e79);
-    ${r.truncateText()}
-  }
-
-  & .tags-wrapper {
-    display: flex;
-    gap: 0.5rem;
-  }
-
-  & .skeleton-img {
-    background-color: ${r.linearGradientAnimation("-90deg")};
-    border-radius: 0.75rem;
-    border: 1px solid white;
-  }
-
-  & .skeleton-title {
-    background-color: ${r.linearGradientAnimation("-90deg")};
-    width: 100%;
-    height: 2.5rem;
-  }
-
-  & .skeleton-tags {
-    background-color: ${r.linearGradientAnimation("-90deg")};
-    width: 80%;
-    height: 1.5rem;
-  }
-
-  & .skeleton-price {
-    background-color: ${r.linearGradientAnimation("-90deg")};
-    width: 50%;
-    height: 2.5rem;
-  }
-
-  & .skeleton-sponsored {
-    background-color: ${r.linearGradientAnimation("-90deg")};
-    width: 50%;
-    height: 1rem;
-  }
-
-  @media (max-width: ${u.MOBILE_SIZE_PX+"px"}) {
-    & .price-text {
-      font-size: 0.875rem;
-      font-weight: 600;
-    }
-  }
-
-  &:hover .product-image-wrapper img {
-    transform: scale(1.1);
-  }
-`,y=p.styled.div`
-  position: relative;
-  overflow: hidden;
-  border-radius: 0.75rem;
-  width: 100%;
-  aspect-ratio: 1 / 1;
-  border: 1px solid #0c15201f;
-
-  & img {
-    display: block;
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-    border-radius: 0.75rem;
-    transition: var(--transition, all 0.3s ease);
-  }
-
-  @media (max-width: ${u.MOBILE_SIZE_PX+"px"}) {
-    & img {
-      width: 8.875rem;
-      height: 8.875rem;
-      min-width: 8.875rem;
-      min-height: 8.875rem;
-      object-fit: cover;
-    }
-  }
-`,N=p.styled.div`
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-  color: var(--gray-500);
-  font-size:  0.75rem;
-  font-weight: 500;
-
-  & i {
-    font-size: 1rem;
-    color: var(--warning-500, #F59E0B);
-  }
-`,$=c.forwardRef(({sponsoredText:t="Sponsored"},s)=>e.jsxs(N,{ref:s,className:"sponsored-line",children:[e.jsx("i",{className:"mng-lnc-paw2"}),e.jsx("span",{children:t})]})),S=c.forwardRef((t,s)=>{const{uuid:a,title:o,price:i=0,sellingPrice:n,currency:d,isNegotiable:l,isFree:m,imageUrl:h,sellerUuid:G,location:f,isSponsored:w,imageComponent:g,onSelectCard:j=()=>{},freeText:v="Free",negotiableText:b="Negotiable"}=t;return e.jsxs(x,{className:"product-card",onClick:j,children:[e.jsx(y,{className:"product-image-wrapper",children:r.isDefined(g)?g:e.jsx(k.ProductImageWrapper,{src:h})}),e.jsx("div",{className:"wrapper-card-1",children:e.jsx("div",{className:"card-title",children:o})}),e.jsxs("div",{className:"wrapper-card-2",children:[e.jsxs("div",{className:"price-text",children:[n>0&&d&&l!==!0&&m!==!0&&e.jsx("div",{children:`${r.formatPrice(n)} ${r.GetCurrencySymbol(d)}`}),i>0&&d&&l!==!0&&m!==!0&&i!==n&&e.jsx("div",{className:`${n>0?"full-price":""}`,children:`${r.formatPrice(i)} ${r.GetCurrencySymbol(d)}`}),l&&b,m&&v]}),e.jsx("div",{className:"location-text",children:f})]}),w===!0&&e.jsx($,{})]})}),P=c.forwardRef(({},t)=>e.jsxs(x,{className:"product-card",children:[e.jsx("img",{className:"skeleton-img"}),e.jsxs("div",{className:"wrapper-card-1",children:[e.jsx("div",{className:"skeleton-title"}),e.jsx("div",{className:"skeleton-tags"})]}),e.jsxs("div",{className:"wrapper-card-1",children:[e.jsx("div",{className:"skeleton-price"}),e.jsx("div",{className:"skeleton-sponsored"})]})]})),C=({limit:t=5,isLoading:s=!1,keyPrefix:a})=>e.jsx(e.Fragment,{children:Array.from({length:t},(o,i)=>e.jsx(P,{isLoading:s},`${a}-skeleton-product-card-${i}`))}),z=({children:t,fallbackComponent:s=e.jsx(e.Fragment,{}),isLoading:a=!1,limit:o,keyPrefix:i})=>e.jsx(c.Suspense,{fallbackComponent:s,children:a===!0?e.jsx(C,{isLoading:a,limit:o,keyPrefix:i}):t});exports.DetailedProductCard=S;exports.SuspenseDetailedProductCard=z;

package/dist/suspense-product-card-detailed-D6191kXr.js

@@ -1,209 +0,0 @@
-import { jsxs as i, jsx as e, Fragment as x } from "react/jsx-runtime";
-import { forwardRef as p, Suspense as z } from "react";
-import { p as C, t as f, o as s, l as D, q as u, G as w } from "./utils-BdsZgOUE.js";
-import { s as g } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { P as I } from "./index-CF3HhgvN.js";
-import { M as v } from "./consts-BuFChS64.js";
-const k = g.div`
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-  cursor: pointer;
-
-  & .wrapper-card-1 {
-    display: flex;
-    flex-direction: column;
-    gap: 0.38rem;
-  }
-
-  & .wrapper-card-2 {
-    display: flex;
-    flex-direction: column;
-    gap: 0;
-  }
-
-  & .card-title {
-    font-size: 0.875rem;
-    font-weight: 600;
-    ${C(2)}
-  }
-
-  & .price-text {
-    font-size: 1rem;
-    font-weight: 600;
-    ${f()}
-    display: flex;
-    align-items: end;
-    gap: 0.5rem;
-    & .full-price {
-      text-decoration: line-through;
-      font-size: 0.75rem;
-      font-weight: 400;
-      padding-bottom: 0.125rem;
-      color: var(--gray-600, #676e79);
-    }
-  }
-
-  & .location-text {
-    font-size: 0.75rem;
-    font-weight: 400;
-    color: var(--gray-600, #676e79);
-    ${f()}
-  }
-
-  & .tags-wrapper {
-    display: flex;
-    gap: 0.5rem;
-  }
-
-  & .skeleton-img {
-    background-color: ${s("-90deg")};
-    border-radius: 0.75rem;
-    border: 1px solid white;
-  }
-
-  & .skeleton-title {
-    background-color: ${s("-90deg")};
-    width: 100%;
-    height: 2.5rem;
-  }
-
-  & .skeleton-tags {
-    background-color: ${s("-90deg")};
-    width: 80%;
-    height: 1.5rem;
-  }
-
-  & .skeleton-price {
-    background-color: ${s("-90deg")};
-    width: 50%;
-    height: 2.5rem;
-  }
-
-  & .skeleton-sponsored {
-    background-color: ${s("-90deg")};
-    width: 50%;
-    height: 1rem;
-  }
-
-  @media (max-width: ${v + "px"}) {
-    & .price-text {
-      font-size: 0.875rem;
-      font-weight: 600;
-    }
-  }
-
-  &:hover .product-image-wrapper img {
-    transform: scale(1.1);
-  }
-`, j = g.div`
-  position: relative;
-  overflow: hidden;
-  border-radius: 0.75rem;
-  width: 100%;
-  aspect-ratio: 1 / 1;
-  border: 1px solid #0c15201f;
-
-  & img {
-    display: block;
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-    border-radius: 0.75rem;
-    transition: var(--transition, all 0.3s ease);
-  }
-
-  @media (max-width: ${v + "px"}) {
-    & img {
-      width: 8.875rem;
-      height: 8.875rem;
-      min-width: 8.875rem;
-      min-height: 8.875rem;
-      object-fit: cover;
-    }
-  }
-`, F = g.div`
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-  color: var(--gray-500);
-  font-size:  0.75rem;
-  font-weight: 500;
-
-  & i {
-    font-size: 1rem;
-    color: var(--warning-500, #F59E0B);
-  }
-`, T = p(({ sponsoredText: r = "Sponsored" }, a) => /* @__PURE__ */ i(F, { ref: a, className: "sponsored-line", children: [
-  /* @__PURE__ */ e("i", { className: "mng-lnc-paw2" }),
-  /* @__PURE__ */ e("span", { children: r })
-] })), q = p((r, a) => {
-  const {
-    uuid: o,
-    title: l,
-    price: t = 0,
-    sellingPrice: d,
-    currency: n,
-    isNegotiable: c,
-    isFree: m,
-    imageUrl: N,
-    sellerUuid: G,
-    location: b,
-    isSponsored: $,
-    imageComponent: h,
-    onSelectCard: y = () => {
-    },
-    freeText: S = "Free",
-    negotiableText: P = "Negotiable"
-  } = r;
-  return (
-    // <LandingPageProductCardSkeleton />
-    /* @__PURE__ */ i(k, { className: "product-card", onClick: y, children: [
-      /* @__PURE__ */ e(j, { className: "product-image-wrapper", children: D(h) ? h : /* @__PURE__ */ e(I, { src: N }) }),
-      /* @__PURE__ */ e("div", { className: "wrapper-card-1", children: /* @__PURE__ */ e("div", { className: "card-title", children: l }) }),
-      /* @__PURE__ */ i("div", { className: "wrapper-card-2", children: [
-        /* @__PURE__ */ i("div", { className: "price-text", children: [
-          d > 0 && n && c !== !0 && m !== !0 && /* @__PURE__ */ e("div", { children: `${u(d)} ${w(n)}` }),
-          t > 0 && n && c !== !0 && m !== !0 && t !== d && /* @__PURE__ */ e("div", { className: `${d > 0 ? "full-price" : ""}`, children: `${u(t)} ${w(n)}` }),
-          c && P,
-          m && S
-        ] }),
-        /* @__PURE__ */ e("div", { className: "location-text", children: b })
-      ] }),
-      $ === !0 && /* @__PURE__ */ e(T, {})
-    ] })
-  );
-}), W = p(({}, r) => /* @__PURE__ */ i(k, { className: "product-card", children: [
-  /* @__PURE__ */ e("img", { className: "skeleton-img" }),
-  /* @__PURE__ */ i("div", { className: "wrapper-card-1", children: [
-    /* @__PURE__ */ e("div", { className: "skeleton-title" }),
-    /* @__PURE__ */ e("div", { className: "skeleton-tags" })
-  ] }),
-  /* @__PURE__ */ i("div", { className: "wrapper-card-1", children: [
-    /* @__PURE__ */ e("div", { className: "skeleton-price" }),
-    /* @__PURE__ */ e("div", { className: "skeleton-sponsored" })
-  ] })
-] })), E = ({ limit: r = 5, isLoading: a = !1, keyPrefix: o }) => /* @__PURE__ */ e(x, { children: Array.from({ length: r }, (l, t) => /* @__PURE__ */ e(
-  W,
-  {
-    isLoading: a
-  },
-  `${o}-skeleton-product-card-${t}`
-)) }), L = ({
-  children: r,
-  fallbackComponent: a = /* @__PURE__ */ e(x, {}),
-  isLoading: o = !1,
-  limit: l,
-  keyPrefix: t
-}) => /* @__PURE__ */ e(z, { fallbackComponent: a, children: o === !0 ? /* @__PURE__ */ e(
-  E,
-  {
-    isLoading: o,
-    limit: l,
-    keyPrefix: t
-  }
-) : r });
-export {
-  q as D,
-  L as S
-};