@lanaco/lnc-react-ui 4.0.169 → 4.0.171

package/dist/RangeSlider.js

@@ -2,7 +2,7 @@ import { jsxs as N, jsx as t, Fragment as W } from "react/jsx-runtime";
 import { s as x } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { P as n } from "./index-CblbdqjE.js";
 import { forwardRef as X, useRef as q, useState as v, useCallback as A, useEffect as M } from "react";
-import { a as D, b as o, c as G, d as H } from "./utils-BdsZgOUE.js";
+import { a as D, b as o, c as G, d as H } from "./utils-DHfRApMf.js";
 import { u as J } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 import { u as K } from "./useUpdateEffect-CuYWz7EA.js";
 const Q = ({ theme: e, size: i }) => {

package/dist/ReviewsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),d=require("react"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),$=require("./useDetectMobile-zkbzoOGV.cjs"),g=require("./utils-Dl9xPH4c.cjs"),N=require("./ThemeProvider.cjs"),a=require("./index-BpbMKBf_.cjs"),P=require("./index-BueKsXT8.cjs"),C=c.styled.div`
+"use strict";const e=require("react/jsx-runtime"),m=require("react"),l=require("./emotion-styled.browser.esm-BtEseadx.cjs"),f=require("./consts-goSZX3xP.cjs"),v=require("./useDetectMobile-zkbzoOGV.cjs"),u=require("./utils-Dl9xPH4c.cjs"),k=require("./ThemeProvider.cjs"),s=require("./index-BpbMKBf_.cjs"),R=require("./index-BueKsXT8.cjs"),i=require("./style-BAcV7F53.cjs"),P=l.styled.div`
   display: flex;
   flex-direction: column;
   color: var(--darkest-950);
@@ -8,18 +8,18 @@
     font-weight: 600;
     font-size: 1.5rem;
   }
