@dynamic-labs/sdk-react-core 2.0.0-alpha.2 → 2.0.0-alpha.4

package/src/lib/widgets/FundingWidget/views/FundWalletView/FundWalletView.js

@@ -35,36 +35,40 @@ import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../context/UserWalletsContext/UserWalletsContext.js';
+import { ShadowDOM } from '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import { OpacityTransition } from '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
-import { ShadowDOM } from '../../../../components/ShadowDOM/ShadowDOM.js';
-import '../../../../components/OverlayCard/OverlayCard.context.js';
+import '../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
 import '../../../../context/FooterAnimationContext/index.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
 import '../../../../context/LoadingContext/LoadingContext.js';
+import '../../../../context/WalletContext/WalletContext.js';
 import 'i18next';
 import 'qrcode';
 import '../../../DynamicWidget/context/DynamicWidgetContext.js';
+import '../../../../components/IconButton/IconButton.js';
+import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import 'formik';
-import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/Alert/Alert.js';
 import '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../../../context/PasskeyContext/PasskeyContext.js';
-import '@dynamic-labs/viem-utils';
+import '../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 import '../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../components/Input/Input.js';
 import '../../../../components/IsBrowser/IsBrowser.js';
-import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 import '../../../../views/WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import 'react-international-phone';
+import '../../../../views/LoginView/sections/PhoneNumberSignInSection/usePhoneInputLogic/usePhoneInputLogic.js';
 import { useFundingContext } from '../../../../context/FundingContext/FundingContext.js';
 
 const Modal = ({ onrampUrl }) => {

package/src/lib/components/OverlayCard/OverlayCard.context.cjs

@@ -1,9 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-const overlayCardContext = React.createContext(false);
-
-exports.overlayCardContext = overlayCardContext;

package/src/lib/components/OverlayCard/OverlayCard.context.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-type OverlayCardContext = {
-    portal: HTMLDivElement | null;
-};
-export declare const overlayCardContext: import("react").Context<OverlayCardContext>;
-export {};

package/src/lib/components/OverlayCard/OverlayCard.context.js

@@ -1,5 +0,0 @@
-import { createContext } from 'react';
-
-const overlayCardContext = createContext(false);
-
-export { overlayCardContext };

package/src/lib/components/OverlayCard/OverlayCardTarget.cjs

@@ -1,17 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var OverlayCard_context = require('./OverlayCard.context.cjs');
-
-const OverlayCardTarget = ({ children }) => {
-    const { Provider } = OverlayCard_context.overlayCardContext;
-    const [portal, setPortal] = React.useState(null);
-    return (jsxRuntime.jsxs(Provider, { value: {
-            portal,
-        }, children: [children, jsxRuntime.jsx("div", { ref: setPortal })] }));
-};
-
-exports.OverlayCardTarget = OverlayCardTarget;

package/src/lib/components/OverlayCard/OverlayCardTarget.d.ts

@@ -1,2 +0,0 @@
-import { FC, PropsWithChildren } from 'react';
-export declare const OverlayCardTarget: FC<PropsWithChildren>;

package/src/lib/components/OverlayCard/OverlayCardTarget.js

@@ -1,13 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState } from 'react';
-import { overlayCardContext } from './OverlayCard.context.js';
-
-const OverlayCardTarget = ({ children }) => {
-    const { Provider } = overlayCardContext;
-    const [portal, setPortal] = useState(null);
-    return (jsxs(Provider, { value: {
-            portal,
-        }, children: [children, jsx("div", { ref: setPortal })] }));
-};
-
-export { OverlayCardTarget };

package/src/lib/components/SecureTurnkeyWalletCard/SecureTurnkeyWalletCard.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-type Props = {
-    className?: string;
-};
-export declare const SecureTurnkeyWalletCard: ({ className }: Props) => JSX.Element | null;
-export {};

package/src/lib/components/SecureTurnkeyWalletCard/index.d.ts

@@ -1 +0,0 @@
-export { SecureTurnkeyWalletCard } from './SecureTurnkeyWalletCard';

package/src/lib/components/SyncPasskeyFlow/SyncPasskeyFlow.d.ts

@@ -1 +0,0 @@
-export declare const SyncPasskeyFlow: () => null;

package/src/lib/components/SyncPasskeyFlow/index.d.ts

@@ -1 +0,0 @@
-export { SyncPasskeyFlow } from './SyncPasskeyFlow';

