@retinalabsllc/zairusjs 12.0.50 → 12.0.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -804,4 +804,17 @@ interface WaitlistDialogProps {
804
804
  }
805
805
  declare const WaitlistDialog: React.FC<WaitlistDialogProps>;
806
806
 
807
- export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, type NotificationItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, WaitlistDialog, type WaitlistDialogProps };
807
+ type VerificationStatus = 'APPROVED' | 'PENDING' | 'REJECTED' | 'ACTION_REQUIRED';
808
+ interface UniversalVerificationPageProps {
809
+ emailStatus: VerificationStatus;
810
+ phoneStatus: VerificationStatus;
811
+ identityStatus: VerificationStatus;
812
+ bannerMessage?: string | null;
813
+ bannerType?: 'info' | 'warning' | 'error' | 'success';
814
+ onBack: () => void;
815
+ onTriggerVerification: (type: 'EMAIL' | 'PHONE' | 'IDENTITY') => void;
816
+ activeLoadingType: 'EMAIL' | 'PHONE' | 'IDENTITY' | null;
817
+ }
818
+ declare const UniversalVerificationPage: React.FC<UniversalVerificationPageProps>;
819
+
820
+ 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 };
package/dist/index.d.ts CHANGED
@@ -804,4 +804,17 @@ interface WaitlistDialogProps {
804
804
  }
805
805
  declare const WaitlistDialog: React.FC<WaitlistDialogProps>;
806
806
 
807
- export { AppBento2, type AppBento2Props, type BannerProps, type BentoFeature, type BoardMember, type CompanyDetails, type ConsultantProfile, ConsultantShowcase, type ConsultantShowcaseProps, ContentGridBlock, type ContentGridBlockProps, type DocumentSectionData, type EmailContact, Faq, type FaqItem, type FaqProps, FeatureScroll, type FeatureScrollProps, Footer, type FooterColumn, type FooterLink, type FooterProps, GifFeatureCard, type GifFeatureCardProps, Header, type HeaderLink, type HeaderProps, type AppLogo$1 as HeroAppLogo, HeroSection, type HeroSectionProps, type HomeActionBtn, ManagedBoardBlock, type ManagedBoardBlockProps, ManagedContactBlock, type ManagedContactBlockProps, ManagedDocument, type ManagedDocumentProps, ManagedNewsletterSplitBlock, type ManagedNewsletterSplitBlockProps, ManagedNotFoundBlock, type ManagedNotFoundBlockProps, ManagedPricingBlock, type ManagedPricingBlockProps, ManagedProjectsBlock, type ManagedProjectsBlockProps, ManagedToaster, MedicalFeatureStatsBlock, MobileNav, type MobileNavItem, type MobileNavProps, type NavItem, type NotificationItem, NumberInput, type NumberInputProps, PageSpinner, type PageSpinnerProps, PipleAuth, type PipleAuthProps, type PlatformFeatureItem, PlatformFeatures, type PlatformFeaturesProps, PortfolioHero, type PortfolioHeroProps, type AppLogo as PricingAppLogo, type PricingFeature, type PricingPlan, type PricingTab, type ProjectItem, type ScrollFeature, type SocialContact, type SocialLink, type StatItem, TextInput, type TextInputProps, ThreeDActionButton, type ThreeDActionButtonProps, ThreeDButton, type ThreeDButtonProps, UniversalCardPage, type UniversalCardPageProps, UniversalErrorView, type UniversalErrorViewProps, UniversalHomeView, type UniversalHomeViewProps, UniversalOrganizationPage, type UniversalOrganizationPageProps, UniversalProfilePage, type UniversalProfilePageProps, UniversalProfileSettings, type UniversalProfileSettingsProps, UniversalSecurityPage, type UniversalSecurityPageProps, UniversalSidebar, type UniversalSidebarProps, type UniversalTransaction, UniversalTransactionPage, type UniversalTransactionPageProps, type UniversalWallet, UniversalWalletPage, type UniversalWalletPageProps, WaitlistDialog, type WaitlistDialogProps };
807
+ type VerificationStatus = 'APPROVED' | 'PENDING' | 'REJECTED' | 'ACTION_REQUIRED';
808
+ interface UniversalVerificationPageProps {
809
+ emailStatus: VerificationStatus;
810
+ phoneStatus: VerificationStatus;
811
+ identityStatus: VerificationStatus;
812
+ bannerMessage?: string | null;
813
+ bannerType?: 'info' | 'warning' | 'error' | 'success';
814
+ onBack: () => void;
815
+ onTriggerVerification: (type: 'EMAIL' | 'PHONE' | 'IDENTITY') => void;
816
+ activeLoadingType: 'EMAIL' | 'PHONE' | 'IDENTITY' | null;
817
+ }
818
+ declare const UniversalVerificationPage: React.FC<UniversalVerificationPageProps>;
819
+
820
+ 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 };
package/dist/index.js CHANGED
@@ -67,6 +67,7 @@ __export(index_exports, {
67
67
  UniversalSecurityPage: () => UniversalSecurityPage,
68
68
  UniversalSidebar: () => UniversalSidebar,
69
69
  UniversalTransactionPage: () => UniversalTransactionPage,
70
+ UniversalVerificationPage: () => UniversalVerificationPage,
70
71
  UniversalWalletPage: () => UniversalWalletPage,
71
72
  WaitlistDialog: () => WaitlistDialog
72
73
  });
