@lanaco/lnc-react-ui 4.0.54 → 4.0.56

package/dist/BannerSectionSimple.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),y=require("react"),i=require("./emotion-styled.browser.esm-BtEseadx.cjs"),r=require("./consts-CtNoHdBj.cjs"),j=require("./Button.cjs"),M=require("./useDetectMobile-D6d5LpdL.cjs"),v=i.styled.div`
+"use strict";const t=require("react/jsx-runtime"),j=require("react"),i=require("./emotion-styled.browser.esm-BtEseadx.cjs"),r=require("./consts-CtNoHdBj.cjs"),y=require("./Button.cjs"),M=require("./useDetectMobile-D6d5LpdL.cjs"),v=i.styled.div`
   display: flex;
   border-radius: 0.75rem;
   background-color: ${e=>e.bgcolor||"transparent"};
@@ -11,11 +11,6 @@
     width: fit-content;
   }
 
-  ${e=>e.hasBorder===!0&&`border: 1px solid var(--gray-95008, rgba(20, 22, 26, 0.08));
-  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
-
-`}
-
   & img {
     object-fit: cover;
     max-width: ${e=>e.imgW||"22.5rem"};
@@ -34,6 +29,7 @@
     flex-direction: column;
     min-height: unset;
     max-height: unset;
+    border: none;
 
     & button {
       width: fit-content;
@@ -46,7 +42,7 @@
       min-height: ${e=>e.imgHMob||"12.1rem"};
     }
   }
-`,B=i.styled.div`
+`,H=i.styled.div`
   padding: ${e=>e.smallPadding===!0?"2rem":"4rem 5rem"};
   display: flex;
   gap: 2rem;
@@ -59,7 +55,7 @@
     padding: 0;
     flex-direction: column;
   }
-`,H=i.styled.div`
+`,B=i.styled.div`
   display: flex;
   flex-direction: column;
   gap: 0.25rem;
@@ -78,4 +74,4 @@
   @media (max-width: ${r.MOBILE_SIZE_PX+"px"}) {
     flex-direction: column;
   }
-`,_=y.forwardRef((e,d)=>{const{title:l,subtitle:m,buttonText:h,buttonLink:c,onButtonAction:g=()=>{},imageUrl:o,imagePosition:n="right",hideImageForMobile:a=!1,sectionHeight:x="12.65625rem",imageWidth:u,imageHeightMobile:p,smallPadding:b=!1,isHorizontalContent:f=!1,backgroundColor:w,hasBorder:$=!1}=e,s=M.useDetectMobile();return t.jsxs(v,{ref:d,bgcolor:w,height:x,imgW:u,imgHMob:p,hasBorder:$,children:[n!=="right"&&!(a===!0&&s===!0)&&t.jsx("img",{src:o}),t.jsxs(B,{isHorizontalContent:f,smallPadding:b,children:[t.jsxs(H,{children:[t.jsx("div",{className:"header-title",children:l}),t.jsx("div",{className:"header-subitle",children:m})]}),t.jsx(j,{size:"medium",color:"neutral",type:"button",onClick:()=>g(c),children:h})]}),n==="right"&&!(a===!0&&s===!0)&&t.jsx("img",{src:o})]})});module.exports=_;
+`,_=j.forwardRef((e,m)=>{const{title:d,subtitle:l,buttonText:h,buttonLink:c,onButtonAction:g=()=>{},imageUrl:o,imagePosition:n="right",hideImageForMobile:s=!1,sectionHeight:u="12.65625rem",imageWidth:x,imageHeightMobile:b,smallPadding:p=!1,isHorizontalContent:f=!1,backgroundColor:w,hasBorder:$=!1}=e,a=M.useDetectMobile();return t.jsxs(v,{ref:m,bgcolor:w,height:u,imgW:x,imgHMob:b,hasBorder:$,children:[n!=="right"&&!(s===!0&&a===!0)&&t.jsx("img",{src:o}),t.jsxs(H,{isHorizontalContent:f,smallPadding:p,children:[t.jsxs(B,{children:[t.jsx("div",{className:"header-title",children:d}),t.jsx("div",{className:"header-subitle",children:l})]}),t.jsx(y,{size:"medium",color:"neutral",type:"button",onClick:()=>g(c),children:h})]}),n==="right"&&!(s===!0&&a===!0)&&t.jsx("img",{src:o})]})});module.exports=_;

package/dist/BannerSectionSimple.js

@@ -1,10 +1,10 @@
 import { jsxs as t, jsx as i } from "react/jsx-runtime";
-import { forwardRef as y } from "react";
+import { forwardRef as H } from "react";
 import { s as r } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as o } from "./consts-C1uHV4xc.js";
-import H from "./Button.js";
-import { u as M } from "./useDetectMobile-BC6EGaBc.js";
-const B = r.div`
+import M from "./Button.js";
+import { u as y } from "./useDetectMobile-BC6EGaBc.js";
+const C = r.div`
   display: flex;
   border-radius: 0.75rem;
   background-color: ${(e) => e.bgcolor || "transparent"};
@@ -17,11 +17,6 @@ const B = r.div`
     width: fit-content;
   }
 
-  ${(e) => e.hasBorder === !0 && `border: 1px solid var(--gray-95008, rgba(20, 22, 26, 0.08));
-  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
-
-`}
-
   & img {
     object-fit: cover;
     max-width: ${(e) => e.imgW || "22.5rem"};
@@ -40,6 +35,7 @@ const B = r.div`
     flex-direction: column;
     min-height: unset;
     max-height: unset;
+    border: none;
 
     & button {
       width: fit-content;
@@ -52,7 +48,7 @@ const B = r.div`
       min-height: ${(e) => e.imgHMob || "12.1rem"};
     }
   }
-`, C = r.div`
+`, z = r.div`
   padding: ${(e) => e.smallPadding === !0 ? "2rem" : "4rem 5rem"};
   display: flex;
   gap: 2rem;
@@ -65,7 +61,7 @@ const B = r.div`
     padding: 0;
     flex-direction: column;
   }
-`, z = r.div`
+`, B = r.div`
   display: flex;
   flex-direction: column;
   gap: 0.25rem;
