@lanaco/lnc-react-ui 4.0.38 → 4.0.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/dist/BannerSectionBasic.cjs +9 -9
  2. package/dist/BannerSectionBasic.js +20 -20
  3. package/dist/BannerSectionCarousel.cjs +13 -5
  4. package/dist/BannerSectionCarousel.js +29 -21
  5. package/dist/BannerSectionGrid.cjs +1 -1
  6. package/dist/BannerSectionGrid.js +6 -6
  7. package/dist/BannerSectionSimple.cjs +4 -4
  8. package/dist/BannerSectionSimple.js +41 -38
  9. package/dist/BannerSectionWithList.cjs +4 -4
  10. package/dist/BannerSectionWithList.js +17 -17
  11. package/dist/BannerSectionWithListImage.cjs +5 -5
  12. package/dist/BannerSectionWithListImage.js +41 -38
  13. package/dist/BlogsSectionDetailed.cjs +15 -15
  14. package/dist/BlogsSectionDetailed.js +128 -92
  15. package/dist/BlogsSectionLarge.cjs +10 -10
  16. package/dist/BlogsSectionLarge.js +87 -60
  17. package/dist/BlogsSectionSimple.cjs +8 -8
  18. package/dist/BlogsSectionSimple.js +98 -72
  19. package/dist/BlogsSectionSimpleCentered.cjs +10 -10
  20. package/dist/BlogsSectionSimpleCentered.js +76 -46
  21. package/dist/BlogsSectionWithFilters.cjs +11 -11
  22. package/dist/BlogsSectionWithFilters.js +102 -73
  23. package/dist/BrandHitsSection.cjs +12 -7
  24. package/dist/BrandHitsSection.js +10 -5
  25. package/dist/CalorieCalculatorSection.cjs +7 -8
  26. package/dist/CalorieCalculatorSection.js +31 -32
  27. package/dist/CustomLoanMapSection.cjs +2 -2
  28. package/dist/CustomLoanMapSection.js +13 -13
  29. package/dist/DetailedProductsSection.cjs +4 -4
  30. package/dist/DetailedProductsSection.js +66 -57
  31. package/dist/FieldOfInterestsWithAvatarsCardsSection.cjs +8 -8
  32. package/dist/FieldOfInterestsWithAvatarsCardsSection.js +9 -8
  33. package/dist/FieldOfInterestsWithTagsCardsSection.cjs +14 -6
  34. package/dist/FieldOfInterestsWithTagsCardsSection.js +12 -4
  35. package/dist/GeneralWithTagsCardsSection.cjs +18 -6
  36. package/dist/GeneralWithTagsCardsSection.js +44 -31
  37. package/dist/GiftCardsSection.cjs +9 -5
  38. package/dist/GiftCardsSection.js +21 -17
  39. package/dist/LocationSearchSection.cjs +1 -1
  40. package/dist/LocationSearchSection.js +1 -1
  41. package/dist/MasonryGeneralCardsSection.cjs +21 -1
  42. package/dist/MasonryGeneralCardsSection.js +20 -0
  43. package/dist/OverlayGeneralCardsSection.cjs +60 -104
  44. package/dist/OverlayGeneralCardsSection.js +138 -147
  45. package/dist/ProductsWithBannerSection.cjs +10 -10
  46. package/dist/ProductsWithBannerSection.js +85 -54
  47. package/dist/SalesCampaignsSection.cjs +17 -17
  48. package/dist/SalesCampaignsSection.js +81 -81
  49. package/dist/ShopCardsSection.cjs +19 -9
  50. package/dist/ShopCardsSection.js +54 -40
  51. package/dist/SimpleCategoriesSection.cjs +9 -9
  52. package/dist/SimpleCategoriesSection.js +89 -58
  53. package/dist/SimpleProductsSection.cjs +3 -3
  54. package/dist/SimpleProductsSection.js +86 -55
  55. package/dist/UrgentSaleProductsSection.cjs +5 -5
  56. package/dist/UrgentSaleProductsSection.js +41 -30
  57. package/dist/{index-CT6_7UFb.js → index-5cttM4t7.js} +119 -124
  58. package/dist/{index-CHkb_Sj6.js → index-BT55M3t6.js} +16 -15
  59. package/dist/{index-Dj5wZCVs.cjs → index-DHJmdMN8.cjs} +6 -5
  60. package/dist/index-Dn5tPLgP.cjs +95 -0
  61. package/dist/{style-6tSw9aqK.js → style-CiePxaJ_.js} +6 -6
  62. package/dist/{style-BR3tIhP1.cjs → style-DN1qT8BE.cjs} +6 -6
  63. package/dist/suspense-product-card-detailed-BETmfKMT.js +189 -0
  64. package/dist/{index-vXmvgZ2Y.cjs → suspense-product-card-detailed-DtzOxHaH.cjs} +4 -4
  65. package/package.json +1 -1
  66. package/dist/index-D6g5ZqyJ.js +0 -159
  67. package/dist/index-Q_i-aqsF.cjs +0 -95
