@retinalabsllc/zairusjs 5.1.56 → 5.1.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -531,6 +531,17 @@ interface UniversalProfileSettingsProps {
531
531
  memberSince?: string | Date | null;
532
532
  isReadOnly?: boolean;
533
533
  bannerProps?: BannerProps;
534
+ hasPin?: boolean;
535
+ isPinLoading?: boolean;
536
+ onSavePin?: (payload: {
537
+ action: 'create_pin' | 'change_pin';
538
+ oldPin?: string;
539
+ newPin: string;
540
+ }) => Promise<{
541
+ success: boolean;
542
+ error?: string;
543
+ message?: string;
544
+ }>;
534
545
  onSaveProfile: (payload: {
535
546
  firstName: string;
536
547
  lastName: string;
package/dist/index.d.ts CHANGED
@@ -531,6 +531,17 @@ interface UniversalProfileSettingsProps {
531
531
  memberSince?: string | Date | null;
532
532
  isReadOnly?: boolean;
533
533
  bannerProps?: BannerProps;
534
+ hasPin?: boolean;
535
+ isPinLoading?: boolean;
536
+ onSavePin?: (payload: {
537
+ action: 'create_pin' | 'change_pin';
538
+ oldPin?: string;
539
+ newPin: string;
540
+ }) => Promise<{
541
+ success: boolean;
542
+ error?: string;
543
+ message?: string;
544
+ }>;
534
545
  onSaveProfile: (payload: {
535
546
  firstName: string;
536
547
  lastName: string;
package/dist/index.js CHANGED
@@ -1261,7 +1261,7 @@ var ManagedDocument = ({
1261
1261
  "a",
1262
1262
  {
1263
1263
  href: `mailto:${contactEmail}`,
1264
- className: "text-white decoration-neutral-600 decoration-1 underline-offset-4 ml-1 transition-colors hover:decoration-white"
1264
+ className: "text-white decoration-neutral-600 decoration-1 ml-1 transition-colors hover:decoration-white"
1265
1265
  },
1266
1266
  contactEmail
1267
1267
  ))))))
@@ -1477,7 +1477,7 @@ var ManagedBoardBlock = ({
1477
1477
  label: "LinkedIn",
1478
1478
  name: member.name
1479
1479
  }
1480
- ))))))), (contactText || contactEmail) && /* @__PURE__ */ import_react21.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react21.default.createElement("p", { className: "text-[11px] text-neutral-500 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react21.default.createElement("a", { href: `mailto:${contactEmail}`, className: "text-white decoration-white decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
1480
+ ))))))), (contactText || contactEmail) && /* @__PURE__ */ import_react21.default.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ import_react21.default.createElement("p", { className: "text-[11px] text-neutral-500 text-left" }, contactText, contactEmail && /* @__PURE__ */ import_react21.default.createElement("a", { href: `mailto:${contactEmail}`, className: "text-white decoration-white decoration-2 ml-1 transition-colors" }, contactEmail))))));
1481
1481
  };
1482
1482
 
1483
1483
  // src/components/ManagedNotFoundBlock.tsx
@@ -1741,7 +1741,7 @@ var PortfolioHero = ({
1741
1741
  href: socialLinkHref,
1742
1742
  target: "_blank",
1743
1743
  rel: "noopener noreferrer",
1744
- className: "text-[11px] md:text-[14px] text-neutral-300 hover:text-white transition-colors mt-1 underline underline-offset-4 decoration-neutral-700 hover:decoration-white"
1744
+ className: "text-[11px] md:text-[14px] text-neutral-300 hover:text-white transition-colors mt-1 decoration-neutral-700 hover:decoration-white"
1745
1745
  },
1746
1746
  socialLinkText
1747
1747
  ))),