package/src/lib/utils/functions/isAccountAbstractionWallet/isAccountAbstractionWallet.cjs

@@ -1,18 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
-
-const isAccountAbstractionWallet = (wallet) => {
-    if (!wallet ||
-        wallet === undefined ||
-        wallet === null ||
-        typeof wallet !== 'object' ||
-        !('connector' in wallet)) {
-        return false;
-    }
-    return walletConnectorCore.isAccountAbstractionConnector(wallet.connector);
-};
-
-exports.isAccountAbstractionWallet = isAccountAbstractionWallet;

package/src/lib/utils/functions/isAccountAbstractionWallet/isAccountAbstractionWallet.js

@@ -1,14 +0,0 @@
-import { isAccountAbstractionConnector } from '@dynamic-labs/wallet-connector-core';
-
-const isAccountAbstractionWallet = (wallet) => {
-    if (!wallet ||
-        wallet === undefined ||
-        wallet === null ||
-        typeof wallet !== 'object' ||
-        !('connector' in wallet)) {
-        return false;
-    }
-    return isAccountAbstractionConnector(wallet.connector);
-};
-
-export { isAccountAbstractionWallet };

package/src/lib/utils/functions/isMagicConnector/isMagicConnector.cjs

@@ -1,10 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const magicEmailOtpWalletConnectorKey = 'magicemailotp';
-const magicSocialWalletConnectorKey = 'magicsocial';
-const isMagicConnector = (connector) => connector.key === magicEmailOtpWalletConnectorKey ||
-    connector.key === magicSocialWalletConnectorKey;
-
-exports.isMagicConnector = isMagicConnector;

package/src/lib/utils/functions/isMagicConnector/isMagicConnector.js

@@ -1,6 +0,0 @@
-const magicEmailOtpWalletConnectorKey = 'magicemailotp';
-const magicSocialWalletConnectorKey = 'magicsocial';
-const isMagicConnector = (connector) => connector.key === magicEmailOtpWalletConnectorKey ||
-    connector.key === magicSocialWalletConnectorKey;
-
-export { isMagicConnector };

package/src/lib/utils/hooks/useTransactionWithGasPrice/index.d.ts

@@ -1 +0,0 @@
-export { useTransactionWithGasPrice } from './useTransactionWithGasPrice';

package/src/lib/utils/hooks/useTransactionWithGasPrice/useTransactionWithGasPrice.cjs

@@ -1,56 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var usePromise = require('../usePromise/usePromise.cjs');
-
-const increaseGasPrice = (gasPrice, increasePercentage) => {
-    const increaseFactor = 100 + increasePercentage;
-    return (gasPrice * BigInt(increaseFactor)) / BigInt(100);
-};
-/**
- * A React Hook that returns a transaction object with the gas price set to the current gas price from the provider.
- * The gas price is increased by a certain percentage specified by the user. The hook also allows the user to enable
- * or disable this functionality.
- *
- * @param {Object} props - The properties for the hook.
- * @param {PublicClient} props.provider - The provider to use for getting the current gas price.
- * @param {TransactionRequest} props.transaction - The transaction object.
- * @param {number} props.increasePercentage - The percentage by which to increase the current gas price.
- * @param {boolean} [props.enabled=true] - A flag to enable or disable the gas price increase functionality.
- *
- * @returns {TransactionRequest} A new transaction object with the gas price.
- * If the `enabled` flag is set to false, or if the gas price is not available, or if the transaction already has a
- * gas price set, the original transaction object is returned.
- *
- * @example
- * const updatedTransaction = useTransactionWithGasPrice({
- *   provider: myProvider,
- *   transaction: myTransaction,
- *   increasePercentage: 10,
- *   enabled: true,
- * });
- */
-const useTransactionWithGasPrice = ({ increasePercentage = 0, provider, transaction, enabled = true, }) => {
-    const isGasPriceDefinedInTransaction = Boolean(transaction.gasPrice);
-    const shouldLoadGasPrice = enabled && increasePercentage > 0 && !isGasPriceDefinedInTransaction;
-    const { data: gasPrice } = usePromise.usePromise(() => provider.getGasPrice(), {
-        deps: [transaction, provider],
-        enabled: shouldLoadGasPrice,
-    });
-    if (!gasPrice) {
-        return transaction;
-    }
-    if (transaction.type === 'legacy' ||
-        transaction.type === 'eip2930' ||
-        transaction.type === undefined ||
-        transaction.maxFeePerGas === undefined) {
-        return Object.assign(Object.assign({}, transaction), { gasPrice: increaseGasPrice(gasPrice, increasePercentage) });
-    }
-    if (transaction.type === 'eip1559') {
-        return Object.assign(Object.assign({}, transaction), { maxFeePerGas: increaseGasPrice(gasPrice, increasePercentage) });
-    }
-    return transaction;
-};
-
-exports.useTransactionWithGasPrice = useTransactionWithGasPrice;

