@lanaco/lnc-react-ui 4.0.169 → 4.0.171

package/dist/Separator.js

@@ -2,7 +2,7 @@ import { jsx as p } from "react/jsx-runtime";
 import { forwardRef as l } from "react";
 import { P as e } from "./index-CblbdqjE.js";
 import { s as i } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { b as n } from "./utils-BdsZgOUE.js";
+import { b as n } from "./utils-DHfRApMf.js";
 import { u as c } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const f = i.div`
   height: 1px;

package/dist/ShopCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),d=require("react"),u=require("./Button.cjs"),_=require("./skeleton-Ccd6EDeB.cjs"),C=require("./utils-Dl9xPH4c.cjs"),k=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),N=k.styled.div`
+"use strict";const t=require("react/jsx-runtime"),h=require("react"),u=require("./Button.cjs"),k=require("./index-C5r__0lD.cjs"),$=require("./utils-Dl9xPH4c.cjs"),g=require("./emotion-styled.browser.esm-BtEseadx.cjs"),x=require("./consts-goSZX3xP.cjs"),s=require("./style-BAcV7F53.cjs"),R=g.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -60,7 +60,7 @@
 
   & .wrapper__cards {
     display: grid;
-    grid-template-columns: ${i=>`repeat(${i==null?void 0:i.limitCards}, minmax(0, 1fr))`};
+    grid-template-columns: ${r=>`repeat(${r==null?void 0:r.limitCards}, minmax(0, 1fr))`};
     gap: 1.25rem;
     justify-items: center;
     align-items: center;
@@ -83,7 +83,7 @@
     display: none;
   }
 
