@lanaco/lnc-react-ui 4.0.25 → 4.0.26

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/index3.cjs CHANGED
@@ -1,68 +1,31 @@
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;
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`
3
2
  display: grid;
4
- grid-template-columns: ${t=>`repeat(${t.limit||5}, minmax(0, 1fr))`};
3
+ grid-template-columns: repeat(6, 1fr);
4
+ gap: 1.25rem;
5
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);
6
+ & .text-block-v1 {
7
+ grid-column: 1 / 4;
8
+ max-width: 27rem;
9
+ margin: auto;
30
10
  }
31
11
 
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;
12
+ @media (max-width: ${q.MOBILE_SIZE_PX+"px"}) {
13
+ grid-template-columns: repeat(2, 1fr);
44
14
 
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
- }
15
+ & .text-block-v1 {
16
+ grid-column: 1 / 3;
17
+ max-width: unset;
18
+ margin: unset;
54
19
  }
55
- }
56
20
 
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 {
21
+ & .simple-product-card {
22
+ max-width: unset;
23
+ min-width: unset;
24
+ width: unset;
63
25
  }
64
26
 
65
27
  & .img-wrapper {
28
+
66
29
  }
67
30
  }
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;
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;
package/dist/index3.js CHANGED
@@ -1,135 +1,94 @@
1
- import { jsxs as c, jsx as o } from "react/jsx-runtime";
2
- import { forwardRef as b, useState as y } from "react";
3
- import { n as S } from "./emotion-styled.browser.esm-BiK8DcgW.js";
4
- import { M as k } from "./consts-DNVz1x1I.js";
5
- import { u as v } from "./useDetectMobile-BookNOsk.js";
6
- import M from "./Button.js";
7
- import { D as u } from "./index-jVpIwR2G.js";
8
- const U = S.div`
9
- padding: 1.75rem 3rem;
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`
10
9
  display: grid;
11
- grid-template-columns: ${(i) => `repeat(${i.limit || 5}, minmax(0, 1fr))`};
10
+ grid-template-columns: repeat(6, 1fr);
11
+ gap: 1.25rem;
12
12
 
13
- gap: 2.97rem;
14
-
15
- border: 1.5px solid var(--danger-600, #e11d48);
16
- background-color: var(--danger-50, #fff1f2);
17
- position: relative;
18
- border-radius: 0.75rem;
19
- position: relative;
20
-
21
- & .urgent-tag {
22
- position: absolute;
23
- left: 1rem;
24
- top: -0.75rem;
25
- min-height: 1.5rem;
26
- max-height: 1.5rem;
27
- border-radius: 0.375rem;
28
- display: flex;
29
- align-items: center;
30
- justify-content: center;
31
- padding: 0 0.25rem;
32
- gap: 0.12rem;
33
- font-weight: 500;
34
- font-size: 0.875rem;
35
- color: var(--white, #fff);
36
- background-color: var(--danger-600, #e11d48);
13
+ & .text-block-v1 {
14
+ grid-column: 1 / 4;
15
+ max-width: 27rem;
16
+ margin: auto;
37
17
  }
38
18
 
39
- & .show-more {
40
- grid-column: 1 / 3;
41
- }
42
-
43
- & .product-card {
44
- max-width: ${(i) => `calc(${100 / i.desktopCols}% - ${(i.desktopCols - 1) * i.columnGapRem / i.desktopCols}rem)`};
45
-
46
- animation-duration: 0.2s;
47
- animation-name: animate-fade;
48
- animation-delay: 0.2s;
49
- animation-fill-mode: backwards;
50
- transition: all 0.25s ease;
19
+ @media (max-width: ${y + "px"}) {
20
+ grid-template-columns: repeat(2, 1fr);
51
21
 
52
- @keyframes animate-fade {
53
- 0% {
54
- transform: scale(0.9);
55
- -webkit-transform: scale(0.9);
56
- }
57
- 100% {
58
- transform: scale(1);
59
- -webkit-transform: scale(1);
60
- }
22
+ & .text-block-v1 {
23
+ grid-column: 1 / 3;
24
+ max-width: unset;
25
+ margin: unset;
61
26
  }
62
- }
63
27
 
64
- @media (max-width: ${k + "px"}) {
65
- grid-template-columns: repeat(2, 1fr);
66
- padding: 2rem 1.25rem;
67
- gap: 1.19rem;
68
-
69
- & .urgent-tag {
28
+ & .simple-product-card {
29
+ max-width: unset;
30
+ min-width: unset;
31
+ width: unset;
70
32
  }
71
33
 
72
34
  & .img-wrapper {
35
+
73
36
  }
74
37
  }
75
- `, A = b((i, p) => {
76
- var d;
38
+ `, I = b((l, c) => {
39
+ var o;
77
40
  const {
78
- items: r,
79
- limit: n = 5,
80
- limitMobile: s = 6,
81
- onSelectCard: t = () => {
41
+ title: d,
42
+ subtitle: a,
43
+ description: n,
44
+ buttonText: s,
45
+ buttonLink: p,
46
+ items: e,
47
+ onButtonAction: g = () => {
82
48
  },
83
- title: g = "Urgent sale",
84
- showLessText: f = "Show less",
85
- showMoreText: h = "Show more"
86
- } = i, m = v(), [a, w] = y(!1);
87
- return /* @__PURE__ */ c(U, { ref: p, limit: n, children: [
88
- /* @__PURE__ */ c("div", { className: "urgent-tag", children: [
89
- /* @__PURE__ */ o("i", { className: "mng mng-lnc-bolt-filled" }),
90
- /* @__PURE__ */ o("span", { children: g })
91
- ] }),
92
- m === !0 ? (d = r == null ? void 0 : r.slice(0, a === !0 ? r == null ? void 0 : r.length : s)) == null ? void 0 : d.map((e, l) => /* @__PURE__ */ o(
93
- u,
49
+ onSelectCard: i = () => {
50
+ }
51
+ } = l, f = k();
52
+ return /* @__PURE__ */ w(v, { ref: c, limit: 6, children: [
53
+ /* @__PURE__ */ u(
54
+ S,
94
55
  {
95
- title: e == null ? void 0 : e.title,
96
- price: e == null ? void 0 : e.price,
97
- currency: e == null ? void 0 : e.currency,
98
- image: e == null ? void 0 : e.image,
99
- sellerUuid: e == null ? void 0 : e.sellerUuid,
100
- uuid: e == null ? void 0 : e.uuid,
101
- isSponsored: e == null ? void 0 : e.isSponsored,
102
- onSelectCard: () => t == null ? void 0 : t(e == null ? void 0 : e.uuid)
103
- },
104
- l
105
- )) : r == null ? void 0 : r.slice(0, n).map((e, l) => /* @__PURE__ */ o(
106
- u,
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,
107
67
  {
108
- title: e == null ? void 0 : e.title,
109
- price: e == null ? void 0 : e.price,
110
- currency: e == null ? void 0 : e.currency,
111
- image: e == null ? void 0 : e.image,
112
- sellerUuid: e == null ? void 0 : e.sellerUuid,
113
- uuid: e == null ? void 0 : e.uuid,
114
- location: e == null ? void 0 : e.location,
115
- isSponsored: e == null ? void 0 : e.isSponsored,
116
- onSelectCard: () => t == null ? void 0 : t(e == null ? void 0 : e.uuid)
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)
117
75
  },
118
- l
119
- )),
120
- m === !0 && s < (r == null ? void 0 : r.length) && /* @__PURE__ */ o(
121
- M,
76
+ r
77
+ )) : e == null ? void 0 : e.map((t, r) => /* @__PURE__ */ u(
78
+ m,
122
79
  {
123
- className: "show-more",
124
- btnType: "basic",
125
- type: "button",
126
- color: "gray",
127
- onClick: () => w(!a),
128
- children: a === !0 ? f : h
129
- }
130
- )
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
+ ))
131
90
  ] });
132
91
  });
133
92
  export {
134
- A as default
93
+ I as default
135
94
  };
package/dist/index4.cjs CHANGED
@@ -1,48 +1,68 @@
1
- "use strict";const t=require("react/jsx-runtime"),p=require("react"),j=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),w=require("./consts-dNz9tpt4.cjs"),f=require("./useDetectMobile-rBe0FiP2.cjs"),m=require("./index-C2M7QHPq.cjs"),k=j.newStyled.div`
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;
2
3
  display: grid;
3
- grid-template-columns: repeat(2, 1fr);
4
- gap: 0;
5
-
6
- & .text-item {
7
- max-height: ${e=>e.height};
8
- min-height: ${e=>e.height};
9
- max-width: 27rem;
10
- margin: auto;
11
- }
4
+ grid-template-columns: ${t=>`repeat(${t.limit||5}, minmax(0, 1fr))`};
12
5
 
13
- & img {
14
- object-fit: cover;
15
- width: 100%;
16
- max-height: ${e=>e.height};
17
- min-height: ${e=>e.height};
18
- }
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;
19
13
 
20
- & .img-1 {
21
- border-radius: 0.75rem 0.75rem 0.75rem 0;
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);
22
30
  }
23
31
 
24
- & .img-2 {
25
- border-radius: 0.75rem 0rem 0.75rem 0.75rem;
32
+ & .show-more {
33
+ grid-column: 1 / 3;
26
34
  }
27
35
 
28
- @media (max-width: ${w.MOBILE_SIZE_PX+"px"}) {
29
- grid-template-columns: repeat(1, 1fr);
30
- gap: 1.5rem;
36
+ & .product-card {
37
+ max-width: ${t=>`calc(${100/t.desktopCols}% - ${(t.desktopCols-1)*t.columnGapRem/t.desktopCols}rem)`};
31
38
 
32
- & .img-item {
33
- width: 100%;
34
- min-height: 11.25rem;
35
- max-height: 11.25rem;
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
+ }
36
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;
37
61
 
38
- & .img1,
39
- .img2 {
40
- border-radius: 0.75rem;
62
+ & .urgent-tag {
41
63
  }
42
64
 
43
- & .text-item {
44
- min-height: unset;
45
- max-height: unset;
65
+ & .img-wrapper {
46
66
  }
47
67
  }
48
- `,q=p.forwardRef((e,T)=>{const{image1:s,image2:i,title1:n,title2:o,text1:g,text2:a,subtitle1:c,subtitle2:u,buttonText1:h,buttonText2:x,buttonLink1:l,buttonLink2:d,rowHeight:b="12.65625rem"}=e,r=f.useDetectMobile();return t.jsxs(k,{height:b,children:[t.jsx(m.TextBlockV1,{className:"text-item",title:n,subtitle:c,description:g,buttonText:h,buttonLink:l}),t.jsx("img",{className:"img-item img-1",src:s}),r!==!0&&t.jsx("img",{className:"img-item img-2",src:i}),t.jsx(m.TextBlockV1,{className:"text-item",title:o,subtitle:u,description:a,buttonText:x,buttonLink:d}),r===!0&&t.jsx("img",{className:"img-item img-2",src:i})]})});module.exports=q;
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;
package/dist/index4.js CHANGED
@@ -1,100 +1,135 @@
1
- import { jsxs as b, jsx as e } from "react/jsx-runtime";
2
- import { forwardRef as f } from "react";
3
- import { n as w } from "./emotion-styled.browser.esm-BiK8DcgW.js";
4
- import { M as T } from "./consts-DNVz1x1I.js";
5
- import { u as k } from "./useDetectMobile-BookNOsk.js";
6
- import { T as r } from "./index-DcYg32le.js";
7
- const L = w.div`
1
+ import { jsxs as c, jsx as o } from "react/jsx-runtime";
2
+ import { forwardRef as b, useState as y } from "react";
3
+ import { n as S } from "./emotion-styled.browser.esm-BiK8DcgW.js";
4
+ import { M as k } from "./consts-DNVz1x1I.js";
5
+ import { u as v } from "./useDetectMobile-BookNOsk.js";
6
+ import M from "./Button.js";
7
+ import { D as u } from "./index-jVpIwR2G.js";
8
+ const U = S.div`
9
+ padding: 1.75rem 3rem;
8
10
  display: grid;
9
- grid-template-columns: repeat(2, 1fr);
10
- gap: 0;
11
+ grid-template-columns: ${(i) => `repeat(${i.limit || 5}, minmax(0, 1fr))`};
11
12
 
12
- & .text-item {
13
- max-height: ${(t) => t.height};
14
- min-height: ${(t) => t.height};
15
- max-width: 27rem;
16
- margin: auto;
17
- }
13
+ gap: 2.97rem;
18
14
 
19
- & img {
20
- object-fit: cover;
21
- width: 100%;
22
- max-height: ${(t) => t.height};
23
- min-height: ${(t) => t.height};
24
- }
15
+ border: 1.5px solid var(--danger-600, #e11d48);
16
+ background-color: var(--danger-50, #fff1f2);
17
+ position: relative;
18
+ border-radius: 0.75rem;
19
+ position: relative;
25
20
 
26
- & .img-1 {
27
- border-radius: 0.75rem 0.75rem 0.75rem 0;
21
+ & .urgent-tag {
22
+ position: absolute;
23
+ left: 1rem;
24
+ top: -0.75rem;
25
+ min-height: 1.5rem;
26
+ max-height: 1.5rem;
27
+ border-radius: 0.375rem;
28
+ display: flex;
29
+ align-items: center;
30
+ justify-content: center;
31
+ padding: 0 0.25rem;
32
+ gap: 0.12rem;
33
+ font-weight: 500;
34
+ font-size: 0.875rem;
35
+ color: var(--white, #fff);
36
+ background-color: var(--danger-600, #e11d48);
28
37
  }
29
38
 
30
- & .img-2 {
31
- border-radius: 0.75rem 0rem 0.75rem 0.75rem;
39
+ & .show-more {
40
+ grid-column: 1 / 3;
32
41
  }
33
42
 
34
- @media (max-width: ${T + "px"}) {
35
- grid-template-columns: repeat(1, 1fr);
36
- gap: 1.5rem;
43
+ & .product-card {
44
+ max-width: ${(i) => `calc(${100 / i.desktopCols}% - ${(i.desktopCols - 1) * i.columnGapRem / i.desktopCols}rem)`};
45
+
46
+ animation-duration: 0.2s;
47
+ animation-name: animate-fade;
48
+ animation-delay: 0.2s;
49
+ animation-fill-mode: backwards;
50
+ transition: all 0.25s ease;
37
51
 
38
- & .img-item {
39
- width: 100%;
40
- min-height: 11.25rem;
41
- max-height: 11.25rem;
52
+ @keyframes animate-fade {
53
+ 0% {
54
+ transform: scale(0.9);
55
+ -webkit-transform: scale(0.9);
56
+ }
57
+ 100% {
58
+ transform: scale(1);
59
+ -webkit-transform: scale(1);
60
+ }
42
61
  }
62
+ }
63
+
64
+ @media (max-width: ${k + "px"}) {
65
+ grid-template-columns: repeat(2, 1fr);
66
+ padding: 2rem 1.25rem;
67
+ gap: 1.19rem;
43
68
 
44
- & .img1,
45
- .img2 {
46
- border-radius: 0.75rem;
69
+ & .urgent-tag {
47
70
  }
48
71
 
49
- & .text-item {
50
- min-height: unset;
51
- max-height: unset;
72
+ & .img-wrapper {
52
73
  }
53
74
  }
54
- `, y = f((t, N) => {
75
+ `, A = b((i, p) => {
76
+ var d;
55
77
  const {
56
- image1: o,
57
- image2: i,
58
- title1: s,
59
- title2: a,
60
- text1: g,
61
- text2: n,
62
- subtitle1: h,
63
- subtitle2: u,
64
- buttonText1: d,
65
- buttonText2: l,
66
- buttonLink1: c,
67
- buttonLink2: x,
68
- rowHeight: p = "12.65625rem"
69
- } = t, m = k();
70
- return /* @__PURE__ */ b(L, { height: p, children: [
71
- /* @__PURE__ */ e(
72
- r,
78
+ items: r,
79
+ limit: n = 5,
80
+ limitMobile: s = 6,
81
+ onSelectCard: t = () => {
82
+ },
83
+ title: g = "Urgent sale",
84
+ showLessText: f = "Show less",
85
+ showMoreText: h = "Show more"
86
+ } = i, m = v(), [a, w] = y(!1);
87
+ return /* @__PURE__ */ c(U, { ref: p, limit: n, children: [
88
+ /* @__PURE__ */ c("div", { className: "urgent-tag", children: [
89
+ /* @__PURE__ */ o("i", { className: "mng mng-lnc-bolt-filled" }),
90
+ /* @__PURE__ */ o("span", { children: g })
91
+ ] }),
92
+ m === !0 ? (d = r == null ? void 0 : r.slice(0, a === !0 ? r == null ? void 0 : r.length : s)) == null ? void 0 : d.map((e, l) => /* @__PURE__ */ o(
93
+ u,
73
94
  {
74
- className: "text-item",
75
- title: s,
76
- subtitle: h,
77
- description: g,
78
- buttonText: d,
79
- buttonLink: c
80
- }
81
- ),
82
- /* @__PURE__ */ e("img", { className: "img-item img-1", src: o }),
83
- m !== !0 && /* @__PURE__ */ e("img", { className: "img-item img-2", src: i }),
84
- /* @__PURE__ */ e(
85
- r,
95
+ title: e == null ? void 0 : e.title,
96
+ price: e == null ? void 0 : e.price,
97
+ currency: e == null ? void 0 : e.currency,
98
+ image: e == null ? void 0 : e.image,
99
+ sellerUuid: e == null ? void 0 : e.sellerUuid,
100
+ uuid: e == null ? void 0 : e.uuid,
101
+ isSponsored: e == null ? void 0 : e.isSponsored,
102
+ onSelectCard: () => t == null ? void 0 : t(e == null ? void 0 : e.uuid)
103
+ },
104
+ l
105
+ )) : r == null ? void 0 : r.slice(0, n).map((e, l) => /* @__PURE__ */ o(
106
+ u,
107
+ {
108
+ title: e == null ? void 0 : e.title,
109
+ price: e == null ? void 0 : e.price,
110
+ currency: e == null ? void 0 : e.currency,
111
+ image: e == null ? void 0 : e.image,
112
+ sellerUuid: e == null ? void 0 : e.sellerUuid,
113
+ uuid: e == null ? void 0 : e.uuid,
114
+ location: e == null ? void 0 : e.location,
115
+ isSponsored: e == null ? void 0 : e.isSponsored,
116
+ onSelectCard: () => t == null ? void 0 : t(e == null ? void 0 : e.uuid)
117
+ },
118
+ l
119
+ )),
120
+ m === !0 && s < (r == null ? void 0 : r.length) && /* @__PURE__ */ o(
121
+ M,
86
122
  {
87
- className: "text-item",
88
- title: a,
89
- subtitle: u,
90
- description: n,
91
- buttonText: l,
92
- buttonLink: x
123
+ className: "show-more",
124
+ btnType: "basic",
125
+ type: "button",
126
+ color: "gray",
127
+ onClick: () => w(!a),
128
+ children: a === !0 ? f : h
93
129
  }
94
- ),
95
- m === !0 && /* @__PURE__ */ e("img", { className: "img-item img-2", src: i })
130
+ )
96
131
  ] });
97
132
  });
98
133
  export {
99
- y as default
134
+ A as default
100
135
  };