@retinalabsllc/zairusjs 14.0.10 → 14.0.20
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.d.mts +31 -2
- package/dist/index.d.ts +31 -2
- package/dist/index.js +552 -413
- package/dist/index.mjs +452 -310
- package/package.json +2 -1
package/dist/index.js
CHANGED
|
@@ -58,6 +58,7 @@ __export(index_exports, {
|
|
|
58
58
|
TextInput: () => TextInput,
|
|
59
59
|
ThreeDActionButton: () => ThreeDActionButton,
|
|
60
60
|
ThreeDButton: () => ThreeDButton,
|
|
61
|
+
UniversalCardActionPage: () => UniversalCardActionPage,
|
|
61
62
|
UniversalCardPage: () => UniversalCardPage,
|
|
62
63
|
UniversalErrorView: () => UniversalErrorView,
|
|
63
64
|
UniversalHomeView: () => UniversalHomeView,
|
|
@@ -1890,9 +1891,10 @@ var UniversalWalletPage = ({
|
|
|
1890
1891
|
};
|
|
1891
1892
|
|
|
1892
1893
|
// src/components/UniversalCardPage.tsx
|
|
1893
|
-
var
|
|
1894
|
-
var
|
|
1895
|
-
var
|
|
1894
|
+
var import_react33 = __toESM(require("react"));
|
|
1895
|
+
var import_navigation4 = require("next/navigation");
|
|
1896
|
+
var import_react34 = require("@hugeicons/react");
|
|
1897
|
+
var import_core_free_icons12 = require("@hugeicons/core-free-icons");
|
|
1896
1898
|
|
|
1897
1899
|
// src/components/ConfirmationDialog.tsx
|
|
1898
1900
|
var import_react29 = __toESM(require("react"));
|
|
@@ -1929,7 +1931,7 @@ var ConfirmationDialog = ({
|
|
|
1929
1931
|
{
|
|
1930
1932
|
onClick: onConfirm,
|
|
1931
1933
|
disabled: isProcessing,
|
|
1932
|
-
className: `flex-1 py-4 text-[13px] transition-colors disabled:opacity-50 flex justify-center items-center outline-none ${isDestructive ? "text-
|
|
1934
|
+
className: `flex-1 py-4 text-[13px] transition-colors disabled:opacity-50 flex justify-center items-center outline-none ${isDestructive ? "text-black hover:bg-red-50" : "text-black hover:bg-neutral-50"}`
|
|
1933
1935
|
},
|
|
1934
1936
|
isProcessing ? /* @__PURE__ */ import_react29.default.createElement(import_react30.HugeiconsIcon, { icon: import_core_free_icons10.Loading03Icon, className: "animate-spin", size: 18 }) : confirmText
|
|
1935
1937
|
))));
|
|
@@ -2013,70 +2015,32 @@ var PinDialerBottomSheet = ({
|
|
|
2013
2015
|
)))));
|
|
2014
2016
|
};
|
|
2015
2017
|
|
|
2016
|
-
// src/components/CardAction.tsx
|
|
2017
|
-
var import_react33 = __toESM(require("react"));
|
|
2018
|
-
var import_react34 = require("@hugeicons/react");
|
|
2019
|
-
var import_core_free_icons12 = require("@hugeicons/core-free-icons");
|
|
2020
|
-
var CardActionDialog = ({
|
|
2021
|
-
isOpen,
|
|
2022
|
-
card,
|
|
2023
|
-
actionType,
|
|
2024
|
-
onClose,
|
|
2025
|
-
onProceed
|
|
2026
|
-
}) => {
|
|
2027
|
-
if (!isOpen || !card) return null;
|
|
2028
|
-
const title = actionType === "ACTIVATE" ? "Activate Card" : "Create New Card";
|
|
2029
|
-
const description = actionType === "ACTIVATE" ? `You are about to activate your ${card.type.toLowerCase()} card. Once activated, you can view details and set limits.` : `Your current ${card.type.toLowerCase()} card is ${card.status.toLowerCase()}. You need to provision a new one to continue.`;
|
|
2030
|
-
return /* @__PURE__ */ import_react33.default.createElement("div", { className: "fixed inset-0 z-150 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react33.default.createElement(
|
|
2031
|
-
"div",
|
|
2032
|
-
{
|
|
2033
|
-
className: "absolute inset-0 bg-black/40 animate-in fade-in duration-200",
|
|
2034
|
-
onClick: onClose
|
|
2035
|
-
}
|
|
2036
|
-
), /* @__PURE__ */ import_react33.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.CreditCardIcon, size: 20, className: "text-black" }), /* @__PURE__ */ import_react33.default.createElement("h3", { className: "text-[16px] text-black tracking-tight" }, title)), /* @__PURE__ */ import_react33.default.createElement(
|
|
2037
|
-
"button",
|
|
2038
|
-
{
|
|
2039
|
-
onClick: onClose,
|
|
2040
|
-
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
2041
|
-
},
|
|
2042
|
-
/* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.CancelCircleIcon, size: 20 })
|
|
2043
|
-
)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "p-6 text-center" }, /* @__PURE__ */ import_react33.default.createElement("p", { className: "text-[13px] text-neutral-500 leading-relaxed mb-6" }, description), /* @__PURE__ */ import_react33.default.createElement(
|
|
2044
|
-
"button",
|
|
2045
|
-
{
|
|
2046
|
-
onClick: onProceed,
|
|
2047
|
-
className: "w-full py-3.5 bg-black text-white text-[13px] rounded-xl hover:bg-neutral-800 transition-colors outline-none active:scale-95"
|
|
2048
|
-
},
|
|
2049
|
-
actionType === "ACTIVATE" ? "Activate Now" : "Create Card"
|
|
2050
|
-
))));
|
|
2051
|
-
};
|
|
2052
|
-
|
|
2053
2018
|
// src/components/UniversalCardPage.tsx
|
|
2054
2019
|
var UniversalCardPage = ({
|
|
2055
2020
|
cards = [],
|
|
2021
|
+
actionPath = "/app/cards/action/",
|
|
2056
2022
|
onReveal,
|
|
2057
2023
|
onFreeze,
|
|
2058
2024
|
onSetLimits,
|
|
2059
|
-
onDelete
|
|
2060
|
-
onCardAction
|
|
2025
|
+
onDelete
|
|
2061
2026
|
}) => {
|
|
2062
|
-
const
|
|
2027
|
+
const router = (0, import_navigation4.useRouter)();
|
|
2028
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react33.useState)(0);
|
|
2063
2029
|
const activeCard = cards[activeTabIndex];
|
|
2064
|
-
(0,
|
|
2030
|
+
(0, import_react33.useEffect)(() => {
|
|
2065
2031
|
setIsFlipped(false);
|
|
2066
2032
|
setIsRevealed(false);
|
|
2067
2033
|
}, [activeTabIndex]);
|
|
2068
|
-
const [isFlipped, setIsFlipped] = (0,
|
|
2069
|
-
const [isBgLoaded, setIsBgLoaded] = (0,
|
|
2070
|
-
const [isRevealed, setIsRevealed] = (0,
|
|
2071
|
-
const [isRevealing, setIsRevealing] = (0,
|
|
2072
|
-
const [isFreezing, setIsFreezing] = (0,
|
|
2073
|
-
const [isOverlayActionLoading, setIsOverlayActionLoading] = (0,
|
|
2074
|
-
const [showDeleteDialog, setShowDeleteDialog] = (0,
|
|
2075
|
-
const [isDeleting, setIsDeleting] = (0,
|
|
2076
|
-
const [showPinDialer, setShowPinDialer] = (0,
|
|
2077
|
-
|
|
2078
|
-
const [cardActionType, setCardActionType] = (0, import_react35.useState)("ACTIVATE");
|
|
2079
|
-
(0, import_react35.useEffect)(() => {
|
|
2034
|
+
const [isFlipped, setIsFlipped] = (0, import_react33.useState)(false);
|
|
2035
|
+
const [isBgLoaded, setIsBgLoaded] = (0, import_react33.useState)(false);
|
|
2036
|
+
const [isRevealed, setIsRevealed] = (0, import_react33.useState)(false);
|
|
2037
|
+
const [isRevealing, setIsRevealing] = (0, import_react33.useState)(false);
|
|
2038
|
+
const [isFreezing, setIsFreezing] = (0, import_react33.useState)(false);
|
|
2039
|
+
const [isOverlayActionLoading, setIsOverlayActionLoading] = (0, import_react33.useState)(false);
|
|
2040
|
+
const [showDeleteDialog, setShowDeleteDialog] = (0, import_react33.useState)(false);
|
|
2041
|
+
const [isDeleting, setIsDeleting] = (0, import_react33.useState)(false);
|
|
2042
|
+
const [showPinDialer, setShowPinDialer] = (0, import_react33.useState)(false);
|
|
2043
|
+
(0, import_react33.useEffect)(() => {
|
|
2080
2044
|
setIsBgLoaded(false);
|
|
2081
2045
|
if (!activeCard?.cardBgSrc) return;
|
|
2082
2046
|
const img = new Image();
|
|
@@ -2085,7 +2049,7 @@ var UniversalCardPage = ({
|
|
|
2085
2049
|
setTimeout(() => setIsBgLoaded(true), 300);
|
|
2086
2050
|
};
|
|
2087
2051
|
}, [activeCard?.cardBgSrc]);
|
|
2088
|
-
if (!activeCard) return /* @__PURE__ */
|
|
2052
|
+
if (!activeCard) return /* @__PURE__ */ import_react33.default.createElement("div", { className: "text-center p-8 text-neutral-500" }, "No cards available");
|
|
2089
2053
|
const isActivated = activeCard.status === "ACTIVATED";
|
|
2090
2054
|
const isFrozen = activeCard.status === "FROZEN";
|
|
2091
2055
|
const isUnactivated = activeCard.status === "UNACTIVATED";
|
|
@@ -2132,10 +2096,6 @@ var UniversalCardPage = ({
|
|
|
2132
2096
|
setIsOverlayActionLoading(false);
|
|
2133
2097
|
}, 800);
|
|
2134
2098
|
};
|
|
2135
|
-
const handleOverlayActionClick = (type) => {
|
|
2136
|
-
setCardActionType(type);
|
|
2137
|
-
setShowCardActionDialog(true);
|
|
2138
|
-
};
|
|
2139
2099
|
const confirmDelete = async () => {
|
|
2140
2100
|
setIsDeleting(true);
|
|
2141
2101
|
setTimeout(() => {
|
|
@@ -2151,9 +2111,9 @@ var UniversalCardPage = ({
|
|
|
2151
2111
|
const displayCardNumber = isRevealed ? activeCard.cardNumber : `XXXX XXXX XXXX ${activeCard.cardNumber.slice(-4)}`;
|
|
2152
2112
|
const displayExpiry = isRevealed ? activeCard.expiry : "XX/XX";
|
|
2153
2113
|
const displayCvv = isRevealed ? activeCard.cvv : "XXX";
|
|
2154
|
-
return /* @__PURE__ */
|
|
2114
|
+
return /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, cards.length > 1 && /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex items-center justify-center mb-6 w-full px-2" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar " }, cards.map((tab, idx) => {
|
|
2155
2115
|
const isActive = activeTabIndex === idx;
|
|
2156
|
-
return /* @__PURE__ */
|
|
2116
|
+
return /* @__PURE__ */ import_react33.default.createElement(
|
|
2157
2117
|
"button",
|
|
2158
2118
|
{
|
|
2159
2119
|
key: tab.id,
|
|
@@ -2162,7 +2122,7 @@ var UniversalCardPage = ({
|
|
|
2162
2122
|
},
|
|
2163
2123
|
formatTabLabel(tab.type)
|
|
2164
2124
|
);
|
|
2165
|
-
}))), /* @__PURE__ */
|
|
2125
|
+
}))), /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full pt-2 pb-2 flex justify-center", style: { perspective: "1000px" } }, /* @__PURE__ */ import_react33.default.createElement(
|
|
2166
2126
|
"div",
|
|
2167
2127
|
{
|
|
2168
2128
|
onClick: () => {
|
|
@@ -2175,28 +2135,28 @@ var UniversalCardPage = ({
|
|
|
2175
2135
|
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
2176
2136
|
}
|
|
2177
2137
|
},
|
|
2178
|
-
!isBgLoaded && /* @__PURE__ */
|
|
2179
|
-
!isActivated && isBgLoaded && /* @__PURE__ */
|
|
2138
|
+
!isBgLoaded && /* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.Loading03Icon, size: 28, className: "animate-spin text-black" })),
|
|
2139
|
+
!isActivated && isBgLoaded && /* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute inset-0 z-40 w-full h-full rounded-2xl backdrop-blur-[2px] flex flex-col items-center justify-center ", style: { transform: "translateZ(1px)" } }, isUnactivated && /* @__PURE__ */ import_react33.default.createElement(
|
|
2180
2140
|
"button",
|
|
2181
2141
|
{
|
|
2182
2142
|
onClick: (e) => {
|
|
2183
2143
|
e.stopPropagation();
|
|
2184
|
-
|
|
2144
|
+
router.push(`${actionPath}${activeCard.id}`);
|
|
2185
2145
|
},
|
|
2186
2146
|
className: "px-6 py-2 bg-white/25 text-white text-[11px] rounded-full transition-all outline-none active:scale-95"
|
|
2187
2147
|
},
|
|
2188
2148
|
"Activate Card"
|
|
2189
|
-
), isDead && /* @__PURE__ */
|
|
2149
|
+
), isDead && /* @__PURE__ */ import_react33.default.createElement(
|
|
2190
2150
|
"button",
|
|
2191
2151
|
{
|
|
2192
2152
|
onClick: (e) => {
|
|
2193
2153
|
e.stopPropagation();
|
|
2194
|
-
|
|
2154
|
+
router.push(`${actionPath}${activeCard.id}`);
|
|
2195
2155
|
},
|
|
2196
2156
|
className: "px-6 py-2 bg-white/25 text-white text-[11px] rounded-full transition-all outline-none active:scale-95"
|
|
2197
2157
|
},
|
|
2198
2158
|
"Create Card"
|
|
2199
|
-
), isFrozen && /* @__PURE__ */
|
|
2159
|
+
), isFrozen && /* @__PURE__ */ import_react33.default.createElement(
|
|
2200
2160
|
"button",
|
|
2201
2161
|
{
|
|
2202
2162
|
onClick: (e) => {
|
|
@@ -2206,24 +2166,24 @@ var UniversalCardPage = ({
|
|
|
2206
2166
|
disabled: isOverlayActionLoading,
|
|
2207
2167
|
className: "px-6 py-2.5 bg-white/35 text-white text-[12px] rounded-full transition-all outline-none active:scale-95 flex items-center gap-2 disabled:opacity-80"
|
|
2208
2168
|
},
|
|
2209
|
-
isOverlayActionLoading ? /* @__PURE__ */
|
|
2169
|
+
isOverlayActionLoading ? /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.Loading03Icon, size: 16, className: "animate-spin" }) : "Unfreeze Card"
|
|
2210
2170
|
)),
|
|
2211
|
-
/* @__PURE__ */
|
|
2171
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
2212
2172
|
"div",
|
|
2213
2173
|
{
|
|
2214
2174
|
className: `absolute inset-0 w-full h-full rounded-2xl overflow-hidden transition-all duration-700 ${isBgLoaded ? "opacity-100 scale-100" : "opacity-0 scale-105"}`,
|
|
2215
2175
|
style: { backfaceVisibility: "hidden" }
|
|
2216
2176
|
},
|
|
2217
|
-
/* @__PURE__ */
|
|
2177
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
2218
2178
|
"div",
|
|
2219
2179
|
{
|
|
2220
2180
|
className: "absolute inset-0 bg-cover bg-center",
|
|
2221
2181
|
style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
2222
2182
|
}
|
|
2223
2183
|
),
|
|
2224
|
-
/* @__PURE__ */
|
|
2184
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex items-start w-full gap-4" }, activeCard.companyLogoSrc && /* @__PURE__ */ import_react33.default.createElement("img", { src: activeCard.companyLogoSrc, alt: "Company Logo", className: "h-10 w-auto max-w-30 object-contain opacity-90" })), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Card Number"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[12px] text-white tracking-widest font-light" }, displayCardNumber)), activeCard.networkLogoSrc && /* @__PURE__ */ import_react33.default.createElement("img", { src: activeCard.networkLogoSrc, alt: "Network Logo", className: "h-10 w-auto max-w-20 object-contain opacity-90" })))
|
|
2225
2185
|
),
|
|
2226
|
-
/* @__PURE__ */
|
|
2186
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
2227
2187
|
"div",
|
|
2228
2188
|
{
|
|
2229
2189
|
className: `absolute inset-0 w-full h-full rounded-2xl overflow-hidden transition-all duration-700 ${isBgLoaded ? "opacity-100 scale-100" : "opacity-0 scale-105"}`,
|
|
@@ -2232,20 +2192,20 @@ var UniversalCardPage = ({
|
|
|
2232
2192
|
transform: "rotateY(180deg)"
|
|
2233
2193
|
}
|
|
2234
2194
|
},
|
|
2235
|
-
/* @__PURE__ */
|
|
2195
|
+
/* @__PURE__ */ import_react33.default.createElement(
|
|
2236
2196
|
"div",
|
|
2237
2197
|
{
|
|
2238
2198
|
className: "absolute inset-0 bg-cover bg-center",
|
|
2239
2199
|
style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
|
|
2240
2200
|
}
|
|
2241
2201
|
),
|
|
2242
|
-
/* @__PURE__ */
|
|
2243
|
-
/* @__PURE__ */
|
|
2202
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "absolute top-6 left-0 right-0 h-10 bg-black/80 w-full" }),
|
|
2203
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90", style: { fontFamily: "'Whisper', cursive" } }, activeCard.cardHolderName)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Expiry"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[12px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "CVV"), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[12px] text-white font-light" }, displayCvv))))
|
|
2244
2204
|
)
|
|
2245
|
-
)), /* @__PURE__ */
|
|
2205
|
+
)), /* @__PURE__ */ import_react33.default.createElement("p", { className: "w-full text-center text-xs text-neutral-400 mb-6 mt-1" }, isActivated ? "Tap to flip card" : "Action Required"), /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react33.default.createElement(
|
|
2246
2206
|
MenuRow,
|
|
2247
2207
|
{
|
|
2248
|
-
icon:
|
|
2208
|
+
icon: import_core_free_icons12.ViewOffSlashIcon,
|
|
2249
2209
|
title: "Reveal Information",
|
|
2250
2210
|
subtitle: "Show card informations",
|
|
2251
2211
|
onClick: handleToggleReveal,
|
|
@@ -2254,10 +2214,10 @@ var UniversalCardPage = ({
|
|
|
2254
2214
|
toggleLoading: isRevealing,
|
|
2255
2215
|
disabled: revealDisabled
|
|
2256
2216
|
}
|
|
2257
|
-
), /* @__PURE__ */
|
|
2217
|
+
), /* @__PURE__ */ import_react33.default.createElement(
|
|
2258
2218
|
MenuRow,
|
|
2259
2219
|
{
|
|
2260
|
-
icon:
|
|
2220
|
+
icon: import_core_free_icons12.SnowIcon,
|
|
2261
2221
|
title: "Freeze",
|
|
2262
2222
|
subtitle: "Freeze & Unfreeze card",
|
|
2263
2223
|
onClick: handleToggleFreeze,
|
|
@@ -2266,10 +2226,10 @@ var UniversalCardPage = ({
|
|
|
2266
2226
|
toggleLoading: isFreezing,
|
|
2267
2227
|
disabled: freezeDisabled
|
|
2268
2228
|
}
|
|
2269
|
-
), /* @__PURE__ */
|
|
2229
|
+
), /* @__PURE__ */ import_react33.default.createElement(
|
|
2270
2230
|
MenuRow,
|
|
2271
2231
|
{
|
|
2272
|
-
icon:
|
|
2232
|
+
icon: import_core_free_icons12.SlidersHorizontalIcon,
|
|
2273
2233
|
title: "Set Limits",
|
|
2274
2234
|
subtitle: "Set card limits",
|
|
2275
2235
|
onClick: () => {
|
|
@@ -2278,10 +2238,10 @@ var UniversalCardPage = ({
|
|
|
2278
2238
|
disabled: actionsDisabled,
|
|
2279
2239
|
isLast: true
|
|
2280
2240
|
}
|
|
2281
|
-
)), /* @__PURE__ */
|
|
2241
|
+
)), /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react33.default.createElement(
|
|
2282
2242
|
MenuRow,
|
|
2283
2243
|
{
|
|
2284
|
-
icon:
|
|
2244
|
+
icon: import_core_free_icons12.Delete02Icon,
|
|
2285
2245
|
title: "Delete card",
|
|
2286
2246
|
subtitle: "Permanently delete card",
|
|
2287
2247
|
onClick: () => {
|
|
@@ -2290,7 +2250,7 @@ var UniversalCardPage = ({
|
|
|
2290
2250
|
disabled: actionsDisabled,
|
|
2291
2251
|
isLast: true
|
|
2292
2252
|
}
|
|
2293
|
-
))), /* @__PURE__ */
|
|
2253
|
+
))), /* @__PURE__ */ import_react33.default.createElement(
|
|
2294
2254
|
ConfirmationDialog,
|
|
2295
2255
|
{
|
|
2296
2256
|
isOpen: showDeleteDialog,
|
|
@@ -2302,7 +2262,7 @@ var UniversalCardPage = ({
|
|
|
2302
2262
|
onClose: () => setShowDeleteDialog(false),
|
|
2303
2263
|
onConfirm: confirmDelete
|
|
2304
2264
|
}
|
|
2305
|
-
), /* @__PURE__ */
|
|
2265
|
+
), /* @__PURE__ */ import_react33.default.createElement(
|
|
2306
2266
|
PinDialerBottomSheet,
|
|
2307
2267
|
{
|
|
2308
2268
|
isOpen: showPinDialer,
|
|
@@ -2311,18 +2271,6 @@ var UniversalCardPage = ({
|
|
|
2311
2271
|
onClose: () => setShowPinDialer(false),
|
|
2312
2272
|
onComplete: handlePinComplete
|
|
2313
2273
|
}
|
|
2314
|
-
), /* @__PURE__ */ import_react35.default.createElement(
|
|
2315
|
-
CardActionDialog,
|
|
2316
|
-
{
|
|
2317
|
-
isOpen: showCardActionDialog,
|
|
2318
|
-
card: activeCard,
|
|
2319
|
-
actionType: cardActionType,
|
|
2320
|
-
onClose: () => setShowCardActionDialog(false),
|
|
2321
|
-
onProceed: () => {
|
|
2322
|
-
if (onCardAction) onCardAction(activeCard.id, cardActionType);
|
|
2323
|
-
setShowCardActionDialog(false);
|
|
2324
|
-
}
|
|
2325
|
-
}
|
|
2326
2274
|
));
|
|
2327
2275
|
};
|
|
2328
2276
|
var MenuRow = ({
|
|
@@ -2337,21 +2285,21 @@ var MenuRow = ({
|
|
|
2337
2285
|
toggleState = false,
|
|
2338
2286
|
toggleLoading = false,
|
|
2339
2287
|
disabled = false
|
|
2340
|
-
}) => /* @__PURE__ */
|
|
2288
|
+
}) => /* @__PURE__ */ import_react33.default.createElement(
|
|
2341
2289
|
"div",
|
|
2342
2290
|
{
|
|
2343
2291
|
onClick: disabled ? void 0 : onClick,
|
|
2344
2292
|
className: `flex items-center p-3 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-neutral-50"}`
|
|
2345
2293
|
},
|
|
2346
|
-
/* @__PURE__ */
|
|
2347
|
-
/* @__PURE__ */
|
|
2348
|
-
isToggle ? /* @__PURE__ */
|
|
2294
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon, size: 16, className: iconColor })),
|
|
2295
|
+
/* @__PURE__ */ import_react33.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react33.default.createElement("p", { className: `text-[13px] truncate ${titleColor}` }, title), /* @__PURE__ */ import_react33.default.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2296
|
+
isToggle ? /* @__PURE__ */ import_react33.default.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-neutral-200"} ${disabled ? "opacity-50" : ""}` }, /* @__PURE__ */ import_react33.default.createElement("div", { className: `absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 flex items-center justify-center ${toggleState ? "translate-x-5" : "translate-x-0"}` }, toggleLoading && /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.Loading03Icon, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons12.ArrowRight01Icon, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2349
2297
|
);
|
|
2350
2298
|
|
|
2351
2299
|
// src/components/UniversalProfilePage.tsx
|
|
2352
|
-
var
|
|
2353
|
-
var
|
|
2354
|
-
var
|
|
2300
|
+
var import_react35 = __toESM(require("react"));
|
|
2301
|
+
var import_react36 = require("@hugeicons/react");
|
|
2302
|
+
var import_core_free_icons13 = require("@hugeicons/core-free-icons");
|
|
2355
2303
|
var UniversalProfilePage = ({
|
|
2356
2304
|
avatarSrc,
|
|
2357
2305
|
roleName,
|
|
@@ -2365,9 +2313,9 @@ var UniversalProfilePage = ({
|
|
|
2365
2313
|
onLogoutTap,
|
|
2366
2314
|
onDeleteTap
|
|
2367
2315
|
}) => {
|
|
2368
|
-
const [isAvatarLoaded, setIsAvatarLoaded] = (0,
|
|
2369
|
-
const [showLogoutDialog, setShowLogoutDialog] = (0,
|
|
2370
|
-
const [isLoggingOut, setIsLoggingOut] = (0,
|
|
2316
|
+
const [isAvatarLoaded, setIsAvatarLoaded] = (0, import_react35.useState)(false);
|
|
2317
|
+
const [showLogoutDialog, setShowLogoutDialog] = (0, import_react35.useState)(false);
|
|
2318
|
+
const [isLoggingOut, setIsLoggingOut] = (0, import_react35.useState)(false);
|
|
2371
2319
|
const handleConfirmLogout = async () => {
|
|
2372
2320
|
setIsLoggingOut(true);
|
|
2373
2321
|
try {
|
|
@@ -2387,7 +2335,7 @@ var UniversalProfilePage = ({
|
|
|
2387
2335
|
if (r.includes("platinum")) return "text-yellow-400";
|
|
2388
2336
|
return "text-neutral-400";
|
|
2389
2337
|
};
|
|
2390
|
-
return /* @__PURE__ */
|
|
2338
|
+
return /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "pt-8 pb-4 flex flex-col items-center" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-22 h-22 rounded-full bg-white p-1 mb-4 flex items-center justify-center" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, avatarSrc ? /* @__PURE__ */ import_react35.default.createElement(import_react35.default.Fragment, null, !isAvatarLoaded && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-100" }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.Loading03Icon, size: 24, className: "animate-spin text-black" })), /* @__PURE__ */ import_react35.default.createElement(
|
|
2391
2339
|
"img",
|
|
2392
2340
|
{
|
|
2393
2341
|
src: avatarSrc,
|
|
@@ -2395,74 +2343,74 @@ var UniversalProfilePage = ({
|
|
|
2395
2343
|
onLoad: () => setIsAvatarLoaded(true),
|
|
2396
2344
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
2397
2345
|
}
|
|
2398
|
-
)) : /* @__PURE__ */
|
|
2346
|
+
)) : /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.UserIcon, size: 40, className: "text-neutral-300" }))), /* @__PURE__ */ import_react35.default.createElement("div", { className: "bg-white rounded-full px-4 py-2 flex items-center justify-center gap-2 mb-3" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[12px] text-black" }, roleName), /* @__PURE__ */ import_react35.default.createElement("span", { className: getBadgeColorClass(roleName), "aria-hidden": true }, /* @__PURE__ */ import_react35.default.createElement("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react35.default.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: "0" }), /* @__PURE__ */ import_react35.default.createElement("g", { id: "SVGRepo_tracerCarrier", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ import_react35.default.createElement("g", { id: "SVGRepo_iconCarrier" }, " ", /* @__PURE__ */ import_react35.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5924 3.20027C9.34888 3.4078 9.22711 3.51158 9.09706 3.59874C8.79896 3.79854 8.46417 3.93721 8.1121 4.00672C7.95851 4.03705 7.79903 4.04977 7.48008 4.07522C6.6787 4.13918 6.278 4.17115 5.94371 4.28923C5.17051 4.56233 4.56233 5.17051 4.28923 5.94371C4.17115 6.278 4.13918 6.6787 4.07522 7.48008C4.04977 7.79903 4.03705 7.95851 4.00672 8.1121C3.93721 8.46417 3.79854 8.79896 3.59874 9.09706C3.51158 9.22711 3.40781 9.34887 3.20027 9.5924C2.67883 10.2043 2.4181 10.5102 2.26522 10.8301C1.91159 11.57 1.91159 12.43 2.26522 13.1699C2.41811 13.4898 2.67883 13.7957 3.20027 14.4076C3.40778 14.6511 3.51158 14.7729 3.59874 14.9029C3.79854 15.201 3.93721 15.5358 4.00672 15.8879C4.03705 16.0415 4.04977 16.201 4.07522 16.5199C4.13918 17.3213 4.17115 17.722 4.28923 18.0563C4.56233 18.8295 5.17051 19.4377 5.94371 19.7108C6.278 19.8288 6.6787 19.8608 7.48008 19.9248C7.79903 19.9502 7.95851 19.963 8.1121 19.9933C8.46417 20.0628 8.79896 20.2015 9.09706 20.4013C9.22711 20.4884 9.34887 20.5922 9.5924 20.7997C10.2043 21.3212 10.5102 21.5819 10.8301 21.7348C11.57 22.0884 12.43 22.0884 13.1699 21.7348C13.4898 21.5819 13.7957 21.3212 14.4076 20.7997C14.6511 20.5922 14.7729 20.4884 14.9029 20.4013C15.201 20.2015 15.5358 20.0628 15.8879 19.9933C16.0415 19.963 16.201 19.9502 16.5199 19.9248C17.3213 19.8608 17.722 19.8288 18.0563 19.7108C18.8295 19.4377 19.4377 18.8295 19.7108 18.0563C19.8288 17.722 19.8608 17.3213 19.9248 16.5199C19.9502 16.201 19.963 16.0415 19.9933 15.8879C20.0628 15.5358 20.2015 15.201 20.4013 14.9029C20.4884 14.7729 20.5922 14.6511 20.7997 14.4076C21.3212 13.7957 21.5819 13.4898 21.7348 13.1699C22.0884 12.43 22.0884 11.57 21.7348 10.8301C21.5819 10.5102 21.3212 10.2043 20.7997 9.5924C20.5922 9.34887 20.4884 9.22711 20.4013 9.09706C20.2015 8.79896 20.0628 8.46417 19.9933 8.1121C19.963 7.95851 19.9502 7.79903 19.9248 7.48008C19.8608 6.6787 19.8288 6.278 19.7108 5.94371C19.4377 5.17051 18.8295 4.56233 18.0563 4.28923C17.722 4.17115 17.3213 4.13918 16.5199 4.07522C16.201 4.04977 16.0415 4.03705 15.8879 4.00672C15.5358 3.93721 15.201 3.79854 14.9029 3.59874C14.7729 3.51158 14.6511 3.40781 14.4076 3.20027C13.7957 2.67883 13.4898 2.41811 13.1699 2.26522C12.43 1.91159 11.57 1.91159 10.8301 2.26522C10.5102 2.4181 10.2043 2.67883 9.5924 3.20027ZM16.3735 9.86314C16.6913 9.5453 16.6913 9.03 16.3735 8.71216C16.0557 8.39433 15.5403 8.39433 15.2225 8.71216L10.3723 13.5624L8.77746 11.9676C8.45963 11.6498 7.94432 11.6498 7.62649 11.9676C7.30866 12.2854 7.30866 12.8007 7.62649 13.1186L9.79678 15.2889C10.1146 15.6067 10.6299 15.6067 10.9478 15.2889L16.3735 9.86314Z", fill: "currentColor" }), " ")))), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[12px] text-neutral-500" }, memberSince)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full flex flex-col gap-4 mt-2" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react35.default.createElement(
|
|
2399
2347
|
MenuRow2,
|
|
2400
2348
|
{
|
|
2401
|
-
icon:
|
|
2349
|
+
icon: import_core_free_icons13.UserIcon,
|
|
2402
2350
|
title: "Account",
|
|
2403
2351
|
subtitle: "Your account details",
|
|
2404
2352
|
onClick: onAccountTap
|
|
2405
2353
|
}
|
|
2406
|
-
), /* @__PURE__ */
|
|
2354
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
2407
2355
|
MenuRow2,
|
|
2408
2356
|
{
|
|
2409
|
-
icon:
|
|
2357
|
+
icon: import_core_free_icons13.LockKeyIcon,
|
|
2410
2358
|
title: "Security",
|
|
2411
2359
|
subtitle: "2FA & authentication",
|
|
2412
2360
|
onClick: onSecurityTap
|
|
2413
2361
|
}
|
|
2414
|
-
), /* @__PURE__ */
|
|
2362
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
2415
2363
|
MenuRow2,
|
|
2416
2364
|
{
|
|
2417
|
-
icon:
|
|
2365
|
+
icon: import_core_free_icons13.ShieldUserIcon,
|
|
2418
2366
|
title: "Web3 Profile",
|
|
2419
2367
|
subtitle: "Manage web3 profile",
|
|
2420
2368
|
onClick: onDefiTap
|
|
2421
2369
|
}
|
|
2422
|
-
), /* @__PURE__ */
|
|
2370
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
2423
2371
|
MenuRow2,
|
|
2424
2372
|
{
|
|
2425
|
-
icon:
|
|
2373
|
+
icon: import_core_free_icons13.MessageQuestionIcon,
|
|
2426
2374
|
title: "Get Help",
|
|
2427
2375
|
subtitle: "24/7 Support",
|
|
2428
2376
|
onClick: onHelpTap,
|
|
2429
2377
|
isLast: true
|
|
2430
2378
|
}
|
|
2431
|
-
)), /* @__PURE__ */
|
|
2379
|
+
)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react35.default.createElement(
|
|
2432
2380
|
MenuRow2,
|
|
2433
2381
|
{
|
|
2434
|
-
icon:
|
|
2382
|
+
icon: import_core_free_icons13.UserIdVerificationIcon,
|
|
2435
2383
|
title: "Verifications",
|
|
2436
2384
|
subtitle: "Account Verifications",
|
|
2437
2385
|
onClick: onVerificationsTap
|
|
2438
2386
|
}
|
|
2439
|
-
), /* @__PURE__ */
|
|
2387
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
2440
2388
|
MenuRow2,
|
|
2441
2389
|
{
|
|
2442
|
-
icon:
|
|
2390
|
+
icon: import_core_free_icons13.CrownIcon,
|
|
2443
2391
|
title: "My Referrals",
|
|
2444
2392
|
subtitle: "Referral & Rewards",
|
|
2445
2393
|
onClick: onExportTap
|
|
2446
2394
|
}
|
|
2447
|
-
), /* @__PURE__ */
|
|
2395
|
+
), /* @__PURE__ */ import_react35.default.createElement(
|
|
2448
2396
|
MenuRow2,
|
|
2449
2397
|
{
|
|
2450
|
-
icon:
|
|
2398
|
+
icon: import_core_free_icons13.LogoutCircle02Icon,
|
|
2451
2399
|
title: "Log Out",
|
|
2452
2400
|
subtitle: "End your session",
|
|
2453
2401
|
onClick: () => setShowLogoutDialog(true),
|
|
2454
2402
|
isLast: true
|
|
2455
2403
|
}
|
|
2456
|
-
)), /* @__PURE__ */
|
|
2404
|
+
)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden mb-4" }, /* @__PURE__ */ import_react35.default.createElement(
|
|
2457
2405
|
MenuRow2,
|
|
2458
2406
|
{
|
|
2459
|
-
icon:
|
|
2407
|
+
icon: import_core_free_icons13.UserRemove01Icon,
|
|
2460
2408
|
title: "Delete Account",
|
|
2461
2409
|
subtitle: "Remove account",
|
|
2462
2410
|
onClick: onDeleteTap,
|
|
2463
2411
|
isLast: true
|
|
2464
2412
|
}
|
|
2465
|
-
))), /* @__PURE__ */
|
|
2413
|
+
))), /* @__PURE__ */ import_react35.default.createElement(
|
|
2466
2414
|
ConfirmationDialog,
|
|
2467
2415
|
{
|
|
2468
2416
|
isOpen: showLogoutDialog,
|
|
@@ -2476,22 +2424,22 @@ var UniversalProfilePage = ({
|
|
|
2476
2424
|
}
|
|
2477
2425
|
));
|
|
2478
2426
|
};
|
|
2479
|
-
var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */
|
|
2427
|
+
var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titleColor = "text-black", isLast = false }) => /* @__PURE__ */ import_react35.default.createElement(
|
|
2480
2428
|
"div",
|
|
2481
2429
|
{
|
|
2482
2430
|
onClick,
|
|
2483
2431
|
className: `flex items-center p-4 cursor-pointer hover:bg-neutral-50 transition-colors ${!isLast ? "" : ""}`
|
|
2484
2432
|
},
|
|
2485
|
-
/* @__PURE__ */
|
|
2486
|
-
/* @__PURE__ */
|
|
2487
|
-
/* @__PURE__ */
|
|
2433
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon, size: 16, className: iconColor })),
|
|
2434
|
+
/* @__PURE__ */ import_react35.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react35.default.createElement("p", { className: `text-[13px] truncate ${titleColor}` }, title), /* @__PURE__ */ import_react35.default.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2435
|
+
/* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.ArrowRight01Icon, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2488
2436
|
);
|
|
2489
2437
|
|
|
2490
2438
|
// src/components/UniversalSidebar.tsx
|
|
2491
|
-
var
|
|
2439
|
+
var import_react37 = __toESM(require("react"));
|
|
2492
2440
|
var import_link5 = __toESM(require("next/link"));
|
|
2493
|
-
var
|
|
2494
|
-
var
|
|
2441
|
+
var import_react38 = require("@hugeicons/react");
|
|
2442
|
+
var import_core_free_icons14 = require("@hugeicons/core-free-icons");
|
|
2495
2443
|
var UniversalSidebar = ({
|
|
2496
2444
|
navItems,
|
|
2497
2445
|
currentPath,
|
|
@@ -2499,8 +2447,8 @@ var UniversalSidebar = ({
|
|
|
2499
2447
|
showLogoutAction = false,
|
|
2500
2448
|
onLogout
|
|
2501
2449
|
}) => {
|
|
2502
|
-
const [showLogoutDialog, setShowLogoutDialog] = (0,
|
|
2503
|
-
const [isLoggingOut, setIsLoggingOut] = (0,
|
|
2450
|
+
const [showLogoutDialog, setShowLogoutDialog] = (0, import_react37.useState)(false);
|
|
2451
|
+
const [isLoggingOut, setIsLoggingOut] = (0, import_react37.useState)(false);
|
|
2504
2452
|
const hasActiveMatch = navItems.some(
|
|
2505
2453
|
(item) => item.path === "/" || item.path === "/app" ? currentPath === "/" || currentPath === "/app" : currentPath === item.path || currentPath?.startsWith(`${item.path}/`)
|
|
2506
2454
|
);
|
|
@@ -2514,10 +2462,10 @@ var UniversalSidebar = ({
|
|
|
2514
2462
|
setShowLogoutDialog(false);
|
|
2515
2463
|
}
|
|
2516
2464
|
};
|
|
2517
|
-
return /* @__PURE__ */
|
|
2465
|
+
return /* @__PURE__ */ import_react37.default.createElement(import_react37.default.Fragment, null, /* @__PURE__ */ import_react37.default.createElement("aside", { className: "hidden md:flex fixed top-0 left-0 h-screen w-20 flex-col z-40 overflow-y-auto custom-scrollbar" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "h-24 shrink-0" }), /* @__PURE__ */ import_react37.default.createElement("nav", { className: "flex-1 flex flex-col gap-3 px-2" }, navItems.map((item, index) => {
|
|
2518
2466
|
const isExactOrSubMatch = item.path === "/" || item.path === "/app" ? currentPath === "/" || currentPath === "/app" : currentPath === item.path || currentPath?.startsWith(`${item.path}/`);
|
|
2519
2467
|
const isCurrentRoute = isExactOrSubMatch || !hasActiveMatch && index === 0;
|
|
2520
|
-
return /* @__PURE__ */
|
|
2468
|
+
return /* @__PURE__ */ import_react37.default.createElement(
|
|
2521
2469
|
import_link5.default,
|
|
2522
2470
|
{
|
|
2523
2471
|
key: item.name,
|
|
@@ -2526,8 +2474,8 @@ var UniversalSidebar = ({
|
|
|
2526
2474
|
className: `flex items-center justify-center w-12 h-12 mx-auto rounded-full transition-all outline-none group shrink-0 ${isCurrentRoute ? "bg-white text-black" : "text-neutral-500 hover:text-black hover:bg-white/50"}`,
|
|
2527
2475
|
title: item.name
|
|
2528
2476
|
},
|
|
2529
|
-
/* @__PURE__ */
|
|
2530
|
-
|
|
2477
|
+
/* @__PURE__ */ import_react37.default.createElement(
|
|
2478
|
+
import_react38.HugeiconsIcon,
|
|
2531
2479
|
{
|
|
2532
2480
|
icon: item.icon,
|
|
2533
2481
|
size: 20,
|
|
@@ -2535,14 +2483,14 @@ var UniversalSidebar = ({
|
|
|
2535
2483
|
}
|
|
2536
2484
|
)
|
|
2537
2485
|
);
|
|
2538
|
-
})), /* @__PURE__ */
|
|
2486
|
+
})), /* @__PURE__ */ import_react37.default.createElement("div", { className: "p-4 shrink-0 flex flex-col items-center gap-2 mb-4" }, showLogoutAction && /* @__PURE__ */ import_react37.default.createElement(
|
|
2539
2487
|
"button",
|
|
2540
2488
|
{
|
|
2541
2489
|
onClick: () => setShowLogoutDialog(true),
|
|
2542
2490
|
className: "w-12 h-12 rounded-full flex items-center justify-center text-neutral-500 hover:bg-white/50 transition-all outline-none"
|
|
2543
2491
|
},
|
|
2544
|
-
/* @__PURE__ */
|
|
2545
|
-
))), showLogoutAction && /* @__PURE__ */
|
|
2492
|
+
/* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.LogoutCircle02Icon, size: 20 })
|
|
2493
|
+
))), showLogoutAction && /* @__PURE__ */ import_react37.default.createElement(
|
|
2546
2494
|
ConfirmationDialog,
|
|
2547
2495
|
{
|
|
2548
2496
|
isOpen: showLogoutDialog,
|
|
@@ -2558,16 +2506,16 @@ var UniversalSidebar = ({
|
|
|
2558
2506
|
};
|
|
2559
2507
|
|
|
2560
2508
|
// src/components/HeroSection.tsx
|
|
2561
|
-
var
|
|
2509
|
+
var import_react40 = __toESM(require("react"));
|
|
2562
2510
|
var import_link6 = __toESM(require("next/link"));
|
|
2563
2511
|
var import_image2 = __toESM(require("next/image"));
|
|
2564
2512
|
|
|
2565
2513
|
// src/components/WaitlistDialog.tsx
|
|
2566
|
-
var
|
|
2514
|
+
var import_react39 = __toESM(require("react"));
|
|
2567
2515
|
var import_react_hot_toast7 = require("react-hot-toast");
|
|
2568
2516
|
var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
2569
|
-
const [email, setEmail] = (0,
|
|
2570
|
-
const [isLoading, setIsLoading] = (0,
|
|
2517
|
+
const [email, setEmail] = (0, import_react39.useState)("");
|
|
2518
|
+
const [isLoading, setIsLoading] = (0, import_react39.useState)(false);
|
|
2571
2519
|
if (!isOpen) return null;
|
|
2572
2520
|
const handleSubmit = async (e) => {
|
|
2573
2521
|
e.preventDefault();
|
|
@@ -2598,19 +2546,19 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2598
2546
|
setIsLoading(false);
|
|
2599
2547
|
}
|
|
2600
2548
|
};
|
|
2601
|
-
return /* @__PURE__ */
|
|
2549
|
+
return /* @__PURE__ */ import_react39.default.createElement("div", { className: "fixed inset-0 z-100 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "absolute inset-0", onClick: !isLoading ? onClose : void 0 }), /* @__PURE__ */ import_react39.default.createElement(
|
|
2602
2550
|
"div",
|
|
2603
2551
|
{
|
|
2604
2552
|
className: "w-full max-w-md bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200"
|
|
2605
2553
|
},
|
|
2606
|
-
/* @__PURE__ */
|
|
2554
|
+
/* @__PURE__ */ import_react39.default.createElement(
|
|
2607
2555
|
"button",
|
|
2608
2556
|
{
|
|
2609
2557
|
onClick: onClose,
|
|
2610
2558
|
disabled: isLoading,
|
|
2611
2559
|
className: "absolute top-4 right-4 p-2 text-neutral-700 hover:text-neutral-400 transition-colors disabled:opacity-50 outline-none"
|
|
2612
2560
|
},
|
|
2613
|
-
/* @__PURE__ */
|
|
2561
|
+
/* @__PURE__ */ import_react39.default.createElement(
|
|
2614
2562
|
"svg",
|
|
2615
2563
|
{
|
|
2616
2564
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -2623,11 +2571,11 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2623
2571
|
strokeLinecap: "round",
|
|
2624
2572
|
strokeLinejoin: "round"
|
|
2625
2573
|
},
|
|
2626
|
-
/* @__PURE__ */
|
|
2627
|
-
/* @__PURE__ */
|
|
2574
|
+
/* @__PURE__ */ import_react39.default.createElement("path", { d: "M18 6 6 18" }),
|
|
2575
|
+
/* @__PURE__ */ import_react39.default.createElement("path", { d: "m6 6 12 12" })
|
|
2628
2576
|
)
|
|
2629
2577
|
),
|
|
2630
|
-
/* @__PURE__ */
|
|
2578
|
+
/* @__PURE__ */ import_react39.default.createElement("div", { className: "p-6 sm:p-8" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "mb-8 mt-2" }, /* @__PURE__ */ import_react39.default.createElement("h2", { className: "text-2xl text-black tracking-tight mb-2" }, "Join the Waitlist"), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[13px] text-neutral-500 leading-relaxed" }, "Be the first to experience the future of Web3 freedom. Secure your early access spot today.")), /* @__PURE__ */ import_react39.default.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col gap-8" }, /* @__PURE__ */ import_react39.default.createElement(
|
|
2631
2579
|
TextInput,
|
|
2632
2580
|
{
|
|
2633
2581
|
label: "Email ID",
|
|
@@ -2637,7 +2585,7 @@ var WaitlistDialog = ({ isOpen, onClose }) => {
|
|
|
2637
2585
|
placeholder: "name@example.com",
|
|
2638
2586
|
disabled: isLoading
|
|
2639
2587
|
}
|
|
2640
|
-
), /* @__PURE__ */
|
|
2588
|
+
), /* @__PURE__ */ import_react39.default.createElement(
|
|
2641
2589
|
ThreeDActionButton,
|
|
2642
2590
|
{
|
|
2643
2591
|
type: "submit",
|
|
@@ -2670,10 +2618,10 @@ var HeroSection = ({
|
|
|
2670
2618
|
bgImageSrc,
|
|
2671
2619
|
isWaitlist = false
|
|
2672
2620
|
}) => {
|
|
2673
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
2674
|
-
const [isWaitlistOpen, setIsWaitlistOpen] = (0,
|
|
2675
|
-
const titleRef = (0,
|
|
2676
|
-
(0,
|
|
2621
|
+
const [isAnimating, setIsAnimating] = (0, import_react40.useState)(false);
|
|
2622
|
+
const [isWaitlistOpen, setIsWaitlistOpen] = (0, import_react40.useState)(false);
|
|
2623
|
+
const titleRef = (0, import_react40.useRef)(null);
|
|
2624
|
+
(0, import_react40.useEffect)(() => {
|
|
2677
2625
|
const observer = new IntersectionObserver(
|
|
2678
2626
|
([entry]) => {
|
|
2679
2627
|
if (entry.isIntersecting) {
|
|
@@ -2695,7 +2643,7 @@ var HeroSection = ({
|
|
|
2695
2643
|
setIsWaitlistOpen(true);
|
|
2696
2644
|
}
|
|
2697
2645
|
};
|
|
2698
|
-
return /* @__PURE__ */
|
|
2646
|
+
return /* @__PURE__ */ import_react40.default.createElement("div", { className: "w-screen min-h-screen flex justify-center items-center p-4" }, /* @__PURE__ */ import_react40.default.createElement("section", { className: "relative h-[95vh] w-full overflow-hidden rounded-2xl " }, bgVideoSrc ? /* @__PURE__ */ import_react40.default.createElement(
|
|
2699
2647
|
"video",
|
|
2700
2648
|
{
|
|
2701
2649
|
src: bgVideoSrc,
|
|
@@ -2706,7 +2654,7 @@ var HeroSection = ({
|
|
|
2706
2654
|
playsInline: true,
|
|
2707
2655
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
2708
2656
|
}
|
|
2709
|
-
) : bgImageSrc ? /* @__PURE__ */
|
|
2657
|
+
) : bgImageSrc ? /* @__PURE__ */ import_react40.default.createElement(
|
|
2710
2658
|
import_image2.default,
|
|
2711
2659
|
{
|
|
2712
2660
|
src: bgImageSrc,
|
|
@@ -2715,7 +2663,7 @@ var HeroSection = ({
|
|
|
2715
2663
|
priority: true,
|
|
2716
2664
|
className: "absolute inset-0 h-full w-full object-cover z-0"
|
|
2717
2665
|
}
|
|
2718
|
-
) : null, /* @__PURE__ */
|
|
2666
|
+
) : null, /* @__PURE__ */ import_react40.default.createElement(
|
|
2719
2667
|
"div",
|
|
2720
2668
|
{
|
|
2721
2669
|
className: "pointer-events-none absolute inset-0 z-10 opacity-[0.7] mix-blend-overlay",
|
|
@@ -2723,15 +2671,15 @@ var HeroSection = ({
|
|
|
2723
2671
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
2724
2672
|
}
|
|
2725
2673
|
}
|
|
2726
|
-
), /* @__PURE__ */
|
|
2674
|
+
), /* @__PURE__ */ import_react40.default.createElement("div", { className: "pointer-events-none absolute inset-0 bg-linear-to-b from-black/30 via-transparent to-black/80 z-10" }), /* @__PURE__ */ import_react40.default.createElement("div", { className: "absolute bottom-0 left-0 right-0 px-4 pb-4 sm:px-6 md:px-10 z-20" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "grid grid-cols-12 items-end gap-4" }, /* @__PURE__ */ import_react40.default.createElement("div", { className: "col-span-12 lg:col-span-8" }, /* @__PURE__ */ import_react40.default.createElement(
|
|
2727
2675
|
"h1",
|
|
2728
2676
|
{
|
|
2729
2677
|
ref: titleRef,
|
|
2730
2678
|
className: "leading-[0.85] tracking-[-0.07em] text-[18.2vw] sm:text-[16.8vw] md:text-[15.4vw] lg:text-[14vw] xl:text-[13.3vw] 2xl:text-[14vw] text-[#ffffff]"
|
|
2731
2679
|
},
|
|
2732
|
-
/* @__PURE__ */
|
|
2733
|
-
)), /* @__PURE__ */
|
|
2734
|
-
/* @__PURE__ */
|
|
2680
|
+
/* @__PURE__ */ import_react40.default.createElement("div", { className: "inline-flex flex-wrap" }, /* @__PURE__ */ import_react40.default.createElement("span", { className: `inline-block relative transition-all duration-1000 ${isAnimating ? "opacity-100 translate-y-0" : "opacity-0 translate-y-10"}` }, titlePrefix, titlePrefix && /* @__PURE__ */ import_react40.default.createElement("br", null), highlightText, /* @__PURE__ */ import_react40.default.createElement("span", { className: "absolute top-[0.65em] right-[-0.3em] text-[0.31em] text-[#ffffff]/70" }, "*")))
|
|
2681
|
+
)), /* @__PURE__ */ import_react40.default.createElement("div", { className: "col-span-12 flex flex-col gap-5 pb-6 lg:col-span-4 lg:pb-10" }, subtitle && /* @__PURE__ */ import_react40.default.createElement("p", { className: "text-xs text-[#ffffff]/70 sm:text-sm md:text-base leading-[1.2] max-w-md transition-opacity duration-1000 delay-300" }, subtitle), /* @__PURE__ */ import_react40.default.createElement("div", { className: "flex flex-col sm:flex-row items-start sm:items-center gap-4" }, ctaText && // Changed from <button> to <Link> so it actually navigates!
|
|
2682
|
+
/* @__PURE__ */ import_react40.default.createElement(
|
|
2735
2683
|
import_link6.default,
|
|
2736
2684
|
{
|
|
2737
2685
|
href: isWaitlist ? "#" : ctaHref || "#",
|
|
@@ -2739,15 +2687,15 @@ var HeroSection = ({
|
|
|
2739
2687
|
className: "group inline-flex h-10 items-center gap-2 self-start rounded-full bg-[#ffffff] pl-5 pr-1 text-xs text-black transition-all hover:gap-3"
|
|
2740
2688
|
},
|
|
2741
2689
|
ctaText,
|
|
2742
|
-
/* @__PURE__ */
|
|
2743
|
-
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
2690
|
+
/* @__PURE__ */ import_react40.default.createElement("span", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-black transition-transform group-hover:scale-110" }, /* @__PURE__ */ import_react40.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "lucide lucide-arrow-right h-4 w-4 text-[#ffffff]" }, /* @__PURE__ */ import_react40.default.createElement("path", { d: "M5 12h14" }), /* @__PURE__ */ import_react40.default.createElement("path", { d: "m12 5 7 7-7 7" })))
|
|
2691
|
+
), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react40.default.createElement(
|
|
2744
2692
|
import_link6.default,
|
|
2745
2693
|
{
|
|
2746
2694
|
href: secondaryCtaHref,
|
|
2747
2695
|
className: "inline-flex h-10 items-center self-start justify-center text-xs tracking-wide rounded-full px-6 border border-[#ffffff]/30 text-[#ffffff] hover:bg-[#ffffff]/10 transition-colors"
|
|
2748
2696
|
},
|
|
2749
2697
|
secondaryCtaText
|
|
2750
|
-
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */
|
|
2698
|
+
)), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ import_react40.default.createElement("div", { className: "flex flex-col gap-3 mt-4" }, appsText && /* @__PURE__ */ import_react40.default.createElement("span", { className: "text-[10px] tracking-widest text-[#ffffff]/50 " }, appsText), /* @__PURE__ */ import_react40.default.createElement("div", { className: "flex items-center gap-4" }, appLogos.map((logo, idx) => /* @__PURE__ */ import_react40.default.createElement("div", { key: idx, className: "relative h-6 w-6 sm:h-7 sm:w-7 opacity-70 hover:opacity-100 transition-opacity invert" }, /* @__PURE__ */ import_react40.default.createElement(
|
|
2751
2699
|
import_image2.default,
|
|
2752
2700
|
{
|
|
2753
2701
|
src: logo.src,
|
|
@@ -2756,7 +2704,7 @@ var HeroSection = ({
|
|
|
2756
2704
|
height: 28,
|
|
2757
2705
|
className: "object-contain"
|
|
2758
2706
|
}
|
|
2759
|
-
))))))))), /* @__PURE__ */
|
|
2707
|
+
))))))))), /* @__PURE__ */ import_react40.default.createElement(
|
|
2760
2708
|
WaitlistDialog,
|
|
2761
2709
|
{
|
|
2762
2710
|
isOpen: isWaitlistOpen,
|
|
@@ -2766,12 +2714,12 @@ var HeroSection = ({
|
|
|
2766
2714
|
};
|
|
2767
2715
|
|
|
2768
2716
|
// src/components/AppBento2.tsx
|
|
2769
|
-
var
|
|
2770
|
-
var
|
|
2717
|
+
var import_react41 = __toESM(require("react"));
|
|
2718
|
+
var import_react42 = require("@hugeicons/react");
|
|
2771
2719
|
var AppBento2 = ({ tagline, headline, features }) => {
|
|
2772
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
2773
|
-
const titleRef = (0,
|
|
2774
|
-
(0,
|
|
2720
|
+
const [isAnimating, setIsAnimating] = (0, import_react41.useState)(false);
|
|
2721
|
+
const titleRef = (0, import_react41.useRef)(null);
|
|
2722
|
+
(0, import_react41.useEffect)(() => {
|
|
2775
2723
|
const observer = new IntersectionObserver(
|
|
2776
2724
|
([entry]) => {
|
|
2777
2725
|
if (entry.isIntersecting) {
|
|
@@ -2789,7 +2737,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2789
2737
|
}
|
|
2790
2738
|
return () => observer.disconnect();
|
|
2791
2739
|
}, []);
|
|
2792
|
-
return /* @__PURE__ */
|
|
2740
|
+
return /* @__PURE__ */ import_react41.default.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react41.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4 " }, tagline), /* @__PURE__ */ import_react41.default.createElement(
|
|
2793
2741
|
"h2",
|
|
2794
2742
|
{
|
|
2795
2743
|
ref: titleRef,
|
|
@@ -2797,7 +2745,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2797
2745
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
2798
2746
|
},
|
|
2799
2747
|
headline
|
|
2800
|
-
))), /* @__PURE__ */
|
|
2748
|
+
))), /* @__PURE__ */ import_react41.default.createElement("div", { className: "grid grid-cols-1 lg:grid-cols-6 gap-6" }, features.map((f, i) => {
|
|
2801
2749
|
const isWhite = i === 0;
|
|
2802
2750
|
const isBlack = i === 1;
|
|
2803
2751
|
const isNeutral = i === 2;
|
|
@@ -2819,32 +2767,32 @@ var AppBento2 = ({ tagline, headline, features }) => {
|
|
|
2819
2767
|
const textColor = isBlack ? "text-white" : "text-black";
|
|
2820
2768
|
const subTextColor = isBlack ? "text-neutral-300" : "text-neutral-600";
|
|
2821
2769
|
const labelColor = isBlack ? "text-neutral-400" : "text-neutral-500";
|
|
2822
|
-
return /* @__PURE__ */
|
|
2770
|
+
return /* @__PURE__ */ import_react41.default.createElement(
|
|
2823
2771
|
"div",
|
|
2824
2772
|
{
|
|
2825
2773
|
key: i,
|
|
2826
2774
|
className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-500 group text-left ${getBgStyle()} ${f.size}`,
|
|
2827
2775
|
style: { boxShadow: getShadowStyle() }
|
|
2828
2776
|
},
|
|
2829
|
-
/* @__PURE__ */
|
|
2777
|
+
/* @__PURE__ */ import_react41.default.createElement(
|
|
2830
2778
|
"div",
|
|
2831
2779
|
{
|
|
2832
2780
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
2833
2781
|
style: { backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")` }
|
|
2834
2782
|
}
|
|
2835
2783
|
),
|
|
2836
|
-
isBlack && /* @__PURE__ */
|
|
2837
|
-
/* @__PURE__ */
|
|
2838
|
-
/* @__PURE__ */
|
|
2784
|
+
isBlack && /* @__PURE__ */ import_react41.default.createElement("span", { className: "absolute inset-0 rounded-2xl bg-linear-to-b from-white/10 via-white/5 to-transparent pointer-events-none z-10" }),
|
|
2785
|
+
/* @__PURE__ */ import_react41.default.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBlack ? "text-white/5" : "text-black/5"}` }, /* @__PURE__ */ import_react41.default.createElement(import_react42.HugeiconsIcon, { icon: f.icon, size: 180 }))),
|
|
2786
|
+
/* @__PURE__ */ import_react41.default.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ import_react41.default.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ import_react41.default.createElement("span", { className: `text-[9px] tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ import_react41.default.createElement("div", { className: `p-2 rounded-full transition-colors ${isBlack ? "bg-white/10" : "bg-white/50 backdrop-blur-sm"}` }, /* @__PURE__ */ import_react41.default.createElement(import_react42.HugeiconsIcon, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ import_react41.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react41.default.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ import_react41.default.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
|
|
2839
2787
|
);
|
|
2840
2788
|
})))));
|
|
2841
2789
|
};
|
|
2842
2790
|
|
|
2843
2791
|
// src/components/UniversalSecurityPage.tsx
|
|
2844
|
-
var
|
|
2792
|
+
var import_react43 = __toESM(require("react"));
|
|
2845
2793
|
var import_react_hot_toast8 = __toESM(require("react-hot-toast"));
|
|
2846
|
-
var
|
|
2847
|
-
var
|
|
2794
|
+
var import_react44 = require("@hugeicons/react");
|
|
2795
|
+
var import_core_free_icons15 = require("@hugeicons/core-free-icons");
|
|
2848
2796
|
var import_browser2 = require("@simplewebauthn/browser");
|
|
2849
2797
|
var UniversalSecurityPage = ({
|
|
2850
2798
|
has2FA,
|
|
@@ -2860,15 +2808,15 @@ var UniversalSecurityPage = ({
|
|
|
2860
2808
|
onVerifyAndEnablePasskey,
|
|
2861
2809
|
onDisablePasskey
|
|
2862
2810
|
}) => {
|
|
2863
|
-
const [show2FASetupModal, setShow2FASetupModal] = (0,
|
|
2864
|
-
const [show2FADisableModal, setShow2FADisableModal] = (0,
|
|
2865
|
-
const [showPasskeyModal, setShowPasskeyModal] = (0,
|
|
2866
|
-
const [twoFaSecret, setTwoFaSecret] = (0,
|
|
2867
|
-
const [twoFaQr, setTwoFaQr] = (0,
|
|
2868
|
-
const [isFetchingSetup, setIsFetchingSetup] = (0,
|
|
2869
|
-
const [otp, setOtp] = (0,
|
|
2870
|
-
const [isSubmitting, setIsSubmitting] = (0,
|
|
2871
|
-
const inputRefs = (0,
|
|
2811
|
+
const [show2FASetupModal, setShow2FASetupModal] = (0, import_react43.useState)(false);
|
|
2812
|
+
const [show2FADisableModal, setShow2FADisableModal] = (0, import_react43.useState)(false);
|
|
2813
|
+
const [showPasskeyModal, setShowPasskeyModal] = (0, import_react43.useState)(false);
|
|
2814
|
+
const [twoFaSecret, setTwoFaSecret] = (0, import_react43.useState)("");
|
|
2815
|
+
const [twoFaQr, setTwoFaQr] = (0, import_react43.useState)("");
|
|
2816
|
+
const [isFetchingSetup, setIsFetchingSetup] = (0, import_react43.useState)(false);
|
|
2817
|
+
const [otp, setOtp] = (0, import_react43.useState)(Array(6).fill(""));
|
|
2818
|
+
const [isSubmitting, setIsSubmitting] = (0, import_react43.useState)(false);
|
|
2819
|
+
const inputRefs = (0, import_react43.useRef)([]);
|
|
2872
2820
|
const resetOtp = () => {
|
|
2873
2821
|
setOtp(Array(6).fill(""));
|
|
2874
2822
|
setIsSubmitting(false);
|
|
@@ -3010,18 +2958,18 @@ var UniversalSecurityPage = ({
|
|
|
3010
2958
|
setIsSubmitting(false);
|
|
3011
2959
|
}
|
|
3012
2960
|
};
|
|
3013
|
-
return /* @__PURE__ */
|
|
2961
|
+
return /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react43.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react43.default.createElement("div", { className: "mb-6 flex items-center px-1" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
3014
2962
|
"button",
|
|
3015
2963
|
{
|
|
3016
2964
|
onClick: onBack,
|
|
3017
2965
|
className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none"
|
|
3018
2966
|
},
|
|
3019
|
-
/* @__PURE__ */
|
|
2967
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.ArrowLeft01Icon, size: 16 }),
|
|
3020
2968
|
" Back"
|
|
3021
|
-
)), /* @__PURE__ */
|
|
2969
|
+
)), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react43.default.createElement(
|
|
3022
2970
|
MenuRow3,
|
|
3023
2971
|
{
|
|
3024
|
-
icon:
|
|
2972
|
+
icon: import_core_free_icons15.CircleLockCheck02Icon,
|
|
3025
2973
|
title: "Authenticator App",
|
|
3026
2974
|
subtitle: "Secure your account with 2FA",
|
|
3027
2975
|
onClick: handleToggle2FA,
|
|
@@ -3029,10 +2977,10 @@ var UniversalSecurityPage = ({
|
|
|
3029
2977
|
toggleState: has2FA,
|
|
3030
2978
|
toggleLoading: is2FALoading || isFetchingSetup
|
|
3031
2979
|
}
|
|
3032
|
-
), /* @__PURE__ */
|
|
2980
|
+
), /* @__PURE__ */ import_react43.default.createElement(
|
|
3033
2981
|
MenuRow3,
|
|
3034
2982
|
{
|
|
3035
|
-
icon:
|
|
2983
|
+
icon: import_core_free_icons15.Key01Icon,
|
|
3036
2984
|
title: "Passkeys",
|
|
3037
2985
|
subtitle: "Sign in quickly with biometrics",
|
|
3038
2986
|
onClick: handleTogglePasskey,
|
|
@@ -3041,18 +2989,18 @@ var UniversalSecurityPage = ({
|
|
|
3041
2989
|
toggleLoading: isPasskeyLoading,
|
|
3042
2990
|
isLast: true
|
|
3043
2991
|
}
|
|
3044
|
-
))), show2FASetupModal && /* @__PURE__ */
|
|
2992
|
+
))), show2FASetupModal && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FASetupModal(false) }), /* @__PURE__ */ import_react43.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable 2FA"), /* @__PURE__ */ import_react43.default.createElement("button", { onClick: () => !isSubmitting && setShow2FASetupModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, twoFaQr ? /* @__PURE__ */ import_react43.default.createElement("img", { src: twoFaQr, alt: "2FA QR Code", className: "w-40 h-40 object-contain rounded-xl border border-neutral-200 p-2" }) : /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-40 h-40 bg-neutral-100 rounded-xl flex items-center justify-center animate-pulse" })), /* @__PURE__ */ import_react43.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-8" }, /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2 uppercase" }, "Setup Key"), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center gap-2 min-w-0 bg-neutral-50 px-3 py-2.5 rounded-xl " }, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] font-mono tracking-widest text-black truncate min-w-0 block flex-1" }, twoFaSecret), /* @__PURE__ */ import_react43.default.createElement(
|
|
3045
2993
|
"button",
|
|
3046
2994
|
{
|
|
3047
2995
|
type: "button",
|
|
3048
2996
|
onClick: () => handleCopySecret(twoFaSecret),
|
|
3049
2997
|
className: "text-neutral-400 hover:text-black transition-colors outline-none shrink-0 ml-2"
|
|
3050
2998
|
},
|
|
3051
|
-
/* @__PURE__ */
|
|
3052
|
-
)))), /* @__PURE__ */
|
|
2999
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.Copy01Icon, size: 16 })
|
|
3000
|
+
)))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "text-center mb-8 mt-2" }, /* @__PURE__ */ import_react43.default.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-[13px] text-neutral-500" }, "Enter the 6-digit code from your app")), /* @__PURE__ */ import_react43.default.createElement("form", { className: "space-y-4", autoComplete: "off", onSubmit: (e) => {
|
|
3053
3001
|
e.preventDefault();
|
|
3054
3002
|
submitEnable2FA(otp.join(""));
|
|
3055
|
-
} }, /* @__PURE__ */
|
|
3003
|
+
} }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex justify-between gap-2 pb-6", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ import_react43.default.createElement(
|
|
3056
3004
|
"input",
|
|
3057
3005
|
{
|
|
3058
3006
|
key: index,
|
|
@@ -3071,7 +3019,7 @@ var UniversalSecurityPage = ({
|
|
|
3071
3019
|
},
|
|
3072
3020
|
className: "w-8 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
|
|
3073
3021
|
}
|
|
3074
|
-
))), /* @__PURE__ */
|
|
3022
|
+
))), /* @__PURE__ */ import_react43.default.createElement(
|
|
3075
3023
|
ThreeDActionButton,
|
|
3076
3024
|
{
|
|
3077
3025
|
type: "submit",
|
|
@@ -3080,19 +3028,19 @@ var UniversalSecurityPage = ({
|
|
|
3080
3028
|
className: "w-full py-3.5"
|
|
3081
3029
|
},
|
|
3082
3030
|
"Verify & Enable"
|
|
3083
|
-
), /* @__PURE__ */
|
|
3031
|
+
), /* @__PURE__ */ import_react43.default.createElement(
|
|
3084
3032
|
"button",
|
|
3085
3033
|
{
|
|
3086
3034
|
type: "button",
|
|
3087
3035
|
onClick: () => handleCopySecret(twoFaSecret),
|
|
3088
3036
|
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors mt-2"
|
|
3089
3037
|
},
|
|
3090
|
-
/* @__PURE__ */
|
|
3038
|
+
/* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.Copy01Icon, size: 16, className: "mr-2" }),
|
|
3091
3039
|
"Copy Secret Key"
|
|
3092
|
-
))))), show2FADisableModal && /* @__PURE__ */
|
|
3040
|
+
))))), show2FADisableModal && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FADisableModal(false) }), /* @__PURE__ */ import_react43.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Disable 2FA"), /* @__PURE__ */ import_react43.default.createElement("button", { onClick: () => !isSubmitting && setShow2FADisableModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "p-6" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "text-center mb-8 mt-2" }, /* @__PURE__ */ import_react43.default.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-[13px] text-neutral-500" }, "Enter the code from your authenticator app to disable 2FA.")), /* @__PURE__ */ import_react43.default.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
|
|
3093
3041
|
e.preventDefault();
|
|
3094
3042
|
submitDisable2FA(otp.join(""));
|
|
3095
|
-
} }, /* @__PURE__ */
|
|
3043
|
+
} }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ import_react43.default.createElement(
|
|
3096
3044
|
"input",
|
|
3097
3045
|
{
|
|
3098
3046
|
key: index,
|
|
@@ -3111,7 +3059,7 @@ var UniversalSecurityPage = ({
|
|
|
3111
3059
|
},
|
|
3112
3060
|
className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
|
|
3113
3061
|
}
|
|
3114
|
-
))), /* @__PURE__ */
|
|
3062
|
+
))), /* @__PURE__ */ import_react43.default.createElement(
|
|
3115
3063
|
ThreeDActionButton,
|
|
3116
3064
|
{
|
|
3117
3065
|
type: "submit",
|
|
@@ -3120,7 +3068,7 @@ var UniversalSecurityPage = ({
|
|
|
3120
3068
|
className: "w-full py-3.5"
|
|
3121
3069
|
},
|
|
3122
3070
|
"Verify & Disable"
|
|
3123
|
-
))))), showPasskeyModal && /* @__PURE__ */
|
|
3071
|
+
))))), showPasskeyModal && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShowPasskeyModal(false) }), /* @__PURE__ */ import_react43.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable Passkey"), /* @__PURE__ */ import_react43.default.createElement("button", { onClick: () => !isSubmitting && setShowPasskeyModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "p-6 text-center" }, /* @__PURE__ */ import_react43.default.createElement("h2", { className: "text-lg text-black mb-2 tracking-tight" }, "Simplify your Sign In"), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-[13px] text-neutral-500 mb-8 leading-relaxed" }, "Use your device's biometrics (Face ID, Touch ID, or PIN) to securely sign into your account without needing a password."), /* @__PURE__ */ import_react43.default.createElement(
|
|
3124
3072
|
ThreeDActionButton,
|
|
3125
3073
|
{
|
|
3126
3074
|
onClick: submitEnablePasskey,
|
|
@@ -3142,26 +3090,26 @@ var MenuRow3 = ({
|
|
|
3142
3090
|
toggleState = false,
|
|
3143
3091
|
toggleLoading = false,
|
|
3144
3092
|
disabled = false
|
|
3145
|
-
}) => /* @__PURE__ */
|
|
3093
|
+
}) => /* @__PURE__ */ import_react43.default.createElement(
|
|
3146
3094
|
"div",
|
|
3147
3095
|
{
|
|
3148
3096
|
onClick: disabled ? void 0 : onClick,
|
|
3149
3097
|
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-neutral-50"}`
|
|
3150
3098
|
},
|
|
3151
|
-
/* @__PURE__ */
|
|
3152
|
-
/* @__PURE__ */
|
|
3153
|
-
isToggle ? /* @__PURE__ */
|
|
3099
|
+
/* @__PURE__ */ import_react43.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon, size: 16, className: iconColor })),
|
|
3100
|
+
/* @__PURE__ */ import_react43.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react43.default.createElement("p", { className: `text-[14px] truncate ${titleColor}` }, title), /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, subtitle)),
|
|
3101
|
+
isToggle ? /* @__PURE__ */ import_react43.default.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-neutral-200"} ${disabled ? "opacity-50" : ""}` }, /* @__PURE__ */ import_react43.default.createElement("div", { className: `absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 flex items-center justify-center ${toggleState ? "translate-x-5" : "translate-x-0"}` }, toggleLoading && /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.Loading03Icon, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons15.ArrowRight01Icon, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
3154
3102
|
);
|
|
3155
3103
|
|
|
3156
3104
|
// src/components/FeatureScroll.tsx
|
|
3157
|
-
var
|
|
3105
|
+
var import_react45 = __toESM(require("react"));
|
|
3158
3106
|
var import_image3 = __toESM(require("next/image"));
|
|
3159
|
-
var
|
|
3160
|
-
var
|
|
3107
|
+
var import_react46 = require("@hugeicons/react");
|
|
3108
|
+
var import_core_free_icons16 = require("@hugeicons/core-free-icons");
|
|
3161
3109
|
var FeatureCard = ({ feature, bgImage }) => {
|
|
3162
|
-
const [isBgLoading, setIsBgLoading] = (0,
|
|
3163
|
-
const [isFgLoading, setIsFgLoading] = (0,
|
|
3164
|
-
return /* @__PURE__ */
|
|
3110
|
+
const [isBgLoading, setIsBgLoading] = (0, import_react45.useState)(true);
|
|
3111
|
+
const [isFgLoading, setIsFgLoading] = (0, import_react45.useState)(!!feature.image);
|
|
3112
|
+
return /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ import_react45.default.createElement(
|
|
3165
3113
|
import_image3.default,
|
|
3166
3114
|
{
|
|
3167
3115
|
src: bgImage,
|
|
@@ -3174,7 +3122,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
3174
3122
|
${isBgLoading ? "blur-xl scale-110" : "blur-0 scale-100"}
|
|
3175
3123
|
`
|
|
3176
3124
|
}
|
|
3177
|
-
), /* @__PURE__ */
|
|
3125
|
+
), /* @__PURE__ */ import_react45.default.createElement(
|
|
3178
3126
|
"div",
|
|
3179
3127
|
{
|
|
3180
3128
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
@@ -3182,7 +3130,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
3182
3130
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
3183
3131
|
}
|
|
3184
3132
|
}
|
|
3185
|
-
), isFgLoading && feature.image && /* @__PURE__ */
|
|
3133
|
+
), isFgLoading && feature.image && /* @__PURE__ */ import_react45.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-50/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.Loading03Icon, size: 32, className: "animate-spin text-neutral-400" })), feature.image && /* @__PURE__ */ import_react45.default.createElement("div", { className: "absolute -bottom-6 -right-6 w-[85%] h-[85%] z-10 transition-transform duration-700 ease-out group-hover:-translate-x-2 group-hover:-translate-y-2" }, /* @__PURE__ */ import_react45.default.createElement(
|
|
3186
3134
|
import_image3.default,
|
|
3187
3135
|
{
|
|
3188
3136
|
src: feature.image,
|
|
@@ -3195,12 +3143,12 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
3195
3143
|
${isFgLoading ? "opacity-0 blur-xl" : "opacity-100 blur-0"}
|
|
3196
3144
|
`
|
|
3197
3145
|
}
|
|
3198
|
-
))), /* @__PURE__ */
|
|
3146
|
+
))), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ import_react45.default.createElement("h3", { className: " text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 max-w-[90%]" }, feature.desc)));
|
|
3199
3147
|
};
|
|
3200
3148
|
var FeatureScroll = ({ tagline, headline, features }) => {
|
|
3201
|
-
const scrollRef = (0,
|
|
3202
|
-
const [canScrollLeft, setCanScrollLeft] = (0,
|
|
3203
|
-
const [canScrollRight, setCanScrollRight] = (0,
|
|
3149
|
+
const scrollRef = (0, import_react45.useRef)(null);
|
|
3150
|
+
const [canScrollLeft, setCanScrollLeft] = (0, import_react45.useState)(false);
|
|
3151
|
+
const [canScrollRight, setCanScrollRight] = (0, import_react45.useState)(true);
|
|
3204
3152
|
const checkScroll = () => {
|
|
3205
3153
|
if (scrollRef.current) {
|
|
3206
3154
|
const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
|
|
@@ -3208,7 +3156,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3208
3156
|
setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
|
|
3209
3157
|
}
|
|
3210
3158
|
};
|
|
3211
|
-
(0,
|
|
3159
|
+
(0, import_react45.useEffect)(() => {
|
|
3212
3160
|
checkScroll();
|
|
3213
3161
|
window.addEventListener("resize", checkScroll);
|
|
3214
3162
|
return () => window.removeEventListener("resize", checkScroll);
|
|
@@ -3224,72 +3172,72 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3224
3172
|
"https://retinalabs.company/assets/images/bg_6.avif",
|
|
3225
3173
|
"https://retinalabs.company/assets/images/bg_1.avif"
|
|
3226
3174
|
];
|
|
3227
|
-
return /* @__PURE__ */
|
|
3175
|
+
return /* @__PURE__ */ import_react45.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react45.default.createElement("h2", { className: " text-3xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ import_react45.default.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ import_react45.default.createElement(
|
|
3228
3176
|
"button",
|
|
3229
3177
|
{
|
|
3230
3178
|
onClick: () => scroll("left"),
|
|
3231
3179
|
disabled: !canScrollLeft,
|
|
3232
3180
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none"
|
|
3233
3181
|
},
|
|
3234
|
-
/* @__PURE__ */
|
|
3235
|
-
), /* @__PURE__ */
|
|
3182
|
+
/* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.ArrowLeft01Icon, size: 20 })
|
|
3183
|
+
), /* @__PURE__ */ import_react45.default.createElement(
|
|
3236
3184
|
"button",
|
|
3237
3185
|
{
|
|
3238
3186
|
onClick: () => scroll("right"),
|
|
3239
3187
|
disabled: !canScrollRight,
|
|
3240
3188
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:hover:border-neutral-200 disabled:hover:text-neutral-500 disabled:cursor-not-allowed transition-all outline-none"
|
|
3241
3189
|
},
|
|
3242
|
-
/* @__PURE__ */
|
|
3243
|
-
))), /* @__PURE__ */
|
|
3190
|
+
/* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.ArrowRight01Icon, size: 20 })
|
|
3191
|
+
))), /* @__PURE__ */ import_react45.default.createElement(
|
|
3244
3192
|
"div",
|
|
3245
3193
|
{
|
|
3246
3194
|
ref: scrollRef,
|
|
3247
3195
|
onScroll: checkScroll,
|
|
3248
3196
|
className: "flex gap-6 overflow-x-auto snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] scrollbar-none pb-8 -mx-4 px-4 md:mx-0 md:px-0"
|
|
3249
3197
|
},
|
|
3250
|
-
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */
|
|
3251
|
-
), /* @__PURE__ */
|
|
3198
|
+
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */ import_react45.default.createElement(FeatureCard, { key: idx, feature, bgImage: bgImages[idx] }))
|
|
3199
|
+
), /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ import_react45.default.createElement(
|
|
3252
3200
|
"button",
|
|
3253
3201
|
{
|
|
3254
3202
|
onClick: () => scroll("left"),
|
|
3255
3203
|
disabled: !canScrollLeft,
|
|
3256
3204
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
3257
3205
|
},
|
|
3258
|
-
/* @__PURE__ */
|
|
3259
|
-
), /* @__PURE__ */
|
|
3206
|
+
/* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.ArrowLeft01Icon, size: 20 })
|
|
3207
|
+
), /* @__PURE__ */ import_react45.default.createElement(
|
|
3260
3208
|
"button",
|
|
3261
3209
|
{
|
|
3262
3210
|
onClick: () => scroll("right"),
|
|
3263
3211
|
disabled: !canScrollRight,
|
|
3264
3212
|
className: "p-4 border border-neutral-200 rounded-full text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 transition-all outline-none"
|
|
3265
3213
|
},
|
|
3266
|
-
/* @__PURE__ */
|
|
3214
|
+
/* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.ArrowRight01Icon, size: 20 })
|
|
3267
3215
|
))));
|
|
3268
3216
|
};
|
|
3269
3217
|
|
|
3270
3218
|
// src/components/PlatformFeatures.tsx
|
|
3271
|
-
var
|
|
3272
|
-
var
|
|
3219
|
+
var import_react47 = __toESM(require("react"));
|
|
3220
|
+
var import_react48 = require("@hugeicons/react");
|
|
3273
3221
|
var PlatformFeatures = ({
|
|
3274
3222
|
tagline,
|
|
3275
3223
|
headline,
|
|
3276
3224
|
description,
|
|
3277
3225
|
features
|
|
3278
3226
|
}) => {
|
|
3279
|
-
return /* @__PURE__ */
|
|
3227
|
+
return /* @__PURE__ */ import_react47.default.createElement("section", { className: "w-full flex justify-center mb-15 relative z-10" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "flex flex-col items-start mb-16 relative z-10" }, /* @__PURE__ */ import_react47.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ import_react47.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.05] mb-6" }, headline), /* @__PURE__ */ import_react47.default.createElement("p", { className: "text-[15px] leading-[1.8] text-neutral-600 max-w-2xl" }, description)), /* @__PURE__ */ import_react47.default.createElement("div", { className: "w-full h-px bg-neutral-100 mb-16", "aria-hidden": "true" }), /* @__PURE__ */ import_react47.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-8 gap-y-12" }, features.map((feature, idx) => /* @__PURE__ */ import_react47.default.createElement(
|
|
3280
3228
|
"div",
|
|
3281
3229
|
{
|
|
3282
3230
|
key: idx,
|
|
3283
3231
|
className: "flex flex-col group animate-in fade-in slide-in-from-bottom-4 duration-700 fill-mode-both",
|
|
3284
3232
|
style: { animationDelay: feature.delay || "0ms" }
|
|
3285
3233
|
},
|
|
3286
|
-
/* @__PURE__ */
|
|
3287
|
-
/* @__PURE__ */
|
|
3234
|
+
/* @__PURE__ */ import_react47.default.createElement("div", { className: "flex flex-row items-center gap-4 mb-4" }, /* @__PURE__ */ import_react47.default.createElement("div", { className: "w-14 h-14 shrink-0 rounded-xl border border-neutral-200 flex items-center justify-center text-neutral-600 transition-colors duration-300" }, /* @__PURE__ */ import_react47.default.createElement(import_react48.HugeiconsIcon, { icon: feature.icon, size: 24 })), /* @__PURE__ */ import_react47.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react47.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 mb-0.5" }, feature.label || "CAPABILITY"), /* @__PURE__ */ import_react47.default.createElement("h3", { className: "text-xl tracking-tight text-black" }, feature.title))),
|
|
3235
|
+
/* @__PURE__ */ import_react47.default.createElement("div", null, /* @__PURE__ */ import_react47.default.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 pr-4" }, feature.desc))
|
|
3288
3236
|
)))));
|
|
3289
3237
|
};
|
|
3290
3238
|
|
|
3291
3239
|
// src/components/ManagedDocument.tsx
|
|
3292
|
-
var
|
|
3240
|
+
var import_react49 = __toESM(require("react"));
|
|
3293
3241
|
var ManagedDocument = ({
|
|
3294
3242
|
tagline,
|
|
3295
3243
|
title,
|
|
@@ -3297,9 +3245,9 @@ var ManagedDocument = ({
|
|
|
3297
3245
|
contactText,
|
|
3298
3246
|
contactEmail
|
|
3299
3247
|
}) => {
|
|
3300
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
3301
|
-
const titleRef = (0,
|
|
3302
|
-
(0,
|
|
3248
|
+
const [isAnimating, setIsAnimating] = (0, import_react49.useState)(false);
|
|
3249
|
+
const titleRef = (0, import_react49.useRef)(null);
|
|
3250
|
+
(0, import_react49.useEffect)(() => {
|
|
3303
3251
|
const observer = new IntersectionObserver(
|
|
3304
3252
|
([entry]) => {
|
|
3305
3253
|
if (entry.isIntersecting) {
|
|
@@ -3319,7 +3267,7 @@ var ManagedDocument = ({
|
|
|
3319
3267
|
}, []);
|
|
3320
3268
|
return (
|
|
3321
3269
|
// Outer layout wrapper (takes up available space, adds padding)
|
|
3322
|
-
/* @__PURE__ */
|
|
3270
|
+
/* @__PURE__ */ import_react49.default.createElement("div", { className: "grow pt-4 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react49.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react49.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react49.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react49.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react49.default.createElement(
|
|
3323
3271
|
"h1",
|
|
3324
3272
|
{
|
|
3325
3273
|
ref: titleRef,
|
|
@@ -3327,7 +3275,7 @@ var ManagedDocument = ({
|
|
|
3327
3275
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
3328
3276
|
},
|
|
3329
3277
|
title
|
|
3330
|
-
)), sections.map((section, index) => /* @__PURE__ */
|
|
3278
|
+
)), sections.map((section, index) => /* @__PURE__ */ import_react49.default.createElement("div", { key: index, className: "relative px-5 md:px-12 py-8 md:py-10" }, section.heading && /* @__PURE__ */ import_react49.default.createElement("p", { className: " text-[11px] tracking-[0.2em] text-black mb-4 text-left " }, section.heading), section.paragraphs && section.paragraphs.length > 0 && /* @__PURE__ */ import_react49.default.createElement("div", { className: "text-[14px] leading-[1.8] text-neutral-700 space-y-4 text-left " }, section.paragraphs.map((text, pIndex) => /* @__PURE__ */ import_react49.default.createElement("p", { key: pIndex }, text))), section.quote && /* @__PURE__ */ import_react49.default.createElement("div", { className: `border-neutral-200 border rounded-xl p-6 ${section.paragraphs && section.paragraphs.length > 0 ? "mt-6" : ""}` }, /* @__PURE__ */ import_react49.default.createElement("p", { className: "text-neutral-900 text-[14px] md:text-[14px] leading-relaxed" }, '"', section.quote, '"')))), (contactText || contactEmail) && /* @__PURE__ */ import_react49.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react49.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react49.default.createElement(
|
|
3331
3279
|
"a",
|
|
3332
3280
|
{
|
|
3333
3281
|
href: `mailto:${contactEmail}`,
|
|
@@ -3339,18 +3287,18 @@ var ManagedDocument = ({
|
|
|
3339
3287
|
};
|
|
3340
3288
|
|
|
3341
3289
|
// src/components/ManagedContactBlock.tsx
|
|
3342
|
-
var
|
|
3343
|
-
var
|
|
3290
|
+
var import_react50 = __toESM(require("react"));
|
|
3291
|
+
var import_react51 = require("@hugeicons/react");
|
|
3344
3292
|
var SecureEmail = ({ user, domain, className }) => {
|
|
3345
|
-
const [isMounted, setIsMounted] = (0,
|
|
3346
|
-
(0,
|
|
3293
|
+
const [isMounted, setIsMounted] = (0, import_react50.useState)(false);
|
|
3294
|
+
(0, import_react50.useEffect)(() => {
|
|
3347
3295
|
setIsMounted(true);
|
|
3348
3296
|
}, []);
|
|
3349
3297
|
if (!isMounted) {
|
|
3350
|
-
return /* @__PURE__ */
|
|
3298
|
+
return /* @__PURE__ */ import_react50.default.createElement("span", { className, style: { opacity: 0 } }, "Loading");
|
|
3351
3299
|
}
|
|
3352
3300
|
const email = `${user}@${domain}`;
|
|
3353
|
-
return /* @__PURE__ */
|
|
3301
|
+
return /* @__PURE__ */ import_react50.default.createElement("a", { href: `mailto:${email}`, className }, email);
|
|
3354
3302
|
};
|
|
3355
3303
|
var ManagedContactBlock = ({
|
|
3356
3304
|
tagline,
|
|
@@ -3359,7 +3307,7 @@ var ManagedContactBlock = ({
|
|
|
3359
3307
|
emails,
|
|
3360
3308
|
socials
|
|
3361
3309
|
}) => {
|
|
3362
|
-
return /* @__PURE__ */
|
|
3310
|
+
return /* @__PURE__ */ import_react50.default.createElement("div", { className: "grow pt-4 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react50.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-7xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react50.default.createElement(
|
|
3363
3311
|
"div",
|
|
3364
3312
|
{
|
|
3365
3313
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -3368,21 +3316,21 @@ var ManagedContactBlock = ({
|
|
|
3368
3316
|
backgroundRepeat: "repeat"
|
|
3369
3317
|
}
|
|
3370
3318
|
}
|
|
3371
|
-
), /* @__PURE__ */
|
|
3319
|
+
), /* @__PURE__ */ import_react50.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react50.default.createElement("div", { className: "relative px-8 md:px-12 py-10" }, tagline && /* @__PURE__ */ import_react50.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react50.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react50.default.createElement("div", { className: "relative px-8 md:px-12 py-8 pb-14" }, /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex flex-wrap gap-12 lg:gap-16 w-full" }, company && /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react50.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Contact Details"), /* @__PURE__ */ import_react50.default.createElement("div", { className: "space-y-3 text-[13px] text-neutral-600 leading-[1.8]" }, company.name && /* @__PURE__ */ import_react50.default.createElement("p", { className: "text-black" }, company.name), company.lines && company.lines.map((line, idx) => /* @__PURE__ */ import_react50.default.createElement("p", { key: idx }, line)), company.phone && /* @__PURE__ */ import_react50.default.createElement("p", { className: "pt-2" }, /* @__PURE__ */ import_react50.default.createElement(
|
|
3372
3320
|
"a",
|
|
3373
3321
|
{
|
|
3374
3322
|
href: `tel:${company.phone.replace(/\s+/g, "")}`,
|
|
3375
3323
|
className: "transition-colors hover:text-black"
|
|
3376
3324
|
},
|
|
3377
3325
|
company.phone
|
|
3378
|
-
)))), emails && emails.length > 0 && /* @__PURE__ */
|
|
3326
|
+
)))), emails && emails.length > 0 && /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react50.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Email Directory"), /* @__PURE__ */ import_react50.default.createElement("div", { className: "space-y-6 text-[13px]" }, emails.map((email, idx) => /* @__PURE__ */ import_react50.default.createElement("div", { key: idx }, /* @__PURE__ */ import_react50.default.createElement("p", { className: "text-[11px] tracking-[0.2em] mb-1.5 text-neutral-500 " }, email.label), /* @__PURE__ */ import_react50.default.createElement(
|
|
3379
3327
|
SecureEmail,
|
|
3380
3328
|
{
|
|
3381
3329
|
user: email.user,
|
|
3382
3330
|
domain: email.domain,
|
|
3383
3331
|
className: "text-neutral-600 transition-colors hover:text-black"
|
|
3384
3332
|
}
|
|
3385
|
-
))))), socials && socials.length > 0 && /* @__PURE__ */
|
|
3333
|
+
))))), socials && socials.length > 0 && /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex-1 min-w-65 space-y-6" }, /* @__PURE__ */ import_react50.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-black mb-4 " }, "Find Us Online"), /* @__PURE__ */ import_react50.default.createElement("div", { className: "flex flex-col space-y-5 pt-1" }, socials.map((social, idx) => /* @__PURE__ */ import_react50.default.createElement(
|
|
3386
3334
|
"a",
|
|
3387
3335
|
{
|
|
3388
3336
|
key: idx,
|
|
@@ -3391,27 +3339,27 @@ var ManagedContactBlock = ({
|
|
|
3391
3339
|
rel: "noopener noreferrer",
|
|
3392
3340
|
className: "flex items-center gap-3 transition-colors group text-neutral-600 hover:text-black"
|
|
3393
3341
|
},
|
|
3394
|
-
/* @__PURE__ */
|
|
3395
|
-
/* @__PURE__ */
|
|
3342
|
+
/* @__PURE__ */ import_react50.default.createElement(import_react51.HugeiconsIcon, { icon: social.icon, size: 18 }),
|
|
3343
|
+
/* @__PURE__ */ import_react50.default.createElement("span", { className: "text-[13px]" }, social.label)
|
|
3396
3344
|
)))))))));
|
|
3397
3345
|
};
|
|
3398
3346
|
|
|
3399
3347
|
// src/components/ManagedPricingBlock.tsx
|
|
3400
|
-
var
|
|
3348
|
+
var import_react52 = __toESM(require("react"));
|
|
3401
3349
|
var import_link7 = __toESM(require("next/link"));
|
|
3402
3350
|
var import_image4 = __toESM(require("next/image"));
|
|
3403
|
-
var CheckIcon = ({ className = "" }) => /* @__PURE__ */
|
|
3404
|
-
var CrossIcon = ({ className = "" }) => /* @__PURE__ */
|
|
3351
|
+
var CheckIcon = ({ className = "" }) => /* @__PURE__ */ import_react52.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react52.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ import_react52.default.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
3352
|
+
var CrossIcon = ({ className = "" }) => /* @__PURE__ */ import_react52.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react52.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ import_react52.default.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
3405
3353
|
var ManagedPricingBlock = ({
|
|
3406
3354
|
tagline,
|
|
3407
3355
|
title,
|
|
3408
3356
|
plans = [],
|
|
3409
3357
|
tabs
|
|
3410
3358
|
}) => {
|
|
3411
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
3412
|
-
const [activeTabIndex, setActiveTabIndex] = (0,
|
|
3413
|
-
const titleRef = (0,
|
|
3414
|
-
(0,
|
|
3359
|
+
const [isAnimating, setIsAnimating] = (0, import_react52.useState)(false);
|
|
3360
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react52.useState)(0);
|
|
3361
|
+
const titleRef = (0, import_react52.useRef)(null);
|
|
3362
|
+
(0, import_react52.useEffect)(() => {
|
|
3415
3363
|
const observer = new IntersectionObserver(
|
|
3416
3364
|
([entry]) => {
|
|
3417
3365
|
if (entry.isIntersecting) {
|
|
@@ -3431,7 +3379,7 @@ var ManagedPricingBlock = ({
|
|
|
3431
3379
|
}, []);
|
|
3432
3380
|
const hasTabs = tabs && tabs.length > 0;
|
|
3433
3381
|
const currentPlans = hasTabs ? tabs[activeTabIndex].plans : plans;
|
|
3434
|
-
return /* @__PURE__ */
|
|
3382
|
+
return /* @__PURE__ */ import_react52.default.createElement("div", { className: "grow pt-10 pb-20 px-4 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react52.default.createElement("div", { className: "w-full max-w-5xl mx-auto flex flex-col items-center" }, /* @__PURE__ */ import_react52.default.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 sm:mb-12" }, tagline && /* @__PURE__ */ import_react52.default.createElement("span", { className: "text-[9px] tracking-[0.4em] text-black block " }, tagline), /* @__PURE__ */ import_react52.default.createElement(
|
|
3435
3383
|
"h1",
|
|
3436
3384
|
{
|
|
3437
3385
|
ref: titleRef,
|
|
@@ -3439,9 +3387,9 @@ var ManagedPricingBlock = ({
|
|
|
3439
3387
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
3440
3388
|
},
|
|
3441
3389
|
title
|
|
3442
|
-
)), hasTabs && /* @__PURE__ */
|
|
3390
|
+
)), hasTabs && /* @__PURE__ */ import_react52.default.createElement("div", { className: "flex items-center justify-center mb-8 sm:mb-10 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ import_react52.default.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar" }, tabs.map((tab, idx) => {
|
|
3443
3391
|
const isActive = activeTabIndex === idx;
|
|
3444
|
-
return /* @__PURE__ */
|
|
3392
|
+
return /* @__PURE__ */ import_react52.default.createElement(
|
|
3445
3393
|
"button",
|
|
3446
3394
|
{
|
|
3447
3395
|
key: idx,
|
|
@@ -3450,19 +3398,19 @@ var ManagedPricingBlock = ({
|
|
|
3450
3398
|
},
|
|
3451
3399
|
tab.label
|
|
3452
3400
|
);
|
|
3453
|
-
}))), /* @__PURE__ */
|
|
3401
|
+
}))), /* @__PURE__ */ import_react52.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl animate-in slide-in-from-bottom-2 fade-in duration-500" }, currentPlans.map((plan, planIdx) => /* @__PURE__ */ import_react52.default.createElement(
|
|
3454
3402
|
"div",
|
|
3455
3403
|
{
|
|
3456
3404
|
key: `${activeTabIndex}-${planIdx}`,
|
|
3457
3405
|
className: `bg-white rounded-3xl p-6 flex flex-col relative overflow-hidden transition-all duration-300 ${plan.isPremium ? "" : ""}`
|
|
3458
3406
|
},
|
|
3459
|
-
/* @__PURE__ */
|
|
3407
|
+
/* @__PURE__ */ import_react52.default.createElement("div", { className: "mb-6" }, /* @__PURE__ */ import_react52.default.createElement("span", { className: "text-black text-base block mb-1" }, plan.name), /* @__PURE__ */ import_react52.default.createElement("div", { className: "flex items-baseline gap-1" }, /* @__PURE__ */ import_react52.default.createElement("h3", { className: "text-3xl font-light text-black" }, plan.price), plan.period && /* @__PURE__ */ import_react52.default.createElement("span", { className: "text-xs text-neutral-500" }, plan.period)), /* @__PURE__ */ import_react52.default.createElement("p", { className: "text-xs text-neutral-500 mt-2 min-h-8" }, plan.description), plan.showApps && plan.appLogos && plan.appLogos.length > 0 && /* @__PURE__ */ import_react52.default.createElement("div", { className: "flex items-center gap-2 mt-4" }, plan.appLogos.map((logo, logoIdx) => /* @__PURE__ */ import_react52.default.createElement(
|
|
3460
3408
|
"div",
|
|
3461
3409
|
{
|
|
3462
3410
|
key: logoIdx,
|
|
3463
3411
|
className: "relative w-5 h-5 overflow-hidden flex items-center justify-center shrink-0"
|
|
3464
3412
|
},
|
|
3465
|
-
/* @__PURE__ */
|
|
3413
|
+
/* @__PURE__ */ import_react52.default.createElement(
|
|
3466
3414
|
import_image4.default,
|
|
3467
3415
|
{
|
|
3468
3416
|
src: logo.src,
|
|
@@ -3473,7 +3421,7 @@ var ManagedPricingBlock = ({
|
|
|
3473
3421
|
}
|
|
3474
3422
|
)
|
|
3475
3423
|
)))),
|
|
3476
|
-
plan.isPremium ? /* @__PURE__ */
|
|
3424
|
+
plan.isPremium ? /* @__PURE__ */ import_react52.default.createElement(ThreeDButton, { href: plan.ctaHref, className: "mb-6 w-full" }, plan.ctaText) : /* @__PURE__ */ import_react52.default.createElement(
|
|
3477
3425
|
import_link7.default,
|
|
3478
3426
|
{
|
|
3479
3427
|
href: plan.ctaHref,
|
|
@@ -3481,20 +3429,20 @@ var ManagedPricingBlock = ({
|
|
|
3481
3429
|
},
|
|
3482
3430
|
plan.ctaText
|
|
3483
3431
|
),
|
|
3484
|
-
/* @__PURE__ */
|
|
3432
|
+
/* @__PURE__ */ import_react52.default.createElement("div", { className: "flex flex-col gap-3" }, plan.features.map((feature, featureIdx) => {
|
|
3485
3433
|
const isAvailable = feature.value !== false;
|
|
3486
3434
|
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
3487
|
-
return /* @__PURE__ */
|
|
3435
|
+
return /* @__PURE__ */ import_react52.default.createElement("div", { key: featureIdx, className: "flex items-center gap-2.5" }, isAvailable ? /* @__PURE__ */ import_react52.default.createElement(CheckIcon, null) : /* @__PURE__ */ import_react52.default.createElement(CrossIcon, null), /* @__PURE__ */ import_react52.default.createElement("span", { className: `text-xs truncate ${isAvailable ? "text-neutral-800" : "text-neutral-400"}` }, feature.name, valueText && /* @__PURE__ */ import_react52.default.createElement("span", { className: "text-neutral-500 ml-1" }, "(", valueText, ")")));
|
|
3488
3436
|
}))
|
|
3489
3437
|
)))));
|
|
3490
3438
|
};
|
|
3491
3439
|
|
|
3492
3440
|
// src/components/ManagedBoardBlock.tsx
|
|
3493
|
-
var
|
|
3441
|
+
var import_react53 = __toESM(require("react"));
|
|
3494
3442
|
var import_image5 = __toESM(require("next/image"));
|
|
3495
|
-
var
|
|
3496
|
-
var
|
|
3497
|
-
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */
|
|
3443
|
+
var import_react54 = require("@hugeicons/react");
|
|
3444
|
+
var import_core_free_icons17 = require("@hugeicons/core-free-icons");
|
|
3445
|
+
var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_react53.default.createElement(
|
|
3498
3446
|
"a",
|
|
3499
3447
|
{
|
|
3500
3448
|
href,
|
|
@@ -3502,7 +3450,7 @@ var MemberSocialLink = ({ href, icon, label, name }) => /* @__PURE__ */ import_r
|
|
|
3502
3450
|
rel: "noopener noreferrer",
|
|
3503
3451
|
className: "text-neutral-400 hover:text-black transition-colors"
|
|
3504
3452
|
},
|
|
3505
|
-
/* @__PURE__ */
|
|
3453
|
+
/* @__PURE__ */ import_react53.default.createElement(import_react54.HugeiconsIcon, { icon, size: 16 })
|
|
3506
3454
|
);
|
|
3507
3455
|
var ManagedBoardBlock = ({
|
|
3508
3456
|
tagline,
|
|
@@ -3511,7 +3459,7 @@ var ManagedBoardBlock = ({
|
|
|
3511
3459
|
contactText,
|
|
3512
3460
|
contactEmail
|
|
3513
3461
|
}) => {
|
|
3514
|
-
return /* @__PURE__ */
|
|
3462
|
+
return /* @__PURE__ */ import_react53.default.createElement("div", { className: "grow pt-4 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "relative w-full mx-auto overflow-hidden max-w-7xl" }, /* @__PURE__ */ import_react53.default.createElement(
|
|
3515
3463
|
"div",
|
|
3516
3464
|
{
|
|
3517
3465
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -3520,7 +3468,7 @@ var ManagedBoardBlock = ({
|
|
|
3520
3468
|
backgroundRepeat: "repeat"
|
|
3521
3469
|
}
|
|
3522
3470
|
}
|
|
3523
|
-
), /* @__PURE__ */
|
|
3471
|
+
), /* @__PURE__ */ import_react53.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10" }, tagline && /* @__PURE__ */ import_react53.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react53.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), /* @__PURE__ */ import_react53.default.createElement("div", { className: "relative px-5 md:px-12 py-4 md:py-8" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 md:gap-8" }, members.map((member, idx) => /* @__PURE__ */ import_react53.default.createElement("div", { key: idx, className: "relative p-6 md:p-8 rounded-2xl bg-white flex flex-col transition-all group" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "flex items-start space-x-4 md:space-x-5 mb-5 md:mb-6" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "relative w-14 h-14 md:w-16 md:h-16 shrink-0 bg-white overflow-hidden rounded-xl" }, /* @__PURE__ */ import_react53.default.createElement(
|
|
3524
3472
|
import_image5.default,
|
|
3525
3473
|
{
|
|
3526
3474
|
src: member.imageSrc,
|
|
@@ -3529,44 +3477,44 @@ var ManagedBoardBlock = ({
|
|
|
3529
3477
|
sizes: "(max-width: 768px) 56px, 64px",
|
|
3530
3478
|
className: "object-cover grayscale opacity-100 transition-opacity"
|
|
3531
3479
|
}
|
|
3532
|
-
)), /* @__PURE__ */
|
|
3480
|
+
)), /* @__PURE__ */ import_react53.default.createElement("div", { className: "pt-1" }, /* @__PURE__ */ import_react53.default.createElement("h3", { className: " text-[14px] md:text-[15px] text-black tracking-tight" }, member.name), /* @__PURE__ */ import_react53.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 mt-1.5 " }, member.title))), /* @__PURE__ */ import_react53.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 text-left grow mb-8" }, member.bio), /* @__PURE__ */ import_react53.default.createElement("div", { className: "space-y-6 mt-auto" }, /* @__PURE__ */ import_react53.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react53.default.createElement(ThreeDButton, { href: member.website }, "Visit Website")), /* @__PURE__ */ import_react53.default.createElement("div", { className: "flex space-x-4 pt-5" }, member.twitterHandle && member.twitterHandle.length > 0 && /* @__PURE__ */ import_react53.default.createElement(
|
|
3533
3481
|
MemberSocialLink,
|
|
3534
3482
|
{
|
|
3535
3483
|
href: `https://x.com/${member.twitterHandle}`,
|
|
3536
|
-
icon:
|
|
3484
|
+
icon: import_core_free_icons17.TwitterIcon,
|
|
3537
3485
|
label: "X",
|
|
3538
3486
|
name: member.name
|
|
3539
3487
|
}
|
|
3540
|
-
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */
|
|
3488
|
+
), member.linkedinHandle && member.linkedinHandle.length > 0 && /* @__PURE__ */ import_react53.default.createElement(
|
|
3541
3489
|
MemberSocialLink,
|
|
3542
3490
|
{
|
|
3543
3491
|
href: member.linkedinHandle,
|
|
3544
|
-
icon:
|
|
3492
|
+
icon: import_core_free_icons17.LinkedinIcon,
|
|
3545
3493
|
label: "LinkedIn",
|
|
3546
3494
|
name: member.name
|
|
3547
3495
|
}
|
|
3548
|
-
))))))), (contactText || contactEmail) && /* @__PURE__ */
|
|
3496
|
+
))))))), (contactText || contactEmail) && /* @__PURE__ */ import_react53.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react53.default.createElement("p", { className: "text-[11px] text-neutral-600 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react53.default.createElement("a", { href: `mailto:${contactEmail}`, className: "text-black decoration-black decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
|
|
3549
3497
|
};
|
|
3550
3498
|
|
|
3551
3499
|
// src/components/ManagedNotFoundBlock.tsx
|
|
3552
|
-
var
|
|
3500
|
+
var import_react55 = __toESM(require("react"));
|
|
3553
3501
|
var ManagedNotFoundBlock = ({
|
|
3554
3502
|
title = "404 - Page Not Found",
|
|
3555
3503
|
description = "The page you are looking for does not exist or has been moved."
|
|
3556
3504
|
}) => {
|
|
3557
|
-
return /* @__PURE__ */
|
|
3505
|
+
return /* @__PURE__ */ import_react55.default.createElement("main", { className: "min-h-screen flex items-center justify-center relative z-20 bg-transparent" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "p-6 w-full max-w-md mx-auto text-center" }, /* @__PURE__ */ import_react55.default.createElement("div", { className: "mb-8 flex justify-center" }, /* @__PURE__ */ import_react55.default.createElement(
|
|
3558
3506
|
"svg",
|
|
3559
3507
|
{
|
|
3560
3508
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3561
3509
|
viewBox: "0 0 24 24",
|
|
3562
3510
|
className: "w-12 h-12 fill-neutral-100"
|
|
3563
3511
|
},
|
|
3564
|
-
/* @__PURE__ */
|
|
3565
|
-
)), /* @__PURE__ */
|
|
3512
|
+
/* @__PURE__ */ import_react55.default.createElement("path", { fillRule: "evenodd", d: "M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z", clipRule: "evenodd" })
|
|
3513
|
+
)), /* @__PURE__ */ import_react55.default.createElement("h1", { className: " text-xl md:text-3xl text-black tracking-tight mb-4" }, title), /* @__PURE__ */ import_react55.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-12" }, description)));
|
|
3566
3514
|
};
|
|
3567
3515
|
|
|
3568
3516
|
// src/components/ManagedNewsletterSplitBlock.tsx
|
|
3569
|
-
var
|
|
3517
|
+
var import_react56 = __toESM(require("react"));
|
|
3570
3518
|
var import_image6 = __toESM(require("next/image"));
|
|
3571
3519
|
var ManagedNewsletterSplitBlock = ({
|
|
3572
3520
|
tagline,
|
|
@@ -3580,7 +3528,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3580
3528
|
ctaHref = "/contact",
|
|
3581
3529
|
children
|
|
3582
3530
|
}) => {
|
|
3583
|
-
return /* @__PURE__ */
|
|
3531
|
+
return /* @__PURE__ */ import_react56.default.createElement("div", { className: "grow flex flex-col md:flex-row relative w-full pt-32 md:pt-0" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "hidden md:block md:w-1/2 relative min-h-screen overflow-hidden" }, /* @__PURE__ */ import_react56.default.createElement(
|
|
3584
3532
|
import_image6.default,
|
|
3585
3533
|
{
|
|
3586
3534
|
src: imageSrc,
|
|
@@ -3590,7 +3538,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3590
3538
|
className: "object-cover object-top grayscale opacity-60",
|
|
3591
3539
|
quality: 100
|
|
3592
3540
|
}
|
|
3593
|
-
), /* @__PURE__ */
|
|
3541
|
+
), /* @__PURE__ */ import_react56.default.createElement(
|
|
3594
3542
|
"div",
|
|
3595
3543
|
{
|
|
3596
3544
|
className: "absolute inset-0 z-10 pointer-events-none",
|
|
@@ -3598,7 +3546,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3598
3546
|
background: "linear-gradient(to right, rgba(255,255,255,0) 30%, #ffffff 100%)"
|
|
3599
3547
|
}
|
|
3600
3548
|
}
|
|
3601
|
-
), /* @__PURE__ */
|
|
3549
|
+
), /* @__PURE__ */ import_react56.default.createElement(
|
|
3602
3550
|
"div",
|
|
3603
3551
|
{
|
|
3604
3552
|
className: "absolute inset-x-0 bottom-0 h-40 z-10 pointer-events-none",
|
|
@@ -3606,7 +3554,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3606
3554
|
background: "linear-gradient(to bottom, rgba(255,255,255,0) 0%, #ffffff 100%)"
|
|
3607
3555
|
}
|
|
3608
3556
|
}
|
|
3609
|
-
)), /* @__PURE__ */
|
|
3557
|
+
)), /* @__PURE__ */ import_react56.default.createElement("div", { className: "w-full md:w-1/2 flex flex-col items-center justify-center p-4 md:p-12 relative z-20" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "relative w-full max-w-lg p-8 md:p-12 text-center md:text-left transition-all duration-700 ease-out" }, /* @__PURE__ */ import_react56.default.createElement(
|
|
3610
3558
|
"div",
|
|
3611
3559
|
{
|
|
3612
3560
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -3615,7 +3563,7 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3615
3563
|
backgroundRepeat: "repeat"
|
|
3616
3564
|
}
|
|
3617
3565
|
}
|
|
3618
|
-
), /* @__PURE__ */
|
|
3566
|
+
), /* @__PURE__ */ import_react56.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "mb-10 border-b border-neutral-200 pb-8 text-center md:text-left" }, tagline && /* @__PURE__ */ import_react56.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 " }, tagline), /* @__PURE__ */ import_react56.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight mb-4" }, title), subtitle && /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, subtitle)), /* @__PURE__ */ import_react56.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 mb-10 text-center md:text-left" }, description), children && /* @__PURE__ */ import_react56.default.createElement("div", { className: "mb-8 text-left" }, children), /* @__PURE__ */ import_react56.default.createElement("div", { className: "text-center md:text-left mt-10 space-y-6" }, dividerText && /* @__PURE__ */ import_react56.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react56.default.createElement("div", { className: "grow h-px bg-neutral-100" }), /* @__PURE__ */ import_react56.default.createElement("span", { className: "shrink mx-4 text-[11px] tracking-[0.2em] text-neutral-400 " }, dividerText), /* @__PURE__ */ import_react56.default.createElement("div", { className: "grow h-px bg-neutral-100" })), ctaText && ctaHref && /* @__PURE__ */ import_react56.default.createElement("div", { className: "w-full *:w-full" }, /* @__PURE__ */ import_react56.default.createElement(
|
|
3619
3567
|
ThreeDButton,
|
|
3620
3568
|
{
|
|
3621
3569
|
href: ctaHref,
|
|
@@ -3626,14 +3574,14 @@ var ManagedNewsletterSplitBlock = ({
|
|
|
3626
3574
|
};
|
|
3627
3575
|
|
|
3628
3576
|
// src/components/PortfolioHero.tsx
|
|
3629
|
-
var
|
|
3577
|
+
var import_react57 = __toESM(require("react"));
|
|
3630
3578
|
var import_link8 = __toESM(require("next/link"));
|
|
3631
3579
|
var import_image7 = __toESM(require("next/image"));
|
|
3632
|
-
var
|
|
3633
|
-
var
|
|
3580
|
+
var import_react58 = require("@hugeicons/react");
|
|
3581
|
+
var import_core_free_icons18 = require("@hugeicons/core-free-icons");
|
|
3634
3582
|
var useScrollAnimation = () => {
|
|
3635
|
-
const elementRef = (0,
|
|
3636
|
-
(0,
|
|
3583
|
+
const elementRef = (0, import_react57.useRef)(null);
|
|
3584
|
+
(0, import_react57.useEffect)(() => {
|
|
3637
3585
|
const el = elementRef.current;
|
|
3638
3586
|
if (!el) return;
|
|
3639
3587
|
const observer = new IntersectionObserver(
|
|
@@ -3669,13 +3617,13 @@ var PortfolioHero = ({
|
|
|
3669
3617
|
secondaryCtaHref
|
|
3670
3618
|
}) => {
|
|
3671
3619
|
const heroContentRef = useScrollAnimation();
|
|
3672
|
-
return /* @__PURE__ */
|
|
3620
|
+
return /* @__PURE__ */ import_react57.default.createElement("section", { className: "pt-8 pb-16 px-6 md:px-12 flex flex-col relative overflow-hidden z-10 w-full" }, /* @__PURE__ */ import_react57.default.createElement(
|
|
3673
3621
|
"div",
|
|
3674
3622
|
{
|
|
3675
3623
|
ref: heroContentRef,
|
|
3676
3624
|
className: "w-full opacity-0 translate-y-5 transition-all duration-1000 ease-out relative z-10"
|
|
3677
3625
|
},
|
|
3678
|
-
/* @__PURE__ */
|
|
3626
|
+
/* @__PURE__ */ import_react57.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-10" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "relative w-20 h-20 sm:w-32 sm:h-32 rounded-full overflow-hidden border border-neutral-200 shrink-0 shadow-sm" }, /* @__PURE__ */ import_react57.default.createElement(
|
|
3679
3627
|
import_image7.default,
|
|
3680
3628
|
{
|
|
3681
3629
|
src: imageSrc,
|
|
@@ -3686,7 +3634,7 @@ var PortfolioHero = ({
|
|
|
3686
3634
|
sizes: "(max-width: 640px) 80px, 128px",
|
|
3687
3635
|
quality: 100
|
|
3688
3636
|
}
|
|
3689
|
-
)), /* @__PURE__ */
|
|
3637
|
+
)), /* @__PURE__ */ import_react57.default.createElement("div", { className: "flex flex-col text-left" }, /* @__PURE__ */ import_react57.default.createElement("h1", { className: " text-3xl sm:text-5xl lg:text-6xl tracking-tight text-black leading-none mb-3" }, name), socialLabel && /* @__PURE__ */ import_react57.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 " }, socialLabel), socialLinkText && socialLinkHref && /* @__PURE__ */ import_react57.default.createElement(
|
|
3690
3638
|
"a",
|
|
3691
3639
|
{
|
|
3692
3640
|
href: socialLinkHref,
|
|
@@ -3696,31 +3644,31 @@ var PortfolioHero = ({
|
|
|
3696
3644
|
},
|
|
3697
3645
|
socialLinkText
|
|
3698
3646
|
))),
|
|
3699
|
-
/* @__PURE__ */
|
|
3700
|
-
/* @__PURE__ */
|
|
3647
|
+
/* @__PURE__ */ import_react57.default.createElement("p", { className: "text-[13px] leading-[1.8] max-w-4xl mb-12 text-neutral-600" }, bio),
|
|
3648
|
+
/* @__PURE__ */ import_react57.default.createElement("div", { className: "flex flex-col sm:flex-row gap-4 w-full sm:w-auto" }, primaryCtaText && primaryCtaHref && /* @__PURE__ */ import_react57.default.createElement("div", { className: "w-full sm:w-auto *:w-full" }, /* @__PURE__ */ import_react57.default.createElement(
|
|
3701
3649
|
ThreeDButton,
|
|
3702
3650
|
{
|
|
3703
3651
|
href: primaryCtaHref,
|
|
3704
3652
|
className: "py-3 tracking-widest text-[11px]"
|
|
3705
3653
|
},
|
|
3706
3654
|
primaryCtaText
|
|
3707
|
-
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */
|
|
3655
|
+
)), secondaryCtaText && secondaryCtaHref && /* @__PURE__ */ import_react57.default.createElement(
|
|
3708
3656
|
import_link8.default,
|
|
3709
3657
|
{
|
|
3710
3658
|
href: secondaryCtaHref,
|
|
3711
3659
|
className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] rounded-full px-8 py-3.5 bg-neutral-200 transition-colors text-black hover:bg-neutral-200 outline-none"
|
|
3712
3660
|
},
|
|
3713
3661
|
secondaryCtaText,
|
|
3714
|
-
/* @__PURE__ */
|
|
3662
|
+
/* @__PURE__ */ import_react57.default.createElement(import_react58.HugeiconsIcon, { icon: import_core_free_icons18.ArrowRight01Icon, size: 16 })
|
|
3715
3663
|
))
|
|
3716
3664
|
));
|
|
3717
3665
|
};
|
|
3718
3666
|
|
|
3719
3667
|
// src/components/GifFeatureCard.tsx
|
|
3720
|
-
var
|
|
3668
|
+
var import_react59 = __toESM(require("react"));
|
|
3721
3669
|
var import_image8 = __toESM(require("next/image"));
|
|
3722
|
-
var
|
|
3723
|
-
var
|
|
3670
|
+
var import_react60 = require("@hugeicons/react");
|
|
3671
|
+
var import_core_free_icons19 = require("@hugeicons/core-free-icons");
|
|
3724
3672
|
var GifFeatureCard = ({
|
|
3725
3673
|
gifSrc,
|
|
3726
3674
|
title,
|
|
@@ -3728,20 +3676,20 @@ var GifFeatureCard = ({
|
|
|
3728
3676
|
alt = "Feature animation",
|
|
3729
3677
|
className = "aspect-video"
|
|
3730
3678
|
}) => {
|
|
3731
|
-
const [isLoading, setIsLoading] = (0,
|
|
3732
|
-
return /* @__PURE__ */
|
|
3733
|
-
|
|
3679
|
+
const [isLoading, setIsLoading] = (0, import_react59.useState)(true);
|
|
3680
|
+
return /* @__PURE__ */ import_react59.default.createElement("div", { className: `relative w-full bg-black overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ import_react59.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ import_react59.default.createElement(
|
|
3681
|
+
import_react60.HugeiconsIcon,
|
|
3734
3682
|
{
|
|
3735
|
-
icon:
|
|
3683
|
+
icon: import_core_free_icons19.Loading03Icon,
|
|
3736
3684
|
size: 32,
|
|
3737
3685
|
className: "animate-spin text-white"
|
|
3738
3686
|
}
|
|
3739
|
-
)), /* @__PURE__ */
|
|
3687
|
+
)), /* @__PURE__ */ import_react59.default.createElement(
|
|
3740
3688
|
"div",
|
|
3741
3689
|
{
|
|
3742
3690
|
className: `absolute inset-0 z-0 transition-all duration-1000 ease-out ${isLoading ? "scale-105 blur-2xl opacity-0" : "scale-100 blur-0 opacity-100"}`
|
|
3743
3691
|
},
|
|
3744
|
-
/* @__PURE__ */
|
|
3692
|
+
/* @__PURE__ */ import_react59.default.createElement(
|
|
3745
3693
|
import_image8.default,
|
|
3746
3694
|
{
|
|
3747
3695
|
src: gifSrc,
|
|
@@ -3752,16 +3700,16 @@ var GifFeatureCard = ({
|
|
|
3752
3700
|
className: "object-cover object-center pointer-events-none"
|
|
3753
3701
|
}
|
|
3754
3702
|
)
|
|
3755
|
-
), /* @__PURE__ */
|
|
3703
|
+
), /* @__PURE__ */ import_react59.default.createElement(
|
|
3756
3704
|
"div",
|
|
3757
3705
|
{
|
|
3758
3706
|
className: "absolute inset-x-0 bottom-0 h-1/2 sm:h-2/3 bg-linear-to-t from-black/95 via-black/40 to-transparent z-10 pointer-events-none transition-opacity duration-700"
|
|
3759
3707
|
}
|
|
3760
|
-
), /* @__PURE__ */
|
|
3708
|
+
), /* @__PURE__ */ import_react59.default.createElement("div", { className: "absolute inset-x-0 bottom-0 p-6 sm:p-8 z-30 flex flex-col justify-end text-left pointer-events-none" }, title && /* @__PURE__ */ import_react59.default.createElement("h3", { className: " text-xl sm:text-2xl md:text-3xl text-white tracking-tight mb-2 sm:mb-3 drop-shadow-md" }, title), subtitle && /* @__PURE__ */ import_react59.default.createElement("p", { className: "text-[13px] sm:text-[15px] leading-relaxed text-neutral-300 max-w-2xl drop-shadow-sm" }, subtitle)));
|
|
3761
3709
|
};
|
|
3762
3710
|
|
|
3763
3711
|
// src/components/MedicalFeatureStatsBlock.tsx
|
|
3764
|
-
var
|
|
3712
|
+
var import_react61 = __toESM(require("react"));
|
|
3765
3713
|
var import_image9 = __toESM(require("next/image"));
|
|
3766
3714
|
var MedicalFeatureStatsBlock = ({
|
|
3767
3715
|
bottomHeadline,
|
|
@@ -3770,9 +3718,9 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3770
3718
|
trustText,
|
|
3771
3719
|
stats
|
|
3772
3720
|
}) => {
|
|
3773
|
-
const [isAnimating, setIsAnimating] = (0,
|
|
3774
|
-
const titleRef = (0,
|
|
3775
|
-
(0,
|
|
3721
|
+
const [isAnimating, setIsAnimating] = (0, import_react61.useState)(false);
|
|
3722
|
+
const titleRef = (0, import_react61.useRef)(null);
|
|
3723
|
+
(0, import_react61.useEffect)(() => {
|
|
3776
3724
|
const observer = new IntersectionObserver(
|
|
3777
3725
|
([entry]) => {
|
|
3778
3726
|
if (entry.isIntersecting) {
|
|
@@ -3790,7 +3738,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3790
3738
|
}
|
|
3791
3739
|
return () => observer.disconnect();
|
|
3792
3740
|
}, []);
|
|
3793
|
-
return /* @__PURE__ */
|
|
3741
|
+
return /* @__PURE__ */ import_react61.default.createElement("section", { className: "py-24 w-full flex justify-center relative z-10" }, /* @__PURE__ */ import_react61.default.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ import_react61.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-10 mb-12" }, /* @__PURE__ */ import_react61.default.createElement("div", { className: "max-w-xl" }, /* @__PURE__ */ import_react61.default.createElement(
|
|
3794
3742
|
"h2",
|
|
3795
3743
|
{
|
|
3796
3744
|
ref: titleRef,
|
|
@@ -3798,7 +3746,7 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3798
3746
|
style: isAnimating ? { animationIterationCount: 1 } : {}
|
|
3799
3747
|
},
|
|
3800
3748
|
bottomHeadline
|
|
3801
|
-
), /* @__PURE__ */
|
|
3749
|
+
), /* @__PURE__ */ import_react61.default.createElement("p", { className: "text-[14px] leading-relaxed text-neutral-500" }, bottomDescription)), /* @__PURE__ */ import_react61.default.createElement("div", { className: "flex items-center gap-4 shrink-0" }, /* @__PURE__ */ import_react61.default.createElement("div", { className: "flex -space-x-3" }, avatars.map((src, i) => /* @__PURE__ */ import_react61.default.createElement("div", { key: i, className: "relative w-12 h-12 rounded-full border-[3px] border-white overflow-hidden bg-neutral-100 z-1 hover:z-10 transition-all" }, /* @__PURE__ */ import_react61.default.createElement(
|
|
3802
3750
|
import_image9.default,
|
|
3803
3751
|
{
|
|
3804
3752
|
src,
|
|
@@ -3807,17 +3755,17 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3807
3755
|
sizes: "48px",
|
|
3808
3756
|
className: "object-cover"
|
|
3809
3757
|
}
|
|
3810
|
-
)))), /* @__PURE__ */
|
|
3758
|
+
)))), /* @__PURE__ */ import_react61.default.createElement("p", { className: "text-[11px] text-neutral-800 leading-[1.4] max-w-55" }, trustText))), /* @__PURE__ */ import_react61.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" }, stats.map((stat, idx) => /* @__PURE__ */ import_react61.default.createElement("div", { key: idx, className: "bg-white rounded-4xl p-8 md:p-10 flex flex-col h-70" }, /* @__PURE__ */ import_react61.default.createElement("div", { className: "flex items-center p-0.5 mb-6" }, /* @__PURE__ */ import_react61.default.createElement("span", { className: "text-[14px] text-neutral-500 tracking-wide" }, stat.label)), /* @__PURE__ */ import_react61.default.createElement("h1", { className: "text-6xl gradient-text md:text-[80px] tracking-tighter text-black mt-auto leading-none" }, stat.value))))));
|
|
3811
3759
|
};
|
|
3812
3760
|
|
|
3813
3761
|
// src/components/ConsultantShowcase.tsx
|
|
3814
|
-
var
|
|
3762
|
+
var import_react62 = __toESM(require("react"));
|
|
3815
3763
|
var import_image10 = __toESM(require("next/image"));
|
|
3816
|
-
var
|
|
3817
|
-
var
|
|
3764
|
+
var import_react63 = require("@hugeicons/react");
|
|
3765
|
+
var import_core_free_icons20 = require("@hugeicons/core-free-icons");
|
|
3818
3766
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
3819
|
-
const [isLoading, setIsLoading] = (0,
|
|
3820
|
-
return /* @__PURE__ */
|
|
3767
|
+
const [isLoading, setIsLoading] = (0, import_react62.useState)(true);
|
|
3768
|
+
return /* @__PURE__ */ import_react62.default.createElement("div", { className: `absolute inset-0 bg-neutral-800 ${className}` }, isLoading && /* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-800/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ import_react62.default.createElement(import_react63.HugeiconsIcon, { icon: import_core_free_icons20.Loading03Icon, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ import_react62.default.createElement(
|
|
3821
3769
|
import_image10.default,
|
|
3822
3770
|
{
|
|
3823
3771
|
src,
|
|
@@ -3836,9 +3784,9 @@ var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
|
3836
3784
|
var ConsultantShowcase = ({
|
|
3837
3785
|
profiles
|
|
3838
3786
|
}) => {
|
|
3839
|
-
const [currentIndex, setCurrentIndex] = (0,
|
|
3840
|
-
const [touchStart, setTouchStart] = (0,
|
|
3841
|
-
const [touchEnd, setTouchEnd] = (0,
|
|
3787
|
+
const [currentIndex, setCurrentIndex] = (0, import_react62.useState)(0);
|
|
3788
|
+
const [touchStart, setTouchStart] = (0, import_react62.useState)(null);
|
|
3789
|
+
const [touchEnd, setTouchEnd] = (0, import_react62.useState)(null);
|
|
3842
3790
|
const nextSlide = () => {
|
|
3843
3791
|
setCurrentIndex((prev) => prev === profiles.length - 1 ? 0 : prev + 1);
|
|
3844
3792
|
};
|
|
@@ -3863,7 +3811,7 @@ var ConsultantShowcase = ({
|
|
|
3863
3811
|
}
|
|
3864
3812
|
};
|
|
3865
3813
|
if (!profiles || profiles.length === 0) return null;
|
|
3866
|
-
return /* @__PURE__ */
|
|
3814
|
+
return /* @__PURE__ */ import_react62.default.createElement("section", { className: "py-24 w-full flex justify-center px-4 md:px-8 z-10 relative" }, /* @__PURE__ */ import_react62.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react62.default.createElement(
|
|
3867
3815
|
"div",
|
|
3868
3816
|
{
|
|
3869
3817
|
className: "relative w-full h-100 md:h-112.5 rounded-4xl overflow-hidden bg-neutral-900 group select-none",
|
|
@@ -3873,13 +3821,13 @@ var ConsultantShowcase = ({
|
|
|
3873
3821
|
},
|
|
3874
3822
|
profiles.map((profile, idx) => {
|
|
3875
3823
|
const isActive = idx === currentIndex;
|
|
3876
|
-
return /* @__PURE__ */
|
|
3824
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
3877
3825
|
"div",
|
|
3878
3826
|
{
|
|
3879
3827
|
key: profile.id,
|
|
3880
3828
|
className: `absolute inset-0 transition-opacity duration-700 ease-in-out ${isActive ? "opacity-100 z-10" : "opacity-0 z-0 pointer-events-none"}`
|
|
3881
3829
|
},
|
|
3882
|
-
/* @__PURE__ */
|
|
3830
|
+
/* @__PURE__ */ import_react62.default.createElement(
|
|
3883
3831
|
ImageWithLoader,
|
|
3884
3832
|
{
|
|
3885
3833
|
src: profile.imageSrc,
|
|
@@ -3887,14 +3835,14 @@ var ConsultantShowcase = ({
|
|
|
3887
3835
|
priority: idx === 0
|
|
3888
3836
|
}
|
|
3889
3837
|
),
|
|
3890
|
-
/* @__PURE__ */
|
|
3891
|
-
/* @__PURE__ */
|
|
3892
|
-
/* @__PURE__ */
|
|
3838
|
+
/* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute inset-0 bg-black/20 z-10 pointer-events-none" }),
|
|
3839
|
+
/* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute top-0 left-0 w-full h-[60%] bg-linear-to-b from-black/80 via-black/30 to-transparent z-20 pointer-events-none" }),
|
|
3840
|
+
/* @__PURE__ */ import_react62.default.createElement("div", { className: `absolute top-8 left-8 md:top-12 md:left-12 z-30 text-white max-w-lg transition-transform duration-700 ease-out ${isActive ? "translate-y-0" : "-translate-y-4"}` }, /* @__PURE__ */ import_react62.default.createElement("h2", { className: "text-[29px] tracking-tight mb-2 leading-none" }, profile.name), /* @__PURE__ */ import_react62.default.createElement("div", { className: "flex flex-col gap-0.5" }, /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[15px] text-white/80 tracking-wide" }, profile.role), profile.description && /* @__PURE__ */ import_react62.default.createElement("p", { className: "text-[15px] text-white/80 tracking-wide mt-1" }, profile.description)))
|
|
3893
3841
|
);
|
|
3894
3842
|
}),
|
|
3895
|
-
/* @__PURE__ */
|
|
3896
|
-
/* @__PURE__ */
|
|
3897
|
-
/* @__PURE__ */
|
|
3843
|
+
/* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute top-0 left-0 w-[20%] h-full z-40 cursor-w-resize hidden md:block", onClick: prevSlide }),
|
|
3844
|
+
/* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute top-0 right-0 w-[20%] h-full z-40 cursor-e-resize hidden md:block", onClick: nextSlide }),
|
|
3845
|
+
/* @__PURE__ */ import_react62.default.createElement("div", { className: "absolute bottom-6 md:bottom-8 left-0 w-full px-4 z-30 flex justify-center items-center gap-2" }, profiles.map((_, idx) => /* @__PURE__ */ import_react62.default.createElement(
|
|
3898
3846
|
"button",
|
|
3899
3847
|
{
|
|
3900
3848
|
key: idx,
|
|
@@ -3906,13 +3854,13 @@ var ConsultantShowcase = ({
|
|
|
3906
3854
|
};
|
|
3907
3855
|
|
|
3908
3856
|
// src/components/ContentGridBlock.tsx
|
|
3909
|
-
var
|
|
3857
|
+
var import_react64 = __toESM(require("react"));
|
|
3910
3858
|
var import_image11 = __toESM(require("next/image"));
|
|
3911
|
-
var
|
|
3912
|
-
var
|
|
3859
|
+
var import_react65 = require("@hugeicons/react");
|
|
3860
|
+
var import_core_free_icons21 = require("@hugeicons/core-free-icons");
|
|
3913
3861
|
var ImageWithLoader2 = ({ src, alt, className, sizes }) => {
|
|
3914
|
-
const [isLoading, setIsLoading] = (0,
|
|
3915
|
-
return /* @__PURE__ */
|
|
3862
|
+
const [isLoading, setIsLoading] = (0, import_react64.useState)(true);
|
|
3863
|
+
return /* @__PURE__ */ import_react64.default.createElement("div", { className: `relative overflow-hidden bg-neutral-100 ${className}` }, isLoading && /* @__PURE__ */ import_react64.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-100/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ import_react64.default.createElement(import_react65.HugeiconsIcon, { icon: import_core_free_icons21.Loading03Icon, size: 24, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ import_react64.default.createElement(
|
|
3916
3864
|
import_image11.default,
|
|
3917
3865
|
{
|
|
3918
3866
|
src,
|
|
@@ -3934,30 +3882,30 @@ var ContentGridBlock = ({
|
|
|
3934
3882
|
middleBottomCard,
|
|
3935
3883
|
rightCards
|
|
3936
3884
|
}) => {
|
|
3937
|
-
return /* @__PURE__ */
|
|
3885
|
+
return /* @__PURE__ */ import_react64.default.createElement("section", { className: " w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "max-w-300 w-full px-4 md:px-8 flex flex-col gap-12" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex flex-col lg:flex-row justify-between items-start lg:items-end gap-6 w-full" }, /* @__PURE__ */ import_react64.default.createElement("h2", { className: "text-3xl tracking-tight text-black leading-[1.15] max-w-lg" }, header.titlePrefix, " ", /* @__PURE__ */ import_react64.default.createElement("span", { className: "gradient-text" }, header.highlightText))), /* @__PURE__ */ import_react64.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex flex-col justify-end" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "bg-black rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[17px] text-white leading-snug mb-4" }, leftCard.mainText), leftCard.tag && /* @__PURE__ */ import_react64.default.createElement("span", { className: "mb-auto text-[11px] text-neutral-200 tracking-widest" }, leftCard.tag), /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex items-center justify-between mt-8" }, /* @__PURE__ */ import_react64.default.createElement("div", null, /* @__PURE__ */ import_react64.default.createElement("h4", { className: "text-[15px] text-white" }, leftCard.title), /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[13px] text-neutral-300" }, leftCard.subtitle)), /* @__PURE__ */ import_react64.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react64.default.createElement(import_image11.default, { src: leftCard.thumbnailSrc, alt: leftCard.title, fill: true, className: "object-cover" }))))), /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col relative h-75" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "absolute top-6 right-6 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react64.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-wide" }, middleTopCard.topRightLabel), /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex -space-x-2" }, middleTopCard.topRightAvatars.map((src, i) => /* @__PURE__ */ import_react64.default.createElement("div", { key: i, className: "w-7 h-7 rounded-full border-2 border-white overflow-hidden relative z-10" }, /* @__PURE__ */ import_react64.default.createElement(import_image11.default, { src, alt: "Avatar", fill: true, className: "object-cover", sizes: "28px" })))), /* @__PURE__ */ import_react64.default.createElement("span", { className: "text-sm text-neutral-500" }, middleTopCard.topRightCount))), /* @__PURE__ */ import_react64.default.createElement("div", { className: "grow flex flex-col justify-center items-center py-6" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "px-5 py-2 rounded-full bg-neutral-50/50 border border-neutral-200 text-[13px] text-neutral-600" }, middleTopCard.badgePrefix, " ", /* @__PURE__ */ import_react64.default.createElement("span", { className: " text-black" }, middleTopCard.badgeHighlight), middleTopCard.badgeSuffix)), /* @__PURE__ */ import_react64.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[11px] text-neutral-400 tracking-wide mb-1" }, middleTopCard.title), /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[14px] text-black leading-snug pr-4" }, middleTopCard.description))), /* @__PURE__ */ import_react64.default.createElement("div", { className: "bg-white rounded-3xl p-8 flex flex-col h-80" }, /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex justify-between items-start mb-6" }, /* @__PURE__ */ import_react64.default.createElement("div", null, /* @__PURE__ */ import_react64.default.createElement("h4", { className: "text-[15px] text-black leading-tight" }, middleBottomCard.title), /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[13px] text-neutral-400" }, middleBottomCard.subtitle)), /* @__PURE__ */ import_react64.default.createElement("div", { className: "w-10 h-10 rounded-full overflow-hidden relative" }, /* @__PURE__ */ import_react64.default.createElement(import_image11.default, { src: middleBottomCard.thumbnailSrc, alt: middleBottomCard.title, fill: true, className: "object-cover" }))), /* @__PURE__ */ import_react64.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[16px] text-black leading-snug mb-4" }, middleBottomCard.mainText), middleBottomCard.tag && /* @__PURE__ */ import_react64.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-widest" }, middleBottomCard.tag)))), /* @__PURE__ */ import_react64.default.createElement("div", { className: "flex flex-col gap-6" }, rightCards.slice(0, 2).map((card, idx) => /* @__PURE__ */ import_react64.default.createElement("div", { key: idx, className: "relative w-full h-80 text-white rounded-3xl overflow-hidden group" }, /* @__PURE__ */ import_react64.default.createElement(
|
|
3938
3886
|
ImageWithLoader2,
|
|
3939
3887
|
{
|
|
3940
3888
|
src: card.bgImageSrc,
|
|
3941
3889
|
alt: card.title,
|
|
3942
3890
|
className: "absolute inset-0 w-full h-full"
|
|
3943
3891
|
}
|
|
3944
|
-
), /* @__PURE__ */
|
|
3892
|
+
), /* @__PURE__ */ import_react64.default.createElement("div", { className: "absolute inset-0 z-20 pointer-events-none" }), /* @__PURE__ */ import_react64.default.createElement("div", { className: "absolute inset-0 z-30 p-6 flex flex-col justify-end text-white" }, /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[14px] leading-snug mb-3 pr-2 text-white/90" }, card.mainText), card.tag && /* @__PURE__ */ import_react64.default.createElement("span", { className: "mb-4 text-[11px] text-white/50 tracking-widest" }, card.tag), /* @__PURE__ */ import_react64.default.createElement("div", { className: "pt-3" }, /* @__PURE__ */ import_react64.default.createElement("h4", { className: "text-[15px] text-white tracking-wide" }, card.title), /* @__PURE__ */ import_react64.default.createElement("p", { className: "text-[13px] text-white/60" }, card.subtitle)))))))));
|
|
3945
3893
|
};
|
|
3946
3894
|
|
|
3947
3895
|
// src/components/ManagedProjectsBlock.tsx
|
|
3948
|
-
var
|
|
3896
|
+
var import_react66 = __toESM(require("react"));
|
|
3949
3897
|
var import_link9 = __toESM(require("next/link"));
|
|
3950
3898
|
var GridSection = ({
|
|
3951
3899
|
children,
|
|
3952
3900
|
isLast = false,
|
|
3953
3901
|
className = "py-8 md:py-10"
|
|
3954
|
-
}) => /* @__PURE__ */
|
|
3902
|
+
}) => /* @__PURE__ */ import_react66.default.createElement("div", { className: `relative px-5 md:px-12 ${className} ${!isLast ? "" : ""}` }, children);
|
|
3955
3903
|
var ManagedProjectsBlock = ({
|
|
3956
3904
|
tagline,
|
|
3957
3905
|
title,
|
|
3958
3906
|
projects
|
|
3959
3907
|
}) => {
|
|
3960
|
-
return /* @__PURE__ */
|
|
3908
|
+
return /* @__PURE__ */ import_react66.default.createElement("div", { className: "grow pt-4 pb-20 px-3 md:px-8 w-full flex justify-center z-10 relative" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "relative bg-white rounded-2xl w-full max-w-5xl mx-auto overflow-hidden" }, /* @__PURE__ */ import_react66.default.createElement(
|
|
3961
3909
|
"div",
|
|
3962
3910
|
{
|
|
3963
3911
|
className: "absolute inset-0 pointer-events-none opacity-[0.03] z-0",
|
|
@@ -3966,17 +3914,17 @@ var ManagedProjectsBlock = ({
|
|
|
3966
3914
|
backgroundRepeat: "repeat"
|
|
3967
3915
|
}
|
|
3968
3916
|
}
|
|
3969
|
-
), /* @__PURE__ */
|
|
3917
|
+
), /* @__PURE__ */ import_react66.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react66.default.createElement(GridSection, null, tagline && /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block " }, tagline), /* @__PURE__ */ import_react66.default.createElement("h1", { className: " text-3xl mt-4 text-black tracking-tight text-left" }, title)), projects.map((project, index) => {
|
|
3970
3918
|
const isLast = index === projects.length - 1;
|
|
3971
|
-
const projectContent = /* @__PURE__ */
|
|
3972
|
-
return /* @__PURE__ */
|
|
3919
|
+
const projectContent = /* @__PURE__ */ import_react66.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ import_react66.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react66.default.createElement("h2", { className: " text-[16px] text-black transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-[11px] opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ import_react66.default.createElement("span", { className: `text-[9px] px-2.5 py-1 rounded-full tracking-[0.15em] transition-colors ${project.status.toLowerCase() === "production" ? "bg-black text-white" : "bg-neutral-100 text-neutral-500 group-hover:bg-neutral-100 group-hover:text-black"}` }, project.status)), /* @__PURE__ */ import_react66.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 shrink-0 " }, project.date)), /* @__PURE__ */ import_react66.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-600 max-w-4xl text-left transition-colors group-hover:text-black" }, project.description));
|
|
3920
|
+
return /* @__PURE__ */ import_react66.default.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ import_react66.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react66.default.createElement(import_link9.default, { href: project.link, className: "block outline-none" }, projectContent));
|
|
3973
3921
|
}))));
|
|
3974
3922
|
};
|
|
3975
3923
|
|
|
3976
3924
|
// src/components/UniversalVerificationPage.tsx
|
|
3977
|
-
var
|
|
3978
|
-
var
|
|
3979
|
-
var
|
|
3925
|
+
var import_react67 = __toESM(require("react"));
|
|
3926
|
+
var import_react68 = require("@hugeicons/react");
|
|
3927
|
+
var import_core_free_icons22 = require("@hugeicons/core-free-icons");
|
|
3980
3928
|
var VerificationRow = ({
|
|
3981
3929
|
icon,
|
|
3982
3930
|
title,
|
|
@@ -3994,14 +3942,14 @@ var VerificationRow = ({
|
|
|
3994
3942
|
case "APPROVED":
|
|
3995
3943
|
statusText = "Completed";
|
|
3996
3944
|
statusColor = "text-neutral-600";
|
|
3997
|
-
StatusIcon =
|
|
3945
|
+
StatusIcon = import_core_free_icons22.CheckmarkCircle01Icon;
|
|
3998
3946
|
bg = "bg-neutral-50";
|
|
3999
3947
|
iconColor = "text-green-500";
|
|
4000
3948
|
break;
|
|
4001
3949
|
case "PENDING":
|
|
4002
3950
|
statusText = "Awaiting Approval";
|
|
4003
3951
|
statusColor = "text-neutral-500";
|
|
4004
|
-
StatusIcon =
|
|
3952
|
+
StatusIcon = import_core_free_icons22.Time02Icon;
|
|
4005
3953
|
bg = "bg-neutral-50";
|
|
4006
3954
|
iconColor = "text-orange-500";
|
|
4007
3955
|
break;
|
|
@@ -4009,7 +3957,7 @@ var VerificationRow = ({
|
|
|
4009
3957
|
statusText = "Action required to fix issue";
|
|
4010
3958
|
statusColor = "text-neutral-500";
|
|
4011
3959
|
bg = "bg-neutral-50";
|
|
4012
|
-
StatusIcon =
|
|
3960
|
+
StatusIcon = import_core_free_icons22.InformationCircleIcon;
|
|
4013
3961
|
iconColor = "text-red-500";
|
|
4014
3962
|
break;
|
|
4015
3963
|
case "ACTION_REQUIRED":
|
|
@@ -4017,20 +3965,20 @@ var VerificationRow = ({
|
|
|
4017
3965
|
statusText = "Start verification";
|
|
4018
3966
|
statusColor = "text-neutral-500";
|
|
4019
3967
|
bg = "bg-neutral-50";
|
|
4020
|
-
StatusIcon =
|
|
3968
|
+
StatusIcon = import_core_free_icons22.InformationCircleIcon;
|
|
4021
3969
|
iconColor = "text-neutral-400";
|
|
4022
3970
|
break;
|
|
4023
3971
|
}
|
|
4024
3972
|
const isDisabled = status === "APPROVED" || isLoading;
|
|
4025
|
-
return /* @__PURE__ */
|
|
3973
|
+
return /* @__PURE__ */ import_react67.default.createElement(
|
|
4026
3974
|
"div",
|
|
4027
3975
|
{
|
|
4028
3976
|
onClick: isDisabled ? void 0 : onClick,
|
|
4029
3977
|
className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-neutral-50"}`
|
|
4030
3978
|
},
|
|
4031
|
-
/* @__PURE__ */
|
|
4032
|
-
/* @__PURE__ */
|
|
4033
|
-
/* @__PURE__ */
|
|
3979
|
+
/* @__PURE__ */ import_react67.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 bg-white flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react67.default.createElement(import_react68.HugeiconsIcon, { icon, size: 16, className: "text-black" })),
|
|
3980
|
+
/* @__PURE__ */ import_react67.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react67.default.createElement("p", { className: "text-[14px] truncate text-black" }, title), /* @__PURE__ */ import_react67.default.createElement("p", { className: `text-[10px] inline-flex items-center ${bg} rounded-full px-2 py-1 ${statusColor} mt-0.5` }, statusText)),
|
|
3981
|
+
/* @__PURE__ */ import_react67.default.createElement("div", { className: "shrink-0 ml-2" }, isLoading ? /* @__PURE__ */ import_react67.default.createElement(import_react68.HugeiconsIcon, { icon: import_core_free_icons22.Loading03Icon, size: 20, className: "animate-spin text-black" }) : /* @__PURE__ */ import_react67.default.createElement(import_react68.HugeiconsIcon, { icon: StatusIcon, size: 20, className: iconColor }))
|
|
4034
3982
|
);
|
|
4035
3983
|
};
|
|
4036
3984
|
var UniversalVerificationPage = ({
|
|
@@ -4043,36 +3991,36 @@ var UniversalVerificationPage = ({
|
|
|
4043
3991
|
onTriggerVerification,
|
|
4044
3992
|
activeLoadingType
|
|
4045
3993
|
}) => {
|
|
4046
|
-
return /* @__PURE__ */
|
|
3994
|
+
return /* @__PURE__ */ import_react67.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react67.default.createElement("div", { className: "mb-6 flex items-center px-1" }, /* @__PURE__ */ import_react67.default.createElement(
|
|
4047
3995
|
"button",
|
|
4048
3996
|
{
|
|
4049
3997
|
onClick: onBack,
|
|
4050
3998
|
className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none"
|
|
4051
3999
|
},
|
|
4052
|
-
/* @__PURE__ */
|
|
4000
|
+
/* @__PURE__ */ import_react67.default.createElement(import_react68.HugeiconsIcon, { icon: import_core_free_icons22.ArrowLeft01Icon, size: 16 }),
|
|
4053
4001
|
" Back"
|
|
4054
|
-
)), /* @__PURE__ */
|
|
4002
|
+
)), /* @__PURE__ */ import_react67.default.createElement("div", { className: "w-full flex flex-col gap-4 mb-8" }, /* @__PURE__ */ import_react67.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react67.default.createElement(
|
|
4055
4003
|
VerificationRow,
|
|
4056
4004
|
{
|
|
4057
|
-
icon:
|
|
4005
|
+
icon: import_core_free_icons22.Mail01Icon,
|
|
4058
4006
|
title: "Email Verification",
|
|
4059
4007
|
status: emailStatus,
|
|
4060
4008
|
isLoading: activeLoadingType === "EMAIL",
|
|
4061
4009
|
onClick: () => onTriggerVerification("EMAIL")
|
|
4062
4010
|
}
|
|
4063
|
-
), /* @__PURE__ */
|
|
4011
|
+
), /* @__PURE__ */ import_react67.default.createElement(
|
|
4064
4012
|
VerificationRow,
|
|
4065
4013
|
{
|
|
4066
|
-
icon:
|
|
4014
|
+
icon: import_core_free_icons22.SmartPhone01Icon,
|
|
4067
4015
|
title: "Phone Verification",
|
|
4068
4016
|
status: phoneStatus,
|
|
4069
4017
|
isLoading: activeLoadingType === "PHONE",
|
|
4070
4018
|
onClick: () => onTriggerVerification("PHONE")
|
|
4071
4019
|
}
|
|
4072
|
-
), /* @__PURE__ */
|
|
4020
|
+
), /* @__PURE__ */ import_react67.default.createElement(
|
|
4073
4021
|
VerificationRow,
|
|
4074
4022
|
{
|
|
4075
|
-
icon:
|
|
4023
|
+
icon: import_core_free_icons22.UserIcon,
|
|
4076
4024
|
title: "Identity Verification",
|
|
4077
4025
|
status: identityStatus,
|
|
4078
4026
|
isLoading: activeLoadingType === "IDENTITY",
|
|
@@ -4083,23 +4031,23 @@ var UniversalVerificationPage = ({
|
|
|
4083
4031
|
};
|
|
4084
4032
|
|
|
4085
4033
|
// src/components/UniversalRewardPage.tsx
|
|
4086
|
-
var
|
|
4034
|
+
var import_react69 = __toESM(require("react"));
|
|
4087
4035
|
var import_axios = __toESM(require("axios"));
|
|
4088
4036
|
var import_react_hot_toast9 = __toESM(require("react-hot-toast"));
|
|
4089
4037
|
var import_react_confetti = __toESM(require("react-confetti"));
|
|
4090
4038
|
var import_react_use = require("react-use");
|
|
4091
|
-
var
|
|
4092
|
-
var
|
|
4039
|
+
var import_react70 = require("@hugeicons/react");
|
|
4040
|
+
var import_core_free_icons23 = require("@hugeicons/core-free-icons");
|
|
4093
4041
|
var formatWeb3Name = (name) => {
|
|
4094
4042
|
if (!name) return "";
|
|
4095
4043
|
return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
|
|
4096
4044
|
};
|
|
4097
|
-
var PageSpinner4 = () => /* @__PURE__ */
|
|
4045
|
+
var PageSpinner4 = () => /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex justify-center items-center py-12 w-full" }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
4098
4046
|
var AvatarLogo = ({ src, alt, name, sizeClass = "w-12 h-12" }) => {
|
|
4099
|
-
const [isLoaded, setIsLoaded] = (0,
|
|
4047
|
+
const [isLoaded, setIsLoaded] = (0, import_react69.useState)(false);
|
|
4100
4048
|
const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
|
|
4101
4049
|
const finalSrc = src || fallbackUrl;
|
|
4102
|
-
return /* @__PURE__ */
|
|
4050
|
+
return /* @__PURE__ */ import_react69.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden border-[3px] border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react69.default.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
4103
4051
|
};
|
|
4104
4052
|
var UniversalRewardPage = ({
|
|
4105
4053
|
leaderboardToday,
|
|
@@ -4114,11 +4062,11 @@ var UniversalRewardPage = ({
|
|
|
4114
4062
|
const onBackHandler = onBack ?? (() => {
|
|
4115
4063
|
if (typeof window !== "undefined") window.history.back();
|
|
4116
4064
|
});
|
|
4117
|
-
const [activeTabIndex, setActiveTabIndex] = (0,
|
|
4065
|
+
const [activeTabIndex, setActiveTabIndex] = (0, import_react69.useState)(1);
|
|
4118
4066
|
const tabs = [{ label: "Today" }, { label: "Week" }, { label: "Month" }];
|
|
4119
|
-
const [selectedReward, setSelectedReward] = (0,
|
|
4120
|
-
const [isClaiming, setIsClaiming] = (0,
|
|
4121
|
-
const [showConfetti, setShowConfetti] = (0,
|
|
4067
|
+
const [selectedReward, setSelectedReward] = (0, import_react69.useState)(null);
|
|
4068
|
+
const [isClaiming, setIsClaiming] = (0, import_react69.useState)(false);
|
|
4069
|
+
const [showConfetti, setShowConfetti] = (0, import_react69.useState)(false);
|
|
4122
4070
|
const getActiveLeaderboard = () => {
|
|
4123
4071
|
if (activeTabIndex === 0) return leaderboardToday || [];
|
|
4124
4072
|
if (activeTabIndex === 1) return leaderboardWeek || [];
|
|
@@ -4149,9 +4097,9 @@ var UniversalRewardPage = ({
|
|
|
4149
4097
|
setIsClaiming(false);
|
|
4150
4098
|
}
|
|
4151
4099
|
};
|
|
4152
|
-
return /* @__PURE__ */
|
|
4100
|
+
return /* @__PURE__ */ import_react69.default.createElement("div", null, /* @__PURE__ */ import_react69.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react69.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react69.default.createElement(ManagedToaster, null), showConfetti && /* @__PURE__ */ import_react69.default.createElement("div", { className: "fixed inset-0 z-200 pointer-events-none" }, /* @__PURE__ */ import_react69.default.createElement(import_react_confetti.default, { width, height, recycle: false, numberOfPieces: 500, gravity: 0.15 })), isLoading ? /* @__PURE__ */ import_react69.default.createElement(PageSpinner4, null) : /* @__PURE__ */ import_react69.default.createElement(import_react69.default.Fragment, null, /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full p-4 pt-10 mb-6 flex items-end justify-center gap-2 sm:gap-6 h-64 relative overflow-hidden" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, secondPlace ? /* @__PURE__ */ import_react69.default.createElement(import_react69.default.Fragment, null, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(secondPlace.profile.web3Name)), /* @__PURE__ */ import_react69.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react69.default.createElement(AvatarLogo, { src: secondPlace.profile.avatarUrl, alt: secondPlace.profile.username, name: formatWeb3Name(secondPlace.profile.web3Name), sizeClass: "w-14 h-14 ring-4 ring-orange-100" }), /* @__PURE__ */ import_react69.default.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-orange-400 text-white flex items-center justify-center text-[10px] border border-white " }, "2")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-orange-200 rounded-t-xl h-24 flex items-center justify-center" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-orange-400/30 text-2xl " }, "2nd"))) : /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-24 mt-auto" })), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-20 -mt-8" }, firstPlace ? /* @__PURE__ */ import_react69.default.createElement(import_react69.default.Fragment, null, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(firstPlace.profile.web3Name)), /* @__PURE__ */ import_react69.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react69.default.createElement(AvatarLogo, { src: firstPlace.profile.avatarUrl, alt: firstPlace.profile.username, name: formatWeb3Name(firstPlace.profile.web3Name), sizeClass: "w-17 h-17 ring-4 ring-purple-200" }), /* @__PURE__ */ import_react69.default.createElement("div", { className: "absolute -bottom-2 right-2 w-5 h-5 rounded-full bg-purple-500 text-white flex items-center justify-center text-[10px] border border-white " }, "1")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-purple-400 rounded-t-xl h-32 flex items-center justify-center " }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-white/40 text-3xl tracking-widest" }, "1st"))) : /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-32 mt-auto" })), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, thirdPlace ? /* @__PURE__ */ import_react69.default.createElement(import_react69.default.Fragment, null, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(thirdPlace.profile.web3Name)), /* @__PURE__ */ import_react69.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react69.default.createElement(AvatarLogo, { src: thirdPlace.profile.avatarUrl, alt: thirdPlace.profile.username, name: formatWeb3Name(thirdPlace.profile.web3Name), sizeClass: "w-12 h-12 ring-4 ring-blue-100" }), /* @__PURE__ */ import_react69.default.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-blue-400 text-white flex items-center justify-center text-[10px] border border-white " }, "3")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-blue-200 rounded-t-xl h-20 flex items-center justify-center" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-blue-400/30 text-xl " }, "3rd"))) : /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-20 mt-auto" }))), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex items-center justify-center mb-6 sm:mb-8 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar " }, tabs.map((tab, idx) => {
|
|
4153
4101
|
const isActive = activeTabIndex === idx;
|
|
4154
|
-
return /* @__PURE__ */
|
|
4102
|
+
return /* @__PURE__ */ import_react69.default.createElement(
|
|
4155
4103
|
"button",
|
|
4156
4104
|
{
|
|
4157
4105
|
key: idx,
|
|
@@ -4160,19 +4108,19 @@ var UniversalRewardPage = ({
|
|
|
4160
4108
|
},
|
|
4161
4109
|
tab.label
|
|
4162
4110
|
);
|
|
4163
|
-
}))), /* @__PURE__ */
|
|
4111
|
+
}))), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ import_react69.default.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Available Tasks"), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col" }, rewards.length === 0 ? /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No rewards available at the moment.") : rewards.map((reward) => {
|
|
4164
4112
|
const statusText = reward.status === "CLAIMED" ? "Claimed" : "Unclaimed";
|
|
4165
|
-
return /* @__PURE__ */
|
|
4113
|
+
return /* @__PURE__ */ import_react69.default.createElement(
|
|
4166
4114
|
"div",
|
|
4167
4115
|
{
|
|
4168
4116
|
key: reward.id,
|
|
4169
4117
|
onClick: () => setSelectedReward(reward),
|
|
4170
4118
|
className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4171
4119
|
},
|
|
4172
|
-
/* @__PURE__ */
|
|
4173
|
-
/* @__PURE__ */
|
|
4120
|
+
/* @__PURE__ */ import_react69.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-neutral-200 text-black" }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.GiftIcon, size: 16 })), /* @__PURE__ */ import_react69.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col items-start gap-0.5 pr-4" }, /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[13px] text-black truncate w-full" }, reward.title), /* @__PURE__ */ import_react69.default.createElement("p", { className: `text-[10px] inline-flex items-center bg-neutral-50 rounded-full px-2 py-1 text-neutral-500 mt-0.5` }, statusText))),
|
|
4121
|
+
/* @__PURE__ */ import_react69.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-[13px] text-black" }, reward.amount))
|
|
4174
4122
|
);
|
|
4175
|
-
}))), remainingLeaderboard.length > 0 && /* @__PURE__ */
|
|
4123
|
+
}))), remainingLeaderboard.length > 0 && /* @__PURE__ */ import_react69.default.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ import_react69.default.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Leaderboard"), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col" }, remainingLeaderboard.map((lb) => /* @__PURE__ */ import_react69.default.createElement("div", { key: lb.profile.username, className: "flex items-center justify-between py-3 min-w-0" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "text-[12px] text-neutral-400 w-4" }, lb.position), /* @__PURE__ */ import_react69.default.createElement(AvatarLogo, { src: lb.profile.avatarUrl, alt: lb.profile.username, name: formatWeb3Name(lb.profile.web3Name), sizeClass: "w-9 h-9" }), /* @__PURE__ */ import_react69.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col" }, /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[13px] text-black truncate" }, formatWeb3Name(lb.profile.web3Name)), /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[11px] text-neutral-400 truncate" }, "@", lb.profile.username))), /* @__PURE__ */ import_react69.default.createElement("div", { className: "shrink-0 text-[13px] text-black" }, lb.amount))))))), selectedReward && /* @__PURE__ */ import_react69.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isClaiming && setSelectedReward(null) }), /* @__PURE__ */ import_react69.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-3xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex-1 p-6 flex flex-col items-center text-center mt-2" }, /* @__PURE__ */ import_react69.default.createElement("h2", { className: "text-xl text-black mb-2" }, selectedReward.title), /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[13px] text-neutral-500 mb-6 leading-relaxed" }, selectedReward.description), selectedReward.progressText && /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full mb-6" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: `px-4 py-2 rounded-full text-[11px] tracking-wide ${selectedReward.status === "CLAIMED" ? "bg-green-50 text-green-600" : selectedReward.isEligible ? "bg-blue-50 text-blue-600" : "bg-neutral-100 text-neutral-600"}` }, selectedReward.progressText)), /* @__PURE__ */ import_react69.default.createElement("div", { className: " w-full rounded-xl p-4 mb-8 flex flex-col items-center" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 uppercase mb-1" }, "Reward Value"), /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-3xl text-black " }, selectedReward.amount)), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-3 w-full" }, /* @__PURE__ */ import_react69.default.createElement(
|
|
4176
4124
|
ThreeDActionButton,
|
|
4177
4125
|
{
|
|
4178
4126
|
onClick: handleClaimReward,
|
|
@@ -4181,7 +4129,7 @@ var UniversalRewardPage = ({
|
|
|
4181
4129
|
className: "w-full"
|
|
4182
4130
|
},
|
|
4183
4131
|
selectedReward.status === "CLAIMED" ? "Already Claimed" : selectedReward.isEligible ? "Claim Reward" : "Not Eligible Yet"
|
|
4184
|
-
), /* @__PURE__ */
|
|
4132
|
+
), /* @__PURE__ */ import_react69.default.createElement(
|
|
4185
4133
|
"button",
|
|
4186
4134
|
{
|
|
4187
4135
|
onClick: () => setSelectedReward(null),
|
|
@@ -4193,11 +4141,11 @@ var UniversalRewardPage = ({
|
|
|
4193
4141
|
};
|
|
4194
4142
|
|
|
4195
4143
|
// src/components/UniversalReferralPage.tsx
|
|
4196
|
-
var
|
|
4144
|
+
var import_react71 = __toESM(require("react"));
|
|
4197
4145
|
var import_react_hot_toast10 = __toESM(require("react-hot-toast"));
|
|
4198
|
-
var
|
|
4199
|
-
var
|
|
4200
|
-
var PageSpinner5 = () => /* @__PURE__ */
|
|
4146
|
+
var import_react72 = require("@hugeicons/react");
|
|
4147
|
+
var import_core_free_icons24 = require("@hugeicons/core-free-icons");
|
|
4148
|
+
var PageSpinner5 = () => /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
4201
4149
|
var formatWeb3Name2 = (name) => {
|
|
4202
4150
|
if (!name) return "";
|
|
4203
4151
|
return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
|
|
@@ -4228,52 +4176,242 @@ var UniversalReferralPage = ({
|
|
|
4228
4176
|
}
|
|
4229
4177
|
};
|
|
4230
4178
|
const AvatarLogo2 = ({ src, alt, name, sizeClass = "w-10 h-10" }) => {
|
|
4231
|
-
const [isLoaded, setIsLoaded] = (0,
|
|
4179
|
+
const [isLoaded, setIsLoaded] = (0, import_react71.useState)(false);
|
|
4232
4180
|
const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
|
|
4233
4181
|
const finalSrc = src || fallbackUrl;
|
|
4234
|
-
return /* @__PURE__ */
|
|
4182
|
+
return /* @__PURE__ */ import_react71.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden border-2 border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react71.default.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
4235
4183
|
};
|
|
4236
|
-
return /* @__PURE__ */
|
|
4184
|
+
return /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react71.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react71.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react71.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-3xl bg-white w-full" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col gap-4 mb-2" }, /* @__PURE__ */ import_react71.default.createElement("div", null, /* @__PURE__ */ import_react71.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-xs text-neutral-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ import_react71.default.createElement("div", { className: "border border-neutral-200 rounded-xl p-4 flex items-center justify-between mt-2" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ import_react71.default.createElement("div", { className: "h-6 w-24 bg-neutral-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-lg text-black tracking-widest" }, referralCode)), /* @__PURE__ */ import_react71.default.createElement(
|
|
4237
4185
|
"button",
|
|
4238
4186
|
{
|
|
4239
4187
|
onClick: handleCopyCode,
|
|
4240
4188
|
disabled: isLoading || !referralCode,
|
|
4241
4189
|
className: "w-10 h-10 rounded-full bg-white flex items-center justify-center text-neutral-500 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4242
4190
|
},
|
|
4243
|
-
/* @__PURE__ */
|
|
4244
|
-
)), /* @__PURE__ */
|
|
4191
|
+
/* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.Copy01Icon, size: 18 })
|
|
4192
|
+
)), /* @__PURE__ */ import_react71.default.createElement("div", { className: "text-[13px] text-black px-1 mt-2" }, "Total Invited: ", isLoading && !totalCount ? "-" : totalCount)), /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react71.default.createElement(PageSpinner5, null) : /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react71.default.createElement("div", null, referrals.length === 0 ? /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col items-center justify-center py-12 opacity-50" }, /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-xs text-neutral-500 text-center" }, "You haven't referred anyone yet.")) : referrals.map((ref, idx) => /* @__PURE__ */ import_react71.default.createElement(
|
|
4245
4193
|
"div",
|
|
4246
4194
|
{
|
|
4247
4195
|
key: `${ref.profile.username}-${idx}`,
|
|
4248
4196
|
className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors group min-w-0 px-3 -mx-3 rounded-xl"
|
|
4249
4197
|
},
|
|
4250
|
-
/* @__PURE__ */
|
|
4198
|
+
/* @__PURE__ */ import_react71.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react71.default.createElement(
|
|
4251
4199
|
AvatarLogo2,
|
|
4252
4200
|
{
|
|
4253
4201
|
src: ref.profile.avatarUrl,
|
|
4254
4202
|
alt: ref.profile.username,
|
|
4255
4203
|
name: formatWeb3Name2(ref.profile.web3Name)
|
|
4256
4204
|
}
|
|
4257
|
-
), /* @__PURE__ */
|
|
4258
|
-
/* @__PURE__ */
|
|
4259
|
-
))), /* @__PURE__ */
|
|
4205
|
+
), /* @__PURE__ */ import_react71.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5 pr-4" }, /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-[14px] text-black truncate" }, formatWeb3Name2(ref.profile.web3Name)), /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, "@", ref.profile.username))),
|
|
4206
|
+
/* @__PURE__ */ import_react71.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-[11px] text-neutral-400" }, "Joined"), /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-[12px] text-black" }, formatDate(ref.joinedAt)))
|
|
4207
|
+
))), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react71.default.createElement(
|
|
4260
4208
|
"button",
|
|
4261
4209
|
{
|
|
4262
4210
|
onClick: () => onPageChange(currentPage - 1),
|
|
4263
4211
|
disabled: currentPage <= 1 || isLoading,
|
|
4264
4212
|
className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4265
4213
|
},
|
|
4266
|
-
/* @__PURE__ */
|
|
4267
|
-
), /* @__PURE__ */
|
|
4214
|
+
/* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.ArrowLeft01Icon, size: 14 })
|
|
4215
|
+
), /* @__PURE__ */ import_react71.default.createElement(
|
|
4268
4216
|
"button",
|
|
4269
4217
|
{
|
|
4270
4218
|
onClick: () => onPageChange(currentPage + 1),
|
|
4271
4219
|
disabled: currentPage >= totalPages || isLoading || totalPages === 0,
|
|
4272
4220
|
className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
4273
4221
|
},
|
|
4274
|
-
/* @__PURE__ */
|
|
4222
|
+
/* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.ArrowRight01Icon, size: 14 })
|
|
4275
4223
|
)))))));
|
|
4276
4224
|
};
|
|
4225
|
+
|
|
4226
|
+
// src/components/UniversalCardActionPage.tsx
|
|
4227
|
+
var import_react73 = __toESM(require("react"));
|
|
4228
|
+
var import_react_confetti2 = __toESM(require("react-confetti"));
|
|
4229
|
+
var import_react_use2 = require("react-use");
|
|
4230
|
+
var import_react74 = require("@hugeicons/react");
|
|
4231
|
+
var import_core_free_icons25 = require("@hugeicons/core-free-icons");
|
|
4232
|
+
var CheckIcon2 = ({ className = "" }) => /* @__PURE__ */ import_react73.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react73.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ import_react73.default.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
4233
|
+
var CrossIcon2 = ({ className = "" }) => /* @__PURE__ */ import_react73.default.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react73.default.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "#F5F5F5" }), /* @__PURE__ */ import_react73.default.createElement("path", { d: "M15 9L9 15M9 9l6 6", stroke: "#D4D4D4", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
4234
|
+
var formatTierName = (name) => {
|
|
4235
|
+
if (!name) return "";
|
|
4236
|
+
return name.charAt(0).toUpperCase() + name.slice(1).toLowerCase();
|
|
4237
|
+
};
|
|
4238
|
+
var getTierGlow = (tier) => {
|
|
4239
|
+
switch (tier.toUpperCase()) {
|
|
4240
|
+
case "PLATINUM":
|
|
4241
|
+
return "from-neutral-300";
|
|
4242
|
+
case "PREMIUM":
|
|
4243
|
+
return "from-purple-200";
|
|
4244
|
+
case "GOLD":
|
|
4245
|
+
return "from-yellow-200";
|
|
4246
|
+
case "SILVER":
|
|
4247
|
+
return "from-slate-300";
|
|
4248
|
+
case "NEO":
|
|
4249
|
+
return "from-cyan-200";
|
|
4250
|
+
case "BASIC":
|
|
4251
|
+
return "from-blue-200";
|
|
4252
|
+
case "ONE":
|
|
4253
|
+
return "from-emerald-200";
|
|
4254
|
+
case "ZERO":
|
|
4255
|
+
return "from-rose-200";
|
|
4256
|
+
default:
|
|
4257
|
+
return "from-neutral-200";
|
|
4258
|
+
}
|
|
4259
|
+
};
|
|
4260
|
+
var UniversalCardActionPage = ({
|
|
4261
|
+
cardType,
|
|
4262
|
+
currentTier,
|
|
4263
|
+
hasPreordered,
|
|
4264
|
+
onWaitlist,
|
|
4265
|
+
tiers,
|
|
4266
|
+
isLoadingData,
|
|
4267
|
+
onBack,
|
|
4268
|
+
onConfirmAction
|
|
4269
|
+
}) => {
|
|
4270
|
+
const onBackHandler = onBack ?? (() => {
|
|
4271
|
+
if (typeof window !== "undefined") window.history.back();
|
|
4272
|
+
});
|
|
4273
|
+
const { width, height } = (0, import_react_use2.useWindowSize)();
|
|
4274
|
+
const [selectedTier, setSelectedTier] = (0, import_react73.useState)(null);
|
|
4275
|
+
const [intendedAction, setIntendedAction] = (0, import_react73.useState)(null);
|
|
4276
|
+
const [isProcessing, setIsProcessing] = (0, import_react73.useState)(false);
|
|
4277
|
+
const [showConfetti, setShowConfetti] = (0, import_react73.useState)(false);
|
|
4278
|
+
const availableTiers = tiers.filter((t) => t.isAvailable || t.acceptPreorder || t.acceptWaitlist);
|
|
4279
|
+
const handleTierClick = (tier, explicitAction) => {
|
|
4280
|
+
setSelectedTier(tier);
|
|
4281
|
+
setIntendedAction(explicitAction);
|
|
4282
|
+
};
|
|
4283
|
+
const processAction = async () => {
|
|
4284
|
+
if (!selectedTier || !intendedAction) return;
|
|
4285
|
+
setIsProcessing(true);
|
|
4286
|
+
try {
|
|
4287
|
+
const result = await onConfirmAction(selectedTier.tierName, intendedAction);
|
|
4288
|
+
if (result.success) {
|
|
4289
|
+
if (intendedAction === "pre_order") {
|
|
4290
|
+
setShowConfetti(true);
|
|
4291
|
+
setTimeout(() => setShowConfetti(false), 6e3);
|
|
4292
|
+
}
|
|
4293
|
+
setSelectedTier(null);
|
|
4294
|
+
setIntendedAction(null);
|
|
4295
|
+
}
|
|
4296
|
+
} finally {
|
|
4297
|
+
setIsProcessing(false);
|
|
4298
|
+
}
|
|
4299
|
+
};
|
|
4300
|
+
const getPrimaryButtonText = (tier) => {
|
|
4301
|
+
const isCurrent = tier.tierName === currentTier;
|
|
4302
|
+
if (isCurrent) {
|
|
4303
|
+
if (hasPreordered) return "Secured (Pre-ordered)";
|
|
4304
|
+
return "Pre-order Now";
|
|
4305
|
+
}
|
|
4306
|
+
if (hasPreordered) return "Unavailable";
|
|
4307
|
+
return `Upgrade to ${formatTierName(tier.tierName)}`;
|
|
4308
|
+
};
|
|
4309
|
+
const getWaitlistButtonText = (tier) => {
|
|
4310
|
+
const isCurrent = tier.tierName === currentTier;
|
|
4311
|
+
if (isCurrent && (onWaitlist || hasPreordered)) return "Joined";
|
|
4312
|
+
return "Join Waitlist";
|
|
4313
|
+
};
|
|
4314
|
+
return /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react73.default.createElement(ManagedToaster, null), showConfetti && /* @__PURE__ */ import_react73.default.createElement("div", { className: "fixed inset-0 z-200 pointer-events-none" }, /* @__PURE__ */ import_react73.default.createElement(import_react_confetti2.default, { width, height, recycle: false, numberOfPieces: 500, gravity: 0.15 })), /* @__PURE__ */ import_react73.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react73.default.createElement(
|
|
4315
|
+
"button",
|
|
4316
|
+
{
|
|
4317
|
+
onClick: onBackHandler,
|
|
4318
|
+
className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none"
|
|
4319
|
+
},
|
|
4320
|
+
/* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.ArrowLeft01Icon, size: 16 }),
|
|
4321
|
+
" Back"
|
|
4322
|
+
)), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col animate-in max-w-5xl w-full mx-auto fade-in duration-300" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full flex flex-col items-center text-center mb-10 px-4" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-400 block uppercase mb-3" }, cardType, " CARD ACTIVATION"), /* @__PURE__ */ import_react73.default.createElement("h1", { className: "text-2xl sm:text-3xl text-black tracking-tight mb-2" }, "Select Your Tier"), /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-xs text-neutral-500 max-w-lg" }, hasPreordered ? "You have already secured your card. Upgrades are disabled while your order is pending processing." : "Upgrade your tier or secure your card now. Pre-orders guarantee priority processing when the batch goes live.")), isLoadingData ? /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex justify-center py-20" }, /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Loading03Icon, size: 32, className: "animate-spin text-neutral-300" })) : /* @__PURE__ */ import_react73.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-4xl mx-auto px-4" }, availableTiers.map((tier) => {
|
|
4323
|
+
const isCurrent = tier.tierName === currentTier;
|
|
4324
|
+
const isCardDisabled = hasPreordered && !isCurrent;
|
|
4325
|
+
const isHighlighted = hasPreordered && isCurrent;
|
|
4326
|
+
const isThisCardLoading = isProcessing && selectedTier?.tierName === tier.tierName;
|
|
4327
|
+
const isPrimaryDisabled = isCardDisabled || isHighlighted || isThisCardLoading || !tier.acceptPreorder;
|
|
4328
|
+
const isWaitlistDisabled = !isCurrent || isCurrent && (onWaitlist || hasPreordered) || isThisCardLoading || !tier.acceptWaitlist;
|
|
4329
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
4330
|
+
"div",
|
|
4331
|
+
{
|
|
4332
|
+
key: tier.tierName,
|
|
4333
|
+
className: `relative bg-white rounded-3xl p-6 flex flex-col overflow-hidden transition-all duration-300
|
|
4334
|
+
${isCardDisabled ? "opacity-50 grayscale-50 pointer-events-none" : ""}
|
|
4335
|
+
|
|
4336
|
+
`
|
|
4337
|
+
},
|
|
4338
|
+
/* @__PURE__ */ import_react73.default.createElement(
|
|
4339
|
+
"div",
|
|
4340
|
+
{
|
|
4341
|
+
className: `absolute -top-10 -right-10 w-48 h-48 bg-linear-to-bl ${getTierGlow(tier.tierName)} to-transparent opacity-40 blur-2xl rounded-full pointer-events-none`
|
|
4342
|
+
}
|
|
4343
|
+
),
|
|
4344
|
+
isThisCardLoading && /* @__PURE__ */ import_react73.default.createElement("div", { className: "absolute inset-0 z-50 flex items-center justify-center bg-white/40 backdrop-blur-[1px]" }, /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Loading03Icon, size: 32, className: "animate-spin text-black" })),
|
|
4345
|
+
/* @__PURE__ */ import_react73.default.createElement("div", { className: "mb-6 relative z-10" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex justify-between items-start mb-1" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-black text-sm tracking-widest " }, formatTierName(tier.tierName)), isCurrent && !hasPreordered && /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[9px] bg-neutral-100 text-neutral-600 px-2 py-1 rounded-full uppercase tracking-wider" }, "Current")), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-baseline gap-1 mt-2" }, /* @__PURE__ */ import_react73.default.createElement("h3", { className: "text-3xl font-light text-black" }, tier.priceUSD === 0 ? "Free" : `$${tier.priceUSD.toFixed(2)}`), tier.priceUSD > 0 && /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-xs text-neutral-500" }, tier.isYearly ? "/ year" : "one-time")), /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-[13px] text-neutral-500 mt-3 min-h-12 leading-relaxed" }, tier.description)),
|
|
4346
|
+
/* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-2.5 mb-6 relative z-10" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: isPrimaryDisabled ? "opacity-50 pointer-events-none" : "" }, /* @__PURE__ */ import_react73.default.createElement(
|
|
4347
|
+
ThreeDActionButton,
|
|
4348
|
+
{
|
|
4349
|
+
disabled: isPrimaryDisabled,
|
|
4350
|
+
onClick: () => handleTierClick(tier, isCurrent ? "pre_order" : "upgrade"),
|
|
4351
|
+
className: "w-full"
|
|
4352
|
+
},
|
|
4353
|
+
getPrimaryButtonText(tier)
|
|
4354
|
+
)), /* @__PURE__ */ import_react73.default.createElement(
|
|
4355
|
+
"button",
|
|
4356
|
+
{
|
|
4357
|
+
disabled: isWaitlistDisabled,
|
|
4358
|
+
onClick: () => handleTierClick(tier, "join_waitlist"),
|
|
4359
|
+
className: `w-full py-2.5 rounded-full text-xs tracking-wide transition-all outline-none border
|
|
4360
|
+
${isCurrent && (onWaitlist || hasPreordered) ? "bg-neutral-50 border-neutral-100 text-neutral-400 cursor-not-allowed" : "bg-white border-neutral-200 text-black hover:bg-neutral-50"}
|
|
4361
|
+
disabled:opacity-40 disabled:cursor-not-allowed
|
|
4362
|
+
`
|
|
4363
|
+
},
|
|
4364
|
+
getWaitlistButtonText(tier)
|
|
4365
|
+
)),
|
|
4366
|
+
/* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-3 relative z-10" }, tier.features.map((feature, featureIdx) => {
|
|
4367
|
+
const isAvailable = feature.value !== false;
|
|
4368
|
+
const valueText = typeof feature.value === "string" ? feature.value : "";
|
|
4369
|
+
return /* @__PURE__ */ import_react73.default.createElement("div", { key: featureIdx, className: "flex items-center gap-3" }, isAvailable ? /* @__PURE__ */ import_react73.default.createElement(CheckIcon2, null) : /* @__PURE__ */ import_react73.default.createElement(CrossIcon2, null), /* @__PURE__ */ import_react73.default.createElement("span", { className: `text-[12px] truncate ${isAvailable ? "text-neutral-800" : "text-neutral-400"}` }, feature.name, valueText && /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-neutral-500 ml-1 " }, valueText)));
|
|
4370
|
+
}))
|
|
4371
|
+
);
|
|
4372
|
+
}))), selectedTier && intendedAction !== "join_waitlist" && /* @__PURE__ */ import_react73.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isProcessing && setSelectedTier(null) }), /* @__PURE__ */ import_react73.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react73.default.createElement(
|
|
4373
|
+
"div",
|
|
4374
|
+
{
|
|
4375
|
+
className: `absolute -top-10 -right-10 w-40 h-40 bg-linear-to-bl ${getTierGlow(selectedTier.tierName)} to-transparent opacity-40 blur-2xl rounded-full pointer-events-none`
|
|
4376
|
+
}
|
|
4377
|
+
), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 relative z-10" }, /* @__PURE__ */ import_react73.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Confirm Action"), /* @__PURE__ */ import_react73.default.createElement(
|
|
4378
|
+
"button",
|
|
4379
|
+
{
|
|
4380
|
+
disabled: isProcessing,
|
|
4381
|
+
onClick: () => setSelectedTier(null),
|
|
4382
|
+
className: "text-neutral-400 hover:text-black transition-colors outline-none disabled:opacity-50"
|
|
4383
|
+
},
|
|
4384
|
+
/* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.CancelCircleIcon, size: 18 })
|
|
4385
|
+
)), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 relative z-10" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-2xl text-black mb-1" }, selectedTier.priceUSD === 0 ? "Free" : `$${selectedTier.priceUSD.toFixed(2)}`), /* @__PURE__ */ import_react73.default.createElement("span", { className: `text-[10px] tracking-widest px-4 py-1.5 rounded-full bg-neutral-100 text-black mt-1` }, formatTierName(selectedTier.tierName), " ", formatTierName(cardType))), /* @__PURE__ */ import_react73.default.createElement("div", { className: "grid grid-cols-1 gap-y-6 mb-8 mt-4" }, /* @__PURE__ */ import_react73.default.createElement("div", null, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-1" }, "Action"), /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[13px] text-black " }, intendedAction === "upgrade" ? `Upgrade to ${formatTierName(selectedTier.tierName)}` : `Pre-order Card`)), intendedAction === "pre_order" && selectedTier.priceUSD > 0 && /* @__PURE__ */ import_react73.default.createElement("div", null, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-1" }, "Payment Notice"), /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[12px] text-neutral-600 leading-relaxed block" }, "By confirming, $", selectedTier.priceUSD.toFixed(2), " will be securely deducted from your USD asset balance to guarantee your order."))), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react73.default.createElement(
|
|
4386
|
+
ThreeDActionButton,
|
|
4387
|
+
{
|
|
4388
|
+
onClick: processAction,
|
|
4389
|
+
isLoading: isProcessing,
|
|
4390
|
+
className: "w-full"
|
|
4391
|
+
},
|
|
4392
|
+
"Confirm & Proceed"
|
|
4393
|
+
), /* @__PURE__ */ import_react73.default.createElement(
|
|
4394
|
+
"button",
|
|
4395
|
+
{
|
|
4396
|
+
disabled: isProcessing,
|
|
4397
|
+
onClick: () => setSelectedTier(null),
|
|
4398
|
+
className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-[13px] mt-1 disabled:opacity-50"
|
|
4399
|
+
},
|
|
4400
|
+
"Cancel"
|
|
4401
|
+
))))), selectedTier && intendedAction === "join_waitlist" && /* @__PURE__ */ import_react73.default.createElement(
|
|
4402
|
+
ConfirmationDialog,
|
|
4403
|
+
{
|
|
4404
|
+
isOpen: true,
|
|
4405
|
+
title: "Join Waitlist",
|
|
4406
|
+
message: `Are you sure you want to join the waitlist for the ${formatTierName(selectedTier.tierName)} ${formatTierName(cardType)} card? You will be notified via email when it becomes available.`,
|
|
4407
|
+
confirmText: "Join Waitlist",
|
|
4408
|
+
isDestructive: false,
|
|
4409
|
+
isProcessing,
|
|
4410
|
+
onClose: () => setSelectedTier(null),
|
|
4411
|
+
onConfirm: processAction
|
|
4412
|
+
}
|
|
4413
|
+
));
|
|
4414
|
+
};
|
|
4277
4415
|
// Annotate the CommonJS export names for ESM import in node:
|
|
4278
4416
|
0 && (module.exports = {
|
|
4279
4417
|
AppBento2,
|
|
@@ -4303,6 +4441,7 @@ var UniversalReferralPage = ({
|
|
|
4303
4441
|
TextInput,
|
|
4304
4442
|
ThreeDActionButton,
|
|
4305
4443
|
ThreeDButton,
|
|
4444
|
+
UniversalCardActionPage,
|
|
4306
4445
|
UniversalCardPage,
|
|
4307
4446
|
UniversalErrorView,
|
|
4308
4447
|
UniversalHomeView,
|