@@ -2274,11 +2274,19 @@ var UniversalProfileSettings = ({
2274
2274
  memberSince,
2275
2275
  isReadOnly = false,
2276
2276
  bannerProps,
2277
+ hasPin = false,
2278
+ isPinLoading = false,
2279
+ onSavePin,
2277
2280
  onSaveProfile
2278
2281
  }) => {
2279
2282
  const [firstName, setFirstName] = (0, import_react39.useState)(initialFirstName);
2280
2283
  const [lastName, setLastName] = (0, import_react39.useState)(initialLastName);
2281
2284
  const [isSubmitting, setIsSubmitting] = (0, import_react39.useState)(false);
2285
+ const [isPinModalOpen, setIsPinModalOpen] = (0, import_react39.useState)(false);
2286
+ const [oldPin, setOldPin] = (0, import_react39.useState)("");
2287
+ const [newPin, setNewPin] = (0, import_react39.useState)("");
2288
+ const [confirmPin, setConfirmPin] = (0, import_react39.useState)("");
2289
+ const [isPinSubmitting, setIsPinSubmitting] = (0, import_react39.useState)(false);
2282
2290
  (0, import_react39.useEffect)(() => {
2283
2291
  setFirstName(initialFirstName || "");
2284
2292
  setLastName(initialLastName || "");
@@ -2307,9 +2315,45 @@ var UniversalProfileSettings = ({
2307
2315
  setIsSubmitting(false);
2308
2316
  }
2309
2317
  };
2318
+ const closePinModal = () => {
2319
+ if (isPinSubmitting) return;
2320
+ setIsPinModalOpen(false);
2321
+ setOldPin("");
2322
+ setNewPin("");
2323
+ setConfirmPin("");
2324
+ };
2325
+ const handlePinInput = (val, setter) => {
2326
+ setter(val.replace(/\D/g, "").substring(0, 4));
2327
+ };
2328
+ const handlePinSubmit = async (e) => {
2329
+ e.preventDefault();
2330
+ if (!onSavePin) return;
2331
+ if (hasPin && oldPin.length !== 4) return import_react_hot_toast6.default.error("Old PIN must be exactly 4 digits.");
2332
+ if (newPin.length !== 4) return import_react_hot_toast6.default.error("New PIN must be exactly 4 digits.");
2333
+ if (newPin !== confirmPin) return import_react_hot_toast6.default.error("New PINs do not match.");
2334
+ setIsPinSubmitting(true);
2335
+ try {
2336
+ const action = hasPin ? "change_pin" : "create_pin";
2337
+ const res = await onSavePin({
2338
+ action,
2339
+ oldPin: hasPin ? oldPin : void 0,
2340
+ newPin
2341
+ });
2342
+ if (res.success) {
2343
+ import_react_hot_toast6.default.success(res.message || "PIN updated successfully.");
2344
+ closePinModal();
2345
+ } else {
2346
+ import_react_hot_toast6.default.error(res.error || "Failed to update PIN.");
2347
+ }
2348
+ } catch (error) {
2349
+ import_react_hot_toast6.default.error("Uh oh! Something went wrong.");
2350
+ } finally {
2351
+ setIsPinSubmitting(false);
2352
+ }
2353
+ };
2310
2354
  const hasChanges = firstName !== initialFirstName || lastName !== initialLastName;
2311
2355
  const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || firstName.trim().length === 0 || lastName.trim().length === 0;
2312
- return /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-neutral-900 gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react39.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("h1", { className: "text-white text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-xs text-neutral-400 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ import_react39.default.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-800 text-neutral-400 rounded-full shrink-0" }, /* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.CircleLock02Icon, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ import_react39.default.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ import_react39.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react39.default.createElement(
2356
+ return /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-neutral-900 gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react39.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("h1", { className: "text-white text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-xs text-neutral-400 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ import_react39.default.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-800 text-neutral-400 rounded-full shrink-0" }, /* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.CircleLock02Icon, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ import_react39.default.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ import_react39.default.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ import_react39.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ import_react39.default.createElement(
2313
2357
  TextInput,
2314
2358
  {
2315
2359
  label: "First Name",
@@ -2336,7 +2380,15 @@ var UniversalProfileSettings = ({
2336
2380
  },
2337
2381
  disabled: true
2338
2382
  }
2339
- ), /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[11px] text-neutral-500 mt-1 truncate" }, "To change your email address, please contact support.")), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Account Status"), /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-xs text-white block truncate" }, accountStatus)), /* @__PURE__ */ import_react39.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Member Since"), /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-xs text-white block truncate" }, memberSince ? new Date(memberSince).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" }) : "N/A"))), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col-reverse sm:flex-row items-center gap-3 sm:gap-4 w-full sm:w-auto shrink-0" }, hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ import_react39.default.createElement(
2383
+ ), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex items-center justify-between mt-1" }, /* @__PURE__ */ import_react39.default.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, "To change your email address, please contact support."), /* @__PURE__ */ import_react39.default.createElement(
2384
+ "button",
2385
+ {
2386
+ type: "button",
2387
+ onClick: () => setIsPinModalOpen(true),
2388
+ className: "text-[11px] text-neutral-400 hover:text-white transition-colors underline-offset-4 outline-none"
2389
+ },
2390
+ "PIN Management Settings"
2391
+ ))), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Account Status"), /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-xs text-white block truncate" }, accountStatus)), /* @__PURE__ */ import_react39.default.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Member Since"), /* @__PURE__ */ import_react39.default.createElement("span", { className: "text-xs text-white block truncate" }, memberSince ? new Date(memberSince).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" }) : "N/A"))), /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col-reverse sm:flex-row items-center gap-3 sm:gap-4 w-full sm:w-auto shrink-0" }, hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ import_react39.default.createElement(
2340
2392
  "button",
