@openfort/react 1.5.1 → 1.6.0

package/build/hooks/openfort/useSignMessage.d.ts

@@ -0,0 +1,27 @@
+import { type SignTypedDataPayload } from '../../components/Openfort/types';
+/**
+ * Hook for signing messages with a confirmation modal (EVM only).
+ *
+ * Opens the Openfort "Sign message" screen, shows the message (or EIP-712 typed
+ * data) to the user, and resolves with the signature once they confirm. Rejects
+ * if the user dismisses the modal.
+ *
+ * @example
+ * ```tsx
+ * const { signMessage, signTypedData, isPending } = useSignMessage()
+ *
+ * const signature = await signMessage('I hereby vote for foobar')
+ *
+ * const typedSignature = await signTypedData({
+ *   domain: { name: 'Ether Mail', version: '1', chainId: 1, verifyingContract: '0x…' },
+ *   types: { Person: [{ name: 'name', type: 'string' }] },
+ *   primaryType: 'Person',
+ *   message: { name: 'Cow' },
+ * })
+ * ```
+ */
+export declare function useSignMessage(): {
+    signMessage: (message: string) => Promise<`0x${string}`>;
+    signTypedData: (typedData: SignTypedDataPayload) => Promise<`0x${string}`>;
+    isPending: boolean;
+};

package/build/hooks/openfort/useSignMessage.js

@@ -0,0 +1,52 @@
+import { useState, useCallback } from 'react';
+import { routes } from '../../components/Openfort/types.js';
+import { useOpenfort } from '../../components/Openfort/useOpenfort.js';
+
+/**
+ * Hook for signing messages with a confirmation modal (EVM only).
+ *
+ * Opens the Openfort "Sign message" screen, shows the message (or EIP-712 typed
+ * data) to the user, and resolves with the signature once they confirm. Rejects
+ * if the user dismisses the modal.
+ *
+ * @example
+ * ```tsx
+ * const { signMessage, signTypedData, isPending } = useSignMessage()
+ *
+ * const signature = await signMessage('I hereby vote for foobar')
+ *
+ * const typedSignature = await signTypedData({
+ *   domain: { name: 'Ether Mail', version: '1', chainId: 1, verifyingContract: '0x…' },
+ *   types: { Person: [{ name: 'name', type: 'string' }] },
+ *   primaryType: 'Person',
+ *   message: { name: 'Cow' },
+ * })
+ * ```
+ */
+function useSignMessage() {
+    const { setSignRequest, setRoute, setOpen } = useOpenfort();
+    const [isPending, setIsPending] = useState(false);
+    const request = useCallback((args) => new Promise((resolve, reject) => {
+        setIsPending(true);
+        // setOpen(true) resets route/history, so it MUST run before setRoute.
+        setOpen(true);
+        setSignRequest({
+            ...args,
+            resolve: (signature) => {
+                setIsPending(false);
+                resolve(signature);
+            },
+            reject: (reason) => {
+                setIsPending(false);
+                reject(reason);
+            },
+        });
+        setRoute(routes.SIGN_MESSAGE);
+    }), [setSignRequest, setRoute, setOpen]);
+    const signMessage = useCallback((message) => request({ kind: 'message', message }), [request]);
+    const signTypedData = useCallback((typedData) => request({ kind: 'typedData', typedData }), [request]);
+    return { signMessage, signTypedData, isPending };
+}
+
+export { useSignMessage };
+//# sourceMappingURL=useSignMessage.js.map

package/build/hooks/openfort/useSignMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSignMessage.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/hooks/openfort/useUI.d.ts

