@retinalabsllc/zairusjs 5.1.80 → 5.1.90

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +21 -10
  2. package/dist/index.mjs +59 -48
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -294,8 +294,8 @@ var NavLink = ({
294
294
  }) => {
295
295
  const pathname = (0, import_navigation.usePathname)();
296
296
  const isActive = pathname === href;
297
- const activeClass = "text-white";
298
- const inactiveClass = "text-neutral-400 hover:text-white";
297
+ const activeClass = "text-neutral-900 font-medium";
298
+ const inactiveClass = "text-neutral-500 hover:text-neutral-900";
299
299
  return /* @__PURE__ */ import_react5.default.createElement(
300
300
  import_link2.default,
301
301
  {
@@ -315,19 +315,30 @@ var Header = ({
315
315
  hideHeaderText = false,
316
316
  compact = false
317
317
  }) => {
318
+ const [mounted, setMounted] = (0, import_react5.useState)(false);
319
+ (0, import_react5.useEffect)(() => {
320
+ setMounted(true);
321
+ }, []);
318
322
  const headerLayoutWidth = compact ? "w-fit mx-auto gap-8 md:gap-16" : "w-full justify-between";
319
323
  const hasBrandSection = showLogo || !hideHeaderText;
320
- return /* @__PURE__ */ import_react5.default.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto flex justify-center" }, /* @__PURE__ */ import_react5.default.createElement("header", { className: `${headerLayoutWidth} bg-black/40 backdrop-blur-md rounded-full py-2 px-6 flex items-center transition-all duration-300` }, hasBrandSection && /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex items-center shrink-0" }, /* @__PURE__ */ import_react5.default.createElement(import_link2.default, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70 outline-none" }, showLogo && /* @__PURE__ */ import_react5.default.createElement(
324
+ const headerBgClass = "bg-white/80";
325
+ const brandTitleClass = "text-neutral-900";
326
+ const brandSubtitleClass = "text-neutral-500";
327
+ const shouldInvertLogo = !invert;
328
+ if (!mounted) {
329
+ return /* @__PURE__ */ import_react5.default.createElement("div", { className: "absolute inset-x-0 top-0 w-full h-20 z-50 pointer-events-none px-4 pt-4 sm:pt-6" });
330
+ }
331
+ return /* @__PURE__ */ import_react5.default.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto flex justify-center" }, /* @__PURE__ */ import_react5.default.createElement("header", { className: `${headerLayoutWidth} ${headerBgClass} backdrop-blur-md rounded-full py-2 px-6 flex items-center transition-all duration-300` }, hasBrandSection && /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex items-center shrink-0" }, /* @__PURE__ */ import_react5.default.createElement(import_link2.default, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70 outline-none" }, showLogo && /* @__PURE__ */ import_react5.default.createElement(
321
332
  import_image.default,
322
333
  {
323
334
  src: logoSrc,
324
335
  alt: `${companyName} Logo`,
325
336
  width: 40,
326
337
  height: 40,
327
- className: `object-contain w-8 h-auto ${invert ? "invert" : ""}`,
338
+ className: `object-contain w-8 h-auto ${shouldInvertLogo ? "invert" : ""}`,
328
339
  priority: true
329
340
  }
330
- ), !hideHeaderText && /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react5.default.createElement("span", { className: "text-[11px] leading-none tracking-wide mb-1 transition-colors text-white" }, companyName), subtitle && /* @__PURE__ */ import_react5.default.createElement("span", { className: "text-[9px] tracking-widest leading-none transition-colors text-neutral-400" }, subtitle)))), /* @__PURE__ */ import_react5.default.createElement("nav", { className: "flex items-center gap-1 md:gap-2 shrink-0" }, links.map((link, index) => /* @__PURE__ */ import_react5.default.createElement(
341
+ ), !hideHeaderText && /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ import_react5.default.createElement("span", { className: `text-[11px] leading-none tracking-wide mb-1 ${brandTitleClass}` }, companyName), subtitle && /* @__PURE__ */ import_react5.default.createElement("span", { className: `text-[9px] tracking-widest leading-none ${brandSubtitleClass}` }, subtitle)))), /* @__PURE__ */ import_react5.default.createElement("nav", { className: "flex items-center gap-1 md:gap-2 shrink-0" }, links.map((link, index) => /* @__PURE__ */ import_react5.default.createElement(
331
342
  NavLink,
332
343
  {
333
344
  key: index,
@@ -459,7 +470,7 @@ var HeroSection = ({
459
470
  backgroundPosition: "center"
460
471
  }
461
472
  }
462
- ), /* @__PURE__ */ import_react8.default.createElement("div", { className: "absolute inset-0 bg-white/40 z-10" }), /* @__PURE__ */ import_react8.default.createElement(
473
+ ), /* @__PURE__ */ import_react8.default.createElement("div", { className: "absolute inset-0 z-10" }), /* @__PURE__ */ import_react8.default.createElement(
463
474
  "div",
464
475
  {
465
476
  className: "absolute inset-0 w-full h-full pointer-events-none z-10 opacity-10",
@@ -480,7 +491,7 @@ var HeroSection = ({
480
491
  "h1",
481
492
  {
482
493
  ref: titleRef,
483
- className: `text-4xl sm:text-5xl lg:text-7xl font-light mb-6 text-neutral-900 tracking-tight leading-[1.05] max-w-4xl`,
494
+ className: `text-4xl sm:text-5xl lg:text-7xl font-light mb-6 text-white tracking-tight leading-[1.05] max-w-4xl`,
484
495
  style: isAnimating ? { animationIterationCount: 1 } : {}
485
496
  },
486
497
  titlePrefix,
@@ -490,7 +501,7 @@ var HeroSection = ({
490
501
  import_link4.default,
491
502
  {
492
503
  href: secondaryCtaHref,
493
- className: "w-full sm:w-60 inline-flex font-medium items-center justify-center text-[11px] tracking-widest rounded-full px-8 py-3 bg-white/60 backdrop-blur-md text-center text-neutral-900 text-xs hover:bg-white/80 border border-neutral-200 outline-none transition-all"
504
+ className: "w-full sm:w-60 inline-flex font-medium items-center justify-center text-xs tracking-widest rounded-full px-8 py-2.5 border border-neutral-100 text-center text-white hover:bg-black/80 outline-none transition-all"
494
505
  },
495
506
  secondaryCtaText
496
507
  )), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ import_react8.default.createElement("div", { className: "w-full flex flex-col items-center mt-4" }, appsText && /* @__PURE__ */ import_react8.default.createElement("p", { className: "text-[9px] tracking-[0.2em] text-neutral-500 mb-5 " }, appsText), /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex flex-wrap justify-center items-center gap-6 opacity-90" }, appLogos.map((logo, idx) => /* @__PURE__ */ import_react8.default.createElement("div", { key: idx, className: "relative h-6 w-6 sm:h-8 sm:w-8 flex items-center justify-center cursor-default" }, /* @__PURE__ */ import_react8.default.createElement(
@@ -880,7 +891,7 @@ var ManagedPricingBlock = ({
880
891
  },
881
892
  tab.label
882
893
  );
883
- }))), /* @__PURE__ */ import_react18.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-4xl animate-in slide-in-from-bottom-2 fade-in duration-500" }, currentPlans.map((plan, planIdx) => /* @__PURE__ */ import_react18.default.createElement(
894
+ }))), /* @__PURE__ */ import_react18.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl animate-in slide-in-from-bottom-2 fade-in duration-500" }, currentPlans.map((plan, planIdx) => /* @__PURE__ */ import_react18.default.createElement(
884
895
  "div",
