@volr/react-ui 0.2.5 → 0.2.6

package/dist/index.js

@@ -1,4 +1,4 @@
-import React14, { createContext, useContext, useState, useCallback, useEffect, useMemo, useRef, useId, useReducer } from 'react';
+import React15, { createContext, useContext, useState, useCallback, useEffect, useMemo, useRef, useId, useReducer } from 'react';
 import { createPortal } from 'react-dom';
 import { useVolrContext, useInternalAuth, usePasskeyEnrollment, checkPrfCompatibility, getPlatformHint, useMpcConnection, VolrProvider, useVolrAuthCallback, useVolrPaymentApi, completeMigration, requestMigration, decryptEntropyForMigration, listenForSeedRequests, useUserBalances, useVolrLogin, useVolr, useEIP6963, useWithdraw, useDepositListener, createGetNetworkInfo } from '@volr/react';
 export { VolrProvider, useDepositListener, usePasskeyEnrollment, useVolr, useVolrLogin, useVolrPaymentApi } from '@volr/react';
@@ -1941,7 +1941,7 @@ var variantMap = {
   ghost: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "none" },
   outline: { backgroundColor: "transparent", color: "var(--volr-text-secondary)", border: "1px solid var(--volr-border)" }
 };
-var Button = React14.forwardRef(
+var Button = React15.forwardRef(
   ({ variant = "primary", size = "md", fullWidth, className, style, disabled, children, ...props }, ref) => {
     const { accentColor } = useVolrUI();
     const sizeStyle = sizeMap[size];
@@ -3785,7 +3785,7 @@ function AssetSelectView({
     }) })
   ] });
 }
-var TextLinkButton = React14.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
+var TextLinkButton = React15.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
   return /* @__PURE__ */ jsxs(
     "button",
     {
@@ -5056,7 +5056,7 @@ function BalanceDetailView({
     /* @__PURE__ */ jsx("div", { children: balances.map((token) => /* @__PURE__ */ jsx(TokenRow, { token }, token.id)) })
   ] });
 }
-var Input = React14.forwardRef(
+var Input = React15.forwardRef(
   ({ leftIcon, error, className, style, disabled, ...props }, ref) => {
     return /* @__PURE__ */ jsxs("div", { className: "volr:relative", children: [
       leftIcon && /* @__PURE__ */ jsx("div", { className: "volr:absolute volr:left-3 volr:top-1/2 volr:-translate-y-1/2 volr:pointer-events-none volr-text-muted", children: leftIcon }),
@@ -6486,6 +6486,7 @@ function usePaymentModalState(open, onOpenChange) {
       if (!tokenInfo) {
         return;
       }
+      const permitType = tokenInfo.permitType ?? (tokenInfo.permitSupported ? "EIP2612" : "NONE");
       if (tokenInfo.address === "native") {
         dispatch({
           type: "PAYMENT_ERROR",
@@ -6496,6 +6497,16 @@ function usePaymentModalState(open, onOpenChange) {
         });
         return;
       }
+      if (permitType !== "EIP2612") {
+        dispatch({
+          type: "PAYMENT_ERROR",
+          error: {
+            code: "TOKEN_NOT_SUPPORTED",
+            message: "External wallet payment is not supported for this token."
+          }
+        });
+        return;
+      }
       dispatch({ type: "START_PAYMENT" });
       let createdPaymentId = null;
       const toPaymentError = (err) => {
@@ -7449,8 +7460,23 @@ var PaymentModal = ({
   const requiresVolrWallet = config.walletPolicy?.requireVolrWalletOnLogin ?? true;
   const hasVolrWallet = Boolean(user?.evmAddress);
   const externalWalletAllowed = allowExternalWalletPayment && !requiresVolrWallet;
-  const externalWalletTokenSupported = selectedToken && selectedToken.address !== "native" && selectedToken.permitSupported === true;
+  const resolvedPermitType = selectedToken?.permitType ?? (selectedToken?.permitSupported ? "EIP2612" : "NONE");
+  const externalWalletTokenSupported = selectedToken && selectedToken.address !== "native" && resolvedPermitType === "EIP2612";
   const showExternalWalletOption = externalWalletAllowed && externalWalletTokenSupported;
+  const permit2WarnedRef = React15.useRef(false);
+  React15.useEffect(() => {
+    if (!permit2WarnedRef.current && externalWalletAllowed && resolvedPermitType === "PERMIT2" && !selectedToken?.permit2Address) {
+      console.warn(
+        `[volr/react-ui] External wallet payment hidden: permit2Address is not configured for chain ${selectedToken?.chainId}.`
+      );
+      permit2WarnedRef.current = true;
+    }
+  }, [
+    externalWalletAllowed,
+    resolvedPermitType,
+    selectedToken?.permit2Address,
+    selectedToken?.chainId
+  ]);
   if (showDeposit && selectedToken) {
     return /* @__PURE__ */ jsx(
       DepositModal,
@@ -7920,7 +7946,7 @@ function WalletRequiredModal() {
     }
   );
 }
-var VolrUIContext = React14.createContext(null);
+var VolrUIContext = React15.createContext(null);
 function getCurrentRpId() {
   if (typeof window === "undefined") return "localhost";
   return window.location.hostname;
@@ -8548,8 +8574,8 @@ function OnboardingChecker({
 }) {
   const { user, provider, isLoading } = useVolrContext();
   const { isOpen: isModalOpen } = useVolrModal();
-  const modalWasOpened = React14.useRef(false);
-  const pendingMismatchOnboarding = React14.useRef(false);
+  const modalWasOpened = React15.useRef(false);
+  const pendingMismatchOnboarding = React15.useRef(false);
   useEffect(() => {
     if (isModalOpen) {
       modalWasOpened.current = true;