@retinalabsllc/zairusjs 5.1.50 → 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.
Files changed (5) hide show
  1. package/dist/index.d.mts +11 -0
  2. package/dist/index.d.ts +11 -0
  3. package/dist/index.js +153 -54
  4. package/dist/index.mjs +167 -66
  5. package/package.json +1 -1
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
@@ -179,7 +179,7 @@ var ThreeDButton = ({
179
179
  {
180
180
  href,
181
181
  onClick,
182
- className: `relative inline-flex items-center justify-center py-2.5 px-8 rounded-full text-neutral-900 text-xs font-semibold transition-all duration-150 select-none group overflow-hidden ${className}`,
182
+ className: `relative inline-flex items-center justify-center py-2.5 px-8 rounded-full text-neutral-900 text-xs font-medium transition-all duration-150 select-none group overflow-hidden ${className}`,
183
183
  style: {
184
184
  backgroundImage: silverBg,
185
185
  backgroundSize: "cover",
@@ -236,7 +236,7 @@ var ThreeDActionButton = ({
236
236
  "aria-label": ariaLabel,
237
237
  className: `
238
238
  relative inline-flex items-center justify-center py-2.5 px-8 rounded-full
239
- text-neutral-900 text-xs font-semibold tracking-widest
239
+ text-neutral-900 text-xs font-medium tracking-widest
240
240
  transition-all duration-150 select-none group outline-none overflow-hidden
241
241
  ${isInteractionDisabled ? "opacity-70 cursor-not-allowed" : "active:translate-y-0.5"}
242
242
  ${className}
@@ -991,7 +991,7 @@ var HeroSection = ({
991
991
  import_link4.default,
992
992
  {
993
993
  href: secondaryCtaHref,
994
- className: "w-full sm:w-60 inline-flex font-semibold items-center justify-center text-[11px] tracking-widest rounded-full px-8 py-3 bg-black/40 backdrop-blur-md text-center text-white text-xs hover:bg-neutral-800 hover:border-neutral-500 outline-none transition-all drop-shadow-lg"
994
+ className: "w-full sm:w-60 inline-flex font-medium items-center justify-center text-[11px] tracking-widest rounded-full px-8 py-3 bg-black/40 backdrop-blur-md text-center text-white text-xs hover:border-neutral-500 outline-none transition-all drop-shadow-lg"
995
995
  },
996
996
  secondaryCtaText
997
997
  )), showApps && appLogos && appLogos.length > 0 && /* @__PURE__ */ import_react10.default.createElement("div", { className: "w-full flex flex-col items-center mt-4" }, appsText && /* @__PURE__ */ import_react10.default.createElement("p", { className: "text-[9px] tracking-[0.2em] text-neutral-300 mb-5 " }, appsText), /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex flex-wrap justify-center items-center gap-6 opacity-90" }, appLogos.map((logo, idx) => /* @__PURE__ */ import_react10.default.createElement("div", { key: idx, className: "relative h-6 w-6 sm:h-8 sm:w-8 flex items-center justify-center cursor-default filter invert" }, /* @__PURE__ */ import_react10.default.createElement(
@@ -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
  ))))))
@@ -1377,7 +1377,7 @@ var ManagedPricingBlock = ({
1377
1377
  {
1378
1378
  key: idx,
1379
1379
  onClick: () => setActiveTabIndex(idx),
1380
- className: `px-4 sm:px-6 py-1.5 sm:py-2 rounded-full text-[11px] sm:text-xs transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-neutral-800 text-white" : "text-neutral-500 hover:text-white hover:bg-neutral-800/50"}`
1380
+ className: `px-4 sm:px-6 py-1.5 sm:py-2 rounded-full text-[11px] sm:text-xs transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-neutral-800 text-white" : "text-neutral-500 hover:text-white /50"}`
1381
1381
  },
1382
1382
  tab.label
1383
1383
  );
@@ -1408,7 +1408,7 @@ var ManagedPricingBlock = ({
1408
1408
  import_link5.default,
1409
1409
  {
1410
1410
  href: plan.ctaHref,
1411
- className: "w-full py-2.5 px-5 rounded-full font-semibold border border-neutral-700 text-center text-white text-xs hover:bg-neutral-800 hover:border-neutral-600 transition-colors mb-6 outline-none block"
1411
+ className: "w-full py-2.5 px-5 rounded-full font-medium border border-neutral-700 text-center text-white text-xs hover:border-neutral-600 transition-colors mb-6 outline-none block"
1412
1412
  },
1413
1413
  plan.ctaText
1414
1414
  ),
@@ -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
@@ -1501,7 +1501,7 @@ var ManagedNotFoundBlock = ({
1501
1501
  import_link6.default,
1502
1502
  {
1503
1503
  href: backLinkHref,
1504
- className: "inline-flex items-center justify-center px-8 py-2.5 border border-neutral-800 text-white hover:bg-neutral-800 transition-colors rounded-full text-[11px] tracking-widest outline-none"
1504
+ className: "inline-flex items-center justify-center px-8 py-2.5 border border-neutral-800 text-white transition-colors rounded-full text-[11px] tracking-widest outline-none"
1505
1505
  },
1506
1506
  backLinkText
1507
1507
  )));
@@ -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
  ))),
@@ -1757,7 +1757,7 @@ var PortfolioHero = ({
1757
1757
  import_link7.default,
1758
1758
  {
1759
1759
  href: secondaryCtaHref,
1760
- className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] rounded-full px-8 py-2.5 border border-neutral-700 transition-colors text-white hover:bg-neutral-700 outline-none"
1760
+ className: "w-full sm:w-auto inline-flex items-center justify-center gap-3 text-[11px] tracking-[0.2em] rounded-full px-8 py-2.5 border border-neutral-700 transition-colors text-white outline-none"
1761
1761
  },
1762
1762
  secondaryCtaText,
1763
1763
  /* @__PURE__ */ import_react29.default.createElement(import_react30.HugeiconsIcon, { icon: import_core_free_icons5.ArrowRight01Icon, size: 16 })
@@ -1881,7 +1881,7 @@ var UniversalSidebar = ({
1881
1881
  "div",
1882
1882
  {
1883
1883
  onClick: handleCopyWallet,
1884
- className: "flex items-center gap-2 bg-neutral-900 rounded-full p-1 pr-3 cursor-pointer hover:bg-neutral-800 transition-colors",
1884
+ className: "flex items-center gap-2 bg-neutral-900 rounded-full p-1 pr-3 cursor-pointer transition-colors",
1885
1885
  title: "Copy Address"
1886
1886
  },
1887
1887
  web3Avatar ? /* @__PURE__ */ import_react33.default.createElement("img", { src: web3Avatar, alt: "Avatar", className: "w-6 h-6 rounded-full bg-neutral-800 object-cover shrink-0" }) : /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-6 h-6 rounded-full bg-neutral-800 flex items-center justify-center text-[9px] text-white shrink-0" }, userInitials.substring(0, 2)),
@@ -1893,7 +1893,7 @@ var UniversalSidebar = ({
1893
1893
  setShowNotifDialog(true);
1894
1894
  setSelectedNotif(null);
1895
1895
  },
1896
- className: "relative w-8 h-8 shrink-0 bg-neutral-900 rounded-full flex items-center justify-center text-neutral-400 hover:text-white hover:bg-neutral-800 transition-all duration-300 outline-none"
1896
+ className: "relative w-8 h-8 shrink-0 bg-neutral-900 rounded-full flex items-center justify-center text-neutral-400 hover:text-white transition-all duration-300 outline-none"
1897
1897
  },
1898
1898
  /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons7.Notification01Icon, size: 14 }),
1899
1899
  unreadNotificationsCount > 0 && /* @__PURE__ */ import_react33.default.createElement("span", { className: "absolute top-2 right-2.5 w-2 h-2 bg-blue-500 rounded-full border border-neutral-900" })
@@ -1901,7 +1901,7 @@ var UniversalSidebar = ({
1901
1901
  import_link8.default,
1902
1902
  {
1903
1903
  href: backUrl,
1904
- className: "w-10 h-10 shrink-0 bg-neutral-900 rounded-full flex items-center justify-center text-neutral-400 hover:text-white hover:bg-neutral-800 transition-all duration-300 outline-none",
1904
+ className: "w-10 h-10 shrink-0 bg-neutral-900 rounded-full flex items-center justify-center text-neutral-400 hover:text-white transition-all duration-300 outline-none",
1905
1905
  "aria-label": "Go Back"
1906
1906
  },
1907
1907
  /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons7.ArrowLeft01Icon, size: 18 })
@@ -1948,7 +1948,7 @@ var UniversalSidebar = ({
1948
1948
  key: item.name,
1949
1949
  href: item.path,
1950
1950
  onClick: (e) => onNavClick ? onNavClick(e, item.path) : void 0,
1951
- className: `flex items-center gap-3 px-3 py-2 rounded-full transition-all outline-none group shrink-0 ${isCurrentRoute ? "bg-neutral-800 text-white" : "text-neutral-400 hover:text-white hover:bg-neutral-800/50"}`,
1951
+ className: `flex items-center gap-3 px-3 py-2 rounded-full transition-all outline-none group shrink-0 ${isCurrentRoute ? "bg-neutral-800 text-white" : "text-neutral-400 hover:text-white /50"}`,
1952
1952
  title: isCollapsed && !isMobileOpen ? item.name : void 0
1953
1953
  },
1954
1954
  /* @__PURE__ */ import_react33.default.createElement(
@@ -1966,7 +1966,7 @@ var UniversalSidebar = ({
1966
1966
  "button",
1967
1967
  {
1968
1968
  onClick: () => setShowLogoutDialog(true),
1969
- className: "w-8 h-8 shrink-0 rounded-full bg-neutral-800 flex items-center justify-center text-neutral-400 hover:text-white hover:bg-neutral-700 transition-all outline-none",
1969
+ className: "w-8 h-8 shrink-0 rounded-full bg-neutral-800 flex items-center justify-center text-neutral-400 hover:text-white transition-all outline-none",
1970
1970
  title: "Secure Logout"
1971
1971
  },
1972
1972
  /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons7.LogoutCircle02Icon, size: 16 })
@@ -1974,7 +1974,7 @@ var UniversalSidebar = ({
1974
1974
  "button",
1975
1975
  {
1976
1976
  onClick: () => setIsCollapsed(!isCollapsed),
1977
- className: "flex items-center justify-center md:justify-start gap-3 w-full p-2.5 rounded-full text-neutral-400 hover:text-white hover:bg-neutral-800 transition-colors outline-none"
1977
+ className: "flex items-center justify-center md:justify-start gap-3 w-full p-2.5 rounded-full text-neutral-400 hover:text-white transition-colors outline-none"
1978
1978
  },
1979
1979
  /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons7.SidebarLeft01Icon, size: 18, className: "shrink-0 text-neutral-500" }),
1980
1980
  !isCollapsed && /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-xs " }, "Collapse")
@@ -1987,7 +1987,7 @@ var UniversalSidebar = ({
1987
1987
  setSelectedNotif(notif);
1988
1988
  onNotificationClick?.(notif);
1989
1989
  },
1990
- className: "p-3 flex items-start gap-3 hover:bg-neutral-800 cursor-pointer transition-colors"
1990
+ className: "p-3 flex items-start gap-3 cursor-pointer transition-colors"
1991
1991
  },
1992
1992
  /* @__PURE__ */ import_react33.default.createElement("div", { className: "mt-1.5 shrink-0" }, !notif.isRead ? /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-1.5 h-1.5 bg-blue-500 rounded-full" }) : /* @__PURE__ */ import_react33.default.createElement("div", { className: "w-1.5 h-1.5 bg-transparent" })),
1993
1993
  /* @__PURE__ */ import_react33.default.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ import_react33.default.createElement("h5", { className: `text-[12px] truncate ${notif.isRead ? "text-neutral-400" : "text-white"}` }, notif.title), /* @__PURE__ */ import_react33.default.createElement("p", { className: "text-[11px] text-neutral-500 truncate mt-0.5" }, notif.message), /* @__PURE__ */ import_react33.default.createElement("span", { className: "text-[9px] text-neutral-600 tracking-widest mt-2 block" }, formatNotifDate(notif.createdAt)))
@@ -1996,7 +1996,7 @@ var UniversalSidebar = ({
1996
1996
  {
1997
1997
  disabled: notificationPage <= 1,
1998
1998
  onClick: () => onNotificationPageChange?.(notificationPage - 1),
1999
- className: "w-7 h-7 flex items-center justify-center rounded-full border border-neutral-700 text-neutral-400 disabled:opacity-30 outline-none hover:bg-neutral-700 hover:text-white transition-colors"
1999
+ className: "w-7 h-7 flex items-center justify-center rounded-full border border-neutral-700 text-neutral-400 disabled:opacity-30 outline-none hover:text-white transition-colors"
2000
2000
  },
2001
2001
  /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons7.ArrowLeft01Icon, size: 12 })
2002
2002
  ), /* @__PURE__ */ import_react33.default.createElement(
@@ -2004,7 +2004,7 @@ var UniversalSidebar = ({
2004
2004
  {
2005
2005
  disabled: notificationPage >= notificationTotalPages || notificationTotalPages === 0,
2006
2006
  onClick: () => onNotificationPageChange?.(notificationPage + 1),
2007
- className: "w-7 h-7 flex items-center justify-center rounded-full border border-neutral-700 text-neutral-400 disabled:opacity-30 outline-none hover:bg-neutral-700 hover:text-white transition-colors"
2007
+ className: "w-7 h-7 flex items-center justify-center rounded-full border border-neutral-700 text-neutral-400 disabled:opacity-30 outline-none hover:text-white transition-colors"
2008
2008
  },
2009
2009
  /* @__PURE__ */ import_react33.default.createElement(import_react34.HugeiconsIcon, { icon: import_core_free_icons7.ArrowRight01Icon, size: 12 })
2010
2010
  ))))), showLogoutDialog && showLogoutAction && /* @__PURE__ */ import_react33.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react33.default.createElement(
@@ -2018,7 +2018,7 @@ var UniversalSidebar = ({
2018
2018
  {
2019
2019
  onClick: () => setShowLogoutDialog(false),
2020
2020
  disabled: isLoggingOut,
2021
- className: "flex-1 py-3 text-[13px] text-neutral-400 hover:bg-neutral-800 hover:text-white transition-colors disabled:opacity-50 outline-none"
2021
+ className: "flex-1 py-3 text-[13px] text-neutral-400 hover:text-white transition-colors disabled:opacity-50 outline-none"
2022
2022
  },
2023
2023
  "Cancel"
2024
2024
  ), /* @__PURE__ */ import_react33.default.createElement(
@@ -2026,7 +2026,7 @@ var UniversalSidebar = ({
2026
2026
  {
2027
2027
  onClick: handleLogoutInitiation,
2028
2028
  disabled: isLoggingOut,
2029
- className: "flex-1 py-3 text-[13px] text-red-400 hover:bg-neutral-800 hover:text-red-300 transition-colors disabled:opacity-50 flex justify-center items-center outline-none"
2029
+ className: "flex-1 py-3 text-[13px] text-red-400 hover:text-red-300 transition-colors disabled:opacity-50 flex justify-center items-center outline-none"
2030
2030
  },
2031
2031
  isLoggingOut ? /* @__PURE__ */ import_react33.default.createElement(ButtonSpinner, null) : "Log Out"
2032
2032
  )))), showInterceptDialog && /* @__PURE__ */ import_react33.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react33.default.createElement(
@@ -2039,14 +2039,14 @@ var UniversalSidebar = ({
2039
2039
  "button",
2040
2040
  {
2041
2041
  onClick: onCancelIntercept,
2042
- className: "flex-1 py-3 text-[13px] text-neutral-400 hover:bg-neutral-800 hover:text-white transition-colors outline-none"
2042
+ className: "flex-1 py-3 text-[13px] text-neutral-400 hover:text-white transition-colors outline-none"
2043
2043
  },
2044
2044
  "Cancel"
2045
2045
  ), /* @__PURE__ */ import_react33.default.createElement(
2046
2046
  "button",
2047
2047
  {
2048
2048
  onClick: onConfirmIntercept,
2049
- className: "flex-1 py-3 text-[13px] text-white hover:bg-neutral-800 transition-colors flex justify-center items-center outline-none"
2049
+ className: "flex-1 py-3 text-[13px] text-white transition-colors flex justify-center items-center outline-none"
2050
2050
  },
2051
2051
  "Leave"
2052
2052
  )))));
