@retinalabsllc/zairusjs 16.0.30 → 16.0.35

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.js CHANGED
@@ -4010,14 +4010,7 @@ var UniversalReferralPage = ({
4010
4010
  const finalSrc = src || fallbackUrl;
4011
4011
  return /* @__PURE__ */ import_react69.default.createElement("div", { className: `relative shrink-0 rounded-full bg-neutral-100 flex items-center justify-center overflow-hidden border-2 border-white ${sizeClass}` }, !isLoaded && /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.Loading03Icon, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ import_react69.default.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
4012
4012
  };
4013
- return /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react69.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react69.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react69.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-4 mb-6 px-1" }, /* @__PURE__ */ import_react69.default.createElement("div", null, /* @__PURE__ */ import_react69.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-xs text-neutral-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "bg-[#ceff8a] rounded-3xl p-4 relative overflow-hidden flex flex-col min-h-25 w-full mt-2" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "relative z-10 flex flex-col items-start" }, /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[11px] text-black leading-tight mb-1" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-black/60" }, "AFT Balance")), isLoading ? /* @__PURE__ */ import_react69.default.createElement("div", { className: "h-8 w-32 bg-black/10 animate-pulse rounded mt-2" }) : /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-[16px] text-black tracking-tight mt-1" }, referralCoins)), /* @__PURE__ */ import_react69.default.createElement(
4014
- "img",
4015
- {
4016
- src: "https://retinalabs.company/assets/images/gift_box.avif",
4017
- alt: "Rewards",
4018
- className: "absolute bottom-0 right-2 translate-x-1/4 translate-y-[16%] w-28 h-auto object-contain z-0 pointer-events-none drop-shadow-md"
4019
- }
4020
- ))), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-6 p-4 rounded-3xl bg-white w-full" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "border border-neutral-200 rounded-xl p-4 flex items-center justify-between" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ import_react69.default.createElement("div", { className: "h-6 w-24 bg-neutral-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-sm text-black tracking-widest" }, referralCode)), /* @__PURE__ */ import_react69.default.createElement(
4013
+ return /* @__PURE__ */ import_react69.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react69.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react69.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react69.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react69.default.createElement(import_react70.HugeiconsIcon, { icon: import_core_free_icons23.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-4 mb-6 px-1" }, /* @__PURE__ */ import_react69.default.createElement("div", null, /* @__PURE__ */ import_react69.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-xs text-neutral-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ import_react69.default.createElement("div", { className: "bg-[#143731] rounded-3xl p-4 relative overflow-hidden flex flex-col min-h-25 w-full mt-2" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "relative z-10 flex flex-col items-start" }, /* @__PURE__ */ import_react69.default.createElement("p", { className: "text-[11px] text-white leading-tight mb-1" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-white/60" }, "AFT Balance")), isLoading ? /* @__PURE__ */ import_react69.default.createElement("div", { className: "h-8 w-32 bg-white/10 animate-pulse rounded mt-2" }) : /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-lg text-white tracking-tight mt-1" }, referralCoins)))), /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-6 p-4 rounded-3xl bg-white w-full" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "border border-neutral-200 rounded-xl p-4 flex items-center justify-between" }, /* @__PURE__ */ import_react69.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ import_react69.default.createElement("div", { className: "h-6 w-24 bg-neutral-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ import_react69.default.createElement("span", { className: "text-sm text-black tracking-widest" }, referralCode)), /* @__PURE__ */ import_react69.default.createElement(
4021
4014
  "button",
4022
4015
  {
4023
4016
  onClick: handleCopyCode,
@@ -4328,7 +4321,7 @@ var CircularLogo = ({ src, alt, fallbackText }) => {
4328
4321
  onError: () => setHasError(true),
4329
4322
  className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
4330
4323
  }
4331
- )) : /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[10px] text-black uppercase" }, fallbackText.substring(0, 2)));
4324
+ )) : /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[10px] text-black uppercase" }, fallbackText.substring(0, 2)));
4332
4325
  };
