@getpara/react-sdk-lite 2.0.0 → 2.2.0

package/dist/modal/components/Account/Account.js

@@ -95,7 +95,15 @@ const Account = () => {
       ] }),
       /* @__PURE__ */ jsx(ButtonContainer, { children: isOnRampLoaded ? /* @__PURE__ */ jsxs(Fragment, { children: [
         (onRampConfig.isBuyEnabled || onRampConfig.isReceiveEnabled) && !cantBuyAndWithdraw && /* @__PURE__ */ jsx(OptionButton, { icon: "plusCircle", onClick: handleBuyClick, children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: "Add Funds" }) }),
-        /* @__PURE__ */ jsx(OptionButton, { icon: "send", onClick: handleSendClick, disabled: !profileBalance, children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: "Send" }) }),
+        /* @__PURE__ */ jsx(
+          OptionButton,
+          {
+            icon: "send",
+            onClick: handleSendClick,
+            disabled: !profileBalance || embedded.authType === "externalWallet",
+            children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: "Send" })
+          }
+        ),
         onRampConfig.isWithdrawEnabled && !cantBuyAndWithdraw && /* @__PURE__ */ jsx(OptionButton, { icon: "arrowCircleDown", onClick: handleSellClick, children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: "Withdraw" }) }),
         /* @__PURE__ */ jsx(OptionButton, { icon: "user01", onClick: handleProfileClick, children: /* @__PURE__ */ jsx(CpslText, { variant: "bodyXS", color: "secondary", weight: "medium", children: isEnabled ? "Profile" : "Settings" }) })
       ] }) : /* @__PURE__ */ jsx(CpslSpinner, {}) })

package/dist/modal/components/Account/AccountHeader.js

@@ -44,7 +44,7 @@ const AccountHeader = ({ withBalance = false } = {}) => {
         src
       }
     ),
-    connectionType === "both" ? /* @__PURE__ */ jsx(AccountWalletSelect, {}) : /* @__PURE__ */ jsx(CpslText, { variant: "headingXS", weight: "semiBold", color: "contrast", children: name }),
+    connectionType === "both" ? /* @__PURE__ */ jsx(AccountWalletSelect, {}) : /* @__PURE__ */ jsx(StyledName, { variant: "headingXS", weight: "semiBold", color: "contrast", children: name }),
     withBalance && typeof totalBalance === "string" && totalBalance !== "" && /* @__PURE__ */ jsx(CpslText, { variant: "bodyM", weight: "medium", style: { visibility: profileBalance ? "visible" : "hidden" }, children: totalBalance })
   ] });
 };
@@ -55,6 +55,9 @@ const AccountContainer = safeStyled.div`
   gap: 8px;
   align-items: center;
 `;
+const StyledName = safeStyled(CpslText)`
+  text-align: center;
+`;
 export {
   AccountHeader
 };

package/dist/modal/components/Account/AccountProfileEntry.js

@@ -1,5 +1,8 @@
 "use client";