@@ -1,21 +1,21 @@
1
- import { jsxs as a, jsx as t } from "react/jsx-runtime";
2
- import { forwardRef as s } from "react";
3
- import { n as p } from "./emotion-styled.browser.esm-CjCaF13H.js";
4
- import { M as f } from "./consts-C1uHV4xc.js";
5
- import { u as S } from "./useDetectMobile-BC6EGaBc.js";
6
- import { m as C, t as N, k as u } from "./utils-DtRLzzTZ.js";
7
- import { R } from "./style-6tSw9aqK.js";
8
- import T from "./Button.js";
9
- import $ from "./Link.js";
10
- const B = p.div`
1
+ import { jsxs as m, jsx as r, Fragment as g } from "react/jsx-runtime";
2
+ import { forwardRef as u, Suspense as $, memo as B, useMemo as M } from "react";
3
+ import { n as h } from "./emotion-styled.browser.esm-CjCaF13H.js";
4
+ import { M as b } from "./consts-C1uHV4xc.js";
5
+ import { u as R } from "./useDetectMobile-BC6EGaBc.js";
6
+ import { m as T, t as P, k as f } from "./utils-DtRLzzTZ.js";
7
+ import { R as z } from "./style-CiePxaJ_.js";
8
+ import W from "./Button.js";
9
+ import j from "./Link.js";
10
+ const A = h.div`
11
11
  display: grid;
12
- grid-template-columns: ${(r) => `repeat(${r.limit}, minmax(0, 1fr))`};
12
+ grid-template-columns: ${(t) => `repeat(${t.limit}, minmax(0, 1fr))`};
13
13
  gap: 1.25rem;
14
14
 
15
- @media (max-width: ${f + "px"}) {
15
+ @media (max-width: ${b + "px"}) {
16
16
  grid-template-columns: repeat(1, 1fr);
17
17
  }
18
- `, v = p.div`
18
+ `, w = h.div`
19
19
  display: flex;
20
20
  flex-direction: column;
21
21
  width: 100%;
@@ -47,7 +47,7 @@ const B = p.div`
47
47
  width: 100%;
48
48
  max-height: 12.5625rem;
49
49
  min-height: 12.5625rem;
50
- background-color: ${C("-90deg")};
50
+ background-color: ${T("-90deg")};
51
51
  }
52
52
 
53
53
  & .action {
@@ -55,9 +55,9 @@ const B = p.div`
55
55
  margin-top: auto;
56
56
  }
57
57
 
