@lanaco/lnc-react-ui 4.0.32 → 4.0.33

package/dist/FieldOfInterestsMasonrySection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),l=require("react"),p=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),x=require("./consts-dNz9tpt4.cjs"),o=require("./utils-CE6bljYe.cjs"),$=require("./Icon.cjs"),N=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),k=require("./useEffectOnce-DFrzfNzT.cjs"),I=p.newStyled.div`
+"use strict";const r=require("react/jsx-runtime"),l=require("react"),p=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),x=require("./consts-dNz9tpt4.cjs"),o=require("./utils-UJt-R-G3.cjs"),$=require("./Icon.cjs"),N=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),k=require("./useEffectOnce-DFrzfNzT.cjs"),I=p.newStyled.div`
   display: flex;
   width: 100%;
   height: fit-content;
@@ -28,7 +28,7 @@
     align-self: stretch;
 
     & .wrapper__title {
-      color: var(--gray-950);
+      color: var(--gray-950, #14161a);
       font-size: 1rem;
       font-style: normal;
       font-weight: 500;
@@ -37,7 +37,7 @@
     }
 
     & .wrapper__description {
-      color: var(--gray-600);
+      color: var(--gray-600, #676e79);
       font-size: 0.75rem;
       font-style: normal;
       font-weight: 400;
@@ -51,7 +51,7 @@
   height: 11.625rem;
   border-radius: 0.75rem;
   background: ${o.linearGradientAnimation("-90deg")};
-`,R=p.newStyled.div`
+`,M=p.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -117,7 +117,7 @@
       white-space: nowrap;
     }
   }
-`,q=p.newStyled.div`
+`,R=p.newStyled.div`
   width: 7.5rem;
   width: 7.5rem;
   border-radius: 999px;
@@ -127,7 +127,7 @@
     width: 7.5rem;
     height: 2.5rem;
   }
-`,z=l.forwardRef(({},i)=>r.jsx(q,{})),M=l.forwardRef(({text:i,isActive:a,icon:t,onSelectCard:n=()=>{}},m)=>r.jsxs(R,{className:a?"active":"",onClick:n,children:[r.jsx($,{icon:t,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:i})]})),O=l.forwardRef(({image:i,imageComponent:a,title:t,description:n,className:m,onSelectCard:d=()=>{}},g)=>{const{theme:c}=N.useTheme();return r.jsxs(I,{theme:c,className:m,onClick:d,children:[o.isDefined(a)?a:r.jsx("img",{src:i,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__content",children:[t&&r.jsx("div",{className:"wrapper__title",children:t}),n&&r.jsx("div",{className:"wrapper__description",children:n})]})]})}),S=l.forwardRef(({},i)=>r.jsxs(E,{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"})]})]})),C=p.newStyled.div`
+`,q=l.forwardRef(({},i)=>r.jsx(R,{})),z=l.forwardRef(({text:i,isActive:a,icon:t,onSelectCard:n=()=>{}},m)=>r.jsxs(M,{className:a?"active":"",onClick:n,children:[r.jsx($,{icon:t,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:i})]})),O=l.forwardRef(({image:i,imageComponent:a,title:t,description:n,className:m,onSelectCard:d=()=>{}},g)=>{const{theme:c}=N.useTheme();return r.jsxs(I,{theme:c,className:m,onClick:d,children:[o.isDefined(a)?a:r.jsx("img",{src:i,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__content",children:[t&&r.jsx("div",{className:"wrapper__title",children:t}),n&&r.jsx("div",{className:"wrapper__description",children:n})]})]})}),S=l.forwardRef(({},i)=>r.jsxs(E,{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"})]})]})),C=p.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -191,4 +191,4 @@
       grid-template-columns: ${i=>`repeat(${i==null?void 0:i.limitCardsForMobile}, minmax(0, 1fr))`};
     }
   }
