@lanaco/lnc-react-ui 4.0.160 → 4.0.161

package/dist/BlogCardsSponsoredSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),d=require("react"),l=require("./utils-Dl9xPH4c.cjs"),w=require("./Icon.cjs"),R=require("./style-lSjkOR95.cjs"),x=require("./index-BueKsXT8.cjs"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-goSZX3xP.cjs"),S=require("./suspense-large-CFmcSzX-.cjs"),z=require("./Button.cjs"),I=v.styled.div`
+"use strict";const r=require("react/jsx-runtime"),d=require("react"),l=require("./utils-Dl9xPH4c.cjs"),w=require("./Icon.cjs"),R=require("./style-Db3VFbfP.cjs"),x=require("./index-BueKsXT8.cjs"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-goSZX3xP.cjs"),S=require("./suspense-large-CFmcSzX-.cjs"),z=require("./Button.cjs"),I=v.styled.div`
   display: flex;
   padding: 1rem;
   align-items: center;
@@ -192,6 +192,8 @@
   }
 
   @media (max-width: ${y.MOBILE_SIZE_PX+"px"}) {
+    gap: 1.25rem;
+
     & .wrapper__title {
       & .title__text {
         font-size: 1.375rem;
@@ -200,7 +202,7 @@
 
     & .wrapper__cards {
       grid-template-columns: repeat(1, minmax(0, 1fr));
-      gap: 1rem;
+      gap: 1.5rem;
     }
   }
 `,$=d.memo(q),L=d.forwardRef(({title:s,subtitle:m,icon:n,buttonText:_,buttonLink:f,timeToReadText:u="{0} min read",items:o,onButtonAction:c=()=>{},onSelectCard:p=()=>{},isLoading:h=!1,getImage:t=()=>{},componentName:b},g)=>{const i=d.useMemo(()=>{var a;return(a=o==null?void 0:o.slice(0,4))==null?void 0:a.map((e,j)=>r.jsx($,{title:e==null?void 0:e.title,titleSlug:e==null?void 0:e.titleSlug,options:e==null?void 0:e.options,publishedAt:e==null?void 0:e.publishedAt,timeToReadText:u,timeToRead:e==null?void 0:e.timeToRead,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,isSponsored:e==null?void 0:e.isSponsored,onSelectCard:(O,N)=>p==null?void 0:p(e,N),imageUrl:t(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,metadata:{name:b,accessor:e==null?void 0:e.accessor}},`blog-card-sponsored__${j+1}`))},[o]);return r.jsxs(k,{ref:g,children:[r.jsxs("div",{className:"wrapper__heading",children:[r.jsxs("div",{className:"wrapper__title",children:[s&&r.jsxs("div",{className:"title__text",children:[l.isDefinedNotEmptyString(n)&&r.jsx("i",{className:n}),r.jsx("span",{children:s})]}),c&&r.jsx(z,{text:_,borderRadius:"curved",btnType:"tinted",className:"title__action",color:"neutral",onClick:a=>{var e;(e=a==null?void 0:a.target)==null||e.blur(),c==null||c(f)}})]}),m&&r.jsx("div",{className:"wrapper__subtitle",children:m})]}),r.jsx("div",{className:"wrapper__cards",children:r.jsx(S.SuspenseBlogLarge,{isLoading:h,limit:4,keyPrefix:"blog-section",children:i})})]})});module.exports=L;

package/dist/BlogCardsSponsoredSection.js

@@ -2,7 +2,7 @@ import { jsxs as i, jsx as r } from "react/jsx-runtime";
 import { forwardRef as v, useRef as $, memo as j, useMemo as I } from "react";
 import { p as y, s as R, v as L, w as b, k as O } from "./utils-BdsZgOUE.js";
 import w from "./Icon.js";
-import { B as T } from "./style-BLuyU97E.js";
+import { B as T } from "./style-DKAOBWn3.js";
 import { P as U } from "./index-CF3HhgvN.js";
 import { s as N } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as z } from "./consts-BuFChS64.js";
@@ -254,6 +254,8 @@ const M = N.div`
   }
 
   @media (max-width: ${z + "px"}) {
+    gap: 1.25rem;
+
     & .wrapper__title {
       & .title__text {
         font-size: 1.375rem;
@@ -262,7 +264,7 @@ const M = N.div`
 
     & .wrapper__cards {
       grid-template-columns: repeat(1, minmax(0, 1fr));
-      gap: 1rem;
+      gap: 1.5rem;
     }
   }
 `, W = j(P), Y = v(

package/dist/BlogListSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),a=require("react"),k=require("./Icon.cjs"),N=require("./IconButton.cjs"),o=require("./utils-Dl9xPH4c.cjs"),q=require("./index-BueKsXT8.cjs"),I=require("./style-lSjkOR95.cjs"),B=require("./emotion-styled.browser.esm-BtEseadx.cjs"),$=require("./consts-goSZX3xP.cjs"),C=require("./suspense-large-CFmcSzX-.cjs"),L=B.styled.div`
+"use strict";const r=require("react/jsx-runtime"),a=require("react"),k=require("./Icon.cjs"),N=require("./IconButton.cjs"),o=require("./utils-Dl9xPH4c.cjs"),q=require("./index-BueKsXT8.cjs"),I=require("./style-Db3VFbfP.cjs"),B=require("./emotion-styled.browser.esm-BtEseadx.cjs"),$=require("./consts-goSZX3xP.cjs"),C=require("./suspense-large-CFmcSzX-.cjs"),L=B.styled.div`
   display: flex;
   padding: 1rem;
   align-items: center;

package/dist/BlogListSection.js

@@ -4,7 +4,7 @@ import N from "./Icon.js";
 import B from "./IconButton.js";
 import { p as T, s as O, v as S, w as $, l as E } from "./utils-BdsZgOUE.js";
 import { P as M } from "./index-CF3HhgvN.js";
-import { B as U } from "./style-BLuyU97E.js";
+import { B as U } from "./style-DKAOBWn3.js";
 import { s as I } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as W } from "./consts-BuFChS64.js";
 import { S as A } from "./suspense-large-BMO7JH52.js";

package/dist/BlogsSectionDetailed.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),c=require("react"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),A=require("./useDetectMobile-zkbzoOGV.cjs"),i=require("./utils-Dl9xPH4c.cjs"),R=require("./style-lSjkOR95.cjs"),$=require("./Button.cjs"),B=require("./index-BueKsXT8.cjs"),D=v.styled.div`
+"use strict";const r=require("react/jsx-runtime"),c=require("react"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),A=require("./useDetectMobile-zkbzoOGV.cjs"),i=require("./utils-Dl9xPH4c.cjs"),R=require("./style-Db3VFbfP.cjs"),$=require("./Button.cjs"),B=require("./index-BueKsXT8.cjs"),D=v.styled.div`
   display: grid;
   grid-template-columns: ${s=>`repeat(${s.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;

package/dist/BlogsSectionDetailed.js

@@ -4,7 +4,7 @@ import { s as R } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as $ } from "./consts-BuFChS64.js";
 import { u as I } from "./useDetectMobile-Bkvj0VMa.js";
 import { o as y, p as U, v as W, s as j, w as T, k as N } from "./utils-BdsZgOUE.js";
-import { B as E, R as _ } from "./style-BLuyU97E.js";
+import { B as E, R as _ } from "./style-DKAOBWn3.js";
 import G from "./Button.js";
 import { P as F } from "./index-CF3HhgvN.js";
 const X = R.div`

package/dist/BlogsSectionSimple.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),c=require("react"),w=require("./emotion-styled.browser.esm-BtEseadx.cjs"),v=require("./consts-goSZX3xP.cjs"),M=require("./useDetectMobile-zkbzoOGV.cjs"),f=require("./utils-Dl9xPH4c.cjs"),k=require("./style-lSjkOR95.cjs"),T=require("./Button.cjs"),$=require("./Link.cjs"),I=require("./index-BueKsXT8.cjs"),P=w.styled.div`
+"use strict";const r=require("react/jsx-runtime"),c=require("react"),w=require("./emotion-styled.browser.esm-BtEseadx.cjs"),v=require("./consts-goSZX3xP.cjs"),M=require("./useDetectMobile-zkbzoOGV.cjs"),f=require("./utils-Dl9xPH4c.cjs"),k=require("./style-Db3VFbfP.cjs"),T=require("./Button.cjs"),$=require("./Link.cjs"),I=require("./index-BueKsXT8.cjs"),P=w.styled.div`
   display: grid;
   grid-template-columns: ${t=>`repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;

package/dist/BlogsSectionSimple.js

@@ -4,7 +4,7 @@ import { s as b } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as C } from "./consts-BuFChS64.js";
 import { u as W } from "./useDetectMobile-Bkvj0VMa.js";
 import { o as j, p as A, k as y } from "./utils-BdsZgOUE.js";
-import { B as E, R as L } from "./style-BLuyU97E.js";
+import { B as E, R as L } from "./style-DKAOBWn3.js";
 import _ from "./Button.js";
 import D from "./Link.js";
 import { P as G } from "./index-CF3HhgvN.js";

package/dist/BlogsSectionWithFilters.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),l=require("react"),x=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),W=require("./useDetectMobile-zkbzoOGV.cjs"),m=require("./utils-Dl9xPH4c.cjs"),A=require("./style-lSjkOR95.cjs"),I=require("./Button.cjs"),_=require("./Link.cjs"),z=require("./index-BueKsXT8.cjs"),E=require("./index-D0xXo7W6.cjs"),P=x.styled.div`
+"use strict";const t=require("react/jsx-runtime"),l=require("react"),x=require("./emotion-styled.browser.esm-BtEseadx.cjs"),S=require("./consts-goSZX3xP.cjs"),W=require("./useDetectMobile-zkbzoOGV.cjs"),m=require("./utils-Dl9xPH4c.cjs"),A=require("./style-Db3VFbfP.cjs"),I=require("./Button.cjs"),_=require("./Link.cjs"),z=require("./index-BueKsXT8.cjs"),E=require("./index-D0xXo7W6.cjs"),P=x.styled.div`
   display: grid;
   grid-template-columns: ${n=>`repeat(${n.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;

package/dist/BlogsSectionWithFilters.js

@@ -4,7 +4,7 @@ import { s as S } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as $ } from "./consts-BuFChS64.js";
 import { u as U } from "./useDetectMobile-Bkvj0VMa.js";
 import { o as k, p as _, k as T } from "./utils-BdsZgOUE.js";
-import { T as D } from "./style-BLuyU97E.js";
+import { T as D } from "./style-DKAOBWn3.js";
 import G from "./Button.js";
 import H from "./Link.js";
 import { P as K } from "./index-CF3HhgvN.js";

package/dist/DetailedProductsInfinitiveSection.cjs

@@ -48,6 +48,8 @@
   }
 
   @media (max-width: ${M.MOBILE_SIZE_PX+"px"}) {
+    gap: 1.25rem;
+
     & .section__items {
       display: flex;
       gap: 1rem;

package/dist/DetailedProductsInfinitiveSection.js

@@ -57,6 +57,8 @@ const A = L.div`
   }
 
   @media (max-width: ${T + "px"}) {
+    gap: 1.25rem;
+
     & .section__items {
       display: flex;
       gap: 1rem;

package/dist/DetailedProductsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const o=require("react/jsx-runtime"),l=require("react"),T=require("./emotion-styled.browser.esm-BtEseadx.cjs"),F=require("./consts-goSZX3xP.cjs"),B=require("./Button.cjs"),f=require("./utils-Dl9xPH4c.cjs"),E=require("./useDetectMobile-zkbzoOGV.cjs"),R=require("./style-lSjkOR95.cjs"),j=require("./suspense-product-card-detailed-D-pjVe22.cjs"),I=require("./index-D0xXo7W6.cjs"),_=T.styled.div`
+"use strict";const o=require("react/jsx-runtime"),l=require("react"),T=require("./emotion-styled.browser.esm-BtEseadx.cjs"),F=require("./consts-goSZX3xP.cjs"),B=require("./Button.cjs"),f=require("./utils-Dl9xPH4c.cjs"),E=require("./useDetectMobile-zkbzoOGV.cjs"),R=require("./style-Db3VFbfP.cjs"),j=require("./suspense-product-card-detailed-D-pjVe22.cjs"),I=require("./index-D0xXo7W6.cjs"),_=T.styled.div`
   display: grid;
   grid-template-columns: ${a=>`repeat(${a.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;

package/dist/DetailedProductsSection.js

@@ -5,7 +5,7 @@ import { M as O } from "./consts-BuFChS64.js";
 import R from "./Button.js";
 import { k as h } from "./utils-BdsZgOUE.js";
 import { u as W } from "./useDetectMobile-Bkvj0VMa.js";
-import { T as $ } from "./style-BLuyU97E.js";
+import { T as $ } from "./style-DKAOBWn3.js";
 import { D as j, S as z } from "./suspense-product-card-detailed-BZtObEfA.js";
 import { S as A } from "./index-Dweo-G3H.js";
 const K = I.div`

package/dist/FieldOfInterestsMasonrySection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),s=require("react"),l=require("./utils-Dl9xPH4c.cjs"),_=require("./emotion-styled.browser.esm-BtEseadx.cjs"),g=require("./consts-goSZX3xP.cjs"),q=require("./Icon.cjs"),z=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),R=_.styled.div`
+"use strict";const r=require("react/jsx-runtime"),l=require("react"),s=require("./utils-Dl9xPH4c.cjs"),_=require("./emotion-styled.browser.esm-BtEseadx.cjs"),x=require("./consts-goSZX3xP.cjs"),R=require("./Icon.cjs"),q=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),z=_.styled.div`
   display: flex;
   width: 100%;
   height: fit-content;
@@ -37,7 +37,7 @@
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${l.truncateTextInRows(2)}
+      ${s.truncateTextInRows(2)}
     }
 
     & .wrapper__description {
@@ -47,11 +47,11 @@
       font-weight: 400;
       line-height: 1rem;
       letter-spacing: 0.025rem;
-      ${l.truncateTextInRows(2)}
+      ${s.truncateTextInRows(2)}
     }
   }
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__content {
       & .wrapper__title {
         font-size: 0.875rem;
@@ -67,13 +67,15 @@
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
-  background: ${l.linearGradientAnimation("-90deg")};
+  background: ${s.linearGradientAnimation("-90deg")};
 `,C=_.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 0.75rem;
   height: 100%;
+  max-width: 8rem;
+  min-width: 8rem;
 
   &:hover {
     cursor: pointer;
@@ -106,6 +108,8 @@
     font-style: normal;
     font-weight: 400;
     line-height: 1.5rem;
+    max-width: 8rem;
+    ${s.truncateTextInRows(2)}
   }
 
   &.active {
@@ -115,7 +119,9 @@
     }
   }
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
+    max-width: unset;
+    min-width: unset;
     flex-direction: row;
     align-items: center;
     gap: 0.25rem;
@@ -150,19 +156,20 @@
       font-size: 0.875rem;
       line-height: 1.25rem;
       white-space: nowrap;
+      max-width: unset;
     }
   }
 `,L=_.styled.div`
   width: 7.5rem;
   width: 7.5rem;
   border-radius: 999px;
-  background: ${l.linearGradientAnimation("-90deg")};
+  background: ${s.linearGradientAnimation("-90deg")};
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
     width: 7.5rem;
     height: 2.5rem;
   }
-`,O=s.forwardRef(({},t)=>r.jsx(L,{})),F=s.forwardRef(({text:t,isActive:o=!1,icon:i,onSelectCard:n=()=>{}},d)=>r.jsxs(C,{ref:d,className:o?"active":"",onClick:n,children:[r.jsx(q,{icon:i,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:t})]})),A=s.forwardRef(({image:t,imageComponent:o,title:i,description:n,className:d,onSelectCard:x=()=>{}},u)=>{const{theme:y}=z.useTheme();return r.jsxs(R,{ref:u,theme:y,className:d,onClick:x,children:[l.isDefined(o)?o:r.jsx("img",{src:t,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__content",children:[i&&r.jsx("div",{className:"wrapper__title",children:i}),n&&r.jsx("div",{className:"wrapper__description",children:n})]})]})}),T=s.forwardRef(({},t)=>r.jsxs(S,{children:[r.jsx("div",{className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__content",children:[r.jsx("div",{className:"wrapper__title"}),r.jsx("div",{className:"wrapper__description"})]})]})),W=_.styled.div`
+`,O=l.forwardRef(({},t)=>r.jsx(L,{})),F=l.forwardRef(({text:t,isActive:o=!1,icon:i,onSelectCard:n=()=>{}},d)=>r.jsxs(C,{ref:d,className:o?"active":"",onClick:n,children:[r.jsx(R,{icon:i,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:t})]})),A=l.forwardRef(({image:t,imageComponent:o,title:i,description:n,className:d,onSelectCard:g=()=>{}},u)=>{const{theme:y}=q.useTheme();return r.jsxs(z,{ref:u,theme:y,className:d,onClick:g,children:[s.isDefined(o)?o:r.jsx("img",{src:t,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__content",children:[i&&r.jsx("div",{className:"wrapper__title",children:i}),n&&r.jsx("div",{className:"wrapper__description",children:n})]})]})}),T=l.forwardRef(({},t)=>r.jsxs(S,{children:[r.jsx("div",{className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__content",children:[r.jsx("div",{className:"wrapper__title"}),r.jsx("div",{className:"wrapper__description"})]})]})),W=_.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -201,7 +208,6 @@
   & .wrapper__tags {
     display: flex;
     justify-content: center;
-    align-items: center;
     gap: 0.75rem;
   }
 
@@ -218,7 +224,9 @@
     }
   }
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${x.MOBILE_SIZE_PX+"px"}) {
+    gap: 1rem;
+
     & .wrapper__tags {
       overflow-x: scroll;
       justify-content: flex-start;
@@ -243,4 +251,4 @@
       grid-template-columns: ${t=>`repeat(${t==null?void 0:t.limitCardsForMobile}, minmax(0, 1fr))`};
     }
   }
-`,B=s.forwardRef(({title:t,subtitle:o,tags:i=[],items:n=[],limitTags:d=5,limitTagsForMobile:x=5,limit:u=3,limitForMobile:y=2,selectedTag:E,onSelectTag:v=()=>{},onSelectCard:b=()=>{},className:p},I)=>{var k,$;return s.useLayoutEffect(()=>{if(!l.isDefinedNotEmptyString(p))return;const e=()=>{const c=document.querySelector(`.${p} .wrapper__cards`),m=c.querySelectorAll(".wrapper__card");m.forEach(w=>{const N=w.getBoundingClientRect().height,M=Math.ceil((N+10)/20);w.style.gridRowEnd=`span ${M}`});const j=m==null?void 0:m[m.length-1];if(j){const w=j.offsetTop+j.offsetHeight;c.style.height=`${w}px`}},f=document.querySelector(`.${p} .wrapper__cards`).querySelectorAll(".wrapper__image");let h=0;return f.length===0?e():(f.forEach(c=>{c.complete?h++:c.addEventListener("load",()=>{h++,h===f.length&&e()})}),h===f.length&&e()),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[p,n]),r.jsxs(W,{ref:I,limitTags:d,limitTagsForMobile:x,limitCards:u,limitCardsForMobile:y,className:p,numberOfTags:i==null?void 0:i.length,children:[r.jsxs("div",{className:"wrapper__heading",children:[t&&r.jsx("div",{className:"wrapper__title",children:t}),o&&r.jsx("div",{className:"wrapper__subtitle",children:o})]}),r.jsx("div",{className:"wrapper__tags__external",children:r.jsx("div",{className:"wrapper__tags",children:i&&(i==null?void 0:i.length)>0?i==null?void 0:i.map((e,a)=>r.jsx(F,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.title,isActive:(e==null?void 0:e.code)===E,onSelectCard:()=>v==null?void 0:v(e)},`field-of-interests-masonry-tag__${a+1}`)):(k=Array.from("12345"))==null?void 0:k.map((e,a)=>r.jsx(O,{},`field-of-interests-masonry-tag-skeleton__${a+1}`))})}),r.jsx("div",{className:"wrapper__cards",children:n&&(n==null?void 0:n.length)>0?n==null?void 0:n.map((e,a)=>r.jsx(A,{image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,title:e==null?void 0:e.title,description:e==null?void 0:e.description,onSelectCard:()=>b==null?void 0:b(e),className:"wrapper__card"},`field-of-interests-with-tags-card__${a+1}`)):($=Array.from("12345"))==null?void 0:$.map((e,a)=>r.jsx(T,{},`field-of-interests-with-tags-card-skeleton__${a+1}`))})]})});module.exports=B;
+`,B=l.forwardRef(({title:t,subtitle:o,tags:i=[],items:n=[],limitTags:d=5,limitTagsForMobile:g=5,limit:u=3,limitForMobile:y=2,selectedTag:I,onSelectTag:v=()=>{},onSelectCard:b=()=>{},className:p},E)=>{var k,$;return l.useLayoutEffect(()=>{if(!s.isDefinedNotEmptyString(p))return;const e=()=>{const c=document.querySelector(`.${p} .wrapper__cards`),m=c.querySelectorAll(".wrapper__card");m.forEach(f=>{const N=f.getBoundingClientRect().height,M=Math.ceil((N+10)/20);f.style.gridRowEnd=`span ${M}`});const j=m==null?void 0:m[m.length-1];if(j){const f=j.offsetTop+j.offsetHeight;c.style.height=`${f}px`}},h=document.querySelector(`.${p} .wrapper__cards`).querySelectorAll(".wrapper__image");let w=0;return h.length===0?e():(h.forEach(c=>{c.complete?w++:c.addEventListener("load",()=>{w++,w===h.length&&e()})}),w===h.length&&e()),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[p,n]),r.jsxs(W,{ref:E,limitTags:d,limitTagsForMobile:g,limitCards:u,limitCardsForMobile:y,className:p,numberOfTags:i==null?void 0:i.length,children:[r.jsxs("div",{className:"wrapper__heading",children:[t&&r.jsx("div",{className:"wrapper__title",children:t}),o&&r.jsx("div",{className:"wrapper__subtitle",children:o})]}),r.jsx("div",{className:"wrapper__tags__external",children:r.jsx("div",{className:"wrapper__tags",children:i&&(i==null?void 0:i.length)>0?i==null?void 0:i.map((e,a)=>r.jsx(F,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.title,isActive:(e==null?void 0:e.code)===I,onSelectCard:()=>v==null?void 0:v(e)},`field-of-interests-masonry-tag__${a+1}`)):(k=Array.from("12345"))==null?void 0:k.map((e,a)=>r.jsx(O,{},`field-of-interests-masonry-tag-skeleton__${a+1}`))})}),r.jsx("div",{className:"wrapper__cards",children:n&&(n==null?void 0:n.length)>0?n==null?void 0:n.map((e,a)=>r.jsx(A,{image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,title:e==null?void 0:e.title,description:e==null?void 0:e.description,onSelectCard:()=>b==null?void 0:b(e),className:"wrapper__card"},`field-of-interests-with-tags-card__${a+1}`)):($=Array.from("12345"))==null?void 0:$.map((e,a)=>r.jsx(T,{},`field-of-interests-with-tags-card-skeleton__${a+1}`))})]})});module.exports=B;

package/dist/FieldOfInterestsMasonrySection.js

@@ -1,11 +1,11 @@
 import { jsx as r, jsxs as l } from "react/jsx-runtime";
-import { forwardRef as m, useLayoutEffect as L } from "react";
-import { p as z, o as E, l as O, k as S } from "./utils-BdsZgOUE.js";
-import { s as f } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { forwardRef as c, useLayoutEffect as L } from "react";
+import { p as $, o as E, l as O, k as S } from "./utils-BdsZgOUE.js";
+import { s as h } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as g } from "./consts-BuFChS64.js";
 import A from "./Icon.js";
 import { u as W } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const T = f.div`
+const T = h.div`
   display: flex;
   width: 100%;
   height: fit-content;
@@ -44,7 +44,7 @@ const T = f.div`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${z(2)}
+      ${$(2)}
     }
 
     & .wrapper__description {
@@ -54,7 +54,7 @@ const T = f.div`
       font-weight: 400;
       line-height: 1rem;
       letter-spacing: 0.025rem;
-      ${z(2)}
+      ${$(2)}
     }
   }
 
@@ -70,17 +70,19 @@ const T = f.div`
       }
     }
   }
