@openfort/react 0.0.32 → 0.0.34

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.
package/build/index.es.js CHANGED
@@ -3,14 +3,14 @@ export { AccountTypeEnum, OAuthProvider, OpenfortEvents, RecoveryMethod, ThirdPa
3
3
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
4
4
  import React, { useState, useEffect, createContext, useRef, useId, useMemo, useCallback, createElement, useLayoutEffect, useContext } from 'react';
5
5
  import { normalize } from 'viem/ens';
6
- import { useConfig, createConfig, http, useEnsAddress, useEnsName, useEnsAvatar, useAccount, useBlockNumber, useBalance, useConnectors as useConnectors$1, useConnect as useConnect$1, useDisconnect, useChainId, useSwitchChain, usePublicClient, WagmiContext } from 'wagmi';
7
- import { mainnet, polygon, optimism, arbitrum, sepolia } from 'wagmi/chains';
6
+ import { useEnsAddress, useEnsName, useEnsAvatar, useConfig, useAccount, useBlockNumber, useBalance, useConnectors as useConnectors$1, useConnect as useConnect$1, useDisconnect, useChainId, http, useSwitchChain, usePublicClient, WagmiContext, useWalletClient } from 'wagmi';
8
7
  import { motion, AnimatePresence, MotionConfig } from 'framer-motion';
9
8
  import styled$1, { css, keyframes } from 'styled-components';
10
9
  import { detect } from 'detect-browser';
11
10
  import { useQueryClient, useQuery } from '@tanstack/react-query';
12
11
  import useMeasure from 'react-use-measure';
13
12
  import { Buffer } from 'buffer';
13
+ import { mainnet, polygon, optimism, arbitrum, sepolia } from 'wagmi/chains';
14
14
  import { safe, injected, coinbaseWallet, walletConnect } from '@wagmi/connectors';
15
15
  import { useTransition } from 'react-transition-state';
16
16
  import ResizeObserver from 'resize-observer-polyfill';
@@ -21,47 +21,21 @@ import calculateEntropy from 'fast-password-entropy';
21
21
  import { switchChain, signMessage } from '@wagmi/core';
22
22
  import { AxiosError } from 'axios';
23
23
  import { createSiweMessage } from 'viem/siwe';
24
- import { parseSignature } from 'viem';
24
+ import { parseSignature, createWalletClient, custom } from 'viem';
25
25
  import { hashAuthorization } from 'viem/utils';
26
-
27
- /**
28
- * Hook for checking if a blockchain chain is supported.
29
- *
30
- * This hook verifies whether a specific blockchain chain ID is part of the
31
- * configured Wagmi chains. Use it to validate chain compatibility before
32
- * attempting operations or rendering chain-specific UI.
33
- *
34
- * @param chainId - The blockchain chain ID to check for support.
35
- * @returns `true` when the chain is configured, `false` otherwise.
36
- *
37
- * @example
38
- * ```tsx
39
- * const ChainStatus: React.FC<{ chainId?: number }> = ({ chainId }) => {
40
- * const isSupported = useChainIsSupported(chainId);
41
- *
42
- * return (
43
- * <span>
44
- * {chainId ?? 'Unknown chain'}: {isSupported ? 'Supported' : 'Unsupported'}
45
- * </span>
46
- * );
47
- * };
48
- * ```
49
- */
50
- function useChainIsSupported(chainId) {
51
- const { chains } = useConfig();
52
- if (chainId === undefined || chainId === null)
53
- return false;
54
- return chains.some((x) => x.id === chainId);
55
- }
56
-
57
- const ensFallbackConfig = createConfig({
58
- chains: [mainnet],
59
- transports: {
60
- [mainnet.id]: http(),
61
- },
62
- });
26
+ import { erc7715Actions } from 'viem/experimental';
27
+
28
+ // import { createConfig, http } from 'wagmi'
29
+ // import { mainnet } from 'wagmi/chains'
30
+ // import { useChainIsSupported } from './useChainIsSupported'
31
+ // const ensFallbackConfig = createConfig({
32
+ // chains: [mainnet],
33
+ // transports: {
34
+ // [mainnet.id]: http(),
35
+ // },
36
+ // })
63
37
  function useEnsFallbackConfig() {
64
- return !useChainIsSupported(1) ? ensFallbackConfig : undefined;
38
+ return /* !useChainIsSupported(1) ? ensFallbackConfig : */ undefined;
65
39
  }
66
40
 
67
41
  function useIsMounted() {
@@ -1284,7 +1258,7 @@ const ImageContainer$1 = styled(motion.img) `
1284
1258
  `;
1285
1259
 
1286
1260
  const Avatar = ({ address, name, size = 96, radius = 96 }) => {
1287
- var _a, _b, _c;
1261
+ var _a;
1288
1262
  const isMounted = useIsMounted();
1289
1263
  const context = useOpenfort();
1290
1264
  const imageRef = useRef(null);
@@ -1318,13 +1292,13 @@ const Avatar = ({ address, name, size = 96, radius = 96 }) => {
1318
1292
  }, [ensAvatar]);
1319
1293
  if (!isMounted)
1320
1294
  return jsx("div", { style: { width: size, height: size, borderRadius: radius } });
1321
- if ((_b = context.uiConfig) === null || _b === void 0 ? void 0 : _b.customAvatar)
1295
+ if (context.uiConfig.customAvatar)
1322
1296
  return (jsx("div", { style: {
1323
1297
  width: size,
1324
1298
  height: size,
1325
1299
  borderRadius: radius,
1326
1300
  overflow: 'hidden',
1327
- }, children: (_c = context.uiConfig) === null || _c === void 0 ? void 0 : _c.customAvatar({
1301
+ }, children: context.uiConfig.customAvatar({
1328
1302
  address: address !== null && address !== void 0 ? address : ens === null || ens === void 0 ? void 0 : ens.address,
1329
1303
  ensName: name !== null && name !== void 0 ? name : ens === null || ens === void 0 ? void 0 : ens.name,
1330
1304
  ensImage: ens === null || ens === void 0 ? void 0 : ens.avatar,
@@ -1788,6 +1762,36 @@ const chainConfigs = [
1788
1762
  },
1789
1763
  ];
1790
1764
 
1765
+ /**
1766
+ * Hook for checking if a blockchain chain is supported.
1767
+ *
1768
+ * This hook verifies whether a specific blockchain chain ID is part of the
1769
+ * configured Wagmi chains. Use it to validate chain compatibility before
1770
+ * attempting operations or rendering chain-specific UI.
1771
+ *
1772
+ * @param chainId - The blockchain chain ID to check for support.
1773
+ * @returns `true` when the chain is configured, `false` otherwise.
1774
+ *
1775
+ * @example
1776
+ * ```tsx
1777
+ * const ChainStatus: React.FC<{ chainId?: number }> = ({ chainId }) => {
1778
+ * const isSupported = useChainIsSupported(chainId);
1779
+ *
1780
+ * return (
1781
+ * <span>
1782
+ * {chainId ?? 'Unknown chain'}: {isSupported ? 'Supported' : 'Unsupported'}
1783
+ * </span>
1784
+ * );
1785
+ * };
1786
+ * ```
1787
+ */
1788
+ function useChainIsSupported(chainId) {
1789
+ const { chains } = useConfig();
1790
+ if (chainId === undefined || chainId === null)
1791
+ return false;
1792
+ return chains.some((x) => x.id === chainId);
1793
+ }
1794
+
1791
1795
  const ChainContainer = styled.div `
1792
1796
  --bg: transparent;
1793
1797
  --color: #333;
@@ -1951,6 +1955,17 @@ const useWalletStatus = () => {
1951
1955
  return [context.walletStatus, context.setWalletStatus];
1952
1956
  };
1953
1957
 
1958
+ const PREFIX = '[Openfort-React]';
1959
+ const logger = {
1960
+ enabled: true,
1961
+ // biome-ignore lint/suspicious/noConsole: allowed for debugging
1962
+ log: (...args) => (logger.enabled ? console.log(PREFIX, ...args) : null),
1963
+ // biome-ignore lint/suspicious/noConsole: allowed for debugging
1964
+ error: (...args) => (logger.enabled ? console.error(PREFIX, ...args) : null),
1965
+ // biome-ignore lint/suspicious/noConsole: allowed for debugging
1966
+ warn: (...args) => (logger.enabled ? console.warn(PREFIX, ...args) : null),
1967
+ };
1968
+
1954
1969
  const safeRoutes = {
1955
1970
  disconnected: [
1956
1971
  routes.PROVIDERS,
@@ -2026,7 +2041,7 @@ const allRoutes = [...safeRoutes.connected, ...safeRoutes.disconnected];
2026
2041
  * ```
2027
2042
  */
2028
2043
  function useUI() {
2029
- const { open, setOpen, setRoute, log } = useOpenfort();
2044
+ const { open, setOpen, setRoute } = useOpenfort();
2030
2045
  const { isLoading, user, needsRecovery } = useOpenfortCore();
2031
2046
  const { isConnected } = useAccount();
2032
2047
  function defaultOpen() {
@@ -2046,19 +2061,19 @@ function useUI() {
2046
2061
  let validRoute = route;
2047
2062
  if (!allRoutes.includes(route)) {
2048
2063
  validRoute = isConnected ? routes.PROFILE : routes.PROVIDERS;
2049
- log(`Route ${route} is not a valid route, navigating to ${validRoute} instead.`);
2064
+ logger.log(`Route ${route} is not a valid route, navigating to ${validRoute} instead.`);
2050
2065
  }
2051
2066
  else {
2052
2067
  if (isConnected) {
2053
2068
  if (!safeRoutes.connected.includes(route)) {
2054
2069
  validRoute = routes.PROFILE;
2055
- log(`Route ${route} is not a valid route when connected, navigating to ${validRoute} instead.`);
2070
+ logger.log(`Route ${route} is not a valid route when connected, navigating to ${validRoute} instead.`);
2056
2071
  }
2057
2072
  }
2058
2073
  else {
2059
2074
  if (!safeRoutes.disconnected.includes(route)) {
2060
2075
  validRoute = routes.PROVIDERS;
2061
- log(`Route ${route} is not a valid route when disconnected, navigating to ${validRoute} instead.`);
2076
+ logger.log(`Route ${route} is not a valid route when disconnected, navigating to ${validRoute} instead.`);
2062
2077
  }
2063
2078
  }
2064
2079
  }
@@ -3524,21 +3539,10 @@ export const keys = {
3524
3539
  };
3525
3540
  */
3526
3541
 
3527
- const PREFIX = '[Openfort-React]';
3528
- const logger = {
3529
- enabled: true,
3530
- // biome-ignore lint/suspicious/noConsole: allowed for debugging
3531
- log: (...args) => (logger.enabled ? console.log(PREFIX, ...args) : null),
3532
- // biome-ignore lint/suspicious/noConsole: allowed for debugging
3533
- error: (...args) => (logger.enabled ? console.error(PREFIX, ...args) : null),
3534
- // biome-ignore lint/suspicious/noConsole: allowed for debugging
3535
- warn: (...args) => (logger.enabled ? console.warn(PREFIX, ...args) : null),
3536
- };
3537
-
3538
3542
  function useLocales(replacements) {
3539
- var _a, _b;
3543
+ var _a;
3540
3544
  const context = useOpenfort();
3541
- const language = (_b = (_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.language) !== null && _b !== void 0 ? _b : 'en-US';
3545
+ const language = (_a = context.uiConfig.language) !== null && _a !== void 0 ? _a : 'en-US';
3542
3546
  const translations = useMemo(() => {
3543
3547
  return getLocale(language);
3544
3548
  }, [language]);
@@ -4133,20 +4137,18 @@ label, showBalance = false, showAvatar = true,
4133
4137
  theme, mode, customTheme,
4134
4138
  // Events
4135
4139
  onClick, }) {
4136
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
4140
+ var _a;
4137
4141
  const isMounted = useIsMounted();
4138
4142
  const context = useOpenfort();
4139
4143
  const { address, chain } = useAccount();
4140
4144
  const chainIsSupported = useChainIsSupported(chain === null || chain === void 0 ? void 0 : chain.id);
4141
4145
  const { open } = useUI();
4142
- const separator = ['web95', 'rounded', 'minimal'].includes((_b = theme !== null && theme !== void 0 ? theme : (_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.theme) !== null && _b !== void 0 ? _b : '')
4143
- ? '....'
4144
- : undefined;
4146
+ const separator = ['web95', 'rounded', 'minimal'].includes((_a = theme !== null && theme !== void 0 ? theme : context.uiConfig.theme) !== null && _a !== void 0 ? _a : '') ? '....' : undefined;
4145
4147
  if (!isMounted)
4146
4148
  return null;
4147
4149
  const shouldShowBalance = showBalance && chainIsSupported;
4148
4150
  const willShowBalance = address && shouldShowBalance;
4149
- return (jsx(ResetContainer, { "$useTheme": theme !== null && theme !== void 0 ? theme : (_c = context.uiConfig) === null || _c === void 0 ? void 0 : _c.theme, "$useMode": mode !== null && mode !== void 0 ? mode : context.mode, "$customTheme": customTheme !== null && customTheme !== void 0 ? customTheme : (_d = context.uiConfig) === null || _d === void 0 ? void 0 : _d.customTheme, children: jsxs(ThemeContainer, { onClick: () => {
4151
+ return (jsx(ResetContainer, { "$useTheme": theme !== null && theme !== void 0 ? theme : context.uiConfig.theme, "$useMode": mode !== null && mode !== void 0 ? mode : context.mode, "$customTheme": customTheme !== null && customTheme !== void 0 ? customTheme : context.uiConfig.customTheme, children: jsxs(ThemeContainer, { onClick: () => {
4150
4152
  if (onClick) {
4151
4153
  onClick(() => open());
4152
4154
  }
@@ -4176,7 +4178,7 @@ onClick, }) {
4176
4178
  duration: 0.4,
4177
4179
  ease: [0.25, 1, 0.5, 1],
4178
4180
  },
4179
- }, children: jsx(ThemedButton, { variant: 'secondary', theme: theme !== null && theme !== void 0 ? theme : (_e = context.uiConfig) === null || _e === void 0 ? void 0 : _e.theme, mode: mode !== null && mode !== void 0 ? mode : context.mode, customTheme: customTheme !== null && customTheme !== void 0 ? customTheme : (_f = context.uiConfig) === null || _f === void 0 ? void 0 : _f.customTheme, style: { overflow: 'hidden' }, children: jsx(motion.div, { style: { paddingRight: 24 }, children: jsx(Balance$1, { hideSymbol: true }) }) }) }, 'balance')) })), jsx(ThemedButton, { theme: theme !== null && theme !== void 0 ? theme : (_g = context.uiConfig) === null || _g === void 0 ? void 0 : _g.theme, mode: mode !== null && mode !== void 0 ? mode : context.mode, customTheme: customTheme !== null && customTheme !== void 0 ? customTheme : (_h = context.uiConfig) === null || _h === void 0 ? void 0 : _h.customTheme, style: shouldShowBalance && showBalance && address && (theme === 'retro' || ((_j = context.uiConfig) === null || _j === void 0 ? void 0 : _j.theme) === 'retro')
4181
+ }, children: jsx(ThemedButton, { variant: 'secondary', theme: theme !== null && theme !== void 0 ? theme : context.uiConfig.theme, mode: mode !== null && mode !== void 0 ? mode : context.mode, customTheme: customTheme !== null && customTheme !== void 0 ? customTheme : context.uiConfig.customTheme, style: { overflow: 'hidden' }, children: jsx(motion.div, { style: { paddingRight: 24 }, children: jsx(Balance$1, { hideSymbol: true }) }) }) }, 'balance')) })), jsx(ThemedButton, { theme: theme !== null && theme !== void 0 ? theme : context.uiConfig.theme, mode: mode !== null && mode !== void 0 ? mode : context.mode, customTheme: customTheme !== null && customTheme !== void 0 ? customTheme : context.uiConfig.customTheme, style: shouldShowBalance && showBalance && address && (theme === 'retro' || context.uiConfig.theme === 'retro')
4180
4182
  ? {
4181
4183
  /* Special fix for the retro theme... not happy about this one */
4182
4184
  boxShadow: 'var(--ck-connectbutton-balance-connectbutton-box-shadow)',
@@ -4272,36 +4274,35 @@ function useThemeFont(theme) {
4272
4274
  * ```
4273
4275
  */
4274
4276
  function useConnect({ ...props } = {}) {
4275
- const context = useOpenfort();
4276
4277
  const { connect, connectAsync, connectors, ...rest } = useConnect$1({
4277
4278
  ...props,
4278
4279
  mutation: {
4279
4280
  ...props.mutation,
4280
- onError(err) {
4281
- if (err.message) {
4282
- if (err.message !== 'User rejected request') {
4283
- context.log(err.message, err);
4281
+ onError(...err) {
4282
+ var _a, _b;
4283
+ (_b = (_a = props.mutation) === null || _a === void 0 ? void 0 : _a.onError) === null || _b === void 0 ? void 0 : _b.call(_a, ...err);
4284
+ if (err[0].message) {
4285
+ if (err[0].message !== 'User rejected request') {
4286
+ logger.log(err[0].message, err);
4284
4287
  }
4285
4288
  }
4286
4289
  else {
4287
- context.log(`Could not connect.`, err);
4290
+ logger.log(`Could not connect.`, err);
4288
4291
  }
4289
4292
  },
4290
4293
  },
4291
4294
  });
4292
4295
  return {
4293
4296
  connect: ({ connector, chainId, mutation, }) => {
4294
- var _a;
4295
4297
  return connect({
4296
4298
  connector,
4297
- chainId: chainId !== null && chainId !== void 0 ? chainId : (_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.initialChainId,
4299
+ chainId,
4298
4300
  }, mutation);
4299
4301
  },
4300
4302
  connectAsync: async ({ connector, chainId, mutation, }) => {
4301
- var _a;
4302
4303
  return connectAsync({
4303
4304
  connector,
4304
- chainId: chainId !== null && chainId !== void 0 ? chainId : (_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.initialChainId,
4305
+ chainId,
4305
4306
  }, mutation);
4306
4307
  },
4307
4308
  connectors,
@@ -4496,10 +4497,10 @@ const CoreOpenfortProvider = ({ children, onConnect, onDisconnect, ...openfortPr
4496
4497
  }
4497
4498
  }, [openfort]);
4498
4499
  const chainId = useChainId();
4500
+ const wagmiConfig = useConfig();
4499
4501
  useEffect(() => {
4500
4502
  if (!openfort || !walletConfig)
4501
4503
  return;
4502
- logger.log('Getting ethereum provider', chainId);
4503
4504
  const resolvePolicy = () => {
4504
4505
  const { ethereumProviderPolicyId } = walletConfig;
4505
4506
  if (!ethereumProviderPolicyId)
@@ -4514,7 +4515,18 @@ const CoreOpenfortProvider = ({ children, onConnect, onDisconnect, ...openfortPr
4514
4515
  }
4515
4516
  return { policy };
4516
4517
  };
4517
- openfort.embeddedWallet.getEthereumProvider(resolvePolicy());
4518
+ const rpcUrls = wagmiConfig.chains.reduce((acc, chain) => {
4519
+ const rpcUrl = wagmiConfig.getClient({ chainId: chain.id }).transport.url;
4520
+ if (rpcUrl) {
4521
+ acc[chain.id] = rpcUrl;
4522
+ }
4523
+ return acc;
4524
+ }, {});
4525
+ logger.log('Getting ethereum provider', { chainId, rpcUrls });
4526
+ openfort.embeddedWallet.getEthereumProvider({
4527
+ ...resolvePolicy(),
4528
+ chains: rpcUrls,
4529
+ });
4518
4530
  }, [openfort, walletConfig, chainId]);
4519
4531
  const [isConnectedWithEmbeddedSigner, setIsConnectedWithEmbeddedSigner] = useState(false);
4520
4532
  // will reset on logout
@@ -4717,7 +4729,7 @@ const defaultConfig = ({ appName = 'Openfort', appIcon, appDescription, appUrl,
4717
4729
  walletConnectProjectId,
4718
4730
  coinbaseWalletPreference,
4719
4731
  });
4720
- // console.log("OPENFORT CHAINS", chains, transports);
4732
+ logger.log('OPENFORT CHAINS', { chains, transports, propsTransports: props === null || props === void 0 ? void 0 : props.transports });
4721
4733
  const config = {
4722
4734
  ...props,
4723
4735
  chains,
@@ -4816,7 +4828,6 @@ function useLockBodyScroll(initialLocked) {
4816
4828
  const [locked, setLocked] = useState(initialLocked);
4817
4829
  const context = useOpenfort();
4818
4830
  useIsomorphicLayoutEffect(() => {
4819
- var _a;
4820
4831
  if (!locked)
4821
4832
  return;
4822
4833
  const original = {
@@ -4839,17 +4850,16 @@ function useLockBodyScroll(initialLocked) {
4839
4850
  document.body.style.position = 'relative';
4840
4851
  document.body.style.touchAction = 'none';
4841
4852
  //document.documentElement.style.overflow = 'hidden'; // overflow:hidden; on <html> breaks position:sticky;
4842
- if ((_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.avoidLayoutShift) {
4853
+ if (context.uiConfig.avoidLayoutShift) {
4843
4854
  document.body.style.paddingRight = `${scrollBarWidth}px`;
4844
4855
  }
4845
4856
  return () => {
4846
- var _a;
4847
4857
  document.documentElement.style.removeProperty('--ck-scrollbar-width');
4848
4858
  document.body.style.overflow = original.overflow;
4849
4859
  document.body.style.position = original.position;
4850
4860
  document.body.style.touchAction = original.touchAction;
4851
4861
  //document.documentElement.style.overflow = original.htmlOverflow;
4852
- if ((_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.avoidLayoutShift) {
4862
+ if (context.uiConfig.avoidLayoutShift) {
4853
4863
  document.body.style.paddingRight = original.paddingRight;
4854
4864
  }
4855
4865
  };
@@ -5254,12 +5264,11 @@ const useWallets$1 = () => {
5254
5264
  .filter((wallet, index, self) => self.findIndex((w) => w.id === wallet.id) === index)
5255
5265
  // Replace walletConnect's name with the one from options
5256
5266
  .map((wallet) => {
5257
- var _a, _b;
5258
5267
  if (wallet.id === 'walletConnect') {
5259
5268
  return {
5260
5269
  ...wallet,
5261
- name: ((_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.walletConnectName) || wallet.name,
5262
- shortName: ((_b = context.uiConfig) === null || _b === void 0 ? void 0 : _b.walletConnectName) || wallet.shortName,
5270
+ name: context.uiConfig.walletConnectName || wallet.name,
5271
+ shortName: context.uiConfig.walletConnectName || wallet.shortName,
5263
5272
  };
5264
5273
  }
5265
5274
  return wallet;
@@ -5447,7 +5456,7 @@ const FitText = ({ children, maxFontSize = 100, minFontSize = 70, }) => {
5447
5456
  };
5448
5457
  FitText.displayName = 'FitText';
5449
5458
 
5450
- const OPENFORT_VERSION = '0.0.32';
5459
+ const OPENFORT_VERSION = '0.0.34';
5451
5460
 
5452
5461
  const Portal = (props) => {
5453
5462
  props = {
@@ -6165,7 +6174,7 @@ const contentVariants$1 = {
6165
6174
  },
6166
6175
  };
6167
6176
  const Modal = ({ open, pages, pageId, positionInside, inline, demo, onClose, onBack, onInfo, }) => {
6168
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
6177
+ var _a, _b, _c, _d, _e, _f, _g;
6169
6178
  const context = useOpenfort();
6170
6179
  const themeContext = useThemeContext();
6171
6180
  const mobile = isMobile();
@@ -6305,7 +6314,7 @@ const Modal = ({ open, pages, pageId, positionInside, inline, demo, onClose, onB
6305
6314
  const Content = (jsx(ResetContainer, { "$useTheme": (_e = demo === null || demo === void 0 ? void 0 : demo.theme) !== null && _e !== void 0 ? _e : themeContext.theme, "$useMode": (_f = demo === null || demo === void 0 ? void 0 : demo.mode) !== null && _f !== void 0 ? _f : themeContext.mode, "$customTheme": (_g = demo === null || demo === void 0 ? void 0 : demo.customTheme) !== null && _g !== void 0 ? _g : themeContext.customTheme, children: jsxs(ModalContainer, { role: "dialog", style: {
6306
6315
  pointerEvents: rendered ? 'auto' : 'none',
6307
6316
  position: positionInside ? 'absolute' : undefined,
6308
- }, children: [!inline && jsx(BackgroundOverlay, { "$active": rendered, onClick: onClose, "$blur": (_h = context.uiConfig) === null || _h === void 0 ? void 0 : _h.overlayBlur }), jsxs(Container$6, { style: dimensionsCSS, initial: false, children: [jsx("div", { style: {
6317
+ }, children: [!inline && jsx(BackgroundOverlay, { "$active": rendered, onClick: onClose, "$blur": context.uiConfig.overlayBlur }), jsxs(Container$6, { style: dimensionsCSS, initial: false, children: [jsx("div", { style: {
6309
6318
  pointerEvents: inTransition ? 'all' : 'none', // Block interaction while transitioning
6310
6319
  position: 'absolute',
6311
6320
  top: 0,
@@ -6315,7 +6324,7 @@ const Modal = ({ open, pages, pageId, positionInside, inline, demo, onClose, onB
6315
6324
  width: 'var(--width)',
6316
6325
  zIndex: 9,
6317
6326
  transition: 'width 200ms ease',
6318
- } }), jsxs(BoxContainer, { className: `${rendered && 'active'}`, children: [jsx(AnimatePresence, { initial: false, children: context.errorMessage && (jsxs(ErrorMessage, { initial: { y: '10%', x: '-50%' }, animate: { y: '-100%' }, exit: { y: '100%' }, transition: { duration: 0.2, ease: 'easeInOut' }, children: [jsx("span", { children: context.errorMessage }), jsx("button", { type: "button", "aria-label": flattenChildren(locales.close).toString(), onClick: () => context.displayError(null), style: {
6327
+ } }), jsxs(BoxContainer, { className: `${rendered && 'active'}`, children: [jsx(AnimatePresence, { initial: false, children: context.errorMessage && (jsxs(ErrorMessage, { initial: { y: '10%', x: '-50%' }, animate: { y: '-100%' }, exit: { y: '100%' }, transition: { duration: 0.2, ease: 'easeInOut' }, children: [jsx("span", { children: context.errorMessage }), jsx("button", { type: "button", "aria-label": flattenChildren(locales.close).toString(), style: {
6319
6328
  position: 'absolute',
6320
6329
  right: 24,
6321
6330
  top: 24,
@@ -6334,7 +6343,7 @@ const Modal = ({ open, pages, pageId, positionInside, inline, demo, onClose, onB
6334
6343
  duration: mobile ? 0 : 0.1,
6335
6344
  delay: mobile ? 0.01 : 0,
6336
6345
  }, children: jsx(BackIcon, {}) }, "backButton")) : (onInfo &&
6337
- !((_j = context.uiConfig) === null || _j === void 0 ? void 0 : _j.hideQuestionMarkCTA) && (jsx(InfoButton, { disabled: inTransition, "aria-label": flattenChildren(locales.moreInformation).toString(), onClick: onInfo, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
6346
+ !context.uiConfig.hideQuestionMarkCTA && (jsx(InfoButton, { disabled: inTransition, "aria-label": flattenChildren(locales.moreInformation).toString(), onClick: onInfo, initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: {
6338
6347
  duration: mobile ? 0 : 0.1,
6339
6348
  delay: mobile ? 0.01 : 0,
6340
6349
  }, children: jsx(InfoIcon, {}) }, "infoButton"))) }) })] }), jsx(ModalHeading, { children: jsx(AnimatePresence, { children: jsx(motion.div, { style: {
@@ -7066,12 +7075,12 @@ const Dot = styled.button `
7066
7075
  `;
7067
7076
 
7068
7077
  const About = () => {
7069
- var _a, _b;
7078
+ var _a;
7070
7079
  const locales = useLocales({
7071
7080
  //CONNECTORNAME: connector.name,
7072
7081
  });
7073
7082
  const context = useOpenfort();
7074
- const ctaUrl = (_b = (_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.ethereumOnboardingUrl) !== null && _b !== void 0 ? _b : locales.aboutScreen_ctaUrl;
7083
+ const ctaUrl = (_a = context.uiConfig.ethereumOnboardingUrl) !== null && _a !== void 0 ? _a : locales.aboutScreen_ctaUrl;
7075
7084
  const [_ready, setReady] = useState(true);
7076
7085
  const [slider, setSlider] = useState(0);
7077
7086
  const interacted = useRef(false);
@@ -7159,8 +7168,7 @@ const About = () => {
7159
7168
  ];
7160
7169
  // Adjust height of ModalBody to fit content based on language
7161
7170
  const slideHeight = (() => {
7162
- var _a;
7163
- switch ((_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.language) {
7171
+ switch (context.uiConfig.language) {
7164
7172
  case 'en-US':
7165
7173
  case 'zh-CN':
7166
7174
  return 64;
@@ -7206,7 +7214,6 @@ function useIsMobile() {
7206
7214
  }
7207
7215
 
7208
7216
  function useWalletConnectModal() {
7209
- const { log } = useOpenfort();
7210
7217
  const { connectAsync, connectors } = useConnect();
7211
7218
  const [isOpen, setIsOpen] = useState(false);
7212
7219
  return {
@@ -7230,7 +7237,7 @@ function useWalletConnectModal() {
7230
7237
  await connectAsync({ connector: connector });
7231
7238
  }
7232
7239
  catch (err) {
7233
- log('WalletConnect', err);
7240
+ logger.log('WalletConnect', err);
7234
7241
  return {
7235
7242
  error: 'Connection failed',
7236
7243
  };
@@ -7241,14 +7248,14 @@ function useWalletConnectModal() {
7241
7248
  return {};
7242
7249
  }
7243
7250
  catch (err) {
7244
- log('Could not get WalletConnect provider', err);
7251
+ logger.log('Could not get WalletConnect provider', err);
7245
7252
  return {
7246
7253
  error: 'Could not get WalletConnect provider',
7247
7254
  };
7248
7255
  }
7249
7256
  }
7250
7257
  else {
7251
- log('Configuration error: Please provide a WalletConnect Project ID in your wagmi config.');
7258
+ logger.log('Configuration error: Please provide a WalletConnect Project ID in your wagmi config.');
7252
7259
  return {
7253
7260
  error: 'Configuration error: Please provide a WalletConnect Project ID in your wagmi config.',
7254
7261
  };
@@ -7281,7 +7288,6 @@ const useLastConnector = () => {
7281
7288
  function useWalletConnectUri({ enabled } = {
7282
7289
  enabled: true,
7283
7290
  }) {
7284
- const { log } = useOpenfort();
7285
7291
  const [uri, setUri] = useState(undefined);
7286
7292
  const connector = useWalletConnectConnector();
7287
7293
  const { isConnected } = useAccount();
@@ -7292,7 +7298,7 @@ function useWalletConnectUri({ enabled } = {
7292
7298
  return;
7293
7299
  async function handleMessage(message) {
7294
7300
  const { type, data } = message;
7295
- log('WC Message', type, data);
7301
+ logger.log('WC Message', type, data);
7296
7302
  if (type === 'display_uri') {
7297
7303
  setUri(data);
7298
7304
  }
@@ -7306,7 +7312,7 @@ function useWalletConnectUri({ enabled } = {
7306
7312
  */
7307
7313
  }
7308
7314
  async function handleDisconnect() {
7309
- log('WC Disconnect');
7315
+ logger.log('WC Disconnect');
7310
7316
  if (connector)
7311
7317
  connectWallet(connector);
7312
7318
  }
@@ -7323,22 +7329,22 @@ function useWalletConnectUri({ enabled } = {
7323
7329
  await connectWallet(connector);
7324
7330
  }
7325
7331
  catch (error) {
7326
- log('catch error');
7327
- log(error);
7332
+ logger.log('catch error');
7333
+ logger.log(error);
7328
7334
  if (error.code) {
7329
7335
  switch (error.code) {
7330
7336
  case 4001:
7331
- log('error.code - User rejected');
7337
+ logger.log('error.code - User rejected');
7332
7338
  connectWalletConnect(connector); // Regenerate QR code
7333
7339
  break;
7334
7340
  default:
7335
- log('error.code - Unknown Error');
7341
+ logger.log('error.code - Unknown Error');
7336
7342
  break;
7337
7343
  }
7338
7344
  }
7339
7345
  else {
7340
7346
  // Sometimes the error doesn't respond with a code
7341
- log('WalletConnect cannot connect.', error);
7347
+ logger.log('WalletConnect cannot connect.', error);
7342
7348
  }
7343
7349
  }
7344
7350
  }
@@ -7350,11 +7356,11 @@ function useWalletConnectUri({ enabled } = {
7350
7356
  return;
7351
7357
  if (connector && !isConnected) {
7352
7358
  connectWalletConnect(connector);
7353
- log('add wc listeners');
7359
+ logger.log('add wc listeners');
7354
7360
  connector.emitter.on('message', handleMessage);
7355
7361
  connector.emitter.on('disconnect', handleDisconnect);
7356
7362
  return () => {
7357
- log('remove wc listeners');
7363
+ logger.log('remove wc listeners');
7358
7364
  connector.emitter.off('message', handleMessage);
7359
7365
  connector.emitter.off('disconnect', handleDisconnect);
7360
7366
  };
@@ -7999,7 +8005,6 @@ const ConnectorsContainer = styled.div `
7999
8005
  `;
8000
8006
 
8001
8007
  const ConnectorList = () => {
8002
- var _a;
8003
8008
  const context = useOpenfort();
8004
8009
  const isMobile = useIsMobile();
8005
8010
  const wallets = useWallets$1();
@@ -8010,7 +8015,7 @@ const ConnectorList = () => {
8010
8015
  if (familyConnector && isFamily()) {
8011
8016
  filteredWallets = filteredWallets.filter((wallet) => wallet.id !== (familyConnector === null || familyConnector === void 0 ? void 0 : familyConnector.id));
8012
8017
  }
8013
- const walletsToDisplay = ((_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.hideRecentBadge) || lastConnectorId === 'walletConnect' // do not hoist walletconnect to top of list
8018
+ const walletsToDisplay = context.uiConfig.hideRecentBadge || lastConnectorId === 'walletConnect' // do not hoist walletconnect to top of list
8014
8019
  ? wallets
8015
8020
  : [
8016
8021
  // move last used wallet to top of list
@@ -8046,8 +8051,8 @@ const ConnectorItem = ({ wallet, isRecent }) => {
8046
8051
  if (redirectToMoreWallets || shouldConnectImmediately)
8047
8052
  deeplink = undefined; // mobile redirects to more wallets page
8048
8053
  const content = () => {
8049
- var _a, _b, _c;
8050
- return (jsxs(Fragment, { children: [jsx(ConnectorIcon, { "data-small": wallet.iconShouldShrink, "data-shape": wallet.iconShape, "data-background": redirectToMoreWallets, children: (_a = wallet.iconConnector) !== null && _a !== void 0 ? _a : wallet.icon }), jsxs(ConnectorLabel, { children: [isMobile ? ((_b = wallet.shortName) !== null && _b !== void 0 ? _b : wallet.name) : wallet.name, !((_c = context.uiConfig) === null || _c === void 0 ? void 0 : _c.hideRecentBadge) && isRecent && (jsx(RecentlyUsedTag, { children: jsx("span", { children: "Recent" }) }))] })] }));
8054
+ var _a, _b;
8055
+ return (jsxs(Fragment, { children: [jsx(ConnectorIcon, { "data-small": wallet.iconShouldShrink, "data-shape": wallet.iconShape, "data-background": redirectToMoreWallets, children: (_a = wallet.iconConnector) !== null && _a !== void 0 ? _a : wallet.icon }), jsxs(ConnectorLabel, { children: [isMobile ? ((_b = wallet.shortName) !== null && _b !== void 0 ? _b : wallet.name) : wallet.name, !context.uiConfig.hideRecentBadge && isRecent && (jsx(RecentlyUsedTag, { children: jsx("span", { children: "Recent" }) }))] })] }));
8051
8056
  };
8052
8057
  return (jsx(ConnectorButton, { type: "button", disabled: context.route !== routes.CONNECTORS, onClick: () => {
8053
8058
  if (isMobile && deeplink) {
@@ -8341,7 +8346,6 @@ const TooltipTail = styled(motion.div) `
8341
8346
  `;
8342
8347
 
8343
8348
  const Tooltip = ({ children, message, open, xOffset = 0, yOffset = 0, delay }) => {
8344
- var _a;
8345
8349
  const context = useOpenfort();
8346
8350
  const themeContext = useThemeContext();
8347
8351
  const [isOpen, setIsOpen] = useState(false);
@@ -8386,7 +8390,7 @@ const Tooltip = ({ children, message, open, xOffset = 0, yOffset = 0, delay }) =
8386
8390
  useEffect(() => {
8387
8391
  setIsOpen(!!open);
8388
8392
  }, [open]);
8389
- if ((_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.hideTooltips)
8393
+ if (context.uiConfig.hideTooltips)
8390
8394
  return jsx(Fragment, { children: children });
8391
8395
  return (jsxs(Fragment, { children: [jsx(motion.div, { ref: ref, style: open === undefined
8392
8396
  ? {
@@ -8503,7 +8507,7 @@ const Loader = ({ header, description, icon, isError = false, isSuccess = false,
8503
8507
  const ConnectWithMobile$1 = () => {
8504
8508
  const { open: openWalletConnectModal } = useWalletConnectModal();
8505
8509
  const [error, setError] = useState(undefined);
8506
- const { connect, connectors } = useConnect$1();
8510
+ const { connect, connectors } = useConnect();
8507
8511
  const { connector, address } = useAccount();
8508
8512
  const { setRoute, setConnector } = useOpenfort();
8509
8513
  const openWCModal = async () => {
@@ -9028,14 +9032,14 @@ const mapWalletStatus = (status) => {
9028
9032
  function useWallets(hookOptions = {}) {
9029
9033
  const { client, embeddedAccounts, isLoadingAccounts: isLoadingWallets } = useOpenfortCore();
9030
9034
  const { user } = useUser();
9031
- const { walletConfig, log, setOpen, setRoute, setConnector, uiConfig } = useOpenfort();
9035
+ const { walletConfig, setOpen, setRoute, setConnector, uiConfig } = useOpenfort();
9032
9036
  const { connector, isConnected, address } = useAccount();
9033
9037
  const chainId = useChainId();
9034
9038
  const availableWallets = useWallets$1(); // TODO: Map wallets object to be the same as wallets
9035
9039
  const { disconnect, disconnectAsync } = useDisconnect();
9036
9040
  const [status, setStatus] = useWalletStatus();
9037
9041
  const [connectToConnector, setConnectToConnector] = useState(undefined);
9038
- const { connect } = useConnect$1({
9042
+ const { connect } = useConnect({
9039
9043
  mutation: {
9040
9044
  onError: (e) => {
9041
9045
  logger.error('Error connecting ---', e);
@@ -9051,7 +9055,7 @@ function useWallets(hookOptions = {}) {
9051
9055
  },
9052
9056
  onSuccess: (data) => {
9053
9057
  setConnectToConnector(undefined);
9054
- log('Connected with wallet', data, connectToConnector);
9058
+ logger.log('Connected with wallet', data, connectToConnector);
9055
9059
  if ((connectToConnector === null || connectToConnector === void 0 ? void 0 : connectToConnector.address) &&
9056
9060
  !data.accounts.some((a) => { var _a; return a.toLowerCase() === ((_a = connectToConnector.address) === null || _a === void 0 ? void 0 : _a.toLowerCase()); })) {
9057
9061
  setStatus({
@@ -9171,7 +9175,7 @@ function useWallets(hookOptions = {}) {
9171
9175
  return userWallets;
9172
9176
  }, [user === null || user === void 0 ? void 0 : user.linkedAccounts, embeddedAccounts]);
9173
9177
  const wallets = useMemo(() => {
9174
- // log("Mapping wallets", { rawWallets, status, address, isConnected, connector: connector?.id });
9178
+ // logger.log("Mapping wallets", { rawWallets, status, address, isConnected, connector: connector?.id });
9175
9179
  return rawWallets.map((w) => {
9176
9180
  var _a;
9177
9181
  return ({
@@ -9194,35 +9198,35 @@ function useWallets(hookOptions = {}) {
9194
9198
  if (typeof optionsObject.walletId === 'string') {
9195
9199
  const wallet = availableWallets.find((c) => c.id === optionsObject.walletId);
9196
9200
  if (!wallet) {
9197
- log('Connector not found', connector);
9201
+ logger.log('Connector not found', connector);
9198
9202
  return { error: new OpenfortError('Connector not found', OpenfortErrorType.WALLET_ERROR) };
9199
9203
  }
9200
- log('Connecting to', wallet.connector);
9204
+ logger.log('Connecting to', wallet.connector);
9201
9205
  connector = wallet.connector;
9202
9206
  }
9203
9207
  else {
9204
9208
  connector = optionsObject.walletId;
9205
9209
  }
9206
9210
  if (!connector) {
9207
- log('Connector not found', availableWallets, optionsObject.walletId);
9211
+ logger.log('Connector not found', availableWallets, optionsObject.walletId);
9208
9212
  return { error: new OpenfortError('Connector not found', OpenfortErrorType.WALLET_ERROR) };
9209
9213
  }
9210
9214
  if ((activeWallet === null || activeWallet === void 0 ? void 0 : activeWallet.id) === connector.id && (address === null || address === void 0 ? void 0 : address.toLowerCase()) === ((_a = optionsObject.address) === null || _a === void 0 ? void 0 : _a.toLowerCase())) {
9211
- log(`Already connected to ${connector.id} with address ${address}, skipping connection`);
9215
+ logger.log(`Already connected to ${connector.id} with address ${address}, skipping connection`);
9212
9216
  return { wallet: activeWallet };
9213
9217
  }
9214
9218
  await disconnectAsync();
9215
9219
  if (showUI) {
9216
9220
  const walletToConnect = wallets.find((w) => w.id === connector.id);
9217
9221
  if (!walletToConnect) {
9218
- log('Wallet not found', connector);
9222
+ logger.log('Wallet not found', connector);
9219
9223
  return onError({
9220
9224
  error: new OpenfortError('Wallet not found', OpenfortErrorType.AUTHENTICATION_ERROR),
9221
9225
  options: optionsObject,
9222
9226
  hookOptions,
9223
9227
  });
9224
9228
  }
9225
- log('Connecting to wallet', walletToConnect);
9229
+ logger.log('Connecting to wallet', walletToConnect);
9226
9230
  if (connector.id === embeddedWalletId) {
9227
9231
  setTimeout(() => {
9228
9232
  setRoute(routes.RECOVER);
@@ -9239,7 +9243,7 @@ function useWallets(hookOptions = {}) {
9239
9243
  function isOpenfortWallet(opts) {
9240
9244
  return opts.walletId === embeddedWalletId;
9241
9245
  }
9242
- log('Setting active wallet', { options: optionsObject, chainId });
9246
+ logger.log('Setting active wallet', { options: optionsObject, chainId });
9243
9247
  if (isOpenfortWallet(optionsObject)) {
9244
9248
  setStatus({
9245
9249
  status: 'connecting',
@@ -9263,7 +9267,7 @@ function useWallets(hookOptions = {}) {
9263
9267
  });
9264
9268
  let walletAddress = optionsObject.address;
9265
9269
  // Ensure that the embedded wallet is listed
9266
- log('Embedded wallets', embeddedAccounts, chainId);
9270
+ logger.log('Embedded wallets', embeddedAccounts, chainId);
9267
9271
  let embeddedAccount;
9268
9272
  if (walletAddress) {
9269
9273
  const addressToMatch = walletAddress.toLowerCase();
@@ -9283,11 +9287,11 @@ function useWallets(hookOptions = {}) {
9283
9287
  hookOptions,
9284
9288
  });
9285
9289
  }
9286
- log('Found embedded wallet to recover', accountToRecover);
9290
+ logger.log('Found embedded wallet to recover', accountToRecover);
9287
9291
  if (((_b = optionsObject.recovery) === null || _b === void 0 ? void 0 : _b.recoveryMethod) &&
9288
9292
  accountToRecover.recoveryMethod &&
9289
9293
  optionsObject.recovery.recoveryMethod !== accountToRecover.recoveryMethod) {
9290
- log('Recovery method does not match', optionsObject.recovery.recoveryMethod, accountToRecover.recoveryMethod);
9294
+ logger.log('Recovery method does not match', optionsObject.recovery.recoveryMethod, accountToRecover.recoveryMethod);
9291
9295
  return onError({
9292
9296
  error: new OpenfortError("The recovery method you entered is incorrect and does not match the wallet's recovery method", OpenfortErrorType.WALLET_ERROR),
9293
9297
  options: optionsObject,
@@ -9329,7 +9333,7 @@ function useWallets(hookOptions = {}) {
9329
9333
  });
9330
9334
  }
9331
9335
  }
9332
- log('Found embedded wallet to recover (without walletAddress)', accountToRecover);
9336
+ logger.log('Found embedded wallet to recover (without walletAddress)', accountToRecover);
9333
9337
  const recovery = {
9334
9338
  recoveryMethod: (_e = accountToRecover.recoveryMethod) !== null && _e !== void 0 ? _e : RecoveryMethod.AUTOMATIC,
9335
9339
  password: (_f = optionsObject.recovery) === null || _f === void 0 ? void 0 : _f.password,
@@ -9386,7 +9390,7 @@ function useWallets(hookOptions = {}) {
9386
9390
  error.message = 'Wrong password, Please try again.';
9387
9391
  }
9388
9392
  }
9389
- log('Error handling recovery with Openfort:', error, err);
9393
+ logger.log('Error handling recovery with Openfort:', error, err);
9390
9394
  setStatus({
9391
9395
  status: 'error',
9392
9396
  error,
@@ -9409,26 +9413,13 @@ function useWallets(hookOptions = {}) {
9409
9413
  });
9410
9414
  }
9411
9415
  return {};
9412
- }, [
9413
- wallets,
9414
- setOpen,
9415
- setRoute,
9416
- setConnector,
9417
- disconnectAsync,
9418
- log,
9419
- address,
9420
- client,
9421
- walletConfig,
9422
- chainId,
9423
- hookOptions,
9424
- ]);
9416
+ }, [wallets, setOpen, setRoute, setConnector, disconnectAsync, address, client, walletConfig, chainId, hookOptions]);
9425
9417
  const queryClient = useQueryClient();
9426
9418
  const createWallet = useCallback(async ({ recovery, ...options } = {}) => {
9427
- var _a;
9428
9419
  setStatus({
9429
9420
  status: 'creating',
9430
9421
  });
9431
- log('Creating wallet', { recovery: (recovery === null || recovery === void 0 ? void 0 : recovery.recoveryMethod) || RecoveryMethod.AUTOMATIC, options });
9422
+ logger.log('Creating wallet', { recovery: (recovery === null || recovery === void 0 ? void 0 : recovery.recoveryMethod) || RecoveryMethod.AUTOMATIC, options });
9432
9423
  try {
9433
9424
  const accessToken = await client.getAccessToken();
9434
9425
  if (!accessToken) {
@@ -9447,7 +9438,7 @@ function useWallets(hookOptions = {}) {
9447
9438
  }
9448
9439
  const recoveryParams = await parseWalletRecovery(recovery);
9449
9440
  const embeddedAccount = await client.embeddedWallet.create({
9450
- chainId: (_a = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.initialChainId) !== null && _a !== void 0 ? _a : chainId,
9441
+ chainId,
9451
9442
  accountType: (options === null || options === void 0 ? void 0 : options.accountType) || (walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.accountType) || AccountTypeEnum.SMART_ACCOUNT,
9452
9443
  chainType: ChainTypeEnum.EVM,
9453
9444
  recoveryParams,
@@ -9463,12 +9454,10 @@ function useWallets(hookOptions = {}) {
9463
9454
  wallet: parseEmbeddedAccount({
9464
9455
  embeddedAccount,
9465
9456
  connector: openfortConnector,
9466
- simpleAccounts: [],
9467
- // TODO: Update simple accounts after creating the wallet
9468
- // simpleAccounts: getSimpleAccounts({
9469
- // address: embeddedAccount.address as Hex,
9470
- // embeddedAccounts,
9471
- // }),
9457
+ simpleAccounts: getSimpleAccounts({
9458
+ embeddedAccounts: [embeddedAccount],
9459
+ address: embeddedAccount.address,
9460
+ }),
9472
9461
  chainId,
9473
9462
  }),
9474
9463
  },
@@ -9505,12 +9494,10 @@ function useWallets(hookOptions = {}) {
9505
9494
  wallet: parseEmbeddedAccount({
9506
9495
  embeddedAccount,
9507
9496
  connector: openfortConnector,
9508
- simpleAccounts: [],
9509
- // TODO: Update simple accounts after creating the wallet
9510
- // simpleAccounts: getSimpleAccounts({
9511
- // address: embeddedAccount.address as Hex,
9512
- // embeddedAccounts,
9513
- // }),
9497
+ simpleAccounts: getSimpleAccounts({
9498
+ address: embeddedAccount.address,
9499
+ embeddedAccounts: [embeddedAccount],
9500
+ }),
9514
9501
  chainId,
9515
9502
  }),
9516
9503
  },
@@ -9778,7 +9765,6 @@ const isValidEmail = (email) => {
9778
9765
  * ```
9779
9766
  */
9780
9767
  const useEmailAuth = (hookOptions = {}) => {
9781
- const { log } = useOpenfort();
9782
9768
  const { client, updateUser } = useOpenfortCore();
9783
9769
  const { isOpen } = useUI();
9784
9770
  const [requiresEmailVerification, setRequiresEmailVerification] = useState(false);
@@ -10082,7 +10068,7 @@ const useEmailAuth = (hookOptions = {}) => {
10082
10068
  await client.validateAndRefreshToken();
10083
10069
  const authToken = await client.getAccessToken();
10084
10070
  if (!authToken) {
10085
- log('No token found');
10071
+ logger.log('No token found');
10086
10072
  const error = new OpenfortError('No token found', OpenfortErrorType.AUTHENTICATION_ERROR);
10087
10073
  setStatus({
10088
10074
  status: 'error',
@@ -10099,7 +10085,7 @@ const useEmailAuth = (hookOptions = {}) => {
10099
10085
  password: options.password,
10100
10086
  authToken,
10101
10087
  });
10102
- log('Email linked successfully');
10088
+ logger.log('Email linked successfully');
10103
10089
  if ('action' in result) {
10104
10090
  setStatus({
10105
10091
  status: 'awaiting-input',
@@ -10141,7 +10127,7 @@ const useEmailAuth = (hookOptions = {}) => {
10141
10127
  error: error,
10142
10128
  });
10143
10129
  }
10144
- }, [client, setStatus, updateUser, log, hookOptions, isOpen]);
10130
+ }, [client, setStatus, updateUser, hookOptions, isOpen]);
10145
10131
  const verifyEmail = useCallback(async (options) => {
10146
10132
  setStatus({
10147
10133
  status: 'loading',
@@ -10180,14 +10166,14 @@ const useEmailAuth = (hookOptions = {}) => {
10180
10166
  status: 'error',
10181
10167
  error,
10182
10168
  });
10183
- log('Error verifying email', e);
10169
+ logger.log('Error verifying email', e);
10184
10170
  return onError({
10185
10171
  hookOptions,
10186
10172
  options,
10187
10173
  error,
10188
10174
  });
10189
10175
  }
10190
- }, [client, log, hookOptions]);
10176
+ }, [client, hookOptions]);
10191
10177
  return {
10192
10178
  signInEmail,
10193
10179
  signUpEmail,
@@ -10303,7 +10289,7 @@ const textVariants$1 = {
10303
10289
  };
10304
10290
  const EmailLogin = () => {
10305
10291
  const [password, setPassword] = React.useState('');
10306
- const { setRoute, triggerResize, log, setEmailInput: setEmail, emailInput: email } = useOpenfort();
10292
+ const { setRoute, triggerResize, setEmailInput: setEmail, emailInput: email } = useOpenfort();
10307
10293
  const [isRegister, setIsRegister] = React.useState(false);
10308
10294
  const { signUpEmail, signInEmail, error: loginError, isLoading: loginLoading, } = useEmailAuth({
10309
10295
  recoverWalletAutomatically: false,
@@ -10320,7 +10306,7 @@ const EmailLogin = () => {
10320
10306
  email,
10321
10307
  password,
10322
10308
  });
10323
- log('SIGN IN RESPONSE', { error, requiresEmailVerification });
10309
+ logger.log('SIGN IN RESPONSE', { error, requiresEmailVerification });
10324
10310
  if (!error) {
10325
10311
  if (requiresEmailVerification) {
10326
10312
  setRoute(routes.EMAIL_VERIFICATION);
@@ -10344,7 +10330,7 @@ const EmailLogin = () => {
10344
10330
  email,
10345
10331
  password,
10346
10332
  });
10347
- log('SIGN UP RESPONSE', { error, requiresEmailVerification });
10333
+ logger.log('SIGN UP RESPONSE', { error, requiresEmailVerification });
10348
10334
  if (!error) {
10349
10335
  if (requiresEmailVerification) {
10350
10336
  setRoute(routes.EMAIL_VERIFICATION);
@@ -10551,7 +10537,7 @@ const FloatingGraphic = ({ height = '130px', logoCenter, logoTopRight, logoTopLe
10551
10537
 
10552
10538
  const EmailVerification = () => {
10553
10539
  const { client } = useOpenfortCore();
10554
- const { setRoute, log, emailInput: emailInStorage } = useOpenfort();
10540
+ const { setRoute, emailInput: emailInStorage } = useOpenfort();
10555
10541
  const [loading, setLoading] = useState(true);
10556
10542
  const [verificationResponse, setVerificationResponse] = useState(null);
10557
10543
  useEffect(() => {
@@ -10584,7 +10570,7 @@ const EmailVerification = () => {
10584
10570
  setRoute(routes.EMAIL_LOGIN);
10585
10571
  return;
10586
10572
  }
10587
- log('EmailVerification', state, email);
10573
+ logger.log('EmailVerification', state, email);
10588
10574
  (async () => {
10589
10575
  try {
10590
10576
  await client.auth.verifyEmail({
@@ -10600,7 +10586,7 @@ const EmailVerification = () => {
10600
10586
  success: false,
10601
10587
  error: 'There was an error verifying your email. Please try again.',
10602
10588
  });
10603
- log('Error verifying email', e);
10589
+ logger.log('Error verifying email', e);
10604
10590
  }
10605
10591
  finally {
10606
10592
  removeParams();
@@ -10630,7 +10616,7 @@ const EmailVerification = () => {
10630
10616
 
10631
10617
  // TODO: Localize
10632
10618
  const RequestEmail = () => {
10633
- const { log, triggerResize, emailInput: email, setEmailInput: setEmail, setRoute } = useOpenfort();
10619
+ const { triggerResize, emailInput: email, setEmailInput: setEmail, setRoute } = useOpenfort();
10634
10620
  const { client } = useOpenfortCore();
10635
10621
  const [loading, setLoading] = React.useState(false);
10636
10622
  const [message, setMessage] = React.useState('');
@@ -10671,7 +10657,7 @@ const RequestEmail = () => {
10671
10657
  })
10672
10658
  .catch((e) => {
10673
10659
  var _a;
10674
- log(e);
10660
+ logger.log(e);
10675
10661
  const code = (_a = e === null || e === void 0 ? void 0 : e.response) === null || _a === void 0 ? void 0 : _a.status;
10676
10662
  switch (code) {
10677
10663
  case 400:
@@ -10693,7 +10679,7 @@ const ResetPassword = () => {
10693
10679
  const fixedUrl = window.location.href.replace('?state=', '&state='); // redirectUrl is not working with query params
10694
10680
  const url = new URL(fixedUrl);
10695
10681
  const [password, setPassword] = React.useState('');
10696
- const { setRoute, triggerResize, log } = useOpenfort();
10682
+ const { setRoute, triggerResize } = useOpenfort();
10697
10683
  const { client, updateUser } = useOpenfortCore();
10698
10684
  const [loading, setLoading] = React.useState(false);
10699
10685
  const email = url.searchParams.get('email');
@@ -10701,7 +10687,7 @@ const ResetPassword = () => {
10701
10687
  setLoading(true);
10702
10688
  const state = url.searchParams.get('state');
10703
10689
  if (!email || !state) {
10704
- log('No email or state found');
10690
+ logger.log('No email or state found');
10705
10691
  setLoading(false);
10706
10692
  return;
10707
10693
  }
@@ -10725,7 +10711,7 @@ const ResetPassword = () => {
10725
10711
  setRoute(routes.RECOVER);
10726
10712
  }
10727
10713
  catch (e) {
10728
- log('Reset password error', e);
10714
+ logger.log('Reset password error', e);
10729
10715
  setLoading(false);
10730
10716
  triggerResize();
10731
10717
  }
@@ -10767,7 +10753,7 @@ const textVariants = {
10767
10753
  };
10768
10754
  const LinkEmail = () => {
10769
10755
  const [password, setPassword] = React.useState('');
10770
- const { setRoute, triggerResize, log, emailInput: email, setEmailInput: setEmail } = useOpenfort();
10756
+ const { setRoute, triggerResize, emailInput: email, setEmailInput: setEmail } = useOpenfort();
10771
10757
  const { client, updateUser } = useOpenfortCore();
10772
10758
  const [loginLoading, setLoginLoading] = React.useState(false);
10773
10759
  const [loginError, setLoginError] = React.useState(false);
@@ -10776,7 +10762,7 @@ const LinkEmail = () => {
10776
10762
  await client.validateAndRefreshToken();
10777
10763
  const authToken = await client.getAccessToken();
10778
10764
  if (!authToken) {
10779
- log('No token found');
10765
+ logger.log('No token found');
10780
10766
  setLoginLoading(false);
10781
10767
  setLoginError('No token found.');
10782
10768
  triggerResize();
@@ -10789,7 +10775,7 @@ const LinkEmail = () => {
10789
10775
  authToken,
10790
10776
  })
10791
10777
  .catch((e) => {
10792
- log('Link error:', e);
10778
+ logger.log('Link error:', e);
10793
10779
  setLoginLoading(false);
10794
10780
  setLoginError('Could not link email.');
10795
10781
  triggerResize();
@@ -11027,7 +11013,7 @@ const Container$3 = styled.div ``;
11027
11013
 
11028
11014
  const MoreIcon = (jsxs("svg", { width: "60", height: "60", viewBox: "0 0 60 60", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsx("title", { children: "More wallets icon" }), jsx("path", { d: "M30 42V19M19 30.5H42", stroke: "var(--ck-body-color-muted)", strokeWidth: "3", strokeLinecap: "round" })] }));
11029
11015
  const MobileConnectors = () => {
11030
- var _a, _b;
11016
+ var _a;
11031
11017
  const context = useOpenfort();
11032
11018
  const locales = useLocales();
11033
11019
  const { connect: { getUri }, } = useWeb3();
@@ -11073,7 +11059,7 @@ const MobileConnectors = () => {
11073
11059
  justifyContent: 'center',
11074
11060
  }, children: jsx("div", { style: {
11075
11061
  width: '50%',
11076
- }, children: jsx(Spinner$3, {}) }) })) : (MoreIcon) }), jsx(WalletLabel, { children: locales.more })] })] }) }) }), ((_b = context.uiConfig) === null || _b === void 0 ? void 0 : _b.walletConnectCTA) !== 'modal' && (jsx("div", { style: {
11062
+ }, children: jsx(Spinner$3, {}) }) })) : (MoreIcon) }), jsx(WalletLabel, { children: locales.more })] })] }) }) }), context.uiConfig.walletConnectCTA !== 'modal' && (jsx("div", { style: {
11077
11063
  display: 'flex',
11078
11064
  alignItems: 'center',
11079
11065
  justifyContent: 'center',
@@ -11083,10 +11069,10 @@ const MobileConnectors = () => {
11083
11069
  };
11084
11070
 
11085
11071
  const Introduction = () => {
11086
- var _a, _b;
11072
+ var _a;
11087
11073
  const context = useOpenfort();
11088
11074
  const locales = useLocales({});
11089
- const ctaUrl = (_b = (_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.walletOnboardingUrl) !== null && _b !== void 0 ? _b : locales.onboardingScreen_ctaUrl;
11075
+ const ctaUrl = (_a = context.uiConfig.walletOnboardingUrl) !== null && _a !== void 0 ? _a : locales.onboardingScreen_ctaUrl;
11090
11076
  return (jsxs(PageContent, { children: [jsxs(Graphic, { children: [jsxs(LogoGroup, { children: [jsx(Logo$1, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic$1, { children: jsx(Logos.Coinbase, { background: true }) }) }) }) }) }) }), jsx(Logo$1, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic$1, { children: jsx(Logos.MetaMask, { background: true }) }) }) }) }) }) }), jsx(Logo$1, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic$1, { children: jsx(Logos.Trust, {}) }) }) }) }) }) }), jsx(Logo$1, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic$1, { children: jsx(Logos.Argent, {}) }) }) }) }) }) }), jsx(Logo$1, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic$1, { children: jsx(Logos.ImToken, {}) }) }) }) }) }) })] }), jsx(GraphicBackground, { children: wave })] }), jsxs(ModalContent, { style: { paddingBottom: 18 }, children: [jsx(ModalH1, { "$small": true, children: locales.onboardingScreen_h1 }), jsx(ModalBody, { children: locales.onboardingScreen_p })] }), jsx(Button, { href: ctaUrl, arrow: true, children: locales.onboardingScreen_ctaText })] }));
