@retinalabsllc/zairusjs 12.0.35 → 12.0.45
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 +18 -0
- package/dist/index.d.ts +18 -0
- package/dist/index.js +109 -17
- package/dist/index.mjs +169 -69
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -248,12 +248,30 @@ interface HomeActionBtn {
|
|
|
248
248
|
icon?: any;
|
|
249
249
|
onClick: () => void;
|
|
250
250
|
}
|
|
251
|
+
interface NotificationItem {
|
|
252
|
+
id: string;
|
|
253
|
+
title: string;
|
|
254
|
+
message: string;
|
|
255
|
+
isRead: boolean;
|
|
256
|
+
createdAt: string | Date;
|
|
257
|
+
}
|
|
251
258
|
interface UniversalHomeViewProps {
|
|
259
|
+
fullName?: string;
|
|
260
|
+
avatarSrc?: string | null;
|
|
252
261
|
balanceLabel?: string;
|
|
253
262
|
balanceAmount: string;
|
|
254
263
|
balanceCurrency?: string;
|
|
264
|
+
cashbackValue: number;
|
|
265
|
+
rewardsValue: number;
|
|
255
266
|
primaryAction?: HomeActionBtn;
|
|
256
267
|
secondaryAction?: HomeActionBtn;
|
|
268
|
+
notifications?: NotificationItem[];
|
|
269
|
+
notificationPage?: number;
|
|
270
|
+
notificationTotalPages?: number;
|
|
271
|
+
isNotifsLoading?: boolean;
|
|
272
|
+
onNotificationPageChange?: (page: number) => void;
|
|
273
|
+
onNotificationClick?: (notif: NotificationItem) => void;
|
|
274
|
+
formatNotifDate: (date: string | Date) => string;
|
|
257
275
|
customContent?: React.ReactNode;
|
|
258
276
|
transactionsProps: UniversalTransactionPageProps;
|
|
259
277
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -248,12 +248,30 @@ interface HomeActionBtn {
|
|
|
248
248
|
icon?: any;
|
|
249
249
|
onClick: () => void;
|
|
250
250
|
}
|
|
251
|
+
interface NotificationItem {
|
|
252
|
+
id: string;
|
|
253
|
+
title: string;
|
|
254
|
+
message: string;
|
|
255
|
+
isRead: boolean;
|
|
256
|
+
createdAt: string | Date;
|
|
257
|
+
}
|
|
251
258
|
interface UniversalHomeViewProps {
|
|
259
|
+
fullName?: string;
|
|
260
|
+
avatarSrc?: string | null;
|
|
252
261
|
balanceLabel?: string;
|
|
253
262
|
balanceAmount: string;
|
|
254
263
|
balanceCurrency?: string;
|
|
264
|
+
cashbackValue: number;
|
|
265
|
+
rewardsValue: number;
|
|
255
266
|
primaryAction?: HomeActionBtn;
|
|
256
267
|
secondaryAction?: HomeActionBtn;
|
|
268
|
+
notifications?: NotificationItem[];
|
|
269
|
+
notificationPage?: number;
|
|
270
|
+
notificationTotalPages?: number;
|
|
271
|
+
isNotifsLoading?: boolean;
|
|
272
|
+
onNotificationPageChange?: (page: number) => void;
|
|
273
|
+
onNotificationClick?: (notif: NotificationItem) => void;
|
|
274
|
+
formatNotifDate: (date: string | Date) => string;
|
|
257
275
|
customContent?: React.ReactNode;
|
|
258
276
|
transactionsProps: UniversalTransactionPageProps;
|
|
259
277
|
}
|
package/dist/index.js
CHANGED
|
@@ -1398,7 +1398,7 @@ var UniversalTransactionPage = ({
|
|
|
1398
1398
|
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"
|
|
1399
1399
|
},
|
|
1400
1400
|
/* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.ArrowRight01Icon, size: 14 })
|
|
1401
|
-
)))))), selectedTransaction && /* @__PURE__ */ import_react23.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ import_react23.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_react23.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react23.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Details"), /* @__PURE__ */ import_react23.default.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-100 text-black` }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: selectedTransaction.direction === "CREDIT" ? import_core_free_icons7.ArrowDownRight01Icon : import_core_free_icons7.ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ import_react23.default.createElement("
|
|
1401
|
+
)))))), selectedTransaction && /* @__PURE__ */ import_react23.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ import_react23.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_react23.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react23.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Details"), /* @__PURE__ */ import_react23.default.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-100 text-black` }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: selectedTransaction.direction === "CREDIT" ? import_core_free_icons7.ArrowDownRight01Icon : import_core_free_icons7.ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ import_react23.default.createElement("p", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedTransaction.amount), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full bg-neutral-50" }, selectedTransaction.status)), /* @__PURE__ */ import_react23.default.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Reference ID"), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateReference(selectedTransaction.reference)), /* @__PURE__ */ import_react23.default.createElement(
|
|
1402
1402
|
"button",
|
|
1403
1403
|
{
|
|
1404
1404
|
onClick: () => handleCopyReference(selectedTransaction.reference),
|
|
@@ -1481,17 +1481,50 @@ var UniversalTransactionPage = ({
|
|
|
1481
1481
|
var import_react25 = __toESM(require("react"));
|
|
1482
1482
|
var import_react26 = require("@hugeicons/react");
|
|
1483
1483
|
var import_core_free_icons8 = require("@hugeicons/core-free-icons");
|
|
1484
|
+
var renderKMT = (val, currencySymbol) => {
|
|
1485
|
+
let formatted = val;
|
|
1486
|
+
let suffix = "";
|
|
1487
|
+
if (val >= 1e12) {
|
|
1488
|
+
formatted = val / 1e12;
|
|
1489
|
+
suffix = "T";
|
|
1490
|
+
} else if (val >= 1e6) {
|
|
1491
|
+
formatted = val / 1e6;
|
|
1492
|
+
suffix = "M";
|
|
1493
|
+
} else if (val >= 1e3) {
|
|
1494
|
+
formatted = val / 1e3;
|
|
1495
|
+
suffix = "k";
|
|
1496
|
+
}
|
|
1497
|
+
const displayStr = parseFloat(formatted.toFixed(2)).toString();
|
|
1498
|
+
return /* @__PURE__ */ import_react25.default.createElement("span", { className: "flex items-baseline mt-1" }, /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[13px] text-neutral-400 mr-0.5 " }, currencySymbol), /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-xl text-neutral-800 tracking-tight " }, displayStr), /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[14px] text-neutral-400 ml-0.5 " }, suffix));
|
|
1499
|
+
};
|
|
1484
1500
|
var UniversalHomeView = ({
|
|
1485
|
-
|
|
1501
|
+
fullName = "",
|
|
1502
|
+
avatarSrc,
|
|
1503
|
+
balanceLabel = "Available Balance",
|
|
1486
1504
|
balanceAmount,
|
|
1487
|
-
balanceCurrency = "",
|
|
1505
|
+
balanceCurrency = "$",
|
|
1506
|
+
cashbackValue,
|
|
1507
|
+
rewardsValue,
|
|
1488
1508
|
primaryAction,
|
|
1489
1509
|
secondaryAction,
|
|
1510
|
+
notifications = [],
|
|
1511
|
+
notificationPage = 1,
|
|
1512
|
+
notificationTotalPages = 1,
|
|
1513
|
+
isNotifsLoading = false,
|
|
1514
|
+
onNotificationPageChange,
|
|
1515
|
+
onNotificationClick,
|
|
1516
|
+
formatNotifDate,
|
|
1490
1517
|
customContent,
|
|
1491
1518
|
transactionsProps
|
|
1492
1519
|
}) => {
|
|
1493
1520
|
const [displayAmount, setDisplayAmount] = (0, import_react25.useState)("0.00");
|
|
1494
1521
|
const [isBalanceHidden, setIsBalanceHidden] = (0, import_react25.useState)(false);
|
|
1522
|
+
const [isAvatarLoaded, setIsAvatarLoaded] = (0, import_react25.useState)(false);
|
|
1523
|
+
const [showNotifDialog, setShowNotifDialog] = (0, import_react25.useState)(false);
|
|
1524
|
+
const [selectedNotif, setSelectedNotif] = (0, import_react25.useState)(null);
|
|
1525
|
+
const fallbackAvatarUrl = `/api/avatar/?name=${encodeURIComponent(fullName || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
|
|
1526
|
+
const finalAvatarSrc = avatarSrc || fallbackAvatarUrl;
|
|
1527
|
+
const hasUnreadNotifs = notifications.some((n) => !n.isRead);
|
|
1495
1528
|
(0, import_react25.useEffect)(() => {
|
|
1496
1529
|
const target = parseFloat(balanceAmount.replace(/,/g, ""));
|
|
1497
1530
|
if (isNaN(target)) {
|
|
@@ -1511,9 +1544,8 @@ var UniversalHomeView = ({
|
|
|
1511
1544
|
minimumFractionDigits: fractionDigits,
|
|
1512
1545
|
maximumFractionDigits: fractionDigits
|
|
1513
1546
|
}));
|
|
1514
|
-
if (progress < 1)
|
|
1515
|
-
|
|
1516
|
-
} else {
|
|
1547
|
+
if (progress < 1) requestAnimationFrame(step);
|
|
1548
|
+
else {
|
|
1517
1549
|
setDisplayAmount(target.toLocaleString("en-US", {
|
|
1518
1550
|
minimumFractionDigits: fractionDigits,
|
|
1519
1551
|
maximumFractionDigits: fractionDigits
|
|
@@ -1523,28 +1555,60 @@ var UniversalHomeView = ({
|
|
|
1523
1555
|
requestAnimationFrame(step);
|
|
1524
1556
|
}, [balanceAmount]);
|
|
1525
1557
|
const [intPart, decPart] = displayAmount.includes(".") ? displayAmount.split(".") : [displayAmount, ""];
|
|
1526
|
-
return /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "
|
|
1558
|
+
return /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex items-center justify-between w-full pb-4 " }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-10 h-10 rounded-full bg-white p-0.75 flex items-center justify-center " }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, !isAvatarLoaded && /* @__PURE__ */ import_react25.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-100" }, /* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: import_core_free_icons8.Loading03Icon, size: 16, className: "animate-spin text-black" })), /* @__PURE__ */ import_react25.default.createElement(
|
|
1559
|
+
"img",
|
|
1560
|
+
{
|
|
1561
|
+
src: finalAvatarSrc,
|
|
1562
|
+
alt: "User Avatar",
|
|
1563
|
+
onLoad: () => setIsAvatarLoaded(true),
|
|
1564
|
+
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
1565
|
+
}
|
|
1566
|
+
))), /* @__PURE__ */ import_react25.default.createElement(
|
|
1567
|
+
"button",
|
|
1568
|
+
{
|
|
1569
|
+
onClick: () => {
|
|
1570
|
+
setShowNotifDialog(true);
|
|
1571
|
+
setSelectedNotif(null);
|
|
1572
|
+
},
|
|
1573
|
+
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-neutral-50 transition-colors"
|
|
1574
|
+
},
|
|
1575
|
+
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: import_core_free_icons8.Notification01Icon, size: 20, className: "text-black" }),
|
|
1576
|
+
hasUnreadNotifs && /* @__PURE__ */ import_react25.default.createElement("span", { className: "absolute top-2.5 right-2.5 w-2 h-2 bg-red-500 rounded-full border border-white" })
|
|
1577
|
+
)), /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full pb-6 flex flex-col gap-4" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "bg-linear-to-tl from-[#4a4a4a] via-[#0b0e14] to-[#03060b] rounded-2xl p-6 relative overflow-hidden flex flex-col justify-center" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "relative z-10 flex flex-col items-start text-left w-full" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[12px] text-neutral-300" }, balanceLabel), /* @__PURE__ */ import_react25.default.createElement(
|
|
1527
1578
|
"button",
|
|
1528
1579
|
{
|
|
1529
1580
|
onClick: () => setIsBalanceHidden(!isBalanceHidden),
|
|
1530
|
-
className: "text-neutral-400 hover:text-
|
|
1581
|
+
className: "text-neutral-400 hover:text-white transition-colors outline-none"
|
|
1531
1582
|
},
|
|
1532
|
-
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: isBalanceHidden ? import_core_free_icons8.ViewIcon : import_core_free_icons8.ViewOffSlashIcon, size:
|
|
1533
|
-
)), /* @__PURE__ */ import_react25.default.createElement("p", { className: `text-
|
|
1534
|
-
|
|
1583
|
+
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: isBalanceHidden ? import_core_free_icons8.ViewIcon : import_core_free_icons8.ViewOffSlashIcon, size: 16 })
|
|
1584
|
+
)), /* @__PURE__ */ import_react25.default.createElement("p", { className: `text-2xl text-white tracking-tight mb-6 tabular-nums flex items-baseline transition-all duration-300 ${isBalanceHidden ? "blur-sm opacity-40 select-none" : ""}` }, /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-lg text-neutral-400 mr-1" }, balanceCurrency), intPart, decPart && /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-lg text-neutral-400" }, ".", decPart)), /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex items-center gap-3 w-full" }, primaryAction && /* @__PURE__ */ import_react25.default.createElement(
|
|
1585
|
+
"button",
|
|
1535
1586
|
{
|
|
1536
1587
|
onClick: primaryAction.onClick,
|
|
1537
|
-
className: "px-6
|
|
1588
|
+
className: "px-6 py-2 bg-white text-black text-[12px] truncate rounded-full transition-opacity hover:opacity-90 outline-none text-center"
|
|
1538
1589
|
},
|
|
1539
|
-
|
|
1590
|
+
"Deposit"
|
|
1540
1591
|
), secondaryAction && /* @__PURE__ */ import_react25.default.createElement(
|
|
1541
1592
|
"button",
|
|
1542
1593
|
{
|
|
1543
1594
|
onClick: secondaryAction.onClick,
|
|
1544
|
-
className: "
|
|
1595
|
+
className: "px-6 py-2 bg-transparent border border-white/20 text-white truncate text-[12px] rounded-full transition-colors hover:bg-white/10 outline-none text-center"
|
|
1545
1596
|
},
|
|
1546
|
-
|
|
1547
|
-
|
|
1597
|
+
"Rewards"
|
|
1598
|
+
)))), /* @__PURE__ */ import_react25.default.createElement("div", { className: "grid grid-cols-2 gap-2" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "bg-[linear-gradient(135deg,rgba(255,255,255,0.96)_0%,#FFD0AE_75%)] rounded-2xl p-5 relative overflow-hidden flex flex-col h-45 sm:h-50" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react25.default.createElement("p", { className: "text-[15px] sm:text-[15px] text-neutral-600 mb-1" }, "Cashback"), renderKMT(cashbackValue, balanceCurrency)), /* @__PURE__ */ import_react25.default.createElement(
|
|
1599
|
+
"img",
|
|
1600
|
+
{
|
|
1601
|
+
src: "https://retinalabs.company/assets/images/piggy.avif",
|
|
1602
|
+
alt: "Cashback",
|
|
1603
|
+
className: "absolute bottom-6 right-4 translate-x-1/4 translate-y-1/2 w-40 h-auto object-contain z-0 pointer-events-none drop-shadow-md"
|
|
1604
|
+
}
|
|
1605
|
+
)), /* @__PURE__ */ import_react25.default.createElement("div", { className: "bg-[linear-gradient(135deg,rgba(255,255,255,0.96)_0%,#C8F7A8_75%)] rounded-2xl p-5 relative overflow-hidden flex flex-col h-45 sm:h-50" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react25.default.createElement("p", { className: "text-[15px] sm:text-[15px] text-neutral-600 mb-1" }, "Rewards"), renderKMT(rewardsValue, balanceCurrency)), /* @__PURE__ */ import_react25.default.createElement(
|
|
1606
|
+
"img",
|
|
1607
|
+
{
|
|
1608
|
+
src: "https://retinalabs.company/assets/images/gift.avif",
|
|
1609
|
+
alt: "Rewards",
|
|
1610
|
+
className: "absolute bottom-6 right-4 translate-x-1/4 translate-y-1/2 w-40 h-auto object-contain z-0 pointer-events-none drop-shadow-md"
|
|
1611
|
+
}
|
|
1548
1612
|
)))), customContent && /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full" }, customContent), /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
1549
1613
|
UniversalTransactionPage,
|
|
1550
1614
|
{
|
|
@@ -1553,7 +1617,35 @@ var UniversalHomeView = ({
|
|
|
1553
1617
|
hideBalanceAmounts: isBalanceHidden,
|
|
1554
1618
|
hidePagination: true
|
|
1555
1619
|
}
|
|
1556
|
-
)))
|
|
1620
|
+
)), showNotifDialog && /* @__PURE__ */ import_react25.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ import_react25.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 h-[80vh]" }, /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, selectedNotif ? /* @__PURE__ */ import_react25.default.createElement("button", { onClick: () => setSelectedNotif(null), className: "text-neutral-400 hover:text-black transition-colors outline-none flex items-center gap-2 text-[11px] tracking-widest uppercase" }, /* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: import_core_free_icons8.ArrowLeft01Icon, size: 14 }), " Back") : /* @__PURE__ */ import_react25.default.createElement("h3", { className: "text-[15px] text-black tracking-tight flex items-center gap-2" }, "Notifications", isNotifsLoading && /* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: import_core_free_icons8.Loading03Icon, size: 14, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ import_react25.default.createElement("button", { onClick: () => setShowNotifDialog(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: import_core_free_icons8.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, selectedNotif ? /* @__PURE__ */ import_react25.default.createElement("div", { className: "p-4 text-left" }, /* @__PURE__ */ import_react25.default.createElement("h4", { className: "text-[14px] text-black mb-1 " }, selectedNotif.title), /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[10px] text-neutral-400 tracking-widest mb-4 block uppercase" }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ import_react25.default.createElement("p", { className: "text-[12px] text-neutral-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message)) : /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex flex-col divide-y divide-neutral-50/50" }, notifications?.length === 0 && !isNotifsLoading ? /* @__PURE__ */ import_react25.default.createElement("div", { className: "p-8 text-center text-xs text-neutral-400" }, "You have no notifications.") : notifications?.map((notif) => /* @__PURE__ */ import_react25.default.createElement(
|
|
1621
|
+
"div",
|
|
1622
|
+
{
|
|
1623
|
+
key: notif.id,
|
|
1624
|
+
onClick: () => {
|
|
1625
|
+
setSelectedNotif(notif);
|
|
1626
|
+
onNotificationClick?.(notif);
|
|
1627
|
+
},
|
|
1628
|
+
className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-neutral-50"}`
|
|
1629
|
+
},
|
|
1630
|
+
/* @__PURE__ */ import_react25.default.createElement("div", { className: "mt-1.5 shrink-0" }, !notif.isRead ? /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-1.5 h-1.5 bg-red-500 rounded-full" }) : /* @__PURE__ */ import_react25.default.createElement("div", { className: "w-1.5 h-1.5 bg-transparent" })),
|
|
1631
|
+
/* @__PURE__ */ import_react25.default.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ import_react25.default.createElement("h5", { className: `text-[12px] truncate ${notif.isRead ? "text-neutral-500" : "text-black "}` }, notif.title), /* @__PURE__ */ import_react25.default.createElement("p", { className: "text-[11px] text-neutral-400 truncate mt-0.5" }, notif.message), /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[9px] text-neutral-400 tracking-widest mt-2 block uppercase" }, formatNotifDate(notif.createdAt)))
|
|
1632
|
+
)))), !selectedNotif && /* @__PURE__ */ import_react25.default.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 " }, /* @__PURE__ */ import_react25.default.createElement("span", { className: "text-[10px] text-neutral-400 tracking-widest uppercase" }, "Page ", notificationPage, " of ", notificationTotalPages === 0 ? 1 : notificationTotalPages), /* @__PURE__ */ import_react25.default.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ import_react25.default.createElement(
|
|
1633
|
+
"button",
|
|
1634
|
+
{
|
|
1635
|
+
disabled: notificationPage <= 1 || isNotifsLoading,
|
|
1636
|
+
onClick: () => onNotificationPageChange?.(notificationPage - 1),
|
|
1637
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-neutral-200 text-neutral-600 disabled:opacity-30 outline-none hover:bg-neutral-50 transition-colors"
|
|
1638
|
+
},
|
|
1639
|
+
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: import_core_free_icons8.ArrowLeft01Icon, size: 12 })
|
|
1640
|
+
), /* @__PURE__ */ import_react25.default.createElement(
|
|
1641
|
+
"button",
|
|
1642
|
+
{
|
|
1643
|
+
disabled: notificationPage >= notificationTotalPages || notificationTotalPages === 0 || isNotifsLoading,
|
|
1644
|
+
onClick: () => onNotificationPageChange?.(notificationPage + 1),
|
|
1645
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-neutral-200 text-neutral-600 disabled:opacity-30 outline-none hover:bg-neutral-50 transition-colors"
|
|
1646
|
+
},
|
|
1647
|
+
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: import_core_free_icons8.ArrowRight01Icon, size: 12 })
|
|
1648
|
+
))))));
|
|
1557
1649
|
};
|
|
1558
1650
|
|
|
1559
1651
|
// src/components/UniversalWalletPage.tsx
|
package/dist/index.mjs
CHANGED
|
@@ -1351,7 +1351,7 @@ var UniversalTransactionPage = ({
|
|
|
1351
1351
|
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"
|
|
1352
1352
|
},
|
|
1353
1353
|
/* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon: ArrowRight01Icon, size: 14 })
|
|
1354
|
-
)))))), selectedTransaction && /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React15.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ React15.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__ */ React15.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React15.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Details"), /* @__PURE__ */ React15.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon: CancelCircleIcon2, size: 18 }))), /* @__PURE__ */ React15.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ React15.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ React15.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-100 text-black` }, /* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon: selectedTransaction.direction === "CREDIT" ? ArrowDownRight01Icon : ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ React15.createElement("
|
|
1354
|
+
)))))), selectedTransaction && /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React15.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ React15.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__ */ React15.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React15.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Details"), /* @__PURE__ */ React15.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon: CancelCircleIcon2, size: 18 }))), /* @__PURE__ */ React15.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ React15.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ React15.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-100 text-black` }, /* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon: selectedTransaction.direction === "CREDIT" ? ArrowDownRight01Icon : ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ React15.createElement("p", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedTransaction.amount), /* @__PURE__ */ React15.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full bg-neutral-50" }, selectedTransaction.status)), /* @__PURE__ */ React15.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Reference ID"), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React15.createElement("span", { className: "text-[13px] text-black truncate min-w-0 block" }, truncateReference(selectedTransaction.reference)), /* @__PURE__ */ React15.createElement(
|
|
1355
1355
|
"button",
|
|
1356
1356
|
{
|
|
1357
1357
|
onClick: () => handleCopyReference(selectedTransaction.reference),
|
|
@@ -1433,18 +1433,59 @@ var UniversalTransactionPage = ({
|
|
|
1433
1433
|
// src/components/UniversalHomeView.tsx
|
|
1434
1434
|
import React16, { useState as useState9, useEffect as useEffect7 } from "react";
|
|
1435
1435
|
import { HugeiconsIcon as HugeiconsIcon10 } from "@hugeicons/react";
|
|
1436
|
-
import {
|
|
1436
|
+
import {
|
|
1437
|
+
ViewOffSlashIcon,
|
|
1438
|
+
ViewIcon,
|
|
1439
|
+
Loading03Icon as Loading03Icon5,
|
|
1440
|
+
Notification01Icon,
|
|
1441
|
+
ArrowLeft01Icon as ArrowLeft01Icon4,
|
|
1442
|
+
ArrowRight01Icon as ArrowRight01Icon2,
|
|
1443
|
+
CancelCircleIcon as CancelCircleIcon3
|
|
1444
|
+
} from "@hugeicons/core-free-icons";
|
|
1445
|
+
var renderKMT = (val, currencySymbol) => {
|
|
1446
|
+
let formatted = val;
|
|
1447
|
+
let suffix = "";
|
|
1448
|
+
if (val >= 1e12) {
|
|
1449
|
+
formatted = val / 1e12;
|
|
1450
|
+
suffix = "T";
|
|
1451
|
+
} else if (val >= 1e6) {
|
|
1452
|
+
formatted = val / 1e6;
|
|
1453
|
+
suffix = "M";
|
|
1454
|
+
} else if (val >= 1e3) {
|
|
1455
|
+
formatted = val / 1e3;
|
|
1456
|
+
suffix = "k";
|
|
1457
|
+
}
|
|
1458
|
+
const displayStr = parseFloat(formatted.toFixed(2)).toString();
|
|
1459
|
+
return /* @__PURE__ */ React16.createElement("span", { className: "flex items-baseline mt-1" }, /* @__PURE__ */ React16.createElement("span", { className: "text-[13px] text-neutral-400 mr-0.5 " }, currencySymbol), /* @__PURE__ */ React16.createElement("span", { className: "text-xl text-neutral-800 tracking-tight " }, displayStr), /* @__PURE__ */ React16.createElement("span", { className: "text-[14px] text-neutral-400 ml-0.5 " }, suffix));
|
|
1460
|
+
};
|
|
1437
1461
|
var UniversalHomeView = ({
|
|
1438
|
-
|
|
1462
|
+
fullName = "",
|
|
1463
|
+
avatarSrc,
|
|
1464
|
+
balanceLabel = "Available Balance",
|
|
1439
1465
|
balanceAmount,
|
|
1440
|
-
balanceCurrency = "",
|
|
1466
|
+
balanceCurrency = "$",
|
|
1467
|
+
cashbackValue,
|
|
1468
|
+
rewardsValue,
|
|
1441
1469
|
primaryAction,
|
|
1442
1470
|
secondaryAction,
|
|
1471
|
+
notifications = [],
|
|
1472
|
+
notificationPage = 1,
|
|
1473
|
+
notificationTotalPages = 1,
|
|
1474
|
+
isNotifsLoading = false,
|
|
1475
|
+
onNotificationPageChange,
|
|
1476
|
+
onNotificationClick,
|
|
1477
|
+
formatNotifDate,
|
|
1443
1478
|
customContent,
|
|
1444
1479
|
transactionsProps
|
|
1445
1480
|
}) => {
|
|
1446
1481
|
const [displayAmount, setDisplayAmount] = useState9("0.00");
|
|
1447
1482
|
const [isBalanceHidden, setIsBalanceHidden] = useState9(false);
|
|
1483
|
+
const [isAvatarLoaded, setIsAvatarLoaded] = useState9(false);
|
|
1484
|
+
const [showNotifDialog, setShowNotifDialog] = useState9(false);
|
|
1485
|
+
const [selectedNotif, setSelectedNotif] = useState9(null);
|
|
1486
|
+
const fallbackAvatarUrl = `/api/avatar/?name=${encodeURIComponent(fullName || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
|
|
1487
|
+
const finalAvatarSrc = avatarSrc || fallbackAvatarUrl;
|
|
1488
|
+
const hasUnreadNotifs = notifications.some((n) => !n.isRead);
|
|
1448
1489
|
useEffect7(() => {
|
|
1449
1490
|
const target = parseFloat(balanceAmount.replace(/,/g, ""));
|
|
1450
1491
|
if (isNaN(target)) {
|
|
@@ -1464,9 +1505,8 @@ var UniversalHomeView = ({
|
|
|
1464
1505
|
minimumFractionDigits: fractionDigits,
|
|
1465
1506
|
maximumFractionDigits: fractionDigits
|
|
1466
1507
|
}));
|
|
1467
|
-
if (progress < 1)
|
|
1468
|
-
|
|
1469
|
-
} else {
|
|
1508
|
+
if (progress < 1) requestAnimationFrame(step);
|
|
1509
|
+
else {
|
|
1470
1510
|
setDisplayAmount(target.toLocaleString("en-US", {
|
|
1471
1511
|
minimumFractionDigits: fractionDigits,
|
|
1472
1512
|
maximumFractionDigits: fractionDigits
|
|
@@ -1476,28 +1516,60 @@ var UniversalHomeView = ({
|
|
|
1476
1516
|
requestAnimationFrame(step);
|
|
1477
1517
|
}, [balanceAmount]);
|
|
1478
1518
|
const [intPart, decPart] = displayAmount.includes(".") ? displayAmount.split(".") : [displayAmount, ""];
|
|
1479
|
-
return /* @__PURE__ */ React16.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React16.createElement("div", { className: "
|
|
1519
|
+
return /* @__PURE__ */ React16.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React16.createElement("div", { className: "flex items-center justify-between w-full pb-4 " }, /* @__PURE__ */ React16.createElement("div", { className: "w-10 h-10 rounded-full bg-white p-0.75 flex items-center justify-center " }, /* @__PURE__ */ React16.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, !isAvatarLoaded && /* @__PURE__ */ React16.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-100" }, /* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: Loading03Icon5, size: 16, className: "animate-spin text-black" })), /* @__PURE__ */ React16.createElement(
|
|
1520
|
+
"img",
|
|
1521
|
+
{
|
|
1522
|
+
src: finalAvatarSrc,
|
|
1523
|
+
alt: "User Avatar",
|
|
1524
|
+
onLoad: () => setIsAvatarLoaded(true),
|
|
1525
|
+
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
1526
|
+
}
|
|
1527
|
+
))), /* @__PURE__ */ React16.createElement(
|
|
1528
|
+
"button",
|
|
1529
|
+
{
|
|
1530
|
+
onClick: () => {
|
|
1531
|
+
setShowNotifDialog(true);
|
|
1532
|
+
setSelectedNotif(null);
|
|
1533
|
+
},
|
|
1534
|
+
className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-neutral-50 transition-colors"
|
|
1535
|
+
},
|
|
1536
|
+
/* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: Notification01Icon, size: 20, className: "text-black" }),
|
|
1537
|
+
hasUnreadNotifs && /* @__PURE__ */ React16.createElement("span", { className: "absolute top-2.5 right-2.5 w-2 h-2 bg-red-500 rounded-full border border-white" })
|
|
1538
|
+
)), /* @__PURE__ */ React16.createElement("div", { className: "w-full pb-6 flex flex-col gap-4" }, /* @__PURE__ */ React16.createElement("div", { className: "bg-linear-to-tl from-[#4a4a4a] via-[#0b0e14] to-[#03060b] rounded-2xl p-6 relative overflow-hidden flex flex-col justify-center" }, /* @__PURE__ */ React16.createElement("div", { className: "relative z-10 flex flex-col items-start text-left w-full" }, /* @__PURE__ */ React16.createElement("div", { className: "flex items-center gap-2 mb-2" }, /* @__PURE__ */ React16.createElement("span", { className: "text-[12px] text-neutral-300" }, balanceLabel), /* @__PURE__ */ React16.createElement(
|
|
1480
1539
|
"button",
|
|
1481
1540
|
{
|
|
1482
1541
|
onClick: () => setIsBalanceHidden(!isBalanceHidden),
|
|
1483
|
-
className: "text-neutral-400 hover:text-
|
|
1542
|
+
className: "text-neutral-400 hover:text-white transition-colors outline-none"
|
|
1484
1543
|
},
|
|
1485
|
-
/* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: isBalanceHidden ? ViewIcon : ViewOffSlashIcon, size:
|
|
1486
|
-
)), /* @__PURE__ */ React16.createElement("p", { className: `text-
|
|
1487
|
-
|
|
1544
|
+
/* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: isBalanceHidden ? ViewIcon : ViewOffSlashIcon, size: 16 })
|
|
1545
|
+
)), /* @__PURE__ */ React16.createElement("p", { className: `text-2xl text-white tracking-tight mb-6 tabular-nums flex items-baseline transition-all duration-300 ${isBalanceHidden ? "blur-sm opacity-40 select-none" : ""}` }, /* @__PURE__ */ React16.createElement("span", { className: "text-lg text-neutral-400 mr-1" }, balanceCurrency), intPart, decPart && /* @__PURE__ */ React16.createElement("span", { className: "text-lg text-neutral-400" }, ".", decPart)), /* @__PURE__ */ React16.createElement("div", { className: "flex items-center gap-3 w-full" }, primaryAction && /* @__PURE__ */ React16.createElement(
|
|
1546
|
+
"button",
|
|
1488
1547
|
{
|
|
1489
1548
|
onClick: primaryAction.onClick,
|
|
1490
|
-
className: "px-6
|
|
1549
|
+
className: "px-6 py-2 bg-white text-black text-[12px] truncate rounded-full transition-opacity hover:opacity-90 outline-none text-center"
|
|
1491
1550
|
},
|
|
1492
|
-
|
|
1551
|
+
"Deposit"
|
|
1493
1552
|
), secondaryAction && /* @__PURE__ */ React16.createElement(
|
|
1494
1553
|
"button",
|
|
1495
1554
|
{
|
|
1496
1555
|
onClick: secondaryAction.onClick,
|
|
1497
|
-
className: "
|
|
1556
|
+
className: "px-6 py-2 bg-transparent border border-white/20 text-white truncate text-[12px] rounded-full transition-colors hover:bg-white/10 outline-none text-center"
|
|
1498
1557
|
},
|
|
1499
|
-
|
|
1500
|
-
|
|
1558
|
+
"Rewards"
|
|
1559
|
+
)))), /* @__PURE__ */ React16.createElement("div", { className: "grid grid-cols-2 gap-2" }, /* @__PURE__ */ React16.createElement("div", { className: "bg-[linear-gradient(135deg,rgba(255,255,255,0.96)_0%,#FFD0AE_75%)] rounded-2xl p-5 relative overflow-hidden flex flex-col h-45 sm:h-50" }, /* @__PURE__ */ React16.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React16.createElement("p", { className: "text-[15px] sm:text-[15px] text-neutral-600 mb-1" }, "Cashback"), renderKMT(cashbackValue, balanceCurrency)), /* @__PURE__ */ React16.createElement(
|
|
1560
|
+
"img",
|
|
1561
|
+
{
|
|
1562
|
+
src: "https://retinalabs.company/assets/images/piggy.avif",
|
|
1563
|
+
alt: "Cashback",
|
|
1564
|
+
className: "absolute bottom-6 right-4 translate-x-1/4 translate-y-1/2 w-40 h-auto object-contain z-0 pointer-events-none drop-shadow-md"
|
|
1565
|
+
}
|
|
1566
|
+
)), /* @__PURE__ */ React16.createElement("div", { className: "bg-[linear-gradient(135deg,rgba(255,255,255,0.96)_0%,#C8F7A8_75%)] rounded-2xl p-5 relative overflow-hidden flex flex-col h-45 sm:h-50" }, /* @__PURE__ */ React16.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React16.createElement("p", { className: "text-[15px] sm:text-[15px] text-neutral-600 mb-1" }, "Rewards"), renderKMT(rewardsValue, balanceCurrency)), /* @__PURE__ */ React16.createElement(
|
|
1567
|
+
"img",
|
|
1568
|
+
{
|
|
1569
|
+
src: "https://retinalabs.company/assets/images/gift.avif",
|
|
1570
|
+
alt: "Rewards",
|
|
1571
|
+
className: "absolute bottom-6 right-4 translate-x-1/4 translate-y-1/2 w-40 h-auto object-contain z-0 pointer-events-none drop-shadow-md"
|
|
1572
|
+
}
|
|
1501
1573
|
)))), customContent && /* @__PURE__ */ React16.createElement("div", { className: "w-full" }, customContent), /* @__PURE__ */ React16.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ React16.createElement(
|
|
1502
1574
|
UniversalTransactionPage,
|
|
1503
1575
|
{
|
|
@@ -1506,7 +1578,35 @@ var UniversalHomeView = ({
|
|
|
1506
1578
|
hideBalanceAmounts: isBalanceHidden,
|
|
1507
1579
|
hidePagination: true
|
|
1508
1580
|
}
|
|
1509
|
-
)))
|
|
1581
|
+
)), showNotifDialog && /* @__PURE__ */ React16.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React16.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ React16.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 h-[80vh]" }, /* @__PURE__ */ React16.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, selectedNotif ? /* @__PURE__ */ React16.createElement("button", { onClick: () => setSelectedNotif(null), className: "text-neutral-400 hover:text-black transition-colors outline-none flex items-center gap-2 text-[11px] tracking-widest uppercase" }, /* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: ArrowLeft01Icon4, size: 14 }), " Back") : /* @__PURE__ */ React16.createElement("h3", { className: "text-[15px] text-black tracking-tight flex items-center gap-2" }, "Notifications", isNotifsLoading && /* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: Loading03Icon5, size: 14, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ React16.createElement("button", { onClick: () => setShowNotifDialog(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React16.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, selectedNotif ? /* @__PURE__ */ React16.createElement("div", { className: "p-4 text-left" }, /* @__PURE__ */ React16.createElement("h4", { className: "text-[14px] text-black mb-1 " }, selectedNotif.title), /* @__PURE__ */ React16.createElement("span", { className: "text-[10px] text-neutral-400 tracking-widest mb-4 block uppercase" }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ React16.createElement("p", { className: "text-[12px] text-neutral-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message)) : /* @__PURE__ */ React16.createElement("div", { className: "flex flex-col divide-y divide-neutral-50/50" }, notifications?.length === 0 && !isNotifsLoading ? /* @__PURE__ */ React16.createElement("div", { className: "p-8 text-center text-xs text-neutral-400" }, "You have no notifications.") : notifications?.map((notif) => /* @__PURE__ */ React16.createElement(
|
|
1582
|
+
"div",
|
|
1583
|
+
{
|
|
1584
|
+
key: notif.id,
|
|
1585
|
+
onClick: () => {
|
|
1586
|
+
setSelectedNotif(notif);
|
|
1587
|
+
onNotificationClick?.(notif);
|
|
1588
|
+
},
|
|
1589
|
+
className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-neutral-50"}`
|
|
1590
|
+
},
|
|
1591
|
+
/* @__PURE__ */ React16.createElement("div", { className: "mt-1.5 shrink-0" }, !notif.isRead ? /* @__PURE__ */ React16.createElement("div", { className: "w-1.5 h-1.5 bg-red-500 rounded-full" }) : /* @__PURE__ */ React16.createElement("div", { className: "w-1.5 h-1.5 bg-transparent" })),
|
|
1592
|
+
/* @__PURE__ */ React16.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ React16.createElement("h5", { className: `text-[12px] truncate ${notif.isRead ? "text-neutral-500" : "text-black "}` }, notif.title), /* @__PURE__ */ React16.createElement("p", { className: "text-[11px] text-neutral-400 truncate mt-0.5" }, notif.message), /* @__PURE__ */ React16.createElement("span", { className: "text-[9px] text-neutral-400 tracking-widest mt-2 block uppercase" }, formatNotifDate(notif.createdAt)))
|
|
1593
|
+
)))), !selectedNotif && /* @__PURE__ */ React16.createElement("div", { className: "p-4 flex items-center justify-between shrink-0 " }, /* @__PURE__ */ React16.createElement("span", { className: "text-[10px] text-neutral-400 tracking-widest uppercase" }, "Page ", notificationPage, " of ", notificationTotalPages === 0 ? 1 : notificationTotalPages), /* @__PURE__ */ React16.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React16.createElement(
|
|
1594
|
+
"button",
|
|
1595
|
+
{
|
|
1596
|
+
disabled: notificationPage <= 1 || isNotifsLoading,
|
|
1597
|
+
onClick: () => onNotificationPageChange?.(notificationPage - 1),
|
|
1598
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-neutral-200 text-neutral-600 disabled:opacity-30 outline-none hover:bg-neutral-50 transition-colors"
|
|
1599
|
+
},
|
|
1600
|
+
/* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: ArrowLeft01Icon4, size: 12 })
|
|
1601
|
+
), /* @__PURE__ */ React16.createElement(
|
|
1602
|
+
"button",
|
|
1603
|
+
{
|
|
1604
|
+
disabled: notificationPage >= notificationTotalPages || notificationTotalPages === 0 || isNotifsLoading,
|
|
1605
|
+
onClick: () => onNotificationPageChange?.(notificationPage + 1),
|
|
1606
|
+
className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-neutral-200 text-neutral-600 disabled:opacity-30 outline-none hover:bg-neutral-50 transition-colors"
|
|
1607
|
+
},
|
|
1608
|
+
/* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: ArrowRight01Icon2, size: 12 })
|
|
1609
|
+
))))));
|
|
1510
1610
|
};
|
|
1511
1611
|
|
|
1512
1612
|
// src/components/UniversalWalletPage.tsx
|
|
@@ -1515,23 +1615,23 @@ import toast5 from "react-hot-toast";
|
|
|
1515
1615
|
import { HugeiconsIcon as HugeiconsIcon11 } from "@hugeicons/react";
|
|
1516
1616
|
import {
|
|
1517
1617
|
Search01Icon as Search01Icon2,
|
|
1518
|
-
CancelCircleIcon as
|
|
1519
|
-
Loading03Icon as
|
|
1618
|
+
CancelCircleIcon as CancelCircleIcon4,
|
|
1619
|
+
Loading03Icon as Loading03Icon6,
|
|
1520
1620
|
Copy01Icon as Copy01Icon2,
|
|
1521
|
-
ArrowLeft01Icon as
|
|
1621
|
+
ArrowLeft01Icon as ArrowLeft01Icon5,
|
|
1522
1622
|
PlusSignIcon,
|
|
1523
1623
|
Upload01Icon,
|
|
1524
1624
|
Download01Icon,
|
|
1525
1625
|
ClipboardIcon
|
|
1526
1626
|
} from "@hugeicons/core-free-icons";
|
|
1527
|
-
var PageSpinner3 = () => /* @__PURE__ */ React17.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon:
|
|
1627
|
+
var PageSpinner3 = () => /* @__PURE__ */ React17.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon6, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
1528
1628
|
var truncateAddress2 = (ref) => {
|
|
1529
1629
|
if (!ref || ref.length <= 14) return ref;
|
|
1530
1630
|
return `${ref.substring(0, 11)}.....${ref.substring(ref.length - 11)}`;
|
|
1531
1631
|
};
|
|
1532
1632
|
var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
|
|
1533
1633
|
const [isLoaded, setIsLoaded] = useState10(false);
|
|
1534
|
-
return /* @__PURE__ */ React17.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon:
|
|
1634
|
+
return /* @__PURE__ */ React17.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Loading03Icon6, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React17.createElement("img", { src, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
|
|
1535
1635
|
};
|
|
1536
1636
|
var UniversalWalletPage = ({
|
|
1537
1637
|
headerTitle,
|
|
@@ -1661,7 +1761,7 @@ var UniversalWalletPage = ({
|
|
|
1661
1761
|
setIsProcessing(false);
|
|
1662
1762
|
}
|
|
1663
1763
|
};
|
|
1664
|
-
return /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React17.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon:
|
|
1764
|
+
return /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React17.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ArrowLeft01Icon5, size: 16 }), " Back")), /* @__PURE__ */ React17.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React17.createElement(ManagedToaster, null), !hideControls && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Search01Icon2, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ React17.createElement(
|
|
1665
1765
|
"input",
|
|
1666
1766
|
{
|
|
1667
1767
|
type: "text",
|
|
@@ -1670,7 +1770,7 @@ var UniversalWalletPage = ({
|
|
|
1670
1770
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1671
1771
|
className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-colors focus:border-black"
|
|
1672
1772
|
}
|
|
1673
|
-
)), !external && /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React17.createElement("button", { onClick: startWalletGeneration, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: PlusSignIcon, size: 16 })), /* @__PURE__ */ React17.createElement("button", { onClick: startWalletImport, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Upload01Icon, size: 16 })))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ React17.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React17.createElement(PageSpinner3, null) : /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React17.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ React17.createElement("div", { key: wallet.id, onClick: () => setSelectedWallet(wallet), 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" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React17.createElement("div", { className: "relative shrink-0" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), wallet.networkLogoSrc && /* @__PURE__ */ React17.createElement("div", { className: "absolute -bottom-1 -right-1 w-4 h-4 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React17.createElement("img", { src: wallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React17.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React17.createElement("p", { className: "text-[13px] text-black truncate" }, wallet.name), !external && wallet.isActive !== void 0 && /* @__PURE__ */ React17.createElement("span", { className: `text-[9px] px-1.5 py-0.5 rounded-sm tracking-widest uppercase ${wallet.isActive ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"}` }, wallet.isActive ? "Active" : "Inactive")), /* @__PURE__ */ React17.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts && !external ? "blur-sm opacity-40 select-none" : ""}` }, external ? wallet.currency : `${wallet.balance} ${wallet.currency}`))), /* @__PURE__ */ React17.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network)))))))), addModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setAddModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, flowStep === 1 ? "Important Notice" : flowStep === 2 ? "Secret Recovery Phrase" : flowStep === 3 ? "Verify Phrase" : "Secure Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setAddModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon:
|
|
1773
|
+
)), !external && /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React17.createElement("button", { onClick: startWalletGeneration, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: PlusSignIcon, size: 16 })), /* @__PURE__ */ React17.createElement("button", { onClick: startWalletImport, className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Upload01Icon, size: 16 })))), /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ React17.createElement("div", null, /* @__PURE__ */ React17.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), /* @__PURE__ */ React17.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React17.createElement(PageSpinner3, null) : /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React17.createElement("div", null, filteredWallets.length === 0 ? /* @__PURE__ */ React17.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No wallets found") : filteredWallets.map((wallet) => /* @__PURE__ */ React17.createElement("div", { key: wallet.id, onClick: () => setSelectedWallet(wallet), 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" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React17.createElement("div", { className: "relative shrink-0" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), wallet.networkLogoSrc && /* @__PURE__ */ React17.createElement("div", { className: "absolute -bottom-1 -right-1 w-4 h-4 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React17.createElement("img", { src: wallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React17.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React17.createElement("p", { className: "text-[13px] text-black truncate" }, wallet.name), !external && wallet.isActive !== void 0 && /* @__PURE__ */ React17.createElement("span", { className: `text-[9px] px-1.5 py-0.5 rounded-sm tracking-widest uppercase ${wallet.isActive ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-600"}` }, wallet.isActive ? "Active" : "Inactive")), /* @__PURE__ */ React17.createElement("p", { className: `text-[13px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts && !external ? "blur-sm opacity-40 select-none" : ""}` }, external ? wallet.currency : `${wallet.balance} ${wallet.currency}`))), /* @__PURE__ */ React17.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] tracking-wide text-neutral-600 bg-neutral-100 px-2.5 py-1 rounded-full " }, wallet.network)))))))), addModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setAddModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, flowStep === 1 ? "Important Notice" : flowStep === 2 ? "Secret Recovery Phrase" : flowStep === 3 ? "Verify Phrase" : "Secure Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setAddModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon4, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React17.createElement(Banner, { type: "alert", title: "Critical Warning", message: "You are about to generate a Self-Custodial Recovery Phrase. This phrase is the absolute master key to your wallet and all assets within it. Aeona DOES NOT store this phrase. If you lose it, your funds are permanently lost. Do not share this phrase with anyone.", isDismissible: false }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "I Understand, Generate Phrase")), flowStep === 2 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Please write down these words in the exact order shown. Store them in a secure, offline location."), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-48 overflow-y-auto custom-scrollbar pr-1" }, generatedPhrase.split(" ").map((word, idx) => /* @__PURE__ */ React17.createElement("div", { key: idx, className: "flex items-center gap-1.5 bg-neutral-50 rounded-lg p-2 selection:bg-neutral-200" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] text-neutral-400 select-none w-4 text-right shrink-0" }, idx + 1, "."), /* @__PURE__ */ React17.createElement("span", { className: "text-[13px] text-black " }, word)))), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between gap-2 0 pt-4" }, /* @__PURE__ */ React17.createElement("button", { type: "button", onClick: () => handleCopy(generatedPhrase, false), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Copy01Icon2, size: 14 }), " Copy Phrase"), /* @__PURE__ */ React17.createElement("button", { type: "button", onClick: handleDownloadTxt, className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: Download01Icon, size: 14 }), " Download .txt")), /* @__PURE__ */ React17.createElement("div", { className: "flex items-start gap-3 p-3 rounded-xl border border-neutral-200 mt-2" }, /* @__PURE__ */ React17.createElement("input", { type: "checkbox", id: "backup-confirm", checked: hasBackedUp, onChange: (e) => setHasBackedUp(e.target.checked), className: "mt-0.5 w-4 h-4 bg-white border-neutral-300 rounded text-black focus:ring-black cursor-pointer shrink-0" }), /* @__PURE__ */ React17.createElement("label", { htmlFor: "backup-confirm", className: "text-xs text-neutral-600 cursor-pointer leading-relaxed" }, "I have securely copied and stored my recovery phrase. I understand that if I lose it, my funds are gone forever.")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Continue")), flowStep === 3 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Please enter or paste your recovery phrase below to verify your backup."), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-56 overflow-y-auto custom-scrollbar pr-1 pb-1" }, verifyWords.map((word, idx) => /* @__PURE__ */ React17.createElement("div", { key: idx, className: "flex items-center gap-1 bg-white border border-neutral-200 focus-within:border-black rounded-lg p-1.5 transition-colors" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] text-neutral-400 w-4 shrink-0 text-right select-none" }, idx + 1, "."), /* @__PURE__ */ React17.createElement(
|
|
1674
1774
|
"input",
|
|
1675
1775
|
{
|
|
1676
1776
|
type: "text",
|
|
@@ -1695,7 +1795,7 @@ var UniversalWalletPage = ({
|
|
|
1695
1795
|
},
|
|
1696
1796
|
className: "w-full bg-transparent text-[13px] text-black outline-none min-w-0"
|
|
1697
1797
|
}
|
|
1698
|
-
)))), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React17.createElement("button", { type: "button", onClick: () => handleGridPaste(setVerifyWords, verifyWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Verify Backup")), flowStep === 4 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this browser.", isDismissible: false }), /* @__PURE__ */ React17.createElement(TextInput, { label: "Local Password", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet("generated"), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Import Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setImportModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon:
|
|
1798
|
+
)))), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React17.createElement("button", { type: "button", onClick: () => handleGridPaste(setVerifyWords, verifyWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleCreationNext, className: "w-full mt-2" }, "Verify Backup")), flowStep === 4 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement(Banner, { type: "success", title: "Phrase Verified", message: "Your phrase is correct. Now set a local password to encrypt your wallet on this browser.", isDismissible: false }), /* @__PURE__ */ React17.createElement(TextInput, { label: "Local Password", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet("generated"), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Save Wallet"))))), importModalOpen && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isProcessing && setImportModalOpen(false) }), /* @__PURE__ */ React17.createElement("div", { className: "relative w-full max-w-md bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Import Wallet"), /* @__PURE__ */ React17.createElement("button", { onClick: () => !isProcessing && setImportModalOpen(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon4, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "p-6" }, flowStep === 1 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Enter your 12 or 24-word recovery phrase to restore your wallet on this device."), /* @__PURE__ */ React17.createElement("div", { className: "grid grid-cols-3 gap-2 max-h-56 overflow-y-auto custom-scrollbar pr-1 pb-1" }, importWords.map((word, idx) => /* @__PURE__ */ React17.createElement("div", { key: idx, className: "flex items-center gap-1 bg-white border border-neutral-200 focus-within:border-black rounded-lg p-1.5 transition-colors" }, /* @__PURE__ */ React17.createElement("span", { className: "text-[10px] text-neutral-400 w-4 shrink-0 text-right select-none" }, idx + 1, "."), /* @__PURE__ */ React17.createElement(
|
|
1699
1799
|
"input",
|
|
1700
1800
|
{
|
|
1701
1801
|
type: "text",
|
|
@@ -1721,7 +1821,7 @@ var UniversalWalletPage = ({
|
|
|
1721
1821
|
},
|
|
1722
1822
|
className: "w-full bg-transparent text-[13px] text-black outline-none min-w-0"
|
|
1723
1823
|
}
|
|
1724
|
-
)))), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React17.createElement("button", { type: "button", onClick: () => handleGridPaste(setImportWords, importWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Set a local password to encrypt this wallet on this specific browser."), /* @__PURE__ */ React17.createElement(TextInput, { label: "Local Password", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet("imported"), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Import Wallet"))))), selectedWallet && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ React17.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__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React17.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon:
|
|
1824
|
+
)))), /* @__PURE__ */ React17.createElement("div", { className: "flex items-center justify-between pt-4" }, /* @__PURE__ */ React17.createElement("button", { type: "button", onClick: () => handleGridPaste(setImportWords, importWords), className: "text-xs text-black flex items-center gap-1.5 hover:underline outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: ClipboardIcon, size: 14 }), " Paste Phrase")), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: handleImportNext, className: "w-full mt-2" }, "Continue")), flowStep === 2 && /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in slide-in-from-right-4" }, /* @__PURE__ */ React17.createElement("p", { className: "text-sm text-neutral-600" }, "Set a local password to encrypt this wallet on this specific browser."), /* @__PURE__ */ React17.createElement(TextInput, { label: "Local Password", type: "password", value: walletPassword, onChange: setWalletPassword, placeholder: "Enter a strong password" }), /* @__PURE__ */ React17.createElement(ThreeDActionButton, { onClick: () => handleSaveWallet("imported"), isLoading: isProcessing, className: "w-full mt-2" }, "Encrypt & Import Wallet"))))), selectedWallet && /* @__PURE__ */ React17.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React17.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setSelectedWallet(null) }), /* @__PURE__ */ React17.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__ */ React17.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React17.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React17.createElement("button", { onClick: () => setSelectedWallet(null), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React17.createElement(HugeiconsIcon11, { icon: CancelCircleIcon4, size: 18 }))), /* @__PURE__ */ React17.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-6" }, /* @__PURE__ */ React17.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React17.createElement("div", { className: "relative mb-4" }, /* @__PURE__ */ React17.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14" }), selectedWallet.networkLogoSrc && /* @__PURE__ */ React17.createElement("div", { className: "absolute -bottom-1 -right-1 w-5 h-5 rounded-full border border-white bg-white overflow-hidden shadow-sm" }, /* @__PURE__ */ React17.createElement("img", { src: selectedWallet.networkLogoSrc, alt: "Network", className: "w-full h-full object-cover" }))), /* @__PURE__ */ React17.createElement("h2", { className: `text-2xl text-black mb-2 transition-all duration-300 ${hideBalanceAmounts && !external ? "blur-[6px] opacity-40 select-none" : ""}` }, external ? selectedWallet.currency : `${selectedWallet.balance} ${selectedWallet.currency}`), /* @__PURE__ */ React17.createElement("span", { className: "text-[9px] tracking-widest text-neutral-500 px-4 py-1.5 rounded-full border border-neutral-200 mt-1 " }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React17.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, renderQrCode(selectedWallet)), external && /* @__PURE__ */ React17.createElement("div", { className: "mb-6" }, /* @__PURE__ */ React17.createElement(
|
|
1725
1825
|
Banner,
|
|
1726
1826
|
{
|
|
1727
1827
|
type: "warning",
|
|
@@ -1738,16 +1838,16 @@ import { HugeiconsIcon as HugeiconsIcon15 } from "@hugeicons/react";
|
|
|
1738
1838
|
import {
|
|
1739
1839
|
SnowIcon,
|
|
1740
1840
|
Delete02Icon,
|
|
1741
|
-
ArrowRight01Icon as
|
|
1841
|
+
ArrowRight01Icon as ArrowRight01Icon3,
|
|
1742
1842
|
SlidersHorizontalIcon,
|
|
1743
1843
|
ViewOffSlashIcon as ViewOffSlashIcon2,
|
|
1744
|
-
Loading03Icon as
|
|
1844
|
+
Loading03Icon as Loading03Icon9
|
|
1745
1845
|
} from "@hugeicons/core-free-icons";
|
|
1746
1846
|
|
|
1747
1847
|
// src/components/ConfirmationDialog.tsx
|
|
1748
1848
|
import React18 from "react";
|
|
1749
1849
|
import { HugeiconsIcon as HugeiconsIcon12 } from "@hugeicons/react";
|
|
1750
|
-
import { Loading03Icon as
|
|
1850
|
+
import { Loading03Icon as Loading03Icon7 } from "@hugeicons/core-free-icons";
|
|
1751
1851
|
var ConfirmationDialog = ({
|
|
1752
1852
|
isOpen,
|
|
1753
1853
|
title,
|
|
@@ -1781,14 +1881,14 @@ var ConfirmationDialog = ({
|
|
|
1781
1881
|
disabled: isProcessing,
|
|
1782
1882
|
className: `flex-1 py-4 text-[13px] transition-colors disabled:opacity-50 flex justify-center items-center outline-none ${isDestructive ? "text-red-500 hover:bg-red-50" : "text-black hover:bg-neutral-50"}`
|
|
1783
1883
|
},
|
|
1784
|
-
isProcessing ? /* @__PURE__ */ React18.createElement(HugeiconsIcon12, { icon:
|
|
1884
|
+
isProcessing ? /* @__PURE__ */ React18.createElement(HugeiconsIcon12, { icon: Loading03Icon7, className: "animate-spin", size: 18 }) : confirmText
|
|
1785
1885
|
))));
|
|
1786
1886
|
};
|
|
1787
1887
|
|
|
1788
1888
|
// src/components/PinDialerBottomSheet.tsx
|
|
1789
1889
|
import React19, { useState as useState11, useEffect as useEffect8 } from "react";
|
|
1790
1890
|
import { HugeiconsIcon as HugeiconsIcon13 } from "@hugeicons/react";
|
|
1791
|
-
import { Loading03Icon as
|
|
1891
|
+
import { Loading03Icon as Loading03Icon8, CancelCircleIcon as CancelCircleIcon5, LessThanIcon } from "@hugeicons/core-free-icons";
|
|
1792
1892
|
var PinDialerBottomSheet = ({
|
|
1793
1893
|
isOpen,
|
|
1794
1894
|
title = "Action Required",
|
|
@@ -1831,14 +1931,14 @@ var PinDialerBottomSheet = ({
|
|
|
1831
1931
|
},
|
|
1832
1932
|
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1833
1933
|
},
|
|
1834
|
-
/* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon:
|
|
1934
|
+
/* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon: CancelCircleIcon5, size: 20 })
|
|
1835
1935
|
)), /* @__PURE__ */ React19.createElement("div", { className: "flex flex-col px-6 pb-8 pt-2 relative" }, /* @__PURE__ */ React19.createElement("div", { className: "flex justify-center gap-4 mb-8" }, [0, 1, 2, 3].map((i) => /* @__PURE__ */ React19.createElement(
|
|
1836
1936
|
"div",
|
|
1837
1937
|
{
|
|
1838
1938
|
key: i,
|
|
1839
1939
|
className: `w-2 h-2 rounded-full transition-colors duration-200 ${pin.length > i ? "bg-black" : "bg-neutral-200"}`
|
|
1840
1940
|
}
|
|
1841
|
-
))), isVerifying && /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-white/80 backdrop-blur-sm z-10 flex items-center justify-center rounded-b-2xl" }, /* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon:
|
|
1941
|
+
))), isVerifying && /* @__PURE__ */ React19.createElement("div", { className: "absolute inset-0 bg-white/80 backdrop-blur-sm z-10 flex items-center justify-center rounded-b-2xl" }, /* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon: Loading03Icon8, size: 28, className: "animate-spin text-black" })), /* @__PURE__ */ React19.createElement("div", { className: "grid grid-cols-3 gap-y-4 gap-x-6 max-w-60 mx-auto" }, [1, 2, 3, 4, 5, 6, 7, 8, 9].map((num) => /* @__PURE__ */ React19.createElement(
|
|
1842
1942
|
"button",
|
|
1843
1943
|
{
|
|
1844
1944
|
key: num,
|
|
@@ -1866,7 +1966,7 @@ var PinDialerBottomSheet = ({
|
|
|
1866
1966
|
// src/components/CardAction.tsx
|
|
1867
1967
|
import React20 from "react";
|
|
1868
1968
|
import { HugeiconsIcon as HugeiconsIcon14 } from "@hugeicons/react";
|
|
1869
|
-
import { CancelCircleIcon as
|
|
1969
|
+
import { CancelCircleIcon as CancelCircleIcon6, CreditCardIcon } from "@hugeicons/core-free-icons";
|
|
1870
1970
|
var CardActionDialog = ({
|
|
1871
1971
|
isOpen,
|
|
1872
1972
|
card,
|
|
@@ -1889,7 +1989,7 @@ var CardActionDialog = ({
|
|
|
1889
1989
|
onClick: onClose,
|
|
1890
1990
|
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1891
1991
|
},
|
|
1892
|
-
/* @__PURE__ */ React20.createElement(HugeiconsIcon14, { icon:
|
|
1992
|
+
/* @__PURE__ */ React20.createElement(HugeiconsIcon14, { icon: CancelCircleIcon6, size: 20 })
|
|
1893
1993
|
)), /* @__PURE__ */ React20.createElement("div", { className: "p-6 text-center" }, /* @__PURE__ */ React20.createElement("p", { className: "text-[13px] text-neutral-500 leading-relaxed mb-6" }, description), /* @__PURE__ */ React20.createElement(
|
|
1894
1994
|
"button",
|
|
1895
1995
|
{
|
|
@@ -2025,7 +2125,7 @@ var UniversalCardPage = ({
|
|
|
2025
2125
|
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
2026
2126
|
}
|
|
2027
2127
|
},
|
|
2028
|
-
!isBgLoaded && /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon:
|
|
2128
|
+
!isBgLoaded && /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon: Loading03Icon9, size: 28, className: "animate-spin text-black" })),
|
|
2029
2129
|
!isActivated && isBgLoaded && /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 z-40 w-full h-full rounded-2xl backdrop-blur-sm bg-white/20 flex flex-col items-center justify-center border border-white/30", style: { transform: "translateZ(1px)" } }, isUnactivated && /* @__PURE__ */ React21.createElement(
|
|
2030
2130
|
"button",
|
|
2031
2131
|
{
|
|
@@ -2056,7 +2156,7 @@ var UniversalCardPage = ({
|
|
|
2056
2156
|
disabled: isOverlayActionLoading,
|
|
2057
2157
|
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"
|
|
2058
2158
|
},
|
|
2059
|
-
isOverlayActionLoading ? /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon:
|
|
2159
|
+
isOverlayActionLoading ? /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon: Loading03Icon9, size: 16, className: "animate-spin" }) : "Unfreeze Card"
|
|
2060
2160
|
)),
|
|
2061
2161
|
/* @__PURE__ */ React21.createElement(
|
|
2062
2162
|
"div",
|
|
@@ -2209,14 +2309,14 @@ var MenuRow = ({
|
|
|
2209
2309
|
},
|
|
2210
2310
|
/* @__PURE__ */ React21.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon, size: 16, className: iconColor })),
|
|
2211
2311
|
/* @__PURE__ */ React21.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React21.createElement("p", { className: `text-[13px] truncate ${titleColor}` }, title), /* @__PURE__ */ React21.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2212
|
-
isToggle ? /* @__PURE__ */ React21.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__ */ React21.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__ */ React21.createElement(HugeiconsIcon15, { icon:
|
|
2312
|
+
isToggle ? /* @__PURE__ */ React21.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__ */ React21.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__ */ React21.createElement(HugeiconsIcon15, { icon: Loading03Icon9, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon: ArrowRight01Icon3, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2213
2313
|
);
|
|
2214
2314
|
|
|
2215
2315
|
// src/components/UniversalProfilePage.tsx
|
|
2216
2316
|
import React22, { useState as useState13 } from "react";
|
|
2217
2317
|
import { HugeiconsIcon as HugeiconsIcon16 } from "@hugeicons/react";
|
|
2218
2318
|
import {
|
|
2219
|
-
UserIcon,
|
|
2319
|
+
UserIcon as UserIcon2,
|
|
2220
2320
|
LockKeyIcon as LockKeyIcon2,
|
|
2221
2321
|
ShieldUserIcon,
|
|
2222
2322
|
MessageQuestionIcon,
|
|
@@ -2224,8 +2324,8 @@ import {
|
|
|
2224
2324
|
FileDownloadIcon,
|
|
2225
2325
|
LogoutCircle02Icon,
|
|
2226
2326
|
UserRemove01Icon,
|
|
2227
|
-
ArrowRight01Icon as
|
|
2228
|
-
Loading03Icon as
|
|
2327
|
+
ArrowRight01Icon as ArrowRight01Icon4,
|
|
2328
|
+
Loading03Icon as Loading03Icon10,
|
|
2229
2329
|
CrownIcon
|
|
2230
2330
|
} from "@hugeicons/core-free-icons";
|
|
2231
2331
|
var UniversalProfilePage = ({
|
|
@@ -2255,7 +2355,7 @@ var UniversalProfilePage = ({
|
|
|
2255
2355
|
setShowLogoutDialog(false);
|
|
2256
2356
|
}
|
|
2257
2357
|
};
|
|
2258
|
-
return /* @__PURE__ */ React22.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React22.createElement("div", { className: "pt-8 pb-4 flex flex-col items-center" }, /* @__PURE__ */ React22.createElement("div", { className: "w-22 h-22 rounded-full bg-white p-1 mb-4 flex items-center justify-center" }, /* @__PURE__ */ React22.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, avatarSrc ? /* @__PURE__ */ React22.createElement(React22.Fragment, null, !isAvatarLoaded && /* @__PURE__ */ React22.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-100" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon:
|
|
2358
|
+
return /* @__PURE__ */ React22.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React22.createElement("div", { className: "pt-8 pb-4 flex flex-col items-center" }, /* @__PURE__ */ React22.createElement("div", { className: "w-22 h-22 rounded-full bg-white p-1 mb-4 flex items-center justify-center" }, /* @__PURE__ */ React22.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, avatarSrc ? /* @__PURE__ */ React22.createElement(React22.Fragment, null, !isAvatarLoaded && /* @__PURE__ */ React22.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-100" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon: Loading03Icon10, size: 24, className: "animate-spin text-black" })), /* @__PURE__ */ React22.createElement(
|
|
2259
2359
|
"img",
|
|
2260
2360
|
{
|
|
2261
2361
|
src: avatarSrc,
|
|
@@ -2263,10 +2363,10 @@ var UniversalProfilePage = ({
|
|
|
2263
2363
|
onLoad: () => setIsAvatarLoaded(true),
|
|
2264
2364
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
2265
2365
|
}
|
|
2266
|
-
)) : /* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon:
|
|
2366
|
+
)) : /* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon: UserIcon2, size: 40, className: "text-neutral-300" }))), /* @__PURE__ */ React22.createElement("div", { className: "bg-white rounded-full px-4 py-2 flex items-center justify-center gap-2 mb-3" }, /* @__PURE__ */ React22.createElement("span", { className: "text-[12px] text-black" }, roleName), /* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon: CrownIcon, size: 14, className: "text-neutral-400" })), /* @__PURE__ */ React22.createElement("span", { className: "text-[12px] text-neutral-500" }, memberSince)), /* @__PURE__ */ React22.createElement("div", { className: "w-full flex flex-col gap-4 mt-2" }, /* @__PURE__ */ React22.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ React22.createElement(
|
|
2267
2367
|
MenuRow2,
|
|
2268
2368
|
{
|
|
2269
|
-
icon:
|
|
2369
|
+
icon: UserIcon2,
|
|
2270
2370
|
title: "Account",
|
|
2271
2371
|
subtitle: "Your account details",
|
|
2272
2372
|
onClick: onAccountTap
|
|
@@ -2352,7 +2452,7 @@ var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titl
|
|
|
2352
2452
|
},
|
|
2353
2453
|
/* @__PURE__ */ React22.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon, size: 16, className: iconColor })),
|
|
2354
2454
|
/* @__PURE__ */ React22.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React22.createElement("p", { className: `text-[13px] truncate ${titleColor}` }, title), /* @__PURE__ */ React22.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, subtitle)),
|
|
2355
|
-
/* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon:
|
|
2455
|
+
/* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon: ArrowRight01Icon4, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2356
2456
|
);
|
|
2357
2457
|
|
|
2358
2458
|
// src/components/UniversalSidebar.tsx
|
|
@@ -2715,13 +2815,13 @@ import React27, { useState as useState18, useRef as useRef6 } from "react";
|
|
|
2715
2815
|
import toast7 from "react-hot-toast";
|
|
2716
2816
|
import { HugeiconsIcon as HugeiconsIcon19 } from "@hugeicons/react";
|
|
2717
2817
|
import {
|
|
2718
|
-
CancelCircleIcon as
|
|
2719
|
-
Loading03Icon as
|
|
2818
|
+
CancelCircleIcon as CancelCircleIcon7,
|
|
2819
|
+
Loading03Icon as Loading03Icon11,
|
|
2720
2820
|
Copy01Icon as Copy01Icon3,
|
|
2721
|
-
ArrowLeft01Icon as
|
|
2821
|
+
ArrowLeft01Icon as ArrowLeft01Icon6,
|
|
2722
2822
|
Shield02Icon,
|
|
2723
2823
|
Key01Icon,
|
|
2724
|
-
ArrowRight01Icon as
|
|
2824
|
+
ArrowRight01Icon as ArrowRight01Icon5
|
|
2725
2825
|
} from "@hugeicons/core-free-icons";
|
|
2726
2826
|
import { startRegistration } from "@simplewebauthn/browser";
|
|
2727
2827
|
var UniversalSecurityPage = ({
|
|
@@ -2894,7 +2994,7 @@ var UniversalSecurityPage = ({
|
|
|
2894
2994
|
onClick: onBack,
|
|
2895
2995
|
className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none"
|
|
2896
2996
|
},
|
|
2897
|
-
/* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon:
|
|
2997
|
+
/* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: ArrowLeft01Icon6, size: 16 }),
|
|
2898
2998
|
" Back"
|
|
2899
2999
|
)), /* @__PURE__ */ React27.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ React27.createElement(
|
|
2900
3000
|
MenuRow3,
|
|
@@ -2919,7 +3019,7 @@ var UniversalSecurityPage = ({
|
|
|
2919
3019
|
toggleLoading: isPasskeyLoading,
|
|
2920
3020
|
isLast: true
|
|
2921
3021
|
}
|
|
2922
|
-
))), show2FASetupModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FASetupModal(false) }), /* @__PURE__ */ React27.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__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable 2FA"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShow2FASetupModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon:
|
|
3022
|
+
))), show2FASetupModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FASetupModal(false) }), /* @__PURE__ */ React27.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__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable 2FA"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShow2FASetupModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: CancelCircleIcon7, size: 18 }))), /* @__PURE__ */ React27.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full flex justify-center mb-6 mix-blend-multiply" }, twoFaQr ? /* @__PURE__ */ React27.createElement("img", { src: twoFaQr, alt: "2FA QR Code", className: "w-40 h-40 object-contain rounded-xl border border-neutral-200 p-2" }) : /* @__PURE__ */ React27.createElement("div", { className: "w-40 h-40 bg-neutral-100 rounded-xl flex items-center justify-center animate-pulse" })), /* @__PURE__ */ React27.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-8" }, /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2 uppercase" }, "Setup Key"), /* @__PURE__ */ React27.createElement("div", { className: "flex items-center gap-2 min-w-0 bg-neutral-50 px-3 py-2.5 rounded-xl " }, /* @__PURE__ */ React27.createElement("span", { className: "text-[13px] font-mono tracking-widest text-black truncate min-w-0 block flex-1" }, twoFaSecret), /* @__PURE__ */ React27.createElement(
|
|
2923
3023
|
"button",
|
|
2924
3024
|
{
|
|
2925
3025
|
type: "button",
|
|
@@ -2967,7 +3067,7 @@ var UniversalSecurityPage = ({
|
|
|
2967
3067
|
},
|
|
2968
3068
|
/* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: Copy01Icon3, size: 16, className: "mr-2" }),
|
|
2969
3069
|
"Copy Secret Key"
|
|
2970
|
-
))))), show2FADisableModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FADisableModal(false) }), /* @__PURE__ */ React27.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__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Disable 2FA"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShow2FADisableModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon:
|
|
3070
|
+
))))), show2FADisableModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShow2FADisableModal(false) }), /* @__PURE__ */ React27.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__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Disable 2FA"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShow2FADisableModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: CancelCircleIcon7, size: 18 }))), /* @__PURE__ */ React27.createElement("div", { className: "p-6" }, /* @__PURE__ */ React27.createElement("div", { className: "text-center mb-8 mt-2" }, /* @__PURE__ */ React27.createElement("h2", { className: "text-xl text-black mb-2 tracking-tight" }, "Security Check"), /* @__PURE__ */ React27.createElement("p", { className: "text-[13px] text-neutral-500" }, "Enter the code from your authenticator app to disable 2FA.")), /* @__PURE__ */ React27.createElement("form", { className: "space-y-8", autoComplete: "off", onSubmit: (e) => {
|
|
2971
3071
|
e.preventDefault();
|
|
2972
3072
|
submitDisable2FA(otp.join(""));
|
|
2973
3073
|
} }, /* @__PURE__ */ React27.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ React27.createElement(
|
|
@@ -2998,7 +3098,7 @@ var UniversalSecurityPage = ({
|
|
|
2998
3098
|
className: "w-full py-3.5"
|
|
2999
3099
|
},
|
|
3000
3100
|
"Verify & Disable"
|
|
3001
|
-
))))), showPasskeyModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShowPasskeyModal(false) }), /* @__PURE__ */ React27.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__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable Passkey"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShowPasskeyModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon:
|
|
3101
|
+
))))), showPasskeyModal && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => !isSubmitting && setShowPasskeyModal(false) }), /* @__PURE__ */ React27.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__ */ React27.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React27.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Enable Passkey"), /* @__PURE__ */ React27.createElement("button", { onClick: () => !isSubmitting && setShowPasskeyModal(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: CancelCircleIcon7, size: 18 }))), /* @__PURE__ */ React27.createElement("div", { className: "p-6 text-center" }, /* @__PURE__ */ React27.createElement("h2", { className: "text-lg text-black mb-2 tracking-tight" }, "Simplify your Sign In"), /* @__PURE__ */ React27.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__ */ React27.createElement(
|
|
3002
3102
|
ThreeDActionButton,
|
|
3003
3103
|
{
|
|
3004
3104
|
onClick: submitEnablePasskey,
|
|
@@ -3028,14 +3128,14 @@ var MenuRow3 = ({
|
|
|
3028
3128
|
},
|
|
3029
3129
|
/* @__PURE__ */ React27.createElement("div", { className: "w-10 h-10 rounded-full bg-neutral-50 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon, size: 18, className: iconColor })),
|
|
3030
3130
|
/* @__PURE__ */ React27.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React27.createElement("p", { className: `text-[14px] font-medium truncate ${titleColor}` }, title), /* @__PURE__ */ React27.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, subtitle)),
|
|
3031
|
-
isToggle ? /* @__PURE__ */ React27.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__ */ React27.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__ */ React27.createElement(HugeiconsIcon19, { icon:
|
|
3131
|
+
isToggle ? /* @__PURE__ */ React27.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__ */ React27.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__ */ React27.createElement(HugeiconsIcon19, { icon: Loading03Icon11, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: ArrowRight01Icon5, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
3032
3132
|
);
|
|
3033
3133
|
|
|
3034
3134
|
// src/components/FeatureScroll.tsx
|
|
3035
3135
|
import React28, { useRef as useRef7, useState as useState19, useEffect as useEffect12 } from "react";
|
|
3036
3136
|
import Image4 from "next/image";
|
|
3037
3137
|
import { HugeiconsIcon as HugeiconsIcon20 } from "@hugeicons/react";
|
|
3038
|
-
import { ArrowLeft01Icon as
|
|
3138
|
+
import { ArrowLeft01Icon as ArrowLeft01Icon7, ArrowRight01Icon as ArrowRight01Icon6, Loading03Icon as Loading03Icon12 } from "@hugeicons/core-free-icons";
|
|
3039
3139
|
var FeatureCard = ({ feature, bgImage }) => {
|
|
3040
3140
|
const [isBgLoading, setIsBgLoading] = useState19(true);
|
|
3041
3141
|
const [isFgLoading, setIsFgLoading] = useState19(!!feature.image);
|
|
@@ -3060,7 +3160,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
3060
3160
|
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")`
|
|
3061
3161
|
}
|
|
3062
3162
|
}
|
|
3063
|
-
), isFgLoading && feature.image && /* @__PURE__ */ React28.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__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3163
|
+
), isFgLoading && feature.image && /* @__PURE__ */ React28.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__ */ React28.createElement(HugeiconsIcon20, { icon: Loading03Icon12, size: 32, className: "animate-spin text-neutral-400" })), feature.image && /* @__PURE__ */ React28.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__ */ React28.createElement(
|
|
3064
3164
|
Image4,
|
|
3065
3165
|
{
|
|
3066
3166
|
src: feature.image,
|
|
@@ -3109,7 +3209,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3109
3209
|
disabled: !canScrollLeft,
|
|
3110
3210
|
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"
|
|
3111
3211
|
},
|
|
3112
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3212
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowLeft01Icon7, size: 20 })
|
|
3113
3213
|
), /* @__PURE__ */ React28.createElement(
|
|
3114
3214
|
"button",
|
|
3115
3215
|
{
|
|
@@ -3117,7 +3217,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3117
3217
|
disabled: !canScrollRight,
|
|
3118
3218
|
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"
|
|
3119
3219
|
},
|
|
3120
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3220
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowRight01Icon6, size: 20 })
|
|
3121
3221
|
))), /* @__PURE__ */ React28.createElement(
|
|
3122
3222
|
"div",
|
|
3123
3223
|
{
|
|
@@ -3133,7 +3233,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3133
3233
|
disabled: !canScrollLeft,
|
|
3134
3234
|
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"
|
|
3135
3235
|
},
|
|
3136
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3236
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowLeft01Icon7, size: 20 })
|
|
3137
3237
|
), /* @__PURE__ */ React28.createElement(
|
|
3138
3238
|
"button",
|
|
3139
3239
|
{
|
|
@@ -3141,7 +3241,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3141
3241
|
disabled: !canScrollRight,
|
|
3142
3242
|
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"
|
|
3143
3243
|
},
|
|
3144
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3244
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowRight01Icon6, size: 20 })
|
|
3145
3245
|
))));
|
|
3146
3246
|
};
|
|
3147
3247
|
|
|
@@ -3508,7 +3608,7 @@ import React36, { useEffect as useEffect16, useRef as useRef10 } from "react";
|
|
|
3508
3608
|
import Link8 from "next/link";
|
|
3509
3609
|
import Image8 from "next/image";
|
|
3510
3610
|
import { HugeiconsIcon as HugeiconsIcon24 } from "@hugeicons/react";
|
|
3511
|
-
import { ArrowRight01Icon as
|
|
3611
|
+
import { ArrowRight01Icon as ArrowRight01Icon7 } from "@hugeicons/core-free-icons";
|
|
3512
3612
|
var useScrollAnimation = () => {
|
|
3513
3613
|
const elementRef = useRef10(null);
|
|
3514
3614
|
useEffect16(() => {
|
|
@@ -3589,7 +3689,7 @@ var PortfolioHero = ({
|
|
|
3589
3689
|
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"
|
|
3590
3690
|
},
|
|
3591
3691
|
secondaryCtaText,
|
|
3592
|
-
/* @__PURE__ */ React36.createElement(HugeiconsIcon24, { icon:
|
|
3692
|
+
/* @__PURE__ */ React36.createElement(HugeiconsIcon24, { icon: ArrowRight01Icon7, size: 16 })
|
|
3593
3693
|
))
|
|
3594
3694
|
));
|
|
3595
3695
|
};
|
|
@@ -3598,7 +3698,7 @@ var PortfolioHero = ({
|
|
|
3598
3698
|
import React37, { useState as useState23 } from "react";
|
|
3599
3699
|
import Image9 from "next/image";
|
|
3600
3700
|
import { HugeiconsIcon as HugeiconsIcon25 } from "@hugeicons/react";
|
|
3601
|
-
import { Loading03Icon as
|
|
3701
|
+
import { Loading03Icon as Loading03Icon13 } from "@hugeicons/core-free-icons";
|
|
3602
3702
|
var GifFeatureCard = ({
|
|
3603
3703
|
gifSrc,
|
|
3604
3704
|
title,
|
|
@@ -3610,7 +3710,7 @@ var GifFeatureCard = ({
|
|
|
3610
3710
|
return /* @__PURE__ */ React37.createElement("div", { className: `relative w-full bg-black overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ React37.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ React37.createElement(
|
|
3611
3711
|
HugeiconsIcon25,
|
|
3612
3712
|
{
|
|
3613
|
-
icon:
|
|
3713
|
+
icon: Loading03Icon13,
|
|
3614
3714
|
size: 32,
|
|
3615
3715
|
className: "animate-spin text-white"
|
|
3616
3716
|
}
|
|
@@ -3692,10 +3792,10 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3692
3792
|
import React39, { useState as useState25 } from "react";
|
|
3693
3793
|
import Image11 from "next/image";
|
|
3694
3794
|
import { HugeiconsIcon as HugeiconsIcon26 } from "@hugeicons/react";
|
|
3695
|
-
import { Loading03Icon as
|
|
3795
|
+
import { Loading03Icon as Loading03Icon14 } from "@hugeicons/core-free-icons";
|
|
3696
3796
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
3697
3797
|
const [isLoading, setIsLoading] = useState25(true);
|
|
3698
|
-
return /* @__PURE__ */ React39.createElement("div", { className: `absolute inset-0 bg-neutral-800 ${className}` }, isLoading && /* @__PURE__ */ React39.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__ */ React39.createElement(HugeiconsIcon26, { icon:
|
|
3798
|
+
return /* @__PURE__ */ React39.createElement("div", { className: `absolute inset-0 bg-neutral-800 ${className}` }, isLoading && /* @__PURE__ */ React39.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__ */ React39.createElement(HugeiconsIcon26, { icon: Loading03Icon14, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ React39.createElement(
|
|
3699
3799
|
Image11,
|
|
3700
3800
|
{
|
|
3701
3801
|
src,
|
|
@@ -3787,10 +3887,10 @@ var ConsultantShowcase = ({
|
|
|
3787
3887
|
import React40, { useState as useState26 } from "react";
|
|
3788
3888
|
import Image12 from "next/image";
|
|
3789
3889
|
import { HugeiconsIcon as HugeiconsIcon27 } from "@hugeicons/react";
|
|
3790
|
-
import { Loading03Icon as
|
|
3890
|
+
import { Loading03Icon as Loading03Icon15 } from "@hugeicons/core-free-icons";
|
|
3791
3891
|
var ImageWithLoader2 = ({ src, alt, className, sizes }) => {
|
|
3792
3892
|
const [isLoading, setIsLoading] = useState26(true);
|
|
3793
|
-
return /* @__PURE__ */ React40.createElement("div", { className: `relative overflow-hidden bg-neutral-100 ${className}` }, isLoading && /* @__PURE__ */ React40.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__ */ React40.createElement(HugeiconsIcon27, { icon:
|
|
3893
|
+
return /* @__PURE__ */ React40.createElement("div", { className: `relative overflow-hidden bg-neutral-100 ${className}` }, isLoading && /* @__PURE__ */ React40.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__ */ React40.createElement(HugeiconsIcon27, { icon: Loading03Icon15, size: 24, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ React40.createElement(
|
|
3794
3894
|
Image12,
|
|
3795
3895
|
{
|
|
3796
3896
|
src,
|