2341
2393
  {
2342
2394
  type: "button",
@@ -2356,7 +2408,49 @@ var UniversalProfileSettings = ({
2356
2408
  className: "min-w-32 w-full sm:w-auto"
2357
2409
  },
2358
2410
  "Save Changes"
2359
- ))))));
2411
+ ))))), isPinModalOpen && /* @__PURE__ */ import_react39.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: closePinModal }), /* @__PURE__ */ import_react39.default.createElement("div", { className: "relative w-full max-w-sm bg-neutral-900 rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ import_react39.default.createElement("h3", { className: "text-[15px] text-white tracking-tight" }, hasPin ? "Change PIN" : "Create PIN"), /* @__PURE__ */ import_react39.default.createElement("button", { onClick: closePinModal, disabled: isPinSubmitting, className: "text-neutral-500 hover:text-white transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react39.default.createElement("div", { className: "p-6" }, isPinLoading ? /* @__PURE__ */ import_react39.default.createElement("div", { className: "flex flex-col items-center justify-center py-10" }, /* @__PURE__ */ import_react39.default.createElement(import_react40.HugeiconsIcon, { icon: import_core_free_icons10.Loading03Icon, size: 28, className: "animate-spin text-neutral-500 mb-4" })) : /* @__PURE__ */ import_react39.default.createElement("form", { onSubmit: handlePinSubmit, className: "flex flex-col gap-5" }, hasPin && /* @__PURE__ */ import_react39.default.createElement("div", null, /* @__PURE__ */ import_react39.default.createElement("label", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Old PIN"), /* @__PURE__ */ import_react39.default.createElement(
2412
+ "input",
2413
+ {
2414
+ type: "password",
2415
+ maxLength: 4,
2416
+ disabled: isPinSubmitting,
2417
+ value: oldPin,
2418
+ onChange: (e) => handlePinInput(e.target.value, setOldPin),
2419
+ className: "w-full px-4 py-2.5 bg-neutral-950 border border-neutral-800 rounded-xl text-white text-[13px] outline-none focus:border-neutral-600 transition-colors placeholder-neutral-700 tracking-[0.2em]",
2420
+ placeholder: "\u2022\u2022\u2022\u2022"
2421
+ }
2422
+ )), /* @__PURE__ */ import_react39.default.createElement("div", null, /* @__PURE__ */ import_react39.default.createElement("label", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, hasPin ? "New PIN" : "Enter 4-Digit PIN"), /* @__PURE__ */ import_react39.default.createElement(
2423
+ "input",
2424
+ {
2425
+ type: "password",
2426
+ maxLength: 4,
2427
+ disabled: isPinSubmitting,
2428
+ value: newPin,
2429
+ onChange: (e) => handlePinInput(e.target.value, setNewPin),
2430
+ className: "w-full px-4 py-2.5 bg-neutral-950 border border-neutral-800 rounded-xl text-white text-[13px] outline-none focus:border-neutral-600 transition-colors placeholder-neutral-700 tracking-[0.2em]",
2431
+ placeholder: "\u2022\u2022\u2022\u2022"
2432
+ }
2433
+ )), /* @__PURE__ */ import_react39.default.createElement("div", null, /* @__PURE__ */ import_react39.default.createElement("label", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Retype New PIN"), /* @__PURE__ */ import_react39.default.createElement(
2434
+ "input",
2435
+ {
2436
+ type: "password",
2437
+ maxLength: 4,
2438
+ disabled: isPinSubmitting,
2439
+ value: confirmPin,
2440
+ onChange: (e) => handlePinInput(e.target.value, setConfirmPin),
2441
+ className: "w-full px-4 py-2.5 bg-neutral-950 border border-neutral-800 rounded-xl text-white text-[13px] outline-none focus:border-neutral-600 transition-colors placeholder-neutral-700 tracking-[0.2em]",
2442
+ placeholder: "\u2022\u2022\u2022\u2022"
2443
+ }
2444
+ )), /* @__PURE__ */ import_react39.default.createElement("div", { className: "pt-4" }, /* @__PURE__ */ import_react39.default.createElement(
2445
+ ThreeDActionButton,
2446
+ {
2447
+ type: "submit",
2448
+ disabled: isPinSubmitting || newPin.length !== 4 || confirmPin.length !== 4 || hasPin && oldPin.length !== 4,
2449
+ isLoading: isPinSubmitting,
2450
+ className: "w-full py-3"
2451
+ },
2452
+ hasPin ? "Update PIN" : "Set PIN"
2453
+ )))))));
2360
2454
  };
2361
2455
 
2362
2456
  // src/components/UniversalErrorView.tsx
package/dist/index.mjs CHANGED
@@ -1190,7 +1190,7 @@ var ManagedDocument = ({
1190
1190
  "a",
1191
1191
  {
1192
1192
  href: `mailto:${contactEmail}`,
1193
- className: "text-white decoration-neutral-600 decoration-1 underline-offset-4 ml-1 transition-colors hover:decoration-white"
1193
+ className: "text-white decoration-neutral-600 decoration-1 ml-1 transition-colors hover:decoration-white"
1194
1194
  },
1195
1195
  contactEmail
1196
1196
  ))))))