885
896
  {
886
897
  key: `${activeTabIndex}-${planIdx}`,
@@ -907,7 +918,7 @@ var ManagedPricingBlock = ({
907
918
  import_link5.default,
908
919
  {
909
920
  href: plan.ctaHref,
910
- className: "w-full py-2 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
921
+ className: "w-full py-2.5 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
911
922
  },
912
923
  plan.ctaText
913
924
  ),
package/dist/index.mjs CHANGED
@@ -224,7 +224,7 @@ var ThreeDActionButton = ({
224
224
  };
225
225
 
226
226
  // src/components/Header.tsx
227
- import React4 from "react";
227
+ import React4, { useState as useState2, useEffect as useEffect2 } from "react";
228
228
  import Link2 from "next/link";
229
229
  import Image from "next/image";
230
230
  import { usePathname } from "next/navigation";
@@ -235,8 +235,8 @@ var NavLink = ({
235
235
  }) => {
236
236
  const pathname = usePathname();
237
237
  const isActive = pathname === href;
238
- const activeClass = "text-white";
239
- const inactiveClass = "text-neutral-400 hover:text-white";
238
+ const activeClass = "text-neutral-900 font-medium";
239
+ const inactiveClass = "text-neutral-500 hover:text-neutral-900";
240
240
  return /* @__PURE__ */ React4.createElement(
241
241
  Link2,
242
242
  {
@@ -256,19 +256,30 @@ var Header = ({
256
256
  hideHeaderText = false,
257
257
  compact = false
258
258
  }) => {
259
+ const [mounted, setMounted] = useState2(false);
260
+ useEffect2(() => {
261
+ setMounted(true);
262
+ }, []);
259
263
  const headerLayoutWidth = compact ? "w-fit mx-auto gap-8 md:gap-16" : "w-full justify-between";
260
264
  const hasBrandSection = showLogo || !hideHeaderText;
261
- return /* @__PURE__ */ React4.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ React4.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto flex justify-center" }, /* @__PURE__ */ React4.createElement("header", { className: `${headerLayoutWidth} bg-black/40 backdrop-blur-md rounded-full py-2 px-6 flex items-center transition-all duration-300` }, hasBrandSection && /* @__PURE__ */ React4.createElement("div", { className: "flex items-center shrink-0" }, /* @__PURE__ */ React4.createElement(Link2, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70 outline-none" }, showLogo && /* @__PURE__ */ React4.createElement(
265
+ const headerBgClass = "bg-white/80";
266
+ const brandTitleClass = "text-neutral-900";
267
+ const brandSubtitleClass = "text-neutral-500";
268
+ const shouldInvertLogo = !invert;
269
+ if (!mounted) {
270
+ return /* @__PURE__ */ React4.createElement("div", { className: "absolute inset-x-0 top-0 w-full h-20 z-50 pointer-events-none px-4 pt-4 sm:pt-6" });
271
+ }
272
+ return /* @__PURE__ */ React4.createElement("div", { className: "absolute inset-x-0 top-0 w-full z-50 pointer-events-none px-4 pt-4 sm:pt-6" }, /* @__PURE__ */ React4.createElement("div", { className: "max-w-5xl mx-auto w-full pointer-events-auto flex justify-center" }, /* @__PURE__ */ React4.createElement("header", { className: `${headerLayoutWidth} ${headerBgClass} backdrop-blur-md rounded-full py-2 px-6 flex items-center transition-all duration-300` }, hasBrandSection && /* @__PURE__ */ React4.createElement("div", { className: "flex items-center shrink-0" }, /* @__PURE__ */ React4.createElement(Link2, { href: "/", className: "flex items-center gap-3 transition-opacity hover:opacity-70 outline-none" }, showLogo && /* @__PURE__ */ React4.createElement(
262
273
  Image,
263
274
  {
264
275
  src: logoSrc,
265
276
  alt: `${companyName} Logo`,
266
277
  width: 40,
267
278
  height: 40,
268
- className: `object-contain w-8 h-auto ${invert ? "invert" : ""}`,
279
+ className: `object-contain w-8 h-auto ${shouldInvertLogo ? "invert" : ""}`,
269
280
  priority: true
270
281
  }
271
- ), !hideHeaderText && /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React4.createElement("span", { className: "text-[11px] leading-none tracking-wide mb-1 transition-colors text-white" }, companyName), subtitle && /* @__PURE__ */ React4.createElement("span", { className: "text-[9px] tracking-widest leading-none transition-colors text-neutral-400" }, subtitle)))), /* @__PURE__ */ React4.createElement("nav", { className: "flex items-center gap-1 md:gap-2 shrink-0" }, links.map((link, index) => /* @__PURE__ */ React4.createElement(
282
+ ), !hideHeaderText && /* @__PURE__ */ React4.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React4.createElement("span", { className: `text-[11px] leading-none tracking-wide mb-1 ${brandTitleClass}` }, companyName), subtitle && /* @__PURE__ */ React4.createElement("span", { className: `text-[9px] tracking-widest leading-none ${brandSubtitleClass}` }, subtitle)))), /* @__PURE__ */ React4.createElement("nav", { className: "flex items-center gap-1 md:gap-2 shrink-0" }, links.map((link, index) => /* @__PURE__ */ React4.createElement(
272
283
  NavLink,
273
284
  {
274
285
  key: index,
@@ -280,7 +291,7 @@ var Header = ({
280
291
  };
281
292
 
282
293
  // src/components/Footer.tsx
283
- import React5, { useState as useState2 } from "react";
294
+ import React5, { useState as useState3 } from "react";
284
295
  import Link3 from "next/link";
285
296
  import { HugeiconsIcon as HugeiconsIcon2 } from "@hugeicons/react";
286
297
  var Footer = ({
@@ -290,7 +301,7 @@ var Footer = ({
290
301
  copyrightText,
291
302
  topSection
292
303
  }) => {
293
- const [openCol, setOpenCol] = useState2(null);
304
+ const [openCol, setOpenCol] = useState3(null);
294
305
  const toggleColumn = (idx) => {
295
306
  setOpenCol(openCol === idx ? null : idx);
296
307
  };
@@ -329,7 +340,7 @@ var Footer = ({
329
340
  };
330
341
 
331
342
  // src/components/HeroSection.tsx
332
- import React6, { useState as useState3, useEffect as useEffect2, useRef as useRef2 } from "react";
343
+ import React6, { useState as useState4, useEffect as useEffect3, useRef as useRef2 } from "react";
333
344
  import Link4 from "next/link";
334
345
  import Image2 from "next/image";
335
346
  var HeroSection = ({
@@ -350,9 +361,9 @@ var HeroSection = ({
350
361
  bgVideoSrc,
351
362
  bgImageSrc
352
363
  }) => {
353
- const [isAnimating, setIsAnimating] = useState3(false);
364
+ const [isAnimating, setIsAnimating] = useState4(false);
354
365
  const titleRef = useRef2(null);
355
- useEffect2(() => {
366
+ useEffect3(() => {
356
367
  const observer = new IntersectionObserver(
357
368
  ([entry]) => {
358
369
  if (entry.isIntersecting) {
@@ -400,7 +411,7 @@ var HeroSection = ({
400
411
  backgroundPosition: "center"
401
412
  }
402
413
  }
403
- ), /* @__PURE__ */ React6.createElement("div", { className: "absolute inset-0 bg-white/40 z-10" }), /* @__PURE__ */ React6.createElement(
414
+ ), /* @__PURE__ */ React6.createElement("div", { className: "absolute inset-0 z-10" }), /* @__PURE__ */ React6.createElement(
404
415
  "div",
405
416
  {
406
417
  className: "absolute inset-0 w-full h-full pointer-events-none z-10 opacity-10",
@@ -421,7 +432,7 @@ var HeroSection = ({
421
432
  "h1",
422
433
  {
423
434
  ref: titleRef,
424
- className: `text-4xl sm:text-5xl lg:text-7xl font-light mb-6 text-neutral-900 tracking-tight leading-[1.05] max-w-4xl`,
435
+ className: `text-4xl sm:text-5xl lg:text-7xl font-light mb-6 text-white tracking-tight leading-[1.05] max-w-4xl`,
425
436
  style: isAnimating ? { animationIterationCount: 1 } : {}
426
437
  },
427
438
  titlePrefix,
@@ -431,7 +442,7 @@ var HeroSection = ({
431
442
  Link4,
432
443
  {
433
444
  href: secondaryCtaHref,
434
- className: "w-full sm:w-60 inline-flex font-medium items-center justify-center text-[11px] tracking-widest rounded-full px-8 py-3 bg-white/60 backdrop-blur-md text-center text-neutral-900 text-xs hover:bg-white/80 border border-neutral-200 outline-none transition-all"
445
+ className: "w-full sm:w-60 inline-flex font-medium items-center justify-center text-xs tracking-widest rounded-full px-8 py-2.5 border border-neutral-100 text-center text-white hover:bg-black/80 outline-none transition-all"
435
446
  },
436
447
  secondaryCtaText
437
448
  )), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ React6.createElement("div", { className: "w-full flex flex-col items-center mt-4" }, appsText && /* @__PURE__ */ React6.createElement("p", { className: "text-[9px] tracking-[0.2em] text-neutral-500 mb-5 " }, appsText), /* @__PURE__ */ React6.createElement("div", { className: "flex flex-wrap justify-center items-center gap-6 opacity-90" }, appLogos.map((logo, idx) => /* @__PURE__ */ React6.createElement("div", { key: idx, className: "relative h-6 w-6 sm:h-8 sm:w-8 flex items-center justify-center cursor-default" }, /* @__PURE__ */ React6.createElement(
@@ -447,12 +458,12 @@ var HeroSection = ({
447
458
  };
448
459
 
449
460
  // src/components/AppBento2.tsx
450
- import React7, { useState as useState4, useEffect as useEffect3, useRef as useRef3 } from "react";
461
+ import React7, { useState as useState5, useEffect as useEffect4, useRef as useRef3 } from "react";
451
462
  import { HugeiconsIcon as HugeiconsIcon3 } from "@hugeicons/react";
452
463
  var AppBento2 = ({ tagline, headline, features }) => {
453
- const [isAnimating, setIsAnimating] = useState4(false);
464
+ const [isAnimating, setIsAnimating] = useState5(false);
454
465
  const titleRef = useRef3(null);
455
- useEffect3(() => {
466
+ useEffect4(() => {
456
467
  const observer = new IntersectionObserver(
457
468
  ([entry]) => {
458
469
  if (entry.isIntersecting) {
@@ -522,13 +533,13 @@ var AppBento2 = ({ tagline, headline, features }) => {
522
533
  };
523
534
 
524
535
  // src/components/FeatureScroll.tsx
525
- import React8, { useRef as useRef4, useState as useState5, useEffect as useEffect4 } from "react";
536
+ import React8, { useRef as useRef4, useState as useState6, useEffect as useEffect5 } from "react";
526
537
  import Image3 from "next/image";
527
538
  import { HugeiconsIcon as HugeiconsIcon4 } from "@hugeicons/react";
528
539
  import { ArrowLeft01Icon, ArrowRight01Icon, Loading03Icon as Loading03Icon2 } from "@hugeicons/core-free-icons";
529
540
  var FeatureCard = ({ feature, bgImage }) => {
530
- const [isBgLoading, setIsBgLoading] = useState5(true);
531
- const [isFgLoading, setIsFgLoading] = useState5(!!feature.image);
541
+ const [isBgLoading, setIsBgLoading] = useState6(true);
542
+ const [isFgLoading, setIsFgLoading] = useState6(!!feature.image);
532
543
  return /* @__PURE__ */ React8.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__ */ React8.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ React8.createElement(
533
544
  Image3,
534
545
  {
@@ -567,8 +578,8 @@ var FeatureCard = ({ feature, bgImage }) => {
567
578
  };
568
579
  var FeatureScroll = ({ tagline, headline, features }) => {
569
580
  const scrollRef = useRef4(null);
570
- const [canScrollLeft, setCanScrollLeft] = useState5(false);
571
- const [canScrollRight, setCanScrollRight] = useState5(true);
581
+ const [canScrollLeft, setCanScrollLeft] = useState6(false);
582
+ const [canScrollRight, setCanScrollRight] = useState6(true);
572
583
  const checkScroll = () => {
573
584
  if (scrollRef.current) {
574
585
  const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;
@@ -576,7 +587,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
576
587
  setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 2);
577
588
  }
578
589
  };
579
- useEffect4(() => {
590
+ useEffect5(() => {
580
591
  checkScroll();
581
592
  window.addEventListener("resize", checkScroll);
582
593
  return () => window.removeEventListener("resize", checkScroll);
@@ -659,7 +670,7 @@ var PlatformFeatures = ({
659
670
  };
660
671
 
661
672
  // src/components/ManagedDocument.tsx
662
- import React10, { useState as useState6, useEffect as useEffect5, useRef as useRef5 } from "react";
673
+ import React10, { useState as useState7, useEffect as useEffect6, useRef as useRef5 } from "react";
663
674
  var ManagedDocument = ({
664
675
  tagline,
665
676
  title,
@@ -667,9 +678,9 @@ var ManagedDocument = ({
667
678
  contactText,
668
679
  contactEmail
669
680
  }) => {
670
- const [isAnimating, setIsAnimating] = useState6(false);
681
+ const [isAnimating, setIsAnimating] = useState7(false);
671
682
  const titleRef = useRef5(null);
672
- useEffect5(() => {
683
+ useEffect6(() => {
673
684
  const observer = new IntersectionObserver(
674
685
  ([entry]) => {
675
686
  if (entry.isIntersecting) {
@@ -709,11 +720,11 @@ var ManagedDocument = ({
709
720
  };
710
721
 
711
722
  // src/components/ManagedContactBlock.tsx
712
- import React11, { useState as useState7, useEffect as useEffect6 } from "react";
723
+ import React11, { useState as useState8, useEffect as useEffect7 } from "react";
713
724
  import { HugeiconsIcon as HugeiconsIcon6 } from "@hugeicons/react";
714
725
  var SecureEmail = ({ user, domain, className }) => {
715
- const [isMounted, setIsMounted] = useState7(false);
716
- useEffect6(() => {
726
+ const [isMounted, setIsMounted] = useState8(false);
727
+ useEffect7(() => {
717
728
  setIsMounted(true);
718
729
  }, []);
719
730
  if (!isMounted) {
@@ -768,7 +779,7 @@ var ManagedContactBlock = ({
768
779
  };
769
780
 
770
781
  // src/components/ManagedPricingBlock.tsx
771
- import React12, { useState as useState8, useEffect as useEffect7, useRef as useRef6 } from "react";
782
+ import React12, { useState as useState9, useEffect as useEffect8, useRef as useRef6 } from "react";
772
783
  import Link5 from "next/link";
773
784
  import Image4 from "next/image";
774
785
  var CheckIcon = ({ className = "" }) => /* @__PURE__ */ React12.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__ */ React12.createElement("circle", { cx: "12", cy: "12", r: "10", fill: "black" }), /* @__PURE__ */ React12.createElement("path", { d: "M8 12L11 15L16 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }));
@@ -779,10 +790,10 @@ var ManagedPricingBlock = ({
779
790
  plans = [],
780
791
  tabs
781
792
  }) => {
782
- const [isAnimating, setIsAnimating] = useState8(false);
783
- const [activeTabIndex, setActiveTabIndex] = useState8(0);
793
+ const [isAnimating, setIsAnimating] = useState9(false);
794
+ const [activeTabIndex, setActiveTabIndex] = useState9(0);
784
795
  const titleRef = useRef6(null);
785
- useEffect7(() => {
796
+ useEffect8(() => {
786
797
  const observer = new IntersectionObserver(
787
798
  ([entry]) => {
788
799
  if (entry.isIntersecting) {
@@ -821,7 +832,7 @@ var ManagedPricingBlock = ({
821
832
  },
822
833
  tab.label
823
834
  );
824
- }))), /* @__PURE__ */ React12.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-4xl animate-in slide-in-from-bottom-2 fade-in duration-500" }, currentPlans.map((plan, planIdx) => /* @__PURE__ */ React12.createElement(
835
+ }))), /* @__PURE__ */ React12.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-5 w-full max-w-3xl animate-in slide-in-from-bottom-2 fade-in duration-500" }, currentPlans.map((plan, planIdx) => /* @__PURE__ */ React12.createElement(
825
836
  "div",
826
837
  {
827
838
  key: `${activeTabIndex}-${planIdx}`,
@@ -848,7 +859,7 @@ var ManagedPricingBlock = ({
848
859
  Link5,
849
860
  {
850
861
  href: plan.ctaHref,
851
- className: "w-full py-2 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
862
+ className: "w-full py-2.5 px-5 rounded-full border border-neutral-100 text-center text-black text-xs hover:bg-neutral-50 transition-colors mb-6 outline-none block"
852
863
  },
853
864
  plan.ctaText
854
865
  ),
@@ -1105,14 +1116,14 @@ var NumberInput = ({
1105
1116
  ));
1106
1117
 
1107
1118
  // src/components/PortfolioHero.tsx
1108
- import React19, { useEffect as useEffect8, useRef as useRef7 } from "react";
1119
+ import React19, { useEffect as useEffect9, useRef as useRef7 } from "react";
1109
1120
  import Link6 from "next/link";
1110
1121
  import Image7 from "next/image";
1111
1122
  import { HugeiconsIcon as HugeiconsIcon9 } from "@hugeicons/react";
1112
1123
  import { ArrowRight01Icon as ArrowRight01Icon2 } from "@hugeicons/core-free-icons";
1113
1124
  var useScrollAnimation = () => {
1114
1125
  const elementRef = useRef7(null);
1115
- useEffect8(() => {
1126
+ useEffect9(() => {
1116
1127
  const el = elementRef.current;
1117
1128
  if (!el) return;
1118
1129
  const observer = new IntersectionObserver(
@@ -1196,7 +1207,7 @@ var PortfolioHero = ({
1196
1207
  };
1197
1208
 
1198
1209
  // src/components/GifFeatureCard.tsx
1199
- import React20, { useState as useState9 } from "react";
1210
+ import React20, { useState as useState10 } from "react";
1200
1211
  import Image8 from "next/image";
1201
1212
  import { HugeiconsIcon as HugeiconsIcon10 } from "@hugeicons/react";
1202
1213
  import { Loading03Icon as Loading03Icon4 } from "@hugeicons/core-free-icons";
@@ -1207,7 +1218,7 @@ var GifFeatureCard = ({
1207
1218
  alt = "Feature animation",
1208
1219
  className = "aspect-video"
1209
1220
  }) => {
1210
- const [isLoading, setIsLoading] = useState9(true);
1221
+ const [isLoading, setIsLoading] = useState10(true);
1211
1222
  return /* @__PURE__ */ React20.createElement("div", { className: `relative w-full bg-black overflow-hidden shadow-2xl ${className}` }, isLoading && /* @__PURE__ */ React20.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-black" }, /* @__PURE__ */ React20.createElement(
1212
1223
  HugeiconsIcon10,
1213
1224
  {
@@ -1240,7 +1251,7 @@ var GifFeatureCard = ({
1240
1251
  };
1241
1252
 
1242
1253
  // src/components/MedicalFeatureStatsBlock.tsx
1243
- import React21, { useState as useState10, useEffect as useEffect9, useRef as useRef8 } from "react";
1254
+ import React21, { useState as useState11, useEffect as useEffect10, useRef as useRef8 } from "react";
1244
1255
  import Image9 from "next/image";
1245
1256
  var MedicalFeatureStatsBlock = ({
1246
1257
  bottomHeadline,
@@ -1249,9 +1260,9 @@ var MedicalFeatureStatsBlock = ({
1249
1260
  trustText,
1250
1261
  stats
1251
1262
  }) => {
1252
- const [isAnimating, setIsAnimating] = useState10(false);
1263
+ const [isAnimating, setIsAnimating] = useState11(false);
1253
1264
  const titleRef = useRef8(null);
1254
- useEffect9(() => {
1265
+ useEffect10(() => {
1255
1266
  const observer = new IntersectionObserver(
1256
1267
  ([entry]) => {
1257
1268
  if (entry.isIntersecting) {
@@ -1290,12 +1301,12 @@ var MedicalFeatureStatsBlock = ({
1290
1301
  };
1291
1302
 
1292
1303
  // src/components/ConsultantShowcase.tsx
1293
- import React22, { useState as useState11 } from "react";
1304
+ import React22, { useState as useState12 } from "react";
1294
1305
  import Image10 from "next/image";
1295
1306
  import { HugeiconsIcon as HugeiconsIcon11 } from "@hugeicons/react";
1296
1307
  import { Loading03Icon as Loading03Icon5 } from "@hugeicons/core-free-icons";
1297
1308
  var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
1298
- const [isLoading, setIsLoading] = useState11(true);
1309
+ const [isLoading, setIsLoading] = useState12(true);
1299
1310
  return /* @__PURE__ */ React22.createElement("div", { className: `absolute inset-0 bg-neutral-800 ${className}` }, isLoading && /* @__PURE__ */ React22.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__ */ React22.createElement(HugeiconsIcon11, { icon: Loading03Icon5, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ React22.createElement(
1300
1311
  Image10,
1301
1312
  {
@@ -1315,9 +1326,9 @@ var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
1315
1326
  var ConsultantShowcase = ({
1316
1327
  profiles
1317
1328
  }) => {
1318
- const [currentIndex, setCurrentIndex] = useState11(0);
1319
- const [touchStart, setTouchStart] = useState11(null);
1320
- const [touchEnd, setTouchEnd] = useState11(null);
1329
+ const [currentIndex, setCurrentIndex] = useState12(0);
1330
+ const [touchStart, setTouchStart] = useState12(null);
1331
+ const [touchEnd, setTouchEnd] = useState12(null);
1321
1332
  const nextSlide = () => {
1322
1333
  setCurrentIndex((prev) => prev === profiles.length - 1 ? 0 : prev + 1);
1323
1334
  };
@@ -1386,7 +1397,7 @@ var ConsultantShowcase = ({
1386
1397
  };
1387
1398
 
1388
1399
  // src/components/ContentGridBlock.tsx
1389
- import React23, { useState as useState12 } from "react";
1400
+ import React23, { useState as useState13 } from "react";
1390
1401
  import Image11 from "next/image";
1391
1402
  import { HugeiconsIcon as HugeiconsIcon12 } from "@hugeicons/react";
1392
1403
  import { Loading03Icon as Loading03Icon6 } from "@hugeicons/core-free-icons";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "5.1.80",
3
+ "version": "5.1.90",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",