@swype-org/react-sdk 0.1.103 → 0.1.104

package/dist/index.d.cts

@@ -50,6 +50,8 @@ interface Wallet {
 interface Account {
     id: string;
     name: string;
+    /** Optional user-chosen display name for this account. */
+    nickname?: string | null;
     wallets: Wallet[];
     /** Remaining One-Tap allowance in USD, or null when not configured. */
     remainingAllowance?: number | null;
@@ -304,6 +306,8 @@ interface CreateAccountParams {
     name: string;
     credentialId: string;
     providerId: string;
+    /** Optional user-chosen display name. */
+    nickname?: string;
 }
 declare function createAccount(apiBaseUrl: string, token: string, params: CreateAccountParams): Promise<Account>;
 interface CreateTransferParams {

package/dist/index.d.ts

@@ -50,6 +50,8 @@ interface Wallet {
 interface Account {
     id: string;
     name: string;
+    /** Optional user-chosen display name for this account. */
+    nickname?: string | null;
     wallets: Wallet[];
     /** Remaining One-Tap allowance in USD, or null when not configured. */
     remainingAllowance?: number | null;
@@ -304,6 +306,8 @@ interface CreateAccountParams {
     name: string;
     credentialId: string;
     providerId: string;
+    /** Optional user-chosen display name. */
+    nickname?: string;
 }
 declare function createAccount(apiBaseUrl: string, token: string, params: CreateAccountParams): Promise<Account>;
 interface CreateTransferParams {

package/dist/index.js

@@ -220,6 +220,9 @@ async function createAccount(apiBaseUrl, token, params) {
     credentialId: params.credentialId,
     providerId: params.providerId
   };
+  if (params.nickname) {
+    body.nickname = params.nickname;
+  }
   const res = await fetch(`${apiBaseUrl}/v1/accounts`, {
     method: "POST",
     headers: {
@@ -2644,6 +2647,8 @@ function SourceCard({
       accounts.map((account) => {
         const active = hasActiveWallet2(account);
         const isSelected = account.id === selectedAccountId;
+        const displayName = account.nickname ?? account.name;
+        const walletAddress = account.wallets[0]?.name;
         return /* @__PURE__ */ jsxs(
           "button",
           {
@@ -2667,7 +2672,10 @@ function SourceCard({
                     style: dropdownLogoStyle
                   }
                 ) : /* @__PURE__ */ jsx("div", { style: dropdownFallbackIconStyle(active ? tokens.textMuted : tokens.border), children: account.name.charAt(0) }),
-                /* @__PURE__ */ jsx("span", { style: dropdownNameStyle(active ? tokens.text : tokens.textMuted), children: account.name })
+                /* @__PURE__ */ jsxs("div", { style: dropdownNameColumnStyle, children: [
+                  /* @__PURE__ */ jsx("span", { style: dropdownNameStyle(active ? tokens.text : tokens.textMuted), children: displayName }),
+                  walletAddress && /* @__PURE__ */ jsx("span", { style: dropdownAddressStyle(active ? tokens.textMuted : tokens.border), children: walletAddress })
+                ] })
               ] }),
               /* @__PURE__ */ jsxs("div", { style: dropdownRowRightStyle, children: [
                 active ? /* @__PURE__ */ jsx("span", { style: activeBadgeStyle(tokens), children: "Active" }) : /* @__PURE__ */ jsx("span", { style: inactiveBadgeStyle(tokens), children: "Setup incomplete" }),
@@ -2697,7 +2705,7 @@ function SourceCard({
             style: addProviderStyle(tokens),
             children: [
               /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M12 5v14M5 12h14", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round" }) }),
-              "Add Provider"
+              "Add Account"
             ]
           }
         )
@@ -2819,6 +2827,12 @@ var dropdownFallbackIconStyle = (color) => ({
   color,
   flexShrink: 0
 });
+var dropdownNameColumnStyle = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 2,
+  minWidth: 0
+};
 var dropdownNameStyle = (color) => ({
   fontWeight: 500,
   color,
@@ -2826,6 +2840,14 @@ var dropdownNameStyle = (color) => ({
   overflow: "hidden",
   textOverflow: "ellipsis"
 });
+var dropdownAddressStyle = (color) => ({
+  fontSize: "0.72rem",
+  color,
+  fontFamily: '"SF Mono", "Fira Code", monospace',
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis"
+});
 var activeBadgeStyle = (tokens) => ({
   fontSize: "0.6rem",
   fontWeight: 600,