@@ -1205,7 +1206,7 @@ var UniversalErrorView = ({
1205
1206
  returnLabel = "Return to Workspace"
1206
1207
  }) => {
1207
1208
  if (isBooting || isLoading && !activeData) {
1208
- return /* @__PURE__ */ import_react21.default.createElement("div", { className: "flex items-center justify-center h-screen w-full bg-white" }, /* @__PURE__ */ import_react21.default.createElement(PageSpinner, null));
1209
+ return /* @__PURE__ */ import_react21.default.createElement("div", { className: "flex items-center justify-center h-screen w-full" }, /* @__PURE__ */ import_react21.default.createElement(PageSpinner, null));
1209
1210
  }
1210
1211
  if (!isLoading && (!activeData || activeError)) {
1211
1212
  const errorString = typeof activeError === "string" ? activeError : JSON.stringify(activeError || "");
@@ -2142,20 +2143,20 @@ var UniversalCardPage = ({
2142
2143
  },
2143
2144
  className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : canFlip ? "cursor-pointer" : "cursor-default"}`,
2144
2145
  style: {
2145
- height: 185,
2146
+ height: 175,
2146
2147
  transformStyle: "preserve-3d",
2147
2148
  transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
2148
2149
  }
2149
2150
  },
2150
2151
  !isBgLoaded && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ import_react35.default.createElement(import_react36.HugeiconsIcon, { icon: import_core_free_icons13.Loading03Icon, size: 28, className: "animate-spin text-black" })),
2151
- !isActivated && isBgLoaded && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 z-40 w-full h-full rounded-2xl backdrop-blur-sm bg-white/20 flex flex-col items-center justify-center border border-white/30", style: { transform: "translateZ(1px)" } }, isUnactivated && /* @__PURE__ */ import_react35.default.createElement(
2152
+ !isActivated && isBgLoaded && /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute inset-0 z-40 w-full h-full rounded-2xl backdrop-blur-[2px] flex flex-col items-center justify-center ", style: { transform: "translateZ(1px)" } }, isUnactivated && /* @__PURE__ */ import_react35.default.createElement(
2152
2153
  "button",
2153
2154
  {
2154
2155
  onClick: (e) => {
2155
2156
  e.stopPropagation();
2156
2157
  handleOverlayActionClick("ACTIVATE");
2157
2158
  },
2158
- className: "px-6 py-2.5 bg-white/35 text-white text-[12px] rounded-full transition-all outline-none active:scale-95"
2159
+ className: "px-6 py-2 bg-white/25 text-white text-[11px] rounded-full transition-all outline-none active:scale-95"
2159
2160
  },
2160
2161
  "Activate Card"
2161
2162
  ), isDead && /* @__PURE__ */ import_react35.default.createElement(
@@ -2165,7 +2166,7 @@ var UniversalCardPage = ({
2165
2166
  e.stopPropagation();
2166
2167
  handleOverlayActionClick("CREATE");
2167
2168
  },
2168
- className: "px-6 py-2.5 bg-white/35 text-white text-[12px] rounded-full transition-all outline-none active:scale-95"
2169
+ className: "px-6 py-2 bg-white/25 text-white text-[11px] rounded-full transition-all outline-none active:scale-95"
2169
2170
  },
2170
2171
  "Create Card"
2171
2172
  ), isFrozen && /* @__PURE__ */ import_react35.default.createElement(
@@ -2193,14 +2194,7 @@ var UniversalCardPage = ({
2193
2194
  style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
2194
2195
  }
2195
2196
  ),
2196
- activeCard.backgroundOverlay && /* @__PURE__ */ import_react35.default.createElement(
2197
- "div",
2198
- {
2199
- className: "absolute inset-0 bg-cover bg-center pointer-events-none",
2200
- style: { backgroundImage: `url(${activeCard.backgroundOverlay})` }
2201
- }
2202
- ),
2203
- /* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ import_react35.default.createElement("div", null, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[12px] text-white/70 " }, "Prepaid Card")), activeCard.companyLogoSrc && /* @__PURE__ */ import_react35.default.createElement("img", { src: activeCard.companyLogoSrc, alt: "Company Logo", className: "h-10 w-auto max-w-30 object-contain opacity-90" })), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[10px] text-white/60 tracking-widest " }, "Card Number"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[14px] text-white tracking-widest font-light" }, displayCardNumber)), activeCard.networkLogoSrc && /* @__PURE__ */ import_react35.default.createElement("img", { src: activeCard.networkLogoSrc, alt: "Network Logo", className: "h-10 w-auto max-w-20 object-contain opacity-90" })))
2197
+ /* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex items-start w-full gap-4" }, activeCard.companyLogoSrc && /* @__PURE__ */ import_react35.default.createElement("img", { src: activeCard.companyLogoSrc, alt: "Company Logo", className: "h-10 w-auto max-w-30 object-contain opacity-90" })), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Card Number"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[12px] text-white tracking-widest font-light" }, displayCardNumber)), activeCard.networkLogoSrc && /* @__PURE__ */ import_react35.default.createElement("img", { src: activeCard.networkLogoSrc, alt: "Network Logo", className: "h-10 w-auto max-w-20 object-contain opacity-90" })))
2204
2198
  ),
2205
2199
  /* @__PURE__ */ import_react35.default.createElement(
2206
2200
  "div",
@@ -2218,15 +2212,8 @@ var UniversalCardPage = ({
2218
2212
  style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
2219
2213
  }
2220
2214
  ),
2221
- activeCard.backgroundOverlay && /* @__PURE__ */ import_react35.default.createElement(
2222
- "div",
2223
- {
2224
- className: "absolute inset-0 bg-cover bg-center pointer-events-none",
2225
- style: { backgroundImage: `url(${activeCard.backgroundOverlay})` }
2226
- }
2227
- ),
2228
2215
  /* @__PURE__ */ import_react35.default.createElement("div", { className: "absolute top-6 left-0 right-0 h-10 bg-black/80 w-full" }),
2229
- /* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90", style: { fontFamily: "'Whisper', cursive" } }, activeCard.cardHolderName)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Expiry"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "CVV"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[14px] text-white font-light" }, displayCvv))))
2216
+ /* @__PURE__ */ import_react35.default.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90", style: { fontFamily: "'Whisper', cursive" } }, activeCard.cardHolderName)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Expiry"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[12px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ import_react35.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "CVV"), /* @__PURE__ */ import_react35.default.createElement("span", { className: "text-[12px] text-white font-light" }, displayCvv))))
2230
2217
  )
2231
2218
  )), /* @__PURE__ */ import_react35.default.createElement("p", { className: "w-full text-center text-xs text-neutral-400 mb-6 mt-1" }, isActivated ? "Tap to flip card" : "Action Required"), /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ import_react35.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react35.default.createElement(
2232
2219
  MenuRow,
@@ -2992,14 +2979,14 @@ var UniversalSecurityPage = ({
2992
2979
  "button",
2993
2980
  {
2994
2981
  onClick: onBack,
2995
- className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none"
2982
+ className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none"
2996
2983
  },
2997
2984
  /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.ArrowLeft01Icon, size: 16 }),
2998
2985
  " Back"
2999
2986
  )), /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react45.default.createElement(
3000
2987
  MenuRow3,
3001
2988
  {
3002
- icon: import_core_free_icons16.Shield02Icon,
2989
+ icon: import_core_free_icons16.CircleLockCheck02Icon,
3003
2990
  title: "Authenticator App",
3004
2991
  subtitle: "Secure your account with 2FA",
3005
2992
  onClick: handleToggle2FA,
@@ -3063,7 +3050,7 @@ var UniversalSecurityPage = ({
3063
3050
  {
3064
3051
  type: "button",
3065
3052
  onClick: () => handleCopySecret(twoFaSecret),
3066
- className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs font-medium tracking-wide transition-colors mt-2"
3053
+ className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors mt-2"
3067
3054
  },
3068
3055
  /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.Copy01Icon, size: 16, className: "mr-2" }),
3069
3056
  "Copy Secret Key"
@@ -3126,8 +3113,8 @@ var MenuRow3 = ({
3126
3113
  onClick: disabled ? void 0 : onClick,
3127
3114
  className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-neutral-50"}`
3128
3115
  },
3129
- /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-10 h-10 rounded-full bg-neutral-50 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon, size: 18, className: iconColor })),
3130
- /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react45.default.createElement("p", { className: `text-[14px] font-medium truncate ${titleColor}` }, title), /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, subtitle)),
3116
+ /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon, size: 16, className: iconColor })),
3117
+ /* @__PURE__ */ import_react45.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react45.default.createElement("p", { className: `text-[14px] truncate ${titleColor}` }, title), /* @__PURE__ */ import_react45.default.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, subtitle)),
3131
3118
  isToggle ? /* @__PURE__ */ import_react45.default.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-neutral-200"} ${disabled ? "opacity-50" : ""}` }, /* @__PURE__ */ import_react45.default.createElement("div", { className: `absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 flex items-center justify-center ${toggleState ? "translate-x-5" : "translate-x-0"}` }, toggleLoading && /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.Loading03Icon, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.ArrowRight01Icon, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