-`, j = f.div`
+`, j = h.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
   background: ${E("-90deg")};
-`, q = f.div`
+`, q = h.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 0.75rem;
   height: 100%;
+  max-width: 8rem;
+  min-width: 8rem;
 
   &:hover {
     cursor: pointer;
@@ -113,6 +115,8 @@ const T = f.div`
     font-style: normal;
     font-weight: 400;
     line-height: 1.5rem;
+    max-width: 8rem;
+    ${$(2)}
   }
 
   &.active {
@@ -123,6 +127,8 @@ const T = f.div`
   }
 
   @media (max-width: ${g + "px"}) {
+    max-width: unset;
+    min-width: unset;
     flex-direction: row;
     align-items: center;
     gap: 0.25rem;
@@ -157,9 +163,10 @@ const T = f.div`
       font-size: 0.875rem;
       line-height: 1.25rem;
       white-space: nowrap;
+      max-width: unset;
     }
   }
-`, R = f.div`
+`, R = h.div`
   width: 7.5rem;
   width: 7.5rem;
   border-radius: 999px;
@@ -169,7 +176,7 @@ const T = f.div`
     width: 7.5rem;
     height: 2.5rem;
   }
-`, B = m(({}, i) => /* @__PURE__ */ r(R, {})), D = m(
+`, B = c(({}, i) => /* @__PURE__ */ r(R, {})), D = c(
   ({ text: i, isActive: o = !1, icon: t, onSelectCard: a = () => {
   } }, s) => /* @__PURE__ */ l(
     q,
@@ -183,7 +190,7 @@ const T = f.div`
       ]
     }
   )
-), G = m(
+), G = c(
   ({
     image: i,
     imageComponent: o,
@@ -211,13 +218,13 @@ const T = f.div`
       }
     );
   }
