@retinalabsllc/zairusjs 13.0.45 → 14.0.1

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 CHANGED
@@ -853,4 +853,25 @@ interface UniversalRewardPageProps {
853
853
  }
854
854
  declare const UniversalRewardPage: React.FC<UniversalRewardPageProps>;
855
855
 
856
- 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, type LeaderboardItem, 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 RewardItem, type RewardProfile, 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, UniversalRewardPage, type UniversalRewardPageProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, UniversalVerificationPage, type UniversalVerificationPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, type VerificationStatus, WaitlistDialog, type WaitlistDialogProps };
856
+ interface ReferralProfile {
857
+ web3Name: string;
858
+ username: string;
859
+ avatarUrl: string | null;
860
+ }
861
+ interface UniversalReferralItem {
862
+ joinedAt: string;
863
+ profile: ReferralProfile;
864
+ }
865
+ interface UniversalReferralPageProps {
866
+ referralCode: string | null;
867
+ totalCount: number;
868
+ referrals: UniversalReferralItem[];
869
+ isLoading: boolean;
870
+ currentPage: number;
871
+ totalPages: number;
872
+ onPageChange: (page: number) => void;
873
+ onBack?: () => void;
874
+ }
875
+ declare const UniversalReferralPage: React.FC<UniversalReferralPageProps>;
876
+
877
+ 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, type LeaderboardItem, 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 ReferralProfile, type RewardItem, type RewardProfile, 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, type UniversalReferralItem, UniversalReferralPage, type UniversalReferralPageProps, UniversalRewardPage, type UniversalRewardPageProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, UniversalVerificationPage, type UniversalVerificationPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, type VerificationStatus, WaitlistDialog, type WaitlistDialogProps };
package/dist/index.d.ts CHANGED
@@ -853,4 +853,25 @@ interface UniversalRewardPageProps {
853
853
  }
854
854
  declare const UniversalRewardPage: React.FC<UniversalRewardPageProps>;
855
855
 