3132
3119
  );
3133
3120
 
@@ -3950,6 +3937,120 @@ var ManagedProjectsBlock = ({
3950
3937
  return /* @__PURE__ */ import_react68.default.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ import_react68.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react68.default.createElement(import_link9.default, { href: project.link, className: "block outline-none" }, projectContent));
3951
3938
  }))));
3952
3939
  };
3940
+
3941
+ // src/components/UniversalVerificationPage.tsx
3942
+ var import_react69 = __toESM(require("react"));
3943
+ var import_react70 = require("@hugeicons/react");
3944
+ var import_core_free_icons23 = require("@hugeicons/core-free-icons");
3945
+ var Banner2 = ({ message, type = "info" }) => {
3946
+ const styles = {
3947
+ info: { bg: "bg-blue-50", text: "text-blue-700", icon: import_core_free_icons23.InformationCircleIcon },
3948
+ warning: { bg: "bg-orange-50", text: "text-orange-700", icon: import_core_free_icons23.InformationCircleIcon },
3949
+ error: { bg: "bg-red-50", text: "text-red-700", icon: import_core_free_icons23.Cancel01Icon },
3950
+ success: { bg: "bg-green-50", text: "text-green-700", icon: import_core_free_icons23.NewReleasesIcon }
3951
+ };
3952
+ const activeStyle = styles[type];
3953
+ return /* @__PURE__ */ import_react69.default.createElement("div", { className: `w-full p-4 mb-6 rounded-xl ${activeStyle.bg} flex items-start gap-3` }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: activeStyle.icon, size: 18, className: `${activeStyle.text} shrink-0 mt-0.5` }), /* @__PURE__ */ import_react69.default.createElement("p", { className: `text-[13px] leading-relaxed ${activeStyle.text}` }, message));
3954
+ };
3955
+ var VerificationRow = ({
3956
+ icon,
3957
+ title,
3958
+ status,
3959
+ onClick,
3960
+ isLoading = false,
3961
+ isLast = false
3962
+ }) => {
3963
+ let statusText = "";
3964
+ let statusColor = "";
3965
+ let StatusIcon = null;
3966
+ let iconColor = "";
3967
+ switch (status) {
3968
+ case "APPROVED":
3969
+ statusText = "Completed";
3970
+ statusColor = "text-green-600";
3971
+ StatusIcon = import_core_free_icons23.NewReleasesIcon;
3972
+ iconColor = "text-green-500";
3973
+ break;
3974
+ case "PENDING":
3975
+ statusText = "Awaiting Approval";
3976
+ statusColor = "text-orange-500";
3977
+ StatusIcon = import_core_free_icons23.Time02Icon;
3978
+ iconColor = "text-orange-500";
3979
+ break;
3980
+ case "REJECTED":
3981
+ statusText = "Action required to fix issue";
3982
+ statusColor = "text-red-500";
3983
+ StatusIcon = import_core_free_icons23.InformationCircleIcon;
3984
+ iconColor = "text-red-500";
3985
+ break;
3986
+ case "ACTION_REQUIRED":
3987
+ default:
3988
+ statusText = "Start verification";
3989
+ statusColor = "text-neutral-500";
3990
+ StatusIcon = import_core_free_icons23.InformationCircleIcon;
3991
+ iconColor = "text-neutral-400";
3992
+ break;
3993
+ }
3994
+ const isDisabled = status === "APPROVED" || isLoading;
3995
+ return /* @__PURE__ */ import_react69.default.createElement(
3996
+ "div",
3997
+ {
3998
+ onClick: isDisabled ? void 0 : onClick,
3999
+ className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-neutral-50"}`
4000
+ },
4001
+ /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 bg-white flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon, size: 16, className: "text-black" })),
4002
+ /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[14px] truncate text-black" }, title), /* @__PURE__ */ import_react69.default.createElement("p", { className: `text-[12px] truncate ${statusColor} mt-0.5` }, statusText)),
4003
+ /* @__PURE__ */ import_react69.default.createElement("div", { className: "shrink-0 ml-2" }, isLoading ? /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.Loading03Icon, size: 20, className: "animate-spin text-black" }) : /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: StatusIcon, size: 20, className: iconColor }))
4004
+ );
4005
+ };
4006
+ var UniversalVerificationPage = ({
4007
+ emailStatus,
4008
+ phoneStatus,
4009
+ identityStatus,
4010
+ bannerMessage,
4011
+ bannerType = "info",
4012
+ onBack,
4013
+ onTriggerVerification,
4014
+ activeLoadingType
4015
+ }) => {
4016
+ return /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "mb-6 flex items-center px-1" }, /* @__PURE__ */ import_react69.default.createElement(
4017
+ "button",
4018
+ {
4019
+ onClick: onBack,
4020
+ className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none"
4021
+ },
4022
+ /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.ArrowLeft01Icon, size: 16 }),
4023
+ " Back"
4024
+ )), bannerMessage && /* @__PURE__ */ import_react69.default.createElement(Banner2, { message: bannerMessage, type: bannerType }), /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full flex flex-col gap-4 mb-8" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ import_react69.default.createElement(
4025
+ VerificationRow,
4026
+ {
4027
+ icon: import_core_free_icons23.Mail01Icon,
4028
+ title: "Email Verification",
4029
+ status: emailStatus,
4030
+ isLoading: activeLoadingType === "EMAIL",
4031
+ onClick: () => onTriggerVerification("EMAIL")
4032
+ }
4033
+ ), /* @__PURE__ */ import_react69.default.createElement(
4034
+ VerificationRow,
4035
+ {
4036
+ icon: import_core_free_icons23.SmartPhone01Icon,
4037
+ title: "Phone Verification",
4038
+ status: phoneStatus,
4039
+ isLoading: activeLoadingType === "PHONE",
4040
+ onClick: () => onTriggerVerification("PHONE")
4041
+ }
4042
+ ), /* @__PURE__ */ import_react69.default.createElement(
4043
+ VerificationRow,
4044
+ {
4045
+ icon: import_core_free_icons23.UserIcon,
4046
+ title: "Identity Verification",
4047
+ status: identityStatus,
4048
+ isLoading: activeLoadingType === "IDENTITY",
4049
+ onClick: () => onTriggerVerification("IDENTITY"),
4050
+ isLast: true
4051
+ }
4052
+ ))));
4053
+ };
3953
4054
  // Annotate the CommonJS export names for ESM import in node:
3954
4055
  0 && (module.exports = {
3955
4056
  AppBento2,
@@ -3988,6 +4089,7 @@ var ManagedProjectsBlock = ({
3988
4089
  UniversalSecurityPage,
3989
4090
  UniversalSidebar,
3990
4091
  UniversalTransactionPage,
4092
+ UniversalVerificationPage,
3991
4093
  UniversalWalletPage,
3992
4094
  WaitlistDialog
3993
4095
  });
package/dist/index.mjs CHANGED
@@ -1147,7 +1147,7 @@ var UniversalErrorView = ({
1147
1147
  returnLabel = "Return to Workspace"
1148
1148
  }) => {
1149
1149
  if (isBooting || isLoading && !activeData) {
1150
- return /* @__PURE__ */ React14.createElement("div", { className: "flex items-center justify-center h-screen w-full bg-white" }, /* @__PURE__ */ React14.createElement(PageSpinner, null));
1150
+ return /* @__PURE__ */ React14.createElement("div", { className: "flex items-center justify-center h-screen w-full" }, /* @__PURE__ */ React14.createElement(PageSpinner, null));
1151
1151
  }
1152
1152
  if (!isLoading && (!activeData || activeError)) {
1153
1153
  const errorString = typeof activeError === "string" ? activeError : JSON.stringify(activeError || "");
@@ -2120,20 +2120,20 @@ var UniversalCardPage = ({
2120
2120
  },
2121
2121
  className: `relative w-full max-w-85 transition-transform duration-700 ${!isBgLoaded ? "cursor-wait" : canFlip ? "cursor-pointer" : "cursor-default"}`,
2122
2122
  style: {
2123
- height: 185,
2123
+ height: 175,
2124
2124
  transformStyle: "preserve-3d",
2125
2125
  transform: isFlipped ? "rotateY(180deg)" : "rotateY(0deg)"
2126
2126
  }
2127
2127
  },
2128
2128
  !isBgLoaded && /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 w-full h-full bg-white rounded-2xl flex items-center justify-center z-50 " }, /* @__PURE__ */ React21.createElement(HugeiconsIcon15, { icon: Loading03Icon9, size: 28, className: "animate-spin text-black" })),
2129
- !isActivated && isBgLoaded && /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 z-40 w-full h-full rounded-2xl backdrop-blur-sm bg-white/20 flex flex-col items-center justify-center border border-white/30", style: { transform: "translateZ(1px)" } }, isUnactivated && /* @__PURE__ */ React21.createElement(
2129
+ !isActivated && isBgLoaded && /* @__PURE__ */ React21.createElement("div", { className: "absolute inset-0 z-40 w-full h-full rounded-2xl backdrop-blur-[2px] flex flex-col items-center justify-center ", style: { transform: "translateZ(1px)" } }, isUnactivated && /* @__PURE__ */ React21.createElement(
2130
2130
  "button",
2131
2131
  {
2132
2132
  onClick: (e) => {
2133
2133
  e.stopPropagation();
2134
2134
  handleOverlayActionClick("ACTIVATE");
2135
2135
  },
2136
- className: "px-6 py-2.5 bg-white/35 text-white text-[12px] rounded-full transition-all outline-none active:scale-95"
2136
+ className: "px-6 py-2 bg-white/25 text-white text-[11px] rounded-full transition-all outline-none active:scale-95"
2137
2137
  },
2138
2138
  "Activate Card"
2139
2139
  ), isDead && /* @__PURE__ */ React21.createElement(
@@ -2143,7 +2143,7 @@ var UniversalCardPage = ({
2143
2143
  e.stopPropagation();
2144
2144
  handleOverlayActionClick("CREATE");
2145
2145
  },
2146
- className: "px-6 py-2.5 bg-white/35 text-white text-[12px] rounded-full transition-all outline-none active:scale-95"
2146
+ className: "px-6 py-2 bg-white/25 text-white text-[11px] rounded-full transition-all outline-none active:scale-95"
2147
2147
  },
2148
2148
  "Create Card"
2149
2149
  ), isFrozen && /* @__PURE__ */ React21.createElement(
@@ -2171,14 +2171,7 @@ var UniversalCardPage = ({
2171
2171
  style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
2172
2172
  }
2173
2173
  ),
2174
- activeCard.backgroundOverlay && /* @__PURE__ */ React21.createElement(
2175
- "div",
2176
- {
2177
- className: "absolute inset-0 bg-cover bg-center pointer-events-none",
2178
- style: { backgroundImage: `url(${activeCard.backgroundOverlay})` }
2179
- }
2180
- ),
2181
- /* @__PURE__ */ React21.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ React21.createElement("div", { className: "flex justify-between items-start w-full" }, /* @__PURE__ */ React21.createElement("div", null, /* @__PURE__ */ React21.createElement("span", { className: "text-[12px] text-white/70 " }, "Prepaid Card")), activeCard.companyLogoSrc && /* @__PURE__ */ React21.createElement("img", { src: activeCard.companyLogoSrc, alt: "Company Logo", className: "h-10 w-auto max-w-30 object-contain opacity-90" })), /* @__PURE__ */ React21.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React21.createElement("span", { className: "text-[10px] text-white/60 tracking-widest " }, "Card Number"), /* @__PURE__ */ React21.createElement("span", { className: "text-[14px] text-white tracking-widest font-light" }, displayCardNumber)), activeCard.networkLogoSrc && /* @__PURE__ */ React21.createElement("img", { src: activeCard.networkLogoSrc, alt: "Network Logo", className: "h-10 w-auto max-w-20 object-contain opacity-90" })))
2174
+ /* @__PURE__ */ React21.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-between" }, /* @__PURE__ */ React21.createElement("div", { className: "flex items-start w-full gap-4" }, activeCard.companyLogoSrc && /* @__PURE__ */ React21.createElement("img", { src: activeCard.companyLogoSrc, alt: "Company Logo", className: "h-10 w-auto max-w-30 object-contain opacity-90" })), /* @__PURE__ */ React21.createElement("div", { className: "flex justify-between items-end w-full" }, /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React21.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Card Number"), /* @__PURE__ */ React21.createElement("span", { className: "text-[12px] text-white tracking-widest font-light" }, displayCardNumber)), activeCard.networkLogoSrc && /* @__PURE__ */ React21.createElement("img", { src: activeCard.networkLogoSrc, alt: "Network Logo", className: "h-10 w-auto max-w-20 object-contain opacity-90" })))
2182
2175
  ),