@@ -1406,7 +1406,7 @@ var ManagedBoardBlock = ({
1406
1406
  label: "LinkedIn",
1407
1407
  name: member.name
1408
1408
  }
1409
- ))))))), (contactText || contactEmail) && /* @__PURE__ */ React15.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React15.createElement("p", { className: "text-[11px] text-neutral-500 text-left" }, contactText, contactEmail && /* @__PURE__ */ React15.createElement("a", { href: `mailto:${contactEmail}`, className: "text-white decoration-white decoration-2 underline-offset-4 ml-1 transition-colors" }, contactEmail))))));
1409
+ ))))))), (contactText || contactEmail) && /* @__PURE__ */ React15.createElement("div", { className: "relative px-5 md:px-12 py-8 md:py-10 pb-12 md:pb-14" }, /* @__PURE__ */ React15.createElement("p", { className: "text-[11px] text-neutral-500 text-left" }, contactText, contactEmail && /* @__PURE__ */ React15.createElement("a", { href: `mailto:${contactEmail}`, className: "text-white decoration-white decoration-2 ml-1 transition-colors" }, contactEmail))))));
1410
1410
  };
1411
1411
 
1412
1412
  // src/components/ManagedNotFoundBlock.tsx
@@ -1670,7 +1670,7 @@ var PortfolioHero = ({
1670
1670
  href: socialLinkHref,
1671
1671
  target: "_blank",
1672
1672
  rel: "noopener noreferrer",
1673
- className: "text-[11px] md:text-[14px] text-neutral-300 hover:text-white transition-colors mt-1 underline underline-offset-4 decoration-neutral-700 hover:decoration-white"
1673
+ className: "text-[11px] md:text-[14px] text-neutral-300 hover:text-white transition-colors mt-1 decoration-neutral-700 hover:decoration-white"
1674
1674
  },
1675
1675
  socialLinkText
1676
1676
  ))),
@@ -2209,7 +2209,9 @@ import React26, { useState as useState15, useEffect as useEffect13 } from "react
2209
2209
  import toast5 from "react-hot-toast";
2210
2210
  import { HugeiconsIcon as HugeiconsIcon14 } from "@hugeicons/react";
2211
2211
  import {
2212
- CircleLock02Icon as CircleLock02Icon2
2212
+ CircleLock02Icon as CircleLock02Icon2,
2213
+ CancelCircleIcon as CancelCircleIcon2,
2214
+ Loading03Icon as Loading03Icon5
2213
2215
  } from "@hugeicons/core-free-icons";
