@lanaco/lnc-react-ui 4.0.86 → 4.0.88

package/dist/BlogsSectionWithFilters.js

@@ -1,15 +1,15 @@
 import { jsxs as n, jsx as t, Fragment as h } from "react/jsx-runtime";
-import { forwardRef as u, Suspense as M, memo as P, useMemo as z } from "react";
+import { forwardRef as u, Suspense as P, memo as z, useMemo as A } from "react";
 import { s as f } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as S } from "./consts-C1uHV4xc.js";
-import { u as I } from "./useDetectMobile-BC6EGaBc.js";
-import { m as g, t as A, k as w } from "./utils-BE-UlkKf.js";
-import { T as O } from "./style-CsMpu4iC.js";
-import R from "./Button.js";
-import j from "./Link.js";
-import { P as E } from "./index-Ca38iPjf.js";
-import { S as F } from "./index-DmuZIVnC.js";
-const L = f.div`
+import { M as S } from "./consts-BuFChS64.js";
+import { u as I } from "./useDetectMobile-Bkvj0VMa.js";
+import { m as g, t as O, k as w } from "./utils-BE-UlkKf.js";
+import { T as R } from "./style-sLF37aOA.js";
+import j from "./Button.js";
+import E from "./Link.js";
+import { P as F } from "./index-Ca38iPjf.js";
+import { S as L } from "./index-Db8wvLXS.js";
+const U = f.div`
   display: grid;
   grid-template-columns: ${(i) => `repeat(${i.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
@@ -86,52 +86,52 @@ const L = f.div`
     font-weight: 400;
     font-size: 0.875rem;
     color: var(--gray-700, #4e555f);
-    ${A(3)}
+    ${O(3)}
   }
-`, U = u((i, l) => {
-  const { title: o, imageUrl: m, text: r, buttonText: c, onCardClick: a } = i;
+`, _ = u((i, l) => {
+  const { title: o, imageUrl: m, text: r, buttonText: s, onCardClick: a } = i;
   return /* @__PURE__ */ n(C, { ref: l, className: "blog-card", onClick: a, children: [
     /* @__PURE__ */ n(N, { children: [
       /* @__PURE__ */ t("div", { className: "text-wr-title", children: o }),
       /* @__PURE__ */ t("div", { className: "text-wr", children: r }),
-      /* @__PURE__ */ t(j, { color: "gray", onClick: a, children: c })
+      /* @__PURE__ */ t(E, { color: "gray", onClick: a, children: s })
     ] }),
-    /* @__PURE__ */ t(E, { src: m })
+    /* @__PURE__ */ t(F, { src: m })
   ] });
-}), _ = u(({}, i) => /* @__PURE__ */ n(C, { className: "blog-card", children: [
+}), D = u(({}, i) => /* @__PURE__ */ n(C, { className: "blog-card", children: [
   /* @__PURE__ */ n(N, { children: [
     /* @__PURE__ */ t("div", { className: "skeleton-title" }),
     /* @__PURE__ */ t("div", { className: "text-wr" }),
     /* @__PURE__ */ t("div", { className: "skeleton-action" })
   ] }),
   /* @__PURE__ */ t("div", { className: "skeleton-img" })
-] })), D = ({ limit: i = 3, isLoading: l = !1, keyPrefix: o }) => /* @__PURE__ */ t(h, { children: Array.from({ length: i }, (m, r) => /* @__PURE__ */ t(
-  _,
+] })), G = ({ limit: i = 3, isLoading: l = !1, keyPrefix: o }) => /* @__PURE__ */ t(h, { children: Array.from({ length: i }, (m, r) => /* @__PURE__ */ t(
+  D,
   {
     isLoading: l
   },
   `${o}-skeleton-product-card-${r}`
-)) }), G = ({
+)) }), H = ({
   children: i,
   fallbackComponent: l = /* @__PURE__ */ t(h, {}),
   isLoading: o = !1,
   limit: m,
   keyPrefix: r
-}) => /* @__PURE__ */ t(M, { fallbackComponent: l, children: o === !0 ? /* @__PURE__ */ t(
-  D,
+}) => /* @__PURE__ */ t(P, { fallbackComponent: l, children: o === !0 ? /* @__PURE__ */ t(
+  G,
   {
     isLoading: o,
     limit: m,
     keyPrefix: r
   }
-) : i }), y = P(U), re = u((i, l) => {
+) : i }), y = z(_), ie = u((i, l) => {
   const {
     icon: o,
     title: m,
     items: r,
-    buttonText: c,
+    buttonText: s,
     limit: a = 3,
-    options: d,
+    options: c,
     selectedOption: T = [],
     onButtonAction: $ = () => {
     },
@@ -141,51 +141,55 @@ const L = f.div`
     onSelectAll: B = () => {
     },
     isLoading: W = !1,
-    onSelectCard: s = () => {
-    }
-  } = i, v = I(), x = z(() => /* @__PURE__ */ t(h, { children: v === !0 ? r == null ? void 0 : r.map((e, p) => /* @__PURE__ */ t(
+    onSelectCard: p = () => {
+    },
+    productsToolbarName: x = "All"
+  } = i, v = I(), M = A(() => /* @__PURE__ */ t(h, { children: v === !0 ? r == null ? void 0 : r.map((e, d) => /* @__PURE__ */ t(
     y,
     {
       title: e == null ? void 0 : e.title,
       imageUrl: (e == null ? void 0 : e.image) || null,
       text: e == null ? void 0 : e.text,
       buttonText: e == null ? void 0 : e.buttonText,
-      onCardClick: () => s(e)
+      onCardClick: () => p(e)
     },
-    p
-  )) : r == null ? void 0 : r.slice(0, a).map((e, p) => /* @__PURE__ */ t(
+    d
+  )) : r == null ? void 0 : r.slice(0, a).map((e, d) => /* @__PURE__ */ t(
     y,
     {
       title: e == null ? void 0 : e.title,
       imageUrl: (e == null ? void 0 : e.image) || null,
       text: e == null ? void 0 : e.text,
       buttonText: e == null ? void 0 : e.buttonText,
-      onCardClick: () => s(e)
+      onCardClick: () => p(e)
     },
-    p
-  )) }), [r, v, a, s]);
-  return /* @__PURE__ */ n(O, { ref: l, children: [
+    d
+  )) }), [r, v, a, p]);
+  return /* @__PURE__ */ n(R, { ref: l, children: [
     /* @__PURE__ */ n("div", { className: "regular-title", children: [
       /* @__PURE__ */ n("div", { className: "regular-title-text", children: [
         w(o) && /* @__PURE__ */ t("i", { className: o }),
         /* @__PURE__ */ t("span", { children: m })
       ] }),
       w(b) && /* @__PURE__ */ t(
-        R,
+        j,
         {
           type: "button",
           btnType: "tinted",
           color: "gray",
-          onClick: () => $(b),
+          onClick: (e) => {
+            var d;
+            (d = e == null ? void 0 : e.target) == null || d.blur(), $(b);
+          },
           borderRadius: "curved",
-          children: c
+          children: s
         }
       )
     ] }),
-    (d == null ? void 0 : d.length) > 0 && /* @__PURE__ */ t(
-      F,
+    (c == null ? void 0 : c.length) > 0 && /* @__PURE__ */ t(
+      L,
       {
-        items: d,
+        items: c,
         selectedIds: T,
         onRemove: (e) => {
           k(e);
@@ -196,20 +200,21 @@ const L = f.div`
         onSelectAll: B,
         labelKey: "name",
         valueKey: "code",
-        noMargin: !0
+        noMargin: !0,
+        productsToolbarName: x
       }
     ),
-    /* @__PURE__ */ t(L, { limit: a, children: /* @__PURE__ */ t(
-      G,
+    /* @__PURE__ */ t(U, { limit: a, children: /* @__PURE__ */ t(
+      H,
       {
         isLoading: W,
         limit: a,
         keyPrefix: "explore-landing",
-        children: x
+        children: M
       }
     ) })
   ] });
 });
 export {
-  re as default
+  ie as default
 };

