@lanaco/lnc-react-ui 4.0.39 → 4.0.40

package/dist/SalesCampaignsSection.js

@@ -1,7 +1,7 @@
 import { jsx as t, jsxs as p, Fragment as G } from "react/jsx-runtime";
-import { createElement as ae, useState as z, useEffect as j, forwardRef as V, useRef as Q, useImperativeHandle as ne, Suspense as se, memo as le, useMemo as ce } from "react";
-import { n as m } from "./emotion-styled.browser.esm-CjCaF13H.js";
-import { a as E, l as X, m as ee } from "./utils-DtRLzzTZ.js";
+import { createElement as ae, useState as P, useEffect as j, forwardRef as V, useRef as Q, useImperativeHandle as ne, Suspense as se, memo as le, useMemo as ce } from "react";
+import { n as f } from "./emotion-styled.browser.esm-CjCaF13H.js";
+import { a as z, l as X, m as ee } from "./utils-DtRLzzTZ.js";
 import { M as T } from "./consts-C1uHV4xc.js";
 import { m as de } from "./motion-Ckekul_K.js";
 import { P as i } from "./index-S5Cd7WrG.js";
@@ -9,16 +9,16 @@ import ge from "./Icon.js";
 import he from "./Badge.js";
 import { u as M } from "./emotion-element-f0de968e.browser.esm-CkCiQliQ.js";
 import { u as re } from "./useDetectMobile-BC6EGaBc.js";
-import me from "./FlexBox.js";
+import fe from "./FlexBox.js";
 import { I as Y } from "./index-wy-PXQR9.js";
 import U from "./IconButton.js";
-const fe = m.div`
+const me = f.div`
   cursor: pointer;
   display: flex;
   gap: 1rem;
   padding: 1.25rem;
