@retinalabsllc/zairusjs 13.0.45 → 14.0.0

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,
@@ -1307,7 +1308,7 @@ var UniversalTransactionPage = ({
1307
1308
  onDirectionFilterChange,
1308
1309
  activeTypeFilter,
1309
1310
  onTypeFilterChange,
1310
- formatDate,
1311
+ formatDate: formatDate2,
1311
1312
  onReportTransaction,
1312
1313
  onGenerateReceipt
1313
1314
  }) => {
@@ -1400,7 +1401,7 @@ var UniversalTransactionPage = ({
1400
1401
  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
1402
  },
1402
1403
  /* @__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()))
1404
+ /* @__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
1405
  ))), !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
1406
  "button",
1406
1407
  {
@@ -1424,7 +1425,7 @@ var UniversalTransactionPage = ({
1424
1425
  className: "text-neutral-400 hover:text-black transition-colors outline-none"
1425
1426
  },
1426
1427
  /* @__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]) => {
1428
+ ))), /* @__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
1429
  if (key === "fromAddress" || key === "toAddress") return null;
1429
1430
  if (value === null || value === void 0 || typeof value === "object") return null;
1430
1431
  const formattedKey = key.includes(" ") ? key : key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
@@ -2361,6 +2362,14 @@ var UniversalProfilePage = ({
2361
2362
  setShowLogoutDialog(false);
2362
2363
  }
2363
2364
  };
2365
+ const getBadgeColorClass = (role) => {
2366
+ if (!role) return "text-neutral-400";
2367
+ const r = role.toLowerCase();
2368
+ if (r.includes("basic")) return "text-neutral-400";
2369
+ if (r.includes("standard")) return "text-blue-500";
2370
+ if (r.includes("platinum")) return "text-yellow-400";
2371
+ return "text-neutral-400";
2372
+ };
2364
2373
  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
2374
  "img",
2366
2375
  {
@@ -2369,7 +2378,7 @@ var UniversalProfilePage = ({
2369
2378
  onLoad: () => setIsAvatarLoaded(true),
2370
2379
  className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
2371
2380
  }
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(
2381
+ )) : /* @__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: "15", height: "15", viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react37.default.createElement("path", { d: "M12 2l2.09 4.26L18.6 7l-3.3 2.92.98 4.32L12 12.9 7.72 14.24l.98-4.32L5.4 7l4.51-.74L12 2z" }), /* @__PURE__ */ import_react37.default.createElement("path", { d: "M10.0 13.5l-1.5-1.5L7.5 13.0 10 15.5 16.5 9 15 7.5 10 13.5z" })))), /* @__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
2382
  MenuRow2,
2374
2383
  {
2375
2384
  icon: import_core_free_icons14.UserIcon,
@@ -2413,9 +2422,9 @@ var UniversalProfilePage = ({
2413
2422
  ), /* @__PURE__ */ import_react37.default.createElement(
2414
2423
  MenuRow2,
2415
2424
  {
2416
- icon: import_core_free_icons14.FileDownloadIcon,
2417
- title: "Account Statements",
2418
- subtitle: "Download account statements",
2425
+ icon: import_core_free_icons14.CrownIcon,
2426
+ title: "My Referrals",
2427
+ subtitle: "Referral & Rewards",
2419
2428
  onClick: onExportTap
2420
2429
  }
2421
2430
  ), /* @__PURE__ */ import_react37.default.createElement(
@@ -4165,6 +4174,89 @@ var UniversalRewardPage = ({
4165
4174
  "Cancel"
4166
4175
  )))))));
4167
4176
  };