package/dist/BrandHitsSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),p=require("react"),c=require("./utils-DhRHf5Ed.cjs"),o=require("./emotion-styled.browser.esm-BtEseadx.cjs"),d=require("./consts-CtNoHdBj.cjs"),h=o.styled.div`
+"use strict";const e=require("react/jsx-runtime"),p=require("react"),c=require("./utils-DhRHf5Ed.cjs"),o=require("./emotion-styled.browser.esm-BtEseadx.cjs"),d=require("./consts-goSZX3xP.cjs"),h=o.styled.div`
   width: 7.5rem;
   height: auto;
   max-height: 7.5rem;

package/dist/BrandHitsSection.js

@@ -2,7 +2,7 @@ import { jsx as e, jsxs as h } from "react/jsx-runtime";
 import { forwardRef as o } from "react";
 import { m as c, l as s } from "./utils-BE-UlkKf.js";
 import { s as d } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as m } from "./consts-C1uHV4xc.js";
+import { M as m } from "./consts-BuFChS64.js";
 const g = d.div`
   width: 7.5rem;
   height: auto;

package/dist/CalorieCalculatorSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const t=require("react/jsx-runtime"),d=require("react"),b=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-CtNoHdBj.cjs"),z=require("./Button.cjs"),I=require("./index-BPVoEhTF.cjs"),L=require("./RangeSlider.cjs"),F=require("./DropdownItem.cjs"),X=require("./DropdownMenu.cjs"),Z=require("./IconButton.cjs"),V=require("./BannerSectionWithList.cjs"),H=require("./utils-DhRHf5Ed.cjs"),D=b.styled.div`
+"use strict";const t=require("react/jsx-runtime"),d=require("react"),b=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-goSZX3xP.cjs"),z=require("./Button.cjs"),I=require("./index-BPVoEhTF.cjs"),L=require("./RangeSlider.cjs"),F=require("./DropdownItem.cjs"),X=require("./DropdownMenu.cjs"),Z=require("./IconButton.cjs"),V=require("./BannerSectionWithList.cjs"),H=require("./utils-DhRHf5Ed.cjs"),D=b.styled.div`
   display: flex;
   flex-direction: column;
   width: 100%;