@@ -1,3 +1,4 @@
+import { type Asset } from '../../components/Openfort/types';
 /**
  * Hook for controlling Openfort UI modal and navigation
  *
@@ -35,7 +36,11 @@ export declare function useUI(): {
     openSwitchNetworks: () => void;
     openProviders: () => void;
     openWallets: () => void;
-    openSend: () => void;
+    openSend: (tx?: {
+        to: string;
+        amount: string;
+        asset?: Asset;
+    }) => void;
     openReceive: () => void;
     openFunding: () => void;
     openBuy: () => void;

package/build/hooks/openfort/useUI.js

@@ -68,7 +68,7 @@ function isAccountId(id) {
  */
 function useUI() {
     var _a;
-    const { open, setOpen, setRoute, setConnector, connector, chainType } = useOpenfort();
+    const { open, setOpen, setRoute, setConnector, setSendForm, connector, chainType } = useOpenfort();
     const { isLoading, user, needsRecovery, embeddedAccounts, activeEmbeddedAddress, embeddedState } = useOpenfortCore();
     const bridge = useEthereumBridge();
     const strategy = useConnectionStrategy();
@@ -100,6 +100,16 @@ function useUI() {
         else
             setRoute(routes.CONNECTED);
     }
+    /**
+     * Prefill the send form and jump straight to the confirmation (preview) screen
+     * for the active chain, skipping asset/amount/recipient entry.
+     */
+    const openSendPreview = (tx) => {
+        var _a;
+        setSendForm({ recipient: tx.to, amount: tx.amount, asset: (_a = tx.asset) !== null && _a !== void 0 ? _a : { type: 'native', balance: BigInt(0) } });
+        setOpen(true);
+        setRoute(chainType === ChainTypeEnum.SVM ? routes.SOL_SEND_CONFIRMATION : routes.SEND_CONFIRMATION);
+    };
     const gotoAndOpen = (route) => {
         const safeList = isConnected ? safeRoutes.connected : safeRoutes.disconnected;
         const fallback = isConnected ? routes.CONNECTED : routes.PROVIDERS;
@@ -123,7 +133,7 @@ function useUI() {
         openSwitchNetworks: () => gotoAndOpen(routes.ETH_SWITCH_NETWORK),
         openProviders: () => gotoAndOpen(routes.PROVIDERS),
         openWallets: () => gotoAndOpen({ route: routes.CONNECTORS, connectType: 'linkIfUserConnectIfNoUser' }),
-        openSend: () => gotoAndOpen(routes.SEND),
+        openSend: (tx) => tx ? openSendPreview(tx) : gotoAndOpen(routes.SEND),
         openReceive: () => gotoAndOpen(routes.RECEIVE),
         openFunding: () => gotoAndOpen(routes.DEPOSIT),
         openBuy: () => gotoAndOpen(routes.BUY),

package/build/hooks/openfort/useUI.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUI.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"useUI.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/index.d.ts

@@ -44,7 +44,7 @@ export { default as Avatar } from './components/Common/Avatar';
 export { default as ChainIcon } from './components/Common/Chain';
 export { OpenfortButton } from './components/ConnectButton';
 export { OpenfortProvider } from './components/Openfort/OpenfortProvider';
-export type { CustomizableRoutes, MultiChainAsset } from './components/Openfort/types';
+export type { CustomizableRoutes, MultiChainAsset, SignTypedDataPayload } from './components/Openfort/types';
 export { FundingMethod, LinkWalletOnSignUpOption, UIAuthProvider as AuthProvider } from './components/Openfort/types';
 export { embeddedWalletId } from './constants/openfort';
 export { OpenfortError, OpenfortReactErrorType, OpenfortReactErrorType as OpenfortErrorType, } from './core/errors';
@@ -64,6 +64,7 @@ export type { FundingSession, FundingTarget, PaymentMethod, PaymentMethodInput,
 export { useFunding } from './hooks/openfort/useFunding';
 export { useGrantPermissions } from './hooks/openfort/useGrantPermissions';
 export { useRevokePermissions } from './hooks/openfort/useRevokePermissions';
+export { useSignMessage } from './hooks/openfort/useSignMessage';
 export { useUI } from './hooks/openfort/useUI';
 export { useUser } from './hooks/openfort/useUser';
 export type { UserWallet } from './hooks/openfort/walletTypes';

package/build/index.js

@@ -17,6 +17,7 @@ export { use7702Authorization } from './hooks/openfort/use7702Authorization.js';
 export { useFunding } from './hooks/openfort/useFunding.js';
 export { useGrantPermissions } from './hooks/openfort/useGrantPermissions.js';
 export { useRevokePermissions } from './hooks/openfort/useRevokePermissions.js';
+export { useSignMessage } from './hooks/openfort/useSignMessage.js';
 export { useUI } from './hooks/openfort/useUI.js';
 export { useUser } from './hooks/openfort/useUser.js';
 export { invalidateBalance } from './hooks/useBalance.js';

package/build/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/localizations/locales/en-US.js

@@ -86,7 +86,7 @@ const enUS = {
     injectionScreen_notconnected_h1: `Login to {{ CONNECTORNAME }}`,
     injectionScreen_notconnected_p: `To continue, please login to your {{ CONNECTORNAME }} extension.`,
     profileScreen_heading: 'Connected',
-    buyScreen_heading: 'Add funds',
+    buyScreen_heading: 'Add funds from card',
     buyScreen_subheading: 'Select an amount and token to top up.',
     buyScreen_payWithCard_title: 'Pay with card',
     buyScreen_payWithCard_description: 'Use Stripe or Google Pay for a quick card purchase.',

package/build/utils/rpc.d.ts

@@ -6,6 +6,12 @@
  */
 import type { Chain } from 'viem';
 import type { SolanaCluster } from '../solana/types';
+/**
+ * Whether an EVM chain id is a testnet. Reads viem's chain metadata (`testnet`)
+ * for the chains the SDK bundles, falling back to a small extra set. Use this to
+ * key behaviour off the wallet's active chain rather than the publishable key.
+ */
+export declare function isTestnetChainId(chainId: number): boolean;
 export declare function getDefaultEthereumRpcUrl(chainId: number): string;
 /**
  * Get default Solana RPC URL for a cluster.

package/build/utils/rpc.js

@@ -17,6 +17,17 @@ const KNOWN_CHAINS = {
     [optimismSepolia.id]: optimismSepolia,
     [arbitrumSepolia.id]: arbitrumSepolia,
 };
+/** Testnets not in {@link KNOWN_CHAINS} but still worth recognizing (deprecated/uncommon). */
+const EXTRA_TESTNET_CHAIN_IDS = new Set([5, 80001, 97, 4002]);
+/**
+ * Whether an EVM chain id is a testnet. Reads viem's chain metadata (`testnet`)
+ * for the chains the SDK bundles, falling back to a small extra set. Use this to
+ * key behaviour off the wallet's active chain rather than the publishable key.
+ */
+function isTestnetChainId(chainId) {
+    var _a;
+    return ((_a = KNOWN_CHAINS[chainId]) === null || _a === void 0 ? void 0 : _a.testnet) === true || EXTRA_TESTNET_CHAIN_IDS.has(chainId);
+}
 /**
  * Default Solana RPC URLs by cluster.
  * Production apps should provide their own RPCs via walletConfig.solana.rpcUrls.
@@ -93,5 +104,5 @@ function buildChainFromConfig(chainId, rpcUrls) {
     });
 }
 
-export { buildChainFromConfig, getChainName, getDefaultEthereumRpcUrl, getDefaultSolanaRpcUrl, getNativeCurrency };
+export { buildChainFromConfig, getChainName, getDefaultEthereumRpcUrl, getDefaultSolanaRpcUrl, getNativeCurrency, isTestnetChainId };
 //# sourceMappingURL=rpc.js.map

package/build/utils/rpc.js.map

@@ -1 +1 @@
-{"version":3,"file":"rpc.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"rpc.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/version.d.ts

@@ -1 +1 @@
-export declare const OPENFORT_VERSION = "1.5.1";
+export declare const OPENFORT_VERSION = "1.6.0";

package/build/version.js

@@ -1,4 +1,4 @@
-const OPENFORT_VERSION = '1.5.1';
+const OPENFORT_VERSION = '1.6.0';
 
 export { OPENFORT_VERSION };
 //# sourceMappingURL=version.js.map

package/build/wagmi/components/ChainSelect/index.js

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { motion } from 'framer-motion';
 import { useState, useEffect } from 'react';
-import { css } from 'styled-components';
 import { useChainId } from 'wagmi';
 import Chain from '../../../components/Common/Chain/index.js';
+import { SwitchChainButton } from '../../../components/Common/Chain/styles.js';
 import Tooltip from '../../../components/Common/Tooltip/index.js';
 import { routes } from '../../../components/Openfort/types.js';
 import { useOpenfort } from '../../../components/Openfort/useOpenfort.js';
@@ -15,98 +15,6 @@ import { useSwitchChainFiltered } from '../../useSwitchChainFiltered.js';
 import ChainSelectDropdown from '../ChainSelectDropdown/index.js';
 
 const Container = styled(motion.div) ``;
-const SwitchChainButton = styled(motion.button) `
-  --color: var(
-    --ck-dropdown-button-color,
-    var(--ck-button-primary-color, var(--ck-body-color))
-  );
-  --background: var(
-    --ck-dropdown-button-background,
-    var(--ck-secondary-button-background, var(--ck-body-background-secondary))
-  );
-  --box-shadow: var(
-    --ck-dropdown-button-box-shadow,
-    var(
-      --ck-secondary-button-box-shadow,
-      var(--ck-button-primary-box-shadow),
-      none
-    )
-  );
-
-  --hover-color: var(--ck-dropdown-button-hover-color, var(--color));
-  --hover-background: var(
-    --ck-dropdown-button-hover-background,
-    var(--background)
-  );
-  --hover-box-shadow: var(
-    --ck-dropdown-button-hover-box-shadow,
-    var(--box-shadow)
-  );
-
-  --active-color: var(--ck-dropdown-button-active-color, var(--hover-color));
-  --active-background: var(
-    --ck-dropdown-button-active-background,
-    var(--hover-background)
-  );
-  --active-box-shadow: var(
-    --ck-dropdown-button-active-box-shadow,
-    var(--hover-box-shadow)
-  );
-
-  appearance: none;
-  user-select: none;
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  border-radius: 15px;
-  width: 52px;
-  height: 30px;
-  padding: 2px 6px 2px 3px;
-  font-size: 16px;
-  line-height: 19px;
-  font-weight: 500;
-  text-decoration: none;
-  white-space: nowrap;
-  transform: translateZ(0px);
-
-  transition: 100ms ease;
-  transition-property: transform, background-color, box-shadow, color;
-
-  color: var(--color);
-  background: var(--background);
-  box-shadow: var(--box-shadow);
-
-  svg {
-    position: relative;
-    display: block;
-  }
-
-  ${(props) => props.disabled
-    ? css `
-          width: auto;
-          padding: 3px;
-          position: relative;
-          left: -22px;
-        `
-    : css `
-          cursor: pointer;
-
-          @media only screen and (min-width: ${defaultTheme.mobileWidth + 1}px) {
-            &:hover,
-            &:focus-visible {
-              color: var(--hover-color);
-              background: var(--hover-background);
-              box-shadow: var(--hover-box-shadow);
-            }
-            &:active {
-              color: var(--active-color);
-              background: var(--active-background);
-              box-shadow: var(--active-box-shadow);
-            }
-          }
-        `}
-`;
 const ChevronDown = ({ ...props }) => (jsx("svg", { "aria-hidden": "true", width: "11", height: "6", viewBox: "0 0 11 6", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: jsx("path", { d: "M1.5 1L5.5 5L9.5 1", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }));
 const ChainSelector = () => {
     var _a;

package/build/wagmi/components/ChainSelect/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openfort/react",
-  "version": "1.5.1",
+  "version": "1.6.0",
   "author": "Openfort (https://www.openfort.io)",
   "license": "BSD-2-Clause license",
   "description": "The easiest way to integrate Openfort to your project.",