4177
+
4178
+ // src/components/UniversalReferralPage.tsx
4179
+ var import_react73 = __toESM(require("react"));
4180
+ var import_react_hot_toast10 = __toESM(require("react-hot-toast"));
4181
+ var import_react74 = require("@hugeicons/react");
4182
+ var import_core_free_icons25 = require("@hugeicons/core-free-icons");
4183
+ 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" }));
4184
+ var formatWeb3Name2 = (name) => {
4185
+ if (!name) return "";
4186
+ return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
4187
+ };
4188
+ var formatDate = (dateInput) => {
4189
+ return new Date(dateInput).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
4190
+ };
4191
+ var UniversalReferralPage = ({
4192
+ referralCode,
4193
+ totalCount,
4194
+ referrals,
4195
+ isLoading,
4196
+ currentPage,
4197
+ totalPages,
4198
+ onPageChange,
4199
+ onBack
4200
+ }) => {
4201
+ const onBackHandler = onBack ?? (() => {
4202
+ if (typeof window !== "undefined") window.history.back();
4203
+ });
4204
+ const handleCopyCode = async () => {
4205
+ if (!referralCode) return;
4206
+ try {
4207
+ await navigator.clipboard.writeText(referralCode);
4208
+ import_react_hot_toast10.default.success("Referral code copied!");
4209
+ } catch {
4210
+ import_react_hot_toast10.default.error("Failed to copy code.");
4211
+ }
4212
+ };
4213
+ const AvatarLogo2 = ({ src, alt, name, sizeClass = "w-10 h-10" }) => {
4214
+ const [isLoaded, setIsLoaded] = (0, import_react73.useState)(false);
4215
+ const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
4216
+ const finalSrc = src || fallbackUrl;
4217
+ 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"}` }));
4218
+ };
4219
+ 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(
4220
+ "button",
4221
+ {
4222
+ onClick: handleCopyCode,
4223
+ disabled: isLoading || !referralCode,
4224
+ 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"
4225
+ },
4226
+ /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.Copy01Icon, size: 18 })
4227
+ )), /* @__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(
4228
+ "div",
4229
+ {
4230
+ key: `${ref.profile.username}-${idx}`,
4231
+ className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors group min-w-0 px-3 -mx-3 rounded-xl"
4232
+ },
4233
+ /* @__PURE__ */ import_react73.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react73.default.createElement(
4234
+ AvatarLogo2,
4235
+ {
4236
+ src: ref.profile.avatarUrl,
4237
+ alt: ref.profile.username,
4238
+ name: formatWeb3Name2(ref.profile.web3Name)
4239
+ }
4240
+ ), /* @__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))),
4241
+ /* @__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)))
4242
+ ))), /* @__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(
4243
+ "button",
4244
+ {
4245
+ onClick: () => onPageChange(currentPage - 1),
4246
+ disabled: currentPage <= 1 || isLoading,
4247
+ 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"
4248
+ },
4249
+ /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.ArrowLeft01Icon, size: 14 })
4250
+ ), /* @__PURE__ */ import_react73.default.createElement(
4251
+ "button",
4252
+ {
4253
+ onClick: () => onPageChange(currentPage + 1),
4254
+ disabled: currentPage >= totalPages || isLoading || totalPages === 0,
4255
+ 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"
4256
+ },
4257
+ /* @__PURE__ */ import_react73.default.createElement(import_react74.HugeiconsIcon, { icon: import_core_free_icons25.ArrowRight01Icon, size: 14 })
4258
+ )))))));
4259
+ };
4168
4260
  // Annotate the CommonJS export names for ESM import in node:
4169
4261
  0 && (module.exports = {
4170
4262
  AppBento2,
@@ -4200,6 +4292,7 @@ var UniversalRewardPage = ({
4200
4292
  UniversalOrganizationPage,
4201
4293
  UniversalProfilePage,
4202
4294
  UniversalProfileSettings,
4295
+ UniversalReferralPage,
4203
4296
  UniversalRewardPage,
4204
4297
  UniversalSecurityPage,
4205
4298
  UniversalSidebar,
package/dist/index.mjs CHANGED
@@ -1258,7 +1258,7 @@ var UniversalTransactionPage = ({
1258
1258
  onDirectionFilterChange,
1259
1259
  activeTypeFilter,
1260
1260
  onTypeFilterChange,
1261
- formatDate,
1261
+ formatDate: formatDate2,
1262
1262
  onReportTransaction,
1263
1263
  onGenerateReceipt
1264
1264
  }) => {
@@ -1351,7 +1351,7 @@ var UniversalTransactionPage = ({
1351
1351
  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
1352
  },
1353
1353
  /* @__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()))
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" }, formatDate2(tx.createdAt)), /* @__PURE__ */ React15.createElement("span", { className: "text-[11px] text-neutral-400 capitalize" }, tx.direction.toLowerCase()))
1355
1355
  ))), !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
1356
  "button",
1357
1357
  {
@@ -1375,7 +1375,7 @@ var UniversalTransactionPage = ({
1375
1375
  className: "text-neutral-400 hover:text-black transition-colors outline-none"
1376
1376
  },
1377
1377
  /* @__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]) => {
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" }, 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
1379
  if (key === "fromAddress" || key === "toAddress") return null;
1380
1380
  if (value === null || value === void 0 || typeof value === "object") return null;
1381
1381
  const formattedKey = key.includes(" ") ? key : key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
@@ -2315,12 +2315,11 @@ import {
2315
2315
  ShieldUserIcon,
2316
2316
  MessageQuestionIcon,
2317
2317
  UserIdVerificationIcon,
2318
- FileDownloadIcon,
2318
+ CrownIcon,
2319
2319
  LogoutCircle02Icon,
2320
2320
  UserRemove01Icon,
2321
2321
  ArrowRight01Icon as ArrowRight01Icon4,
2322
- Loading03Icon as Loading03Icon10,
2323
- CrownIcon
2322
+ Loading03Icon as Loading03Icon10
2324
2323
  } from "@hugeicons/core-free-icons";
2325
2324
  var UniversalProfilePage = ({
2326
2325
  avatarSrc,
@@ -2349,6 +2348,14 @@ var UniversalProfilePage = ({
2349
2348
  setShowLogoutDialog(false);
2350
2349
  }
2351
2350
  };
2351
+ const getBadgeColorClass = (role) => {
2352
+ if (!role) return "text-neutral-400";
2353
+ const r = role.toLowerCase();
2354
+ if (r.includes("basic")) return "text-neutral-400";
2355
+ if (r.includes("standard")) return "text-blue-500";
2356
+ if (r.includes("platinum")) return "text-yellow-400";
2357
+ return "text-neutral-400";
2358
+ };
2352
2359
  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
2360
  "img",
2354
2361
  {
@@ -2357,7 +2364,7 @@ var UniversalProfilePage = ({
2357
2364
  onLoad: () => setIsAvatarLoaded(true),
2358
2365
  className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
2359
2366
  }
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(
2367
+ )) : /* @__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: "15", height: "15", viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React22.createElement("path", { d: "M12 2l2.09 4.26L18.6 7l-3.3 2.92.98 4.32L12 12.9 7.72 14.24l.98-4.32L5.4 7l4.51-.74L12 2z" }), /* @__PURE__ */ React22.createElement("path", { d: "M10.0 13.5l-1.5-1.5L7.5 13.0 10 15.5 16.5 9 15 7.5 10 13.5z" })))), /* @__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
2368
  MenuRow2,
2362
2369
  {
2363
2370
  icon: UserIcon2,
@@ -2401,9 +2408,9 @@ var UniversalProfilePage = ({
2401
2408
  ), /* @__PURE__ */ React22.createElement(
2402
2409
  MenuRow2,
2403
2410
  {
2404
- icon: FileDownloadIcon,
2405
- title: "Account Statements",
2406
- subtitle: "Download account statements",
2411
+ icon: CrownIcon,
2412
+ title: "My Referrals",
2413
+ subtitle: "Referral & Rewards",
2407
2414
  onClick: onExportTap
2408
2415
  }
2409
2416
  ), /* @__PURE__ */ React22.createElement(
@@ -4176,6 +4183,94 @@ var UniversalRewardPage = ({
4176
4183
  "Cancel"
4177
4184
  )))))));
4178
4185
  };