58
- @media (max-width: ${f + "px"}) {
58
+ @media (max-width: ${b + "px"}) {
59
59
  }
60
- `, b = p.div`
60
+ `, S = h.div`
61
61
  padding: 1rem 1rem 0 1rem;
62
62
  display: flex;
63
63
  flex-direction: column;
@@ -75,84 +75,110 @@ const B = p.div`
75
75
  font-size: 0.875rem;
76
76
  flex: 1;
77
77
  color: var(--gray-700, #4e555f);
78
- ${N(3)}
78
+ ${P(3)}
79
79
  }
80
- `;
81
- s(({}, r) => (
80
+ `, E = u(({}, t) => (
82
81
  // <LandingPageClearProductCardSkeleton />
83
- /* @__PURE__ */ a(v, { className: "product-card", children: [
84
- /* @__PURE__ */ t("div", { className: "skeleton-img" }),
85
- /* @__PURE__ */ t("div", { className: "card-title" }),
86
- /* @__PURE__ */ t(b, {})
82
+ /* @__PURE__ */ m(w, { className: "product-card", children: [
83
+ /* @__PURE__ */ r("div", { className: "skeleton-img" }),
84
+ /* @__PURE__ */ r("div", { className: "card-title" }),
85
+ /* @__PURE__ */ r(S, {})
87
86
  ] })
88
- ));
89
- const h = s((r, w) => {
90
- const { title: l, image: m, text: d, onCardClick: o, readMoreText: n = "Read more" } = r;
87
+ )), I = u((t, l) => {
88
+ const { title: i, image: n, text: o, onCardClick: d, readMoreText: c = "Read more" } = t;
91
89
  return (
92
90
  // <SimpleBlogCardSkeleton />
93
- /* @__PURE__ */ a(v, { className: "blog-card", onClick: o, children: [
94
- /* @__PURE__ */ t("img", { src: m }),
95
- /* @__PURE__ */ a(b, { children: [
96
- /* @__PURE__ */ t("div", { className: "text-wr-title", children: l }),
97
- /* @__PURE__ */ t("div", { className: "text-wr", children: d })
91
+ /* @__PURE__ */ m(w, { className: "blog-card", onClick: d, children: [
92
+ /* @__PURE__ */ r("img", { src: n }),
93
+ /* @__PURE__ */ m(S, { children: [
94
+ /* @__PURE__ */ r("div", { className: "text-wr-title", children: i }),
95
+ /* @__PURE__ */ r("div", { className: "text-wr", children: o })
98
96
  ] }),
99
- /* @__PURE__ */ t($, { className: "action", color: "gray", onClick: o, children: n })
97
+ /* @__PURE__ */ r(j, { className: "action", color: "gray", onClick: d, children: c })
100
98
  ] })
101
99
  );
102
- }), G = s((r, w) => {
100
+ }), L = ({ limit: t = 3, isLoading: l = !1, keyPrefix: i }) => /* @__PURE__ */ r(g, { children: Array.from({ length: t }, (n, o) => /* @__PURE__ */ r(
101
+ E,
102
+ {
103
+ isLoading: l
104
+ },
105
+ `${i}-skeleton-product-card-${o}`
106
+ )) }), _ = ({
107
+ children: t,
108
+ fallbackComponent: l = /* @__PURE__ */ r(g, {}),
109
+ isLoading: i = !1,
110
+ limit: n,
111
+ keyPrefix: o
112
+ }) => /* @__PURE__ */ r($, { fallbackComponent: l, children: i === !0 ? /* @__PURE__ */ r(
113
+ L,
114
+ {
115
+ isLoading: i,
116
+ limit: n,
117
+ keyPrefix: o
118
+ }
119
+ ) : t }), v = B(I), K = u((t, l) => {
103
120
  const {
104
- icon: l,
105
- title: m,
106
- onButtonAction: d = () => {
121
+ icon: i,
122
+ title: n,
123
+ onButtonAction: o = () => {
124
+ },
125
+ onSelectCard: d = () => {
107
126
  },
108
- onSelectCard: o = () => {
127
+ buttonLink: c,
128
+ items: a,
129
+ buttonText: k,
130
+ limit: s = 3,
131
+ isLoading: y = !1
132
+ } = t, C = R(), N = M(() => /* @__PURE__ */ r(g, { children: C === !0 ? a == null ? void 0 : a.map((e, p) => /* @__PURE__ */ r(
133
+ v,
134
+ {
135
+ title: e == null ? void 0 : e.title,
136
+ image: e == null ? void 0 : e.image,
137
+ text: e == null ? void 0 : e.text,
138
+ titleSlug: e == null ? void 0 : e.titleSlug,
139
+ onCardClick: () => d(e == null ? void 0 : e.uuid)
109
140
  },
110
- buttonLink: n,
111
- items: i,
112
- buttonText: y,
113
- limit: g = 3
114
- } = r, k = S();
115
- return /* @__PURE__ */ a(R, { children: [
116
- /* @__PURE__ */ a("div", { className: "regular-title", children: [
117
- /* @__PURE__ */ a("div", { className: "regular-title-text", children: [
118
- u(l) && /* @__PURE__ */ t("i", { className: l }),
119
- /* @__PURE__ */ t("span", { children: m })
141
+ p
142
+ )) : a == null ? void 0 : a.slice(0, s).map((e, p) => /* @__PURE__ */ r(
143
+ v,
144
+ {
145
+ title: e == null ? void 0 : e.title,
146
+ image: e == null ? void 0 : e.image,
147
+ text: e == null ? void 0 : e.text,
148
+ titleSlug: e == null ? void 0 : e.titleSlug,
149
+ onCardClick: () => d(e == null ? void 0 : e.uuid)
150
+ },
151
+ p
152
+ )) }), [a]);
153
+ return /* @__PURE__ */ m(z, { ref: l, children: [
154
+ /* @__PURE__ */ m("div", { className: "regular-title", children: [
155
+ /* @__PURE__ */ m("div", { className: "regular-title-text", children: [
156
+ f(i) && /* @__PURE__ */ r("i", { className: i }),
157
+ /* @__PURE__ */ r("span", { children: n })
120
158
  ] }),
121
- u(n) && /* @__PURE__ */ t(
122
- T,
159
+ f(c) && /* @__PURE__ */ r(
160
+ W,
123
161
  {
124
162
  type: "button",
125
163
  btnType: "tinted",
126
164
  color: "gray",
127
- onClick: () => d(n),
165
+ onClick: () => o(c),
128
166
  borderRadius: "curved",
129
- children: y
167
+ children: k
130
168
  }
131
169
  )
132
170
  ] }),
133
- /* @__PURE__ */ t(B, { limit: g, children: k === !0 ? i == null ? void 0 : i.map((e, c) => /* @__PURE__ */ t(
134
- h,
135
- {
136
- title: e == null ? void 0 : e.title,
137
- image: e == null ? void 0 : e.image,
138
- text: e == null ? void 0 : e.text,
139
- titleSlug: e == null ? void 0 : e.titleSlug,
140
- onCardClick: () => o(e == null ? void 0 : e.uuid)
141
- },
142
- c
143
- )) : i == null ? void 0 : i.slice(0, g).map((e, c) => /* @__PURE__ */ t(
144
- h,
171
+ /* @__PURE__ */ r(A, { limit: s, children: /* @__PURE__ */ r(
172
+ _,
145
173
  {
146
- title: e == null ? void 0 : e.title,
147
- image: e == null ? void 0 : e.image,
148
- text: e == null ? void 0 : e.text,
149
- titleSlug: e == null ? void 0 : e.titleSlug,
150
- onCardClick: () => o(e == null ? void 0 : e.uuid)
151
- },
152
- c
153
- )) })
174
+ isLoading: y,
175
+ limit: s,
176
+ keyPrefix: "explore-landing",
177
+ children: N
178
+ }
179
+ ) })
154
180
  ] });
155
181
  });
156
182
  export {
157
- G as default
183
+ K as default
158
184
  };
@@ -1,13 +1,13 @@
1
- "use strict";const t=require("react/jsx-runtime"),s=require("react"),m=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),g=require("./consts-CtNoHdBj.cjs"),w=require("./useDetectMobile-D6d5LpdL.cjs"),d=require("./utils-NZLCh-J5.cjs"),b=require("./Button.cjs"),f=m.newStyled.div`
1
+ "use strict";const t=require("react/jsx-runtime"),a=require("react"),u=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),h=require("./consts-CtNoHdBj.cjs"),b=require("./useDetectMobile-D6d5LpdL.cjs"),m=require("./utils-NZLCh-J5.cjs"),j=require("./Button.cjs"),S=u.newStyled.div`
2
2
  display: grid;
3
3
  grid-template-columns: ${i=>`repeat(${i.limit}, minmax(0, 1fr))`};
4
4
  gap: 1.25rem;
5
5
  margin: auto;
6
-
7
- @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
6
+ width: fit-content;
7
+ @media (max-width: ${h.MOBILE_SIZE_PX+"px"}) {
8
8
  grid-template-columns: repeat(1, 1fr);
9
9
  }
10
- `,h=m.newStyled.div`
10
+ `,p=u.newStyled.div`
11
11
  display: flex;
12
12
  flex-direction: column;
13
13
  width: 100%;
@@ -44,13 +44,13 @@
44
44
  min-height: 6rem;
45
45
  max-height: 6rem;
46
46
  border-radius: 0.75rem;
47
- background-color: ${d.linearGradientAnimation("-90deg")};
47
+ background-color: ${m.linearGradientAnimation("-90deg")};
48
48
  }
49
49
 
50
- @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
50
+ @media (max-width: ${h.MOBILE_SIZE_PX+"px"}) {
51
51
  max-width: unset;
52
52
  }
53
- `,p=m.newStyled.div`
53
+ `,f=u.newStyled.div`
54
54
  text-align: center;
55
55
  display: flex;
56
56
  flex-direction: column;
@@ -65,7 +65,7 @@
65
65
  & .skeleton-title {
66
66
  height: 1.75rem;
67
67
  width: 80%;
68
- background-color: ${d.linearGradientAnimation("-90deg")};
68
+ background-color: ${m.linearGradientAnimation("-90deg")};
69
69
  }
70
70
 
71
71
  & .text-wr {
@@ -73,6 +73,6 @@
73
73
  font-size: 0.875rem;
74
74
  flex: 1;
75
75
  color: var(--gray-700, #4e555f);
76
- ${d.truncateTextInRows(3)}
76
+ ${m.truncateTextInRows(3)}
77
77
  }
78
- `;s.forwardRef((i,c)=>{const{onCardClick:r}=i;return t.jsxs(h,{className:"product-card",onClick:r,children:[t.jsx("div",{"skeleton-img":!0}),t.jsx(p,{children:t.jsx("div",{className:"skeleton-title"})})]})});const u=s.forwardRef((i,c)=>{const{title:r,image:n,text:o,buttonText:a,onCardClick:e}=i;return t.jsxs(h,{className:"blog-card",onClick:e,children:[t.jsx("img",{src:n}),t.jsxs(p,{children:[t.jsx("div",{className:"text-wr-title",children:r}),t.jsx("div",{className:"text-wr",children:o})]}),t.jsx(b,{borderRadius:"curved",color:"gray",type:"button",btnType:"outline",onClick:e,size:"medium",children:a})]})}),j=s.forwardRef((i,c)=>{const{items:r,limit:n=3,onSelectCard:o=()=>{}}=i,a=w.useDetectMobile();return t.jsx(f,{limit:n,children:a===!0?r==null?void 0:r.map((e,l)=>t.jsx(u,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>o(e==null?void 0:e.uuid)},l)):r==null?void 0:r.slice(0,n).map((e,l)=>t.jsx(u,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>o(e==null?void 0:e.uuid)},l))})});module.exports=j;
78
+ `,C=a.forwardRef((i,l)=>{const{onCardClick:r}=i;return t.jsxs(p,{className:"product-card",onClick:r,children:[t.jsx("div",{"skeleton-img":!0}),t.jsx(f,{children:t.jsx("div",{className:"skeleton-title"})})]})}),k=a.forwardRef((i,l)=>{const{title:r,image:n,text:o,buttonText:s,onCardClick:d}=i;return t.jsxs(p,{className:"blog-card",onClick:d,children:[t.jsx("img",{src:n}),t.jsxs(f,{children:[t.jsx("div",{className:"text-wr-title",children:r}),t.jsx("div",{className:"text-wr",children:o})]}),t.jsx(j,{borderRadius:"curved",color:"gray",type:"button",btnType:"outline",onClick:d,size:"medium",children:s})]})}),y=({limit:i=3,isLoading:l=!1,keyPrefix:r})=>t.jsx(t.Fragment,{children:Array.from({length:i},(n,o)=>t.jsx(C,{isLoading:l},`${r}-skeleton-product-card-${o}`))}),v=({children:i,fallbackComponent:l=t.jsx(t.Fragment,{}),isLoading:r=!1,limit:n,keyPrefix:o})=>t.jsx(a.Suspense,{fallbackComponent:l,children:r===!0?t.jsx(y,{isLoading:r,limit:n,keyPrefix:o}):i}),g=a.memo(k),x=a.forwardRef((i,l)=>{const{items:r,limit:n=3,onSelectCard:o=()=>{},isLoading:s=!1}=i,d=b.useDetectMobile(),w=a.useMemo(()=>t.jsx(t.Fragment,{children:d===!0?r==null?void 0:r.map((e,c)=>t.jsx(g,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>o(e==null?void 0:e.uuid)},c)):r==null?void 0:r.slice(0,n).map((e,c)=>t.jsx(g,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>o(e==null?void 0:e.uuid)},c))}),[r,d,n,o]);return t.jsx(S,{ref:l,limit:n,children:t.jsx(v,{isLoading:s,limit:n,keyPrefix:"explore-landing",children:w})})});module.exports=x;
@@ -1,20 +1,20 @@
1
- import { jsxs as l, jsx as r } from "react/jsx-runtime";
2
- import { forwardRef as d } from "react";
3
- import { n as c } from "./emotion-styled.browser.esm-CjCaF13H.js";
4
- import { M as p } from "./consts-C1uHV4xc.js";
5
- import { u as b } from "./useDetectMobile-BC6EGaBc.js";
6
- import { m as u, t as w } from "./utils-DtRLzzTZ.js";
7
- import C from "./Button.js";
8
- const k = c.div`
1
+ import { jsxs as c, jsx as t, Fragment as s } from "react/jsx-runtime";
2
+ import { forwardRef as u, Suspense as k, memo as S, useMemo as v } from "react";
3
+ import { n as g } from "./emotion-styled.browser.esm-CjCaF13H.js";
4
+ import { M as h } from "./consts-C1uHV4xc.js";
5
+ import { u as y } from "./useDetectMobile-BC6EGaBc.js";
6
+ import { m as f, t as $ } from "./utils-DtRLzzTZ.js";
7
+ import T from "./Button.js";
8
+ const B = g.div`
9
9
  display: grid;
10
10
  grid-template-columns: ${(i) => `repeat(${i.limit}, minmax(0, 1fr))`};
11
11
  gap: 1.25rem;
12
12
  margin: auto;
13
-
14
- @media (max-width: ${p + "px"}) {
13
+ width: fit-content;
14
+ @media (max-width: ${h + "px"}) {
15
15
  grid-template-columns: repeat(1, 1fr);
16
16
  }
17
- `, h = c.div`
17
+ `, w = g.div`
18
18
  display: flex;
19
19
  flex-direction: column;
20
20
  width: 100%;
@@ -51,13 +51,13 @@ const k = c.div`
51
51
  min-height: 6rem;