856
- 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, type LeaderboardItem, 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 RewardItem, type RewardProfile, 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, UniversalRewardPage, type UniversalRewardPageProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, UniversalVerificationPage, type UniversalVerificationPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, type VerificationStatus, WaitlistDialog, type WaitlistDialogProps };
856
+ interface ReferralProfile {
857
+ web3Name: string;
858
+ username: string;
859
+ avatarUrl: string | null;
860
+ }
861
+ interface UniversalReferralItem {
862
+ joinedAt: string;
863
+ profile: ReferralProfile;
864
+ }
865
+ interface UniversalReferralPageProps {
866
+ referralCode: string | null;
867
+ totalCount: number;
868
+ referrals: UniversalReferralItem[];
869
+ isLoading: boolean;
870
+ currentPage: number;
871
+ totalPages: number;
872
+ onPageChange: (page: number) => void;
873
+ onBack?: () => void;
874
+ }
875
+ declare const UniversalReferralPage: React.FC<UniversalReferralPageProps>;
876
+
877
+ 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, type LeaderboardItem, 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 ReferralProfile, type RewardItem, type RewardProfile, 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, type UniversalReferralItem, UniversalReferralPage, type UniversalReferralPageProps, UniversalRewardPage, type UniversalRewardPageProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, UniversalVerificationPage, type UniversalVerificationPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, type VerificationStatus, WaitlistDialog, type WaitlistDialogProps };
package/dist/index.js CHANGED
@@ -64,6 +64,7 @@ __export(index_exports, {
64
64
  UniversalOrganizationPage: () => UniversalOrganizationPage,
65
65
  UniversalProfilePage: () => UniversalProfilePage,
66
66
  UniversalProfileSettings: () => UniversalProfileSettings,
67
+ UniversalReferralPage: () => UniversalReferralPage,
67
68
  UniversalRewardPage: () => UniversalRewardPage,
68
69
  UniversalSecurityPage: () => UniversalSecurityPage,
69
70
  UniversalSidebar: () => UniversalSidebar,
@@ -648,8 +649,11 @@ var import_react10 = require("@hugeicons/react");
648
649
  var MobileNav = ({ items }) => {
649
650
  const pathname = (0, import_navigation3.usePathname)();
650
651
  if (!items || items.length === 0) return null;
651
- return /* @__PURE__ */ import_react9.default.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-3 animate-in slide-in-from-bottom-8 fade-in duration-500 md:hidden" }, /* @__PURE__ */ import_react9.default.createElement("nav", { className: "pointer-events-auto w-full max-w-sm bg-white/50 backdrop-blur-xl shadow-[0_8px_30px_rgb(0,0,0,0.08)] rounded-full px-6 py-2.5 flex items-center justify-between" }, items.map((item) => {
652
- const isActive = item.href === "/" || item.href === "/app" ? pathname === "/" || pathname === "/app" : pathname === item.href || pathname?.startsWith(`${item.href}/`);
652
+ const pathMatches = items.some((item) => {
653
+ return item.href === "/" || item.href === "/app" ? pathname === "/" || pathname === "/app" : pathname === item.href || pathname?.startsWith(`${item.href}/`);
654
+ });
655
+ return /* @__PURE__ */ import_react9.default.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-3 animate-in slide-in-from-bottom-8 fade-in duration-500 md:hidden" }, /* @__PURE__ */ import_react9.default.createElement("nav", { className: "pointer-events-auto w-full max-w-sm bg-white/50 backdrop-blur-xl shadow-[0_8px_30px_rgb(0,0,0,0.08)] rounded-full px-6 py-2.5 flex items-center justify-between" }, items.map((item, index) => {
656
+ const isActive = !pathMatches && index === 0 ? true : item.href === "/" || item.href === "/app" ? pathname === "/" || pathname === "/app" : pathname === item.href || pathname?.startsWith(`${item.href}/`);
653
657
  return /* @__PURE__ */ import_react9.default.createElement(
654
658
  import_link4.default,
655
659
  {
@@ -1307,7 +1311,7 @@ var UniversalTransactionPage = ({
1307
1311
  onDirectionFilterChange,
1308
1312
  activeTypeFilter,
1309
1313
  onTypeFilterChange,
1310
- formatDate,
1314
+ formatDate: formatDate2,
1311
1315
  onReportTransaction,
1312
1316
  onGenerateReceipt
1313
1317
  }) => {
@@ -1400,7 +1404,7 @@ var UniversalTransactionPage = ({
1400
1404
  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"
1401
1405
  },
1402
1406
  /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center bg-neutral-100 text-black` }, /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: tx.direction === "CREDIT" ? import_core_free_icons7.ArrowDownRight01Icon : import_core_free_icons7.ArrowUpRight01Icon, size: 18 })), /* @__PURE__ */ import_react23.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react23.default.createElement("p", { className: "text-[13px] text-black truncate" }, getDisplayName(tx)), /* @__PURE__ */ import_react23.default.createElement("p", { className: `text-[12px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, tx.amount))),
1403
- /* @__PURE__ */ import_react23.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400" }, formatDate(tx.createdAt)), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400 capitalize" }, tx.direction.toLowerCase()))
1407
+ /* @__PURE__ */ import_react23.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400" }, formatDate2(tx.createdAt)), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400 capitalize" }, tx.direction.toLowerCase()))
1404
1408
  ))), !hidePagination && /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react23.default.createElement(
1405
1409
  "button",
1406
1410
  {
@@ -1424,7 +1428,7 @@ var UniversalTransactionPage = ({
1424
1428
  className: "text-neutral-400 hover:text-black transition-colors outline-none"
1425
1429
  },
1426
1430
  /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.Copy01Icon, size: 14 })
1427
- ))), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Date & Time"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black" }, formatDate(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transaction Type"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Flow Direction"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transfer Route"), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-2 text-[13px] text-black" }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-neutral-400" }, "\u2192"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
1431
+ ))), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Date & Time"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black" }, formatDate2(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transaction Type"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Flow Direction"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ import_react23.default.createElement("div", null, /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transfer Route"), /* @__PURE__ */ import_react23.default.createElement("div", { className: "flex items-center gap-2 text-[13px] text-black" }, /* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ import_react23.default.createElement("span", { className: "text-neutral-400" }, "\u2192"), /* @__PURE__ */ import_react23.default.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
1428
1432
  if (key === "fromAddress" || key === "toAddress") return null;
1429
1433
  if (value === null || value === void 0 || typeof value === "object") return null;
1430
1434
  const formattedKey = key.includes(" ") ? key : key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
@@ -2361,6 +2365,14 @@ var UniversalProfilePage = ({
2361
2365
  setShowLogoutDialog(false);
2362
2366
  }
2363
2367
  };
2368
+ const getBadgeColorClass = (role) => {
2369
+ if (!role) return "text-neutral-400";
2370
+ const r = role.toLowerCase();
2371
+ if (r.includes("basic")) return "text-neutral-400";
2372
+ if (r.includes("standard")) return "text-blue-500";
2373
+ if (r.includes("platinum")) return "text-yellow-400";
2374
+ return "text-neutral-400";
2375
+ };
2364
2376
  return /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "pt-8 pb-4 flex flex-col items-center" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-22 h-22 rounded-full bg-white p-1 mb-4 flex items-center justify-center" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "relative w-full h-full rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center" }, avatarSrc ? /* @__PURE__ */ import_react37.default.createElement(import_react37.default.Fragment, null, !isAvatarLoaded && /* @__PURE__ */ import_react37.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-neutral-100" }, /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.Loading03Icon, size: 24, className: "animate-spin text-black" })), /* @__PURE__ */ import_react37.default.createElement(
2365
2377
  "img",
2366
2378
  {
@@ -2369,7 +2381,7 @@ var UniversalProfilePage = ({
2369
2381
  onLoad: () => setIsAvatarLoaded(true),
2370
2382
  className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
2371
2383
  }
2372
- )) : /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.UserIcon, size: 40, className: "text-neutral-300" }))), /* @__PURE__ */ import_react37.default.createElement("div", { className: "bg-white rounded-full px-4 py-2 flex items-center justify-center gap-2 mb-3" }, /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-[12px] text-black" }, roleName), /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.CrownIcon, size: 14, className: "text-neutral-400" })), /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-[12px] text-neutral-500" }, memberSince)), /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full flex flex-col gap-4 mt-2" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react37.default.createElement(
2384
+ )) : /* @__PURE__ */ import_react37.default.createElement(import_react38.HugeiconsIcon, { icon: import_core_free_icons14.UserIcon, size: 40, className: "text-neutral-300" }))), /* @__PURE__ */ import_react37.default.createElement("div", { className: "bg-white rounded-full px-4 py-2 flex items-center justify-center gap-2 mb-3" }, /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-[12px] text-black" }, roleName), /* @__PURE__ */ import_react37.default.createElement("span", { className: getBadgeColorClass(roleName), "aria-hidden": true }, /* @__PURE__ */ import_react37.default.createElement("svg", { width: "17", height: "17", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react37.default.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: "0" }), /* @__PURE__ */ import_react37.default.createElement("g", { id: "SVGRepo_tracerCarrier", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ import_react37.default.createElement("g", { id: "SVGRepo_iconCarrier" }, " ", /* @__PURE__ */ import_react37.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5924 3.20027C9.34888 3.4078 9.22711 3.51158 9.09706 3.59874C8.79896 3.79854 8.46417 3.93721 8.1121 4.00672C7.95851 4.03705 7.79903 4.04977 7.48008 4.07522C6.6787 4.13918 6.278 4.17115 5.94371 4.28923C5.17051 4.56233 4.56233 5.17051 4.28923 5.94371C4.17115 6.278 4.13918 6.6787 4.07522 7.48008C4.04977 7.79903 4.03705 7.95851 4.00672 8.1121C3.93721 8.46417 3.79854 8.79896 3.59874 9.09706C3.51158 9.22711 3.40781 9.34887 3.20027 9.5924C2.67883 10.2043 2.4181 10.5102 2.26522 10.8301C1.91159 11.57 1.91159 12.43 2.26522 13.1699C2.41811 13.4898 2.67883 13.7957 3.20027 14.4076C3.40778 14.6511 3.51158 14.7729 3.59874 14.9029C3.79854 15.201 3.93721 15.5358 4.00672 15.8879C4.03705 16.0415 4.04977 16.201 4.07522 16.5199C4.13918 17.3213 4.17115 17.722 4.28923 18.0563C4.56233 18.8295 5.17051 19.4377 5.94371 19.7108C6.278 19.8288 6.6787 19.8608 7.48008 19.9248C7.79903 19.9502 7.95851 19.963 8.1121 19.9933C8.46417 20.0628 8.79896 20.2015 9.09706 20.4013C9.22711 20.4884 9.34887 20.5922 9.5924 20.7997C10.2043 21.3212 10.5102 21.5819 10.8301 21.7348C11.57 22.0884 12.43 22.0884 13.1699 21.7348C13.4898 21.5819 13.7957 21.3212 14.4076 20.7997C14.6511 20.5922 14.7729 20.4884 14.9029 20.4013C15.201 20.2015 15.5358 20.0628 15.8879 19.9933C16.0415 19.963 16.201 19.9502 16.5199 19.9248C17.3213 19.8608 17.722 19.8288 18.0563 19.7108C18.8295 19.4377 19.4377 18.8295 19.7108 18.0563C19.8288 17.722 19.8608 17.3213 19.9248 16.5199C19.9502 16.201 19.963 16.0415 19.9933 15.8879C20.0628 15.5358 20.2015 15.201 20.4013 14.9029C20.4884 14.7729 20.5922 14.6511 20.7997 14.4076C21.3212 13.7957 21.5819 13.4898 21.7348 13.1699C22.0884 12.43 22.0884 11.57 21.7348 10.8301C21.5819 10.5102 21.3212 10.2043 20.7997 9.5924C20.5922 9.34887 20.4884 9.22711 20.4013 9.09706C20.2015 8.79896 20.0628 8.46417 19.9933 8.1121C19.963 7.95851 19.9502 7.79903 19.9248 7.48008C19.8608 6.6787 19.8288 6.278 19.7108 5.94371C19.4377 5.17051 18.8295 4.56233 18.0563 4.28923C17.722 4.17115 17.3213 4.13918 16.5199 4.07522C16.201 4.04977 16.0415 4.03705 15.8879 4.00672C15.5358 3.93721 15.201 3.79854 14.9029 3.59874C14.7729 3.51158 14.6511 3.40781 14.4076 3.20027C13.7957 2.67883 13.4898 2.41811 13.1699 2.26522C12.43 1.91159 11.57 1.91159 10.8301 2.26522C10.5102 2.4181 10.2043 2.67883 9.5924 3.20027ZM16.3735 9.86314C16.6913 9.5453 16.6913 9.03 16.3735 8.71216C16.0557 8.39433 15.5403 8.39433 15.2225 8.71216L10.3723 13.5624L8.77746 11.9676C8.45963 11.6498 7.94432 11.6498 7.62649 11.9676C7.30866 12.2854 7.30866 12.8007 7.62649 13.1186L9.79678 15.2889C10.1146 15.6067 10.6299 15.6067 10.9478 15.2889L16.3735 9.86314Z", fill: "currentColor" }), " ")))), /* @__PURE__ */ import_react37.default.createElement("span", { className: "text-[12px] text-neutral-500" }, memberSince)), /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full flex flex-col gap-4 mt-2" }, /* @__PURE__ */ import_react37.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react37.default.createElement(
2373
2385
  MenuRow2,