4333
4326
  var DEFAULT_NETWORK_REGEX = {
4334
4327
  EVM: /^0x[a-fA-F0-9]{40}$/,
@@ -4507,7 +4500,7 @@ var UniversalBuyCryptoPage = ({
4507
4500
  }
4508
4501
  };
4509
4502
  const isButtonDisabled = isSubmitting || isCalculating || !fiatAmount || !cryptoAmount || !isAddressValid;
4510
- return /* @__PURE__ */ import_react75.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react75.default.createElement(ManagedToaster, null), !hideBackButton && /* @__PURE__ */ import_react75.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react75.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1 mb-6 px-1" }, /* @__PURE__ */ import_react75.default.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Buy Crypto"), /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-neutral-500" }, "Purchase digital assets instantly in your local currency with direct wallet delivery.")), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-6 p-6 sm:p-8 rounded-3xl bg-white w-full" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "relative flex flex-col gap-3" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Pay (", fiatCurrency.code, ")"), isCalculating && activeSource === "CRYPTO" ? /* @__PURE__ */ import_react75.default.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ import_react75.default.createElement(
4503
+ return /* @__PURE__ */ import_react75.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react75.default.createElement(ManagedToaster, null), !hideBackButton && /* @__PURE__ */ import_react75.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react75.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1 mb-6 px-1" }, /* @__PURE__ */ import_react75.default.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Buy Crypto"), /* @__PURE__ */ import_react75.default.createElement("p", { className: "text-xs text-neutral-500" }, "Purchase digital assets instantly in your local currency with direct wallet delivery.")), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-6 p-6 sm:p-8 rounded-3xl bg-white w-full shadow-sm" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "relative flex flex-col gap-3" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Pay (", fiatCurrency.code, ")"), isCalculating && activeSource === "CRYPTO" ? /* @__PURE__ */ import_react75.default.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ import_react75.default.createElement(
4511
4504
  "input",
4512
4505
  {
4513
4506
  type: "text",
@@ -4516,9 +4509,9 @@ var UniversalBuyCryptoPage = ({
4516
4509
  onChange: handleFiatInputChange,
4517
4510
  placeholder: "0.00",
4518
4511
  disabled: isSubmitting,
4519
- className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300 "
4512
+ className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300"
4520
4513
  }
4521
- )), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center gap-2 bg-neutral-50 rounded-full px-3 py-1.5 shrink-0 select-none" }, /* @__PURE__ */ import_react75.default.createElement(CircularLogo, { src: fiatCurrency.logoUrl, alt: fiatCurrency.code, fallbackText: fiatCurrency.code }), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black" }, fiatCurrency.code))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "w-10 h-10 rounded-full bg-white border border-neutral-200 flex items-center justify-center " }, /* @__PURE__ */ import_react75.default.createElement("svg", { className: "w-4 h-4 text-black", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ import_react75.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" })))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Receive"), isCalculating && activeSource === "FIAT" ? /* @__PURE__ */ import_react75.default.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ import_react75.default.createElement(
4514
+ )), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center gap-2 bg-neutral-50 rounded-full px-3 py-1.5 shrink-0 select-none" }, /* @__PURE__ */ import_react75.default.createElement(CircularLogo, { src: fiatCurrency.logoUrl, alt: fiatCurrency.code, fallbackText: fiatCurrency.code }), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black" }, fiatCurrency.code))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "w-10 h-10 rounded-full bg-white border border-neutral-200 flex items-center justify-center" }, /* @__PURE__ */ import_react75.default.createElement("svg", { className: "w-4 h-4 text-black", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ import_react75.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" })))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Receive"), isCalculating && activeSource === "FIAT" ? /* @__PURE__ */ import_react75.default.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ import_react75.default.createElement(
4522
4515
  "input",
4523
4516
  {
4524
4517
  type: "text",
@@ -4527,7 +4520,7 @@ var UniversalBuyCryptoPage = ({
4527
4520
  onChange: handleCryptoInputChange,
4528
4521
  placeholder: "0.00",
4529
4522
  disabled: isSubmitting,
4530
- className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300 "
4523
+ className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300"
4531
4524
  }
4532
4525
  )), /* @__PURE__ */ import_react75.default.createElement(
4533
4526
  "button",
@@ -4538,31 +4531,30 @@ var UniversalBuyCryptoPage = ({
4538
4531
  className: "flex items-center gap-2 bg-neutral-100 hover:bg-neutral-200 transition-colors rounded-full px-1 py-1.5 shrink-0 outline-none"
4539
4532
  },
4540
4533
  /* @__PURE__ */ import_react75.default.createElement(CircularLogo, { src: selectedCrypto.logoUrl, alt: selectedCrypto.code, fallbackText: selectedCrypto.code }),
4541
- /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black" }, selectedCrypto.code),
4534
+ /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black" }, selectedCrypto.code),
4542
4535
  /* @__PURE__ */ import_react75.default.createElement("svg", { className: "w-3.5 h-3.5 text-neutral-500 ml-0.5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ import_react75.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
4543
- ))), rateDisplay && /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center justify-between text-[11px] text-neutral-500 px-1 -mt-2" }, /* @__PURE__ */ import_react75.default.createElement("span", null, "Exchange Rate"), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-black " }, rateDisplay)), !hideRecipientSection && /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-4 pt-2" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1.5" }, /* @__PURE__ */ import_react75.default.createElement("label", { className: "text-[11px] tracking-widest text-neutral-400" }, "Network / Blockchain"), /* @__PURE__ */ import_react75.default.createElement(
4536
+ ))), rateDisplay && /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center justify-between text-[11px] text-neutral-500 px-1 -mt-2" }, /* @__PURE__ */ import_react75.default.createElement("span", null, "Exchange Rate"), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-black" }, rateDisplay)), !hideRecipientSection && /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-6 pt-4 border-t border-neutral-100" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "space-y-2 flex-1 w-full relative" }, /* @__PURE__ */ import_react75.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Network / Blockchain"), /* @__PURE__ */ import_react75.default.createElement(
4544
4537
  "button",
4545
4538
  {
4546
4539
  type: "button",
4547
4540
  onClick: () => !readOnlyRecipientSection && setIsNetworkDialogOpen(true),
4548
4541
  disabled: isSubmitting || selectedCrypto?.networks?.length <= 1 || readOnlyRecipientSection,
4549
- className: `border rounded-full p-3.5 flex items-center justify-between transition-colors text-left outline-none bg-white ${readOnlyRecipientSection ? "border-neutral-100 opacity-80 cursor-not-allowed" : "border-neutral-200 hover:border-black"}`
4542
+ className: `w-full px-2 py-3 text-sm bg-transparent border-b text-black transition-all outline-none flex items-center justify-between ${readOnlyRecipientSection ? "border-neutral-100 cursor-not-allowed" : "border-neutral-200 hover:border-black focus:border-black"}`
4550
4543
  },
4551
- /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ import_react75.default.createElement(CircularLogo, { src: selectedNetwork.logoUrl || selectedCrypto.logoUrl, alt: selectedNetwork.name, fallbackText: selectedNetwork.symbol }), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black " }, selectedNetwork.name)),
4544
+ /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react75.default.createElement(CircularLogo, { src: selectedNetwork.logoUrl || selectedCrypto.logoUrl, alt: selectedNetwork.name, fallbackText: selectedNetwork.symbol }), /* @__PURE__ */ import_react75.default.createElement("span", null, selectedNetwork.name)),
4552
4545
  !readOnlyRecipientSection && selectedCrypto?.networks?.length > 1 && /* @__PURE__ */ import_react75.default.createElement("svg", { className: "w-4 h-4 text-neutral-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ import_react75.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
4553
- )), /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col gap-1.5" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ import_react75.default.createElement("label", { className: "text-[11px] tracking-widest text-neutral-400" }, "Recipient Wallet Address"), isAddressValid !== null && /* @__PURE__ */ import_react75.default.createElement("span", { className: `text-[10px] flex items-center gap-1 ${isAddressValid ? "text-green-600" : "text-red-500"}` }, isAddressValid ? /* @__PURE__ */ import_react75.default.createElement(import_react75.default.Fragment, null, /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.CheckmarkCircle01Icon, size: 12 }), " Valid Address") : "Invalid Address Format")), /* @__PURE__ */ import_react75.default.createElement("div", { className: `border rounded-full p-3.5 flex items-center justify-between transition-all bg-white ${readOnlyRecipientSection ? "border-neutral-100 opacity-80" : isAddressValid === true ? "border-green-500" : isAddressValid === false ? "border-red-400" : "border-neutral-200 focus-within:border-black"}` }, /* @__PURE__ */ import_react75.default.createElement(
4554
- "input",
4546
+ )), /* @__PURE__ */ import_react75.default.createElement(
4547
+ TextInput,
4555
4548
  {
4549
+ label: "Recipient Wallet Address",
4556
4550
  type: "text",
4557
4551
  value: recipientAddress,
4558
- onChange: (e) => setRecipientAddress(e.target.value),
4552
+ onChange: setRecipientAddress,
4559
4553
  placeholder: `Enter your ${selectedNetwork.symbol} address`,
4560
4554
  disabled: isSubmitting || readOnlyRecipientSection,
4561
- spellCheck: "false",
4562
- autoComplete: "off",
4563
- className: `text-xs text-black bg-transparent outline-none w-full placeholder-neutral-300 ${readOnlyRecipientSection ? "cursor-not-allowed" : ""}`
4555
+ readOnly: readOnlyRecipientSection
4564
4556
  }
4565
- )))), /* @__PURE__ */ import_react75.default.createElement("div", { className: "mt-2" }, /* @__PURE__ */ import_react75.default.createElement(
4557
+ )), /* @__PURE__ */ import_react75.default.createElement("div", { className: "mt-4" }, /* @__PURE__ */ import_react75.default.createElement(
4566
4558
  ThreeDActionButton,
4567
4559
  {
4568
4560
  type: "button",
@@ -4588,10 +4580,10 @@ var UniversalBuyCryptoPage = ({
4588
4580
  {
4589
4581
  key: c.code,
4590
4582
  onClick: () => handleCryptoSelect(c),
4591
- className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-neutral-50/50" : "border-transparent"}`
4583
+ className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none ${isSelected ? " bg-neutral-50/50" : ""}`
4592
4584
  },
4593
4585
  /* @__PURE__ */ import_react75.default.createElement(CircularLogo, { src: c.logoUrl, alt: c.name, fallbackText: c.code }),
4594
- /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black truncate" }, c.name), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] text-neutral-400" }, c.code)),
4586
+ /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-sm text-black truncate" }, c.name), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] text-neutral-400" }, c.code)),
4595
4587
  isSelected && /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.CheckmarkCircle02Icon, size: 16, className: "text-black" })
4596
4588
  );
4597
4589
  }))))), isNetworkDialogOpen && /* @__PURE__ */ import_react75.default.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ import_react75.default.createElement("div", { className: "absolute inset-0", onClick: () => setIsNetworkDialogOpen(false) }), /* @__PURE__ */ import_react75.default.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react75.default.createElement(
@@ -4611,10 +4603,10 @@ var UniversalBuyCryptoPage = ({
4611
4603
  setSelectedNetwork(net);
4612
4604
  setIsNetworkDialogOpen(false);
4613
4605
  },
4614
- className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-neutral-50/50" : "border-transparent"}`
4606
+ className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none ${isSelected ? " bg-neutral-50/50" : ""}`
4615
4607
  },
4616
4608
  /* @__PURE__ */ import_react75.default.createElement(CircularLogo, { src: net.logoUrl || selectedCrypto.logoUrl, alt: net.name, fallbackText: net.symbol }),
4617
- /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-xs text-black truncate" }, net.name), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] text-neutral-400" }, net.symbol)),
4609
+ /* @__PURE__ */ import_react75.default.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-sm text-black truncate" }, net.name), /* @__PURE__ */ import_react75.default.createElement("span", { className: "text-[11px] text-neutral-400" }, net.symbol)),
4618
4610
  isSelected && /* @__PURE__ */ import_react75.default.createElement(import_react76.HugeiconsIcon, { icon: import_core_free_icons26.CheckmarkCircle02Icon, size: 16, className: "text-black" })
4619
4611
  );
4620
4612
  }))))));
package/dist/index.mjs CHANGED
@@ -4019,14 +4019,7 @@ var UniversalReferralPage = ({
4019
4019
  const finalSrc = src || fallbackUrl;
4020
4020
  return /* @__PURE__ */ React42.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__ */ React42.createElement(HugeiconsIcon28, { icon: Loading03Icon17, size: 16, className: "animate-spin text-neutral-400 absolute" }), /* @__PURE__ */ React42.createElement("img", { src: finalSrc, alt, onLoad: () => setIsLoaded(true), className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}` }));
4021
4021
  };
4022
- return /* @__PURE__ */ React42.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React42.createElement(ManagedToaster, null), /* @__PURE__ */ React42.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React42.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: ArrowLeft01Icon10, size: 16 }), " Back")), /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-4 mb-6 px-1" }, /* @__PURE__ */ React42.createElement("div", null, /* @__PURE__ */ React42.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ React42.createElement("p", { className: "text-xs text-neutral-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ React42.createElement("div", { className: "bg-[#ceff8a] rounded-3xl p-4 relative overflow-hidden flex flex-col min-h-25 w-full mt-2" }, /* @__PURE__ */ React42.createElement("div", { className: "relative z-10 flex flex-col items-start" }, /* @__PURE__ */ React42.createElement("p", { className: "text-[11px] text-black leading-tight mb-1" }, /* @__PURE__ */ React42.createElement("span", { className: "text-black/60" }, "AFT Balance")), isLoading ? /* @__PURE__ */ React42.createElement("div", { className: "h-8 w-32 bg-black/10 animate-pulse rounded mt-2" }) : /* @__PURE__ */ React42.createElement("span", { className: "text-[16px] text-black tracking-tight mt-1" }, referralCoins)), /* @__PURE__ */ React42.createElement(
4023
- "img",
4024
- {
4025
- src: "https://retinalabs.company/assets/images/gift_box.avif",
4026
- alt: "Rewards",
4027
- className: "absolute bottom-0 right-2 translate-x-1/4 translate-y-[16%] w-28 h-auto object-contain z-0 pointer-events-none drop-shadow-md"
4028
- }
4029
- ))), /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-6 p-4 rounded-3xl bg-white w-full" }, /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React42.createElement("div", { className: "border border-neutral-200 rounded-xl p-4 flex items-center justify-between" }, /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React42.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ React42.createElement("div", { className: "h-6 w-24 bg-neutral-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ React42.createElement("span", { className: "text-sm text-black tracking-widest" }, referralCode)), /* @__PURE__ */ React42.createElement(
4022
+ return /* @__PURE__ */ React42.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React42.createElement(ManagedToaster, null), /* @__PURE__ */ React42.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React42.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React42.createElement(HugeiconsIcon28, { icon: ArrowLeft01Icon10, size: 16 }), " Back")), /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-4 mb-6 px-1" }, /* @__PURE__ */ React42.createElement("div", null, /* @__PURE__ */ React42.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, "Your Referrals"), /* @__PURE__ */ React42.createElement("p", { className: "text-xs text-neutral-500" }, "Invite friends and earn rewards when they verify and activate cards.")), /* @__PURE__ */ React42.createElement("div", { className: "bg-[#143731] rounded-3xl p-4 relative overflow-hidden flex flex-col min-h-25 w-full mt-2" }, /* @__PURE__ */ React42.createElement("div", { className: "relative z-10 flex flex-col items-start" }, /* @__PURE__ */ React42.createElement("p", { className: "text-[11px] text-white leading-tight mb-1" }, /* @__PURE__ */ React42.createElement("span", { className: "text-white/60" }, "AFT Balance")), isLoading ? /* @__PURE__ */ React42.createElement("div", { className: "h-8 w-32 bg-white/10 animate-pulse rounded mt-2" }) : /* @__PURE__ */ React42.createElement("span", { className: "text-lg text-white tracking-tight mt-1" }, referralCoins)))), /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-6 p-4 rounded-3xl bg-white w-full" }, /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React42.createElement("div", { className: "border border-neutral-200 rounded-xl p-4 flex items-center justify-between" }, /* @__PURE__ */ React42.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React42.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400 " }, "Invitation Code"), isLoading && !referralCode ? /* @__PURE__ */ React42.createElement("div", { className: "h-6 w-24 bg-neutral-50 animate-pulse rounded mt-1" }) : /* @__PURE__ */ React42.createElement("span", { className: "text-sm text-black tracking-widest" }, referralCode)), /* @__PURE__ */ React42.createElement(
4030
4023
  "button",
4031
4024
  {
4032
4025
  onClick: handleCopyCode,
@@ -4330,7 +4323,6 @@ import toast11 from "react-hot-toast";
4330
4323
  import { HugeiconsIcon as HugeiconsIcon31 } from "@hugeicons/react";
4331
4324
  import {
4332
4325
  ArrowLeft01Icon as ArrowLeft01Icon12,
4333
- CheckmarkCircle01Icon as CheckmarkCircle01Icon2,
4334
4326
  CheckmarkCircle02Icon
4335
4327
  } from "@hugeicons/core-free-icons";
4336
4328
  var CircularLogo = ({ src, alt, fallbackText }) => {
@@ -4345,7 +4337,7 @@ var CircularLogo = ({ src, alt, fallbackText }) => {
4345
4337
  onError: () => setHasError(true),
4346
4338
  className: `w-full h-full object-cover transition-opacity duration-300 ${isLoaded ? "opacity-100" : "opacity-0"}`
4347
4339
  }
4348
- )) : /* @__PURE__ */ React45.createElement("span", { className: "text-[10px] text-black uppercase" }, fallbackText.substring(0, 2)));
4340
+ )) : /* @__PURE__ */ React45.createElement("span", { className: "text-[10px] text-black uppercase" }, fallbackText.substring(0, 2)));
4349
4341
  };