2214
2216
  var UniversalProfileSettings = ({
2215
2217
  initialFirstName,
@@ -2219,11 +2221,19 @@ var UniversalProfileSettings = ({
2219
2221
  memberSince,
2220
2222
  isReadOnly = false,
2221
2223
  bannerProps,
2224
+ hasPin = false,
2225
+ isPinLoading = false,
2226
+ onSavePin,
2222
2227
  onSaveProfile
2223
2228
  }) => {
2224
2229
  const [firstName, setFirstName] = useState15(initialFirstName);
2225
2230
  const [lastName, setLastName] = useState15(initialLastName);
2226
2231
  const [isSubmitting, setIsSubmitting] = useState15(false);
2232
+ const [isPinModalOpen, setIsPinModalOpen] = useState15(false);
2233
+ const [oldPin, setOldPin] = useState15("");
2234
+ const [newPin, setNewPin] = useState15("");
2235
+ const [confirmPin, setConfirmPin] = useState15("");
2236
+ const [isPinSubmitting, setIsPinSubmitting] = useState15(false);
2227
2237
  useEffect13(() => {
2228
2238
  setFirstName(initialFirstName || "");
2229
2239
  setLastName(initialLastName || "");
@@ -2252,9 +2262,45 @@ var UniversalProfileSettings = ({
2252
2262
  setIsSubmitting(false);
2253
2263
  }
2254
2264
  };
2265
+ const closePinModal = () => {
2266
+ if (isPinSubmitting) return;
2267
+ setIsPinModalOpen(false);
2268
+ setOldPin("");
2269
+ setNewPin("");
2270
+ setConfirmPin("");
2271
+ };
2272
+ const handlePinInput = (val, setter) => {
2273
+ setter(val.replace(/\D/g, "").substring(0, 4));
2274
+ };
2275
+ const handlePinSubmit = async (e) => {
2276
+ e.preventDefault();
2277
+ if (!onSavePin) return;
2278
+ if (hasPin && oldPin.length !== 4) return toast5.error("Old PIN must be exactly 4 digits.");
2279
+ if (newPin.length !== 4) return toast5.error("New PIN must be exactly 4 digits.");
2280
+ if (newPin !== confirmPin) return toast5.error("New PINs do not match.");
2281
+ setIsPinSubmitting(true);
2282
+ try {
2283
+ const action = hasPin ? "change_pin" : "create_pin";
2284
+ const res = await onSavePin({
2285
+ action,
2286
+ oldPin: hasPin ? oldPin : void 0,
2287
+ newPin
2288
+ });
2289
+ if (res.success) {
2290
+ toast5.success(res.message || "PIN updated successfully.");
2291
+ closePinModal();
2292
+ } else {
2293
+ toast5.error(res.error || "Failed to update PIN.");
2294
+ }
2295
+ } catch (error) {
2296
+ toast5.error("Uh oh! Something went wrong.");
2297
+ } finally {
2298
+ setIsPinSubmitting(false);
2299
+ }
2300
+ };
2255
2301
  const hasChanges = firstName !== initialFirstName || lastName !== initialLastName;
2256
2302
  const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || firstName.trim().length === 0 || lastName.trim().length === 0;
2257
- return /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-neutral-900 gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React26.createElement(ManagedToaster, null), /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React26.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React26.createElement("h1", { className: "text-white text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ React26.createElement("p", { className: "text-xs text-neutral-400 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ React26.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-800 text-neutral-400 rounded-full shrink-0" }, /* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: CircleLock02Icon2, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ React26.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ React26.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React26.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React26.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React26.createElement(
2303
+ return /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-neutral-900 gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React26.createElement(ManagedToaster, null), /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React26.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React26.createElement("h1", { className: "text-white text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ React26.createElement("p", { className: "text-xs text-neutral-400 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ React26.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-800 text-neutral-400 rounded-full shrink-0" }, /* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: CircleLock02Icon2, size: 18, className: "text-current" }))), bannerProps && /* @__PURE__ */ React26.createElement(Banner, { ...bannerProps }), /* @__PURE__ */ React26.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React26.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React26.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React26.createElement(
2258
2304
  TextInput,
2259
2305
  {
2260
2306
  label: "First Name",
@@ -2281,7 +2327,15 @@ var UniversalProfileSettings = ({
2281
2327
  },
2282
2328
  disabled: true
2283
2329
  }
2284
- ), /* @__PURE__ */ React26.createElement("p", { className: "text-[11px] text-neutral-500 mt-1 truncate" }, "To change your email address, please contact support.")), /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4" }, /* @__PURE__ */ React26.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ React26.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React26.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Account Status"), /* @__PURE__ */ React26.createElement("span", { className: "text-xs text-white block truncate" }, accountStatus)), /* @__PURE__ */ React26.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React26.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Member Since"), /* @__PURE__ */ React26.createElement("span", { className: "text-xs text-white block truncate" }, memberSince ? new Date(memberSince).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" }) : "N/A"))), /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col-reverse sm:flex-row items-center gap-3 sm:gap-4 w-full sm:w-auto shrink-0" }, hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ React26.createElement(
2330
+ ), /* @__PURE__ */ React26.createElement("div", { className: "flex items-center justify-between mt-1" }, /* @__PURE__ */ React26.createElement("p", { className: "text-[11px] text-neutral-500 truncate" }, "To change your email address, please contact support."), /* @__PURE__ */ React26.createElement(
2331
+ "button",
2332
+ {
2333
+ type: "button",
2334
+ onClick: () => setIsPinModalOpen(true),
2335
+ className: "text-[11px] text-neutral-400 hover:text-white transition-colors underline-offset-4 outline-none"
2336
+ },
2337
+ "PIN Management Settings"
2338
+ ))), /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4" }, /* @__PURE__ */ React26.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ React26.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React26.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Account Status"), /* @__PURE__ */ React26.createElement("span", { className: "text-xs text-white block truncate" }, accountStatus)), /* @__PURE__ */ React26.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React26.createElement("span", { className: "text-[11px] text-neutral-500 tracking-[0.2em] block truncate" }, "Member Since"), /* @__PURE__ */ React26.createElement("span", { className: "text-xs text-white block truncate" }, memberSince ? new Date(memberSince).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" }) : "N/A"))), /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col-reverse sm:flex-row items-center gap-3 sm:gap-4 w-full sm:w-auto shrink-0" }, hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ React26.createElement(
2285
2339
  "button",
2286
2340
  {
2287
2341
  type: "button",
@@ -2301,7 +2355,49 @@ var UniversalProfileSettings = ({
2301
2355
  className: "min-w-32 w-full sm:w-auto"
2302
2356
  },
2303
2357
  "Save Changes"
2304
- ))))));
2358
+ ))))), isPinModalOpen && /* @__PURE__ */ React26.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React26.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: closePinModal }), /* @__PURE__ */ React26.createElement("div", { className: "relative w-full max-w-sm bg-neutral-900 rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React26.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 " }, /* @__PURE__ */ React26.createElement("h3", { className: "text-[15px] text-white tracking-tight" }, hasPin ? "Change PIN" : "Create PIN"), /* @__PURE__ */ React26.createElement("button", { onClick: closePinModal, disabled: isPinSubmitting, className: "text-neutral-500 hover:text-white transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: CancelCircleIcon2, size: 18 }))), /* @__PURE__ */ React26.createElement("div", { className: "p-6" }, isPinLoading ? /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col items-center justify-center py-10" }, /* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: Loading03Icon5, size: 28, className: "animate-spin text-neutral-500 mb-4" })) : /* @__PURE__ */ React26.createElement("form", { onSubmit: handlePinSubmit, className: "flex flex-col gap-5" }, hasPin && /* @__PURE__ */ React26.createElement("div", null, /* @__PURE__ */ React26.createElement("label", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Old PIN"), /* @__PURE__ */ React26.createElement(
2359
+ "input",
2360
+ {
2361
+ type: "password",
2362
+ maxLength: 4,
2363
+ disabled: isPinSubmitting,
2364
+ value: oldPin,
2365
+ onChange: (e) => handlePinInput(e.target.value, setOldPin),
2366
+ className: "w-full px-4 py-2.5 bg-neutral-950 border border-neutral-800 rounded-xl text-white text-[13px] outline-none focus:border-neutral-600 transition-colors placeholder-neutral-700 tracking-[0.2em]",
2367
+ placeholder: "\u2022\u2022\u2022\u2022"
2368
+ }
2369
+ )), /* @__PURE__ */ React26.createElement("div", null, /* @__PURE__ */ React26.createElement("label", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, hasPin ? "New PIN" : "Enter 4-Digit PIN"), /* @__PURE__ */ React26.createElement(
2370
+ "input",
2371
+ {
2372
+ type: "password",
2373
+ maxLength: 4,
2374
+ disabled: isPinSubmitting,
2375
+ value: newPin,
2376
+ onChange: (e) => handlePinInput(e.target.value, setNewPin),
2377
+ className: "w-full px-4 py-2.5 bg-neutral-950 border border-neutral-800 rounded-xl text-white text-[13px] outline-none focus:border-neutral-600 transition-colors placeholder-neutral-700 tracking-[0.2em]",
2378
+ placeholder: "\u2022\u2022\u2022\u2022"
2379
+ }
2380
+ )), /* @__PURE__ */ React26.createElement("div", null, /* @__PURE__ */ React26.createElement("label", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Retype New PIN"), /* @__PURE__ */ React26.createElement(
2381
+ "input",
2382
+ {
2383
+ type: "password",
2384
+ maxLength: 4,
2385
+ disabled: isPinSubmitting,
2386
+ value: confirmPin,
2387
+ onChange: (e) => handlePinInput(e.target.value, setConfirmPin),
2388
+ className: "w-full px-4 py-2.5 bg-neutral-950 border border-neutral-800 rounded-xl text-white text-[13px] outline-none focus:border-neutral-600 transition-colors placeholder-neutral-700 tracking-[0.2em]",
2389
+ placeholder: "\u2022\u2022\u2022\u2022"
2390
+ }
2391
+ )), /* @__PURE__ */ React26.createElement("div", { className: "pt-4" }, /* @__PURE__ */ React26.createElement(
2392
+ ThreeDActionButton,
2393
+ {
2394
+ type: "submit",
2395
+ disabled: isPinSubmitting || newPin.length !== 4 || confirmPin.length !== 4 || hasPin && oldPin.length !== 4,
2396
+ isLoading: isPinSubmitting,
2397
+ className: "w-full py-3"
2398
+ },
2399
+ hasPin ? "Update PIN" : "Set PIN"
2400
+ )))))));
2305
2401
  };
