@lanaco/lnc-react-ui 4.0.27 → 4.0.28

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.
@@ -0,0 +1,25 @@
1
+ "use strict";const i=require("react/jsx-runtime"),y=require("react"),S=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),w=require("./consts-dNz9tpt4.cjs"),f=require("./Button.cjs"),a=require("./utils-CE6bljYe.cjs"),C=require("./useDetectMobile-rBe0FiP2.cjs"),h=require("./style-C3OB0uad.cjs"),d=require("./index-LdP7U1Yl.cjs"),j=S.newStyled.div`
2
+ display: grid;
3
+ grid-template-columns: ${t=>`repeat(${t.limit}, minmax(0, 1fr))`};
4
+ gap: 1.25rem;
5
+
6
+ @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
7
+ display: flex;
8
+ gap: 1rem;
9
+ overflow-x: auto;
10
+
11
+ -webkit-overflow-scrolling: touch;
12
+ ::-webkit-scrollbar {
13
+ -webkit-appearance: none;
14
+ }
15
+ -ms-overflow-style: none;
16
+ /* Internet Explorer 10+ */
17
+ scrollbar-width: none;
18
+ /* Firefox */
19
+
20
+ &::-webkit-scrollbar {
21
+ display: none;
22
+ /* Safari and Chrome */
23
+ }
24
+ }
25
+ `,q=y.forwardRef((t,u)=>{const{icon:n,title:p,buttonLink:s,items:r,buttonText:m,limit:l=4,onSelectCard:c=()=>{},onButtonAction:g=()=>{}}=t,b=C.useDetectMobile();return i.jsxs(h.RegulatTitleSectionWrapper,{ref:u,children:[i.jsxs("div",{className:"regular-title",children:[i.jsxs("div",{className:"regular-title-text",children:[a.isDefinedNotEmptyString(n)&&i.jsx("i",{className:n}),i.jsx("span",{children:p})]}),a.isDefinedNotEmptyString(s)&&i.jsx(f,{type:"button",btnType:"tinted",color:"gray",onClick:()=>g(s),borderRadius:"curved",children:m})]}),i.jsx(j,{limit:l,children:b===!0?r==null?void 0:r.map((e,o)=>i.jsx(d.DetailedProductCard,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>c(e==null?void 0:e.uuid)},o)):r==null?void 0:r.slice(0,l).map((e,o)=>i.jsx(d.DetailedProductCard,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,isSponsored:e==null?void 0:e.isSponsored,imageComponent:e==null?void 0:e.imageComponent,onSelectCard:()=>c(e==null?void 0:e.uuid)},o))})]})});module.exports=q;
@@ -0,0 +1,99 @@
1
+ import { jsxs as n, jsx as i } from "react/jsx-runtime";
2
+ import { forwardRef as y } from "react";
3
+ import { n as S } from "./emotion-styled.browser.esm-BiK8DcgW.js";
4
+ import { M as w } from "./consts-DNVz1x1I.js";
5
+ import h from "./Button.js";
6
+ import { k as s } from "./utils-DtEdJZWa.js";
7
+ import { u as C } from "./useDetectMobile-BookNOsk.js";
8
+ import { R as k } from "./style-Ch-xOasu.js";
9
+ import { D as m } from "./index-jVpIwR2G.js";
10
+ const v = S.div`
11
+ display: grid;
12
+ grid-template-columns: ${(o) => `repeat(${o.limit}, minmax(0, 1fr))`};
13
+ gap: 1.25rem;
14
+
15
+ @media (max-width: ${w + "px"}) {
16
+ display: flex;
17
+ gap: 1rem;
18
+ overflow-x: auto;
19
+
20
+ -webkit-overflow-scrolling: touch;
21
+ ::-webkit-scrollbar {
22
+ -webkit-appearance: none;
23
+ }
24
+ -ms-overflow-style: none;
25
+ /* Internet Explorer 10+ */
26
+ scrollbar-width: none;
27
+ /* Firefox */
28
+
29
+ &::-webkit-scrollbar {
30
+ display: none;
31
+ /* Safari and Chrome */
32
+ }
33
+ }
34
+ `, T = y((o, p) => {
35
+ const {
36
+ icon: l,
37
+ title: u,
38
+ buttonLink: a,
39
+ items: r,
40
+ buttonText: f,
41
+ limit: d = 4,
42
+ onSelectCard: c = () => {
43
+ },
44
+ onButtonAction: g = () => {
45
+ }
46
+ } = o, b = C();
47
+ return /* @__PURE__ */ n(k, { ref: p, children: [
48
+ /* @__PURE__ */ n("div", { className: "regular-title", children: [
49
+ /* @__PURE__ */ n("div", { className: "regular-title-text", children: [
50
+ s(l) && /* @__PURE__ */ i("i", { className: l }),
51
+ /* @__PURE__ */ i("span", { children: u })
52
+ ] }),
53
+ s(a) && /* @__PURE__ */ i(
54
+ h,
55
+ {
56
+ type: "button",
57
+ btnType: "tinted",
58
+ color: "gray",
59
+ onClick: () => g(a),
60
+ borderRadius: "curved",
61
+ children: f
62
+ }
63
+ )
64
+ ] }),
65
+ /* @__PURE__ */ i(v, { limit: d, children: b === !0 ? r == null ? void 0 : r.map((e, t) => /* @__PURE__ */ i(
66
+ m,
67
+ {
68
+ title: e == null ? void 0 : e.title,
69
+ price: e == null ? void 0 : e.price,
70
+ currency: e == null ? void 0 : e.currency,
71
+ image: e == null ? void 0 : e.image,
72
+ sellerUuid: e == null ? void 0 : e.sellerUuid,
73
+ uuid: e == null ? void 0 : e.uuid,
74
+ isSponsored: e == null ? void 0 : e.isSponsored,
75
+ imageComponent: e == null ? void 0 : e.imageComponent,
76
+ onSelectCard: () => c(e == null ? void 0 : e.uuid)
77
+ },
78
+ t
79
+ )) : r == null ? void 0 : r.slice(0, d).map((e, t) => /* @__PURE__ */ i(
80
+ m,
81
+ {
82
+ title: e == null ? void 0 : e.title,
83
+ price: e == null ? void 0 : e.price,
84
+ currency: e == null ? void 0 : e.currency,
85
+ image: e == null ? void 0 : e.image,
86
+ sellerUuid: e == null ? void 0 : e.sellerUuid,
87
+ uuid: e == null ? void 0 : e.uuid,
88
+ location: e == null ? void 0 : e.location,
89
+ isSponsored: e == null ? void 0 : e.isSponsored,
90
+ imageComponent: e == null ? void 0 : e.imageComponent,
91
+ onSelectCard: () => c(e == null ? void 0 : e.uuid)
92
+ },
93
+ t
94
+ )) })
95
+ ] });
96
+ });
97
+ export {
98
+ T as default
99
+ };
@@ -0,0 +1,90 @@
1
+ "use strict";const i=require("react/jsx-runtime"),p=require("react"),c=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),g=require("./consts-dNz9tpt4.cjs"),b=require("./useDetectMobile-rBe0FiP2.cjs"),f=require("./style-C3OB0uad.cjs"),a=require("./utils-CE6bljYe.cjs"),j=c.newStyled.div`
2
+ width: 100%;
3
+ height: 22.5rem;
4
+ min-height: 22.5rem;
5
+ max-height: 22.5rem;
6
+ overflow: hidden;
7
+ box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1),
8
+ 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
9
+ border: 1px solid var(--gray-95008, #14161a14);
10
+ border-radius: 0.75rem;
11
+ margin-bottom: 0.5rem;
12
+
13
+ & img {
14
+ width: 100%;
15
+ height: 100%;
16
+ object-fit: cover;
17
+ }
18
+ `,v=c.newStyled.div`
19
+ display: grid;
20
+ grid-template-columns: ${o=>`repeat(${o.limit}, minmax(0, 1fr))`};
21
+ gap: 1.25rem;
22
+
23
+ @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
24
+ display: flex;
25
+ gap: 1rem;
26
+ overflow-x: auto;
27
+
28
+ -webkit-overflow-scrolling: touch;
29
+ ::-webkit-scrollbar {
30
+ -webkit-appearance: none;
31
+ }
32
+ -ms-overflow-style: none;
33
+ /* Internet Explorer 10+ */
34
+ scrollbar-width: none;
35
+ /* Firefox */
36
+
37
+ &::-webkit-scrollbar {
38
+ display: none;
39
+ /* Safari and Chrome */
40
+ }
41
+ }
42
+ `,y=c.newStyled.div`
43
+ display: flex;
44
+ flex-direction: column;
45
+ gap: 0.5rem;
46
+ cursor: pointer;
47
+
48
+ & img {
49
+ width: 100%;
50
+ aspect-ratio: 1 / 1; /* defining the aspect ratio of the image */
51
+ object-fit: cover; /* making sure the image isn't distorted */
52
+ border-radius: 0.75rem;
53
+ }
54
+
55
+ & .card-title {
56
+ font-size: 0.875rem;
57
+ font-weight: 600;
58
+ ${a.truncateTextInRows(2)}
59
+ }
60
+
61
+ &:hover {
62
+ & .card-title {
63
+ color: var(--primary-500, #F59E0B);
64
+ }
65
+ }
66
+
67
+ & .skeleton-img {
68
+ background-color: ${a.linearGradientAnimation("-90deg")};
69
+ border-radius: 0.75rem;
70
+ border: 1px solid white;
71
+ }
72
+
73
+ & .skeleton-title {
74
+ background-color: ${a.linearGradientAnimation("-90deg")};
75
+ width: 100%;
76
+ height: 1.25rem;
77
+ }
78
+
79
+ @media (max-width: ${g.MOBILE_SIZE_PX+"px"}) {
80
+ & img {
81
+ width: 8.875rem;
82
+ height: 8.875rem;
83
+ min-width: 8.875rem;
84
+ min-height: 8.875rem;
85
+ min-width: 8.875rem;
86
+ min-height: 8.875rem;
87
+ object-fit: cover;
88
+ }
89
+ }
90
+ `,h=p.forwardRef((o,m)=>{const{uuid:d,title:r,image:n,sellerUuid:u,onSelectCard:t=()=>{},imageComponent:s}=o;return i.jsxs(y,{className:"product-card",onClick:t,children:[a.isDefined(s)?s:i.jsx("img",{src:n}),i.jsx("div",{className:"card-title",children:r})]})}),S=p.forwardRef((o,m)=>{const{icon:d,items:r,limit:n=4,bannerImage:u,onSelectCard:t=()=>{},title:s="Season inspiration"}=o,w=b.useDetectMobile();return i.jsxs(f.RegulatTitleSectionWrapper,{ref:m,children:[i.jsx("div",{className:"regular-title",children:i.jsxs("div",{className:"regular-title-text",children:[a.isDefinedNotEmptyString(d)&&i.jsx("i",{className:d}),i.jsx("span",{children:s})]})}),i.jsx(j,{className:"products-banner",children:i.jsx("img",{src:u})}),i.jsx(v,{limit:n,children:w===!0?r==null?void 0:r.map((e,l)=>i.jsx(h,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:()=>t==null?void 0:t(e==null?void 0:e.uuid)},l)):r==null?void 0:r.slice(0,n).map((e,l)=>i.jsx(h,{title:e==null?void 0:e.title,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:()=>t==null?void 0:t(e==null?void 0:e.uuid)},l))})]})});module.exports=S;
@@ -0,0 +1,152 @@
1
+ import { jsxs as m, jsx as r } from "react/jsx-runtime";
2
+ import { forwardRef as g } from "react";
3
+ import { n as s } from "./emotion-styled.browser.esm-BiK8DcgW.js";
4
+ import { M as f } from "./consts-DNVz1x1I.js";
5
+ import { u as w } from "./useDetectMobile-BookNOsk.js";
6
+ import { R as v } from "./style-Ch-xOasu.js";
7
+ import { t as k, m as h, l as y, k as N } from "./utils-DtEdJZWa.js";
8
+ const S = s.div`
9
+ width: 100%;
10
+ height: 22.5rem;
11
+ min-height: 22.5rem;
12
+ max-height: 22.5rem;
13
+ overflow: hidden;
14
+ box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1),
15
+ 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
16
+ border: 1px solid var(--gray-95008, #14161a14);
17
+ border-radius: 0.75rem;
18
+ margin-bottom: 0.5rem;
19
+
20
+ & img {
21
+ width: 100%;
22
+ height: 100%;
23
+ object-fit: cover;
24
+ }
25
+ `, $ = s.div`
26
+ display: grid;
27
+ grid-template-columns: ${(a) => `repeat(${a.limit}, minmax(0, 1fr))`};
28
+ gap: 1.25rem;
29
+
30
+ @media (max-width: ${f + "px"}) {
31
+ display: flex;
32
+ gap: 1rem;
33
+ overflow-x: auto;
34
+
35
+ -webkit-overflow-scrolling: touch;
36
+ ::-webkit-scrollbar {
37
+ -webkit-appearance: none;
38
+ }
39
+ -ms-overflow-style: none;
40
+ /* Internet Explorer 10+ */
41
+ scrollbar-width: none;
42
+ /* Firefox */
43
+
44
+ &::-webkit-scrollbar {
45
+ display: none;
46
+ /* Safari and Chrome */
47
+ }
48
+ }
49
+ `, j = s.div`
50
+ display: flex;
51
+ flex-direction: column;
52
+ gap: 0.5rem;
53
+ cursor: pointer;
54
+
55
+ & img {
56
+ width: 100%;
57
+ aspect-ratio: 1 / 1; /* defining the aspect ratio of the image */
58
+ object-fit: cover; /* making sure the image isn't distorted */
59
+ border-radius: 0.75rem;
60
+ }
61
+
62
+ & .card-title {
63
+ font-size: 0.875rem;
64
+ font-weight: 600;
65
+ ${k(2)}
66
+ }
67
+
68
+ &:hover {
69
+ & .card-title {
70
+ color: var(--primary-500, #F59E0B);
71
+ }
72
+ }
73
+
74
+ & .skeleton-img {
75
+ background-color: ${h("-90deg")};
76
+ border-radius: 0.75rem;
77
+ border: 1px solid white;
78
+ }
79
+
80
+ & .skeleton-title {
81
+ background-color: ${h("-90deg")};
82
+ width: 100%;
83
+ height: 1.25rem;
84
+ }
85
+
86
+ @media (max-width: ${f + "px"}) {
87
+ & img {
88
+ width: 8.875rem;
89
+ height: 8.875rem;
90
+ min-width: 8.875rem;
91
+ min-height: 8.875rem;
92
+ min-width: 8.875rem;
93
+ min-height: 8.875rem;
94
+ object-fit: cover;
95
+ }
96
+ }
97
+ `, u = g((a, c) => {
98
+ const {
99
+ uuid: l,
100
+ title: i,
101
+ image: o,
102
+ sellerUuid: p,
103
+ onSelectCard: t = () => {
104
+ },
105
+ imageComponent: d
106
+ } = a;
107
+ return /* @__PURE__ */ m(j, { className: "product-card", onClick: t, children: [
108
+ y(d) ? d : /* @__PURE__ */ r("img", { src: o }),
109
+ /* @__PURE__ */ r("div", { className: "card-title", children: i })
110
+ ] });
111
+ }), P = g((a, c) => {
112
+ const {
113
+ icon: l,
114
+ items: i,
115
+ limit: o = 4,
116
+ bannerImage: p,
117
+ onSelectCard: t = () => {
118
+ },
119
+ title: d = "Season inspiration"
120
+ } = a, b = w();
121
+ return /* @__PURE__ */ m(v, { ref: c, children: [
122
+ /* @__PURE__ */ r("div", { className: "regular-title", children: /* @__PURE__ */ m("div", { className: "regular-title-text", children: [
123
+ N(l) && /* @__PURE__ */ r("i", { className: l }),
124
+ /* @__PURE__ */ r("span", { children: d })
125
+ ] }) }),
126
+ /* @__PURE__ */ r(S, { className: "products-banner", children: /* @__PURE__ */ r("img", { src: p }) }),
127
+ /* @__PURE__ */ r($, { limit: o, children: b === !0 ? i == null ? void 0 : i.map((e, n) => /* @__PURE__ */ r(
128
+ u,
129
+ {
130
+ title: e == null ? void 0 : e.title,
131
+ image: e == null ? void 0 : e.image,
132
+ sellerUuid: e == null ? void 0 : e.sellerUuid,
133
+ uuid: e == null ? void 0 : e.uuid,
134
+ onSelectCard: () => t == null ? void 0 : t(e == null ? void 0 : e.uuid)
135
+ },
136
+ n
137
+ )) : i == null ? void 0 : i.slice(0, o).map((e, n) => /* @__PURE__ */ r(
138
+ u,
139
+ {
140
+ title: e == null ? void 0 : e.title,
141
+ image: e == null ? void 0 : e.image,
142
+ sellerUuid: e == null ? void 0 : e.sellerUuid,
143
+ uuid: e == null ? void 0 : e.uuid,
144
+ onSelectCard: () => t == null ? void 0 : t(e == null ? void 0 : e.uuid)
145
+ },
146
+ n
147
+ )) })
148
+ ] });
149
+ });
150
+ export {
151
+ P as default
152
+ };
@@ -0,0 +1,31 @@
1
+ "use strict";const r=require("react/jsx-runtime"),w=require("react"),h=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),q=require("./consts-dNz9tpt4.cjs"),y=require("./useDetectMobile-rBe0FiP2.cjs"),s=require("./index-BlV3tdJ8.cjs"),S=require("./index-C2M7QHPq.cjs"),j=h.newStyled.div`
2
+ display: grid;
3
+ grid-template-columns: repeat(6, 1fr);
4
+ gap: 1.25rem;
5
+
6
+ & .text-block-v1 {
7
+ grid-column: 1 / 4;
8
+ max-width: 27rem;
9
+ margin: auto;
10
+ }
11
+
12
+ @media (max-width: ${q.MOBILE_SIZE_PX+"px"}) {
13
+ grid-template-columns: repeat(2, 1fr);
14
+
15
+ & .text-block-v1 {
16
+ grid-column: 1 / 3;
17
+ max-width: unset;
18
+ margin: unset;
19
+ }
20
+
21
+ & .simple-product-card {
22
+ max-width: unset;
23
+ min-width: unset;
24
+ width: unset;
25
+ }
26
+
27
+ & .img-wrapper {
28
+
29
+ }
30
+ }
31
+ `,k=w.forwardRef((n,o)=>{var c;const{title:d,subtitle:l,description:m,buttonText:a,buttonLink:p,items:t,onButtonAction:g=()=>{},onSelectCard:i=()=>{}}=n,b=y.useDetectMobile();return r.jsxs(j,{ref:o,limit:6,children:[r.jsx(S.TextBlockV1,{subtitle:l,title:d,description:m,buttonText:a,buttonLink:p,onButtonAction:g,className:"text-block-v1"}),b===!0?(c=t==null?void 0:t.slice(0,4))==null?void 0:c.map((e,u)=>r.jsx(s.SimpleProductCard,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:()=>i==null?void 0:i(e==null?void 0:e.uuid)},u)):t==null?void 0:t.map((e,u)=>r.jsx(s.SimpleProductCard,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,onSelectCard:()=>i==null?void 0:i(e==null?void 0:e.uuid)},u))]})});module.exports=k;
@@ -0,0 +1,94 @@
1
+ import { jsxs as w, jsx as u } from "react/jsx-runtime";
2
+ import { forwardRef as b } from "react";
3
+ import { n as h } from "./emotion-styled.browser.esm-BiK8DcgW.js";
4
+ import { M as y } from "./consts-DNVz1x1I.js";
5
+ import { u as k } from "./useDetectMobile-BookNOsk.js";
6
+ import { S as m } from "./index-DGl-lSfF.js";
7
+ import { T as S } from "./index-DcYg32le.js";
8
+ const v = h.div`
9
+ display: grid;
10
+ grid-template-columns: repeat(6, 1fr);
11
+ gap: 1.25rem;
12
+
13
+ & .text-block-v1 {
14
+ grid-column: 1 / 4;
15
+ max-width: 27rem;
16
+ margin: auto;
17
+ }
18
+
19
+ @media (max-width: ${y + "px"}) {
20
+ grid-template-columns: repeat(2, 1fr);
21
+
22
+ & .text-block-v1 {
23
+ grid-column: 1 / 3;
24
+ max-width: unset;
25
+ margin: unset;
26
+ }
27
+
28
+ & .simple-product-card {
29
+ max-width: unset;
30
+ min-width: unset;
31
+ width: unset;
32
+ }
33
+
34
+ & .img-wrapper {
35
+
36
+ }
37
+ }
38
+ `, I = b((l, c) => {
39
+ var o;
40
+ const {
41
+ title: d,
42
+ subtitle: a,
43
+ description: n,
44
+ buttonText: s,
45
+ buttonLink: p,
46
+ items: e,
47
+ onButtonAction: g = () => {
48
+ },
49
+ onSelectCard: i = () => {
50
+ }
51
+ } = l, f = k();
52
+ return /* @__PURE__ */ w(v, { ref: c, limit: 6, children: [
53
+ /* @__PURE__ */ u(
54
+ S,
55
+ {
56
+ subtitle: a,
57
+ title: d,
58
+ description: n,
59
+ buttonText: s,
60
+ buttonLink: p,
61
+ onButtonAction: g,
62
+ className: "text-block-v1"
63
+ }
64
+ ),
65
+ f === !0 ? (o = e == null ? void 0 : e.slice(0, 4)) == null ? void 0 : o.map((t, r) => /* @__PURE__ */ u(
66
+ m,
67
+ {
68
+ title: t == null ? void 0 : t.title,
69
+ price: t == null ? void 0 : t.price,
70
+ currency: t == null ? void 0 : t.currency,
71
+ image: t == null ? void 0 : t.image,
72
+ sellerUuid: t == null ? void 0 : t.sellerUuid,
73
+ uuid: t == null ? void 0 : t.uuid,
74
+ onSelectCard: () => i == null ? void 0 : i(t == null ? void 0 : t.uuid)
75
+ },
76
+ r
77
+ )) : e == null ? void 0 : e.map((t, r) => /* @__PURE__ */ u(
78
+ m,
79
+ {
80
+ title: t == null ? void 0 : t.title,
81
+ price: t == null ? void 0 : t.price,
82
+ currency: t == null ? void 0 : t.currency,
83
+ image: t == null ? void 0 : t.image,
84
+ sellerUuid: t == null ? void 0 : t.sellerUuid,
85
+ uuid: t == null ? void 0 : t.uuid,
86
+ onSelectCard: () => i == null ? void 0 : i(t == null ? void 0 : t.uuid)
87
+ },
88
+ r
89
+ ))
90
+ ] });
91
+ });
92
+ export {
93
+ I as default
94
+ };
@@ -0,0 +1,68 @@
1
+ "use strict";const i=require("react/jsx-runtime"),m=require("react"),b=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),y=require("./consts-dNz9tpt4.cjs"),S=require("./useDetectMobile-rBe0FiP2.cjs"),k=require("./Button.cjs"),u=require("./index-LdP7U1Yl.cjs"),j=b.newStyled.div`
2
+ padding: 1.75rem 3rem;
3
+ display: grid;
4
+ grid-template-columns: ${t=>`repeat(${t.limit||5}, minmax(0, 1fr))`};
5
+
6
+ gap: 2.97rem;
7
+
8
+ border: 1.5px solid var(--danger-600, #e11d48);
9
+ background-color: var(--danger-50, #fff1f2);
10
+ position: relative;
11
+ border-radius: 0.75rem;
12
+ position: relative;
13
+
14
+ & .urgent-tag {
15
+ position: absolute;
16
+ left: 1rem;
17
+ top: -0.75rem;
18
+ min-height: 1.5rem;
19
+ max-height: 1.5rem;
20
+ border-radius: 0.375rem;
21
+ display: flex;
22
+ align-items: center;
23
+ justify-content: center;
24
+ padding: 0 0.25rem;
25
+ gap: 0.12rem;
26
+ font-weight: 500;
27
+ font-size: 0.875rem;
28
+ color: var(--white, #fff);
29
+ background-color: var(--danger-600, #e11d48);
30
+ }
31
+
32
+ & .show-more {
33
+ grid-column: 1 / 3;
34
+ }
35
+
36
+ & .product-card {
37
+ max-width: ${t=>`calc(${100/t.desktopCols}% - ${(t.desktopCols-1)*t.columnGapRem/t.desktopCols}rem)`};
38
+
39
+ animation-duration: 0.2s;
40
+ animation-name: animate-fade;
41
+ animation-delay: 0.2s;
42
+ animation-fill-mode: backwards;
43
+ transition: all 0.25s ease;
44
+
45
+ @keyframes animate-fade {
46
+ 0% {
47
+ transform: scale(0.9);
48
+ -webkit-transform: scale(0.9);
49
+ }
50
+ 100% {
51
+ transform: scale(1);
52
+ -webkit-transform: scale(1);
53
+ }
54
+ }
55
+ }
56
+
57
+ @media (max-width: ${y.MOBILE_SIZE_PX+"px"}) {
58
+ grid-template-columns: repeat(2, 1fr);
59
+ padding: 2rem 1.25rem;
60
+ gap: 1.19rem;
61
+
62
+ & .urgent-tag {
63
+ }
64
+
65
+ & .img-wrapper {
66
+ }
67
+ }
68
+ `,v=m.forwardRef((t,p)=>{var c;const{items:r,limit:n=5,limitMobile:l=6,onSelectCard:o=()=>{},title:g="Urgent sale",showLessText:f="Show less",showMoreText:h="Show more"}=t,d=S.useDetectMobile(),[a,w]=m.useState(!1);return i.jsxs(j,{ref:p,limit:n,children:[i.jsxs("div",{className:"urgent-tag",children:[i.jsx("i",{className:"mng mng-lnc-bolt-filled"}),i.jsx("span",{children:g})]}),d===!0?(c=r==null?void 0:r.slice(0,a===!0?r==null?void 0:r.length:l))==null?void 0:c.map((e,s)=>i.jsx(u.DetailedProductCard,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,isSponsored:e==null?void 0:e.isSponsored,onSelectCard:()=>o==null?void 0:o(e==null?void 0:e.uuid)},s)):r==null?void 0:r.slice(0,n).map((e,s)=>i.jsx(u.DetailedProductCard,{title:e==null?void 0:e.title,price:e==null?void 0:e.price,currency:e==null?void 0:e.currency,image:e==null?void 0:e.image,sellerUuid:e==null?void 0:e.sellerUuid,uuid:e==null?void 0:e.uuid,location:e==null?void 0:e.location,isSponsored:e==null?void 0:e.isSponsored,onSelectCard:()=>o==null?void 0:o(e==null?void 0:e.uuid)},s)),d===!0&&l<(r==null?void 0:r.length)&&i.jsx(k,{className:"show-more",btnType:"basic",type:"button",color:"gray",onClick:()=>w(!a),children:a===!0?f:h})]})});module.exports=v;