@lanaco/lnc-react-ui 4.0.226 → 4.0.227

package/dist/ProductsWithBannerSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),l=require("react"),S=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),d=require("./breakpoints-CcVm-gVm.cjs"),P=require("./useDetectMobile-DYV6V1yw.cjs"),f=require("./style-Boz6dk5s.cjs"),u=require("./utils-CITgSxXe.cjs"),L=require("./index-DsINTjQk.cjs"),i=require("./style-Ito6YFqi.cjs"),W=S.styled.div`
+"use strict";const t=require("react/jsx-runtime"),c=require("react"),j=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),m=require("./breakpoints-CcVm-gVm.cjs"),$=require("./useDetectMobile-DYV6V1yw.cjs"),C=require("./style-Boz6dk5s.cjs"),h=require("./utils-CITgSxXe.cjs"),y=require("./index-DsINTjQk.cjs"),i=require("./style-CQdEALKR.cjs"),R=j.styled.div`
   width: 100%;
   height: 22.5rem;
   min-height: 22.5rem;
@@ -16,7 +16,7 @@
     object-fit: cover;
   }
 
-  @media ${d.down("S")} {
+  @media ${m.down("S")} {
     height: 100%;
     min-height: 100%;
     max-height: 100%;
@@ -31,25 +31,25 @@
       }
     }
   }
-`,$=S.styled.div`
+`,v=j.styled.div`
   display: grid;