package/src/lib/utils/hooks/useTransactionWithGasPrice/useTransactionWithGasPrice.d.ts

@@ -1,32 +0,0 @@
-import { PublicClient, TransactionRequest } from 'viem';
-type UseTransactionWithGasPriceProps = {
-    provider: PublicClient;
-    transaction: TransactionRequest;
-    increasePercentage?: number;
-    enabled?: boolean;
-};
-/**
- * A React Hook that returns a transaction object with the gas price set to the current gas price from the provider.
- * The gas price is increased by a certain percentage specified by the user. The hook also allows the user to enable
- * or disable this functionality.
- *
- * @param {Object} props - The properties for the hook.
- * @param {PublicClient} props.provider - The provider to use for getting the current gas price.
- * @param {TransactionRequest} props.transaction - The transaction object.
- * @param {number} props.increasePercentage - The percentage by which to increase the current gas price.
- * @param {boolean} [props.enabled=true] - A flag to enable or disable the gas price increase functionality.
- *
- * @returns {TransactionRequest} A new transaction object with the gas price.
- * If the `enabled` flag is set to false, or if the gas price is not available, or if the transaction already has a
- * gas price set, the original transaction object is returned.
- *
- * @example
- * const updatedTransaction = useTransactionWithGasPrice({
- *   provider: myProvider,
- *   transaction: myTransaction,
- *   increasePercentage: 10,
- *   enabled: true,
- * });
- */
-export declare const useTransactionWithGasPrice: ({ increasePercentage, provider, transaction, enabled, }: UseTransactionWithGasPriceProps) => TransactionRequest;
-export {};

package/src/lib/utils/hooks/useTransactionWithGasPrice/useTransactionWithGasPrice.js

@@ -1,52 +0,0 @@
-import { usePromise } from '../usePromise/usePromise.js';
-
-const increaseGasPrice = (gasPrice, increasePercentage) => {
-    const increaseFactor = 100 + increasePercentage;
-    return (gasPrice * BigInt(increaseFactor)) / BigInt(100);
-};
-/**
- * A React Hook that returns a transaction object with the gas price set to the current gas price from the provider.
- * The gas price is increased by a certain percentage specified by the user. The hook also allows the user to enable
- * or disable this functionality.
- *
- * @param {Object} props - The properties for the hook.
- * @param {PublicClient} props.provider - The provider to use for getting the current gas price.
- * @param {TransactionRequest} props.transaction - The transaction object.
- * @param {number} props.increasePercentage - The percentage by which to increase the current gas price.
- * @param {boolean} [props.enabled=true] - A flag to enable or disable the gas price increase functionality.
- *
- * @returns {TransactionRequest} A new transaction object with the gas price.
- * If the `enabled` flag is set to false, or if the gas price is not available, or if the transaction already has a
- * gas price set, the original transaction object is returned.
- *
- * @example
- * const updatedTransaction = useTransactionWithGasPrice({
- *   provider: myProvider,
- *   transaction: myTransaction,
- *   increasePercentage: 10,
- *   enabled: true,
- * });
- */
-const useTransactionWithGasPrice = ({ increasePercentage = 0, provider, transaction, enabled = true, }) => {
-    const isGasPriceDefinedInTransaction = Boolean(transaction.gasPrice);
-    const shouldLoadGasPrice = enabled && increasePercentage > 0 && !isGasPriceDefinedInTransaction;
-    const { data: gasPrice } = usePromise(() => provider.getGasPrice(), {
-        deps: [transaction, provider],
-        enabled: shouldLoadGasPrice,
-    });
-    if (!gasPrice) {
-        return transaction;
-    }
-    if (transaction.type === 'legacy' ||
-        transaction.type === 'eip2930' ||
-        transaction.type === undefined ||
-        transaction.maxFeePerGas === undefined) {
-        return Object.assign(Object.assign({}, transaction), { gasPrice: increaseGasPrice(gasPrice, increasePercentage) });
-    }
-    if (transaction.type === 'eip1559') {
-        return Object.assign(Object.assign({}, transaction), { maxFeePerGas: increaseGasPrice(gasPrice, increasePercentage) });
-    }
-    return transaction;
-};
-
-export { useTransactionWithGasPrice };