-`,F=l.forwardRef(({title:i,subtitle:a,tags:t=[],cards:n=[],limitTags:m=5,limitTagsForMobile:d=5,limitCards:g=3,limitCardsForMobile:c=2,onSelectTag:_=()=>{},onSelectCard:f=()=>{}},L)=>{var u,y;const w=e=>{_==null||_(e==null?void 0:e.uuid)},h=e=>{f==null||f(e==null?void 0:e.uuid)};return k.useEffectOnce(()=>{const e=()=>{document.querySelector(".wrapper__cards").querySelectorAll(".wrapper__card").forEach(v=>{const j=v.getBoundingClientRect().height,b=Math.ceil((j+10)/20);v.style.gridRowEnd=`span ${b}`})};return e(),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),r.jsxs(C,{limitTags:m,limitTagsForMobile:d,limitCards:g,limitCardsForMobile:c,children:[r.jsxs("div",{className:"wrapper__heading",children:[i&&r.jsx("div",{className:"wrapper__title",children:i}),a&&r.jsx("div",{className:"wrapper__subtitle",children:a})]}),r.jsx("div",{className:"wrapper__tags",children:t&&(t==null?void 0:t.length)>0?t==null?void 0:t.map((e,s)=>r.jsx(M,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.text,onSelectCard:()=>w==null?void 0:w(e)},`field-of-interests-masonry-tag__${s+1}`)):(u=Array.from("12345"))==null?void 0:u.map((e,s)=>r.jsx(z,{},`field-of-interests-masonry-tag-skeleton__${s+1}`))}),r.jsx("div",{className:"wrapper__cards",children:n&&(n==null?void 0:n.length)>0?n==null?void 0:n.map((e,s)=>r.jsx(O,{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:()=>h==null?void 0:h(e==null?void 0:e.uuid),className:"wrapper__card"},`field-of-interests-with-tags-card__${s+1}`)):(y=Array.from("12345"))==null?void 0:y.map((e,s)=>r.jsx(S,{},`field-of-interests-with-tags-card-skeleton__${s+1}`))})]})});module.exports=F;
+`,F=l.forwardRef(({title:i,subtitle:a,tags:t=[],cards:n=[],limitTags:m=5,limitTagsForMobile:d=5,limit:g=3,limitForMobile:c=2,onSelectTag:_=()=>{},onSelectCard:f=()=>{}},L)=>{var u,y;const w=e=>{_==null||_(e==null?void 0:e.uuid)},h=e=>{f==null||f(e==null?void 0:e.uuid)};return k.useEffectOnce(()=>{const e=()=>{document.querySelector(".wrapper__cards").querySelectorAll(".wrapper__card").forEach(v=>{const j=v.getBoundingClientRect().height,b=Math.ceil((j+10)/20);v.style.gridRowEnd=`span ${b}`})};return e(),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),r.jsxs(C,{limitTags:m,limitTagsForMobile:d,limitCards:g,limitCardsForMobile:c,children:[r.jsxs("div",{className:"wrapper__heading",children:[i&&r.jsx("div",{className:"wrapper__title",children:i}),a&&r.jsx("div",{className:"wrapper__subtitle",children:a})]}),r.jsx("div",{className:"wrapper__tags",children:t&&(t==null?void 0:t.length)>0?t==null?void 0:t.map((e,s)=>r.jsx(z,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.text,onSelectCard:()=>w==null?void 0:w(e)},`field-of-interests-masonry-tag__${s+1}`)):(u=Array.from("12345"))==null?void 0:u.map((e,s)=>r.jsx(q,{},`field-of-interests-masonry-tag-skeleton__${s+1}`))}),r.jsx("div",{className:"wrapper__cards",children:n&&(n==null?void 0:n.length)>0?n==null?void 0:n.map((e,s)=>r.jsx(O,{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:()=>h==null?void 0:h(e==null?void 0:e.uuid),className:"wrapper__card"},`field-of-interests-with-tags-card__${s+1}`)):(y=Array.from("12345"))==null?void 0:y.map((e,s)=>r.jsx(S,{},`field-of-interests-with-tags-card-skeleton__${s+1}`))})]})});module.exports=F;

package/dist/FieldOfInterestsMasonrySection.js

@@ -1,12 +1,12 @@
 import { jsx as i, jsxs as s } from "react/jsx-runtime";
 import { forwardRef as l } from "react";
-import { n as p } from "./emotion-styled.browser.esm-BiK8DcgW.js";
+import { n as m } from "./emotion-styled.browser.esm-BiK8DcgW.js";
 import { M as g } from "./consts-DNVz1x1I.js";
-import { t as b, m as $, l as z } from "./utils-DtEdJZWa.js";
-import I from "./Icon.js";
-import { u as M } from "./emotion-element-5486c51c.browser.esm-Bb4VkP8U.js";
-import { u as E } from "./useEffectOnce-guOKBPuL.js";
-const O = p.div`
+import { t as b, m as $, l as z } from "./utils-xpQsPsCa.js";
+import M from "./Icon.js";
+import { u as I } from "./emotion-element-5486c51c.browser.esm-Bb4VkP8U.js";
+import { u as C } from "./useEffectOnce-guOKBPuL.js";
+const E = m.div`
   display: flex;
   width: 100%;
   height: fit-content;
@@ -36,7 +36,7 @@ const O = p.div`
     align-self: stretch;
 
     & .wrapper__title {
-      color: var(--gray-950);
+      color: var(--gray-950, #14161a);
       font-size: 1rem;
       font-style: normal;
       font-weight: 500;
@@ -45,7 +45,7 @@ const O = p.div`
     }
 
     & .wrapper__description {
-      color: var(--gray-600);
+      color: var(--gray-600, #676e79);
       font-size: 0.75rem;
       font-style: normal;
       font-weight: 400;
@@ -54,12 +54,12 @@ const O = p.div`
       ${b(2)}
     }
   }
-`, C = p.div`
+`, F = m.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
   background: ${$("-90deg")};
-`, F = p.div`
+`, O = m.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -125,7 +125,7 @@ const O = p.div`
       white-space: nowrap;
     }
   }
