@deriv-web-design/ui 0.0.17 → 0.0.21
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/index.css +1216 -129
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +174 -2
- package/dist/index.d.ts +174 -2
- package/dist/index.js +1076 -366
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1070 -365
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/tokens.css +8 -8
package/dist/index.mjs
CHANGED
|
@@ -988,8 +988,46 @@ var Pagination = ({
|
|
|
988
988
|
);
|
|
989
989
|
};
|
|
990
990
|
|
|
991
|
+
// primitives/Tabs/Tabs.tsx
|
|
992
|
+
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
993
|
+
var Tabs = ({
|
|
994
|
+
items,
|
|
995
|
+
activeId,
|
|
996
|
+
onChange,
|
|
997
|
+
className,
|
|
998
|
+
...props
|
|
999
|
+
}) => {
|
|
1000
|
+
return /* @__PURE__ */ jsx16(
|
|
1001
|
+
"div",
|
|
1002
|
+
{
|
|
1003
|
+
className: ["tabs-menu w-tab-menu", className].filter(Boolean).join(" "),
|
|
1004
|
+
role: "tablist",
|
|
1005
|
+
...props,
|
|
1006
|
+
children: items.map((item, i) => {
|
|
1007
|
+
const isActive = item.id === activeId;
|
|
1008
|
+
return /* @__PURE__ */ jsx16(
|
|
1009
|
+
Chip,
|
|
1010
|
+
{
|
|
1011
|
+
label: item.label,
|
|
1012
|
+
selected: isActive,
|
|
1013
|
+
onClick: () => onChange(item.id),
|
|
1014
|
+
className: isActive ? "tab-active" : "",
|
|
1015
|
+
"data-w-tab": item.label,
|
|
1016
|
+
id: `w-tabs-0-data-w-tab-${i}`,
|
|
1017
|
+
"aria-controls": `w-tabs-0-data-w-pane-${i}`,
|
|
1018
|
+
"aria-selected": isActive,
|
|
1019
|
+
tabIndex: isActive ? 0 : -1,
|
|
1020
|
+
role: "tab"
|
|
1021
|
+
},
|
|
1022
|
+
item.id
|
|
1023
|
+
);
|
|
1024
|
+
})
|
|
1025
|
+
}
|
|
1026
|
+
);
|
|
1027
|
+
};
|
|
1028
|
+
|
|
991
1029
|
// templates/FeatureCards/FeatureCards.tsx
|
|
992
|
-
import { jsx as
|
|
1030
|
+
import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
993
1031
|
var FeatureCards = ({
|
|
994
1032
|
sectionTitle,
|
|
995
1033
|
sectionDescription,
|
|
@@ -999,11 +1037,11 @@ var FeatureCards = ({
|
|
|
999
1037
|
cardColorScheme = "image",
|
|
1000
1038
|
cards
|
|
1001
1039
|
}) => {
|
|
1002
|
-
return /* @__PURE__ */
|
|
1040
|
+
return /* @__PURE__ */ jsx17("section", { className: "fc-section", children: /* @__PURE__ */ jsxs15("div", { className: "fc-container", children: [
|
|
1003
1041
|
/* @__PURE__ */ jsxs15("div", { className: "fc-header", children: [
|
|
1004
|
-
/* @__PURE__ */
|
|
1005
|
-
sectionDescription && /* @__PURE__ */
|
|
1006
|
-
showLink && /* @__PURE__ */
|
|
1042
|
+
/* @__PURE__ */ jsx17("h2", { className: "fc-sectionTitle", children: sectionTitle }),
|
|
1043
|
+
sectionDescription && /* @__PURE__ */ jsx17("p", { className: "fc-sectionDescription", children: sectionDescription }),
|
|
1044
|
+
showLink && /* @__PURE__ */ jsx17(
|
|
1007
1045
|
Link,
|
|
1008
1046
|
{
|
|
1009
1047
|
colorScheme: "coral",
|
|
@@ -1012,7 +1050,7 @@ var FeatureCards = ({
|
|
|
1012
1050
|
}
|
|
1013
1051
|
)
|
|
1014
1052
|
] }),
|
|
1015
|
-
/* @__PURE__ */
|
|
1053
|
+
/* @__PURE__ */ jsx17("div", { className: "fc-grid", children: cards.map((card, index) => /* @__PURE__ */ jsx17(
|
|
1016
1054
|
Card,
|
|
1017
1055
|
{
|
|
1018
1056
|
variant: "primary",
|
|
@@ -1031,8 +1069,135 @@ var FeatureCards = ({
|
|
|
1031
1069
|
};
|
|
1032
1070
|
|
|
1033
1071
|
// templates/FeatureCardsSecondary/FeatureCardsSecondary.tsx
|
|
1034
|
-
import { jsx as
|
|
1072
|
+
import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1073
|
+
var externalLinkRel = (href) => href && /^https?:\/\//i.test(href) ? "noopener noreferrer" : void 0;
|
|
1074
|
+
var TwoCardsItem = ({ card, index }) => {
|
|
1075
|
+
const isDark = card.colorScheme === "dark";
|
|
1076
|
+
const showCardLink = card.showLink !== false;
|
|
1077
|
+
return /* @__PURE__ */ jsx18("div", { className: "fcs-twoCardWrap", children: /* @__PURE__ */ jsxs16(
|
|
1078
|
+
"div",
|
|
1079
|
+
{
|
|
1080
|
+
className: [
|
|
1081
|
+
"fcs-twoCard",
|
|
1082
|
+
isDark ? "fcs-twoCard--dark" : "fcs-twoCard--light"
|
|
1083
|
+
].join(" "),
|
|
1084
|
+
children: [
|
|
1085
|
+
/* @__PURE__ */ jsxs16("div", { className: "fcs-twoCard-body", children: [
|
|
1086
|
+
/* @__PURE__ */ jsxs16("div", { className: "fcs-twoCard-content", children: [
|
|
1087
|
+
/* @__PURE__ */ jsx18("h3", { className: "fcs-twoCard-title", children: card.title }),
|
|
1088
|
+
/* @__PURE__ */ jsx18("p", { className: "fcs-twoCard-description", children: card.description }),
|
|
1089
|
+
showCardLink && /* @__PURE__ */ jsx18("div", { className: "fcs-twoCard-linkWrap", children: /* @__PURE__ */ jsx18(
|
|
1090
|
+
Link,
|
|
1091
|
+
{
|
|
1092
|
+
colorScheme: "coral",
|
|
1093
|
+
href: card.linkHref,
|
|
1094
|
+
label: card.linkText ?? "Learn more",
|
|
1095
|
+
rel: externalLinkRel(card.linkHref),
|
|
1096
|
+
onClick: card.onLinkClick
|
|
1097
|
+
}
|
|
1098
|
+
) })
|
|
1099
|
+
] }),
|
|
1100
|
+
card.platforms && card.platforms.length > 0 && /* @__PURE__ */ jsxs16("div", { className: "fcs-twoCard-platformsOuter", children: [
|
|
1101
|
+
/* @__PURE__ */ jsx18("h3", { className: "fcs-twoCard-platformsHeading", children: card.platformsHeading ?? "Available on" }),
|
|
1102
|
+
/* @__PURE__ */ jsx18("div", { className: "fcs-twoCard-platformRow", children: card.platforms.map((platform, i) => /* @__PURE__ */ jsxs16(
|
|
1103
|
+
"a",
|
|
1104
|
+
{
|
|
1105
|
+
className: [
|
|
1106
|
+
"fcs-platformLink",
|
|
1107
|
+
isDark ? "fcs-platformLink--dark" : ""
|
|
1108
|
+
].filter(Boolean).join(" "),
|
|
1109
|
+
href: platform.href,
|
|
1110
|
+
rel: externalLinkRel(platform.href),
|
|
1111
|
+
children: [
|
|
1112
|
+
/* @__PURE__ */ jsx18(
|
|
1113
|
+
"img",
|
|
1114
|
+
{
|
|
1115
|
+
alt: "",
|
|
1116
|
+
className: "fcs-platformLink-icon",
|
|
1117
|
+
height: 32,
|
|
1118
|
+
src: platform.iconSrc,
|
|
1119
|
+
width: 32
|
|
1120
|
+
}
|
|
1121
|
+
),
|
|
1122
|
+
/* @__PURE__ */ jsx18("span", { className: "fcs-platformLink-label", children: platform.label })
|
|
1123
|
+
]
|
|
1124
|
+
},
|
|
1125
|
+
`${platform.label}-${i}`
|
|
1126
|
+
)) })
|
|
1127
|
+
] })
|
|
1128
|
+
] }),
|
|
1129
|
+
card.image && /* @__PURE__ */ jsx18("div", { className: "fcs-twoCard-imageSection", children: /* @__PURE__ */ jsx18(
|
|
1130
|
+
"img",
|
|
1131
|
+
{
|
|
1132
|
+
alt: card.imageAlt ?? "",
|
|
1133
|
+
className: "fcs-twoCard-image",
|
|
1134
|
+
decoding: "async",
|
|
1135
|
+
loading: index === 0 ? "eager" : "lazy",
|
|
1136
|
+
src: card.image
|
|
1137
|
+
}
|
|
1138
|
+
) })
|
|
1139
|
+
]
|
|
1140
|
+
}
|
|
1141
|
+
) });
|
|
1142
|
+
};
|
|
1143
|
+
var OneCardPanel = ({ card }) => {
|
|
1144
|
+
const showCardLink = card.showLink !== false;
|
|
1145
|
+
return /* @__PURE__ */ jsx18("div", { className: "fcs-oneCardShell", children: /* @__PURE__ */ jsxs16("div", { className: "fcs-oneCardGrid fcs-twoCard--dark", children: [
|
|
1146
|
+
/* @__PURE__ */ jsxs16("div", { className: "fcs-oneCardLeft", children: [
|
|
1147
|
+
/* @__PURE__ */ jsxs16("div", { className: "fcs-oneCardContentBlock", children: [
|
|
1148
|
+
/* @__PURE__ */ jsx18("h3", { className: "fcs-twoCard-title", children: card.title }),
|
|
1149
|
+
/* @__PURE__ */ jsx18("p", { className: "fcs-twoCard-description", children: card.description }),
|
|
1150
|
+
showCardLink && /* @__PURE__ */ jsx18("div", { className: "fcs-twoCard-linkWrap", children: /* @__PURE__ */ jsx18(
|
|
1151
|
+
Link,
|
|
1152
|
+
{
|
|
1153
|
+
colorScheme: "coral",
|
|
1154
|
+
href: card.linkHref,
|
|
1155
|
+
label: card.linkText ?? "Learn more",
|
|
1156
|
+
rel: externalLinkRel(card.linkHref),
|
|
1157
|
+
onClick: card.onLinkClick
|
|
1158
|
+
}
|
|
1159
|
+
) })
|
|
1160
|
+
] }),
|
|
1161
|
+
card.platforms && card.platforms.length > 0 && /* @__PURE__ */ jsxs16("div", { className: "fcs-twoCard-platformsOuter", children: [
|
|
1162
|
+
/* @__PURE__ */ jsx18("h3", { className: "fcs-twoCard-platformsHeading", children: card.platformsHeading ?? "Available on" }),
|
|
1163
|
+
/* @__PURE__ */ jsx18("div", { className: "fcs-twoCard-platformRow", children: card.platforms.map((platform, i) => /* @__PURE__ */ jsxs16(
|
|
1164
|
+
"a",
|
|
1165
|
+
{
|
|
1166
|
+
className: "fcs-platformLink fcs-platformLink--dark",
|
|
1167
|
+
href: platform.href,
|
|
1168
|
+
rel: externalLinkRel(platform.href),
|
|
1169
|
+
children: [
|
|
1170
|
+
/* @__PURE__ */ jsx18(
|
|
1171
|
+
"img",
|
|
1172
|
+
{
|
|
1173
|
+
alt: "",
|
|
1174
|
+
className: "fcs-platformLink-icon",
|
|
1175
|
+
height: 32,
|
|
1176
|
+
src: platform.iconSrc,
|
|
1177
|
+
width: 32
|
|
1178
|
+
}
|
|
1179
|
+
),
|
|
1180
|
+
/* @__PURE__ */ jsx18("span", { className: "fcs-platformLink-label", children: platform.label })
|
|
1181
|
+
]
|
|
1182
|
+
},
|
|
1183
|
+
`${platform.label}-${i}`
|
|
1184
|
+
)) })
|
|
1185
|
+
] })
|
|
1186
|
+
] }),
|
|
1187
|
+
card.image && /* @__PURE__ */ jsx18("div", { className: "fcs-oneCardRight", children: /* @__PURE__ */ jsx18(
|
|
1188
|
+
"img",
|
|
1189
|
+
{
|
|
1190
|
+
alt: card.imageAlt ?? "",
|
|
1191
|
+
className: "fcs-oneCardImage",
|
|
1192
|
+
decoding: "async",
|
|
1193
|
+
loading: "eager",
|
|
1194
|
+
src: card.image
|
|
1195
|
+
}
|
|
1196
|
+
) })
|
|
1197
|
+
] }) });
|
|
1198
|
+
};
|
|
1035
1199
|
var FeatureCardsSecondary = ({
|
|
1200
|
+
variant = "default",
|
|
1036
1201
|
sectionTitle,
|
|
1037
1202
|
sectionDescription,
|
|
1038
1203
|
showLink = false,
|
|
@@ -1040,20 +1205,37 @@ var FeatureCardsSecondary = ({
|
|
|
1040
1205
|
onLinkClick,
|
|
1041
1206
|
cards
|
|
1042
1207
|
}) => {
|
|
1043
|
-
|
|
1044
|
-
/* @__PURE__ */
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1208
|
+
const sectionHeader = /* @__PURE__ */ jsxs16("div", { className: "fcs-header", children: [
|
|
1209
|
+
sectionTitle && /* @__PURE__ */ jsx18("h2", { className: "fcs-sectionTitle", children: sectionTitle }),
|
|
1210
|
+
sectionDescription && /* @__PURE__ */ jsx18("p", { className: "fcs-sectionDescription", children: sectionDescription }),
|
|
1211
|
+
showLink && /* @__PURE__ */ jsx18(Link, { colorScheme: "coral", label: linkText, onClick: onLinkClick })
|
|
1212
|
+
] });
|
|
1213
|
+
if (variant === "twoCards") {
|
|
1214
|
+
return /* @__PURE__ */ jsx18("section", { className: "fcs-section", children: /* @__PURE__ */ jsxs16("div", { className: "fcs-container", children: [
|
|
1215
|
+
sectionHeader,
|
|
1216
|
+
/* @__PURE__ */ jsx18("div", { className: "fcs-grid fcs-grid--twoCards", children: cards.map((card, index) => /* @__PURE__ */ jsx18(
|
|
1217
|
+
TwoCardsItem,
|
|
1049
1218
|
{
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
}
|
|
1054
|
-
)
|
|
1055
|
-
] })
|
|
1056
|
-
|
|
1219
|
+
card,
|
|
1220
|
+
index
|
|
1221
|
+
},
|
|
1222
|
+
`${card.title}-${index}`
|
|
1223
|
+
)) })
|
|
1224
|
+
] }) });
|
|
1225
|
+
}
|
|
1226
|
+
if (variant === "oneCard") {
|
|
1227
|
+
const card = cards[0];
|
|
1228
|
+
if (!card) {
|
|
1229
|
+
return null;
|
|
1230
|
+
}
|
|
1231
|
+
return /* @__PURE__ */ jsx18("section", { className: "fcs-section", children: /* @__PURE__ */ jsxs16("div", { className: "fcs-container", children: [
|
|
1232
|
+
sectionHeader,
|
|
1233
|
+
/* @__PURE__ */ jsx18(OneCardPanel, { card })
|
|
1234
|
+
] }) });
|
|
1235
|
+
}
|
|
1236
|
+
return /* @__PURE__ */ jsx18("section", { className: "fcs-section", children: /* @__PURE__ */ jsxs16("div", { className: "fcs-container", children: [
|
|
1237
|
+
sectionHeader,
|
|
1238
|
+
/* @__PURE__ */ jsx18("div", { className: `fcs-grid fcs-grid--${cards.length === 4 ? "4" : "3"}`, children: cards.map((card, index) => /* @__PURE__ */ jsx18(
|
|
1057
1239
|
Card,
|
|
1058
1240
|
{
|
|
1059
1241
|
variant: "secondary",
|
|
@@ -1070,10 +1252,51 @@ var FeatureCardsSecondary = ({
|
|
|
1070
1252
|
] }) });
|
|
1071
1253
|
};
|
|
1072
1254
|
|
|
1255
|
+
// templates/FeatureBullets/FeatureBullets.module.css
|
|
1256
|
+
var FeatureBullets_default = {};
|
|
1257
|
+
|
|
1258
|
+
// templates/FeatureBullets/FeatureBullets.tsx
|
|
1259
|
+
import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1260
|
+
var CheckIcon2 = () => /* @__PURE__ */ jsx19("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", className: FeatureBullets_default.icon, children: /* @__PURE__ */ jsx19("path", { d: "M12 4.375C9.07031 4.375 6.41406 5.9375 4.92969 8.4375C3.48438 10.9766 3.48438 14.0625 4.92969 16.5625C6.41406 19.1016 9.07031 20.625 12 20.625C14.8906 20.625 17.5469 19.1016 19.0312 16.5625C20.4766 14.0625 20.4766 10.9766 19.0312 8.4375C17.5469 5.9375 14.8906 4.375 12 4.375ZM12 22.5C8.40625 22.5 5.125 20.625 3.32812 17.5C1.53125 14.4141 1.53125 10.625 3.32812 7.5C5.125 4.41406 8.40625 2.5 12 2.5C15.5547 2.5 18.8359 4.41406 20.6328 7.5C22.4297 10.625 22.4297 14.4141 20.6328 17.5C18.8359 20.625 15.5547 22.5 12 22.5ZM16.4141 10.6641L11.4141 15.6641C11.0234 16.0547 10.4375 16.0547 10.0859 15.6641L7.58594 13.1641C7.19531 12.8125 7.19531 12.2266 7.58594 11.875C7.9375 11.4844 8.52344 11.4844 8.91406 11.875L10.75 13.7109L15.0859 9.375C15.4375 8.98438 16.0234 8.98438 16.4141 9.375C16.7656 9.72656 16.7656 10.3125 16.4141 10.6641Z", fill: "currentColor" }) });
|
|
1261
|
+
var FeatureBullets = ({
|
|
1262
|
+
title,
|
|
1263
|
+
bullets,
|
|
1264
|
+
image,
|
|
1265
|
+
imageAlt = "",
|
|
1266
|
+
imagePosition = "right"
|
|
1267
|
+
}) => {
|
|
1268
|
+
return /* @__PURE__ */ jsx19("section", { className: FeatureBullets_default.section, children: /* @__PURE__ */ jsx19("div", { className: FeatureBullets_default.container, children: /* @__PURE__ */ jsxs17(
|
|
1269
|
+
"div",
|
|
1270
|
+
{
|
|
1271
|
+
className: [
|
|
1272
|
+
FeatureBullets_default.split,
|
|
1273
|
+
imagePosition === "left" ? FeatureBullets_default["split--image-left"] : ""
|
|
1274
|
+
].filter(Boolean).join(" "),
|
|
1275
|
+
children: [
|
|
1276
|
+
/* @__PURE__ */ jsxs17("div", { className: FeatureBullets_default.content, children: [
|
|
1277
|
+
/* @__PURE__ */ jsx19("h2", { className: FeatureBullets_default.title, children: title }),
|
|
1278
|
+
bullets && bullets.length > 0 && /* @__PURE__ */ jsx19("div", { className: FeatureBullets_default.bulletList, children: bullets.map((bullet, i) => /* @__PURE__ */ jsxs17("div", { className: FeatureBullets_default.bulletItem, children: [
|
|
1279
|
+
/* @__PURE__ */ jsx19("div", { className: FeatureBullets_default.iconWrapper, children: /* @__PURE__ */ jsx19(CheckIcon2, {}) }),
|
|
1280
|
+
/* @__PURE__ */ jsx19("p", { className: FeatureBullets_default.bulletText, children: bullet })
|
|
1281
|
+
] }, i)) })
|
|
1282
|
+
] }),
|
|
1283
|
+
image && /* @__PURE__ */ jsx19("div", { className: FeatureBullets_default.imageWrapper, children: /* @__PURE__ */ jsx19(
|
|
1284
|
+
"img",
|
|
1285
|
+
{
|
|
1286
|
+
alt: imageAlt,
|
|
1287
|
+
className: FeatureBullets_default.image,
|
|
1288
|
+
src: image
|
|
1289
|
+
}
|
|
1290
|
+
) })
|
|
1291
|
+
]
|
|
1292
|
+
}
|
|
1293
|
+
) }) });
|
|
1294
|
+
};
|
|
1295
|
+
|
|
1073
1296
|
// components/Footer/Footer.tsx
|
|
1074
1297
|
import { useState as useState5 } from "react";
|
|
1075
|
-
import { Fragment as Fragment2, jsx as
|
|
1076
|
-
var ExternalLinkIcon = () => /* @__PURE__ */
|
|
1298
|
+
import { Fragment as Fragment2, jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1299
|
+
var ExternalLinkIcon = () => /* @__PURE__ */ jsx20(
|
|
1077
1300
|
"svg",
|
|
1078
1301
|
{
|
|
1079
1302
|
width: "12",
|
|
@@ -1082,7 +1305,7 @@ var ExternalLinkIcon = () => /* @__PURE__ */ jsx18(
|
|
|
1082
1305
|
fill: "none",
|
|
1083
1306
|
"aria-hidden": "true",
|
|
1084
1307
|
focusable: "false",
|
|
1085
|
-
children: /* @__PURE__ */
|
|
1308
|
+
children: /* @__PURE__ */ jsx20(
|
|
1086
1309
|
"path",
|
|
1087
1310
|
{
|
|
1088
1311
|
d: "M2 2H10M10 2V10M10 2L2 10",
|
|
@@ -1094,7 +1317,7 @@ var ExternalLinkIcon = () => /* @__PURE__ */ jsx18(
|
|
|
1094
1317
|
)
|
|
1095
1318
|
}
|
|
1096
1319
|
);
|
|
1097
|
-
var ChevronDownIcon2 = () => /* @__PURE__ */
|
|
1320
|
+
var ChevronDownIcon2 = () => /* @__PURE__ */ jsx20(
|
|
1098
1321
|
"svg",
|
|
1099
1322
|
{
|
|
1100
1323
|
width: "12",
|
|
@@ -1103,7 +1326,7 @@ var ChevronDownIcon2 = () => /* @__PURE__ */ jsx18(
|
|
|
1103
1326
|
fill: "none",
|
|
1104
1327
|
"aria-hidden": "true",
|
|
1105
1328
|
focusable: "false",
|
|
1106
|
-
children: /* @__PURE__ */
|
|
1329
|
+
children: /* @__PURE__ */ jsx20(
|
|
1107
1330
|
"path",
|
|
1108
1331
|
{
|
|
1109
1332
|
d: "M2 4L6 8L10 4",
|
|
@@ -1120,9 +1343,9 @@ var DerivGoBadges = ({
|
|
|
1120
1343
|
appStoreBadge,
|
|
1121
1344
|
huaweiBadge,
|
|
1122
1345
|
availabilityNote
|
|
1123
|
-
}) => /* @__PURE__ */
|
|
1124
|
-
/* @__PURE__ */
|
|
1125
|
-
googlePlayBadge && /* @__PURE__ */
|
|
1346
|
+
}) => /* @__PURE__ */ jsxs18(Fragment2, { children: [
|
|
1347
|
+
/* @__PURE__ */ jsxs18("div", { className: "footer__app-badges", children: [
|
|
1348
|
+
googlePlayBadge && /* @__PURE__ */ jsx20(
|
|
1126
1349
|
"a",
|
|
1127
1350
|
{
|
|
1128
1351
|
href: googlePlayBadge.href,
|
|
@@ -1130,10 +1353,10 @@ var DerivGoBadges = ({
|
|
|
1130
1353
|
"aria-label": googlePlayBadge.imageAlt,
|
|
1131
1354
|
target: "_blank",
|
|
1132
1355
|
rel: "noopener noreferrer",
|
|
1133
|
-
children: googlePlayBadge.icon ?? /* @__PURE__ */
|
|
1356
|
+
children: googlePlayBadge.icon ?? /* @__PURE__ */ jsx20("img", { src: googlePlayBadge.imageSrc, alt: googlePlayBadge.imageAlt })
|
|
1134
1357
|
}
|
|
1135
1358
|
),
|
|
1136
|
-
appStoreBadge && /* @__PURE__ */
|
|
1359
|
+
appStoreBadge && /* @__PURE__ */ jsx20(
|
|
1137
1360
|
"a",
|
|
1138
1361
|
{
|
|
1139
1362
|
href: appStoreBadge.href,
|
|
@@ -1141,10 +1364,10 @@ var DerivGoBadges = ({
|
|
|
1141
1364
|
"aria-label": appStoreBadge.imageAlt,
|
|
1142
1365
|
target: "_blank",
|
|
1143
1366
|
rel: "noopener noreferrer",
|
|
1144
|
-
children: appStoreBadge.icon ?? /* @__PURE__ */
|
|
1367
|
+
children: appStoreBadge.icon ?? /* @__PURE__ */ jsx20("img", { src: appStoreBadge.imageSrc, alt: appStoreBadge.imageAlt })
|
|
1145
1368
|
}
|
|
1146
1369
|
),
|
|
1147
|
-
huaweiBadge && /* @__PURE__ */
|
|
1370
|
+
huaweiBadge && /* @__PURE__ */ jsx20(
|
|
1148
1371
|
"a",
|
|
1149
1372
|
{
|
|
1150
1373
|
href: huaweiBadge.href,
|
|
@@ -1152,13 +1375,13 @@ var DerivGoBadges = ({
|
|
|
1152
1375
|
"aria-label": huaweiBadge.imageAlt,
|
|
1153
1376
|
target: "_blank",
|
|
1154
1377
|
rel: "noopener noreferrer",
|
|
1155
|
-
children: huaweiBadge.icon ?? /* @__PURE__ */
|
|
1378
|
+
children: huaweiBadge.icon ?? /* @__PURE__ */ jsx20("img", { src: huaweiBadge.imageSrc, alt: huaweiBadge.imageAlt })
|
|
1156
1379
|
}
|
|
1157
1380
|
)
|
|
1158
1381
|
] }),
|
|
1159
|
-
availabilityNote && /* @__PURE__ */
|
|
1382
|
+
availabilityNote && /* @__PURE__ */ jsx20("p", { className: "footer__app-note", children: availabilityNote })
|
|
1160
1383
|
] });
|
|
1161
|
-
var NavLink = ({ label, href, isExternal, onClick }) => /* @__PURE__ */
|
|
1384
|
+
var NavLink = ({ label, href, isExternal, onClick }) => /* @__PURE__ */ jsxs18(
|
|
1162
1385
|
"a",
|
|
1163
1386
|
{
|
|
1164
1387
|
href,
|
|
@@ -1167,7 +1390,7 @@ var NavLink = ({ label, href, isExternal, onClick }) => /* @__PURE__ */ jsxs17(
|
|
|
1167
1390
|
...isExternal ? { target: "_blank", rel: "noopener noreferrer" } : {},
|
|
1168
1391
|
children: [
|
|
1169
1392
|
label,
|
|
1170
|
-
isExternal && /* @__PURE__ */
|
|
1393
|
+
isExternal && /* @__PURE__ */ jsx20(ExternalLinkIcon, {})
|
|
1171
1394
|
]
|
|
1172
1395
|
}
|
|
1173
1396
|
);
|
|
@@ -1199,14 +1422,14 @@ var Footer = ({
|
|
|
1199
1422
|
});
|
|
1200
1423
|
};
|
|
1201
1424
|
const aiLabel = aiSummary?.label ?? "Ask AI for a summary of Deriv";
|
|
1202
|
-
return /* @__PURE__ */
|
|
1425
|
+
return /* @__PURE__ */ jsx20(
|
|
1203
1426
|
"footer",
|
|
1204
1427
|
{
|
|
1205
1428
|
className: ["footer", className].filter(Boolean).join(" "),
|
|
1206
1429
|
...props,
|
|
1207
|
-
children: /* @__PURE__ */
|
|
1208
|
-
/* @__PURE__ */
|
|
1209
|
-
/* @__PURE__ */
|
|
1430
|
+
children: /* @__PURE__ */ jsxs18("div", { className: "footer__inner", children: [
|
|
1431
|
+
/* @__PURE__ */ jsxs18("div", { className: "footer__header", children: [
|
|
1432
|
+
/* @__PURE__ */ jsx20("div", { className: "footer__logo-wrapper", children: /* @__PURE__ */ jsx20(
|
|
1210
1433
|
"img",
|
|
1211
1434
|
{
|
|
1212
1435
|
src: logoSrc,
|
|
@@ -1214,21 +1437,21 @@ var Footer = ({
|
|
|
1214
1437
|
className: "footer__logo"
|
|
1215
1438
|
}
|
|
1216
1439
|
) }),
|
|
1217
|
-
aiSummary && /* @__PURE__ */
|
|
1218
|
-
/* @__PURE__ */
|
|
1219
|
-
/* @__PURE__ */
|
|
1440
|
+
aiSummary && /* @__PURE__ */ jsxs18("div", { className: "footer__ai-bar footer__ai-bar--inline", children: [
|
|
1441
|
+
/* @__PURE__ */ jsx20("span", { className: "footer__ai-bar-label", children: aiLabel }),
|
|
1442
|
+
/* @__PURE__ */ jsx20("div", { className: "footer__ai-bar-icons", children: aiSummary.items.map((item, i) => /* @__PURE__ */ jsx20(
|
|
1220
1443
|
"a",
|
|
1221
1444
|
{
|
|
1222
1445
|
href: item.href,
|
|
1223
1446
|
"aria-label": item.imageAlt,
|
|
1224
1447
|
target: "_blank",
|
|
1225
1448
|
rel: "noopener noreferrer",
|
|
1226
|
-
children: /* @__PURE__ */
|
|
1449
|
+
children: /* @__PURE__ */ jsx20("img", { className: "footer__ai-icon", src: item.imageSrc, alt: item.imageAlt })
|
|
1227
1450
|
},
|
|
1228
1451
|
i
|
|
1229
1452
|
)) })
|
|
1230
1453
|
] }),
|
|
1231
|
-
/* @__PURE__ */
|
|
1454
|
+
/* @__PURE__ */ jsx20("div", { className: "footer__social footer__social--in-header", children: socialLinks.map((link, i) => /* @__PURE__ */ jsx20(
|
|
1232
1455
|
"a",
|
|
1233
1456
|
{
|
|
1234
1457
|
href: link.href,
|
|
@@ -1241,27 +1464,27 @@ var Footer = ({
|
|
|
1241
1464
|
i
|
|
1242
1465
|
)) })
|
|
1243
1466
|
] }),
|
|
1244
|
-
aiSummary && /* @__PURE__ */
|
|
1245
|
-
/* @__PURE__ */
|
|
1246
|
-
/* @__PURE__ */
|
|
1467
|
+
aiSummary && /* @__PURE__ */ jsx20("div", { className: "footer__ai-section", children: /* @__PURE__ */ jsxs18("div", { className: "footer__ai-bar footer__ai-bar--block", children: [
|
|
1468
|
+
/* @__PURE__ */ jsx20("span", { className: "footer__ai-bar-label", children: aiLabel }),
|
|
1469
|
+
/* @__PURE__ */ jsx20("div", { className: "footer__ai-bar-icons", children: aiSummary.items.map((item, i) => /* @__PURE__ */ jsx20(
|
|
1247
1470
|
"a",
|
|
1248
1471
|
{
|
|
1249
1472
|
href: item.href,
|
|
1250
1473
|
"aria-label": item.imageAlt,
|
|
1251
1474
|
target: "_blank",
|
|
1252
1475
|
rel: "noopener noreferrer",
|
|
1253
|
-
children: /* @__PURE__ */
|
|
1476
|
+
children: /* @__PURE__ */ jsx20("img", { className: "footer__ai-icon", src: item.imageSrc, alt: item.imageAlt })
|
|
1254
1477
|
},
|
|
1255
1478
|
i
|
|
1256
1479
|
)) })
|
|
1257
1480
|
] }) }),
|
|
1258
|
-
/* @__PURE__ */
|
|
1259
|
-
navColumns.map((column, colIdx) => /* @__PURE__ */
|
|
1260
|
-
/* @__PURE__ */
|
|
1261
|
-
/* @__PURE__ */
|
|
1481
|
+
/* @__PURE__ */ jsxs18("div", { className: "footer__nav footer__nav--columns", children: [
|
|
1482
|
+
navColumns.map((column, colIdx) => /* @__PURE__ */ jsx20("div", { className: "footer__column", children: column.map((section, secIdx) => /* @__PURE__ */ jsxs18("div", { className: "footer__nav-section", children: [
|
|
1483
|
+
/* @__PURE__ */ jsx20("p", { className: "footer__nav-title", children: section.title }),
|
|
1484
|
+
/* @__PURE__ */ jsx20("ul", { className: "footer__nav-links", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsx20("li", { children: /* @__PURE__ */ jsx20(NavLink, { ...link }) }, linkIdx)) })
|
|
1262
1485
|
] }, secIdx)) }, colIdx)),
|
|
1263
|
-
/* @__PURE__ */
|
|
1264
|
-
investorsInPeopleSrc && /* @__PURE__ */
|
|
1486
|
+
/* @__PURE__ */ jsxs18("div", { className: "footer__sidebar", children: [
|
|
1487
|
+
investorsInPeopleSrc && /* @__PURE__ */ jsx20("div", { className: "footer__investors-card", children: /* @__PURE__ */ jsx20(
|
|
1265
1488
|
"img",
|
|
1266
1489
|
{
|
|
1267
1490
|
src: investorsInPeopleSrc,
|
|
@@ -1269,9 +1492,9 @@ var Footer = ({
|
|
|
1269
1492
|
className: "footer__investors-img"
|
|
1270
1493
|
}
|
|
1271
1494
|
) }),
|
|
1272
|
-
derivGo && /* @__PURE__ */
|
|
1273
|
-
/* @__PURE__ */
|
|
1274
|
-
/* @__PURE__ */
|
|
1495
|
+
derivGo && /* @__PURE__ */ jsxs18("div", { className: "footer__deriv-go-card", children: [
|
|
1496
|
+
/* @__PURE__ */ jsxs18("div", { className: "footer__deriv-go-header", children: [
|
|
1497
|
+
/* @__PURE__ */ jsx20(
|
|
1275
1498
|
"img",
|
|
1276
1499
|
{
|
|
1277
1500
|
src: derivGo.logoSrc,
|
|
@@ -1279,11 +1502,11 @@ var Footer = ({
|
|
|
1279
1502
|
className: "footer__deriv-go-logo"
|
|
1280
1503
|
}
|
|
1281
1504
|
),
|
|
1282
|
-
/* @__PURE__ */
|
|
1505
|
+
/* @__PURE__ */ jsx20("span", { className: "footer__deriv-go-title", children: derivGo.title ?? "Deriv GO" })
|
|
1283
1506
|
] }),
|
|
1284
|
-
/* @__PURE__ */
|
|
1285
|
-
(derivGo.qrCodeSrc || derivGo.qrCodeIcon) && /* @__PURE__ */
|
|
1286
|
-
derivGo.qrCodeIcon ? /* @__PURE__ */
|
|
1507
|
+
/* @__PURE__ */ jsx20("p", { className: "footer__deriv-go-desc", children: derivGo.description ?? "Trade multipliers on our mobile app." }),
|
|
1508
|
+
(derivGo.qrCodeSrc || derivGo.qrCodeIcon) && /* @__PURE__ */ jsxs18("div", { className: "footer__deriv-go-qr", children: [
|
|
1509
|
+
derivGo.qrCodeIcon ? /* @__PURE__ */ jsx20("div", { className: "footer__deriv-go-qr-icon", children: derivGo.qrCodeIcon }) : /* @__PURE__ */ jsx20(
|
|
1287
1510
|
"img",
|
|
1288
1511
|
{
|
|
1289
1512
|
src: derivGo.qrCodeSrc,
|
|
@@ -1291,9 +1514,9 @@ var Footer = ({
|
|
|
1291
1514
|
className: "footer__deriv-go-qr-img"
|
|
1292
1515
|
}
|
|
1293
1516
|
),
|
|
1294
|
-
/* @__PURE__ */
|
|
1517
|
+
/* @__PURE__ */ jsx20("span", { className: "footer__deriv-go-qr-label", children: derivGo.scanToDownloadLabel ?? "Scan to download" })
|
|
1295
1518
|
] }),
|
|
1296
|
-
/* @__PURE__ */
|
|
1519
|
+
/* @__PURE__ */ jsx20(
|
|
1297
1520
|
DerivGoBadges,
|
|
1298
1521
|
{
|
|
1299
1522
|
googlePlayBadge: derivGo.googlePlayBadge,
|
|
@@ -1305,9 +1528,9 @@ var Footer = ({
|
|
|
1305
1528
|
] })
|
|
1306
1529
|
] })
|
|
1307
1530
|
] }),
|
|
1308
|
-
/* @__PURE__ */
|
|
1531
|
+
/* @__PURE__ */ jsx20("div", { className: "footer__nav footer__nav--accordion", children: allSections.map((section, idx) => {
|
|
1309
1532
|
const isOpen = openSections.has(idx);
|
|
1310
|
-
return /* @__PURE__ */
|
|
1533
|
+
return /* @__PURE__ */ jsxs18(
|
|
1311
1534
|
"div",
|
|
1312
1535
|
{
|
|
1313
1536
|
className: [
|
|
@@ -1315,7 +1538,7 @@ var Footer = ({
|
|
|
1315
1538
|
isOpen && "footer__accordion-item--open"
|
|
1316
1539
|
].filter(Boolean).join(" "),
|
|
1317
1540
|
children: [
|
|
1318
|
-
/* @__PURE__ */
|
|
1541
|
+
/* @__PURE__ */ jsxs18(
|
|
1319
1542
|
"button",
|
|
1320
1543
|
{
|
|
1321
1544
|
type: "button",
|
|
@@ -1323,18 +1546,18 @@ var Footer = ({
|
|
|
1323
1546
|
onClick: () => toggleSection(idx),
|
|
1324
1547
|
"aria-expanded": isOpen,
|
|
1325
1548
|
children: [
|
|
1326
|
-
/* @__PURE__ */
|
|
1327
|
-
/* @__PURE__ */
|
|
1549
|
+
/* @__PURE__ */ jsx20("span", { className: "footer__accordion-label", children: section.title }),
|
|
1550
|
+
/* @__PURE__ */ jsx20("span", { className: "footer__accordion-chevron", children: /* @__PURE__ */ jsx20(ChevronDownIcon2, {}) })
|
|
1328
1551
|
]
|
|
1329
1552
|
}
|
|
1330
1553
|
),
|
|
1331
|
-
isOpen && /* @__PURE__ */
|
|
1554
|
+
isOpen && /* @__PURE__ */ jsx20("ul", { className: "footer__accordion-links", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsx20("li", { children: /* @__PURE__ */ jsx20(NavLink, { ...link }) }, linkIdx)) })
|
|
1332
1555
|
]
|
|
1333
1556
|
},
|
|
1334
1557
|
idx
|
|
1335
1558
|
);
|
|
1336
1559
|
}) }),
|
|
1337
|
-
socialLinks.length > 0 && /* @__PURE__ */
|
|
1560
|
+
socialLinks.length > 0 && /* @__PURE__ */ jsx20("div", { className: "footer__social footer__social--standalone", children: socialLinks.map((link, i) => /* @__PURE__ */ jsx20(
|
|
1338
1561
|
"a",
|
|
1339
1562
|
{
|
|
1340
1563
|
href: link.href,
|
|
@@ -1346,10 +1569,10 @@ var Footer = ({
|
|
|
1346
1569
|
},
|
|
1347
1570
|
i
|
|
1348
1571
|
)) }),
|
|
1349
|
-
derivGo && /* @__PURE__ */
|
|
1350
|
-
/* @__PURE__ */
|
|
1351
|
-
/* @__PURE__ */
|
|
1352
|
-
/* @__PURE__ */
|
|
1572
|
+
derivGo && /* @__PURE__ */ jsxs18("div", { className: "footer__deriv-go-banner", children: [
|
|
1573
|
+
/* @__PURE__ */ jsxs18("div", { className: "footer__deriv-go-banner-info", children: [
|
|
1574
|
+
/* @__PURE__ */ jsxs18("div", { className: "footer__deriv-go-header", children: [
|
|
1575
|
+
/* @__PURE__ */ jsx20(
|
|
1353
1576
|
"img",
|
|
1354
1577
|
{
|
|
1355
1578
|
src: derivGo.logoSrc,
|
|
@@ -1357,11 +1580,11 @@ var Footer = ({
|
|
|
1357
1580
|
className: "footer__deriv-go-logo"
|
|
1358
1581
|
}
|
|
1359
1582
|
),
|
|
1360
|
-
/* @__PURE__ */
|
|
1583
|
+
/* @__PURE__ */ jsx20("span", { className: "footer__deriv-go-title", children: derivGo.title ?? "Deriv GO" })
|
|
1361
1584
|
] }),
|
|
1362
|
-
/* @__PURE__ */
|
|
1585
|
+
/* @__PURE__ */ jsx20("p", { className: "footer__deriv-go-desc", children: derivGo.description ?? "Trade multipliers on our mobile app." })
|
|
1363
1586
|
] }),
|
|
1364
|
-
/* @__PURE__ */
|
|
1587
|
+
/* @__PURE__ */ jsx20("div", { className: "footer__deriv-go-banner-badges", children: /* @__PURE__ */ jsx20(
|
|
1365
1588
|
DerivGoBadges,
|
|
1366
1589
|
{
|
|
1367
1590
|
googlePlayBadge: derivGo.googlePlayBadge,
|
|
@@ -1371,11 +1594,11 @@ var Footer = ({
|
|
|
1371
1594
|
}
|
|
1372
1595
|
) })
|
|
1373
1596
|
] }),
|
|
1374
|
-
(licenseText || riskWarningText) && /* @__PURE__ */
|
|
1375
|
-
licenseText && /* @__PURE__ */
|
|
1376
|
-
riskWarningText && /* @__PURE__ */
|
|
1597
|
+
(licenseText || riskWarningText) && /* @__PURE__ */ jsxs18("div", { className: "footer__legal-block", children: [
|
|
1598
|
+
licenseText && /* @__PURE__ */ jsx20("div", { className: "footer__license", children: licenseText }),
|
|
1599
|
+
riskWarningText && /* @__PURE__ */ jsx20("div", { className: "footer__risk-warning", children: /* @__PURE__ */ jsx20("p", { className: "footer__risk-warning-text", children: riskWarningText }) })
|
|
1377
1600
|
] }),
|
|
1378
|
-
investorsInPeopleSrc && /* @__PURE__ */
|
|
1601
|
+
investorsInPeopleSrc && /* @__PURE__ */ jsx20("div", { className: "footer__investors-stacked", children: /* @__PURE__ */ jsx20(
|
|
1379
1602
|
"img",
|
|
1380
1603
|
{
|
|
1381
1604
|
src: investorsInPeopleSrc,
|
|
@@ -1390,12 +1613,12 @@ var Footer = ({
|
|
|
1390
1613
|
|
|
1391
1614
|
// templates/Hero/Hero.tsx
|
|
1392
1615
|
import { useEffect as useEffect3, useRef as useRef3 } from "react";
|
|
1393
|
-
import { jsx as
|
|
1616
|
+
import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1394
1617
|
var Visual = ({
|
|
1395
1618
|
src,
|
|
1396
1619
|
className,
|
|
1397
1620
|
alt = ""
|
|
1398
|
-
}) => /* @__PURE__ */
|
|
1621
|
+
}) => /* @__PURE__ */ jsx21("div", { className, children: typeof src === "string" ? /* @__PURE__ */ jsx21("img", { src, alt }) : src });
|
|
1399
1622
|
var Hero = ({
|
|
1400
1623
|
variant,
|
|
1401
1624
|
subtitle,
|
|
@@ -1446,13 +1669,13 @@ var Hero = ({
|
|
|
1446
1669
|
onScroll();
|
|
1447
1670
|
return () => scrollEl.removeEventListener("scroll", onScroll);
|
|
1448
1671
|
}, [variant]);
|
|
1449
|
-
const textBlock = /* @__PURE__ */
|
|
1450
|
-
subtitle && /* @__PURE__ */
|
|
1451
|
-
/* @__PURE__ */
|
|
1452
|
-
description && /* @__PURE__ */
|
|
1672
|
+
const textBlock = /* @__PURE__ */ jsxs19("div", { className: "hero__text", children: [
|
|
1673
|
+
subtitle && /* @__PURE__ */ jsx21("p", { className: "hero__subtitle", children: subtitle }),
|
|
1674
|
+
/* @__PURE__ */ jsx21("h2", { className: "hero__title", children: title }),
|
|
1675
|
+
description && /* @__PURE__ */ jsx21("p", { className: "hero__description", children: description })
|
|
1453
1676
|
] });
|
|
1454
|
-
const buttonBlock = (primaryButton || secondaryButton) && /* @__PURE__ */
|
|
1455
|
-
primaryButton && (primaryButton.href ? /* @__PURE__ */
|
|
1677
|
+
const buttonBlock = (primaryButton || secondaryButton) && /* @__PURE__ */ jsxs19("div", { className: "hero__buttons", children: [
|
|
1678
|
+
primaryButton && (primaryButton.href ? /* @__PURE__ */ jsx21("a", { href: primaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1456
1679
|
Button,
|
|
1457
1680
|
{
|
|
1458
1681
|
colorScheme: "coral",
|
|
@@ -1460,7 +1683,7 @@ var Hero = ({
|
|
|
1460
1683
|
label: primaryButton.label,
|
|
1461
1684
|
onClick: primaryButton.onClick
|
|
1462
1685
|
}
|
|
1463
|
-
) }) : /* @__PURE__ */
|
|
1686
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1464
1687
|
Button,
|
|
1465
1688
|
{
|
|
1466
1689
|
colorScheme: "coral",
|
|
@@ -1469,7 +1692,7 @@ var Hero = ({
|
|
|
1469
1692
|
onClick: primaryButton.onClick
|
|
1470
1693
|
}
|
|
1471
1694
|
)),
|
|
1472
|
-
secondaryButton && (secondaryButton.href ? /* @__PURE__ */
|
|
1695
|
+
secondaryButton && (secondaryButton.href ? /* @__PURE__ */ jsx21("a", { href: secondaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1473
1696
|
Button,
|
|
1474
1697
|
{
|
|
1475
1698
|
colorScheme: "white",
|
|
@@ -1477,7 +1700,7 @@ var Hero = ({
|
|
|
1477
1700
|
label: secondaryButton.label,
|
|
1478
1701
|
onClick: secondaryButton.onClick
|
|
1479
1702
|
}
|
|
1480
|
-
) }) : /* @__PURE__ */
|
|
1703
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1481
1704
|
Button,
|
|
1482
1705
|
{
|
|
1483
1706
|
colorScheme: "white",
|
|
@@ -1488,15 +1711,15 @@ var Hero = ({
|
|
|
1488
1711
|
))
|
|
1489
1712
|
] });
|
|
1490
1713
|
if (variant === "split") {
|
|
1491
|
-
return /* @__PURE__ */
|
|
1714
|
+
return /* @__PURE__ */ jsxs19(
|
|
1492
1715
|
"section",
|
|
1493
1716
|
{
|
|
1494
1717
|
className: ["hero", variantClass, className].filter(Boolean).join(" "),
|
|
1495
1718
|
style: backgroundImageSrc ? { backgroundImage: `url(${backgroundImageSrc})` } : void 0,
|
|
1496
1719
|
...props,
|
|
1497
1720
|
children: [
|
|
1498
|
-
/* @__PURE__ */
|
|
1499
|
-
heroImage && /* @__PURE__ */
|
|
1721
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__overlay", "aria-hidden": "true" }),
|
|
1722
|
+
heroImage && /* @__PURE__ */ jsx21(
|
|
1500
1723
|
Visual,
|
|
1501
1724
|
{
|
|
1502
1725
|
src: heroImage,
|
|
@@ -1504,14 +1727,14 @@ var Hero = ({
|
|
|
1504
1727
|
alt: ""
|
|
1505
1728
|
}
|
|
1506
1729
|
),
|
|
1507
|
-
/* @__PURE__ */
|
|
1508
|
-
/* @__PURE__ */
|
|
1509
|
-
subtitle && /* @__PURE__ */
|
|
1510
|
-
/* @__PURE__ */
|
|
1511
|
-
description && /* @__PURE__ */
|
|
1730
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__inner", children: /* @__PURE__ */ jsx21("div", { className: "hero__content", children: /* @__PURE__ */ jsx21("div", { className: "hero__left", children: /* @__PURE__ */ jsxs19("div", { className: "hero__body", children: [
|
|
1731
|
+
/* @__PURE__ */ jsxs19("div", { className: "hero__text", children: [
|
|
1732
|
+
subtitle && /* @__PURE__ */ jsx21("p", { className: "hero__subtitle", children: subtitle }),
|
|
1733
|
+
/* @__PURE__ */ jsx21("h2", { className: "hero__title", children: title }),
|
|
1734
|
+
description && /* @__PURE__ */ jsx21("p", { className: "hero__description", children: description })
|
|
1512
1735
|
] }),
|
|
1513
|
-
(primaryButton || secondaryButton) && /* @__PURE__ */
|
|
1514
|
-
primaryButton && (primaryButton.href ? /* @__PURE__ */
|
|
1736
|
+
(primaryButton || secondaryButton) && /* @__PURE__ */ jsxs19("div", { className: "hero__buttons", children: [
|
|
1737
|
+
primaryButton && (primaryButton.href ? /* @__PURE__ */ jsx21("a", { href: primaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1515
1738
|
Button,
|
|
1516
1739
|
{
|
|
1517
1740
|
colorScheme: "coral",
|
|
@@ -1519,7 +1742,7 @@ var Hero = ({
|
|
|
1519
1742
|
label: primaryButton.label,
|
|
1520
1743
|
onClick: primaryButton.onClick
|
|
1521
1744
|
}
|
|
1522
|
-
) }) : /* @__PURE__ */
|
|
1745
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1523
1746
|
Button,
|
|
1524
1747
|
{
|
|
1525
1748
|
colorScheme: "coral",
|
|
@@ -1528,7 +1751,7 @@ var Hero = ({
|
|
|
1528
1751
|
onClick: primaryButton.onClick
|
|
1529
1752
|
}
|
|
1530
1753
|
)),
|
|
1531
|
-
secondaryButton && (secondaryButton.href ? /* @__PURE__ */
|
|
1754
|
+
secondaryButton && (secondaryButton.href ? /* @__PURE__ */ jsx21("a", { href: secondaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1532
1755
|
Button,
|
|
1533
1756
|
{
|
|
1534
1757
|
colorScheme: "white",
|
|
@@ -1536,7 +1759,7 @@ var Hero = ({
|
|
|
1536
1759
|
label: secondaryButton.label,
|
|
1537
1760
|
onClick: secondaryButton.onClick
|
|
1538
1761
|
}
|
|
1539
|
-
) }) : /* @__PURE__ */
|
|
1762
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1540
1763
|
Button,
|
|
1541
1764
|
{
|
|
1542
1765
|
colorScheme: "white",
|
|
@@ -1552,22 +1775,22 @@ var Hero = ({
|
|
|
1552
1775
|
);
|
|
1553
1776
|
}
|
|
1554
1777
|
if (variant === "centered") {
|
|
1555
|
-
return /* @__PURE__ */
|
|
1778
|
+
return /* @__PURE__ */ jsxs19(
|
|
1556
1779
|
"section",
|
|
1557
1780
|
{
|
|
1558
1781
|
className: ["hero", variantClass, className].filter(Boolean).join(" "),
|
|
1559
1782
|
style: backgroundImageSrc ? { backgroundImage: `url(${backgroundImageSrc})` } : void 0,
|
|
1560
1783
|
...props,
|
|
1561
1784
|
children: [
|
|
1562
|
-
/* @__PURE__ */
|
|
1563
|
-
/* @__PURE__ */
|
|
1564
|
-
/* @__PURE__ */
|
|
1565
|
-
subtitle && /* @__PURE__ */
|
|
1566
|
-
/* @__PURE__ */
|
|
1567
|
-
description && /* @__PURE__ */
|
|
1785
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__overlay", "aria-hidden": "true" }),
|
|
1786
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__inner", children: /* @__PURE__ */ jsxs19("div", { className: "hero__content", children: [
|
|
1787
|
+
/* @__PURE__ */ jsxs19("div", { className: "hero__text", children: [
|
|
1788
|
+
subtitle && /* @__PURE__ */ jsx21("p", { className: "hero__subtitle", children: subtitle }),
|
|
1789
|
+
/* @__PURE__ */ jsx21("h2", { className: "hero__title", children: title }),
|
|
1790
|
+
description && /* @__PURE__ */ jsx21("p", { className: "hero__description", children: description })
|
|
1568
1791
|
] }),
|
|
1569
|
-
(primaryButton || secondaryButton) && /* @__PURE__ */
|
|
1570
|
-
primaryButton && (primaryButton.href ? /* @__PURE__ */
|
|
1792
|
+
(primaryButton || secondaryButton) && /* @__PURE__ */ jsxs19("div", { className: "hero__buttons", children: [
|
|
1793
|
+
primaryButton && (primaryButton.href ? /* @__PURE__ */ jsx21("a", { href: primaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1571
1794
|
Button,
|
|
1572
1795
|
{
|
|
1573
1796
|
colorScheme: "coral",
|
|
@@ -1575,7 +1798,7 @@ var Hero = ({
|
|
|
1575
1798
|
label: primaryButton.label,
|
|
1576
1799
|
onClick: primaryButton.onClick
|
|
1577
1800
|
}
|
|
1578
|
-
) }) : /* @__PURE__ */
|
|
1801
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1579
1802
|
Button,
|
|
1580
1803
|
{
|
|
1581
1804
|
colorScheme: "coral",
|
|
@@ -1584,7 +1807,7 @@ var Hero = ({
|
|
|
1584
1807
|
onClick: primaryButton.onClick
|
|
1585
1808
|
}
|
|
1586
1809
|
)),
|
|
1587
|
-
secondaryButton && (secondaryButton.href ? /* @__PURE__ */
|
|
1810
|
+
secondaryButton && (secondaryButton.href ? /* @__PURE__ */ jsx21("a", { href: secondaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1588
1811
|
Button,
|
|
1589
1812
|
{
|
|
1590
1813
|
colorScheme: "white",
|
|
@@ -1592,7 +1815,7 @@ var Hero = ({
|
|
|
1592
1815
|
label: secondaryButton.label,
|
|
1593
1816
|
onClick: secondaryButton.onClick
|
|
1594
1817
|
}
|
|
1595
|
-
) }) : /* @__PURE__ */
|
|
1818
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1596
1819
|
Button,
|
|
1597
1820
|
{
|
|
1598
1821
|
colorScheme: "white",
|
|
@@ -1608,22 +1831,22 @@ var Hero = ({
|
|
|
1608
1831
|
);
|
|
1609
1832
|
}
|
|
1610
1833
|
if (variant === "showcase") {
|
|
1611
|
-
return /* @__PURE__ */
|
|
1834
|
+
return /* @__PURE__ */ jsxs19(
|
|
1612
1835
|
"section",
|
|
1613
1836
|
{
|
|
1614
1837
|
className: ["hero", variantClass, className].filter(Boolean).join(" "),
|
|
1615
1838
|
style: backgroundImageSrc ? { backgroundImage: `url(${backgroundImageSrc})` } : void 0,
|
|
1616
1839
|
...props,
|
|
1617
1840
|
children: [
|
|
1618
|
-
/* @__PURE__ */
|
|
1619
|
-
/* @__PURE__ */
|
|
1620
|
-
/* @__PURE__ */
|
|
1621
|
-
subtitle && /* @__PURE__ */
|
|
1622
|
-
/* @__PURE__ */
|
|
1623
|
-
description && /* @__PURE__ */
|
|
1841
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__overlay", "aria-hidden": "true" }),
|
|
1842
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__inner", children: /* @__PURE__ */ jsxs19("div", { className: "hero__content", children: [
|
|
1843
|
+
/* @__PURE__ */ jsxs19("div", { className: "hero__text", children: [
|
|
1844
|
+
subtitle && /* @__PURE__ */ jsx21("p", { className: "hero__subtitle", children: subtitle }),
|
|
1845
|
+
/* @__PURE__ */ jsx21("h2", { className: "hero__title", children: title }),
|
|
1846
|
+
description && /* @__PURE__ */ jsx21("p", { className: "hero__description", children: description })
|
|
1624
1847
|
] }),
|
|
1625
|
-
(primaryButton || secondaryButton) && /* @__PURE__ */
|
|
1626
|
-
primaryButton && (primaryButton.href ? /* @__PURE__ */
|
|
1848
|
+
(primaryButton || secondaryButton) && /* @__PURE__ */ jsxs19("div", { className: "hero__buttons", children: [
|
|
1849
|
+
primaryButton && (primaryButton.href ? /* @__PURE__ */ jsx21("a", { href: primaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1627
1850
|
Button,
|
|
1628
1851
|
{
|
|
1629
1852
|
colorScheme: "coral",
|
|
@@ -1631,7 +1854,7 @@ var Hero = ({
|
|
|
1631
1854
|
label: primaryButton.label,
|
|
1632
1855
|
onClick: primaryButton.onClick
|
|
1633
1856
|
}
|
|
1634
|
-
) }) : /* @__PURE__ */
|
|
1857
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1635
1858
|
Button,
|
|
1636
1859
|
{
|
|
1637
1860
|
colorScheme: "coral",
|
|
@@ -1640,7 +1863,7 @@ var Hero = ({
|
|
|
1640
1863
|
onClick: primaryButton.onClick
|
|
1641
1864
|
}
|
|
1642
1865
|
)),
|
|
1643
|
-
secondaryButton && (secondaryButton.href ? /* @__PURE__ */
|
|
1866
|
+
secondaryButton && (secondaryButton.href ? /* @__PURE__ */ jsx21("a", { href: secondaryButton.href, children: /* @__PURE__ */ jsx21(
|
|
1644
1867
|
Button,
|
|
1645
1868
|
{
|
|
1646
1869
|
colorScheme: "white",
|
|
@@ -1648,7 +1871,7 @@ var Hero = ({
|
|
|
1648
1871
|
label: secondaryButton.label,
|
|
1649
1872
|
onClick: secondaryButton.onClick
|
|
1650
1873
|
}
|
|
1651
|
-
) }) : /* @__PURE__ */
|
|
1874
|
+
) }) : /* @__PURE__ */ jsx21(
|
|
1652
1875
|
Button,
|
|
1653
1876
|
{
|
|
1654
1877
|
colorScheme: "white",
|
|
@@ -1658,7 +1881,7 @@ var Hero = ({
|
|
|
1658
1881
|
}
|
|
1659
1882
|
))
|
|
1660
1883
|
] }),
|
|
1661
|
-
productImage && /* @__PURE__ */
|
|
1884
|
+
productImage && /* @__PURE__ */ jsx21(
|
|
1662
1885
|
Visual,
|
|
1663
1886
|
{
|
|
1664
1887
|
src: productImage,
|
|
@@ -1666,7 +1889,7 @@ var Hero = ({
|
|
|
1666
1889
|
alt: ""
|
|
1667
1890
|
}
|
|
1668
1891
|
),
|
|
1669
|
-
floatingImage && /* @__PURE__ */
|
|
1892
|
+
floatingImage && /* @__PURE__ */ jsx21(
|
|
1670
1893
|
Visual,
|
|
1671
1894
|
{
|
|
1672
1895
|
src: floatingImage,
|
|
@@ -1679,18 +1902,18 @@ var Hero = ({
|
|
|
1679
1902
|
}
|
|
1680
1903
|
);
|
|
1681
1904
|
}
|
|
1682
|
-
return /* @__PURE__ */
|
|
1905
|
+
return /* @__PURE__ */ jsxs19(
|
|
1683
1906
|
"section",
|
|
1684
1907
|
{
|
|
1685
1908
|
ref: sectionRef,
|
|
1686
1909
|
className: ["hero", variantClass, className].filter(Boolean).join(" "),
|
|
1687
1910
|
...props,
|
|
1688
1911
|
children: [
|
|
1689
|
-
/* @__PURE__ */
|
|
1690
|
-
variant === "visuals" && leftVisual && /* @__PURE__ */
|
|
1691
|
-
variant === "visuals" && rightVisual && /* @__PURE__ */
|
|
1692
|
-
/* @__PURE__ */
|
|
1693
|
-
/* @__PURE__ */
|
|
1912
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__grid", "aria-hidden": "true" }),
|
|
1913
|
+
variant === "visuals" && leftVisual && /* @__PURE__ */ jsx21("div", { ref: leftRef, className: "hero__visual hero__visual--left", children: typeof leftVisual === "string" ? /* @__PURE__ */ jsx21("img", { src: leftVisual, alt: "" }) : leftVisual }),
|
|
1914
|
+
variant === "visuals" && rightVisual && /* @__PURE__ */ jsx21("div", { ref: rightRef, className: "hero__visual hero__visual--right", children: typeof rightVisual === "string" ? /* @__PURE__ */ jsx21("img", { src: rightVisual, alt: "" }) : rightVisual }),
|
|
1915
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__overlay", "aria-hidden": "true" }),
|
|
1916
|
+
/* @__PURE__ */ jsx21("div", { className: "hero__inner", children: /* @__PURE__ */ jsx21("div", { className: "hero__content", children: /* @__PURE__ */ jsxs19("div", { className: "hero__body", children: [
|
|
1694
1917
|
textBlock,
|
|
1695
1918
|
buttonBlock
|
|
1696
1919
|
] }) }) })
|
|
@@ -1701,9 +1924,12 @@ var Hero = ({
|
|
|
1701
1924
|
|
|
1702
1925
|
// templates/Stats/Stats.tsx
|
|
1703
1926
|
import { useEffect as useEffect4, useRef as useRef4, useState as useState6 } from "react";
|
|
1704
|
-
import { jsx as
|
|
1927
|
+
import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
1705
1928
|
var INTERVAL_MS = 2e3;
|
|
1706
1929
|
var TRANSITION = "transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1)";
|
|
1930
|
+
var PARALLAX_FACTOR = 0.18;
|
|
1931
|
+
var PARALLAX_MAX = 56;
|
|
1932
|
+
var PARALLAX_BP = 992;
|
|
1707
1933
|
function relativePos(index, active, total) {
|
|
1708
1934
|
const raw = ((index - active) % total + total) % total;
|
|
1709
1935
|
return raw > total / 2 ? raw - total : raw;
|
|
@@ -1725,7 +1951,7 @@ function getStatStyle(rel) {
|
|
|
1725
1951
|
transition: TRANSITION
|
|
1726
1952
|
};
|
|
1727
1953
|
}
|
|
1728
|
-
var AwardBadge = ({ imageSrc, imageAlt = "" }) => /* @__PURE__ */
|
|
1954
|
+
var AwardBadge = ({ imageSrc, imageAlt = "" }) => /* @__PURE__ */ jsx22("div", { className: "stats__award", children: /* @__PURE__ */ jsx22("img", { src: imageSrc, alt: imageAlt, className: "stats__award-image" }) });
|
|
1729
1955
|
var Stats = ({
|
|
1730
1956
|
title,
|
|
1731
1957
|
description,
|
|
@@ -1737,6 +1963,10 @@ var Stats = ({
|
|
|
1737
1963
|
}) => {
|
|
1738
1964
|
const [activeIndex, setActiveIndex] = useState6(0);
|
|
1739
1965
|
const intervalRef = useRef4(null);
|
|
1966
|
+
const sectionRef = useRef4(null);
|
|
1967
|
+
const leftColRef = useRef4(null);
|
|
1968
|
+
const rightColRef = useRef4(null);
|
|
1969
|
+
const rafRef = useRef4(null);
|
|
1740
1970
|
const hasAwards = leftAwards.length > 0 || rightAwards.length > 0;
|
|
1741
1971
|
const allAwards = [...leftAwards, ...rightAwards];
|
|
1742
1972
|
const total = stats.length;
|
|
@@ -1749,25 +1979,55 @@ var Stats = ({
|
|
|
1749
1979
|
if (intervalRef.current) clearInterval(intervalRef.current);
|
|
1750
1980
|
};
|
|
1751
1981
|
}, [total]);
|
|
1752
|
-
|
|
1982
|
+
useEffect4(() => {
|
|
1983
|
+
const applyParallax = () => {
|
|
1984
|
+
const section = sectionRef.current;
|
|
1985
|
+
if (!section || window.innerWidth < PARALLAX_BP) {
|
|
1986
|
+
if (leftColRef.current) leftColRef.current.style.transform = "";
|
|
1987
|
+
if (rightColRef.current) rightColRef.current.style.transform = "";
|
|
1988
|
+
return;
|
|
1989
|
+
}
|
|
1990
|
+
const rect = section.getBoundingClientRect();
|
|
1991
|
+
const sectionCenter = rect.top + rect.height / 2;
|
|
1992
|
+
const viewportCenter = window.innerHeight / 2;
|
|
1993
|
+
const raw = (sectionCenter - viewportCenter) * PARALLAX_FACTOR;
|
|
1994
|
+
const delta = Math.max(-PARALLAX_MAX, Math.min(PARALLAX_MAX, raw));
|
|
1995
|
+
if (leftColRef.current) leftColRef.current.style.transform = `translateY(${delta}px)`;
|
|
1996
|
+
if (rightColRef.current) rightColRef.current.style.transform = `translateY(${-delta}px)`;
|
|
1997
|
+
};
|
|
1998
|
+
const onScroll = () => {
|
|
1999
|
+
if (rafRef.current) cancelAnimationFrame(rafRef.current);
|
|
2000
|
+
rafRef.current = requestAnimationFrame(applyParallax);
|
|
2001
|
+
};
|
|
2002
|
+
applyParallax();
|
|
2003
|
+
window.addEventListener("scroll", onScroll, { passive: true });
|
|
2004
|
+
window.addEventListener("resize", onScroll, { passive: true });
|
|
2005
|
+
return () => {
|
|
2006
|
+
window.removeEventListener("scroll", onScroll);
|
|
2007
|
+
window.removeEventListener("resize", onScroll);
|
|
2008
|
+
if (rafRef.current) cancelAnimationFrame(rafRef.current);
|
|
2009
|
+
};
|
|
2010
|
+
}, []);
|
|
2011
|
+
return /* @__PURE__ */ jsx22(
|
|
1753
2012
|
"section",
|
|
1754
2013
|
{
|
|
2014
|
+
ref: sectionRef,
|
|
1755
2015
|
className: ["stats", className].filter(Boolean).join(" "),
|
|
1756
2016
|
...props,
|
|
1757
|
-
children: /* @__PURE__ */
|
|
1758
|
-
/* @__PURE__ */
|
|
1759
|
-
/* @__PURE__ */
|
|
1760
|
-
description && /* @__PURE__ */
|
|
2017
|
+
children: /* @__PURE__ */ jsxs20("div", { className: "stats__inner", children: [
|
|
2018
|
+
/* @__PURE__ */ jsxs20("div", { className: "stats__header", children: [
|
|
2019
|
+
/* @__PURE__ */ jsx22("h2", { className: "stats__title", children: title }),
|
|
2020
|
+
description && /* @__PURE__ */ jsx22("p", { className: "stats__description", children: description })
|
|
1761
2021
|
] }),
|
|
1762
|
-
/* @__PURE__ */
|
|
1763
|
-
leftAwards.length > 0 && /* @__PURE__ */
|
|
1764
|
-
/* @__PURE__ */
|
|
1765
|
-
/* @__PURE__ */
|
|
1766
|
-
/* @__PURE__ */
|
|
2022
|
+
/* @__PURE__ */ jsxs20("div", { className: "stats__content", children: [
|
|
2023
|
+
leftAwards.length > 0 && /* @__PURE__ */ jsx22("div", { ref: leftColRef, className: "stats__awards-col stats__awards-col--left", children: leftAwards.map((award, i) => /* @__PURE__ */ jsx22(AwardBadge, { ...award }, i)) }),
|
|
2024
|
+
/* @__PURE__ */ jsx22("div", { className: "stats__card", children: /* @__PURE__ */ jsxs20("div", { className: "stats__card-track", children: [
|
|
2025
|
+
/* @__PURE__ */ jsx22("div", { className: "stats__fade stats__fade--top", "aria-hidden": "true" }),
|
|
2026
|
+
/* @__PURE__ */ jsx22("div", { className: "stats__fade stats__fade--bottom", "aria-hidden": "true" }),
|
|
1767
2027
|
stats.map((stat, i) => {
|
|
1768
2028
|
const rel = relativePos(i, activeIndex, total);
|
|
1769
2029
|
const active = rel === 0;
|
|
1770
|
-
return /* @__PURE__ */
|
|
2030
|
+
return /* @__PURE__ */ jsxs20(
|
|
1771
2031
|
"div",
|
|
1772
2032
|
{
|
|
1773
2033
|
className: [
|
|
@@ -1777,16 +2037,16 @@ var Stats = ({
|
|
|
1777
2037
|
style: getStatStyle(rel),
|
|
1778
2038
|
"aria-hidden": !active,
|
|
1779
2039
|
children: [
|
|
1780
|
-
/* @__PURE__ */
|
|
1781
|
-
/* @__PURE__ */
|
|
2040
|
+
/* @__PURE__ */ jsx22("span", { className: "stats__stat-value", children: stat.value }),
|
|
2041
|
+
/* @__PURE__ */ jsx22("span", { className: "stats__stat-label", children: stat.label })
|
|
1782
2042
|
]
|
|
1783
2043
|
},
|
|
1784
2044
|
i
|
|
1785
2045
|
);
|
|
1786
2046
|
})
|
|
1787
2047
|
] }) }),
|
|
1788
|
-
rightAwards.length > 0 && /* @__PURE__ */
|
|
1789
|
-
hasAwards && /* @__PURE__ */
|
|
2048
|
+
rightAwards.length > 0 && /* @__PURE__ */ jsx22("div", { ref: rightColRef, className: "stats__awards-col stats__awards-col--right", children: rightAwards.map((award, i) => /* @__PURE__ */ jsx22(AwardBadge, { ...award }, i)) }),
|
|
2049
|
+
hasAwards && /* @__PURE__ */ jsx22("div", { className: "stats__awards-mobile", children: allAwards.map((award, i) => /* @__PURE__ */ jsx22(AwardBadge, { ...award }, i)) })
|
|
1790
2050
|
] })
|
|
1791
2051
|
] })
|
|
1792
2052
|
}
|
|
@@ -1799,7 +2059,7 @@ import { useLayoutEffect, useRef as useRef6, useState as useState8 } from "react
|
|
|
1799
2059
|
// components/DotLottieInView/DotLottieInView.tsx
|
|
1800
2060
|
import { useEffect as useEffect5, useRef as useRef5, useState as useState7 } from "react";
|
|
1801
2061
|
import { DotLottieReact } from "@lottiefiles/dotlottie-react";
|
|
1802
|
-
import { jsx as
|
|
2062
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
1803
2063
|
function DotLottieInView({
|
|
1804
2064
|
enabled = true,
|
|
1805
2065
|
rootMargin = "0px",
|
|
@@ -1832,7 +2092,7 @@ function DotLottieInView({
|
|
|
1832
2092
|
dotLottie.stop();
|
|
1833
2093
|
dotLottie.play();
|
|
1834
2094
|
}, [dotLottie, enabled, inView]);
|
|
1835
|
-
return /* @__PURE__ */
|
|
2095
|
+
return /* @__PURE__ */ jsx23(
|
|
1836
2096
|
"div",
|
|
1837
2097
|
{
|
|
1838
2098
|
ref: wrapRef,
|
|
@@ -1847,7 +2107,7 @@ function DotLottieInView({
|
|
|
1847
2107
|
backgroundColor: "transparent",
|
|
1848
2108
|
...style
|
|
1849
2109
|
},
|
|
1850
|
-
children: /* @__PURE__ */
|
|
2110
|
+
children: /* @__PURE__ */ jsx23(
|
|
1851
2111
|
DotLottieReact,
|
|
1852
2112
|
{
|
|
1853
2113
|
...dotProps,
|
|
@@ -1861,7 +2121,7 @@ function DotLottieInView({
|
|
|
1861
2121
|
}
|
|
1862
2122
|
|
|
1863
2123
|
// templates/FeatureScroll/FeatureScroll.tsx
|
|
1864
|
-
import { jsx as
|
|
2124
|
+
import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
1865
2125
|
var FEATURE_SCROLL_DATA = [
|
|
1866
2126
|
{
|
|
1867
2127
|
title: "Forex",
|
|
@@ -1906,7 +2166,7 @@ var FEATURE_SCROLL_DATA = [
|
|
|
1906
2166
|
mediaUrl: "https://cdn.prod.website-files.com/66fbaad381fa6866fa4991f3/675a9064f2c16e4e0732abfb_Stock%20Indices.lottie"
|
|
1907
2167
|
}
|
|
1908
2168
|
];
|
|
1909
|
-
var ChevronRight2 = () => /* @__PURE__ */
|
|
2169
|
+
var ChevronRight2 = () => /* @__PURE__ */ jsx24(
|
|
1910
2170
|
"svg",
|
|
1911
2171
|
{
|
|
1912
2172
|
className: "fs__item-link-icon",
|
|
@@ -1915,7 +2175,7 @@ var ChevronRight2 = () => /* @__PURE__ */ jsx22(
|
|
|
1915
2175
|
viewBox: "0 0 16 16",
|
|
1916
2176
|
fill: "none",
|
|
1917
2177
|
"aria-hidden": "true",
|
|
1918
|
-
children: /* @__PURE__ */
|
|
2178
|
+
children: /* @__PURE__ */ jsx24(
|
|
1919
2179
|
"path",
|
|
1920
2180
|
{
|
|
1921
2181
|
d: "M6 3l5 5-5 5",
|
|
@@ -1933,7 +2193,7 @@ function resolveMediaType(item) {
|
|
|
1933
2193
|
}
|
|
1934
2194
|
var MediaRenderer = ({ item, active }) => {
|
|
1935
2195
|
if (resolveMediaType(item) === "lottie") {
|
|
1936
|
-
return /* @__PURE__ */
|
|
2196
|
+
return /* @__PURE__ */ jsx24(
|
|
1937
2197
|
DotLottieInView,
|
|
1938
2198
|
{
|
|
1939
2199
|
src: item.mediaUrl,
|
|
@@ -1941,7 +2201,7 @@ var MediaRenderer = ({ item, active }) => {
|
|
|
1941
2201
|
}
|
|
1942
2202
|
);
|
|
1943
2203
|
}
|
|
1944
|
-
return /* @__PURE__ */
|
|
2204
|
+
return /* @__PURE__ */ jsx24(
|
|
1945
2205
|
"img",
|
|
1946
2206
|
{
|
|
1947
2207
|
src: item.mediaUrl,
|
|
@@ -2012,24 +2272,24 @@ var FeatureScroll = ({
|
|
|
2012
2272
|
className
|
|
2013
2273
|
].filter(Boolean).join(" ");
|
|
2014
2274
|
if (items.length === 0) {
|
|
2015
|
-
return /* @__PURE__ */
|
|
2275
|
+
return /* @__PURE__ */ jsx24("section", { className: rootClass, ...props, children: /* @__PURE__ */ jsx24("div", { className: "fs__inner", children: /* @__PURE__ */ jsx24("h2", { className: "fs__header", children: header }) }) });
|
|
2016
2276
|
}
|
|
2017
|
-
return /* @__PURE__ */
|
|
2018
|
-
/* @__PURE__ */
|
|
2019
|
-
/* @__PURE__ */
|
|
2020
|
-
/* @__PURE__ */
|
|
2277
|
+
return /* @__PURE__ */ jsx24("section", { className: rootClass, ...props, children: /* @__PURE__ */ jsxs21("div", { className: "fs__inner", children: [
|
|
2278
|
+
/* @__PURE__ */ jsx24("h2", { className: "fs__header", children: header }),
|
|
2279
|
+
/* @__PURE__ */ jsxs21("div", { className: "fs__layout", children: [
|
|
2280
|
+
/* @__PURE__ */ jsx24("div", { className: "fs__media-col", "aria-hidden": "true", children: /* @__PURE__ */ jsx24(
|
|
2021
2281
|
"div",
|
|
2022
2282
|
{
|
|
2023
2283
|
ref: mediaColRef,
|
|
2024
2284
|
className: "fs__media-sticky",
|
|
2025
|
-
children: /* @__PURE__ */
|
|
2285
|
+
children: /* @__PURE__ */ jsx24("div", { className: "fs__media-wrap", children: items.map((item, i) => /* @__PURE__ */ jsx24(
|
|
2026
2286
|
"div",
|
|
2027
2287
|
{
|
|
2028
2288
|
className: [
|
|
2029
2289
|
"fs__media-item",
|
|
2030
2290
|
i === activeIndex ? "fs__media-item--active" : ""
|
|
2031
2291
|
].filter(Boolean).join(" "),
|
|
2032
|
-
children: /* @__PURE__ */
|
|
2292
|
+
children: /* @__PURE__ */ jsx24(
|
|
2033
2293
|
MediaRenderer,
|
|
2034
2294
|
{
|
|
2035
2295
|
item,
|
|
@@ -2041,12 +2301,12 @@ var FeatureScroll = ({
|
|
|
2041
2301
|
)) })
|
|
2042
2302
|
}
|
|
2043
2303
|
) }),
|
|
2044
|
-
/* @__PURE__ */
|
|
2304
|
+
/* @__PURE__ */ jsx24("div", { className: "fs__content-col", children: items.map((item, i) => /* @__PURE__ */ jsxs21(
|
|
2045
2305
|
"div",
|
|
2046
2306
|
{
|
|
2047
2307
|
className: "fs__item",
|
|
2048
2308
|
children: [
|
|
2049
|
-
/* @__PURE__ */
|
|
2309
|
+
/* @__PURE__ */ jsx24(
|
|
2050
2310
|
"h3",
|
|
2051
2311
|
{
|
|
2052
2312
|
ref: (el) => {
|
|
@@ -2056,15 +2316,15 @@ var FeatureScroll = ({
|
|
|
2056
2316
|
children: item.title
|
|
2057
2317
|
}
|
|
2058
2318
|
),
|
|
2059
|
-
/* @__PURE__ */
|
|
2060
|
-
/* @__PURE__ */
|
|
2319
|
+
/* @__PURE__ */ jsx24("p", { className: "fs__item-desc", children: item.description }),
|
|
2320
|
+
/* @__PURE__ */ jsxs21(
|
|
2061
2321
|
"a",
|
|
2062
2322
|
{
|
|
2063
2323
|
href: item.link,
|
|
2064
2324
|
className: "fs__item-link",
|
|
2065
2325
|
children: [
|
|
2066
|
-
/* @__PURE__ */
|
|
2067
|
-
/* @__PURE__ */
|
|
2326
|
+
/* @__PURE__ */ jsx24("span", { children: item.linkLabel }),
|
|
2327
|
+
/* @__PURE__ */ jsx24(ChevronRight2, {})
|
|
2068
2328
|
]
|
|
2069
2329
|
}
|
|
2070
2330
|
)
|
|
@@ -2073,18 +2333,18 @@ var FeatureScroll = ({
|
|
|
2073
2333
|
i
|
|
2074
2334
|
)) })
|
|
2075
2335
|
] }),
|
|
2076
|
-
/* @__PURE__ */
|
|
2077
|
-
/* @__PURE__ */
|
|
2078
|
-
/* @__PURE__ */
|
|
2079
|
-
/* @__PURE__ */
|
|
2080
|
-
/* @__PURE__ */
|
|
2336
|
+
/* @__PURE__ */ jsx24("div", { className: "fs__mobile-list", children: items.map((item, i) => /* @__PURE__ */ jsxs21("div", { className: "fs__mobile-item", children: [
|
|
2337
|
+
/* @__PURE__ */ jsx24("h3", { className: "fs__item-title", children: item.title }),
|
|
2338
|
+
/* @__PURE__ */ jsx24("div", { className: "fs__mobile-media", children: /* @__PURE__ */ jsx24(MediaRenderer, { item, active: true }) }),
|
|
2339
|
+
/* @__PURE__ */ jsx24("p", { className: "fs__item-desc", children: item.description }),
|
|
2340
|
+
/* @__PURE__ */ jsxs21(
|
|
2081
2341
|
"a",
|
|
2082
2342
|
{
|
|
2083
2343
|
href: item.link,
|
|
2084
2344
|
className: "fs__item-link",
|
|
2085
2345
|
children: [
|
|
2086
|
-
/* @__PURE__ */
|
|
2087
|
-
/* @__PURE__ */
|
|
2346
|
+
/* @__PURE__ */ jsx24("span", { children: item.linkLabel }),
|
|
2347
|
+
/* @__PURE__ */ jsx24(ChevronRight2, {})
|
|
2088
2348
|
]
|
|
2089
2349
|
}
|
|
2090
2350
|
)
|
|
@@ -2094,7 +2354,7 @@ var FeatureScroll = ({
|
|
|
2094
2354
|
|
|
2095
2355
|
// templates/StickyStackedCards/StickyStackedCards.tsx
|
|
2096
2356
|
import { useEffect as useEffect6, useRef as useRef7 } from "react";
|
|
2097
|
-
import { jsx as
|
|
2357
|
+
import { jsx as jsx25, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2098
2358
|
var PLACEHOLDER_IMAGE = "https://cdn.prod.website-files.com/68da5c86c91c54f39c86c28a/69b9309379ac08e59ca8210a_1f3f555da9a5cbb13a6fe1bf0d5fe1b6_placeholder-image.webp";
|
|
2099
2359
|
var STEPS_DATA = [
|
|
2100
2360
|
{
|
|
@@ -2158,14 +2418,14 @@ var StickyStackedCards = ({
|
|
|
2158
2418
|
cancelAnimationFrame(rafId);
|
|
2159
2419
|
};
|
|
2160
2420
|
}, [items.length]);
|
|
2161
|
-
return /* @__PURE__ */
|
|
2421
|
+
return /* @__PURE__ */ jsx25(
|
|
2162
2422
|
"section",
|
|
2163
2423
|
{
|
|
2164
2424
|
className: ["ssc", className].filter(Boolean).join(" "),
|
|
2165
2425
|
...props,
|
|
2166
|
-
children: /* @__PURE__ */
|
|
2167
|
-
/* @__PURE__ */
|
|
2168
|
-
/* @__PURE__ */
|
|
2426
|
+
children: /* @__PURE__ */ jsxs22("div", { className: "ssc__inner", children: [
|
|
2427
|
+
/* @__PURE__ */ jsx25("h2", { className: "ssc__header", children: header }),
|
|
2428
|
+
/* @__PURE__ */ jsx25("div", { className: "ssc__track", children: items.map((item, i) => /* @__PURE__ */ jsxs22(
|
|
2169
2429
|
"div",
|
|
2170
2430
|
{
|
|
2171
2431
|
ref: (el) => {
|
|
@@ -2191,11 +2451,11 @@ var StickyStackedCards = ({
|
|
|
2191
2451
|
top: `calc(var(--ssc-sticky-top) + ${i} * var(--ssc-peek-offset))`
|
|
2192
2452
|
},
|
|
2193
2453
|
children: [
|
|
2194
|
-
/* @__PURE__ */
|
|
2195
|
-
/* @__PURE__ */
|
|
2196
|
-
/* @__PURE__ */
|
|
2454
|
+
/* @__PURE__ */ jsxs22("div", { className: "ssc__card-content", children: [
|
|
2455
|
+
/* @__PURE__ */ jsx25("h3", { className: "ssc__card-title", children: item.title }),
|
|
2456
|
+
/* @__PURE__ */ jsx25("p", { className: "ssc__card-desc", children: item.description })
|
|
2197
2457
|
] }),
|
|
2198
|
-
/* @__PURE__ */
|
|
2458
|
+
/* @__PURE__ */ jsx25("div", { className: "ssc__card-image", children: /* @__PURE__ */ jsx25(
|
|
2199
2459
|
"img",
|
|
2200
2460
|
{
|
|
2201
2461
|
src: item.imageUrl,
|
|
@@ -2221,7 +2481,7 @@ import {
|
|
|
2221
2481
|
useTransform,
|
|
2222
2482
|
useMotionTemplate
|
|
2223
2483
|
} from "framer-motion";
|
|
2224
|
-
import { jsx as
|
|
2484
|
+
import { jsx as jsx26, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2225
2485
|
var ENTRANCE = {
|
|
2226
2486
|
near: 80,
|
|
2227
2487
|
mid: 130,
|
|
@@ -2485,14 +2745,14 @@ var CTABanner = ({
|
|
|
2485
2745
|
const compactXValues = useCompactAvatarXValues(smooth);
|
|
2486
2746
|
const avatarYValues = variant === "compact" ? compactYValues : standardYValues;
|
|
2487
2747
|
const avatarXValues = variant === "compact" ? compactXValues : standardXValues;
|
|
2488
|
-
return /* @__PURE__ */
|
|
2748
|
+
return /* @__PURE__ */ jsxs23(
|
|
2489
2749
|
"section",
|
|
2490
2750
|
{
|
|
2491
2751
|
ref: sectionRef,
|
|
2492
2752
|
className: ["ctab", variant === "compact" ? "ctab--compact" : "", className].filter(Boolean).join(" "),
|
|
2493
2753
|
...props,
|
|
2494
2754
|
children: [
|
|
2495
|
-
/* @__PURE__ */
|
|
2755
|
+
/* @__PURE__ */ jsx26(
|
|
2496
2756
|
motion.div,
|
|
2497
2757
|
{
|
|
2498
2758
|
className: "ctab__grid",
|
|
@@ -2500,7 +2760,7 @@ var CTABanner = ({
|
|
|
2500
2760
|
"aria-hidden": "true"
|
|
2501
2761
|
}
|
|
2502
2762
|
),
|
|
2503
|
-
/* @__PURE__ */
|
|
2763
|
+
/* @__PURE__ */ jsx26("div", { className: "ctab__inner", children: /* @__PURE__ */ jsxs23("div", { className: "ctab__stage", children: [
|
|
2504
2764
|
resolvedAvatars.map((avatar, index) => {
|
|
2505
2765
|
const posStyle = {};
|
|
2506
2766
|
if (avatar.desktopPos.left) posStyle["--av-d-left"] = avatar.desktopPos.left;
|
|
@@ -2509,7 +2769,7 @@ var CTABanner = ({
|
|
|
2509
2769
|
if (avatar.mobilePos?.left) posStyle["--av-m-left"] = avatar.mobilePos.left;
|
|
2510
2770
|
if (avatar.mobilePos?.right) posStyle["--av-m-right"] = avatar.mobilePos.right;
|
|
2511
2771
|
if (avatar.mobilePos?.top) posStyle["--av-m-top"] = avatar.mobilePos.top;
|
|
2512
|
-
return /* @__PURE__ */
|
|
2772
|
+
return /* @__PURE__ */ jsx26(
|
|
2513
2773
|
motion.div,
|
|
2514
2774
|
{
|
|
2515
2775
|
className: [
|
|
@@ -2523,7 +2783,7 @@ var CTABanner = ({
|
|
|
2523
2783
|
opacity: avatarOpacity,
|
|
2524
2784
|
filter: avatarFilter
|
|
2525
2785
|
},
|
|
2526
|
-
children: /* @__PURE__ */
|
|
2786
|
+
children: /* @__PURE__ */ jsx26(
|
|
2527
2787
|
"img",
|
|
2528
2788
|
{
|
|
2529
2789
|
src: avatar.imageUrl,
|
|
@@ -2536,14 +2796,14 @@ var CTABanner = ({
|
|
|
2536
2796
|
avatar.id
|
|
2537
2797
|
);
|
|
2538
2798
|
}),
|
|
2539
|
-
/* @__PURE__ */
|
|
2799
|
+
/* @__PURE__ */ jsxs23(
|
|
2540
2800
|
motion.div,
|
|
2541
2801
|
{
|
|
2542
2802
|
className: "ctab__hero",
|
|
2543
2803
|
style: { y: heroY, opacity: heroOpacity },
|
|
2544
2804
|
children: [
|
|
2545
|
-
/* @__PURE__ */
|
|
2546
|
-
/* @__PURE__ */
|
|
2805
|
+
/* @__PURE__ */ jsx26("h2", { className: "ctab__headline", children: headline }),
|
|
2806
|
+
/* @__PURE__ */ jsx26("a", { href: ctaHref, children: /* @__PURE__ */ jsx26(Button, { colorScheme: "black", variant: "primary", label: ctaLabel }) })
|
|
2547
2807
|
]
|
|
2548
2808
|
}
|
|
2549
2809
|
)
|
|
@@ -2561,7 +2821,7 @@ import { motion as motion2, AnimatePresence } from "framer-motion";
|
|
|
2561
2821
|
var icon_globe_default = "./icon-globe-S54WYYEK.svg";
|
|
2562
2822
|
|
|
2563
2823
|
// components/Navbar/Navbar.tsx
|
|
2564
|
-
import { jsx as
|
|
2824
|
+
import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2565
2825
|
var EASE_OUT_EXPO = [0.16, 1, 0.3, 1];
|
|
2566
2826
|
var dropdownVariants = {
|
|
2567
2827
|
hidden: { opacity: 0, scale: 0.96, y: -8 },
|
|
@@ -2575,7 +2835,7 @@ var accordionVariants = {
|
|
|
2575
2835
|
hidden: { height: 0, opacity: 0 },
|
|
2576
2836
|
visible: { height: "auto", opacity: 1 }
|
|
2577
2837
|
};
|
|
2578
|
-
var ChevronDownIcon3 = ({ className }) => /* @__PURE__ */
|
|
2838
|
+
var ChevronDownIcon3 = ({ className }) => /* @__PURE__ */ jsx27(
|
|
2579
2839
|
"svg",
|
|
2580
2840
|
{
|
|
2581
2841
|
className,
|
|
@@ -2584,7 +2844,7 @@ var ChevronDownIcon3 = ({ className }) => /* @__PURE__ */ jsx25(
|
|
|
2584
2844
|
viewBox: "0 0 14 14",
|
|
2585
2845
|
fill: "none",
|
|
2586
2846
|
"aria-hidden": "true",
|
|
2587
|
-
children: /* @__PURE__ */
|
|
2847
|
+
children: /* @__PURE__ */ jsx27(
|
|
2588
2848
|
"path",
|
|
2589
2849
|
{
|
|
2590
2850
|
d: "M2.625 4.8125L7 9.1875L11.375 4.8125",
|
|
@@ -2596,7 +2856,7 @@ var ChevronDownIcon3 = ({ className }) => /* @__PURE__ */ jsx25(
|
|
|
2596
2856
|
)
|
|
2597
2857
|
}
|
|
2598
2858
|
);
|
|
2599
|
-
var ArrowRightIcon = () => /* @__PURE__ */
|
|
2859
|
+
var ArrowRightIcon = () => /* @__PURE__ */ jsx27("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx27(
|
|
2600
2860
|
"path",
|
|
2601
2861
|
{
|
|
2602
2862
|
d: "M2.625 7H11.375M11.375 7L7.875 3.5M11.375 7L7.875 10.5",
|
|
@@ -2606,7 +2866,7 @@ var ArrowRightIcon = () => /* @__PURE__ */ jsx25("svg", { width: "14", height: "
|
|
|
2606
2866
|
strokeLinejoin: "round"
|
|
2607
2867
|
}
|
|
2608
2868
|
) });
|
|
2609
|
-
var ArrowUpRightIcon = () => /* @__PURE__ */
|
|
2869
|
+
var ArrowUpRightIcon = () => /* @__PURE__ */ jsx27("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx27(
|
|
2610
2870
|
"path",
|
|
2611
2871
|
{
|
|
2612
2872
|
d: "M4.5 11.5L11.5 4.5M11.5 4.5H5.5M11.5 4.5V10.5",
|
|
@@ -2616,7 +2876,7 @@ var ArrowUpRightIcon = () => /* @__PURE__ */ jsx25("svg", { width: "16", height:
|
|
|
2616
2876
|
strokeLinejoin: "round"
|
|
2617
2877
|
}
|
|
2618
2878
|
) });
|
|
2619
|
-
var BarsIcon = () => /* @__PURE__ */
|
|
2879
|
+
var BarsIcon = () => /* @__PURE__ */ jsx27("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx27(
|
|
2620
2880
|
"path",
|
|
2621
2881
|
{
|
|
2622
2882
|
d: "M2.5 5H17.5M2.5 10H17.5M2.5 15H17.5",
|
|
@@ -2625,7 +2885,7 @@ var BarsIcon = () => /* @__PURE__ */ jsx25("svg", { width: "20", height: "20", v
|
|
|
2625
2885
|
strokeLinecap: "round"
|
|
2626
2886
|
}
|
|
2627
2887
|
) });
|
|
2628
|
-
var XMarkIcon2 = () => /* @__PURE__ */
|
|
2888
|
+
var XMarkIcon2 = () => /* @__PURE__ */ jsx27("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx27(
|
|
2629
2889
|
"path",
|
|
2630
2890
|
{
|
|
2631
2891
|
d: "M15 5L5 15M5 5L15 15",
|
|
@@ -2634,7 +2894,7 @@ var XMarkIcon2 = () => /* @__PURE__ */ jsx25("svg", { width: "20", height: "20",
|
|
|
2634
2894
|
strokeLinecap: "round"
|
|
2635
2895
|
}
|
|
2636
2896
|
) });
|
|
2637
|
-
var ChevronLeftIcon = ({ className }) => /* @__PURE__ */
|
|
2897
|
+
var ChevronLeftIcon = ({ className }) => /* @__PURE__ */ jsx27(
|
|
2638
2898
|
"svg",
|
|
2639
2899
|
{
|
|
2640
2900
|
className,
|
|
@@ -2643,7 +2903,7 @@ var ChevronLeftIcon = ({ className }) => /* @__PURE__ */ jsx25(
|
|
|
2643
2903
|
viewBox: "0 0 24 24",
|
|
2644
2904
|
fill: "none",
|
|
2645
2905
|
"aria-hidden": "true",
|
|
2646
|
-
children: /* @__PURE__ */
|
|
2906
|
+
children: /* @__PURE__ */ jsx27(
|
|
2647
2907
|
"path",
|
|
2648
2908
|
{
|
|
2649
2909
|
d: "M15 18L9 12L15 6",
|
|
@@ -2655,11 +2915,11 @@ var ChevronLeftIcon = ({ className }) => /* @__PURE__ */ jsx25(
|
|
|
2655
2915
|
)
|
|
2656
2916
|
}
|
|
2657
2917
|
);
|
|
2658
|
-
var GlobeIcon = ({ className }) => /* @__PURE__ */
|
|
2918
|
+
var GlobeIcon = ({ className }) => /* @__PURE__ */ jsx27("img", { src: icon_globe_default, alt: "", "aria-hidden": "true", width: "20", height: "20", className });
|
|
2659
2919
|
var DropdownPanel = ({ item, onMouseEnter, onMouseLeave }) => {
|
|
2660
2920
|
const { dropdown } = item;
|
|
2661
2921
|
if (!dropdown) return null;
|
|
2662
|
-
return /* @__PURE__ */
|
|
2922
|
+
return /* @__PURE__ */ jsx27(
|
|
2663
2923
|
motion2.div,
|
|
2664
2924
|
{
|
|
2665
2925
|
className: "navbar__dropdown",
|
|
@@ -2670,10 +2930,10 @@ var DropdownPanel = ({ item, onMouseEnter, onMouseLeave }) => {
|
|
|
2670
2930
|
transition: { duration: 0.18, ease: EASE_OUT_EXPO },
|
|
2671
2931
|
onMouseEnter,
|
|
2672
2932
|
onMouseLeave,
|
|
2673
|
-
children: /* @__PURE__ */
|
|
2674
|
-
/* @__PURE__ */
|
|
2675
|
-
/* @__PURE__ */
|
|
2676
|
-
section.items.map((link) => /* @__PURE__ */
|
|
2933
|
+
children: /* @__PURE__ */ jsxs24("div", { className: "navbar__dropdown-inner", children: [
|
|
2934
|
+
/* @__PURE__ */ jsx27("div", { className: "navbar__dropdown-left", children: dropdown.columns.map((col, colIdx) => /* @__PURE__ */ jsx27("div", { className: "navbar__dropdown-col", children: col.sections.map((section) => /* @__PURE__ */ jsxs24("div", { className: "navbar__dropdown-col-list", children: [
|
|
2935
|
+
/* @__PURE__ */ jsx27("p", { className: "navbar__dropdown-col-title", children: section.title }),
|
|
2936
|
+
section.items.map((link) => /* @__PURE__ */ jsxs24(
|
|
2677
2937
|
"a",
|
|
2678
2938
|
{
|
|
2679
2939
|
href: link.href,
|
|
@@ -2682,24 +2942,24 @@ var DropdownPanel = ({ item, onMouseEnter, onMouseLeave }) => {
|
|
|
2682
2942
|
rel: link.external ? "noopener noreferrer" : void 0,
|
|
2683
2943
|
children: [
|
|
2684
2944
|
link.label,
|
|
2685
|
-
link.external ? /* @__PURE__ */
|
|
2945
|
+
link.external ? /* @__PURE__ */ jsx27(ArrowUpRightIcon, {}) : /* @__PURE__ */ jsx27(ArrowRightIcon, {})
|
|
2686
2946
|
]
|
|
2687
2947
|
},
|
|
2688
2948
|
link.href
|
|
2689
2949
|
))
|
|
2690
2950
|
] }, section.title)) }, colIdx)) }),
|
|
2691
|
-
dropdown.feature && /* @__PURE__ */
|
|
2951
|
+
dropdown.feature && /* @__PURE__ */ jsx27("div", { className: "navbar__dropdown-right", children: /* @__PURE__ */ jsx27(FeatureCard, { feature: dropdown.feature }) })
|
|
2692
2952
|
] })
|
|
2693
2953
|
}
|
|
2694
2954
|
);
|
|
2695
2955
|
};
|
|
2696
|
-
var FeatureCard = ({ feature, mobile }) => /* @__PURE__ */
|
|
2956
|
+
var FeatureCard = ({ feature, mobile }) => /* @__PURE__ */ jsxs24(
|
|
2697
2957
|
"div",
|
|
2698
2958
|
{
|
|
2699
2959
|
className: mobile ? "navbar__drawer-feature" : "navbar__dropdown-feature",
|
|
2700
2960
|
style: feature.backgroundImageUrl ? { backgroundImage: `url(${feature.backgroundImageUrl})` } : void 0,
|
|
2701
2961
|
children: [
|
|
2702
|
-
feature.backgroundImageUrl && /* @__PURE__ */
|
|
2962
|
+
feature.backgroundImageUrl && /* @__PURE__ */ jsx27(
|
|
2703
2963
|
"img",
|
|
2704
2964
|
{
|
|
2705
2965
|
src: feature.backgroundImageUrl,
|
|
@@ -2708,20 +2968,20 @@ var FeatureCard = ({ feature, mobile }) => /* @__PURE__ */ jsxs23(
|
|
|
2708
2968
|
"aria-hidden": "true"
|
|
2709
2969
|
}
|
|
2710
2970
|
),
|
|
2711
|
-
/* @__PURE__ */
|
|
2712
|
-
/* @__PURE__ */
|
|
2713
|
-
/* @__PURE__ */
|
|
2714
|
-
/* @__PURE__ */
|
|
2715
|
-
/* @__PURE__ */
|
|
2971
|
+
/* @__PURE__ */ jsx27("div", { className: mobile ? "navbar__drawer-feature-overlay" : "navbar__dropdown-feature-overlay", "aria-hidden": "true" }),
|
|
2972
|
+
/* @__PURE__ */ jsxs24("div", { className: mobile ? "navbar__drawer-feature-content" : "navbar__dropdown-feature-content", children: [
|
|
2973
|
+
/* @__PURE__ */ jsxs24("div", { children: [
|
|
2974
|
+
/* @__PURE__ */ jsx27("p", { className: mobile ? "navbar__drawer-feature-title" : "navbar__dropdown-feature-title", children: feature.title }),
|
|
2975
|
+
/* @__PURE__ */ jsx27("p", { className: mobile ? "navbar__drawer-feature-desc" : "navbar__dropdown-feature-desc", children: feature.description })
|
|
2716
2976
|
] }),
|
|
2717
|
-
/* @__PURE__ */
|
|
2977
|
+
/* @__PURE__ */ jsxs24(
|
|
2718
2978
|
"a",
|
|
2719
2979
|
{
|
|
2720
2980
|
href: feature.ctaHref,
|
|
2721
2981
|
className: mobile ? "navbar__drawer-feature-cta" : "navbar__dropdown-feature-cta",
|
|
2722
2982
|
children: [
|
|
2723
2983
|
feature.ctaLabel,
|
|
2724
|
-
/* @__PURE__ */
|
|
2984
|
+
/* @__PURE__ */ jsx27(ArrowRightIcon, {})
|
|
2725
2985
|
]
|
|
2726
2986
|
}
|
|
2727
2987
|
)
|
|
@@ -2731,8 +2991,8 @@ var FeatureCard = ({ feature, mobile }) => /* @__PURE__ */ jsxs23(
|
|
|
2731
2991
|
);
|
|
2732
2992
|
var DrawerAccordion = ({ item, isOpen, onToggle }) => {
|
|
2733
2993
|
const { dropdown } = item;
|
|
2734
|
-
return /* @__PURE__ */
|
|
2735
|
-
/* @__PURE__ */
|
|
2994
|
+
return /* @__PURE__ */ jsxs24("div", { className: "navbar__drawer-item", children: [
|
|
2995
|
+
/* @__PURE__ */ jsxs24(
|
|
2736
2996
|
"button",
|
|
2737
2997
|
{
|
|
2738
2998
|
className: `navbar__drawer-trigger ${isOpen ? "navbar__drawer-trigger--open" : ""}`,
|
|
@@ -2740,11 +3000,11 @@ var DrawerAccordion = ({ item, isOpen, onToggle }) => {
|
|
|
2740
3000
|
"aria-expanded": isOpen,
|
|
2741
3001
|
children: [
|
|
2742
3002
|
item.label,
|
|
2743
|
-
/* @__PURE__ */
|
|
3003
|
+
/* @__PURE__ */ jsx27(ChevronDownIcon3, { className: "navbar__drawer-trigger__chevron" })
|
|
2744
3004
|
]
|
|
2745
3005
|
}
|
|
2746
3006
|
),
|
|
2747
|
-
/* @__PURE__ */
|
|
3007
|
+
/* @__PURE__ */ jsx27(AnimatePresence, { initial: false, children: isOpen && dropdown && /* @__PURE__ */ jsx27(
|
|
2748
3008
|
motion2.div,
|
|
2749
3009
|
{
|
|
2750
3010
|
className: "navbar__drawer-panel",
|
|
@@ -2753,10 +3013,10 @@ var DrawerAccordion = ({ item, isOpen, onToggle }) => {
|
|
|
2753
3013
|
animate: "visible",
|
|
2754
3014
|
exit: "hidden",
|
|
2755
3015
|
transition: { duration: 0.22, ease: EASE_OUT_EXPO },
|
|
2756
|
-
children: /* @__PURE__ */
|
|
2757
|
-
/* @__PURE__ */
|
|
2758
|
-
/* @__PURE__ */
|
|
2759
|
-
/* @__PURE__ */
|
|
3016
|
+
children: /* @__PURE__ */ jsxs24("div", { className: "navbar__drawer-panel-inner", children: [
|
|
3017
|
+
/* @__PURE__ */ jsx27("div", { className: "navbar__drawer-panel-cols", children: dropdown.columns.map((col, colIdx) => /* @__PURE__ */ jsx27("div", { className: "navbar__drawer-panel-col", children: col.sections.map((section) => /* @__PURE__ */ jsxs24("div", { className: "navbar__drawer-col-section", children: [
|
|
3018
|
+
/* @__PURE__ */ jsx27("p", { className: "navbar__drawer-col-title", children: section.title }),
|
|
3019
|
+
/* @__PURE__ */ jsx27("div", { className: "navbar__drawer-col-links", children: section.items.map((link) => /* @__PURE__ */ jsx27(
|
|
2760
3020
|
"a",
|
|
2761
3021
|
{
|
|
2762
3022
|
href: link.href,
|
|
@@ -2768,7 +3028,7 @@ var DrawerAccordion = ({ item, isOpen, onToggle }) => {
|
|
|
2768
3028
|
link.href
|
|
2769
3029
|
)) })
|
|
2770
3030
|
] }, section.title)) }, colIdx)) }),
|
|
2771
|
-
dropdown.feature && /* @__PURE__ */
|
|
3031
|
+
dropdown.feature && /* @__PURE__ */ jsx27(FeatureCard, { feature: dropdown.feature, mobile: true })
|
|
2772
3032
|
] })
|
|
2773
3033
|
}
|
|
2774
3034
|
) })
|
|
@@ -2873,20 +3133,20 @@ var Navbar = ({
|
|
|
2873
3133
|
hoverTimeoutRef.current = setTimeout(() => setOpenDropdown(null), 120);
|
|
2874
3134
|
}, [clearHoverTimeout]);
|
|
2875
3135
|
const activeDropdownItem = navItems.find((item) => item.label === openDropdown);
|
|
2876
|
-
return /* @__PURE__ */
|
|
3136
|
+
return /* @__PURE__ */ jsxs24(
|
|
2877
3137
|
"nav",
|
|
2878
3138
|
{
|
|
2879
3139
|
className: ["navbar", `navbar--${theme}`, scrolled && "navbar--scrolled", mobileOpen && "navbar--menu-open", className].filter(Boolean).join(" "),
|
|
2880
3140
|
...props,
|
|
2881
3141
|
children: [
|
|
2882
|
-
/* @__PURE__ */
|
|
2883
|
-
/* @__PURE__ */
|
|
2884
|
-
/* @__PURE__ */
|
|
2885
|
-
/* @__PURE__ */
|
|
2886
|
-
/* @__PURE__ */
|
|
3142
|
+
/* @__PURE__ */ jsxs24("div", { className: "navbar__bar", children: [
|
|
3143
|
+
/* @__PURE__ */ jsx27("a", { href: logoHref, className: "navbar__logo", "aria-label": "Home", children: /* @__PURE__ */ jsx27("img", { src: resolvedLogo, alt: "Logo" }) }),
|
|
3144
|
+
/* @__PURE__ */ jsx27("div", { className: "navbar__nav-center", ref: pillAreaRef, children: /* @__PURE__ */ jsxs24("div", { className: "navbar__pill", children: [
|
|
3145
|
+
/* @__PURE__ */ jsx27("a", { href: logoHref, className: "navbar__pill-logo", "aria-label": "Home", children: /* @__PURE__ */ jsx27("img", { src: logoSrcDark ?? logoSrc, alt: "Logo" }) }),
|
|
3146
|
+
/* @__PURE__ */ jsxs24("div", { className: "navbar__nav-group", children: [
|
|
2887
3147
|
navItems.map((item) => {
|
|
2888
3148
|
if (item.external) {
|
|
2889
|
-
return /* @__PURE__ */
|
|
3149
|
+
return /* @__PURE__ */ jsxs24(
|
|
2890
3150
|
"a",
|
|
2891
3151
|
{
|
|
2892
3152
|
href: item.href,
|
|
@@ -2895,14 +3155,14 @@ var Navbar = ({
|
|
|
2895
3155
|
rel: "noopener noreferrer",
|
|
2896
3156
|
children: [
|
|
2897
3157
|
item.label,
|
|
2898
|
-
/* @__PURE__ */
|
|
3158
|
+
/* @__PURE__ */ jsx27(ArrowUpRightIcon, {})
|
|
2899
3159
|
]
|
|
2900
3160
|
},
|
|
2901
3161
|
item.label
|
|
2902
3162
|
);
|
|
2903
3163
|
}
|
|
2904
3164
|
if (item.dropdown) {
|
|
2905
|
-
return /* @__PURE__ */
|
|
3165
|
+
return /* @__PURE__ */ jsxs24(
|
|
2906
3166
|
"button",
|
|
2907
3167
|
{
|
|
2908
3168
|
className: [
|
|
@@ -2915,21 +3175,21 @@ var Navbar = ({
|
|
|
2915
3175
|
"aria-haspopup": "true",
|
|
2916
3176
|
children: [
|
|
2917
3177
|
item.label,
|
|
2918
|
-
/* @__PURE__ */
|
|
3178
|
+
/* @__PURE__ */ jsx27(ChevronDownIcon3, { className: "navbar__nav-item__chevron" })
|
|
2919
3179
|
]
|
|
2920
3180
|
},
|
|
2921
3181
|
item.label
|
|
2922
3182
|
);
|
|
2923
3183
|
}
|
|
2924
|
-
return /* @__PURE__ */
|
|
3184
|
+
return /* @__PURE__ */ jsx27("a", { href: item.href, className: "navbar__nav-item", children: item.label }, item.label);
|
|
2925
3185
|
}),
|
|
2926
|
-
languageLabel && /* @__PURE__ */
|
|
3186
|
+
languageLabel && /* @__PURE__ */ jsx27(
|
|
2927
3187
|
"div",
|
|
2928
3188
|
{
|
|
2929
3189
|
className: "navbar__lang-wrapper",
|
|
2930
3190
|
onMouseEnter: hasLangDropdown ? handleLangEnter : void 0,
|
|
2931
3191
|
onMouseLeave: hasLangDropdown ? handleLangLeave : void 0,
|
|
2932
|
-
children: /* @__PURE__ */
|
|
3192
|
+
children: /* @__PURE__ */ jsxs24(
|
|
2933
3193
|
"button",
|
|
2934
3194
|
{
|
|
2935
3195
|
ref: langBtnRef,
|
|
@@ -2942,7 +3202,7 @@ var Navbar = ({
|
|
|
2942
3202
|
"aria-haspopup": hasLangDropdown ? "true" : void 0,
|
|
2943
3203
|
"aria-expanded": hasLangDropdown ? langDropdownOpen : void 0,
|
|
2944
3204
|
children: [
|
|
2945
|
-
/* @__PURE__ */
|
|
3205
|
+
/* @__PURE__ */ jsx27(GlobeIcon, { className: "navbar__lang-globe" }),
|
|
2946
3206
|
languageLabel
|
|
2947
3207
|
]
|
|
2948
3208
|
}
|
|
@@ -2950,12 +3210,12 @@ var Navbar = ({
|
|
|
2950
3210
|
}
|
|
2951
3211
|
)
|
|
2952
3212
|
] }),
|
|
2953
|
-
/* @__PURE__ */
|
|
2954
|
-
loginHref && /* @__PURE__ */
|
|
2955
|
-
ctaHref && /* @__PURE__ */
|
|
3213
|
+
/* @__PURE__ */ jsxs24("div", { className: "navbar__pill-actions", children: [
|
|
3214
|
+
loginHref && /* @__PURE__ */ jsx27("a", { href: loginHref, children: /* @__PURE__ */ jsx27(Button, { colorScheme: "black", variant: "secondary", label: loginLabel }) }),
|
|
3215
|
+
ctaHref && /* @__PURE__ */ jsx27("a", { href: ctaHref, children: /* @__PURE__ */ jsx27(Button, { colorScheme: "coral", variant: "primary", label: ctaLabel }) })
|
|
2956
3216
|
] })
|
|
2957
3217
|
] }) }),
|
|
2958
|
-
/* @__PURE__ */
|
|
3218
|
+
/* @__PURE__ */ jsx27(AnimatePresence, { children: openDropdown && activeDropdownItem?.dropdown && /* @__PURE__ */ jsx27(
|
|
2959
3219
|
DropdownPanel,
|
|
2960
3220
|
{
|
|
2961
3221
|
item: activeDropdownItem,
|
|
@@ -2964,7 +3224,7 @@ var Navbar = ({
|
|
|
2964
3224
|
},
|
|
2965
3225
|
"dropdown"
|
|
2966
3226
|
) }),
|
|
2967
|
-
/* @__PURE__ */
|
|
3227
|
+
/* @__PURE__ */ jsx27(AnimatePresence, { children: hasLangDropdown && langDropdownOpen && /* @__PURE__ */ jsx27(
|
|
2968
3228
|
motion2.div,
|
|
2969
3229
|
{
|
|
2970
3230
|
className: "navbar__lang-dropdown",
|
|
@@ -2975,12 +3235,12 @@ var Navbar = ({
|
|
|
2975
3235
|
transition: { duration: 0.18, ease: EASE_OUT_EXPO },
|
|
2976
3236
|
onMouseEnter: clearLangHoverTimeout,
|
|
2977
3237
|
onMouseLeave: handleLangLeave,
|
|
2978
|
-
children: /* @__PURE__ */
|
|
3238
|
+
children: /* @__PURE__ */ jsx27(
|
|
2979
3239
|
"div",
|
|
2980
3240
|
{
|
|
2981
3241
|
className: "navbar__lang-dropdown-grid",
|
|
2982
3242
|
style: { "--lang-rows": Math.ceil(languageItems.length / 3) },
|
|
2983
|
-
children: languageItems.map((lang) => /* @__PURE__ */
|
|
3243
|
+
children: languageItems.map((lang) => /* @__PURE__ */ jsx27(
|
|
2984
3244
|
"button",
|
|
2985
3245
|
{
|
|
2986
3246
|
className: [
|
|
@@ -2996,8 +3256,8 @@ var Navbar = ({
|
|
|
2996
3256
|
)
|
|
2997
3257
|
}
|
|
2998
3258
|
) }),
|
|
2999
|
-
/* @__PURE__ */
|
|
3000
|
-
loginHref && /* @__PURE__ */
|
|
3259
|
+
/* @__PURE__ */ jsxs24("div", { className: "navbar__actions", children: [
|
|
3260
|
+
loginHref && /* @__PURE__ */ jsx27("a", { href: loginHref, className: "navbar__actions-login", children: /* @__PURE__ */ jsx27(
|
|
3001
3261
|
Button,
|
|
3002
3262
|
{
|
|
3003
3263
|
colorScheme: theme === "dark" ? "white" : "black",
|
|
@@ -3005,10 +3265,10 @@ var Navbar = ({
|
|
|
3005
3265
|
label: loginLabel
|
|
3006
3266
|
}
|
|
3007
3267
|
) }),
|
|
3008
|
-
ctaHref && /* @__PURE__ */
|
|
3268
|
+
ctaHref && /* @__PURE__ */ jsx27("a", { href: ctaHref, children: /* @__PURE__ */ jsx27(Button, { colorScheme: "coral", variant: "primary", label: ctaLabel }) })
|
|
3009
3269
|
] }),
|
|
3010
|
-
/* @__PURE__ */
|
|
3011
|
-
loginHref && /* @__PURE__ */
|
|
3270
|
+
/* @__PURE__ */ jsxs24("div", { className: "navbar__mobile-actions", children: [
|
|
3271
|
+
loginHref && /* @__PURE__ */ jsx27("a", { href: loginHref, children: /* @__PURE__ */ jsx27(
|
|
3012
3272
|
Button,
|
|
3013
3273
|
{
|
|
3014
3274
|
colorScheme: scrolled || theme === "light" ? "black" : "white",
|
|
@@ -3016,18 +3276,18 @@ var Navbar = ({
|
|
|
3016
3276
|
label: loginLabel
|
|
3017
3277
|
}
|
|
3018
3278
|
) }),
|
|
3019
|
-
/* @__PURE__ */
|
|
3279
|
+
/* @__PURE__ */ jsx27(
|
|
3020
3280
|
"button",
|
|
3021
3281
|
{
|
|
3022
3282
|
className: "navbar__mobile-trigger",
|
|
3023
3283
|
onClick: () => setMobileOpen((o) => !o),
|
|
3024
3284
|
"aria-label": mobileOpen ? "Close navigation menu" : "Open navigation menu",
|
|
3025
|
-
children: mobileOpen ? /* @__PURE__ */
|
|
3285
|
+
children: mobileOpen ? /* @__PURE__ */ jsx27(XMarkIcon2, {}) : /* @__PURE__ */ jsx27(BarsIcon, {})
|
|
3026
3286
|
}
|
|
3027
3287
|
)
|
|
3028
3288
|
] })
|
|
3029
3289
|
] }),
|
|
3030
|
-
/* @__PURE__ */
|
|
3290
|
+
/* @__PURE__ */ jsx27("div", { className: "navbar__drawer-clip", children: /* @__PURE__ */ jsx27(AnimatePresence, { children: mobileOpen && /* @__PURE__ */ jsxs24(
|
|
3031
3291
|
motion2.div,
|
|
3032
3292
|
{
|
|
3033
3293
|
className: "navbar__drawer",
|
|
@@ -3040,10 +3300,10 @@ var Navbar = ({
|
|
|
3040
3300
|
role: "dialog",
|
|
3041
3301
|
"aria-label": "Navigation menu",
|
|
3042
3302
|
children: [
|
|
3043
|
-
/* @__PURE__ */
|
|
3303
|
+
/* @__PURE__ */ jsxs24("nav", { className: "navbar__drawer-nav", children: [
|
|
3044
3304
|
navItems.map((item) => {
|
|
3045
3305
|
if (item.dropdown) {
|
|
3046
|
-
return /* @__PURE__ */
|
|
3306
|
+
return /* @__PURE__ */ jsx27(
|
|
3047
3307
|
DrawerAccordion,
|
|
3048
3308
|
{
|
|
3049
3309
|
item,
|
|
@@ -3055,7 +3315,7 @@ var Navbar = ({
|
|
|
3055
3315
|
item.label
|
|
3056
3316
|
);
|
|
3057
3317
|
}
|
|
3058
|
-
return /* @__PURE__ */
|
|
3318
|
+
return /* @__PURE__ */ jsxs24(
|
|
3059
3319
|
"a",
|
|
3060
3320
|
{
|
|
3061
3321
|
href: item.href,
|
|
@@ -3064,30 +3324,30 @@ var Navbar = ({
|
|
|
3064
3324
|
rel: item.external ? "noopener noreferrer" : void 0,
|
|
3065
3325
|
children: [
|
|
3066
3326
|
item.label,
|
|
3067
|
-
item.external && /* @__PURE__ */
|
|
3327
|
+
item.external && /* @__PURE__ */ jsx27(ArrowUpRightIcon, {})
|
|
3068
3328
|
]
|
|
3069
3329
|
},
|
|
3070
3330
|
item.label
|
|
3071
3331
|
);
|
|
3072
3332
|
}),
|
|
3073
|
-
languageLabel && !hasLangDropdown && /* @__PURE__ */
|
|
3074
|
-
/* @__PURE__ */
|
|
3333
|
+
languageLabel && !hasLangDropdown && /* @__PURE__ */ jsxs24("button", { className: "navbar__drawer-lang", onClick: onLanguageClick, children: [
|
|
3334
|
+
/* @__PURE__ */ jsx27(GlobeIcon, { className: "navbar__lang-globe" }),
|
|
3075
3335
|
languageLabel
|
|
3076
3336
|
] }),
|
|
3077
|
-
languageLabel && hasLangDropdown && /* @__PURE__ */
|
|
3337
|
+
languageLabel && hasLangDropdown && /* @__PURE__ */ jsxs24(
|
|
3078
3338
|
"button",
|
|
3079
3339
|
{
|
|
3080
3340
|
className: "navbar__drawer-lang",
|
|
3081
3341
|
onClick: () => setMobileLangOpen(true),
|
|
3082
3342
|
children: [
|
|
3083
|
-
/* @__PURE__ */
|
|
3343
|
+
/* @__PURE__ */ jsx27(GlobeIcon, { className: "navbar__lang-globe" }),
|
|
3084
3344
|
languageLabel
|
|
3085
3345
|
]
|
|
3086
3346
|
}
|
|
3087
3347
|
)
|
|
3088
3348
|
] }),
|
|
3089
|
-
!mobileLangOpen && /* @__PURE__ */
|
|
3090
|
-
loginHref && /* @__PURE__ */
|
|
3349
|
+
!mobileLangOpen && /* @__PURE__ */ jsxs24("div", { className: "navbar__drawer-footer", children: [
|
|
3350
|
+
loginHref && /* @__PURE__ */ jsx27("a", { href: loginHref, style: { display: "block" }, children: /* @__PURE__ */ jsx27(
|
|
3091
3351
|
Button,
|
|
3092
3352
|
{
|
|
3093
3353
|
colorScheme: "black",
|
|
@@ -3096,7 +3356,7 @@ var Navbar = ({
|
|
|
3096
3356
|
fullWidth: true
|
|
3097
3357
|
}
|
|
3098
3358
|
) }),
|
|
3099
|
-
ctaHref && /* @__PURE__ */
|
|
3359
|
+
ctaHref && /* @__PURE__ */ jsx27("a", { href: ctaHref, style: { display: "block" }, children: /* @__PURE__ */ jsx27(
|
|
3100
3360
|
Button,
|
|
3101
3361
|
{
|
|
3102
3362
|
colorScheme: "coral",
|
|
@@ -3106,7 +3366,7 @@ var Navbar = ({
|
|
|
3106
3366
|
}
|
|
3107
3367
|
) })
|
|
3108
3368
|
] }),
|
|
3109
|
-
/* @__PURE__ */
|
|
3369
|
+
/* @__PURE__ */ jsx27(AnimatePresence, { children: hasLangDropdown && mobileLangOpen && /* @__PURE__ */ jsxs24(
|
|
3110
3370
|
motion2.div,
|
|
3111
3371
|
{
|
|
3112
3372
|
className: "navbar__drawer-lang-panel",
|
|
@@ -3115,16 +3375,16 @@ var Navbar = ({
|
|
|
3115
3375
|
exit: { y: "100%" },
|
|
3116
3376
|
transition: { duration: 0.25, ease: EASE_OUT_EXPO },
|
|
3117
3377
|
children: [
|
|
3118
|
-
/* @__PURE__ */
|
|
3378
|
+
/* @__PURE__ */ jsx27(
|
|
3119
3379
|
"button",
|
|
3120
3380
|
{
|
|
3121
3381
|
className: "navbar__drawer-lang-back",
|
|
3122
3382
|
onClick: () => setMobileLangOpen(false),
|
|
3123
3383
|
"aria-label": "Back to menu",
|
|
3124
|
-
children: /* @__PURE__ */
|
|
3384
|
+
children: /* @__PURE__ */ jsx27(ChevronLeftIcon, {})
|
|
3125
3385
|
}
|
|
3126
3386
|
),
|
|
3127
|
-
/* @__PURE__ */
|
|
3387
|
+
/* @__PURE__ */ jsx27("div", { className: "navbar__drawer-lang-grid", children: languageItems.map((lang) => /* @__PURE__ */ jsx27(
|
|
3128
3388
|
"button",
|
|
3129
3389
|
{
|
|
3130
3390
|
className: [
|
|
@@ -3231,7 +3491,7 @@ function webflowV2DayClipPercent(t, media) {
|
|
|
3231
3491
|
}
|
|
3232
3492
|
|
|
3233
3493
|
// templates/DayNightTransition/DayNightTransition.tsx
|
|
3234
|
-
import { Fragment as Fragment3, jsx as
|
|
3494
|
+
import { Fragment as Fragment3, jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3235
3495
|
var SPRING2 = { stiffness: 80, damping: 30, restDelta: 1e-3 };
|
|
3236
3496
|
var FADE_START = 0.35;
|
|
3237
3497
|
var FADE_END = 0.65;
|
|
@@ -3368,15 +3628,15 @@ var DayNightTransition = ({
|
|
|
3368
3628
|
descriptionLevel === "body-lg" && "dnt--desc-body-lg",
|
|
3369
3629
|
className
|
|
3370
3630
|
].filter(Boolean).join(" ");
|
|
3371
|
-
return /* @__PURE__ */
|
|
3631
|
+
return /* @__PURE__ */ jsxs25(
|
|
3372
3632
|
"div",
|
|
3373
3633
|
{
|
|
3374
3634
|
ref: wrapperRef,
|
|
3375
3635
|
className: rootClass,
|
|
3376
3636
|
...props,
|
|
3377
3637
|
children: [
|
|
3378
|
-
webflowV2 && /* @__PURE__ */
|
|
3379
|
-
/* @__PURE__ */
|
|
3638
|
+
webflowV2 && /* @__PURE__ */ jsxs25("div", { className: "dnt__v2-background-wrapper", "aria-hidden": "true", children: [
|
|
3639
|
+
/* @__PURE__ */ jsx28(
|
|
3380
3640
|
motion3.div,
|
|
3381
3641
|
{
|
|
3382
3642
|
className: "dnt__v2-bg-day trade-day-night_background-day is-alternative",
|
|
@@ -3386,7 +3646,7 @@ var DayNightTransition = ({
|
|
|
3386
3646
|
}
|
|
3387
3647
|
}
|
|
3388
3648
|
),
|
|
3389
|
-
/* @__PURE__ */
|
|
3649
|
+
/* @__PURE__ */ jsx28(
|
|
3390
3650
|
"div",
|
|
3391
3651
|
{
|
|
3392
3652
|
className: "dnt__v2-bg-night trade-day-night_background-night is-alternative",
|
|
@@ -3394,9 +3654,9 @@ var DayNightTransition = ({
|
|
|
3394
3654
|
}
|
|
3395
3655
|
)
|
|
3396
3656
|
] }),
|
|
3397
|
-
/* @__PURE__ */
|
|
3398
|
-
!webflowV2 && /* @__PURE__ */
|
|
3399
|
-
/* @__PURE__ */
|
|
3657
|
+
/* @__PURE__ */ jsxs25("div", { className: webflowV2 ? "dnt__sticky dnt__sticky--webflow-v2" : "dnt__sticky", children: [
|
|
3658
|
+
!webflowV2 && /* @__PURE__ */ jsxs25(Fragment3, { children: [
|
|
3659
|
+
/* @__PURE__ */ jsx28(
|
|
3400
3660
|
"img",
|
|
3401
3661
|
{
|
|
3402
3662
|
className: "dnt__bg dnt__bg--day",
|
|
@@ -3406,7 +3666,7 @@ var DayNightTransition = ({
|
|
|
3406
3666
|
draggable: false
|
|
3407
3667
|
}
|
|
3408
3668
|
),
|
|
3409
|
-
/* @__PURE__ */
|
|
3669
|
+
/* @__PURE__ */ jsx28(
|
|
3410
3670
|
motion3.img,
|
|
3411
3671
|
{
|
|
3412
3672
|
className: "dnt__bg dnt__bg--night",
|
|
@@ -3418,17 +3678,17 @@ var DayNightTransition = ({
|
|
|
3418
3678
|
}
|
|
3419
3679
|
)
|
|
3420
3680
|
] }),
|
|
3421
|
-
/* @__PURE__ */
|
|
3422
|
-
useInlineHeadline && inlineDayNightHeadline ? /* @__PURE__ */
|
|
3681
|
+
/* @__PURE__ */ jsx28("div", { className: "dnt__content", children: /* @__PURE__ */ jsx28("div", { className: "dnt__inner", children: webflowV2 ? /* @__PURE__ */ jsxs25("div", { className: "dnt__text-wrap", children: [
|
|
3682
|
+
useInlineHeadline && inlineDayNightHeadline ? /* @__PURE__ */ jsxs25(
|
|
3423
3683
|
MotionHeadline,
|
|
3424
3684
|
{
|
|
3425
3685
|
className: "dnt__headline dnt__headline--inline-day-night",
|
|
3426
3686
|
style: { color: v2TitleColor },
|
|
3427
3687
|
"aria-label": `${inlineDayNightHeadline.prefix}${inlineDayNightHeadline.dayWord} / ${inlineDayNightHeadline.prefix}${inlineDayNightHeadline.nightWord}`,
|
|
3428
3688
|
children: [
|
|
3429
|
-
/* @__PURE__ */
|
|
3430
|
-
/* @__PURE__ */
|
|
3431
|
-
/* @__PURE__ */
|
|
3689
|
+
/* @__PURE__ */ jsx28("span", { className: "dnt__headline-prefix", children: inlineDayNightHeadline.prefix }),
|
|
3690
|
+
/* @__PURE__ */ jsxs25("span", { className: "dnt__headline-pair", children: [
|
|
3691
|
+
/* @__PURE__ */ jsx28(
|
|
3432
3692
|
motion3.span,
|
|
3433
3693
|
{
|
|
3434
3694
|
ref: dayWordRef,
|
|
@@ -3437,7 +3697,7 @@ var DayNightTransition = ({
|
|
|
3437
3697
|
children: inlineDayNightHeadline.dayWord
|
|
3438
3698
|
}
|
|
3439
3699
|
),
|
|
3440
|
-
/* @__PURE__ */
|
|
3700
|
+
/* @__PURE__ */ jsx28(
|
|
3441
3701
|
motion3.span,
|
|
3442
3702
|
{
|
|
3443
3703
|
className: "dnt__headline-wnight",
|
|
@@ -3452,8 +3712,8 @@ var DayNightTransition = ({
|
|
|
3452
3712
|
] })
|
|
3453
3713
|
]
|
|
3454
3714
|
}
|
|
3455
|
-
) : /* @__PURE__ */
|
|
3456
|
-
/* @__PURE__ */
|
|
3715
|
+
) : /* @__PURE__ */ jsxs25("div", { className: "dnt__crossfade-wrap", children: [
|
|
3716
|
+
/* @__PURE__ */ jsx28(
|
|
3457
3717
|
MotionHeadline,
|
|
3458
3718
|
{
|
|
3459
3719
|
className: "dnt__headline",
|
|
@@ -3461,7 +3721,7 @@ var DayNightTransition = ({
|
|
|
3461
3721
|
children: dayHeadline
|
|
3462
3722
|
}
|
|
3463
3723
|
),
|
|
3464
|
-
/* @__PURE__ */
|
|
3724
|
+
/* @__PURE__ */ jsx28(
|
|
3465
3725
|
MotionHeadline,
|
|
3466
3726
|
{
|
|
3467
3727
|
className: "dnt__headline",
|
|
@@ -3471,8 +3731,8 @@ var DayNightTransition = ({
|
|
|
3471
3731
|
}
|
|
3472
3732
|
)
|
|
3473
3733
|
] }),
|
|
3474
|
-
hasDescription && /* @__PURE__ */
|
|
3475
|
-
/* @__PURE__ */
|
|
3734
|
+
hasDescription && /* @__PURE__ */ jsxs25("div", { className: "dnt__crossfade-wrap", children: [
|
|
3735
|
+
/* @__PURE__ */ jsx28(
|
|
3476
3736
|
motion3.p,
|
|
3477
3737
|
{
|
|
3478
3738
|
className: "dnt__description",
|
|
@@ -3483,7 +3743,7 @@ var DayNightTransition = ({
|
|
|
3483
3743
|
children: dayDescription ?? ""
|
|
3484
3744
|
}
|
|
3485
3745
|
),
|
|
3486
|
-
/* @__PURE__ */
|
|
3746
|
+
/* @__PURE__ */ jsx28(
|
|
3487
3747
|
motion3.p,
|
|
3488
3748
|
{
|
|
3489
3749
|
className: "dnt__description",
|
|
@@ -3496,22 +3756,22 @@ var DayNightTransition = ({
|
|
|
3496
3756
|
}
|
|
3497
3757
|
)
|
|
3498
3758
|
] }),
|
|
3499
|
-
!hideCta && /* @__PURE__ */
|
|
3500
|
-
] }) : /* @__PURE__ */
|
|
3759
|
+
!hideCta && /* @__PURE__ */ jsx28("a", { href: ctaHref, className: "dnt__btn", children: ctaLabel })
|
|
3760
|
+
] }) : /* @__PURE__ */ jsxs25(
|
|
3501
3761
|
motion3.div,
|
|
3502
3762
|
{
|
|
3503
3763
|
className: "dnt__text-wrap",
|
|
3504
3764
|
style: { color: textColor },
|
|
3505
3765
|
children: [
|
|
3506
|
-
useInlineHeadline && inlineDayNightHeadline ? /* @__PURE__ */
|
|
3766
|
+
useInlineHeadline && inlineDayNightHeadline ? /* @__PURE__ */ jsxs25(
|
|
3507
3767
|
MotionHeadline,
|
|
3508
3768
|
{
|
|
3509
3769
|
className: "dnt__headline dnt__headline--inline-day-night",
|
|
3510
3770
|
"aria-label": `${inlineDayNightHeadline.prefix}${inlineDayNightHeadline.dayWord} / ${inlineDayNightHeadline.prefix}${inlineDayNightHeadline.nightWord}`,
|
|
3511
3771
|
children: [
|
|
3512
|
-
/* @__PURE__ */
|
|
3513
|
-
/* @__PURE__ */
|
|
3514
|
-
/* @__PURE__ */
|
|
3772
|
+
/* @__PURE__ */ jsx28("span", { className: "dnt__headline-prefix", children: inlineDayNightHeadline.prefix }),
|
|
3773
|
+
/* @__PURE__ */ jsxs25("span", { className: "dnt__headline-pair", children: [
|
|
3774
|
+
/* @__PURE__ */ jsx28(
|
|
3515
3775
|
motion3.span,
|
|
3516
3776
|
{
|
|
3517
3777
|
ref: dayWordRef,
|
|
@@ -3520,7 +3780,7 @@ var DayNightTransition = ({
|
|
|
3520
3780
|
children: inlineDayNightHeadline.dayWord
|
|
3521
3781
|
}
|
|
3522
3782
|
),
|
|
3523
|
-
/* @__PURE__ */
|
|
3783
|
+
/* @__PURE__ */ jsx28(
|
|
3524
3784
|
motion3.span,
|
|
3525
3785
|
{
|
|
3526
3786
|
className: "dnt__headline-wnight",
|
|
@@ -3535,8 +3795,8 @@ var DayNightTransition = ({
|
|
|
3535
3795
|
] })
|
|
3536
3796
|
]
|
|
3537
3797
|
}
|
|
3538
|
-
) : /* @__PURE__ */
|
|
3539
|
-
/* @__PURE__ */
|
|
3798
|
+
) : /* @__PURE__ */ jsxs25("div", { className: "dnt__crossfade-wrap", children: [
|
|
3799
|
+
/* @__PURE__ */ jsx28(
|
|
3540
3800
|
MotionHeadline,
|
|
3541
3801
|
{
|
|
3542
3802
|
className: "dnt__headline",
|
|
@@ -3544,7 +3804,7 @@ var DayNightTransition = ({
|
|
|
3544
3804
|
children: dayHeadline
|
|
3545
3805
|
}
|
|
3546
3806
|
),
|
|
3547
|
-
/* @__PURE__ */
|
|
3807
|
+
/* @__PURE__ */ jsx28(
|
|
3548
3808
|
MotionHeadline,
|
|
3549
3809
|
{
|
|
3550
3810
|
className: "dnt__headline",
|
|
@@ -3554,8 +3814,8 @@ var DayNightTransition = ({
|
|
|
3554
3814
|
}
|
|
3555
3815
|
)
|
|
3556
3816
|
] }),
|
|
3557
|
-
hasDescription && /* @__PURE__ */
|
|
3558
|
-
/* @__PURE__ */
|
|
3817
|
+
hasDescription && /* @__PURE__ */ jsxs25("div", { className: "dnt__crossfade-wrap", children: [
|
|
3818
|
+
/* @__PURE__ */ jsx28(
|
|
3559
3819
|
motion3.p,
|
|
3560
3820
|
{
|
|
3561
3821
|
className: "dnt__description",
|
|
@@ -3563,7 +3823,7 @@ var DayNightTransition = ({
|
|
|
3563
3823
|
children: dayDescription ?? ""
|
|
3564
3824
|
}
|
|
3565
3825
|
),
|
|
3566
|
-
/* @__PURE__ */
|
|
3826
|
+
/* @__PURE__ */ jsx28(
|
|
3567
3827
|
motion3.p,
|
|
3568
3828
|
{
|
|
3569
3829
|
className: "dnt__description",
|
|
@@ -3573,7 +3833,7 @@ var DayNightTransition = ({
|
|
|
3573
3833
|
}
|
|
3574
3834
|
)
|
|
3575
3835
|
] }),
|
|
3576
|
-
!hideCta && /* @__PURE__ */
|
|
3836
|
+
!hideCta && /* @__PURE__ */ jsx28("a", { href: ctaHref, className: "dnt__btn", children: ctaLabel })
|
|
3577
3837
|
]
|
|
3578
3838
|
}
|
|
3579
3839
|
) }) })
|
|
@@ -3606,7 +3866,7 @@ import {
|
|
|
3606
3866
|
useAnimationFrame,
|
|
3607
3867
|
useMotionValue
|
|
3608
3868
|
} from "framer-motion";
|
|
3609
|
-
import { jsx as
|
|
3869
|
+
import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3610
3870
|
function modWrap(min, max, v) {
|
|
3611
3871
|
const range = max - min;
|
|
3612
3872
|
return ((v - min) % range + range) % range + min;
|
|
@@ -3677,21 +3937,21 @@ var LogoMarquee = ({
|
|
|
3677
3937
|
});
|
|
3678
3938
|
const track1 = [...col1Logos, ...col1Logos];
|
|
3679
3939
|
const track2 = [...col2Logos, ...col2Logos];
|
|
3680
|
-
return /* @__PURE__ */
|
|
3940
|
+
return /* @__PURE__ */ jsx29(
|
|
3681
3941
|
"section",
|
|
3682
3942
|
{
|
|
3683
3943
|
className: ["lm", className].filter(Boolean).join(" "),
|
|
3684
3944
|
...props,
|
|
3685
|
-
children: /* @__PURE__ */
|
|
3686
|
-
/* @__PURE__ */
|
|
3687
|
-
/* @__PURE__ */
|
|
3688
|
-
/* @__PURE__ */
|
|
3945
|
+
children: /* @__PURE__ */ jsxs26("div", { className: "lm__inner", children: [
|
|
3946
|
+
/* @__PURE__ */ jsx29("div", { className: "lm__media", children: /* @__PURE__ */ jsxs26("div", { className: "lm__carousel", children: [
|
|
3947
|
+
/* @__PURE__ */ jsx29("div", { className: "lm__fade lm__fade--top", "aria-hidden": "true" }),
|
|
3948
|
+
/* @__PURE__ */ jsx29(
|
|
3689
3949
|
motion4.div,
|
|
3690
3950
|
{
|
|
3691
3951
|
ref: col1Ref,
|
|
3692
3952
|
className: "lm__col",
|
|
3693
3953
|
style: { y: col1Y },
|
|
3694
|
-
children: track1.map((logo, i) => /* @__PURE__ */
|
|
3954
|
+
children: track1.map((logo, i) => /* @__PURE__ */ jsx29("div", { className: "lm__card", children: /* @__PURE__ */ jsx29("div", { className: "lm__card-img-wrap", children: /* @__PURE__ */ jsx29(
|
|
3695
3955
|
"img",
|
|
3696
3956
|
{
|
|
3697
3957
|
src: logo.url,
|
|
@@ -3702,13 +3962,13 @@ var LogoMarquee = ({
|
|
|
3702
3962
|
) }) }, `c1-${i}`))
|
|
3703
3963
|
}
|
|
3704
3964
|
),
|
|
3705
|
-
/* @__PURE__ */
|
|
3965
|
+
/* @__PURE__ */ jsx29(
|
|
3706
3966
|
motion4.div,
|
|
3707
3967
|
{
|
|
3708
3968
|
ref: col2Ref,
|
|
3709
3969
|
className: "lm__col",
|
|
3710
3970
|
style: { y: col2Y },
|
|
3711
|
-
children: track2.map((logo, i) => /* @__PURE__ */
|
|
3971
|
+
children: track2.map((logo, i) => /* @__PURE__ */ jsx29("div", { className: "lm__card", children: /* @__PURE__ */ jsx29("div", { className: "lm__card-img-wrap", children: /* @__PURE__ */ jsx29(
|
|
3712
3972
|
"img",
|
|
3713
3973
|
{
|
|
3714
3974
|
src: logo.url,
|
|
@@ -3719,17 +3979,17 @@ var LogoMarquee = ({
|
|
|
3719
3979
|
) }) }, `c2-${i}`))
|
|
3720
3980
|
}
|
|
3721
3981
|
),
|
|
3722
|
-
/* @__PURE__ */
|
|
3982
|
+
/* @__PURE__ */ jsx29("div", { className: "lm__fade lm__fade--bottom", "aria-hidden": "true" })
|
|
3723
3983
|
] }) }),
|
|
3724
|
-
/* @__PURE__ */
|
|
3725
|
-
/* @__PURE__ */
|
|
3726
|
-
/* @__PURE__ */
|
|
3727
|
-
/* @__PURE__ */
|
|
3728
|
-
/* @__PURE__ */
|
|
3984
|
+
/* @__PURE__ */ jsxs26("div", { className: "lm__content", children: [
|
|
3985
|
+
/* @__PURE__ */ jsx29("h2", { className: "lm__headline", children: headline }),
|
|
3986
|
+
/* @__PURE__ */ jsxs26("div", { className: "lm__text-group", children: [
|
|
3987
|
+
/* @__PURE__ */ jsx29("p", { className: "lm__body", children: body }),
|
|
3988
|
+
/* @__PURE__ */ jsx29("p", { className: "lm__disclaimer", children: disclaimer })
|
|
3729
3989
|
] }),
|
|
3730
|
-
/* @__PURE__ */
|
|
3990
|
+
/* @__PURE__ */ jsxs26("a", { href: ctaHref, className: "lm__link", children: [
|
|
3731
3991
|
ctaLabel,
|
|
3732
|
-
/* @__PURE__ */
|
|
3992
|
+
/* @__PURE__ */ jsx29("span", { className: "lm__link-icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx29("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx29("path", { d: "M3 8H13M13 8L9 4M13 8L9 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) })
|
|
3733
3993
|
] })
|
|
3734
3994
|
] })
|
|
3735
3995
|
] })
|
|
@@ -3780,7 +4040,7 @@ var appstore_linux_dark_default = "./appstore-linux-dark-RVH7CBM4.svg";
|
|
|
3780
4040
|
var appstore_browser_dark_default = "./appstore-browser-dark-2E6TK6JH.svg";
|
|
3781
4041
|
|
|
3782
4042
|
// primitives/DownloadBadge/DownloadBadge.tsx
|
|
3783
|
-
import { jsx as
|
|
4043
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
3784
4044
|
var BADGE_ASSETS = {
|
|
3785
4045
|
light: {
|
|
3786
4046
|
googleplay: { src: appstore_googleplay_light_default, alt: "Get it on Google Play" },
|
|
@@ -3809,7 +4069,7 @@ var DownloadBadge = ({
|
|
|
3809
4069
|
...props
|
|
3810
4070
|
}) => {
|
|
3811
4071
|
const { src, alt } = BADGE_ASSETS[colorScheme][platform];
|
|
3812
|
-
return /* @__PURE__ */
|
|
4072
|
+
return /* @__PURE__ */ jsx30(
|
|
3813
4073
|
"a",
|
|
3814
4074
|
{
|
|
3815
4075
|
className: [
|
|
@@ -3822,13 +4082,13 @@ var DownloadBadge = ({
|
|
|
3822
4082
|
target: "_blank",
|
|
3823
4083
|
rel: "noopener noreferrer",
|
|
3824
4084
|
...props,
|
|
3825
|
-
children: /* @__PURE__ */
|
|
4085
|
+
children: /* @__PURE__ */ jsx30("img", { className: "download-badge__img", src, alt })
|
|
3826
4086
|
}
|
|
3827
4087
|
);
|
|
3828
4088
|
};
|
|
3829
4089
|
|
|
3830
4090
|
// templates/Steps/Steps.tsx
|
|
3831
|
-
import { jsx as
|
|
4091
|
+
import { jsx as jsx31, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3832
4092
|
var Steps = ({
|
|
3833
4093
|
title,
|
|
3834
4094
|
steps,
|
|
@@ -3840,8 +4100,8 @@ var Steps = ({
|
|
|
3840
4100
|
"steps__container",
|
|
3841
4101
|
imagePosition === "right" ? "steps__container--image-right" : ""
|
|
3842
4102
|
].filter(Boolean).join(" ");
|
|
3843
|
-
return /* @__PURE__ */
|
|
3844
|
-
image && /* @__PURE__ */
|
|
4103
|
+
return /* @__PURE__ */ jsx31("section", { className: "steps", children: /* @__PURE__ */ jsxs27("div", { className: containerClass, children: [
|
|
4104
|
+
image && /* @__PURE__ */ jsx31("div", { className: "steps__image-wrapper", children: /* @__PURE__ */ jsx31(
|
|
3845
4105
|
"img",
|
|
3846
4106
|
{
|
|
3847
4107
|
src: image,
|
|
@@ -3849,13 +4109,13 @@ var Steps = ({
|
|
|
3849
4109
|
className: "steps__image"
|
|
3850
4110
|
}
|
|
3851
4111
|
) }),
|
|
3852
|
-
/* @__PURE__ */
|
|
3853
|
-
/* @__PURE__ */
|
|
3854
|
-
/* @__PURE__ */
|
|
3855
|
-
/* @__PURE__ */
|
|
3856
|
-
/* @__PURE__ */
|
|
3857
|
-
/* @__PURE__ */
|
|
3858
|
-
/* @__PURE__ */
|
|
4112
|
+
/* @__PURE__ */ jsxs27("div", { className: "steps__content", children: [
|
|
4113
|
+
/* @__PURE__ */ jsx31("h2", { className: "steps__title", children: title }),
|
|
4114
|
+
/* @__PURE__ */ jsx31("ol", { className: "steps__list", children: steps.map((step, index) => /* @__PURE__ */ jsx31("li", { className: "steps__item", children: /* @__PURE__ */ jsxs27("div", { className: "steps__item-inner", children: [
|
|
4115
|
+
/* @__PURE__ */ jsx31("span", { className: "steps__number", "aria-hidden": "true", children: index + 1 }),
|
|
4116
|
+
/* @__PURE__ */ jsxs27("div", { className: "steps__item-body", children: [
|
|
4117
|
+
/* @__PURE__ */ jsx31("h3", { className: "steps__item-title", children: step.title }),
|
|
4118
|
+
/* @__PURE__ */ jsx31("p", { className: "steps__item-description", children: step.description })
|
|
3859
4119
|
] })
|
|
3860
4120
|
] }) }, index)) })
|
|
3861
4121
|
] })
|
|
@@ -3863,7 +4123,7 @@ var Steps = ({
|
|
|
3863
4123
|
};
|
|
3864
4124
|
|
|
3865
4125
|
// templates/DownloadBanner/DownloadBanner.tsx
|
|
3866
|
-
import { jsx as
|
|
4126
|
+
import { jsx as jsx32, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3867
4127
|
var DownloadBanner = ({
|
|
3868
4128
|
style = "light-2",
|
|
3869
4129
|
qrCodeImage,
|
|
@@ -3888,9 +4148,9 @@ var DownloadBanner = ({
|
|
|
3888
4148
|
disclaimer
|
|
3889
4149
|
}) => {
|
|
3890
4150
|
const colorScheme = style === "dark" ? "dark" : "light";
|
|
3891
|
-
return /* @__PURE__ */
|
|
3892
|
-
/* @__PURE__ */
|
|
3893
|
-
qrCodeImage && /* @__PURE__ */
|
|
4151
|
+
return /* @__PURE__ */ jsx32("section", { className: `db-section db-section--${style}`, children: /* @__PURE__ */ jsx32("div", { className: "db-container", children: /* @__PURE__ */ jsxs28("div", { className: "db-card", children: [
|
|
4152
|
+
/* @__PURE__ */ jsxs28("div", { className: "db-qr-block", children: [
|
|
4153
|
+
qrCodeImage && /* @__PURE__ */ jsx32(
|
|
3894
4154
|
"img",
|
|
3895
4155
|
{
|
|
3896
4156
|
className: "db-qr-image",
|
|
@@ -3898,21 +4158,21 @@ var DownloadBanner = ({
|
|
|
3898
4158
|
alt: qrCodeAlt
|
|
3899
4159
|
}
|
|
3900
4160
|
),
|
|
3901
|
-
/* @__PURE__ */
|
|
3902
|
-
/* @__PURE__ */
|
|
3903
|
-
/* @__PURE__ */
|
|
3904
|
-
/* @__PURE__ */
|
|
3905
|
-
disclaimer && /* @__PURE__ */
|
|
4161
|
+
/* @__PURE__ */ jsxs28("div", { className: "db-qr-text", children: [
|
|
4162
|
+
/* @__PURE__ */ jsx32("span", { className: "db-qr-text__title db-qr-text__title--desktop", children: qrTitle }),
|
|
4163
|
+
/* @__PURE__ */ jsx32("h2", { className: "db-qr-text__subtitle db-qr-text__subtitle--desktop", children: qrSubtitle }),
|
|
4164
|
+
/* @__PURE__ */ jsx32("span", { className: "db-qr-text__title db-qr-text__title--mobile", children: mobileTitle }),
|
|
4165
|
+
disclaimer && /* @__PURE__ */ jsx32("span", { className: "db-disclaimer", children: disclaimer })
|
|
3906
4166
|
] })
|
|
3907
4167
|
] }),
|
|
3908
|
-
/* @__PURE__ */
|
|
3909
|
-
showGooglePlay && /* @__PURE__ */
|
|
3910
|
-
showAppGallery && /* @__PURE__ */
|
|
3911
|
-
showMacOS && /* @__PURE__ */
|
|
3912
|
-
showWindows && /* @__PURE__ */
|
|
3913
|
-
showLinux && /* @__PURE__ */
|
|
3914
|
-
showAppStore && /* @__PURE__ */
|
|
3915
|
-
showWeb && /* @__PURE__ */
|
|
4168
|
+
/* @__PURE__ */ jsxs28("div", { className: "db-badges", children: [
|
|
4169
|
+
showGooglePlay && /* @__PURE__ */ jsx32(DownloadBadge, { platform: "googleplay", colorScheme, href: googlePlayHref }),
|
|
4170
|
+
showAppGallery && /* @__PURE__ */ jsx32(DownloadBadge, { platform: "appgallery", colorScheme, href: appGalleryHref }),
|
|
4171
|
+
showMacOS && /* @__PURE__ */ jsx32(DownloadBadge, { platform: "macos", colorScheme, href: macOSHref }),
|
|
4172
|
+
showWindows && /* @__PURE__ */ jsx32(DownloadBadge, { platform: "windows", colorScheme, href: windowsHref }),
|
|
4173
|
+
showLinux && /* @__PURE__ */ jsx32(DownloadBadge, { platform: "linux", colorScheme, href: linuxHref }),
|
|
4174
|
+
showAppStore && /* @__PURE__ */ jsx32(DownloadBadge, { platform: "appstore", colorScheme, href: appStoreHref }),
|
|
4175
|
+
showWeb && /* @__PURE__ */ jsx32(DownloadBadge, { platform: "web", colorScheme, href: webHref })
|
|
3916
4176
|
] })
|
|
3917
4177
|
] }) }) });
|
|
3918
4178
|
};
|
|
@@ -3921,7 +4181,7 @@ var DownloadBanner = ({
|
|
|
3921
4181
|
import { useEffect as useEffect9, useRef as useRef12 } from "react";
|
|
3922
4182
|
import { gsap } from "gsap";
|
|
3923
4183
|
import { ScrollTrigger } from "gsap/ScrollTrigger";
|
|
3924
|
-
import { jsx as
|
|
4184
|
+
import { jsx as jsx33, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3925
4185
|
gsap.registerPlugin(ScrollTrigger);
|
|
3926
4186
|
var TextScroll = ({ text, className }) => {
|
|
3927
4187
|
const sectionRef = useRef12(null);
|
|
@@ -3961,12 +4221,12 @@ var TextScroll = ({ text, className }) => {
|
|
|
3961
4221
|
gsap.set(wordEls, { clearProps: "opacity" });
|
|
3962
4222
|
};
|
|
3963
4223
|
}, [text]);
|
|
3964
|
-
return /* @__PURE__ */
|
|
4224
|
+
return /* @__PURE__ */ jsx33(
|
|
3965
4225
|
"section",
|
|
3966
4226
|
{
|
|
3967
4227
|
ref: sectionRef,
|
|
3968
4228
|
className: ["ts", className].filter(Boolean).join(" "),
|
|
3969
|
-
children: /* @__PURE__ */
|
|
4229
|
+
children: /* @__PURE__ */ jsx33("div", { className: "ts__inner", children: /* @__PURE__ */ jsx33("p", { className: "ts__text", "aria-label": text, children: words.map((word, i) => /* @__PURE__ */ jsxs29(
|
|
3970
4230
|
"span",
|
|
3971
4231
|
{
|
|
3972
4232
|
ref: (el) => {
|
|
@@ -3984,6 +4244,446 @@ var TextScroll = ({ text, className }) => {
|
|
|
3984
4244
|
}
|
|
3985
4245
|
);
|
|
3986
4246
|
};
|
|
4247
|
+
|
|
4248
|
+
// templates/StickyMarketCards/StickyMarketCards.tsx
|
|
4249
|
+
import { useEffect as useEffect10, useRef as useRef13 } from "react";
|
|
4250
|
+
import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
4251
|
+
var PLACEHOLDER_IMAGE3 = "https://cdn.prod.website-files.com/68da5c86c91c54f39c86c28a/69b9309379ac08e59ca8210a_1f3f555da9a5cbb13a6fe1bf0d5fe1b6_placeholder-image.webp";
|
|
4252
|
+
var StickyMarketCards = ({
|
|
4253
|
+
sectionTitle,
|
|
4254
|
+
sectionDescription,
|
|
4255
|
+
items,
|
|
4256
|
+
className,
|
|
4257
|
+
...props
|
|
4258
|
+
}) => {
|
|
4259
|
+
const cardRefs = useRef13([]);
|
|
4260
|
+
const cardInnerRefs = useRef13([]);
|
|
4261
|
+
useEffect10(() => {
|
|
4262
|
+
if (typeof window === "undefined") return;
|
|
4263
|
+
let rafId = 0;
|
|
4264
|
+
const update = () => {
|
|
4265
|
+
const wrappers = cardRefs.current.filter(Boolean);
|
|
4266
|
+
const inners = cardInnerRefs.current.filter(Boolean);
|
|
4267
|
+
const n2 = wrappers.length;
|
|
4268
|
+
wrappers.forEach((wrapper, i) => {
|
|
4269
|
+
const inner = inners[i];
|
|
4270
|
+
if (!inner) return;
|
|
4271
|
+
if (i === n2 - 1) {
|
|
4272
|
+
inner.style.transform = "scale(1)";
|
|
4273
|
+
inner.style.filter = "brightness(1)";
|
|
4274
|
+
return;
|
|
4275
|
+
}
|
|
4276
|
+
const nextWrapper = wrappers[i + 1];
|
|
4277
|
+
if (!nextWrapper) return;
|
|
4278
|
+
const currentRect = wrapper.getBoundingClientRect();
|
|
4279
|
+
const nextRect = nextWrapper.getBoundingClientRect();
|
|
4280
|
+
const overlap = currentRect.bottom - nextRect.top;
|
|
4281
|
+
if (overlap > 0) {
|
|
4282
|
+
const progress = Math.min(overlap / currentRect.height, 1);
|
|
4283
|
+
inner.style.transform = `scale(${(1 - progress * 0.05).toFixed(4)})`;
|
|
4284
|
+
inner.style.filter = `brightness(${(1 - progress * 0.4).toFixed(4)})`;
|
|
4285
|
+
} else {
|
|
4286
|
+
inner.style.transform = "scale(1)";
|
|
4287
|
+
inner.style.filter = "brightness(1)";
|
|
4288
|
+
}
|
|
4289
|
+
});
|
|
4290
|
+
};
|
|
4291
|
+
const onScroll = () => {
|
|
4292
|
+
cancelAnimationFrame(rafId);
|
|
4293
|
+
rafId = requestAnimationFrame(update);
|
|
4294
|
+
};
|
|
4295
|
+
window.addEventListener("scroll", onScroll, { passive: true });
|
|
4296
|
+
update();
|
|
4297
|
+
return () => {
|
|
4298
|
+
window.removeEventListener("scroll", onScroll);
|
|
4299
|
+
cancelAnimationFrame(rafId);
|
|
4300
|
+
};
|
|
4301
|
+
}, [items.length]);
|
|
4302
|
+
useEffect10(() => {
|
|
4303
|
+
if (typeof window === "undefined") return;
|
|
4304
|
+
const syncHeights = () => {
|
|
4305
|
+
const inners = cardInnerRefs.current.filter(Boolean);
|
|
4306
|
+
if (!inners.length) return;
|
|
4307
|
+
inners.forEach((inner) => {
|
|
4308
|
+
inner.style.minHeight = "";
|
|
4309
|
+
});
|
|
4310
|
+
let maxH = 0;
|
|
4311
|
+
inners.forEach((inner) => {
|
|
4312
|
+
const h = inner.getBoundingClientRect().height;
|
|
4313
|
+
if (h > maxH) maxH = h;
|
|
4314
|
+
});
|
|
4315
|
+
inners.forEach((inner) => {
|
|
4316
|
+
inner.style.minHeight = `${maxH}px`;
|
|
4317
|
+
});
|
|
4318
|
+
};
|
|
4319
|
+
syncHeights();
|
|
4320
|
+
window.addEventListener("resize", syncHeights);
|
|
4321
|
+
if (document.fonts && document.fonts.ready) {
|
|
4322
|
+
document.fonts.ready.then(syncHeights);
|
|
4323
|
+
}
|
|
4324
|
+
return () => {
|
|
4325
|
+
window.removeEventListener("resize", syncHeights);
|
|
4326
|
+
};
|
|
4327
|
+
}, [items.length]);
|
|
4328
|
+
const n = items.length;
|
|
4329
|
+
const maxStack = 4;
|
|
4330
|
+
const baseIndex = Math.max(0, n - maxStack);
|
|
4331
|
+
return /* @__PURE__ */ jsx34(
|
|
4332
|
+
"section",
|
|
4333
|
+
{
|
|
4334
|
+
className: ["smc", className].filter(Boolean).join(" "),
|
|
4335
|
+
...props,
|
|
4336
|
+
children: /* @__PURE__ */ jsxs30("div", { className: "smc__inner", children: [
|
|
4337
|
+
/* @__PURE__ */ jsxs30("div", { className: "smc__header-wrap", children: [
|
|
4338
|
+
/* @__PURE__ */ jsx34("h2", { className: "smc__header", children: sectionTitle }),
|
|
4339
|
+
sectionDescription && /* @__PURE__ */ jsx34("p", { className: "smc__description", children: sectionDescription })
|
|
4340
|
+
] }),
|
|
4341
|
+
/* @__PURE__ */ jsx34("div", { className: "smc__track", children: items.map((item, i) => {
|
|
4342
|
+
const theme = item.theme ?? "dark";
|
|
4343
|
+
const offsetMultiplier = Math.max(0, i - baseIndex);
|
|
4344
|
+
return /* @__PURE__ */ jsx34(
|
|
4345
|
+
"div",
|
|
4346
|
+
{
|
|
4347
|
+
ref: (el) => {
|
|
4348
|
+
cardRefs.current[i] = el;
|
|
4349
|
+
},
|
|
4350
|
+
className: "smc__card",
|
|
4351
|
+
style: {
|
|
4352
|
+
["--smc-card-index"]: String(offsetMultiplier),
|
|
4353
|
+
zIndex: i + 1
|
|
4354
|
+
},
|
|
4355
|
+
children: /* @__PURE__ */ jsxs30(
|
|
4356
|
+
"div",
|
|
4357
|
+
{
|
|
4358
|
+
ref: (el) => {
|
|
4359
|
+
cardInnerRefs.current[i] = el;
|
|
4360
|
+
},
|
|
4361
|
+
className: [
|
|
4362
|
+
"smc__card-inner",
|
|
4363
|
+
`smc__card-inner--${theme}`
|
|
4364
|
+
].join(" "),
|
|
4365
|
+
children: [
|
|
4366
|
+
/* @__PURE__ */ jsxs30("div", { className: "smc__card-bg", children: [
|
|
4367
|
+
/* @__PURE__ */ jsx34(
|
|
4368
|
+
"img",
|
|
4369
|
+
{
|
|
4370
|
+
src: item.imageUrl ?? PLACEHOLDER_IMAGE3,
|
|
4371
|
+
alt: "",
|
|
4372
|
+
"aria-hidden": "true",
|
|
4373
|
+
loading: i === 0 ? "eager" : "lazy"
|
|
4374
|
+
}
|
|
4375
|
+
),
|
|
4376
|
+
/* @__PURE__ */ jsx34(
|
|
4377
|
+
"div",
|
|
4378
|
+
{
|
|
4379
|
+
className: [
|
|
4380
|
+
"smc__card-overlay",
|
|
4381
|
+
`smc__card-overlay--${theme}`
|
|
4382
|
+
].join(" ")
|
|
4383
|
+
}
|
|
4384
|
+
)
|
|
4385
|
+
] }),
|
|
4386
|
+
/* @__PURE__ */ jsxs30("div", { className: "smc__card-content", children: [
|
|
4387
|
+
/* @__PURE__ */ jsx34("div", { className: "smc__card-title-wrap", children: /* @__PURE__ */ jsx34("h3", { className: "smc__card-title", children: item.title }) }),
|
|
4388
|
+
/* @__PURE__ */ jsx34("div", { className: "smc__card-desc-wrap", children: /* @__PURE__ */ jsx34("p", { className: "smc__card-desc", children: item.description }) })
|
|
4389
|
+
] })
|
|
4390
|
+
]
|
|
4391
|
+
}
|
|
4392
|
+
)
|
|
4393
|
+
},
|
|
4394
|
+
i
|
|
4395
|
+
);
|
|
4396
|
+
}) })
|
|
4397
|
+
] })
|
|
4398
|
+
}
|
|
4399
|
+
);
|
|
4400
|
+
};
|
|
4401
|
+
|
|
4402
|
+
// templates/Table/Table.tsx
|
|
4403
|
+
import { useState as useState11, useMemo } from "react";
|
|
4404
|
+
import { Fragment as Fragment4, jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
4405
|
+
var InfoIcon = ({ className }) => /* @__PURE__ */ jsxs31("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", className, children: [
|
|
4406
|
+
/* @__PURE__ */ jsx35("circle", { cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "1.5" }),
|
|
4407
|
+
/* @__PURE__ */ jsx35("path", { d: "M12 16V12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
|
|
4408
|
+
/* @__PURE__ */ jsx35("circle", { cx: "12", cy: "8", r: "1", fill: "currentColor", stroke: "currentColor", strokeWidth: "1" })
|
|
4409
|
+
] });
|
|
4410
|
+
var Table = ({
|
|
4411
|
+
sectionTitle,
|
|
4412
|
+
columns,
|
|
4413
|
+
rows,
|
|
4414
|
+
mainColumnKey,
|
|
4415
|
+
pageSize = 10,
|
|
4416
|
+
searchPlaceholder = "Search",
|
|
4417
|
+
infoText,
|
|
4418
|
+
className,
|
|
4419
|
+
...props
|
|
4420
|
+
}) => {
|
|
4421
|
+
const [search, setSearch] = useState11("");
|
|
4422
|
+
const [page, setPage] = useState11(1);
|
|
4423
|
+
const [tooltip, setTooltip] = useState11({ visible: false, heading: "", description: "", x: 0, y: 0, arrowOffset: 0 });
|
|
4424
|
+
const mainKey = mainColumnKey ?? columns.find((c) => c.width === "main")?.key ?? columns[0]?.key;
|
|
4425
|
+
const filtered = useMemo(() => {
|
|
4426
|
+
const q = search.trim().toLowerCase();
|
|
4427
|
+
if (!q) return rows;
|
|
4428
|
+
return rows.filter(
|
|
4429
|
+
(row) => Object.values(row).some((v) => v.toLowerCase().includes(q))
|
|
4430
|
+
);
|
|
4431
|
+
}, [rows, search]);
|
|
4432
|
+
const totalPages = Math.max(1, Math.ceil(filtered.length / pageSize));
|
|
4433
|
+
const currentPage = Math.min(page, totalPages);
|
|
4434
|
+
const startIdx = (currentPage - 1) * pageSize;
|
|
4435
|
+
const endIdx = Math.min(startIdx + pageSize, filtered.length);
|
|
4436
|
+
const visible = filtered.slice(startIdx, endIdx);
|
|
4437
|
+
const handleSearch = (e) => {
|
|
4438
|
+
setSearch(e.target.value);
|
|
4439
|
+
setPage(1);
|
|
4440
|
+
};
|
|
4441
|
+
const handleClear = () => {
|
|
4442
|
+
setSearch("");
|
|
4443
|
+
setPage(1);
|
|
4444
|
+
};
|
|
4445
|
+
return /* @__PURE__ */ jsxs31("section", { className: ["tbl-section", className].filter(Boolean).join(" "), ...props, children: [
|
|
4446
|
+
sectionTitle && /* @__PURE__ */ jsx35("div", { className: "tbl-section__header", children: /* @__PURE__ */ jsx35("h2", { className: "tbl-section__title", children: sectionTitle }) }),
|
|
4447
|
+
/* @__PURE__ */ jsxs31("div", { className: "tbl-section__content", children: [
|
|
4448
|
+
/* @__PURE__ */ jsxs31("div", { className: "tbl", children: [
|
|
4449
|
+
/* @__PURE__ */ jsxs31("div", { className: "tbl__topbar", children: [
|
|
4450
|
+
/* @__PURE__ */ jsx35("div", { className: "tbl__search-wrap", children: /* @__PURE__ */ jsx35(
|
|
4451
|
+
SearchField,
|
|
4452
|
+
{
|
|
4453
|
+
placeholder: searchPlaceholder,
|
|
4454
|
+
value: search,
|
|
4455
|
+
onChange: handleSearch,
|
|
4456
|
+
onClear: handleClear,
|
|
4457
|
+
variant: "fill",
|
|
4458
|
+
"aria-label": searchPlaceholder
|
|
4459
|
+
}
|
|
4460
|
+
) }),
|
|
4461
|
+
/* @__PURE__ */ jsx35("div", { className: "tbl__summary", children: filtered.length > 0 ? /* @__PURE__ */ jsxs31(Fragment4, { children: [
|
|
4462
|
+
"Showing ",
|
|
4463
|
+
startIdx + 1,
|
|
4464
|
+
"- ",
|
|
4465
|
+
endIdx,
|
|
4466
|
+
" of ",
|
|
4467
|
+
filtered.length
|
|
4468
|
+
] }) : "No results" })
|
|
4469
|
+
] }),
|
|
4470
|
+
/* @__PURE__ */ jsx35("div", { className: "tbl__scroll-wrapper", children: /* @__PURE__ */ jsxs31("table", { className: "tbl__table", children: [
|
|
4471
|
+
/* @__PURE__ */ jsx35("thead", { children: /* @__PURE__ */ jsx35("tr", { className: "tbl__tr", children: columns.map((col, colIdx) => {
|
|
4472
|
+
const isFirst = colIdx === 0;
|
|
4473
|
+
const isLast = colIdx === columns.length - 1;
|
|
4474
|
+
const isMain = col.width === "main" || col.key === mainKey;
|
|
4475
|
+
return /* @__PURE__ */ jsx35(
|
|
4476
|
+
"th",
|
|
4477
|
+
{
|
|
4478
|
+
className: [
|
|
4479
|
+
"tbl__th",
|
|
4480
|
+
isMain ? "tbl__th--main" : "",
|
|
4481
|
+
col.width === "big" ? "tbl__th--big" : ""
|
|
4482
|
+
].filter(Boolean).join(" "),
|
|
4483
|
+
children: /* @__PURE__ */ jsx35(
|
|
4484
|
+
"div",
|
|
4485
|
+
{
|
|
4486
|
+
className: "tbl__th-inner",
|
|
4487
|
+
onMouseEnter: (e) => {
|
|
4488
|
+
if (!col.tooltip) return;
|
|
4489
|
+
const rect = e.currentTarget.getBoundingClientRect();
|
|
4490
|
+
const targetX = rect.left + rect.width / 2;
|
|
4491
|
+
const targetY = rect.top;
|
|
4492
|
+
const tooltipHalfWidth = 104;
|
|
4493
|
+
const margin = 16;
|
|
4494
|
+
const clampedX = Math.max(
|
|
4495
|
+
margin + tooltipHalfWidth,
|
|
4496
|
+
Math.min(window.innerWidth - margin - tooltipHalfWidth, targetX)
|
|
4497
|
+
);
|
|
4498
|
+
const arrowOffset = targetX - clampedX;
|
|
4499
|
+
setTooltip({
|
|
4500
|
+
visible: true,
|
|
4501
|
+
heading: col.tooltip.heading,
|
|
4502
|
+
description: col.tooltip.description,
|
|
4503
|
+
x: clampedX,
|
|
4504
|
+
y: targetY,
|
|
4505
|
+
arrowOffset
|
|
4506
|
+
});
|
|
4507
|
+
},
|
|
4508
|
+
onMouseLeave: () => {
|
|
4509
|
+
if (col.tooltip) {
|
|
4510
|
+
setTooltip((prev) => ({ ...prev, visible: false }));
|
|
4511
|
+
}
|
|
4512
|
+
},
|
|
4513
|
+
children: /* @__PURE__ */ jsx35("span", { className: ["tbl__col-label", col.tooltip ? "tbl__col-label--dashed" : ""].filter(Boolean).join(" "), children: Array.isArray(col.header) ? col.header.map((line, li) => /* @__PURE__ */ jsxs31("span", { children: [
|
|
4514
|
+
line,
|
|
4515
|
+
li < col.header.length - 1 && /* @__PURE__ */ jsx35("br", {})
|
|
4516
|
+
] }, li)) : col.header })
|
|
4517
|
+
}
|
|
4518
|
+
)
|
|
4519
|
+
},
|
|
4520
|
+
col.key
|
|
4521
|
+
);
|
|
4522
|
+
}) }) }),
|
|
4523
|
+
/* @__PURE__ */ jsx35("tbody", { className: "tbl__tbody", children: visible.length > 0 ? visible.map((row, rowIdx) => /* @__PURE__ */ jsx35("tr", { className: "tbl__tr", children: columns.map((col) => {
|
|
4524
|
+
const isMain = col.width === "main" || col.key === mainKey;
|
|
4525
|
+
const iconUrl = row[`${col.key}_iconUrl`];
|
|
4526
|
+
return /* @__PURE__ */ jsx35(
|
|
4527
|
+
"td",
|
|
4528
|
+
{
|
|
4529
|
+
className: [
|
|
4530
|
+
"tbl__td",
|
|
4531
|
+
isMain ? "tbl__td--main" : "",
|
|
4532
|
+
col.width === "big" ? "tbl__td--big" : ""
|
|
4533
|
+
].filter(Boolean).join(" "),
|
|
4534
|
+
children: isMain ? /* @__PURE__ */ jsxs31("div", { className: "tbl__cell-inner", children: [
|
|
4535
|
+
iconUrl && /* @__PURE__ */ jsx35(
|
|
4536
|
+
"img",
|
|
4537
|
+
{
|
|
4538
|
+
src: iconUrl,
|
|
4539
|
+
alt: "",
|
|
4540
|
+
"aria-hidden": "true",
|
|
4541
|
+
className: "tbl__cell-icon",
|
|
4542
|
+
loading: "lazy",
|
|
4543
|
+
width: "24",
|
|
4544
|
+
height: "24"
|
|
4545
|
+
}
|
|
4546
|
+
),
|
|
4547
|
+
/* @__PURE__ */ jsx35("span", { className: "tbl__cell-text tbl__cell-text--bold", children: row[col.key] ?? "" })
|
|
4548
|
+
] }) : /* @__PURE__ */ jsx35("span", { className: "tbl__cell-text", children: row[col.key] ?? "" })
|
|
4549
|
+
},
|
|
4550
|
+
col.key
|
|
4551
|
+
);
|
|
4552
|
+
}) }, rowIdx)) : /* @__PURE__ */ jsx35("tr", { className: "tbl__tr", children: /* @__PURE__ */ jsxs31("td", { colSpan: columns.length, className: "tbl__empty-cell", children: [
|
|
4553
|
+
'No results found for "',
|
|
4554
|
+
search,
|
|
4555
|
+
'"'
|
|
4556
|
+
] }) }) })
|
|
4557
|
+
] }) }),
|
|
4558
|
+
totalPages > 1 && /* @__PURE__ */ jsx35("div", { className: "tbl__footer", children: /* @__PURE__ */ jsx35("div", { className: "tbl__pagination-wrap", children: /* @__PURE__ */ jsx35(
|
|
4559
|
+
Pagination,
|
|
4560
|
+
{
|
|
4561
|
+
currentPage,
|
|
4562
|
+
totalPages,
|
|
4563
|
+
onPageChange: setPage
|
|
4564
|
+
}
|
|
4565
|
+
) }) })
|
|
4566
|
+
] }),
|
|
4567
|
+
infoText && /* @__PURE__ */ jsxs31("div", { className: "tbl-section__info-box", children: [
|
|
4568
|
+
/* @__PURE__ */ jsx35(InfoIcon, { className: "tbl-section__info-icon" }),
|
|
4569
|
+
/* @__PURE__ */ jsx35("p", { className: "tbl-section__info-text", children: infoText })
|
|
4570
|
+
] })
|
|
4571
|
+
] }),
|
|
4572
|
+
/* @__PURE__ */ jsxs31(
|
|
4573
|
+
"div",
|
|
4574
|
+
{
|
|
4575
|
+
className: ["tbl__global-hint", tooltip.visible ? "tbl__global-hint--visible" : ""].filter(Boolean).join(" "),
|
|
4576
|
+
style: { left: tooltip.x, top: tooltip.y - 8 },
|
|
4577
|
+
children: [
|
|
4578
|
+
/* @__PURE__ */ jsx35("div", { className: "tbl__global-hint-desc", children: tooltip.description }),
|
|
4579
|
+
/* @__PURE__ */ jsx35(
|
|
4580
|
+
"div",
|
|
4581
|
+
{
|
|
4582
|
+
className: "tbl__global-hint-arrow",
|
|
4583
|
+
style: { transform: `translateX(calc(-50% + ${tooltip.arrowOffset}px))` }
|
|
4584
|
+
}
|
|
4585
|
+
)
|
|
4586
|
+
]
|
|
4587
|
+
}
|
|
4588
|
+
)
|
|
4589
|
+
] });
|
|
4590
|
+
};
|
|
4591
|
+
|
|
4592
|
+
// templates/Leaders/Leaders.tsx
|
|
4593
|
+
import { useState as useState12 } from "react";
|
|
4594
|
+
|
|
4595
|
+
// templates/Leaders/Leaders.module.css
|
|
4596
|
+
var Leaders_default = {};
|
|
4597
|
+
|
|
4598
|
+
// templates/Leaders/Leaders.tsx
|
|
4599
|
+
import { Fragment as Fragment5, jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
4600
|
+
var LinkedInIcon = () => /* @__PURE__ */ jsx36("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ jsx36("path", { d: "M14.816 0H1.18C0.528 0 0 0.516 0 1.153V14.846C0 15.484 0.528 16 1.18 16H14.816C15.468 16 16 15.484 16 14.846V1.153C16 0.516 15.468 0 14.816 0ZM4.744 13.642H2.368V5.996H4.744V13.642ZM3.556 4.952C2.796 4.952 2.18 4.336 2.18 3.576C2.18 2.816 2.796 2.2 3.556 2.2C4.316 2.2 4.932 2.816 4.932 3.576C4.932 4.336 4.316 4.952 3.556 4.952ZM13.642 13.642H11.266V9.924C11.266 9.038 11.25 7.896 10.032 7.896C8.814 7.896 8.626 8.846 8.626 9.86V13.642H6.25V5.996H8.53V7.04H8.562C8.88 6.44 9.534 5.806 10.686 5.806C12.958 5.806 13.642 7.3 13.642 9.386V13.642Z", fill: "currentColor" }) });
|
|
4601
|
+
var ChevronDownIcon4 = () => /* @__PURE__ */ jsx36("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ jsx36("path", { d: "M4 6L8 10L12 6", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
4602
|
+
var ChevronUpIcon = () => /* @__PURE__ */ jsx36("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ jsx36("path", { d: "M12 10L8 6L4 10", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
4603
|
+
var CardContent = ({ item }) => /* @__PURE__ */ jsxs32(Fragment5, { children: [
|
|
4604
|
+
/* @__PURE__ */ jsx36("div", { className: Leaders_default.imageWrapper, children: /* @__PURE__ */ jsx36(
|
|
4605
|
+
"img",
|
|
4606
|
+
{
|
|
4607
|
+
src: item.imageUrl,
|
|
4608
|
+
alt: item.name,
|
|
4609
|
+
className: Leaders_default.image,
|
|
4610
|
+
loading: "lazy"
|
|
4611
|
+
}
|
|
4612
|
+
) }),
|
|
4613
|
+
/* @__PURE__ */ jsxs32("div", { className: Leaders_default.content, children: [
|
|
4614
|
+
/* @__PURE__ */ jsx36("h3", { className: Leaders_default.name, children: item.name }),
|
|
4615
|
+
/* @__PURE__ */ jsx36("p", { className: Leaders_default.role, children: item.role })
|
|
4616
|
+
] }),
|
|
4617
|
+
item.linkedinUrl && /* @__PURE__ */ jsx36(
|
|
4618
|
+
Link,
|
|
4619
|
+
{
|
|
4620
|
+
href: item.linkedinUrl,
|
|
4621
|
+
target: "_blank",
|
|
4622
|
+
rel: "noopener noreferrer",
|
|
4623
|
+
icon: /* @__PURE__ */ jsx36(LinkedInIcon, {}),
|
|
4624
|
+
label: "LinkedIn",
|
|
4625
|
+
colorScheme: "black",
|
|
4626
|
+
showChevron: false,
|
|
4627
|
+
className: Leaders_default.link
|
|
4628
|
+
}
|
|
4629
|
+
)
|
|
4630
|
+
] });
|
|
4631
|
+
var Leaders = ({
|
|
4632
|
+
title = "Our leaders",
|
|
4633
|
+
items,
|
|
4634
|
+
initialVisibleCount = 4,
|
|
4635
|
+
expandText = "View all",
|
|
4636
|
+
collapseText = "View less",
|
|
4637
|
+
className,
|
|
4638
|
+
...props
|
|
4639
|
+
}) => {
|
|
4640
|
+
const [isExpanded, setIsExpanded] = useState12(false);
|
|
4641
|
+
const hasMore = items.length > initialVisibleCount;
|
|
4642
|
+
const visibleItems = items.slice(0, initialVisibleCount);
|
|
4643
|
+
const extraItems = items.slice(initialVisibleCount);
|
|
4644
|
+
return /* @__PURE__ */ jsx36("section", { className: [Leaders_default.section, className].filter(Boolean).join(" "), ...props, children: /* @__PURE__ */ jsxs32("div", { className: Leaders_default.container, children: [
|
|
4645
|
+
title && /* @__PURE__ */ jsx36("div", { className: Leaders_default.header, children: /* @__PURE__ */ jsx36("h2", { className: Leaders_default.title, children: title }) }),
|
|
4646
|
+
/* @__PURE__ */ jsxs32("div", { className: Leaders_default.gridWrapper, children: [
|
|
4647
|
+
/* @__PURE__ */ jsx36("div", { className: Leaders_default.grid, children: visibleItems.map((item, i) => /* @__PURE__ */ jsx36("div", { className: Leaders_default.card, children: /* @__PURE__ */ jsx36(CardContent, { item }) }, i)) }),
|
|
4648
|
+
hasMore && /* @__PURE__ */ jsx36(
|
|
4649
|
+
"div",
|
|
4650
|
+
{
|
|
4651
|
+
className: [
|
|
4652
|
+
Leaders_default.extraCards,
|
|
4653
|
+
isExpanded ? Leaders_default.extraCardsOpen : ""
|
|
4654
|
+
].join(" "),
|
|
4655
|
+
"aria-hidden": !isExpanded,
|
|
4656
|
+
children: /* @__PURE__ */ jsx36("div", { className: Leaders_default.extraGrid, children: extraItems.map((item, i) => /* @__PURE__ */ jsx36(
|
|
4657
|
+
"div",
|
|
4658
|
+
{
|
|
4659
|
+
className: [
|
|
4660
|
+
Leaders_default.card,
|
|
4661
|
+
Leaders_default.extraCard,
|
|
4662
|
+
isExpanded ? Leaders_default.extraCardVisible : ""
|
|
4663
|
+
].join(" "),
|
|
4664
|
+
style: {
|
|
4665
|
+
transitionDelay: isExpanded ? `${i * 70 + 120}ms` : "0ms"
|
|
4666
|
+
},
|
|
4667
|
+
children: /* @__PURE__ */ jsx36(CardContent, { item })
|
|
4668
|
+
},
|
|
4669
|
+
i
|
|
4670
|
+
)) })
|
|
4671
|
+
}
|
|
4672
|
+
)
|
|
4673
|
+
] }),
|
|
4674
|
+
hasMore && /* @__PURE__ */ jsx36("div", { className: Leaders_default.actions, children: /* @__PURE__ */ jsx36(
|
|
4675
|
+
Button,
|
|
4676
|
+
{
|
|
4677
|
+
variant: "secondary",
|
|
4678
|
+
colorScheme: "black",
|
|
4679
|
+
onClick: () => setIsExpanded(!isExpanded),
|
|
4680
|
+
iconPosition: "icon-right",
|
|
4681
|
+
icon: isExpanded ? /* @__PURE__ */ jsx36(ChevronUpIcon, {}) : /* @__PURE__ */ jsx36(ChevronDownIcon4, {}),
|
|
4682
|
+
children: isExpanded ? collapseText : expandText
|
|
4683
|
+
}
|
|
4684
|
+
) })
|
|
4685
|
+
] }) });
|
|
4686
|
+
};
|
|
3987
4687
|
export {
|
|
3988
4688
|
AVATAR_DATA,
|
|
3989
4689
|
Accordion,
|
|
@@ -4001,11 +4701,13 @@ export {
|
|
|
4001
4701
|
DownloadBadge,
|
|
4002
4702
|
DownloadBanner,
|
|
4003
4703
|
FEATURE_SCROLL_DATA,
|
|
4704
|
+
FeatureBullets,
|
|
4004
4705
|
FeatureCards,
|
|
4005
4706
|
FeatureCardsSecondary,
|
|
4006
4707
|
FeatureScroll,
|
|
4007
4708
|
Footer,
|
|
4008
4709
|
Hero,
|
|
4710
|
+
Leaders,
|
|
4009
4711
|
Link,
|
|
4010
4712
|
LogoMarquee,
|
|
4011
4713
|
Navbar,
|
|
@@ -4014,8 +4716,11 @@ export {
|
|
|
4014
4716
|
SearchField,
|
|
4015
4717
|
Stats,
|
|
4016
4718
|
Steps,
|
|
4719
|
+
StickyMarketCards,
|
|
4017
4720
|
StickyStackedCards,
|
|
4018
4721
|
TEXT_CONTENT,
|
|
4722
|
+
Table,
|
|
4723
|
+
Tabs,
|
|
4019
4724
|
Tag,
|
|
4020
4725
|
TextField,
|
|
4021
4726
|
TextScroll,
|