@@ -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
@@ -2397,7 +2491,7 @@ var UniversalErrorView = ({
2397
2491
  "button",
2398
2492
  {
2399
2493
  onClick: () => window.location.href = returnUrl,
2400
- className: "px-6 py-2 bg-neutral-800 hover:bg-neutral-700 text-white border border-neutral-700 rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none"
2494
+ className: "px-6 py-2 text-white border border-neutral-700 rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none"
2401
2495
  },
2402
2496
  returnLabel
2403
2497
  ) : (
@@ -2406,14 +2500,14 @@ var UniversalErrorView = ({
2406
2500
  "button",
2407
2501
  {
2408
2502
  onClick: () => window.location.href = returnUrl,
2409
- className: "px-6 py-2 bg-transparent border border-neutral-700 hover:bg-neutral-800 text-neutral-400 hover:text-white rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none"
2503
+ className: "px-6 py-2 bg-transparent border border-neutral-700 text-neutral-400 hover:text-white rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none"
2410
2504
  },
2411
2505
  "Back Home"
2412
2506
  ), /* @__PURE__ */ import_react41.default.createElement(
2413
2507
  "button",
2414
2508
  {
2415
2509
  onClick: onRetry,
2416
- className: "px-6 py-2 bg-white hover:bg-neutral-200 text-black rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none capitalize"
2510
+ className: "px-6 py-2 bg-white text-black rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none capitalize"
2417
2511
  },
2418
2512
  "Refresh ",
2419
2513
  envName
@@ -2439,6 +2533,10 @@ var formatDate = (dateInput) => {
2439
2533
  var formatTime = (dateInput) => {
2440
2534
  return new Date(dateInput).toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit" });
2441
2535
  };
2536
+ var truncateAddress = (address) => {
2537
+ if (!address || address.length < 12) return address;
2538
+ return `${address.substring(0, 6)}...${address.substring(address.length - 4)}`;
2539
+ };
2442
2540
  var UniversalTransactionPage = ({
2443
2541
  headerTitle,
2444
2542
  headerDescription,
@@ -2523,7 +2621,7 @@ var UniversalTransactionPage = ({
2523
2621
  "button",
2524
2622
  {
2525
2623
  onClick: () => setIsDirectionModalOpen(true),
2526
- className: "flex items-center gap-2 whitespace-nowrap border border-neutral-800 px-5 py-2 rounded-full text-[12px] text-neutral-400 hover:text-white hover:bg-neutral-800 transition-colors outline-none"
2624
+ className: "flex items-center gap-2 whitespace-nowrap border border-neutral-800 px-5 py-2 rounded-full text-[12px] text-neutral-400 hover:text-white transition-colors outline-none"
2527
2625
  },
2528
2626
  /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons12.SearchList02Icon, size: 12 }),
2529
2627
  activeDirectionFilter === "ALL" ? "Payment Type" : activeDirectionFilter
@@ -2531,7 +2629,7 @@ var UniversalTransactionPage = ({
2531
2629
  "button",
2532
2630
  {
2533
2631
  onClick: () => setIsTypeModalOpen(true),
2534
- className: "flex items-center gap-2 whitespace-nowrap border border-neutral-800 px-5 py-2 rounded-full text-[12px] text-neutral-400 hover:text-white hover:bg-neutral-800 transition-colors outline-none"
2632
+ className: "flex items-center gap-2 whitespace-nowrap border border-neutral-800 px-5 py-2 rounded-full text-[12px] text-neutral-400 hover:text-white transition-colors outline-none"
2535
2633
  },
2536
2634
  /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons12.ListSettingIcon, size: 14 }),
2537
2635
  activeTypeFilter === "ALL" ? "All Transactions" : activeTypeFilter.replace("_", " ")
@@ -2540,7 +2638,7 @@ var UniversalTransactionPage = ({
2540
2638
  {
2541
2639
  key: tx.id,
2542
2640
  onClick: () => setSelectedTransaction(tx),
2543
- className: "flex items-center justify-between py-4 hover:bg-neutral-800/50 transition-colors cursor-pointer group min-w-0 px-2 -mx-2 rounded-xl"
2641
+ className: "flex items-center justify-between py-4 /50 transition-colors cursor-pointer group min-w-0 px-2 -mx-2 rounded-xl"
2544
2642
  },
2545
2643
  /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center bg-neutral-700 text-white` }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: tx.direction === "CREDIT" ? import_core_free_icons12.ArrowDownRight01Icon : import_core_free_icons12.ArrowUpRight01Icon, size: 18 })), /* @__PURE__ */ import_react43.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react43.default.createElement("p", { className: "text-[13px] text-white truncate" }, getDisplayName(tx)), /* @__PURE__ */ import_react43.default.createElement("p", { className: `text-[13px] text-neutral-400 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, tx.direction === "CREDIT" ? "+" : "-", tx.amount, " ", tx.currency))),
2546
2644
  /* @__PURE__ */ import_react43.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] text-neutral-500" }, formatDate(tx.createdAt)), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] text-neutral-500 capitalize" }, tx.direction.toLowerCase()))
@@ -2560,16 +2658,8 @@ var UniversalTransactionPage = ({
2560
2658
  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"
2561
2659
  },
2562
2660
  /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons12.ArrowRight01Icon, size: 14 })
2563
- )))))), selectedTransaction && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ import_react43.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 max-h-[90vh]" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[15px] text-white tracking-tight" }, "Details"), /* @__PURE__ */ import_react43.default.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-500 hover:text-white transition-colors outline-none" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons12.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-700 text-white` }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: selectedTransaction.direction === "CREDIT" ? import_core_free_icons12.ArrowDownRight01Icon : import_core_free_icons12.ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ import_react43.default.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__ */ import_react43.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-400 px-4 py-1.5 rounded-full border border-neutral-800" }, selectedTransaction.status), selectedTransaction.type === "WALLET_TRANSACTION" && /* @__PURE__ */ import_react43.default.createElement(
2564
- "a",
2565
- {
2566
- href: `https://basescan.org/tx/${selectedTransaction.reference}`,
2567
- target: "_blank",
2568
- rel: "noopener noreferrer",
2569
- className: "text-[11px] text-white mt-4 transition-colors tracking-wide hover:text-neutral-300"
2570
- },
2571
- "View in block explorer"
2572
- )), /* @__PURE__ */ import_react43.default.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Reference ID"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white break-all" }, selectedTransaction.reference)), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Date & Time"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white" }, formatDate(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Transaction Type"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Flow Direction"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
2661
+ )))))), selectedTransaction && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: () => setSelectedTransaction(null) }), /* @__PURE__ */ import_react43.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 max-h-[90vh]" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[15px] text-white tracking-tight" }, "Details"), /* @__PURE__ */ import_react43.default.createElement("button", { onClick: () => setSelectedTransaction(null), className: "text-neutral-500 hover:text-white transition-colors outline-none" }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: import_core_free_icons12.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-6" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex flex-col items-center justify-center mb-4" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: `w-12 h-12 rounded-full flex items-center justify-center mb-4 bg-neutral-700 text-white` }, /* @__PURE__ */ import_react43.default.createElement(import_react44.HugeiconsIcon, { icon: selectedTransaction.direction === "CREDIT" ? import_core_free_icons12.ArrowDownRight01Icon : import_core_free_icons12.ArrowUpRight01Icon, size: 20 })), /* @__PURE__ */ import_react43.default.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__ */ import_react43.default.createElement("span", { className: "text-[9px] tracking-widest text-neutral-400 px-4 py-1.5 rounded-full border border-neutral-800" }, selectedTransaction.status)), /* @__PURE__ */ import_react43.default.createElement("div", { className: "grid grid-cols-1 gap-y-8 gap-x-4 mb-10 mt-6" }, /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Reference ID"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white break-all" }, selectedTransaction.reference)), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Date & Time"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white" }, formatDate(selectedTransaction.createdAt), " at ", formatTime(selectedTransaction.createdAt))), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Transaction Type"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.type.replace("_", " ").toLowerCase())), /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Flow Direction"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white capitalize" }, selectedTransaction.direction.toLowerCase())), selectedTransaction.metadata?.fromAddress && selectedTransaction.metadata?.toAddress && /* @__PURE__ */ import_react43.default.createElement("div", null, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, "Transfer Route"), /* @__PURE__ */ import_react43.default.createElement("div", { className: "flex items-center gap-2 text-[13px] text-white" }, /* @__PURE__ */ import_react43.default.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.fromAddress))), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-neutral-500" }, "\u2192"), /* @__PURE__ */ import_react43.default.createElement("span", { className: "truncate" }, truncateAddress(String(selectedTransaction.metadata.toAddress))))), selectedTransaction.metadata && Object.entries(selectedTransaction.metadata).map(([key, value]) => {
2662
+ if (key === "fromAddress" || key === "toAddress") return null;
2573
2663
  if (value === null || value === void 0 || typeof value === "object") return null;
2574
2664
  const formattedKey = key.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
2575
2665
  return /* @__PURE__ */ import_react43.default.createElement("div", { key }, /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 block mb-2" }, formattedKey), /* @__PURE__ */ import_react43.default.createElement("span", { className: "text-[13px] text-white break-all" }, String(value)));
@@ -2585,9 +2675,18 @@ var UniversalTransactionPage = ({
2585
2675
  "button",
2586
2676
  {
2587
2677
  onClick: () => onReportTransaction && onReportTransaction(selectedTransaction),
2588
- className: "w-full flex items-center font-semibold justify-center py-2.5 rounded-full border border-neutral-700 text-white hover:bg-neutral-800 transition-colors outline-none text-[13px] tracking-wide mt-2"
2678
+ className: "w-full flex items-center font-medium justify-center py-2.5 rounded-full border border-neutral-700 text-white transition-colors outline-none text-[13px] tracking-wide mt-2"
2589
2679
  },
2590
2680
  "Report Transaction"
2681
+ ), selectedTransaction.type === "WALLET_TRANSACTION" && /* @__PURE__ */ import_react43.default.createElement(
2682
+ "a",
2683
+ {
2684
+ href: `https://basescan.org/tx/${selectedTransaction.reference}`,
2685
+ target: "_blank",
2686
+ rel: "noopener noreferrer",
2687
+ className: "w-full flex items-center font-medium justify-center py-2.5 rounded-full border border-neutral-700 text-white transition-colors outline-none text-[13px] tracking-wide mt-2"
2688
+ },
2689
+ "View in block explorer"
2591
2690
  ))))), isDirectionModalOpen && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: () => setIsDirectionModalOpen(false) }), /* @__PURE__ */ import_react43.default.createElement("div", { ref: directionDropdownRef, className: "relative w-72 bg-neutral-900 shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[14px] text-white tracking-tight" }, "Payment Type")), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, ["ALL", "CREDIT", "DEBIT"].map((option) => /* @__PURE__ */ import_react43.default.createElement(
2592
2691
  "button",
2593
2692
  {
@@ -2596,14 +2695,14 @@ var UniversalTransactionPage = ({
2596
2695
  onDirectionFilterChange(option);
2597
2696
  setIsDirectionModalOpen(false);
2598
2697
  },
2599
- className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeDirectionFilter === option ? "bg-neutral-800 text-white" : "text-neutral-400 hover:bg-neutral-800 hover:text-white"}`
2698
+ className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeDirectionFilter === option ? "bg-neutral-800 text-white" : "text-neutral-400 hover:text-white"}`
2600
2699
  },
2601
2700
  /* @__PURE__ */ import_react43.default.createElement("span", { className: "truncate pr-2" }, option.charAt(0).toUpperCase() + option.slice(1).toLowerCase())
2602
2701
  ))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ import_react43.default.createElement(
2603
2702
  "button",
2604
2703
  {
2605
2704
  onClick: () => setIsDirectionModalOpen(false),
2606
- className: "w-full py-3 text-[13px] text-neutral-500 hover:bg-neutral-800 hover:text-white transition-colors outline-none"
2705
+ className: "w-full py-3 text-[13px] text-neutral-500 hover:text-white transition-colors outline-none"
2607
2706
  },
2608
2707
  "Cancel"
2609
2708
  )))), isTypeModalOpen && /* @__PURE__ */ import_react43.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "absolute inset-0 bg-black/60", onClick: () => setIsTypeModalOpen(false) }), /* @__PURE__ */ import_react43.default.createElement("div", { ref: typeDropdownRef, className: "relative w-72 bg-neutral-900 shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ import_react43.default.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ import_react43.default.createElement("h3", { className: "text-[14px] text-white tracking-tight" }, "Transactions Type")), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, [
@@ -2618,14 +2717,14 @@ var UniversalTransactionPage = ({
2618
2717
  onTypeFilterChange(option.value);
2619
2718
  setIsTypeModalOpen(false);
2620
2719
  },
2621
- className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeTypeFilter === option.value ? "bg-neutral-800 text-white" : "text-neutral-400 hover:bg-neutral-800 hover:text-white"}`
2720
+ className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeTypeFilter === option.value ? "bg-neutral-800 text-white" : "text-neutral-400 hover:text-white"}`
2622
2721
  },
2623
2722
  /* @__PURE__ */ import_react43.default.createElement("span", { className: "truncate pr-2" }, option.label.charAt(0).toUpperCase() + option.label.slice(1).toLowerCase())
2624
2723
  ))), /* @__PURE__ */ import_react43.default.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ import_react43.default.createElement(
2625
2724
  "button",
2626
2725
  {
2627
2726
  onClick: () => setIsTypeModalOpen(false),
2628
- className: "w-full py-3 text-[13px] text-neutral-500 hover:bg-neutral-800 hover:text-white transition-colors outline-none"
2727
+ className: "w-full py-3 text-[13px] text-neutral-500 hover:text-white transition-colors outline-none"
2629
2728
  },
2630
2729
  "Cancel"
2631
2730
  )))));