-`, W = p.div`
+`, W = m.div`
   width: 7.5rem;
   width: 7.5rem;
   border-radius: 999px;
@@ -137,8 +137,8 @@ const O = p.div`
   }
 `, j = l(({}, r) => /* @__PURE__ */ i(W, {})), A = l(
   ({ text: r, isActive: o, icon: t, onSelectCard: n = () => {
-  } }, m) => /* @__PURE__ */ s(F, { className: o ? "active" : "", onClick: n, children: [
-    /* @__PURE__ */ i(I, { icon: t, className: "wrapper__icon" }),
+  } }, p) => /* @__PURE__ */ s(O, { className: o ? "active" : "", onClick: n, children: [
+    /* @__PURE__ */ i(M, { icon: t, className: "wrapper__icon" }),
     /* @__PURE__ */ i("div", { className: "wrapper__text", children: r })
   ] })
 ), L = l(
@@ -147,12 +147,12 @@ const O = p.div`
     imageComponent: o,
     title: t,
     description: n,
-    className: m,
+    className: p,
     onSelectCard: d = () => {
     }
   }, u) => {
-    const { theme: c } = M();
-    return /* @__PURE__ */ s(O, { theme: c, className: m, onClick: d, children: [
+    const { theme: c } = I();
+    return /* @__PURE__ */ s(E, { theme: c, className: p, onClick: d, children: [
       z(o) ? o : /* @__PURE__ */ i("img", { src: r, className: "wrapper__image" }),
       /* @__PURE__ */ s("div", { className: "wrapper__content", children: [
         t && /* @__PURE__ */ i("div", { className: "wrapper__title", children: t }),
@@ -160,13 +160,13 @@ const O = p.div`
       ] })
     ] });
   }
