npm - @compass-labs/widgets - Versions diffs - 0.1.41 → 0.1.42 - Mend

@compass-labs/widgets 0.1.41 → 0.1.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.d.mts CHANGED Viewed

@@ -341,7 +341,7 @@ interface WalletAdapter {
     switchChain?: (chainId: number) => Promise<void>;
     /**
      * Trigger wallet connection (optional)
-     * If provided, widgets will show a "Connect Wallet" button
+     * If provided, widgets will show a "Sign in" button
      */
     login?: () => void;
     /**

package/dist/index.d.ts CHANGED Viewed

@@ -341,7 +341,7 @@ interface WalletAdapter {
     switchChain?: (chainId: number) => Promise<void>;
     /**
      * Trigger wallet connection (optional)
-     * If provided, widgets will show a "Connect Wallet" button
+     * If provided, widgets will show a "Sign in" button
      */
     login?: () => void;
     /**

package/dist/index.js CHANGED Viewed

@@ -174,8 +174,10 @@ function EarnAccountProvider({ children }) {
         throw new Error(error.error || "Failed to create earn account");
       }
       const result = await response.json();
-      await queryClient.invalidateQueries({
-        queryKey: ["earnAccount", address, chainId]
+      queryClient.setQueryData(["earnAccount", address, chainId], {
+        earnAccountAddress: result.earnAccountAddress,
+        isDeployed: true,
+        needsCreation: false
       });
       return result.earnAccountAddress;
     } catch (error) {
@@ -257,8 +259,10 @@ function CreditAccountProvider({ children }) {
         throw new Error(error.error || "Failed to create credit account");
       }
       const result = await response.json();
-      await queryClient.invalidateQueries({
-        queryKey: ["creditAccount", address, chainId]
+      queryClient.setQueryData(["creditAccount", address, chainId], {
+        creditAccountAddress: result.creditAccountAddress,
+        isDeployed: true,
+        needsCreation: false
       });
       return result.creditAccountAddress;
     } catch (error) {
@@ -1203,7 +1207,7 @@ function WalletStatus({
           },
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Wallet, { size: compact ? 14 : 16 }),
-            !compact && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: "Connect Wallet" })
+            !compact && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: "Sign in" })
           ]
         }
       );
@@ -5286,9 +5290,6 @@ function EarnAccount({
       );
       return Math.min(weightedSum / earnAccountTotal, 100);
     }
-    if (allMarkets.length > 0) {
-      return Math.min(Math.max(...allMarkets.map((m) => m.apy || 0)), 100);
-    }
     return 0;
   })();
   const needsActionSwap = selectedMarket ? selectedToken !== selectedMarket.underlyingToken : false;
@@ -5742,7 +5743,7 @@ function EarnAccount({
           },
           children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center", style: { width: "100%", marginBottom: "12px", gap: "8px" }, children: [
-              showInterestRate && bestApy > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+              showInterestRate && /* @__PURE__ */ jsxRuntime.jsxs(
                 "div",
                 {
                   className: "flex items-center",
@@ -5867,11 +5868,11 @@ function EarnAccount({
                 ] }) : "No active positions" })
               }
             ),
-            (balanceTokens.length > 0 || showTopUpButton) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", style: { gap: "8px", marginTop: "12px" }, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", style: { gap: "8px", marginTop: "12px" }, children: [
               showTopUpButton && /* @__PURE__ */ jsxRuntime.jsxs(
                 "button",
                 {
-                  onClick: () => setIsFundModalOpen(true),
+                  onClick: () => isConnected ? setIsFundModalOpen(true) : login?.(),
                   "aria-label": "Add money",
                   className: "flex items-center justify-center",
                   style: {
@@ -5889,10 +5890,10 @@ function EarnAccount({
                   ]
                 }
               ),
-              balanceTokens.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+              /* @__PURE__ */ jsxRuntime.jsxs(
                 "button",
                 {
-                  onClick: () => setIsSwapModalOpen(true),
+                  onClick: () => isConnected ? setIsSwapModalOpen(true) : login?.(),
                   "aria-label": "Swap tokens",
                   className: "flex items-center justify-center",
                   style: {
@@ -6168,7 +6169,7 @@ function EarnAccount({
                 },
                 children: !isConnected ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center justify-center", style: { gap: "8px" }, children: [
                   /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Wallet, { size: 18 }),
-                  "Connect Wallet"
+                  "Sign in"
                 ] }) : isProcessing ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center justify-center", style: { gap: "4px", flexDirection: "column" }, children: [
                   /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center justify-center", style: { gap: "8px" }, children: [
                     /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { size: 16, className: "animate-spin" }),
@@ -9301,29 +9302,11 @@ function CreditAccount({
                 ] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "var(--compass-color-text-tertiary)", fontSize: "0.875rem" }, children: "No active positions" })
               }
             ),