2183
2176
  /* @__PURE__ */ React21.createElement(
2184
2177
  "div",
@@ -2196,15 +2189,8 @@ var UniversalCardPage = ({
2196
2189
  style: { backgroundImage: `url(${activeCard.cardBgSrc}), linear-gradient(to bottom right, #111, #333)` }
2197
2190
  }
2198
2191
  ),
2199
- activeCard.backgroundOverlay && /* @__PURE__ */ React21.createElement(
2200
- "div",
2201
- {
2202
- className: "absolute inset-0 bg-cover bg-center pointer-events-none",
2203
- style: { backgroundImage: `url(${activeCard.backgroundOverlay})` }
2204
- }
2205
- ),
2206
2192
  /* @__PURE__ */ React21.createElement("div", { className: "absolute top-6 left-0 right-0 h-10 bg-black/80 w-full" }),
2207
- /* @__PURE__ */ React21.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ React21.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ React21.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90", style: { fontFamily: "'Whisper', cursive" } }, activeCard.cardHolderName)), /* @__PURE__ */ React21.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React21.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Expiry"), /* @__PURE__ */ React21.createElement("span", { className: "text-[14px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React21.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "CVV"), /* @__PURE__ */ React21.createElement("span", { className: "text-[14px] text-white font-light" }, displayCvv))))
2193
+ /* @__PURE__ */ React21.createElement("div", { className: "relative z-10 w-full h-full p-5 flex flex-col justify-end" }, /* @__PURE__ */ React21.createElement("div", { className: "w-full text-center mb-6" }, /* @__PURE__ */ React21.createElement("span", { className: "text-white text-3xl italic tracking-wide opacity-90", style: { fontFamily: "'Whisper', cursive" } }, activeCard.cardHolderName)), /* @__PURE__ */ React21.createElement("div", { className: "flex justify-between w-full max-w-[80%]" }, /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React21.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "Expiry"), /* @__PURE__ */ React21.createElement("span", { className: "text-[12px] text-white font-light" }, displayExpiry)), /* @__PURE__ */ React21.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ React21.createElement("span", { className: "text-[9px] text-white/60 tracking-widest " }, "CVV"), /* @__PURE__ */ React21.createElement("span", { className: "text-[12px] text-white font-light" }, displayCvv))))
2208
2194
  )