-), R = l(({}, r) => /* @__PURE__ */ s(C, { children: [
+), R = l(({}, r) => /* @__PURE__ */ s(F, { children: [
   /* @__PURE__ */ i("div", { className: "wrapper__image" }),
   /* @__PURE__ */ s("div", { className: "wrapper__content", children: [
     /* @__PURE__ */ i("div", { className: "wrapper__title" }),
     /* @__PURE__ */ i("div", { className: "wrapper__description" })
   ] })
-] })), T = p.div`
+] })), T = m.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -236,10 +236,10 @@ const O = p.div`
     subtitle: o,
     tags: t = [],
     cards: n = [],
-    limitTags: m = 5,
+    limitTags: p = 5,
     limitTagsForMobile: d = 5,
-    limitCards: u = 3,
-    limitCardsForMobile: c = 2,
+    limit: u = 3,
+    limitForMobile: c = 2,
     onSelectTag: f = () => {
     },
     onSelectCard: _ = () => {
@@ -251,7 +251,7 @@ const O = p.div`
     }, w = (e) => {
       _ == null || _(e == null ? void 0 : e.uuid);
     };
-    return E(() => {
+    return C(() => {
       const e = () => {
         document.querySelector(".wrapper__cards").querySelectorAll(".wrapper__card").forEach((v) => {
           const N = v.getBoundingClientRect().height, k = Math.ceil((N + 10) / 20);
@@ -264,7 +264,7 @@ const O = p.div`
     }), /* @__PURE__ */ s(
       T,
       {
-        limitTags: m,
+        limitTags: p,
         limitTagsForMobile: d,
         limitCards: u,
         limitCardsForMobile: c,

package/dist/FieldOfInterestsWithAvatarsCardsSection.cjs

@@ -1,13 +1,17 @@
-"use strict";const t=require("react/jsx-runtime"),f=require("react"),u=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),a=require("./consts-dNz9tpt4.cjs"),d=require("./utils-CE6bljYe.cjs"),$=require("./index-BlV3tdJ8.cjs"),I=u.newStyled.div`
+"use strict";const t=require("react/jsx-runtime"),f=require("react"),u=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),w=require("./consts-dNz9tpt4.cjs"),d=require("./utils-UJt-R-G3.cjs"),$=require("./index-CC_hdGKn.cjs"),c=u.newStyled.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
   background: ${d.linearGradientAnimation("-90deg")};
-`,A=u.newStyled.div`
+`,C=u.newStyled.div`
   width: 100%;
   height: auto;
   border-radius: 999px;
 
+  &:hover {
+    cursor: pointer;
+  }
+
   & .wrapper__image {
     width: 100%;
     aspect-ratio: 1 / 1;
@@ -20,7 +24,7 @@
     border: var(--yellow-600, #d97706);
   }
 
-  @media (max-width: ${a.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__image {
       height: auto;
     }
@@ -31,11 +35,11 @@
   border-radius: 999px;
   background: ${d.linearGradientAnimation("-90deg")};
 
-  @media (max-width: ${a.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
     width: 4.5rem;
     height: 4.5rem;
   }
-`,N=f.forwardRef(({},i)=>t.jsx(F,{})),k=f.forwardRef(({isActive:i,image:o,imageComponent:r,onSelectCard:l=()=>{}},_)=>t.jsx(A,{className:i?"active":"",onClick:l,children:d.isDefined(r)?r:t.jsx("img",{src:o,className:"wrapper__image"})})),C=f.forwardRef(({uuid:i,title:o,price:r,currency:l,isNegotiable:_,isFree:x,image:w,sellerUuid:s,onSelectCard:m=()=>{},imageComponent:p,negotiableText:y="Negotiable",freeText:g="Free"},h)=>t.jsx($.SimpleProductCard,{uuid:i,title:o,price:r,currency:l,isNegotiable:_,isFree:x,image:w,imageComponent:p,sellerUuid:s,onSelectCard:m,negotiableText:y,freeText:g})),W=f.forwardRef(({},i)=>t.jsx(I,{})),O=u.newStyled.div`
+`,I=f.forwardRef(({},i)=>t.jsx(F,{})),A=f.forwardRef(({isActive:i,image:o,imageComponent:r,onSelectCard:l=()=>{}},_)=>t.jsx(C,{className:i?"active":"",onClick:l,children:d.isDefined(r)?r:t.jsx("img",{src:o,className:"wrapper__image"})})),N=f.forwardRef(({uuid:i,title:o,price:r,currency:l,isNegotiable:_,isFree:a,image:x,sellerUuid:s,onSelectCard:m=()=>{},imageComponent:p,negotiableText:y="Negotiable",freeText:g="Free"},h)=>t.jsx($.SimpleProductCard,{uuid:i,title:o,price:r,currency:l,isNegotiable:_,isFree:a,image:x,imageComponent:p,sellerUuid:s,onSelectCard:m,negotiableText:y,freeText:g})),k=f.forwardRef(({},i)=>t.jsx(c,{})),W=u.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -84,7 +88,7 @@
     width: 100%;
   }
 
-  @media (max-width: ${a.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__avatars {
       grid-template-columns: ${i=>`repeat(${i==null?void 0:i.limitAvatarsForMobile}, minmax(0, 1fr))`};
       gap: auto;
@@ -95,4 +99,4 @@
       gap: 1rem;
     }
   }
-`,R=f.forwardRef(({title:i,subtitle:o,avatars:r=[],limitAvatars:l=4,limitCards:_=6,limitAvatarsForMobile:x=4,limitCardsForMobile:w=2,cards:s=[],onSelectAvatar:m=()=>{},onSelectCard:p=()=>{}},y)=>{var j,b;const g=e=>{m==null||m(e==null?void 0:e.uuid)},h=e=>{p==null||p(e==null?void 0:e.uuid)};return t.jsxs(O,{limitAvatars:l,limitAvatarsForMobile:x,limitCards:_,limitCardsForMobile:w,children:[t.jsxs("div",{className:"wrapper__heading",children:[i&&t.jsx("div",{className:"wrapper__title",children:i}),o&&t.jsx("div",{className:"wrapper__subtitle",children:o})]}),t.jsx("div",{className:"wrapper__avatars",children:r&&(r==null?void 0:r.length)>0?r==null?void 0:r.map((e,n)=>t.jsx(k,{image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>g==null?void 0:g(e)},`field-of-interests-with-avatars-card-avatar__${n+1}`)):(j=Array.from("1234"))==null?void 0:j.map((e,n)=>t.jsx(N,{},`field-of-interests-with-avatars-card-avatar-skeleton__${n+1}`))}),t.jsx("div",{className:"wrapper__cards",children:s&&(s==null?void 0:s.length)>0?s==null?void 0:s.map((e,n)=>t.jsx(C,{uuid:e==null?void 0:e.uuid,title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,isNegotiable:e==null?void 0:e.isNegotiable,isFree:e==null?void 0:e.isFree,image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,sellerUuid:e==null?void 0:e.sellerUuid,negotiableText:e==null?void 0:e.negotiableText,freeText:e==null?void 0:e.freeText,onSelectCard:()=>h==null?void 0:h(e)},`field-of-interests-with-avatars-card__${n+1}`)):(b=Array.from("123456"))==null?void 0:b.map((e,n)=>t.jsx(W,{},`field-of-interests-with-avatars-card-skeleton__${n+1}`))})]})});module.exports=R;
+`,O=f.forwardRef(({title:i,subtitle:o,avatars:r=[],limitAvatars:l=4,limit:_=6,limitAvatarsForMobile:a=4,limitForMobile:x=2,items:s=[],onSelectAvatar:m=()=>{},onSelectCard:p=()=>{}},y)=>{var j,b;const g=e=>{m==null||m(e==null?void 0:e.uuid)},h=e=>{p==null||p(e==null?void 0:e.uuid)};return t.jsxs(W,{limitAvatars:l,limitAvatarsForMobile:a,limitCards:_,limitCardsForMobile:x,children:[t.jsxs("div",{className:"wrapper__heading",children:[i&&t.jsx("div",{className:"wrapper__title",children:i}),o&&t.jsx("div",{className:"wrapper__subtitle",children:o})]}),t.jsx("div",{className:"wrapper__avatars",children:r&&(r==null?void 0:r.length)>0?r==null?void 0:r.map((e,n)=>t.jsx(A,{image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>g==null?void 0:g(e)},`field-of-interests-with-avatars-card-avatar__${n+1}`)):(j=Array.from("1234"))==null?void 0:j.map((e,n)=>t.jsx(I,{},`field-of-interests-with-avatars-card-avatar-skeleton__${n+1}`))}),t.jsx("div",{className:"wrapper__cards",children:s&&(s==null?void 0:s.length)>0?s==null?void 0:s.map((e,n)=>t.jsx(N,{uuid:e==null?void 0:e.uuid,title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,isNegotiable:e==null?void 0:e.isNegotiable,isFree:e==null?void 0:e.isFree,image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,sellerUuid:e==null?void 0:e.sellerUuid,negotiableText:e==null?void 0:e.negotiableText,freeText:e==null?void 0:e.freeText,onSelectCard:()=>h==null?void 0:h(e)},`field-of-interests-with-avatars-card__${n+1}`)):(b=Array.from("123456"))==null?void 0:b.map((e,n)=>t.jsx(k,{},`field-of-interests-with-avatars-card-skeleton__${n+1}`))})]})});module.exports=O;

package/dist/FieldOfInterestsWithAvatarsCardsSection.js

@@ -1,19 +1,23 @@
 import { jsx as t, jsxs as y } from "react/jsx-runtime";
 import { forwardRef as f } from "react";
-import { n as u } from "./emotion-styled.browser.esm-BiK8DcgW.js";
-import { M as x } from "./consts-DNVz1x1I.js";
-import { m as F, l as N } from "./utils-DtEdJZWa.js";
-import { S as k } from "./index-DGl-lSfF.js";
-const A = u.div`
+import { n as _ } from "./emotion-styled.browser.esm-BiK8DcgW.js";
+import { M as d } from "./consts-DNVz1x1I.js";
+import { m as C, l as F } from "./utils-xpQsPsCa.js";
+import { S as N } from "./index-DZxSlQJQ.js";
+const k = _.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
-  background: ${F("-90deg")};
-`, C = u.div`
+  background: ${C("-90deg")};
+`, A = _.div`
   width: 100%;
   height: auto;
   border-radius: 999px;
 
+  &:hover {
+    cursor: pointer;
+  }
+
   & .wrapper__image {
     width: 100%;
     aspect-ratio: 1 / 1;
@@ -26,64 +30,64 @@ const A = u.div`
     border: var(--yellow-600, #d97706);
   }
 
-  @media (max-width: ${x + "px"}) {
+  @media (max-width: ${d + "px"}) {
     & .wrapper__image {
       height: auto;
     }
   }
-`, W = u.div`
+`, W = _.div`
   width: 9.875rem;
   height: 9.875rem;
   border-radius: 999px;
-  background: ${F("-90deg")};
+  background: ${C("-90deg")};
 
-  @media (max-width: ${x + "px"}) {
+  @media (max-width: ${d + "px"}) {
     width: 4.5rem;
     height: 4.5rem;
   }
-`, I = f(({}, i) => /* @__PURE__ */ t(W, {})), v = f(
-  ({ isActive: i, image: s, imageComponent: r, onSelectCard: o = () => {
+`, v = f(({}, i) => /* @__PURE__ */ t(W, {})), I = f(
+  ({ isActive: i, image: o, imageComponent: r, onSelectCard: m = () => {
   } }, h) => /* @__PURE__ */ t(
-    C,
+    A,
     {
       className: i ? "active" : "",
-      onClick: o,
-      children: N(r) ? r : /* @__PURE__ */ t("img", { src: s, className: "wrapper__image" })
+      onClick: m,
+      children: F(r) ? r : /* @__PURE__ */ t("img", { src: o, className: "wrapper__image" })
     }
   )
 ), O = f(
   ({
     uuid: i,
-    title: s,
+    title: o,
     price: r,
-    currency: o,
+    currency: m,
     isNegotiable: h,
-    isFree: w,
-    image: a,
-    sellerUuid: m,
+    isFree: u,
+    image: w,
+    sellerUuid: n,
     onSelectCard: l = () => {
     },
     imageComponent: p,
-    negotiableText: d = "Negotiable",
+    negotiableText: x = "Negotiable",
     freeText: g = "Free"
-  }, _) => /* @__PURE__ */ t(
-    k,
+  }, a) => /* @__PURE__ */ t(
+    N,
     {
       uuid: i,
-      title: s,
+      title: o,
       price: r,
-      currency: o,
+      currency: m,
       isNegotiable: h,
-      isFree: w,
-      image: a,
+      isFree: u,
+      image: w,
       imageComponent: p,
-      sellerUuid: m,
+      sellerUuid: n,
       onSelectCard: l,
-      negotiableText: d,
+      negotiableText: x,
       freeText: g
     }
   )
-), j = f(({}, i) => /* @__PURE__ */ t(A, {})), M = u.div`
+), j = f(({}, i) => /* @__PURE__ */ t(k, {})), M = _.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -132,7 +136,7 @@ const A = u.div`
     width: 100%;
   }
 
-  @media (max-width: ${x + "px"}) {
+  @media (max-width: ${d + "px"}) {
     & .wrapper__avatars {
       grid-template-columns: ${(i) => `repeat(${i == null ? void 0 : i.limitAvatarsForMobile}, minmax(0, 1fr))`};
       gap: auto;
@@ -143,53 +147,53 @@ const A = u.div`
       gap: 1rem;
     }
   }
-`, D = f(
+`, B = f(
   ({
     title: i,
-    subtitle: s,
+    subtitle: o,
     avatars: r = [],
-    limitAvatars: o = 4,
-    limitCards: h = 6,
-    limitAvatarsForMobile: w = 4,
-    limitCardsForMobile: a = 2,
-    cards: m = [],
+    limitAvatars: m = 4,
+    limit: h = 6,
+    limitAvatarsForMobile: u = 4,
+    limitForMobile: w = 2,
+    items: n = [],
     onSelectAvatar: l = () => {
     },
     onSelectCard: p = () => {
     }
-  }, d) => {
-    var $, b;
+  }, x) => {
+    var b, $;
     const g = (e) => {
       l == null || l(e == null ? void 0 : e.uuid);
-    }, _ = (e) => {
+    }, a = (e) => {
       p == null || p(e == null ? void 0 : e.uuid);
     };
     return /* @__PURE__ */ y(
       M,
       {
-        limitAvatars: o,
-        limitAvatarsForMobile: w,
+        limitAvatars: m,
+        limitAvatarsForMobile: u,
         limitCards: h,
-        limitCardsForMobile: a,
+        limitCardsForMobile: w,
         children: [
           /* @__PURE__ */ y("div", { className: "wrapper__heading", children: [
             i && /* @__PURE__ */ t("div", { className: "wrapper__title", children: i }),
-            s && /* @__PURE__ */ t("div", { className: "wrapper__subtitle", children: s })
+            o && /* @__PURE__ */ t("div", { className: "wrapper__subtitle", children: o })
           ] }),
-          /* @__PURE__ */ t("div", { className: "wrapper__avatars", children: r && (r == null ? void 0 : r.length) > 0 ? r == null ? void 0 : r.map((e, n) => /* @__PURE__ */ t(
-            v,
+          /* @__PURE__ */ t("div", { className: "wrapper__avatars", children: r && (r == null ? void 0 : r.length) > 0 ? r == null ? void 0 : r.map((e, s) => /* @__PURE__ */ t(
+            I,
             {
               image: e == null ? void 0 : e.image,
               imageComponent: e == null ? void 0 : e.imageComponent,
               onSelectCard: () => g == null ? void 0 : g(e)
             },
-            `field-of-interests-with-avatars-card-avatar__${n + 1}`
-          )) : ($ = Array.from("1234")) == null ? void 0 : $.map((e, n) => /* @__PURE__ */ t(
-            I,
+            `field-of-interests-with-avatars-card-avatar__${s + 1}`
+          )) : (b = Array.from("1234")) == null ? void 0 : b.map((e, s) => /* @__PURE__ */ t(
+            v,
             {},
-            `field-of-interests-with-avatars-card-avatar-skeleton__${n + 1}`
+            `field-of-interests-with-avatars-card-avatar-skeleton__${s + 1}`
           )) }),
-          /* @__PURE__ */ t("div", { className: "wrapper__cards", children: m && (m == null ? void 0 : m.length) > 0 ? m == null ? void 0 : m.map((e, n) => /* @__PURE__ */ t(
+          /* @__PURE__ */ t("div", { className: "wrapper__cards", children: n && (n == null ? void 0 : n.length) > 0 ? n == null ? void 0 : n.map((e, s) => /* @__PURE__ */ t(
             O,
             {
               uuid: e == null ? void 0 : e.uuid,
@@ -203,13 +207,13 @@ const A = u.div`
               sellerUuid: e == null ? void 0 : e.sellerUuid,
               negotiableText: e == null ? void 0 : e.negotiableText,
               freeText: e == null ? void 0 : e.freeText,
-              onSelectCard: () => _ == null ? void 0 : _(e)
+              onSelectCard: () => a == null ? void 0 : a(e)
             },
-            `field-of-interests-with-avatars-card__${n + 1}`
-          )) : (b = Array.from("123456")) == null ? void 0 : b.map((e, n) => /* @__PURE__ */ t(
+            `field-of-interests-with-avatars-card__${s + 1}`
+          )) : ($ = Array.from("123456")) == null ? void 0 : $.map((e, s) => /* @__PURE__ */ t(
             j,
             {},
-            `field-of-interests-with-avatars-card-skeleton__${n + 1}`
+            `field-of-interests-with-avatars-card-skeleton__${s + 1}`
           )) })
         ]
       }