4186
+
4187
+ // src/components/UniversalReferralPage.tsx
4188
+ import React44, { useState as useState28 } from "react";
4189
+ import toast9 from "react-hot-toast";
4190
+ import { HugeiconsIcon as HugeiconsIcon30 } from "@hugeicons/react";
4191
+ import {
4192
+ ArrowLeft01Icon as ArrowLeft01Icon10,
4193
+ ArrowRight01Icon as ArrowRight01Icon8,
4194
+ Loading03Icon as Loading03Icon18,
4195
+ Copy01Icon as Copy01Icon4
4196
+ } from "@hugeicons/core-free-icons";
4197
+ 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" }));
4198
+ var formatWeb3Name2 = (name) => {
4199
+ if (!name) return "";
4200
+ return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
4201
+ };
4202
+ var formatDate = (dateInput) => {
4203
+ return new Date(dateInput).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
4204
+ };
4205
+ var UniversalReferralPage = ({
4206
+ referralCode,
4207
+ totalCount,
4208
+ referrals,
4209
+ isLoading,
4210
+ currentPage,
4211
+ totalPages,
4212
+ onPageChange,
4213
+ onBack
4214
+ }) => {
4215
+ const onBackHandler = onBack ?? (() => {
4216
+ if (typeof window !== "undefined") window.history.back();
4217
+ });
4218
+ const handleCopyCode = async () => {
4219
+ if (!referralCode) return;
4220
+ try {
4221
+ await navigator.clipboard.writeText(referralCode);
4222
+ toast9.success("Referral code copied!");
4223
+ } catch {
4224
+ toast9.error("Failed to copy code.");
4225
+ }
4226
+ };
4227
+ const AvatarLogo2 = ({ src, alt, name, sizeClass = "w-10 h-10" }) => {
4228
+ const [isLoaded, setIsLoaded] = useState28(false);
4229
+ const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
4230
+ const finalSrc = src || fallbackUrl;
4231
+ 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"}` }));
4232
+ };
4233
+ 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(
4234
+ "button",
4235
+ {
4236
+ onClick: handleCopyCode,
4237
+ disabled: isLoading || !referralCode,
4238
+ 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"
4239
+ },
4240
+ /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: Copy01Icon4, size: 18 })
4241
+ )), /* @__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(
4242
+ "div",
4243
+ {
4244
+ key: `${ref.profile.username}-${idx}`,
4245
+ className: "flex items-center justify-between py-4 hover:bg-neutral-50 transition-colors group min-w-0 px-3 -mx-3 rounded-xl"
4246
+ },
4247
+ /* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React44.createElement(
4248
+ AvatarLogo2,
4249
+ {
4250
+ src: ref.profile.avatarUrl,
4251
+ alt: ref.profile.username,
4252
+ name: formatWeb3Name2(ref.profile.web3Name)
4253
+ }
4254
+ ), /* @__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))),
4255
+ /* @__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)))
4256
+ ))), /* @__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(
4257
+ "button",
4258
+ {
4259
+ onClick: () => onPageChange(currentPage - 1),
4260
+ disabled: currentPage <= 1 || isLoading,
4261
+ 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"
4262
+ },
4263
+ /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: ArrowLeft01Icon10, size: 14 })
4264
+ ), /* @__PURE__ */ React44.createElement(
4265
+ "button",
4266
+ {
4267
+ onClick: () => onPageChange(currentPage + 1),
4268
+ disabled: currentPage >= totalPages || isLoading || totalPages === 0,
4269
+ 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"
4270
+ },
4271
+ /* @__PURE__ */ React44.createElement(HugeiconsIcon30, { icon: ArrowRight01Icon8, size: 14 })
4272
+ )))))));
4273
+ };
4179
4274
  export {
4180
4275
  AppBento2,
4181
4276
  ConsultantShowcase,
@@ -4210,6 +4305,7 @@ export {
4210
4305
  UniversalOrganizationPage,
4211
4306
  UniversalProfilePage,
4212
4307
  UniversalProfileSettings,
4308
+ UniversalReferralPage,
4213
4309
  UniversalRewardPage,
4214
4310
  UniversalSecurityPage,
4215
4311
  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.0",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",