@@ -2716,12 +2815,12 @@ var UniversalHomeView = ({
2716
2815
  }
2717
2816
  },
2718
2817
  /* @__PURE__ */ import_react45.default.createElement("span", { className: "absolute inset-0 bg-linear-to-r from-white/30 to-transparent pointer-events-none" }),
2719
- /* @__PURE__ */ import_react45.default.createElement("span", { className: "relative z-10 flex items-center gap-1.5 leading-none text-[13px] tracking-wide font-semibold drop-shadow-[0_1px_1px_rgba(255,255,255,0.8)]" }, primaryAction.label, primaryAction.icon && /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: primaryAction.icon, size: 16 }))
2818
+ /* @__PURE__ */ import_react45.default.createElement("span", { className: "relative z-10 flex items-center gap-1.5 leading-none text-[13px] tracking-wide font-medium drop-shadow-[0_1px_1px_rgba(255,255,255,0.8)]" }, primaryAction.label, primaryAction.icon && /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: primaryAction.icon, size: 16 }))
2720
2819
  ), secondaryAction && /* @__PURE__ */ import_react45.default.createElement(
2721
2820
  "button",
2722
2821
  {
2723
2822
  onClick: secondaryAction.onClick,
2724
- className: "flex items-center gap-1.5 px-8 py-2 rounded-full border border-neutral-800 text-white transition-colors hover:bg-neutral-800 outline-none"
2823
+ className: "flex items-center gap-1.5 px-8 py-2 rounded-full border border-neutral-800 text-white transition-colors outline-none"
2725
2824
  },
2726
2825
  /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[13px] tracking-wide" }, secondaryAction.label),
2727
2826
  secondaryAction.icon && /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: secondaryAction.icon, size: 16 })