@@ -84,54 +80,54 @@ const B = r.div`
   @media (max-width: ${o + "px"}) {
     flex-direction: column;
   }
-`, E = y((e, l) => {
+`, E = H((e, l) => {
   const {
     title: h,
-    subtitle: g,
-    buttonText: s,
+    subtitle: s,
+    buttonText: g,
     buttonLink: c,
-    onButtonAction: x = () => {
+    onButtonAction: u = () => {
     },
     imageUrl: n,
     imagePosition: a = "right",
     hideImageForMobile: m = !1,
-    sectionHeight: p = "12.65625rem",
-    imageWidth: u,
-    imageHeightMobile: b,
-    smallPadding: f = !1,
+    sectionHeight: x = "12.65625rem",
+    imageWidth: p,
+    imageHeightMobile: f,
+    smallPadding: b = !1,
     isHorizontalContent: $ = !1,
     backgroundColor: w,
     hasBorder: v = !1
-  } = e, d = M();
+  } = e, d = y();
   return /* @__PURE__ */ t(
-    B,
+    C,
     {
       ref: l,
       bgcolor: w,
-      height: p,
-      imgW: u,
-      imgHMob: b,
+      height: x,
+      imgW: p,
+      imgHMob: f,
       hasBorder: v,
       children: [
         a !== "right" && !(m === !0 && d === !0) && /* @__PURE__ */ i("img", { src: n }),
         /* @__PURE__ */ t(
-          C,
+          z,
           {
             isHorizontalContent: $,
-            smallPadding: f,
+            smallPadding: b,
             children: [
-              /* @__PURE__ */ t(z, { children: [
+              /* @__PURE__ */ t(B, { children: [
                 /* @__PURE__ */ i("div", { className: "header-title", children: h }),
-                /* @__PURE__ */ i("div", { className: "header-subitle", children: g })
+                /* @__PURE__ */ i("div", { className: "header-subitle", children: s })
               ] }),
               /* @__PURE__ */ i(
-                H,
+                M,
                 {
                   size: "medium",
                   color: "neutral",
                   type: "button",
-                  onClick: () => x(c),
-                  children: s
+                  onClick: () => u(c),
+                  children: g
                 }
               )
             ]

package/dist/GeneralWithTagsCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),s=require("react"),l=require("./emotion-styled.browser.esm-BtEseadx.cjs"),d=require("./consts-CtNoHdBj.cjs"),m=require("./utils-NZLCh-J5.cjs"),v=require("./Icon.cjs"),j=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),k=l.styled.div`
+"use strict";const r=require("react/jsx-runtime"),l=require("react"),o=require("./emotion-styled.browser.esm-BtEseadx.cjs"),d=require("./consts-CtNoHdBj.cjs"),m=require("./utils-NZLCh-J5.cjs"),j=require("./Icon.cjs"),k=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),$=o.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -74,7 +74,7 @@
       }
     }
   }