package/dist/CalorieCalculatorSection.js

@@ -1,7 +1,7 @@
 import { jsxs as i, jsx as a, Fragment as z } from "react/jsx-runtime";
 import { forwardRef as w, useState as N, useRef as Y } from "react";
 import { s as y } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as C } from "./consts-C1uHV4xc.js";
+import { M as C } from "./consts-BuFChS64.js";
 import S from "./Button.js";
 import { P as G } from "./index-S5Cd7WrG.js";
 import A from "./RangeSlider.js";

package/dist/CustomLoanMapSection.cjs

@@ -1,4 +1,4 @@
-"use strict";const e=require("react/jsx-runtime"),h=require("react"),C=require("./emotion-styled.browser.esm-BtEseadx.cjs"),T=require("./consts-CtNoHdBj.cjs"),f=require("./index-CWAifrDS.cjs"),q=require("./index-ZR5ws_qw.cjs"),L=C.styled.div`
+"use strict";const e=require("react/jsx-runtime"),k=require("react"),z=require("./emotion-styled.browser.esm-BtEseadx.cjs"),D=require("./consts-goSZX3xP.cjs"),G=require("./index-Cx4KvZ9L.cjs"),J=require("./LoanCalculatorSection.cjs"),K=z.styled.div`
   display: flex;
   gap: 2rem;
 
@@ -6,8 +6,8 @@
   .location-finder {
     flex: 1;
   }
