@retinalabsllc/zairusjs 12.0.55 → 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
  });
@@ -2978,14 +2979,14 @@ var UniversalSecurityPage = ({
2978
2979
  "button",
2979
2980
  {
2980
2981
  onClick: onBack,
2981
- 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"
2982
2983
  },
2983
2984
  /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.ArrowLeft01Icon, size: 16 }),
2984
2985
  " Back"
2985
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(
2986
2987
  MenuRow3,
2987
2988
  {
2988
- icon: import_core_free_icons16.Shield02Icon,
2989
+ icon: import_core_free_icons16.CircleLockCheck02Icon,
2989
2990
  title: "Authenticator App",
2990
2991
  subtitle: "Secure your account with 2FA",
2991
2992
  onClick: handleToggle2FA,
@@ -3049,7 +3050,7 @@ var UniversalSecurityPage = ({
3049
3050
  {
3050
3051
  type: "button",
3051
3052
  onClick: () => handleCopySecret(twoFaSecret),
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 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"
3053
3054
  },
3054
3055
  /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: import_core_free_icons16.Copy01Icon, size: 16, className: "mr-2" }),
3055
3056
  "Copy Secret Key"
@@ -3112,8 +3113,8 @@ var MenuRow3 = ({
3112
3113
  onClick: disabled ? void 0 : onClick,
3113
3114
  className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-neutral-50"}`
3114
3115
  },
3115
- /* @__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 })),
3116
- /* @__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)),
3117
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" })
3118
3119
  );
3119
3120
 
@@ -3936,6 +3937,120 @@ var ManagedProjectsBlock = ({
3936
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));
3937
3938
  }))));
3938
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
+ };
3939
4054
  // Annotate the CommonJS export names for ESM import in node:
3940
4055
  0 && (module.exports = {
3941
4056
  AppBento2,
@@ -3974,6 +4089,7 @@ var ManagedProjectsBlock = ({
3974
4089
  UniversalSecurityPage,
3975
4090
  UniversalSidebar,
3976
4091
  UniversalTransactionPage,
4092
+ UniversalVerificationPage,
3977
4093
  UniversalWalletPage,
3978
4094
  WaitlistDialog
3979
4095
  });
package/dist/index.mjs CHANGED
@@ -2805,7 +2805,7 @@ import {
2805
2805
  Loading03Icon as Loading03Icon11,
2806
2806
  Copy01Icon as Copy01Icon3,
2807
2807
  ArrowLeft01Icon as ArrowLeft01Icon6,
2808
- Shield02Icon,
2808
+ CircleLockCheck02Icon,
2809
2809
  Key01Icon,
2810
2810
  ArrowRight01Icon as ArrowRight01Icon5
2811
2811
  } from "@hugeicons/core-free-icons";
@@ -2978,14 +2978,14 @@ var UniversalSecurityPage = ({
2978
2978
  "button",
2979
2979
  {
2980
2980
  onClick: onBack,
2981
- 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"
2982
2982
  },
2983
2983
  /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: ArrowLeft01Icon6, size: 16 }),
2984
2984
  " Back"
2985
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(
2986
2986
  MenuRow3,
2987
2987
  {
2988
- icon: Shield02Icon,
2988
+ icon: CircleLockCheck02Icon,
2989
2989
  title: "Authenticator App",
2990
2990
  subtitle: "Secure your account with 2FA",
2991
2991
  onClick: handleToggle2FA,
@@ -3049,7 +3049,7 @@ var UniversalSecurityPage = ({
3049
3049
  {
3050
3050
  type: "button",
3051
3051
  onClick: () => handleCopySecret(twoFaSecret),
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 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"
3053
3053
  },
3054
3054
  /* @__PURE__ */ React27.createElement(HugeiconsIcon19, { icon: Copy01Icon3, size: 16, className: "mr-2" }),
3055
3055
  "Copy Secret Key"
@@ -3112,8 +3112,8 @@ var MenuRow3 = ({
3112
3112
  onClick: disabled ? void 0 : onClick,
3113
3113
  className: `flex items-center p-4 transition-colors ${!isLast ? "" : ""} ${disabled ? "opacity-40 cursor-not-allowed" : "cursor-pointer hover:bg-neutral-50"}`
3114
3114
  },
3115
- /* @__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 })),
3116
- /* @__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)),
3117
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" })
3118
3118
  );
3119
3119
 
@@ -3936,6 +3936,130 @@ var ManagedProjectsBlock = ({
3936
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));
3937
3937
  }))));
3938
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
+ };
3939
4063
  export {
3940
4064
  AppBento2,
3941
4065
  ConsultantShowcase,
@@ -3973,6 +4097,7 @@ export {
3973
4097
  UniversalSecurityPage,
3974
4098
  UniversalSidebar,
3975
4099
  UniversalTransactionPage,
4100
+ UniversalVerificationPage,
3976
4101
  UniversalWalletPage,
3977
4102
  WaitlistDialog
3978
4103
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "12.0.55",
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",