-), H = m(({}, i) => /* @__PURE__ */ l(j, { children: [
+), H = c(({}, i) => /* @__PURE__ */ l(j, { children: [
   /* @__PURE__ */ r("div", { className: "wrapper__image" }),
   /* @__PURE__ */ l("div", { className: "wrapper__content", children: [
     /* @__PURE__ */ r("div", { className: "wrapper__title" }),
     /* @__PURE__ */ r("div", { className: "wrapper__description" })
   ] })
-] })), P = f.div`
+] })), P = h.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -256,7 +263,6 @@ const T = f.div`
   & .wrapper__tags {
     display: flex;
     justify-content: center;
-    align-items: center;
     gap: 0.75rem;
   }
 
@@ -274,6 +280,8 @@ const T = f.div`
   }
 
   @media (max-width: ${g + "px"}) {
+    gap: 1rem;
+
     & .wrapper__tags {
       overflow-x: scroll;
       justify-content: flex-start;
@@ -298,7 +306,7 @@ const T = f.div`
       grid-template-columns: ${(i) => `repeat(${i == null ? void 0 : i.limitCardsForMobile}, minmax(0, 1fr))`};
     }
   }
-`, Y = m(
+`, Y = c(
   ({
     title: i,
     subtitle: o,
@@ -315,28 +323,28 @@ const T = f.div`
     },
     className: p
   }, C) => {
-    var $, N;
+    var N, z;
     return L(() => {
       if (!S(p))
         return;
       const e = () => {
-        const d = document.querySelector(`.${p} .wrapper__cards`), c = d.querySelectorAll(".wrapper__card");
-        c.forEach((w) => {
+        const d = document.querySelector(`.${p} .wrapper__cards`), m = d.querySelectorAll(".wrapper__card");
+        m.forEach((w) => {
           const M = w.getBoundingClientRect().height, F = Math.ceil((M + 10) / 20);
           w.style.gridRowEnd = `span ${F}`;
         });
-        const k = c == null ? void 0 : c[c.length - 1];
+        const k = m == null ? void 0 : m[m.length - 1];
         if (k) {
           const w = k.offsetTop + k.offsetHeight;
           d.style.height = `${w}px`;
         }
-      }, _ = document.querySelector(`.${p} .wrapper__cards`).querySelectorAll(".wrapper__image");
-      let h = 0;
-      return _.length === 0 ? e() : (_.forEach((d) => {
-        d.complete ? h++ : d.addEventListener("load", () => {
-          h++, h === _.length && e();
+      }, f = document.querySelector(`.${p} .wrapper__cards`).querySelectorAll(".wrapper__image");
+      let _ = 0;
+      return f.length === 0 ? e() : (f.forEach((d) => {
+        d.complete ? _++ : d.addEventListener("load", () => {
+          _++, _ === f.length && e();
         });
-      }), h === _.length && e()), window.addEventListener("resize", e), () => {
+      }), _ === f.length && e()), window.addEventListener("resize", e), () => {
         window.removeEventListener("resize", e);
       };
     }, [p, a]), /* @__PURE__ */ l(
@@ -363,7 +371,7 @@ const T = f.div`
               onSelectCard: () => y == null ? void 0 : y(e)
             },
             `field-of-interests-masonry-tag__${n + 1}`
-          )) : ($ = Array.from("12345")) == null ? void 0 : $.map((e, n) => /* @__PURE__ */ r(
+          )) : (N = Array.from("12345")) == null ? void 0 : N.map((e, n) => /* @__PURE__ */ r(
             B,
             {},
             `field-of-interests-masonry-tag-skeleton__${n + 1}`
@@ -379,7 +387,7 @@ const T = f.div`
               className: "wrapper__card"
             },
             `field-of-interests-with-tags-card__${n + 1}`
-          )) : (N = Array.from("12345")) == null ? void 0 : N.map((e, n) => /* @__PURE__ */ r(
+          )) : (z = Array.from("12345")) == null ? void 0 : z.map((e, n) => /* @__PURE__ */ r(
             H,
             {},
             `field-of-interests-with-tags-card-skeleton__${n + 1}`

package/dist/FieldOfInterestsWithTagsCardsSection.cjs

@@ -163,6 +163,8 @@
   }
 
   @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+    gap: 1rem;
+
     & .wrapper__tags {
       overflow-x: scroll;
       justify-content: flex-start;

package/dist/FieldOfInterestsWithTagsCardsSection.js

@@ -197,6 +197,8 @@ const W = c.div`
   }
 
   @media (max-width: ${v + "px"}) {
+    gap: 1rem;
+
     & .wrapper__tags {
       overflow-x: scroll;
       justify-content: flex-start;
@@ -240,7 +242,7 @@ const W = c.div`
     onSelectCard: _ = () => {
     }
   }, k) => {
-    var w, g;
+    var g, w;
     return /* @__PURE__ */ m(
       M,
       {
@@ -264,7 +266,7 @@ const W = c.div`
               onSelectCard: () => h == null ? void 0 : h(e)
             },
             `field-of-interests-with-tags-card-tag__${l + 1}`
-          )) : (w = Array.from("123")) == null ? void 0 : w.map((e, l) => /* @__PURE__ */ i(
+          )) : (g = Array.from("123")) == null ? void 0 : g.map((e, l) => /* @__PURE__ */ i(
             z,
             {},
             `field-of-interests-with-tags-card-tag-skeleton__${l + 1}`
@@ -279,7 +281,7 @@ const W = c.div`
               onSelectCard: () => _ == null ? void 0 : _(e)
             },
             `field-of-interests-with-tags-card__${l + 1}`
-          )) : (g = Array.from("123")) == null ? void 0 : g.map((e, l) => /* @__PURE__ */ i(
+          )) : (w = Array.from("123")) == null ? void 0 : w.map((e, l) => /* @__PURE__ */ i(
             E,
             {},
             `field-of-interests-with-tags-card-skeleton__${l + 1}`

package/dist/GiftCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),f=require("react"),w=require("./useDetectMobile-zkbzoOGV.cjs"),v=require("./style-lSjkOR95.cjs"),o=require("./utils-Dl9xPH4c.cjs"),j=require("./Button.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),C=require("./consts-goSZX3xP.cjs"),S=c.styled.div`
+"use strict";const t=require("react/jsx-runtime"),f=require("react"),w=require("./useDetectMobile-zkbzoOGV.cjs"),v=require("./style-Db3VFbfP.cjs"),o=require("./utils-Dl9xPH4c.cjs"),j=require("./Button.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),C=require("./consts-goSZX3xP.cjs"),S=c.styled.div`
   display: grid;
   grid-template-columns: ${a=>`repeat(${a.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;

package/dist/GiftCardsSection.js

@@ -1,7 +1,7 @@
 import { jsxs as n, jsx as t } from "react/jsx-runtime";
 import { forwardRef as h } from "react";
 import { u as C } from "./useDetectMobile-Bkvj0VMa.js";
-import { R as k } from "./style-BLuyU97E.js";
+import { R as k } from "./style-DKAOBWn3.js";
 import { o as b, q as G, G as S, k as u } from "./utils-BdsZgOUE.js";
 import N from "./Button.js";
 import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";

package/dist/MasonryGeneralCardsSection.cjs

@@ -137,8 +137,6 @@
   }
 
   @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
-    gap: 1.25rem;
-
     & .regular-title {
       font-size: 1.375rem;
 
@@ -160,7 +158,7 @@
   @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
     display: flex;
     flex-direction: column;
-    gap: 1rem;
+    gap: 1.25rem;
     width: 100%;
     height: 100%;
     max-height: 100%;

package/dist/MasonryGeneralCardsSection.js

@@ -1,4 +1,4 @@
-import { jsx as t, Fragment as w, jsxs as d } from "react/jsx-runtime";
+import { jsx as t, Fragment as w, jsxs as m } from "react/jsx-runtime";
 import { forwardRef as f } from "react";
 import b from "./Button.js";
 import { s } from "./emotion-styled.browser.esm-BNN1dTl3.js";
@@ -140,23 +140,23 @@ const y = s.div`
     onSelectCard: l = () => {
     },
     className: o,
-    position: m,
+    position: d,
     tag: g,
     backgroundColor: x
   }, u) => {
     const _ = v();
-    return /* @__PURE__ */ t(w, { children: /* @__PURE__ */ d(
+    return /* @__PURE__ */ t(w, { children: /* @__PURE__ */ m(
       y,
       {
         ref: u,
         theme: _,
         className: o,
-        position: m,
+        position: d,
         backgroundColor: x,
         onClick: l,
         children: [
           /* @__PURE__ */ t("img", { src: e, className: "wrapper__image" }),
-          /* @__PURE__ */ d("div", { className: "wrapper__text", children: [
+          /* @__PURE__ */ m("div", { className: "wrapper__text", children: [
             g && /* @__PURE__ */ t("div", { className: "text__tag", children: g }),
             /* @__PURE__ */ t("div", { className: "text__title", children: r }),
             h(i) && /* @__PURE__ */ t("div", { className: "text__description", children: i }),
@@ -197,8 +197,6 @@ const y = s.div`
   }
 
   @media (max-width: ${c + "px"}) {
-    gap: 1.25rem;
-
     & .regular-title {
       font-size: 1.375rem;
 
@@ -220,22 +218,22 @@ const y = s.div`
   @media (max-width: ${c + "px"}) {
     display: flex;
     flex-direction: column;
-    gap: 1rem;
+    gap: 1.25rem;
     width: 100%;
     height: 100%;
     max-height: 100%;
   }
 `, I = f(
   ({ title: r, items: e, limit: i = 3, onSelectCard: a = () => {
-  } }, l) => /* @__PURE__ */ d($, { ref: l, children: [
+  } }, l) => /* @__PURE__ */ m($, { ref: l, children: [
     /* @__PURE__ */ t("div", { className: "regular-title", children: /* @__PURE__ */ t("div", { className: "regular-title-text", children: /* @__PURE__ */ t("span", { children: r }) }) }),
-    /* @__PURE__ */ t(N, { limit: i, children: e && (e == null ? void 0 : e.map((o, m) => /* @__PURE__ */ t(
+    /* @__PURE__ */ t(N, { limit: i, children: e && (e == null ? void 0 : e.map((o, d) => /* @__PURE__ */ t(
       k,
       {
         ...o,
         onSelectCard: () => a(o)
       },
-      `landing-page-masonry-general-card__${m + 1}`
+      `landing-page-masonry-general-card__${d + 1}`
     ))) })
   ] })
 );

package/dist/ProductsWithBannerSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),d=require("react"),f=require("./emotion-styled.browser.esm-BtEseadx.cjs"),j=require("./consts-goSZX3xP.cjs"),y=require("./useDetectMobile-zkbzoOGV.cjs"),P=require("./style-lSjkOR95.cjs"),l=require("./utils-Dl9xPH4c.cjs"),N=require("./index-BueKsXT8.cjs"),I=f.styled.div`
+"use strict";const r=require("react/jsx-runtime"),o=require("react"),f=require("./emotion-styled.browser.esm-BtEseadx.cjs"),j=require("./consts-goSZX3xP.cjs"),v=require("./useDetectMobile-zkbzoOGV.cjs"),y=require("./style-Db3VFbfP.cjs"),c=require("./utils-Dl9xPH4c.cjs"),N=require("./index-BueKsXT8.cjs"),$=f.styled.div`
   width: 100%;
   height: 22.5rem;
   min-height: 22.5rem;
@@ -21,32 +21,25 @@
     min-height: 100%;
     max-height: 100%;
     aspect-ratio: 1 / 1;
+
+    & .product-card {
+      & img {
+        width: 100%;
+        height: 100%;
+        min-width: 100%;
+        min-height: 100%;
+      }
+    }
   }
-`,$=f.styled.div`
+`,I=f.styled.div`
   display: grid;
   grid-template-columns: ${t=>`repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
   @media (max-width: ${j.MOBILE_SIZE_PX+"px"}) {
-    display: flex;
-    gap: 1rem;
-    overflow-x: auto;
-
-    -webkit-overflow-scrolling: touch;
-    ::-webkit-scrollbar {
-      -webkit-appearance: none;
-    }
-    -ms-overflow-style: none;
-    /* Internet Explorer 10+ */
-    scrollbar-width: none;
-    /* Firefox */
-
-    &::-webkit-scrollbar {
-      display: none;
-      /* Safari and Chrome */
-    }
+    grid-template-columns: repeat(2, minmax(0, 1fr));
   }
-`,k=f.styled.div`
+`,C=f.styled.div`
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
@@ -62,17 +55,17 @@
   & .card-title {
     font-size: 0.875rem;
     font-weight: 600;
-     ${l.truncateTextInRows(2)}
+     ${c.truncateTextInRows(2)}
   }
 
   & .skeleton-img {
-    background-color: ${l.linearGradientAnimation("-90deg")};
+    background-color: ${c.linearGradientAnimation("-90deg")};
     border-radius: 0.75rem;
     border: 1px solid white;
   }
 
   & .skeleton-title {
-    background-color: ${l.linearGradientAnimation("-90deg")};
+    background-color: ${c.linearGradientAnimation("-90deg")};
     width: 100%;
     height: 1.25rem;
   }
@@ -88,4 +81,4 @@
       object-fit: cover;
     }
   }
-`,R=d.forwardRef((t,o)=>{const{uuid:a,title:i,image:s,sellerUuid:w,onSelectCard:c=()=>{},imageComponent:m,metadata:n}=t,u=d.useRef(null);return r.jsxs(k,{ref:u,className:"product-card",name:n==null?void 0:n.name,"data-accessor":n==null?void 0:n.accessor,onClick:g=>c(g,o),children:[l.isDefined(m)?m:r.jsx(N.ProductImageWrapper,{src:s}),r.jsx("div",{className:"card-title",children:i})]})}),_=d.forwardRef(({},t)=>r.jsxs(k,{className:"product-card",children:[r.jsx("img",{className:"skeleton-img"}),r.jsx("div",{className:"skeleton-title"})]})),q=({limit:t=4,isLoading:o=!1,keyPrefix:a})=>r.jsx(r.Fragment,{children:Array.from({length:t},(i,s)=>r.jsx(_,{isLoading:o},`${a}-skeleton-product-card-${s}`))}),E=({children:t,fallbackComponent:o=r.jsx(r.Fragment,{}),isLoading:a=!1,limit:i,keyPrefix:s})=>r.jsx(d.Suspense,{fallbackComponent:o,children:a===!0?r.jsx(q,{isLoading:a,limit:i,keyPrefix:s}):t}),S=d.memo(R),M=d.forwardRef((t,o)=>{const{icon:a,items:i,limit:s=4,imageUrl:w,onSelectCard:c=()=>{},title:m="Season inspiration",isLoading:n=!1,getImage:u=()=>{},componentName:g}=t,b=y.useDetectMobile(),v=d.useMemo(()=>r.jsx(r.Fragment,{children:b===!0?i==null?void 0:i.map((e,h)=>r.jsx(S,{title:e==null?void 0:e.name,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(C,p)=>c({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:p}),image:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:g,accessor:e==null?void 0:e.accessor}},h)):i==null?void 0:i.slice(0,s).map((e,h)=>r.jsx(S,{title:e==null?void 0:e.name,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(C,p)=>c({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:p}),image:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:g,accessor:e==null?void 0:e.accessor}},h))}),[i,b,s]);return r.jsxs(P.RegulatTitleSectionWrapper,{ref:o,children:[r.jsx("div",{className:"regular-title",children:r.jsxs("div",{className:"regular-title-text",children:[l.isDefinedNotEmptyString(a)&&r.jsx("i",{className:a}),r.jsx("span",{children:m})]})}),r.jsx(I,{className:"products-banner",children:r.jsx("img",{src:w})}),r.jsx($,{limit:s,children:r.jsx(E,{isLoading:n,limit:s,keyPrefix:"explore-landing",children:v})})]})});module.exports=M;
+`,R=o.forwardRef((t,d)=>{const{uuid:a,title:i,image:s,sellerUuid:w,onSelectCard:l=()=>{},imageComponent:m,metadata:n}=t,u=o.useRef(null);return r.jsxs(C,{ref:u,className:"product-card",name:n==null?void 0:n.name,"data-accessor":n==null?void 0:n.accessor,onClick:g=>l(g,d),children:[c.isDefined(m)?m:r.jsx(N.ProductImageWrapper,{src:s}),r.jsx("div",{className:"card-title",children:i})]})}),_=o.forwardRef(({},t)=>r.jsxs(C,{className:"product-card",children:[r.jsx("img",{className:"skeleton-img"}),r.jsx("div",{className:"skeleton-title"})]})),q=({limit:t=4,isLoading:d=!1,keyPrefix:a})=>r.jsx(r.Fragment,{children:Array.from({length:t},(i,s)=>r.jsx(_,{isLoading:d},`${a}-skeleton-product-card-${s}`))}),M=({children:t,fallbackComponent:d=r.jsx(r.Fragment,{}),isLoading:a=!1,limit:i,keyPrefix:s})=>r.jsx(o.Suspense,{fallbackComponent:d,children:a===!0?r.jsx(q,{isLoading:a,limit:i,keyPrefix:s}):t}),b=o.memo(R),U=o.forwardRef((t,d)=>{const{icon:a,items:i,limit:s=4,imageUrl:w,onSelectCard:l=()=>{},title:m="Season inspiration",isLoading:n=!1,getImage:u=()=>{},componentName:g}=t,S=v.useDetectMobile(),P=o.useMemo(()=>r.jsx(r.Fragment,{children:S===!0?i==null?void 0:i.map((e,h)=>r.jsx(b,{title:e==null?void 0:e.name,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(k,p)=>l({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:p}),image:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:g,accessor:e==null?void 0:e.accessor}},h)):i==null?void 0:i.slice(0,s).map((e,h)=>r.jsx(b,{title:e==null?void 0:e.name,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:(k,p)=>l({uuid:e==null?void 0:e.uuid,nameSlug:e==null?void 0:e.nameSlug,cardRef:p}),image:u(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,metadata:{name:g,accessor:e==null?void 0:e.accessor}},h))}),[i,S,s]);return r.jsxs(y.RegulatTitleSectionWrapper,{ref:d,children:[r.jsx("div",{className:"regular-title",children:r.jsxs("div",{className:"regular-title-text",children:[c.isDefinedNotEmptyString(a)&&r.jsx("i",{className:a}),r.jsx("span",{children:m})]})}),r.jsx($,{className:"products-banner",children:r.jsx("img",{src:w})}),r.jsx(I,{limit:s,children:r.jsx(M,{isLoading:n,limit:s,keyPrefix:"explore-landing",children:P})})]})});module.exports=U;

package/dist/ProductsWithBannerSection.js

@@ -1,12 +1,12 @@
 import { jsxs as u, jsx as r, Fragment as h } from "react/jsx-runtime";
-import { forwardRef as f, useRef as $, Suspense as U, memo as I, useMemo as M } from "react";
-import { s as b } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as w } from "./consts-BuFChS64.js";
-import { u as R } from "./useDetectMobile-Bkvj0VMa.js";
-import { R as W } from "./style-BLuyU97E.js";
-import { p as j, o as v, l as E, k as z } from "./utils-BdsZgOUE.js";
-import { P as B } from "./index-CF3HhgvN.js";
-const D = b.div`
+import { forwardRef as f, useRef as U, Suspense as y, memo as M, useMemo as R } from "react";
+import { s as w } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as b } from "./consts-BuFChS64.js";
+import { u as W } from "./useDetectMobile-Bkvj0VMa.js";
+import { R as j } from "./style-DKAOBWn3.js";
+import { p as I, o as k, l as z, k as B } from "./utils-BdsZgOUE.js";
+import { P as D } from "./index-CF3HhgvN.js";
+const E = w.div`
   width: 100%;
   height: 22.5rem;
   min-height: 22.5rem;
@@ -24,37 +24,30 @@ const D = b.div`
     object-fit: cover;
   }
 
-  @media (max-width: ${w + "px"}) {
+  @media (max-width: ${b + "px"}) {
     height: 100%;
     min-height: 100%;
     max-height: 100%;
     aspect-ratio: 1 / 1;
+
+    & .product-card {
+      & img {
+        width: 100%;
+        height: 100%;
+        min-width: 100%;
+        min-height: 100%;
+      }
+    }
   }
-`, _ = b.div`
+`, _ = w.div`
   display: grid;
   grid-template-columns: ${(t) => `repeat(${t.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
-  @media (max-width: ${w + "px"}) {
-    display: flex;
-    gap: 1rem;
-    overflow-x: auto;
-
-    -webkit-overflow-scrolling: touch;
-    ::-webkit-scrollbar {
-      -webkit-appearance: none;
-    }
-    -ms-overflow-style: none;
-    /* Internet Explorer 10+ */
-    scrollbar-width: none;
-    /* Firefox */
-
-    &::-webkit-scrollbar {
-      display: none;
-      /* Safari and Chrome */
-    }
+  @media (max-width: ${b + "px"}) {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
   }
-`, P = b.div`
+`, P = w.div`
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
@@ -70,22 +63,22 @@ const D = b.div`
   & .card-title {
     font-size: 0.875rem;
     font-weight: 600;
-     ${j(2)}
+     ${I(2)}
   }
 
   & .skeleton-img {
-    background-color: ${v("-90deg")};
+    background-color: ${k("-90deg")};
     border-radius: 0.75rem;
     border: 1px solid white;
   }
 
   & .skeleton-title {
-    background-color: ${v("-90deg")};
+    background-color: ${k("-90deg")};
     width: 100%;
     height: 1.25rem;
   }
 
-  @media (max-width: ${w + "px"}) {
+  @media (max-width: ${b + "px"}) {
     & img {
       width: 8.875rem;
       height: 8.875rem;
@@ -96,107 +89,107 @@ const D = b.div`
       object-fit: cover;
     }
   }
-`, A = f((t, l) => {
+`, A = f((t, n) => {
   const {
     uuid: o,
     title: i,
     image: a,
     sellerUuid: S,
-    onSelectCard: d = () => {
+    onSelectCard: m = () => {
     },
     imageComponent: s,
-    metadata: n
-  } = t, m = $(null);
+    metadata: d
+  } = t, l = U(null);
   return /* @__PURE__ */ u(
     P,
     {
-      ref: m,
+      ref: l,
       className: "product-card",
-      name: n == null ? void 0 : n.name,
-      "data-accessor": n == null ? void 0 : n.accessor,
-      onClick: (c) => d(c, l),
+      name: d == null ? void 0 : d.name,
+      "data-accessor": d == null ? void 0 : d.accessor,
+      onClick: (c) => m(c, n),
       children: [
-        E(s) ? s : /* @__PURE__ */ r(B, { src: a }),
+        z(s) ? s : /* @__PURE__ */ r(D, { src: a }),
         /* @__PURE__ */ r("div", { className: "card-title", children: i })
       ]
     }
   );
-}), F = f(({}, t) => /* @__PURE__ */ u(P, { className: "product-card", children: [
+}), G = f(({}, t) => /* @__PURE__ */ u(P, { className: "product-card", children: [
   /* @__PURE__ */ r("img", { className: "skeleton-img" }),
   /* @__PURE__ */ r("div", { className: "skeleton-title" })
-] })), G = ({ limit: t = 4, isLoading: l = !1, keyPrefix: o }) => /* @__PURE__ */ r(h, { children: Array.from({ length: t }, (i, a) => /* @__PURE__ */ r(
-  F,
+] })), T = ({ limit: t = 4, isLoading: n = !1, keyPrefix: o }) => /* @__PURE__ */ r(h, { children: Array.from({ length: t }, (i, a) => /* @__PURE__ */ r(
+  G,
   {
-    isLoading: l
+    isLoading: n
   },
   `${o}-skeleton-product-card-${a}`
-)) }), T = ({
+)) }), F = ({
   children: t,
-  fallbackComponent: l = /* @__PURE__ */ r(h, {}),
+  fallbackComponent: n = /* @__PURE__ */ r(h, {}),
   isLoading: o = !1,
   limit: i,
   keyPrefix: a
-}) => /* @__PURE__ */ r(U, { fallbackComponent: l, children: o === !0 ? /* @__PURE__ */ r(
-  G,
+}) => /* @__PURE__ */ r(y, { fallbackComponent: n, children: o === !0 ? /* @__PURE__ */ r(
+  T,
   {
     isLoading: o,
     limit: i,
     keyPrefix: a
   }
-) : t }), C = I(A), Q = f((t, l) => {
+) : t }), v = M(A), Q = f((t, n) => {
   const {
     icon: o,
     items: i,
     limit: a = 4,
     imageUrl: S,
-    onSelectCard: d = () => {
+    onSelectCard: m = () => {
     },
     title: s = "Season inspiration",
-    isLoading: n = !1,
-    getImage: m = () => {
+    isLoading: d = !1,
+    getImage: l = () => {
     },
     componentName: c
-  } = t, k = R(), N = M(() => /* @__PURE__ */ r(h, { children: k === !0 ? i == null ? void 0 : i.map((e, p) => /* @__PURE__ */ r(
-    C,
+  } = t, C = W(), N = R(() => /* @__PURE__ */ r(h, { children: C === !0 ? i == null ? void 0 : i.map((e, p) => /* @__PURE__ */ r(
+    v,
     {
       title: e == null ? void 0 : e.name,
       sellerUuid: e == null ? void 0 : e.sellerUuid,
       uuid: e == null ? void 0 : e.uuid,
-      onSelectCard: (y, g) => d({
+      onSelectCard: ($, g) => m({
         uuid: e == null ? void 0 : e.uuid,
         nameSlug: e == null ? void 0 : e.nameSlug,
         cardRef: g
       }),
-      image: m(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
+      image: l(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
       metadata: { name: c, accessor: e == null ? void 0 : e.accessor }
     },
     p
   )) : i == null ? void 0 : i.slice(0, a).map((e, p) => /* @__PURE__ */ r(
-    C,
+    v,
     {
       title: e == null ? void 0 : e.name,
       sellerUuid: e == null ? void 0 : e.sellerUuid,
       uuid: e == null ? void 0 : e.uuid,
-      onSelectCard: (y, g) => d({
+      onSelectCard: ($, g) => m({
         uuid: e == null ? void 0 : e.uuid,
         nameSlug: e == null ? void 0 : e.nameSlug,
         cardRef: g
       }),
-      image: m(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
+      image: l(e == null ? void 0 : e.image, e == null ? void 0 : e.uuid, e == null ? void 0 : e.sellerUuid) || null,
       metadata: { name: c, accessor: e == null ? void 0 : e.accessor }
     },
     p
-  )) }), [i, k, a]);
-  return /* @__PURE__ */ u(W, { ref: l, children: [
+  )) }), [i, C, a]);
+  return /* @__PURE__ */ u(j, { ref: n, children: [
     /* @__PURE__ */ r("div", { className: "regular-title", children: /* @__PURE__ */ u("div", { className: "regular-title-text", children: [
-      z(o) && /* @__PURE__ */ r("i", { className: o }),
+      B(o) && /* @__PURE__ */ r("i", { className: o }),
       /* @__PURE__ */ r("span", { children: s })
     ] }) }),
-    /* @__PURE__ */ r(D, { className: "products-banner", children: /* @__PURE__ */ r("img", { src: S }) }),
+    /* @__PURE__ */ r(E, { className: "products-banner", children: /* @__PURE__ */ r("img", { src: S }) }),
     /* @__PURE__ */ r(_, { limit: a, children: /* @__PURE__ */ r(
-      T,
+      F,
       {
-        isLoading: n,
+        isLoading: d,
         limit: a,
         keyPrefix: "explore-landing",
         children: N

package/dist/QuattroCardsSection.cjs

@@ -155,6 +155,8 @@
   }
 
   @media (max-width: ${m.MOBILE_SIZE_PX+"px"}) {
+    gap: 1.25rem;
+
     & .wrapper__cards {
       grid-template-columns: repeat(1, minmax(0, 1fr));
       gap: 1rem;

package/dist/QuattroCardsSection.js

@@ -174,6 +174,8 @@ const y = c.div`
   }
 
   @media (max-width: ${m + "px"}) {
+    gap: 1.25rem;
+
     & .wrapper__cards {
       grid-template-columns: repeat(1, minmax(0, 1fr));
       gap: 1rem;

package/dist/SalesCampaignsSection.cjs

@@ -385,6 +385,8 @@
   }
 
   @media (max-width: ${P.MOBILE_SIZE_PX+"px"}) {
+    gap: 1.25rem;
+
     & .scrollable-section__header {
       & .scrollable-section__title {
         & .title__text {

package/dist/SalesCampaignsSection.js

@@ -697,6 +697,8 @@ const F = h.div`
   }
 
   @media (max-width: ${k + "px"}) {
+    gap: 1.25rem;
+
     & .scrollable-section__header {
       & .scrollable-section__title {
         & .title__text {

package/dist/ShopCardsSection.cjs

@@ -84,6 +84,8 @@
   }
 
   @media (max-width: ${S.MOBILE_SIZE_PX+"px"}) {
+    gap: 1.25rem;
+
     & .wrapper__view-all {
       display: unset;
     }
@@ -126,4 +128,4 @@
             }`}
     }
   }
-`,q=d.forwardRef(({title:i,subtitle:o,items:n,limit:g=4,limitForMobile:w=2,buttonText:a="Show More",onSelectCard:f=()=>{},onButtonAction:l=()=>{},icon:p,getImage:h=()=>{},getProductImage:x=()=>{},hideProducts:y=!1,showRating:c=!0,gridView:r=!1,componentName:v},b)=>{var m;return t.jsxs(N,{ref:b,limitCards:g,limitCardsForMobile:w,gridView:r,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})]}),l&&t.jsx(u,{text:a,color:"neutral",borderRadius:"curved",btnType:"tinted",className:`title__action ${r?"grid":""}`,onClick:l})]}),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}`))}),r&&l&&t.jsx(u,{text:a,borderRadius:"curved",btnType:"basic",color:"neutral",className:"wrapper__view-all",onClick:l})]})});module.exports=q;
+`,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;

package/dist/ShopCardsSection.js

@@ -91,6 +91,8 @@ const j = $.div`
   }
 
   @media (max-width: ${M + "px"}) {
+    gap: 1.25rem;
+
     & .wrapper__view-all {
       display: unset;
     }

package/dist/SimpleCategoriesSection.cjs

@@ -1,4 +1,4 @@
-"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-lSjkOR95.cjs"),v=require("./Button.cjs"),p=require("./suspense-categories-card-simple-CjGtzfzp.cjs"),M=w.styled.div`
+"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`
   display: grid;
   grid-template-columns: ${a=>"repeat(6,  minmax(0, 1fr))"};
   gap: 2rem;

package/dist/SimpleCategoriesSection.js

@@ -4,7 +4,7 @@ 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-BLuyU97E.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`

package/dist/{style-BLuyU97E.js → style-DKAOBWn3.js}

@@ -78,6 +78,7 @@ const o = a.div`
   @media (max-width: ${t + "px"}) {
     & .regular-title {
       font-size: 1.375rem;
+      padding-bottom: 0.5rem;
     }
   }
 `, i = (e) => (e == null ? void 0 : e.toLowerCase()) == "success" ? "color: var(--success-700, #047857); border: 1px solid var(--success-600, #059669); background-color: var(--sucess-60008, #05966914);" : (e == null ? void 0 : e.toLowerCase()) == "warning" ? "color: var(--warning-600, #d97706); border: 1px solid var(--warning-500, #f59e0b); background-color: var(--warning-50012, #f59e0b1f);" : (e == null ? void 0 : e.toLowerCase()) == "info" ? "color: var(--info-700, #6d28d9); border: 1px solid var(--info-600, #7c3aed); background-color: var(--info-60012, #7c3aed1f);" : (e == null ? void 0 : e.toLowerCase()) == "danger" ? "color: var(--danger-600, #e11d48); border: 1px solid var(--danger-500, #f43f5e); background-color: var(--danger-5008, #f43f5e14);" : (e == null ? void 0 : e.toLowerCase()) == "secondary" ? "color: var(--secondary-700, #2667a0); border: 1px solid var(--secondary-600, #3284cb); background-color: var(--secondary-60012, #3284cb1f);" : "color: var(--gray-950, #14161A); border: 1px solid var(--gray-200, #dddfe4); background-color: var(--white, #fff);", g = a.div`

package/dist/{style-lSjkOR95.cjs → style-Db3VFbfP.cjs}

@@ -75,6 +75,7 @@
   @media (max-width: ${a.MOBILE_SIZE_PX+"px"}) {
     & .regular-title {
       font-size: 1.375rem;
+      padding-bottom: 0.5rem;
     }
   }
 `,s=e=>(e==null?void 0:e.toLowerCase())=="success"?"color: var(--success-700, #047857); border: 1px solid var(--success-600, #059669); background-color: var(--sucess-60008, #05966914);":(e==null?void 0:e.toLowerCase())=="warning"?"color: var(--warning-600, #d97706); border: 1px solid var(--warning-500, #f59e0b); background-color: var(--warning-50012, #f59e0b1f);":(e==null?void 0:e.toLowerCase())=="info"?"color: var(--info-700, #6d28d9); border: 1px solid var(--info-600, #7c3aed); background-color: var(--info-60012, #7c3aed1f);":(e==null?void 0:e.toLowerCase())=="danger"?"color: var(--danger-600, #e11d48); border: 1px solid var(--danger-500, #f43f5e); background-color: var(--danger-5008, #f43f5e14);":(e==null?void 0:e.toLowerCase())=="secondary"?"color: var(--secondary-700, #2667a0); border: 1px solid var(--secondary-600, #3284cb); background-color: var(--secondary-60012, #3284cb1f);":"color: var(--gray-950, #14161A); border: 1px solid var(--gray-200, #dddfe4); background-color: var(--white, #fff);",o=t.styled.div`

package/package.json

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