@@ -217,5 +221,5 @@ const A = u.div`
   }
 );
 export {
-  D as default
+  B as default
 };

package/dist/FieldOfInterestsWithTagsCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),m=require("react"),p=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),l=require("./utils-CE6bljYe.cjs"),y=require("./Icon.cjs"),v=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),j=require("./consts-dNz9tpt4.cjs"),b=p.newStyled.div`
+"use strict";const r=require("react/jsx-runtime"),p=require("react"),d=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),l=require("./utils-UJt-R-G3.cjs"),v=require("./Icon.cjs"),y=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),b=require("./consts-dNz9tpt4.cjs"),j=d.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -8,6 +8,10 @@
   border: 1px solid var(--neutral-9508, rgba(20, 22, 26, 0.08));
   background: var(--Lanaco-Gray-white, #fff);
 
+  &:hover {
+    cursor: pointer;
+  }
+
   /* drop-shadow-sm */
   box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
 
@@ -28,7 +32,7 @@
     align-self: stretch;
 
     & .wrapper__title {
-      color: var(--gray-950);
+      color: var(--gray-950, #14161a);
       font-size: 1rem;
       font-style: normal;
       font-weight: 500;
@@ -37,7 +41,7 @@
     }
 
     & .wrapper__description {
-      color: var(--gray-600);
+      color: var(--gray-600, #676e79);
       font-size: 0.75rem;
       font-style: normal;
       font-weight: 400;
@@ -46,22 +50,26 @@
       ${l.truncateTextInRows(2)}
     }
   }
-`,$=p.newStyled.div`
+`,k=d.newStyled.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
   background: ${l.linearGradientAnimation("-90deg")};
-`,k=p.newStyled.div`
+`,$=d.newStyled.div`
   display: flex;
-  padding: 0 0.75rem 0 0;
+  padding: 0 0.5rem 0 0;
   align-items: center;
+  justify-content: center;
   background: var(--neutral-9504, rgba(20, 22, 26, 0.04));
   border-radius: 999px;
 
+  &:hover {
+    cursor: pointer;
+  }
+
   & .wrapper__icon {
     font-size: 1.75rem;
     color: var(--gray-950, #14161a);
-    background: var(--gray-200);
     border-radius: 999px;
     width: 2.75rem;
     height: 2.75rem;
@@ -91,12 +99,12 @@
       color: var(--white, #fff);
     }
   }
-`,N=p.newStyled.div`
+`,N=d.newStyled.div`
   width: 7rem;
   height: 3rem;
   border-radius: 999px;
   background: ${l.linearGradientAnimation("-90deg")};
-`,I=m.forwardRef(({},r)=>t.jsx(N,{})),W=m.forwardRef(({text:r,isActive:n,icon:i,onSelectCard:o=()=>{}},d)=>t.jsxs(k,{className:n?"active":"",onClick:o,children:[t.jsx(y,{icon:i,className:"wrapper__icon"}),t.jsx("div",{className:"wrapper__text",children:r})]})),R=m.forwardRef(({image:r,imageComponent:n,title:i,description:o,onSelectCard:d=()=>{}},x)=>{const{theme:f}=v.useTheme();return t.jsxs(b,{theme:f,onClick:d,children:[l.isDefined(n)?n:t.jsx("img",{src:r,className:"wrapper__image"}),t.jsxs("div",{className:"wrapper__content",children:[i&&t.jsx("div",{className:"wrapper__title",children:i}),o&&t.jsx("div",{className:"wrapper__description",children:o})]})]})}),T=m.forwardRef(({},r)=>t.jsx($,{})),q=p.newStyled.div`
+`,I=p.forwardRef(({},t)=>r.jsx(N,{})),C=p.forwardRef(({text:t,isActive:n,icon:i,onSelectCard:a=()=>{}},c)=>r.jsxs($,{className:n?"active":"",onClick:a,children:[r.jsx(v,{icon:i,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:t})]})),W=p.forwardRef(({image:t,imageComponent:n,title:i,description:a,onSelectCard:c=()=>{}},x)=>{const{theme:m}=y.useTheme();return r.jsxs(j,{theme:m,onClick:c,children:[l.isDefined(n)?n:r.jsx("img",{src:t,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__content",children:[i&&r.jsx("div",{className:"wrapper__title",children:i}),a&&r.jsx("div",{className:"wrapper__description",children:a})]})]})}),R=p.forwardRef(({},t)=>r.jsx(k,{})),F=d.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -129,33 +137,45 @@
   }
 
   & .wrapper__tags {
-    display: grid;
-    grid-template-columns: ${r=>`repeat(${r==null?void 0:r.limitTags}, minmax(0, 1fr))`};
-    justify-content: center;
+    display: flex;
+    justify-items: center;
     align-items: center;
     gap: 0.75rem;
   }
 
   & .wrapper__cards {
     display: grid;
-    grid-template-columns: ${r=>`repeat(${r==null?void 0:r.limitCards}, minmax(0, 1fr))`};
+    grid-template-columns: ${t=>`repeat(${t==null?void 0:t.limitCards}, minmax(0, 1fr))`};
     justify-content: center;
     align-items: center;
     gap: 1.5rem;
     width: 100%;
   }
 
-  @media (max-width: ${j.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${b.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__tags {
-      display: flex;
       overflow-x: scroll;
       justify-content: flex-start;
       width: 100%;
+
+      -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 */
+      }
     }
 
     & .wrapper__cards {
-      grid-template-columns: ${r=>`repeat(${r==null?void 0:r.limitCardsForMobile}, minmax(0, 1fr))`};
+      grid-template-columns: ${t=>`repeat(${t==null?void 0:t.limitCardsForMobile}, minmax(0, 1fr))`};
       gap: 1rem;
     }
   }
-`,C=m.forwardRef(({title:r,subtitle:n,tags:i=[],limitTags:o=7,limitTagsForMobile:d=7,limitCards:x=3,limitCardsForMobile:f=2,cards:s=[],onSelectTag:c=()=>{},onSelectCard:_=()=>{}},z)=>{var g,u;const h=e=>{c==null||c(e==null?void 0:e.uuid)},w=e=>{_==null||_(e==null?void 0:e.uuid)};return t.jsxs(q,{limitTags:o,limitTagsForMobile:d,limitCards:x,limitCardsForMobile:f,children:[t.jsxs("div",{className:"wrapper__heading",children:[r&&t.jsx("div",{className:"wrapper__title",children:r}),n&&t.jsx("div",{className:"wrapper__subtitle",children:n})]}),t.jsx("div",{className:"wrapper__tags",children:i&&(i==null?void 0:i.length)>0?i==null?void 0:i.map((e,a)=>t.jsx(W,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.text,onSelectCard:()=>h==null?void 0:h(e)},`field-of-interests-with-tags-card-tag__${a+1}`)):(g=Array.from("123"))==null?void 0:g.map((e,a)=>t.jsx(I,{},`field-of-interests-with-tags-card-tag-skeleton__${a+1}`))}),t.jsx("div",{className:"wrapper__cards",children:s&&(s==null?void 0:s.length)>0?s==null?void 0:s.map((e,a)=>t.jsx(R,{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:()=>w==null?void 0:w(e==null?void 0:e.uuid)},`field-of-interests-with-tags-card__${a+1}`)):(u=Array.from("123"))==null?void 0:u.map((e,a)=>t.jsx(T,{},`field-of-interests-with-tags-card-skeleton__${a+1}`))})]})});module.exports=C;
+`,q=p.forwardRef(({title:t,subtitle:n,tags:i=[],limitTags:a=7,limitTagsForMobile:c=7,limit:x=3,limitForMobile:m=2,items:s=[],onSelectTag:f=()=>{},onSelectCard:w=()=>{}},T)=>{var g,u;const h=e=>{f==null||f(e==null?void 0:e.uuid)},_=e=>{w==null||w(e==null?void 0:e.uuid)};return r.jsxs(F,{limitTags:a,limitTagsForMobile:c,limitCards:x,limitCardsForMobile:m,children:[r.jsxs("div",{className:"wrapper__heading",children:[t&&r.jsx("div",{className:"wrapper__title",children:t}),n&&r.jsx("div",{className:"wrapper__subtitle",children:n})]}),r.jsx("div",{className:"wrapper__tags",children:i&&(i==null?void 0:i.length)>0?i==null?void 0:i.map((e,o)=>r.jsx(C,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.text,onSelectCard:()=>h==null?void 0:h(e)},`field-of-interests-with-tags-card-tag__${o+1}`)):(g=Array.from("123"))==null?void 0:g.map((e,o)=>r.jsx(I,{},`field-of-interests-with-tags-card-tag-skeleton__${o+1}`))}),r.jsx("div",{className:"wrapper__cards",children:s&&(s==null?void 0:s.length)>0?s==null?void 0:s.map((e,o)=>r.jsx(W,{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:()=>_==null?void 0:_(e==null?void 0:e.uuid)},`field-of-interests-with-tags-card__${o+1}`)):(u=Array.from("123"))==null?void 0:u.map((e,o)=>r.jsx(R,{},`field-of-interests-with-tags-card-skeleton__${o+1}`))})]})});module.exports=q;