@retinalabsllc/zairusjs 13.0.40 → 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.
Files changed (5) hide show
  1. package/dist/index.d.mts +57 -1
  2. package/dist/index.d.ts +57 -1
  3. package/dist/index.js +213 -17
  4. package/dist/index.mjs +222 -20
  5. package/package.json +4 -1
package/dist/index.d.mts CHANGED
@@ -818,4 +818,60 @@ interface UniversalVerificationPageProps {
818
818
  }
819
819
  declare const UniversalVerificationPage: React.FC<UniversalVerificationPageProps>;
820
820
 
821
- export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, type NotificationItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, UniversalVerificationPage, type UniversalVerificationPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, type VerificationStatus, WaitlistDialog, type WaitlistDialogProps };
821
+ interface RewardProfile {
822
+ web3Name: string;
823
+ username: string;
824
+ avatarUrl: string | null;
825
+ }
826
+ interface LeaderboardItem {
827
+ position: number;
828
+ amount: string;
829
+ profile: RewardProfile;
830
+ }
831
+ interface RewardItem {
832
+ id: string;
833
+ rewardKey: string;
834
+ title: string;
835
+ description: string;
836
+ amount: string;
837
+ status: string;
838
+ handler: string;
839
+ endpoint: string;
840
+ config: any;
841
+ createdAt: string;
842
+ isEligible: boolean;
843
+ progressText: string;
844
+ }
845
+ interface UniversalRewardPageProps {
846
+ leaderboardToday: LeaderboardItem[];
847
+ leaderboardWeek: LeaderboardItem[];
848
+ leaderboardMonth: LeaderboardItem[];
849
+ rewards: RewardItem[];
850
+ onBack?: () => void;
851
+ isLoading: boolean;
852
+ onRefresh: () => void;
853
+ }
854
+ declare const UniversalRewardPage: React.FC<UniversalRewardPageProps>;
855
+
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
@@ -818,4 +818,60 @@ interface UniversalVerificationPageProps {
818
818
  }
819
819
  declare const UniversalVerificationPage: React.FC<UniversalVerificationPageProps>;
820
820
 