2374
2386
  {
2375
2387
  icon: import_core_free_icons14.UserIcon,
@@ -2413,9 +2425,9 @@ var UniversalProfilePage = ({
2413
2425
  ), /* @__PURE__ */ import_react37.default.createElement(
2414
2426
  MenuRow2,
2415
2427
  {
2416
- icon: import_core_free_icons14.FileDownloadIcon,
2417
- title: "Account Statements",
2418
- subtitle: "Download account statements",
2428
+ icon: import_core_free_icons14.CrownIcon,
2429
+ title: "My Referrals",
2430
+ subtitle: "Referral & Rewards",
2419
2431
  onClick: onExportTap
2420
2432
  }
2421
2433
  ), /* @__PURE__ */ import_react37.default.createElement(
@@ -4165,6 +4177,89 @@ var UniversalRewardPage = ({
4165
4177
  "Cancel"
4166
4178
  )))))));
4167
4179
  };
4180
+
4181
+ // src/components/UniversalReferralPage.tsx
4182
+ var import_react73 = __toESM(require("react"));
4183
+ var import_react_hot_toast10 = __toESM(require("react-hot-toast"));
4184
+ var import_react74 = require("@hugeicons/react");
4185
+ var import_core_free_icons25 = require("@hugeicons/core-free-icons");
4186
+ var PageSpinner5 = () => /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
4187
+ var formatWeb3Name2 = (name) => {
4188
+ if (!name) return "";
4189
+ return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
4190
+ };
4191
+ var formatDate = (dateInput) => {
4192
+ return new Date(dateInput).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
4193
+ };
4194
+ var UniversalReferralPage = ({
4195
+ referralCode,
4196
+ totalCount,
4197
+ referrals,
4198
+ isLoading,
4199
+ currentPage,
4200
+ totalPages,
4201
+ onPageChange,
4202
+ onBack
4203
+ }) => {
4204
+ const onBackHandler = onBack ?? (() => {
4205
+ if (typeof window !== "undefined") window.history.back();
4206
+ });
4207
+ const handleCopyCode = async () => {
4208
+ if (!referralCode) return;
4209
+ try {
4210
+ await navigator.clipboard.writeText(referralCode);
4211
+ import_react_hot_toast10.default.success("Referral code copied!");
4212
+ } catch {
4213
+ import_react_hot_toast10.default.error("Failed to copy code.");
4214
+ }
4215
+ };
4216
+ const AvatarLogo2 = ({ src, alt, name, sizeClass = "w-10 h-10" }) => {
4217
+ const [isLoaded, setIsLoaded] = (0, import_react73.useState)(false);
4218
+ const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
4219
+ const finalSrc = src || fallbackUrl;
4220
+ return /* @__PURE__ */ import_react73.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden border-2 border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react73.default.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
4221
+ };
4222
+ return /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react73.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react73.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react73.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-3xl bg-white w-full" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-4 mb-2" }, /* @__PURE__ */ import_react73.default.createElement("div", null, /* @__PURE__ */ import_react73.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-xs text-neutral-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ import_react73.default.createElement("div", { className: "border border-neutral-200 rounded-xl p-4 flex items-center justify-between mt-2" }, /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ import_react73.default.createElement("div", { className: "h-6 w-24 bg-neutral-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-lg text-black tracking-widest" }, referralCode)), /* @__PURE__ */ import_react73.default.createElement(
4223
+ "button",
4224
+ {
4225
+ onClick: handleCopyCode,
4226
+ disabled: isLoading || !referralCode,
4227
+ className: "w-10 h-10 rounded-full bg-white flex items-center justify-center text-neutral-500 hover:text-black transition-colors outline-none disabled:opacity-50"
4228
+ },
4229
+ /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Copy01Icon, size: 18 })
4230
+ )), /* @__PURE__ */ import_react73.default.createElement("div", { className: "text-[13px] text-black px-1 mt-2" }, "Total Invited: ", isLoading && !totalCount ? "-" : totalCount)), /* @__PURE__ */ import_react73.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react73.default.createElement(PageSpinner5, null) : /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react73.default.createElement("div", null, referrals.length === 0 ? /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex flex-col items-center justify-center py-12 opacity-50" }, /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-xs text-neutral-500 text-center" }, "You haven't referred anyone yet.")) : referrals.map((ref, idx) => /* @__PURE__ */ import_react73.default.createElement(
4231
+ "div",
4232
+ {
4233
+ key: `${ref.profile.username}-${idx}`,
4234
+ className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors group min-w-0 px-3 -mx-3 rounded-xl"
4235
+ },
4236
+ /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react73.default.createElement(
4237
+ AvatarLogo2,
4238
+ {
4239
+ src: ref.profile.avatarUrl,
4240
+ alt: ref.profile.username,
4241
+ name: formatWeb3Name2(ref.profile.web3Name)
4242
+ }
4243
+ ), /* @__PURE__ */ import_react73.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5 pr-4" }, /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-[14px] text-black truncate" }, formatWeb3Name2(ref.profile.web3Name)), /* @__PURE__ */ import_react73.default.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, "@", ref.profile.username))),
4244
+ /* @__PURE__ */ import_react73.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[11px] text-neutral-400" }, "Joined"), /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[12px] text-black" }, formatDate(ref.joinedAt)))
4245
+ ))), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react73.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react73.default.createElement(
4246
+ "button",
4247
+ {
4248
+ onClick: () => onPageChange(currentPage - 1),
4249
+ disabled: currentPage <= 1 || isLoading,
4250
+ className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
4251
+ },
4252
+ /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.ArrowLeft01Icon, size: 14 })
4253
+ ), /* @__PURE__ */ import_react73.default.createElement(
4254
+ "button",
4255
+ {
4256
+ onClick: () => onPageChange(currentPage + 1),
4257
+ disabled: currentPage >= totalPages || isLoading || totalPages === 0,
4258
+ className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
4259
+ },
4260
+ /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.ArrowRight01Icon, size: 14 })
4261
+ )))))));
4262
+ };
4168
4263
  // Annotate the CommonJS export names for ESM import in node:
4169
4264
  0 && (module.exports = {
4170
4265
  AppBento2,
@@ -4200,6 +4295,7 @@ var UniversalRewardPage = ({
4200
4295
  UniversalOrganizationPage,
4201
4296
  UniversalProfilePage,
4202
4297
  UniversalProfileSettings,
4298
+ UniversalReferralPage,
4203
4299
  UniversalRewardPage,
4204
4300
  UniversalSecurityPage,
4205
4301
  UniversalSidebar,
package/dist/index.mjs CHANGED
@@ -574,8 +574,11 @@ import { HugeiconsIcon as HugeiconsIcon3 } from "@hugeicons/react";
574
574
  var MobileNav = ({ items }) => {
575
575
  const pathname = usePathname2();
576
576
  if (!items || items.length === 0) return null;
577
- return /* @__PURE__ */ React7.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-3 animate-in slide-in-from-bottom-8 fade-in duration-500 md:hidden" }, /* @__PURE__ */ React7.createElement("nav", { className: "pointer-events-auto w-full max-w-sm bg-white/50 backdrop-blur-xl shadow-[0_8px_30px_rgb(0,0,0,0.08)] rounded-full px-6 py-2.5 flex items-center justify-between" }, items.map((item) => {
578
- const isActive = item.href === "/" || item.href === "/app" ? pathname === "/" || pathname === "/app" : pathname === item.href || pathname?.startsWith(`${item.href}/`);
577
+ const pathMatches = items.some((item) => {
578
+ return item.href === "/" || item.href === "/app" ? pathname === "/" || pathname === "/app" : pathname === item.href || pathname?.startsWith(`${item.href}/`);
579
+ });
580
+ return /* @__PURE__ */ React7.createElement("div", { className: "fixed bottom-6 inset-x-0 z-100 flex justify-center pointer-events-none px-3 animate-in slide-in-from-bottom-8 fade-in duration-500 md:hidden" }, /* @__PURE__ */ React7.createElement("nav", { className: "pointer-events-auto w-full max-w-sm bg-white/50 backdrop-blur-xl shadow-[0_8px_30px_rgb(0,0,0,0.08)] rounded-full px-6 py-2.5 flex items-center justify-between" }, items.map((item, index) => {
581
+ const isActive = !pathMatches && index === 0 ? true : item.href === "/" || item.href === "/app" ? pathname === "/" || pathname === "/app" : pathname === item.href || pathname?.startsWith(`${item.href}/`);
579
582
  return /* @__PURE__ */ React7.createElement(
580
583
  Link4,
581
584
  {
@@ -1258,7 +1261,7 @@ var UniversalTransactionPage = ({
1258
1261
  onDirectionFilterChange,
1259
1262
  activeTypeFilter,
1260
1263
  onTypeFilterChange,
1261
- formatDate,
1264
+ formatDate: formatDate2,
1262
1265
  onReportTransaction,
1263
1266
  onGenerateReceipt
1264
1267
  }) => {
@@ -1351,7 +1354,7 @@ var UniversalTransactionPage = ({
1351
1354
  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"
1352
1355
  },
1353
1356
  /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React15.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center bg-neutral-100 text-black` }, /* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon: tx.direction === "CREDIT" ? ArrowDownRight01Icon : ArrowUpRight01Icon, size: 18 })), /* @__PURE__ */ React15.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ React15.createElement("p", { className: "text-[13px] text-black truncate" }, getDisplayName(tx)), /* @__PURE__ */ React15.createElement("p", { className: `text-[12px] text-neutral-500 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, tx.amount))),
1354
- /* @__PURE__ */ React15.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] text-neutral-400" }, formatDate(tx.createdAt)), /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] text-neutral-400 capitalize" }, tx.direction.toLowerCase()))
1357
+ /* @__PURE__ */ React15.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] text-neutral-400" }, formatDate2(tx.createdAt)), /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] text-neutral-400 capitalize" }, tx.direction.toLowerCase()))
1355
1358
  ))), !hidePagination && /* @__PURE__ */ React15.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement(
1356
1359
  "button",
1357
1360
  {
@@ -1375,7 +1378,7 @@ var UniversalTransactionPage = ({
1375
1378
  className: "text-neutral-400 hover:text-black transition-colors outline-none"
1376
1379
  },
1377
1380
  /* @__PURE__ */ React15.createElement(HugeiconsIcon9, { icon: Copy01Icon, size: 14 })
1378
- ))), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Date & Time"), /* @__PURE__ */ React15.createElement("span", { className: "text-[13px] text-black" }, formatDate(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transaction Type"), /* @__PURE__ */ React15.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Flow Direction"), /* @__PURE__ */ React15.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transfer Route"), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 text-[13px] text-black" }, /* @__PURE__ */ React15.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ React15.createElement("span", { className: "text-neutral-400" }, "\u2192"), /* @__PURE__ */ React15.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
1381
+ ))), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Date & Time"), /* @__PURE__ */ React15.createElement("span", { className: "text-[13px] text-black" }, formatDate2(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transaction Type"), /* @__PURE__ */ React15.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Flow Direction"), /* @__PURE__ */ React15.createElement("span", { className: "text-[13px] text-black capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-2" }, "Transfer Route"), /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 text-[13px] text-black" }, /* @__PURE__ */ React15.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ React15.createElement("span", { className: "text-neutral-400" }, "\u2192"), /* @__PURE__ */ React15.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
1379
1382
  if (key === "fromAddress" || key === "toAddress") return null;
