@retinalabsllc/zairusjs 12.0.40 → 12.0.50
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 +19 -1
- package/dist/index.d.ts +19 -1
- package/dist/index.js +109 -32
- package/dist/index.mjs +169 -84
- 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
|
}
|
|
@@ -786,4 +804,4 @@ interface WaitlistDialogProps {
|
|
|
786
804
|
}
|
|
787
805
|
declare const WaitlistDialog: React.FC<WaitlistDialogProps>;
|
|
788
806
|
|
|
789
|
-
export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, WaitlistDialog, type WaitlistDialogProps };
|
|
807
|
+
export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, type NotificationItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, WaitlistDialog, type WaitlistDialogProps };
|
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
|
}
|
|
@@ -786,4 +804,4 @@ interface WaitlistDialogProps {
|
|
|
786
804
|
}
|
|
787
805
|
declare const WaitlistDialog: React.FC<WaitlistDialogProps>;
|
|
788
806
|
|
|
789
|
-
export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, WaitlistDialog, type WaitlistDialogProps };
|
|
807
|
+
export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, type NotificationItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, WaitlistDialog, type WaitlistDialogProps };
|
package/dist/index.js
CHANGED
|
@@ -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 = ({
|
|
1501
|
+
fullName = "",
|
|
1502
|
+
avatarSrc,
|
|
1485
1503
|
balanceLabel = "Available Balance",
|
|
1486
1504
|
balanceAmount,
|
|
1487
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,44 +1555,61 @@ 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
1581
|
className: "text-neutral-400 hover:text-white transition-colors outline-none"
|
|
1531
1582
|
},
|
|
1532
1583
|
/* @__PURE__ */ import_react25.default.createElement(import_react26.HugeiconsIcon, { icon: isBalanceHidden ? import_core_free_icons8.ViewIcon : import_core_free_icons8.ViewOffSlashIcon, size: 16 })
|
|
1533
|
-
)), /* @__PURE__ */ import_react25.default.createElement("p", { className: `text-2xl text-white tracking-tight mb-
|
|
1534
|
-
"
|
|
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
|
-
onClick: primaryAction
|
|
1537
|
-
className: "
|
|
1587
|
+
onClick: primaryAction.onClick,
|
|
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
|
-
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
{
|
|
1543
|
-
src: "https://retinalabs.company/assets/images/piggy.avif",
|
|
1544
|
-
alt: "Savings",
|
|
1545
|
-
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"
|
|
1546
|
-
}
|
|
1547
|
-
)
|
|
1548
|
-
), /* @__PURE__ */ import_react25.default.createElement(
|
|
1549
|
-
"div",
|
|
1590
|
+
"Deposit"
|
|
1591
|
+
), secondaryAction && /* @__PURE__ */ import_react25.default.createElement(
|
|
1592
|
+
"button",
|
|
1550
1593
|
{
|
|
1551
|
-
onClick: secondaryAction
|
|
1552
|
-
className: "
|
|
1594
|
+
onClick: secondaryAction.onClick,
|
|
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"
|
|
1553
1596
|
},
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
|
|
1557
|
-
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
|
|
1561
|
-
|
|
1562
|
-
|
|
1563
|
-
|
|
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
|
+
}
|
|
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(
|
|
1564
1613
|
UniversalTransactionPage,
|
|
1565
1614
|
{
|
|
1566
1615
|
...transactionsProps,
|
|
@@ -1568,7 +1617,35 @@ var UniversalHomeView = ({
|
|
|
1568
1617
|
hideBalanceAmounts: isBalanceHidden,
|
|
1569
1618
|
hidePagination: true
|
|
1570
1619
|
}
|
|
1571
|
-
)))
|
|
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
|
+
))))));
|
|
1572
1649
|
};
|
|
1573
1650
|
|
|
1574
1651
|
// src/components/UniversalWalletPage.tsx
|
package/dist/index.mjs
CHANGED
|
@@ -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 = ({
|
|
1462
|
+
fullName = "",
|
|
1463
|
+
avatarSrc,
|
|
1438
1464
|
balanceLabel = "Available Balance",
|
|
1439
1465
|
balanceAmount,
|
|
1440
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,44 +1516,61 @@ 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
1542
|
className: "text-neutral-400 hover:text-white transition-colors outline-none"
|
|
1484
1543
|
},
|
|
1485
1544
|
/* @__PURE__ */ React16.createElement(HugeiconsIcon10, { icon: isBalanceHidden ? ViewIcon : ViewOffSlashIcon, size: 16 })
|
|
1486
|
-
)), /* @__PURE__ */ React16.createElement("p", { className: `text-2xl text-white tracking-tight mb-
|
|
1487
|
-
"
|
|
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
|
-
onClick: primaryAction
|
|
1490
|
-
className: "
|
|
1548
|
+
onClick: primaryAction.onClick,
|
|
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
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
{
|
|
1496
|
-
src: "https://retinalabs.company/assets/images/piggy.avif",
|
|
1497
|
-
alt: "Savings",
|
|
1498
|
-
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"
|
|
1499
|
-
}
|
|
1500
|
-
)
|
|
1501
|
-
), /* @__PURE__ */ React16.createElement(
|
|
1502
|
-
"div",
|
|
1551
|
+
"Deposit"
|
|
1552
|
+
), secondaryAction && /* @__PURE__ */ React16.createElement(
|
|
1553
|
+
"button",
|
|
1503
1554
|
{
|
|
1504
|
-
onClick: secondaryAction
|
|
1505
|
-
className: "
|
|
1555
|
+
onClick: secondaryAction.onClick,
|
|
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"
|
|
1506
1557
|
},
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
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
|
+
}
|
|
1573
|
+
)))), customContent && /* @__PURE__ */ React16.createElement("div", { className: "w-full" }, customContent), /* @__PURE__ */ React16.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ React16.createElement(
|
|
1517
1574
|
UniversalTransactionPage,
|
|
1518
1575
|
{
|
|
1519
1576
|
...transactionsProps,
|
|
@@ -1521,7 +1578,35 @@ var UniversalHomeView = ({
|
|
|
1521
1578
|
hideBalanceAmounts: isBalanceHidden,
|
|
1522
1579
|
hidePagination: true
|
|
1523
1580
|
}
|
|
1524
|
-
)))
|
|
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
|
+
))))));
|
|
1525
1610
|
};
|
|
1526
1611
|
|
|
1527
1612
|
// src/components/UniversalWalletPage.tsx
|
|
@@ -1530,23 +1615,23 @@ import toast5 from "react-hot-toast";
|
|
|
1530
1615
|
import { HugeiconsIcon as HugeiconsIcon11 } from "@hugeicons/react";
|
|
1531
1616
|
import {
|
|
1532
1617
|
Search01Icon as Search01Icon2,
|
|
1533
|
-
CancelCircleIcon as
|
|
1534
|
-
Loading03Icon as
|
|
1618
|
+
CancelCircleIcon as CancelCircleIcon4,
|
|
1619
|
+
Loading03Icon as Loading03Icon6,
|
|
1535
1620
|
Copy01Icon as Copy01Icon2,
|
|
1536
|
-
ArrowLeft01Icon as
|
|
1621
|
+
ArrowLeft01Icon as ArrowLeft01Icon5,
|
|
1537
1622
|
PlusSignIcon,
|
|
1538
1623
|
Upload01Icon,
|
|
1539
1624
|
Download01Icon,
|
|
1540
1625
|
ClipboardIcon
|
|
1541
1626
|
} from "@hugeicons/core-free-icons";
|
|
1542
|
-
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" }));
|
|
1543
1628
|
var truncateAddress2 = (ref) => {
|
|
1544
1629
|
if (!ref || ref.length <= 14) return ref;
|
|
1545
1630
|
return `${ref.substring(0, 11)}.....${ref.substring(ref.length - 11)}`;
|
|
1546
1631
|
};
|
|
1547
1632
|
var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
|
|
1548
1633
|
const [isLoaded, setIsLoaded] = useState10(false);
|
|
1549
|
-
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"}` }));
|
|
1550
1635
|
};
|
|
1551
1636
|
var UniversalWalletPage = ({
|
|
1552
1637
|
headerTitle,
|
|
@@ -1676,7 +1761,7 @@ var UniversalWalletPage = ({
|
|
|
1676
1761
|
setIsProcessing(false);
|
|
1677
1762
|
}
|
|
1678
1763
|
};
|
|
1679
|
-
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(
|
|
1680
1765
|
"input",
|
|
1681
1766
|
{
|
|
1682
1767
|
type: "text",
|
|
@@ -1685,7 +1770,7 @@ var UniversalWalletPage = ({
|
|
|
1685
1770
|
onChange: (e) => setLocalSearchQuery(e.target.value),
|
|
1686
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"
|
|
1687
1772
|
}
|
|
1688
|
-
)), !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(
|
|
1689
1774
|
"input",
|
|
1690
1775
|
{
|
|
1691
1776
|
type: "text",
|
|
@@ -1710,7 +1795,7 @@ var UniversalWalletPage = ({
|
|
|
1710
1795
|
},
|
|
1711
1796
|
className: "w-full bg-transparent text-[13px] text-black outline-none min-w-0"
|
|
1712
1797
|
}
|
|
1713
|
-
)))), /* @__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(
|
|
1714
1799
|
"input",
|
|
1715
1800
|
{
|
|
1716
1801
|
type: "text",
|
|
@@ -1736,7 +1821,7 @@ var UniversalWalletPage = ({
|
|
|
1736
1821
|
},
|
|
1737
1822
|
className: "w-full bg-transparent text-[13px] text-black outline-none min-w-0"
|
|
1738
1823
|
}
|
|
1739
|
-
)))), /* @__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(
|
|
1740
1825
|
Banner,
|
|
1741
1826
|
{
|
|
1742
1827
|
type: "warning",
|
|
@@ -1753,16 +1838,16 @@ import { HugeiconsIcon as HugeiconsIcon15 } from "@hugeicons/react";
|
|
|
1753
1838
|
import {
|
|
1754
1839
|
SnowIcon,
|
|
1755
1840
|
Delete02Icon,
|
|
1756
|
-
ArrowRight01Icon as
|
|
1841
|
+
ArrowRight01Icon as ArrowRight01Icon3,
|
|
1757
1842
|
SlidersHorizontalIcon,
|
|
1758
1843
|
ViewOffSlashIcon as ViewOffSlashIcon2,
|
|
1759
|
-
Loading03Icon as
|
|
1844
|
+
Loading03Icon as Loading03Icon9
|
|
1760
1845
|
} from "@hugeicons/core-free-icons";
|
|
1761
1846
|
|
|
1762
1847
|
// src/components/ConfirmationDialog.tsx
|
|
1763
1848
|
import React18 from "react";
|
|
1764
1849
|
import { HugeiconsIcon as HugeiconsIcon12 } from "@hugeicons/react";
|
|
1765
|
-
import { Loading03Icon as
|
|
1850
|
+
import { Loading03Icon as Loading03Icon7 } from "@hugeicons/core-free-icons";
|
|
1766
1851
|
var ConfirmationDialog = ({
|
|
1767
1852
|
isOpen,
|
|
1768
1853
|
title,
|
|
@@ -1796,14 +1881,14 @@ var ConfirmationDialog = ({
|
|
|
1796
1881
|
disabled: isProcessing,
|
|
1797
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"}`
|
|
1798
1883
|
},
|
|
1799
|
-
isProcessing ? /* @__PURE__ */ React18.createElement(HugeiconsIcon12, { icon:
|
|
1884
|
+
isProcessing ? /* @__PURE__ */ React18.createElement(HugeiconsIcon12, { icon: Loading03Icon7, className: "animate-spin", size: 18 }) : confirmText
|
|
1800
1885
|
))));
|
|
1801
1886
|
};
|
|
1802
1887
|
|
|
1803
1888
|
// src/components/PinDialerBottomSheet.tsx
|
|
1804
1889
|
import React19, { useState as useState11, useEffect as useEffect8 } from "react";
|
|
1805
1890
|
import { HugeiconsIcon as HugeiconsIcon13 } from "@hugeicons/react";
|
|
1806
|
-
import { Loading03Icon as
|
|
1891
|
+
import { Loading03Icon as Loading03Icon8, CancelCircleIcon as CancelCircleIcon5, LessThanIcon } from "@hugeicons/core-free-icons";
|
|
1807
1892
|
var PinDialerBottomSheet = ({
|
|
1808
1893
|
isOpen,
|
|
1809
1894
|
title = "Action Required",
|
|
@@ -1846,14 +1931,14 @@ var PinDialerBottomSheet = ({
|
|
|
1846
1931
|
},
|
|
1847
1932
|
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1848
1933
|
},
|
|
1849
|
-
/* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon:
|
|
1934
|
+
/* @__PURE__ */ React19.createElement(HugeiconsIcon13, { icon: CancelCircleIcon5, size: 20 })
|
|
1850
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(
|
|
1851
1936
|
"div",
|
|
1852
1937
|
{
|
|
1853
1938
|
key: i,
|
|
1854
1939
|
className: `w-2 h-2 rounded-full transition-colors duration-200 ${pin.length > i ? "bg-black" : "bg-neutral-200"}`
|
|
1855
1940
|
}
|
|
1856
|
-
))), 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(
|
|
1857
1942
|
"button",
|
|
1858
1943
|
{
|
|
1859
1944
|
key: num,
|
|
@@ -1881,7 +1966,7 @@ var PinDialerBottomSheet = ({
|
|
|
1881
1966
|
// src/components/CardAction.tsx
|
|
1882
1967
|
import React20 from "react";
|
|
1883
1968
|
import { HugeiconsIcon as HugeiconsIcon14 } from "@hugeicons/react";
|
|
1884
|
-
import { CancelCircleIcon as
|
|
1969
|
+
import { CancelCircleIcon as CancelCircleIcon6, CreditCardIcon } from "@hugeicons/core-free-icons";
|
|
1885
1970
|
var CardActionDialog = ({
|
|
1886
1971
|
isOpen,
|
|
1887
1972
|
card,
|
|
@@ -1904,7 +1989,7 @@ var CardActionDialog = ({
|
|
|
1904
1989
|
onClick: onClose,
|
|
1905
1990
|
className: "text-neutral-400 hover:text-black transition-colors outline-none"
|
|
1906
1991
|
},
|
|
1907
|
-
/* @__PURE__ */ React20.createElement(HugeiconsIcon14, { icon:
|
|
1992
|
+
/* @__PURE__ */ React20.createElement(HugeiconsIcon14, { icon: CancelCircleIcon6, size: 20 })
|
|
1908
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(
|
|
1909
1994
|
"button",
|
|
1910
1995
|
{
|
|
@@ -2040,7 +2125,7 @@ var UniversalCardPage = ({
|
|
|
2040
2125
|
transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
|
|
2041
2126
|
}
|
|
2042
2127
|
},
|
|
2043
|
-
!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" })),
|
|
2044
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(
|
|
2045
2130
|
"button",
|
|
2046
2131
|
{
|
|
@@ -2071,7 +2156,7 @@ var UniversalCardPage = ({
|
|
|
2071
2156
|
disabled: isOverlayActionLoading,
|
|
2072
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"
|
|
2073
2158
|
},
|
|
2074
|
-
isOverlayActionLoading ? /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon:
|
|
2159
|
+
isOverlayActionLoading ? /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon: Loading03Icon9, size: 16, className: "animate-spin" }) : "Unfreeze Card"
|
|
2075
2160
|
)),
|
|
2076
2161
|
/* @__PURE__ */ React21.createElement(
|
|
2077
2162
|
"div",
|
|
@@ -2224,14 +2309,14 @@ var MenuRow = ({
|
|
|
2224
2309
|
},
|
|
2225
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 })),
|
|
2226
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)),
|
|
2227
|
-
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" })
|
|
2228
2313
|
);
|
|
2229
2314
|
|
|
2230
2315
|
// src/components/UniversalProfilePage.tsx
|
|
2231
2316
|
import React22, { useState as useState13 } from "react";
|
|
2232
2317
|
import { HugeiconsIcon as HugeiconsIcon16 } from "@hugeicons/react";
|
|
2233
2318
|
import {
|
|
2234
|
-
UserIcon,
|
|
2319
|
+
UserIcon as UserIcon2,
|
|
2235
2320
|
LockKeyIcon as LockKeyIcon2,
|
|
2236
2321
|
ShieldUserIcon,
|
|
2237
2322
|
MessageQuestionIcon,
|
|
@@ -2239,8 +2324,8 @@ import {
|
|
|
2239
2324
|
FileDownloadIcon,
|
|
2240
2325
|
LogoutCircle02Icon,
|
|
2241
2326
|
UserRemove01Icon,
|
|
2242
|
-
ArrowRight01Icon as
|
|
2243
|
-
Loading03Icon as
|
|
2327
|
+
ArrowRight01Icon as ArrowRight01Icon4,
|
|
2328
|
+
Loading03Icon as Loading03Icon10,
|
|
2244
2329
|
CrownIcon
|
|
2245
2330
|
} from "@hugeicons/core-free-icons";
|
|
2246
2331
|
var UniversalProfilePage = ({
|
|
@@ -2270,7 +2355,7 @@ var UniversalProfilePage = ({
|
|
|
2270
2355
|
setShowLogoutDialog(false);
|
|
2271
2356
|
}
|
|
2272
2357
|
};
|
|
2273
|
-
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(
|
|
2274
2359
|
"img",
|
|
2275
2360
|
{
|
|
2276
2361
|
src: avatarSrc,
|
|
@@ -2278,10 +2363,10 @@ var UniversalProfilePage = ({
|
|
|
2278
2363
|
onLoad: () => setIsAvatarLoaded(true),
|
|
2279
2364
|
className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
|
|
2280
2365
|
}
|
|
2281
|
-
)) : /* @__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(
|
|
2282
2367
|
MenuRow2,
|
|
2283
2368
|
{
|
|
2284
|
-
icon:
|
|
2369
|
+
icon: UserIcon2,
|
|
2285
2370
|
title: "Account",
|
|
2286
2371
|
subtitle: "Your account details",
|
|
2287
2372
|
onClick: onAccountTap
|
|
@@ -2367,7 +2452,7 @@ var MenuRow2 = ({ icon, title, subtitle, onClick, iconColor = "text-black", titl
|
|
|
2367
2452
|
},
|
|
2368
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 })),
|
|
2369
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)),
|
|
2370
|
-
/* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon:
|
|
2455
|
+
/* @__PURE__ */ React22.createElement(HugeiconsIcon16, { icon: ArrowRight01Icon4, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
|
|
2371
2456
|
);
|
|
2372
2457
|
|
|
2373
2458
|
// src/components/UniversalSidebar.tsx
|
|
@@ -2730,13 +2815,13 @@ import React27, { useState as useState18, useRef as useRef6 } from "react";
|
|
|
2730
2815
|
import toast7 from "react-hot-toast";
|
|
2731
2816
|
import { HugeiconsIcon as HugeiconsIcon19 } from "@hugeicons/react";
|
|
2732
2817
|
import {
|
|
2733
|
-
CancelCircleIcon as
|
|
2734
|
-
Loading03Icon as
|
|
2818
|
+
CancelCircleIcon as CancelCircleIcon7,
|
|
2819
|
+
Loading03Icon as Loading03Icon11,
|
|
2735
2820
|
Copy01Icon as Copy01Icon3,
|
|
2736
|
-
ArrowLeft01Icon as
|
|
2821
|
+
ArrowLeft01Icon as ArrowLeft01Icon6,
|
|
2737
2822
|
Shield02Icon,
|
|
2738
2823
|
Key01Icon,
|
|
2739
|
-
ArrowRight01Icon as
|
|
2824
|
+
ArrowRight01Icon as ArrowRight01Icon5
|
|
2740
2825
|
} from "@hugeicons/core-free-icons";
|
|
2741
2826
|
import { startRegistration } from "@simplewebauthn/browser";
|
|
2742
2827
|
var UniversalSecurityPage = ({
|
|
@@ -2909,7 +2994,7 @@ var UniversalSecurityPage = ({
|
|
|
2909
2994
|
onClick: onBack,
|
|
2910
2995
|
className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none"
|
|
2911
2996
|
},
|
|
2912
|
-
/* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon:
|
|
2997
|
+
/* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: ArrowLeft01Icon6, size: 16 }),
|
|
2913
2998
|
" Back"
|
|
2914
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(
|
|
2915
3000
|
MenuRow3,
|
|
@@ -2934,7 +3019,7 @@ var UniversalSecurityPage = ({
|
|
|
2934
3019
|
toggleLoading: isPasskeyLoading,
|
|
2935
3020
|
isLast: true
|
|
2936
3021
|
}
|
|
2937
|
-
))), 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(
|
|
2938
3023
|
"button",
|
|
2939
3024
|
{
|
|
2940
3025
|
type: "button",
|
|
@@ -2982,7 +3067,7 @@ var UniversalSecurityPage = ({
|
|
|
2982
3067
|
},
|
|
2983
3068
|
/* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: Copy01Icon3, size: 16, className: "mr-2" }),
|
|
2984
3069
|
"Copy Secret Key"
|
|
2985
|
-
))))), 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) => {
|
|
2986
3071
|
e.preventDefault();
|
|
2987
3072
|
submitDisable2FA(otp.join(""));
|
|
2988
3073
|
} }, /* @__PURE__ */ React27.createElement("div", { className: "flex justify-between gap-2", onPaste: handlePaste }, otp.map((digit, index) => /* @__PURE__ */ React27.createElement(
|
|
@@ -3013,7 +3098,7 @@ var UniversalSecurityPage = ({
|
|
|
3013
3098
|
className: "w-full py-3.5"
|
|
3014
3099
|
},
|
|
3015
3100
|
"Verify & Disable"
|
|
3016
|
-
))))), 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(
|
|
3017
3102
|
ThreeDActionButton,
|
|
3018
3103
|
{
|
|
3019
3104
|
onClick: submitEnablePasskey,
|
|
@@ -3043,14 +3128,14 @@ var MenuRow3 = ({
|
|
|
3043
3128
|
},
|
|
3044
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 })),
|
|
3045
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)),
|
|
3046
|
-
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" })
|
|
3047
3132
|
);
|
|
3048
3133
|
|
|
3049
3134
|
// src/components/FeatureScroll.tsx
|
|
3050
3135
|
import React28, { useRef as useRef7, useState as useState19, useEffect as useEffect12 } from "react";
|
|
3051
3136
|
import Image4 from "next/image";
|
|
3052
3137
|
import { HugeiconsIcon as HugeiconsIcon20 } from "@hugeicons/react";
|
|
3053
|
-
import { ArrowLeft01Icon as
|
|
3138
|
+
import { ArrowLeft01Icon as ArrowLeft01Icon7, ArrowRight01Icon as ArrowRight01Icon6, Loading03Icon as Loading03Icon12 } from "@hugeicons/core-free-icons";
|
|
3054
3139
|
var FeatureCard = ({ feature, bgImage }) => {
|
|
3055
3140
|
const [isBgLoading, setIsBgLoading] = useState19(true);
|
|
3056
3141
|
const [isFgLoading, setIsFgLoading] = useState19(!!feature.image);
|
|
@@ -3075,7 +3160,7 @@ var FeatureCard = ({ feature, bgImage }) => {
|
|
|
3075
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")`
|
|
3076
3161
|
}
|
|
3077
3162
|
}
|
|
3078
|
-
), 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(
|
|
3079
3164
|
Image4,
|
|
3080
3165
|
{
|
|
3081
3166
|
src: feature.image,
|
|
@@ -3124,7 +3209,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3124
3209
|
disabled: !canScrollLeft,
|
|
3125
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"
|
|
3126
3211
|
},
|
|
3127
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3212
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowLeft01Icon7, size: 20 })
|
|
3128
3213
|
), /* @__PURE__ */ React28.createElement(
|
|
3129
3214
|
"button",
|
|
3130
3215
|
{
|
|
@@ -3132,7 +3217,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3132
3217
|
disabled: !canScrollRight,
|
|
3133
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"
|
|
3134
3219
|
},
|
|
3135
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3220
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowRight01Icon6, size: 20 })
|
|
3136
3221
|
))), /* @__PURE__ */ React28.createElement(
|
|
3137
3222
|
"div",
|
|
3138
3223
|
{
|
|
@@ -3148,7 +3233,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3148
3233
|
disabled: !canScrollLeft,
|
|
3149
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"
|
|
3150
3235
|
},
|
|
3151
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3236
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowLeft01Icon7, size: 20 })
|
|
3152
3237
|
), /* @__PURE__ */ React28.createElement(
|
|
3153
3238
|
"button",
|
|
3154
3239
|
{
|
|
@@ -3156,7 +3241,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
3156
3241
|
disabled: !canScrollRight,
|
|
3157
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"
|
|
3158
3243
|
},
|
|
3159
|
-
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon:
|
|
3244
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon20, { icon: ArrowRight01Icon6, size: 20 })
|
|
3160
3245
|
))));
|
|
3161
3246
|
};
|
|
3162
3247
|
|
|
@@ -3523,7 +3608,7 @@ import React36, { useEffect as useEffect16, useRef as useRef10 } from "react";
|
|
|
3523
3608
|
import Link8 from "next/link";
|
|
3524
3609
|
import Image8 from "next/image";
|
|
3525
3610
|
import { HugeiconsIcon as HugeiconsIcon24 } from "@hugeicons/react";
|
|
3526
|
-
import { ArrowRight01Icon as
|
|
3611
|
+
import { ArrowRight01Icon as ArrowRight01Icon7 } from "@hugeicons/core-free-icons";
|
|
3527
3612
|
var useScrollAnimation = () => {
|
|
3528
3613
|
const elementRef = useRef10(null);
|
|
3529
3614
|
useEffect16(() => {
|
|
@@ -3604,7 +3689,7 @@ var PortfolioHero = ({
|
|
|
3604
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"
|
|
3605
3690
|
},
|
|
3606
3691
|
secondaryCtaText,
|
|
3607
|
-
/* @__PURE__ */ React36.createElement(HugeiconsIcon24, { icon:
|
|
3692
|
+
/* @__PURE__ */ React36.createElement(HugeiconsIcon24, { icon: ArrowRight01Icon7, size: 16 })
|
|
3608
3693
|
))
|
|
3609
3694
|
));
|
|
3610
3695
|
};
|
|
@@ -3613,7 +3698,7 @@ var PortfolioHero = ({
|
|
|
3613
3698
|
import React37, { useState as useState23 } from "react";
|
|
3614
3699
|
import Image9 from "next/image";
|
|
3615
3700
|
import { HugeiconsIcon as HugeiconsIcon25 } from "@hugeicons/react";
|
|
3616
|
-
import { Loading03Icon as
|
|
3701
|
+
import { Loading03Icon as Loading03Icon13 } from "@hugeicons/core-free-icons";
|
|
3617
3702
|
var GifFeatureCard = ({
|
|
3618
3703
|
gifSrc,
|
|
3619
3704
|
title,
|
|
@@ -3625,7 +3710,7 @@ var GifFeatureCard = ({
|
|
|
3625
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(
|
|
3626
3711
|
HugeiconsIcon25,
|
|
3627
3712
|
{
|
|
3628
|
-
icon:
|
|
3713
|
+
icon: Loading03Icon13,
|
|
3629
3714
|
size: 32,
|
|
3630
3715
|
className: "animate-spin text-white"
|
|
3631
3716
|
}
|
|
@@ -3707,10 +3792,10 @@ var MedicalFeatureStatsBlock = ({
|
|
|
3707
3792
|
import React39, { useState as useState25 } from "react";
|
|
3708
3793
|
import Image11 from "next/image";
|
|
3709
3794
|
import { HugeiconsIcon as HugeiconsIcon26 } from "@hugeicons/react";
|
|
3710
|
-
import { Loading03Icon as
|
|
3795
|
+
import { Loading03Icon as Loading03Icon14 } from "@hugeicons/core-free-icons";
|
|
3711
3796
|
var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
|
|
3712
3797
|
const [isLoading, setIsLoading] = useState25(true);
|
|
3713
|
-
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(
|
|
3714
3799
|
Image11,
|
|
3715
3800
|
{
|
|
3716
3801
|
src,
|
|
@@ -3802,10 +3887,10 @@ var ConsultantShowcase = ({
|
|
|
3802
3887
|
import React40, { useState as useState26 } from "react";
|
|
3803
3888
|
import Image12 from "next/image";
|
|
3804
3889
|
import { HugeiconsIcon as HugeiconsIcon27 } from "@hugeicons/react";
|
|
3805
|
-
import { Loading03Icon as
|
|
3890
|
+
import { Loading03Icon as Loading03Icon15 } from "@hugeicons/core-free-icons";
|
|
3806
3891
|
var ImageWithLoader2 = ({ src, alt, className, sizes }) => {
|
|
3807
3892
|
const [isLoading, setIsLoading] = useState26(true);
|
|
3808
|
-
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(
|
|
3809
3894
|
Image12,
|
|
3810
3895
|
{
|
|
3811
3896
|
src,
|