2209
2195
  )), /* @__PURE__ */ React21.createElement("p", { className: "w-full text-center text-xs text-neutral-400 mb-6 mt-1" }, isActivated ? "Tap to flip card" : "Action Required"), /* @__PURE__ */ React21.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ React21.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ React21.createElement(
2210
2196
  MenuRow,
@@ -2819,7 +2805,7 @@ import {
2819
2805
  Loading03Icon as Loading03Icon11,
2820
2806
  Copy01Icon as Copy01Icon3,
2821
2807
  ArrowLeft01Icon as ArrowLeft01Icon6,
2822
- Shield02Icon,
2808
+ CircleLockCheck02Icon,
2823
2809
  Key01Icon,
2824
2810
  ArrowRight01Icon as ArrowRight01Icon5
2825
2811
  } from "@hugeicons/core-free-icons";
@@ -2992,14 +2978,14 @@ var UniversalSecurityPage = ({
2992
2978
  "button",
2993
2979
  {
2994
2980
  onClick: onBack,
2995
- className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] font-medium outline-none"
2981
+ className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none"
2996
2982
  },
2997
2983
  /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: ArrowLeft01Icon6, size: 16 }),
2998
2984
  " Back"
2999
2985
  )), /* @__PURE__ */ React27.createElement("div", { className: "w-full flex flex-col gap-4" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ React27.createElement(
3000
2986
  MenuRow3,
3001
2987
  {
3002
- icon: Shield02Icon,
2988
+ icon: CircleLockCheck02Icon,
3003
2989
  title: "Authenticator App",
3004
2990
  subtitle: "Secure your account with 2FA",
3005
2991
  onClick: handleToggle2FA,
@@ -3063,7 +3049,7 @@ var UniversalSecurityPage = ({
3063
3049
  {
3064
3050
  type: "button",
3065
3051
  onClick: () => handleCopySecret(twoFaSecret),
3066
- className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs font-medium tracking-wide transition-colors mt-2"
3052
+ className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 outline-none text-xs tracking-wide transition-colors mt-2"
3067
3053
  },
3068
3054
  /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: Copy01Icon3, size: 16, className: "mr-2" }),
3069
3055
  "Copy Secret Key"
@@ -3126,8 +3112,8 @@ var MenuRow3 = ({
3126
3112
  onClick: disabled ? void 0 : onClick,
3127
3113
  className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-neutral-50"}`
3128
3114
  },
3129
- /* @__PURE__ */ React27.createElement("div", { className: "w-10 h-10 rounded-full bg-neutral-50 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon, size: 18, className: iconColor })),
3130
- /* @__PURE__ */ React27.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React27.createElement("p", { className: `text-[14px] font-medium truncate ${titleColor}` }, title), /* @__PURE__ */ React27.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, subtitle)),
3115
+ /* @__PURE__ */ React27.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon, size: 16, className: iconColor })),
3116
+ /* @__PURE__ */ React27.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React27.createElement("p", { className: `text-[14px] truncate ${titleColor}` }, title), /* @__PURE__ */ React27.createElement("p", { className: "text-[12px] text-neutral-500 truncate" }, subtitle)),
3131
3117
  isToggle ? /* @__PURE__ */ React27.createElement("div", { className: `relative w-11 h-6 rounded-full transition-colors duration-300 ml-2 shrink-0 ${toggleState ? "bg-black" : "bg-neutral-200"} ${disabled ? "opacity-50" : ""}` }, /* @__PURE__ */ React27.createElement("div", { className: `absolute top-1 left-1 w-4 h-4 rounded-full bg-white shadow-sm transition-transform duration-300 flex items-center justify-center ${toggleState ? "translate-x-5" : "translate-x-0"}` }, toggleLoading && /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: Loading03Icon11, size: 10, className: "animate-spin text-black" }))) : /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: ArrowRight01Icon5, size: 18, className: "text-neutral-400 shrink-0 ml-2" })