821
- export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, type NotificationItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, UniversalVerificationPage, type UniversalVerificationPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, type VerificationStatus, WaitlistDialog, type WaitlistDialogProps };
821
+ interface RewardProfile {
822
+ web3Name: string;
823
+ username: string;
824
+ avatarUrl: string | null;
825
+ }
826
+ interface LeaderboardItem {
827
+ position: number;
828
+ amount: string;
829
+ profile: RewardProfile;
830
+ }
831
+ interface RewardItem {
832
+ id: string;
833
+ rewardKey: string;
834
+ title: string;
835
+ description: string;
836
+ amount: string;
837
+ status: string;
838
+ handler: string;
839
+ endpoint: string;
840
+ config: any;
841
+ createdAt: string;
842
+ isEligible: boolean;
843
+ progressText: string;
844
+ }
845
+ interface UniversalRewardPageProps {
846
+ leaderboardToday: LeaderboardItem[];
847
+ leaderboardWeek: LeaderboardItem[];
848
+ leaderboardMonth: LeaderboardItem[];
849
+ rewards: RewardItem[];
850
+ onBack?: () => void;
851
+ isLoading: boolean;
852
+ onRefresh: () => void;
853
+ }
854
+ declare const UniversalRewardPage: React.FC<UniversalRewardPageProps>;
855
+
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,8 @@ __export(index_exports, {
64
64
  UniversalOrganizationPage: () => UniversalOrganizationPage,
65
65
  UniversalProfilePage: () => UniversalProfilePage,
66
66
  UniversalProfileSettings: () => UniversalProfileSettings,
67
+ UniversalReferralPage: () => UniversalReferralPage,
68
+ UniversalRewardPage: () => UniversalRewardPage,
67
69
  UniversalSecurityPage: () => UniversalSecurityPage,
68
70
  UniversalSidebar: () => UniversalSidebar,
69
71
  UniversalTransactionPage: () => UniversalTransactionPage,
@@ -1306,7 +1308,7 @@ var UniversalTransactionPage = ({
1306
1308
  onDirectionFilterChange,
1307
1309
  activeTypeFilter,
1308
1310
  onTypeFilterChange,
1309
- formatDate,
1311
+ formatDate: formatDate2,
1310
1312
  onReportTransaction,
1311
1313
  onGenerateReceipt
1312
1314
  }) => {
@@ -1399,7 +1401,7 @@ var UniversalTransactionPage = ({
1399
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"
1400
1402
  },
1401
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))),
1402
- /* @__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()))
1403
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(
1404
1406
  "button",
1405
1407
  {
@@ -1423,7 +1425,7 @@ var UniversalTransactionPage = ({
1423
1425
  className: "text-neutral-400 hover:text-black transition-colors outline-none"
1424
1426
  },
1425
1427
  /* @__PURE__ */ import_react23.default.createElement(import_react24.HugeiconsIcon, { icon: import_core_free_icons7.Copy01Icon, size: 14 })
1426
- ))), /* @__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]) => {
1427
1429
  if (key === "fromAddress" || key === "toAddress") return null;
1428
1430
  if (value === null || value === void 0 || typeof value === "object") return null;
1429
1431
  const formattedKey = key.includes(" ") ? key : key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
@@ -1443,15 +1445,6 @@ var UniversalTransactionPage = ({
1443
1445
  className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide mt-2"
1444
1446
  },
1445
1447
  "Report Transaction"
1446
- ), selectedTransaction.type === "WALLET_TRANSACTION" && /* @__PURE__ */ import_react23.default.createElement(
1447
- "a",
1448
- {
1449
- href: `https://basescan.org/tx/${selectedTransaction.reference}`,
1450
- target: "_blank",
1451
- rel: "noopener noreferrer",
1452
- className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide mt-2"
1453
- },
1454
- "View in block explorer"
1455
1448
  ))))), isDirectionModalOpen && /* @__PURE__ */ import_react23.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsDirectionModalOpen(false) }), /* @__PURE__ */ import_react23.default.createElement("div", { ref: directionDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react23.default.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ import_react23.default.createElement("h3", { className: "text-[14px] text-black tracking-tight" }, "Payment Type")), /* @__PURE__ */ import_react23.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "CREDIT", "DEBIT"].map((option) => /* @__PURE__ */ import_react23.default.createElement(
1456
1449
  "button",
1457
1450
  {
@@ -2160,7 +2153,7 @@ var UniversalCardPage = ({
2160
2153
  },
2161
2154
  className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : canFlip ? "cursor-pointer" : "cursor-default"}`,
2162
2155
  style: {
2163
- height: 175,
2156
+ height: 180,
2164
2157
  transformStyle: "preserve-3d",
2165
2158
  transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
2166
2159
  }
@@ -2369,6 +2362,14 @@ var UniversalProfilePage = ({
2369
2362
  setShowLogoutDialog(false);
2370
2363
  }
2371
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
+ };
2372
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(
2373
2374
  "img",
2374
2375
  {
@@ -2377,7 +2378,7 @@ var UniversalProfilePage = ({
2377
2378
  onLoad: () => setIsAvatarLoaded(true),
2378
2379
  className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
2379
2380
  }
2380
- )) : /* @__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(
2381
2382
  MenuRow2,
2382
2383
  {
2383
2384
  icon: import_core_free_icons14.UserIcon,
@@ -2421,9 +2422,9 @@ var UniversalProfilePage = ({
2421
2422
  ), /* @__PURE__ */ import_react37.default.createElement(
2422
2423
  MenuRow2,
2423
2424
  {
2424
- icon: import_core_free_icons14.FileDownloadIcon,
2425
- title: "Account Statements",
2426
- subtitle: "Download account statements",
2425
+ icon: import_core_free_icons14.CrownIcon,
2426
+ title: "My Referrals",
2427
+ subtitle: "Referral & Rewards",
2427
2428
  onClick: onExportTap
2428
2429
  }
2429
2430
  ), /* @__PURE__ */ import_react37.default.createElement(
@@ -4063,6 +4064,199 @@ var UniversalVerificationPage = ({
4063
4064
  }
4064
4065
  ))));
4065
4066
  };
4067
+
4068
+ // src/components/UniversalRewardPage.tsx
4069
+ var import_react71 = __toESM(require("react"));
4070
+ var import_axios = __toESM(require("axios"));
4071
+ var import_react_hot_toast9 = __toESM(require("react-hot-toast"));
4072
+ var import_react_confetti = __toESM(require("react-confetti"));
4073
+ var import_react_use = require("react-use");
4074
+ var import_react72 = require("@hugeicons/react");
4075
+ var import_core_free_icons24 = require("@hugeicons/core-free-icons");
4076
+ var formatWeb3Name = (name) => {
4077
+ if (!name) return "";
4078
+ return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
4079
+ };
4080
+ var PageSpinner4 = () => /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex justify-center items-center py-12 w-full" }, /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
4081
+ var AvatarLogo = ({ src, alt, name, sizeClass = "w-12 h-12" }) => {
4082
+ const [isLoaded, setIsLoaded] = (0, import_react71.useState)(false);
4083
+ const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
4084
+ const finalSrc = src || fallbackUrl;
4085
+ return /* @__PURE__ */ import_react71.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden border-[3px] border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react71.default.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
4086
+ };
4087
+ var UniversalRewardPage = ({
4088
+ leaderboardToday,
4089
+ leaderboardWeek,
4090
+ leaderboardMonth,
4091
+ rewards,
4092
+ isLoading,
4093
+ onBack,
4094
+ onRefresh
4095
+ }) => {
4096
+ const { width, height } = (0, import_react_use.useWindowSize)();
4097
+ const onBackHandler = onBack ?? (() => {
4098
+ if (typeof window !== "undefined") window.history.back();
4099
+ });
4100
+ const [activeTabIndex, setActiveTabIndex] = (0, import_react71.useState)(1);
4101
+ const tabs = [{ label: "Today" }, { label: "Week" }, { label: "Month" }];
4102
+ const [selectedReward, setSelectedReward] = (0, import_react71.useState)(null);
4103
+ const [isClaiming, setIsClaiming] = (0, import_react71.useState)(false);
4104
+ const [showConfetti, setShowConfetti] = (0, import_react71.useState)(false);
4105
+ const getActiveLeaderboard = () => {
4106
+ if (activeTabIndex === 0) return leaderboardToday || [];
4107
+ if (activeTabIndex === 1) return leaderboardWeek || [];
4108
+ return leaderboardMonth || [];
4109
+ };
4110
+ const activeLeaderboard = getActiveLeaderboard();
4111
+ const firstPlace = activeLeaderboard.find((l) => l.position === 1);
4112
+ const secondPlace = activeLeaderboard.find((l) => l.position === 2);
4113
+ const thirdPlace = activeLeaderboard.find((l) => l.position === 3);
4114
+ const remainingLeaderboard = activeLeaderboard.filter((l) => l.position > 3);
4115
+ const handleClaimReward = async () => {
4116
+ if (!selectedReward || !selectedReward.isEligible || selectedReward.status === "CLAIMED") return;
4117
+ setIsClaiming(true);
4118
+ try {
4119
+ const res = await import_axios.default.post(selectedReward.endpoint, selectedReward.config);
4120
+ if (res.data.success) {
4121
+ setShowConfetti(true);
4122
+ import_react_hot_toast9.default.success(res.data.message || "Reward claimed successfully!");
4123
+ setSelectedReward(null);
4124
+ onRefresh();
4125
+ setTimeout(() => {
4126
+ setShowConfetti(false);
4127
+ }, 6e3);
4128
+ }
4129
+ } catch (error) {
4130
+ import_react_hot_toast9.default.error(error.response?.data?.error || "Failed to claim reward. Please try again.");
4131
+ } finally {
4132
+ setIsClaiming(false);
4133
+ }
4134
+ };
4135
+ return /* @__PURE__ */ import_react71.default.createElement("div", null, /* @__PURE__ */ import_react71.default.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ import_react71.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react71.default.createElement(ManagedToaster, null), showConfetti && /* @__PURE__ */ import_react71.default.createElement("div", { className: "fixed inset-0 z-200 pointer-events-none" }, /* @__PURE__ */ import_react71.default.createElement(import_react_confetti.default, { width, height, recycle: false, numberOfPieces: 500, gravity: 0.15 })), isLoading ? /* @__PURE__ */ import_react71.default.createElement(PageSpinner4, null) : /* @__PURE__ */ import_react71.default.createElement(import_react71.default.Fragment, null, /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full p-4 pt-10 mb-6 flex items-end justify-center gap-2 sm:gap-6 h-64 relative overflow-hidden" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, secondPlace ? /* @__PURE__ */ import_react71.default.createElement(import_react71.default.Fragment, null, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(secondPlace.profile.web3Name)), /* @__PURE__ */ import_react71.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react71.default.createElement(AvatarLogo, { src: secondPlace.profile.avatarUrl, alt: secondPlace.profile.username, name: formatWeb3Name(secondPlace.profile.web3Name), sizeClass: "w-14 h-14 ring-4 ring-orange-100" }), /* @__PURE__ */ import_react71.default.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-orange-400 text-white flex items-center justify-center text-[10px] border border-white " }, "2")), /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-orange-200 rounded-t-xl h-24 flex items-center justify-center" }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-orange-400/30 text-2xl " }, "2nd"))) : /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-24 mt-auto" })), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-20 -mt-8" }, firstPlace ? /* @__PURE__ */ import_react71.default.createElement(import_react71.default.Fragment, null, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(firstPlace.profile.web3Name)), /* @__PURE__ */ import_react71.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react71.default.createElement(AvatarLogo, { src: firstPlace.profile.avatarUrl, alt: firstPlace.profile.username, name: formatWeb3Name(firstPlace.profile.web3Name), sizeClass: "w-17 h-17 ring-4 ring-purple-200" }), /* @__PURE__ */ import_react71.default.createElement("div", { className: "absolute -bottom-2 right-2 w-5 h-5 rounded-full bg-purple-500 text-white flex items-center justify-center text-[10px] border border-white " }, "1")), /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-purple-400 rounded-t-xl h-32 flex items-center justify-center " }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-white/40 text-3xl tracking-widest" }, "1st"))) : /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-32 mt-auto" })), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, thirdPlace ? /* @__PURE__ */ import_react71.default.createElement(import_react71.default.Fragment, null, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(thirdPlace.profile.web3Name)), /* @__PURE__ */ import_react71.default.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ import_react71.default.createElement(AvatarLogo, { src: thirdPlace.profile.avatarUrl, alt: thirdPlace.profile.username, name: formatWeb3Name(thirdPlace.profile.web3Name), sizeClass: "w-12 h-12 ring-4 ring-blue-100" }), /* @__PURE__ */ import_react71.default.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-blue-400 text-white flex items-center justify-center text-[10px] border border-white " }, "3")), /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-blue-200 rounded-t-xl h-20 flex items-center justify-center" }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-blue-400/30 text-xl " }, "3rd"))) : /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-20 mt-auto" }))), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex items-center justify-center mb-6 sm:mb-8 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar " }, tabs.map((tab, idx) => {
4136
+ const isActive = activeTabIndex === idx;
4137
+ return /* @__PURE__ */ import_react71.default.createElement(
4138
+ "button",
4139
+ {
4140
+ key: idx,
4141
+ onClick: () => setActiveTabIndex(idx),
4142
+ className: `px-5 py-1.5 rounded-full text-[11px] transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-neutral-100 text-black " : "text-neutral-500 hover:text-black hover:bg-neutral-50/50"}`
4143
+ },
4144
+ tab.label
4145
+ );
4146
+ }))), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ import_react71.default.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Available Tasks"), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col" }, rewards.length === 0 ? /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No rewards available at the moment.") : rewards.map((reward) => {
4147
+ const statusText = reward.status === "CLAIMED" ? "Claimed" : "Unclaimed";
4148
+ return /* @__PURE__ */ import_react71.default.createElement(
4149
+ "div",
4150
+ {
4151
+ key: reward.id,
4152
+ onClick: () => setSelectedReward(reward),
4153
+ 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"
4154
+ },
4155
+ /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-neutral-200 text-black" }, /* @__PURE__ */ import_react71.default.createElement(import_react72.HugeiconsIcon, { icon: import_core_free_icons24.GiftIcon, size: 16 })), /* @__PURE__ */ import_react71.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col items-start gap-0.5 pr-4" }, /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-[13px] text-black truncate w-full" }, reward.title), /* @__PURE__ */ import_react71.default.createElement("p", { className: `text-[10px] inline-flex items-center bg-neutral-50 rounded-full px-2 py-1 text-neutral-500 mt-0.5` }, statusText))),
4156
+ /* @__PURE__ */ import_react71.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1" }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-[13px] text-black" }, reward.amount))
4157
+ );
4158
+ }))), remainingLeaderboard.length > 0 && /* @__PURE__ */ import_react71.default.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ import_react71.default.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Leaderboard"), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col" }, remainingLeaderboard.map((lb) => /* @__PURE__ */ import_react71.default.createElement("div", { key: lb.profile.username, className: "flex items-center justify-between py-3 min-w-0" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "text-[12px] text-neutral-400 w-4" }, lb.position), /* @__PURE__ */ import_react71.default.createElement(AvatarLogo, { src: lb.profile.avatarUrl, alt: lb.profile.username, name: formatWeb3Name(lb.profile.web3Name), sizeClass: "w-9 h-9" }), /* @__PURE__ */ import_react71.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col" }, /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-[13px] text-black truncate" }, formatWeb3Name(lb.profile.web3Name)), /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-[11px] text-neutral-400 truncate" }, "@", lb.profile.username))), /* @__PURE__ */ import_react71.default.createElement("div", { className: "shrink-0 text-[13px] text-black" }, lb.amount))))))), selectedReward && /* @__PURE__ */ import_react71.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isClaiming && setSelectedReward(null) }), /* @__PURE__ */ import_react71.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-3xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex-1 p-6 flex flex-col items-center text-center mt-2" }, /* @__PURE__ */ import_react71.default.createElement("h2", { className: "text-xl text-black mb-2" }, selectedReward.title), /* @__PURE__ */ import_react71.default.createElement("p", { className: "text-[13px] text-neutral-500 mb-6 leading-relaxed" }, selectedReward.description), selectedReward.progressText && /* @__PURE__ */ import_react71.default.createElement("div", { className: "w-full mb-6" }, /* @__PURE__ */ import_react71.default.createElement("div", { className: `px-4 py-2 rounded-full text-[11px] tracking-wide ${selectedReward.status === "CLAIMED" ? "bg-green-50 text-green-600" : selectedReward.isEligible ? "bg-blue-50 text-blue-600" : "bg-neutral-100 text-neutral-600"}` }, selectedReward.progressText)), /* @__PURE__ */ import_react71.default.createElement("div", { className: " w-full rounded-xl p-4 mb-8 flex flex-col items-center" }, /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 uppercase mb-1" }, "Reward Value"), /* @__PURE__ */ import_react71.default.createElement("span", { className: "text-3xl text-black " }, selectedReward.amount)), /* @__PURE__ */ import_react71.default.createElement("div", { className: "flex flex-col gap-3 w-full" }, /* @__PURE__ */ import_react71.default.createElement(
4159
+ ThreeDActionButton,
4160
+ {
4161
+ onClick: handleClaimReward,
4162
+ isLoading: isClaiming,
4163
+ disabled: isClaiming || selectedReward.status === "CLAIMED" || !selectedReward.isEligible,
4164
+ className: "w-full"
4165
+ },
4166
+ selectedReward.status === "CLAIMED" ? "Already Claimed" : selectedReward.isEligible ? "Claim Reward" : "Not Eligible Yet"
4167
+ ), /* @__PURE__ */ import_react71.default.createElement(
4168
+ "button",
4169
+ {
4170
+ onClick: () => setSelectedReward(null),
4171
+ disabled: isClaiming,
4172
+ className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide mt-2"
4173
+ },
4174
+ "Cancel"
4175
+ )))))));
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
+ };
4066
4260
  // Annotate the CommonJS export names for ESM import in node:
4067
4261
  0 && (module.exports = {
4068
4262
  AppBento2,
@@ -4098,6 +4292,8 @@ var UniversalVerificationPage = ({
4098
4292
  UniversalOrganizationPage,
4099
4293
  UniversalProfilePage,
4100
4294
  UniversalProfileSettings,
4295
+ UniversalReferralPage,
4296
+ UniversalRewardPage,
4101
4297
  UniversalSecurityPage,
4102
4298
  UniversalSidebar,
4103
4299
  UniversalTransactionPage,
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());
@@ -1395,15 +1395,6 @@ var UniversalTransactionPage = ({
1395
1395
  className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide mt-2"
1396
1396
  },
1397
1397
  "Report Transaction"
1398
- ), selectedTransaction.type === "WALLET_TRANSACTION" && /* @__PURE__ */ React15.createElement(
1399
- "a",
1400
- {
1401
- href: `https://basescan.org/tx/${selectedTransaction.reference}`,
1402
- target: "_blank",
1403
- rel: "noopener noreferrer",
1404
- className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide mt-2"
1405
- },
1406
- "View in block explorer"
1407
1398
  ))))), isDirectionModalOpen && /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React15.createElement("div", { className: "absolute inset-0 bg-black/40 ", onClick: () => setIsDirectionModalOpen(false) }), /* @__PURE__ */ React15.createElement("div", { ref: directionDropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React15.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ React15.createElement("h3", { className: "text-[14px] text-black tracking-tight" }, "Payment Type")), /* @__PURE__ */ React15.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "CREDIT", "DEBIT"].map((option) => /* @__PURE__ */ React15.createElement(
1408
1399
  "button",
1409
1400
  {
@@ -2137,7 +2128,7 @@ var UniversalCardPage = ({
2137
2128
  },
2138
2129
  className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : canFlip ? "cursor-pointer" : "cursor-default"}`,
2139
2130
  style: {
2140
- height: 175,
2131
+ height: 180,
2141
2132
  transformStyle: "preserve-3d",
2142
2133
  transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
2143
2134
  }
@@ -2324,12 +2315,11 @@ import {
2324
2315
  ShieldUserIcon,
2325
2316
  MessageQuestionIcon,
2326
2317
  UserIdVerificationIcon,
2327
- FileDownloadIcon,
2318
+ CrownIcon,
2328
2319
  LogoutCircle02Icon,
2329
2320
  UserRemove01Icon,
2330
2321
  ArrowRight01Icon as ArrowRight01Icon4,
2331
- Loading03Icon as Loading03Icon10,
2332
- CrownIcon
2322
+ Loading03Icon as Loading03Icon10
2333
2323
  } from "@hugeicons/core-free-icons";
2334
2324
  var UniversalProfilePage = ({
2335
2325
  avatarSrc,
@@ -2358,6 +2348,14 @@ var UniversalProfilePage = ({
2358
2348
  setShowLogoutDialog(false);
2359
2349
  }
2360
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
+ };
2361
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(
2362
2360
  "img",
2363
2361
  {
@@ -2366,7 +2364,7 @@ var UniversalProfilePage = ({
2366
2364
  onLoad: () => setIsAvatarLoaded(true),
2367
2365
  className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
2368
2366
  }
2369
- )) : /* @__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(
2370
2368
  MenuRow2,
2371
2369
  {
2372
2370
  icon: UserIcon2,
@@ -2410,9 +2408,9 @@ var UniversalProfilePage = ({
2410
2408
  ), /* @__PURE__ */ React22.createElement(
2411
2409
  MenuRow2,
2412
2410
  {
2413
- icon: FileDownloadIcon,
2414
- title: "Account Statements",
2415
- subtitle: "Download account statements",
2411
+ icon: CrownIcon,
2412
+ title: "My Referrals",
2413
+ subtitle: "Referral & Rewards",
2416
2414
  onClick: onExportTap
2417
2415
  }
2418
2416
  ), /* @__PURE__ */ React22.createElement(
@@ -4071,6 +4069,208 @@ var UniversalVerificationPage = ({
4071
4069
  }
4072
4070
  ))));
4073
4071
  };
4072
+
4073
+ // src/components/UniversalRewardPage.tsx
4074
+ import React43, { useState as useState27 } from "react";
4075
+ import axios from "axios";
4076
+ import toast8 from "react-hot-toast";
4077
+ import Confetti from "react-confetti";
4078
+ import { useWindowSize } from "react-use";
4079
+ import { HugeiconsIcon as HugeiconsIcon29 } from "@hugeicons/react";
4080
+ import {
4081
+ GiftIcon,
4082
+ Loading03Icon as Loading03Icon17,
4083
+ ArrowLeft01Icon as ArrowLeft01Icon9
4084
+ } from "@hugeicons/core-free-icons";
4085
+ var formatWeb3Name = (name) => {
4086
+ if (!name) return "";
4087
+ return name.toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase());
4088
+ };
4089
+ var PageSpinner4 = () => /* @__PURE__ */ React43.createElement("div", { className: "flex justify-center items-center py-12 w-full" }, /* @__PURE__ */ React43.createElement(HugeiconsIcon29, { icon: Loading03Icon17, size: 32, className: "animate-spin mb-4 text-black" }));
4090
+ var AvatarLogo = ({ src, alt, name, sizeClass = "w-12 h-12" }) => {
4091
+ const [isLoaded, setIsLoaded] = useState27(false);
4092
+ const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=200&font-size=0.33`;
4093
+ const finalSrc = src || fallbackUrl;
4094
+ return /* @__PURE__ */ React43.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden border-[3px] border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React43.createElement(HugeiconsIcon29, { icon: Loading03Icon17, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React43.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
4095
+ };
4096
+ var UniversalRewardPage = ({
4097
+ leaderboardToday,
4098
+ leaderboardWeek,
4099
+ leaderboardMonth,
4100
+ rewards,
4101
+ isLoading,
4102
+ onBack,
4103
+ onRefresh
4104
+ }) => {
4105
+ const { width, height } = useWindowSize();
4106
+ const onBackHandler = onBack ?? (() => {
4107
+ if (typeof window !== "undefined") window.history.back();
4108
+ });
4109
+ const [activeTabIndex, setActiveTabIndex] = useState27(1);
4110
+ const tabs = [{ label: "Today" }, { label: "Week" }, { label: "Month" }];
4111
+ const [selectedReward, setSelectedReward] = useState27(null);
4112
+ const [isClaiming, setIsClaiming] = useState27(false);
4113
+ const [showConfetti, setShowConfetti] = useState27(false);
4114
+ const getActiveLeaderboard = () => {
4115
+ if (activeTabIndex === 0) return leaderboardToday || [];
4116
+ if (activeTabIndex === 1) return leaderboardWeek || [];
4117
+ return leaderboardMonth || [];
4118
+ };
4119
+ const activeLeaderboard = getActiveLeaderboard();
4120
+ const firstPlace = activeLeaderboard.find((l) => l.position === 1);
4121
+ const secondPlace = activeLeaderboard.find((l) => l.position === 2);
4122
+ const thirdPlace = activeLeaderboard.find((l) => l.position === 3);
4123
+ const remainingLeaderboard = activeLeaderboard.filter((l) => l.position > 3);
4124
+ const handleClaimReward = async () => {
4125
+ if (!selectedReward || !selectedReward.isEligible || selectedReward.status === "CLAIMED") return;
4126
+ setIsClaiming(true);
4127
+ try {
4128
+ const res = await axios.post(selectedReward.endpoint, selectedReward.config);
4129
+ if (res.data.success) {
4130
+ setShowConfetti(true);
4131
+ toast8.success(res.data.message || "Reward claimed successfully!");
4132
+ setSelectedReward(null);
4133
+ onRefresh();
4134
+ setTimeout(() => {
4135
+ setShowConfetti(false);
4136
+ }, 6e3);
4137
+ }
4138
+ } catch (error) {
4139
+ toast8.error(error.response?.data?.error || "Failed to claim reward. Please try again.");
4140
+ } finally {
4141
+ setIsClaiming(false);
4142
+ }
4143
+ };
4144
+ return /* @__PURE__ */ React43.createElement("div", null, /* @__PURE__ */ React43.createElement("div", { className: "mb-6 flex max-w-3xl w-full mx-auto items-center px-1" }, /* @__PURE__ */ React43.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React43.createElement(HugeiconsIcon29, { icon: ArrowLeft01Icon9, size: 16 }), " Back")), /* @__PURE__ */ React43.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React43.createElement(ManagedToaster, null), showConfetti && /* @__PURE__ */ React43.createElement("div", { className: "fixed inset-0 z-200 pointer-events-none" }, /* @__PURE__ */ React43.createElement(Confetti, { width, height, recycle: false, numberOfPieces: 500, gravity: 0.15 })), isLoading ? /* @__PURE__ */ React43.createElement(PageSpinner4, null) : /* @__PURE__ */ React43.createElement(React43.Fragment, null, /* @__PURE__ */ React43.createElement("div", { className: "w-full p-4 pt-10 mb-6 flex items-end justify-center gap-2 sm:gap-6 h-64 relative overflow-hidden" }, /* @__PURE__ */ React43.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, secondPlace ? /* @__PURE__ */ React43.createElement(React43.Fragment, null, /* @__PURE__ */ React43.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(secondPlace.profile.web3Name)), /* @__PURE__ */ React43.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ React43.createElement(AvatarLogo, { src: secondPlace.profile.avatarUrl, alt: secondPlace.profile.username, name: formatWeb3Name(secondPlace.profile.web3Name), sizeClass: "w-14 h-14 ring-4 ring-orange-100" }), /* @__PURE__ */ React43.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-orange-400 text-white flex items-center justify-center text-[10px] border border-white " }, "2")), /* @__PURE__ */ React43.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-orange-200 rounded-t-xl h-24 flex items-center justify-center" }, /* @__PURE__ */ React43.createElement("span", { className: "text-orange-400/30 text-2xl " }, "2nd"))) : /* @__PURE__ */ React43.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-24 mt-auto" })), /* @__PURE__ */ React43.createElement("div", { className: "flex flex-col items-center w-1/3 z-20 -mt-8" }, firstPlace ? /* @__PURE__ */ React43.createElement(React43.Fragment, null, /* @__PURE__ */ React43.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(firstPlace.profile.web3Name)), /* @__PURE__ */ React43.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ React43.createElement(AvatarLogo, { src: firstPlace.profile.avatarUrl, alt: firstPlace.profile.username, name: formatWeb3Name(firstPlace.profile.web3Name), sizeClass: "w-17 h-17 ring-4 ring-purple-200" }), /* @__PURE__ */ React43.createElement("div", { className: "absolute -bottom-2 right-2 w-5 h-5 rounded-full bg-purple-500 text-white flex items-center justify-center text-[10px] border border-white " }, "1")), /* @__PURE__ */ React43.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-purple-400 rounded-t-xl h-32 flex items-center justify-center " }, /* @__PURE__ */ React43.createElement("span", { className: "text-white/40 text-3xl tracking-widest" }, "1st"))) : /* @__PURE__ */ React43.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-32 mt-auto" })), /* @__PURE__ */ React43.createElement("div", { className: "flex flex-col items-center w-1/3 z-10" }, thirdPlace ? /* @__PURE__ */ React43.createElement(React43.Fragment, null, /* @__PURE__ */ React43.createElement("span", { className: "text-black text-[10px] mb-2 truncate max-w-full px-1" }, formatWeb3Name(thirdPlace.profile.web3Name)), /* @__PURE__ */ React43.createElement("div", { className: "relative shrink-0 mb-3" }, /* @__PURE__ */ React43.createElement(AvatarLogo, { src: thirdPlace.profile.avatarUrl, alt: thirdPlace.profile.username, name: formatWeb3Name(thirdPlace.profile.web3Name), sizeClass: "w-12 h-12 ring-4 ring-blue-100" }), /* @__PURE__ */ React43.createElement("div", { className: "absolute -bottom-2 right-0 w-5 h-5 rounded-full bg-blue-400 text-white flex items-center justify-center text-[10px] border border-white " }, "3")), /* @__PURE__ */ React43.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-blue-200 rounded-t-xl h-20 flex items-center justify-center" }, /* @__PURE__ */ React43.createElement("span", { className: "text-blue-400/30 text-xl " }, "3rd"))) : /* @__PURE__ */ React43.createElement("div", { className: "w-full bg-linear-to-t from-neutral-100 to-neutral-200 rounded-t-xl h-20 mt-auto" }))), /* @__PURE__ */ React43.createElement("div", { className: "flex items-center justify-center mb-6 sm:mb-8 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ React43.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar " }, tabs.map((tab, idx) => {
4145
+ const isActive = activeTabIndex === idx;
4146
+ return /* @__PURE__ */ React43.createElement(
4147
+ "button",
4148
+ {
4149
+ key: idx,
4150
+ onClick: () => setActiveTabIndex(idx),
4151
+ className: `px-5 py-1.5 rounded-full text-[11px] transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-neutral-100 text-black " : "text-neutral-500 hover:text-black hover:bg-neutral-50/50"}`
4152
+ },
4153
+ tab.label
4154
+ );
4155
+ }))), /* @__PURE__ */ React43.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ React43.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ React43.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Available Tasks"), /* @__PURE__ */ React43.createElement("div", { className: "flex flex-col" }, rewards.length === 0 ? /* @__PURE__ */ React43.createElement("p", { className: "text-xs text-neutral-400 py-6 text-center" }, "No rewards available at the moment.") : rewards.map((reward) => {
4156
+ const statusText = reward.status === "CLAIMED" ? "Claimed" : "Unclaimed";
4157
+ return /* @__PURE__ */ React43.createElement(
4158
+ "div",
4159
+ {
4160
+ key: reward.id,
4161
+ onClick: () => setSelectedReward(reward),
4162
+ 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"
4163
+ },
4164
+ /* @__PURE__ */ React43.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React43.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full flex items-center justify-center border border-neutral-200 text-black" }, /* @__PURE__ */ React43.createElement(HugeiconsIcon29, { icon: GiftIcon, size: 16 })), /* @__PURE__ */ React43.createElement("div", { className: "min-w-0 flex-1 flex flex-col items-start gap-0.5 pr-4" }, /* @__PURE__ */ React43.createElement("p", { className: "text-[13px] text-black truncate w-full" }, reward.title), /* @__PURE__ */ React43.createElement("p", { className: `text-[10px] inline-flex items-center bg-neutral-50 rounded-full px-2 py-1 text-neutral-500 mt-0.5` }, statusText))),
4165
+ /* @__PURE__ */ React43.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1" }, /* @__PURE__ */ React43.createElement("span", { className: "text-[13px] text-black" }, reward.amount))
4166
+ );
4167
+ }))), remainingLeaderboard.length > 0 && /* @__PURE__ */ React43.createElement("div", { className: "bg-white rounded-2xl p-6 " }, /* @__PURE__ */ React43.createElement("h2", { className: "text-black text-lg mb-4 tracking-tight" }, "Leaderboard"), /* @__PURE__ */ React43.createElement("div", { className: "flex flex-col" }, remainingLeaderboard.map((lb) => /* @__PURE__ */ React43.createElement("div", { key: lb.profile.username, className: "flex items-center justify-between py-3 min-w-0" }, /* @__PURE__ */ React43.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React43.createElement("div", { className: "text-[12px] text-neutral-400 w-4" }, lb.position), /* @__PURE__ */ React43.createElement(AvatarLogo, { src: lb.profile.avatarUrl, alt: lb.profile.username, name: formatWeb3Name(lb.profile.web3Name), sizeClass: "w-9 h-9" }), /* @__PURE__ */ React43.createElement("div", { className: "min-w-0 flex-1 flex flex-col" }, /* @__PURE__ */ React43.createElement("p", { className: "text-[13px] text-black truncate" }, formatWeb3Name(lb.profile.web3Name)), /* @__PURE__ */ React43.createElement("p", { className: "text-[11px] text-neutral-400 truncate" }, "@", lb.profile.username))), /* @__PURE__ */ React43.createElement("div", { className: "shrink-0 text-[13px] text-black" }, lb.amount))))))), selectedReward && /* @__PURE__ */ React43.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React43.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => !isClaiming && setSelectedReward(null) }), /* @__PURE__ */ React43.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-3xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React43.createElement("div", { className: "flex-1 p-6 flex flex-col items-center text-center mt-2" }, /* @__PURE__ */ React43.createElement("h2", { className: "text-xl text-black mb-2" }, selectedReward.title), /* @__PURE__ */ React43.createElement("p", { className: "text-[13px] text-neutral-500 mb-6 leading-relaxed" }, selectedReward.description), selectedReward.progressText && /* @__PURE__ */ React43.createElement("div", { className: "w-full mb-6" }, /* @__PURE__ */ React43.createElement("div", { className: `px-4 py-2 rounded-full text-[11px] tracking-wide ${selectedReward.status === "CLAIMED" ? "bg-green-50 text-green-600" : selectedReward.isEligible ? "bg-blue-50 text-blue-600" : "bg-neutral-100 text-neutral-600"}` }, selectedReward.progressText)), /* @__PURE__ */ React43.createElement("div", { className: " w-full rounded-xl p-4 mb-8 flex flex-col items-center" }, /* @__PURE__ */ React43.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 uppercase mb-1" }, "Reward Value"), /* @__PURE__ */ React43.createElement("span", { className: "text-3xl text-black " }, selectedReward.amount)), /* @__PURE__ */ React43.createElement("div", { className: "flex flex-col gap-3 w-full" }, /* @__PURE__ */ React43.createElement(
4168
+ ThreeDActionButton,
4169
+ {
4170
+ onClick: handleClaimReward,
4171
+ isLoading: isClaiming,
4172
+ disabled: isClaiming || selectedReward.status === "CLAIMED" || !selectedReward.isEligible,
4173
+ className: "w-full"
4174
+ },
4175
+ selectedReward.status === "CLAIMED" ? "Already Claimed" : selectedReward.isEligible ? "Claim Reward" : "Not Eligible Yet"
4176
+ ), /* @__PURE__ */ React43.createElement(
4177
+ "button",
4178
+ {
4179
+ onClick: () => setSelectedReward(null),
4180
+ disabled: isClaiming,
4181
+ className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide mt-2"
4182
+ },
4183
+ "Cancel"
4184
+ )))))));
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
+ };
4074
4274
  export {
4075
4275
  AppBento2,
4076
4276
  ConsultantShowcase,
@@ -4105,6 +4305,8 @@ export {
4105
4305
  UniversalOrganizationPage,
4106
4306
  UniversalProfilePage,
4107
4307
  UniversalProfileSettings,
4308
+ UniversalReferralPage,
4309
+ UniversalRewardPage,
4108
4310
  UniversalSecurityPage,
4109
4311
  UniversalSidebar,
4110
4312
  UniversalTransactionPage,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "13.0.40",
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",
@@ -41,9 +41,12 @@
41
41
  "@hugeicons/react": "^1.1.1",
42
42
  "@simplewebauthn/browser": "^13.3.0",
43
43
  "@simplewebauthn/server": "^13.3.2",
44
+ "axios": "^1.18.1",
44
45
  "clsx": "^2.1.1",
46
+ "react-confetti": "^6.4.0",
45
47
  "react-google-recaptcha-v3": "^1.11.0",
46
48
  "react-hot-toast": "^2.6.0",
49
+ "react-use": "^17.6.1",
47
50
  "tailwind-merge": "^3.6.0",
48
51
  "tw-animate-css": "^1.4.0"
49
52
  },