2306
2402
 
2307
2403
  // src/components/UniversalErrorView.tsx
@@ -2375,15 +2471,15 @@ import toast6 from "react-hot-toast";
2375
2471
  import {
2376
2472
  ArrowLeft01Icon as ArrowLeft01Icon3,
2377
2473
  ArrowRight01Icon as ArrowRight01Icon4,
2378
- Loading03Icon as Loading03Icon5,
2474
+ Loading03Icon as Loading03Icon6,
2379
2475
  ArrowDownRight01Icon,
2380
2476
  ArrowUpRight01Icon,
2381
2477
  Search01Icon,
2382
2478
  SearchList02Icon,
2383
2479
  ListSettingIcon,
2384
- CancelCircleIcon as CancelCircleIcon2
2480
+ CancelCircleIcon as CancelCircleIcon3
2385
2481
  } from "@hugeicons/core-free-icons";
2386
- var PageSpinner2 = () => /* @__PURE__ */ React28.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon16, { icon: Loading03Icon5, size: 32, className: "animate-spin mb-4 text-white" }));
2482
+ var PageSpinner2 = () => /* @__PURE__ */ React28.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon16, { icon: Loading03Icon6, size: 32, className: "animate-spin mb-4 text-white" }));
2387
2483
  var formatDate = (dateInput) => {
2388
2484
  const d = new Date(dateInput);
2389
2485
  const day = d.getDate();
@@ -2519,7 +2615,7 @@ var UniversalTransactionPage = ({
2519
2615
  className: "p-2 border border-neutral-800 rounded-full text-neutral-500 hover:text-white hover:border-neutral-600 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
2520
2616
  },
2521
2617
  /* @__PURE__ */ React28.createElement(HugeiconsIcon16, { icon: ArrowRight01Icon4, size: 14 })
2522
- )))))), selectedTransaction && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ React28.createElement("div", { className: "relative w-full max-w-sm bg-neutral-900 rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React28.createElement("h3", { className: "text-[15px] text-white tracking-tight" }, "Details"), /* @__PURE__ */ React28.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-500 hover:text-white transition-colors outline-none" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon16, { icon: CancelCircleIcon2, size: 18 }))), /* @__PURE__ */ React28.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ React28.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-700 text-white` }, /* @__PURE__ */ React28.createElement(HugeiconsIcon16, { icon: selectedTransaction.direction === "CREDIT" ? ArrowDownRight01Icon : ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ React28.createElement("h2", { className: `text-2xl text-white mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedTransaction.direction === "CREDIT" ? "+" : "-", selectedTransaction.amount, " ", selectedTransaction.currency), /* @__PURE__ */ React28.createElement("span", { className: "text-[9px] tracking-widest text-neutral-400 px-4 py-1.5 rounded-full border border-neutral-800" }, selectedTransaction.status)), /* @__PURE__ */ React28.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Reference ID"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white break-all" }, selectedTransaction.reference)), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Date & Time"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white" }, formatDate(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Transaction Type"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Flow Direction"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Transfer Route"), /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-2 text-[13px] text-white" }, /* @__PURE__ */ React28.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ React28.createElement("span", { className: "text-neutral-500" }, "\u2192"), /* @__PURE__ */ React28.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
2618
+ )))))), selectedTransaction && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ React28.createElement("div", { className: "relative w-full max-w-sm bg-neutral-900 rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React28.createElement("h3", { className: "text-[15px] text-white tracking-tight" }, "Details"), /* @__PURE__ */ React28.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-500 hover:text-white transition-colors outline-none" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon16, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React28.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ React28.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-700 text-white` }, /* @__PURE__ */ React28.createElement(HugeiconsIcon16, { icon: selectedTransaction.direction === "CREDIT" ? ArrowDownRight01Icon : ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ React28.createElement("h2", { className: `text-2xl text-white mb-2 transition-all duration-300 ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedTransaction.direction === "CREDIT" ? "+" : "-", selectedTransaction.amount, " ", selectedTransaction.currency), /* @__PURE__ */ React28.createElement("span", { className: "text-[9px] tracking-widest text-neutral-400 px-4 py-1.5 rounded-full border border-neutral-800" }, selectedTransaction.status)), /* @__PURE__ */ React28.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Reference ID"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white break-all" }, selectedTransaction.reference)), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Date & Time"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white" }, formatDate(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Transaction Type"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Flow Direction"), /* @__PURE__ */ React28.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Transfer Route"), /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-2 text-[13px] text-white" }, /* @__PURE__ */ React28.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ React28.createElement("span", { className: "text-neutral-500" }, "\u2192"), /* @__PURE__ */ React28.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
2523
2619
  if (key === "fromAddress" || key === "toAddress") return null;