-`,R=c.styled.div`
+`,$=l.styled.div`
   display: grid;
   grid-template-columns: ${t=>`repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${S.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${f.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`,y=c.styled.div`
+`,C=l.styled.div`
   padding-top: 5rem;
   overflow: hidden;
-`,v=c.styled.div`
+`,L=l.styled.div`
   position: relative;
   cursor: pointer;
   display: flex;
@@ -51,11 +51,11 @@
       font-size: 1.375rem;
       font-weight: 600;
       color: var(--gray-950, #14161a);
-      ${g.truncateText()}
+      ${u.truncateText()}
     }
 
     & .cont-text {
-      ${g.truncateTextInRows(2)}
+      ${u.truncateTextInRows(2)}
     }
   }
 
@@ -75,25 +75,7 @@
     box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
       0px 4px 6px -2px rgba(0, 0, 0, 0.05);
   }
-
-  & .skeleton-img {
-    position: absolute;
-    top: -3.125rem;
-    left: 1.25rem;
-    min-width: 6.25rem;
-    max-width: 6.25rem;
-    min-height: 6.25rem;
-    max-height: 6.25rem;
-    border-radius: 0.75rem;
-    border: 1px solid var(--gray-95008);
-
-    /* drop-shadow-lg */
-    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
-      0px 4px 6px -2px rgba(0, 0, 0, 0.05);
-
-    ${g.linearGradientAnimation("-90deg")}
-  }
-`,x=(t,o)=>g.getComponentPropValue(t.theme,"StarRating",t.color,t.disabled===!0?"disabled":"enabled",o),k=c.styled.div`
+`,x=(t,n)=>u.getComponentPropValue(t.theme,"StarRating",t.color,t.disabled===!0?"disabled":"enabled",n),N=l.styled.div`
   font-size: ${t=>x(t,"fontSize")};
   line-height: ${t=>x(t,"lineHeight")};
   line-height: 1.5rem;
@@ -114,7 +96,7 @@
     line-height: 1.5rem;
     color: ${t=>t.color};
   }
-`,T=c.styled.span`
+`,q=l.styled.span`
   position: absolute;
   z-index: 1;
   display: block;
@@ -123,10 +105,22 @@
   overflow: hidden;
   width: ${t=>t.width}%;
 
-  color: ${t=>g.getColorRgbaValue(t.theme,"StarRating",t.color,t.disabled===!0?"disabled":"enabled","filledColor")};
-`,z=c.styled.span`
+  color: ${t=>u.getColorRgbaValue(t.theme,"StarRating",t.color,t.disabled===!0?"disabled":"enabled","filledColor")};
+`,T=l.styled.span`
   padding: 0;
   display: block;
   z-index: 0;
   color: ${t=>t.color};
-`,w=d.forwardRef((t,o)=>{const{rating:s=0,reviewCount:i=null,disabled:n=!1,tabIndex:l=0,className:m="",style:h={},color:u="primary",size:e="large"}=t,{theme:p}=N.useTheme(),f={theme:p,color:u,size:e,style:h,disabled:n},j=s/5*100;return r.jsxs(k,{ref:o,tabIndex:l,...f,className:`star-rating ${m}`,children:[r.jsxs("div",{className:"rating",children:[r.jsx(T,{className:"filled-stars",...f,width:j,children:"★★★★★"}),r.jsx(z,{...f,children:"★★★★★"})]}),!isNaN(i)&&Number.isFinite(i)&&r.jsx("div",{className:"review-count",children:`(${i.toLocaleString()})`})]})});w.propTypes={rating:a.PropTypes.number,reviewCount:a.PropTypes.any,disabled:a.PropTypes.bool,tabIndex:a.PropTypes.number,style:a.PropTypes.object,className:a.PropTypes.string,color:a.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral"]),size:a.PropTypes.oneOf(["small","medium","large"])};const q=d.forwardRef((t,o)=>{const{image:s,text:i,title:n,onSelectCard:l=()=>{},rating:m}=t;return r.jsx(y,{ref:o,className:"review-card",onClick:l,children:r.jsxs(v,{children:[r.jsx(P.ProductImageWrapper,{src:s}),r.jsxs("div",{className:"cont",children:[r.jsx("span",{className:"cont-title",children:n}),r.jsx("div",{className:"cont-text",children:i})]}),r.jsx(w,{color:"warning",rating:m})]})})}),M=d.forwardRef(({},t)=>r.jsx(y,{className:"review-card",children:r.jsxs(v,{children:[r.jsx("div",{className:"skeleton-img"}),r.jsx("div",{className:"cont"}),r.jsx(w,{color:"warning",rating:0})]})})),I=({limit:t=3,isLoading:o=!1,keyPrefix:s})=>r.jsx(r.Fragment,{children:Array.from({length:t},(i,n)=>r.jsx(M,{isLoading:o},`${s}-skeleton-review-card-${n}`))}),E=({children:t,fallbackComponent:o=r.jsx(r.Fragment,{}),isLoading:s=!1,limit:i,keyPrefix:n})=>r.jsx(d.Suspense,{fallbackComponent:o,children:s===!0?r.jsx(I,{isLoading:s,limit:i,keyPrefix:n}):t}),b=d.memo(q),F=d.forwardRef((t,o)=>{const{title:s="Electronics reviews",items:i,limit:n=3,onSelectCard:l=()=>{},isLoading:m=!1}=t,h=$.useDetectMobile(),u=d.useMemo(()=>r.jsx(r.Fragment,{children:h===!0?i==null?void 0:i.map((e,p)=>r.jsx(b,{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)},p)):i==null?void 0:i.slice(0,n).map((e,p)=>r.jsx(b,{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)},p))}),[i,h,l,n]);return r.jsxs(C,{ref:o,children:[r.jsx("div",{className:"container-title",children:s}),r.jsx(R,{limit:n,children:r.jsx(E,{isLoading:m,limit:n,keyPrefix:"explore-landing",children:u})})]})});module.exports=F;
+`,S=m.forwardRef((t,n)=>{const{rating:a=0,reviewCount:o=null,disabled:d=!1,tabIndex:c=0,className:h="",style:g={},color:b="primary",size:r="large"}=t,{theme:p}=k.useTheme(),w={theme:p,color:b,size:r,style:g,disabled:d},y=a/5*100;return e.jsxs(N,{ref:n,tabIndex:c,...w,className:`star-rating ${h}`,children:[e.jsxs("div",{className:"rating",children:[e.jsx(q,{className:"filled-stars",...w,width:y,children:"★★★★★"}),e.jsx(T,{...w,children:"★★★★★"})]}),!isNaN(o)&&Number.isFinite(o)&&e.jsx("div",{className:"review-count",children:`(${o.toLocaleString()})`})]})});S.propTypes={rating:s.PropTypes.number,reviewCount:s.PropTypes.any,disabled:s.PropTypes.bool,tabIndex:s.PropTypes.number,style:s.PropTypes.object,className:s.PropTypes.string,color:s.PropTypes.oneOf(["primary","secondary","success","warning","danger","information","neutral"]),size:s.PropTypes.oneOf(["small","medium","large"])};const z=m.forwardRef((t,n)=>{const{image:a,text:o,title:d,onSelectCard:c=()=>{},rating:h}=t;return e.jsx(C,{ref:n,className:"review-card",onClick:c,children:e.jsxs(L,{children:[e.jsx(R.ProductImageWrapper,{src:a}),e.jsxs("div",{className:"cont",children:[e.jsx("span",{className:"cont-title",children:d}),e.jsx("div",{className:"cont-text",children:o})]}),e.jsx(S,{color:"warning",rating:h})]})})}),M=l.styled(i.SkeletonRowWrapper)`
+  @media (max-width: ${f.MOBILE_SIZE_PX+"px"}) {
+    flex-direction: column;
+
+    & > div {
+      flex-direction: column;
+
+      & > div {
+        ${i.skeletonGradientBackground}
+      }
+    }
+  }
+`,I=({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`)]}),W=({keyPrefix:t,isLoading:n=!1,fallbackComponent:a=e.jsx(e.Fragment,{}),children:o})=>e.jsx(m.Suspense,{fallbackComponent:a,children:n===!0?e.jsx(I,{keyPrefix:t}):o}),j=m.memo(z),E=m.forwardRef((t,n)=>{const{title:a="Electronics reviews",items:o,limit:d=3,onSelectCard:c=()=>{},isLoading:h=!1}=t,g=v.useDetectMobile(),b=m.useMemo(()=>e.jsx(e.Fragment,{children:g===!0?o==null?void 0:o.map((r,p)=>e.jsx(j,{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:()=>c(r)},p)):o==null?void 0:o.slice(0,d).map((r,p)=>e.jsx(j,{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:()=>c(r)},p))}),[o,g,c,d]);return e.jsxs(P,{ref:n,children:[e.jsx("div",{className:"container-title",children:a}),e.jsx(W,{isLoading:h,keyPrefix:"reviews-skeleton",children:e.jsx($,{limit:d,children:b})})]})});module.exports=E;

