@hfunlabs/hypurr-connect 0.1.11 → 0.1.13

package/dist/index.js

@@ -4,7 +4,6 @@ import {
   HttpTransport
 } from "@hfunlabs/hyperliquid";
 import {
-  PrivateKeySigner,
   signUserSignedAction
 } from "@hfunlabs/hyperliquid/signing";
 import {
@@ -17,6 +16,25 @@ import {
   useState
 } from "react";
 
+// src/privateKeySigner.ts
+import { privateKeyToAccount } from "viem/accounts";
+var PrivateKeySigner = class {
+  #account;
+  address;
+  constructor(privateKey) {
+    this.#account = privateKeyToAccount(normalizePrivateKey(privateKey));
+    this.address = this.#account.address;
+  }
+  signTypedData(params) {
+    return this.#account.signTypedData(
+      params
+    );
+  }
+};
+function normalizePrivateKey(privateKey) {
+  return privateKey.startsWith("0x") ? privateKey : `0x${privateKey}`;
+}
+
 // src/agent.ts
 var AGENT_NAME = "hypurr-connect";
 var AGENT_STORAGE_PREFIX = "hypurr-connect-agent";
@@ -41,8 +59,7 @@ async function generateAgentKey() {
   const bytes = crypto.getRandomValues(new Uint8Array(32));
   const hex = Array.from(bytes).map((b) => b.toString(16).padStart(2, "0")).join("");
   const privateKey = `0x${hex}`;
-  const { PrivateKeySigner: PrivateKeySigner2 } = await import("@hfunlabs/hyperliquid/signing");
-  const signer = new PrivateKeySigner2(privateKey);
+  const signer = new PrivateKeySigner(privateKey);
   return { privateKey, address: signer.address };
 }
 async function fetchActiveAgent(userAddress, isTestnet) {
@@ -188,6 +205,7 @@ var TELEGRAM_AUTH_STATE_KEY = "hypurr-connect-auth-state";
 var TELEGRAM_AUTH_MESSAGE = "hypurr-connect:telegram-auth";
 var DEFAULT_AUTH_HUB_URL = "https://auth.hypurr.fun/login";
 var DEFAULT_MEDIA_URL = "https://media.hypurr.fun";
+var IGNORED_EXTERNAL_SIGNATURE = "0x000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000001b";
 var DEFAULT_TELEGRAM_SCOPES = [
   "telegram:user:read",
   "telegram:wallet:read",
@@ -196,8 +214,19 @@ var DEFAULT_TELEGRAM_SCOPES = [
   "telegram:trade:write",
   "telegram:cabal:read",
   "telegram:cabal:write",
-  "telegram:agent:write"
+  "telegram:agent:write",
+  "telegram:support:read",
+  "telegram:support:write"
 ];
+function createExternalSigningWallet(address) {
+  return {
+    address,
+    signTypedData(params) {
+      void params;
+      return Promise.resolve(IGNORED_EXTERNAL_SIGNATURE);
+    }
+  };
+}
 function isInvalidTelegramAuthError(err) {
   const msg = err instanceof Error ? err.message : typeof err === "object" && err !== null && "message" in err ? String(err.message) : String(err);
   return /invalid telegram auth data|invalid auth token|missing authorization token/i.test(
@@ -207,6 +236,47 @@ function isInvalidTelegramAuthError(err) {
 function normalizeMediaUrl(mediaUrl) {
   return (mediaUrl?.trim() || DEFAULT_MEDIA_URL).replace(/\/+$/, "");
 }
+function isAddress(value) {
+  return !!value && /^0x[a-fA-F0-9]{40}$/.test(value);
+}
+function getRawSignedTransaction(result) {
+  if (typeof result === "string" && result.startsWith("0x")) {
+    return result;
+  }
+  if (!result || typeof result !== "object") return null;
+  const record = result;
+  const candidates = [
+    record.raw,
+    record.rawTransaction,
+    record.signedTransaction,
+    record.serializedTransaction,
+    record.result
+  ];
+  const raw = candidates.find(
+    (value) => typeof value === "string" && value.startsWith("0x")
+  );
+  return raw ? raw : null;
+}
+function decodeJsonBytes(bytes) {
+  const text = new TextDecoder().decode(bytes);
+  if (!text) return null;
+  try {
+    return JSON.parse(text);
+  } catch {
+    return text;
+  }
+}
+function encodeJsonBytes(value) {
+  return new TextEncoder().encode(JSON.stringify(value));
+}
+function withExpectedFrom(transaction, address) {
+  if (transaction.from && transaction.from.toLowerCase() !== address.toLowerCase()) {
+    throw new Error(
+      "[HypurrConnect] EVM transaction `from` does not match the connected wallet."
+    );
+  }
+  return transaction.from ? transaction : { ...transaction, from: address };
+}
 function currentReturnTo() {
   const url = new URL(window.location.href);
   for (const param of [
@@ -474,7 +544,10 @@ function HypurrConnectProvider({
         address: selectedWallet.ethereumAddress,
         walletId: selectedWallet.id,
         displayName: tgUser.telegramUsername ? `@${tgUser.telegramUsername}` : `Telegram ${tgUser.telegramId}`,
-        photoUrl: tgUser.pictureFileId ? `${mediaUrl}/${tgUser.pictureFileId}` : void 0,
+        photoUrl: (() => {
+          const fileId = tgUser.pictureFileId;
+          return fileId ? `${mediaUrl}/${fileId}` : void 0;
+        })(),
         authMethod: "telegram",
         telegramId: String(tgUser.telegramId),
         hfunScore: tgUser?.reputation?.hfunScore,
@@ -525,8 +598,7 @@ function HypurrConnectProvider({
       });
       return new ExchangeClient({
         transport,
-        externalSigning: true,
-        userAddress: user.address
+        wallet: createExternalSigningWallet(user.address)
       });
     }
     if (authMethod === "eoa" && eoaAddress) {
@@ -542,8 +614,7 @@ function HypurrConnectProvider({
         };
         return new ExchangeClient({
           transport: noAgentTransport,
-          externalSigning: true,
-          userAddress: eoaAddress
+          wallet: createExternalSigningWallet(eoaAddress)
         });
       }
       const isTestnet = config.isTestnet ?? false;
@@ -684,6 +755,81 @@ function HypurrConnectProvider({
       setAgent(null);
     }
   }, [eoaAddress]);
+  const signEvmTransaction = useCallback(
+    async (transaction) => {
+      if (authMethod === "eoa") {
+        if (!eoaAddress) {
+          throw new Error("[HypurrConnect] No EOA wallet connected.");
+        }
+        const signer = eoaSignerRef.current;
+        if (!signer) {
+          throw new Error(
+            "[HypurrConnect] No EOA signer available. Pass a signer to connectEoa(address, signer)."
+          );
+        }
+        const tx = withExpectedFrom(transaction, eoaAddress);
+        const result = signer.signTransaction ? await signer.signTransaction(tx) : signer.request ? await signer.request({
+          method: "eth_signTransaction",
+          params: [tx]
+        }) : null;
+        const rawTransaction = getRawSignedTransaction(result);
+        if (!rawTransaction) {
+          throw new Error(
+            "[HypurrConnect] EOA signer did not return a raw transaction."
+          );
+        }
+        return rawTransaction;
+      }
+      if (authMethod === "telegram") {
+        if (!telegramRpcOptions) {
+          throw new Error("[HypurrConnect] No Telegram RPC session available.");
+        }
+        if (!selectedWallet) {
+          throw new Error("[HypurrConnect] No Telegram wallet selected.");
+        }
+        if (selectedWallet.id <= 0 || selectedWallet.isReadOnly || selectedWallet.isAgent) {
+          throw new Error(
+            "[HypurrConnect] Select a Telegram private-key wallet to sign EVM transactions."
+          );
+        }
+        if (!isAddress(selectedWallet.ethereumAddress)) {
+          throw new Error(
+            "[HypurrConnect] Selected Telegram wallet does not have a valid EVM address."
+          );
+        }
+        const tx = withExpectedFrom(
+          transaction,
+          selectedWallet.ethereumAddress
+        );
+        try {
+          const signResponse = await tgClient.eVMSignTransaction(
+            {
+              authData: {},
+              walletId: selectedWallet.id,
+              params: encodeJsonBytes(tx)
+            },
+            telegramRpcOptions
+          );
+          const rawTransaction = getRawSignedTransaction(
+            decodeJsonBytes(signResponse.response.result)
+          );
+          if (!rawTransaction) {
+            throw new Error(
+              "[HypurrConnect] Telegram signer did not return a raw transaction."
+            );
+          }
+          return rawTransaction;
+        } catch (err) {
+          if (isInvalidTelegramAuthError(err)) {
+            onInvalidAuthRef.current?.();
+          }
+          throw err;
+        }
+      }
+      throw new Error("[HypurrConnect] No wallet connected.");
+    },
+    [authMethod, eoaAddress, selectedWallet, telegramRpcOptions, tgClient]
+  );
   const createWallet = useCallback(
     async (name) => {
       const { response } = await tgClient.hyperliquidWalletCreate(
@@ -717,6 +863,20 @@ function HypurrConnectProvider({
     },
     [tgClient, telegramRpcOptions, selectedWalletId, wallets, refreshWallets]
   );
+  const renameWallet = useCallback(
+    async (walletId, name) => {
+      await tgClient.hyperliquidWalletUpdate(
+        {
+          authData: {},
+          walletId,
+          name
+        },
+        telegramRpcOptions
+      );
+      refreshWallets();
+    },
+    [tgClient, telegramRpcOptions, refreshWallets]
+  );
   const createWalletPack = useCallback(
     async (name) => {
       const { response } = await tgClient.telegramChatWalletPackCreate(
@@ -890,12 +1050,12 @@ function HypurrConnectProvider({
   const loginTelegram = useCallback(() => {
     const state = randomState();
     sessionStorage.setItem(TELEGRAM_AUTH_STATE_KEY, state);
-    const configuredReturnTo = config.telegram.returnTo;
+    const configuredReturnTo = config.telegram?.returnTo;
     const returnTo = typeof configuredReturnTo === "function" ? configuredReturnTo() : configuredReturnTo || currentReturnTo();
-    const authUrl = new URL(config.telegram.authHubUrl || DEFAULT_AUTH_HUB_URL);
+    const authUrl = new URL(config.telegram?.authHubUrl || DEFAULT_AUTH_HUB_URL);
     authUrl.searchParams.set("return_to", returnTo);
     authUrl.searchParams.set("state", state);
-    authUrl.searchParams.set("scope", normalizeScopes(config.telegram.scope));
+    authUrl.searchParams.set("scope", normalizeScopes(config.telegram?.scope));
     const width = 520;
     const height = 720;
     const left = window.screenX + Math.max(0, (window.outerWidth - width) / 2);
@@ -918,9 +1078,9 @@ function HypurrConnectProvider({
     }
     window.location.assign(authUrl.toString());
   }, [
-    config.telegram.authHubUrl,
-    config.telegram.returnTo,
-    config.telegram.scope
+    config.telegram?.authHubUrl,
+    config.telegram?.returnTo,
+    config.telegram?.scope
   ]);
   const connectEoa = useCallback(
     (address, signer) => {
@@ -949,7 +1109,13 @@ function HypurrConnectProvider({
           "[HypurrConnect] Cannot approve agent: no EOA wallet connected. Call connectEoa(address) first."
         );
       }
-      eoaSignerRef.current = { signTypedData: signTypedDataAsync, chainId };
+      const currentSigner = eoaSignerRef.current;
+      eoaSignerRef.current = {
+        signTypedData: signTypedDataAsync,
+        signTransaction: currentSigner?.signTransaction,
+        request: currentSigner?.request,
+        chainId
+      };
       setEoaLoading(true);
       setEoaError(null);
       try {
@@ -1052,6 +1218,7 @@ function HypurrConnectProvider({
       selectWallet,
       createWallet,
       deleteWallet,
+      renameWallet,
       refreshWallets,
       packs,
       createWalletPack,
@@ -1068,14 +1235,12 @@ function HypurrConnectProvider({
       closeLoginModal,
       loginTelegram,
       connectEoa,
+      signEvmTransaction,
       approveAgent: approveAgentFn,
       logout,
       agent,
       agentReady,
       clearAgent: handleClearAgent,
-      botId: config.telegram?.botId ?? "",
-      botUsername: config.telegram?.botUsername ?? "",
-      useWidget: config.telegram?.useWidget ?? false,
       authDataMap,
       authToken: tgAuthToken,
       telegramRpcOptions,
@@ -1095,6 +1260,7 @@ function HypurrConnectProvider({
       selectWallet,
       createWallet,
       deleteWallet,
+      renameWallet,
       refreshWallets,
       packs,
       createWalletPack,
@@ -1111,14 +1277,12 @@ function HypurrConnectProvider({
       closeLoginModal,
       loginTelegram,
       connectEoa,
+      signEvmTransaction,
       approveAgentFn,
       logout,
       agent,
       agentReady,
       handleClearAgent,
-      config.telegram?.botId,
-      config.telegram?.botUsername,
-      config.telegram?.useWidget,
       authDataMap,
       tgAuthToken,
       telegramRpcOptions,
@@ -1532,18 +1696,2563 @@ function MobileDrawer({
   ] });
 }
 
+// src/WalletSelectorDropdown.tsx
+import { AnimatePresence as AnimatePresence5, motion as motion5 } from "framer-motion";
+import {
+  Fragment as Fragment5,
+  useCallback as useCallback6,
+  useMemo as useMemo2,
+  useState as useState5
+} from "react";
+
+// src/UserProfileModal.tsx
+import { AnimatePresence as AnimatePresence4, motion as motion4 } from "framer-motion";
+import {
+  useCallback as useCallback5,
+  useState as useState4
+} from "react";
+
+// src/DeleteWalletModal.tsx
+import { AnimatePresence as AnimatePresence2, motion as motion2 } from "framer-motion";
+import {
+  useCallback as useCallback3,
+  useState as useState2
+} from "react";
+
+// src/icons/lucide.tsx
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+function svgBase({
+  size = 16,
+  color = "currentColor",
+  fill = "none",
+  ...rest
+}) {
+  return {
+    width: size,
+    height: size,
+    viewBox: "0 0 24 24",
+    fill,
+    stroke: color,
+    strokeWidth: 2,
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    ...rest
+  };
+}
+function Copy(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2" }),
+    /* @__PURE__ */ jsx5("path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" })
+  ] });
+}
+function Star(props) {
+  return /* @__PURE__ */ jsx5("svg", { ...svgBase(props), children: /* @__PURE__ */ jsx5("polygon", { points: "12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" }) });
+}
+function User(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
+    /* @__PURE__ */ jsx5("circle", { cx: "12", cy: "7", r: "4" })
+  ] });
+}
+function Zap(props) {
+  return /* @__PURE__ */ jsx5("svg", { ...svgBase(props), children: /* @__PURE__ */ jsx5("polygon", { points: "13 2 3 14 12 14 11 22 21 10 12 10 13 2" }) });
+}
+function Wallet(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M20 12V8H6a2 2 0 0 1-2-2c0-1.1.9-2 2-2h12v4" }),
+    /* @__PURE__ */ jsx5("path", { d: "M4 6v12c0 1.1.9 2 2 2h14v-4" }),
+    /* @__PURE__ */ jsx5("path", { d: "M18 12a2 2 0 0 0-2 2c0 1.1.9 2 2 2h4v-4z" })
+  ] });
+}
+function TrendingUp(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("polyline", { points: "22 7 13.5 15.5 8.5 10.5 2 17" }),
+    /* @__PURE__ */ jsx5("polyline", { points: "16 7 22 7 22 13" })
+  ] });
+}
+function Trash2(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M3 6h18" }),
+    /* @__PURE__ */ jsx5("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }),
+    /* @__PURE__ */ jsx5("path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }),
+    /* @__PURE__ */ jsx5("line", { x1: "10", x2: "10", y1: "11", y2: "17" }),
+    /* @__PURE__ */ jsx5("line", { x1: "14", x2: "14", y1: "11", y2: "17" })
+  ] });
+}
+function Pencil(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }),
+    /* @__PURE__ */ jsx5("path", { d: "m15 5 4 4" })
+  ] });
+}
+function LayoutDashboard(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("rect", { width: "7", height: "9", x: "3", y: "3", rx: "1" }),
+    /* @__PURE__ */ jsx5("rect", { width: "7", height: "5", x: "14", y: "3", rx: "1" }),
+    /* @__PURE__ */ jsx5("rect", { width: "7", height: "9", x: "14", y: "12", rx: "1" }),
+    /* @__PURE__ */ jsx5("rect", { width: "7", height: "5", x: "3", y: "16", rx: "1" })
+  ] });
+}
+function AlertTriangle(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+    /* @__PURE__ */ jsx5("line", { x1: "12", x2: "12", y1: "9", y2: "13" }),
+    /* @__PURE__ */ jsx5("line", { x1: "12", x2: "12.01", y1: "17", y2: "17" })
+  ] });
+}
+function Loader2(props) {
+  const { size = 16, color = "currentColor", style, ...rest } = props;
+  return /* @__PURE__ */ jsx5(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: color,
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      style: {
+        animation: "hypurr-spin 1s linear infinite",
+        ...style
+      },
+      ...rest,
+      children: /* @__PURE__ */ jsx5("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
+    }
+  );
+}
+function Crown(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M11.562 3.266a.5.5 0 0 1 .876 0L15.39 8.87a1 1 0 0 0 1.516.294L21.183 5.5a.5.5 0 0 1 .798.519l-2.834 10.246a1 1 0 0 1-.956.734H5.81a1 1 0 0 1-.957-.734L2.02 6.02a.5.5 0 0 1 .798-.519l4.276 3.664a1 1 0 0 0 1.516-.294z" }),
+    /* @__PURE__ */ jsx5("path", { d: "M5 21h14" })
+  ] });
+}
+function Folder(props) {
+  return /* @__PURE__ */ jsx5("svg", { ...svgBase(props), children: /* @__PURE__ */ jsx5("path", { d: "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }) });
+}
+function LogOut(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }),
+    /* @__PURE__ */ jsx5("polyline", { points: "16 17 21 12 16 7" }),
+    /* @__PURE__ */ jsx5("line", { x1: "21", x2: "9", y1: "12", y2: "12" })
+  ] });
+}
+function Plus(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M5 12h14" }),
+    /* @__PURE__ */ jsx5("path", { d: "M12 5v14" })
+  ] });
+}
+function X(props) {
+  return /* @__PURE__ */ jsxs4("svg", { ...svgBase(props), children: [
+    /* @__PURE__ */ jsx5("path", { d: "M18 6 6 18" }),
+    /* @__PURE__ */ jsx5("path", { d: "m6 6 12 12" })
+  ] });
+}
+function SpinKeyframes() {
+  return /* @__PURE__ */ jsx5("style", { children: `@keyframes hypurr-spin { to { transform: rotate(360deg); } }` });
+}
+
+// src/profileStyles.ts
+var profileColors = {
+  accent: "#a855f7",
+  panel: "rgba(14,18,24,0.8)",
+  panelSolid: "#0e1218",
+  backdrop: "rgba(0,0,0,0.7)",
+  border: "#1f2937",
+  surfaceBtn: "#0D1219",
+  surfaceBtnHover: "#15171A",
+  surfaceBtnActive: "#1E2124",
+  surfaceBd: "#262A30",
+  surfaceBdHover: "#444548",
+  surfaceBdActive: "#4B4D50",
+  text: "#ffffff",
+  muted: "#aab1c1",
+  subdued: "#7d8597",
+  disabled: "#4b5563",
+  danger: "#f87171",
+  dangerStrong: "#ef4444",
+  purple: "#d8b4fe",
+  yellow: "#eab308"
+};
+var fontFamily = {
+  sans: "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif",
+  mono: "Google Sans Code, Roboto Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"
+};
+var colorWithAlpha = (color, alpha) => {
+  const hex = color.trim();
+  const shortHex = /^#([0-9a-f]{3})$/i.exec(hex);
+  const longHex = /^#([0-9a-f]{6})$/i.exec(hex);
+  if (shortHex) {
+    const [r, g, b] = shortHex[1].split("").map((value) => value + value);
+    return `rgba(${parseInt(r, 16)},${parseInt(g, 16)},${parseInt(b, 16)},${alpha})`;
+  }
+  if (longHex) {
+    const value = longHex[1];
+    return `rgba(${parseInt(value.slice(0, 2), 16)},${parseInt(
+      value.slice(2, 4),
+      16
+    )},${parseInt(value.slice(4, 6), 16)},${alpha})`;
+  }
+  return `color-mix(in srgb, ${color} ${Math.round(alpha * 100)}%, transparent)`;
+};
+var resolvePrincipalColors = (accentColor, overrides = {}) => {
+  const hasCustomAccent = !!accentColor || !!overrides.accent;
+  const accent = overrides.accent ?? accentColor ?? profileColors.accent;
+  const accentText = overrides.accentText ?? (hasCustomAccent ? accent : profileColors.purple);
+  return {
+    accent,
+    accentText,
+    accentBackground: overrides.accentBackground ?? colorWithAlpha(accent, 0.1),
+    accentBorder: overrides.accentBorder ?? colorWithAlpha(accent, 0.25),
+    accentHoverBackground: overrides.accentHoverBackground ?? colorWithAlpha(accent, 0.1)
+  };
+};
+var modalBackdropStyle = (zIndex) => ({
+  position: "fixed",
+  inset: 0,
+  zIndex,
+  background: profileColors.backdrop,
+  backdropFilter: "blur(4px)",
+  WebkitBackdropFilter: "blur(4px)"
+});
+var modalWrapperStyle2 = (zIndex, padding = 0) => ({
+  position: "fixed",
+  inset: 0,
+  zIndex,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  padding
+});
+var modalPanelStyle = (solid = false) => ({
+  position: "relative",
+  width: "100%",
+  maxWidth: 448,
+  background: solid ? profileColors.panelSolid : profileColors.panel,
+  backdropFilter: solid ? void 0 : "blur(10px)",
+  WebkitBackdropFilter: solid ? void 0 : "blur(10px)",
+  border: `1px solid ${profileColors.border}`,
+  borderRadius: 8,
+  boxShadow: "0 25px 50px -12px rgba(0,0,0,0.6)",
+  overflow: "hidden",
+  fontFamily: fontFamily.sans
+});
+var modalHeaderStyle = {
+  position: "relative",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: "24px 24px 20px",
+  borderBottom: `1px solid ${profileColors.border}`
+};
+var titleStyle = {
+  margin: 0,
+  fontSize: 14,
+  lineHeight: "1.25rem",
+  fontWeight: 600,
+  color: profileColors.text
+};
+var closeBtnStyle = (disabled = false) => ({
+  position: "absolute",
+  right: 24,
+  background: "transparent",
+  border: "none",
+  color: profileColors.muted,
+  cursor: disabled ? "not-allowed" : "pointer",
+  padding: 0,
+  display: "flex",
+  opacity: disabled ? 0.4 : 1,
+  transition: "color 150ms"
+});
+var upperLabelStyle = {
+  fontSize: 11,
+  lineHeight: "1rem",
+  fontWeight: 500,
+  textTransform: "uppercase",
+  letterSpacing: "0.1em"
+};
+var raisedButtonStyle = (state = "default") => {
+  if (state === "active") {
+    return {
+      backgroundColor: profileColors.surfaceBtnActive,
+      backgroundImage: "linear-gradient(to bottom, rgba(255,255,255,0.05), transparent)",
+      boxShadow: "inset 0 1px 0 rgba(255,255,255,0.18), inset 0 -1px 0 rgba(0,0,0,0.45), inset 0 0 0 1px #4B4D50, 0 1px 2px rgba(0,0,0,0.5)",
+      color: profileColors.text,
+      border: "none"
+    };
+  }
+  if (state === "disabled") {
+    return {
+      backgroundColor: profileColors.surfaceBtn,
+      backgroundImage: "linear-gradient(to bottom, rgba(255,255,255,0.02), transparent)",
+      boxShadow: "inset 0 1px 0 rgba(255,255,255,0.05), inset 0 -1px 0 rgba(0,0,0,0.25), inset 0 0 0 1px #1c2026",
+      color: profileColors.subdued,
+      border: "none",
+      cursor: "not-allowed"
+    };
+  }
+  if (state === "hover") {
+    return {
+      backgroundColor: profileColors.surfaceBtnHover,
+      backgroundImage: "linear-gradient(to bottom, rgba(255,255,255,0.04), transparent)",
+      boxShadow: "inset 0 1px 0 rgba(255,255,255,0.14), inset 0 -1px 0 rgba(0,0,0,0.40), inset 0 0 0 1px #444548",
+      color: "#d1d5db",
+      border: "none"
+    };
+  }
+  return {
+    backgroundColor: profileColors.surfaceBtn,
+    backgroundImage: "linear-gradient(to bottom, rgba(255,255,255,0.03), transparent)",
+    boxShadow: "inset 0 1px 0 rgba(255,255,255,0.10), inset 0 -1px 0 rgba(0,0,0,0.35), inset 0 0 0 1px #262A30",
+    color: profileColors.muted,
+    border: "none"
+  };
+};
+var dangerOutlineButtonStyle = (enabled, hovered = false) => ({
+  background: enabled && hovered ? "rgba(248,113,113,0.1)" : "transparent",
+  border: `1px solid ${enabled ? profileColors.danger : "#374151"}`,
+  color: enabled ? profileColors.danger : profileColors.disabled,
+  cursor: enabled ? "pointer" : "not-allowed"
+});
+
+// src/DeleteWalletModal.tsx
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+var DANGER_BG = "rgba(248,113,113,0.07)";
+var DANGER_BORDER = "rgba(248,113,113,0.2)";
+var backdropStyle2 = modalBackdropStyle(110);
+var wrapperStyle = modalWrapperStyle2(111, 16);
+var panelStyle = {
+  ...modalPanelStyle(true),
+  border: `1px solid ${profileColors.surfaceBd}`
+};
+var headerStyle = {
+  ...modalHeaderStyle,
+  borderBottom: "1px solid rgba(255,255,255,0.06)"
+};
+var bodyStyle = {
+  padding: "20px 24px",
+  display: "flex",
+  flexDirection: "column",
+  gap: 16
+};
+var warningBoxStyle = {
+  display: "flex",
+  alignItems: "flex-start",
+  gap: 12,
+  padding: 14,
+  background: DANGER_BG,
+  border: `1px solid ${DANGER_BORDER}`,
+  borderRadius: 8
+};
+var infoBoxStyle = {
+  padding: "10px 12px",
+  background: "rgba(255,255,255,0.03)",
+  border: "1px solid rgba(255,255,255,0.06)",
+  borderRadius: 8
+};
+var labelStyle = {
+  display: "block",
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  color: profileColors.muted,
+  marginBottom: 8
+};
+var inputStyle = (disabled) => ({
+  width: "100%",
+  background: "rgba(13,18,25,0.9)",
+  border: `1px solid ${profileColors.surfaceBd}`,
+  borderRadius: 8,
+  padding: "10px 12px",
+  color: profileColors.text,
+  fontFamily: fontFamily.mono,
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  outline: "none",
+  opacity: disabled ? 0.5 : 1,
+  boxSizing: "border-box",
+  transition: "border-color 150ms, background-color 150ms"
+});
+var footerStyle = {
+  padding: "0 24px 24px"
+};
+var deleteButtonStyle = (enabled, hovered) => ({
+  ...dangerOutlineButtonStyle(enabled, hovered),
+  width: "100%",
+  padding: "8px 0",
+  borderRadius: 8,
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  fontWeight: 500,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  gap: 8,
+  transition: "background-color 150ms, color 150ms, border-color 150ms"
+});
+function DeleteWalletModal({
+  isOpen,
+  onClose,
+  wallet,
+  onConfirm,
+  onNotify
+}) {
+  const [confirmName, setConfirmName] = useState2("");
+  const [isDeleting, setIsDeleting] = useState2(false);
+  const [error, setError] = useState2(null);
+  const [deleteHovered, setDeleteHovered] = useState2(false);
+  const walletName = wallet?.name || "Unnamed Wallet";
+  const isNameMatch = confirmName === walletName;
+  const canDelete = isNameMatch && !isDeleting;
+  const handleClose = useCallback3(() => {
+    if (isDeleting) return;
+    setConfirmName("");
+    setError(null);
+    onClose();
+  }, [isDeleting, onClose]);
+  const handleDelete = useCallback3(async () => {
+    if (!wallet || !isNameMatch) return;
+    setError(null);
+    setIsDeleting(true);
+    try {
+      await onConfirm(wallet.id);
+      setConfirmName("");
+      onNotify?.({ type: "success", message: "Wallet deleted successfully" });
+      onClose();
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to delete wallet");
+    } finally {
+      setIsDeleting(false);
+    }
+  }, [wallet, isNameMatch, onConfirm, onClose, onNotify]);
+  return /* @__PURE__ */ jsx6(AnimatePresence2, { children: isOpen && wallet && /* @__PURE__ */ jsxs5(Fragment2, { children: [
+    /* @__PURE__ */ jsx6(SpinKeyframes, {}),
+    /* @__PURE__ */ jsx6(
+      motion2.div,
+      {
+        style: backdropStyle2,
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0 },
+        transition: { duration: 0.15 },
+        onClick: handleClose
+      },
+      "backdrop"
+    ),
+    /* @__PURE__ */ jsx6("div", { style: wrapperStyle, children: /* @__PURE__ */ jsxs5(
+      motion2.div,
+      {
+        style: panelStyle,
+        initial: { opacity: 0, y: 8 },
+        animate: { opacity: 1, y: 0 },
+        exit: { opacity: 0, y: 8 },
+        transition: { duration: 0.18, ease: "easeOut" },
+        onClick: (e) => e.stopPropagation(),
+        children: [
+          /* @__PURE__ */ jsxs5("div", { style: headerStyle, children: [
+            /* @__PURE__ */ jsx6("h3", { style: titleStyle, children: "Delete Wallet" }),
+            /* @__PURE__ */ jsx6(
+              "button",
+              {
+                onClick: handleClose,
+                disabled: isDeleting,
+                style: closeBtnStyle(isDeleting),
+                "aria-label": "Close",
+                children: /* @__PURE__ */ jsx6(X, { size: 16 })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs5("div", { style: bodyStyle, children: [
+            /* @__PURE__ */ jsxs5("div", { style: warningBoxStyle, children: [
+              /* @__PURE__ */ jsx6(
+                AlertTriangle,
+                {
+                  size: 15,
+                  color: profileColors.danger,
+                  style: { flexShrink: 0, marginTop: 2 }
+                }
+              ),
+              /* @__PURE__ */ jsxs5("div", { children: [
+                /* @__PURE__ */ jsx6(
+                  "p",
+                  {
+                    style: {
+                      margin: 0,
+                      fontSize: 12.5,
+                      lineHeight: "1rem",
+                      color: profileColors.danger,
+                      fontWeight: 500
+                    },
+                    children: "This action cannot be undone"
+                  }
+                ),
+                /* @__PURE__ */ jsx6(
+                  "p",
+                  {
+                    style: {
+                      margin: "2px 0 0",
+                      fontSize: 12.5,
+                      lineHeight: "1rem",
+                      color: "rgba(248,113,113,0.7)"
+                    },
+                    children: "The private key will be permanently deleted. Any remaining funds will be inaccessible."
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs5("div", { style: infoBoxStyle, children: [
+              /* @__PURE__ */ jsx6(
+                "p",
+                {
+                  style: {
+                    margin: "0 0 4px",
+                    color: profileColors.muted,
+                    ...upperLabelStyle
+                  },
+                  children: "Wallet to delete"
+                }
+              ),
+              /* @__PURE__ */ jsx6(
+                "p",
+                {
+                  style: {
+                    margin: 0,
+                    fontSize: 12.5,
+                    lineHeight: "1rem",
+                    fontWeight: 500,
+                    color: profileColors.text
+                  },
+                  children: walletName
+                }
+              ),
+              /* @__PURE__ */ jsx6(
+                "p",
+                {
+                  style: {
+                    margin: "2px 0 0",
+                    fontSize: 12.5,
+                    lineHeight: "1rem",
+                    color: profileColors.muted,
+                    fontFamily: fontFamily.mono,
+                    wordBreak: "break-all"
+                  },
+                  children: wallet.ethereumAddress
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs5("div", { children: [
+              /* @__PURE__ */ jsxs5("label", { style: labelStyle, children: [
+                "Type",
+                " ",
+                /* @__PURE__ */ jsxs5(
+                  "span",
+                  {
+                    style: {
+                      color: profileColors.text,
+                      fontWeight: 500
+                    },
+                    children: [
+                      '"',
+                      walletName,
+                      '"'
+                    ]
+                  }
+                ),
+                " ",
+                "to confirm"
+              ] }),
+              /* @__PURE__ */ jsx6(
+                "input",
+                {
+                  type: "text",
+                  value: confirmName,
+                  onChange: (e) => setConfirmName(e.target.value),
+                  placeholder: walletName,
+                  disabled: isDeleting,
+                  style: inputStyle(isDeleting)
+                }
+              )
+            ] }),
+            error && /* @__PURE__ */ jsxs5(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  alignItems: "flex-start",
+                  gap: 8,
+                  padding: 12,
+                  background: "rgba(248,113,113,0.08)",
+                  border: `1px solid ${DANGER_BORDER}`,
+                  borderRadius: 8
+                },
+                children: [
+                  /* @__PURE__ */ jsx6(
+                    AlertTriangle,
+                    {
+                      size: 14,
+                      color: profileColors.danger,
+                      style: { flexShrink: 0, marginTop: 2 }
+                    }
+                  ),
+                  /* @__PURE__ */ jsx6(
+                    "p",
+                    {
+                      style: {
+                        margin: 0,
+                        fontSize: 12.5,
+                        lineHeight: "1rem",
+                        color: profileColors.danger
+                      },
+                      children: error
+                    }
+                  )
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx6("div", { style: footerStyle, children: /* @__PURE__ */ jsx6(
+            "button",
+            {
+              onClick: handleDelete,
+              disabled: !canDelete,
+              onMouseEnter: () => setDeleteHovered(true),
+              onMouseLeave: () => setDeleteHovered(false),
+              style: deleteButtonStyle(canDelete, deleteHovered),
+              children: isDeleting ? /* @__PURE__ */ jsxs5(Fragment2, { children: [
+                /* @__PURE__ */ jsx6(Loader2, { size: 14 }),
+                " Deleting..."
+              ] }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
+                /* @__PURE__ */ jsx6(Trash2, { size: 14 }),
+                " Delete Wallet"
+              ] })
+            }
+          ) })
+        ]
+      },
+      "panel"
+    ) })
+  ] }) });
+}
+
+// src/RenameWalletModal.tsx
+import { AnimatePresence as AnimatePresence3, motion as motion3 } from "framer-motion";
+import {
+  useCallback as useCallback4,
+  useEffect as useEffect2,
+  useState as useState3
+} from "react";
+import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+var DANGER_BORDER2 = "rgba(248,113,113,0.2)";
+var WALLET_NAME_REGEX = /^[a-zA-Z0-9/]+$/;
+var backdropStyle3 = modalBackdropStyle(110);
+var wrapperStyle2 = modalWrapperStyle2(111, 16);
+var panelStyle2 = {
+  ...modalPanelStyle(true),
+  border: `1px solid ${profileColors.surfaceBd}`
+};
+var headerStyle2 = {
+  ...modalHeaderStyle,
+  borderBottom: "1px solid rgba(255,255,255,0.06)"
+};
+var bodyStyle2 = {
+  padding: "20px 24px",
+  display: "flex",
+  flexDirection: "column",
+  gap: 16
+};
+var infoBoxStyle2 = {
+  padding: "10px 12px",
+  background: "rgba(255,255,255,0.03)",
+  border: "1px solid rgba(255,255,255,0.06)",
+  borderRadius: 8
+};
+var labelStyle2 = {
+  display: "block",
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  color: profileColors.muted,
+  marginBottom: 8
+};
+var inputStyle2 = (hasError, disabled) => ({
+  width: "100%",
+  background: "rgba(13,18,25,0.9)",
+  border: `1px solid ${hasError ? "rgba(248,113,113,0.5)" : profileColors.surfaceBd}`,
+  borderRadius: 8,
+  padding: "10px 12px",
+  color: profileColors.text,
+  fontFamily: fontFamily.mono,
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  outline: "none",
+  opacity: disabled ? 0.5 : 1,
+  boxSizing: "border-box",
+  transition: "border-color 150ms, background-color 150ms"
+});
+var footerStyle2 = {
+  padding: "0 24px 24px"
+};
+var saveButtonStyle = (enabled, hovered) => ({
+  ...raisedButtonStyle(enabled ? hovered ? "hover" : "default" : "disabled"),
+  width: "100%",
+  padding: "8px 0",
+  borderRadius: 8,
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  fontWeight: 500,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  gap: 8
+});
+function RenameWalletModal({
+  isOpen,
+  onClose,
+  wallet,
+  onConfirm,
+  onNotify
+}) {
+  const [name, setName] = useState3("");
+  const [isRenaming, setIsRenaming] = useState3(false);
+  const [error, setError] = useState3(null);
+  const [saveHovered, setSaveHovered] = useState3(false);
+  const currentName = wallet?.name || "Unnamed";
+  const trimmedName = name.trim();
+  const isNameChanged = trimmedName !== currentName;
+  const isNameValid = WALLET_NAME_REGEX.test(trimmedName);
+  const canSubmit = isNameValid && isNameChanged && !isRenaming;
+  useEffect2(() => {
+    if (!wallet) return;
+    setName(wallet.name || "");
+    setError(null);
+  }, [wallet]);
+  const handleClose = useCallback4(() => {
+    if (isRenaming) return;
+    setError(null);
+    onClose();
+  }, [isRenaming, onClose]);
+  const handleRename = useCallback4(async () => {
+    if (!wallet || !isNameValid || !isNameChanged) return;
+    setError(null);
+    setIsRenaming(true);
+    try {
+      await onConfirm(wallet.id, trimmedName);
+      onNotify?.({ type: "success", message: "Wallet renamed successfully" });
+      onClose();
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to rename wallet");
+    } finally {
+      setIsRenaming(false);
+    }
+  }, [
+    wallet,
+    isNameValid,
+    isNameChanged,
+    onConfirm,
+    trimmedName,
+    onClose,
+    onNotify
+  ]);
+  return /* @__PURE__ */ jsx7(AnimatePresence3, { children: isOpen && wallet && /* @__PURE__ */ jsxs6(Fragment3, { children: [
+    /* @__PURE__ */ jsx7(SpinKeyframes, {}),
+    /* @__PURE__ */ jsx7(
+      motion3.div,
+      {
+        style: backdropStyle3,
+        initial: { opacity: 0 },
+        animate: { opacity: 1 },
+        exit: { opacity: 0 },
+        transition: { duration: 0.15 },
+        onClick: handleClose
+      },
+      "backdrop"
+    ),
+    /* @__PURE__ */ jsx7("div", { style: wrapperStyle2, children: /* @__PURE__ */ jsxs6(
+      motion3.div,
+      {
+        style: panelStyle2,
+        initial: { opacity: 0, y: 8 },
+        animate: { opacity: 1, y: 0 },
+        exit: { opacity: 0, y: 8 },
+        transition: { duration: 0.18, ease: "easeOut" },
+        onClick: (e) => e.stopPropagation(),
+        children: [
+          /* @__PURE__ */ jsxs6("div", { style: headerStyle2, children: [
+            /* @__PURE__ */ jsx7("h3", { style: titleStyle, children: "Rename Wallet" }),
+            /* @__PURE__ */ jsx7(
+              "button",
+              {
+                onClick: handleClose,
+                disabled: isRenaming,
+                style: closeBtnStyle(isRenaming),
+                "aria-label": "Close",
+                children: /* @__PURE__ */ jsx7(X, { size: 16 })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs6("div", { style: bodyStyle2, children: [
+            /* @__PURE__ */ jsxs6("div", { style: infoBoxStyle2, children: [
+              /* @__PURE__ */ jsx7(
+                "p",
+                {
+                  style: {
+                    margin: "0 0 4px",
+                    color: profileColors.muted,
+                    ...upperLabelStyle
+                  },
+                  children: "Wallet"
+                }
+              ),
+              /* @__PURE__ */ jsx7(
+                "p",
+                {
+                  style: {
+                    margin: 0,
+                    fontSize: 12.5,
+                    lineHeight: "1rem",
+                    fontWeight: 500,
+                    color: profileColors.text
+                  },
+                  children: currentName
+                }
+              ),
+              /* @__PURE__ */ jsx7(
+                "p",
+                {
+                  style: {
+                    margin: "2px 0 0",
+                    fontSize: 12.5,
+                    lineHeight: "1rem",
+                    color: profileColors.muted,
+                    fontFamily: fontFamily.mono,
+                    wordBreak: "break-all"
+                  },
+                  children: wallet.ethereumAddress
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs6("div", { children: [
+              /* @__PURE__ */ jsx7("label", { style: labelStyle2, children: "Wallet name" }),
+              /* @__PURE__ */ jsx7(
+                "input",
+                {
+                  type: "text",
+                  value: name,
+                  onChange: (e) => {
+                    setName(e.target.value);
+                    setError(null);
+                  },
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter") handleRename();
+                    if (e.key === "Escape") handleClose();
+                  },
+                  disabled: isRenaming,
+                  autoFocus: true,
+                  style: inputStyle2(!!error, isRenaming)
+                }
+              ),
+              /* @__PURE__ */ jsx7(
+                "p",
+                {
+                  style: {
+                    margin: "8px 0 0",
+                    fontSize: 12.5,
+                    lineHeight: "1rem",
+                    color: profileColors.subdued
+                  },
+                  children: "Use letters, numbers, and / only."
+                }
+              )
+            ] }),
+            error && /* @__PURE__ */ jsxs6(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  alignItems: "flex-start",
+                  gap: 8,
+                  padding: 12,
+                  background: "rgba(248,113,113,0.08)",
+                  border: `1px solid ${DANGER_BORDER2}`,
+                  borderRadius: 8
+                },
+                children: [
+                  /* @__PURE__ */ jsx7(
+                    AlertTriangle,
+                    {
+                      size: 14,
+                      color: profileColors.danger,
+                      style: { flexShrink: 0, marginTop: 2 }
+                    }
+                  ),
+                  /* @__PURE__ */ jsx7(
+                    "p",
+                    {
+                      style: {
+                        margin: 0,
+                        fontSize: 12.5,
+                        lineHeight: "1rem",
+                        color: profileColors.danger
+                      },
+                      children: error
+                    }
+                  )
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx7("div", { style: footerStyle2, children: /* @__PURE__ */ jsx7(
+            "button",
+            {
+              onClick: handleRename,
+              disabled: !canSubmit,
+              onMouseEnter: () => setSaveHovered(true),
+              onMouseLeave: () => setSaveHovered(false),
+              style: saveButtonStyle(canSubmit, saveHovered),
+              children: isRenaming ? /* @__PURE__ */ jsxs6(Fragment3, { children: [
+                /* @__PURE__ */ jsx7(Loader2, { size: 14 }),
+                " Saving..."
+              ] }) : /* @__PURE__ */ jsxs6(Fragment3, { children: [
+                /* @__PURE__ */ jsx7(Pencil, { size: 14 }),
+                " Save Name"
+              ] })
+            }
+          ) })
+        ]
+      },
+      "panel"
+    ) })
+  ] }) });
+}
+
+// src/UserProfileModal.tsx
+import { Fragment as Fragment4, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+var DEFAULT_SLIPPAGE_OPTIONS = [
+  { label: "0.5%", value: 5e-3 },
+  { label: "1%", value: 0.01 },
+  { label: "2%", value: 0.02 },
+  { label: "5%", value: 0.05 },
+  { label: "10%", value: 0.1 }
+];
+var backdropStyle4 = modalBackdropStyle(100);
+var wrapperStyle3 = modalWrapperStyle2(101);
+var panelStyle3 = modalPanelStyle(false);
+var headerStyle3 = modalHeaderStyle;
+var profileSectionStyle = {
+  padding: "20px 24px",
+  borderBottom: `1px solid ${profileColors.border}`
+};
+var settingsSectionStyle = {
+  padding: "20px 24px"
+};
+var tabRowStyle = {
+  display: "flex",
+  gap: 6,
+  marginBottom: 20
+};
+var tabButtonLayoutStyle = {
+  flex: 1,
+  padding: "6px 0",
+  borderRadius: 4,
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  fontWeight: 500,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  gap: 6,
+  cursor: "pointer",
+  transition: "background-color 150ms, color 150ms, box-shadow 150ms"
+};
+var statBoxStyle = {
+  background: "rgba(255,255,255,0.03)",
+  borderRadius: 8,
+  padding: 12,
+  border: `1px solid ${profileColors.border}`
+};
+var slippageBtnBaseStyle = {
+  flex: 1,
+  padding: "4px 0",
+  borderRadius: 4,
+  fontSize: 12.5,
+  lineHeight: "1rem",
+  fontFamily: fontFamily.mono,
+  fontWeight: 500,
+  cursor: "pointer",
+  transition: "background-color 150ms, color 150ms, border-color 150ms"
+};
+var walletRowStyle = {
+  display: "flex",
+  alignItems: "center",
+  gap: 12,
+  padding: "10px 12px",
+  borderRadius: 8,
+  background: profileColors.surfaceBtn,
+  border: `1px solid ${profileColors.surfaceBd}`,
+  transition: "background-color 150ms, border-color 150ms"
+};
+function ToggleSwitch({
+  checked,
+  onChange,
+  accentColor
+}) {
+  return /* @__PURE__ */ jsx8(
+    "button",
+    {
+      onClick: onChange,
+      role: "switch",
+      "aria-checked": checked,
+      style: {
+        position: "relative",
+        display: "inline-flex",
+        height: 20,
+        width: 36,
+        alignItems: "center",
+        borderRadius: 9999,
+        border: "none",
+        background: checked ? accentColor : "rgba(255,255,255,0.08)",
+        cursor: "pointer",
+        padding: 0,
+        transition: "background 150ms"
+      },
+      children: /* @__PURE__ */ jsx8(
+        "span",
+        {
+          style: {
+            display: "inline-block",
+            height: 12,
+            width: 12,
+            borderRadius: "50%",
+            background: profileColors.text,
+            transform: checked ? "translateX(20px)" : "translateX(4px)",
+            transition: "transform 150ms"
+          }
+        }
+      )
+    }
+  );
+}
+function RaisedButton({
+  selected = false,
+  onClick,
+  children,
+  style
+}) {
+  const [hovered, setHovered] = useState4(false);
+  return /* @__PURE__ */ jsx8(
+    "button",
+    {
+      type: "button",
+      onClick,
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false),
+      style: {
+        ...tabButtonLayoutStyle,
+        ...raisedButtonStyle(
+          selected ? "active" : hovered ? "hover" : "default"
+        ),
+        ...style
+      },
+      children
+    }
+  );
+}
+function SlippageButton({
+  selected,
+  onClick,
+  children
+}) {
+  const [hovered, setHovered] = useState4(false);
+  return /* @__PURE__ */ jsx8(
+    "button",
+    {
+      type: "button",
+      onClick,
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false),
+      style: {
+        ...slippageBtnBaseStyle,
+        background: selected ? profileColors.surfaceBtnActive : hovered ? profileColors.surfaceBtnHover : profileColors.surfaceBtn,
+        border: `1px solid ${selected ? profileColors.surfaceBdActive : hovered ? profileColors.surfaceBdHover : profileColors.surfaceBd}`,
+        color: selected ? profileColors.text : hovered ? "#d1d5db" : profileColors.muted
+      },
+      children
+    }
+  );
+}
+function UserProfileModal({
+  isOpen,
+  onClose,
+  animationsEnabled,
+  onToggleAnimations,
+  defaultSlippage,
+  onSlippageChange,
+  slippageOptions = DEFAULT_SLIPPAGE_OPTIONS,
+  onWalletDeleted,
+  onWalletRenamed,
+  onShowPortfolio,
+  onNotify,
+  accentColor,
+  principalColors
+}) {
+  const {
+    user,
+    wallets: userWallets,
+    deleteWallet,
+    renameWallet,
+    authMethod
+  } = useHypurrConnectInternal();
+  const [settingsTab, setSettingsTab] = useState4("ui");
+  const [walletToDelete, setWalletToDelete] = useState4(null);
+  const [walletToRename, setWalletToRename] = useState4(null);
+  const profilePic = user?.photoUrl || "";
+  const displayName = user?.displayName || "";
+  const hfunScore = user?.hfunScore ?? null;
+  const reputationScore = user?.reputationScore ?? null;
+  const telegramId = user?.telegramId;
+  const wallets = userWallets ?? [];
+  const colors = resolvePrincipalColors(accentColor, principalColors);
+  const handleDeleteWallet = useCallback5(
+    async (walletId) => {
+      await deleteWallet(walletId);
+      onWalletDeleted?.(walletId);
+    },
+    [deleteWallet, onWalletDeleted]
+  );
+  const handleRenameWallet = useCallback5(
+    async (walletId, name) => {
+      await renameWallet(walletId, name);
+      onWalletRenamed?.(walletId, name);
+    },
+    [renameWallet, onWalletRenamed]
+  );
+  const handleCopyAddress = useCallback5(() => {
+    if (!displayName) return;
+    navigator.clipboard.writeText(displayName);
+    onNotify?.({ type: "success", message: "Address copied" });
+  }, [displayName, onNotify]);
+  return /* @__PURE__ */ jsxs7(Fragment4, { children: [
+    /* @__PURE__ */ jsx8(AnimatePresence4, { children: isOpen && /* @__PURE__ */ jsxs7(Fragment4, { children: [
+      /* @__PURE__ */ jsx8(SpinKeyframes, {}),
+      /* @__PURE__ */ jsx8(
+        motion4.div,
+        {
+          style: backdropStyle4,
+          initial: { opacity: 0 },
+          animate: { opacity: 1 },
+          exit: { opacity: 0 },
+          transition: { duration: 0.15 },
+          onClick: onClose
+        },
+        "backdrop"
+      ),
+      /* @__PURE__ */ jsx8("div", { style: wrapperStyle3, onClick: onClose, children: /* @__PURE__ */ jsxs7(
+        motion4.div,
+        {
+          style: panelStyle3,
+          initial: { opacity: 0, y: 8 },
+          animate: { opacity: 1, y: 0 },
+          exit: { opacity: 0, y: 8 },
+          transition: { duration: 0.18, ease: "easeOut" },
+          onClick: (e) => e.stopPropagation(),
+          children: [
+            /* @__PURE__ */ jsxs7("div", { style: headerStyle3, children: [
+              /* @__PURE__ */ jsx8("h3", { style: titleStyle, children: "Profile & Settings" }),
+              /* @__PURE__ */ jsx8(
+                "button",
+                {
+                  onClick: onClose,
+                  style: closeBtnStyle(),
+                  "aria-label": "Close",
+                  children: /* @__PURE__ */ jsx8(X, { size: 16 })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs7("div", { style: profileSectionStyle, children: [
+              authMethod === "eoa" && !profilePic ? /* @__PURE__ */ jsxs7(
+                "div",
+                {
+                  style: {
+                    padding: "10px 12px",
+                    background: "rgba(255,255,255,0.03)",
+                    border: `1px solid ${profileColors.border}`,
+                    borderRadius: 8
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx8(
+                      "p",
+                      {
+                        style: {
+                          margin: "0 0 6px",
+                          color: profileColors.muted,
+                          ...upperLabelStyle
+                        },
+                        children: "Wallet"
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs7(
+                      "div",
+                      {
+                        style: {
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "space-between",
+                          gap: 8
+                        },
+                        children: [
+                          /* @__PURE__ */ jsx8(
+                            "p",
+                            {
+                              style: {
+                                margin: 0,
+                                fontSize: 12.5,
+                                lineHeight: "1rem",
+                                color: profileColors.text,
+                                fontFamily: fontFamily.mono,
+                                wordBreak: "break-all"
+                              },
+                              children: displayName
+                            }
+                          ),
+                          /* @__PURE__ */ jsx8(
+                            "button",
+                            {
+                              onClick: handleCopyAddress,
+                              style: {
+                                background: "transparent",
+                                border: "none",
+                                color: profileColors.muted,
+                                cursor: "pointer",
+                                flexShrink: 0,
+                                display: "flex"
+                              },
+                              "aria-label": "Copy address",
+                              children: /* @__PURE__ */ jsx8(Copy, { size: 13 })
+                            }
+                          )
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ) : /* @__PURE__ */ jsxs7(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: 16
+                  },
+                  children: [
+                    profilePic ? /* @__PURE__ */ jsx8(
+                      "img",
+                      {
+                        src: profilePic,
+                        alt: "Profile",
+                        style: {
+                          height: 56,
+                          width: 56,
+                          borderRadius: "50%",
+                          border: `1px solid ${profileColors.surfaceBd}`
+                        }
+                      }
+                    ) : /* @__PURE__ */ jsx8(
+                      "div",
+                      {
+                        style: {
+                          height: 56,
+                          width: 56,
+                          borderRadius: "50%",
+                          border: `1px solid ${profileColors.surfaceBd}`,
+                          background: profileColors.surfaceBd,
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "center",
+                          fontSize: 18,
+                          lineHeight: "1.75rem",
+                          fontWeight: 700,
+                          color: profileColors.text
+                        },
+                        children: displayName?.charAt(0)
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs7("div", { style: { flex: 1, minWidth: 0 }, children: [
+                      /* @__PURE__ */ jsx8(
+                        "h4",
+                        {
+                          style: {
+                            margin: 0,
+                            fontSize: 14,
+                            lineHeight: "1.25rem",
+                            fontWeight: 600,
+                            color: profileColors.text,
+                            overflow: "hidden",
+                            textOverflow: "ellipsis",
+                            whiteSpace: "nowrap"
+                          },
+                          children: displayName
+                        }
+                      ),
+                      telegramId && /* @__PURE__ */ jsxs7(
+                        "p",
+                        {
+                          style: {
+                            margin: "2px 0 0",
+                            fontSize: 12.5,
+                            lineHeight: "1rem",
+                            color: profileColors.muted
+                          },
+                          children: [
+                            "ID: ",
+                            telegramId
+                          ]
+                        }
+                      )
+                    ] })
+                  ]
+                }
+              ),
+              user && /* @__PURE__ */ jsxs7(
+                "div",
+                {
+                  style: {
+                    marginTop: 16,
+                    display: "grid",
+                    gridTemplateColumns: "1fr 1fr",
+                    gap: 10
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxs7("div", { style: statBoxStyle, children: [
+                      /* @__PURE__ */ jsxs7(
+                        "div",
+                        {
+                          style: {
+                            display: "flex",
+                            alignItems: "center",
+                            gap: 6,
+                            color: "#eab308",
+                            marginBottom: 6
+                          },
+                          children: [
+                            /* @__PURE__ */ jsx8(Star, { size: 13, color: "#eab308", fill: "#eab308" }),
+                            /* @__PURE__ */ jsx8("span", { style: upperLabelStyle, children: "Hfun Score" })
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ jsx8(
+                        "p",
+                        {
+                          style: {
+                            margin: 0,
+                            fontSize: 18,
+                            lineHeight: "1.75rem",
+                            fontWeight: 700,
+                            color: profileColors.text,
+                            fontFamily: fontFamily.mono
+                          },
+                          children: hfunScore !== null ? hfunScore.toFixed(0) : "--"
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsxs7("div", { style: statBoxStyle, children: [
+                      /* @__PURE__ */ jsxs7(
+                        "div",
+                        {
+                          style: {
+                            display: "flex",
+                            alignItems: "center",
+                            gap: 6,
+                            color: profileColors.muted,
+                            marginBottom: 6
+                          },
+                          children: [
+                            /* @__PURE__ */ jsx8(User, { size: 13 }),
+                            /* @__PURE__ */ jsx8("span", { style: upperLabelStyle, children: "Reputation" })
+                          ]
+                        }
+                      ),
+                      /* @__PURE__ */ jsx8(
+                        "p",
+                        {
+                          style: {
+                            margin: 0,
+                            fontSize: 18,
+                            lineHeight: "1.75rem",
+                            fontWeight: 700,
+                            color: profileColors.text,
+                            fontFamily: fontFamily.mono
+                          },
+                          children: reputationScore !== null ? reputationScore.toFixed(0) : "--"
+                        }
+                      )
+                    ] })
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs7("div", { style: settingsSectionStyle, children: [
+              /* @__PURE__ */ jsxs7("div", { style: tabRowStyle, children: [
+                /* @__PURE__ */ jsxs7(
+                  RaisedButton,
+                  {
+                    selected: settingsTab === "ui",
+                    onClick: () => setSettingsTab("ui"),
+                    children: [
+                      /* @__PURE__ */ jsx8(Zap, { size: 13 }),
+                      " UI"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs7(
+                  RaisedButton,
+                  {
+                    selected: settingsTab === "trading",
+                    onClick: () => setSettingsTab("trading"),
+                    children: [
+                      /* @__PURE__ */ jsx8(TrendingUp, { size: 13 }),
+                      " Trading"
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs7(
+                  RaisedButton,
+                  {
+                    selected: settingsTab === "wallets",
+                    onClick: () => setSettingsTab("wallets"),
+                    children: [
+                      /* @__PURE__ */ jsx8(Wallet, { size: 13 }),
+                      " Wallets"
+                    ]
+                  }
+                )
+              ] }),
+              settingsTab === "ui" && /* @__PURE__ */ jsx8(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: 12
+                  },
+                  children: /* @__PURE__ */ jsxs7(
+                    "div",
+                    {
+                      style: {
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "space-between",
+                        padding: "8px 0"
+                      },
+                      children: [
+                        /* @__PURE__ */ jsxs7(
+                          "div",
+                          {
+                            style: {
+                              display: "flex",
+                              alignItems: "center",
+                              gap: 12
+                            },
+                            children: [
+                              /* @__PURE__ */ jsx8(Zap, { size: 16, color: profileColors.muted }),
+                              /* @__PURE__ */ jsxs7("div", { children: [
+                                /* @__PURE__ */ jsx8(
+                                  "p",
+                                  {
+                                    style: {
+                                      margin: 0,
+                                      fontSize: 12.5,
+                                      lineHeight: "1rem",
+                                      fontWeight: 500,
+                                      color: profileColors.text
+                                    },
+                                    children: "Animations"
+                                  }
+                                ),
+                                /* @__PURE__ */ jsx8(
+                                  "p",
+                                  {
+                                    style: {
+                                      margin: 0,
+                                      fontSize: 12.5,
+                                      lineHeight: "1rem",
+                                      color: profileColors.muted
+                                    },
+                                    children: "Enable chart and UI animations"
+                                  }
+                                )
+                              ] })
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ jsx8(
+                          ToggleSwitch,
+                          {
+                            checked: animationsEnabled,
+                            onChange: onToggleAnimations,
+                            accentColor: colors.accent
+                          }
+                        )
+                      ]
+                    }
+                  )
+                }
+              ),
+              settingsTab === "trading" && /* @__PURE__ */ jsxs7("div", { style: { padding: "8px 0" }, children: [
+                /* @__PURE__ */ jsxs7(
+                  "div",
+                  {
+                    style: {
+                      display: "flex",
+                      alignItems: "center",
+                      gap: 12,
+                      marginBottom: 12
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx8(TrendingUp, { size: 16, color: profileColors.muted }),
+                      /* @__PURE__ */ jsxs7("div", { children: [
+                        /* @__PURE__ */ jsx8(
+                          "p",
+                          {
+                            style: {
+                              margin: 0,
+                              fontSize: 12.5,
+                              lineHeight: "1rem",
+                              fontWeight: 500,
+                              color: profileColors.text
+                            },
+                            children: "Default Slippage"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx8(
+                          "p",
+                          {
+                            style: {
+                              margin: 0,
+                              fontSize: 12.5,
+                              lineHeight: "1rem",
+                              color: profileColors.muted
+                            },
+                            children: "Max price deviation for market orders"
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx8("div", { style: { display: "flex", gap: 6 }, children: slippageOptions.map((option) => /* @__PURE__ */ jsx8(
+                  SlippageButton,
+                  {
+                    onClick: () => onSlippageChange(option.value),
+                    selected: defaultSlippage === option.value,
+                    children: option.label
+                  },
+                  option.value
+                )) })
+              ] }),
+              settingsTab === "wallets" && /* @__PURE__ */ jsxs7(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: 8
+                  },
+                  children: [
+                    wallets.length === 0 ? /* @__PURE__ */ jsxs7(
+                      "div",
+                      {
+                        style: {
+                          textAlign: "center",
+                          padding: "32px 0"
+                        },
+                        children: [
+                          /* @__PURE__ */ jsx8(
+                            "div",
+                            {
+                              style: {
+                                width: 40,
+                                height: 40,
+                                borderRadius: "50%",
+                                background: "rgba(255,255,255,0.04)",
+                                display: "flex",
+                                alignItems: "center",
+                                justifyContent: "center",
+                                margin: "0 auto 12px"
+                              },
+                              children: /* @__PURE__ */ jsx8(Wallet, { size: 18, color: profileColors.muted })
+                            }
+                          ),
+                          /* @__PURE__ */ jsx8(
+                            "p",
+                            {
+                              style: {
+                                margin: 0,
+                                fontSize: 12.5,
+                                lineHeight: "1rem",
+                                color: profileColors.muted
+                              },
+                              children: "No wallets yet"
+                            }
+                          )
+                        ]
+                      }
+                    ) : /* @__PURE__ */ jsx8(
+                      "div",
+                      {
+                        style: {
+                          maxHeight: 208,
+                          overflowY: "auto",
+                          display: "flex",
+                          flexDirection: "column",
+                          gap: 6
+                        },
+                        children: wallets.map((wallet) => /* @__PURE__ */ jsx8(
+                          WalletRow,
+                          {
+                            wallet,
+                            colors,
+                            onRename: () => setWalletToRename(wallet),
+                            onDelete: () => setWalletToDelete(wallet),
+                            onShowPortfolio: onShowPortfolio ? () => onShowPortfolio(wallet) : void 0
+                          },
+                          wallet.id
+                        ))
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs7(
+                      "p",
+                      {
+                        style: {
+                          margin: "4px 0 0",
+                          fontSize: 12.5,
+                          lineHeight: "1rem",
+                          color: profileColors.subdued,
+                          textAlign: "center"
+                        },
+                        children: [
+                          wallets.length,
+                          " wallet",
+                          wallets.length !== 1 ? "s" : "",
+                          " linked"
+                        ]
+                      }
+                    )
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx8("div", { style: { padding: "0 24px 24px" }, children: /* @__PURE__ */ jsx8(
+              "button",
+              {
+                onClick: onClose,
+                style: {
+                  ...raisedButtonStyle("default"),
+                  width: "100%",
+                  padding: "6px 0",
+                  fontSize: 12.5,
+                  lineHeight: "1rem",
+                  fontWeight: 500,
+                  borderRadius: 8,
+                  cursor: "pointer"
+                },
+                children: "Close"
+              }
+            ) })
+          ]
+        },
+        "panel"
+      ) })
+    ] }) }),
+    /* @__PURE__ */ jsx8(
+      DeleteWalletModal,
+      {
+        isOpen: !!walletToDelete,
+        onClose: () => setWalletToDelete(null),
+        wallet: walletToDelete,
+        onConfirm: handleDeleteWallet,
+        onNotify
+      }
+    ),
+    /* @__PURE__ */ jsx8(
+      RenameWalletModal,
+      {
+        isOpen: !!walletToRename,
+        onClose: () => setWalletToRename(null),
+        wallet: walletToRename,
+        onConfirm: handleRenameWallet,
+        onNotify,
+        accentColor: colors.accent
+      }
+    )
+  ] });
+}
+function WalletRow({
+  wallet,
+  colors,
+  onRename,
+  onDelete,
+  onShowPortfolio
+}) {
+  const [hovered, setHovered] = useState4(false);
+  return /* @__PURE__ */ jsxs7(
+    "div",
+    {
+      style: {
+        ...walletRowStyle,
+        background: hovered ? profileColors.surfaceBtnHover : profileColors.surfaceBtn,
+        borderColor: hovered ? profileColors.surfaceBdHover : profileColors.surfaceBd
+      },
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false),
+      children: [
+        /* @__PURE__ */ jsx8(
+          "div",
+          {
+            style: {
+              width: 32,
+              height: 32,
+              borderRadius: 6,
+              background: colors.accentBackground,
+              border: `1px solid ${colors.accentBorder}`,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              flexShrink: 0
+            },
+            children: /* @__PURE__ */ jsx8(
+              "span",
+              {
+                style: {
+                  fontSize: 12.5,
+                  lineHeight: "1rem",
+                  fontWeight: 600,
+                  color: colors.accentText
+                },
+                children: (wallet.name || "W")[0].toUpperCase()
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxs7("div", { style: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx8(
+            "p",
+            {
+              style: {
+                margin: 0,
+                fontSize: 12.5,
+                lineHeight: "1rem",
+                fontWeight: 500,
+                color: profileColors.text,
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                whiteSpace: "nowrap"
+              },
+              children: wallet.name || "Unnamed"
+            }
+          ),
+          /* @__PURE__ */ jsxs7(
+            "p",
+            {
+              style: {
+                margin: 0,
+                fontSize: 12.5,
+                lineHeight: "1rem",
+                color: profileColors.muted,
+                fontFamily: fontFamily.mono
+              },
+              children: [
+                wallet.ethereumAddress?.slice(0, 6),
+                "...",
+                wallet.ethereumAddress?.slice(-4)
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs7(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: 4,
+              flexShrink: 0,
+              opacity: hovered ? 1 : 0,
+              transition: "opacity 120ms"
+            },
+            children: [
+              onShowPortfolio && /* @__PURE__ */ jsx8(
+                IconBtn,
+                {
+                  color: colors.accent,
+                  hoverBackgroundColor: colors.accentHoverBackground,
+                  title: "View portfolio",
+                  ariaLabel: `View portfolio for ${wallet.name || "wallet"}`,
+                  onClick: onShowPortfolio,
+                  children: /* @__PURE__ */ jsx8(LayoutDashboard, { size: 13 })
+                }
+              ),
+              /* @__PURE__ */ jsx8(
+                IconBtn,
+                {
+                  color: colors.accent,
+                  hoverBackgroundColor: colors.accentHoverBackground,
+                  title: "Rename wallet",
+                  ariaLabel: `Rename ${wallet.name || "wallet"}`,
+                  onClick: onRename,
+                  children: /* @__PURE__ */ jsx8(Pencil, { size: 13 })
+                }
+              ),
+              /* @__PURE__ */ jsx8(
+                IconBtn,
+                {
+                  color: "#ef4444",
+                  hoverBackgroundColor: "rgba(239,68,68,0.1)",
+                  title: "Delete wallet",
+                  ariaLabel: `Delete ${wallet.name || "wallet"}`,
+                  onClick: onDelete,
+                  children: /* @__PURE__ */ jsx8(Trash2, { size: 13 })
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function IconBtn({
+  children,
+  color,
+  hoverBackgroundColor,
+  title,
+  ariaLabel,
+  onClick
+}) {
+  const [hovered, setHovered] = useState4(false);
+  return /* @__PURE__ */ jsx8(
+    "button",
+    {
+      onMouseEnter: () => setHovered(true),
+      onMouseLeave: () => setHovered(false),
+      onClick,
+      title,
+      "aria-label": ariaLabel,
+      style: {
+        padding: 6,
+        borderRadius: 4,
+        background: hovered ? hoverBackgroundColor ?? "transparent" : "transparent",
+        border: "none",
+        color: hovered ? color : profileColors.disabled,
+        cursor: "pointer",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        transition: "color 120ms, background 120ms"
+      },
+      children
+    }
+  );
+}
+
+// src/WalletSelectorDropdown.tsx
+import { Fragment as Fragment6, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+var DEFAULT_BACKGROUND_COLOR = "rgba(20,20,20,0.95)";
+var getWalletNameParts = (name) => (name ?? "").split("/").map((part) => part.trim()).filter(Boolean);
+var buildWalletListEntries = (wallets) => {
+  const standalone = [];
+  const grouped = /* @__PURE__ */ new Map();
+  const walletParts = (wallets ?? []).map((wallet) => ({
+    wallet,
+    parts: getWalletNameParts(wallet.name)
+  }));
+  const prefixCounts = /* @__PURE__ */ new Map();
+  walletParts.forEach(({ parts }) => {
+    for (let index = 1; index < parts.length; index += 1) {
+      const prefix = parts.slice(0, index).join("/");
+      prefixCounts.set(prefix, (prefixCounts.get(prefix) ?? 0) + 1);
+    }
+  });
+  walletParts.forEach(({ wallet, parts }) => {
+    const groupPath = (() => {
+      for (let index = parts.length - 1; index > 0; index -= 1) {
+        const prefix = parts.slice(0, index).join("/");
+        if ((prefixCounts.get(prefix) ?? 0) > 1) {
+          return prefix;
+        }
+      }
+      return null;
+    })();
+    const groupDepth = groupPath ? groupPath.split("/").length : 0;
+    const item = {
+      wallet,
+      label: parts.length > 0 ? parts.slice(groupDepth).join("/") : null
+    };
+    if (!groupPath) {
+      standalone.push(item);
+      return;
+    }
+    const groupItems = grouped.get(groupPath) ?? [];
+    groupItems.push(item);
+    grouped.set(groupPath, groupItems);
+  });
+  const entries = standalone.map((item) => ({
+    type: "wallet",
+    item
+  }));
+  grouped.forEach((items, path) => {
+    if (items.length === 1) {
+      entries.push({
+        type: "wallet",
+        item: { ...items[0], label: `${path}/${items[0].label ?? ""}` }
+      });
+      return;
+    }
+    entries.push({
+      type: "group",
+      path,
+      items: [...items].sort(
+        (a, b) => (a.label ?? "").localeCompare(b.label ?? "")
+      )
+    });
+  });
+  return entries.sort((a, b) => {
+    const aLabel = a.type === "group" ? a.path : a.item.label ?? "";
+    const bLabel = b.type === "group" ? b.path : b.item.label ?? "";
+    return aLabel.localeCompare(bLabel);
+  });
+};
+var formatCompactAddress = (addr) => {
+  if (!addr) return "";
+  return `${addr.slice(0, 4)}...${addr.slice(-2)}`;
+};
+var rootStyle = {
+  position: "absolute",
+  right: 0,
+  top: "calc(100% + 4px)",
+  width: 240,
+  backdropFilter: "blur(10px)",
+  WebkitBackdropFilter: "blur(10px)",
+  borderRadius: 9,
+  boxShadow: "0 8px 40px rgba(0,0,0,0.85)",
+  border: "1px solid rgba(255,255,255,0.08)",
+  zIndex: 50,
+  transformOrigin: "top right",
+  overflow: "hidden"
+};
+var sectionBorder = "1px solid rgba(255,255,255,0.06)";
+var sectionHeaderStyle = {
+  padding: "8px 16px",
+  fontSize: 12,
+  fontWeight: 600,
+  color: "#9ca3af",
+  textTransform: "uppercase",
+  letterSpacing: "0.05em"
+};
+var footerBtnStyle = {
+  width: "100%",
+  textAlign: "left",
+  padding: "10px 16px",
+  fontSize: 14,
+  background: "transparent",
+  border: "none",
+  cursor: "pointer",
+  display: "flex",
+  alignItems: "center",
+  gap: 8,
+  color: "#9ca3af",
+  transition: "background 120ms, color 120ms"
+};
+function WalletSelectorDropdown({
+  isOpen,
+  onClose,
+  onAddWallet,
+  onShowPortfolio,
+  onLogout,
+  onNotify,
+  vipThreshold = 10,
+  animationsEnabled,
+  onToggleAnimations,
+  defaultSlippage,
+  onSlippageChange,
+  slippageOptions,
+  onWalletDeleted,
+  onWalletRenamed,
+  accentColor,
+  principalColors,
+  backgroundColor = DEFAULT_BACKGROUND_COLOR
+}) {
+  const { user, wallets, selectedWalletId, selectWallet, logout, authMethod } = useHypurrConnectInternal();
+  const [profileOpen, setProfileOpen] = useState5(false);
+  const openProfile = useCallback6(() => {
+    setProfileOpen(true);
+    onClose();
+  }, [onClose]);
+  const walletListEntries = useMemo2(
+    () => buildWalletListEntries(Array.isArray(wallets) ? wallets : void 0),
+    [wallets]
+  );
+  const handleCopyAddress = useCallback6(
+    (address) => {
+      if (!address) return;
+      navigator.clipboard.writeText(address);
+      onNotify?.({ type: "success", message: "Address copied" });
+    },
+    [onNotify]
+  );
+  const handleLogout = useCallback6(() => {
+    onLogout?.();
+    logout();
+    onClose();
+  }, [logout, onClose, onLogout]);
+  const profilePic = user?.photoUrl;
+  const displayName = user?.displayName ?? "";
+  const hfunScore = user?.hfunScore ?? 0;
+  const isVip = hfunScore > vipThreshold;
+  const colors = resolvePrincipalColors(accentColor, principalColors);
+  const renderWalletRow = (item, depth) => {
+    const { wallet, label } = item;
+    const isSelected = wallet.id === selectedWalletId;
+    const compactAddress = formatCompactAddress(wallet.ethereumAddress);
+    return /* @__PURE__ */ jsx9(
+      WalletRow2,
+      {
+        depth,
+        isSelected,
+        label,
+        compactAddress,
+        onSelect: () => {
+          selectWallet(wallet.id);
+          onClose();
+        },
+        onShowPortfolio: onShowPortfolio ? () => {
+          onShowPortfolio(wallet);
+          onClose();
+        } : void 0,
+        onCopy: () => handleCopyAddress(wallet.ethereumAddress),
+        colors
+      },
+      wallet.id
+    );
+  };
+  return /* @__PURE__ */ jsxs8(Fragment6, { children: [
+    /* @__PURE__ */ jsx9(AnimatePresence5, { children: isOpen && /* @__PURE__ */ jsxs8(
+      motion5.div,
+      {
+        style: { ...rootStyle, background: backgroundColor },
+        initial: { opacity: 0, scale: 0.95 },
+        animate: { opacity: 1, scale: 1 },
+        exit: { opacity: 0, scale: 0.95 },
+        transition: { duration: 0.15, ease: "easeOut" },
+        children: [
+          /* @__PURE__ */ jsxs8(
+            "button",
+            {
+              onClick: openProfile,
+              style: {
+                width: "100%",
+                padding: "12px 16px",
+                borderBottom: sectionBorder,
+                display: "flex",
+                alignItems: "center",
+                gap: 12,
+                background: "transparent",
+                border: "none",
+                borderBottomColor: "rgba(255,255,255,0.06)",
+                borderBottomStyle: "solid",
+                borderBottomWidth: 1,
+                cursor: "pointer",
+                textAlign: "left",
+                transition: "background 120ms"
+              },
+              onMouseEnter: (e) => e.currentTarget.style.background = "rgba(255,255,255,0.06)",
+              onMouseLeave: (e) => e.currentTarget.style.background = "transparent",
+              children: [
+                profilePic ? /* @__PURE__ */ jsxs8(
+                  "div",
+                  {
+                    style: {
+                      position: "relative",
+                      padding: isVip ? 2 : 0,
+                      borderRadius: "50%",
+                      background: isVip ? "linear-gradient(to right, #fde047, #eab308, #ca8a04)" : "transparent"
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx9(
+                        "img",
+                        {
+                          src: profilePic,
+                          alt: "Profile",
+                          style: {
+                            height: 32,
+                            width: 32,
+                            borderRadius: "50%",
+                            display: "block"
+                          }
+                        }
+                      ),
+                      isVip && /* @__PURE__ */ jsx9(
+                        Crown,
+                        {
+                          size: 12,
+                          color: "#fde047",
+                          fill: "#eab308",
+                          style: {
+                            position: "absolute",
+                            top: -4,
+                            right: -2,
+                            filter: "drop-shadow(0 1px 2px rgba(0,0,0,0.5))"
+                          }
+                        }
+                      )
+                    ]
+                  }
+                ) : authMethod === "eoa" ? /* @__PURE__ */ jsx9(
+                  "div",
+                  {
+                    style: {
+                      height: 32,
+                      width: 32,
+                      borderRadius: 7,
+                      background: colors.accentBackground,
+                      border: `1px solid ${colors.accentBorder}`,
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "center",
+                      flexShrink: 0
+                    },
+                    children: /* @__PURE__ */ jsx9(Wallet, { size: 14, color: colors.accentText })
+                  }
+                ) : /* @__PURE__ */ jsxs8(
+                  "div",
+                  {
+                    style: {
+                      position: "relative",
+                      height: 32,
+                      width: 32,
+                      borderRadius: "50%",
+                      background: isVip ? "linear-gradient(135deg, #ca8a04, #fde047)" : colors.accentBackground,
+                      border: `1px solid ${isVip ? "rgba(255,255,255,0.08)" : colors.accentBorder}`,
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "center",
+                      color: isVip ? profileColors.text : colors.accentText,
+                      fontSize: 14,
+                      fontWeight: 700
+                    },
+                    children: [
+                      displayName.charAt(0),
+                      isVip && /* @__PURE__ */ jsx9(
+                        Crown,
+                        {
+                          size: 12,
+                          color: "#fde047",
+                          fill: "#eab308",
+                          style: {
+                            position: "absolute",
+                            top: -4,
+                            right: -2,
+                            filter: "drop-shadow(0 1px 2px rgba(0,0,0,0.5))"
+                          }
+                        }
+                      )
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx9("div", { style: { overflow: "hidden", flex: 1 }, children: /* @__PURE__ */ jsxs8("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+                  /* @__PURE__ */ jsx9(
+                    "p",
+                    {
+                      style: {
+                        margin: 0,
+                        fontSize: 14,
+                        fontWeight: 500,
+                        color: "#fff",
+                        overflow: "hidden",
+                        textOverflow: "ellipsis",
+                        whiteSpace: "nowrap"
+                      },
+                      children: displayName
+                    }
+                  ),
+                  hfunScore > 0 && /* @__PURE__ */ jsxs8(
+                    "span",
+                    {
+                      style: {
+                        display: "inline-flex",
+                        alignItems: "center",
+                        gap: 2,
+                        fontSize: 12,
+                        color: "#eab308",
+                        fontWeight: 500,
+                        background: "rgba(234,179,8,0.1)",
+                        padding: "2px 6px",
+                        borderRadius: 4
+                      },
+                      children: [
+                        /* @__PURE__ */ jsx9(Star, { size: 10, color: "#eab308", fill: "#eab308" }),
+                        hfunScore.toFixed(0)
+                      ]
+                    }
+                  )
+                ] }) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs8("div", { style: { borderBottom: sectionBorder }, children: [
+            /* @__PURE__ */ jsx9("div", { style: sectionHeaderStyle, children: "Wallets" }),
+            /* @__PURE__ */ jsx9(
+              "div",
+              {
+                style: {
+                  maxHeight: 256,
+                  overflowY: "auto",
+                  paddingBottom: 4
+                },
+                children: walletListEntries.map((entry) => {
+                  if (entry.type === "wallet") {
+                    return renderWalletRow(entry.item, 0);
+                  }
+                  const isSelectedGroup = entry.items.some(
+                    (item) => item.wallet.id === selectedWalletId
+                  );
+                  return /* @__PURE__ */ jsxs8(Fragment5, { children: [
+                    /* @__PURE__ */ jsxs8(
+                      "div",
+                      {
+                        style: {
+                          display: "flex",
+                          alignItems: "center",
+                          gap: 6,
+                          padding: "8px 16px 4px",
+                          fontSize: 11,
+                          fontWeight: 600,
+                          textTransform: "uppercase",
+                          letterSpacing: "0.05em",
+                          color: isSelectedGroup ? "#e5e7eb" : "#6b7280"
+                        },
+                        children: [
+                          /* @__PURE__ */ jsx9(Folder, { size: 12, style: { flexShrink: 0 } }),
+                          /* @__PURE__ */ jsx9(
+                            "span",
+                            {
+                              style: {
+                                minWidth: 0,
+                                flex: 1,
+                                overflow: "hidden",
+                                textOverflow: "ellipsis",
+                                whiteSpace: "nowrap"
+                              },
+                              children: entry.path
+                            }
+                          ),
+                          /* @__PURE__ */ jsx9(
+                            "span",
+                            {
+                              style: {
+                                flexShrink: 0,
+                                fontVariantNumeric: "tabular-nums",
+                                color: "#4b5563"
+                              },
+                              children: entry.items.length
+                            }
+                          )
+                        ]
+                      }
+                    ),
+                    entry.items.map((item) => renderWalletRow(item, 1))
+                  ] }, entry.path);
+                })
+              }
+            ),
+            authMethod !== "eoa" && onAddWallet && /* @__PURE__ */ jsxs8(
+              "button",
+              {
+                onClick: () => {
+                  onAddWallet();
+                  onClose();
+                },
+                style: {
+                  width: "100%",
+                  textAlign: "left",
+                  padding: "8px 16px",
+                  fontSize: 14,
+                  background: "transparent",
+                  border: "none",
+                  cursor: "pointer",
+                  display: "flex",
+                  alignItems: "center",
+                  gap: 8,
+                  color: colors.accentText,
+                  transition: "background 120ms"
+                },
+                onMouseEnter: (e) => e.currentTarget.style.background = "rgba(255,255,255,0.06)",
+                onMouseLeave: (e) => e.currentTarget.style.background = "transparent",
+                children: [
+                  /* @__PURE__ */ jsx9(Plus, { size: 14 }),
+                  "Add Wallet"
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs8("div", { children: [
+            /* @__PURE__ */ jsx9(
+              FooterBtn,
+              {
+                onClick: openProfile,
+                icon: /* @__PURE__ */ jsx9(User, { size: 14 }),
+                label: "Profile & Settings"
+              }
+            ),
+            /* @__PURE__ */ jsx9(
+              FooterBtn,
+              {
+                onClick: handleLogout,
+                icon: /* @__PURE__ */ jsx9(LogOut, { size: 14 }),
+                label: "Logout",
+                hoverColor: "#ef4444"
+              }
+            )
+          ] })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx9(
+      UserProfileModal,
+      {
+        isOpen: profileOpen,
+        onClose: () => setProfileOpen(false),
+        animationsEnabled,
+        onToggleAnimations,
+        defaultSlippage,
+        onSlippageChange,
+        slippageOptions,
+        accentColor,
+        principalColors,
+        onWalletDeleted,
+        onWalletRenamed,
+        onShowPortfolio: onShowPortfolio ? (wallet) => {
+          onShowPortfolio(wallet);
+          setProfileOpen(false);
+        } : void 0,
+        onNotify
+      }
+    )
+  ] });
+}
+function FooterBtn({
+  onClick,
+  icon,
+  label,
+  hoverColor = "#fff"
+}) {
+  return /* @__PURE__ */ jsxs8(
+    "button",
+    {
+      onClick,
+      style: footerBtnStyle,
+      onMouseEnter: (e) => {
+        e.currentTarget.style.background = "rgba(255,255,255,0.06)";
+        e.currentTarget.style.color = hoverColor;
+      },
+      onMouseLeave: (e) => {
+        e.currentTarget.style.background = "transparent";
+        e.currentTarget.style.color = "#9ca3af";
+      },
+      children: [
+        icon,
+        label
+      ]
+    }
+  );
+}
+function WalletRow2({
+  depth,
+  isSelected,
+  label,
+  compactAddress,
+  onSelect,
+  onShowPortfolio,
+  onCopy,
+  colors
+}) {
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      style: {
+        width: "100%",
+        paddingLeft: 16 + depth * 14,
+        paddingRight: 16,
+        paddingTop: 6,
+        paddingBottom: 6,
+        fontSize: 14,
+        color: "#d1d5db",
+        display: "flex",
+        alignItems: "center",
+        background: isSelected ? "rgba(255,255,255,0.06)" : "transparent",
+        transition: "background 120ms"
+      },
+      onMouseEnter: (e) => {
+        e.currentTarget.style.background = "rgba(255,255,255,0.06)";
+        const actions = e.currentTarget.querySelector("[data-row-actions]");
+        if (actions) actions.style.opacity = "1";
+      },
+      onMouseLeave: (e) => {
+        e.currentTarget.style.background = isSelected ? "rgba(255,255,255,0.06)" : "transparent";
+        const actions = e.currentTarget.querySelector("[data-row-actions]");
+        if (actions) actions.style.opacity = "0";
+      },
+      children: [
+        /* @__PURE__ */ jsx9(
+          "button",
+          {
+            onClick: onSelect,
+            style: {
+              flex: 1,
+              textAlign: "left",
+              minWidth: 0,
+              display: "flex",
+              alignItems: "center",
+              gap: 4,
+              background: "transparent",
+              border: "none",
+              color: "inherit",
+              cursor: "pointer",
+              padding: 0
+            },
+            children: label ? /* @__PURE__ */ jsxs8(Fragment6, { children: [
+              /* @__PURE__ */ jsx9(
+                "span",
+                {
+                  style: {
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    whiteSpace: "nowrap",
+                    color: isSelected ? "#fff" : void 0,
+                    fontWeight: isSelected ? 500 : void 0
+                  },
+                  children: label
+                }
+              ),
+              /* @__PURE__ */ jsxs8(
+                "span",
+                {
+                  style: {
+                    fontSize: 12,
+                    fontWeight: 400,
+                    flexShrink: 0,
+                    color: "#6b7280"
+                  },
+                  children: [
+                    "(",
+                    compactAddress,
+                    ")"
+                  ]
+                }
+              )
+            ] }) : /* @__PURE__ */ jsx9(
+              "span",
+              {
+                style: {
+                  fontSize: 12,
+                  color: isSelected ? "#fff" : "#9ca3af",
+                  fontWeight: isSelected ? 500 : void 0
+                },
+                children: compactAddress
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsxs8(
+          "div",
+          {
+            "data-row-actions": true,
+            style: {
+              display: "flex",
+              alignItems: "center",
+              opacity: 0,
+              transition: "opacity 120ms"
+            },
+            children: [
+              onShowPortfolio && /* @__PURE__ */ jsx9(
+                RowIconBtn,
+                {
+                  title: "View portfolio",
+                  hoverColor: colors.accent,
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    onShowPortfolio();
+                  },
+                  children: /* @__PURE__ */ jsx9(LayoutDashboard, { size: 12 })
+                }
+              ),
+              /* @__PURE__ */ jsx9(
+                RowIconBtn,
+                {
+                  title: "Copy address",
+                  hoverColor: colors.accent,
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    onCopy();
+                  },
+                  children: /* @__PURE__ */ jsx9(Copy, { size: 12 })
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function RowIconBtn({
+  children,
+  title,
+  onClick,
+  hoverColor = profileColors.text
+}) {
+  return /* @__PURE__ */ jsx9(
+    "button",
+    {
+      onClick,
+      title,
+      style: {
+        padding: 4,
+        marginLeft: 4,
+        background: "transparent",
+        border: "none",
+        color: "#4b5563",
+        cursor: "pointer",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        transition: "color 120ms"
+      },
+      onMouseEnter: (e) => e.currentTarget.style.color = hoverColor,
+      onMouseLeave: (e) => e.currentTarget.style.color = "#4b5563",
+      children
+    }
+  );
+}
+
 // src/types.ts
-function createEoaSigner(signTypedDataAsync, chainId) {
+function createEoaSigner(signTypedDataAsync, chainId, options = {}) {
   const resolve = typeof signTypedDataAsync === "function" ? signTypedDataAsync : (args) => signTypedDataAsync.current(args);
   return {
     signTypedData: (params) => resolve(params),
+    signTransaction: options.signTransaction,
+    request: options.request,
     chainId
   };
 }
 export {
+  DeleteWalletModal,
   GrpcExchangeTransport,
   HypurrConnectProvider,
   LoginModal,
+  PrivateKeySigner,
+  RenameWalletModal,
+  UserProfileModal,
+  WalletSelectorDropdown,
   createEoaSigner,
   createStaticClient,
   createTelegramClient,