-`,$=l.styled.div`
+`,I=o.styled.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
@@ -85,7 +85,7 @@
     height: 5rem;
     border-radius: 999px;
   }
-`,I=l.styled.div`
+`,N=o.styled.div`
   display: flex;
   padding: 0 0.5rem 0 0;
   align-items: center;
@@ -125,12 +125,12 @@
       white-space: nowrap;
     }
   }
-`,C=l.styled.div`
+`,C=o.styled.div`
   width: 7rem;
   height: 3rem;
   border-radius: 999px;
   background: ${m.linearGradientAnimation("-90deg")};
-`,E=s.forwardRef(({},i)=>r.jsx(C,{})),N=s.forwardRef(({text:i,icon:a,onSelectCard:t=()=>{}},p)=>r.jsxs(I,{onClick:t,children:[r.jsx(v,{icon:` ${a}`,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:i})]})),W=s.forwardRef(({image:i,imageComponent:a,title:t,onSelectCard:p=()=>{}},f)=>{const{theme:c}=j.useTheme();return r.jsxs(k,{theme:c,onClick:p,children:[m.isDefined(a)?a:r.jsx("img",{src:i,className:"wrapper__image"}),r.jsx("div",{className:"wrapper__content",children:r.jsx("div",{className:"wrapper__title",children:t})})]})}),G=s.forwardRef(({},i)=>r.jsx($,{})),R=l.styled.div`
+`,E=l.forwardRef(({},t)=>r.jsx(C,{})),W=l.forwardRef(({text:t,icon:i,onSelectCard:a=()=>{}},p)=>r.jsxs(N,{onClick:a,children:[r.jsx(j,{icon:` ${i}`,className:"wrapper__icon"}),r.jsx("div",{className:"wrapper__text",children:t})]})),G=l.forwardRef(({image:t,imageComponent:i,title:a,onSelectCard:p=()=>{}},w)=>{const{theme:c}=k.useTheme();return r.jsxs($,{theme:c,onClick:p,children:[m.isDefined(i)?i:r.jsx("img",{src:t,className:"wrapper__image"}),r.jsx("div",{className:"wrapper__content",children:r.jsx("div",{className:"wrapper__title",children:a})})]})}),R=l.forwardRef(({},t)=>r.jsx(I,{})),q=o.styled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -172,7 +172,7 @@
 
   & .wrapper__cards {
     display: grid;
-    grid-template-columns: ${i=>`repeat(${i==null?void 0:i.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;
@@ -203,8 +203,8 @@
     }
 
     & .wrapper__cards {
-      grid-template-columns: ${i=>`repeat(${i==null?void 0:i.limitCardsForMobile}, minmax(0, 1fr))`};
+      grid-template-columns: ${t=>`repeat(${t==null?void 0:t.limitCardsForMobile}, minmax(0, 1fr))`};
       gap: 1rem;
     }
   }
-`,q=s.forwardRef(({title:i,subtitle:a,tags:t=[],limitTags:p=7,limitTagsForMobile:f=2,limit:c=3,limitForMobile:b=3,items:n=[],onSelectTag:h=()=>{},onSelectCard:_=()=>{}},y)=>{var g,u;const x=e=>{h==null||h(e==null?void 0:e.uuid)},w=e=>{_==null||_(e==null?void 0:e.uuid)};return r.jsxs(R,{ref:y,limitTags:p,limitTagsForMobile:f,limitCards:c,limitCardsForMobile:b,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__cards",children:n&&(n==null?void 0:n.length)>0?n==null?void 0:n.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,onSelectCard:()=>w==null?void 0:w(e==null?void 0:e.uuid)},`general-with-tags-card__${o+1}`)):(g=Array.from("123"))==null?void 0:g.map((e,o)=>r.jsx(G,{},`general-with-tags-card-skeleton__${o+1}`))}),r.jsx("div",{className:"wrapper__tags",children:t&&(t==null?void 0:t.length)>0?t==null?void 0:t.map((e,o)=>r.jsx(N,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.text,onSelectCard:()=>x==null?void 0:x(e)},`general-with-tags-card-tag__${o+1}`)):(u=Array.from("123"))==null?void 0:u.map((e,o)=>r.jsx(E,{},`general-with-tags-card-tag-skeleton__${o+1}`))})]})});module.exports=q;
+`,z=l.forwardRef(({title:t,subtitle:i,options:a=[],limitTags:p=7,limitTagsForMobile:w=2,limit:c=3,limitForMobile:b=3,items:n=[],onSelectTag:h=()=>{},onSelectCard:_=()=>{},isLoading:y},v)=>{var f,u;const x=e=>{h==null||h(e==null?void 0:e.uuid)},g=e=>{_==null||_(e==null?void 0:e.uuid)};return r.jsxs(q,{ref:v,limitTags:p,limitTagsForMobile:w,limitCards:c,limitCardsForMobile:b,children:[r.jsxs("div",{className:"wrapper__heading",children:[t&&r.jsx("div",{className:"wrapper__title",children:t}),i&&r.jsx("div",{className:"wrapper__subtitle",children:i})]}),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(G,{image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,title:e==null?void 0:e.title,onSelectCard:()=>g==null?void 0:g(e==null?void 0:e.uuid)},`general-with-tags-card__${s+1}`)):(f=Array.from("123"))==null?void 0:f.map((e,s)=>r.jsx(R,{},`general-with-tags-card-skeleton__${s+1}`))}),(a==null?void 0:a.length)>0&&r.jsx("div",{className:"wrapper__tags",children:a==null?void 0:a.map((e,s)=>r.jsx(W,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.text,onSelectCard:()=>x==null?void 0:x(e)},`general-with-tags-card-tag__${s+1}`))}),y===!0&&!((a==null?void 0:a.length)>0)&&r.jsx("div",{className:"wrapper__tags",children:(u=Array.from("123"))==null?void 0:u.map((e,s)=>r.jsx(E,{},`general-with-tags-card-tag-skeleton__${s+1}`))})]})});module.exports=z;

package/dist/GeneralWithTagsCardsSection.js

@@ -1,11 +1,11 @@
-import { jsx as i, jsxs as m } from "react/jsx-runtime";
-import { forwardRef as l } from "react";
-import { s as p } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { jsx as a, jsxs as m } from "react/jsx-runtime";
+import { forwardRef as o } from "react";
+import { s } from "./emotion-styled.browser.esm-BNN1dTl3.js";
 import { M as d } from "./consts-C1uHV4xc.js";
-import { t as k, m as b, l as $ } from "./utils-DtRLzzTZ.js";
+import { t as $, m as b, l as N } from "./utils-DtRLzzTZ.js";
 import C from "./Icon.js";
-import { u as N } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-const W = p.div`
+import { u as W } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+const j = s.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -44,7 +44,7 @@ const W = p.div`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${k(2)}
+      ${$(2)}
       transition: var(--transition, all 0.2s ease);
     }
   }
@@ -81,7 +81,7 @@ const W = p.div`
       }
     }
   }
-`, j = p.div`
+`, G = s.div`
   width: 100%;
   height: 11.625rem;
   border-radius: 0.75rem;
@@ -92,7 +92,7 @@ const W = p.div`
     height: 5rem;
     border-radius: 999px;
   }
-`, G = p.div`
+`, z = s.div`
   display: flex;
   padding: 0 0.5rem 0 0;
   align-items: center;
@@ -132,27 +132,27 @@ const W = p.div`
       white-space: nowrap;
     }
   }
-`, z = p.div`
+`, T = s.div`
   width: 7rem;
   height: 3rem;
   border-radius: 999px;
   background: ${b("-90deg")};
-`, T = l(({}, r) => /* @__PURE__ */ i(z, {})), I = l(
-  ({ text: r, icon: a, onSelectCard: t = () => {
-  } }, s) => /* @__PURE__ */ m(G, { onClick: t, children: [
-    /* @__PURE__ */ i(C, { icon: ` ${a}`, className: "wrapper__icon" }),
-    /* @__PURE__ */ i("div", { className: "wrapper__text", children: r })
+`, I = o(({}, r) => /* @__PURE__ */ a(T, {})), M = o(
+  ({ text: r, icon: i, onSelectCard: t = () => {
+  } }, p) => /* @__PURE__ */ m(z, { onClick: t, children: [
+    /* @__PURE__ */ a(C, { icon: ` ${i}`, className: "wrapper__icon" }),
+    /* @__PURE__ */ a("div", { className: "wrapper__text", children: r })
   ] })
-), M = l(
-  ({ image: r, imageComponent: a, title: t, onSelectCard: s = () => {
-  } }, g) => {
-    const { theme: c } = N();
-    return /* @__PURE__ */ m(W, { theme: c, onClick: s, children: [
-      $(a) ? a : /* @__PURE__ */ i("img", { src: r, className: "wrapper__image" }),
-      /* @__PURE__ */ i("div", { className: "wrapper__content", children: /* @__PURE__ */ i("div", { className: "wrapper__title", children: t }) })
+), A = o(
+  ({ image: r, imageComponent: i, title: t, onSelectCard: p = () => {
+  } }, f) => {
+    const { theme: c } = W();
+    return /* @__PURE__ */ m(j, { theme: c, onClick: p, children: [
+      N(i) ? i : /* @__PURE__ */ a("img", { src: r, className: "wrapper__image" }),
+      /* @__PURE__ */ a("div", { className: "wrapper__content", children: /* @__PURE__ */ a("div", { className: "wrapper__title", children: t }) })
     ] });
   }
-), A = l(({}, r) => /* @__PURE__ */ i(j, {})), E = p.div`
+), E = o(({}, r) => /* @__PURE__ */ a(G, {})), F = s.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -229,66 +229,68 @@ const W = p.div`
       gap: 1rem;
     }
   }
-`, X = l(
+`, Z = o(
   ({
     title: r,
-    subtitle: a,
-    tags: t = [],
-    limitTags: s = 7,
-    limitTagsForMobile: g = 2,
+    subtitle: i,
+    options: t = [],
+    limitTags: p = 7,
+    limitTagsForMobile: f = 2,
     limit: c = 3,
     limitForMobile: v = 3,
     items: n = [],
     onSelectTag: h = () => {
     },
-    onSelectCard: w = () => {
-    }
-  }, y) => {
+    onSelectCard: g = () => {
+    },
+    isLoading: y
+  }, k) => {
     var x, u;
-    const f = (e) => {
+    const w = (e) => {
       h == null || h(e == null ? void 0 : e.uuid);
     }, _ = (e) => {
-      w == null || w(e == null ? void 0 : e.uuid);
+      g == null || g(e == null ? void 0 : e.uuid);
     };
     return /* @__PURE__ */ m(
-      E,
+      F,
       {
-        ref: y,
-        limitTags: s,
-        limitTagsForMobile: g,
+        ref: k,
+        limitTags: p,
+        limitTagsForMobile: f,
         limitCards: c,
         limitCardsForMobile: v,
         children: [
           /* @__PURE__ */ m("div", { className: "wrapper__heading", children: [
-            r && /* @__PURE__ */ i("div", { className: "wrapper__title", children: r }),
-            a && /* @__PURE__ */ i("div", { className: "wrapper__subtitle", children: a })
+            r && /* @__PURE__ */ a("div", { className: "wrapper__title", children: r }),
+            i && /* @__PURE__ */ a("div", { className: "wrapper__subtitle", children: i })
           ] }),
-          /* @__PURE__ */ i("div", { className: "wrapper__cards", children: n && (n == null ? void 0 : n.length) > 0 ? n == null ? void 0 : n.map((e, o) => /* @__PURE__ */ i(
-            M,
+          /* @__PURE__ */ a("div", { className: "wrapper__cards", children: n && (n == null ? void 0 : n.length) > 0 ? n == null ? void 0 : n.map((e, l) => /* @__PURE__ */ a(
+            A,
             {
               image: e == null ? void 0 : e.image,
               imageComponent: e == null ? void 0 : e.imageComponent,
               title: e == null ? void 0 : e.title,
               onSelectCard: () => _ == null ? void 0 : _(e == null ? void 0 : e.uuid)
             },
-            `general-with-tags-card__${o + 1}`
-          )) : (x = Array.from("123")) == null ? void 0 : x.map((e, o) => /* @__PURE__ */ i(
-            A,
+            `general-with-tags-card__${l + 1}`
+          )) : (x = Array.from("123")) == null ? void 0 : x.map((e, l) => /* @__PURE__ */ a(
+            E,
             {},
-            `general-with-tags-card-skeleton__${o + 1}`
+            `general-with-tags-card-skeleton__${l + 1}`
           )) }),
-          /* @__PURE__ */ i("div", { className: "wrapper__tags", children: t && (t == null ? void 0 : t.length) > 0 ? t == null ? void 0 : t.map((e, o) => /* @__PURE__ */ i(
-            I,
+          (t == null ? void 0 : t.length) > 0 && /* @__PURE__ */ a("div", { className: "wrapper__tags", children: t == null ? void 0 : t.map((e, l) => /* @__PURE__ */ a(
+            M,
             {
               icon: e == null ? void 0 : e.icon,
               text: e == null ? void 0 : e.text,
-              onSelectCard: () => f == null ? void 0 : f(e)
+              onSelectCard: () => w == null ? void 0 : w(e)
             },
-            `general-with-tags-card-tag__${o + 1}`
-          )) : (u = Array.from("123")) == null ? void 0 : u.map((e, o) => /* @__PURE__ */ i(
-            T,
+            `general-with-tags-card-tag__${l + 1}`
+          )) }),
+          y === !0 && !((t == null ? void 0 : t.length) > 0) && /* @__PURE__ */ a("div", { className: "wrapper__tags", children: (u = Array.from("123")) == null ? void 0 : u.map((e, l) => /* @__PURE__ */ a(
+            I,
             {},
-            `general-with-tags-card-tag-skeleton__${o + 1}`
+            `general-with-tags-card-tag-skeleton__${l + 1}`
           )) })
         ]
       }
@@ -296,5 +298,5 @@ const W = p.div`
   }
 );
 export {
-  X as default
+  Z as default
 };

package/dist/GiftCardsSection.cjs

@@ -61,7 +61,7 @@
     font-weight: 600;
     font-size: 0.875rem;
     position: absolute;
-    left: -5.5rem;
+    left: -4.5rem;
     top: 1rem;
 
     -moz-transform: rotate(315deg);

package/dist/GiftCardsSection.js

@@ -69,7 +69,7 @@ const T = d.div`
     font-weight: 600;
     font-size: 0.875rem;
     position: absolute;
-    left: -5.5rem;
+    left: -4.5rem;
     top: 1rem;
 
     -moz-transform: rotate(315deg);

package/dist/MasonryGeneralCardsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const r=require("react/jsx-runtime"),m=require("react"),x=require("./Button.cjs"),d=require("./emotion-styled.browser.esm-BtEseadx.cjs"),i=require("./utils-NZLCh-J5.cjs"),h=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),g=require("./consts-CtNoHdBj.cjs"),f=d.styled.div`
+"use strict";const r=require("react/jsx-runtime"),g=require("react"),f=require("./Button.cjs"),c=require("./emotion-styled.browser.esm-BtEseadx.cjs"),i=require("./utils-NZLCh-J5.cjs"),u=require("./emotion-element-f0de968e.browser.esm-B7k6i6lC.cjs"),p=require("./consts-CtNoHdBj.cjs"),_=c.styled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -114,7 +114,7 @@
       }
     }
   }
-`,u=m.forwardRef(({title:t,image:e,description:a,actionText:o,onSelectCard:l=()=>{},className:n,position:s,tag:c},v)=>{const p=h.useTheme();return r.jsx(r.Fragment,{children:r.jsxs(f,{theme:p,className:n,onClick:l,position:s,children:[r.jsx("img",{src:e,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__text",children:[c&&r.jsx("div",{className:"text__tag",children:c}),r.jsx("div",{className:"text__title",children:t}),i.isDefinedNotEmptyString(a)&&r.jsx("div",{className:"text__description",children:a}),i.isDefinedNotEmptyString(o)&&r.jsx(x,{text:o,onClick:l,className:"text__action"})]})]})})}),_=d.styled.div`
+`,w=g.forwardRef(({title:t,image:e,description:n,buttonText:a,onSelectCard:l=()=>{},className:o,position:s,selectAction:d,tag:m},x)=>{const h=u.useTheme();return r.jsx(r.Fragment,{children:r.jsxs(_,{ref:x,theme:h,className:o,onClick:l,position:s,children:[r.jsx("img",{src:e,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__text",children:[m&&r.jsx("div",{className:"text__tag",children:m}),r.jsx("div",{className:"text__title",children:t}),i.isDefinedNotEmptyString(n)&&r.jsx("div",{className:"text__description",children:n}),i.isDefinedNotEmptyString(a)&&r.jsx(f,{text:a,onClick:()=>l(d),className:"text__action"})]})]})})}),b=c.styled.div`
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
@@ -138,7 +138,7 @@
     }
   }
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${p.MOBILE_SIZE_PX+"px"}) {
     gap: 1.25rem;
 
     & .regular-title {
@@ -149,16 +149,17 @@
       }
     }
   }
-`,w=d.styled.div`
+`,v=c.styled.div`
   display: grid;
-  grid-template-columns: repeat(12, 1fr);
+  grid-template-columns: ${t=>"repeat(12,  minmax(0, 1fr))"};
+
   grid-template-rows: 15rem 15rem;
   grid-column-gap: 1.25rem;
   grid-row-gap: 1.25rem;
   height: 30rem;
   max-height: 30rem;
 
-  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${p.MOBILE_SIZE_PX+"px"}) {
     display: flex;
     flex-direction: column;
     gap: 1rem;
@@ -167,4 +168,4 @@
     max-height: 100%;
     padding: 0 1rem;
   }
-`,b=m.forwardRef(({title:t,items:e,limit:a=3,onSelectCard:o=()=>{}},l)=>r.jsxs(_,{children:[r.jsx("div",{className:"regular-title",children:r.jsx("div",{className:"regular-title-text",children:r.jsx("span",{children:t})})}),r.jsx(w,{limit:a,children:e&&(e==null?void 0:e.map((n,s)=>r.jsx(u,{...n,onSelectCard:()=>o(n==null?void 0:n.uuid)},`landing-page-masonry-general-card__${s+1}`)))})]}));module.exports=b;
+`,y=g.forwardRef(({title:t,items:e,limit:n=3,onSelectCard:a=()=>{}},l)=>r.jsxs(b,{children:[r.jsx("div",{className:"regular-title",children:r.jsx("div",{className:"regular-title-text",children:r.jsx("span",{children:t})})}),r.jsx(v,{limit:n,children:e&&(e==null?void 0:e.map((o,s)=>r.jsx(w,{...o,onSelectCard:d=>a(d,o)},`landing-page-masonry-general-card__${s+1}`)))})]}));module.exports=y;

package/dist/MasonryGeneralCardsSection.js

@@ -1,11 +1,11 @@
-import { jsx as t, Fragment as u, jsxs as m } from "react/jsx-runtime";
+import { jsx as t, Fragment as w, jsxs as s } from "react/jsx-runtime";
 import { forwardRef as f } from "react";
-import _ from "./Button.js";
-import { s } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { m as n, t as g, k as p } from "./utils-DtRLzzTZ.js";
-import { u as w } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
-import { M as h } from "./consts-C1uHV4xc.js";
-const b = s.div`
+import b from "./Button.js";
+import { s as c } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { m as n, t as p, k as h } from "./utils-DtRLzzTZ.js";
+import { u as v } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
+import { M as x } from "./consts-C1uHV4xc.js";
+const y = c.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -70,7 +70,7 @@ const b = s.div`
       font-style: normal;
       font-weight: 500;
       line-height: 1.5rem;
-      ${g(2)}
+      ${p(2)}
     }
 
     & .text__tag {
@@ -92,7 +92,7 @@ const b = s.div`
       font-style: normal;
       font-weight: 400;
       line-height: 1.25rem;
-      ${g(2)}
+      ${p(2)}
     }
 
     & .text__action {
@@ -133,37 +133,39 @@ const b = s.div`
       }
     }
   }
-`, v = f(
+`, k = f(
   ({
     title: r,
     image: e,
-    description: a,
-    actionText: o,
+    description: i,
+    buttonText: a,
     onSelectCard: l = () => {
     },
-    className: i,
-    position: d,
-    tag: c
-  }, $) => {
-    const x = w();
-    return /* @__PURE__ */ t(u, { children: /* @__PURE__ */ m(
-      b,
+    className: o,
+    position: m,
+    selectAction: d,
+    tag: g
+  }, u) => {
+    const _ = v();
+    return /* @__PURE__ */ t(w, { children: /* @__PURE__ */ s(
+      y,
       {
-        theme: x,
-        className: i,
+        ref: u,
+        theme: _,
+        className: o,
         onClick: l,
-        position: d,
+        position: m,
         children: [
           /* @__PURE__ */ t("img", { src: e, className: "wrapper__image" }),
-          /* @__PURE__ */ m("div", { className: "wrapper__text", children: [
-            c && /* @__PURE__ */ t("div", { className: "text__tag", children: c }),
+          /* @__PURE__ */ s("div", { className: "wrapper__text", children: [
+            g && /* @__PURE__ */ t("div", { className: "text__tag", children: g }),
             /* @__PURE__ */ t("div", { className: "text__title", children: r }),
-            p(a) && /* @__PURE__ */ t("div", { className: "text__description", children: a }),
-            p(o) && /* @__PURE__ */ t(
-              _,
+            h(i) && /* @__PURE__ */ t("div", { className: "text__description", children: i }),
+            h(a) && /* @__PURE__ */ t(
+              b,
               {
-                text: o,
-                onClick: l,
+                text: a,
+                onClick: () => l(d),
                 className: "text__action"
               }
             )
@@ -172,7 +174,7 @@ const b = s.div`
       }
     ) });
   }
-), y = s.div`
+), $ = c.div`
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
@@ -196,7 +198,7 @@ const b = s.div`
     }
   }
 
-  @media (max-width: ${h + "px"}) {
+  @media (max-width: ${x + "px"}) {
     gap: 1.25rem;
 
     & .regular-title {
@@ -207,16 +209,17 @@ const b = s.div`
       }
     }
   }
-`, k = s.div`
+`, N = c.div`
   display: grid;
-  grid-template-columns: repeat(12, 1fr);
+  grid-template-columns: ${(r) => "repeat(12,  minmax(0, 1fr))"};
+
   grid-template-rows: 15rem 15rem;
   grid-column-gap: 1.25rem;
   grid-row-gap: 1.25rem;
   height: 30rem;
   max-height: 30rem;
 
-  @media (max-width: ${h + "px"}) {
+  @media (max-width: ${x + "px"}) {
     display: flex;
     flex-direction: column;
     gap: 1rem;
@@ -225,20 +228,20 @@ const b = s.div`
     max-height: 100%;
     padding: 0 1rem;
   }
-`, M = f(
-  ({ title: r, items: e, limit: a = 3, onSelectCard: o = () => {
-  } }, l) => /* @__PURE__ */ m(y, { children: [
+`, I = f(
+  ({ title: r, items: e, limit: i = 3, onSelectCard: a = () => {
+  } }, l) => /* @__PURE__ */ s($, { children: [
     /* @__PURE__ */ t("div", { className: "regular-title", children: /* @__PURE__ */ t("div", { className: "regular-title-text", children: /* @__PURE__ */ t("span", { children: r }) }) }),
-    /* @__PURE__ */ t(k, { limit: a, children: e && (e == null ? void 0 : e.map((i, d) => /* @__PURE__ */ t(
-      v,
+    /* @__PURE__ */ t(N, { limit: i, children: e && (e == null ? void 0 : e.map((o, m) => /* @__PURE__ */ t(
+      k,
       {
-        ...i,
-        onSelectCard: () => o(i == null ? void 0 : i.uuid)
+        ...o,
+        onSelectCard: (d) => a(d, o)
       },
-      `landing-page-masonry-general-card__${d + 1}`
+      `landing-page-masonry-general-card__${m + 1}`
     ))) })
   ] })
 );
 export {
-  M as default
+  I as default
 };

package/dist/OverlayGeneralCardsSection.cjs

@@ -1,21 +1,21 @@
-"use strict";const e=require("react/jsx-runtime"),c=require("react"),x=require("./emotion-styled.browser.esm-BtEseadx.cjs"),u=require("./consts-CtNoHdBj.cjs"),p=require("./style-C571ywKV.cjs"),d=require("./utils-NZLCh-J5.cjs"),f=require("./Button.cjs"),m=require("./ThemeProvider.cjs"),j=x.styled.div`
+"use strict";const e=require("react/jsx-runtime"),l=require("react"),x=require("./emotion-styled.browser.esm-BtEseadx.cjs"),g=require("./consts-CtNoHdBj.cjs"),f=require("./style-C571ywKV.cjs"),u=require("./utils-NZLCh-J5.cjs"),j=require("./Button.cjs"),v=require("./ThemeProvider.cjs"),y=x.styled.div`
   display: grid;
-  grid-template-columns: ${t=>`repeat(${t.limit}, 1fr)`};
+  grid-template-columns: ${n=>`repeat(${n.limit}, 1fr)`};
   gap: 1.25rem;
   justify-items: center;
 
-  @media (max-width: ${u.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
     display: flex;
     flex-direction: column;
     gap: 1rem;
   }
-`,g=x.styled.div`
+`,h=x.styled.div`
   width: 100%;
   overflow: hidden;
   position: relative;
 
   border-radius: 0.75rem;
-  background: ${t=>t==null?void 0:t.overlay};
+  background: ${n=>n==null?void 0:n.overlay};
   cursor: pointer;
 
   & .content-wrapper {
@@ -50,7 +50,7 @@
 
     & .content-text-title {
       font-weight: 600;
-      ${d.truncateTextInRows(2)}
+      ${u.truncateTextInRows(2)}
     }
   }
 
@@ -62,7 +62,7 @@
   }
 
   & .img-skeleton {
-    background-color: ${d.linearGradientAnimation("-90deg")};
+    background-color: ${u.linearGradientAnimation("-90deg")};
     min-height: 28.75rem;
   }
 
@@ -72,7 +72,7 @@
     }
   }
 
-  @media (max-width: ${u.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
     & img,
     .img.skeleton {
       aspect-ratio: unset;
@@ -80,4 +80,4 @@
       max-height: 28.75rem;
     }
   }
-`,v=c.forwardRef(({},t)=>e.jsx(g,{ref:t,children:e.jsx("div",{className:"img-skeleton"})})),y=({limit:t=2,isLoading:n=!1,keyPrefix:o})=>e.jsx(e.Fragment,{children:Array.from({length:t},(a,s)=>e.jsx(v,{isLoading:n},`${o}-skeleton-product-card-${s}`))}),w=({children:t,fallbackComponent:n=e.jsx(e.Fragment,{}),isLoading:o=!1,limit:a,keyPrefix:s})=>e.jsx(c.Suspense,{fallbackComponent:n,children:o===!0?e.jsx(y,{isLoading:o,limit:a,keyPrefix:s}):t}),k=c.forwardRef(({title:t,image:n,overlay:o,description:a,actionText:s,handleClick:i=()=>{}},l)=>{const{theme:r}=m.useTheme();return e.jsx(e.Fragment,{children:e.jsxs(g,{ref:l,theme:r,overlay:o,onClick:i,children:[e.jsx("img",{src:n}),e.jsxs("div",{className:"content-wrapper",children:[e.jsxs("div",{className:"content-text",children:[e.jsx("div",{children:t}),e.jsx("div",{className:"content-text-title",children:a})]}),e.jsx(f,{text:s,onClick:i,className:"text__action",size:"medium",color:"gray"})]})]})})}),_=c.memo(k),b=c.forwardRef(({title:t,items:n,limit:o=2,onSelectCard:a=()=>{},isLoading:s=!1},i)=>{const l=c.useMemo(()=>e.jsx(e.Fragment,{children:n&&(n==null?void 0:n.map((r,h)=>e.jsx(_,{title:r==null?void 0:r.title,image:r==null?void 0:r.image,description:r==null?void 0:r.description,actionText:r==null?void 0:r.actionText,overlay:r==null?void 0:r.overlay,handleClick:()=>a(r==null?void 0:r.uuid)},`landing-page-overlay-general-card__${h+1}`)))}),[n,a]);return e.jsxs(p.RegulatTitleSectionWrapper,{ref:i,children:[e.jsx("div",{className:"regular-title center",children:e.jsx("div",{className:"regular-title-text",children:e.jsx("span",{children:t})})}),e.jsx(j,{limit:o,children:e.jsx(w,{isLoading:s,limit:o,keyPrefix:"explore-landing",children:l})})]})});module.exports=b;
+`,m=l.forwardRef(({},n)=>e.jsx(h,{ref:n,children:e.jsx("div",{className:"img-skeleton"})})),w=({limit:n=2,isLoading:t=!1,keyPrefix:o})=>e.jsx(e.Fragment,{children:Array.from({length:n},(a,s)=>e.jsx(m,{isLoading:t},`${o}-skeleton-product-card-${s}`))}),k=({children:n,fallbackComponent:t=e.jsx(e.Fragment,{}),isLoading:o=!1,limit:a,keyPrefix:s})=>e.jsx(l.Suspense,{fallbackComponent:t,children:o===!0?e.jsx(w,{isLoading:o,limit:a,keyPrefix:s}):n}),b=l.forwardRef(({title:n,image:t,backgroundColor:o,description:a,buttonText:s,handleClick:c=()=>{},onButtonAction:i=()=>{}},d)=>{const{theme:r}=v.useTheme();return e.jsx(e.Fragment,{children:e.jsxs(h,{ref:d,theme:r,overlay:o,onClick:c,children:[e.jsx("img",{src:t}),e.jsxs("div",{className:"content-wrapper",children:[e.jsxs("div",{className:"content-text",children:[e.jsx("div",{children:n}),e.jsx("div",{className:"content-text-title",children:a})]}),u.isDefinedNotEmptyString(s)&&e.jsx(j,{text:s,onClick:i,className:"text__action",size:"medium",color:"gray"})]})]})})}),_=l.memo(b),$=l.forwardRef(({title:n,items:t,limit:o=2,onSelectCard:a=()=>{},isLoading:s=!1,onButtonAction:c=()=>{}},i)=>{const d=l.useMemo(()=>e.jsx(e.Fragment,{children:t&&(t==null?void 0:t.map((r,p)=>e.jsx(_,{title:r==null?void 0:r.title,image:r==null?void 0:r.imageUrl,description:r==null?void 0:r.description,buttonText:r==null?void 0:r.buttonText,backgroundColor:r==null?void 0:r.backgroundColor,handleClick:()=>a(r==null?void 0:r.selectAction,r),onButtonAction:()=>c(r==null?void 0:r.buttonLink,r)},`landing-page-overlay-general-card__${p+1}`)))}),[t,a]);return e.jsxs(f.RegulatTitleSectionWrapper,{ref:i,children:[e.jsx("div",{className:"regular-title center",children:e.jsx("div",{className:"regular-title-text",children:e.jsx("span",{children:n})})}),e.jsx(y,{limit:o,children:e.jsx(k,{isLoading:s,limit:o,keyPrefix:"explore-landing",children:d})})]})});module.exports=$;

package/dist/OverlayGeneralCardsSection.js

@@ -1,29 +1,29 @@
-import { jsx as r, Fragment as d, jsxs as c } from "react/jsx-runtime";
-import { forwardRef as p, Suspense as f, memo as x, useMemo as v } from "react";
-import { s as g } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as h } from "./consts-C1uHV4xc.js";
-import { R as y } from "./style-CsMpu4iC.js";
-import { t as w, m as k } from "./utils-DtRLzzTZ.js";
-import $ from "./Button.js";
-import { useTheme as b } from "./ThemeProvider.js";
-const N = g.div`
+import { jsx as r, Fragment as i, jsxs as c } from "react/jsx-runtime";
+import { forwardRef as g, Suspense as x, memo as v, useMemo as y } from "react";
+import { s as h } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as u } from "./consts-C1uHV4xc.js";
+import { R as k } from "./style-CsMpu4iC.js";
+import { t as w, m as b, k as $ } from "./utils-DtRLzzTZ.js";
+import C from "./Button.js";
+import { useTheme as N } from "./ThemeProvider.js";
+const P = h.div`
   display: grid;
-  grid-template-columns: ${(t) => `repeat(${t.limit}, 1fr)`};
+  grid-template-columns: ${(n) => `repeat(${n.limit}, 1fr)`};
   gap: 1.25rem;
   justify-items: center;
 
-  @media (max-width: ${h + "px"}) {
+  @media (max-width: ${u + "px"}) {
     display: flex;
     flex-direction: column;
     gap: 1rem;
   }
-`, m = g.div`
+`, f = h.div`
   width: 100%;
   overflow: hidden;
   position: relative;
 
   border-radius: 0.75rem;
-  background: ${(t) => t == null ? void 0 : t.overlay};
+  background: ${(n) => n == null ? void 0 : n.overlay};
   cursor: pointer;
 
   & .content-wrapper {
@@ -70,7 +70,7 @@ const N = g.div`
   }
 
   & .img-skeleton {
-    background-color: ${k("-90deg")};
+    background-color: ${b("-90deg")};
     min-height: 28.75rem;
   }
 
@@ -80,7 +80,7 @@ const N = g.div`
     }
   }
 
-  @media (max-width: ${h + "px"}) {
+  @media (max-width: ${u + "px"}) {
     & img,
     .img.skeleton {
       aspect-ratio: unset;
@@ -88,48 +88,57 @@ const N = g.div`
       max-height: 28.75rem;
     }
   }
-`, P = p(({}, t) => /* @__PURE__ */ r(m, { ref: t, children: /* @__PURE__ */ r("div", { className: "img-skeleton" }) })), _ = ({ limit: t = 2, isLoading: n = !1, keyPrefix: o }) => /* @__PURE__ */ r(d, { children: Array.from({ length: t }, (a, l) => /* @__PURE__ */ r(
-  P,
+`, S = g(({}, n) => /* @__PURE__ */ r(f, { ref: n, children: /* @__PURE__ */ r("div", { className: "img-skeleton" }) })), _ = ({ limit: n = 2, isLoading: o = !1, keyPrefix: t }) => /* @__PURE__ */ r(i, { children: Array.from({ length: n }, (l, a) => /* @__PURE__ */ r(
+  S,
   {
-    isLoading: n
+    isLoading: o
   },
-  `${o}-skeleton-product-card-${l}`
-)) }), C = ({
-  children: t,
-  fallbackComponent: n = /* @__PURE__ */ r(d, {}),
-  isLoading: o = !1,
-  limit: a,
-  keyPrefix: l
-}) => /* @__PURE__ */ r(f, { fallbackComponent: n, children: o === !0 ? /* @__PURE__ */ r(
+  `${t}-skeleton-product-card-${a}`
+)) }), j = ({
+  children: n,
+  fallbackComponent: o = /* @__PURE__ */ r(i, {}),
+  isLoading: t = !1,
+  limit: l,
+  keyPrefix: a
+}) => /* @__PURE__ */ r(x, { fallbackComponent: o, children: t === !0 ? /* @__PURE__ */ r(
   _,
   {
-    isLoading: o,
-    limit: a,
-    keyPrefix: l
+    isLoading: t,
+    limit: l,
+    keyPrefix: a
   }
-) : t }), S = p(
-  ({ title: t, image: n, overlay: o, description: a, actionText: l, handleClick: i = () => {
-  } }, s) => {
-    const { theme: e } = b();
-    return /* @__PURE__ */ r(d, { children: /* @__PURE__ */ c(
-      m,
+) : n }), G = g(
+  ({
+    title: n,
+    image: o,
+    backgroundColor: t,
+    description: l,
+    buttonText: a,
+    handleClick: d = () => {
+    },
+    onButtonAction: s = () => {
+    }
+  }, p) => {
+    const { theme: e } = N();
+    return /* @__PURE__ */ r(i, { children: /* @__PURE__ */ c(
+      f,
       {
-        ref: s,
+        ref: p,
         theme: e,
-        overlay: o,
-        onClick: i,
+        overlay: t,
+        onClick: d,
         children: [
-          /* @__PURE__ */ r("img", { src: n }),
+          /* @__PURE__ */ r("img", { src: o }),
           /* @__PURE__ */ c("div", { className: "content-wrapper", children: [
             /* @__PURE__ */ c("div", { className: "content-text", children: [
-              /* @__PURE__ */ r("div", { children: t }),
-              /* @__PURE__ */ r("div", { className: "content-text-title", children: a })
+              /* @__PURE__ */ r("div", { children: n }),
+              /* @__PURE__ */ r("div", { className: "content-text-title", children: l })
             ] }),
-            /* @__PURE__ */ r(
-              $,
+            $(a) && /* @__PURE__ */ r(
+              C,
               {
-                text: l,
-                onClick: i,
+                text: a,
+                onClick: s,
                 className: "text__action",
                 size: "medium",
                 color: "gray"
@@ -140,35 +149,37 @@ const N = g.div`
       }
     ) });
   }
-), j = x(S), A = p(
-  ({ title: t, items: n, limit: o = 2, onSelectCard: a = () => {
-  }, isLoading: l = !1 }, i) => {
-    const s = v(() => /* @__PURE__ */ r(d, { children: n && (n == null ? void 0 : n.map((e, u) => /* @__PURE__ */ r(
-      j,
+), O = v(G), L = g(
+  ({ title: n, items: o, limit: t = 2, onSelectCard: l = () => {
+  }, isLoading: a = !1, onButtonAction: d = () => {
+  } }, s) => {
+    const p = y(() => /* @__PURE__ */ r(i, { children: o && (o == null ? void 0 : o.map((e, m) => /* @__PURE__ */ r(
+      O,
       {
         title: e == null ? void 0 : e.title,
-        image: e == null ? void 0 : e.image,
+        image: e == null ? void 0 : e.imageUrl,
         description: e == null ? void 0 : e.description,
-        actionText: e == null ? void 0 : e.actionText,
-        overlay: e == null ? void 0 : e.overlay,
-        handleClick: () => a(e == null ? void 0 : e.uuid)
+        buttonText: e == null ? void 0 : e.buttonText,
+        backgroundColor: e == null ? void 0 : e.backgroundColor,
+        handleClick: () => l(e == null ? void 0 : e.selectAction, e),
+        onButtonAction: () => d(e == null ? void 0 : e.buttonLink, e)
       },
-      `landing-page-overlay-general-card__${u + 1}`
-    ))) }), [n, a]);
-    return /* @__PURE__ */ c(y, { ref: i, children: [
-      /* @__PURE__ */ r("div", { className: "regular-title center", children: /* @__PURE__ */ r("div", { className: "regular-title-text", children: /* @__PURE__ */ r("span", { children: t }) }) }),
-      /* @__PURE__ */ r(N, { limit: o, children: /* @__PURE__ */ r(
-        C,
+      `landing-page-overlay-general-card__${m + 1}`
+    ))) }), [o, l]);
+    return /* @__PURE__ */ c(k, { ref: s, children: [
+      /* @__PURE__ */ r("div", { className: "regular-title center", children: /* @__PURE__ */ r("div", { className: "regular-title-text", children: /* @__PURE__ */ r("span", { children: n }) }) }),
+      /* @__PURE__ */ r(P, { limit: t, children: /* @__PURE__ */ r(
+        j,
         {
-          isLoading: l,
-          limit: o,
+          isLoading: a,
+          limit: t,
           keyPrefix: "explore-landing",
-          children: s
+          children: p
         }
       ) })
     ] });
   }
 );
 export {
-  A as default
+  L as default
 };

package/package.json

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