@lanaco/lnc-react-ui 4.0.226 → 4.0.227
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.
- package/dist/BannerSectionCarousel.cjs +3 -3
- package/dist/BannerSectionCarousel.js +18 -11
- package/dist/BlogCardsSponsoredSection.cjs +1 -1
- package/dist/BlogCardsSponsoredSection.js +1 -1
- package/dist/BlogListSection.cjs +7 -7
- package/dist/BlogListSection.js +157 -207
- package/dist/BlogSingleSection.cjs +2 -11
- package/dist/BlogSingleSection.js +19 -35
- package/dist/BlogsSectionDetailed.cjs +1 -1
- package/dist/BlogsSectionDetailed.js +1 -1
- package/dist/BlogsSectionLarge.cjs +8 -16
- package/dist/BlogsSectionLarge.js +40 -58
- package/dist/BlogsSectionSimple.cjs +1 -1
- package/dist/BlogsSectionSimple.js +1 -1
- package/dist/BlogsSectionSimpleCentered.cjs +12 -25
- package/dist/BlogsSectionSimpleCentered.js +64 -98
- package/dist/BlogsSectionWithFilters.cjs +10 -21
- package/dist/BlogsSectionWithFilters.js +106 -154
- package/dist/BrandHitsSection.cjs +7 -7
- package/dist/BrandHitsSection.js +41 -87
- package/dist/DetailedProductsInfinitiveSection.cjs +1 -1
- package/dist/DetailedProductsInfinitiveSection.js +2 -2
- package/dist/DetailedProductsSection.cjs +1 -1
- package/dist/DetailedProductsSection.js +2 -2
- package/dist/FieldOfInterestsMasonrySection.cjs +13 -13
- package/dist/FieldOfInterestsMasonrySection.js +105 -159
- package/dist/FieldOfInterestsWithAvatarsCardsSection.cjs +8 -8
- package/dist/FieldOfInterestsWithAvatarsCardsSection.js +93 -124
- package/dist/FieldOfInterestsWithTagsCardsSection.cjs +1 -1
- package/dist/FieldOfInterestsWithTagsCardsSection.js +1 -1
- package/dist/GeneralWithTagsCardsSection.cjs +1 -1
- package/dist/GeneralWithTagsCardsSection.js +1 -1
- package/dist/GiftCardsSection.cjs +10 -14
- package/dist/GiftCardsSection.js +76 -146
- package/dist/MasonryGeneralCardsSection.cjs +10 -10
- package/dist/MasonryGeneralCardsSection.js +45 -44
- package/dist/OverlayGeneralCardsSection.cjs +1 -1
- package/dist/OverlayGeneralCardsSection.js +1 -1
- package/dist/ProductsWithBannerSection.cjs +13 -13
- package/dist/ProductsWithBannerSection.js +87 -168
- package/dist/QuattroCardsSection.cjs +1 -1
- package/dist/QuattroCardsSection.js +1 -1
- package/dist/ReviewsSection.cjs +18 -22
- package/dist/ReviewsSection.js +101 -163
- package/dist/SalesCampaignsSection.cjs +14 -14
- package/dist/SalesCampaignsSection.js +299 -330
- package/dist/ShopCardsSection.cjs +6 -19
- package/dist/ShopCardsSection.js +54 -100
- package/dist/SimpleCategoriesSection.cjs +3 -3
- package/dist/SimpleCategoriesSection.js +64 -67
- package/dist/SimpleProductsSection.cjs +7 -7
- package/dist/SimpleProductsSection.js +65 -138
- package/dist/UrgentSaleProductsSection.cjs +1 -1
- package/dist/UrgentSaleProductsSection.js +1 -1
- package/dist/index-B7fBsitY.js +45 -0
- package/dist/index-BMAvJQBG.cjs +9 -0
- package/dist/index-BUdvfHpp.cjs +5 -0
- package/dist/index-BXT1eY2D.js +753 -0
- package/dist/index-C6amCwRZ.js +25 -0
- package/dist/index-C8R9lsWG.cjs +1 -0
- package/dist/index-CeQvy566.cjs +11 -0
- package/dist/index-Cyt4EUZ6.js +20 -0
- package/dist/index-D3QZziO_.cjs +368 -0
- package/dist/index-VTkAaA-n.js +18 -0
- package/dist/style-BFPpppS9.js +73 -0
- package/dist/style-CQdEALKR.cjs +59 -0
- package/package.json +1 -1
- package/dist/index-BGNavrtB.cjs +0 -368
- package/dist/index-BHcrzV2G.js +0 -54
- package/dist/index-Bj1KWOV4.cjs +0 -11
- package/dist/index-BsAddfgC.cjs +0 -1
- package/dist/index-Cn4bq6ZX.js +0 -84
- package/dist/index-CuRcxKQH.js +0 -42
- package/dist/index-DB1J-G6Z.js +0 -38
- package/dist/index-DkPva6Gr.cjs +0 -20
- package/dist/index-fzBXDy05.cjs +0 -16
- package/dist/index-gFZSZLba.js +0 -882
- package/dist/style-DvkivBNg.js +0 -74
- package/dist/style-Ito6YFqi.cjs +0 -64
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { s as
|
|
4
|
-
import { d as
|
|
5
|
-
import { u as
|
|
6
|
-
import { n as
|
|
7
|
-
import { T as
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import { P as
|
|
11
|
-
import { S as
|
|
12
|
-
import { b as
|
|
13
|
-
const
|
|
1
|
+
import { jsxs as l, jsx as t, Fragment as _ } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as M, useRef as j, Suspense as I, memo as O, useMemo as P } from "react";
|
|
3
|
+
import { s as C } from "./emotion-styled.browser.esm-DfbrHHed.js";
|
|
4
|
+
import { d as k } from "./breakpoints-BubDitvo.js";
|
|
5
|
+
import { u as U } from "./useDetectMobile-B0Jog4jQ.js";
|
|
6
|
+
import { n as D, l as v } from "./utils-MoGhNMmj.js";
|
|
7
|
+
import { T as K } from "./style-D54KOzZj.js";
|
|
8
|
+
import E from "./Button.js";
|
|
9
|
+
import G from "./Link.js";
|
|
10
|
+
import { P as H } from "./index-DEypPQRI.js";
|
|
11
|
+
import { S as X } from "./index-Djo0ZcRE.js";
|
|
12
|
+
import { b as q, c as B, a as R } from "./style-BFPpppS9.js";
|
|
13
|
+
const J = C.div`
|
|
14
14
|
display: grid;
|
|
15
|
-
grid-template-columns: ${(
|
|
15
|
+
grid-template-columns: ${(o) => `repeat(${o.limit}, minmax(0, 1fr))`};
|
|
16
16
|
gap: 1.25rem;
|
|
17
17
|
|
|
18
|
-
@media ${
|
|
18
|
+
@media ${k("M")} {
|
|
19
19
|
grid-template-columns: repeat(2, 1fr);
|
|
20
20
|
}
|
|
21
21
|
|
|
22
|
-
@media ${
|
|
22
|
+
@media ${k("S")} {
|
|
23
23
|
grid-template-columns: repeat(2, 1fr);
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
@media ${
|
|
26
|
+
@media ${k("XS")} {
|
|
27
27
|
grid-template-columns: repeat(1, 1fr);
|
|
28
28
|
}
|
|
29
|
-
`, Q =
|
|
29
|
+
`, Q = C.a`
|
|
30
30
|
text-decoration: none;
|
|
31
31
|
color: var(--gray-950);
|
|
32
32
|
display: flex;
|
|
@@ -58,7 +58,7 @@ const P = S.div`
|
|
|
58
58
|
& a {
|
|
59
59
|
margin-top: auto;
|
|
60
60
|
}
|
|
61
|
-
`, V =
|
|
61
|
+
`, V = C.div`
|
|
62
62
|
display: flex;
|
|
63
63
|
flex-direction: column;
|
|
64
64
|
gap: 0.5rem;
|
|
@@ -73,44 +73,44 @@ const P = S.div`
|
|
|
73
73
|
font-weight: 400;
|
|
74
74
|
font-size: 0.875rem;
|
|
75
75
|
color: var(--gray-700, #4e555f);
|
|
76
|
-
${
|
|
76
|
+
${D(3)}
|
|
77
77
|
}
|
|
78
|
-
`, Y =
|
|
78
|
+
`, Y = M((o, a) => {
|
|
79
79
|
const {
|
|
80
|
-
title:
|
|
81
|
-
imageUrl:
|
|
80
|
+
title: s,
|
|
81
|
+
imageUrl: c,
|
|
82
82
|
text: n,
|
|
83
83
|
buttonText: u,
|
|
84
|
-
onCardClick:
|
|
85
|
-
metadata:
|
|
84
|
+
onCardClick: m,
|
|
85
|
+
metadata: r,
|
|
86
86
|
link: d,
|
|
87
87
|
LinkComponent: g
|
|
88
|
-
} =
|
|
89
|
-
|
|
88
|
+
} = o, h = g || "a", p = j(), f = (b) => {
|
|
89
|
+
m(b, p);
|
|
90
90
|
};
|
|
91
|
-
return /* @__PURE__ */
|
|
91
|
+
return /* @__PURE__ */ l(
|
|
92
92
|
Q,
|
|
93
93
|
{
|
|
94
94
|
ref: p,
|
|
95
|
-
name:
|
|
96
|
-
"data-accessor":
|
|
95
|
+
name: r == null ? void 0 : r.name,
|
|
96
|
+
"data-accessor": r == null ? void 0 : r.accessor,
|
|
97
97
|
className: "blog-card",
|
|
98
|
-
onClick:
|
|
98
|
+
onClick: f,
|
|
99
99
|
to: `/${d}`,
|
|
100
|
-
as:
|
|
100
|
+
as: h,
|
|
101
101
|
...g ? { to: `/${d}` } : { href: `/${d}` },
|
|
102
102
|
children: [
|
|
103
|
-
/* @__PURE__ */
|
|
104
|
-
/* @__PURE__ */ t("div", { className: "text-wr-title", children:
|
|
103
|
+
/* @__PURE__ */ l(V, { children: [
|
|
104
|
+
/* @__PURE__ */ t("div", { className: "text-wr-title", children: s }),
|
|
105
105
|
/* @__PURE__ */ t("div", { className: "text-wr", children: n }),
|
|
106
|
-
/* @__PURE__ */ t(
|
|
106
|
+
/* @__PURE__ */ t(G, { color: "gray", onClick: f, children: u })
|
|
107
107
|
] }),
|
|
108
|
-
/* @__PURE__ */ t(
|
|
108
|
+
/* @__PURE__ */ t(H, { src: c })
|
|
109
109
|
]
|
|
110
110
|
}
|
|
111
111
|
);
|
|
112
|
-
}), Z =
|
|
113
|
-
@media ${
|
|
112
|
+
}), Z = C(q)`
|
|
113
|
+
@media ${k("S")} {
|
|
114
114
|
& .skeleton__tags {
|
|
115
115
|
& > div {
|
|
116
116
|
width: 100%;
|
|
@@ -119,164 +119,116 @@ const P = S.div`
|
|
|
119
119
|
|
|
120
120
|
& .skeleton__cards {
|
|
121
121
|
flex-direction: column;
|
|
122
|
-
|
|
123
|
-
& > div {
|
|
124
|
-
background: linear-gradient(
|
|
125
|
-
to right,
|
|
126
|
-
transparent 0%,
|
|
127
|
-
#f4f6fb 40%,
|
|
128
|
-
#f4f6fb 100%
|
|
129
|
-
);
|
|
130
|
-
|
|
131
|
-
box-shadow: none;
|
|
132
|
-
}
|
|
133
122
|
}
|
|
134
123
|
}
|
|
135
|
-
`, x = ({ keyPrefix:
|
|
136
|
-
/* @__PURE__ */
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
),
|
|
155
|
-
/* @__PURE__ */ t(
|
|
156
|
-
s,
|
|
157
|
-
{
|
|
158
|
-
height: "2.25rem",
|
|
159
|
-
width: "128px",
|
|
160
|
-
borderRadius: "1rem"
|
|
161
|
-
},
|
|
162
|
-
`${r}-3`
|
|
163
|
-
)
|
|
164
|
-
] }),
|
|
165
|
-
/* @__PURE__ */ a(y, { className: "skeleton__cards", children: [
|
|
166
|
-
/* @__PURE__ */ t(
|
|
167
|
-
s,
|
|
168
|
-
{
|
|
169
|
-
height: "10.375rem",
|
|
170
|
-
borderRadius: "0.75rem"
|
|
171
|
-
},
|
|
172
|
-
`${r}-4`
|
|
173
|
-
),
|
|
174
|
-
/* @__PURE__ */ t(
|
|
175
|
-
s,
|
|
176
|
-
{
|
|
177
|
-
height: "10.375rem",
|
|
178
|
-
borderRadius: "0.75rem"
|
|
179
|
-
},
|
|
180
|
-
`${r}-5`
|
|
181
|
-
),
|
|
182
|
-
/* @__PURE__ */ t(
|
|
183
|
-
s,
|
|
184
|
-
{
|
|
185
|
-
height: "10.375rem",
|
|
186
|
-
borderRadius: "0.75rem"
|
|
187
|
-
},
|
|
188
|
-
`${r}-6`
|
|
189
|
-
)
|
|
190
|
-
] })
|
|
124
|
+
`, x = ({ keyPrefix: o }) => /* @__PURE__ */ l(Z, { children: [
|
|
125
|
+
/* @__PURE__ */ t(B, { className: "skeleton__tags", children: [1, 2, 3].map((a) => /* @__PURE__ */ t(
|
|
126
|
+
R,
|
|
127
|
+
{
|
|
128
|
+
height: "2.25rem",
|
|
129
|
+
width: "8rem",
|
|
130
|
+
borderRadius: "1rem"
|
|
131
|
+
},
|
|
132
|
+
`${o}-tab-${a}`
|
|
133
|
+
)) }),
|
|
134
|
+
/* @__PURE__ */ t(B, { className: "skeleton__cards", children: [1, 2, 3].map((a) => /* @__PURE__ */ t(
|
|
135
|
+
R,
|
|
136
|
+
{
|
|
137
|
+
height: "10.375rem",
|
|
138
|
+
width: "100%",
|
|
139
|
+
borderRadius: "1rem"
|
|
140
|
+
},
|
|
141
|
+
`${o}-card-${a}`
|
|
142
|
+
)) })
|
|
191
143
|
] }), ee = ({
|
|
192
|
-
keyPrefix:
|
|
193
|
-
isLoading:
|
|
194
|
-
fallbackComponent:
|
|
195
|
-
children:
|
|
196
|
-
}) => /* @__PURE__ */ t(I, { fallbackComponent:
|
|
144
|
+
keyPrefix: o,
|
|
145
|
+
isLoading: a = !1,
|
|
146
|
+
fallbackComponent: s = /* @__PURE__ */ t(_, {}),
|
|
147
|
+
children: c
|
|
148
|
+
}) => /* @__PURE__ */ t(I, { fallbackComponent: s, children: a === !0 ? /* @__PURE__ */ t(x, { keyPrefix: o }) : c }), W = O(Y), ue = M((o, a) => {
|
|
197
149
|
const {
|
|
198
|
-
icon:
|
|
199
|
-
title:
|
|
150
|
+
icon: s,
|
|
151
|
+
title: c,
|
|
200
152
|
items: n,
|
|
201
153
|
buttonText: u,
|
|
202
|
-
limit:
|
|
203
|
-
options:
|
|
154
|
+
limit: m = 3,
|
|
155
|
+
options: r,
|
|
204
156
|
selectedOption: d = [],
|
|
205
157
|
onButtonAction: g = () => {
|
|
206
158
|
},
|
|
207
|
-
buttonLink:
|
|
159
|
+
buttonLink: h,
|
|
208
160
|
onSelectOption: p = () => {
|
|
209
161
|
},
|
|
210
|
-
onSelectAll:
|
|
162
|
+
onSelectAll: f = () => {
|
|
211
163
|
},
|
|
212
|
-
isLoading:
|
|
213
|
-
onSelectCard:
|
|
164
|
+
isLoading: b = !1,
|
|
165
|
+
onSelectCard: y = () => {
|
|
214
166
|
},
|
|
215
|
-
productsToolbarName:
|
|
216
|
-
allButton:
|
|
217
|
-
componentName:
|
|
218
|
-
LinkComponent:
|
|
219
|
-
} =
|
|
167
|
+
productsToolbarName: z = "All",
|
|
168
|
+
allButton: L = !1,
|
|
169
|
+
componentName: $,
|
|
170
|
+
LinkComponent: T
|
|
171
|
+
} = o, N = U(), A = P(() => {
|
|
220
172
|
var i;
|
|
221
|
-
return /* @__PURE__ */ t(_, { children:
|
|
222
|
-
|
|
173
|
+
return /* @__PURE__ */ t(_, { children: N === !0 ? n == null ? void 0 : n.map((e, S) => /* @__PURE__ */ t(
|
|
174
|
+
W,
|
|
223
175
|
{
|
|
224
176
|
title: e == null ? void 0 : e.title,
|
|
225
177
|
imageUrl: (e == null ? void 0 : e.image) || null,
|
|
226
178
|
text: e == null ? void 0 : e.text,
|
|
227
179
|
buttonText: e == null ? void 0 : e.buttonText,
|
|
228
|
-
onCardClick: (
|
|
229
|
-
metadata: { name:
|
|
180
|
+
onCardClick: (F, w) => y(e, w),
|
|
181
|
+
metadata: { name: $, accessor: e == null ? void 0 : e.accessor },
|
|
230
182
|
link: e == null ? void 0 : e.link,
|
|
231
|
-
LinkComponent:
|
|
183
|
+
LinkComponent: T
|
|
232
184
|
},
|
|
233
|
-
|
|
234
|
-
)) : (i = n == null ? void 0 : n.slice(0,
|
|
235
|
-
|
|
185
|
+
S
|
|
186
|
+
)) : (i = n == null ? void 0 : n.slice(0, m)) == null ? void 0 : i.map((e, S) => /* @__PURE__ */ t(
|
|
187
|
+
W,
|
|
236
188
|
{
|
|
237
189
|
title: e == null ? void 0 : e.title,
|
|
238
190
|
imageUrl: (e == null ? void 0 : e.image) || null,
|
|
239
191
|
text: e == null ? void 0 : e.text,
|
|
240
192
|
buttonText: e == null ? void 0 : e.buttonText,
|
|
241
|
-
onCardClick: (
|
|
242
|
-
metadata: { name:
|
|
193
|
+
onCardClick: (F, w) => y(e, w),
|
|
194
|
+
metadata: { name: $, accessor: e == null ? void 0 : e.accessor },
|
|
243
195
|
link: e == null ? void 0 : e.link,
|
|
244
|
-
LinkComponent:
|
|
196
|
+
LinkComponent: T
|
|
245
197
|
},
|
|
246
|
-
|
|
198
|
+
S
|
|
247
199
|
)) });
|
|
248
|
-
}, [n,
|
|
249
|
-
return /* @__PURE__ */
|
|
250
|
-
/* @__PURE__ */
|
|
251
|
-
/* @__PURE__ */
|
|
252
|
-
|
|
253
|
-
/* @__PURE__ */ t("span", { children:
|
|
200
|
+
}, [n, N, m]);
|
|
201
|
+
return /* @__PURE__ */ l(K, { ref: a, children: [
|
|
202
|
+
/* @__PURE__ */ l("div", { className: "regular-title", children: [
|
|
203
|
+
/* @__PURE__ */ l("div", { className: "regular-title-text", children: [
|
|
204
|
+
v(s) && /* @__PURE__ */ t("i", { className: s }),
|
|
205
|
+
/* @__PURE__ */ t("span", { children: c })
|
|
254
206
|
] }),
|
|
255
|
-
|
|
256
|
-
|
|
207
|
+
v(u) && v(h) && !b && /* @__PURE__ */ t(
|
|
208
|
+
E,
|
|
257
209
|
{
|
|
258
210
|
type: "button",
|
|
259
211
|
btnType: "tinted",
|
|
260
212
|
color: "neutral",
|
|
261
213
|
onClick: (i) => {
|
|
262
214
|
var e;
|
|
263
|
-
(e = i == null ? void 0 : i.target) == null || e.blur(), g(
|
|
215
|
+
(e = i == null ? void 0 : i.target) == null || e.blur(), g(h);
|
|
264
216
|
},
|
|
265
217
|
borderRadius: "curved",
|
|
266
218
|
children: u
|
|
267
219
|
}
|
|
268
220
|
)
|
|
269
221
|
] }),
|
|
270
|
-
/* @__PURE__ */
|
|
222
|
+
/* @__PURE__ */ l(
|
|
271
223
|
ee,
|
|
272
224
|
{
|
|
273
|
-
isLoading:
|
|
225
|
+
isLoading: b,
|
|
274
226
|
keyPrefix: "blogs-with-filters-skeleton",
|
|
275
227
|
children: [
|
|
276
|
-
(
|
|
277
|
-
|
|
228
|
+
(r == null ? void 0 : r.length) > 0 && /* @__PURE__ */ t(
|
|
229
|
+
X,
|
|
278
230
|
{
|
|
279
|
-
items:
|
|
231
|
+
items: r,
|
|
280
232
|
selectedIds: d,
|
|
281
233
|
onRemove: (i) => {
|
|
282
234
|
p(i);
|
|
@@ -284,20 +236,20 @@ const P = S.div`
|
|
|
284
236
|
onSelect: (i) => {
|
|
285
237
|
p(i);
|
|
286
238
|
},
|
|
287
|
-
onSelectAll:
|
|
239
|
+
onSelectAll: f,
|
|
288
240
|
labelKey: "name",
|
|
289
241
|
valueKey: "code",
|
|
290
242
|
noMargin: !0,
|
|
291
|
-
productsToolbarName:
|
|
292
|
-
allButton:
|
|
243
|
+
productsToolbarName: z,
|
|
244
|
+
allButton: L
|
|
293
245
|
}
|
|
294
246
|
),
|
|
295
|
-
/* @__PURE__ */ t(
|
|
247
|
+
/* @__PURE__ */ t(J, { limit: m, children: A })
|
|
296
248
|
]
|
|
297
249
|
}
|
|
298
250
|
)
|
|
299
251
|
] });
|
|
300
252
|
});
|
|
301
253
|
export {
|
|
302
|
-
|
|
254
|
+
ue as default
|
|
303
255
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";const e=require("react/jsx-runtime"),d=require("react"),_=require("./utils-CITgSxXe.cjs"),h=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),m=require("./breakpoints-CcVm-gVm.cjs"),g=require("./style-CQdEALKR.cjs"),x=h.styled.a`
|
|
2
2
|
text-decoration: none;
|
|
3
3
|
color: var(--gray-950);
|
|
4
4
|
width: 7.5rem;
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
height: auto;
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
@media ${
|
|
17
|
+
@media ${m.down("S")} {
|
|
18
18
|
width: 4.5rem;
|
|
19
19
|
height: auto;
|
|
20
20
|
max-height: 4.5rem;
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
height: auto;
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
|
-
`,
|
|
27
|
+
`,f=d.forwardRef(({imageComponent:t,image:a,onSelectCard:n,urlPrefix:s,urlSufix:i,code:o,LinkComponent:c},p)=>{const l=c||"a";return e.jsx(x,{ref:p,onClick:n,as:l,...c?{to:`${s}${o}${i}`}:{href:`${s}${o}${i}`},children:_.isDefined(t)?t:e.jsx("img",{src:a,className:"wrapper__image"})})}),u=h.styled.div`
|
|
28
28
|
display: flex;
|
|
29
29
|
flex-direction: column;
|
|
30
30
|
align-items: flex-start;
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
@media ${
|
|
76
|
+
@media ${m.down("S")} {
|
|
77
77
|
& .wrapper__content {
|
|
78
78
|
align-content: center;
|
|
79
79
|
gap: 1rem;
|
|
@@ -84,9 +84,9 @@
|
|
|
84
84
|
}
|
|
85
85
|
}
|
|
86
86
|
}
|
|
87
|
-
`,
|
|
88
|
-
@media ${
|
|
87
|
+
`,j=h.styled(g.SkeletonAnimationContainer)`
|
|
88
|
+
@media ${m.down("S")} {
|
|
89
89
|
gap: 1rem;
|
|
90
90
|
flex-wrap: wrap;
|
|
91
91
|
}
|
|
92
|
-
|
|
92
|
+
`,y=({keyPrefix:t})=>e.jsx(j,{justifyContent:"center",alignItems:"center",gap:"3rem",children:[1,2,3,4,5].map(a=>e.jsx(g.SkeletonRect,{height:"4rem",width:"7.5rem"},`${t}-${a}`))}),$=({keyPrefix:t,isLoading:a=!1,fallbackComponent:n=e.jsx(e.Fragment,{}),children:s})=>e.jsx(d.Suspense,{fallbackComponent:n,children:a===!0?e.jsx(y,{keyPrefix:t}):s}),v=d.forwardRef(({title:t,subtitle:a,items:n=[],isLoading:s=!1,onSelectCard:i=()=>{},urlPrefix:o,urlSufix:c,LinkComponent:p},l)=>e.jsxs(u,{ref:l,children:[e.jsxs("div",{className:"wrapper__heading",children:[t&&e.jsx("div",{className:"wrapper__title",children:t}),a&&e.jsx("div",{className:"wrapper__subtitle",children:a})]}),e.jsx($,{isLoading:s,keyPrefix:"brand-hits-skeleton",children:e.jsx("div",{className:"wrapper__content",children:n==null?void 0:n.map((r,w)=>e.jsx(f,{image:r==null?void 0:r.image,imageComponent:r==null?void 0:r.imageComponent,onSelectCard:()=>i==null?void 0:i(r),className:"wrapper__item",urlPrefix:o,urlSufix:c,code:r==null?void 0:r.card,LinkComponent:p},`brand-hit-card__${w+1}`))})})]}));module.exports=v;
|
package/dist/BrandHitsSection.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { jsx as e,
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { m as
|
|
4
|
-
import { s as
|
|
1
|
+
import { jsx as e, Fragment as w, jsxs as h } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as g, Suspense as f } from "react";
|
|
3
|
+
import { m as x } from "./utils-MoGhNMmj.js";
|
|
4
|
+
import { s as m } from "./emotion-styled.browser.esm-DfbrHHed.js";
|
|
5
5
|
import { d as c } from "./breakpoints-BubDitvo.js";
|
|
6
|
-
import { S as
|
|
7
|
-
const
|
|
6
|
+
import { S as u, a as $ } from "./style-BFPpppS9.js";
|
|
7
|
+
const y = m.a`
|
|
8
8
|
text-decoration: none;
|
|
9
9
|
color: var(--gray-950);
|
|
10
10
|
width: 7.5rem;
|
|
@@ -30,26 +30,26 @@ const v = l.a`
|
|
|
30
30
|
height: auto;
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
|
-
`,
|
|
33
|
+
`, v = g(
|
|
34
34
|
({
|
|
35
|
-
imageComponent:
|
|
36
|
-
image:
|
|
37
|
-
onSelectCard:
|
|
35
|
+
imageComponent: a,
|
|
36
|
+
image: t,
|
|
37
|
+
onSelectCard: n,
|
|
38
38
|
urlPrefix: i,
|
|
39
39
|
urlSufix: o,
|
|
40
|
-
code:
|
|
41
|
-
LinkComponent:
|
|
42
|
-
},
|
|
43
|
-
|
|
40
|
+
code: p,
|
|
41
|
+
LinkComponent: s
|
|
42
|
+
}, l) => /* @__PURE__ */ e(
|
|
43
|
+
y,
|
|
44
44
|
{
|
|
45
|
-
ref:
|
|
46
|
-
onClick:
|
|
47
|
-
as:
|
|
48
|
-
...
|
|
49
|
-
children:
|
|
45
|
+
ref: l,
|
|
46
|
+
onClick: n,
|
|
47
|
+
as: s || "a",
|
|
48
|
+
...s ? { to: `${i}${p}${o}` } : { href: `${i}${p}${o}` },
|
|
49
|
+
children: x(a) ? a : /* @__PURE__ */ e("img", { src: t, className: "wrapper__image" })
|
|
50
50
|
}
|
|
51
51
|
)
|
|
52
|
-
),
|
|
52
|
+
), N = m.div`
|
|
53
53
|
display: flex;
|
|
54
54
|
flex-direction: column;
|
|
55
55
|
align-items: flex-start;
|
|
@@ -109,85 +109,39 @@ const v = l.a`
|
|
|
109
109
|
}
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
|
-
`,
|
|
112
|
+
`, S = m(u)`
|
|
113
113
|
@media ${c("S")} {
|
|
114
114
|
gap: 1rem;
|
|
115
115
|
flex-wrap: wrap;
|
|
116
116
|
}
|
|
117
|
-
`,
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
height: "4rem",
|
|
122
|
-
width: "7.5rem",
|
|
123
|
-
borderRadius: "0.75rem"
|
|
124
|
-
},
|
|
125
|
-
`${r}-1`
|
|
126
|
-
),
|
|
127
|
-
/* @__PURE__ */ e(
|
|
128
|
-
p,
|
|
129
|
-
{
|
|
130
|
-
height: "4rem",
|
|
131
|
-
width: "7.5rem",
|
|
132
|
-
borderRadius: "0.75rem"
|
|
133
|
-
},
|
|
134
|
-
`${r}-2`
|
|
135
|
-
),
|
|
136
|
-
/* @__PURE__ */ e(
|
|
137
|
-
p,
|
|
138
|
-
{
|
|
139
|
-
height: "4rem",
|
|
140
|
-
width: "7.5rem",
|
|
141
|
-
borderRadius: "0.75rem"
|
|
142
|
-
},
|
|
143
|
-
`${r}-3`
|
|
144
|
-
),
|
|
145
|
-
/* @__PURE__ */ e(
|
|
146
|
-
p,
|
|
147
|
-
{
|
|
148
|
-
height: "4rem",
|
|
149
|
-
width: "7.5rem",
|
|
150
|
-
borderRadius: "0.75rem"
|
|
151
|
-
},
|
|
152
|
-
`${r}-4`
|
|
153
|
-
),
|
|
154
|
-
/* @__PURE__ */ e(
|
|
155
|
-
p,
|
|
156
|
-
{
|
|
157
|
-
height: "4rem",
|
|
158
|
-
width: "7.5rem",
|
|
159
|
-
borderRadius: "0.75rem"
|
|
160
|
-
},
|
|
161
|
-
`${r}-5`
|
|
162
|
-
)
|
|
163
|
-
] }), S = ({
|
|
164
|
-
keyPrefix: r,
|
|
165
|
-
isLoading: n = !1,
|
|
166
|
-
fallbackComponent: t = /* @__PURE__ */ e(f, {}),
|
|
117
|
+
`, k = ({ keyPrefix: a }) => /* @__PURE__ */ e(S, { justifyContent: "center", alignItems: "center", gap: "3rem", children: [1, 2, 3, 4, 5].map((t) => /* @__PURE__ */ e($, { height: "4rem", width: "7.5rem" }, `${a}-${t}`)) }), b = ({
|
|
118
|
+
keyPrefix: a,
|
|
119
|
+
isLoading: t = !1,
|
|
120
|
+
fallbackComponent: n = /* @__PURE__ */ e(w, {}),
|
|
167
121
|
children: i
|
|
168
|
-
}) => /* @__PURE__ */ e(
|
|
169
|
-
({ title:
|
|
170
|
-
}, urlPrefix:
|
|
122
|
+
}) => /* @__PURE__ */ e(f, { fallbackComponent: n, children: t === !0 ? /* @__PURE__ */ e(k, { keyPrefix: a }) : i }), W = g(
|
|
123
|
+
({ title: a, subtitle: t, items: n = [], isLoading: i = !1, onSelectCard: o = () => {
|
|
124
|
+
}, urlPrefix: p, urlSufix: s, LinkComponent: l }, d) => /* @__PURE__ */ h(N, { ref: d, children: [
|
|
171
125
|
/* @__PURE__ */ h("div", { className: "wrapper__heading", children: [
|
|
172
|
-
|
|
173
|
-
|
|
126
|
+
a && /* @__PURE__ */ e("div", { className: "wrapper__title", children: a }),
|
|
127
|
+
t && /* @__PURE__ */ e("div", { className: "wrapper__subtitle", children: t })
|
|
174
128
|
] }),
|
|
175
129
|
/* @__PURE__ */ e(
|
|
176
|
-
|
|
130
|
+
b,
|
|
177
131
|
{
|
|
178
132
|
isLoading: i,
|
|
179
133
|
keyPrefix: "brand-hits-skeleton",
|
|
180
|
-
children: /* @__PURE__ */ e("div", { className: "wrapper__content", children:
|
|
181
|
-
|
|
134
|
+
children: /* @__PURE__ */ e("div", { className: "wrapper__content", children: n == null ? void 0 : n.map((r, _) => /* @__PURE__ */ e(
|
|
135
|
+
v,
|
|
182
136
|
{
|
|
183
|
-
image:
|
|
184
|
-
imageComponent:
|
|
185
|
-
onSelectCard: () => o == null ? void 0 : o(
|
|
137
|
+
image: r == null ? void 0 : r.image,
|
|
138
|
+
imageComponent: r == null ? void 0 : r.imageComponent,
|
|
139
|
+
onSelectCard: () => o == null ? void 0 : o(r),
|
|
186
140
|
className: "wrapper__item",
|
|
187
|
-
urlPrefix:
|
|
188
|
-
urlSufix:
|
|
189
|
-
code:
|
|
190
|
-
LinkComponent:
|
|
141
|
+
urlPrefix: p,
|
|
142
|
+
urlSufix: s,
|
|
143
|
+
code: r == null ? void 0 : r.card,
|
|
144
|
+
LinkComponent: l
|
|
191
145
|
},
|
|
192
146
|
`brand-hit-card__${_ + 1}`
|
|
193
147
|
)) })
|
|
@@ -196,5 +150,5 @@ const v = l.a`
|
|
|
196
150
|
] })
|
|
197
151
|
);
|
|
198
152
|
export {
|
|
199
|
-
|
|
153
|
+
W as default
|
|
200
154
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const t=require("react/jsx-runtime"),l=require("react"),K=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),p=require("./breakpoints-CcVm-gVm.cjs"),Q=require("./IconButton.cjs"),G=require("./Button.cjs"),r=require("./utils-CITgSxXe.cjs"),H=require("./useDetectMobile-DYV6V1yw.cjs"),g=require("./index-
|
|
1
|
+
"use strict";const t=require("react/jsx-runtime"),l=require("react"),K=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),p=require("./breakpoints-CcVm-gVm.cjs"),Q=require("./IconButton.cjs"),G=require("./Button.cjs"),r=require("./utils-CITgSxXe.cjs"),H=require("./useDetectMobile-DYV6V1yw.cjs"),g=require("./index-D3QZziO_.cjs"),J=require("./index-3GKF_7BJ.cjs"),W=require("./index-C8R9lsWG.cjs"),X=K.styled.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
flex-direction: column;
|
|
4
4
|
gap: 1.5rem;
|
|
@@ -6,9 +6,9 @@ import H from "./IconButton.js";
|
|
|
6
6
|
import J from "./Button.js";
|
|
7
7
|
import { l as n } from "./utils-MoGhNMmj.js";
|
|
8
8
|
import { u as W } from "./useDetectMobile-B0Jog4jQ.js";
|
|
9
|
-
import { D as X, S as Y } from "./index-
|
|
9
|
+
import { D as X, S as Y } from "./index-BXT1eY2D.js";
|
|
10
10
|
import { S as Z } from "./index-Djo0ZcRE.js";
|
|
11
|
-
import { S as x } from "./index-
|
|
11
|
+
import { S as x } from "./index-Cyt4EUZ6.js";
|
|
12
12
|
const ee = G.div`
|
|
13
13
|
display: flex;
|
|
14
14
|
flex-direction: column;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";const t=require("react/jsx-runtime"),c=require("react"),K=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),j=require("./breakpoints-CcVm-gVm.cjs"),W=require("./Button.cjs"),l=require("./utils-CITgSxXe.cjs"),z=require("./useDetectMobile-DYV6V1yw.cjs"),G=require("./style-Boz6dk5s.cjs"),P=require("./index-
|
|
1
|
+
"use strict";const t=require("react/jsx-runtime"),c=require("react"),K=require("./emotion-styled.browser.esm-DwHBgTPn.cjs"),j=require("./breakpoints-CcVm-gVm.cjs"),W=require("./Button.cjs"),l=require("./utils-CITgSxXe.cjs"),z=require("./useDetectMobile-DYV6V1yw.cjs"),G=require("./style-Boz6dk5s.cjs"),P=require("./index-D3QZziO_.cjs"),V=require("./index-3GKF_7BJ.cjs"),H=require("./index-C8R9lsWG.cjs"),J=K.styled.div`
|
|
2
2
|
display: grid;
|
|
3
3
|
grid-template-columns: ${n=>`repeat(${n.limit}, minmax(0, 1fr))`};
|
|
4
4
|
gap: 1.25rem;
|
|
@@ -6,9 +6,9 @@ import V from "./Button.js";
|
|
|
6
6
|
import { l as c } from "./utils-MoGhNMmj.js";
|
|
7
7
|
import { u as H } from "./useDetectMobile-B0Jog4jQ.js";
|
|
8
8
|
import { T as J } from "./style-D54KOzZj.js";
|
|
9
|
-
import { D as X, S as Y } from "./index-
|
|
9
|
+
import { D as X, S as Y } from "./index-BXT1eY2D.js";
|
|
10
10
|
import { S as Z } from "./index-Djo0ZcRE.js";
|
|
11
|
-
import { S as x } from "./index-
|
|
11
|
+
import { S as x } from "./index-Cyt4EUZ6.js";
|
|
12
12
|
const ee = G.div`
|
|
13
13
|
display: grid;
|
|
14
14
|
grid-template-columns: ${(r) => `repeat(${r.limit}, minmax(0, 1fr))`};
|