2524
2620
  if (value === null || value === void 0 || typeof value === "object") return null;
2525
2621
  const formattedKey = key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
@@ -2710,13 +2806,13 @@ import React30, { useState as useState18 } from "react";
2710
2806
  import { HugeiconsIcon as HugeiconsIcon18 } from "@hugeicons/react";
2711
2807
  import {
2712
2808
  Search01Icon as Search01Icon2,
2713
- CancelCircleIcon as CancelCircleIcon3,
2714
- Loading03Icon as Loading03Icon6
2809
+ CancelCircleIcon as CancelCircleIcon4,
2810
+ Loading03Icon as Loading03Icon7
2715
2811
  } from "@hugeicons/core-free-icons";
2716
- var PageSpinner3 = () => /* @__PURE__ */ React30.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon18, { icon: Loading03Icon6, size: 32, className: "animate-spin mb-4 text-white" }));
2812
+ var PageSpinner3 = () => /* @__PURE__ */ React30.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon18, { icon: Loading03Icon7, size: 32, className: "animate-spin mb-4 text-white" }));
2717
2813
  var WalletLogo = ({ src, alt, sizeClass = "w-10 h-10" }) => {
2718
2814
  const [isLoaded, setIsLoaded] = useState18(false);
2719
- return /* @__PURE__ */ React30.createElement("div", { className: `relative shrink-0 rounded-full bg-black flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React30.createElement(HugeiconsIcon18, { icon: Loading03Icon6, size: 16, className: "animate-spin text-neutral-600 absolute" }), /* @__PURE__ */ React30.createElement(
2815
+ return /* @__PURE__ */ React30.createElement("div", { className: `relative shrink-0 rounded-full bg-black flex items-center justify-center overflow-hidden ${sizeClass}` }, !isLoaded && /* @__PURE__ */ React30.createElement(HugeiconsIcon18, { icon: Loading03Icon7, size: 16, className: "animate-spin text-neutral-600 absolute" }), /* @__PURE__ */ React30.createElement(
2720
2816
  "img",
2721
2817
  {
2722
2818
  src,
@@ -2778,7 +2874,7 @@ var UniversalWalletPage = ({
2778
2874
  } }), /* @__PURE__ */ React30.createElement("div", { className: "relative w-full max-w-sm bg-neutral-900 rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[90vh]" }, showToast && /* @__PURE__ */ React30.createElement("div", { className: "absolute top-4 left-1/2 -translate-x-1/2 z-50 bg-neutral-800 text-white px-5 py-2.5 rounded-full text-[12px] font-medium tracking-wide shadow-xl animate-in slide-in-from-top-4 fade-in duration-200 pointer-events-none whitespace-nowrap" }, "Address copied to clipboard"), /* @__PURE__ */ React30.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ React30.createElement("h3", { className: "text-[15px] text-white tracking-tight" }, "Wallet Details"), /* @__PURE__ */ React30.createElement("button", { onClick: () => {
2779
2875
  setSelectedWallet(null);
2780
2876
  setShowToast(false);
2781
- }, className: "text-neutral-500 hover:text-white transition-colors outline-none" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon18, { icon: CancelCircleIcon3, size: 18 }))), /* @__PURE__ */ React30.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React30.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14 mb-4" }), /* @__PURE__ */ React30.createElement("h2", { className: `text-2xl text-white mb-2 transition-all duration-300 font-medium ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ React30.createElement("span", { className: "text-[9px] tracking-widest text-neutral-400 px-4 py-1.5 rounded-full border border-neutral-800 uppercase mt-1" }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React30.createElement("div", { className: "w-full flex justify-center mb-6" }, renderQrCode(selectedWallet)), /* @__PURE__ */ React30.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Wallet Address"), /* @__PURE__ */ React30.createElement("span", { className: "text-[13px] text-white break-all font-medium" }, selectedWallet.address)), /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Wallet Name"), /* @__PURE__ */ React30.createElement("span", { className: "text-[13px] text-white" }, selectedWallet.name))), /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React30.createElement(
2877
+ }, className: "text-neutral-500 hover:text-white transition-colors outline-none" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon18, { icon: CancelCircleIcon4, size: 18 }))), /* @__PURE__ */ React30.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6 pt-2" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col items-center justify-center mb-6" }, /* @__PURE__ */ React30.createElement(WalletLogo, { src: selectedWallet.logoSrc, alt: selectedWallet.name, sizeClass: "w-14 h-14 mb-4" }), /* @__PURE__ */ React30.createElement("h2", { className: `text-2xl text-white mb-2 transition-all duration-300 font-medium ${hideBalanceAmounts ? "blur-[6px] opacity-40 select-none" : ""}` }, selectedWallet.balance, " ", selectedWallet.currency), /* @__PURE__ */ React30.createElement("span", { className: "text-[9px] tracking-widest text-neutral-400 px-4 py-1.5 rounded-full border border-neutral-800 uppercase mt-1" }, selectedWallet.network, " NETWORK")), renderQrCode && /* @__PURE__ */ React30.createElement("div", { className: "w-full flex justify-center mb-6" }, renderQrCode(selectedWallet)), /* @__PURE__ */ React30.createElement("div", { className: "grid grid-cols-1 gap-y-6 gap-x-4 mb-10" }, /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Wallet Address"), /* @__PURE__ */ React30.createElement("span", { className: "text-[13px] text-white break-all font-medium" }, selectedWallet.address)), /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Wallet Name"), /* @__PURE__ */ React30.createElement("span", { className: "text-[13px] text-white" }, selectedWallet.name))), /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React30.createElement(
2782
2878
  ThreeDActionButton,
2783
2879
  {
2784
2880
  onClick: () => onDownloadPayId && onDownloadPayId(selectedWallet),
@@ -2882,10 +2978,10 @@ var MedicalFeatureStatsBlock = ({
2882
2978
  import React34, { useState as useState20 } from "react";
2883
2979
  import Image10 from "next/image";
2884
2980
  import { HugeiconsIcon as HugeiconsIcon20 } from "@hugeicons/react";
2885
- import { Loading03Icon as Loading03Icon7 } from "@hugeicons/core-free-icons";
2981
+ import { Loading03Icon as Loading03Icon8 } from "@hugeicons/core-free-icons";
2886
2982
  var ImageWithLoader = ({ src, alt, className, sizes, priority = false }) => {
2887
2983
  const [isLoading, setIsLoading] = useState20(true);
2888
- return /* @__PURE__ */ React34.createElement("div", { className: `absolute inset-0 bg-neutral-900 ${className}` }, isLoading && /* @__PURE__ */ React34.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-900/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon20, { icon: Loading03Icon7, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ React34.createElement(
2984
+ return /* @__PURE__ */ React34.createElement("div", { className: `absolute inset-0 bg-neutral-900 ${className}` }, isLoading && /* @__PURE__ */ React34.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-900/50 backdrop-blur-md transition-opacity duration-300" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon20, { icon: Loading03Icon8, size: 24, className: "animate-spin text-white/50" })), /* @__PURE__ */ React34.createElement(
2889
2985
  Image10,
2890
2986
  {
2891
2987
  src,
@@ -2978,7 +3074,7 @@ var ConsultantShowcase = ({
2978
3074
  import React35, { useState as useState21 } from "react";
2979
3075
  import Image11 from "next/image";
2980
3076
  import { HugeiconsIcon as HugeiconsIcon21 } from "@hugeicons/react";
2981
- import { Loading03Icon as Loading03Icon8 } from "@hugeicons/core-free-icons";
3077
+ import { Loading03Icon as Loading03Icon9 } from "@hugeicons/core-free-icons";
2982
3078
  var ContentGridBlock = ({
2983
3079
  header,
2984
3080
  leftCard,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@retinalabsllc/zairusjs",
3
- "version": "5.1.56",
3
+ "version": "5.1.60",
4
4
  "description": "A perceptive, Ai data driven Next.js UI component library.",
5
5
  "author": "Retina Labs Company",
6
6
  "license": "MIT",