-  @media (max-width: ${T.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${D.MOBILE_SIZE_PX+"px"}) {
     flex-direction: column;
     gap: 1.25rem;
   }
-`,F=h.forwardRef((o,t)=>{const{hasLoanCalculator:a,hasLocationFinder:r,locationFinderTitle:l,locationFinderPlaceholder:n,openMapText:c,onOpenMap:i=()=>{},mapFilters:s,loanCalculatorTitle:u,loanCalculatorText:d,loanCalculatorPlaceholder:x,openCalculatorText:p,onOpenCalculator:m=()=>{}}=o;return e.jsxs(L,{ref:t,children:[r===!0&&e.jsx(f.LocationFinder,{title:l,placeholderText:n,onOpenMap:i,openMapText:c,mapFilters:s}),a===!0&&e.jsx(q.LoanCalculator,{title:u,text:d,openCalculatorText:p,onOpenCalculator:m,placeholderText:x})]})});module.exports=F;
+`,N=k.forwardRef((t,n)=>{const{hasLoanCalculator:a,hasLocationFinder:o,locationFinderTitle:r,locationFinderPlaceholder:l,openMapText:i,onOpenMap:m=()=>{},mapFilters:s,inputComponent:u,loanCalculatorTitle:c,loanCalculatorText:d,loanCalculatorPlaceholder:x,openCalculatorText:p,onOpenCalculator:y=Q=>{},defaultLoanAmount:L,defaultInterestRate:P,defaultLoanPeriod:T,monthlyPayment:h,totalInterestPaid:f,currency:C,loanPeriodUnit:R,minLoanAmount:b,maxLoanAmount:q,minInterestRate:I,maxInterestRate:M,minLoanPeriod:A,maxLoanPeriod:F,headerTitleText:H,footerTitleText:S,loanAmountLabel:j,loanAmountHint:_,interestRateLabel:w,interestRateHint:O,loanPeriodLabel:g,loanPeriodHint:E,submitText:v,summaryMonthlyPaymentText:B,summaryMonthlyPaymentHint:U,summaryTotalPaymentText:W,summaryTotalPaymentHint:X,handleSubmit:Z,handleCancel:$}=t;return e.jsxs(K,{ref:n,children:[o===!0&&e.jsx(G.LocationFinder,{title:r,placeholderText:l,onOpenMap:m,openMapText:i,mapFilters:s,inputComponent:u}),a===!0&&e.jsx(J,{loanCalculatorTitle:c,loanCalculatorText:d,loanCalculatorPlaceholder:x,openCalculatorText:p,onOpenCalculator:y,defaultLoanAmount:L,defaultInterestRate:P,defaultLoanPeriod:T,monthlyPayment:h,totalInterestPaid:f,currency:C,loanPeriodUnit:R,minLoanAmount:b,maxLoanAmount:q,minInterestRate:I,maxInterestRate:M,minLoanPeriod:A,maxLoanPeriod:F,headerTitleText:H,footerTitleText:S,loanAmountLabel:j,loanAmountHint:_,interestRateLabel:w,interestRateHint:O,loanPeriodLabel:g,loanPeriodHint:E,submitText:v,summaryMonthlyPaymentText:B,summaryMonthlyPaymentHint:U,summaryTotalPaymentText:W,summaryTotalPaymentHint:X,handleSubmit:Z,handleCancel:$})]})});module.exports=N;

package/dist/CustomLoanMapSection.js

@@ -1,10 +1,10 @@
-import { jsxs as f, jsx as o } from "react/jsx-runtime";
-import { forwardRef as h } from "react";
-import { s as C } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as L } from "./consts-C1uHV4xc.js";
-import { L as T } from "./index-B5bRol0l.js";
-import { L as F } from "./index-B69VVFyo.js";
-const M = C.div`
+import { jsxs as q, jsx as t } from "react/jsx-runtime";
+import { forwardRef as z } from "react";
+import { s as D } from "./emotion-styled.browser.esm-BNN1dTl3.js";
+import { M as G } from "./consts-BuFChS64.js";
+import { L as J } from "./index-iSD5jNBk.js";
+import K from "./LoanCalculatorSection.js";
+const N = D.div`
   display: flex;
   gap: 2rem;
 