1380
1383
  if (value === null || value === void 0 || typeof value === "object") return null;
1381
1384
  const formattedKey = key.includes(" ") ? key : key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
@@ -2315,12 +2318,11 @@ import {
2315
2318
  ShieldUserIcon,
2316
2319
  MessageQuestionIcon,
2317
2320
  UserIdVerificationIcon,
2318
- FileDownloadIcon,
2321
+ CrownIcon,
2319
2322
  LogoutCircle02Icon,
2320
2323
  UserRemove01Icon,
2321
2324
  ArrowRight01Icon as ArrowRight01Icon4,
2322
- Loading03Icon as Loading03Icon10,
2323
- CrownIcon
2325
+ Loading03Icon as Loading03Icon10
2324
2326
  } from "@hugeicons/core-free-icons";
2325
2327
  var UniversalProfilePage = ({
2326
2328
  avatarSrc,
@@ -2349,6 +2351,14 @@ var UniversalProfilePage = ({
2349
2351
  setShowLogoutDialog(false);
2350
2352
  }
2351
2353
  };
2354
+ const getBadgeColorClass = (role) => {
2355
+ if (!role) return "text-neutral-400";
2356
+ const r = role.toLowerCase();
2357
+ if (r.includes("basic")) return "text-neutral-400";
2358
+ if (r.includes("standard")) return "text-blue-500";
2359
+ if (r.includes("platinum")) return "text-yellow-400";
2360
+ return "text-neutral-400";
2361
+ };
2352
2362
  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(
2353
2363
  "img",
2354
2364
  {
@@ -2357,7 +2367,7 @@ var UniversalProfilePage = ({
2357
2367
  onLoad: () => setIsAvatarLoaded(true),
2358
2368
  className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
2359
2369
  }
2360
- )) : /* @__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(
2370
+ )) : /* @__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("span", { className: getBadgeColorClass(roleName), "aria-hidden": true }, /* @__PURE__ */ React22.createElement("svg", { width: "17", height: "17", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React22.createElement("g", { id: "SVGRepo_bgCarrier", strokeWidth: "0" }), /* @__PURE__ */ React22.createElement("g", { id: "SVGRepo_tracerCarrier", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React22.createElement("g", { id: "SVGRepo_iconCarrier" }, " ", /* @__PURE__ */ React22.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5924 3.20027C9.34888 3.4078 9.22711 3.51158 9.09706 3.59874C8.79896 3.79854 8.46417 3.93721 8.1121 4.00672C7.95851 4.03705 7.79903 4.04977 7.48008 4.07522C6.6787 4.13918 6.278 4.17115 5.94371 4.28923C5.17051 4.56233 4.56233 5.17051 4.28923 5.94371C4.17115 6.278 4.13918 6.6787 4.07522 7.48008C4.04977 7.79903 4.03705 7.95851 4.00672 8.1121C3.93721 8.46417 3.79854 8.79896 3.59874 9.09706C3.51158 9.22711 3.40781 9.34887 3.20027 9.5924C2.67883 10.2043 2.4181 10.5102 2.26522 10.8301C1.91159 11.57 1.91159 12.43 2.26522 13.1699C2.41811 13.4898 2.67883 13.7957 3.20027 14.4076C3.40778 14.6511 3.51158 14.7729 3.59874 14.9029C3.79854 15.201 3.93721 15.5358 4.00672 15.8879C4.03705 16.0415 4.04977 16.201 4.07522 16.5199C4.13918 17.3213 4.17115 17.722 4.28923 18.0563C4.56233 18.8295 5.17051 19.4377 5.94371 19.7108C6.278 19.8288 6.6787 19.8608 7.48008 19.9248C7.79903 19.9502 7.95851 19.963 8.1121 19.9933C8.46417 20.0628 8.79896 20.2015 9.09706 20.4013C9.22711 20.4884 9.34887 20.5922 9.5924 20.7997C10.2043 21.3212 10.5102 21.5819 10.8301 21.7348C11.57 22.0884 12.43 22.0884 13.1699 21.7348C13.4898 21.5819 13.7957 21.3212 14.4076 20.7997C14.6511 20.5922 14.7729 20.4884 14.9029 20.4013C15.201 20.2015 15.5358 20.0628 15.8879 19.9933C16.0415 19.963 16.201 19.9502 16.5199 19.9248C17.3213 19.8608 17.722 19.8288 18.0563 19.7108C18.8295 19.4377 19.4377 18.8295 19.7108 18.0563C19.8288 17.722 19.8608 17.3213 19.9248 16.5199C19.9502 16.201 19.963 16.0415 19.9933 15.8879C20.0628 15.5358 20.2015 15.201 20.4013 14.9029C20.4884 14.7729 20.5922 14.6511 20.7997 14.4076C21.3212 13.7957 21.5819 13.4898 21.7348 13.1699C22.0884 12.43 22.0884 11.57 21.7348 10.8301C21.5819 10.5102 21.3212 10.2043 20.7997 9.5924C20.5922 9.34887 20.4884 9.22711 20.4013 9.09706C20.2015 8.79896 20.0628 8.46417 19.9933 8.1121C19.963 7.95851 19.9502 7.79903 19.9248 7.48008C19.8608 6.6787 19.8288 6.278 19.7108 5.94371C19.4377 5.17051 18.8295 4.56233 18.0563 4.28923C17.722 4.17115 17.3213 4.13918 16.5199 4.07522C16.201 4.04977 16.0415 4.03705 15.8879 4.00672C15.5358 3.93721 15.201 3.79854 14.9029 3.59874C14.7729 3.51158 14.6511 3.40781 14.4076 3.20027C13.7957 2.67883 13.4898 2.41811 13.1699 2.26522C12.43 1.91159 11.57 1.91159 10.8301 2.26522C10.5102 2.4181 10.2043 2.67883 9.5924 3.20027ZM16.3735 9.86314C16.6913 9.5453 16.6913 9.03 16.3735 8.71216C16.0557 8.39433 15.5403 8.39433 15.2225 8.71216L10.3723 13.5624L8.77746 11.9676C8.45963 11.6498 7.94432 11.6498 7.62649 11.9676C7.30866 12.2854 7.30866 12.8007 7.62649 13.1186L9.79678 15.2889C10.1146 15.6067 10.6299 15.6067 10.9478 15.2889L16.3735 9.86314Z", fill: "currentColor" }), " ")))), /* @__PURE__ */ 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(
2361
2371
  MenuRow2,
2362
2372
  {
2363
2373
  icon: UserIcon2,
@@ -2401,9 +2411,9 @@ var UniversalProfilePage = ({
2401
2411
  ), /* @__PURE__ */ React22.createElement(
2402
2412
  MenuRow2,
2403
2413
  {
2404
- icon: FileDownloadIcon,
2405
- title: "Account Statements",
2406
- subtitle: "Download account statements",
2414
+ icon: CrownIcon,
2415
+ title: "My Referrals",
2416
+ subtitle: "Referral & Rewards",
2407
2417
  onClick: onExportTap
2408
2418
  }
2409
2419
  ), /* @__PURE__ */ React22.createElement(
@@ -4176,6 +4186,94 @@ var UniversalRewardPage = ({
4176
4186
  "Cancel"
4177
4187
  )))))));
4178
4188
  };
4189
+
4190
+ // src/components/UniversalReferralPage.tsx
4191
+ import React44, { useState as useState28 } from "react";
4192
+ import toast9 from "react-hot-toast";
4193
+ import { HugeiconsIcon as HugeiconsIcon30 } from "@hugeicons/react";
4194
+ import {
4195
+ ArrowLeft01Icon as ArrowLeft01Icon10,
4196
+ ArrowRight01Icon as ArrowRight01Icon8,
4197
+ Loading03Icon as Loading03Icon18,
4198
+ Copy01Icon as Copy01Icon4
4199
+ } from "@hugeicons/core-free-icons";
4200
+ var PageSpinner5 = () => /* @__PURE__ */ React44.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: Loading03Icon18, size: 32, className: "animate-spin mb-4 text-black" }));
4201
+ var formatWeb3Name2 = (name) => {
4202
+ if (!name) return "";
4203
+ return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
4204
+ };
4205
+ var formatDate = (dateInput) => {
4206
+ return new Date(dateInput).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
4207
+ };
4208
+ var UniversalReferralPage = ({
4209
+ referralCode,
4210
+ totalCount,
4211
+ referrals,
4212
+ isLoading,
4213
+ currentPage,
4214
+ totalPages,
4215
+ onPageChange,
4216
+ onBack
4217
+ }) => {
4218
+ const onBackHandler = onBack ?? (() => {
4219
+ if (typeof window !== "undefined") window.history.back();
4220
+ });
4221
+ const handleCopyCode = async () => {
4222
+ if (!referralCode) return;
4223
+ try {
4224
+ await navigator.clipboard.writeText(referralCode);
4225
+ toast9.success("Referral code copied!");
4226
+ } catch {
4227
+ toast9.error("Failed to copy code.");
4228
+ }
4229
+ };
4230
+ const AvatarLogo2 = ({ src, alt, name, sizeClass = "w-10 h-10" }) => {
4231
+ const [isLoaded, setIsLoaded] = useState28(false);
4232
+ const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
4233
+ const finalSrc = src || fallbackUrl;
4234
+ return /* @__PURE__ */ React44.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden border-2 border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: Loading03Icon18, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React44.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
4235
+ };
4236
+ return /* @__PURE__ */ React44.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React44.createElement(ManagedToaster, null), /* @__PURE__ */ React44.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React44.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: ArrowLeft01Icon10, size: 16 }), " Back")), /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-3xl bg-white w-full" }, /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col gap-4 mb-2" }, /* @__PURE__ */ React44.createElement("div", null, /* @__PURE__ */ React44.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ React44.createElement("p", { className: "text-xs text-neutral-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ React44.createElement("div", { className: "border border-neutral-200 rounded-xl p-4 flex items-center justify-between mt-2" }, /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React44.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ React44.createElement("div", { className: "h-6 w-24 bg-neutral-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ React44.createElement("span", { className: "text-lg text-black tracking-widest" }, referralCode)), /* @__PURE__ */ React44.createElement(
4237
+ "button",
4238
+ {
4239
+ onClick: handleCopyCode,
4240
+ disabled: isLoading || !referralCode,
4241
+ className: "w-10 h-10 rounded-full bg-white flex items-center justify-center text-neutral-500 hover:text-black transition-colors outline-none disabled:opacity-50"
4242
+ },
4243
+ /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: Copy01Icon4, size: 18 })
4244
+ )), /* @__PURE__ */ React44.createElement("div", { className: "text-[13px] text-black px-1 mt-2" }, "Total Invited: ", isLoading && !totalCount ? "-" : totalCount)), /* @__PURE__ */ React44.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React44.createElement(PageSpinner5, null) : /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React44.createElement("div", null, referrals.length === 0 ? /* @__PURE__ */ React44.createElement("div", { className: "flex flex-col items-center justify-center py-12 opacity-50" }, /* @__PURE__ */ React44.createElement("p", { className: "text-xs text-neutral-500 text-center" }, "You haven't referred anyone yet.")) : referrals.map((ref, idx) => /* @__PURE__ */ React44.createElement(
4245
+ "div",
4246
+ {
4247
+ key: `${ref.profile.username}-${idx}`,
4248
+ className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors group min-w-0 px-3 -mx-3 rounded-xl"
4249
+ },
4250
+ /* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React44.createElement(
4251
+ AvatarLogo2,
4252
+ {
4253
+ src: ref.profile.avatarUrl,
4254
+ alt: ref.profile.username,
4255
+ name: formatWeb3Name2(ref.profile.web3Name)
4256
+ }
4257
+ ), /* @__PURE__ */ React44.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5 pr-4" }, /* @__PURE__ */ React44.createElement("p", { className: "text-[14px] text-black truncate" }, formatWeb3Name2(ref.profile.web3Name)), /* @__PURE__ */ React44.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, "@", ref.profile.username))),
4258
+ /* @__PURE__ */ React44.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ React44.createElement("span", { className: "text-[11px] text-neutral-400" }, "Joined"), /* @__PURE__ */ React44.createElement("span", { className: "text-[12px] text-black" }, formatDate(ref.joinedAt)))
4259
+ ))), /* @__PURE__ */ React44.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React44.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React44.createElement(
4260
+ "button",
4261
+ {
4262
+ onClick: () => onPageChange(currentPage - 1),
4263
+ disabled: currentPage <= 1 || isLoading,
4264
+ className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
4265
+ },
4266
+ /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: ArrowLeft01Icon10, size: 14 })
4267
+ ), /* @__PURE__ */ React44.createElement(
4268
+ "button",
4269
+ {
4270
+ onClick: () => onPageChange(currentPage + 1),
4271
+ disabled: currentPage >= totalPages || isLoading || totalPages === 0,
4272
+ className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
4273
+ },
4274
+ /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: ArrowRight01Icon8, size: 14 })
4275
+ )))))));
4276
+ };
4179
4277
  export {
4180
4278
  AppBento2,
4181
4279
  ConsultantShowcase,
@@ -4210,6 +4308,7 @@ export {
4210
4308
  UniversalOrganizationPage,
4211
4309
  UniversalProfilePage,
4212
4310
  UniversalProfileSettings,
4311
+ UniversalReferralPage,
4213
4312
  UniversalRewardPage,
4214
4313
  UniversalSecurityPage,
4215
4314
  UniversalSidebar,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "13.0.45",
3
+ "version": "14.0.01",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",