@@ -2730,9 +2829,9 @@ var UniversalHomeView = ({
2730
2829
  {
2731
2830
  key: action.id,
2732
2831
  onClick: action.onClick,
2733
- className: `w-full h-23.75 sm:h-28.75 rounded-2xl bg-neutral-900 hover:bg-neutral-800 p-2.5 sm:p-3 flex flex-col justify-between items-start cursor-pointer active:scale-[0.98] transition-all outline-none`
2832
+ className: `w-full h-23.75 sm:h-28.75 rounded-2xl border border-neutral-800 p-2.5 sm:p-3 flex flex-col justify-between items-start cursor-pointer active:scale-[0.98] transition-all outline-none`
2734
2833
  },
2735
- /* @__PURE__ */ import_react45.default.createElement("div", { className: `w-7 h-7 sm:w-9 sm:h-9 rounded-full flex items-center justify-center bg-neutral-700 text-white}` }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "scale-75 sm:scale-100 text-white flex items-center justify-center" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: action.icon, size: 18 }))),
2834
+ /* @__PURE__ */ import_react45.default.createElement("div", { className: `w-7 h-7 sm:w-9 sm:h-9 rounded-full flex items-center justify-center border border-neutral-800 text-white}` }, /* @__PURE__ */ import_react45.default.createElement("div", { className: "scale-75 sm:scale-100 text-white flex items-center justify-center" }, /* @__PURE__ */ import_react45.default.createElement(import_react46.HugeiconsIcon, { icon: action.icon, size: 18 }))),
2736
2835
  /* @__PURE__ */ import_react45.default.createElement("span", { className: "text-[10px] sm:text-[12px] text-neutral-300 text-left leading-[1.2] whitespace-pre-line mt-1" }, action.label)
