@retinalabsllc/zairusjs 16.3.3 → 16.3.4

package/dist/index.js

@@ -2883,30 +2883,9 @@ var HeroSection = ({
 var import_react46 = __toESM(require("react"));
 var import_react47 = require("@hugeicons/react");
 var AppBento2 = ({ tagline, headline, features }) => {
-  const [isAnimating, setIsAnimating] = (0, import_react46.useState)(false);
-  const titleRef = (0, import_react46.useRef)(null);
-  (0, import_react46.useEffect)(() => {
-    const observer = new IntersectionObserver(
-      ([entry]) => {
-        if (entry.isIntersecting) {
-          if (entry.boundingClientRect.top > 0) {
-            setIsAnimating(true);
-          }
-        } else {
-          setIsAnimating(false);
-        }
-      },
-      { threshold: 0.1 }
-    );
-    if (titleRef.current) {
-      observer.observe(titleRef.current);
-    }
-    return () => observer.disconnect();
-  }, []);
   return /* @__PURE__ */ import_react46.default.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react46.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4 " }, tagline), /* @__PURE__ */ import_react46.default.createElement(
     "h2",
     {
-      ref: titleRef,
       className: "text-3xl tracking-tight text-black leading-[1.1]"
     },
     headline
@@ -2927,7 +2906,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
       "div",
       {
         key: i,
-        className: `relative rounded-4xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-300 group text-left ${getBgStyle()} ${f.size}`
+        className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-300 group text-left ${getBgStyle()}`
       },
       /* @__PURE__ */ import_react46.default.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBrand ? "text-white/10" : "text-black/5"}` }, /* @__PURE__ */ import_react46.default.createElement(import_react47.HugeiconsIcon, { icon: f.icon, size: 180 }))),
       /* @__PURE__ */ import_react46.default.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ import_react46.default.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ import_react46.default.createElement("span", { className: `text-[9px] tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ import_react46.default.createElement("div", { className: `p-2 rounded-full transition-colors ${isBrand ? "bg-white/20" : "bg-neutral-100"}` }, /* @__PURE__ */ import_react46.default.createElement(import_react47.HugeiconsIcon, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ import_react46.default.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ import_react46.default.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ import_react46.default.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))

package/dist/index.mjs

@@ -2873,33 +2873,12 @@ var HeroSection = ({
 };
 
 // src/components/AppBento2.tsx
-import React27, { useState as useState20, useEffect as useEffect11, useRef as useRef6 } from "react";
+import React27 from "react";
 import { HugeiconsIcon as HugeiconsIcon20 } from "@hugeicons/react";
 var AppBento2 = ({ tagline, headline, features }) => {
-  const [isAnimating, setIsAnimating] = useState20(false);
-  const titleRef = useRef6(null);
-  useEffect11(() => {
-    const observer = new IntersectionObserver(
-      ([entry]) => {
-        if (entry.isIntersecting) {
-          if (entry.boundingClientRect.top > 0) {
-            setIsAnimating(true);
-          }
-        } else {
-          setIsAnimating(false);
-        }
-      },
-      { threshold: 0.1 }
-    );
-    if (titleRef.current) {
-      observer.observe(titleRef.current);
-    }
-    return () => observer.disconnect();
-  }, []);
   return /* @__PURE__ */ React27.createElement("div", { className: "w-full py-16" }, /* @__PURE__ */ React27.createElement("div", { className: "w-full flex justify-center px-4" }, /* @__PURE__ */ React27.createElement("div", { className: "max-w-6xl w-full" }, /* @__PURE__ */ React27.createElement("div", { className: "relative overflow-hidden mb-12 text-left" }, /* @__PURE__ */ React27.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ React27.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 block mb-4 " }, tagline), /* @__PURE__ */ React27.createElement(
     "h2",
     {
-      ref: titleRef,
       className: "text-3xl tracking-tight text-black leading-[1.1]"
     },
     headline
@@ -2920,7 +2899,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
       "div",
       {
         key: i,
-        className: `relative rounded-4xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-300 group text-left ${getBgStyle()} ${f.size}`
+        className: `relative rounded-2xl overflow-hidden p-8 flex flex-col min-h-75 transition-all duration-300 group text-left ${getBgStyle()}`
       },
       /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 overflow-hidden pointer-events-none z-0" }, /* @__PURE__ */ React27.createElement("div", { className: `absolute -bottom-8 -right-8 transform group-hover:scale-110 transition-transform duration-700 ease-out ${isBrand ? "text-white/10" : "text-black/5"}` }, /* @__PURE__ */ React27.createElement(HugeiconsIcon20, { icon: f.icon, size: 180 }))),
       /* @__PURE__ */ React27.createElement("div", { className: "relative z-10 w-full h-full flex flex-col pointer-events-auto" }, /* @__PURE__ */ React27.createElement("div", { className: "flex items-center justify-between mb-8" }, /* @__PURE__ */ React27.createElement("span", { className: `text-[9px] tracking-widest ${labelColor}` }, f.label), /* @__PURE__ */ React27.createElement("div", { className: `p-2 rounded-full transition-colors ${isBrand ? "bg-white/20" : "bg-neutral-100"}` }, /* @__PURE__ */ React27.createElement(HugeiconsIcon20, { icon: f.icon, size: 20, className: textColor }))), /* @__PURE__ */ React27.createElement("div", { className: "mt-auto" }, /* @__PURE__ */ React27.createElement("h3", { className: `text-xl mb-2 tracking-tight ${textColor}` }, f.title), /* @__PURE__ */ React27.createElement("p", { className: `text-[13px] leading-relaxed max-w-sm ${subTextColor}` }, f.desc)))
@@ -2929,7 +2908,7 @@ var AppBento2 = ({ tagline, headline, features }) => {
 };
 
 // src/components/UniversalSecurityPage.tsx
-import React28, { useState as useState21 } from "react";
+import React28, { useState as useState20 } from "react";
 import toast8 from "react-hot-toast";
 import { HugeiconsIcon as HugeiconsIcon21 } from "@hugeicons/react";
 import {
@@ -2952,13 +2931,13 @@ var UniversalSecurityPage = ({
   onVerifyAndEnablePasskey,
   onDisablePasskey
 }) => {
-  const [showPasskeyModal, setShowPasskeyModal] = useState21(false);
-  const [isSubmitting, setIsSubmitting] = useState21(false);
-  const [isPasscodeModalOpen, setIsPasscodeModalOpen] = useState21(false);
-  const [oldPasscode, setOldPasscode] = useState21("");
-  const [newPasscode, setNewPasscode] = useState21("");
-  const [confirmPasscode, setConfirmPasscode] = useState21("");
-  const [isPasscodeSubmitting, setIsPasscodeSubmitting] = useState21(false);
+  const [showPasskeyModal, setShowPasskeyModal] = useState20(false);
+  const [isSubmitting, setIsSubmitting] = useState20(false);
+  const [isPasscodeModalOpen, setIsPasscodeModalOpen] = useState20(false);
+  const [oldPasscode, setOldPasscode] = useState20("");
+  const [newPasscode, setNewPasscode] = useState20("");
+  const [confirmPasscode, setConfirmPasscode] = useState20("");
+  const [isPasscodeSubmitting, setIsPasscodeSubmitting] = useState20(false);
   const handleTogglePasskey = () => {
     if (isPasskeyLoading) return;
     if (hasPasskey) {
@@ -3135,13 +3114,13 @@ var MenuRow3 = ({
 );
 
 // src/components/FeatureScroll.tsx
-import React29, { useRef as useRef7, useState as useState22, useEffect as useEffect12 } from "react";
+import React29, { useRef as useRef6, useState as useState21, useEffect as useEffect11 } from "react";
 import Image4 from "next/image";
 import { HugeiconsIcon as HugeiconsIcon22 } from "@hugeicons/react";
 import { ArrowLeft01Icon as ArrowLeft01Icon9, ArrowRight01Icon as ArrowRight01Icon8, Loading03Icon as Loading03Icon13 } from "@hugeicons/core-free-icons";
 var FeatureCard = ({ feature, bgImage }) => {
-  const [isBgLoading, setIsBgLoading] = useState22(true);
-  const [isFgLoading, setIsFgLoading] = useState22(!!feature.image);
+  const [isBgLoading, setIsBgLoading] = useState21(true);
+  const [isFgLoading, setIsFgLoading] = useState21(!!feature.image);
   return /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ React29.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ React29.createElement(
     Image4,
     {
@@ -3179,9 +3158,9 @@ var FeatureCard = ({ feature, bgImage }) => {
   ))), /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ React29.createElement("h3", { className: "  text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ React29.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 max-w-[90%]" }, feature.desc)));
 };
 var FeatureScroll = ({ tagline, headline, features }) => {
-  const scrollRef = useRef7(null);
-  const [canScrollLeft, setCanScrollLeft] = useState22(false);
-  const [canScrollRight, setCanScrollRight] = useState22(true);
+  const scrollRef = useRef6(null);
+  const [canScrollLeft, setCanScrollLeft] = useState21(false);
+  const [canScrollRight, setCanScrollRight] = useState21(true);
   const checkScroll = () => {
     if (scrollRef.current) {
       const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
@@ -3189,7 +3168,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
       setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
     }
   };
-  useEffect12(() => {
+  useEffect11(() => {
     checkScroll();
     window.addEventListener("resize", checkScroll);
     return () => window.removeEventListener("resize", checkScroll);
@@ -3270,7 +3249,7 @@ var PlatformFeatures = ({
 };
 
 // src/components/ManagedDocument.tsx
-import React31, { useState as useState23, useEffect as useEffect13, useRef as useRef8 } from "react";
+import React31, { useState as useState22, useEffect as useEffect12, useRef as useRef7 } from "react";
 var ManagedDocument = ({
   tagline,
   title,
@@ -3278,9 +3257,9 @@ var ManagedDocument = ({
   contactText,
   contactEmail
 }) => {
-  const [isAnimating, setIsAnimating] = useState23(false);
-  const titleRef = useRef8(null);
-  useEffect13(() => {
+  const [isAnimating, setIsAnimating] = useState22(false);
+  const titleRef = useRef7(null);
+  useEffect12(() => {
     const observer = new IntersectionObserver(
       ([entry]) => {
         if (entry.isIntersecting) {
@@ -3320,11 +3299,11 @@ var ManagedDocument = ({
 };
 
 // src/components/ManagedContactBlock.tsx
-import React32, { useState as useState24, useEffect as useEffect14 } from "react";
+import React32, { useState as useState23, useEffect as useEffect13 } from "react";
 import { HugeiconsIcon as HugeiconsIcon24 } from "@hugeicons/react";
 var SecureEmail = ({ user, domain, className }) => {
-  const [isMounted, setIsMounted] = useState24(false);
-  useEffect14(() => {
+  const [isMounted, setIsMounted] = useState23(false);
+  useEffect13(() => {
     setIsMounted(true);
   }, []);
   if (!isMounted) {
@@ -3385,7 +3364,7 @@ var ManagedContactBlock = ({
 };
 
 // src/components/ManagedPricingBlock.tsx
-import React33, { useState as useState25, useEffect as useEffect15, useRef as useRef9 } from "react";
+import React33, { useState as useState24, useEffect as useEffect14, useRef as useRef8 } from "react";
 import Link7 from "next/link";
 import Image5 from "next/image";
 var CheckIcon = ({ className = "" }) => /* @__PURE__ */ React33.createElement("svg", { viewBox: "0 0 24 24", fill: "none", className: `w-4 h-4 shrink-0 ${className}`, xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React33.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ React33.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
@@ -3396,10 +3375,10 @@ var ManagedPricingBlock = ({
   plans = [],
   tabs
 }) => {
-  const [isAnimating, setIsAnimating] = useState25(false);
-  const [activeTabIndex, setActiveTabIndex] = useState25(0);
-  const titleRef = useRef9(null);
-  useEffect15(() => {
+  const [isAnimating, setIsAnimating] = useState24(false);
+  const [activeTabIndex, setActiveTabIndex] = useState24(0);
+  const titleRef = useRef8(null);
+  useEffect14(() => {
     const observer = new IntersectionObserver(
       ([entry]) => {
         if (entry.isIntersecting) {
@@ -3614,14 +3593,14 @@ var ManagedNewsletterSplitBlock = ({
 };
 
 // src/components/PortfolioHero.tsx
-import React37, { useEffect as useEffect16, useRef as useRef10 } from "react";
+import React37, { useEffect as useEffect15, useRef as useRef9 } from "react";
 import Link8 from "next/link";
 import Image8 from "next/image";
 import { HugeiconsIcon as HugeiconsIcon26 } from "@hugeicons/react";
 import { ArrowRight01Icon as ArrowRight01Icon9 } from "@hugeicons/core-free-icons";
 var useScrollAnimation = () => {
-  const elementRef = useRef10(null);
-  useEffect16(() => {
+  const elementRef = useRef9(null);
+  useEffect15(() => {
     const el = elementRef.current;
     if (!el) return;
     const observer = new IntersectionObserver(
@@ -3705,7 +3684,7 @@ var PortfolioHero = ({
 };
 
 // src/components/GifFeatureCard.tsx
-import React38, { useState as useState26 } from "react";
+import React38, { useState as useState25 } from "react";
 import Image9 from "next/image";
 import { HugeiconsIcon as HugeiconsIcon27 } from "@hugeicons/react";
 import { Loading03Icon as Loading03Icon14 } from "@hugeicons/core-free-icons";
@@ -3716,7 +3695,7 @@ var GifFeatureCard = ({
   alt = "Feature animation",
   className = "aspect-video"
 }) => {
-  const [isLoading, setIsLoading] = useState26(true);
+  const [isLoading, setIsLoading] = useState25(true);
   return /* @__PURE__ */ React38.createElement("div", { className: `relative w-full bg-black  overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ React38.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ React38.createElement(
     HugeiconsIcon27,
     {
@@ -3749,7 +3728,7 @@ var GifFeatureCard = ({
 };
 
 // src/components/MedicalFeatureStatsBlock.tsx
-import React39, { useState as useState27, useEffect as useEffect17, useRef as useRef11 } from "react";
+import React39, { useState as useState26, useEffect as useEffect16, useRef as useRef10 } from "react";
 import Image10 from "next/image";
 var MedicalFeatureStatsBlock = ({
   bottomHeadline,
@@ -3758,9 +3737,9 @@ var MedicalFeatureStatsBlock = ({
   trustText,
   stats
 }) => {
-  const [isAnimating, setIsAnimating] = useState27(false);
-  const titleRef = useRef11(null);
-  useEffect17(() => {
+  const [isAnimating, setIsAnimating] = useState26(false);
+  const titleRef = useRef10(null);
+  useEffect16(() => {
     const observer = new IntersectionObserver(
       ([entry]) => {
         if (entry.isIntersecting) {
@@ -3799,12 +3778,12 @@ var MedicalFeatureStatsBlock = ({
 };
 
 // src/components/ConsultantShowcase.tsx
-import React40, { useState as useState28 } from "react";
+import React40, { useState as useState27 } from "react";
 import Image11 from "next/image";
 import { HugeiconsIcon as HugeiconsIcon28 } from "@hugeicons/react";
 import { Loading03Icon as Loading03Icon15 } from "@hugeicons/core-free-icons";
 var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
-  const [isLoading, setIsLoading] = useState28(true);
+  const [isLoading, setIsLoading] = useState27(true);
   return /* @__PURE__ */ React40.createElement("div", { className: `absolute inset-0 bg-neutral-800 ${className}` }, isLoading && /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-800/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon28, { icon: Loading03Icon15, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ React40.createElement(
     Image11,
     {
@@ -3824,9 +3803,9 @@ var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
 var ConsultantShowcase = ({
   profiles
 }) => {
-  const [currentIndex, setCurrentIndex] = useState28(0);
-  const [touchStart, setTouchStart] = useState28(null);
-  const [touchEnd, setTouchEnd] = useState28(null);
+  const [currentIndex, setCurrentIndex] = useState27(0);
+  const [touchStart, setTouchStart] = useState27(null);
+  const [touchEnd, setTouchEnd] = useState27(null);
   const nextSlide = () => {
     setCurrentIndex((prev) => prev === profiles.length - 1 ? 0 : prev + 1);
   };
@@ -3894,7 +3873,7 @@ var ConsultantShowcase = ({
 };
 
 // src/components/ContentGridBlock.tsx
-import React41, { useState as useState29 } from "react";
+import React41, { useState as useState28 } from "react";
 import Image12 from "next/image";
 import { HugeiconsIcon as HugeiconsIcon29 } from "@hugeicons/react";
 import { Loading03Icon as Loading03Icon16 } from "@hugeicons/core-free-icons";
@@ -4086,7 +4065,7 @@ var UniversalVerificationPage = ({
 };
 
 // src/components/UniversalRewardPage.tsx
-import React44, { useState as useState30 } from "react";
+import React44, { useState as useState29 } from "react";
 import axios from "axios";
 import toast9 from "react-hot-toast";
 import Confetti from "react-confetti";
@@ -4103,7 +4082,7 @@ var formatWeb3Name = (name) => {
 };
 var PageSpinner4 = () => /* @__PURE__ */ React44.createElement("div", { className: "flex justify-center items-center py-12 w-full" }, /* @__PURE__ */ React44.createElement(HugeiconsIcon31, { icon: Loading03Icon18, size: 32, className: "animate-spin mb-4 text-black" }));
 var AvatarLogo = ({ src, alt, name, sizeClass = "w-12 h-12" }) => {
-  const [isLoaded, setIsLoaded] = useState30(false);
+  const [isLoaded, setIsLoaded] = useState29(false);
   const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=ffffff&color=000000&size=100&font-size=0.33`;
   const finalSrc = src || fallbackUrl;
   return /* @__PURE__ */ React44.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__ */ React44.createElement(HugeiconsIcon31, { 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"}` }));
@@ -4121,11 +4100,11 @@ var UniversalRewardPage = ({
   const onBackHandler = onBack ?? (() => {
     if (typeof window !== "undefined") window.history.back();
   });
-  const [activeTabIndex, setActiveTabIndex] = useState30(1);
+  const [activeTabIndex, setActiveTabIndex] = useState29(1);
   const tabs = [{ label: "Today" }, { label: "Week" }, { label: "Month" }];
-  const [selectedReward, setSelectedReward] = useState30(null);
-  const [isClaiming, setIsClaiming] = useState30(false);
-  const [showConfetti, setShowConfetti] = useState30(false);
+  const [selectedReward, setSelectedReward] = useState29(null);
+  const [isClaiming, setIsClaiming] = useState29(false);
+  const [showConfetti, setShowConfetti] = useState29(false);
   const getActiveLeaderboard = () => {
     if (activeTabIndex === 0) return leaderboardToday || [];
     if (activeTabIndex === 1) return leaderboardWeek || [];
@@ -4200,7 +4179,7 @@ var UniversalRewardPage = ({
 };
 
 // src/components/UniversalReferralPage.tsx
-import React45, { useState as useState31 } from "react";
+import React45, { useState as useState30 } from "react";
 import toast10 from "react-hot-toast";
 import { HugeiconsIcon as HugeiconsIcon32 } from "@hugeicons/react";
 import {
@@ -4241,7 +4220,7 @@ var UniversalReferralPage = ({
     }
   };
   const AvatarLogo2 = ({ src, alt, name, sizeClass = "w-10 h-10" }) => {
-    const [isLoaded, setIsLoaded] = useState31(false);
+    const [isLoaded, setIsLoaded] = useState30(false);
     const fallbackUrl = `/api/avatar/?name=${encodeURIComponent(name || " ")}&background=e0e0e0&color=000000&size=100&font-size=0.33`;
     const finalSrc = src || fallbackUrl;
     return /* @__PURE__ */ React45.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__ */ React45.createElement(HugeiconsIcon32, { icon: Loading03Icon19, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React45.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
@@ -4289,7 +4268,7 @@ var UniversalReferralPage = ({
 };
 
 // src/components/UniversalCardActionPage.tsx
-import React46, { useState as useState32 } from "react";
+import React46, { useState as useState31 } from "react";
 import Confetti2 from "react-confetti";
 import { useWindowSize as useWindowSize2 } from "react-use";
 import { HugeiconsIcon as HugeiconsIcon33 } from "@hugeicons/react";
@@ -4340,10 +4319,10 @@ var UniversalCardActionPage = ({
     if (typeof window !== "undefined") window.history.back();
   });
   const { width, height } = useWindowSize2();
-  const [selectedTier, setSelectedTier] = useState32(null);
-  const [intendedAction, setIntendedAction] = useState32(null);
-  const [isProcessing, setIsProcessing] = useState32(false);
-  const [showConfetti, setShowConfetti] = useState32(false);
+  const [selectedTier, setSelectedTier] = useState31(null);
+  const [intendedAction, setIntendedAction] = useState31(null);
+  const [isProcessing, setIsProcessing] = useState31(false);
+  const [showConfetti, setShowConfetti] = useState31(false);
   const availableTiers = tiers.filter((t) => t.isAvailable || t.acceptPreorder || t.acceptWaitlist);
   const handleTierClick = (tier, explicitAction) => {
     setSelectedTier(tier);
@@ -4483,7 +4462,7 @@ var UniversalCardActionPage = ({
 };
 
 // src/components/PinDialerBottomSheet.tsx
-import React47, { useState as useState33, useEffect as useEffect18 } from "react";
+import React47, { useState as useState32, useEffect as useEffect17 } from "react";
 import { HugeiconsIcon as HugeiconsIcon34 } from "@hugeicons/react";
 import { CancelCircleIcon as CancelCircleIcon10 } from "@hugeicons/core-free-icons";
 var PinDialerBottomSheet = ({
@@ -4493,8 +4472,8 @@ var PinDialerBottomSheet = ({
   onClose,
   onComplete
 }) => {
-  const [pin, setPin] = useState33("");
-  useEffect18(() => {
+  const [pin, setPin] = useState32("");
+  useEffect17(() => {
     setPin("");
   }, [isOpen]);
   const handleSubmit = (e) => {
@@ -4545,7 +4524,7 @@ var PinDialerBottomSheet = ({
 };
 
 // src/components/UniversalBuyCryptoPage.tsx
-import React48, { useState as useState34, useEffect as useEffect19, useRef as useRef12, useCallback } from "react";
+import React48, { useState as useState33, useEffect as useEffect18, useRef as useRef11, useCallback } from "react";
 import toast11 from "react-hot-toast";
 import { HugeiconsIcon as HugeiconsIcon35 } from "@hugeicons/react";
 import {
@@ -4553,8 +4532,8 @@ import {
   CheckmarkCircle02Icon
 } from "@hugeicons/core-free-icons";
 var CircularLogo = ({ src, alt, fallbackText }) => {
-  const [isLoaded, setIsLoaded] = useState34(false);
-  const [hasError, setHasError] = useState34(false);
+  const [isLoaded, setIsLoaded] = useState33(false);
+  const [hasError, setHasError] = useState33(false);
   return /* @__PURE__ */ React48.createElement("div", { className: "relative w-5 h-5 rounded-full overflow-hidden bg-neutral-100 flex items-center justify-center shrink-0" }, !hasError && src ? /* @__PURE__ */ React48.createElement(React48.Fragment, null, !isLoaded && /* @__PURE__ */ React48.createElement("div", { className: "absolute inset-0 bg-neutral-200 animate-pulse" }), /* @__PURE__ */ React48.createElement(
     "img",
     {
@@ -4604,33 +4583,33 @@ var UniversalBuyCryptoPage = ({
   const onBackHandler = onBack ?? (() => {
     if (typeof window !== "undefined") window.history.back();
   });
-  const [selectedCrypto, setSelectedCrypto] = useState34(() => {
+  const [selectedCrypto, setSelectedCrypto] = useState33(() => {
     if (defaultCryptoCode) {
       const found = cryptoOptions.find((c) => c.code === defaultCryptoCode);
       if (found) return found;
     }
     return cryptoOptions[0];
   });
-  const [selectedNetwork, setSelectedNetwork] = useState34(() => {
+  const [selectedNetwork, setSelectedNetwork] = useState33(() => {
     if (defaultNetworkId && selectedCrypto?.networks) {
       const foundNet = selectedCrypto.networks.find((n) => n.id === defaultNetworkId);
       if (foundNet) return foundNet;
     }
     return selectedCrypto?.networks?.[0] || { id: "polygon", name: "Polygon", symbol: "POLYGON" };
   });
-  const [fiatAmount, setFiatAmount] = useState34("");
-  const [cryptoAmount, setCryptoAmount] = useState34("");
-  const [activeSource, setActiveSource] = useState34("FIAT");
-  const [isCalculating, setIsCalculating] = useState34(false);
-  const [rateDisplay, setRateDisplay] = useState34(null);
-  const [currentRateKey, setCurrentRateKey] = useState34(null);
-  const [recipientAddress, setRecipientAddress] = useState34(defaultRecipientAddress);
-  const [isAddressValid, setIsAddressValid] = useState34(false);
-  const [isCryptoDialogOpen, setIsCryptoDialogOpen] = useState34(false);
-  const [isNetworkDialogOpen, setIsNetworkDialogOpen] = useState34(false);
-  const [isSubmitting, setIsSubmitting] = useState34(false);
-  const debounceTimerRef = useRef12(null);
-  useEffect19(() => {
+  const [fiatAmount, setFiatAmount] = useState33("");
+  const [cryptoAmount, setCryptoAmount] = useState33("");
+  const [activeSource, setActiveSource] = useState33("FIAT");
+  const [isCalculating, setIsCalculating] = useState33(false);
+  const [rateDisplay, setRateDisplay] = useState33(null);
+  const [currentRateKey, setCurrentRateKey] = useState33(null);
+  const [recipientAddress, setRecipientAddress] = useState33(defaultRecipientAddress);
+  const [isAddressValid, setIsAddressValid] = useState33(false);
+  const [isCryptoDialogOpen, setIsCryptoDialogOpen] = useState33(false);
+  const [isNetworkDialogOpen, setIsNetworkDialogOpen] = useState33(false);
+  const [isSubmitting, setIsSubmitting] = useState33(false);
+  const debounceTimerRef = useRef11(null);
+  useEffect18(() => {
     if (selectedCrypto?.networks?.length > 0) {
       const exists = selectedCrypto.networks.find((n) => n.id === selectedNetwork.id);
       if (!exists) {
@@ -4638,7 +4617,7 @@ var UniversalBuyCryptoPage = ({
       }
     }
   }, [selectedCrypto]);
-  useEffect19(() => {
+  useEffect18(() => {
     if (!recipientAddress.trim()) {
       setIsAddressValid(false);
       return;
@@ -4826,7 +4805,7 @@ var UniversalBuyCryptoPage = ({
 };
 
 // src/components/UniversalHuddlesPage.tsx
-import React49, { useState as useState35 } from "react";
+import React49, { useState as useState34 } from "react";
 import { HugeiconsIcon as HugeiconsIcon36 } from "@hugeicons/react";
 import {
   ArrowLeft01Icon as ArrowLeft01Icon15,
@@ -4834,8 +4813,8 @@ import {
   Loading03Icon as Loading03Icon22
 } from "@hugeicons/core-free-icons";
 var HuddleAvatar = ({ src, status, sizeClass = "w-10 h-10" }) => {
-  const [loaded, setLoaded] = useState35(false);
-  const [error, setError] = useState35(false);
+  const [loaded, setLoaded] = useState34(false);
+  const [error, setError] = useState34(false);
   const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/default_a.avif";
   const finalSrc = error || !src ? defaultAvatar : src;
   const getStatusColor = () => {
@@ -4912,7 +4891,7 @@ var UniversalHuddlesPage = ({
 };
 
 // src/components/UniversalMembersPage.tsx
-import React50, { useState as useState36, useEffect as useEffect20, useRef as useRef13 } from "react";
+import React50, { useState as useState35, useEffect as useEffect19, useRef as useRef12 } from "react";
 import { HugeiconsIcon as HugeiconsIcon37 } from "@hugeicons/react";
 import toast12 from "react-hot-toast";
 import {
@@ -4924,8 +4903,8 @@ import {
   ListSettingIcon as ListSettingIcon2
 } from "@hugeicons/core-free-icons";
 var MemberAvatar2 = ({ src, status }) => {
-  const [loaded, setLoaded] = useState36(false);
-  const [error, setError] = useState36(false);
+  const [loaded, setLoaded] = useState35(false);
+  const [error, setError] = useState35(false);
   const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
   const finalSrc = error || !src ? defaultAvatar : src;
   const getStatusColor = () => {
@@ -4973,20 +4952,20 @@ var UniversalMembersPage = ({
   onRemoveMember,
   onInviteMember
 }) => {
-  const [expandedId, setExpandedId] = useState36(null);
-  const [memberToRemove, setMemberToRemove] = useState36(null);
-  const [isRemoving, setIsRemoving] = useState36(false);
-  const [isInviteMode, setIsInviteMode] = useState36(false);
-  const [inviteEmail, setInviteEmail] = useState36("");
-  const [isInviting, setIsInviting] = useState36(false);
-  const [localSearchQuery, setLocalSearchQuery] = useState36(searchQuery);
-  const [isTyping, setIsTyping] = useState36(false);
-  const [isStatusModalOpen, setIsStatusModalOpen] = useState36(false);
-  const [isRoleModalOpen, setIsRoleModalOpen] = useState36(false);
-  const statusDropdownRef = useRef13(null);
-  const roleDropdownRef = useRef13(null);
+  const [expandedId, setExpandedId] = useState35(null);
+  const [memberToRemove, setMemberToRemove] = useState35(null);
+  const [isRemoving, setIsRemoving] = useState35(false);
+  const [isInviteMode, setIsInviteMode] = useState35(false);
+  const [inviteEmail, setInviteEmail] = useState35("");
+  const [isInviting, setIsInviting] = useState35(false);
+  const [localSearchQuery, setLocalSearchQuery] = useState35(searchQuery);
+  const [isTyping, setIsTyping] = useState35(false);
+  const [isStatusModalOpen, setIsStatusModalOpen] = useState35(false);
+  const [isRoleModalOpen, setIsRoleModalOpen] = useState35(false);
+  const statusDropdownRef = useRef12(null);
+  const roleDropdownRef = useRef12(null);
   const cleanEmailId = (val) => val.toLowerCase().replace(/[^a-z0-9@._-]/g, "");
-  useEffect20(() => {
+  useEffect19(() => {
     function handleClickOutside(event) {
       if (statusDropdownRef.current && !statusDropdownRef.current.contains(event.target)) {
         setIsStatusModalOpen(false);
@@ -4998,7 +4977,7 @@ var UniversalMembersPage = ({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  useEffect20(() => {
+  useEffect19(() => {
     setIsTyping(true);
     const handler = setTimeout(() => {
       onSearchChange(localSearchQuery);
@@ -5006,7 +4985,7 @@ var UniversalMembersPage = ({
     }, 600);
     return () => clearTimeout(handler);
   }, [localSearchQuery, onSearchChange]);
-  useEffect20(() => {
+  useEffect19(() => {
     if (searchQuery === "" && localSearchQuery !== "") {
       setLocalSearchQuery("");
     }
@@ -5178,7 +5157,7 @@ var UniversalMembersPage = ({
 };
 
 // src/components/UniversalHome2.tsx
-import React51, { useState as useState37 } from "react";
+import React51, { useState as useState36 } from "react";
 import { useRouter as useRouter3 } from "next/navigation";
 import { HugeiconsIcon as HugeiconsIcon38 } from "@hugeicons/react";
 import toast13 from "react-hot-toast";
@@ -5194,8 +5173,8 @@ import {
   Tick02Icon as Tick02Icon2
 } from "@hugeicons/core-free-icons";
 var OrgAvatar = ({ src, sizeClass = "w-10 h-10" }) => {
-  const [loaded, setLoaded] = useState37(false);
-  const [error, setError] = useState37(false);
+  const [loaded, setLoaded] = useState36(false);
+  const [error, setError] = useState36(false);
   const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/office_a.avif";
   const finalSrc = error || !src ? defaultAvatar : src;
   return /* @__PURE__ */ React51.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React51.createElement("div", { className: "w-full h-full rounded-lg bg-neutral-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React51.createElement(HugeiconsIcon38, { icon: Loading03Icon24, className: "animate-spin text-neutral-400 absolute", size: 14 }), /* @__PURE__ */ React51.createElement(
@@ -5228,13 +5207,13 @@ var UniversalHome2 = ({
   huddlesProps,
   onLogout
 }) => {
-  const [isAvatarLoaded, setIsAvatarLoaded] = useState37(false);
-  const [showNotifDialog, setShowNotifDialog] = useState37(false);
-  const [showOrgSwitcher, setShowOrgSwitcher] = useState37(false);
-  const [selectedNotif, setSelectedNotif] = useState37(null);
-  const [isResolving, setIsResolving] = useState37(false);
-  const [showLogoutConfirm, setShowLogoutConfirm] = useState37(false);
-  const [isLoggingOut, setIsLoggingOut] = useState37(false);
+  const [isAvatarLoaded, setIsAvatarLoaded] = useState36(false);
+  const [showNotifDialog, setShowNotifDialog] = useState36(false);
+  const [showOrgSwitcher, setShowOrgSwitcher] = useState36(false);
+  const [selectedNotif, setSelectedNotif] = useState36(null);
+  const [isResolving, setIsResolving] = useState36(false);
+  const [showLogoutConfirm, setShowLogoutConfirm] = useState36(false);
+  const [isLoggingOut, setIsLoggingOut] = useState36(false);
   const router = useRouter3();
   const fallbackAvatarUrl = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
   const finalAvatarSrc = avatarSrc || fallbackAvatarUrl;
@@ -5407,7 +5386,7 @@ var UniversalHome2 = ({
 };
 
 // src/components/UniversalSettings.tsx
-import React52, { useState as useState38, useEffect as useEffect21, useRef as useRef14 } from "react";
+import React52, { useState as useState37, useEffect as useEffect20, useRef as useRef13 } from "react";
 import toast14 from "react-hot-toast";
 import { HugeiconsIcon as HugeiconsIcon39 } from "@hugeicons/react";
 import {
@@ -5422,8 +5401,8 @@ import {
   PlusSignIcon as PlusSignIcon3
 } from "@hugeicons/core-free-icons";
 var MemberAvatar3 = ({ src, status, sizeClass = "w-10 h-10" }) => {
-  const [loaded, setLoaded] = useState38(false);
-  const [error, setError] = useState38(false);
+  const [loaded, setLoaded] = useState37(false);
+  const [error, setError] = useState37(false);
   const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
   const finalSrc = error || !src ? defaultAvatar : src;
   const getStatusColor = () => {
@@ -5482,36 +5461,36 @@ var UniversalSettings = ({
   });
   const isOrg = accountType === "ORGANIZATION";
   const canManage = userRole === "ADMIN" || userRole === "MANAGER";
-  const [activeTab, setActiveTab] = useState38(isOrg ? "MEMBERS" : "ACCOUNT");
-  const [expandedId, setExpandedId] = useState38(null);
-  const [memberToRemove, setMemberToRemove] = useState38(null);
-  const [isRemoving, setIsRemoving] = useState38(false);
-  const [isInviteMode, setIsInviteMode] = useState38(false);
-  const [inviteEmail, setInviteEmail] = useState38("");
-  const [isInviting, setIsInviting] = useState38(false);
-  const [localSearchQuery, setLocalSearchQuery] = useState38(membersSearchQuery);
-  const [isTyping, setIsTyping] = useState38(false);
-  const isFirstSearchMount = useRef14(true);
-  const [isStatusModalOpen, setIsStatusModalOpen] = useState38(false);
-  const [isRoleModalOpen, setIsRoleModalOpen] = useState38(false);
-  const [roleEditTarget, setRoleEditTarget] = useState38(null);
-  const [isUpdatingRole, setIsUpdatingRole] = useState38(false);
-  const [orgName, setOrgName] = useState38(initialOrgName);
-  const [orgSlug, setOrgSlug] = useState38(initialOrgSlug);
-  const [firstName, setFirstName] = useState38("");
-  const [lastName, setLastName] = useState38("");
-  const [isCheckingSlug, setIsCheckingSlug] = useState38(false);
-  const [slugAvailable, setSlugAvailable] = useState38(null);
-  const [isSavingOrg, setIsSavingOrg] = useState38(false);
-  const [isSavingProfile, setIsSavingProfile] = useState38(false);
-  useEffect21(() => {
+  const [activeTab, setActiveTab] = useState37(isOrg ? "MEMBERS" : "ACCOUNT");
+  const [expandedId, setExpandedId] = useState37(null);
+  const [memberToRemove, setMemberToRemove] = useState37(null);
+  const [isRemoving, setIsRemoving] = useState37(false);
+  const [isInviteMode, setIsInviteMode] = useState37(false);
+  const [inviteEmail, setInviteEmail] = useState37("");
+  const [isInviting, setIsInviting] = useState37(false);
+  const [localSearchQuery, setLocalSearchQuery] = useState37(membersSearchQuery);
+  const [isTyping, setIsTyping] = useState37(false);
+  const isFirstSearchMount = useRef13(true);
+  const [isStatusModalOpen, setIsStatusModalOpen] = useState37(false);
+  const [isRoleModalOpen, setIsRoleModalOpen] = useState37(false);
+  const [roleEditTarget, setRoleEditTarget] = useState37(null);
+  const [isUpdatingRole, setIsUpdatingRole] = useState37(false);
+  const [orgName, setOrgName] = useState37(initialOrgName);
+  const [orgSlug, setOrgSlug] = useState37(initialOrgSlug);
+  const [firstName, setFirstName] = useState37("");
+  const [lastName, setLastName] = useState37("");
+  const [isCheckingSlug, setIsCheckingSlug] = useState37(false);
+  const [slugAvailable, setSlugAvailable] = useState37(null);
+  const [isSavingOrg, setIsSavingOrg] = useState37(false);
+  const [isSavingProfile, setIsSavingProfile] = useState37(false);
+  useEffect20(() => {
     setOrgName(initialOrgName || "");
     setOrgSlug(initialOrgSlug || "");
     const parts = (initialFullName || "").split(" ");
     setFirstName(parts[0] || "");
     setLastName(parts.slice(1).join(" ") || "");
   }, [initialOrgName, initialOrgSlug, initialFullName]);
-  useEffect21(() => {
+  useEffect20(() => {
     if (activeTab !== "MEMBERS") return;
     if (isFirstSearchMount.current) {
       isFirstSearchMount.current = false;
@@ -5568,7 +5547,7 @@ var UniversalSettings = ({
     }
   };
   const activeExpandedMember = expandedId ? members.find((m) => m.id === expandedId) : null;
-  useEffect21(() => {
+  useEffect20(() => {
     if (!isOrg || !orgSlug || orgSlug === initialOrgSlug) {
       setSlugAvailable(null);
       setIsCheckingSlug(false);
@@ -5663,7 +5642,7 @@ var UniversalSettings = ({
 };
 
 // src/components/UniversalCreateHuddle.tsx
-import React53, { useState as useState39, useEffect as useEffect22, useRef as useRef15 } from "react";
+import React53, { useState as useState38, useEffect as useEffect21, useRef as useRef14 } from "react";
 import toast15 from "react-hot-toast";
 import { HugeiconsIcon as HugeiconsIcon40 } from "@hugeicons/react";
 import {
@@ -5678,8 +5657,8 @@ import {
   CircleLock02Icon as CircleLock02Icon4
 } from "@hugeicons/core-free-icons";
 var MemberAvatar4 = ({ src, sizeClass = "w-10 h-10" }) => {
-  const [loaded, setLoaded] = useState39(false);
-  const [error, setError] = useState39(false);
+  const [loaded, setLoaded] = useState38(false);
+  const [error, setError] = useState38(false);
   const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
   return /* @__PURE__ */ React53.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React53.createElement("div", { className: "w-full h-full rounded-lg bg-neutral-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React53.createElement(HugeiconsIcon40, { icon: Loading03Icon26, className: "animate-spin text-neutral-400 absolute", size: 14 }), /* @__PURE__ */ React53.createElement(
     "img",
@@ -5722,28 +5701,28 @@ var UniversalCreateHuddle = ({
   onCreateSubmit
 }) => {
   const canManage = userRole === "ADMIN" || userRole === "MANAGER";
-  const [huddleDate, setHuddleDate] = useState39(() => {
+  const [huddleDate, setHuddleDate] = useState38(() => {
     const d = /* @__PURE__ */ new Date();
     d.setHours(d.getHours() + 1, 0, 0, 0);
     return d;
   });
-  const [title, setTitle] = useState39("");
-  const [isPrivate, setIsPrivate] = useState39(false);
-  const [timezone, setTimezone] = useState39("UTC");
-  useEffect22(() => {
+  const [title, setTitle] = useState38("");
+  const [isPrivate, setIsPrivate] = useState38(false);
+  const [timezone, setTimezone] = useState38("UTC");
+  useEffect21(() => {
     try {
       setTimezone(Intl.DateTimeFormat().resolvedOptions().timeZone);
     } catch (e) {
     }
   }, []);
-  const [calendarMode, setCalendarMode] = useState39(null);
-  const [showTimezoneModal, setShowTimezoneModal] = useState39(false);
-  const [showMembersModal, setShowMembersModal] = useState39(false);
-  const [selectedParticipants, setSelectedParticipants] = useState39(/* @__PURE__ */ new Set());
-  const [isSubmitting, setIsSubmitting] = useState39(false);
-  const [localSearchQuery, setLocalSearchQuery] = useState39(membersSearchQuery);
-  const [isTyping, setIsTyping] = useState39(false);
-  const typingTimer = useRef15(null);
+  const [calendarMode, setCalendarMode] = useState38(null);
+  const [showTimezoneModal, setShowTimezoneModal] = useState38(false);
+  const [showMembersModal, setShowMembersModal] = useState38(false);
+  const [selectedParticipants, setSelectedParticipants] = useState38(/* @__PURE__ */ new Set());
+  const [isSubmitting, setIsSubmitting] = useState38(false);
+  const [localSearchQuery, setLocalSearchQuery] = useState38(membersSearchQuery);
+  const [isTyping, setIsTyping] = useState38(false);
+  const typingTimer = useRef14(null);
   const handleSearchInput = (e) => {
     const val = e.target.value;
     setLocalSearchQuery(val);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retinalabsllc/zairusjs",
-  "version": "16.3.3",
+  "version": "16.3.4",
   "description": "A perceptive, Ai data driven Next.js UI component library.",
   "author": "Retina Labs Company",
   "license": "MIT",