-import "../../../chunk-MMUBH76A.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "../../../chunk-MMUBH76A.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { ACCOUNT_TYPES, safeStyled, useCopyToClipboard, WalletTypeIcon } from "@getpara/react-common";
@@ -19,7 +22,6 @@ import { useAccountLinking } from "../../../provider/providers/AccountLinkProvid
 import { useInternalClient } from "../../../provider/hooks/utils/useInternalClient.js";
 const AccountProfileEntry = ({
   icon,
-  key,
   text,
   textSecondary,
   textTertiary,
@@ -27,7 +29,8 @@ const AccountProfileEntry = ({
   accessory,
   style,
   className,
-  onSelect
+  onSelect,
+  dataTestId
 }) => {
   const [isCopied, copy] = useCopyToClipboard();
   const Copy = copyString ? /* @__PURE__ */ jsx(
@@ -43,7 +46,7 @@ const AccountProfileEntry = ({
       children: /* @__PURE__ */ jsx(CopyIcon, { id: "ignore-click", slot: "start", isCopied, icon: isCopied ? "check" : "copy" })
     }
   ) : null;
-  return /* @__PURE__ */ jsxs(EntryContainer, { onClick: onSelect, className, style, children: [
+  return /* @__PURE__ */ jsxs(EntryContainer, { onClick: onSelect, className, style, "data-testid": dataTestId, children: [
     icon,
     /* @__PURE__ */ jsx(EntryDisplayName, { variant: "bodyM", color: "contrast", children: text }),
     /* @__PURE__ */ jsx(EntryFlex, { children: textSecondary ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -53,7 +56,7 @@ const AccountProfileEntry = ({
     textTertiary && /* @__PURE__ */ jsx(CpslText, { variant: "bodyM", color: "contrast", children: textTertiary }),
     accessory,
     onSelect && /* @__PURE__ */ jsx(CpslIcon, { color: "var(--cpsl-color-foreground-32)", icon: "chevronRight", size: "16px" })
-  ] }, key);
+  ] });
 };
 const WalletEntry = ({
   wallet,
@@ -109,12 +112,13 @@ const WalletEntry = ({
       textSecondary: withAddressShort ? wallet.addressShort : void 0,
       textTertiary: balance,
       copyString: wallet.address,
-      style,
+      style: __spreadProps(__spreadValues({}, style || {}), { zIndex: 2 }),
       className,
       onSelect: isSelectable ? () => {
         setProfileWallet(wallet);
         setStep(ModalStep.ACCOUNT_WALLET);
-      } : void 0
+      } : void 0,
+      dataTestId: `wallet-entry-${wallet.type}-${wallet.address}`
     },
     wallet.address
   );
@@ -176,13 +180,16 @@ const AccountLinkEntry = ({
     identifier
   );
 };
-const EntryContainer = safeStyled.div`
+const EntryContainer = safeStyled.button`
   overflow: hidden;
   position: relative;
   width: 100%;
   display: flex;
   gap: 8px;
   align-items: center;
+  background: transparent;
+  border: none;
+  padding: 0;
   ${({ onClick }) => onClick ? "cursor: pointer;" : ""}
 `;
 const EntryDisplayName = safeStyled(CpslText)``;

package/dist/modal/components/Account/AccountSend/context.js

@@ -26,12 +26,15 @@ const getDefaultSendMetadata = (balances, wallet) => {
     return { asset: null, network: null };
   }
   const walletBalance = balances.wallets.find(({ address }) => address === (wallet == null ? void 0 : wallet.address));
-  if (!walletBalance) {
+  if (!walletBalance || walletBalance.assets.length === 0) {
     return { asset: null, network: null };
   }
-  const defaultAsset = walletBalance.assets.find(
+  let defaultAsset = walletBalance.assets.find(
     ({ metadata }) => (metadata == null ? void 0 : metadata.symbol) === ((wallet == null ? void 0 : wallet.type) === "EVM" ? "ETH" : "SOL")
   );
+  if (!defaultAsset) {
+    defaultAsset = walletBalance.assets[0];
+  }
   if (!defaultAsset) {
     return { asset: null, network: null };
   }

package/dist/modal/components/Account/AccountWallet.js

@@ -84,6 +84,7 @@ const AccountWallet = () => {
           variant: "destructive",
           fullWidth: true,
           onClick: () => exportPrivateKey({ walletId: profileWallet.id, shouldOpenPopup: true }),
+          "data-testid": "export-private-key-button",
           children: [
             /* @__PURE__ */ jsx(CpslIcon, { icon: "key", slot: "start" }),
             "Export private key"

package/dist/modal/components/Controls/Controls.js

@@ -29,11 +29,12 @@ const Controls = ({ onClose }) => {
           visibility: hasPreviousStep ? "visible" : "hidden"
         },
         onClick: handleBackClick,
+        "data-testid": "modal-back-button",
         children: /* @__PURE__ */ jsx(CpslIcon, { icon: "arrow" })
       }
     ),
     /* @__PURE__ */ jsx(MiddleContainer, { children: isControls && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(ChainSelect, {}) }) }),
-    /* @__PURE__ */ jsx(CloseButton, { bareModal, variant: "ghost", onClick: onClose, children: /* @__PURE__ */ jsx(CpslIcon, { icon: "close" }) })
+    /* @__PURE__ */ jsx(CloseButton, { bareModal, variant: "ghost", onClick: onClose, "data-testid": "modal-close-button", children: /* @__PURE__ */ jsx(CpslIcon, { icon: "close" }) })
   ] });
 };
 const Container = safeStyled.div`

package/dist/modal/components/Header/Header.js

@@ -38,7 +38,7 @@ const Header = () => {
   return /* @__PURE__ */ jsx(AnimatePresence, { mode: "popLayout", initial: false, custom: stepDirection, children: /* @__PURE__ */ jsx(
     Container,
     {
-      isVisible: !isControls,
+      $isVisible: !isControls,
       custom: stepDirection,
       variants: BODY_MOTION_VARIANTS,
       initial: "enter",
@@ -61,7 +61,7 @@ const Container = safeStyled(motion.div)`
   gap: 8px;
   flex-wrap: wrap;
   height: 24px;
-  visibility: ${({ isVisible }) => isVisible ? "visible" : "hidden"};
+  visibility: ${({ $isVisible }) => $isVisible ? "visible" : "hidden"};
 `;
 const AuthDisplay = safeStyled.div`
   display: flex;

package/dist/modal/utils/validatePortalOrigin.js

@@ -4,7 +4,8 @@ import { getPortalBaseURL } from "@getpara/web-sdk";
 const validatePortalOrigin = (event, paraCtx) => {
   const portalBase = getPortalBaseURL(paraCtx);
   const portalLocalBase = getPortalBaseURL(paraCtx, true);
-  if (event.origin !== portalBase && event.origin !== portalLocalBase) {
+  const normalizedOrigin = event.origin.replace("usecapsule", "getpara");
+  if (normalizedOrigin !== portalBase && normalizedOrigin !== portalLocalBase) {
     return false;
   }
   return true;

package/dist/provider/hooks/mutations/useAddAuthMethod.js

@@ -4,11 +4,11 @@ import {
 } from "../../../chunk-MMUBH76A.js";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import { useClient } from "../utils/index.js";
-import { getPortalBaseURL } from "@getpara/web-sdk";
 import { renameMutations } from "../../utils/renameMutations.js";
 import { addCredential } from "../../actions/index.js";
 import { openPopup as openPopupFn } from "../../../modal/index.js";
 import { ACCOUNT_BASE_KEY } from "../queries/useAccount.js";
+import { validatePortalOrigin } from "../../../modal/utils/validatePortalOrigin.js";
 const ADD_CREDENTIAL_KEY = "ADD_CREDENTIAL";
 const useAddAuthMethod = ({ openPopup } = { openPopup: true }) => {
   const para = useClient();
@@ -23,9 +23,7 @@ const useAddAuthMethod = ({ openPopup } = { openPopup: true }) => {
           if (typeof window !== "undefined" && para) {
             const handleMessage = (event) => {
               var _a;
-              const portalBase = getPortalBaseURL(para.ctx);
-              const portalLocalBase = getPortalBaseURL(para.ctx, true);
-              if (!event.origin.startsWith(portalBase) && !event.origin.startsWith(portalLocalBase)) {
+              if (!validatePortalOrigin(event, para.ctx)) {
                 return;
               }
               if (((_a = event.data) == null ? void 0 : _a.type) === "CLOSE_WINDOW") {

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@getpara/react-sdk-lite",
-  "version": "2.0.0",
+  "version": "2.2.0",
   "bin": {
     "setup-para": "dist/cli/cli.mjs"
   },
   "dependencies": {
-    "@getpara/react-common": "2.0.0",
-    "@getpara/react-components": "2.0.0",
-    "@getpara/web-sdk": "2.0.0",
+    "@getpara/react-common": "2.2.0",
+    "@getpara/react-components": "2.2.0",
+    "@getpara/web-sdk": "2.2.0",
     "date-fns": "^3.6.0",
     "framer-motion": "^11.3.31",
     "libphonenumber-js": "^1.11.7",
@@ -16,9 +16,9 @@
     "zustand-sync-tabs": "^0.2.2"
   },
   "devDependencies": {
-    "@getpara/cosmos-wallet-connectors": "2.0.0",
-    "@getpara/evm-wallet-connectors": "2.0.0",
-    "@getpara/solana-wallet-connectors": "2.0.0",
+    "@getpara/cosmos-wallet-connectors": "2.2.0",
+    "@getpara/evm-wallet-connectors": "2.2.0",
+    "@getpara/solana-wallet-connectors": "2.2.0",
     "@tanstack/react-query": "^5.74.0",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.3.0",
@@ -38,7 +38,7 @@
     "package.json",
     "styles.css"
   ],
-  "gitHead": "a64b6aa9b3c481a2d955022f621e495fb55e549e",
+  "gitHead": "51765cf39b1667e0283b3906a8f8ef91e447e347",
   "main": "dist/index.js",
   "peerDependencies": {
     "@tanstack/react-query": ">=5.0.0",