@lanaco/lnc-react-ui 4.0.131 → 4.0.132

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.
@@ -1,14 +1,14 @@
1
- import { jsxs as a, jsx as t } from "react/jsx-runtime";
2
- import { forwardRef as v, memo as j, useMemo as I } from "react";
3
- import w from "./Icon.js";
4
- import d from "./IconButton.js";
5
- import P from "./Chip.js";
6
- import { p as R, s as C, v as z, w as y } from "./utils-BPdU4_1q.js";
7
- import { P as T } from "./index-3TFXgZHA.js";
8
- import { s as k } from "./emotion-styled.browser.esm-BNN1dTl3.js";
9
- import { M as $ } from "./consts-BuFChS64.js";
10
- import { S as L } from "./suspense-large-DrD8xVZi.js";
11
- const B = k.div`
1
+ import { jsxs as i, jsx as t } from "react/jsx-runtime";
2
+ import { forwardRef as h, memo as v, useMemo as k } from "react";
3
+ import u from "./Icon.js";
4
+ import c from "./IconButton.js";
5
+ import { p as N, s as I, v as R, w as b } from "./utils-BPdU4_1q.js";
6
+ import { P as j } from "./index-3TFXgZHA.js";
7
+ import { B as P } from "./style-XXDQBreL.js";
8
+ import { s as w } from "./emotion-styled.browser.esm-BNN1dTl3.js";
9
+ import { M as T } from "./consts-BuFChS64.js";
10
+ import { S as $ } from "./suspense-large-DrD8xVZi.js";
11
+ const z = w.div`
12
12
  display: flex;
13
13
  padding: 1rem;
14
14
  align-items: center;
@@ -59,27 +59,13 @@ const B = k.div`
59
59
  font-weight: 600;
60
60
  line-height: 1.5rem;
61
61
  letter-spacing: 0.1px;
62
- ${R(3)}
62
+ ${N(3)}
63
63
  }
64
64
 
65
65
  & .wrapper__tags {
66
66
  display: flex;
67
67
  flex-wrap: wrap;
68
68
  gap: 0.25rem;
69
-
70
- & .wrapper__tag {
71
- font-size: 0.75rem;
72
- font-style: normal;
73
- font-weight: 500;
74
- line-height: 1rem;
75
- letter-spacing: 0.5px;
76
- padding: 0.125rem 0.5rem;
77
- justify-content: center;
78
- align-items: center;
79
- gap: 0.25rem;
80
- height: 1.25rem;
81
- border: 1px solid;
82
- }
83
69
  }
84
70
  }
85
71
 
@@ -116,7 +102,7 @@ const B = k.div`
116
102
  }
117
103
  }
118
104
 
119
- @media (max-width: ${$ + "px"}) {
105
+ @media (max-width: ${T + "px"}) {
120
106
  flex-direction: column;
121
107
  padding: 0;
122
108
  background: transparent;
@@ -166,48 +152,42 @@ const B = k.div`
166
152
  }
167
153
  }
168
154
  }
169
- `, M = v(
155
+ `, B = h(
170
156
  ({
171
157
  title: p,
172
158
  imageUrl: n,
173
- options: i,
174
- publishedAt: l,
175
- timeToReadText: o = "{0} min read",
176
- timeToRead: s = 0,
177
- numberOfLikes: g = 0,
159
+ options: a,
160
+ publishedAt: o,
161
+ timeToReadText: l = "{0} min read",
162
+ timeToRead: d = 0,
163
+ numberOfLikes: m = 0,
178
164
  numberOfComments: f = 0,
179
- isBookmarked: c = !1,
180
- onSelectCard: b = () => {
181
- },
182
- onSelectOption: _ = () => {
165
+ isBookmarked: g = !1,
166
+ onSelectCard: _ = () => {
183
167
  },
184
168
  onBookmark: e = () => {
185
169
  },
186
- onShare: m = () => {
170
+ onShare: s = () => {
187
171
  }
188
- }, h) => /* @__PURE__ */ a(B, { onClick: b, className: "blog-card-item", children: [
189
- /* @__PURE__ */ t(T, { src: n, className: "wrapper__image" }),
190
- /* @__PURE__ */ a("div", { className: "wrapper__content", children: [
191
- /* @__PURE__ */ a("div", { className: "wrapper__subcontent", children: [
172
+ }, O) => /* @__PURE__ */ i(z, { onClick: _, className: "blog-card-item", children: [
173
+ /* @__PURE__ */ t(j, { src: n, className: "wrapper__image" }),
174
+ /* @__PURE__ */ i("div", { className: "wrapper__content", children: [
175
+ /* @__PURE__ */ i("div", { className: "wrapper__subcontent", children: [
192
176
  /* @__PURE__ */ t("div", { className: "wrapper__title", children: p }),
193
- /* @__PURE__ */ a("div", { className: "wrapper__tags-action", children: [
194
- /* @__PURE__ */ t("div", { className: "wrapper__tags", children: i && (i == null ? void 0 : i.map((r, N) => /* @__PURE__ */ t(
177
+ /* @__PURE__ */ i("div", { className: "wrapper__tags-action", children: [
178
+ /* @__PURE__ */ t("div", { className: "wrapper__tags", children: a && (a == null ? void 0 : a.map((r, y) => /* @__PURE__ */ t(
195
179
  P,
196
180
  {
197
- label: r == null ? void 0 : r.name,
198
181
  color: r == null ? void 0 : r.color,
199
- className: "wrapper__tag",
200
- onClick: (u) => {
201
- u == null || u.stopPropagation(), _(r == null ? void 0 : r.code);
202
- }
182
+ children: r == null ? void 0 : r.name
203
183
  },
204
- `blog-card-sponsored-option__${N + 1}`
184
+ `blog-card-sponsored-option__${y + 1}`
205
185
  ))) }),
206
- /* @__PURE__ */ a("div", { className: "info__content mobile-only", children: [
186
+ /* @__PURE__ */ i("div", { className: "info__content mobile-only", children: [
207
187
  /* @__PURE__ */ t(
208
- d,
188
+ c,
209
189
  {
210
- icon: c ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
190
+ icon: g ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
211
191
  borderRadius: "curved",
212
192
  btnType: "basic",
213
193
  color: "neutral",
@@ -217,41 +197,41 @@ const B = k.div`
217
197
  }
218
198
  ),
219
199
  /* @__PURE__ */ t(
220
- d,
200
+ c,
221
201
  {
222
202
  icon: " mng-lnc-share",
223
203
  borderRadius: "curved",
224
204
  btnType: "basic",
225
205
  color: "neutral",
226
206
  onClick: (r) => {
227
- r == null || r.stopPropagation(), m();
207
+ r == null || r.stopPropagation(), s();
228
208
  }
229
209
  }
230
210
  )
231
211
  ] })