3132
3118
  );
3133
3119
 
@@ -3950,6 +3936,130 @@ var ManagedProjectsBlock = ({
3950
3936
  return /* @__PURE__ */ React41.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ React41.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ React41.createElement(Link9, { href: project.link, className: "block outline-none" }, projectContent));
3951
3937
  }))));
3952
3938
  };
3939
+
3940
+ // src/components/UniversalVerificationPage.tsx
3941
+ import React42 from "react";
3942
+ import { HugeiconsIcon as HugeiconsIcon28 } from "@hugeicons/react";
3943
+ import {
3944
+ ArrowLeft01Icon as ArrowLeft01Icon8,
3945
+ Mail01Icon,
3946
+ SmartPhone01Icon,
3947
+ UserIcon as UserIcon3,
3948
+ NewReleasesIcon,
3949
+ Cancel01Icon as Cancel01Icon2,
3950
+ Time02Icon,
3951
+ InformationCircleIcon as InformationCircleIcon2,
3952
+ Loading03Icon as Loading03Icon16
3953
+ } from "@hugeicons/core-free-icons";
3954
+ var Banner2 = ({ message, type = "info" }) => {
3955
+ const styles = {
3956
+ info: { bg: "bg-blue-50", text: "text-blue-700", icon: InformationCircleIcon2 },
3957
+ warning: { bg: "bg-orange-50", text: "text-orange-700", icon: InformationCircleIcon2 },
3958
+ error: { bg: "bg-red-50", text: "text-red-700", icon: Cancel01Icon2 },
3959
+ success: { bg: "bg-green-50", text: "text-green-700", icon: NewReleasesIcon }
3960
+ };
3961
+ const activeStyle = styles[type];
3962
+ return /* @__PURE__ */ React42.createElement("div", { className: `w-full p-4 mb-6 rounded-xl ${activeStyle.bg} flex items-start gap-3` }, /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: activeStyle.icon, size: 18, className: `${activeStyle.text} shrink-0 mt-0.5` }), /* @__PURE__ */ React42.createElement("p", { className: `text-[13px] leading-relaxed ${activeStyle.text}` }, message));
3963
+ };
3964
+ var VerificationRow = ({
3965
+ icon,
3966
+ title,
3967
+ status,
3968
+ onClick,
3969
+ isLoading = false,
3970
+ isLast = false
3971
+ }) => {
3972
+ let statusText = "";
3973
+ let statusColor = "";
3974
+ let StatusIcon = null;
3975
+ let iconColor = "";
3976
+ switch (status) {
3977
+ case "APPROVED":
3978
+ statusText = "Completed";
3979
+ statusColor = "text-green-600";
3980
+ StatusIcon = NewReleasesIcon;
3981
+ iconColor = "text-green-500";
3982
+ break;
3983
+ case "PENDING":
3984
+ statusText = "Awaiting Approval";
3985
+ statusColor = "text-orange-500";
3986
+ StatusIcon = Time02Icon;
3987
+ iconColor = "text-orange-500";
3988
+ break;
3989
+ case "REJECTED":
3990
+ statusText = "Action required to fix issue";
3991
+ statusColor = "text-red-500";
3992
+ StatusIcon = InformationCircleIcon2;
3993
+ iconColor = "text-red-500";
3994
+ break;
3995
+ case "ACTION_REQUIRED":
3996
+ default:
3997
+ statusText = "Start verification";
3998
+ statusColor = "text-neutral-500";
3999
+ StatusIcon = InformationCircleIcon2;
4000
+ iconColor = "text-neutral-400";
4001
+ break;
4002
+ }
4003
+ const isDisabled = status === "APPROVED" || isLoading;
4004
+ return /* @__PURE__ */ React42.createElement(
4005
+ "div",
4006
+ {
4007
+ onClick: isDisabled ? void 0 : onClick,
4008
+ className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${isDisabled ? "opacity-70 cursor-default" : "cursor-pointer hover:bg-neutral-50"}`
4009
+ },
4010
+ /* @__PURE__ */ React42.createElement("div", { className: "w-9 h-9 rounded-full border border-neutral-200 bg-white flex items-center justify-center shrink-0 mr-4" }, /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon, size: 16, className: "text-black" })),
4011
+ /* @__PURE__ */ React42.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React42.createElement("p", { className: "text-[14px] truncate text-black" }, title), /* @__PURE__ */ React42.createElement("p", { className: `text-[12px] truncate ${statusColor} mt-0.5` }, statusText)),
4012
+ /* @__PURE__ */ React42.createElement("div", { className: "shrink-0 ml-2" }, isLoading ? /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: Loading03Icon16, size: 20, className: "animate-spin text-black" }) : /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: StatusIcon, size: 20, className: iconColor }))
4013
+ );
4014
+ };
4015
+ var UniversalVerificationPage = ({
4016
+ emailStatus,
4017
+ phoneStatus,
4018
+ identityStatus,
4019
+ bannerMessage,
4020
+ bannerType = "info",
4021
+ onBack,
4022
+ onTriggerVerification,
4023
+ activeLoadingType
4024
+ }) => {
4025
+ return /* @__PURE__ */ React42.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 pb-12" }, /* @__PURE__ */ React42.createElement("div", { className: "mb-6 flex items-center px-1" }, /* @__PURE__ */ React42.createElement(
4026
+ "button",
4027
+ {
4028
+ onClick: onBack,
4029
+ className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none"
4030
+ },
4031
+ /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: ArrowLeft01Icon8, size: 16 }),
4032
+ " Back"
4033
+ )), bannerMessage && /* @__PURE__ */ React42.createElement(Banner2, { message: bannerMessage, type: bannerType }), /* @__PURE__ */ React42.createElement("div", { className: "w-full flex flex-col gap-4 mb-8" }, /* @__PURE__ */ React42.createElement("div", { className: "w-full bg-white rounded-2xl overflow-hidden" }, /* @__PURE__ */ React42.createElement(
4034
+ VerificationRow,
4035
+ {
4036
+ icon: Mail01Icon,
4037
+ title: "Email Verification",
4038
+ status: emailStatus,
4039
+ isLoading: activeLoadingType === "EMAIL",
4040
+ onClick: () => onTriggerVerification("EMAIL")
4041
+ }
4042
+ ), /* @__PURE__ */ React42.createElement(
4043
+ VerificationRow,
4044
+ {
4045
+ icon: SmartPhone01Icon,
4046
+ title: "Phone Verification",
4047
+ status: phoneStatus,
4048
+ isLoading: activeLoadingType === "PHONE",
4049
+ onClick: () => onTriggerVerification("PHONE")
4050
+ }
4051
+ ), /* @__PURE__ */ React42.createElement(
4052
+ VerificationRow,
4053
+ {
4054
+ icon: UserIcon3,
4055
+ title: "Identity Verification",
4056
+ status: identityStatus,
4057
+ isLoading: activeLoadingType === "IDENTITY",
4058
+ onClick: () => onTriggerVerification("IDENTITY"),
4059
+ isLast: true
4060
+ }
4061
+ ))));
4062
+ };
3953
4063
  export {
3954
4064
  AppBento2,
3955
4065
  ConsultantShowcase,
@@ -3987,6 +4097,7 @@ export {
3987
4097
  UniversalSecurityPage,
3988
4098
  UniversalSidebar,
3989
4099
  UniversalTransactionPage,
4100
+ UniversalVerificationPage,
3990
4101
  UniversalWalletPage,
3991
4102
  WaitlistDialog
3992
4103
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "12.0.50",
3
+ "version": "12.0.60",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",