package/dist/ReviewsSection.js

@@ -1,13 +1,14 @@
-import { jsxs as c, jsx as t, Fragment as w } from "react/jsx-runtime";
-import { forwardRef as h, Suspense as C, memo as k, useMemo as x } from "react";
-import { s as d } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as z } from "./consts-BuFChS64.js";
-import { u as P } from "./useDetectMobile-Bkvj0VMa.js";
-import { t as R, p as M, o as I, b as j, g as E } from "./utils-BdsZgOUE.js";
+import { jsxs as n, jsx as r, Fragment as y } from "react/jsx-runtime";
+import { forwardRef as v, Suspense as N, memo as z, useMemo as P } from "react";
+import { s } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as $ } from "./consts-BuFChS64.js";
+import { u as M } from "./useDetectMobile-Bkvj0VMa.js";
+import { t as I, o as W, b as j, g as E } from "./utils-DHfRApMf.js";
 import { useTheme as T } from "./ThemeProvider.js";
-import { P as l } from "./index-CblbdqjE.js";
-import { P as A } from "./index-CF3HhgvN.js";
-const W = d.div`
+import { P as d } from "./index-CblbdqjE.js";
+import { P as x } from "./index-BbltNcou.js";
+import { s as G, a as L, S as f, c as w, b as o } from "./style-CXMUA6cI.js";
+const F = s.div`
   display: flex;
   flex-direction: column;
   color: var(--darkest-950);
