@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 d, jsx as r, Fragment as g } from "react/jsx-runtime";
2
- import { forwardRef as u, Suspense as B, memo as P, useMemo as R } from "react";
3
- import { s as h } from "./emotion-styled.browser.esm-BNN1dTl3.js";
1
+ import { jsxs as s, jsx as r, Fragment as u } from "react/jsx-runtime";
2
+ import { forwardRef as h, Suspense as T, memo as $, useMemo as P } from "react";
3
+ import { s as f } from "./emotion-styled.browser.esm-BNN1dTl3.js";
4
4
  import { M as k } from "./consts-BuFChS64.js";
5
- import { u as T } from "./useDetectMobile-Bkvj0VMa.js";
5
+ import { u as R } from "./useDetectMobile-Bkvj0VMa.js";
6
6
  import { o as z, p as I, k as b } from "./utils-BPdU4_1q.js";
7
- import { R as U } from "./style-XXDQBreL.js";
8
- import W from "./Button.js";
9
- import j from "./Link.js";
10
- import { P as A } from "./index-3TFXgZHA.js";
11
- const E = h.div`
7
+ import { B as U, R as W } from "./style-XXDQBreL.js";
8
+ import j from "./Button.js";
9
+ import A from "./Link.js";
10
+ import { P as E } from "./index-3TFXgZHA.js";
11
+ const L = f.div`
12
12
  display: grid;
13
13
  grid-template-columns: ${(t) => `repeat(${t.limit}, minmax(0, 1fr))`};
14
14
  gap: 1.25rem;
@@ -16,7 +16,7 @@ const E = h.div`
16
16
  @media (max-width: ${k + "px"}) {
17
17
  grid-template-columns: repeat(1, 1fr);
18
18
  }
19
- `, w = h.div`
19
+ `, y = f.div`
20
20
  display: flex;
21
21
  flex-direction: column;
22
22
  width: 100%;
@@ -26,7 +26,6 @@ const E = h.div`
26
26
  border-radius: 0.75rem;
27
27
  border: 1px solid var(--gray-95008);
28
28
  overflow: hidden;
29
- max-height: 21.5625rem;
30
29
  min-height: 21.5625rem;
31
30
  cursor: pointer;
32
31
 
@@ -62,9 +61,17 @@ const E = h.div`
62
61
  }
63
62
  }
64
63
 
64
+ & .tags-wr {
65
+ display: flex;
66
+ flex-wrap: wrap;
67
+
68
+ gap: 0.5rem;
69
+ padding: 1rem;
70
+ }
71
+
65
72
  @media (max-width: ${k + "px"}) {
66
73
  }
67
- `, y = h.div`
74
+ `, C = f.div`
68
75
  padding: 1rem 1rem 0 1rem;
69
76
  display: flex;
70
77
  flex-direction: column;
@@ -84,120 +91,124 @@ const E = h.div`
84
91
  color: var(--gray-700, #4e555f);
85
92
  ${I(3)}
86
93
  }