package/src/lib/views/LoginView/useLoginView.cjs

@@ -1,265 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var reactI18next = require('react-i18next');
-var sdkApi = require('@dynamic-labs/sdk-api');
-require('../../context/DynamicContext/DynamicContext.cjs');
-var logger = require('../../shared/logger.cjs');
-require('@dynamic-labs/iconic');
-require('@dynamic-labs/wallet-connector-core');
-require('react/jsx-runtime');
-require('../../context/ViewContext/ViewContext.cjs');
-require('@dynamic-labs/wallet-book');
-require('../../utils/constants/colors.cjs');
-require('../../utils/constants/values.cjs');
-require('../../shared/utils/classes/storage/localStorage.cjs');
-require('viem');
-require('@dynamic-labs/utils');
-require('../../shared/consts/index.cjs');
-require('../../events/dynamicEvents.cjs');
-require('../../../../_virtual/_tslib.cjs');
-require('../../context/CaptchaContext/CaptchaContext.cjs');
-require('../../context/ErrorContext/ErrorContext.cjs');
-require('@dynamic-labs/multi-wallet');
-var isEmailProviderEnabled = require('../../utils/functions/isEmailProviderEnabled/isEmailProviderEnabled.cjs');
-require('viem/chains');
-require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
-require('../../context/AccountExistsContext/AccountExistsContext.cjs');
-require('../../config/ApiEndpoint.cjs');
-require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
-require('react-dom');
-require('../../context/ThemeContext/ThemeContext.cjs');
-require('@dynamic-labs/types');
-require('yup');
-require('../../context/MockContext/MockContext.cjs');
-require('../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
-require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
-require('@dynamic-labs/rpc-providers');
-require('../../context/UserWalletsContext/UserWalletsContext.cjs');
-require('../../components/Alert/Alert.cjs');
-require('../../components/ShadowDOM/ShadowDOM.cjs');
-require('../../components/IconButton/IconButton.cjs');
-require('../../components/InlineWidget/InlineWidget.cjs');
-require('../../components/IsBrowser/IsBrowser.cjs');
-require('../../components/MenuList/Dropdown/Dropdown.cjs');
-require('../../components/Transition/ZoomTransition/ZoomTransition.cjs');
-require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
-require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-require('../../components/Popper/Popper/Popper.cjs');
-require('../../components/Popper/PopperContext/PopperContext.cjs');
-require('react-focus-lock');
-require('formik');
-require('i18next');
-require('../../components/OverlayCard/OverlayCard.context.cjs');
-require('../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
-require('../../context/PasskeyContext/PasskeyContext.cjs');
-require('../WalletList/WalletList.cjs');
-require('qrcode');
-require('@hcaptcha/react-hcaptcha');
-require('../../context/LoadingContext/LoadingContext.cjs');
-var SocialRedirectContext = require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
-require('../../context/WalletGroupContext/WalletGroupContext.cjs');
-require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
-require('../../context/FooterAnimationContext/index.cjs');
-require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
-require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
-require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
-require('@dynamic-labs/viem-utils');
-require('../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
-var useViewSettings = require('../../utils/hooks/useViewSettings/useViewSettings.cjs');
-var useInternalDynamicContext = require('../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
-
-/* eslint-disable multiline-comment-style */
-const NUMBER_OF_WALLETS = 3;
-const useLoginView = () => {
-    var _a, _b, _c, _d, _e;
-    const loginView = useViewSettings.useViewSettings(sdkApi.SdkViewType.Login);
-    const { projectSettings, authorizationViewDisplayOrder, loginWithEmail, walletConnectorOptions, walletsFilter, } = useInternalDynamicContext.useInternalDynamicContext();
-    const { t } = reactI18next.useTranslation();
-    const { enabledSocialProviders } = SocialRedirectContext.useSocialRedirectContext();
-    const hasSocialProvidersEnabled = Boolean(enabledSocialProviders === null || enabledSocialProviders === void 0 ? void 0 : enabledSocialProviders.length);
-    const hasEmailProviderEnabled = ((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) === null || _a === void 0 ? void 0 : _a.length) &&
-        isEmailProviderEnabled.isEmailProviderEnabled(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers);
-    // is email only is set in the project settings when the "Email (Web2) only" is toggled on in the dashboard
-    const isEmailOnly = (_c = (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design) === null || _b === void 0 ? void 0 : _b.modal) === null || _c === void 0 ? void 0 : _c.emailOnly;
-    /** Takes from wallets only those that can be selected in the wallet list by the user.
-     * Should filter out embedded wallets
-     * WHY: when we decide whether to show wallets or not, we need to know how many wallets
-     * will actually be rendered. It would be especially bad to only have for ex "turnkey" in
-     * wallets and then display an empty wallet list (since turnkey doesn't render)
-     */
-    const selectableWallets = (walletsFilter
-        ? walletsFilter(walletConnectorOptions)
-        : walletConnectorOptions).filter(({ key }) => key !== 'turnkey');
-    const separator = React.useMemo(() => ({
-        label: t('dyn_login.separators.default'),
-        type: sdkApi.SdkViewSectionType.Separator,
-    }), [t]);
-    const isWalletOnly = React.useMemo(() => {
-        var _a;
-        if (!projectSettings) {
-            return false;
-        }
-        // if both loginWithEmail AND hasSocialProvidersEnabled are false, it's wallet only
-        if (!loginWithEmail && !hasSocialProvidersEnabled) {
-            return true;
-        }
-        // backwards compatibility for those that didn't set up login view sections
-        if (!((_a = loginView === null || loginView === void 0 ? void 0 : loginView.sections) === null || _a === void 0 ? void 0 : _a.length)) {
-            return !hasEmailProviderEnabled && !hasSocialProvidersEnabled;
-        }
-        return (loginView.sections.length === 1 && loginView.sections[0].type === 'wallet');
-    }, [
-        loginView === null || loginView === void 0 ? void 0 : loginView.sections,
-        projectSettings,
-        loginWithEmail,
-        hasSocialProvidersEnabled,
-        hasEmailProviderEnabled,
-    ]);
-    /**
-     * build email from project settings design.modal props
-     * @returns SdkViewSection[]
-     */
-    const getEmailViewSectionDefinition = React.useCallback(() => {
-        if (!hasEmailProviderEnabled)
-            return [];
-        return [
-            {
-                type: sdkApi.SdkViewSectionType.Email,
-            },
-        ];
-    }, [hasEmailProviderEnabled]);
-    /**
-     * build social from project settings design.modal props
-     * @returns SdkViewSection[]
-     */
-    const getSocialViewSectionDefinition = React.useCallback(() => {
-        if (!(enabledSocialProviders === null || enabledSocialProviders === void 0 ? void 0 : enabledSocialProviders.length))
-            return [];
-        return [
-            {
-                numOfItemsToDisplay: 5,
-                type: sdkApi.SdkViewSectionType.Social,
-            },
-        ];
-    }, [enabledSocialProviders === null || enabledSocialProviders === void 0 ? void 0 : enabledSocialProviders.length]);
-    const getWalletViewSectionDefinition = React.useCallback(() => {
-        var _a, _b;
-        if (!(selectableWallets === null || selectableWallets === void 0 ? void 0 : selectableWallets.length))
-            return [];
-        const numOfItemsToDisplay = ((_b = (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design) === null || _a === void 0 ? void 0 : _a.modal) === null || _b === void 0 ? void 0 : _b.showWalletsButton)
-            ? 0
-            : NUMBER_OF_WALLETS;
-        return [
-            {
-                numOfItemsToDisplay,
-                type: sdkApi.SdkViewSectionType.Wallet,
-            },
-        ];
-    }, [
-        (_e = (_d = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design) === null || _d === void 0 ? void 0 : _d.modal) === null || _e === void 0 ? void 0 : _e.showWalletsButton,
-        selectableWallets === null || selectableWallets === void 0 ? void 0 : selectableWallets.length,
-    ]);
-    const applyLoginModalSettings = React.useCallback((emailAndSocialSections) => {
-        if (emailAndSocialSections.length < 2) {
-            return emailAndSocialSections;
-        }
-        const { splitEmailAndSocial, socialAboveEmail } = (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design.modal) || {};
-        if (splitEmailAndSocial) {
-            emailAndSocialSections.splice(1, 0, separator);
-            // eslint-disable-next-line prefer-destructuring
-            emailAndSocialSections[2].defaultItem = enabledSocialProviders[0];
-        }
-        if (socialAboveEmail) {
-            emailAndSocialSections.reverse();
-        }
-        return emailAndSocialSections;
-    }, [enabledSocialProviders, projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design.modal, separator]);
-    // TODO: https://linear.app/dynamic-labs/issue/GVTY-212/rethink-or-implement-toolkit-template-for-email-wallet-order
-    /**
-     * remove wallet view section from projectSettings?.sdk?.views if no wallet defined
-     * @param sections
-     * @returns
-     */
-    const filterLoginViewSections = React.useCallback((sections) => {
-        var _a;
-        const hasEnabledNetwork = (chain) => { var _a; return (_a = chain.networks) === null || _a === void 0 ? void 0 : _a.some((network) => network.enabled); };
-        const hasEnabledChain = (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.chains) === null || _a === void 0 ? void 0 : _a.some((chain) => chain.enabled && hasEnabledNetwork(chain));
-        if (!hasEnabledChain &&
-            sections.find((section) => section.type === 'wallet')) {
-            logger.logger.error('Failed to render WalletSignInSection - no chains enabled');
-        }
-        if (selectableWallets === null || selectableWallets === void 0 ? void 0 : selectableWallets.length) {
-            return sections;
-        }
-        return sections.filter((section) => section.type !== 'wallet');
-    }, [selectableWallets === null || selectableWallets === void 0 ? void 0 : selectableWallets.length, projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.chains]);
-    /**
-     * build login view sections array from project settings design.modal props - backwards compatibility
-     * @returns SdkViewSection[]
-     */
-    const buildLoginSections = React.useCallback((buildOrder) => {
-        var _a;
-        const loginViewSections = [];
-        buildOrder === null || buildOrder === void 0 ? void 0 : buildOrder.forEach((loginItem) => {
-            // Add a separator if there are sections already
-            if (loginViewSections.length)
-                loginViewSections.push(separator);
-            if (loginItem === 'email') {
-                // In the past, the email and social sections were combined into one section,
-                // so we need to check for that case and add the social section if needed for backwards compatibility
-                // if email was just pushed to the loginViewSections array and social is not defined in the buildOrder,
-                // then we need to add social (if social is enabled)
-                const emailAndSocialSections = [
-                    ...getEmailViewSectionDefinition(),
-                    ...getSocialViewSectionDefinition(),
-                ];
-                loginViewSections.push(...applyLoginModalSettings(emailAndSocialSections));
-            }
-            if (loginItem === 'wallet') {
-                loginViewSections.push(...getWalletViewSectionDefinition());
-            }
-        });
-        // remove last separator
-        if (((_a = loginViewSections[loginViewSections.length - 1]) === null || _a === void 0 ? void 0 : _a.type) === 'separator') {
-            loginViewSections.pop();
-        }
-        return loginViewSections;
-    }, [
-        applyLoginModalSettings,
-        getEmailViewSectionDefinition,
-        getSocialViewSectionDefinition,
-        getWalletViewSectionDefinition,
-        separator,
-    ]);
-    /**
-     * returns the login view sections to be displayed in order from projectSettings?.sdk?.views
-     * and has backwards compatibility with project settings design.modal props
-     */
-    const logingViewSections = React.useMemo(() => {
-        var _a;
-        if ((_a = loginView === null || loginView === void 0 ? void 0 : loginView.sections) === null || _a === void 0 ? void 0 : _a.length) {
-            return filterLoginViewSections(loginView === null || loginView === void 0 ? void 0 : loginView.sections);
-        }
-        let viewOrder = authorizationViewDisplayOrder;
-        if (isEmailOnly) {
-            viewOrder = ['email'];
-        }
-        return buildLoginSections(viewOrder);
-    }, [
-        loginView,
-        authorizationViewDisplayOrder,
-        isEmailOnly,
-        buildLoginSections,
-        filterLoginViewSections,
-    ]);
-    return {
-        isWalletOnly,
-        logingViewSections,
-    };
-};
-
-exports.NUMBER_OF_WALLETS = NUMBER_OF_WALLETS;
-exports.useLoginView = useLoginView;