@imtbl/sdk 1.7.3 → 1.8.0

package/dist/index.cjs

@@ -174,7 +174,7 @@ const flattenProperties$1 = (properties) => {
 };
 
 // WARNING: DO NOT CHANGE THE STRING BELOW. IT GETS REPLACED AT BUILD TIME.
-const SDK_VERSION$1 = '1.7.3';
+const SDK_VERSION$1 = '1.8.0';
 const getReferrer$1 = () => {
     if (isNode$1()) {
         return '';
@@ -11298,7 +11298,7 @@ class MultiRollupApiClients {
 }
 
 // eslint-disable-next-line @typescript-eslint/naming-convention
-const defaultHeaders$1 = { 'x-sdk-version': 'ts-immutable-sdk-1.7.3' };
+const defaultHeaders$1 = { 'x-sdk-version': 'ts-immutable-sdk-1.8.0' };
 const createConfig = ({ basePath, headers, }) => {
     if (!basePath.trim()) {
         throw Error('basePath can not be empty');
@@ -11370,7 +11370,7 @@ class APIError extends Error {
 
 /* eslint-disable implicit-arrow-linebreak */
 const defaultHeaders = {
-    sdkVersion: 'ts-immutable-sdk-multi-rollup-api-client-1.7.3',
+    sdkVersion: 'ts-immutable-sdk-multi-rollup-api-client-1.8.0',
 };
 /**
  * createAPIConfiguration to create a custom Configuration
@@ -11803,7 +11803,7 @@ const createImmutableXConfiguration = ({ basePath, chainID, coreContractAddress,
     chainID,
     coreContractAddress,
     registrationContractAddress,
-    sdkVersion: 'ts-immutable-sdk-1.7.3',
+    sdkVersion: 'ts-immutable-sdk-1.8.0',
 });
 /**
  * Sets `sdkVersion` at the time of build
@@ -16450,7 +16450,6 @@ const getAuthConfiguration = (config) => {
             end_session_endpoint: endSessionEndpoint,
         },
         mergeClaims: true,
-        loadUserInfo: true,
         scope: oidcConfiguration.scope,
         userStore,
     };
@@ -16491,7 +16490,10 @@ class AuthManager {
         this.logoutMode = config.oidcConfiguration.logoutMode || 'redirect';
     }
     static mapOidcUserToDomainModel = (oidcUser) => {
-        const passport = oidcUser.profile?.passport;
+        let passport;
+        if (oidcUser.id_token) {
+            passport = jwt_decode(oidcUser.id_token)?.passport;
+        }
         const user = {
             expired: oidcUser.expired,
             idToken: oidcUser.id_token,
@@ -17916,27 +17918,28 @@ class JsonRpcError extends Error {
 }
 
 const MESSAGE_TO_SIGN = 'Only sign this message from Immutable Passport';
-async function registerZkEvmUser({ authManager, magicProvider, multiRollupApiClients, accessToken, jsonRpcProvider, }) {
-    const web3Provider = new providers.Web3Provider(magicProvider);
-    const ethSigner = web3Provider.getSigner();
-    const ethereumAddress = await ethSigner.getAddress();
-    const ethereumSignature = await signRaw(MESSAGE_TO_SIGN, ethSigner);
-    const headers = { Authorization: `Bearer ${accessToken}` };
-    const { chainId } = await jsonRpcProvider.ready;
-    const eipChainId = getEip155ChainId(chainId);
+async function registerZkEvmUser({ authManager, ethSigner, multiRollupApiClients, accessToken, jsonRpcProvider, }) {
+    const [ethereumAddress, ethereumSignature, network, chainListResponse] = await Promise.all([
+        ethSigner.getAddress(),
+        signRaw(MESSAGE_TO_SIGN, ethSigner),
+        jsonRpcProvider.ready,
+        multiRollupApiClients.chainsApi.listChains(),
+    ]);
+    const eipChainId = getEip155ChainId(network.chainId);
+    const chainName = chainListResponse.data?.result?.find((chain) => chain.id === eipChainId)?.name;
+    if (!chainName) {
+        throw new JsonRpcError(RpcErrorCode.INTERNAL_ERROR, `Chain name does not exist on for chain id ${network.chainId}`);
+    }
     try {
-        const chainList = (await multiRollupApiClients.chainsApi.listChains()).data.result;
-        const chainName = chainList.find((chain) => chain.id === eipChainId)?.name;
-        if (!chainName) {
-            throw new JsonRpcError(RpcErrorCode.INTERNAL_ERROR, `Chain name does not exist on for chain id ${chainId}`);
-        }
         await multiRollupApiClients.passportApi.createCounterfactualAddressV2({
             chainName,
             createCounterfactualAddressRequest: {
                 ethereum_address: ethereumAddress,
                 ethereum_signature: ethereumSignature,
             },
-        }, { headers });
+        }, {
+            headers: { Authorization: `Bearer ${accessToken}` },
+        });
     }
     catch (error) {
         throw new JsonRpcError(RpcErrorCode.INTERNAL_ERROR, `Failed to create counterfactual address: ${error}`);
@@ -17948,32 +17951,6 @@ async function registerZkEvmUser({ authManager, magicProvider, multiRollupApiCli
     return user;
 }
 
-const loginZkEvmUser = async ({ authManager, magicAdapter, multiRollupApiClients, jsonRpcProvider, }) => {
-    const user = await authManager.getUserOrLogin();
-    if (!user.idToken) {
-        throw new Error('User is missing idToken');
-    }
-    const magicProvider = await magicAdapter.login(user.idToken);
-    if (!user.zkEvm) {
-        // Generate counterfactual address and retrieve updated Auth0 user
-        const userZkevm = await registerZkEvmUser({
-            authManager,
-            magicProvider,
-            multiRollupApiClients,
-            accessToken: user.accessToken,
-            jsonRpcProvider,
-        });
-        return {
-            user: userZkevm,
-            magicProvider,
-        };
-    }
-    return {
-        user: user,
-        magicProvider,
-    };
-};
-
 const transactionRejectedCrossSdkBridgeError = 'Transaction requires confirmation but this functionality is not'
     + ' supported in this environment. Please contact Immutable support if you need to enable this feature.';
 const convertBigNumberishToString = (value) => ethers.BigNumber.from(value).toString();
@@ -18169,7 +18146,7 @@ const getMetaTransactions = async (metaTransaction, nonce, chainId, walletAddres
     }
     return [metaTransaction, feeMetaTransaction];
 };
-const sendTransaction$1 = ({ params, magicProvider, jsonRpcProvider, relayerClient, guardianClient, zkevmAddress, }) => guardianClient
+const sendTransaction$1 = ({ params, ethSigner, jsonRpcProvider, relayerClient, guardianClient, zkevmAddress, }) => guardianClient
     .withConfirmationScreen({ width: 480, height: 720 })(async () => {
     const transactionRequest = params[0];
     if (!transactionRequest.to) {
@@ -18177,8 +18154,6 @@ const sendTransaction$1 = ({ params, magicProvider, jsonRpcProvider, relayerClie
     }
     const { chainId } = await jsonRpcProvider.ready;
     const chainIdBigNumber = ethers.BigNumber.from(chainId);
-    const magicWeb3Provider = new providers.Web3Provider(magicProvider);
-    const signer = magicWeb3Provider.getSigner();
     const nonce = await getNonce(jsonRpcProvider, zkevmAddress);
     const metaTransaction = {
         to: transactionRequest.to,
@@ -18187,15 +18162,18 @@ const sendTransaction$1 = ({ params, magicProvider, jsonRpcProvider, relayerClie
         value: transactionRequest.value,
         revertOnError: true,
     };
-    const metaTransactions = await getMetaTransactions(metaTransaction, nonce, chainIdBigNumber, zkevmAddress, signer, relayerClient);
-    await guardianClient.validateEVMTransaction({
-        chainId: getEip155ChainId(chainId),
-        nonce: convertBigNumberishToString(nonce),
-        metaTransactions,
-    });
-    // NOTE: We sign again because we now are adding the fee transaction, so the
-    // whole payload is different and needs a new signature.
-    const signedTransactions = await getSignedMetaTransactions(metaTransactions, nonce, chainIdBigNumber, zkevmAddress, signer);
+    const metaTransactions = await getMetaTransactions(metaTransaction, nonce, chainIdBigNumber, zkevmAddress, ethSigner, relayerClient);
+    // Parallelize the validation and signing of the transaction
+    const [, signedTransactions] = await Promise.all([
+        guardianClient.validateEVMTransaction({
+            chainId: getEip155ChainId(chainId),
+            nonce: convertBigNumberishToString(nonce),
+            metaTransactions,
+        }),
+        // NOTE: We sign again because we now are adding the fee transaction, so the
+        // whole payload is different and needs a new signature.
+        getSignedMetaTransactions(metaTransactions, nonce, chainIdBigNumber, zkevmAddress, ethSigner),
+    ]);
     const relayerId = await relayerClient.ethSendTransaction(zkevmAddress, signedTransactions);
     const retrieveRelayerTransaction = async () => {
         const tx = await relayerClient.imGetTransactionByHash(relayerId);
@@ -18264,7 +18242,7 @@ const transformTypedData = (typedData, chainId) => {
     }
     return transformedTypedData;
 };
-const signTypedDataV4 = async ({ params, method, magicProvider, jsonRpcProvider, relayerClient, guardianClient, }) => guardianClient
+const signTypedDataV4 = async ({ params, method, ethSigner, jsonRpcProvider, relayerClient, guardianClient, }) => guardianClient
     .withConfirmationScreen({ width: 480, height: 720 })(async () => {
     const fromAddress = params[0];
     const typedDataParam = params[1];
@@ -18275,106 +18253,158 @@ const signTypedDataV4 = async ({ params, method, magicProvider, jsonRpcProvider,
     const typedData = transformTypedData(typedDataParam, chainId);
     await guardianClient.validateMessage({ chainID: String(chainId), payload: typedData });
     const relayerSignature = await relayerClient.imSignTypedData(fromAddress, typedData);
-    const magicWeb3Provider = new providers.Web3Provider(magicProvider);
-    const signer = magicWeb3Provider.getSigner();
-    return getSignedTypedData(typedData, relayerSignature, ethers.BigNumber.from(chainId), fromAddress, signer);
+    return getSignedTypedData(typedData, relayerSignature, ethers.BigNumber.from(chainId), fromAddress, ethSigner);
 });
 
+const isZkEvmUser = (user) => 'zkEvm' in user;
 class ZkEvmProvider {
-    authManager;
-    config;
-    magicAdapter;
-    multiRollupApiClients;
-    jsonRpcProvider; // Used for read
-    eventEmitter;
-    guardianClient;
-    relayerClient;
-    magicProvider; // Used for signing
-    zkevmAddress;
+    #authManager;
+    #config;
+    #eventEmitter;
+    #guardianClient;
+    #jsonRpcProvider; // Used for read
+    #magicAdapter;
+    #multiRollupApiClients;
+    #relayerClient;
+    /**
+     * This property is set during `#initialiseEthSigner` and stores the signer in a promise.
+     * This property is not meant to be accessed directly, but through the
+     * `#getSigner` method.
+     * @see getSigner
+     */
+    #ethSigner;
+    #signerInitialisationError;
+    #zkEvmAddress;
     isPassport = true;
     constructor({ authManager, magicAdapter, config, multiRollupApiClients, passportEventEmitter, guardianClient, }) {
-        this.authManager = authManager;
-        this.magicAdapter = magicAdapter;
-        this.config = config;
-        this.guardianClient = guardianClient;
+        this.#authManager = authManager;
+        this.#magicAdapter = magicAdapter;
+        this.#config = config;
+        this.#guardianClient = guardianClient;
         if (config.crossSdkBridgeEnabled) {
             // JsonRpcProvider by default sets the referrer as "client".
             // On Unreal 4 this errors as the browser used is expecting a valid URL.
-            this.jsonRpcProvider = new providers.JsonRpcProvider({
-                url: this.config.zkEvmRpcUrl,
+            this.#jsonRpcProvider = new providers.JsonRpcProvider({
+                url: this.#config.zkEvmRpcUrl,
                 fetchOptions: { referrer: 'http://imtblgamesdk.local' },
             });
         }
         else {
-            this.jsonRpcProvider = new providers.JsonRpcProvider(this.config.zkEvmRpcUrl);
+            this.#jsonRpcProvider = new providers.JsonRpcProvider(this.#config.zkEvmRpcUrl);
         }
-        this.multiRollupApiClients = multiRollupApiClients;
-        this.eventEmitter = new TypedEventEmitter();
-        passportEventEmitter.on(PassportEvents.LOGGED_OUT, this.handleLogout);
-    }
-    handleLogout = () => {
-        const shouldEmitAccountsChanged = this.isLoggedIn();
-        this.magicProvider = undefined;
-        this.relayerClient = undefined;
+        this.#relayerClient = new RelayerClient({
+            config: this.#config,
+            jsonRpcProvider: this.#jsonRpcProvider,
+            authManager: this.#authManager,
+        });
+        this.#multiRollupApiClients = multiRollupApiClients;
+        this.#eventEmitter = new TypedEventEmitter();
+        passportEventEmitter.on(PassportEvents.LOGGED_OUT, this.#handleLogout);
+    }
+    #handleLogout = () => {
+        const shouldEmitAccountsChanged = !!this.#zkEvmAddress;
+        this.#ethSigner = undefined;
+        this.#zkEvmAddress = undefined;
         if (shouldEmitAccountsChanged) {
-            this.eventEmitter.emit(ProviderEvent.ACCOUNTS_CHANGED, []);
+            this.#eventEmitter.emit(ProviderEvent.ACCOUNTS_CHANGED, []);
         }
     };
-    isLoggedIn() {
-        return this.magicProvider !== undefined
-            && this.zkevmAddress !== undefined
-            && this.relayerClient !== undefined;
+    /**
+     * This method is called by `eth_requestAccounts` and asynchronously initialises the signer.
+     * The signer is stored in a promise so that it can be retrieved by the provider
+     * when needed.
+     *
+     * If an error is thrown during initialisation, it is stored in the `signerInitialisationError`,
+     * so that it doesn't result in an unhandled promise rejection.
+     *
+     * This error is thrown when the signer is requested through:
+     * @see #getSigner
+     *
+     */
+    async #initialiseEthSigner(user) {
+        const generateSigner = async () => {
+            const magicRpcProvider = await this.#magicAdapter.login(user.idToken);
+            const web3Provider = new providers.Web3Provider(magicRpcProvider);
+            return web3Provider.getSigner();
+        };
+        // eslint-disable-next-line no-async-promise-executor
+        this.#ethSigner = new Promise(async (resolve) => {
+            try {
+                resolve(await generateSigner());
+            }
+            catch (err) {
+                // Capture and store the initialization error
+                this.#signerInitialisationError = err;
+                resolve(undefined);
+            }
+        });
     }
-    async performRequest(request) {
+    async #getSigner() {
+        const ethSigner = await this.#ethSigner;
+        // Throw the stored error if the signers failed to initialise
+        if (typeof ethSigner === 'undefined') {
+            if (typeof this.#signerInitialisationError !== 'undefined') {
+                throw this.#signerInitialisationError;
+            }
+            throw new Error('Signer failed to initialise');
+        }
+        return ethSigner;
+    }
+    async #performRequest(request) {
         switch (request.method) {
             case 'eth_requestAccounts': {
-                if (this.isLoggedIn()) {
-                    return [this.zkevmAddress];
+                if (this.#zkEvmAddress) {
+                    return [this.#zkEvmAddress];
                 }
-                const { magicProvider, user } = await loginZkEvmUser({
-                    authManager: this.authManager,
-                    magicAdapter: this.magicAdapter,
-                    multiRollupApiClients: this.multiRollupApiClients,
-                    jsonRpcProvider: this.jsonRpcProvider,
-                });
-                this.magicProvider = magicProvider;
-                this.relayerClient = new RelayerClient({
-                    config: this.config,
-                    jsonRpcProvider: this.jsonRpcProvider,
-                    authManager: this.authManager,
-                });
-                this.zkevmAddress = user.zkEvm.ethAddress;
-                this.eventEmitter.emit(ProviderEvent.ACCOUNTS_CHANGED, [user.zkEvm.ethAddress]);
-                return [user.zkEvm.ethAddress];
+                const user = await this.#authManager.getUserOrLogin();
+                this.#initialiseEthSigner(user);
+                if (!isZkEvmUser(user)) {
+                    const ethSigner = await this.#getSigner();
+                    const userZkEvm = await registerZkEvmUser({
+                        ethSigner,
+                        authManager: this.#authManager,
+                        multiRollupApiClients: this.#multiRollupApiClients,
+                        accessToken: user.accessToken,
+                        jsonRpcProvider: this.#jsonRpcProvider,
+                    });
+                    this.#zkEvmAddress = userZkEvm.zkEvm.ethAddress;
+                }
+                else {
+                    this.#zkEvmAddress = user.zkEvm.ethAddress;
+                }
+                this.#eventEmitter.emit(ProviderEvent.ACCOUNTS_CHANGED, [this.#zkEvmAddress]);
+                return [this.#zkEvmAddress];
             }
             case 'eth_sendTransaction': {
-                if (!this.isLoggedIn()) {
+                if (!this.#zkEvmAddress) {
                     throw new JsonRpcError(ProviderErrorCode.UNAUTHORIZED, 'Unauthorised - call eth_requestAccounts first');
                 }
+                const ethSigner = await this.#getSigner();
                 return sendTransaction$1({
                     params: request.params || [],
-                    magicProvider: this.magicProvider,
-                    guardianClient: this.guardianClient,
-                    jsonRpcProvider: this.jsonRpcProvider,
-                    relayerClient: this.relayerClient,
-                    zkevmAddress: this.zkevmAddress,
+                    ethSigner,
+                    guardianClient: this.#guardianClient,
+                    jsonRpcProvider: this.#jsonRpcProvider,
+                    relayerClient: this.#relayerClient,
+                    zkevmAddress: this.#zkEvmAddress,
                 });
             }
             case 'eth_accounts': {
-                return this.zkevmAddress ? [this.zkevmAddress] : [];
+                return this.#zkEvmAddress ? [this.#zkEvmAddress] : [];
             }
             case 'eth_signTypedData':
             case 'eth_signTypedData_v4': {
-                if (!this.isLoggedIn()) {
+                if (!this.#zkEvmAddress) {
                     throw new JsonRpcError(ProviderErrorCode.UNAUTHORIZED, 'Unauthorised - call eth_requestAccounts first');
                 }
+                const ethSigner = await this.#getSigner();
                 return signTypedDataV4({
                     method: request.method,
                     params: request.params || [],
-                    magicProvider: this.magicProvider,
-                    jsonRpcProvider: this.jsonRpcProvider,
-                    relayerClient: this.relayerClient,
-                    guardianClient: this.guardianClient,
+                    ethSigner,
+                    jsonRpcProvider: this.#jsonRpcProvider,
+                    relayerClient: this.#relayerClient,
+                    guardianClient: this.#guardianClient,
                 });
             }
             // Pass through methods
@@ -18391,17 +18421,17 @@ class ZkEvmProvider {
             case 'eth_getTransactionByHash':
             case 'eth_getTransactionReceipt':
             case 'eth_getTransactionCount': {
-                return this.jsonRpcProvider.send(request.method, request.params || []);
+                return this.#jsonRpcProvider.send(request.method, request.params || []);
             }
             default: {
                 throw new JsonRpcError(ProviderErrorCode.UNSUPPORTED_METHOD, 'Method not supported');
             }
         }
     }
-    async performJsonRpcRequest(request) {
+    async #performJsonRpcRequest(request) {
         const { id, jsonrpc } = request;
         try {
-            const result = await this.performRequest(request);
+            const result = await this.#performRequest(request);
             return {
                 id,
                 jsonrpc,
@@ -18428,7 +18458,7 @@ class ZkEvmProvider {
     }
     async request(request) {
         try {
-            return this.performRequest(request);
+            return this.#performRequest(request);
         }
         catch (error) {
             if (error instanceof JsonRpcError) {
@@ -18445,14 +18475,14 @@ class ZkEvmProvider {
             throw new Error('No callback provided');
         }
         if (Array.isArray(request)) {
-            Promise.all(request.map(this.performJsonRpcRequest)).then((result) => {
+            Promise.all(request.map(this.#performJsonRpcRequest)).then((result) => {
                 callback(null, result);
             }).catch((error) => {
                 callback(error, []);
             });
         }
         else {
-            this.performJsonRpcRequest(request).then((result) => {
+            this.#performJsonRpcRequest(request).then((result) => {
                 callback(null, result);
             }).catch((error) => {
                 callback(error, null);
@@ -18484,15 +18514,15 @@ class ZkEvmProvider {
             return this.sendAsync(request, callbackOrParams);
         }
         if (!Array.isArray(request) && typeof request === 'object') {
-            return this.performJsonRpcRequest(request);
+            return this.#performJsonRpcRequest(request);
         }
         throw new JsonRpcError(RpcErrorCode.INVALID_REQUEST, 'Invalid request');
     }
     on(event, listener) {
-        this.eventEmitter.on(event, listener);
+        this.#eventEmitter.on(event, listener);
     }
     removeListener(event, listener) {
-        this.eventEmitter.removeListener(event, listener);
+        this.#eventEmitter.removeListener(event, listener);
     }
 }
 
@@ -37454,7 +37484,7 @@ const flattenProperties = (properties) => {
 };
 
 // WARNING: DO NOT CHANGE THE STRING BELOW. IT GETS REPLACED AT BUILD TIME.
-const SDK_VERSION = '1.7.3';
+const SDK_VERSION = '1.8.0';
 const getReferrer = () => {
     if (isNode()) {
         return '';
@@ -42622,7 +42652,7 @@ const IMMUTABLE_ZKVEM_GAS_OVERRIDES = {
     maxPriorityFeePerGas: ethers.BigNumber.from(10e9),
 };
 
-const SDK_VERSION_MARKER = '1.7.3';
+const SDK_VERSION_MARKER = '1.8.0';
 // This SDK version is replaced by the `yarn build` command ran on the root level
 const globalPackageVersion = () => SDK_VERSION_MARKER;
 
@@ -46242,27 +46272,25 @@ function validateAndBuildVersion(version) {
     return validatedVersion;
 }
 
-function loadUnresolved(version) {
+// Loads the checkout widgets bundle from the CDN and appends the script to the document head
+function loadUnresolvedBundle(tag, scriptId, validVersion) {
     if (window === undefined) {
         throw new Error('missing window object: please run Checkout client side');
     }
     if (document === undefined) {
         throw new Error('missing document object: please run Checkout client side');
     }
-    const scriptId = 'immutable-checkout-widgets-bundle';
-    const validVersion = validateAndBuildVersion(version);
-    // Prevent the script to be loaded more than once
-    // by checking the presence of the script and its version.
-    const initScript = document.getElementById(scriptId);
-    if (initScript)
-        return { loaded: true, element: initScript };
-    const tag = document.createElement('script');
     let cdnUrl = `https://cdn.jsdelivr.net/npm/@imtbl/sdk@${validVersion}/dist/browser/checkout/widgets.js`;
     tag.setAttribute('id', scriptId);
     tag.setAttribute('data-version', validVersion);
     tag.setAttribute('src', cdnUrl);
     document.head.appendChild(tag);
-    return { loaded: false, element: tag };
+}
+// Gets the CDN url for the split checkout widgets bundle
+function getWidgetsEsmUrl(version) {
+    const validVersion = validateAndBuildVersion(version);
+    let cdnUrl = `https://cdn.jsdelivr.net/npm/@imtbl/sdk@${validVersion}/dist/browser/checkout/widgets-esm.js`;
+    return cdnUrl;
 }
 
 const PUBLISHABLE_KEY_PREFIX = 'pk_imapik-';
@@ -46341,7 +46369,6 @@ const SANDBOX_CONFIGURATION = {
     },
     passport: undefined,
 };
-const WIDGETS_SCRIPT_TIMEOUT = 100;
 // Checkout SDK
 class Checkout {
     readOnlyProviders;
@@ -46371,26 +46398,44 @@ class Checkout {
         const checkout = this;
         // Preload the configurations
         await checkout.config.remote.getConfig();
+        try {
+            const factory = await this.loadEsModules(init.config, init.version);
+            return factory;
+        }
+        catch (err) {
+            throw new CheckoutError('Failed to load widgets script', CheckoutErrorType.WIDGETS_SCRIPT_LOAD_ERROR, { error: err });
+        }
+    }
+    async loadUmdBundle(config, version) {
+        const checkout = this;
         const factory = new Promise((resolve, reject) => {
-            function checkForWidgetsBundleLoaded() {
-                if (typeof ImmutableCheckoutWidgets !== 'undefined') {
-                    resolve(new ImmutableCheckoutWidgets.WidgetsFactory(checkout, init.config));
-                }
-                else {
-                    // If ImmutableCheckoutWidgets is not defined, wait for set amount of time.
-                    // When time has elapsed, check again if ImmutableCheckoutWidgets is defined.
-                    // Once it's defined, the promise will resolve and setTimeout won't be called again.
-                    setTimeout(checkForWidgetsBundleLoaded, WIDGETS_SCRIPT_TIMEOUT);
-                }
-            }
             try {
-                const script = loadUnresolved(init.version);
-                if (script.loaded && typeof ImmutableCheckoutWidgets !== 'undefined') {
-                    resolve(new ImmutableCheckoutWidgets.WidgetsFactory(checkout, init.config));
-                }
-                else {
-                    checkForWidgetsBundleLoaded();
+                const scriptId = 'immutable-checkout-widgets-bundle';
+                const validVersion = validateAndBuildVersion(version);
+                // Prevent the script to be loaded more than once
+                // by checking the presence of the script and its version.
+                const initScript = document.getElementById(scriptId);
+                if (initScript) {
+                    if (typeof ImmutableCheckoutWidgets !== 'undefined') {
+                        resolve(new ImmutableCheckoutWidgets.WidgetsFactory(checkout, config));
+                    }
+                    else {
+                        reject(new CheckoutError('Failed to find ImmutableCheckoutWidgets script', CheckoutErrorType.WIDGETS_SCRIPT_LOAD_ERROR));
+                    }
                 }
+                const tag = document.createElement('script');
+                tag.addEventListener('load', () => {
+                    if (typeof ImmutableCheckoutWidgets !== 'undefined') {
+                        resolve(new ImmutableCheckoutWidgets.WidgetsFactory(checkout, config));
+                    }
+                    else {
+                        reject(new CheckoutError('Failed to find ImmutableCheckoutWidgets script', CheckoutErrorType.WIDGETS_SCRIPT_LOAD_ERROR));
+                    }
+                });
+                tag.addEventListener('error', (err) => {
+                    reject(new CheckoutError('Failed to load widgets script', CheckoutErrorType.WIDGETS_SCRIPT_LOAD_ERROR, { error: err }));
+                });
+                loadUnresolvedBundle(tag, scriptId, validVersion);
             }
             catch (err) {
                 reject(new CheckoutError('Failed to load widgets script', CheckoutErrorType.WIDGETS_SCRIPT_LOAD_ERROR, { error: err }));
@@ -46398,6 +46443,24 @@ class Checkout {
         });
         return factory;
     }
+    async loadEsModules(config, version) {
+        const checkout = this;
+        try {
+            const cdnUrl = getWidgetsEsmUrl(version);
+            // WebpackIgnore comment required to prevent webpack modifying the import statement and
+            // breaking the dynamic import in certain applications integrating checkout
+            const checkoutWidgetsModule = await import(/* webpackIgnore: true */ cdnUrl);
+            if (checkoutWidgetsModule && checkoutWidgetsModule.WidgetsFactory) {
+                return new checkoutWidgetsModule.WidgetsFactory(checkout, config);
+            }
+        }
+        catch (err) {
+            // eslint-disable-next-line no-console
+            console.warn(`Failed to resolve checkout widgets module, falling back to UMD bundle. Error: ${err.message}`);
+        }
+        // Fallback to UMD bundle if esm bundle fails to load
+        return await checkout.loadUmdBundle(config, version);
+    }
     /**
      * Creates a provider using the given parameters.
      * @param {CreateProviderParams} params - The parameters for creating the provider.

package/dist/index.d.ts

@@ -32218,7 +32218,7 @@ type CheckoutWidgetsConfig = {
 /**
  * Represents the configuration options for instantiating the Checkout Widgets factory.
  * @property {WidgetConfiguration} config - global configuration options for the widgets.
- * @property {SemanticVersion | undefined} version - version of the Checkout widgets bundle (default latest version will be used).
+ * @property {SemanticVersion | undefined} version - version of the Checkout widgets bundle(default latest version will be used).
  */
 type WidgetsInit = {
     config: WidgetConfiguration;
@@ -32242,6 +32242,8 @@ declare class Checkout {
      * @param {WidgetsInit} init - The initialisation parameters for loading the widgets bundle and applying configuration
      */
     widgets(init: WidgetsInit): Promise<ImmutableCheckoutWidgets.WidgetsFactory>;
+    private loadUmdBundle;
+    private loadEsModules;
     /**
      * Creates a provider using the given parameters.
      * @param {CreateProviderParams} params - The parameters for creating the provider.