-  @media (max-width: ${S.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
     gap: 1.25rem;
 
     & .wrapper__view-all {
@@ -103,7 +103,7 @@
     & .wrapper__cards {
       gap: 1rem;
 
-      ${i=>i!=null&&i.gridView?`
+      ${r=>r!=null&&r.gridView?`
             grid-template-columns: repeat(2, minmax(0, 1fr)); 
             & > div {
               min-width:100%;
@@ -128,4 +128,17 @@
             }`}
     }
   }
-`,q=d.forwardRef(({title:i,subtitle:o,items:n,limit:g=4,limitForMobile:w=2,buttonText:a="Show More",onSelectCard:f=()=>{},onButtonAction:r=()=>{},icon:p,getImage:h=()=>{},getProductImage:x=()=>{},hideProducts:y=!1,showRating:c=!0,gridView:l=!1,componentName:v},b)=>{var m;return t.jsxs(N,{ref:b,limitCards:g,limitCardsForMobile:w,gridView:l,children:[t.jsxs("div",{className:"wrapper__heading",children:[t.jsxs("div",{className:"wrapper__title",children:[i&&t.jsxs("div",{className:"title__text",children:[C.isDefinedNotEmptyString(p)&&t.jsx("i",{className:p}),t.jsx("span",{children:i})]}),r&&t.jsx(u,{text:a,color:"neutral",borderRadius:"curved",btnType:"tinted",className:`title__action ${l?"grid":""}`,onClick:r})]}),o&&t.jsx("div",{className:"wrapper__subtitle",children:o})]}),t.jsx("div",{className:"wrapper__cards",children:n&&(n==null?void 0:n.length)>0?n==null?void 0:n.map((e,s)=>t.jsx(_.ShopCard,{showRating:c,uuid:e==null?void 0:e.uuid,title:e==null?void 0:e.name,subtitle:e==null?void 0:e.shortDescription,rating:e==null?void 0:e.ratingArithmeticMean,reviewCount:e==null?void 0:e.reviewCount,products:e==null?void 0:e.products,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:($,j)=>f(e==null?void 0:e.uuid,j),image:h(e==null?void 0:e.profileImage,e==null?void 0:e.uuid)||null,getProductImage:x,canAcceptPayments:e==null?void 0:e.canAcceptPayments,hideProducts:y,metadata:{name:v,accessor:e==null?void 0:e.accessor}},`shop-card__${s+1}`)):(m=Array.from("1234"))==null?void 0:m.map((e,s)=>t.jsx(_.ShopCardSkeleton,{},`shop-card-skeleton__${s+1}`))}),l&&r&&t.jsx(u,{text:a,borderRadius:"curved",btnType:"basic",color:"neutral",className:"wrapper__view-all",onClick:r})]})});module.exports=q;
+`,N=g.styled(s.SkeletonRowWrapper)`
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
+    & > div {
+      background: linear-gradient(
+        to right,
+        transparent 0%,
+        #f4f6fb 10%,
+        #f4f6fb 100%
+      );
+
+      box-shadow: none;
+    }
+  }
+`,q=({keyPrefix:r})=>t.jsxs(N,{children:[t.jsx(s.SkeletonLinePlaceholder,{height:"18rem",borderRadius:"0.75rem"},`${r}-1`),t.jsx(s.SkeletonLinePlaceholder,{height:"18rem",borderRadius:"0.75rem"},`${r}-2`),t.jsx(s.SkeletonLinePlaceholder,{height:"18rem",borderRadius:"0.75rem"},`${r}-3`),t.jsx(s.SkeletonLinePlaceholder,{height:"18rem",borderRadius:"0.75rem"},`${r}-4`)]}),E=({keyPrefix:r,isLoading:l=!1,fallbackComponent:i=t.jsx(t.Fragment,{}),children:n})=>t.jsx(h.Suspense,{fallbackComponent:i,children:l===!0?t.jsx(q,{keyPrefix:r}):n}),I=h.forwardRef(({title:r,subtitle:l,items:i,isLoading:n=!1,limit:_=4,limitForMobile:f=2,buttonText:p="Show More",onSelectCard:w=()=>{},onButtonAction:o=()=>{},icon:m,getImage:c=()=>{},getProductImage:d=()=>{},hideProducts:b=!1,showRating:y=!0,gridView:a=!1,componentName:v},j)=>t.jsxs(R,{ref:j,limitCards:_,limitCardsForMobile:f,gridView:a,children:[t.jsxs("div",{className:"wrapper__heading",children:[t.jsxs("div",{className:"wrapper__title",children:[r&&t.jsxs("div",{className:"title__text",children:[$.isDefinedNotEmptyString(m)&&t.jsx("i",{className:m}),t.jsx("span",{children:r})]}),o&&!n&&t.jsx(u,{text:p,color:"neutral",borderRadius:"curved",btnType:"tinted",className:`title__action ${a?"grid":""}`,onClick:o})]}),l&&t.jsx("div",{className:"wrapper__subtitle",children:l})]}),t.jsx(E,{isLoading:n,keyPrefix:"shop-cards-skeleton",children:t.jsx("div",{className:"wrapper__cards",children:i==null?void 0:i.map((e,S)=>t.jsx(k.ShopCard,{showRating:y,uuid:e==null?void 0:e.uuid,title:e==null?void 0:e.name,subtitle:e==null?void 0:e.shortDescription,rating:e==null?void 0:e.ratingArithmeticMean,reviewCount:e==null?void 0:e.reviewCount,products:e==null?void 0:e.products,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:(P,C)=>w(e==null?void 0:e.uuid,C),image:c(e==null?void 0:e.profileImage,e==null?void 0:e.uuid)||null,getProductImage:d,canAcceptPayments:e==null?void 0:e.canAcceptPayments,hideProducts:b,metadata:{name:v,accessor:e==null?void 0:e.accessor}},`shop-card__${S+1}`))})}),a&&o&&!n&&t.jsx(u,{text:p,borderRadius:"curved",btnType:"basic",color:"neutral",className:"wrapper__view-all",onClick:o})]}));module.exports=I;

package/dist/ShopCardsSection.js

@@ -1,11 +1,12 @@
-import { jsxs as n, jsx as i } from "react/jsx-runtime";
-import { forwardRef as C } from "react";
-import _ from "./Button.js";
-import { S as k, a as S } from "./skeleton-5mO22c5S.js";
-import { k as N } from "./utils-BdsZgOUE.js";
-import { s as $ } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M } from "./consts-BuFChS64.js";
-const j = $.div`
+import { jsxs as l, jsx as r, Fragment as $ } from "react/jsx-runtime";
+import { Suspense as N, forwardRef as R } from "react";
+import h from "./Button.js";
+import { S as M } from "./index-BPntOicE.js";
+import { k as j } from "./utils-DHfRApMf.js";
+import { s as u } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as g } from "./consts-BuFChS64.js";
+import { a as z, b as s } from "./style-CXMUA6cI.js";
+const E = u.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -90,7 +91,7 @@ const j = $.div`
     display: none;
   }
 
-  @media (max-width: ${M + "px"}) {
+  @media (max-width: ${g + "px"}) {
     gap: 1.25rem;
 
     & .wrapper__view-all {
@@ -135,93 +136,149 @@ const j = $.div`
             }`}
     }
   }
-`, L = C(
+`, I = u(z)`
+  @media (max-width: ${g + "px"}) {
+    & > div {
+      background: linear-gradient(
+        to right,
+        transparent 0%,
+        #f4f6fb 10%,
+        #f4f6fb 100%
+      );
+
+      box-shadow: none;
+    }
+  }
+`, F = ({ keyPrefix: t }) => /* @__PURE__ */ l(I, { children: [
+  /* @__PURE__ */ r(
+    s,
+    {
+      height: "18rem",
+      borderRadius: "0.75rem"
+    },
+    `${t}-1`
+  ),
+  /* @__PURE__ */ r(
+    s,
+    {
+      height: "18rem",
+      borderRadius: "0.75rem"
+    },
+    `${t}-2`
+  ),
+  /* @__PURE__ */ r(
+    s,
+    {
+      height: "18rem",
+      borderRadius: "0.75rem"
+    },
+    `${t}-3`
+  ),
+  /* @__PURE__ */ r(
+    s,
+    {
+      height: "18rem",
+      borderRadius: "0.75rem"
+    },
+    `${t}-4`
+  )
+] }), D = ({
+  keyPrefix: t,
+  isLoading: o = !1,
+  fallbackComponent: i = /* @__PURE__ */ r($, {}),
+  children: n
+}) => /* @__PURE__ */ r(N, { fallbackComponent: i, children: o === !0 ? /* @__PURE__ */ r(F, { keyPrefix: t }) : n }), H = R(
   ({
     title: t,
-    subtitle: s,
-    items: l,
-    limit: g = 4,
-    limitForMobile: u = 2,
-    buttonText: p = "Show More",
-    onSelectCard: w = () => {
+    subtitle: o,
+    items: i,
+    isLoading: n = !1,
+    limit: w = 4,
+    limitForMobile: _ = 2,
+    buttonText: m = "Show More",
+    onSelectCard: d = () => {
     },
-    onButtonAction: r = () => {
+    onButtonAction: a = () => {
     },
-    icon: m,
-    getImage: h = () => {
+    icon: f,
+    getImage: b = () => {
     },
-    getProductImage: y = () => {
+    getProductImage: v = () => {
     },
-    hideProducts: v = !1,
-    showRating: x = !0,
-    gridView: o = !1,
-    componentName: b
-  }, c) => {
-    var f;
-    return /* @__PURE__ */ n(
-      j,
-      {
-        ref: c,
-        limitCards: g,
-        limitCardsForMobile: u,
-        gridView: o,
-        children: [
-          /* @__PURE__ */ n("div", { className: "wrapper__heading", children: [
-            /* @__PURE__ */ n("div", { className: "wrapper__title", children: [
-              t && /* @__PURE__ */ n("div", { className: "title__text", children: [
-                N(m) && /* @__PURE__ */ i("i", { className: m }),
-                /* @__PURE__ */ i("span", { children: t })
-              ] }),
-              r && /* @__PURE__ */ i(
-                _,
-                {
-                  text: p,
-                  color: "neutral",
-                  borderRadius: "curved",
-                  btnType: "tinted",
-                  className: `title__action ${o ? "grid" : ""}`,
-                  onClick: r
-                }
-              )
+    hideProducts: x = !1,
+    showRating: c = !0,
+    gridView: p = !1,
+    componentName: y
+  }, S) => /* @__PURE__ */ l(
+    E,
+    {
+      ref: S,
+      limitCards: w,
+      limitCardsForMobile: _,
+      gridView: p,
+      children: [
+        /* @__PURE__ */ l("div", { className: "wrapper__heading", children: [
+          /* @__PURE__ */ l("div", { className: "wrapper__title", children: [
+            t && /* @__PURE__ */ l("div", { className: "title__text", children: [
+              j(f) && /* @__PURE__ */ r("i", { className: f }),
+              /* @__PURE__ */ r("span", { children: t })
             ] }),
-            s && /* @__PURE__ */ i("div", { className: "wrapper__subtitle", children: s })
+            a && !n && /* @__PURE__ */ r(
+              h,
+              {
+                text: m,
+                color: "neutral",
+                borderRadius: "curved",
+                btnType: "tinted",
+                className: `title__action ${p ? "grid" : ""}`,
+                onClick: a
+              }
+            )
           ] }),
-          /* @__PURE__ */ i("div", { className: "wrapper__cards", children: l && (l == null ? void 0 : l.length) > 0 ? l == null ? void 0 : l.map((e, a) => /* @__PURE__ */ i(
-            k,
-            {
-              showRating: x,
-              uuid: e == null ? void 0 : e.uuid,
-              title: e == null ? void 0 : e.name,
-              subtitle: e == null ? void 0 : e.shortDescription,
-              rating: e == null ? void 0 : e.ratingArithmeticMean,
-              reviewCount: e == null ? void 0 : e.reviewCount,
-              products: e == null ? void 0 : e.products,
-              imageComponent: e == null ? void 0 : e.imageComponent,
-              onSelectCard: (z, d) => w(e == null ? void 0 : e.uuid, d),
-              image: h(e == null ? void 0 : e.profileImage, e == null ? void 0 : e.uuid) || null,
-              getProductImage: y,
-              canAcceptPayments: e == null ? void 0 : e.canAcceptPayments,
-              hideProducts: v,
-              metadata: { name: b, accessor: e == null ? void 0 : e.accessor }
-            },
-            `shop-card__${a + 1}`
-          )) : (f = Array.from("1234")) == null ? void 0 : f.map((e, a) => /* @__PURE__ */ i(S, {}, `shop-card-skeleton__${a + 1}`)) }),
-          o && r && /* @__PURE__ */ i(
-            _,
-            {
-              text: p,
-              borderRadius: "curved",
-              btnType: "basic",
-              color: "neutral",
-              className: "wrapper__view-all",
-              onClick: r
-            }
-          )
-        ]
-      }
-    );
-  }
+          o && /* @__PURE__ */ r("div", { className: "wrapper__subtitle", children: o })
+        ] }),
+        /* @__PURE__ */ r(
+          D,
+          {
+            isLoading: n,
+            keyPrefix: "shop-cards-skeleton",
+            children: /* @__PURE__ */ r("div", { className: "wrapper__cards", children: i == null ? void 0 : i.map((e, C) => /* @__PURE__ */ r(
+              M,
+              {
+                showRating: c,
+                uuid: e == null ? void 0 : e.uuid,
+                title: e == null ? void 0 : e.name,
+                subtitle: e == null ? void 0 : e.shortDescription,
+                rating: e == null ? void 0 : e.ratingArithmeticMean,
+                reviewCount: e == null ? void 0 : e.reviewCount,
+                products: e == null ? void 0 : e.products,
+                imageComponent: e == null ? void 0 : e.imageComponent,
+                onSelectCard: (P, k) => d(e == null ? void 0 : e.uuid, k),
+                image: b(e == null ? void 0 : e.profileImage, e == null ? void 0 : e.uuid) || null,
+                getProductImage: v,
+                canAcceptPayments: e == null ? void 0 : e.canAcceptPayments,
+                hideProducts: x,
+                metadata: { name: y, accessor: e == null ? void 0 : e.accessor }
+              },
+              `shop-card__${C + 1}`
+            )) })
+          }
+        ),
+        p && a && !n && /* @__PURE__ */ r(
+          h,
+          {
+            text: m,
+            borderRadius: "curved",
+            btnType: "basic",
+            color: "neutral",
+            className: "wrapper__view-all",
+            onClick: a
+          }
+        )
+      ]
+    }
+  )
 );
 export {
-  L as default
+  H as default
 };

package/dist/Sidebar.js

@@ -3,7 +3,7 @@ import { forwardRef as S, useState as x, useEffect as C } from "react";
 import { P as o } from "./index-CblbdqjE.js";
 import { s as l } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import y from "./Icon.js";
-import { u as $ } from "./utils-BdsZgOUE.js";
+import { u as $ } from "./utils-DHfRApMf.js";
 import { u as _ } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 const v = l.aside`
   direction: ${(e) => e.placement == "right" ? "rtl" : "ltr"};

package/dist/SimpleCategoriesSection.cjs

@@ -1,9 +1,9 @@
-"use strict";const t=require("react/jsx-runtime"),s=require("react"),w=require("./emotion-styled.browser.esm-BtEseadx.cjs"),C=require("./consts-goSZX3xP.cjs"),q=require("./useDetectMobile-zkbzoOGV.cjs"),d=require("./utils-Dl9xPH4c.cjs"),k=require("./style-Db3VFbfP.cjs"),v=require("./Button.cjs"),p=require("./suspense-categories-card-simple-CjGtzfzp.cjs"),M=w.styled.div`
+"use strict";const e=require("react/jsx-runtime"),i=require("react"),q=require("./emotion-styled.browser.esm-BtEseadx.cjs"),b=require("./consts-goSZX3xP.cjs"),C=require("./useDetectMobile-zkbzoOGV.cjs"),u=require("./utils-Dl9xPH4c.cjs"),_=require("./style-Db3VFbfP.cjs"),y=require("./Button.cjs"),N=require("./CategorySimpleCard-Qe5QStrs.cjs"),o=require("./style-BAcV7F53.cjs"),v=q.styled.div`
   display: grid;
-  grid-template-columns: ${a=>"repeat(6,  minmax(0, 1fr))"};
+  grid-template-columns: ${t=>"repeat(6,  minmax(0, 1fr))"};
   gap: 2rem;
 
-  @media (max-width: ${C.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
     display: flex;
     gap: 1rem;
     overflow-x: auto;
@@ -22,4 +22,10 @@
       /* Safari and Chrome */
     }
   }
-`,m=s.memo(p.CategorySimpleCard),N=s.forwardRef((a,g)=>{const{icon:l,title:b="Shop by category",items:r,buttonText:y="Shop now",buttonLink:u,limit:o=12,onButtonAction:h=()=>{},onSelectCard:i=()=>{},isLoading:f=!1,getImage:c=()=>{}}=a,S=q.useDetectMobile(),j=s.useMemo(()=>t.jsx(t.Fragment,{children:S===!0?r==null?void 0:r.map((e,n)=>t.jsx(m,{uuid:e==null?void 0:e.uuid,image:c(e==null?void 0:e.image)||null,name:e==null?void 0:e.name,onSelectCard:()=>i==null?void 0:i(e==null?void 0:e.uuid)},n)):r==null?void 0:r.slice(0,o).map((e,n)=>t.jsx(m,{uuid:e==null?void 0:e.uuid,image:c(e==null?void 0:e.image)||null,name:e==null?void 0:e.name,onSelectCard:()=>i==null?void 0:i(e)},n))}),[r]);return t.jsxs(k.RegulatTitleSectionWrapper,{ref:g,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[d.isDefinedNotEmptyString(l)&&t.jsx("i",{className:l}),t.jsx("span",{children:b})]}),d.isDefinedNotEmptyString(u)&&t.jsx(v,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var n;(n=e==null?void 0:e.target)==null||n.blur(),h(u)},borderRadius:"curved",className:"button-link",children:y})]}),t.jsx(M,{limit:o,children:t.jsx(p.SuspenseSimpleCategoryCard,{isLoading:f,limit:o,keyPrefix:"explore-landing",children:j})})]})});module.exports=N;
+`,E=q.styled(o.SkeletonColumnWrapper)`
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
+    & .skeleton__cards {
+      overflow-x: hidden;
+    }
+  }
+`,R=({keyPrefix:t})=>e.jsxs(E,{children:[e.jsxs(o.SkeletonRowWrapper,{className:"skeleton__cards",children:[e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-1`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-2`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-3`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-4`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-5`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-6`)]}),e.jsx(o.SkeletonRowWrapper,{children:e.jsxs(o.SkeletonRowWrapper,{className:"skeleton__cards",children:[e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-7`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-8`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-9`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-10`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-11`),e.jsx(o.SkeletonSquarePlaceholder,{height:"8.25rem"},`${t}-12`)]})})]}),M=({keyPrefix:t,isLoading:c=!1,fallbackComponent:a=e.jsx(e.Fragment,{}),children:d})=>e.jsx(i.Suspense,{fallbackComponent:a,children:c===!0?e.jsx(R,{keyPrefix:t}):d}),j=i.memo(N.CategorySimpleCard),I=i.forwardRef((t,c)=>{const{icon:a,title:d="Shop by category",items:l,buttonText:m="Shop now",buttonLink:h,limit:S=12,onButtonAction:k=()=>{},onSelectCard:s=()=>{},isLoading:p=!1,getImage:g=()=>{}}=t,w=C.useDetectMobile(),$=i.useMemo(()=>e.jsx(e.Fragment,{children:w===!0?l==null?void 0:l.map((r,n)=>e.jsx(j,{uuid:r==null?void 0:r.uuid,image:g(r==null?void 0:r.image)||null,name:r==null?void 0:r.name,onSelectCard:()=>s==null?void 0:s(r==null?void 0:r.uuid)},n)):l==null?void 0:l.slice(0,S).map((r,n)=>e.jsx(j,{uuid:r==null?void 0:r.uuid,image:g(r==null?void 0:r.image)||null,name:r==null?void 0:r.name,onSelectCard:()=>s==null?void 0:s(r)},n))}),[l]);return e.jsxs(_.RegulatTitleSectionWrapper,{ref:c,children:[e.jsxs("div",{className:"regular-title",children:[e.jsxs("div",{className:"regular-title-text",children:[u.isDefinedNotEmptyString(a)&&e.jsx("i",{className:a}),e.jsx("span",{children:d})]}),u.isDefinedNotEmptyString(m)&&u.isDefinedNotEmptyString(h)&&!p&&e.jsx(y,{type:"button",btnType:"tinted",color:"neutral",onClick:r=>{var n;(n=r==null?void 0:r.target)==null||n.blur(),k(h)},borderRadius:"curved",className:"button-link",children:m})]}),e.jsx(M,{isLoading:p,keyPrefix:"simple-categories-skeleton",children:e.jsx(v,{limit:S,children:$})})]})});module.exports=I;

package/dist/SimpleCategoriesSection.js

@@ -1,18 +1,19 @@
-import { jsx as r, Fragment as S, jsxs as n } from "react/jsx-runtime";
-import { memo as k, forwardRef as C, useMemo as v } from "react";
-import { s as M } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as N } from "./consts-BuFChS64.js";
-import { u as E } from "./useDetectMobile-Bkvj0VMa.js";
-import { k as p } from "./utils-BdsZgOUE.js";
-import { R as I } from "./style-DKAOBWn3.js";
-import R from "./Button.js";
-import { C as B, S as L } from "./suspense-categories-card-simple-BGj475Ca.js";
-const P = M.div`
+import { jsxs as l, jsx as t, Fragment as f } from "react/jsx-runtime";
+import { Suspense as N, memo as M, forwardRef as R, useMemo as E } from "react";
+import { s as w } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as C } from "./consts-BuFChS64.js";
+import { u as I } from "./useDetectMobile-Bkvj0VMa.js";
+import { k as c } from "./utils-DHfRApMf.js";
+import { R as W } from "./style-D3pIrH3v.js";
+import B from "./Button.js";
+import { C as L } from "./CategorySimpleCard-laAY-RUT.js";
+import { S as T, a as p, c as o } from "./style-CXMUA6cI.js";
+const j = w.div`
   display: grid;
-  grid-template-columns: ${(l) => "repeat(6,  minmax(0, 1fr))"};
+  grid-template-columns: ${(r) => "repeat(6,  minmax(0, 1fr))"};
   gap: 2rem;
 
-  @media (max-width: ${N + "px"}) {
+  @media (max-width: ${C + "px"}) {
     display: flex;
     gap: 1rem;
     overflow-x: auto;
@@ -31,73 +32,100 @@ const P = M.div`
       /* Safari and Chrome */
     }
   }
-`, u = k(B), G = C((l, c) => {
+`, y = w(T)`
+  @media (max-width: ${C + "px"}) {
+    & .skeleton__cards {
+      overflow-x: hidden;
+    }
+  }
+`, z = ({ keyPrefix: r }) => /* @__PURE__ */ l(y, { children: [
+  /* @__PURE__ */ l(p, { className: "skeleton__cards", children: [
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-1`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-2`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-3`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-4`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-5`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-6`)
+  ] }),
+  /* @__PURE__ */ t(p, { children: /* @__PURE__ */ l(p, { className: "skeleton__cards", children: [
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-7`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-8`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-9`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-10`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-11`),
+    /* @__PURE__ */ t(o, { height: "8.25rem" }, `${r}-12`)
+  ] }) })
+] }), D = ({
+  keyPrefix: r,
+  isLoading: s = !1,
+  fallbackComponent: m = /* @__PURE__ */ t(f, {}),
+  children: d
+}) => /* @__PURE__ */ t(N, { fallbackComponent: m, children: s === !0 ? /* @__PURE__ */ t(z, { keyPrefix: r }) : d }), $ = M(L), Q = R((r, s) => {
   const {
     icon: m,
-    title: g = "Shop by category",
-    items: o,
-    buttonText: f = "Shop now",
-    buttonLink: s,
-    limit: a = 12,
-    onButtonAction: b = () => {
+    title: d = "Shop by category",
+    items: i,
+    buttonText: h = "Shop now",
+    buttonLink: u,
+    limit: g = 12,
+    onButtonAction: v = () => {
     },
-    onSelectCard: t = () => {
+    onSelectCard: a = () => {
     },
-    isLoading: h = !1,
-    getImage: d = () => {
+    isLoading: S = !1,
+    getImage: b = () => {
     }
-  } = l, y = E(), w = v(() => /* @__PURE__ */ r(S, { children: y === !0 ? o == null ? void 0 : o.map((e, i) => /* @__PURE__ */ r(
-    u,
+  } = r, _ = I(), k = E(() => /* @__PURE__ */ t(f, { children: _ === !0 ? i == null ? void 0 : i.map((e, n) => /* @__PURE__ */ t(
+    $,
     {
       uuid: e == null ? void 0 : e.uuid,
-      image: d(e == null ? void 0 : e.image) || null,
+      image: b(e == null ? void 0 : e.image) || null,
       name: e == null ? void 0 : e.name,
-      onSelectCard: () => t == null ? void 0 : t(e == null ? void 0 : e.uuid)
+      onSelectCard: () => a == null ? void 0 : a(e == null ? void 0 : e.uuid)
     },
-    i
-  )) : o == null ? void 0 : o.slice(0, a).map((e, i) => /* @__PURE__ */ r(
-    u,
+    n
+  )) : i == null ? void 0 : i.slice(0, g).map((e, n) => /* @__PURE__ */ t(
+    $,
     {
       uuid: e == null ? void 0 : e.uuid,
-      image: d(e == null ? void 0 : e.image) || null,
+      image: b(e == null ? void 0 : e.image) || null,
       name: e == null ? void 0 : e.name,
-      onSelectCard: () => t == null ? void 0 : t(e)
+      onSelectCard: () => a == null ? void 0 : a(e)
     },
-    i
-  )) }), [o]);
-  return /* @__PURE__ */ n(I, { ref: c, children: [
-    /* @__PURE__ */ n("div", { className: "regular-title", children: [
-      /* @__PURE__ */ n("div", { className: "regular-title-text", children: [
-        p(m) && /* @__PURE__ */ r("i", { className: m }),
-        /* @__PURE__ */ r("span", { children: g })
+    n
+  )) }), [i]);
+  return /* @__PURE__ */ l(W, { ref: s, children: [
+    /* @__PURE__ */ l("div", { className: "regular-title", children: [
+      /* @__PURE__ */ l("div", { className: "regular-title-text", children: [
+        c(m) && /* @__PURE__ */ t("i", { className: m }),
+        /* @__PURE__ */ t("span", { children: d })
       ] }),
-      p(s) && /* @__PURE__ */ r(
-        R,
+      c(h) && c(u) && !S && /* @__PURE__ */ t(
+        B,
         {
           type: "button",
           btnType: "tinted",
           color: "neutral",
           onClick: (e) => {
-            var i;
-            (i = e == null ? void 0 : e.target) == null || i.blur(), b(s);
+            var n;
+            (n = e == null ? void 0 : e.target) == null || n.blur(), v(u);
           },
           borderRadius: "curved",
           className: "button-link",
-          children: f
+          children: h
         }
       )
     ] }),
-    /* @__PURE__ */ r(P, { limit: a, children: /* @__PURE__ */ r(
-      L,
+    /* @__PURE__ */ t(
+      D,
       {
-        isLoading: h,
-        limit: a,
-        keyPrefix: "explore-landing",
-        children: w
+        isLoading: S,
+        keyPrefix: "simple-categories-skeleton",
+        children: /* @__PURE__ */ t(j, { limit: g, children: k })
       }
-    ) })
+    )
   ] });
 });
 export {
-  G as default
+  Q as default
 };

package/dist/SimpleProductsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),n=require("react"),N=require("./emotion-styled.browser.esm-BtEseadx.cjs"),U=require("./consts-goSZX3xP.cjs"),F=require("./useDetectMobile-zkbzoOGV.cjs"),v=require("./index-DicTpiG0.cjs"),T=require("./index-CSgGox95.cjs"),_=require("./suspense-product-card-simple-DJ8UYolb.cjs"),B=N.styled.div`
+"use strict";const t=require("react/jsx-runtime"),l=require("react"),k=require("./emotion-styled.browser.esm-BtEseadx.cjs"),$=require("./consts-goSZX3xP.cjs"),U=require("./useDetectMobile-zkbzoOGV.cjs"),I=require("./index-CfT9e5O9.cjs"),L=require("./index-CSgGox95.cjs"),i=require("./style-BAcV7F53.cjs"),R=k.styled.div`
   display: grid;
   grid-template-columns: repeat(6, 1fr);
   gap: 1.25rem;
@@ -9,7 +9,7 @@
     margin: auto;
   }
 
-  @media (max-width: ${U.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${$.MOBILE_SIZE_PX+"px"}) {
     grid-template-columns: repeat(2, 1fr);
 
     & .text-block-v1 {
@@ -28,4 +28,17 @@
 
     }
   }
-`,b=n.memo(v.SimpleProductCard),I=n.forwardRef((S,h)=>{const{title:w,subtitle:q,description:y,buttonText:P,buttonLink:f,items:i,onButtonAction:j=()=>{},onSelectCard:c=()=>{},isLoading:C=!1,limit:r=6,getImage:o=()=>{},negotiableText:a,freeText:l,componentName:d}=S,m=F.useDetectMobile(),k=n.useMemo(()=>{var p,g;return t.jsx(t.Fragment,{children:m===!0?(p=i==null?void 0:i.slice(0,4))==null?void 0:p.map((e,s)=>t.jsx(b,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(M,u)=>c({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:u}),image:o(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,negotiableText:a,freeText:l,metadata:{name:d,accessor:e==null?void 0:e.accessor}},s)):(g=i==null?void 0:i.slice(0,9))==null?void 0:g.map((e,s)=>t.jsx(b,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(M,u)=>c({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:u}),image:o(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,negotiableText:a,freeText:l,metadata:{name:d,accessor:e==null?void 0:e.accessor}},s))})},[i,m,r]);return t.jsxs(B,{ref:h,limit:r,children:[t.jsx(T.TextBlockV1,{subtitle:q,title:w,description:y,buttonText:P,buttonLink:f,onButtonAction:j,className:"text-block-v1"}),t.jsx(_.SuspenseSimpleProductCard,{isLoading:C,limit:r,keyPrefix:"explore-landing",children:k})]})});module.exports=I;
+`,B=k.styled(i.SkeletonColumnWrapper)`
+  @media (max-width: ${$.MOBILE_SIZE_PX+"px"}) {
+    & .skeleton__cards {
+      & > div {
+        width: 100%;
+        height: 100%;
+
+        &:nth-of-type(even) {
+          display: none;
+        }
+      }
+    }
+  }
+`,E=({keyPrefix:r})=>t.jsxs(B,{children:[t.jsxs(i.SkeletonRowWrapper,{className:"skeleton__cards",children:[t.jsx(i.SkeletonLinePlaceholder,{width:"100%",height:"11.125rem"},`${r}-1`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-2`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-3`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-4`)]}),t.jsxs(i.SkeletonRowWrapper,{className:"skeleton__cards",children:[t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-5`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-6`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-7`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-8`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-9`),t.jsx(i.SkeletonSquarePlaceholder,{height:"11.125rem",width:"11.125rem"},`${r}-10`)]})]}),T=({keyPrefix:r,isLoading:n=!1,fallbackComponent:o=t.jsx(t.Fragment,{}),children:a})=>t.jsx(l.Suspense,{fallbackComponent:o,children:n===!0?t.jsx(E,{keyPrefix:r}):a}),b=l.memo(I.SimpleProductCard),W=l.forwardRef((r,n)=>{const{title:o,subtitle:a,description:_,buttonText:P,buttonLink:N,items:s,onButtonAction:C=()=>{},onSelectCard:u=()=>{},isLoading:M=!1,limit:m=6,getImage:h=()=>{},negotiableText:S,freeText:p,componentName:g}=r,j=U.useDetectMobile(),v=l.useMemo(()=>{var w,q;return t.jsx(t.Fragment,{children:j===!0?(w=s==null?void 0:s.slice(0,4))==null?void 0:w.map((e,d)=>t.jsx(b,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(F,c)=>u({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:c}),image:h(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,negotiableText:S,freeText:p,metadata:{name:g,accessor:e==null?void 0:e.accessor}},d)):(q=s==null?void 0:s.slice(0,9))==null?void 0:q.map((e,d)=>t.jsx(b,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,currency:e==null?void 0:e.currency,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(F,c)=>u({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:c}),image:h(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,negotiableText:S,freeText:p,metadata:{name:g,accessor:e==null?void 0:e.accessor}},d))})},[s,j,m]);return t.jsx(T,{isLoading:M,keyPrefix:"simple-products-skeleton",children:t.jsxs(R,{ref:n,limit:m,children:[t.jsx(L.TextBlockV1,{subtitle:a,title:o,description:_,buttonText:P,buttonLink:N,onButtonAction:C,className:"text-block-v1"}),v]})})});module.exports=W;