@lanaco/lnc-react-ui 4.0.26 → 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.
- package/dist/DetailedProductsSection.cjs +25 -0
- package/dist/DetailedProductsSection.js +99 -0
- package/dist/ProductsWithBannerSection.cjs +90 -0
- package/dist/ProductsWithBannerSection.js +152 -0
- package/dist/SimpleProductsSection.cjs +31 -0
- package/dist/SimpleProductsSection.js +94 -0
- package/dist/UrgentSaleProductsSection.cjs +68 -0
- package/dist/UrgentSaleProductsSection.js +135 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +14 -14
- package/dist/index10.cjs +134 -63
- package/dist/index10.js +223 -121
- package/dist/index11.cjs +112 -62
- package/dist/index11.js +1510 -101
- package/dist/index2.cjs +41 -18
- package/dist/index2.js +86 -85
- package/dist/index3.cjs +72 -22
- package/dist/index3.js +128 -78
- package/dist/index4.cjs +51 -54
- package/dist/index4.js +79 -110
- package/dist/index5.cjs +66 -32
- package/dist/index5.js +118 -80
- package/dist/index6.cjs +124 -55
- package/dist/index6.js +194 -116
- package/dist/index7.cjs +66 -46
- package/dist/index7.js +104 -83
- package/dist/index8.cjs +164 -52
- package/dist/index8.js +278 -104
- package/dist/index9.cjs +68 -120
- package/dist/index9.js +184 -185
- package/package.json +1 -1
- package/vite.config.js +4 -4
- package/dist/index12.cjs +0 -194
- package/dist/index12.js +0 -312
- package/dist/index13.cjs +0 -98
- package/dist/index13.js +0 -221
- package/dist/index14.cjs +0 -161
- package/dist/index14.js +0 -254
- package/dist/index15.cjs +0 -135
- package/dist/index15.js +0 -1534
|
@@ -0,0 +1,135 @@
|
|
|
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;
|
|
10
|
+
display: grid;
|
|
11
|
+
grid-template-columns: ${(i) => `repeat(${i.limit || 5}, minmax(0, 1fr))`};
|
|
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);
|
|
37
|
+
}
|
|
38
|
+
|
|
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;
|
|
51
|
+
|
|
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
|
+
}
|
|
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;
|
|
68
|
+
|
|
69
|
+
& .urgent-tag {
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
& .img-wrapper {
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
`, A = b((i, p) => {
|
|
76
|
+
var d;
|
|
77
|
+
const {
|
|
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,
|
|
94
|
+
{
|
|
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,
|
|
122
|
+
{
|
|
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
|
+
)
|
|
131
|
+
] });
|
|
132
|
+
});
|
|
133
|
+
export {
|
|
134
|
+
A as default
|
|
135
|
+
};
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./CheckBoxInput.cjs"),n=require("./ColorInput.cjs"),e=require("./DateInput.cjs"),t=require("./DecimalInput.cjs"),i=require("./DecimalInputV2.cjs"),u=require("./FileInput.cjs"),c=require("./NumberInput.cjs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./CheckBoxInput.cjs"),n=require("./ColorInput.cjs"),e=require("./DateInput.cjs"),t=require("./DecimalInput.cjs"),i=require("./DecimalInputV2.cjs"),u=require("./FileInput.cjs"),c=require("./NumberInput.cjs"),s=require("./PasswordInput.cjs"),a=require("./RadioInput.cjs"),d=require("./RangeSlider.cjs"),q=require("./TextAreaInput.cjs"),l=require("./TextInput.cjs"),p=require("./TimeInput.cjs"),S=require("./Badge.cjs"),m=require("./Chip.cjs"),I=require("./DataView.cjs"),D=require("./DetailsView.cjs"),b=require("./EditableTable.cjs"),g=require("./FormView.cjs"),T=require("./Kanban.cjs"),w=require("./KanbanCard-CofqdTrO.cjs"),P=require("./KanbanHeader.cjs"),F=require("./KanbanFooter.cjs"),B=require("./KanbanView.cjs"),x=require("./KanbanActionsToolbar.cjs"),C=require("./Table.cjs"),M=require("./TableView.cjs"),f=require("./ActionsToolbar.cjs"),A=require("./Alert.cjs"),v=require("./Notification.cjs"),h=require("./NotificationContainer.cjs"),G=require("./NotificationMessage.cjs"),K=require("./ProgressBar.cjs"),L=require("./Spinner.cjs"),N=require("./Avatar.cjs"),V=require("./Button.cjs"),y=require("./Icon.cjs"),$=require("./IconButton.cjs"),k=require("./Link.cjs"),R=require("./Surface.cjs"),H=require("./UploadedFile.cjs"),W=require("./DoubleRangeSlider.cjs"),O=require("./DragAndDropFile.cjs"),U=require("./DragDropFiles.cjs"),E=require("./Dropdown.cjs"),j=require("./DropdownLookup.cjs"),z=require("./MultiSelectDropdown.cjs"),J=require("./MultiSelectDropdownLookup.cjs"),Q=require("./RadioGroup.cjs"),X=require("./SearchBar.cjs"),Y=require("./Toggle.cjs"),Z=require("./ButtonGroup.cjs"),_=require("./Content.cjs"),ee=require("./FlexBox.cjs"),re=require("./FlexGrid.cjs"),oe=require("./FlexGridItem.cjs"),ne=require("./Footer.cjs"),te=require("./FormField.cjs"),ie=require("./Grid.cjs"),ue=require("./GridItem.cjs"),ce=require("./Header.cjs"),se=require("./PageLayout.cjs"),ae=require("./Sidebar.cjs"),de=require("./Tabs.cjs"),qe=require("./TabItem.cjs"),le=require("./Accordion.cjs"),pe=require("./AccordionSummary.cjs"),Se=require("./AccordionDetails.cjs"),me=require("./Breadcrumbs.cjs"),Ie=require("./ConfirmationForm.cjs"),De=require("./Drawer.cjs"),be=require("./DropdownMenu.cjs"),ge=require("./DropdownItem.cjs"),Te=require("./NestedDropdownItem.cjs"),we=require("./Separator.cjs"),Pe=require("./Modal.cjs"),Fe=require("./Pagination.cjs"),Be=require("./Popover.cjs"),xe=require("./PopoverClose.cjs"),Ce=require("./PopoverHeading.cjs"),Me=require("./PopoverContent.cjs"),fe=require("./PopoverTrigger.cjs"),Ae=require("./PopoverDescription.cjs"),ve=require("./SwipeableDrawer.cjs"),he=require("./TreeMenu.cjs"),Ge=require("./MenuItem.cjs"),Ke=require("./NestedMenuItem.cjs"),Le=require("./TreeMenuSeparator.cjs"),Ne=require("./index6.cjs"),Ve=require("./DetailedProductsSection.cjs"),ye=require("./ProductsWithBannerSection.cjs"),$e=require("./SimpleProductsSection.cjs"),ke=require("./UrgentSaleProductsSection.cjs"),Re=require("./index11.cjs"),He=require("./index2.cjs"),We=require("./index3.cjs"),Oe=require("./index4.cjs"),Ue=require("./index5.cjs"),Ee=require("./index7.cjs"),je=require("./index8.cjs"),ze=require("./index9.cjs"),Je=require("./index10.cjs"),r=require("./ThemeProvider.cjs"),Qe=require("./CustomStyles-CBON9fD-.cjs");exports.CheckBoxInput=o;exports.ColorInput=n;exports.DateInput=e.default;exports.registerLocale=e.registerLocale;exports.DecimalInput=t;exports.DecimalInputV2=i;exports.FileInput=u;exports.NumberInput=c;exports.PasswordInput=s;exports.RadioInput=a;exports.RangeSlider=d;exports.TextAreaInput=q;exports.TextInput=l;exports.TimeInput=p;exports.Badge=S;exports.Chip=m;exports.DataView=I;exports.DetailsView=D;exports.EditableTable=b;exports.FormView=g;exports.Kanban=T;exports.KanbanCard=w.KanbanCard;exports.KanbanHeader=P;exports.KanbanFooter=F;exports.KanbanView=B;exports.KanbanActionsToolbar=x;exports.Table=C.default;exports.TableView=M;exports.ActionsToolbar=f;exports.Alert=A;exports.Notification=v;exports.NotificationContainer=h;exports.NotificationMessage=G;exports.ProgressBar=K;exports.Spinner=L;exports.Avatar=N;exports.Button=V;exports.Icon=y;exports.IconButton=$;exports.Link=k;exports.Surface=R;exports.UploadedFile=H;exports.DoubleRangeSlider=W;exports.DragAndDropFile=O;exports.DragDropFiles=U;exports.Dropdown=E.default;exports.DropdownLookup=j;exports.MultiSelectDropdown=z;exports.MultiSelectDropdownLookup=J;exports.RadioGroup=Q;exports.SearchBar=X;exports.Toggle=Y;exports.ButtonGroup=Z;exports.Content=_;exports.FlexBox=ee;exports.FlexGrid=re;exports.FlexGridItem=oe;exports.Footer=ne;exports.FormField=te;exports.Grid=ie;exports.GridItem=ue;exports.Header=ce;exports.PageLayout=se;exports.Sidebar=ae;exports.Tabs=de;exports.TabItem=qe;exports.Accordion=le;exports.AccordionSummary=pe;exports.AccordionDetails=Se.default;exports.Breadcrumbs=me;exports.ConfirmationForm=Ie;exports.Drawer=De;exports.DropdownMenu=be;exports.DropdownItem=ge;exports.NestedDropdownItem=Te;exports.Separator=we;exports.Modal=Pe;exports.Pagination=Fe;exports.Popover=Be;exports.PopoverClose=xe;exports.PopoverHeading=Ce;exports.PopoverContent=Me;exports.PopoverTrigger=fe;exports.PopoverDescription=Ae;exports.SwipeableDrawer=ve;exports.TreeMenu=he;exports.MenuItem=Ge;exports.NestedMenuItem=Ke;exports.TreeMenuSeparator=Le;exports.MasonryGeneralCardsSection=Ne;exports.DetailedProductsSection=Ve;exports.ProductsWithBannerSection=ye;exports.SimpleProductsSection=$e;exports.UrgentSaleProductsSection=ke;exports.BannerSectionCarousel=Re;exports.BannerSectionGrid=He;exports.BannerSectionSimple=We;exports.BannerSectionWithList=Oe;exports.BannerSectionWithListImage=Ue;exports.BrandHitsSection=Ee;exports.FieldOfInterestsMasonrySection=je;exports.FieldOfInterestsWithAvatarsCardsSection=ze;exports.FieldOfInterestsWithTagsCardsSection=Je;exports.ThemeProvider=r.default;exports.useTheme=r.useTheme;exports.components=Qe.components;
|
package/dist/index.js
CHANGED
|
@@ -86,20 +86,20 @@ import { default as ur } from "./TreeMenu.js";
|
|
|
86
86
|
import { default as xr } from "./MenuItem.js";
|
|
87
87
|
import { default as ir } from "./NestedMenuItem.js";
|
|
88
88
|
import { default as Sr } from "./TreeMenuSeparator.js";
|
|
89
|
-
import { default as Dr } from "./
|
|
90
|
-
import { default as gr } from "./
|
|
91
|
-
import { default as wr } from "./
|
|
92
|
-
import { default as Fr } from "./
|
|
93
|
-
import { default as Cr } from "./
|
|
94
|
-
import { default as hr } from "./
|
|
95
|
-
import { default as vr } from "./
|
|
96
|
-
import { default as Kr } from "./
|
|
97
|
-
import { default as Nr } from "./
|
|
98
|
-
import { default as Wr } from "./
|
|
99
|
-
import { default as yr } from "./
|
|
100
|
-
import { default as Rr } from "./
|
|
101
|
-
import { default as Ur } from "./
|
|
102
|
-
import { default as jr } from "./
|
|
89
|
+
import { default as Dr } from "./index6.js";
|
|
90
|
+
import { default as gr } from "./DetailedProductsSection.js";
|
|
91
|
+
import { default as wr } from "./ProductsWithBannerSection.js";
|
|
92
|
+
import { default as Fr } from "./SimpleProductsSection.js";
|
|
93
|
+
import { default as Cr } from "./UrgentSaleProductsSection.js";
|
|
94
|
+
import { default as hr } from "./index11.js";
|
|
95
|
+
import { default as vr } from "./index2.js";
|
|
96
|
+
import { default as Kr } from "./index3.js";
|
|
97
|
+
import { default as Nr } from "./index4.js";
|
|
98
|
+
import { default as Wr } from "./index5.js";
|
|
99
|
+
import { default as yr } from "./index7.js";
|
|
100
|
+
import { default as Rr } from "./index8.js";
|
|
101
|
+
import { default as Ur } from "./index9.js";
|
|
102
|
+
import { default as jr } from "./index10.js";
|
|
103
103
|
import { default as zr, useTheme as Jr } from "./ThemeProvider.js";
|
|
104
104
|
import { c as Xr } from "./CustomStyles-DuADCM-0.js";
|
|
105
105
|
export {
|
package/dist/index10.cjs
CHANGED
|
@@ -1,90 +1,161 @@
|
|
|
1
|
-
"use strict";const
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
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);
|
|
1
|
+
"use strict";const t=require("react/jsx-runtime"),m=require("react"),p=require("./emotion-styled.browser.esm-Cbp_XsK4.cjs"),l=require("./utils-CE6bljYe.cjs"),y=require("./Icon.cjs"),v=require("./emotion-element-5486c51c.browser.esm-QRQ5FSjv.cjs"),j=require("./consts-dNz9tpt4.cjs"),b=p.newStyled.div`
|
|
2
|
+
display: flex;
|
|
3
|
+
flex-direction: column;
|
|
4
|
+
align-items: flex-start;
|
|
5
|
+
flex-shrink: 0;
|
|
6
|
+
align-self: stretch;
|
|
10
7
|
border-radius: 0.75rem;
|
|
11
|
-
|
|
8
|
+
border: 1px solid var(--neutral-9508, rgba(20, 22, 26, 0.08));
|
|
9
|
+
background: var(--Lanaco-Gray-white, #fff);
|
|
10
|
+
|
|
11
|
+
/* drop-shadow-sm */
|
|
12
|
+
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
|
|
12
13
|
|
|
13
|
-
&
|
|
14
|
+
& .wrapper__image {
|
|
14
15
|
width: 100%;
|
|
15
|
-
|
|
16
|
+
aspect-ratio: 1 / 1;
|
|
16
17
|
object-fit: cover;
|
|
18
|
+
height: auto;
|
|
19
|
+
border-radius: 0.75rem 0.75rem 0 0;
|
|
17
20
|
}
|
|
18
|
-
`,v=c.newStyled.div`
|
|
19
|
-
display: grid;
|
|
20
|
-
grid-template-columns: ${o=>`repeat(${o.limit}, minmax(0, 1fr))`};
|
|
21
|
-
gap: 1.25rem;
|
|
22
21
|
|
|
23
|
-
|
|
22
|
+
& .wrapper__content {
|
|
24
23
|
display: flex;
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
padding: 0.75rem;
|
|
25
|
+
flex-direction: column;
|
|
26
|
+
align-items: flex-start;
|
|
27
|
+
gap: 0.25rem;
|
|
28
|
+
align-self: stretch;
|
|
27
29
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
-
|
|
30
|
+
& .wrapper__title {
|
|
31
|
+
color: var(--gray-950);
|
|
32
|
+
font-size: 1rem;
|
|
33
|
+
font-style: normal;
|
|
34
|
+
font-weight: 500;
|
|
35
|
+
line-height: 1.5rem;
|
|
36
|
+
${l.truncateTextInRows(2)}
|
|
31
37
|
}
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
38
|
+
|
|
39
|
+
& .wrapper__description {
|
|
40
|
+
color: var(--gray-600);
|
|
41
|
+
font-size: 0.75rem;
|
|
42
|
+
font-style: normal;
|
|
43
|
+
font-weight: 400;
|
|
44
|
+
line-height: 1rem;
|
|
45
|
+
letter-spacing: 0.025rem;
|
|
46
|
+
${l.truncateTextInRows(2)}
|
|
40
47
|
}
|
|
41
48
|
}
|
|
42
|
-
|
|
49
|
+
`,$=p.newStyled.div`
|
|
50
|
+
width: 100%;
|
|
51
|
+
height: 11.625rem;
|
|
52
|
+
border-radius: 0.75rem;
|
|
53
|
+
background: ${l.linearGradientAnimation("-90deg")};
|
|
54
|
+
`,k=p.newStyled.div`
|
|
43
55
|
display: flex;
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
56
|
+
padding: 0 0.75rem 0 0;
|
|
57
|
+
align-items: center;
|
|
58
|
+
background: var(--neutral-9504, rgba(20, 22, 26, 0.04));
|
|
59
|
+
border-radius: 999px;
|
|
47
60
|
|
|
48
|
-
&
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
border-radius:
|
|
61
|
+
& .wrapper__icon {
|
|
62
|
+
font-size: 1.75rem;
|
|
63
|
+
color: var(--gray-950, #14161a);
|
|
64
|
+
background: var(--gray-200);
|
|
65
|
+
border-radius: 999px;
|
|
66
|
+
width: 2.75rem;
|
|
67
|
+
height: 2.75rem;
|
|
68
|
+
|
|
69
|
+
& i {
|
|
70
|
+
width: auto;
|
|
71
|
+
}
|
|
53
72
|
}
|
|
54
73
|
|
|
55
|
-
& .
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
74
|
+
& .wrapper__text {
|
|
75
|
+
color: var(--gray-950, #14161a);
|
|
76
|
+
text-align: center;
|
|
77
|
+
font-size: 1rem;
|
|
78
|
+
font-style: normal;
|
|
79
|
+
font-weight: 400;
|
|
80
|
+
line-height: 1.5rem;
|
|
59
81
|
}
|
|
60
82
|
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
83
|
+
&.active {
|
|
84
|
+
background: var(--yellow-600, #d97706);
|
|
85
|
+
|
|
86
|
+
& .wrapper__icon {
|
|
87
|
+
color: var(--white, #fff);
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
& .wrapper__text {
|
|
91
|
+
color: var(--white, #fff);
|
|
64
92
|
}
|
|
65
93
|
}
|
|
94
|
+
`,N=p.newStyled.div`
|
|
95
|
+
width: 7rem;
|
|
96
|
+
height: 3rem;
|
|
97
|
+
border-radius: 999px;
|
|
98
|
+
background: ${l.linearGradientAnimation("-90deg")};
|
|
99
|
+
`,I=m.forwardRef(({},r)=>t.jsx(N,{})),W=m.forwardRef(({text:r,isActive:n,icon:i,onSelectCard:o=()=>{}},d)=>t.jsxs(k,{className:n?"active":"",onClick:o,children:[t.jsx(y,{icon:i,className:"wrapper__icon"}),t.jsx("div",{className:"wrapper__text",children:r})]})),R=m.forwardRef(({image:r,imageComponent:n,title:i,description:o,onSelectCard:d=()=>{}},x)=>{const{theme:f}=v.useTheme();return t.jsxs(b,{theme:f,onClick:d,children:[l.isDefined(n)?n:t.jsx("img",{src:r,className:"wrapper__image"}),t.jsxs("div",{className:"wrapper__content",children:[i&&t.jsx("div",{className:"wrapper__title",children:i}),o&&t.jsx("div",{className:"wrapper__description",children:o})]})]})}),T=m.forwardRef(({},r)=>t.jsx($,{})),q=p.newStyled.div`
|
|
100
|
+
display: flex;
|
|
101
|
+
flex-direction: column;
|
|
102
|
+
align-items: center;
|
|
103
|
+
gap: 1.5rem;
|
|
66
104
|
|
|
67
|
-
& .
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
105
|
+
& .wrapper__heading {
|
|
106
|
+
display: flex;
|
|
107
|
+
flex-direction: column;
|
|
108
|
+
gap: 1rem;
|
|
109
|
+
text-align: center;
|
|
110
|
+
|
|
111
|
+
& .wrapper__title {
|
|
112
|
+
color: var(--gray-950, #14161a);
|
|
113
|
+
text-align: center;
|
|
114
|
+
font-size: 1.5rem;
|
|
115
|
+
font-style: normal;
|
|
116
|
+
font-weight: 600;
|
|
117
|
+
line-height: 2rem;
|
|
118
|
+
letter-spacing: -0.47px;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
& .wrapper__subtitle {
|
|
122
|
+
color: var(---gray-600, #676e79);
|
|
123
|
+
font-size: 0.875rem;
|
|
124
|
+
font-style: normal;
|
|
125
|
+
font-weight: 400;
|
|
126
|
+
line-height: 1.25rem;
|
|
127
|
+
letter-spacing: 0.25px;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
& .wrapper__tags {
|
|
132
|
+
display: grid;
|
|
133
|
+
grid-template-columns: ${r=>`repeat(${r==null?void 0:r.limitTags}, minmax(0, 1fr))`};
|
|
134
|
+
justify-content: center;
|
|
135
|
+
align-items: center;
|
|
136
|
+
gap: 0.75rem;
|
|
71
137
|
}
|
|
72
138
|
|
|
73
|
-
& .
|
|
74
|
-
|
|
139
|
+
& .wrapper__cards {
|
|
140
|
+
display: grid;
|
|
141
|
+
grid-template-columns: ${r=>`repeat(${r==null?void 0:r.limitCards}, minmax(0, 1fr))`};
|
|
142
|
+
justify-content: center;
|
|
143
|
+
align-items: center;
|
|
144
|
+
gap: 1.5rem;
|
|
75
145
|
width: 100%;
|
|
76
|
-
height: 1.25rem;
|
|
77
146
|
}
|
|
78
147
|
|
|
79
|
-
@media (max-width: ${
|
|
80
|
-
&
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
148
|
+
@media (max-width: ${j.MOBILE_SIZE_PX+"px"}) {
|
|
149
|
+
& .wrapper__tags {
|
|
150
|
+
display: flex;
|
|
151
|
+
overflow-x: scroll;
|
|
152
|
+
justify-content: flex-start;
|
|
153
|
+
width: 100%;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
& .wrapper__cards {
|
|
157
|
+
grid-template-columns: ${r=>`repeat(${r==null?void 0:r.limitCardsForMobile}, minmax(0, 1fr))`};
|
|
158
|
+
gap: 1rem;
|
|
88
159
|
}
|
|
89
160
|
}
|
|
90
|
-
`,
|
|
161
|
+
`,C=m.forwardRef(({title:r,subtitle:n,tags:i=[],limitTags:o=7,limitTagsForMobile:d=7,limitCards:x=3,limitCardsForMobile:f=2,cards:s=[],onSelectTag:c=()=>{},onSelectCard:_=()=>{}},z)=>{var g,u;const h=e=>{c==null||c(e==null?void 0:e.uuid)},w=e=>{_==null||_(e==null?void 0:e.uuid)};return t.jsxs(q,{limitTags:o,limitTagsForMobile:d,limitCards:x,limitCardsForMobile:f,children:[t.jsxs("div",{className:"wrapper__heading",children:[r&&t.jsx("div",{className:"wrapper__title",children:r}),n&&t.jsx("div",{className:"wrapper__subtitle",children:n})]}),t.jsx("div",{className:"wrapper__tags",children:i&&(i==null?void 0:i.length)>0?i==null?void 0:i.map((e,a)=>t.jsx(W,{icon:e==null?void 0:e.icon,text:e==null?void 0:e.text,onSelectCard:()=>h==null?void 0:h(e)},`field-of-interests-with-tags-card-tag__${a+1}`)):(g=Array.from("123"))==null?void 0:g.map((e,a)=>t.jsx(I,{},`field-of-interests-with-tags-card-tag-skeleton__${a+1}`))}),t.jsx("div",{className:"wrapper__cards",children:s&&(s==null?void 0:s.length)>0?s==null?void 0:s.map((e,a)=>t.jsx(R,{image:e==null?void 0:e.image,imageComponent:e==null?void 0:e.imageComponent,title:e==null?void 0:e.title,description:e==null?void 0:e.description,onSelectCard:()=>w==null?void 0:w(e==null?void 0:e.uuid)},`field-of-interests-with-tags-card__${a+1}`)):(u=Array.from("123"))==null?void 0:u.map((e,a)=>t.jsx(T,{},`field-of-interests-with-tags-card-skeleton__${a+1}`))})]})});module.exports=C;
|