52
52
  max-height: 6rem;
53
53
  border-radius: 0.75rem;
54
- background-color: ${u("-90deg")};
54
+ background-color: ${f("-90deg")};
55
55
  }
56
56
 
57
- @media (max-width: ${p + "px"}) {
57
+ @media (max-width: ${h + "px"}) {
58
58
  max-width: unset;
59
59
  }
60
- `, f = c.div`
60
+ `, b = g.div`
61
61
  text-align: center;
62
62
  display: flex;
63
63
  flex-direction: column;
@@ -72,7 +72,7 @@ const k = c.div`
72
72
  & .skeleton-title {
73
73
  height: 1.75rem;
74
74
  width: 80%;
75
- background-color: ${u("-90deg")};
75
+ background-color: ${f("-90deg")};
76
76
  }
77
77
 
78
78
  & .text-wr {
@@ -80,70 +80,100 @@ const k = c.div`
80
80
  font-size: 0.875rem;
81
81
  flex: 1;
82
82
  color: var(--gray-700, #4e555f);
83
- ${w(3)}
83
+ ${$(3)}
84
84
  }
85
- `;
86
- d((i, s) => {
87
- const { onCardClick: t } = i;
85
+ `, M = u((i, a) => {
86
+ const { onCardClick: r } = i;
88
87
  return (
89
88
  // <SimpleBlogCardSkeleton />
90
- /* @__PURE__ */ l(h, { className: "product-card", onClick: t, children: [
91
- /* @__PURE__ */ r("div", { "skeleton-img": !0 }),
92
- /* @__PURE__ */ r(f, { children: /* @__PURE__ */ r("div", { className: "skeleton-title" }) })
89
+ /* @__PURE__ */ c(w, { className: "product-card", onClick: r, children: [
90
+ /* @__PURE__ */ t("div", { "skeleton-img": !0 }),
91
+ /* @__PURE__ */ t(b, { children: /* @__PURE__ */ t("div", { className: "skeleton-title" }) })
93
92
  ] })
94
93
  );
95
- });
96
- const g = d((i, s) => {
97
- const { title: t, image: o, text: a, buttonText: m, onCardClick: e } = i;
94
+ }), z = u((i, a) => {
95
+ const { title: r, image: o, text: n, buttonText: m, onCardClick: l } = i;
98
96
  return (
99
97
  // <SimpleBlogCardCenteredSkeleton />
100
- /* @__PURE__ */ l(h, { className: "blog-card", onClick: e, children: [
101
- /* @__PURE__ */ r("img", { src: o }),
102
- /* @__PURE__ */ l(f, { children: [
103
- /* @__PURE__ */ r("div", { className: "text-wr-title", children: t }),
104
- /* @__PURE__ */ r("div", { className: "text-wr", children: a })
98
+ /* @__PURE__ */ c(w, { className: "blog-card", onClick: l, children: [
99
+ /* @__PURE__ */ t("img", { src: o }),
100
+ /* @__PURE__ */ c(b, { children: [
101
+ /* @__PURE__ */ t("div", { className: "text-wr-title", children: r }),
102
+ /* @__PURE__ */ t("div", { className: "text-wr", children: n })
105
103
  ] }),
106
- /* @__PURE__ */ r(
107
- C,
104
+ /* @__PURE__ */ t(
105
+ T,
108
106
  {
109
107
  borderRadius: "curved",
110
108
  color: "gray",
111
109
  type: "button",
112
110
  btnType: "outline",
113
- onClick: e,
111
+ onClick: l,
114
112
  size: "medium",
115
113
  children: m
116
114
  }
117
115
  )
118
116
  ] })
119
117
  );
120
- }), M = d((i, s) => {
121
- const { items: t, limit: o = 3, onSelectCard: a = () => {
122
- } } = i, m = b();
123
- return /* @__PURE__ */ r(k, { limit: o, children: m === !0 ? t == null ? void 0 : t.map((e, n) => /* @__PURE__ */ r(
124
- g,
118
+ }), N = ({ limit: i = 3, isLoading: a = !1, keyPrefix: r }) => /* @__PURE__ */ t(s, { children: Array.from({ length: i }, (o, n) => /* @__PURE__ */ t(
119
+ M,
120
+ {
121
+ isLoading: a
122
+ },
123
+ `${r}-skeleton-product-card-${n}`
124
+ )) }), P = ({
125
+ children: i,
126
+ fallbackComponent: a = /* @__PURE__ */ t(s, {}),
127
+ isLoading: r = !1,
128
+ limit: o,
129
+ keyPrefix: n
130
+ }) => /* @__PURE__ */ t(k, { fallbackComponent: a, children: r === !0 ? /* @__PURE__ */ t(
131
+ N,
132
+ {
133
+ isLoading: r,
134
+ limit: o,
135
+ keyPrefix: n
136
+ }
137
+ ) : i }), p = S(z), G = u((i, a) => {
138
+ const {
139
+ items: r,
140
+ limit: o = 3,
141
+ onSelectCard: n = () => {
142
+ },
143
+ isLoading: m = !1
144
+ } = i, l = y(), C = v(() => /* @__PURE__ */ t(s, { children: l === !0 ? r == null ? void 0 : r.map((e, d) => /* @__PURE__ */ t(
145
+ p,
125
146
  {
126
147
  title: e == null ? void 0 : e.title,
127
148
  image: e == null ? void 0 : e.image,
128
149
  text: e == null ? void 0 : e.text,
129
150
  titleSlug: e == null ? void 0 : e.titleSlug,
130
151
  buttonText: e == null ? void 0 : e.buttonText,
131
- onCardClick: () => a(e == null ? void 0 : e.uuid)
152
+ onCardClick: () => n(e == null ? void 0 : e.uuid)
132
153
  },
133
- n
134
- )) : t == null ? void 0 : t.slice(0, o).map((e, n) => /* @__PURE__ */ r(
135
- g,
154
+ d
155
+ )) : r == null ? void 0 : r.slice(0, o).map((e, d) => /* @__PURE__ */ t(
156
+ p,
136
157
  {
137
158
  title: e == null ? void 0 : e.title,
138
159
  image: e == null ? void 0 : e.image,
139
160
  text: e == null ? void 0 : e.text,
140
161
  titleSlug: e == null ? void 0 : e.titleSlug,
141
162
  buttonText: e == null ? void 0 : e.buttonText,
142
- onCardClick: () => a(e == null ? void 0 : e.uuid)
163
+ onCardClick: () => n(e == null ? void 0 : e.uuid)
143
164
  },
144
- n
145
- )) });
165
+ d
166
+ )) }), [r, l, o, n]);
167
+ return /* @__PURE__ */ t(B, { ref: a, limit: o, children: /* @__PURE__ */ t(
168
+ P,
169
+ {
170
+ isLoading: m,
171
+ limit: o,
172
+ keyPrefix: "explore-landing",
173
+ children: C
174
+ }
175
+ ) });
146
176
  });
147
177
  export {
148
- M as default
178
+ G as default
149
179
  };
@@ -1,12 +1,12 @@
1
- "use strict";const t=require("react/jsx-runtime"),m=require("react"),g=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),p=require("./consts-CtNoHdBj.cjs"),v=require("./useDetectMobile-D6d5LpdL.cjs"),n=require("./utils-NZLCh-J5.cjs"),k=require("./style-BR3tIhP1.cjs"),y=require("./Button.cjs"),C=require("./Link.cjs"),N=require("./index-Q_i-aqsF.cjs"),q=g.newStyled.div`
1
+ "use strict";const t=require("react/jsx-runtime"),c=require("react"),h=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),w=require("./consts-CtNoHdBj.cjs"),C=require("./useDetectMobile-D6d5LpdL.cjs"),a=require("./utils-NZLCh-J5.cjs"),N=require("./style-DN1qT8BE.cjs"),q=require("./Button.cjs"),T=require("./Link.cjs"),$=require("./index-Dn5tPLgP.cjs"),B=h.newStyled.div`
2
2
  display: grid;
3
- grid-template-columns: ${r=>`repeat(${r.limit}, minmax(0, 1fr))`};
3
+ grid-template-columns: ${i=>`repeat(${i.limit}, minmax(0, 1fr))`};
4
4
  gap: 1.25rem;
5
5
 
6
- @media (max-width: ${p.MOBILE_SIZE_PX+"px"}) {
6
+ @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
7
7
  grid-template-columns: repeat(1, 1fr);
8
8
  }
9
- `,b=g.newStyled.div`
9
+ `,x=h.newStyled.div`
10
10
  display: flex;
11
11
  width: 100%;
12
12
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1),
@@ -35,16 +35,16 @@
35
35
  min-height: 3.3125rem;
36
36
  max-height: 3.3125rem;
37
37
  border-radius: 0.75rem;
38
- background-color: ${n.linearGradientAnimation("-90deg")};
38
+ background-color: ${a.linearGradientAnimation("-90deg")};
39
39
  }
40
40
 
41
41
  & a {
42
42
  margin-top: auto;
43
43
  }
44
44
 
45
- @media (max-width: ${p.MOBILE_SIZE_PX+"px"}) {
45
+ @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
46
46
  }
47
- `,w=g.newStyled.div`
47
+ `,S=h.newStyled.div`
48
48
  display: flex;
49
49
  flex-direction: column;
50
50
  gap: 0.5rem;
@@ -58,19 +58,19 @@
58
58
  & .skeleton-title {
59
59
  height: 1.5rem;
60
60
  width: 80%;
61
- background-color: ${n.linearGradientAnimation("-90deg")};
61
+ background-color: ${a.linearGradientAnimation("-90deg")};
62
62
  }
63
63
 
64
64
  & .skeleton-action {
65
65
  height: 1.25rem;
66
66
  width: 20%;
67
- background-color: ${n.linearGradientAnimation("-90deg")};
67
+ background-color: ${a.linearGradientAnimation("-90deg")};
68
68
  }
69
69
 
70
70
  & .text-wr {
71
71
  font-weight: 400;
72
72
  font-size: 0.875rem;
73
73
  color: var(--gray-700, #4e555f);
74
- ${n.truncateTextInRows(3)}
74
+ ${a.truncateTextInRows(3)}
75
75
  }
76
- `;m.forwardRef(({},r)=>t.jsxs(b,{className:"blog-card",children:[t.jsxs(w,{children:[t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"text-wr"}),t.jsx("div",{className:"skeleton-action"})]}),t.jsx("div",{className:"skeleton-img"})]}));const h=m.forwardRef((r,j)=>{const{title:l,image:s,text:i,buttonText:c,onCardClick:o}=r;return t.jsxs(b,{className:"blog-card",onClick:o,children:[t.jsxs(w,{children:[t.jsx("div",{className:"text-wr-title",children:l}),t.jsx("div",{className:"text-wr",children:i}),t.jsx(C,{color:"gray",onClick:o,children:c})]}),t.jsx("img",{src:s})]})}),T=m.forwardRef((r,j)=>{const{icon:l,title:s,items:i,buttonText:c,limit:o=3,options:a,onActionClick:f=()=>{},onSelectOption:u=()=>{}}=r,S=v.useDetectMobile();return t.jsxs(k.TitleWithOptionsSectionWrapper,{children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[n.isDefinedNotEmptyString(l)&&t.jsx("i",{className:l}),t.jsx("span",{children:s})]}),n.isDefinedNotEmptyString(onSectionClick)&&t.jsx(y,{type:"button",btnType:"tinted",color:"gray",onClick:f,borderRadius:"curved",children:c})]}),(a==null?void 0:a.length)>0&&t.jsx(N.SelectBar,{items:a,onRemove:e=>{u(e)},onSelect:e=>{u(e)},labelKey:"name",valueKey:"code",noMargin:!0}),t.jsx(q,{limit:o,children:S===!0?i==null?void 0:i.map((e,d)=>t.jsx(h,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>onSelectCard(e==null?void 0:e.uuid)},d)):i==null?void 0:i.slice(0,o).map((e,d)=>t.jsx(h,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>onSelectCard(e==null?void 0:e.uuid)},d))})]})});module.exports=T;
76
+ `,M=c.forwardRef(({},i)=>t.jsxs(x,{className:"blog-card",children:[t.jsxs(S,{children:[t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"text-wr"}),t.jsx("div",{className:"skeleton-action"})]}),t.jsx("div",{className:"skeleton-img"})]})),R=c.forwardRef((i,s)=>{const{title:n,image:l,text:r,buttonText:m,onCardClick:o}=i;return t.jsxs(x,{className:"blog-card",onClick:o,children:[t.jsxs(S,{children:[t.jsx("div",{className:"text-wr-title",children:n}),t.jsx("div",{className:"text-wr",children:r}),t.jsx(T,{color:"gray",onClick:o,children:m})]}),t.jsx("img",{src:l})]})}),W=({limit:i=3,isLoading:s=!1,keyPrefix:n})=>t.jsx(t.Fragment,{children:Array.from({length:i},(l,r)=>t.jsx(M,{isLoading:s},`${n}-skeleton-product-card-${r}`))}),_=({children:i,fallbackComponent:s=t.jsx(t.Fragment,{}),isLoading:n=!1,limit:l,keyPrefix:r})=>t.jsx(c.Suspense,{fallbackComponent:s,children:n===!0?t.jsx(W,{isLoading:n,limit:l,keyPrefix:r}):i}),f=c.memo(R),z=c.forwardRef((i,s)=>{const{icon:n,title:l,items:r,buttonText:m,limit:o=3,options:d,onButtonAction:p=()=>{},buttonLink:k,onSelectOption:j=()=>{},isLoading:y=!1,onSelectCard:g=()=>{}}=i,b=C.useDetectMobile(),v=c.useMemo(()=>t.jsx(t.Fragment,{children:b===!0?r==null?void 0:r.map((e,u)=>t.jsx(f,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>g(e)},u)):r==null?void 0:r.slice(0,o).map((e,u)=>t.jsx(f,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,text:e==null?void 0:e.text,titleSlug:e==null?void 0:e.titleSlug,buttonText:e==null?void 0:e.buttonText,onCardClick:()=>g(e)},u))}),[r,b,o,g]);return t.jsxs(N.TitleWithOptionsSectionWrapper,{ref:s,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[a.isDefinedNotEmptyString(n)&&t.jsx("i",{className:n}),t.jsx("span",{children:l})]}),a.isDefinedNotEmptyString(p)&&t.jsx(q,{type:"button",btnType:"tinted",color:"gray",onClick:()=>p(k),borderRadius:"curved",children:m})]}),(d==null?void 0:d.length)>0&&t.jsx($.SelectBar,{items:d,onRemove:e=>{j(e)},onSelect:e=>{j(e)},labelKey:"name",valueKey:"code",noMargin:!0}),t.jsx(B,{limit:o,children:t.jsx(_,{isLoading:y,limit:o,keyPrefix:"explore-landing",children:v})})]})});module.exports=z;