@@ -17,18 +18,18 @@ const W = d.div`
     font-weight: 600;
     font-size: 1.5rem;
   }
-`, F = d.div`
+`, O = s.div`
   display: grid;
-  grid-template-columns: ${(r) => `repeat(${r.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${(t) => `repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${z + "px"}) {
+  @media (max-width: ${$ + "px"}) {
     grid-template-columns: repeat(1, 1fr);
   }
-`, N = d.div`
+`, A = s.div`
   padding-top: 5rem;
   overflow: hidden;
-`, S = d.div`
+`, B = s.div`
   position: relative;
   cursor: pointer;
   display: flex;
@@ -60,11 +61,11 @@ const W = d.div`
       font-size: 1.375rem;
       font-weight: 600;
       color: var(--gray-950, #14161a);
-      ${R()}
+      ${I()}
     }
 
     & .cont-text {
-      ${M(2)}
+      ${W(2)}
     }
   }
 
@@ -84,33 +85,15 @@ const W = d.div`
     box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
       0px 4px 6px -2px rgba(0, 0, 0, 0.05);
   }
-
-  & .skeleton-img {
-    position: absolute;
-    top: -3.125rem;
-    left: 1.25rem;
-    min-width: 6.25rem;
-    max-width: 6.25rem;
-    min-height: 6.25rem;
-    max-height: 6.25rem;
-    border-radius: 0.75rem;
-    border: 1px solid var(--gray-95008);
-
-    /* drop-shadow-lg */
-    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
-      0px 4px 6px -2px rgba(0, 0, 0, 0.05);
-
-    ${I("-90deg")}
-  }
-`, v = (r, o) => E(
-  r.theme,
+`, R = (t, a) => E(
+  t.theme,
   "StarRating",
-  r.color,
-  r.disabled === !0 ? "disabled" : "enabled",
-  o
-), O = d.div`
-  font-size: ${(r) => v(r, "fontSize")};
-  line-height: ${(r) => v(r, "lineHeight")};
+  t.color,
+  t.disabled === !0 ? "disabled" : "enabled",
+  a
+), V = s.div`
+  font-size: ${(t) => R(t, "fontSize")};
+  line-height: ${(t) => R(t, "lineHeight")};
   line-height: 1.5rem;
   width: fit-content;
   display: flex;
@@ -127,79 +110,79 @@ const W = d.div`
     font-weight: 400;
     font-size: 0.75rem;
     line-height: 1.5rem;
-    color: ${(r) => r.color};
+    color: ${(t) => t.color};
   }
-`, _ = d.span`
+`, _ = s.span`
   position: absolute;
   z-index: 1;
   display: block;
   top: 0;
   left: 0;
   overflow: hidden;
-  width: ${(r) => r.width}%;
+  width: ${(t) => t.width}%;
 
-  color: ${(r) => j(
-  r.theme,
+  color: ${(t) => j(
+  t.theme,
   "StarRating",
-  r.color,
-  r.disabled === !0 ? "disabled" : "enabled",
+  t.color,
+  t.disabled === !0 ? "disabled" : "enabled",
   "filledColor"
 )};
-`, G = d.span`
+`, q = s.span`
   padding: 0;
   display: block;
   z-index: 0;
-  color: ${(r) => r.color};
-`, b = h((r, o) => {
+  color: ${(t) => t.color};
+`, k = v((t, a) => {
   const {
-    rating: n = 0,
+    rating: l = 0,
     reviewCount: i = null,
-    disabled: a = !1,
-    tabIndex: s = 0,
-    className: m = "",
+    disabled: m = !1,
+    tabIndex: c = 0,
+    className: h = "",
     style: g = {},
-    color: f = "primary",
+    color: u = "primary",
     size: e = "large"
-  } = r, { theme: p } = T(), u = {
+  } = t, { theme: p } = T(), b = {
     theme: p,
-    color: f,
+    color: u,
     size: e,
     style: g,
-    disabled: a
-  }, $ = n / 5 * 100;
-  return /* @__PURE__ */ c(
-    O,
+    disabled: m
+  }, C = l / 5 * 100;
+  return /* @__PURE__ */ n(
+    V,
     {
-      ref: o,
-      tabIndex: s,
-      ...u,
-      className: `star-rating ${m}`,
+      ref: a,
+      tabIndex: c,
+      ...b,
+      className: `star-rating ${h}`,
       children: [
-        /* @__PURE__ */ c("div", { className: "rating", children: [
-          /* @__PURE__ */ t(
+        /* @__PURE__ */ n("div", { className: "rating", children: [
+          /* @__PURE__ */ r(
             _,
             {
               className: "filled-stars",
-              ...u,
-              width: $,
+              ...b,
+              width: C,
               children: "★★★★★"
             }
           ),
-          /* @__PURE__ */ t(G, { ...u, children: "★★★★★" })
+          /* @__PURE__ */ r(q, { ...b, children: "★★★★★" })
         ] }),
-        !isNaN(i) && Number.isFinite(i) && /* @__PURE__ */ t("div", { className: "review-count", children: `(${i.toLocaleString()})` })
+        !isNaN(i) && Number.isFinite(i) && /* @__PURE__ */ r("div", { className: "review-count", children: `(${i.toLocaleString()})` })
       ]
     }
   );
 });
-b.propTypes = {
-  rating: l.number,
-  reviewCount: l.any,
-  disabled: l.bool,
-  tabIndex: l.number,
-  style: l.object,
-  className: l.string,
-  color: l.oneOf([
+k.propTypes = {
+  rating: d.number,
+  reviewCount: d.any,
+  disabled: d.bool,
+  tabIndex: d.number,
+  style: d.object,
+  className: d.string,
+  color: d.oneOf([
     "primary",
     "secondary",
     "success",
@@ -208,86 +191,136 @@ b.propTypes = {
     "information",
     "neutral"
   ]),
-  size: l.oneOf(["small", "medium", "large"])
+  size: d.oneOf(["small", "medium", "large"])
 };
-const L = h((r, o) => {
-  const { image: n, text: i, title: a, onSelectCard: s = () => {
-  }, rating: m } = r;
-  return /* @__PURE__ */ t(N, { ref: o, className: "review-card", onClick: s, children: /* @__PURE__ */ c(S, { children: [
-    /* @__PURE__ */ t(A, { src: n }),
-    /* @__PURE__ */ c("div", { className: "cont", children: [
-      /* @__PURE__ */ t("span", { className: "cont-title", children: a }),
-      /* @__PURE__ */ t("div", { className: "cont-text", children: i })
+const D = v((t, a) => {
+  const { image: l, text: i, title: m, onSelectCard: c = () => {
+  }, rating: h } = t;
+  return /* @__PURE__ */ r(A, { ref: a, className: "review-card", onClick: c, children: /* @__PURE__ */ n(B, { children: [
+    /* @__PURE__ */ r(x, { src: l }),
+    /* @__PURE__ */ n("div", { className: "cont", children: [
+      /* @__PURE__ */ r("span", { className: "cont-title", children: m }),
+      /* @__PURE__ */ r("div", { className: "cont-text", children: i })
     ] }),
-    /* @__PURE__ */ t(b, { color: "warning", rating: m })
+    /* @__PURE__ */ r(k, { color: "warning", rating: h })
   ] }) });
-}), V = h(({}, r) => /* @__PURE__ */ t(N, { className: "review-card", children: /* @__PURE__ */ c(S, { children: [
-  /* @__PURE__ */ t("div", { className: "skeleton-img" }),
-  /* @__PURE__ */ t("div", { className: "cont" }),
-  /* @__PURE__ */ t(b, { color: "warning", rating: 0 })
-] }) })), B = ({ limit: r = 3, isLoading: o = !1, keyPrefix: n }) => /* @__PURE__ */ t(w, { children: Array.from({ length: r }, (i, a) => /* @__PURE__ */ t(
-  V,
-  {
-    isLoading: o
-  },
-  `${n}-skeleton-review-card-${a}`
-)) }), D = ({
-  children: r,
-  fallbackComponent: o = /* @__PURE__ */ t(w, {}),
-  isLoading: n = !1,
-  limit: i,
-  keyPrefix: a
-}) => /* @__PURE__ */ t(C, { fallbackComponent: o, children: n === !0 ? /* @__PURE__ */ t(
-  B,
-  {
-    isLoading: n,
-    limit: i,
-    keyPrefix: a
+}), H = s(L)`
+  @media (max-width: ${$ + "px"}) {
+    flex-direction: column;
+
+    & > div {
+      flex-direction: column;
+
+      & > div {
+        ${G}
+      }
+    }
   }
-) : r }), y = k(L), ee = h((r, o) => {
+`, X = ({ keyPrefix: t }) => /* @__PURE__ */ n(H, { children: [
+  /* @__PURE__ */ n(f, { children: [
+    /* @__PURE__ */ r(
+      w,
+      {
+        height: "6.25rem",
+        width: "6.25rem",
+        borderRadius: "0.75rem"
+      }
+    ),
+    /* @__PURE__ */ r(o, { height: "2rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(o, { height: "1rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(o, { height: "1rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(
+      o,
+      {
+        height: "1rem",
+        borderRadius: "0.75rem",
+        width: "6rem"
+      }
+    )
+  ] }, `${t}-1`),
+  /* @__PURE__ */ n(f, { noGradient: !0, children: [
+    /* @__PURE__ */ r(
+      w,
+      {
+        height: "6.25rem",
+        width: "6.25rem",
+        borderRadius: "0.75rem"
+      }
+    ),
+    /* @__PURE__ */ r(o, { height: "2rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(o, { height: "1rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(o, { height: "1rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(
+      o,
+      {
+        height: "1rem",
+        borderRadius: "0.75rem",
+        width: "6rem"
+      }
+    )
+  ] }, `${t}-2`),
+  /* @__PURE__ */ n(f, { noGradient: !0, children: [
+    /* @__PURE__ */ r(
+      w,
+      {
+        height: "6.25rem",
+        width: "6.25rem",
+        borderRadius: "0.75rem"
+      }
+    ),
+    /* @__PURE__ */ r(o, { height: "2rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(o, { height: "1rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(o, { height: "1rem", borderRadius: "0.75rem" }),
+    /* @__PURE__ */ r(
+      o,
+      {
+        height: "1rem",
+        borderRadius: "0.75rem",
+        width: "6rem"
+      }
+    )
+  ] }, `${t}-3`)
+] }), Z = ({
+  keyPrefix: t,
+  isLoading: a = !1,
+  fallbackComponent: l = /* @__PURE__ */ r(y, {}),
+  children: i
+}) => /* @__PURE__ */ r(N, { fallbackComponent: l, children: a === !0 ? /* @__PURE__ */ r(X, { keyPrefix: t }) : i }), S = z(D), ae = v((t, a) => {
   const {
-    title: n = "Electronics reviews",
+    title: l = "Electronics reviews",
     items: i,
-    limit: a = 3,
-    onSelectCard: s = () => {
+    limit: m = 3,
+    onSelectCard: c = () => {
     },
-    isLoading: m = !1
-  } = r, g = P(), f = x(() => /* @__PURE__ */ t(w, { children: g === !0 ? i == null ? void 0 : i.map((e, p) => /* @__PURE__ */ t(
-    y,
+    isLoading: h = !1
+  } = t, g = M(), u = P(() => /* @__PURE__ */ r(y, { children: g === !0 ? i == null ? void 0 : i.map((e, p) => /* @__PURE__ */ r(
+    S,
     {
       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: () => s(e)
+      onSelectCard: () => c(e)
     },
     p
-  )) : i == null ? void 0 : i.slice(0, a).map((e, p) => /* @__PURE__ */ t(
-    y,
+  )) : i == null ? void 0 : i.slice(0, m).map((e, p) => /* @__PURE__ */ r(
+    S,
     {
       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: () => s(e)
+      onSelectCard: () => c(e)
     },
     p
-  )) }), [i, g, s, a]);
-  return /* @__PURE__ */ c(W, { ref: o, children: [
-    /* @__PURE__ */ t("div", { className: "container-title", children: n }),
-    /* @__PURE__ */ t(F, { limit: a, children: /* @__PURE__ */ t(
-      D,
-      {
-        isLoading: m,
-        limit: a,
-        keyPrefix: "explore-landing",
-        children: f
-      }
-    ) })
+  )) }), [i, g, c, m]);
+  return /* @__PURE__ */ n(F, { ref: a, children: [
+    /* @__PURE__ */ r("div", { className: "container-title", children: l }),
+    /* @__PURE__ */ r(Z, { isLoading: h, keyPrefix: "reviews-skeleton", children: /* @__PURE__ */ r(O, { limit: m, children: u }) })
   ] });
 });
 export {
-  ee as default
+  ae as default
 };