4350
4342
  var DEFAULT_NETWORK_REGEX = {
4351
4343
  EVM: /^0x[a-fA-F0-9]{40}$/,
@@ -4524,7 +4516,7 @@ var UniversalBuyCryptoPage = ({
4524
4516
  }
4525
4517
  };
4526
4518
  const isButtonDisabled = isSubmitting || isCalculating || !fiatAmount || !cryptoAmount || !isAddressValid;
4527
- return /* @__PURE__ */ React45.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React45.createElement(ManagedToaster, null), !hideBackButton && /* @__PURE__ */ React45.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React45.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React45.createElement(HugeiconsIcon31, { icon: ArrowLeft01Icon12, size: 16 }), " Back")), /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1 mb-6 px-1" }, /* @__PURE__ */ React45.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Buy Crypto"), /* @__PURE__ */ React45.createElement("p", { className: "text-xs text-neutral-500" }, "Purchase digital assets instantly in your local currency with direct wallet delivery.")), /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-6 p-6 sm:p-8 rounded-3xl bg-white w-full" }, /* @__PURE__ */ React45.createElement("div", { className: "relative flex flex-col gap-3" }, /* @__PURE__ */ React45.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Pay (", fiatCurrency.code, ")"), isCalculating && activeSource === "CRYPTO" ? /* @__PURE__ */ React45.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ React45.createElement(
4519
+ return /* @__PURE__ */ React45.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React45.createElement(ManagedToaster, null), !hideBackButton && /* @__PURE__ */ React45.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ React45.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ React45.createElement(HugeiconsIcon31, { icon: ArrowLeft01Icon12, size: 16 }), " Back")), /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1 mb-6 px-1" }, /* @__PURE__ */ React45.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Buy Crypto"), /* @__PURE__ */ React45.createElement("p", { className: "text-xs text-neutral-500" }, "Purchase digital assets instantly in your local currency with direct wallet delivery.")), /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-6 p-6 sm:p-8 rounded-3xl bg-white w-full shadow-sm" }, /* @__PURE__ */ React45.createElement("div", { className: "relative flex flex-col gap-3" }, /* @__PURE__ */ React45.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Pay (", fiatCurrency.code, ")"), isCalculating && activeSource === "CRYPTO" ? /* @__PURE__ */ React45.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ React45.createElement(
4528
4520
  "input",
4529
4521
  {
4530
4522
  type: "text",
@@ -4533,9 +4525,9 @@ var UniversalBuyCryptoPage = ({
4533
4525
  onChange: handleFiatInputChange,
4534
4526
  placeholder: "0.00",
4535
4527
  disabled: isSubmitting,
4536
- className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300 "
4528
+ className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300"
4537
4529
  }
4538
- )), /* @__PURE__ */ React45.createElement("div", { className: "flex items-center gap-2 bg-neutral-50 rounded-full px-3 py-1.5 shrink-0 select-none" }, /* @__PURE__ */ React45.createElement(CircularLogo, { src: fiatCurrency.logoUrl, alt: fiatCurrency.code, fallbackText: fiatCurrency.code }), /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black" }, fiatCurrency.code))), /* @__PURE__ */ React45.createElement("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10" }, /* @__PURE__ */ React45.createElement("div", { className: "w-10 h-10 rounded-full bg-white border border-neutral-200 flex items-center justify-center " }, /* @__PURE__ */ React45.createElement("svg", { className: "w-4 h-4 text-black", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React45.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" })))), /* @__PURE__ */ React45.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Receive"), isCalculating && activeSource === "FIAT" ? /* @__PURE__ */ React45.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ React45.createElement(
4530
+ )), /* @__PURE__ */ React45.createElement("div", { className: "flex items-center gap-2 bg-neutral-50 rounded-full px-3 py-1.5 shrink-0 select-none" }, /* @__PURE__ */ React45.createElement(CircularLogo, { src: fiatCurrency.logoUrl, alt: fiatCurrency.code, fallbackText: fiatCurrency.code }), /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black" }, fiatCurrency.code))), /* @__PURE__ */ React45.createElement("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10" }, /* @__PURE__ */ React45.createElement("div", { className: "w-10 h-10 rounded-full bg-white border border-neutral-200 flex items-center justify-center" }, /* @__PURE__ */ React45.createElement("svg", { className: "w-4 h-4 text-black", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React45.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" })))), /* @__PURE__ */ React45.createElement("div", { className: "border border-neutral-200 rounded-2xl p-4 flex items-center justify-between transition-all focus-within:border-black" }, /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1 flex-1 pr-3 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "You Receive"), isCalculating && activeSource === "FIAT" ? /* @__PURE__ */ React45.createElement("div", { className: "h-7 w-32 bg-neutral-100 animate-pulse rounded-md mt-1" }) : /* @__PURE__ */ React45.createElement(
4539
4531
  "input",
4540
4532
  {
4541
4533
  type: "text",
@@ -4544,7 +4536,7 @@ var UniversalBuyCryptoPage = ({
4544
4536
  onChange: handleCryptoInputChange,
4545
4537
  placeholder: "0.00",
4546
4538
  disabled: isSubmitting,
4547
- className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300 "
4539
+ className: "text-lg sm:text-xl text-black bg-transparent outline-none w-full placeholder-neutral-300"
4548
4540
  }
4549
4541
  )), /* @__PURE__ */ React45.createElement(
4550
4542
  "button",
@@ -4555,31 +4547,30 @@ var UniversalBuyCryptoPage = ({
4555
4547
  className: "flex items-center gap-2 bg-neutral-100 hover:bg-neutral-200 transition-colors rounded-full px-1 py-1.5 shrink-0 outline-none"
4556
4548
  },
4557
4549
  /* @__PURE__ */ React45.createElement(CircularLogo, { src: selectedCrypto.logoUrl, alt: selectedCrypto.code, fallbackText: selectedCrypto.code }),
4558
- /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black" }, selectedCrypto.code),
4550
+ /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black" }, selectedCrypto.code),
4559
4551
  /* @__PURE__ */ React45.createElement("svg", { className: "w-3.5 h-3.5 text-neutral-500 ml-0.5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React45.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
4560
- ))), rateDisplay && /* @__PURE__ */ React45.createElement("div", { className: "flex items-center justify-between text-[11px] text-neutral-500 px-1 -mt-2" }, /* @__PURE__ */ React45.createElement("span", null, "Exchange Rate"), /* @__PURE__ */ React45.createElement("span", { className: "text-black " }, rateDisplay)), !hideRecipientSection && /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-4 pt-2" }, /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1.5" }, /* @__PURE__ */ React45.createElement("label", { className: "text-[11px] tracking-widest text-neutral-400" }, "Network / Blockchain"), /* @__PURE__ */ React45.createElement(
4552
+ ))), rateDisplay && /* @__PURE__ */ React45.createElement("div", { className: "flex items-center justify-between text-[11px] text-neutral-500 px-1 -mt-2" }, /* @__PURE__ */ React45.createElement("span", null, "Exchange Rate"), /* @__PURE__ */ React45.createElement("span", { className: "text-black" }, rateDisplay)), !hideRecipientSection && /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-6 pt-4 border-t border-neutral-100" }, /* @__PURE__ */ React45.createElement("div", { className: "space-y-2 flex-1 w-full relative" }, /* @__PURE__ */ React45.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Network / Blockchain"), /* @__PURE__ */ React45.createElement(
4561
4553
  "button",
4562
4554
  {
4563
4555
  type: "button",
4564
4556
  onClick: () => !readOnlyRecipientSection && setIsNetworkDialogOpen(true),
4565
4557
  disabled: isSubmitting || selectedCrypto?.networks?.length <= 1 || readOnlyRecipientSection,
4566
- className: `border rounded-full p-3.5 flex items-center justify-between transition-colors text-left outline-none bg-white ${readOnlyRecipientSection ? "border-neutral-100 opacity-80 cursor-not-allowed" : "border-neutral-200 hover:border-black"}`
4558
+ className: `w-full px-2 py-3 text-sm bg-transparent border-b text-black transition-all outline-none flex items-center justify-between ${readOnlyRecipientSection ? "border-neutral-100 cursor-not-allowed" : "border-neutral-200 hover:border-black focus:border-black"}`
4567
4559
  },
4568
- /* @__PURE__ */ React45.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React45.createElement(CircularLogo, { src: selectedNetwork.logoUrl || selectedCrypto.logoUrl, alt: selectedNetwork.name, fallbackText: selectedNetwork.symbol }), /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black " }, selectedNetwork.name)),
4560
+ /* @__PURE__ */ React45.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React45.createElement(CircularLogo, { src: selectedNetwork.logoUrl || selectedCrypto.logoUrl, alt: selectedNetwork.name, fallbackText: selectedNetwork.symbol }), /* @__PURE__ */ React45.createElement("span", null, selectedNetwork.name)),
4569
4561
  !readOnlyRecipientSection && selectedCrypto?.networks?.length > 1 && /* @__PURE__ */ React45.createElement("svg", { className: "w-4 h-4 text-neutral-400", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor" }, /* @__PURE__ */ React45.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }))
4570
- )), /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-1.5" }, /* @__PURE__ */ React45.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ React45.createElement("label", { className: "text-[11px] tracking-widest text-neutral-400" }, "Recipient Wallet Address"), isAddressValid !== null && /* @__PURE__ */ React45.createElement("span", { className: `text-[10px] flex items-center gap-1 ${isAddressValid ? "text-green-600" : "text-red-500"}` }, isAddressValid ? /* @__PURE__ */ React45.createElement(React45.Fragment, null, /* @__PURE__ */ React45.createElement(HugeiconsIcon31, { icon: CheckmarkCircle01Icon2, size: 12 }), " Valid Address") : "Invalid Address Format")), /* @__PURE__ */ React45.createElement("div", { className: `border rounded-full p-3.5 flex items-center justify-between transition-all bg-white ${readOnlyRecipientSection ? "border-neutral-100 opacity-80" : isAddressValid === true ? "border-green-500" : isAddressValid === false ? "border-red-400" : "border-neutral-200 focus-within:border-black"}` }, /* @__PURE__ */ React45.createElement(
4571
- "input",
4562
+ )), /* @__PURE__ */ React45.createElement(
4563
+ TextInput,
4572
4564
  {
4565
+ label: "Recipient Wallet Address",
4573
4566
  type: "text",
4574
4567
  value: recipientAddress,
4575
- onChange: (e) => setRecipientAddress(e.target.value),
4568
+ onChange: setRecipientAddress,
4576
4569
  placeholder: `Enter your ${selectedNetwork.symbol} address`,
4577
4570
  disabled: isSubmitting || readOnlyRecipientSection,
4578
- spellCheck: "false",
4579
- autoComplete: "off",
4580
- className: `text-xs text-black bg-transparent outline-none w-full placeholder-neutral-300 ${readOnlyRecipientSection ? "cursor-not-allowed" : ""}`
4571
+ readOnly: readOnlyRecipientSection
4581
4572
  }
4582
- )))), /* @__PURE__ */ React45.createElement("div", { className: "mt-2" }, /* @__PURE__ */ React45.createElement(
4573
+ )), /* @__PURE__ */ React45.createElement("div", { className: "mt-4" }, /* @__PURE__ */ React45.createElement(
4583
4574
  ThreeDActionButton,
4584
4575
  {
4585
4576
  type: "button",
@@ -4605,10 +4596,10 @@ var UniversalBuyCryptoPage = ({
4605
4596
  {
4606
4597
  key: c.code,
4607
4598
  onClick: () => handleCryptoSelect(c),
4608
- className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-neutral-50/50" : "border-transparent"}`
4599
+ className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none ${isSelected ? " bg-neutral-50/50" : ""}`
4609
4600
  },
4610
4601
  /* @__PURE__ */ React45.createElement(CircularLogo, { src: c.logoUrl, alt: c.name, fallbackText: c.code }),
4611
- /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black truncate" }, c.name), /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] text-neutral-400" }, c.code)),
4602
+ /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-sm text-black truncate" }, c.name), /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] text-neutral-400" }, c.code)),
4612
4603
  isSelected && /* @__PURE__ */ React45.createElement(HugeiconsIcon31, { icon: CheckmarkCircle02Icon, size: 16, className: "text-black" })
4613
4604
  );
4614
4605
  }))))), isNetworkDialogOpen && /* @__PURE__ */ React45.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/40" }, /* @__PURE__ */ React45.createElement("div", { className: "absolute inset-0", onClick: () => setIsNetworkDialogOpen(false) }), /* @__PURE__ */ React45.createElement("div", { className: "w-full max-w-sm bg-white rounded-2xl shadow-2xl overflow-hidden relative z-10 animate-in fade-in zoom-in-95 duration-200" }, /* @__PURE__ */ React45.createElement(
@@ -4628,10 +4619,10 @@ var UniversalBuyCryptoPage = ({
4628
4619
  setSelectedNetwork(net);
4629
4620
  setIsNetworkDialogOpen(false);
4630
4621
  },
4631
- className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none border ${isSelected ? "border-black bg-neutral-50/50" : "border-transparent"}`
4622
+ className: `flex items-center gap-4 p-3 rounded-full hover:bg-neutral-50 transition-colors text-left outline-none ${isSelected ? " bg-neutral-50/50" : ""}`
4632
4623
  },
4633
4624
  /* @__PURE__ */ React45.createElement(CircularLogo, { src: net.logoUrl || selectedCrypto.logoUrl, alt: net.name, fallbackText: net.symbol }),
4634
- /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-xs text-black truncate" }, net.name), /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] text-neutral-400" }, net.symbol)),
4625
+ /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col flex-1 min-w-0" }, /* @__PURE__ */ React45.createElement("span", { className: "text-sm text-black truncate" }, net.name), /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] text-neutral-400" }, net.symbol)),
4635
4626
  isSelected && /* @__PURE__ */ React45.createElement(HugeiconsIcon31, { icon: CheckmarkCircle02Icon, size: 16, className: "text-black" })
4636
4627
  );
4637
4628
  }))))));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "16.0.30",
3
+ "version": "16.0.35",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",