@@ -12,50 +12,110 @@ const M = C.div`
   .location-finder {
     flex: 1;
   }
-  @media (max-width: ${L + "px"}) {
+  @media (max-width: ${G + "px"}) {
     flex-direction: column;
     gap: 1.25rem;
   }
-`, E = h((a, t) => {
+`, nt = z((a, e) => {
   const {
-    hasLoanCalculator: e,
-    hasLocationFinder: l,
-    locationFinderTitle: r,
-    locationFinderPlaceholder: n,
+    hasLoanCalculator: o,
+    hasLocationFinder: n,
+    // Location finder section
+    locationFinderTitle: l,
+    locationFinderPlaceholder: r,
     openMapText: i,
-    onOpenMap: c = () => {
+    onOpenMap: m = () => {
     },
-    mapFilters: p,
-    loanCalculatorTitle: m,
-    loanCalculatorText: d,
-    loanCalculatorPlaceholder: s,
-    openCalculatorText: u,
-    onOpenCalculator: x = () => {
-    }
+    mapFilters: u,
+    inputComponent: d,
+    // Loan calculator section
+    loanCalculatorTitle: c,
+    loanCalculatorText: s,
+    loanCalculatorPlaceholder: p,
+    openCalculatorText: x,
+    onOpenCalculator: f = (Q) => {
+    },
+    defaultLoanAmount: L,
+    defaultInterestRate: y,
+    defaultLoanPeriod: P,
+    monthlyPayment: T,
+    totalInterestPaid: h,
+    currency: C,
+    loanPeriodUnit: M,
+    minLoanAmount: I,
+    maxLoanAmount: R,
+    minInterestRate: b,
+    maxInterestRate: A,
+    minLoanPeriod: F,
+    maxLoanPeriod: H,
+    headerTitleText: S,
+    footerTitleText: O,
+    loanAmountLabel: g,
+    loanAmountHint: j,
+    interestRateLabel: w,
+    interestRateHint: E,
+    loanPeriodLabel: _,
+    loanPeriodHint: v,
+    submitText: B,
+    summaryMonthlyPaymentText: U,
+    summaryMonthlyPaymentHint: W,
+    summaryTotalPaymentText: X,
+    summaryTotalPaymentHint: Z,
+    handleSubmit: $,
+    handleCancel: k
   } = a;
-  return /* @__PURE__ */ f(M, { ref: t, children: [
-    l === !0 && /* @__PURE__ */ o(
-      T,
+  return /* @__PURE__ */ q(N, { ref: e, children: [
+    n === !0 && /* @__PURE__ */ t(
+      J,
       {
-        title: r,
-        placeholderText: n,
-        onOpenMap: c,
+        title: l,
+        placeholderText: r,
+        onOpenMap: m,
         openMapText: i,
-        mapFilters: p
+        mapFilters: u,
+        inputComponent: d
       }
     ),
-    e === !0 && /* @__PURE__ */ o(
-      F,
+    o === !0 && /* @__PURE__ */ t(
+      K,
       {
-        title: m,
-        text: d,
-        openCalculatorText: u,
-        onOpenCalculator: x,
-        placeholderText: s
+        loanCalculatorTitle: c,
+        loanCalculatorText: s,
+        loanCalculatorPlaceholder: p,
+        openCalculatorText: x,
+        onOpenCalculator: f,
+        defaultLoanAmount: L,
+        defaultInterestRate: y,
+        defaultLoanPeriod: P,
+        monthlyPayment: T,
+        totalInterestPaid: h,
+        currency: C,
+        loanPeriodUnit: M,
+        minLoanAmount: I,
+        maxLoanAmount: R,
+        minInterestRate: b,
+        maxInterestRate: A,
+        minLoanPeriod: F,
+        maxLoanPeriod: H,
+        headerTitleText: S,
+        footerTitleText: O,
+        loanAmountLabel: g,
+        loanAmountHint: j,
+        interestRateLabel: w,
+        interestRateHint: E,
+        loanPeriodLabel: _,
+        loanPeriodHint: v,
+        submitText: B,
+        summaryMonthlyPaymentText: U,
+        summaryMonthlyPaymentHint: W,
+        summaryTotalPaymentText: X,
+        summaryTotalPaymentHint: Z,
+        handleSubmit: $,
+        handleCancel: k
       }
     )
   ] });
 });
 export {
-  E as default
+  nt as default
 };

package/dist/DetailedProductsSection.cjs

@@ -1,13 +1,13 @@
-"use strict";const i=require("react/jsx-runtime"),l=require("react"),k=require("./emotion-styled.browser.esm-BtEseadx.cjs"),v=require("./consts-CtNoHdBj.cjs"),D=require("./Button.cjs"),y=require("./utils-DhRHf5Ed.cjs"),P=require("./useDetectMobile-D6d5LpdL.cjs"),U=require("./style-C571ywKV.cjs"),h=require("./suspense-product-card-detailed-CwUN6A-L.cjs"),M=require("./index-rYeYJwuL.cjs"),F=k.styled.div`
+"use strict";const i=require("react/jsx-runtime"),l=require("react"),v=require("./emotion-styled.browser.esm-BtEseadx.cjs"),D=require("./consts-goSZX3xP.cjs"),P=require("./Button.cjs"),y=require("./utils-DhRHf5Ed.cjs"),U=require("./useDetectMobile-zkbzoOGV.cjs"),M=require("./style-xvwWn3Zv.cjs"),h=require("./suspense-product-card-detailed-DBNlkFiP.cjs"),F=require("./index-DG7qQq8L.cjs"),T=v.styled.div`
   display: grid;
-  grid-template-columns: ${n=>`repeat(${n.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${s=>`repeat(${s.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
   & .button-link {
     white-space: pre;
   }
 
-  @media (max-width: ${v.MOBILE_SIZE_PX+"px"}) {
+  @media (max-width: ${D.MOBILE_SIZE_PX+"px"}) {
     display: flex;
     gap: 1rem;
     overflow-x: auto;
@@ -26,4 +26,4 @@
       /* Safari and Chrome */
     }
   }
-`,S=l.memo(h.DetailedProductCard),E=l.forwardRef((n,f)=>{const{icon:a,title:C,buttonLink:c,items:r,buttonText:j,limit:t=4,onSelectCard:u=()=>{},onButtonAction:w=()=>{},isLoading:q=!1,getImage:d=()=>{},negotiableText:m,freeText:p,options:o,onSelectOption:g=()=>{}}=n,b=P.useDetectMobile(),N=l.useMemo(()=>i.jsx(i.Fragment,{children:b===!0?r==null?void 0:r.map((e,s)=>i.jsx(S,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>u(e==null?void 0:e.uuid),imageUrl:d(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:p},s)):r==null?void 0:r.slice(0,t).map((e,s)=>i.jsx(S,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>u(e==null?void 0:e.uuid),imageUrl:d(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:p},s))}),[r,b,t]);return i.jsxs(U.TitleWithOptionsSectionWrapper,{ref:f,children:[i.jsxs("div",{className:"regular-title",children:[i.jsxs("div",{className:"regular-title-text",children:[y.isDefinedNotEmptyString(a)&&i.jsx("i",{className:a}),i.jsx("span",{children:C})]}),y.isDefinedNotEmptyString(c)&&i.jsx(D,{type:"button",btnType:"tinted",color:"gray",onClick:()=>w(c),borderRadius:"curved",className:"button-link",children:j})]}),(o==null?void 0:o.length)>0&&i.jsx(M.SelectBar,{items:o,onRemove:e=>{g(e)},onSelect:e=>{g(e)},labelKey:"name",valueKey:"code",noMargin:!0}),i.jsx(F,{limit:t,children:i.jsx(h.SuspenseDetailedProductCard,{isLoading:q,itemsCount:t,keyPrefix:"explore-landing",children:N})})]})});module.exports=E;
+`,S=l.memo(h.DetailedProductCard),E=l.forwardRef((s,f)=>{const{icon:a,title:C,buttonLink:c,items:r,buttonText:j,limit:o=4,onSelectCard:u=()=>{},onButtonAction:w=()=>{},isLoading:N=!1,getImage:d=()=>{},negotiableText:m,freeText:p,options:n,onSelectOption:g=()=>{},productsToolbarName:q="All"}=s,b=U.useDetectMobile(),k=l.useMemo(()=>i.jsx(i.Fragment,{children:b===!0?r==null?void 0:r.map((e,t)=>i.jsx(S,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>u(e==null?void 0:e.uuid),imageUrl:d(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:p},t)):r==null?void 0:r.slice(0,o).map((e,t)=>i.jsx(S,{title:e==null?void 0:e.name,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>u(e==null?void 0:e.uuid),imageUrl:d(e==null?void 0:e.image,e==null?void 0:e.uuid,e==null?void 0:e.sellerUuid)||null,isFree:e==null?void 0:e.isFree,isNegotiable:e==null?void 0:e.isNegotiable,negotiableText:m,freeText:p},t))}),[r,b,o]);return i.jsxs(M.TitleWithOptionsSectionWrapper,{ref:f,children:[i.jsxs("div",{className:"regular-title",children:[i.jsxs("div",{className:"regular-title-text",children:[y.isDefinedNotEmptyString(a)&&i.jsx("i",{className:a}),i.jsx("span",{children:C})]}),y.isDefinedNotEmptyString(c)&&i.jsx(P,{type:"button",btnType:"tinted",color:"gray",onClick:e=>{var t;(t=e==null?void 0:e.target)==null||t.blur(),w(c)},borderRadius:"curved",className:"button-link",children:j})]}),(n==null?void 0:n.length)>0&&i.jsx(F.SelectBar,{items:n,onRemove:e=>{g(e)},onSelect:e=>{g(e)},labelKey:"name",valueKey:"code",noMargin:!0,productsToolbarName:q}),i.jsx(T,{limit:o,children:i.jsx(h.SuspenseDetailedProductCard,{isLoading:N,itemsCount:o,keyPrefix:"explore-landing",children:k})})]})});module.exports=E;

package/dist/DetailedProductsSection.js

@@ -1,16 +1,16 @@
-import { jsx as i, Fragment as N, jsxs as a } from "react/jsx-runtime";
-import { memo as U, forwardRef as M, useMemo as P } from "react";
+import { jsx as i, Fragment as U, jsxs as n } from "react/jsx-runtime";
+import { memo as M, forwardRef as P, useMemo as T } from "react";
 import { s as D } from "./emotion-styled.browser.esm-BNN1dTl3.js";
-import { M as F } from "./consts-C1uHV4xc.js";
-import T from "./Button.js";
-import { k as b } from "./utils-BE-UlkKf.js";
-import { u as B } from "./useDetectMobile-BC6EGaBc.js";
-import { T as E } from "./style-CsMpu4iC.js";
-import { D as I, S as L } from "./suspense-product-card-detailed-J2a9wi6Z.js";
-import { S as O } from "./index-DmuZIVnC.js";
-const R = D.div`
+import { M as F } from "./consts-BuFChS64.js";
+import B from "./Button.js";
+import { k as f } from "./utils-BE-UlkKf.js";
+import { u as E } from "./useDetectMobile-Bkvj0VMa.js";
+import { T as I } from "./style-sLF37aOA.js";
+import { D as L, S as O } from "./suspense-product-card-detailed-CwdbxJrY.js";
+import { S as R } from "./index-Db8wvLXS.js";
+const W = D.div`
   display: grid;
-  grid-template-columns: ${(n) => `repeat(${n.limit},  minmax(0, 1fr))`};
+  grid-template-columns: ${(a) => `repeat(${a.limit},  minmax(0, 1fr))`};
   gap: 1.25rem;
 
   & .button-link {
@@ -36,14 +36,14 @@ const R = D.div`
       /* Safari and Chrome */
     }
   }
-`, S = U(I), q = M((n, y) => {
+`, S = M(L), H = P((a, y) => {
   const {
     icon: s,
     title: h,
     buttonLink: d,
     items: r,
     buttonText: C,
-    limit: o = 4,
+    limit: t = 4,
     onSelectCard: m = () => {
     },
     onButtonAction: w = () => {
@@ -53,10 +53,11 @@ const R = D.div`
     },
     negotiableText: u,
     freeText: p,
-    options: t,
+    options: l,
     onSelectOption: g = () => {
-    }
-  } = n, f = B(), v = P(() => /* @__PURE__ */ i(N, { children: f === !0 ? r == null ? void 0 : r.map((e, l) => /* @__PURE__ */ i(
+    },
+    productsToolbarName: N = "All"
+  } = a, b = E(), v = T(() => /* @__PURE__ */ i(U, { children: b === !0 ? r == null ? void 0 : r.map((e, o) => /* @__PURE__ */ i(
     S,
     {
       title: e == null ? void 0 : e.name,
@@ -74,8 +75,8 @@ const R = D.div`
       negotiableText: u,
       freeText: p
     },
-    l
-  )) : r == null ? void 0 : r.slice(0, o).map((e, l) => /* @__PURE__ */ i(
+    o
+  )) : r == null ? void 0 : r.slice(0, t).map((e, o) => /* @__PURE__ */ i(
     S,
     {
       title: e == null ? void 0 : e.name,
@@ -94,31 +95,34 @@ const R = D.div`
       negotiableText: u,
       freeText: p
     },
-    l
-  )) }), [r, f, o]);
-  return /* @__PURE__ */ a(E, { ref: y, children: [
-    /* @__PURE__ */ a("div", { className: "regular-title", children: [
-      /* @__PURE__ */ a("div", { className: "regular-title-text", children: [
-        b(s) && /* @__PURE__ */ i("i", { className: s }),
+    o
+  )) }), [r, b, t]);
+  return /* @__PURE__ */ n(I, { ref: y, children: [
+    /* @__PURE__ */ n("div", { className: "regular-title", children: [
+      /* @__PURE__ */ n("div", { className: "regular-title-text", children: [
+        f(s) && /* @__PURE__ */ i("i", { className: s }),
         /* @__PURE__ */ i("span", { children: h })
       ] }),
-      b(d) && /* @__PURE__ */ i(
-        T,
+      f(d) && /* @__PURE__ */ i(
+        B,
         {
           type: "button",
           btnType: "tinted",
           color: "gray",
-          onClick: () => w(d),
+          onClick: (e) => {
+            var o;
+            (o = e == null ? void 0 : e.target) == null || o.blur(), w(d);
+          },
           borderRadius: "curved",
           className: "button-link",
           children: C
         }
       )
     ] }),
-    (t == null ? void 0 : t.length) > 0 && /* @__PURE__ */ i(
-      O,
+    (l == null ? void 0 : l.length) > 0 && /* @__PURE__ */ i(
+      R,
       {
-        items: t,
+        items: l,
         onRemove: (e) => {
           g(e);
         },
@@ -127,14 +131,15 @@ const R = D.div`
         },
         labelKey: "name",
         valueKey: "code",
-        noMargin: !0
+        noMargin: !0,
+        productsToolbarName: N
       }
     ),
-    /* @__PURE__ */ i(R, { limit: o, children: /* @__PURE__ */ i(
-      L,
+    /* @__PURE__ */ i(W, { limit: t, children: /* @__PURE__ */ i(
+      O,
       {
         isLoading: k,
-        itemsCount: o,
+        itemsCount: t,
         keyPrefix: "explore-landing",
         children: v
       }
@@ -142,5 +147,5 @@ const R = D.div`
   ] });
 });
 export {
-  q as default
+  H as default
 };