2737
2836
  )))), /* @__PURE__ */ import_react45.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react45.default.createElement(
2738
2837
  UniversalTransactionPage,
@@ -2804,7 +2903,7 @@ var UniversalWalletPage = ({
2804
2903
  {
2805
2904
  key: wallet.id,
2806
2905
  onClick: () => setSelectedWallet(wallet),
2807
- className: "flex items-center justify-between py-4 hover:bg-neutral-800/50 transition-colors cursor-pointer group min-w-0 px-2 -mx-2 rounded-xl"
2906
+ className: "flex items-center justify-between py-4 /50 transition-colors cursor-pointer group min-w-0 px-2 -mx-2 rounded-xl"
2808
2907
  },
2809
2908
  /* @__PURE__ */ import_react47.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react47.default.createElement(WalletLogo, { src: wallet.logoSrc, alt: wallet.name }), /* @__PURE__ */ import_react47.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-1" }, /* @__PURE__ */ import_react47.default.createElement("p", { className: "text-[13px] text-white truncate font-medium" }, wallet.name), /* @__PURE__ */ import_react47.default.createElement("p", { className: `text-[13px] text-neutral-400 truncate transition-all duration-300 ${hideBalanceAmounts ? "blur-sm opacity-40 select-none" : ""}` }, wallet.balance, " ", wallet.currency))),
2810
2909
  /* @__PURE__ */ import_react47.default.createElement("div", { className: "shrink-0 flex flex-col items-end gap-1 text-right" }, /* @__PURE__ */ import_react47.default.createElement("span", { className: "text-[10px] tracking-wide text-neutral-400 bg-neutral-800 px-2.5 py-1 rounded-full " }, wallet.network))
@@ -2826,7 +2925,7 @@ var UniversalWalletPage = ({
2826
2925
  "button",
2827
2926
  {
2828
2927
  onClick: () => handleCopy(selectedWallet),
2829
- className: "w-full flex font-semibold items-center justify-center py-2.5 rounded-full border border-neutral-700 text-white hover:bg-neutral-800 outline-none text-[13px] tracking-wide"
2928
+ className: "w-full flex font-medium items-center justify-center py-2.5 rounded-full border border-neutral-700 text-white outline-none text-[13px] tracking-wide"
2830
2929
  },
2831
2930
  "Copy Wallet Address"
2832
2931
  ))))));