-            !isConnected ? /* @__PURE__ */ jsxRuntime.jsx(
-              "button",
-              {
-                onClick: () => login?.(),
-                className: "flex items-center justify-center font-bold w-full",
-                style: {
-                  backgroundColor: "var(--compass-color-primary)",
-                  color: "var(--compass-color-primary-text, white)",
-                  borderRadius: "var(--compass-border-radius-lg)",
-                  padding: "12px",
-                  minHeight: "44px",
-                  fontSize: "1rem",
-                  marginTop: "8px",
-                  border: "none",
-                  transition: "all 200ms ease"
-                },
-                children: "Connect Wallet"
-              }
-            ) : isDeployed && (balancesWithUsd.length > 0 || showTopUpButton) ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", style: { gap: "8px", marginTop: "8px" }, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", style: { gap: "8px", marginTop: "8px" }, children: [
               showTopUpButton && /* @__PURE__ */ jsxRuntime.jsxs(
                 "button",
                 {
-                  onClick: () => setShowTopUp(true),
+                  onClick: () => isConnected ? setShowTopUp(true) : login?.(),
                   className: "flex items-center justify-center",
                   style: {
                     height: "36px",
@@ -9340,10 +9323,10 @@ function CreditAccount({
                   ]
                 }
               ),
-              balancesWithUsd.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+              /* @__PURE__ */ jsxRuntime.jsxs(
                 "button",
                 {
-                  onClick: () => setShowSwap(true),
+                  onClick: () => isConnected ? setShowSwap(true) : login?.(),
                   className: "flex items-center justify-center",
                   style: {
                     height: "36px",
@@ -9360,7 +9343,7 @@ function CreditAccount({
                   ]
                 }
               )
-            ] }) : null
+            ] })
           ]
         }
       ),
@@ -9377,7 +9360,7 @@ function CreditAccount({
             flex: 1
           },
           children: [
-            isDeployed && /* @__PURE__ */ jsxRuntime.jsx(
+            isDeployed ? /* @__PURE__ */ jsxRuntime.jsx(
               PositionsView,
               {
                 allowedCollateralTokens,
@@ -9399,8 +9382,100 @@ function CreditAccount({
                   setShowWithdraw(true);
                 }
               }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(WidgetFooter, {})
+            ) : /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => login?.(),
+                  className: "w-full p-3 flex items-center justify-between transition-opacity hover:opacity-80",
+                  style: {
+                    backgroundColor: "var(--compass-color-surface)",
+                    border: "1.5px solid var(--compass-color-border)",
+                    borderRadius: "var(--compass-border-radius-xl)"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start gap-0.5", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: "text-xs font-medium uppercase tracking-wide",
+                          style: { color: "var(--compass-color-text-tertiary)" },
+                          children: "Collateral"
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: "text-lg font-semibold tabular-nums",
+                          style: { color: "var(--compass-color-text)" },
+                          children: "$0.00"
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-5 w-5", style: { color: "var(--compass-color-text-tertiary)" } })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => login?.(),
+                  className: "w-full p-3 flex items-center justify-between transition-opacity hover:opacity-80",
+                  style: {
+                    backgroundColor: "var(--compass-color-surface)",
+                    border: "1.5px solid var(--compass-color-border)",
+                    borderRadius: "var(--compass-border-radius-xl)"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-start gap-0.5", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: "text-xs font-medium uppercase tracking-wide",
+                          style: { color: "var(--compass-color-text-tertiary)" },
+                          children: "Debt"
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: "text-lg font-semibold tabular-nums",
+                          style: { color: "var(--compass-color-text)" },
+                          children: "$0.00"
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-5 w-5", style: { color: "var(--compass-color-text-tertiary)" } })
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: "auto", display: "flex", flexDirection: "column", gap: "8px" }, children: [
+              !isConnected && /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  onClick: () => login?.(),
+                  className: "w-full font-bold",
+                  style: {
+                    backgroundColor: "var(--compass-color-primary)",
+                    color: "var(--compass-color-primary-text, white)",
+                    borderRadius: "var(--compass-border-radius-lg)",
+                    padding: "12px",
+                    minHeight: "44px",
+                    fontSize: "1rem",
+                    transition: "all 200ms ease",
+                    border: "none"
+                  },
+                  children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center justify-center", style: { gap: "8px" }, children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Wallet, { size: 18 }),
+                    "Sign in"
+                  ] })
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(WidgetFooter, {})
+            ] })
           ]
         }
       )
@@ -11701,7 +11776,7 @@ function RebalancingWidget({
                 fontSize: "0.875rem",
                 border: "none"
               },
-              children: "Connect Wallet"
+              children: "Sign in"
             }
           )
         ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -12044,7 +12119,7 @@ function RebalancingWidget({
                         border: "none",
                         opacity: isConnected && (depositTxState.status !== "idle" && depositTxState.status !== "confirmed" && depositTxState.status !== "failed" || !selectedMarket || !depositAmount || parseFloat(depositAmount) <= 0 || parseFloat(depositAmount) > earnBalancesQuery) ? 0.4 : 1
                       },
-                      children: !isConnected ? "Connect Wallet" : depositTxState.status !== "idle" && depositTxState.status !== "confirmed" && depositTxState.status !== "failed" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center justify-center", style: { gap: "8px" }, children: [
+                      children: !isConnected ? "Sign in" : depositTxState.status !== "idle" && depositTxState.status !== "confirmed" && depositTxState.status !== "failed" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center justify-center", style: { gap: "8px" }, children: [
                         /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { size: 16, className: "animate-spin" }),
                         "Processing..."
                       ] }) : !selectedMarket ? "Select a market" : needsSwap ? "Swap & Deposit" : "Deposit"