87
- `, L = u((t, o) => {
94
+ `, _ = h((t, a) => {
88
95
  const {
89
96
  title: i,
90
- imageUrl: n,
91
- text: l,
92
- onCardClick: c,
93
- readMoreText: s = "Read more"
97
+ imageUrl: d,
98
+ text: n,
99
+ options: m,
100
+ onCardClick: p,
101
+ readMoreText: o = "Read more"
94
102
  } = t;
95
- return /* @__PURE__ */ d(w, { ref: o, className: "blog-card", onClick: c, children: [
96
- /* @__PURE__ */ r(A, { src: n }),
97
- /* @__PURE__ */ d(y, { children: [
103
+ return /* @__PURE__ */ s(y, { ref: a, className: "blog-card", onClick: p, children: [
104
+ /* @__PURE__ */ r(E, { src: d }),
105
+ /* @__PURE__ */ s(C, { children: [
98
106
  /* @__PURE__ */ r("div", { className: "text-wr-title", children: i }),
99
- /* @__PURE__ */ r("div", { className: "text-wr", children: l })
107
+ /* @__PURE__ */ r("div", { className: "text-wr", children: n })
100
108
  ] }),
101
- /* @__PURE__ */ r(j, { className: "action", color: "gray", onClick: c, children: s })
109
+ m && /* @__PURE__ */ r("div", { className: "tags-wr", children: m == null ? void 0 : m.map((l, g) => /* @__PURE__ */ r(U, { color: l == null ? void 0 : l.color, children: l == null ? void 0 : l.name }, g)) }),
110
+ /* @__PURE__ */ r(A, { className: "action", color: "gray", onClick: p, children: o })
102
111
  ] });
103
- }), _ = u(({}, t) => (
112
+ }), D = h(({}, t) => (
104
113
  // <LandingPageClearProductCardSkeleton />
105
- /* @__PURE__ */ d(w, { className: "product-card", children: [
114
+ /* @__PURE__ */ s(y, { className: "product-card", children: [
106
115
  /* @__PURE__ */ r("div", { className: "skeleton-img" }),
107
116
  /* @__PURE__ */ r("div", { className: "card-title" }),
108
- /* @__PURE__ */ r(y, {})
117
+ /* @__PURE__ */ r(C, {})
109
118
  ] })
110
- )), D = ({ limit: t = 3, isLoading: o = !1, keyPrefix: i }) => /* @__PURE__ */ r(g, { children: Array.from({ length: t }, (n, l) => /* @__PURE__ */ r(
111
- _,
119
+ )), G = ({ limit: t = 3, isLoading: a = !1, keyPrefix: i }) => /* @__PURE__ */ r(u, { children: Array.from({ length: t }, (d, n) => /* @__PURE__ */ r(
120
+ D,
112
121
  {
113
- isLoading: o
122
+ isLoading: a
114
123
  },
115
- `${i}-skeleton-product-card-${l}`
116
- )) }), G = ({
124
+ `${i}-skeleton-product-card-${n}`
125
+ )) }), F = ({
117
126
  children: t,
118
- fallbackComponent: o = /* @__PURE__ */ r(g, {}),
127
+ fallbackComponent: a = /* @__PURE__ */ r(u, {}),
119
128
  isLoading: i = !1,
120
- limit: n,
121
- keyPrefix: l
122
- }) => /* @__PURE__ */ r(B, { fallbackComponent: o, children: i === !0 ? /* @__PURE__ */ r(
123
- D,
129
+ limit: d,
130
+ keyPrefix: n
131
+ }) => /* @__PURE__ */ r(T, { fallbackComponent: a, children: i === !0 ? /* @__PURE__ */ r(
132
+ G,
124
133
  {
125
134
  isLoading: i,
126
- limit: n,
127
- keyPrefix: l
135
+ limit: d,
136
+ keyPrefix: n
128
137
  }
129
- ) : t }), S = P(L), Y = u((t, o) => {
138
+ ) : t }), S = $(_), x = h((t, a) => {
130
139
  const {
131
140
  icon: i,
132
- title: n,
133
- onButtonAction: l = () => {
141
+ title: d,
142
+ onButtonAction: n = () => {
134
143
  },
135
- onSelectCard: c = () => {
144
+ onSelectCard: m = () => {
136
145
  },
137
- buttonLink: s,
138
- items: a,
139
- buttonText: C,
140
- limit: p = 3,
146
+ buttonLink: p,
147
+ items: o,
148
+ buttonText: l,
149
+ limit: g = 3,
141
150
  isLoading: N = !1,
142
- getImage: f = () => {
151
+ getImage: v = () => {
143
152
  },
144
- readMoreText: v = "Read more"
145
- } = t, M = T(), $ = R(() => /* @__PURE__ */ r(g, { children: M === !0 ? a == null ? void 0 : a.map((e, m) => /* @__PURE__ */ r(
153
+ readMoreText: w = "Read more"
154
+ } = t, B = R(), M = P(() => /* @__PURE__ */ r(u, { children: B === !0 ? o == null ? void 0 : o.map((e, c) => /* @__PURE__ */ r(
146
155
  S,
147
156
  {
148
157
  title: e == null ? void 0 : e.title,
149
- imageUrl: f(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
158
+ imageUrl: v(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
150
159
  text: e == null ? void 0 : e.description,
151
160
  titleSlug: e == null ? void 0 : e.titleSlug,
152
- readMoreText: v,
153
- onCardClick: () => c(e == null ? void 0 : e.titleSlug)
161
+ readMoreText: w,
162
+ options: e == null ? void 0 : e.options,
163
+ onCardClick: () => m(e == null ? void 0 : e.titleSlug)
154
164
  },
155
- m
156
- )) : a == null ? void 0 : a.slice(0, p).map((e, m) => /* @__PURE__ */ r(
165
+ c
166
+ )) : o == null ? void 0 : o.slice(0, g).map((e, c) => /* @__PURE__ */ r(
157
167
  S,
158
168
  {
159
169
  title: e == null ? void 0 : e.title,
160
- imageUrl: f(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
170
+ imageUrl: v(e == null ? void 0 : e.imageUrl, e == null ? void 0 : e.uuid) || null,
161
171
  text: e == null ? void 0 : e.description,
162
172
  titleSlug: e == null ? void 0 : e.titleSlug,
163
- readMoreText: v,
164
- onCardClick: () => c(e == null ? void 0 : e.titleSlug)
173
+ readMoreText: w,
174
+ options: e == null ? void 0 : e.options,
175
+ onCardClick: () => m(e == null ? void 0 : e.titleSlug)
165
176
  },
166
- m
167
- )) }), [a]);
168
- return /* @__PURE__ */ d(U, { ref: o, children: [
169
- /* @__PURE__ */ d("div", { className: "regular-title", children: [
170
- /* @__PURE__ */ d("div", { className: "regular-title-text", children: [
177
+ c
178
+ )) }), [o]);
179
+ return /* @__PURE__ */ s(W, { ref: a, children: [
180
+ /* @__PURE__ */ s("div", { className: "regular-title", children: [
181
+ /* @__PURE__ */ s("div", { className: "regular-title-text", children: [
171
182
  b(i) && /* @__PURE__ */ r("i", { className: i }),
172
- /* @__PURE__ */ r("span", { children: n })
183
+ /* @__PURE__ */ r("span", { children: d })
173
184
  ] }),
174
- b(s) && /* @__PURE__ */ r(
175
- W,
185
+ b(p) && /* @__PURE__ */ r(
186
+ j,
176
187
  {
177
188
  type: "button",
178
189
  btnType: "tinted",
179
190
  color: "neutral",
180
191
  onClick: (e) => {
181
- var m;
182
- (m = e == null ? void 0 : e.target) == null || m.blur(), l(s);
192
+ var c;
193
+ (c = e == null ? void 0 : e.target) == null || c.blur(), n(p);
183
194
  },
184
195
  borderRadius: "curved",
185
196
  className: "button-link",
186
- children: C
197
+ children: l
187
198
  }
188
199
  )
189
200
  ] }),
190
- /* @__PURE__ */ r(E, { limit: p, children: /* @__PURE__ */ r(
191
- G,
201
+ /* @__PURE__ */ r(L, { limit: g, children: /* @__PURE__ */ r(
202
+ F,
192
203
  {
193
204
  isLoading: N,
194
- limit: p,
205
+ limit: g,
195
206
  keyPrefix: "explore-landing",
196
- children: $
207
+ children: M
197
208
  }
198
209
  ) })
199
210
  ] });
200
211
  });
201
212
  export {
202
- Y as default
213
+ x as default
203
214
  };
@@ -5,13 +5,7 @@ import { u as b } from "./useDetectMobile-Bkvj0VMa.js";
5
5
  import a from "./Button.js";
6
6
  import { P as f } from "./index-3TFXgZHA.js";
7
7
  const k = p((l, c) => {
8
- const {
9
- title: s,
10
- imageUrl: n,
11
- text: m,
12
- onCardClick: e,
13
- buttonText: t
14
- } = l, o = b();
8
+ const { title: s, imageUrl: n, text: m, onCardClick: e, buttonText: t } = l, o = b();
15
9
  return /* @__PURE__ */ i(d, { ref: c, className: "blog-card", onClick: e, children: [
16
10
  /* @__PURE__ */ r(f, { src: n }),
17
11
  /* @__PURE__ */ i(u, { children: [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lanaco/lnc-react-ui",
3
- "version": "4.0.131",
3
+ "version": "4.0.132",
4
4
  "description": "React component library",
5
5
  "type": "module",
6
6
  "keywords": [