@@ -3049,7 +3148,7 @@ var ManagedProjectsBlock = ({
3049
3148
  }
3050
3149
  ), /* @__PURE__ */ import_react57.default.createElement("div", { className: "relative z-10" }, /* @__PURE__ */ import_react57.default.createElement(GridSection, null, tagline && /* @__PURE__ */ import_react57.default.createElement("span", { className: "text-[11px] tracking-[0.4em] text-neutral-500 text-left block" }, tagline), /* @__PURE__ */ import_react57.default.createElement("h1", { className: "text-3xl mt-4 text-white tracking-tight text-left" }, title)), projects.map((project, index) => {
3051
3150
  const isLast = index === projects.length - 1;
3052
- const projectContent = /* @__PURE__ */ import_react57.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react57.default.createElement("h2", { className: "text-[16px] text-white transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react57.default.createElement("span", { className: "text-[11px] text-neutral-500 opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 group-hover:text-white transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ import_react57.default.createElement("span", { className: `text-[9px] px-2.5 py-1 rounded-full tracking-[0.15em] transition-colors ${project.status.toLowerCase() === "production" ? "bg-white text-black" : "bg-neutral-800 text-neutral-400 group-hover:bg-neutral-700 group-hover:text-white"}` }, project.status)), /* @__PURE__ */ import_react57.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 shrink-0" }, project.date)), /* @__PURE__ */ import_react57.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-400 max-w-4xl text-left transition-colors group-hover:text-neutral-300" }, project.description));
3151
+ const projectContent = /* @__PURE__ */ import_react57.default.createElement("div", { className: "group block w-full" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "flex flex-col md:flex-row md:items-center justify-between gap-3 md:gap-4 mb-4 md:mb-5" }, /* @__PURE__ */ import_react57.default.createElement("div", { className: "flex items-center gap-3 md:gap-4" }, /* @__PURE__ */ import_react57.default.createElement("h2", { className: "text-[16px] text-white transition-all flex items-center gap-2" }, project.title, /* @__PURE__ */ import_react57.default.createElement("span", { className: "text-[11px] text-neutral-500 opacity-0 -translate-x-2 group-hover:opacity-100 group-hover:translate-x-0 group-hover:text-white transition-all duration-300" }, project.isExternal ? "\u2197" : "\u2192")), /* @__PURE__ */ import_react57.default.createElement("span", { className: `text-[9px] px-2.5 py-1 rounded-full tracking-[0.15em] transition-colors ${project.status.toLowerCase() === "production" ? "bg-white text-black" : "bg-neutral-800 text-neutral-400 group- group-hover:text-white"}` }, project.status)), /* @__PURE__ */ import_react57.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-500 shrink-0" }, project.date)), /* @__PURE__ */ import_react57.default.createElement("p", { className: "text-[13px] leading-[1.8] text-neutral-400 max-w-4xl text-left transition-colors group-hover:text-neutral-300" }, project.description));
3053
3152
  return /* @__PURE__ */ import_react57.default.createElement(GridSection, { key: project.id || index, isLast, className: isLast ? "py-8 md:py-10 pb-12 md:pb-14" : "py-8 md:py-10" }, project.isExternal ? /* @__PURE__ */ import_react57.default.createElement("a", { href: project.link, target: "_blank", rel: "noopener noreferrer", className: "block outline-none" }, projectContent) : /* @__PURE__ */ import_react57.default.createElement(import_link9.default, { href: project.link, className: "block outline-none" }, projectContent));
3054
3153
  }))));
3055
3154
  };