11091
11077
  };
11092
11078
 
@@ -11444,7 +11430,7 @@ const DropdownHeading = styled(motion.div) `
11444
11430
  `;
11445
11431
 
11446
11432
  const ChainSelectDropdown = ({ children, open, onClose, offsetX = 0, offsetY = 8 }) => {
11447
- var _a, _b, _c, _d;
11433
+ var _a, _b, _c;
11448
11434
  const context = useOpenfort();
11449
11435
  const themeContext = useThemeContext();
11450
11436
  const locales = useLocales();
@@ -11558,7 +11544,7 @@ const ChainSelectDropdown = ({ children, open, onClose, offsetX = 0, offsetY = 8
11558
11544
  window.removeEventListener('resize', onResize);
11559
11545
  };
11560
11546
  }, []);
11561
- return (jsxs(Fragment, { children: [jsx("div", { ref: ref, children: children }), jsx(AnimatePresence, { children: open && (jsx(Portal, { children: jsx(ResetContainer, { "$useTheme": (_a = themeContext.theme) !== null && _a !== void 0 ? _a : (_b = context.uiConfig) === null || _b === void 0 ? void 0 : _b.theme, "$useMode": (_c = themeContext.mode) !== null && _c !== void 0 ? _c : context.mode, "$customTheme": (_d = themeContext.customTheme) !== null && _d !== void 0 ? _d : themeContext.customTheme, children: jsx(FocusTrap, { children: jsxs(DropdownWindow, { ref: contentRef, children: [jsx(DropdownOverlay, { onClick: onClose }), jsxs(DropdownContainer, { ref: innerRef, style: {
11547
+ return (jsxs(Fragment, { children: [jsx("div", { ref: ref, children: children }), jsx(AnimatePresence, { children: open && (jsx(Portal, { children: jsx(ResetContainer, { "$useTheme": (_a = themeContext.theme) !== null && _a !== void 0 ? _a : context.uiConfig.theme, "$useMode": (_b = themeContext.mode) !== null && _b !== void 0 ? _b : context.mode, "$customTheme": (_c = themeContext.customTheme) !== null && _c !== void 0 ? _c : themeContext.customTheme, children: jsx(FocusTrap, { children: jsxs(DropdownWindow, { ref: contentRef, children: [jsx(DropdownOverlay, { onClick: onClose }), jsxs(DropdownContainer, { ref: innerRef, style: {
11562
11548
  left: offset.x,
11563
11549
  top: offset.y,
11564
11550
  }, initial: 'collapsed', animate: 'open', exit: 'collapsed', variants: {
@@ -12104,7 +12090,7 @@ const LinkedProviders = () => {
12104
12090
  };
12105
12091
 
12106
12092
  const Profile = ({ closeModal }) => {
12107
- var _a, _b, _c, _d;
12093
+ var _a, _b;
12108
12094
  const context = useOpenfort();
12109
12095
  const themeContext = useThemeContext();
12110
12096
  const locales = useLocales();
@@ -12135,10 +12121,10 @@ const Profile = ({ closeModal }) => {
12135
12121
  logout();
12136
12122
  };
12137
12123
  }, [shouldDisconnect, logout]);
12138
- const separator = ['web95', 'rounded', 'minimal'].includes((_c = (_a = themeContext.theme) !== null && _a !== void 0 ? _a : (_b = context.uiConfig) === null || _b === void 0 ? void 0 : _b.theme) !== null && _c !== void 0 ? _c : '')
12124
+ const separator = ['web95', 'rounded', 'minimal'].includes((_b = (_a = themeContext.theme) !== null && _a !== void 0 ? _a : context.uiConfig.theme) !== null && _b !== void 0 ? _b : '')
12139
12125
  ? '....'
12140
12126
  : undefined;
12141
- return (jsxs(PageContent, { children: [jsxs(ModalContent, { style: { paddingBottom: 22, gap: 6 }, children: [address ? (jsxs(Fragment, { children: [jsx(AvatarContainer, { children: jsxs(AvatarInner, { children: [jsx(ChainSelectorContainer, { children: jsx(ChainSelector, {}) }), jsx(Avatar, { address: address })] }) }), jsx(ModalH1, { children: jsx(CopyToClipboard, { string: address, children: ensName !== null && ensName !== void 0 ? ensName : truncateEthAddress(address, separator) }) }), ((_d = context === null || context === void 0 ? void 0 : context.uiConfig) === null || _d === void 0 ? void 0 : _d.hideBalance) ? null : (jsx(ModalBody, { children: jsx(BalanceContainer, { children: jsxs(AnimatePresence, { exitBeforeEnter: true, initial: false, children: [balance && (jsxs(Balance, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, children: [nFormatter(Number(balance === null || balance === void 0 ? void 0 : balance.formatted)), ` `, balance === null || balance === void 0 ? void 0 : balance.symbol] }, `chain-${chain === null || chain === void 0 ? void 0 : chain.id}`)), !balance && (jsx(LoadingBalance, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, children: "\u00A0" }))] }) }) }))] })) : (jsx(Button, { onClick: () => context.setRoute(routes.CONNECTORS), icon: jsx(Unsupported, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: jsxs("svg", { width: "130", height: "120", viewBox: "0 0 13 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsx("title", { children: "Unsupported wallet icon" }), jsx("path", { d: "M2.61317 11.2501H9.46246C10.6009 11.2501 11.3256 10.3506 11.3256 9.3549C11.3256 9.05145 11.255 8.73244 11.0881 8.43303L7.65903 2.14708C7.659 2.14702 7.65897 2.14696 7.65893 2.1469C7.65889 2.14682 7.65884 2.14673 7.65879 2.14664C7.31045 1.50746 6.6741 1.17871 6.04 1.17871C5.41478 1.17871 4.763 1.50043 4.41518 2.14968L0.993416 8.43476C0.828865 8.72426 0.75 9.04297 0.75 9.3549C0.75 10.3506 1.47471 11.2501 2.61317 11.2501Z", fill: "currentColor", stroke: "var(--ck-body-background, #fff)", strokeWidth: "1.5" }), jsx("path", { d: "M6.03258 7.43916C5.77502 7.43916 5.63096 7.29153 5.62223 7.02311L5.55675 4.96973C5.54802 4.69684 5.74446 4.5 6.02821 4.5C6.3076 4.5 6.51277 4.70131 6.50404 4.9742L6.43856 7.01864C6.42546 7.29153 6.2814 7.43916 6.03258 7.43916ZM6.03258 9.11676C5.7401 9.11676 5.5 8.9065 5.5 8.60677C5.5 8.30704 5.7401 8.09678 6.03258 8.09678C6.32506 8.09678 6.56515 8.30256 6.56515 8.60677C6.56515 8.91097 6.32069 9.11676 6.03258 9.11676Z", fill: "white" })] }) }), children: "Connect wallet" })), jsx(LinkedProviders, {})] }), !isSafeConnector(connector === null || connector === void 0 ? void 0 : connector.id) && (jsx(Button, { onClick: () => setShouldDisconnect(true), icon: jsx(DisconnectIcon, {}), children: locales.disconnect })), jsx(PoweredByFooter, {})] }));
12127
+ return (jsxs(PageContent, { children: [jsxs(ModalContent, { style: { paddingBottom: 22, gap: 6 }, children: [address ? (jsxs(Fragment, { children: [jsx(AvatarContainer, { children: jsxs(AvatarInner, { children: [jsx(ChainSelectorContainer, { children: jsx(ChainSelector, {}) }), jsx(Avatar, { address: address })] }) }), jsx(ModalH1, { children: jsx(CopyToClipboard, { string: address, children: ensName !== null && ensName !== void 0 ? ensName : truncateEthAddress(address, separator) }) }), (context === null || context === void 0 ? void 0 : context.uiConfig.hideBalance) ? null : (jsx(ModalBody, { children: jsx(BalanceContainer, { children: jsxs(AnimatePresence, { exitBeforeEnter: true, initial: false, children: [balance && (jsxs(Balance, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, children: [nFormatter(Number(balance === null || balance === void 0 ? void 0 : balance.formatted)), ` `, balance === null || balance === void 0 ? void 0 : balance.symbol] }, `chain-${chain === null || chain === void 0 ? void 0 : chain.id}`)), !balance && (jsx(LoadingBalance, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, children: "\u00A0" }))] }) }) }))] })) : (jsx(Button, { onClick: () => context.setRoute(routes.CONNECTORS), icon: jsx(Unsupported, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: jsxs("svg", { width: "130", height: "120", viewBox: "0 0 13 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsx("title", { children: "Unsupported wallet icon" }), jsx("path", { d: "M2.61317 11.2501H9.46246C10.6009 11.2501 11.3256 10.3506 11.3256 9.3549C11.3256 9.05145 11.255 8.73244 11.0881 8.43303L7.65903 2.14708C7.659 2.14702 7.65897 2.14696 7.65893 2.1469C7.65889 2.14682 7.65884 2.14673 7.65879 2.14664C7.31045 1.50746 6.6741 1.17871 6.04 1.17871C5.41478 1.17871 4.763 1.50043 4.41518 2.14968L0.993416 8.43476C0.828865 8.72426 0.75 9.04297 0.75 9.3549C0.75 10.3506 1.47471 11.2501 2.61317 11.2501Z", fill: "currentColor", stroke: "var(--ck-body-background, #fff)", strokeWidth: "1.5" }), jsx("path", { d: "M6.03258 7.43916C5.77502 7.43916 5.63096 7.29153 5.62223 7.02311L5.55675 4.96973C5.54802 4.69684 5.74446 4.5 6.02821 4.5C6.3076 4.5 6.51277 4.70131 6.50404 4.9742L6.43856 7.01864C6.42546 7.29153 6.2814 7.43916 6.03258 7.43916ZM6.03258 9.11676C5.7401 9.11676 5.5 8.9065 5.5 8.60677C5.5 8.30704 5.7401 8.09678 6.03258 8.09678C6.32506 8.09678 6.56515 8.30256 6.56515 8.60677C6.56515 8.91097 6.32069 9.11676 6.03258 9.11676Z", fill: "white" })] }) }), children: "Connect wallet" })), jsx(LinkedProviders, {})] }), !isSafeConnector(connector === null || connector === void 0 ? void 0 : connector.id) && (jsx(Button, { onClick: () => setShouldDisconnect(true), icon: jsx(DisconnectIcon, {}), children: locales.disconnect })), jsx(PoweredByFooter, {})] }));
12142
12128
  };
12143
12129
 
12144
12130
  const ProviderButton = ({ children, icon, onClick }) => {
@@ -12453,7 +12439,7 @@ const OtherMethodButton = styled.button `
12453
12439
  const RecoverPasswordWallet = ({ wallet }) => {
12454
12440
  const [recoveryPhrase, setRecoveryPhrase] = useState('');
12455
12441
  const [recoveryError, setRecoveryError] = useState(false);
12456
- const { triggerResize, log } = useOpenfort();
12442
+ const { triggerResize } = useOpenfort();
12457
12443
  const [loading, setLoading] = useState(false);
12458
12444
  const { setActiveWallet } = useWallets();
12459
12445
  const handleSubmit = async () => {
@@ -12471,7 +12457,7 @@ const RecoverPasswordWallet = ({ wallet }) => {
12471
12457
  setRecoveryError(error.message || 'There was an error recovering your account');
12472
12458
  }
12473
12459
  else {
12474
- log('Recovery success');
12460
+ logger.log('Recovery success');
12475
12461
  }
12476
12462
  };
12477
12463
  useEffect(() => {
@@ -12536,18 +12522,17 @@ const RecoverPasskeyWallet = ({ wallet }) => {
12536
12522
  const RecoverAutomaticWallet = ({ walletAddress }) => {
12537
12523
  const { embeddedState } = useOpenfortCore();
12538
12524
  const { setActiveWallet } = useWallets();
12539
- const { log } = useOpenfort();
12540
12525
  const [error, setError] = useState(false);
12541
12526
  useEffect(() => {
12542
12527
  (async () => {
12543
12528
  if (embeddedState === EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED) {
12544
- log('Automatically recovering wallet', walletAddress);
12529
+ logger.log('Automatically recovering wallet', walletAddress);
12545
12530
  const response = await setActiveWallet({
12546
12531
  walletId: embeddedWalletId,
12547
12532
  });
12548
12533
  if (response.error) {
12549
12534
  setError(response.error.message || 'There was an error recovering your account');
12550
- log('Error recovering wallet', response.error);
12535
+ logger.log('Error recovering wallet', response.error);
12551
12536
  }
12552
12537
  }
12553
12538
  })();
@@ -12561,15 +12546,14 @@ const CreateWalletAutomaticRecovery = () => {
12561
12546
  const { embeddedState } = useOpenfortCore();
12562
12547
  const { createWallet } = useWallets();
12563
12548
  const [shouldCreateWallet, setShouldCreateWallet] = useState(false);
12564
- const { log } = useOpenfort();
12565
12549
  useEffect(() => {
12566
12550
  // To ensure the wallet is created only once
12567
12551
  if (shouldCreateWallet) {
12568
12552
  (async () => {
12569
- log('Creating wallet Automatic recover');
12553
+ logger.log('Creating wallet Automatic recover');
12570
12554
  const response = await createWallet();
12571
12555
  if (response.error) {
12572
- log('Error creating wallet', response.error);
12556
+ logger.log('Error creating wallet', response.error);
12573
12557
  }
12574
12558
  })();
12575
12559
  }
@@ -12616,20 +12600,19 @@ const CreateWalletPasskeyRecovery = ({ onChangeMethod, }) => {
12616
12600
  const { triggerResize } = useOpenfort();
12617
12601
  const { createWallet, error: recoveryError } = useWallets();
12618
12602
  const [shouldCreateWallet, setShouldCreateWallet] = useState(false);
12619
- const { log } = useOpenfort();
12620
12603
  const { embeddedState } = useOpenfortCore();
12621
12604
  useEffect(() => {
12622
12605
  // To ensure the wallet is created only once
12623
12606
  if (shouldCreateWallet) {
12624
12607
  (async () => {
12625
- log('Creating wallet passkey recovery');
12608
+ logger.log('Creating wallet passkey recovery');
12626
12609
  const response = await createWallet({
12627
12610
  recovery: {
12628
12611
  recoveryMethod: RecoveryMethod.PASSKEY,
12629
12612
  },
12630
12613
  });
12631
12614
  if (response.error) {
12632
- log('Error creating wallet', response.error);
12615
+ logger.log('Error creating wallet', response.error);
12633
12616
  setShouldCreateWallet(false);
12634
12617
  }
12635
12618
  })();
@@ -12649,7 +12632,7 @@ const CreateWalletPasskeyRecovery = ({ onChangeMethod, }) => {
12649
12632
  const CreateWalletPasswordRecovery = ({ onChangeMethod, }) => {
12650
12633
  const [recoveryPhrase, setRecoveryPhrase] = useState('');
12651
12634
  const [recoveryError, setRecoveryError] = useState(false);
12652
- const { triggerResize, log } = useOpenfort();
12635
+ const { triggerResize } = useOpenfort();
12653
12636
  const [showPasswordIsTooWeakError, setShowPasswordIsTooWeakError] = useState(false);
12654
12637
  const [loading, setLoading] = useState(false);
12655
12638
  const { createWallet } = useWallets();
@@ -12670,7 +12653,7 @@ const CreateWalletPasswordRecovery = ({ onChangeMethod, }) => {
12670
12653
  setRecoveryError(error.message || 'There was an error recovering your account');
12671
12654
  }
12672
12655
  else {
12673
- log('Recovery success');
12656
+ logger.log('Recovery success');
12674
12657
  }
12675
12658
  };
12676
12659
  useEffect(() => {
@@ -12740,6 +12723,10 @@ const SelectWalletButton = ({ wallet, onSelect }) => {
12740
12723
  };
12741
12724
  const SelectWalletToRecover = ({ wallets }) => {
12742
12725
  const [selectedWallet, setSelectedWallet] = useState(null);
12726
+ const { triggerResize } = useOpenfort();
12727
+ useEffect(() => {
12728
+ triggerResize();
12729
+ }, [selectedWallet]);
12743
12730
  if (selectedWallet) {
12744
12731
  return jsx(RecoverWallet, { wallet: selectedWallet });
12745
12732
  }
@@ -12778,7 +12765,7 @@ const Connected = () => {
12778
12765
  };
12779
12766
  const RecoverPage = () => {
12780
12767
  const { user } = useOpenfortCore();
12781
- const { triggerResize } = useOpenfort();
12768
+ const { triggerResize, uiConfig, walletConfig, setRoute } = useOpenfort();
12782
12769
  const { wallets, isLoadingWallets } = useWallets();
12783
12770
  // const [loading, setLoading] = useState(true);
12784
12771
  const [embeddedSignerLoading, setEmbeddedSignerLoading] = useState(true);
@@ -12798,21 +12785,21 @@ const RecoverPage = () => {
12798
12785
  const openfortWallets = useMemo(() => {
12799
12786
  return wallets.filter((wallet) => wallet.id === embeddedWalletId);
12800
12787
  }, [wallets]);
12801
- // useEffect(() => {
12802
- // if (!user) return;
12803
- // if (uiConfig?.linkWalletOnSignUp || !walletConfig) {
12804
- // if (!user.linkedAccounts.find((account) => account.provider === "wallet")) {
12805
- // setRoute(routes.CONNECTORS);
12806
- // return;
12807
- // }
12808
- // if (!walletConfig) {
12809
- // // Logged in without a wallet
12810
- // setRoute(routes.PROFILE);
12811
- // return;
12812
- // }
12813
- // }
12814
- // setLoading(false);
12815
- // }, [user])
12788
+ useEffect(() => {
12789
+ if (!user)
12790
+ return;
12791
+ if (uiConfig.linkWalletOnSignUp || !walletConfig) {
12792
+ if (!user.linkedAccounts.find((account) => account.provider === 'wallet')) {
12793
+ setRoute(routes.CONNECTORS);
12794
+ return;
12795
+ }
12796
+ if (!walletConfig) {
12797
+ // Logged in without a wallet
12798
+ setRoute(routes.PROFILE);
12799
+ return;
12800
+ }
12801
+ }
12802
+ }, [user]);
12816
12803
  if (embeddedSignerLoading) {
12817
12804
  return (jsx(PageContent, { children: jsx(Loader, { header: "Setting up wallet" }) }));
12818
12805
  }
@@ -12878,7 +12865,6 @@ const createSIWEMessage = (address, nonce, chainId) => createSiweMessage({
12878
12865
  // If there is a user already, it will link the wallet to the user
12879
12866
  function useConnectWithSiwe() {
12880
12867
  const { client, user, updateUser } = useOpenfortCore();
12881
- const { log } = useOpenfort();
12882
12868
  const { address, connector, chainId: accountChainId } = useAccount();
12883
12869
  const chainId = useChainId();
12884
12870
  const config = useConfig();
@@ -12888,7 +12874,7 @@ function useConnectWithSiwe() {
12888
12874
  const connectorType = propsConnectorType !== null && propsConnectorType !== void 0 ? propsConnectorType : connector === null || connector === void 0 ? void 0 : connector.type;
12889
12875
  const walletClientType = propsWalletClientType !== null && propsWalletClientType !== void 0 ? propsWalletClientType : connector === null || connector === void 0 ? void 0 : connector.id;
12890
12876
  if (!address || !connectorType || !walletClientType) {
12891
- log('No address found', { address, connectorType, walletClientType });
12877
+ logger.log('No address found', { address, connectorType, walletClientType });
12892
12878
  onError === null || onError === void 0 ? void 0 : onError('No address found');
12893
12879
  return;
12894
12880
  }
@@ -12906,7 +12892,7 @@ function useConnectWithSiwe() {
12906
12892
  const authToken = await client.getAccessToken();
12907
12893
  if (!authToken)
12908
12894
  throw new Error('No access token found');
12909
- log('Linking wallet', { signature, message: SIWEMessage, connectorType, walletClientType, authToken });
12895
+ logger.log('Linking wallet', { signature, message: SIWEMessage, connectorType, walletClientType, authToken });
12910
12896
  await client.auth.linkWallet({
12911
12897
  signature,
12912
12898
  message: SIWEMessage,
@@ -12925,7 +12911,7 @@ function useConnectWithSiwe() {
12925
12911
  onConnect === null || onConnect === void 0 ? void 0 : onConnect();
12926
12912
  }
12927
12913
  catch (err) {
12928
- log('Failed to connect with SIWE', err);
12914
+ logger.log('Failed to connect with SIWE', err);
12929
12915
  if (!onError)
12930
12916
  return;
12931
12917
  let message = err instanceof Error ? err.message : err instanceof AxiosError ? err.message : String(err);
@@ -12943,7 +12929,7 @@ function useConnectWithSiwe() {
12943
12929
  }
12944
12930
  onError(message, err instanceof AxiosError ? err.request.status : undefined);
12945
12931
  }
12946
- }, [client, user, updateUser, log, address, chainId, config, connector, accountChainId, publicClient]);
12932
+ }, [client, user, updateUser, address, chainId, config, connector, accountChainId, publicClient]);
12947
12933
  return connectWithSiwe;
12948
12934
  }
12949
12935
 
@@ -13154,7 +13140,7 @@ const contentVariants = {
13154
13140
  const ConnectWithInjector = ({ switchConnectMethod, forceState }) => {
13155
13141
  var _a, _b, _c, _d, _e, _f, _g, _h;
13156
13142
  const openfort = useOpenfortCore();
13157
- const { log, setOpen } = useOpenfort();
13143
+ const { setOpen } = useOpenfort();
13158
13144
  const { isConnected } = useAccount();
13159
13145
  const { disconnect } = useDisconnect();
13160
13146
  const connectWithSiwe = useConnectWithSiwe();
@@ -13173,7 +13159,7 @@ const ConnectWithInjector = ({ switchConnectMethod, forceState }) => {
13173
13159
  },
13174
13160
  onSettled(data, error) {
13175
13161
  var _a;
13176
- log(`onSettled - data: ${data}, error: ${error}`, data);
13162
+ logger.log(`onSettled - data: ${data}, error: ${error}`, data);
13177
13163
  if (error) {
13178
13164
  setShowTryAgainTooltip(true);
13179
13165
  setTimeout(() => setShowTryAgainTooltip(false), 3500);
@@ -13343,7 +13329,7 @@ const states$2 = {
13343
13329
  ERROR: 'error',
13344
13330
  };
13345
13331
  const ConnectWithOAuth = () => {
13346
- const { connector, setRoute, log } = useOpenfort();
13332
+ const { connector, setRoute } = useOpenfort();
13347
13333
  const { client, user } = useOpenfortCore();
13348
13334
  const [status, setStatus] = useState(states$2.INIT);
13349
13335
  const [description, setDescription] = useState(undefined);
@@ -13403,7 +13389,7 @@ const ConnectWithOAuth = () => {
13403
13389
  queryParams,
13404
13390
  },
13405
13391
  });
13406
- log(linkResponse);
13392
+ logger.log(linkResponse);
13407
13393
  window.location.href = linkResponse.url;
13408
13394
  }
13409
13395
  else {
@@ -13414,7 +13400,7 @@ const ConnectWithOAuth = () => {
13414
13400
  queryParams,
13415
13401
  },
13416
13402
  });
13417
- log(r);
13403
+ logger.log(r);
13418
13404
  window.location.href = r.url;
13419
13405
  }
13420
13406
  }
@@ -13470,7 +13456,7 @@ const ScanIconWithLogos = ({ logo }) => {
13470
13456
  };
13471
13457
 
13472
13458
  const ConnectWithQRCode = ({ switchConnectMethod }) => {
13473
- var _a, _b, _c, _d, _e, _f, _g, _h;
13459
+ var _a, _b, _c, _d;
13474
13460
  const context = useOpenfort();
13475
13461
  const id = context.connector.id;
13476
13462
  const wallet = useWallet(context.connector.id);
@@ -13483,7 +13469,7 @@ const ConnectWithQRCode = ({ switchConnectMethod }) => {
13483
13469
  });
13484
13470
  const connectWithSiwe = useConnectWithSiwe();
13485
13471
  const { isConnected } = useAccount();
13486
- const { log, setOpen } = useOpenfort();
13472
+ const { setOpen } = useOpenfort();
13487
13473
  const { disconnect } = useDisconnect();
13488
13474
  const [isFirstFrame, setIsFirstFrame] = React.useState(true);
13489
13475
  useEffect(() => {
@@ -13501,7 +13487,7 @@ const ConnectWithQRCode = ({ switchConnectMethod }) => {
13501
13487
  // connectorType: 'walletConnect',
13502
13488
  // walletClientType: 'walletConnect',
13503
13489
  onError: (error) => {
13504
- log(error);
13490
+ logger.log(error);
13505
13491
  disconnect();
13506
13492
  },
13507
13493
  onConnect: () => {
@@ -13537,7 +13523,7 @@ const ConnectWithQRCode = ({ switchConnectMethod }) => {
13537
13523
  alignItems: 'center',
13538
13524
  justifyContent: 'center',
13539
13525
  gap: 14,
13540
- }, children: [((_e = context.uiConfig) === null || _e === void 0 ? void 0 : _e.walletConnectCTA) !== 'modal' && (jsx(CopyToClipboard, { variant: "button", string: uri, children: ((_f = context.uiConfig) === null || _f === void 0 ? void 0 : _f.walletConnectCTA) === 'link' ? locales.copyToClipboard : locales.copyCode })), ((_g = context.uiConfig) === null || _g === void 0 ? void 0 : _g.walletConnectCTA) !== 'link' && (jsx(Button, { icon: jsx(ExternalLinkIcon, {}), onClick: openW3M, disabled: isOpenW3M, waiting: isOpenW3M, children: ((_h = context.uiConfig) === null || _h === void 0 ? void 0 : _h.walletConnectCTA) === 'modal' ? locales.useWalletConnectModal : locales.useModal }))] })), isFamilyAccountsConnector(wallet.id) && (jsxs(Fragment, { children: [jsx(OrDivider, {}), jsx(Button, { onClick: () => switchConnectMethod(id), children: locales.loginWithEmailOrPhone })] })), hasApps && (jsx(Button, { onClick: () => {
13526
+ }, children: [context.uiConfig.walletConnectCTA !== 'modal' && (jsx(CopyToClipboard, { variant: "button", string: uri, children: context.uiConfig.walletConnectCTA === 'link' ? locales.copyToClipboard : locales.copyCode })), context.uiConfig.walletConnectCTA !== 'link' && (jsx(Button, { icon: jsx(ExternalLinkIcon, {}), onClick: openW3M, disabled: isOpenW3M, waiting: isOpenW3M, children: context.uiConfig.walletConnectCTA === 'modal' ? locales.useWalletConnectModal : locales.useModal }))] })), isFamilyAccountsConnector(wallet.id) && (jsxs(Fragment, { children: [jsx(OrDivider, {}), jsx(Button, { onClick: () => switchConnectMethod(id), children: locales.loginWithEmailOrPhone })] })), hasApps && (jsx(Button, { onClick: () => {
13541
13527
  context.setRoute(routes.DOWNLOAD);
13542
13528
  },
13543
13529
  /*
@@ -13565,7 +13551,7 @@ const ConnectUsing = () => {
13565
13551
  const [status, setStatus] = useState(isQrCode ? states$1.QRCODE : states$1.INJECTOR);
13566
13552
  useEffect(() => {
13567
13553
  const connector = context.connector;
13568
- context.log('ConnectUsing', { status, isQrCode, isOauth, connector });
13554
+ logger.log('ConnectUsing', { status, isQrCode, isOauth, connector });
13569
13555
  if (isOauth)
13570
13556
  return;
13571
13557
  // if no provider, change to qrcode
@@ -13625,9 +13611,9 @@ const DownloadFooter = styled.div `
13625
13611
  `;
13626
13612
  const ConnectWithMobile = () => {
13627
13613
  var _a, _b, _c;
13628
- const { connector, setRoute, log } = useOpenfort();
13614
+ const { connector, setRoute } = useOpenfort();
13629
13615
  const walletId = Object.keys(walletConfigs).find(
13630
- // where id is comma seperated list
13616
+ // where id is comma separated list
13631
13617
  (id) => id
13632
13618
  .split(',')
13633
13619
  .map((i) => i.trim())
@@ -13643,7 +13629,7 @@ const ConnectWithMobile = () => {
13643
13629
  const openApp = (url) => {
13644
13630
  var _a;
13645
13631
  const uri = (_a = wallet === null || wallet === void 0 ? void 0 : wallet.getWalletConnectDeeplink) === null || _a === void 0 ? void 0 : _a.call(wallet, url !== null && url !== void 0 ? url : '');
13646
- log('Opening wallet app with uri', { uri, url, wallet, walletId, walletConfigs, connectorId: connector.id });
13632
+ logger.log('Opening wallet app with uri', { uri, url, wallet, walletId, walletConfigs, connectorId: connector.id });
13647
13633
  if (uri) {
13648
13634
  if (url) {
13649
13635
  window.location.href = uri;
@@ -13706,13 +13692,12 @@ const ConnectWithMobile = () => {
13706
13692
 
13707
13693
  const customThemeDefault = {};
13708
13694
  const ConnectModal = ({ mode = 'auto', theme = 'auto', customTheme = customThemeDefault, lang = 'en-US' }) => {
13709
- var _a;
13710
13695
  const context = useOpenfort();
13711
13696
  const { logout, user } = useOpenfortCore();
13712
13697
  const { isConnected, chain } = useAccount();
13713
13698
  const chainIsSupported = useChainIsSupported(chain === null || chain === void 0 ? void 0 : chain.id);
13714
13699
  //if chain is unsupported we enforce a "switch chain" prompt
13715
- const closeable = !(((_a = context.uiConfig) === null || _a === void 0 ? void 0 : _a.enforceSupportedChains) && isConnected && !chainIsSupported);
13700
+ const closeable = !(context.uiConfig.enforceSupportedChains && isConnected && !chainIsSupported);
13716
13701
  const mainRoutes = [
13717
13702
  routes.PROFILE,
13718
13703
  routes.LOADING,
@@ -13772,7 +13757,7 @@ const ConnectModal = ({ mode = 'auto', theme = 'auto', customTheme = customTheme
13772
13757
  const provider = url.searchParams.get('openfortAuthProviderUI');
13773
13758
  const emailVerification = url.searchParams.get('openfortEmailVerificationUI');
13774
13759
  const forgotPassword = url.searchParams.get('openfortForgotPasswordUI');
13775
- context.log('Checking for search parameters', url);
13760
+ logger.log('Checking for search parameters', url);
13776
13761
  if (emailVerification) {
13777
13762
  context.setOpen(true);
13778
13763
  context.setRoute(routes.EMAIL_VERIFICATION);
@@ -13789,7 +13774,7 @@ const ConnectModal = ({ mode = 'auto', theme = 'auto', customTheme = customTheme
13789
13774
  return Object.values(OAuthProvider).includes(value);
13790
13775
  }
13791
13776
  if (isProvider(provider)) {
13792
- context.log('Found auth provider', provider);
13777
+ logger.log('Found auth provider', provider);
13793
13778
  context.setOpen(true);
13794
13779
  context.setConnector({ id: provider, type: 'oauth' });
13795
13780
  context.setRoute(routes.CONNECT);
@@ -13859,7 +13844,7 @@ const ConnectModal = ({ mode = 'auto', theme = 'auto', customTheme = customTheme
13859
13844
  * ```
13860
13845
  */
13861
13846
  const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMode = false, publishableKey, walletConfig, overrides, thirdPartyAuth, }) => {
13862
- var _a, _b, _c, _d, _e, _f, _g, _h;
13847
+ var _a, _b, _c, _d, _e;
13863
13848
  // OpenfortProvider must be within a WagmiProvider
13864
13849
  if (!React.useContext(WagmiContext)) {
13865
13850
  throw Error('OpenfortProvider must be within a WagmiProvider');
@@ -13872,7 +13857,6 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
13872
13857
  useMemo(() => {
13873
13858
  logger.enabled = !!debugMode;
13874
13859
  }, []);
13875
- const chains = useChains();
13876
13860
  const injectedConnector = useConnector('injected');
13877
13861
  const allowAutomaticRecovery = !!((walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.createEncryptedSessionEndpoint) || (walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.getEncryptionSession));
13878
13862
  // Default config options
@@ -13894,7 +13878,6 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
13894
13878
  disclaimer: null,
13895
13879
  bufferPolyfill: true,
13896
13880
  customAvatar: undefined,
13897
- initialChainId: (_a = chains === null || chains === void 0 ? void 0 : chains[0]) === null || _a === void 0 ? void 0 : _a.id,
13898
13881
  enforceSupportedChains: false,
13899
13882
  ethereumOnboardingUrl: undefined,
13900
13883
  walletOnboardingUrl: undefined,
@@ -13919,7 +13902,7 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
13919
13902
  if (typeof window !== 'undefined') {
13920
13903
  // Buffer Polyfill, needed for bundlers that don't provide Node polyfills (e.g CRA, Vite, etc.)
13921
13904
  if (safeUiConfig.bufferPolyfill)
13922
- window.Buffer = (_b = window.Buffer) !== null && _b !== void 0 ? _b : Buffer;
13905
+ window.Buffer = (_a = window.Buffer) !== null && _a !== void 0 ? _a : Buffer;
13923
13906
  // Some bundlers may need `global` and `process.env` polyfills as well
13924
13907
  // Not implemented here to avoid unexpected behaviors, but leaving example here for future reference
13925
13908
  /*
@@ -13927,9 +13910,9 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
13927
13910
  * window.process = window.process ?? { env: {} };
13928
13911
  */
13929
13912
  }
13930
- const [ckTheme, setTheme] = useState((_d = (_c = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.theme) !== null && _c !== void 0 ? _c : defaultUIOptions.theme) !== null && _d !== void 0 ? _d : 'auto');
13931
- const [ckMode, setMode] = useState((_f = (_e = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode) !== null && _e !== void 0 ? _e : defaultUIOptions.mode) !== null && _f !== void 0 ? _f : 'auto');
13932
- const [ckCustomTheme, setCustomTheme] = useState((_g = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.customTheme) !== null && _g !== void 0 ? _g : {});
13913
+ const [ckTheme, setTheme] = useState((_b = safeUiConfig.theme) !== null && _b !== void 0 ? _b : 'auto');
13914
+ const [ckMode, setMode] = useState((_c = safeUiConfig.mode) !== null && _c !== void 0 ? _c : 'auto');
13915
+ const [ckCustomTheme, setCustomTheme] = useState((_d = safeUiConfig.customTheme) !== null && _d !== void 0 ? _d : {});
13933
13916
  const [ckLang, setLang] = useState('en-US');
13934
13917
  const [open, setOpen] = useState(false);
13935
13918
  const [connector, setConnector] = useState({
@@ -13942,9 +13925,9 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
13942
13925
  // Include Google Font that is needed for a themes
13943
13926
  useThemeFont(safeUiConfig.embedGoogleFonts ? ckTheme : '');
13944
13927
  // Other Configuration
13945
- useEffect(() => { var _a; return setTheme((_a = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.theme) !== null && _a !== void 0 ? _a : 'auto'); }, [uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.theme]);
13946
- useEffect(() => { var _a; return setMode((_a = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode) !== null && _a !== void 0 ? _a : 'auto'); }, [uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode]);
13947
- useEffect(() => { var _a; return setCustomTheme((_a = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.customTheme) !== null && _a !== void 0 ? _a : {}); }, [uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.customTheme]);
13928
+ useEffect(() => { var _a; return setTheme((_a = safeUiConfig.theme) !== null && _a !== void 0 ? _a : 'auto'); }, [safeUiConfig.theme]);
13929
+ useEffect(() => { var _a; return setMode((_a = safeUiConfig.mode) !== null && _a !== void 0 ? _a : 'auto'); }, [safeUiConfig.mode]);
13930
+ useEffect(() => { var _a; return setCustomTheme((_a = safeUiConfig.customTheme) !== null && _a !== void 0 ? _a : {}); }, [safeUiConfig.customTheme]);
13948
13931
  useEffect(() => setLang(safeUiConfig.language || 'en-US'), [safeUiConfig.language]);
13949
13932
  useEffect(() => setErrorMessage(null), [route, open]);
13950
13933
  // Check if chain is supported, elsewise redirect to switches page
@@ -13984,16 +13967,8 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
13984
13967
  uiConfig: safeUiConfig,
13985
13968
  errorMessage,
13986
13969
  debugMode,
13987
- log: logger.log,
13988
13970
  emailInput,
13989
13971
  setEmailInput,
13990
- displayError: (message, code) => {
13991
- setErrorMessage(message);
13992
- logger.log('---------OPENFORT DEBUG---------');
13993
- logger.log(message);
13994
- if (code)
13995
- logger.log('---------/OPENFORT DEBUG---------');
13996
- },
13997
13972
  resize,
13998
13973
  triggerResize: () => onResize((prev) => prev + 1),
13999
13974
  walletConfig,
@@ -14007,7 +13982,7 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
14007
13982
  shieldPublishableKey: walletConfig.shieldPublishableKey,
14008
13983
  debug: debugMode,
14009
13984
  }
14010
- : undefined, overrides: overrides, thirdPartyAuth: thirdPartyAuth, onConnect: onConnect, onDisconnect: onDisconnect, children: [children, jsx(ConnectModal, { lang: ckLang, theme: ckTheme, mode: (_h = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode) !== null && _h !== void 0 ? _h : ckMode, customTheme: ckCustomTheme })] }) }));
13985
+ : undefined, overrides: overrides, thirdPartyAuth: thirdPartyAuth, onConnect: onConnect, onDisconnect: onDisconnect, children: [children, jsx(ConnectModal, { lang: ckLang, theme: ckTheme, mode: (_e = safeUiConfig.mode) !== null && _e !== void 0 ? _e : ckMode, customTheme: ckCustomTheme })] }) }));
14011
13986
  };
14012
13987
 
14013
13988
  /**
@@ -14283,7 +14258,6 @@ const useOAuth = (hookOptions = {}) => {
14283
14258
  */
14284
14259
  const useAuthCallback = ({ enabled = true, // Automatically handle OAuth and email callback
14285
14260
  ...hookOptions } = {}) => {
14286
- const { log } = useOpenfort();
14287
14261
  const [provider, setProvider] = useState(null);
14288
14262
  const [email, setEmail] = useState(null);
14289
14263
  const { verifyEmail, isSuccess: isEmailSuccess, isLoading: isEmailLoading, isError: isEmailError, error: emailError, } = useEmailAuth();
@@ -14320,7 +14294,7 @@ const useAuthCallback = ({ enabled = true, // Automatically handle OAuth and ema
14320
14294
  });
14321
14295
  window.history.replaceState({}, document.title, url.toString());
14322
14296
  };
14323
- log('EmailVerification', state, email);
14297
+ logger.log('EmailVerification', state, email);
14324
14298
  const options = {
14325
14299
  onSuccess: (data) => {
14326
14300
  var _a;
@@ -14367,7 +14341,7 @@ const useAuthCallback = ({ enabled = true, // Automatically handle OAuth and ema
14367
14341
  });
14368
14342
  window.history.replaceState({}, document.title, url.toString());
14369
14343
  };
14370
- log('callback', { player, accessToken, refreshToken });
14344
+ logger.log('callback', { player, accessToken, refreshToken });
14371
14345
  const options = {
14372
14346
  onSuccess: (data) => {
14373
14347
  var _a;
@@ -14513,7 +14487,6 @@ const useGuestAuth = (hookOptions = {}) => {
14513
14487
 
14514
14488
  const useWalletAuth = (hookOptions = {}) => {
14515
14489
  const { updateUser } = useOpenfortCore();
14516
- const { log } = useOpenfort();
14517
14490
  const siwe = useConnectWithSiwe();
14518
14491
  const availableWallets = useWallets$1(); // TODO: Use this to get the wallet client type
14519
14492
  const { disconnect } = useDisconnect();
@@ -14553,7 +14526,7 @@ const useWalletAuth = (hookOptions = {}) => {
14553
14526
  setShouldConnectWithSiwe(false);
14554
14527
  siwe({
14555
14528
  onError: (e) => {
14556
- log('Error connecting with SIWE', e);
14529
+ logger.log('Error connecting with SIWE', e);
14557
14530
  disconnect();
14558
14531
  const error = new OpenfortError('Failed to connect with siwe', OpenfortErrorType.AUTHENTICATION_ERROR, {
14559
14532
  error: e,
@@ -14561,7 +14534,7 @@ const useWalletAuth = (hookOptions = {}) => {
14561
14534
  handleError(error);
14562
14535
  },
14563
14536
  onConnect: () => {
14564
- log('Successfully connected with SIWE');
14537
+ logger.log('Successfully connected with SIWE');
14565
14538
  setStatus({
14566
14539
  status: 'success',
14567
14540
  });
@@ -14572,7 +14545,7 @@ const useWalletAuth = (hookOptions = {}) => {
14572
14545
  });
14573
14546
  },
14574
14547
  });
14575
- }, [shouldConnectWithSiwe, siwe, updateUser, log]);
14548
+ }, [shouldConnectWithSiwe, siwe, updateUser]);
14576
14549
  // const generateSiweMessage = useCallback(
14577
14550
  // async (args) => {
14578
14551
  // try {
@@ -14657,7 +14630,7 @@ const useWalletAuth = (hookOptions = {}) => {
14657
14630
  connector = options.connector;
14658
14631
  }
14659
14632
  if (!connector) {
14660
- log('Connector not found', connector);
14633
+ logger.log('Connector not found', connector);
14661
14634
  return handleError(new OpenfortError('Connector not found', OpenfortErrorType.AUTHENTICATION_ERROR));
14662
14635
  }
14663
14636
  setWalletConnectingTo(connector.id);
@@ -14681,13 +14654,13 @@ const useWalletAuth = (hookOptions = {}) => {
14681
14654
  await connectAsync({
14682
14655
  connector,
14683
14656
  });
14684
- log('Connected to wallet!!!', connector.id);
14657
+ logger.log('Connected to wallet!!!', connector.id);
14685
14658
  }
14686
14659
  catch (error) {
14687
14660
  logger.error('Error connecting', error);
14688
14661
  handleError(new OpenfortError('Failed to connect', OpenfortErrorType.AUTHENTICATION_ERROR, { error }));
14689
14662
  }
14690
- }, [siwe, disconnect, updateUser, availableWallets, log, setStatus, hookOptions]);
14663
+ }, [siwe, disconnect, updateUser, availableWallets, setStatus, hookOptions]);
14691
14664
  return {
14692
14665
  walletConnectingTo,
14693
14666
  connectWallet,
@@ -14762,6 +14735,167 @@ function use7702Authorization() {
14762
14735
  return { signAuthorization };
14763
14736
  }
14764
14737
 
14738
+ function useExtendedWalletClient() {
14739
+ const { data: wagmiWalletClient } = useWalletClient();
14740
+ if (!wagmiWalletClient)
14741
+ return undefined;
14742
+ // Convert the wagmi wallet client to a viem wallet client
14743
+ const client = createWalletClient({
14744
+ account: wagmiWalletClient.account,
14745
+ chain: wagmiWalletClient.chain,
14746
+ transport: custom(wagmiWalletClient.transport),
14747
+ }).extend(erc7715Actions());
14748
+ return client;
14749
+ }
14750
+
14751
+ /**
14752
+ * Hook for granting permissions to session keys (EIP-7715)
14753
+ *
14754
+ * This hook manages the creation and authorization of session keys, allowing users to
14755
+ * delegate permissions to specific accounts for a limited time. This enables use cases
14756
+ * like session-based authentication and gasless transactions within defined scopes.
14757
+ * The hook leverages EIP-7715 for permission granting.
14758
+ *
14759
+ * @param hookOptions - Optional configuration with callback functions
14760
+ * @returns Current grant permissions state and actions
14761
+ *
14762
+ * @example
14763
+ * ```tsx
14764
+ * import { generatePrivateKey, privateKeyToAccount } from 'viem/accounts';
14765
+ * import { useGrantPermissions } from '@openfort/openfort-react';
14766
+ *
14767
+ * const { grantPermissions, isLoading, isError, error } = useGrantPermissions({
14768
+ * onSuccess: (result) => console.log('Permissions granted:', result),
14769
+ * onError: (error) => console.error('Permission grant failed:', error),
14770
+ * });
14771
+ *
14772
+ * // Grant permissions to a session key
14773
+ * const handleGrantPermissions = async () => {
14774
+ * try {
14775
+ * // Generate a new session key
14776
+ * const sessionKey = generatePrivateKey();
14777
+ * const accountSession = privateKeyToAccount(sessionKey).address;
14778
+ *
14779
+ * const result = await grantPermissions({
14780
+ * sessionKey,
14781
+ * request: {
14782
+ * signer: {
14783
+ * type: 'account',
14784
+ * data: {
14785
+ * id: accountSession,
14786
+ * },
14787
+ * },
14788
+ * expiry: 60 * 60 * 24, // 24 hours
14789
+ * permissions: [
14790
+ * {
14791
+ * type: 'contract-call',
14792
+ * data: {
14793
+ * address: '0x2522f4fc9af2e1954a3d13f7a5b2683a00a4543a',
14794
+ * },
14795
+ * },
14796
+ * ],
14797
+ * },
14798
+ * });
14799
+ *
14800
+ * if (result.address) {
14801
+ * console.log('Session created with address:', result.address);
14802
+ * console.log('Session private key:', result.privateKey);
14803
+ * }
14804
+ * } catch (error) {
14805
+ * console.error('Failed to grant permissions:', error);
14806
+ * }
14807
+ * };
14808
+ *
14809
+ * // Check permission grant state
14810
+ * if (isLoading) {
14811
+ * console.log('Granting permissions...');
14812
+ * } else if (isError) {
14813
+ * console.error('Permission grant error:', error);
14814
+ * }
14815
+ *
14816
+ * // Example usage in component
14817
+ * return (
14818
+ * <div>
14819
+ * <button
14820
+ * onClick={handleGrantPermissions}
14821
+ * disabled={isLoading}
14822
+ * >
14823
+ * {isLoading ? 'Granting Permissions...' : 'Create Session'}
14824
+ * </button>
14825
+ *
14826
+ * {isError && (
14827
+ * <p>Error: {error?.message}</p>
14828
+ * )}
14829
+ * </div>
14830
+ * );
14831
+ * ```
14832
+ */
14833
+ const useGrantPermissions = (hookOptions = {}) => {
14834
+ const chains = useChains();
14835
+ const chainId = useChainId();
14836
+ const [status, setStatus] = useState({
14837
+ status: 'idle',
14838
+ });
14839
+ const walletClient = useExtendedWalletClient();
14840
+ const [data, setData] = useState(null);
14841
+ const grantPermissions = useCallback(async ({ request, sessionKey }, options = {}) => {
14842
+ try {
14843
+ if (!walletClient) {
14844
+ throw new OpenfortError('Wallet client not available', OpenfortErrorType.WALLET_ERROR);
14845
+ }
14846
+ setStatus({
14847
+ status: 'loading',
14848
+ });
14849
+ // Get the current chain configuration
14850
+ const chain = chains.find((c) => c.id === chainId);
14851
+ if (!chain) {
14852
+ throw new OpenfortError('No chain configured', OpenfortErrorType.CONFIGURATION_ERROR);
14853
+ }
14854
+ // Get the account address
14855
+ const [account] = await walletClient.getAddresses();
14856
+ // Grant permissions
14857
+ const grantPermissionsResult = await walletClient.grantPermissions(request);
14858
+ const data = {
14859
+ address: account,
14860
+ privateKey: sessionKey,
14861
+ ...grantPermissionsResult,
14862
+ };
14863
+ setData(data);
14864
+ setStatus({
14865
+ status: 'success',
14866
+ });
14867
+ return onSuccess({
14868
+ hookOptions,
14869
+ options,
14870
+ data,
14871
+ });
14872
+ }
14873
+ catch (error) {
14874
+ const openfortError = new OpenfortError('Failed to grant permissions', OpenfortErrorType.WALLET_ERROR, {
14875
+ error,
14876
+ });
14877
+ setStatus({
14878
+ status: 'error',
14879
+ error: openfortError,
14880
+ });
14881
+ return onError({
14882
+ hookOptions,
14883
+ options,
14884
+ error: openfortError,
14885
+ });
14886
+ }
14887
+ }, [chains, chainId, setStatus, hookOptions]);
14888
+ return {
14889
+ grantPermissions,
14890
+ data,
14891
+ reset: () => {
14892
+ setStatus({ status: 'idle' });
14893
+ setData(null);
14894
+ },
14895
+ ...mapStatus(status),
14896
+ };
14897
+ };
14898
+
14765
14899
  const wallets = Object.keys(walletConfigs).reduce((acc, key) => {
14766
14900
  var _a, _b, _c, _d, _e, _f;
14767
14901
  const config = walletConfigs[key];
@@ -14788,5 +14922,5 @@ const wallets = Object.keys(walletConfigs).reduce((acc, key) => {
14788
14922
  return acc;
14789
14923
  }, {});
14790
14924
 
14791
- export { UIAuthProvider as AuthProvider, Avatar, Chain as ChainIcon, OPENFORT_VERSION, OpenfortButton, OpenfortError, OpenfortErrorType, OpenfortProvider, embeddedWalletId, defaultConfig as getDefaultConfig, defaultConnectors as getDefaultConnectors, use7702Authorization, useAuthCallback, useChainIsSupported, useChains, useConnectWithSiwe, useEmailAuth, useGuestAuth, useOAuth, useOpenfortCore as useOpenfort, useSignOut, useUI, useUser, useWalletAuth, useWallets, wallets };
14925
+ export { UIAuthProvider as AuthProvider, Avatar, Chain as ChainIcon, OPENFORT_VERSION, OpenfortButton, OpenfortError, OpenfortErrorType, OpenfortProvider, embeddedWalletId, defaultConfig as getDefaultConfig, defaultConnectors as getDefaultConnectors, use7702Authorization, useAuthCallback, useChainIsSupported, useChains, useConnectWithSiwe, useEmailAuth, useGrantPermissions, useGuestAuth, useOAuth, useOpenfortCore as useOpenfort, useSignOut, useUI, useUser, useWalletAuth, useWallets, wallets };
14792
14926
  //# sourceMappingURL=index.es.js.map