-  grid-template-columns: ${t=>`repeat(${t.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${n=>`repeat(${n.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media ${d.down("M")} {
+  @media ${m.down("M")} {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
 
-  @media ${d.down("S")} {
+  @media ${m.down("S")} {
     grid-template-columns: repeat(2, minmax(0, 1fr));
     gap: 1rem;
   }
 
-  @media ${d.down("XS")} {
+  @media ${m.down("XS")} {
     grid-template-columns: 1fr;
     gap: 0.75rem;
   }
-`,C=S.styled.a`
+`,N=j.styled.a`
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
@@ -67,10 +67,10 @@
   & .card-title {
     font-size: 0.875rem;
     font-weight: 600;
-    ${u.truncateTextInRows(2)}
+    ${h.truncateTextInRows(2)}
   }
 
-  @media ${d.down("S")} {
+  @media ${m.down("S")} {
     & img {
       width: 8.875rem;
       height: 8.875rem;
@@ -81,11 +81,11 @@
       object-fit: cover;
     }
   }
-`,q=l.forwardRef((t,m)=>{const{uuid:s,title:n,image:c,sellerUuid:R,onSelectCard:j=()=>{},imageComponent:g,metadata:o,nameSlug:a,LinkComponent:h}=t,p=h||"a",k=l.useRef(null);return e.jsxs(C,{ref:k,className:"product-card",name:o==null?void 0:o.name,"data-accessor":o==null?void 0:o.accessor,onClick:r=>j(r,m),as:p,...h?{to:`/product/${u.isDefinedNotEmptyString(a)?`${a}-`:""}${s}`}:{href:`/product/${u.isDefinedNotEmptyString(a)?`${a}-`:""}${s}`},children:[u.isDefined(g)?g:e.jsx(L.ProductImageWrapper,{src:c}),e.jsx("div",{className:"card-title",children:n})]})}),y=S.styled(i.SkeletonColumnWrapper)`
-  @media ${d.down("S")} {
+`,q=c.forwardRef((n,o)=>{const{uuid:a,title:r,image:l,sellerUuid:k,onSelectCard:S=()=>{},imageComponent:g,metadata:s,nameSlug:d,LinkComponent:u}=n,p=u||"a",f=c.useRef(null);return t.jsxs(N,{ref:f,className:"product-card",name:s==null?void 0:s.name,"data-accessor":s==null?void 0:s.accessor,onClick:e=>S(e,o),as:p,...u?{to:`/product/${h.isDefinedNotEmptyString(d)?`${d}-`:""}${a}`}:{href:`/product/${h.isDefinedNotEmptyString(d)?`${d}-`:""}${a}`},children:[h.isDefined(g)?g:t.jsx(y.ProductImageWrapper,{src:l}),t.jsx("div",{className:"card-title",children:r})]})}),P=j.styled(i.SkeletonAnimationColumnContainer)`
+  @media ${m.down("S")} {
     & .skeleton__banner {
       height: 100%;
       aspect-ratio: 1 / 1;
     }
   }
-`,v=({keyPrefix:t})=>e.jsxs(y,{children:[e.jsx(i.SkeletonLinePlaceholder,{height:"22.5rem",className:"skeleton__banner"}),e.jsxs(i.SkeletonRowWrapper,{children:[e.jsxs(i.SkeletonColumnWrapper,{gap:"0.5rem",children:[e.jsx(i.SkeletonSquarePlaceholder,{height:"100%",width:"100%",borderRadius:"0.75rem"}),e.jsx(i.SkeletonColumnWrapper,{height:"1rem",children:e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"})}),e.jsxs(i.SkeletonRowWrapper,{gap:"0.5rem",children:[e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"})]}),e.jsx(i.SkeletonColumnWrapper,{height:"2rem",children:e.jsx(i.SkeletonLinePlaceholder,{height:"2rem",borderRadius:"0.75rem"})})]},`${t}-1`),e.jsxs(i.SkeletonColumnWrapper,{gap:"0.5rem",noGradient:!0,children:[e.jsx(i.SkeletonSquarePlaceholder,{height:"100%",width:"100%",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsxs(i.SkeletonRowWrapper,{gap:"0.5rem",noGradient:!0,children:[e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"})]}),e.jsx(i.SkeletonLinePlaceholder,{height:"2rem",borderRadius:"0.75rem"})]},`${t}-2`),e.jsxs(i.SkeletonColumnWrapper,{gap:"0.5rem",noGradient:!0,children:[e.jsx(i.SkeletonSquarePlaceholder,{height:"100%",width:"100%",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsxs(i.SkeletonRowWrapper,{gap:"0.5rem",noGradient:!0,children:[e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"})]}),e.jsx(i.SkeletonLinePlaceholder,{height:"2rem",borderRadius:"0.75rem"})]},`${t}-3`),e.jsxs(i.SkeletonColumnWrapper,{gap:"0.5rem",noGradient:!0,children:[e.jsx(i.SkeletonSquarePlaceholder,{height:"100%",width:"100%",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsxs(i.SkeletonRowWrapper,{gap:"0.5rem",noGradient:!0,children:[e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1.5rem",borderRadius:"0.75rem"})]}),e.jsx(i.SkeletonLinePlaceholder,{height:"2rem",borderRadius:"0.75rem"})]},`${t}-4`)]})]}),N=({keyPrefix:t,isLoading:m=!1,fallbackComponent:s=e.jsx(e.Fragment,{}),children:n})=>e.jsx(l.Suspense,{fallbackComponent:s,children:m===!0?e.jsx(v,{keyPrefix:t}):n}),w=l.memo(q),U=l.forwardRef((t,m)=>{const{icon:s,items:n,limit:c=4,imageUrl:R,title:j="Season inspiration",isLoading:g=!1,getImage:o=()=>{},componentName:a,LinkComponent:h}=t,p=P.useDetectMobile(),k=l.useMemo(()=>e.jsx(e.Fragment,{children:p===!0?n==null?void 0:n.map((r,b)=>e.jsx(w,{title:r==null?void 0:r.name,sellerUuid:r==null?void 0:r.sellerUuid,uuid:r==null?void 0:r.uuid,nameSlug:r==null?void 0:r.nameSlug,image:o(r==null?void 0:r.image,r==null?void 0:r.uuid,r==null?void 0:r.sellerUuid)||null,metadata:{name:a,accessor:r==null?void 0:r.accessor},LinkComponent:h},b)):n==null?void 0:n.slice(0,c).map((r,b)=>e.jsx(w,{title:r==null?void 0:r.name,sellerUuid:r==null?void 0:r.sellerUuid,uuid:r==null?void 0:r.uuid,nameSlug:r==null?void 0:r.nameSlug,image:o(r==null?void 0:r.image,r==null?void 0:r.uuid,r==null?void 0:r.sellerUuid)||null,metadata:{name:a,accessor:r==null?void 0:r.accessor},LinkComponent:h},b))}),[n,p,c]);return e.jsxs(f.RegulatTitleSectionWrapper,{ref:m,children:[e.jsx("div",{className:"regular-title",children:e.jsxs("div",{className:"regular-title-text",children:[u.isDefinedNotEmptyString(s)&&e.jsx("i",{className:s}),e.jsx("span",{children:j})]})}),e.jsxs(N,{isLoading:g,keyPrefix:"products-with-banner-skeleton",children:[e.jsx(W,{className:"products-banner",children:e.jsx("img",{src:R})}),e.jsx($,{limit:c,children:k})]})]})});module.exports=U;
+`,U=({keyPrefix:n})=>t.jsxs(P,{children:[t.jsx(i.SkeletonRect,{width:"100%",height:"10rem",className:"skeleton__banner"}),t.jsx(i.SkeletonContainer,{children:[1,2,3,4].map(o=>t.jsxs(i.SkeletonColumnContainer,{gap:"0.5rem",children:[t.jsx(i.SkeletonSquare,{size:"6rem"}),t.jsx(i.SkeletonRect,{width:"100%",height:"1rem"}),t.jsxs(i.SkeletonContainer,{gap:"0.5rem",children:[t.jsx(i.SkeletonRect,{width:"100%",height:"1.5rem"}),t.jsx(i.SkeletonRect,{width:"100%",height:"1.5rem"})]}),t.jsx(i.SkeletonRect,{width:"100%",height:"1.5rem"})]},`${n}-${o}`))})]}),W=({keyPrefix:n,isLoading:o=!1,fallbackComponent:a=t.jsx(t.Fragment,{}),children:r})=>t.jsx(c.Suspense,{fallbackComponent:a,children:o===!0?t.jsx(U,{keyPrefix:n}):r}),b=c.memo(q),D=c.forwardRef((n,o)=>{const{icon:a,items:r,limit:l=4,imageUrl:k,title:S="Season inspiration",isLoading:g=!1,getImage:s=()=>{},componentName:d,LinkComponent:u}=n,p=$.useDetectMobile(),f=c.useMemo(()=>t.jsx(t.Fragment,{children:p===!0?r==null?void 0:r.map((e,w)=>t.jsx(b,{title:e==null?void 0:e.name,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,image:s(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:d,accessor:e==null?void 0:e.accessor},LinkComponent:u},w)):r==null?void 0:r.slice(0,l).map((e,w)=>t.jsx(b,{title:e==null?void 0:e.name,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,image:s(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:d,accessor:e==null?void 0:e.accessor},LinkComponent:u},w))}),[r,p,l]);return t.jsxs(C.RegulatTitleSectionWrapper,{ref:o,children:[t.jsx("div",{className:"regular-title",children:t.jsxs("div",{className:"regular-title-text",children:[h.isDefinedNotEmptyString(a)&&t.jsx("i",{className:a}),t.jsx("span",{children:S})]})}),t.jsxs(W,{isLoading:g,keyPrefix:"products-with-banner-skeleton",children:[t.jsx(R,{className:"products-banner",children:t.jsx("img",{src:k})}),t.jsx(v,{limit:l,children:f})]})]})});module.exports=D;

package/dist/ProductsWithBannerSection.js

@@ -1,13 +1,13 @@
-import { jsxs as t, jsx as r, Fragment as W } from "react/jsx-runtime";
-import { forwardRef as N, useRef as P, Suspense as U, memo as G, useMemo as j } from "react";
-import { s as R } from "./emotion-styled.browser.esm-DfbrHHed.js";
-import { d as h } from "./breakpoints-BubDitvo.js";
-import { u as M } from "./useDetectMobile-B0Jog4jQ.js";
-import { R as y } from "./style-D54KOzZj.js";
-import { n as B, m as L, l as C } from "./utils-MoGhNMmj.js";
-import { P as _ } from "./index-DEypPQRI.js";
-import { b as s, a as i, S as g, c as f } from "./style-DvkivBNg.js";
-const z = R.div`
+import { jsxs as s, jsx as r, Fragment as v } from "react/jsx-runtime";
+import { forwardRef as P, useRef as N, Suspense as U, memo as W, useMemo as y } from "react";
+import { s as g } from "./emotion-styled.browser.esm-DfbrHHed.js";
+import { d } from "./breakpoints-BubDitvo.js";
+import { u as R } from "./useDetectMobile-B0Jog4jQ.js";
+import { R as j } from "./style-D54KOzZj.js";
+import { n as M, m as z, l as b } from "./utils-MoGhNMmj.js";
+import { P as B } from "./index-DEypPQRI.js";
+import { b as _, a as h, c as C, e as D, d as I } from "./style-BFPpppS9.js";
+const L = g.div`
   width: 100%;
   height: 22.5rem;
   min-height: 22.5rem;
@@ -25,7 +25,7 @@ const z = R.div`
     object-fit: cover;
   }
 
-  @media ${h("S")} {
+  @media ${d("S")} {
     height: 100%;
     min-height: 100%;
     max-height: 100%;
@@ -40,25 +40,25 @@ const z = R.div`
       }
     }
   }
-`, D = R.div`
+`, T = g.div`
   display: grid;
-  grid-template-columns: ${(a) => `repeat(${a.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${(t) => `repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media ${h("M")} {
+  @media ${d("M")} {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
 
-  @media ${h("S")} {
+  @media ${d("S")} {
     grid-template-columns: repeat(2, minmax(0, 1fr));
     gap: 1rem;
   }
 
-  @media ${h("XS")} {
+  @media ${d("XS")} {
     grid-template-columns: 1fr;
     gap: 0.75rem;
   }
-`, I = R.a`
+`, q = g.a`
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
@@ -76,10 +76,10 @@ const z = R.div`
   & .card-title {
     font-size: 0.875rem;
     font-weight: 600;
-    ${B(2)}
+    ${M(2)}
   }
 
-  @media ${h("S")} {
+  @media ${d("S")} {
     & img {
       width: 8.875rem;
       height: 8.875rem;
@@ -90,198 +90,117 @@ const z = R.div`
       object-fit: cover;
     }
   }
-`, T = N((a, l) => {
+`, A = P((t, n) => {
   const {
     uuid: o,
-    title: m,
+    title: i,
     image: c,
-    sellerUuid: v,
-    onSelectCard: S = () => {
+    sellerUuid: $,
+    onSelectCard: f = () => {
     },
-    imageComponent: p,
-    metadata: d,
-    nameSlug: n,
-    LinkComponent: u
-  } = a, b = u || "a", w = P(null);
-  return /* @__PURE__ */ t(
-    I,
+    imageComponent: u,
+    metadata: a,
+    nameSlug: m,
+    LinkComponent: l
+  } = t, p = l || "a", S = N(null);
+  return /* @__PURE__ */ s(
+    q,
     {
-      ref: w,
+      ref: S,
       className: "product-card",
-      name: d == null ? void 0 : d.name,
-      "data-accessor": d == null ? void 0 : d.accessor,
-      onClick: (e) => S(e, l),
-      as: b,
-      ...u ? {
-        to: `/product/${C(n) ? `${n}-` : ""}${o}`
+      name: a == null ? void 0 : a.name,
+      "data-accessor": a == null ? void 0 : a.accessor,
+      onClick: (e) => f(e, n),
+      as: p,
+      ...l ? {
+        to: `/product/${b(m) ? `${m}-` : ""}${o}`
       } : {
-        href: `/product/${C(n) ? `${n}-` : ""}${o}`
+        href: `/product/${b(m) ? `${m}-` : ""}${o}`
       },
       children: [
-        L(p) ? p : /* @__PURE__ */ r(_, { src: c }),
-        /* @__PURE__ */ r("div", { className: "card-title", children: m })
+        z(u) ? u : /* @__PURE__ */ r(B, { src: c }),
+        /* @__PURE__ */ r("div", { className: "card-title", children: i })
       ]
     }
   );
-}), q = R(s)`
-  @media ${h("S")} {
+}), E = g(_)`
+  @media ${d("S")} {
     & .skeleton__banner {
       height: 100%;
       aspect-ratio: 1 / 1;
     }
   }
-`, E = ({ keyPrefix: a }) => /* @__PURE__ */ t(q, { children: [
-  /* @__PURE__ */ r(i, { height: "22.5rem", className: "skeleton__banner" }),
-  /* @__PURE__ */ t(g, { children: [
-    /* @__PURE__ */ t(s, { gap: "0.5rem", children: [
-      /* @__PURE__ */ r(
-        f,
-        {
-          height: "100%",
-          width: "100%",
-          borderRadius: "0.75rem"
-        }
-      ),
-      /* @__PURE__ */ r(s, { height: "1rem", children: /* @__PURE__ */ r(i, { height: "1rem", borderRadius: "0.75rem" }) }),
-      /* @__PURE__ */ t(g, { gap: "0.5rem", children: [
-        /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" }),
-        /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" })
-      ] }),
-      /* @__PURE__ */ r(s, { height: "2rem", children: /* @__PURE__ */ r(i, { height: "2rem", borderRadius: "0.75rem" }) })
-    ] }, `${a}-1`),
-    /* @__PURE__ */ t(
-      s,
-      {
-        gap: "0.5rem",
-        noGradient: !0,
-        children: [
-          /* @__PURE__ */ r(
-            f,
-            {
-              height: "100%",
-              width: "100%",
-              borderRadius: "0.75rem"
-            }
-          ),
-          /* @__PURE__ */ r(i, { height: "1rem", borderRadius: "0.75rem" }),
-          /* @__PURE__ */ t(g, { gap: "0.5rem", noGradient: !0, children: [
-            /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" }),
-            /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" })
-          ] }),
-          /* @__PURE__ */ r(i, { height: "2rem", borderRadius: "0.75rem" })
-        ]
-      },
-      `${a}-2`
-    ),
-    /* @__PURE__ */ t(
-      s,
-      {
-        gap: "0.5rem",
-        noGradient: !0,
-        children: [
-          /* @__PURE__ */ r(
-            f,
-            {
-              height: "100%",
-              width: "100%",
-              borderRadius: "0.75rem"
-            }
-          ),
-          /* @__PURE__ */ r(i, { height: "1rem", borderRadius: "0.75rem" }),
-          /* @__PURE__ */ t(g, { gap: "0.5rem", noGradient: !0, children: [
-            /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" }),
-            /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" })
-          ] }),
-          /* @__PURE__ */ r(i, { height: "2rem", borderRadius: "0.75rem" })
-        ]
-      },
-      `${a}-3`
-    ),
-    /* @__PURE__ */ t(
-      s,
-      {
-        gap: "0.5rem",
-        noGradient: !0,
-        children: [
-          /* @__PURE__ */ r(
-            f,
-            {
-              height: "100%",
-              width: "100%",
-              borderRadius: "0.75rem"
-            }
-          ),
-          /* @__PURE__ */ r(i, { height: "1rem", borderRadius: "0.75rem" }),
-          /* @__PURE__ */ t(g, { gap: "0.5rem", noGradient: !0, children: [
-            /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" }),
-            /* @__PURE__ */ r(i, { height: "1.5rem", borderRadius: "0.75rem" })
-          ] }),
-          /* @__PURE__ */ r(i, { height: "2rem", borderRadius: "0.75rem" })
-        ]
-      },
-      `${a}-4`
-    )
-  ] })
-] }), F = ({
-  keyPrefix: a,
-  isLoading: l = !1,
-  fallbackComponent: o = /* @__PURE__ */ r(W, {}),
-  children: m
-}) => /* @__PURE__ */ r(U, { fallbackComponent: o, children: l === !0 ? /* @__PURE__ */ r(E, { keyPrefix: a }) : m }), k = G(T), Z = N((a, l) => {
+`, F = ({ keyPrefix: t }) => /* @__PURE__ */ s(E, { children: [
+  /* @__PURE__ */ r(h, { width: "100%", height: "10rem", className: "skeleton__banner" }),
+  /* @__PURE__ */ r(C, { children: [1, 2, 3, 4].map((n) => /* @__PURE__ */ s(D, { gap: "0.5rem", children: [
+    /* @__PURE__ */ r(I, { size: "6rem" }),
+    /* @__PURE__ */ r(h, { width: "100%", height: "1rem" }),
+    /* @__PURE__ */ s(C, { gap: "0.5rem", children: [
+      /* @__PURE__ */ r(h, { width: "100%", height: "1.5rem" }),
+      /* @__PURE__ */ r(h, { width: "100%", height: "1.5rem" })
+    ] }),
+    /* @__PURE__ */ r(h, { width: "100%", height: "1.5rem" })
+  ] }, `${t}-${n}`)) })
+] }), G = ({
+  keyPrefix: t,
+  isLoading: n = !1,
+  fallbackComponent: o = /* @__PURE__ */ r(v, {}),
+  children: i
+}) => /* @__PURE__ */ r(U, { fallbackComponent: o, children: n === !0 ? /* @__PURE__ */ r(F, { keyPrefix: t }) : i }), k = W(A), x = P((t, n) => {
   const {
     icon: o,
-    items: m,
+    items: i,
     limit: c = 4,
-    imageUrl: v,
-    title: S = "Season inspiration",
-    isLoading: p = !1,
-    getImage: d = () => {
+    imageUrl: $,
+    title: f = "Season inspiration",
+    isLoading: u = !1,
+    getImage: a = () => {
     },
-    componentName: n,
-    LinkComponent: u
-  } = a, b = M(), w = j(() => /* @__PURE__ */ r(W, { children: b === !0 ? m == null ? void 0 : m.map((e, $) => /* @__PURE__ */ r(
+    componentName: m,
+    LinkComponent: l
+  } = t, p = R(), S = y(() => /* @__PURE__ */ r(v, { children: p === !0 ? i == null ? void 0 : i.map((e, w) => /* @__PURE__ */ r(
     k,
     {
       title: e == null ? void 0 : e.name,
       sellerUuid: e == null ? void 0 : e.sellerUuid,
       uuid: e == null ? void 0 : e.uuid,
       nameSlug: e == null ? void 0 : e.nameSlug,
-      image: d(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
-      metadata: { name: n, accessor: e == null ? void 0 : e.accessor },
-      LinkComponent: u
+      image: a(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
+      metadata: { name: m, accessor: e == null ? void 0 : e.accessor },
+      LinkComponent: l
     },
-    $
-  )) : m == null ? void 0 : m.slice(0, c).map((e, $) => /* @__PURE__ */ r(
+    w
+  )) : i == null ? void 0 : i.slice(0, c).map((e, w) => /* @__PURE__ */ r(
     k,
     {
       title: e == null ? void 0 : e.name,
       sellerUuid: e == null ? void 0 : e.sellerUuid,
       uuid: e == null ? void 0 : e.uuid,
       nameSlug: e == null ? void 0 : e.nameSlug,
-      image: d(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
-      metadata: { name: n, accessor: e == null ? void 0 : e.accessor },
-      LinkComponent: u
+      image: a(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
+      metadata: { name: m, accessor: e == null ? void 0 : e.accessor },
+      LinkComponent: l
     },
-    $
-  )) }), [m, b, c]);
-  return /* @__PURE__ */ t(y, { ref: l, children: [
-    /* @__PURE__ */ r("div", { className: "regular-title", children: /* @__PURE__ */ t("div", { className: "regular-title-text", children: [
-      C(o) && /* @__PURE__ */ r("i", { className: o }),
-      /* @__PURE__ */ r("span", { children: S })
+    w
+  )) }), [i, p, c]);
+  return /* @__PURE__ */ s(j, { ref: n, children: [
+    /* @__PURE__ */ r("div", { className: "regular-title", children: /* @__PURE__ */ s("div", { className: "regular-title-text", children: [
+      b(o) && /* @__PURE__ */ r("i", { className: o }),
+      /* @__PURE__ */ r("span", { children: f })
     ] }) }),
-    /* @__PURE__ */ t(
-      F,
+    /* @__PURE__ */ s(
+      G,
       {
-        isLoading: p,
+        isLoading: u,
         keyPrefix: "products-with-banner-skeleton",
         children: [
-          /* @__PURE__ */ r(z, { className: "products-banner", children: /* @__PURE__ */ r("img", { src: v }) }),
-          /* @__PURE__ */ r(D, { limit: c, children: w })
+          /* @__PURE__ */ r(L, { className: "products-banner", children: /* @__PURE__ */ r("img", { src: $ }) }),
+          /* @__PURE__ */ r(T, { limit: c, children: S })
         ]
       }
     )
   ] });
 });
 export {
-  Z as default
+  x as default
 };

package/dist/QuattroCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),d=require("react"),m=require("./utils-CITgSxXe.cjs"),g=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),p=require("./breakpoints-CcVm-gVm.cjs"),f=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),_=require("./styled-components.browser.esm-BaNxtZgB.cjs"),h=require("./index-DkPva6Gr.cjs"),b=g.styled.div`
+"use strict";const r=require("react/jsx-runtime"),d=require("react"),m=require("./utils-CITgSxXe.cjs"),g=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),p=require("./breakpoints-CcVm-gVm.cjs"),f=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),_=require("./styled-components.browser.esm-BaNxtZgB.cjs"),h=require("./index-BMAvJQBG.cjs"),b=g.styled.div`
   position: absolute;
   top: 0;
   left: 0;

package/dist/QuattroCardsSection.js

@@ -5,7 +5,7 @@ import { s as g } from "./emotion-styled.browser.esm-DfbrHHed.js";
 import { d as m } from "./breakpoints-BubDitvo.js";
 import { u as y } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 import { q as v } from "./styled-components.browser.esm-Cfeh8eHg.js";
-import { S as q } from "./index-CuRcxKQH.js";
+import { S as q } from "./index-C6amCwRZ.js";
 const k = g.div`
   position: absolute;
   top: 0;

package/dist/ReviewsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),g=require("react"),l=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),w=require("./breakpoints-CcVm-gVm.cjs"),S=require("./useDetectMobile-DYV6V1yw.cjs"),b=require("./utils-CITgSxXe.cjs"),k=require("./ThemeProvider.cjs"),v=require("./index-DsINTjQk.cjs"),i=require("./style-Ito6YFqi.cjs"),R=l.styled.div`
+"use strict";const t=require("react/jsx-runtime"),p=require("react"),o=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),w=require("./breakpoints-CcVm-gVm.cjs"),x=require("./useDetectMobile-DYV6V1yw.cjs"),f=require("./utils-CITgSxXe.cjs"),y=require("./ThemeProvider.cjs"),S=require("./index-DsINTjQk.cjs"),m=require("./style-CQdEALKR.cjs"),k=o.styled.div`
   display: flex;
   flex-direction: column;
   color: var(--darkest-950);
@@ -8,9 +8,9 @@
     font-weight: 600;
     font-size: 1.5rem;
   }
-`,y=l.styled.div`
+`,R=o.styled.div`
   display: grid;
-  grid-template-columns: ${t=>`repeat(${t.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${r=>`repeat(${r.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
   @media ${w.down("M")} {
@@ -24,12 +24,12 @@
   @media ${w.down("XS")} {
     grid-template-columns: repeat(1, 1fr);
   }
-`,$=l.styled.a`
+`,$=o.styled.a`
   padding-top: 5rem;
   overflow: hidden;
   text-decoration: none;
   color: var(--gray-950);
-`,C=l.styled.div`
+`,C=o.styled.div`
   position: relative;
   cursor: pointer;
   display: flex;
@@ -61,11 +61,11 @@
       font-size: 1.375rem;
       font-weight: 600;
       color: var(--gray-950, #14161a);
-      ${b.truncateText()}
+      ${f.truncateText()}
     }
 
     & .cont-text {
-      ${b.truncateTextInRows(2)}
+      ${f.truncateTextInRows(2)}
     }
   }
 
@@ -85,9 +85,9 @@
     box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
       0px 4px 6px -2px rgba(0, 0, 0, 0.05);
   }
-`,j=(t,o)=>b.getComponentPropValue(t.theme,"StarRating",t.color,t.disabled===!0?"disabled":"enabled",o),P=l.styled.div`
-  font-size: ${t=>j(t,"fontSize")};
-  line-height: ${t=>j(t,"lineHeight")};
+`,b=(r,n)=>f.getComponentPropValue(r.theme,"StarRating",r.color,r.disabled===!0?"disabled":"enabled",n),N=o.styled.div`
+  font-size: ${r=>b(r,"fontSize")};
+  line-height: ${r=>b(r,"lineHeight")};
   line-height: 1.5rem;
   width: fit-content;
   display: flex;
@@ -104,33 +104,29 @@
     font-weight: 400;
     font-size: 0.75rem;
     line-height: 1.5rem;
-    color: ${t=>t.color};
+    color: ${r=>r.color};
   }
-`,L=l.styled.span`
+`,z=o.styled.span`
   position: absolute;
   z-index: 1;
   display: block;
   top: 0;
   left: 0;
   overflow: hidden;
-  width: ${t=>t.width}%;
+  width: ${r=>r.width}%;
 
-  color: ${t=>b.getColorRgbaValue(t.theme,"StarRating",t.color,t.disabled===!0?"disabled":"enabled","filledColor")};
-`,N=l.styled.span`
+  color: ${r=>f.getColorRgbaValue(r.theme,"StarRating",r.color,r.disabled===!0?"disabled":"enabled","filledColor")};
+`,q=o.styled.span`
   padding: 0;
   display: block;
   z-index: 0;
-  color: ${t=>t.color};
-`,q=g.forwardRef((t,o)=>{const{rating:a=0,reviewCount:n=null,disabled:s=!1,tabIndex:d=0,className:p="",style:h={},color:c="primary",size:u="large"}=t,{theme:r}=k.useTheme(),m={theme:r,color:c,size:u,style:h,disabled:s},x=a/5*100;return e.jsxs(P,{ref:o,tabIndex:d,...m,className:`star-rating ${p}`,children:[e.jsxs("div",{className:"rating",children:[e.jsx(L,{className:"filled-stars",...m,width:x,children:"★★★★★"}),e.jsx(N,{...m,children:"★★★★★"})]}),!isNaN(n)&&Number.isFinite(n)&&e.jsx("div",{className:"review-count",children:`(${n.toLocaleString()})`})]})}),z=g.forwardRef((t,o)=>{const{image:a,text:n,title:s,link:d,rating:p,onSelectCard:h=()=>{},LinkComponent:c}=t,u=c||"a";return e.jsx($,{ref:o,className:"review-card",onClick:h,as:u,...c?{to:`/${d}`}:{href:`/${d}`},children:e.jsxs(C,{children:[e.jsx(v.ProductImageWrapper,{src:a}),e.jsxs("div",{className:"cont",children:[e.jsx("span",{className:"cont-title",children:s}),e.jsx("div",{className:"cont-text",children:n})]}),e.jsx(q,{color:"warning",rating:p})]})})}),M=l.styled(i.SkeletonRowWrapper)`
+  color: ${r=>r.color};
+`,M=p.forwardRef((r,n)=>{const{rating:s=0,reviewCount:i=null,disabled:a=!1,tabIndex:l=0,className:g="",style:h={},color:d="primary",size:u="large"}=r,{theme:e}=y.useTheme(),c={theme:e,color:d,size:u,style:h,disabled:a},j=s/5*100;return t.jsxs(N,{ref:n,tabIndex:l,...c,className:`star-rating ${g}`,children:[t.jsxs("div",{className:"rating",children:[t.jsx(z,{className:"filled-stars",...c,width:j,children:"★★★★★"}),t.jsx(q,{...c,children:"★★★★★"})]}),!isNaN(i)&&Number.isFinite(i)&&t.jsx("div",{className:"review-count",children:`(${i.toLocaleString()})`})]})}),P=p.forwardRef((r,n)=>{const{image:s,text:i,title:a,link:l,rating:g,onSelectCard:h=()=>{},LinkComponent:d}=r,u=d||"a";return t.jsx($,{ref:n,className:"review-card",onClick:h,as:u,...d?{to:`/${l}`}:{href:`/${l}`},children:t.jsxs(C,{children:[t.jsx(S.ProductImageWrapper,{src:s}),t.jsxs("div",{className:"cont",children:[t.jsx("span",{className:"cont-title",children:a}),t.jsx("div",{className:"cont-text",children:i})]}),t.jsx(M,{color:"warning",rating:g})]})})}),F=o.styled(m.SkeletonAnimationContainer)`
   @media ${w.down("S")} {
     flex-direction: column;
 
     & > div {
       flex-direction: column;
-
-      & > div {
-        ${i.skeletonGradientBackground}
-      }
     }
   }
-`,W=({keyPrefix:t})=>e.jsxs(M,{children:[e.jsxs(i.SkeletonColumnWrapper,{children:[e.jsx(i.SkeletonSquarePlaceholder,{height:"6.25rem",width:"6.25rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"2rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem",width:"6rem"})]},`${t}-1`),e.jsxs(i.SkeletonColumnWrapper,{noGradient:!0,children:[e.jsx(i.SkeletonSquarePlaceholder,{height:"6.25rem",width:"6.25rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"2rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem",width:"6rem"})]},`${t}-2`),e.jsxs(i.SkeletonColumnWrapper,{noGradient:!0,children:[e.jsx(i.SkeletonSquarePlaceholder,{height:"6.25rem",width:"6.25rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"2rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem"}),e.jsx(i.SkeletonLinePlaceholder,{height:"1rem",borderRadius:"0.75rem",width:"6rem"})]},`${t}-3`)]}),F=({keyPrefix:t,isLoading:o=!1,fallbackComponent:a=e.jsx(e.Fragment,{}),children:n})=>e.jsx(g.Suspense,{fallbackComponent:a,children:o===!0?e.jsx(W,{keyPrefix:t}):n}),f=g.memo(z),G=g.forwardRef((t,o)=>{const{title:a="Electronics reviews",items:n,limit:s=3,onSelectCard:d=()=>{},isLoading:p=!1,LinkComponent:h}=t,c=S.useDetectMobile(),u=g.useMemo(()=>e.jsx(e.Fragment,{children:c===!0?n==null?void 0:n.map((r,m)=>e.jsx(f,{text:r==null?void 0:r.text,title:r==null?void 0:r.title,image:r==null?void 0:r.image,link:r==null?void 0:r.link,rating:r==null?void 0:r.ratingArithmeticMean,onSelectCard:()=>d(r),LinkComponent:h},m)):n==null?void 0:n.slice(0,s).map((r,m)=>e.jsx(f,{text:r==null?void 0:r.text,title:r==null?void 0:r.title,image:r==null?void 0:r.image,link:r==null?void 0:r.link,rating:r==null?void 0:r.ratingArithmeticMean,onSelectCard:()=>d(r),LinkComponent:h},m))}),[n,c,s]);return e.jsxs(R,{ref:o,children:[e.jsx("div",{className:"container-title",children:a}),e.jsx(F,{isLoading:p,keyPrefix:"reviews-skeleton",children:e.jsx(y,{limit:s,children:u})})]})});module.exports=G;
+`,L=({keyPrefix:r})=>t.jsx(F,{children:[1,2,3].map(n=>t.jsxs(m.SkeletonColumnContainer,{children:[t.jsx(m.SkeletonSquare,{size:"6.25rem"}),t.jsx(m.SkeletonRect,{width:"100%",height:"2rem",borderRadius:"0.75rem"}),t.jsx(m.SkeletonRect,{width:"100%",height:"1rem",borderRadius:"0.75rem"}),t.jsx(m.SkeletonRect,{width:"100%",height:"1rem",borderRadius:"0.75rem"}),t.jsx(m.SkeletonRect,{height:"1rem",borderRadius:"0.75rem",width:"6rem"})]},`${r}-${n}`))}),T=({keyPrefix:r,isLoading:n=!1,fallbackComponent:s=t.jsx(t.Fragment,{}),children:i})=>t.jsx(p.Suspense,{fallbackComponent:s,children:n===!0?t.jsx(L,{keyPrefix:r}):i}),v=p.memo(P),W=p.forwardRef((r,n)=>{const{title:s="Electronics reviews",items:i,limit:a=3,onSelectCard:l=()=>{},isLoading:g=!1,LinkComponent:h}=r,d=x.useDetectMobile(),u=p.useMemo(()=>t.jsx(t.Fragment,{children:d===!0?i==null?void 0:i.map((e,c)=>t.jsx(v,{text:e==null?void 0:e.text,title:e==null?void 0:e.title,image:e==null?void 0:e.image,link:e==null?void 0:e.link,rating:e==null?void 0:e.ratingArithmeticMean,onSelectCard:()=>l(e),LinkComponent:h},c)):i==null?void 0:i.slice(0,a).map((e,c)=>t.jsx(v,{text:e==null?void 0:e.text,title:e==null?void 0:e.title,image:e==null?void 0:e.image,link:e==null?void 0:e.link,rating:e==null?void 0:e.ratingArithmeticMean,onSelectCard:()=>l(e),LinkComponent:h},c))}),[i,d,a]);return t.jsxs(k,{ref:n,children:[t.jsx("div",{className:"container-title",children:s}),t.jsx(T,{isLoading:g,keyPrefix:"reviews-skeleton",children:t.jsx(R,{limit:a,children:u})})]})});module.exports=W;