232
212
  ] })
233
213
  ] }),
234
- /* @__PURE__ */ a("div", { className: "wrapper__info", children: [
235
- /* @__PURE__ */ a("div", { className: "info__content", children: [
236
- /* @__PURE__ */ t("div", { className: "info__text", children: `${C(
237
- l
238
- )} • ${z(o, s)}` }),
239
- /* @__PURE__ */ a("div", { className: "info__text", children: [
240
- /* @__PURE__ */ a("div", { children: [
241
- /* @__PURE__ */ t(w, { icon: " mng-lnc-thumbs-up--filled", sizeInUnits: "1rem" }),
242
- y(g)
214
+ /* @__PURE__ */ i("div", { className: "wrapper__info", children: [
215
+ /* @__PURE__ */ i("div", { className: "info__content", children: [
216
+ /* @__PURE__ */ t("div", { className: "info__text", children: `${I(
217
+ o
218
+ )} • ${R(l, d)}` }),
219
+ /* @__PURE__ */ i("div", { className: "info__text", children: [
220
+ /* @__PURE__ */ i("div", { children: [
221
+ /* @__PURE__ */ t(u, { icon: " mng-lnc-thumbs-up--filled", sizeInUnits: "1rem" }),
222
+ b(m)
243
223
  ] }),
244
- /* @__PURE__ */ a("div", { children: [
245
- /* @__PURE__ */ t(w, { icon: " mng-lnc-messages-filled", sizeInUnits: "1rem" }),
246
- y(f)
224
+ /* @__PURE__ */ i("div", { children: [
225
+ /* @__PURE__ */ t(u, { icon: " mng-lnc-messages-filled", sizeInUnits: "1rem" }),
226
+ b(f)
247
227
  ] })
248
228
  ] })
249
229
  ] }),
250
- /* @__PURE__ */ a("div", { className: "info__content desktop-only", children: [
230
+ /* @__PURE__ */ i("div", { className: "info__content desktop-only", children: [
251
231
  /* @__PURE__ */ t(
252
- d,
232
+ c,
253
233
  {
254
- icon: c ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
234
+ icon: g ? " mng-lnc-bookmark--filled" : " mng-lnc-bookmark",
255
235
  borderRadius: "curved",
256
236
  btnType: "basic",
257
237
  color: "neutral",
@@ -261,14 +241,14 @@ const B = k.div`
261
241
  }
262
242
  ),
263
243
  /* @__PURE__ */ t(
264
- d,
244
+ c,
265
245
  {
266
246
  icon: " mng-lnc-share",
267
247
  borderRadius: "curved",
268
248
  btnType: "basic",
269
249
  color: "neutral",
270
250
  onClick: (r) => {
271
- r == null || r.stopPropagation(), m();
251
+ r == null || r.stopPropagation(), s();
272
252
  }
273
253
  }
274
254
  )
@@ -276,7 +256,7 @@ const B = k.div`
276
256
  ] })
277
257
  ] })
278
258
  ] })
279
- ), U = k.div`
259
+ ), C = w.div`
280
260
  display: flex;
281
261
  flex-direction: column;
282
262
  align-items: flex-start;
@@ -300,25 +280,23 @@ const B = k.div`
300
280
  bottom: -1.25rem;
301
281
  }
302
282
  }
303
- `, W = j(M), J = v(
283
+ `, L = v(B), F = h(
304
284
  ({
305
285
  timeToReadText: p = "{0} min read",
306
286
  items: n,
307
- onSelectCard: i = () => {
308
- },
309
- onSelectOption: l = () => {
287
+ onSelectCard: a = () => {
310
288
  },
311
289
  onShare: o = () => {
312
290
  },
313
- onBookmark: s = () => {
291
+ onBookmark: l = () => {
314
292
  },
315
- isLoading: g = !1,
316
- getImage: f = () => {
293
+ isLoading: d = !1,
294
+ getImage: m = () => {
317
295
  },
318
- isSeparated: c = !0
319
- }, b) => {
320
- const _ = I(() => n == null ? void 0 : n.map((e, m) => /* @__PURE__ */ t(
321
- W,
296
+ isSeparated: f = !0
297
+ }, g) => {
298
+ const _ = k(() => n == null ? void 0 : n.map((e, s) => /* @__PURE__ */ t(
299
+ L,
322
300
  {
323
301
  title: e == null ? void 0 : e.title,
324
302
  titleSlug: e == null ? void 0 : e.titleSlug,
@@ -330,18 +308,17 @@ const B = k.div`
330
308
  numberOfComments: e == null ? void 0 : e.numberOfComments,
331
309
  isSponsored: e == null ? void 0 : e.isSponsored,
332
310
  isBookmarked: e == null ? void 0 : e.isBookmarked,
333
- onSelectCard: () => i == null ? void 0 : i(e),
334
- onSelectOption: (h) => l == null ? void 0 : l(h),
311
+ onSelectCard: () => a == null ? void 0 : a(e),
335
312
  onShare: () => o == null ? void 0 : o(e),
336
- onBookmark: () => s == null ? void 0 : s(e),
337
- imageUrl: f(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null
313
+ onBookmark: () => l == null ? void 0 : l(e),
314
+ imageUrl: m(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null
338
315
  },
339
- `blog-card-item__${m + 1}`
316
+ `blog-card-item__${s + 1}`
340
317
  )), [n]);
341
- return /* @__PURE__ */ t(U, { className: c ? "separated" : "", children: /* @__PURE__ */ t(
342
- L,
318
+ return /* @__PURE__ */ t(C, { className: f ? "separated" : "", children: /* @__PURE__ */ t(
319
+ $,
343
320
  {
344
- isLoading: g,
321
+ isLoading: d,
345
322
  limit: 5,
346
323
  keyPrefix: "blog-section",
347
324
  children: _
@@ -350,5 +327,5 @@ const B = k.div`
350
327
  }
351
328
  );
352
329
  export {
353
- J as default
330
+ F as default
354
331
  };
@@ -1,6 +1,6 @@
1
1
  import { jsx as e, Fragment as a } from "react/jsx-runtime";
2
2
  import { Suspense as s, forwardRef as u } from "react";
3
- import { B as d } from "./index-EE-IJbC3.js";
3
+ import { B as d } from "./index-DJ545v7b.js";
4
4
  import { B as c } from "./skeleton-PMiYQLOs.js";
5
5
  const f = ({ limit: o = 1, isLoading: t = !1, keyPrefix: l }) => /* @__PURE__ */ e(a, { children: Array.from({ length: o }, (r, n) => /* @__PURE__ */ e(
6
6
  c,
@@ -16,7 +16,6 @@
16
16
  border-radius: 0.75rem;
17
17
  border: 1px solid var(--gray-95008, #14161a14);
18
18
  overflow: hidden;
19
- max-height: 21.5625rem;
20
19
  min-height: 21.5625rem;
21
20
  cursor: pointer;
22
21
  &:hover {
@@ -39,6 +38,7 @@
39
38
  & .tags-wr {
40
39
  margin-top: auto;
41
40
  display: flex;
41
+ flex-wrap: wrap;
42
42
 
43
43
  gap: 0.5rem;
44
44
  padding: 0 1rem 1rem 1rem;
@@ -47,9 +47,6 @@
47
47
  @media (max-width: ${k.MOBILE_SIZE_PX+"px"}) {
48
48
  max-height: 100%;
49
49
  min-height: 100%;
50
- & .tags-wr {
51
- flex-wrap: wrap;
52
- }
53
50
  }
54
51
  `,S=w.styled.div`
55
52
  padding: 1rem 1rem 0 1rem;
@@ -110,4 +107,4 @@
110
107
  align-items: center;
111
108
  gap: 1rem;
112
109
  }
113
- `,$=u.forwardRef((i,a)=>{const{title:s,imageUrl:m,text:o,numberOfLikes:n,numberOfComments:h,timeToRead:p,publishedAt:c,tags:d,onCardClick:j,timeToReadText:f="{0} min read"}=i;return t.jsxs(v,{ref:a,className:"blog-card",onClick:j,children:[t.jsx(O.ProductImageWrapper,{src:m}),t.jsxs(S,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[r.formatLocaleDateString(c)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),p&&f?`${r.formatString(f,p)}`:"N/A"]}),t.jsxs("div",{className:"info-wr-2",children:[t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-thumbs-up--filled"}),t.jsx("span",{children:r.getRoundedNumber(n)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:r.getRoundedNumber(h)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:s}),t.jsx("div",{className:"text-wr",children:o})]}),t.jsx("div",{className:"tags-wr",children:d==null?void 0:d.map((l,b)=>t.jsx(y.BlogTag,{color:l==null?void 0:l.color,children:l==null?void 0:l.name},b))})]})}),D=u.forwardRef(({},i)=>t.jsxs(v,{className:"blog-card",children:[t.jsx("div",{className:"skeleton-img"}),t.jsxs(S,{children:[t.jsx("div",{className:"info-wr"}),t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"info-wr-skeleton"})]})]})),q=({limit:i=3,isLoading:a=!1,keyPrefix:s})=>t.jsx(t.Fragment,{children:Array.from({length:i},(m,o)=>t.jsx(D,{isLoading:a},`${s}-skeleton-product-card-${o}`))}),B=({children:i,fallbackComponent:a=t.jsx(t.Fragment,{}),isLoading:s=!1,limit:m,keyPrefix:o})=>t.jsx(u.Suspense,{fallbackComponent:a,children:s===!0?t.jsx(q,{isLoading:s,limit:m,keyPrefix:o}):i}),N=u.memo($),L=u.forwardRef((i,a)=>{const{icon:s,title:m,onButtonAction:o,items:n,buttonText:h,timeToReadText:p,limit:c=3,onSelectCard:d=()=>{},isLoading:j=!1,buttonLink:f,getImage:l=()=>{}}=i,b=R.useDetectMobile(),C=u.useMemo(()=>t.jsx(t.Fragment,{children:b===!0?n==null?void 0:n.map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,tags:e==null?void 0:e.tags,onCardClick:()=>d(e==null?void 0:e.titleSlug),imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},g)):n==null?void 0:n.slice(0,c).map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,tags:e==null?void 0:e.tags,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,onCardClick:()=>d(e==null?void 0:e.titleSlug)},g))}),[n,b,c,d]);return t.jsxs(y.RegulatTitleSectionWrapper,{ref:a,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[r.isDefinedNotEmptyString(s)&&t.jsx("i",{className:s}),t.jsx("span",{children:m})]}),r.isDefinedNotEmptyString(h)&&r.isDefinedNotEmptyString(f)&&t.jsx(T,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var g;(g=e==null?void 0:e.target)==null||g.blur(),o(f)},borderRadius:"curved",className:"button-link",children:h})]}),t.jsx(A,{limit:c,children:t.jsx(B,{isLoading:j,limit:c,keyPrefix:"explore-landing",children:C})})]})});module.exports=L;
110
+ `,$=u.forwardRef((i,o)=>{const{title:s,imageUrl:m,text:d,numberOfLikes:n,numberOfComments:h,timeToRead:p,publishedAt:c,tags:a,onCardClick:j,timeToReadText:f="{0} min read"}=i;return t.jsxs(v,{ref:o,className:"blog-card",onClick:j,children:[t.jsx(O.ProductImageWrapper,{src:m}),t.jsxs(S,{children:[t.jsxs("div",{className:"info-wr",children:[t.jsxs("div",{className:"info-wr-1",children:[t.jsxs("span",{children:[r.formatLocaleDateString(c)," "]}),t.jsx("span",{className:"small-dot",children:"●"}),p&&f?`${r.formatString(f,p)}`:"N/A"]}),t.jsxs("div",{className:"info-wr-2",children:[t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-thumbs-up--filled"}),t.jsx("span",{children:r.getRoundedNumber(n)})]}),t.jsxs("span",{className:"info-wr-1",children:[t.jsx("i",{className:"mng mng-lnc-messages-filled"}),t.jsx("span",{children:r.getRoundedNumber(h)})]})]})]}),t.jsx("div",{className:"text-wr-title",children:s}),t.jsx("div",{className:"text-wr",children:d})]}),a&&t.jsx("div",{className:"tags-wr",children:a==null?void 0:a.map((l,b)=>t.jsx(y.BlogTag,{color:l==null?void 0:l.color,children:l==null?void 0:l.name},b))})]})}),D=u.forwardRef(({},i)=>t.jsxs(v,{className:"blog-card",children:[t.jsx("div",{className:"skeleton-img"}),t.jsxs(S,{children:[t.jsx("div",{className:"info-wr"}),t.jsx("div",{className:"skeleton-title"}),t.jsx("div",{className:"info-wr-skeleton"})]})]})),q=({limit:i=3,isLoading:o=!1,keyPrefix:s})=>t.jsx(t.Fragment,{children:Array.from({length:i},(m,d)=>t.jsx(D,{isLoading:o},`${s}-skeleton-product-card-${d}`))}),B=({children:i,fallbackComponent:o=t.jsx(t.Fragment,{}),isLoading:s=!1,limit:m,keyPrefix:d})=>t.jsx(u.Suspense,{fallbackComponent:o,children:s===!0?t.jsx(q,{isLoading:s,limit:m,keyPrefix:d}):i}),N=u.memo($),L=u.forwardRef((i,o)=>{const{icon:s,title:m,onButtonAction:d,items:n,buttonText:h,timeToReadText:p,limit:c=3,onSelectCard:a=()=>{},isLoading:j=!1,buttonLink:f,getImage:l=()=>{}}=i,b=R.useDetectMobile(),C=u.useMemo(()=>t.jsx(t.Fragment,{children:b===!0?n==null?void 0:n.map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,tags:e==null?void 0:e.tags,onCardClick:()=>a(e==null?void 0:e.titleSlug),imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null},g)):n==null?void 0:n.slice(0,c).map((e,g)=>t.jsx(N,{title:e==null?void 0:e.title,imageUrl:l(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,tags:e==null?void 0:e.tags,numberOfLikes:e==null?void 0:e.numberOfLikes,numberOfComments:e==null?void 0:e.numberOfComments,publishedAt:e==null?void 0:e.publishedAt,timeToRead:e==null?void 0:e.timeToRead,timeToReadText:p,onCardClick:()=>a(e==null?void 0:e.titleSlug)},g))}),[n,b,c,a]);return t.jsxs(y.RegulatTitleSectionWrapper,{ref:o,children:[t.jsxs("div",{className:"regular-title",children:[t.jsxs("div",{className:"regular-title-text",children:[r.isDefinedNotEmptyString(s)&&t.jsx("i",{className:s}),t.jsx("span",{children:m})]}),r.isDefinedNotEmptyString(h)&&r.isDefinedNotEmptyString(f)&&t.jsx(T,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var g;(g=e==null?void 0:e.target)==null||g.blur(),d(f)},borderRadius:"curved",className:"button-link",children:h})]}),t.jsx(A,{limit:c,children:t.jsx(B,{isLoading:j,limit:c,keyPrefix:"explore-landing",children:C})})]})});module.exports=L;
@@ -25,7 +25,6 @@ const E = y.div`
25
25
  border-radius: 0.75rem;
26
26
  border: 1px solid var(--gray-95008, #14161a14);
27
27
  overflow: hidden;
28
- max-height: 21.5625rem;
29
28
  min-height: 21.5625rem;
30
29
  cursor: pointer;
31
30
  &:hover {
@@ -48,6 +47,7 @@ const E = y.div`
48
47
  & .tags-wr {
49
48
  margin-top: auto;
50
49
  display: flex;
50
+ flex-wrap: wrap;
51
51
 
52
52
  gap: 0.5rem;
53
53
  padding: 0 1rem 1rem 1rem;
@@ -56,9 +56,6 @@ const E = y.div`
56
56
  @media (max-width: ${T + "px"}) {
57
57
  max-height: 100%;
58
58
  min-height: 100%;
59
- & .tags-wr {
60
- flex-wrap: wrap;
61
- }
62
59
  }
63
60
  `, O = y.div`
64
61
  padding: 1rem 1rem 0 1rem;
@@ -119,22 +116,22 @@ const E = y.div`
119
116
  align-items: center;
120
117
  gap: 1rem;
121
118
  }
122
- `, _ = N((i, o) => {
119
+ `, _ = N((i, s) => {
123
120
  const {
124
121
  title: a,
125
122
  imageUrl: d,
126
- text: s,
123
+ text: m,
127
124
  numberOfLikes: l,
128
125
  numberOfComments: f,
129
126
  timeToRead: p,
130
127
  publishedAt: c,
131
- tags: m,
128
+ tags: o,
132
129
  onCardClick: b,
133
130
  timeToReadText: u = "{0} min read"
134
131
  } = i;
135
132
  return (
136
133
  // <BlogCardDetailedSkeleton />
137
- /* @__PURE__ */ t(R, { ref: o, className: "blog-card", onClick: b, children: [
134
+ /* @__PURE__ */ t(R, { ref: s, className: "blog-card", onClick: b, children: [
138
135
  /* @__PURE__ */ r(j, { src: d }),
139
136
  /* @__PURE__ */ t(O, { children: [
140
137
  /* @__PURE__ */ t("div", { className: "info-wr", children: [
@@ -158,9 +155,9 @@ const E = y.div`
158
155
  ] })
159
156
  ] }),
160
157
  /* @__PURE__ */ r("div", { className: "text-wr-title", children: a }),
161
- /* @__PURE__ */ r("div", { className: "text-wr", children: s })
158
+ /* @__PURE__ */ r("div", { className: "text-wr", children: m })
162
159
  ] }),
163
- /* @__PURE__ */ r("div", { className: "tags-wr", children: m == null ? void 0 : m.map((n, h) => /* @__PURE__ */ r(I, { color: n == null ? void 0 : n.color, children: n == null ? void 0 : n.name }, h)) })
160
+ o && /* @__PURE__ */ r("div", { className: "tags-wr", children: o == null ? void 0 : o.map((n, h) => /* @__PURE__ */ r(I, { color: n == null ? void 0 : n.color, children: n == null ? void 0 : n.name }, h)) })
164
161
  ] })
165
162
  );
166
163
  }), G = N(({}, i) => /* @__PURE__ */ t(R, { className: "blog-card", children: [
@@ -170,35 +167,35 @@ const E = y.div`
170
167
  /* @__PURE__ */ r("div", { className: "skeleton-title" }),
171
168
  /* @__PURE__ */ r("div", { className: "info-wr-skeleton" })
172
169
  ] })
173
- ] })), F = ({ limit: i = 3, isLoading: o = !1, keyPrefix: a }) => /* @__PURE__ */ r(v, { children: Array.from({ length: i }, (d, s) => /* @__PURE__ */ r(
170
+ ] })), F = ({ limit: i = 3, isLoading: s = !1, keyPrefix: a }) => /* @__PURE__ */ r(v, { children: Array.from({ length: i }, (d, m) => /* @__PURE__ */ r(
174
171
  G,
175
172
  {
176
- isLoading: o
173
+ isLoading: s
177
174
  },
178
- `${a}-skeleton-product-card-${s}`
175
+ `${a}-skeleton-product-card-${m}`
179
176
  )) }), X = ({
180
177
  children: i,
181
- fallbackComponent: o = /* @__PURE__ */ r(v, {}),
178
+ fallbackComponent: s = /* @__PURE__ */ r(v, {}),
182
179
  isLoading: a = !1,
183
180
  limit: d,
184
- keyPrefix: s
185
- }) => /* @__PURE__ */ r(A, { fallbackComponent: o, children: a === !0 ? /* @__PURE__ */ r(
181
+ keyPrefix: m
182
+ }) => /* @__PURE__ */ r(A, { fallbackComponent: s, children: a === !0 ? /* @__PURE__ */ r(
186
183
  F,
187
184
  {
188
185
  isLoading: a,
189
186
  limit: d,
190
- keyPrefix: s
187
+ keyPrefix: m
191
188
  }
192
- ) : i }), S = B(_), ee = N((i, o) => {
189
+ ) : i }), S = B(_), ee = N((i, s) => {
193
190
  const {
194
191
  icon: a,
195
192
  title: d,
196
- onButtonAction: s,
193
+ onButtonAction: m,
197
194
  items: l,
198
195
  buttonText: f,
199
196
  timeToReadText: p,
200
197
  limit: c = 3,
201
- onSelectCard: m = () => {
198
+ onSelectCard: o = () => {
202
199
  },
203
200
  isLoading: b = !1,
204
201
  buttonLink: u,
@@ -216,7 +213,7 @@ const E = y.div`
216
213
  timeToRead: e == null ? void 0 : e.timeToRead,
217
214
  timeToReadText: p,
218
215
  tags: e == null ? void 0 : e.tags,
219
- onCardClick: () => m(e == null ? void 0 : e.titleSlug),
216
+ onCardClick: () => o(e == null ? void 0 : e.titleSlug),
220
217
  imageUrl: n(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null
221
218
  },
222
219
  g
@@ -233,11 +230,11 @@ const E = y.div`
233
230
  publishedAt: e == null ? void 0 : e.publishedAt,
234
231
  timeToRead: e == null ? void 0 : e.timeToRead,
235
232
  timeToReadText: p,
236
- onCardClick: () => m(e == null ? void 0 : e.titleSlug)
233
+ onCardClick: () => o(e == null ? void 0 : e.titleSlug)
237
234
  },
238
235
  g
239
- )) }), [l, h, c, m]);
240
- return /* @__PURE__ */ t(U, { ref: o, children: [
236
+ )) }), [l, h, c, o]);
237
+ return /* @__PURE__ */ t(U, { ref: s, children: [
241
238
  /* @__PURE__ */ t("div", { className: "regular-title", children: [
242
239
  /* @__PURE__ */ t("div", { className: "regular-title-text", children: [
243
240
  w(a) && /* @__PURE__ */ r("i", { className: a }),
@@ -251,7 +248,7 @@ const E = y.div`
251
248
  color: "neutral",
252
249
  onClick: (e) => {
253
250
  var g;
254
- (g = e == null ? void 0 : e.target) == null || g.blur(), s(u);
251
+ (g = e == null ? void 0 : e.target) == null || g.blur(), m(u);
255
252
  },
256
253
  borderRadius: "curved",
257
254
  className: "button-link",
@@ -3,7 +3,7 @@ import { memo as c, forwardRef as f, useMemo as S } from "react";
3
3
  import { s as C } from "./emotion-styled.browser.esm-BNN1dTl3.js";
4
4
  import { M as b } from "./consts-BuFChS64.js";
5
5
  import { u as B } from "./useDetectMobile-Bkvj0VMa.js";
6
- import { B as M } from "./index-EE-IJbC3.js";
6
+ import { B as M } from "./index-DJ545v7b.js";
7
7
  import { S as L } from "./suspense-large-DrD8xVZi.js";
8
8
  const h = C.div`
9
9
  display: grid;
@@ -1,4 +1,4 @@
1
- "use strict";const r=require("react/jsx-runtime"),c=require("react"),p=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-goSZX3xP.cjs"),N=require("./useDetectMobile-zkbzoOGV.cjs"),u=require("./utils-DmMdPm9O.cjs"),q=require("./style-C_BRvopE.cjs"),x=require("./Button.cjs"),R=require("./Link.cjs"),M=require("./index-DiIeF_76.cjs"),B=p.styled.div`
1
+ "use strict";const r=require("react/jsx-runtime"),m=require("react"),h=require("./emotion-styled.browser.esm-BtEseadx.cjs"),y=require("./consts-goSZX3xP.cjs"),q=require("./useDetectMobile-zkbzoOGV.cjs"),p=require("./utils-DmMdPm9O.cjs"),S=require("./style-C_BRvopE.cjs"),R=require("./Button.cjs"),B=require("./Link.cjs"),M=require("./index-DiIeF_76.cjs"),T=h.styled.div`
2
2
  display: grid;
3
3
  grid-template-columns: ${t=>`repeat(${t.limit}, minmax(0, 1fr))`};
4
4
  gap: 1.25rem;
@@ -6,7 +6,7 @@
6
6
  @media (max-width: ${y.MOBILE_SIZE_PX+"px"}) {
7
7
  grid-template-columns: repeat(1, 1fr);
8
8
  }
9
- `,S=p.styled.div`
9
+ `,b=h.styled.div`
10
10
  display: flex;
11
11
  flex-direction: column;
12
12
  width: 100%;
@@ -16,7 +16,6 @@
16
16
  border-radius: 0.75rem;
17
17
  border: 1px solid var(--gray-95008);
18
18
  overflow: hidden;
19
- max-height: 21.5625rem;
20
19
  min-height: 21.5625rem;
21
20
  cursor: pointer;
22
21
 
@@ -34,7 +33,7 @@
34
33
  width: 100%;
35
34
  max-height: 12.5625rem;
36
35
  min-height: 12.5625rem;
37
- background-color: ${u.linearGradientAnimation("-90deg")};
36
+ background-color: ${p.linearGradientAnimation("-90deg")};
38
37
  }
39
38
 
40
39
  & .action {
@@ -52,9 +51,17 @@
52
51
  }
53
52
  }
54
53
 
54
+ & .tags-wr {
55
+ display: flex;
56
+ flex-wrap: wrap;
57
+
58
+ gap: 0.5rem;
59
+ padding: 1rem;
60
+ }
61
+
55
62
  @media (max-width: ${y.MOBILE_SIZE_PX+"px"}) {
56
63
  }
57
- `,b=p.styled.div`
64
+ `,v=h.styled.div`
58
65
  padding: 1rem 1rem 0 1rem;
59
66
  display: flex;
60
67
  flex-direction: column;
@@ -72,6 +79,6 @@
72
79
  font-size: 0.875rem;
73
80
  flex: 1;
74
81
  color: var(--gray-700, #4e555f);
75
- ${u.truncateTextInRows(3)}
82
+ ${p.truncateTextInRows(3)}
76
83
  }
77
- `,$=c.forwardRef((t,l)=>{const{title:i,imageUrl:s,text:o,onCardClick:d,readMoreText:m="Read more"}=t;return r.jsxs(S,{ref:l,className:"blog-card",onClick:d,children:[r.jsx(M.ProductImageWrapper,{src:s}),r.jsxs(b,{children:[r.jsx("div",{className:"text-wr-title",children:i}),r.jsx("div",{className:"text-wr",children:o})]}),r.jsx(R,{className:"action",color:"gray",onClick:d,children:m})]})}),I=c.forwardRef(({},t)=>r.jsxs(S,{className:"product-card",children:[r.jsx("div",{className:"skeleton-img"}),r.jsx("div",{className:"card-title"}),r.jsx(b,{})]})),P=({limit:t=3,isLoading:l=!1,keyPrefix:i})=>r.jsx(r.Fragment,{children:Array.from({length:t},(s,o)=>r.jsx(I,{isLoading:l},`${i}-skeleton-product-card-${o}`))}),T=({children:t,fallbackComponent:l=r.jsx(r.Fragment,{}),isLoading:i=!1,limit:s,keyPrefix:o})=>r.jsx(c.Suspense,{fallbackComponent:l,children:i===!0?r.jsx(P,{isLoading:i,limit:s,keyPrefix:o}):t}),j=c.memo($),_=c.forwardRef((t,l)=>{const{icon:i,title:s,onButtonAction:o=()=>{},onSelectCard:d=()=>{},buttonLink:m,items:n,buttonText:v,limit:g=3,isLoading:w=!1,getImage:h=()=>{},readMoreText:f="Read more"}=t,k=N.useDetectMobile(),C=c.useMemo(()=>r.jsx(r.Fragment,{children:k===!0?n==null?void 0:n.map((e,a)=>r.jsx(j,{title:e==null?void 0:e.title,imageUrl:h(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,readMoreText:f,onCardClick:()=>d(e==null?void 0:e.titleSlug)},a)):n==null?void 0:n.slice(0,g).map((e,a)=>r.jsx(j,{title:e==null?void 0:e.title,imageUrl:h(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,readMoreText:f,onCardClick:()=>d(e==null?void 0:e.titleSlug)},a))}),[n]);return r.jsxs(q.RegulatTitleSectionWrapper,{ref:l,children:[r.jsxs("div",{className:"regular-title",children:[r.jsxs("div",{className:"regular-title-text",children:[u.isDefinedNotEmptyString(i)&&r.jsx("i",{className:i}),r.jsx("span",{children:s})]}),u.isDefinedNotEmptyString(m)&&r.jsx(x,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var a;(a=e==null?void 0:e.target)==null||a.blur(),o(m)},borderRadius:"curved",className:"button-link",children:v})]}),r.jsx(B,{limit:g,children:r.jsx(T,{isLoading:w,limit:g,keyPrefix:"explore-landing",children:C})})]})});module.exports=_;
84
+ `,$=m.forwardRef((t,s)=>{const{title:i,imageUrl:c,text:n,options:a,onCardClick:g,readMoreText:o="Read more"}=t;return r.jsxs(b,{ref:s,className:"blog-card",onClick:g,children:[r.jsx(M.ProductImageWrapper,{src:c}),r.jsxs(v,{children:[r.jsx("div",{className:"text-wr-title",children:i}),r.jsx("div",{className:"text-wr",children:n})]}),a&&r.jsx("div",{className:"tags-wr",children:a==null?void 0:a.map((l,u)=>r.jsx(S.BlogTag,{color:l==null?void 0:l.color,children:l==null?void 0:l.name},u))}),r.jsx(B,{className:"action",color:"gray",onClick:g,children:o})]})}),I=m.forwardRef(({},t)=>r.jsxs(b,{className:"product-card",children:[r.jsx("div",{className:"skeleton-img"}),r.jsx("div",{className:"card-title"}),r.jsx(v,{})]})),P=({limit:t=3,isLoading:s=!1,keyPrefix:i})=>r.jsx(r.Fragment,{children:Array.from({length:t},(c,n)=>r.jsx(I,{isLoading:s},`${i}-skeleton-product-card-${n}`))}),_=({children:t,fallbackComponent:s=r.jsx(r.Fragment,{}),isLoading:i=!1,limit:c,keyPrefix:n})=>r.jsx(m.Suspense,{fallbackComponent:s,children:i===!0?r.jsx(P,{isLoading:i,limit:c,keyPrefix:n}):t}),w=m.memo($),E=m.forwardRef((t,s)=>{const{icon:i,title:c,onButtonAction:n=()=>{},onSelectCard:a=()=>{},buttonLink:g,items:o,buttonText:l,limit:u=3,isLoading:k=!1,getImage:f=()=>{},readMoreText:j="Read more"}=t,N=q.useDetectMobile(),C=m.useMemo(()=>r.jsx(r.Fragment,{children:N===!0?o==null?void 0:o.map((e,d)=>r.jsx(w,{title:e==null?void 0:e.title,imageUrl:f(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,readMoreText:j,options:e==null?void 0:e.options,onCardClick:()=>a(e==null?void 0:e.titleSlug)},d)):o==null?void 0:o.slice(0,u).map((e,d)=>r.jsx(w,{title:e==null?void 0:e.title,imageUrl:f(e==null?void 0:e.imageUrl,e==null?void 0:e.uuid)||null,text:e==null?void 0:e.description,titleSlug:e==null?void 0:e.titleSlug,readMoreText:j,options:e==null?void 0:e.options,onCardClick:()=>a(e==null?void 0:e.titleSlug)},d))}),[o]);return r.jsxs(S.RegulatTitleSectionWrapper,{ref:s,children:[r.jsxs("div",{className:"regular-title",children:[r.jsxs("div",{className:"regular-title-text",children:[p.isDefinedNotEmptyString(i)&&r.jsx("i",{className:i}),r.jsx("span",{children:c})]}),p.isDefinedNotEmptyString(g)&&r.jsx(R,{type:"button",btnType:"tinted",color:"neutral",onClick:e=>{var d;(d=e==null?void 0:e.target)==null||d.blur(),n(g)},borderRadius:"curved",className:"button-link",children:l})]}),r.jsx(T,{limit:u,children:r.jsx(_,{isLoading:k,limit:u,keyPrefix:"explore-landing",children:C})})]})});module.exports=E;