-  border-radius: ${(e) => E(e.theme, "slightCurve")};
-  border: 1px solid var(--gray-95080, #14161acc);
+  border-radius: 20px;
+  border: 1px solid var(--gray-95008, #14161a14);
 
   @media (max-width: ${T + "px"}) {
     flex-direction: column;
@@ -27,8 +27,8 @@ const fe = m.div`
     border: none;
     border-radius: 0;
   }
-`, pe = m.div`
-  border-radius: ${(e) => E(e.theme, "edged")};
+`, pe = f.div`
+  border-radius: ${(e) => z(e.theme, "edged")};
   height: 15rem;
   width: 15rem;
   min-width: 15rem;
@@ -56,7 +56,7 @@ const fe = m.div`
     max-width: 100dvh;
     height: 23.438rem;
   }
-`, ue = m.div`
+`, ue = f.div`
   flex: 1;
   display: flex;
   flex-direction: column;
@@ -137,7 +137,7 @@ const fe = m.div`
     ${o ? "" : "flex-wrap: nowrap;"}
     ${e ? "align-items: center;" : ""}
     ${l ? "justify-content: center;" : ""}
-  `, be = m(de.div)`
+  `, be = f(de.div)`
   text-decoration: none;
   ${(e) => e.hasPermission === !0 && "cursor: pointer"};
 
@@ -161,7 +161,7 @@ const fe = m.div`
   font-weight: 500;
   font-size: 0.875rem;
   line-height: 1.25rem;
-  border-radius: ${(e) => E(e.theme, "slight")};
+  border-radius: ${(e) => z(e.theme, "slight")};
   transition: all 0.25s ease;
 
   & .logo-wrapper {
@@ -211,15 +211,15 @@ const fe = m.div`
     background-color: var(--gray-95080, #14161acc);
     color: var(--gray-600, #676e79);
   }
-`, ve = m.div`
+`, xe = f.div`
   position: absolute;
   top: 0.5rem;
   ${(e) => e.alignToLeft === !0 ? "left: 0.5rem;" : "right: 0.5rem;"}
   display: flex;
   gap: 0.25rem;
-`, xe = (e) => `var(--${e}-700)`, ye = m.div`
-  border-radius: ${(e) => E(e.theme, e.borderRadius || "slight")};
-  background-color: ${(e) => xe(e == null ? void 0 : e.color)};
+`, ve = (e) => `var(--${e}-700)`, ye = f.div`
+  border-radius: ${(e) => z(e.theme, e.borderRadius || "slight")};
+  background-color: ${(e) => ve(e == null ? void 0 : e.color)};
   color: white;
   height: 1.5rem;
   min-width: 1.5rem;
@@ -247,11 +247,11 @@ const fe = m.div`
     disabled: s,
     onSelect: d = () => {
     },
-    isActive: x,
-    className: v,
+    isActive: v,
+    className: x,
     // new
-    themeData: f
-  } = e, k = {
+    themeData: m
+  } = e, C = {
     theme: M(),
     color: w,
     size: b,
@@ -264,13 +264,13 @@ const fe = m.div`
       onClick: (r) => {
         r.stopPropagation(), l === !0 && (d == null || d());
       },
-      ...k,
+      ...C,
       key: n,
       animate: {
         y: 0,
         opacity: 1
       },
-      className: `profile-item ${v}`,
+      className: `profile-item ${x}`,
       exit: {
         opacity: 0
       },
@@ -279,8 +279,8 @@ const fe = m.div`
         y: -10,
         opacity: 0
       },
-      isActive: x,
-      themeColor: (f == null ? void 0 : f.code) || "transparent"
+      isActive: v,
+      themeColor: (m == null ? void 0 : m.code) || "transparent"
     },
     /* @__PURE__ */ t("div", { className: "logo-wrapper", children: u }),
     /* @__PURE__ */ t("div", { className: "name", children: n }),
@@ -325,12 +325,12 @@ const J = (e, o) => {
     status: D,
     startDate: s,
     endDate: d,
-    salesPackages: x,
-    shopName: v,
-    shopImage: f,
+    salesPackages: v,
+    shopName: x,
+    shopImage: m,
     onSelectCard: g = () => {
     },
-    onSelectShop: k = () => {
+    onSelectShop: C = () => {
     },
     campaignSingleText: r,
     salesCampaignTypes: $ = [],
@@ -350,7 +350,7 @@ const J = (e, o) => {
     /* @__PURE__ */ new Date()
   );
   return /* @__PURE__ */ p(
-    fe,
+    me,
     {
       theme: o,
       onClick: g,
@@ -358,17 +358,17 @@ const J = (e, o) => {
       children: [
         /* @__PURE__ */ p(pe, { theme: o, onClick: () => b == null ? void 0 : b(), children: [
           /* @__PURE__ */ t("img", { src: w }),
-          /* @__PURE__ */ t(ve, { children: x == null ? void 0 : x.map((I, A) => {
-            var _, L;
+          /* @__PURE__ */ t(xe, { children: v == null ? void 0 : v.map((I, A) => {
+            var E, L;
             return /* @__PURE__ */ t(
               ye,
               {
-                color: (_ = $ == null ? void 0 : $.find((P) => P.value === I)) == null ? void 0 : _.color,
+                color: (E = $ == null ? void 0 : $.find((_) => _.value === I)) == null ? void 0 : E.color,
                 theme: o,
                 children: /* @__PURE__ */ t(
                   ge,
                   {
-                    icon: (L = $ == null ? void 0 : $.find((P) => P.value === I)) == null ? void 0 : L.icon
+                    icon: (L = $ == null ? void 0 : $.find((_) => _.value === I)) == null ? void 0 : L.icon
                   }
                 )
               },
@@ -399,16 +399,16 @@ const J = (e, o) => {
                 /* @__PURE__ */ t(
                   "img",
                   {
-                    src: f,
-                    className: `${f ? "" : "no-image"}`
+                    src: m,
+                    className: `${m ? "" : "no-image"}`
                   }
                 )
               ),
               themeData: H,
               isActive: !0,
               isUser: !1,
-              name: v,
-              onClick: () => k(a)
+              name: x,
+              onClick: () => C(a)
             }
           )
         ] })
@@ -422,7 +422,7 @@ oe.propTypes = {
   dropdown: i.any,
   color: i.string
 };
-const $e = m.div`
+const $e = f.div`
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
@@ -456,7 +456,7 @@ const $e = m.div`
       display: flex;
     }
   }
-`, De = m.div`
+`, De = f.div`
   display: flex;
   align-items: center;
 
@@ -477,7 +477,7 @@ const $e = m.div`
       display: none;
     }
   }
-`, Ce = m.div`
+`, ke = f.div`
   position: relative;
   padding: ${(e) => e.padding};
 
@@ -555,8 +555,8 @@ const $e = m.div`
       right: 0;
     }
   }
-`, ke = (e, o) => {
-  const [l, a] = z({
+`, Ce = (e, o) => {
+  const [l, a] = P({
     trigger: null,
     direction: null
   }), u = (n) => n.touches || n.originalEvent.touches;
@@ -570,14 +570,14 @@ const $e = m.div`
       }, D = (s) => {
         if (!c || !w)
           return;
-        const d = s.touches[0].clientX, x = s.touches[0].clientY, v = c - d, f = w - x;
-        Math.abs(v) > Math.abs(f) ? v > 0 ? a((g) => ({
+        const d = s.touches[0].clientX, v = s.touches[0].clientY, x = c - d, m = w - v;
+        Math.abs(x) > Math.abs(m) ? x > 0 ? a((g) => ({
           trigger: !g.trigger,
           direction: F.LEFT
         })) : a((g) => ({
           trigger: !g.trigger,
           direction: F.RIGHT
-        })) : f > 0 ? a((g) => ({
+        })) : m > 0 ? a((g) => ({
           trigger: !g.trigger,
           direction: F.UP
         })) : a((g) => ({
@@ -609,30 +609,30 @@ const $e = m.div`
     rightAlignArrows: D = !1,
     padding: s = "0",
     showTimesBtn: d,
-    noArrows: x,
-    onShowEnd: v,
-    arrowsZIndex: f,
+    noArrows: v,
+    onShowEnd: x,
+    arrowsZIndex: m,
     ...g
-  }, k) => {
-    const r = re(), $ = M(), [S, B] = z(!1), [N, R] = z(!1), [H, W] = z(!0), h = Q(), y = ke(h);
+  }, C) => {
+    const r = re(), $ = M(), [S, B] = P(!1), [N, R] = P(!1), [H, W] = P(!0), h = Q(), y = Ce(h);
     j(() => {
       (y == null ? void 0 : y.direction) === F.RIGHT && N !== !0 ? A() : (y == null ? void 0 : y.direction) === F.LEFT && S !== !0 && I();
     }, [y]);
     const I = () => {
-      var C;
-      (C = h.current) == null || C.scrollBy(a, 0);
+      var k;
+      (k = h.current) == null || k.scrollBy(a, 0);
     }, A = () => {
-      var C;
-      (C = h.current) == null || C.scrollBy(-a, 0);
-    }, [_, L] = z(!1);
+      var k;
+      (k = h.current) == null || k.scrollBy(-a, 0);
+    }, [E, L] = P(!1);
     j(() => {
-      var C, Z;
+      var k, Z;
       L(
-        ((C = h == null ? void 0 : h.current) == null ? void 0 : C.scrollWidth) > ((Z = h == null ? void 0 : h.current) == null ? void 0 : Z.clientWidth)
+        ((k = h == null ? void 0 : h.current) == null ? void 0 : k.scrollWidth) > ((Z = h == null ? void 0 : h.current) == null ? void 0 : Z.clientWidth)
       );
     }, [c]), ne(w, () => ({
       scrollToEnd() {
-        P();
+        _();
       },
       scrollLeft() {
         A();
@@ -641,10 +641,10 @@ const $e = m.div`
         I();
       }
     }));
-    const P = () => {
+    const _ = () => {
       h.current.scrollLeft = h.current.scrollWidth;
     };
-    return /* @__PURE__ */ p($e, { arrowsZIndex: f, children: [
+    return /* @__PURE__ */ p($e, { arrowsZIndex: m, children: [
       /* @__PURE__ */ p(De, { children: [
         /* @__PURE__ */ t("div", { children: e }),
         /* @__PURE__ */ p("div", { className: "btns-group", children: [
@@ -699,19 +699,19 @@ const $e = m.div`
         }
       ),
       /* @__PURE__ */ t(
-        Ce,
+        ke,
         {
-          ref: k,
+          ref: C,
           arrowsVisibleOnHover: b,
-          hasOverflow: _,
-          noArrows: x,
+          hasOverflow: E,
+          noArrows: v,
           padding: s,
           rightAlignArrows: D,
           showTimesBtn: d,
           theme: $,
           ...g,
           children: /* @__PURE__ */ p(
-            me,
+            fe,
             {
               ref: h,
               className: "scrollable-container",
@@ -740,11 +740,11 @@ const $e = m.div`
                       S === !0 && B(!1), W(!0);
                     },
                     onIsVisible: () => {
-                      S === !1 && B(!0), W(!1), v == null || v();
+                      S === !1 && B(!0), W(!1), x == null || x();
                     }
                   }
                 ),
-                H && _ && /* @__PURE__ */ t("div", { className: "gradient" })
+                H && E && /* @__PURE__ */ t("div", { className: "gradient" })
               ]
             }
           )
@@ -765,7 +765,7 @@ ie.propTypes = {
   rightAlignArrows: i.bool,
   padding: i.string
 };
-const Se = m.div`
+const Se = f.div`
   display: flex;
   flex-direction: column;
   gap: 1.5rem;
@@ -795,19 +795,19 @@ const Se = m.div`
       margin-right: 0;
     }
   }
-`, O = m.div`
+`, O = f.div`
   width: ${(e) => e.width || "100%"};
   height: ${(e) => (e.heightCoeff || 1) * 1.125}rem;
   background-color: var(--gray-200, #dddfe4);
 
   ${ee("-90deg")}
-`, Ne = m.div`
+`, Ne = f.div`
   display: flex;
   flex-direction: ${(e) => e != null && e.row ? "row" : "column"};
   gap: ${(e) => (e == null ? void 0 : e.gap) ?? "0.5rem"};
   width: ${(e) => (e == null ? void 0 : e.width) ?? "100%"};
-`, K = m.div`
-  border-radius: ${(e) => E(e.theme, (e == null ? void 0 : e.borderRadius) ?? "regular")};
+`, K = f.div`
+  border-radius: ${(e) => z(e.theme, (e == null ? void 0 : e.borderRadius) ?? "regular")};
   background: var(--gray-200, #dddfe4);
   position: relative;
   max-height: ${(e) => (e == null ? void 0 : e.height) ?? "5rem"};
@@ -817,9 +817,9 @@ const Se = m.div`
   flex-shrink: 0;
 
   ${ee()}
-`, Ie = m.div`
+`, Ie = f.div`
   background: var(--white, #fff);
-  border-radius: ${(e) => E(e.theme, "edged")};
+  border-radius:  ${(e) => z(e.theme, "edged")};
   box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1), 0px 1px 2px rgba(0, 0, 0, 0.06);
   border: 1px solid var(--gray-95012, #14161a1f);
 
@@ -904,9 +904,9 @@ const Se = m.div`
     startsInPrefixTextPlural: D,
     startsinSuffixTextPlural: s,
     startsInPrefixTextSingular: d,
-    startsinSuffixTextSingular: x
-  }, v) => {
-    const f = Q(), g = re(), k = ce(() => o == null ? void 0 : o.map((r, $) => /* @__PURE__ */ t(
+    startsinSuffixTextSingular: v
+  }, x) => {
+    const m = Q(), g = re(), C = ce(() => o == null ? void 0 : o.map((r, $) => /* @__PURE__ */ t(
       Ee,
       {
         className: "campaign-item",
@@ -928,17 +928,17 @@ const Se = m.div`
         startsInPrefixTextPlural: D,
         startsinSuffixTextPlural: s,
         startsInPrefixTextSingular: d,
-        startsinSuffixTextSingular: x,
+        startsinSuffixTextSingular: v,
         themeData: r == null ? void 0 : r.themeData
       },
       `campaign__item__${$}__${r == null ? void 0 : r.startDate}___${r == null ? void 0 : r.endDate}`
     )), [o]);
-    return /* @__PURE__ */ t(G, { children: (o == null ? void 0 : o.length) > 0 && /* @__PURE__ */ t(Se, { ref: v, className: "row-section-scroll", children: /* @__PURE__ */ t(
+    return /* @__PURE__ */ t(G, { children: (o == null ? void 0 : o.length) > 0 && /* @__PURE__ */ t(Se, { ref: x, className: "row-section-scroll", children: /* @__PURE__ */ t(
       ie,
       {
         arrowsVisibleOnHover: !1,
         columnGap: "0",
-        methodsRef: f,
+        methodsRef: m,
         mobileHoverScrollButtons: !0,
         noArrows: !0,
         padding: "0.25rem 0",
@@ -955,7 +955,7 @@ const Se = m.div`
             isLoading: a,
             itemsCount: 2,
             keyPrefix: "sales-camp",
-            children: k
+            children: C
           }
         )
       }

package/dist/ShopCardsSection.cjs

@@ -1,10 +1,11 @@
-"use strict";const r=require("react/jsx-runtime"),_=require("react"),w=require("./Button.cjs"),v=require("./Icon.cjs"),p=require("./utils-NZLCh-J5.cjs"),d=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),u=require("./consts-CtNoHdBj.cjs"),b=d.newStyled.div`
+"use strict";const e=require("react/jsx-runtime"),g=require("react"),f=require("./Button.cjs"),v=require("./Icon.cjs"),l=require("./utils-NZLCh-J5.cjs"),h=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),y=require("./consts-CtNoHdBj.cjs"),j=h.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
   border-radius: 1.25rem;
   border: 1px solid var(--neutral-9508, rgba(20, 22, 26, 0.08));
   background: var(--Lanaco-Gray-white, #fff);
+  width: 100%;
 
   /* drop-shadow-sm */
   box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
@@ -42,7 +43,7 @@
       font-weight: 500;
       line-height: 1.5rem;
       letter-spacing: -0.0112rem;
-      ${p.truncateTextInRows(2)}
+      ${l.truncateTextInRows(2)}
     }
 
     & .wrapper__subtitle {
@@ -53,7 +54,7 @@
       font-weight: 400;
       line-height: 1.25rem;
       letter-spacing: -0.0056rem;
-      ${p.truncateTextInRows(2)}
+      ${l.truncateTextInRows(2)}
     }
 
     & .wrapper__badges {
@@ -108,7 +109,7 @@
       }
     }
   }
-`,j=d.newStyled.div`
+`,u=h.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -134,7 +135,7 @@
       width: 4rem;
       height: 4rem;
       border-radius: 999px;
-      background-color: ${p.linearGradientAnimation("-90deg")};
+      background-color: ${l.linearGradientAnimation("-90deg")};
     }
   }
 
@@ -146,12 +147,12 @@
     width: 100%;
 
     & .wrapper__info-item {
-      background-color: ${p.linearGradientAnimation("-90deg")};
+      background-color: ${l.linearGradientAnimation("-90deg")};
       height: 1rem;
       width: 100%;
     }
   }
-`,y=_.forwardRef(({image:a,imageComponent:m,title:t,subtitle:g,badges:c,rating:o,reviewCount:n,products:s,onSelectCard:h=()=>{}},f)=>r.jsxs(b,{onClick:h,children:[r.jsxs("div",{className:"wrapper__content",children:[p.isDefined(m)?m:r.jsx("img",{src:a,className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__info",children:[r.jsx("div",{className:"wrapper__title",children:t}),r.jsx("div",{className:"wrapper__subtitle",children:g}),c&&r.jsx("div",{className:"wrapper__badges"}),o&&n&&r.jsxs("div",{className:"wrapper__rating",children:[r.jsx("div",{className:"wrapper_stars",children:[...Array(5).keys()].map((i,l)=>r.jsx(v,{icon:i<o?" mng-lnc-star--filled":" mng-lnc-star",className:"wrapper__star"},`shop-card-rating-star__${l+1}`))}),r.jsxs("div",{className:"wrapper__review-count",children:["(",n==null?void 0:n.toLocaleString(),")"]})]})]})]}),r.jsx("div",{className:"wrapper__products",children:s&&(s==null?void 0:s.map((i,l)=>r.jsx(_.Fragment,{children:r.jsx("div",{className:"wrapper__product",onClick:()=>{var e;return(e=i==null?void 0:i.onSelectProduct)==null?void 0:e.call(i,i==null?void 0:i.uuid)},children:p.isDefined(i==null?void 0:i.imageComponent)?i==null?void 0:i.imageComponent:r.jsx("img",{src:i==null?void 0:i.image,className:"product__image"})})},l)))})]})),N=_.forwardRef(({},a)=>r.jsx(j,{children:r.jsxs("div",{className:"wrapper__content",children:[r.jsx("div",{className:"wrapper__image"}),r.jsxs("div",{className:"wrapper__info",children:[r.jsx("div",{className:"wrapper__info-item"}),r.jsx("div",{className:"wrapper__info-item"}),r.jsx("div",{className:"wrapper__info-item"}),r.jsx("div",{className:"wrapper__info-item"})]})]})})),k=d.newStyled.div`
+`,b=g.forwardRef(({image:a,imageComponent:p,title:s,subtitle:c,badges:x,rating:m,reviewCount:t,products:n,onSelectCard:_=()=>{}},w)=>e.jsxs(j,{onClick:_,children:[e.jsxs("div",{className:"wrapper__content",children:[l.isDefined(p)?p:e.jsx("img",{src:a,className:"wrapper__image"}),e.jsxs("div",{className:"wrapper__info",children:[e.jsx("div",{className:"wrapper__title",children:s}),e.jsx("div",{className:"wrapper__subtitle",children:c}),x&&e.jsx("div",{className:"wrapper__badges"}),m&&t&&e.jsxs("div",{className:"wrapper__rating",children:[e.jsx("div",{className:"wrapper_stars",children:[...Array(5).keys()].map((i,o)=>e.jsx(v,{icon:i<m?" mng-lnc-star--filled":" mng-lnc-star",className:"wrapper__star"},`shop-card-rating-star__${o+1}`))}),e.jsxs("div",{className:"wrapper__review-count",children:["(",t==null?void 0:t.toLocaleString(),")"]})]})]})]}),e.jsx("div",{className:"wrapper__products",children:n&&(n==null?void 0:n.map((i,o)=>e.jsx(g.Fragment,{children:e.jsx("div",{className:"wrapper__product",onClick:()=>{var r;return(r=i==null?void 0:i.onSelectProduct)==null?void 0:r.call(i,i==null?void 0:i.uuid)},children:l.isDefined(i==null?void 0:i.imageComponent)?i==null?void 0:i.imageComponent:e.jsx("img",{src:i==null?void 0:i.image,className:"product__image"})})},o)))})]})),N=g.forwardRef(({},a)=>e.jsx(u,{children:e.jsxs("div",{className:"wrapper__content",children:[e.jsx("div",{className:"wrapper__image"}),e.jsxs("div",{className:"wrapper__info",children:[e.jsx("div",{className:"wrapper__info-item"}),e.jsx("div",{className:"wrapper__info-item"}),e.jsx("div",{className:"wrapper__info-item"}),e.jsx("div",{className:"wrapper__info-item"})]})]})})),k=h.newStyled.div`
   display: flex;
   flex-direction: column;
   align-items: flex-start;
@@ -175,6 +176,15 @@
         font-weight: 600;
         line-height: 2rem;
         letter-spacing: -0.47px;
+
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+
+        & i {
+          font-size: 1.5rem;
+          color: var(--primary-500, #f59e0b);
+        }
       }
 
       & .title__action {
@@ -210,7 +220,7 @@
     width: 100%;
   }
 
-  @media (max-width: ${u.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${y.MOBILE_SIZE_PX+"px"}) {
     & .wrapper__heading {
       & .wrapper__title {
         & .title__action {
@@ -231,4 +241,4 @@
       gap: 1rem;
     }
   }
-`,$=_.forwardRef(({title:a,subtitle:m,items:t,limit:g=4,limitForMobile:c=2,actionText:o,onSelectCard:n=()=>{},onShowMore:s},h)=>{var l;const f=()=>{s==null||s()},i=e=>{n==null||n(e==null?void 0:e.uuid)};return r.jsxs(k,{limitCards:g,limitCardsForMobile:c,children:[r.jsxs("div",{className:"wrapper__heading",children:[r.jsxs("div",{className:"wrapper__title",children:[a&&r.jsx("div",{className:"title__text",children:a}),o&&s&&r.jsx(w,{text:o,borderRadius:"curved",btnType:"tinted",className:"title__action",onClick:f})]}),m&&r.jsx("div",{className:"wrapper__subtitle",children:m})]}),r.jsx("div",{className:"wrapper__cards",children:t&&(t==null?void 0:t.length)>0?t==null?void 0:t.map((e,x)=>r.jsx(y,{uuid:e==null?void 0:e.uuid,title:e==null?void 0:e.title,subtitle:e==null?void 0:e.subtitle,image:e==null?void 0:e.image,rating:e==null?void 0:e.rating,reviewCount:e==null?void 0:e.reviewCount,products:e==null?void 0:e.products,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>i==null?void 0:i(e)},`shop-card__${x+1}`)):(l=Array.from("1234"))==null?void 0:l.map((e,x)=>r.jsx(N,{},`shop-card-skeleton__${x+1}`))})]})});module.exports=$;
+`,$=g.forwardRef(({title:a,subtitle:p,items:s,limit:c=4,limitForMobile:x=2,buttonText:m="Show More",onSelectCard:t=()=>{},onButtonAction:n=()=>{},icon:_},w)=>{var o;const i=r=>{t==null||t(r==null?void 0:r.uuid)};return e.jsxs(k,{ref:w,limitCards:c,limitCardsForMobile:x,children:[e.jsxs("div",{className:"wrapper__heading",children:[e.jsxs("div",{className:"wrapper__title",children:[a&&e.jsxs("div",{className:"title__text",children:[l.isDefinedNotEmptyString(_)&&e.jsx("i",{className:_}),e.jsx("span",{children:a})]}),n&&e.jsx(f,{text:m,borderRadius:"curved",btnType:"tinted",className:"title__action",onClick:n})]}),p&&e.jsx("div",{className:"wrapper__subtitle",children:p})]}),e.jsx("div",{className:"wrapper__cards",children:s&&(s==null?void 0:s.length)>0?s==null?void 0:s.map((r,d)=>e.jsx(b,{uuid:r==null?void 0:r.uuid,title:r==null?void 0:r.title,subtitle:r==null?void 0:r.subtitle,image:r==null?void 0:r.image,rating:r==null?void 0:r.rating,reviewCount:r==null?void 0:r.reviewCount,products:r==null?void 0:r.products,imageComponent:r==null?void 0:r.imageComponent,onSelectCard:()=>i==null?void 0:i(r)},`shop-card__${d+1}`)):(o=Array.from("1234"))==null?void 0:o.map((r,d)=>e.jsx(N,{},`shop-card-skeleton__${d+1}`))})]})});module.exports=$;