@zonos/elements 1.3.45 → 1.3.47

package/dist/collection/components/utils/api/trackConversionEvent.js

@@ -14,7 +14,6 @@ export const trackConversionEvent = async (eventName, metadata) => {
         !window.Zonos.zonosConversionTest) {
         return;
     }
-    const url = `${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/zonos-elements/track-conversion-event`;
     const countryCode = localizationStore.selectedCountryCode;
     const organizationId = zonosStore.organizationId;
     const checkoutSessionId = cartStore.checkoutSessionId;
@@ -29,7 +28,7 @@ export const trackConversionEvent = async (eventName, metadata) => {
         metadata,
         organizationId,
     };
-    await handleFetch(url, {
+    await handleFetch('/api/zonos-elements/track-conversion-event', {
         body,
         method: 'POST',
     });

package/dist/collection/components/utils/api/triggerBuildLandedCost.js

@@ -1,4 +1,5 @@
 import { prepCalculateLandedCost } from "./prepCalculateLandedCost";
+import { MAIN_BASE_API } from "../getNextFallbackApi";
 import { handleFetch } from "../handleFetch";
 export const triggerBuildLandedCost = async (buildLandedCost) => {
     var _a, _b, _c, _d;
@@ -9,13 +10,13 @@ export const triggerBuildLandedCost = async (buildLandedCost) => {
         checkoutSessionId: data.checkoutSessionId,
         contact: data.contact,
         shippingAddress: data.shippingAddress,
-        zonosApiRoute: process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL,
+        zonosApiRoute: MAIN_BASE_API,
     });
     if (!landedCost || ((_a = landedCost.errors) === null || _a === void 0 ? void 0 : _a.length)) {
         throw new Error(`Failed to build landed cost: ${((_c = (_b = landedCost === null || landedCost === void 0 ? void 0 : landedCost.errors) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.message) || 'Unknown error'}`);
     }
     // Validate the landed cost object to make sure the returned value from buildLandedCost has a valid schema
-    const { errors, json } = await handleFetch(`${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/zonos-elements/validate-landed-cost`, {
+    const { errors, json } = await handleFetch('/api/zonos-elements/validate-landed-cost', {
         body: landedCost,
         headers: {
             'Content-Type': 'application/json',

package/dist/collection/components/utils/getNextFallbackApi.js

@@ -0,0 +1,18 @@
+const fallbackApiType = ['vercel', 'cloudflare'];
+export const MAIN_BASE_API_TYPE = fallbackApiType[0];
+export const fallbackApiList = {
+    cloudflare: process.env.NEXT_PUBLIC_ZONOS_CLOUDFLARE_URL,
+    vercel: process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL,
+};
+export const MAIN_BASE_API = fallbackApiList[MAIN_BASE_API_TYPE];
+/**
+ * Next available fallback api type
+ */
+export const getNextFallbackApiType = (currentApiType = MAIN_BASE_API_TYPE) => {
+    const currentIndex = fallbackApiType.indexOf(currentApiType);
+    const nextFallbackApiType = fallbackApiType[currentIndex + 1];
+    if (!nextFallbackApiType) {
+        return null;
+    }
+    return nextFallbackApiType;
+};

package/dist/collection/components/utils/handleFetch.js

@@ -10,6 +10,10 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+import { fallbackApiList, getNextFallbackApiType, MAIN_BASE_API_TYPE, } from "./getNextFallbackApi";
+import { jsonParse } from "./jsonParse";
+import { log } from "./logging/log";
+import { sendErrorLog } from "./logging/sendErrorLog";
 const getResponseBody = async ({ response, shouldLog = true, shouldThrow = false, }) => {
     try {
         const json = await response.json();
@@ -26,14 +30,36 @@ const getResponseBody = async ({ response, shouldLog = true, shouldThrow = false
         return null;
     }
 };
-const handleRequest = async (url, options) => {
+const encodeString = (text) => {
+    try {
+        // encode the string, remove the "=" at the end of the encoded string
+        const encodedString = btoa(text).replace(/=/g, '');
+        return encodedString;
+    }
+    catch (error) {
+        // return the reverse string if the encoding failed
+        return text
+            .replace(/[^A-Za-z0-9]/g, '')
+            .split('')
+            .reverse()
+            .join('');
+    }
+};
+const handleRequest = async ({ basePathType, options, path, }) => {
     let response;
+    // fallback to the main base API if the passed in base path is not available
+    const baseUrl = fallbackApiList[basePathType] || MAIN_BASE_API_TYPE;
+    const url = baseUrl + path;
+    // adding random encoded token to the url so that the request will be cached differently for each store
+    const modifiedUrl = new URL(url);
+    modifiedUrl.searchParams.set('zToken', encodeString(window.location.hostname));
     try {
-        response = await fetch(url, options);
+        response = await fetch(modifiedUrl.toString(), options);
     }
     catch (e) {
         if (e instanceof Error) {
             return {
+                baseUrl,
                 errors: [{ message: e.message, type: 'unknown' }],
                 json: null,
                 response: null,
@@ -42,6 +68,7 @@ const handleRequest = async (url, options) => {
         }
         const message = 'Fail to fetch';
         return {
+            baseUrl,
             errors: [{ message, type: 'unknown' }],
             json: null,
             response: null,
@@ -57,6 +84,7 @@ const handleRequest = async (url, options) => {
     if (response.ok) {
         const data = await getResponseBody({ response });
         return {
+            baseUrl,
             errors: [],
             json: data,
             response,
@@ -71,6 +99,7 @@ const handleRequest = async (url, options) => {
         });
         const message = JSON.stringify(data);
         return {
+            baseUrl,
             errors: [{ message, type: status }],
             json: null,
             response,
@@ -80,6 +109,7 @@ const handleRequest = async (url, options) => {
     catch (e) {
         const message = 'Unknown error';
         return {
+            baseUrl,
             errors: [{ message: `${status}: ${message}`, type: status }],
             json: null,
             response: null,
@@ -87,31 +117,65 @@ const handleRequest = async (url, options) => {
         };
     }
 };
-function encodeString(text) {
-    try {
-        // encode the string, remove the "=" at the end of the encoded string
-        const encodedString = btoa(text).replace(/=/g, '');
-        return encodedString;
+const handleRequestWithFallback = async ({ basePathType, options, path, }) => {
+    var _a, _b;
+    const _c = await handleRequest({
+        basePathType,
+        options,
+        path,
+    }), { errors, response } = _c, rest = __rest(_c, ["errors", "response"]);
+    const nextFallbackApiType = getNextFallbackApiType(basePathType);
+    const unknownError = errors.find(({ type }) => type === 'unknown');
+    const isUnknownError = !!unknownError || (response === null || response === void 0 ? void 0 : response.status) === 404;
+    const shouldCallFallback = 
+    // If next fallback is available, and the error is unknown (fail to fetch) or 404
+    nextFallbackApiType && isUnknownError;
+    // Should log the error if it's unknown error
+    if (isUnknownError) {
+        void sendErrorLog({
+            endpoint: fallbackApiList[basePathType] + path,
+            errors: errors.map(({ message }) => message),
+            metadata: {
+                currentBasePath: basePathType,
+                nextFallbackApiType,
+                requestHeaders: options === null || options === void 0 ? void 0 : options.headers,
+                requestPayload: jsonParse((_a = options === null || options === void 0 ? void 0 : options.body) === null || _a === void 0 ? void 0 : _a.toString()) || ((_b = options === null || options === void 0 ? void 0 : options.body) === null || _b === void 0 ? void 0 : _b.toString()),
+                status: response === null || response === void 0 ? void 0 : response.status,
+                statusText: response === null || response === void 0 ? void 0 : response.statusText,
+            },
+            // When the error is unknown, error reporting should be enabled for period of time after release, so we can monitor the error. We should always report error for the last fallback API fails
+            shouldPostReleaseErrorReporting: !!nextFallbackApiType,
+        });
     }
-    catch (error) {
-        // return the reverse string if the encoding failed
-        return text
-            .replace(/[^A-Za-z0-9]/g, '')
-            .split('')
-            .reverse()
-            .join('');
+    if (shouldCallFallback) {
+        log(`=== "${path}" failed to fetch, trying next fallback ${nextFallbackApiType}`);
+        return handleRequestWithFallback({
+            basePathType: nextFallbackApiType,
+            options,
+            path,
+        });
     }
-}
-export const handleFetch = async (url, _opts) => {
+    // No more fallbacks, just return the result
+    return Object.assign({ errors, response }, rest);
+};
+/**
+ * Fetch request and will request to fallback API when the first one fails
+ * @param path Path name of the request (e.g. /api/something/com).
+ * @param _opts fetch options
+ */
+export const handleFetch = async (path, _opts) => {
     const opts = __rest(_opts || {}, []);
     const body = opts.body ? JSON.stringify(opts.body) : undefined;
     const method = opts.method || 'GET';
-    // adding random encoded token to the url so that the request will be cached differently for each store
-    const modifiedUrl = new URL(url);
-    modifiedUrl.searchParams.set('zToken', encodeString(window.location.hostname));
     // headers content type
     const headers = Object.assign({ 'Content-Type': 'application/json', 'Zonos-Is-BigCommerce': window.Zonos.isBigCommerce.toString(), 'Zonos-Referer': window.location.hostname, 'Zonos-Version': window.Zonos.version, credentialtoken: window.Zonos.zonosApiKey || 'Empty credential token from zonos-elements' }, opts.headers);
     const options = Object.assign(Object.assign({}, opts), { body: method === 'GET' ? undefined : body, headers,
         method });
-    return handleRequest(modifiedUrl.toString(), options);
+    // This is for testing fallback API, set fallback API type to start with
+    const useFallbackApi = new URLSearchParams(window.location.search).get('useFallbackApi');
+    return handleRequestWithFallback({
+        basePathType: useFallbackApi || MAIN_BASE_API_TYPE,
+        options,
+        path,
+    });
 };

package/dist/collection/components/utils/logging/sendErrorLog.js

@@ -1,5 +1,18 @@
-import { handleFetch } from "../handleFetch";
-export const sendErrorLog = async ({ endpoint, errors, metadata }) => {
+import { fallbackApiList, getNextFallbackApiType, MAIN_BASE_API, } from "../getNextFallbackApi";
+/**
+ * This is the time in milliseconds after release time that we will start sending error logs to the new API
+ * @default 1 hour
+ */
+const postReleaseReportingDuration = 1 * 3600 * 1000; // 1 hour
+export const sendErrorLog = async ({ endpoint, errors, metadata, shouldPostReleaseErrorReporting, }) => {
+    if (shouldPostReleaseErrorReporting) {
+        // We only want to report errors that happened if current time is less than 2 hours after release time
+        const releaseTime = Number(window.Zonos.releaseDate);
+        const currentTime = new Date().getTime();
+        if (currentTime - releaseTime > postReleaseReportingDuration) {
+            return;
+        }
+    }
     const userAgentData = 'userAgentData' in window.navigator
         ? // userAgentData is not yet supported in all browsers
             window.navigator.userAgentData
@@ -11,8 +24,22 @@ export const sendErrorLog = async ({ endpoint, errors, metadata }) => {
                 ? userAgentData
                 : window.navigator.userAgent }, metadata),
     };
-    void handleFetch(`${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/zonos-elements/log-error`, {
-        body: errorObject,
-        method: 'POST',
-    });
+    try {
+        // use native fetch because in handleFetch also calls sendErrorLog and it will possibly cause circular dependencies issue
+        void fetch(`${MAIN_BASE_API}/api/zonos-elements/log-error`, {
+            body: JSON.stringify(errorObject),
+            method: 'POST',
+        });
+    }
+    catch (_err) {
+        const nextFallbackApi = getNextFallbackApiType();
+        if (!nextFallbackApi) {
+            return;
+        }
+        // request to the fallback API if the first one fails
+        void fetch(`${fallbackApiList[nextFallbackApi]}/api/zonos-elements/log-error`, {
+            body: JSON.stringify(errorObject),
+            method: 'POST',
+        });
+    }
 };

package/dist/collection/components/utils/logging/sendLoadScriptLog.js

@@ -14,7 +14,7 @@ export const sendLoadScriptLog = async (params) => {
     const scriptLoadLogBody = Object.assign(Object.assign({ href: window.location.href }, params), { metadata: Object.assign({ connectionDownlink: baseConnection === null || baseConnection === void 0 ? void 0 : baseConnection.downlink, connectionEffectiveType: baseConnection === null || baseConnection === void 0 ? void 0 : baseConnection.effectiveType, connectionRtt: baseConnection === null || baseConnection === void 0 ? void 0 : baseConnection.rtt, connectionSaveData: baseConnection === null || baseConnection === void 0 ? void 0 : baseConnection.saveData, userAgent: userAgentData && userAgentData.brands.length > 0
                 ? userAgentData
                 : window.navigator.userAgent }, params.metadata) });
-    void handleFetch(`${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/zonos-elements/log-script-load`, {
+    void handleFetch('/api/zonos-elements/log-script-load', {
         body: scriptLoadLogBody,
         method: 'POST',
     });

package/dist/collection/environment.js

@@ -5,7 +5,10 @@ import { config } from "dotenv";
 import { z } from "zod";
 // rollup and ts somehow can't compile this with absolute path
 // eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
-import { generateVercelDeployUrl } from "./utils/generateVercelDeployUrl";
+import { formattedCloudflareApiUrl } from "./utils/formattedCloudflareApiUrl";
+// rollup and ts somehow can't compile this with absolute path
+// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
+import { formattedUrl } from "./utils/formattedUrl";
 export const isClientSide = typeof window !== 'undefined';
 export const inProdEnvironment = process.env.NODE_ENV === 'production';
 export const inTestEnvironment = process.env.NODE_ENV === 'test';
@@ -26,83 +29,6 @@ const UNPKG_ZONOS_URL = `https://unpkg.com/@zonos/elements@${packageVersion}`;
  */
 const CDNJS_ZONOS_URL = `https://cdnjs.cloudflare.com/ajax/libs/zonos-elements/${packageVersion}`;
 const currentBranch = process.env.VERCEL_GIT_COMMIT_REF || process.env.BRANCH_NAME;
-export const formattedUrl = ({ branchName, inCI: _inCI, inVercel: _inVercel, isVercelPreview: _isVercelPreview, packageVersion: _packageVersion, type = 'full', url, }) => {
-    if (!url) {
-        // return origin value so t3 can throw error when it's empty
-        return url;
-    }
-    const trimmedUrl = (_url) => _url === null || _url === void 0 ? void 0 : _url.replace('https://', '');
-    const domainOnlyUrl = trimmedUrl(url);
-    if (!_inCI && !_inVercel) {
-        // local host environment, no need to format url
-        return `https://${domainOnlyUrl}`;
-    }
-    const isProdBranch = branchName && ['main'].includes(branchName);
-    const isServerless = 
-    // url: route.js.zonos.com
-    domainOnlyUrl.includes('route.js') ||
-        // url: zonos-elements-serverless-git-something
-        domainOnlyUrl.includes('serverless-git');
-    const isTest = 
-    // url: test.js.zonos.com
-    domainOnlyUrl.includes('test.') ||
-        // url: zonos-elements-test-git-something
-        domainOnlyUrl.includes('test-git') ||
-        // url: something.preview.js.zonos.com (this is only applicable on preview deployment of `zonos-elements` and `zonos-elements-test`)
-        domainOnlyUrl.includes('preview.js.zonos.com');
-    if (isTest && isProdBranch) {
-        return `https://${domainOnlyUrl}`;
-    }
-    // always use vercel url if in vercel env, non-production branch (not qa or main branch) or the domain using is a test url
-    if ((_isVercelPreview && !isProdBranch) ||
-        isTest ||
-        (_inVercel && type === 'vercel-git')) {
-        // use vercel branch_url instead of the production url
-        if (!branchName) {
-            throw new Error('Fail to get vercel commit ref or branch name');
-        }
-        // get project name based on the `${url}`
-        const isStorybook = 
-        // url: storybook.js.zonos.com
-        domainOnlyUrl.includes('storybook.js') ||
-            // url: zonos-elements-storybook-git-something
-            domainOnlyUrl.includes('storybook-git');
-        const projectName = isStorybook
-            ? 'zonos-elements-storybook'
-            : isServerless
-                ? 'zonos-elements-serverless'
-                : 'zonos-elements';
-        // add -test suffix for test environment
-        const fullProjectName = isTest ? `${projectName}-test` : projectName;
-        // generate generated deploy url based on the branch name
-        const vercelGitBranchSuffix = generateVercelDeployUrl({
-            branchName,
-            projectName: fullProjectName,
-        });
-        return `https://${vercelGitBranchSuffix}`;
-    }
-    // only require package version in production and in CI, so that we still can use dev url (no version prefix).
-    if (!_packageVersion && (isProdBranch || _inCI)) {
-        throw new Error('package version is required');
-    }
-    const version = type === 'major' ? `${_packageVersion === null || _packageVersion === void 0 ? void 0 : _packageVersion.split('.')[0]}` : _packageVersion;
-    const isVersionedUrl = domainOnlyUrl === null || domainOnlyUrl === void 0 ? void 0 : domainOnlyUrl.startsWith('v');
-    const shouldAddVersion = (isProdBranch || _inCI) && !isVersionedUrl;
-    /**
-     * Trimming the `qa` from the domain url only when we add version prefix
-     * @reason We've now introduced alpha versioning for the QA branch deployment.
-     * However, we've generated the domain as `v1.2.4-alpha.1.js.zonos.com`, while the
-     * current CDN URL env uses `qa.js.zonos.com` on qa branch. This discrepancy causes
-     * this function to return an invalid alpha domain (v1.2.4-alpha.1.qa.js.zonos.com).
-     */
-    const trimmedQaUrl = shouldAddVersion
-        ? domainOnlyUrl === null || domainOnlyUrl === void 0 ? void 0 : domainOnlyUrl.replace('qa.js.zonos.com', 'js.zonos.com')
-        : domainOnlyUrl;
-    // only set version for the url once
-    return shouldAddVersion
-        ? `https://v${version}.${trimmedQaUrl}`
-        : `https://${trimmedQaUrl}`;
-};
 if (typeof window === 'undefined') {
     // storybook can't access to any "node" modules
     config();
@@ -124,9 +50,11 @@ else {
 }
 const envClient = {
     NEXT_PUBLIC_FLAG_URL: z.string(),
+    NEXT_PUBLIC_RELEASE_DATE: z.string(),
     NEXT_PUBLIC_ZONOS_API_KEY: z.string(),
     NEXT_PUBLIC_ZONOS_CDNJS_CDN_URL: z.string(),
     NEXT_PUBLIC_ZONOS_CDN_URL: z.string(),
+    NEXT_PUBLIC_ZONOS_CLOUDFLARE_URL: z.string(),
     NEXT_PUBLIC_ZONOS_JS_DELIVR_CDN_URL: z.string(),
     NEXT_PUBLIC_ZONOS_PACKAGE_VERSION: z.string(),
     NEXT_PUBLIC_ZONOS_ROUTE_URL: z.string(),
@@ -149,6 +77,7 @@ export const env = createEnv({
     // eslint-disable-next-line sort-keys/sort-keys-fix
     runtimeEnvStrict: {
         NEXT_PUBLIC_FLAG_URL: process.env.NEXT_PUBLIC_FLAG_URL,
+        NEXT_PUBLIC_RELEASE_DATE: new Date().getTime().toString(),
         NEXT_PUBLIC_ZONOS_API_KEY: process.env.NEXT_PUBLIC_ZONOS_API_KEY,
         NEXT_PUBLIC_ZONOS_CDNJS_CDN_URL: CDNJS_ZONOS_URL,
         /**
@@ -164,6 +93,14 @@ export const env = createEnv({
             type: 'full',
             url: process.env.NEXT_PUBLIC_ZONOS_CDN_URL,
         }),
+        NEXT_PUBLIC_ZONOS_CLOUDFLARE_URL: formattedCloudflareApiUrl({
+            branchName: currentBranch,
+            inCI,
+            inVercel,
+            isVercelPreview,
+            projectName: 'zonos-elements',
+            url: process.env.NEXT_PUBLIC_ZONOS_CLOUDFLARE_URL,
+        }),
         NEXT_PUBLIC_ZONOS_JS_DELIVR_CDN_URL: JS_DELIVR_ZONOS_URL,
         NEXT_PUBLIC_ZONOS_PACKAGE_VERSION: packageVersion,
         /**

package/dist/collection/scripts/_getZonosQaUrl.js

@@ -16,11 +16,15 @@ export const getZonosQaUrl = () => {
     const qaUrl = extractZonosQaUrl(window.location.href);
     const cdnUrl = process.env.NEXT_PUBLIC_ZONOS_CDN_URL;
     // when the qaUrl is not set and the built URL is from the test domain, use the test domain for testing
-    if (!qaUrl && cdnUrl.includes('test.')) {
+    if (!qaUrl &&
+        (cdnUrl.includes('test.') ||
+            // Vercel git domain
+            cdnUrl.includes('test-'))) {
         return cdnUrl;
     }
     // when local demo app is running, it needs to use the local dev script unless the qaUrl is set
-    if (!qaUrl && window.location.hostname === 'dev.demo.elements.zonos.com') {
+    if (!qaUrl &&
+        ['dev.demo.elements.zonos.com'].includes(window.location.hostname)) {
         return 'https://dev.elements.zonos.com';
     }
     if (!qaUrl) {

package/dist/collection/scripts/_zonosBase.js

@@ -40,6 +40,7 @@ Zonos.zonosConversionTest = typeof window !== 'undefined' &&
     !!window.location.search.match(/\?.*(&*)zonosConversionTest/);
 Zonos._paypalMockResponse = null;
 Zonos.isBigCommerce = false;
+Zonos.releaseDate = process.env.NEXT_PUBLIC_RELEASE_DATE;
 /**
  * By default, the package will load from npm
  */

package/dist/collection/utils/formattedCloudflareApiUrl.js

@@ -0,0 +1,43 @@
+// rollup and ts somehow can't compile this with absolute path
+// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
+import { generateCloudflareDeployUrl } from "./generateCloudflareDeployUrl";
+/**
+ * This is to generate cloudflare url based on the environment. This won't
+ * - Get the cloudflare alias to build if the environment is Preview
+ * - Get the cloudflare production url (not preview alias) if it's production
+ * @note
+ * This is mainly used for get correct Cloudflare API to be used in scripts
+ * @note
+ * "url" is the API url in Cloudflare
+ * @returns
+ * - `https://<branch_name>.<project_name>.pages.dev` if is Preview
+ * - `https://route.elements.zonos.com` if is Production
+ */
+export const formattedCloudflareApiUrl = ({ branchName, inCI: _inCI, inVercel: _inVercel, isVercelPreview: _isVercelPreview, projectName, url, }) => {
+    if (!url) {
+        // return origin value so t3 can throw error when it's empty
+        return url;
+    }
+    const trimmedUrl = (_url) => _url === null || _url === void 0 ? void 0 : _url.replace('https://', '');
+    const domainOnlyUrl = trimmedUrl(url);
+    if (!_inCI && !_inVercel) {
+        // local host environment, no need to format url
+        return `https://${domainOnlyUrl}`;
+    }
+    const isProdBranch = branchName && ['main'].includes(branchName);
+    // always use Cloudflare preview alias if in not production environment
+    if (_isVercelPreview && !isProdBranch) {
+        // use Cloudflare branch_url instead of the production url
+        if (!branchName) {
+            throw new Error('Fail to get Cloudflare commit ref or branch name');
+        }
+        // generate generated deploy url based on the branch name
+        const cloudflareUrl = generateCloudflareDeployUrl({
+            branchName,
+            projectName,
+        });
+        return `https://${cloudflareUrl}`;
+    }
+    // use cloudflare production url
+    return `https://${domainOnlyUrl}`;
+};

package/dist/collection/utils/formattedUrl.js

@@ -0,0 +1,80 @@
+// rollup and ts somehow can't compile this with absolute path
+// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths
+import { generateVercelDeployUrl } from "./generateVercelDeployUrl";
+export const formattedUrl = ({ branchName, inCI: _inCI, inVercel: _inVercel, isVercelPreview: _isVercelPreview, packageVersion: _packageVersion, type = 'full', url, }) => {
+    if (!url) {
+        // return origin value so t3 can throw error when it's empty
+        return url;
+    }
+    const trimmedUrl = (_url) => _url === null || _url === void 0 ? void 0 : _url.replace('https://', '');
+    const domainOnlyUrl = trimmedUrl(url);
+    if (!_inCI && !_inVercel) {
+        // local host environment, no need to format url
+        return `https://${domainOnlyUrl}`;
+    }
+    const isProdBranch = branchName && ['main'].includes(branchName);
+    const isServerless = 
+    // url: route.js.zonos.com
+    domainOnlyUrl.includes('route.js') ||
+        // url: zonos-elements-serverless-git-something
+        domainOnlyUrl.includes('serverless-git');
+    const isTest = 
+    // url: test.js.zonos.com
+    domainOnlyUrl.includes('test.') ||
+        // url: zonos-elements-test-git-something
+        domainOnlyUrl.includes('test-git') ||
+        // url: something.preview.js.zonos.com (this is only applicable on preview deployment of `zonos-elements` and `zonos-elements-test`)
+        domainOnlyUrl.includes('preview.js.zonos.com');
+    if (isTest && isProdBranch) {
+        return `https://${domainOnlyUrl}`;
+    }
+    // always use vercel url if in vercel env, non-production branch (not qa or main branch) or the domain using is a test url
+    if ((_isVercelPreview && !isProdBranch) ||
+        isTest ||
+        (_inVercel && type === 'vercel-git')) {
+        // use vercel branch_url instead of the production url
+        if (!branchName) {
+            throw new Error('Fail to get vercel commit ref or branch name');
+        }
+        // get project name based on the `${url}`
+        const isStorybook = 
+        // url: storybook.js.zonos.com
+        domainOnlyUrl.includes('storybook.js') ||
+            // url: zonos-elements-storybook-git-something
+            domainOnlyUrl.includes('storybook-git');
+        const projectName = isStorybook
+            ? 'zonos-elements-storybook'
+            : isServerless
+                ? 'zonos-elements-serverless'
+                : 'zonos-elements';
+        // add -test suffix for test environment
+        const fullProjectName = isTest ? `${projectName}-test` : projectName;
+        // generate generated deploy url based on the branch name
+        const vercelGitBranchSuffix = generateVercelDeployUrl({
+            branchName,
+            projectName: fullProjectName,
+        });
+        return `https://${vercelGitBranchSuffix}`;
+    }
+    // only require package version in production and in CI, so that we still can use dev url (no version prefix).
+    if (!_packageVersion && (isProdBranch || _inCI)) {
+        throw new Error('package version is required');
+    }
+    const version = type === 'major' ? `${_packageVersion === null || _packageVersion === void 0 ? void 0 : _packageVersion.split('.')[0]}` : _packageVersion;
+    const isVersionedUrl = domainOnlyUrl === null || domainOnlyUrl === void 0 ? void 0 : domainOnlyUrl.startsWith('v');
+    const shouldAddVersion = (isProdBranch || _inCI) && !isVersionedUrl;
+    /**
+     * Trimming the `qa` from the domain url only when we add version prefix
+     * @reason We've now introduced alpha versioning for the QA branch deployment.
+     * However, we've generated the domain as `v1.2.4-alpha.1.js.zonos.com`, while the
+     * current CDN URL env uses `qa.js.zonos.com` on qa branch. This discrepancy causes
+     * this function to return an invalid alpha domain (v1.2.4-alpha.1.qa.js.zonos.com).
+     */
+    const trimmedQaUrl = shouldAddVersion
+        ? domainOnlyUrl === null || domainOnlyUrl === void 0 ? void 0 : domainOnlyUrl.replace('qa.js.zonos.com', 'js.zonos.com')
+        : domainOnlyUrl;
+    // only set version for the url once
+    return shouldAddVersion
+        ? `https://v${version}.${trimmedQaUrl}`
+        : `https://${trimmedQaUrl}`;
+};

package/dist/collection/utils/generateCloudflareDeployUrl.js

@@ -0,0 +1,21 @@
+/**
+ * Generate a Cloudflare deploy URL based on the branch name and project name
+ * @note not including https://
+ * @return {url} string
+ * @urlExample build-cloudflare-2.zonos-elements.page.dev
+ */
+export const generateCloudflareDeployUrl = ({ branchName, projectName, }) => {
+    const normalizedProjectName = projectName.toLowerCase().replace(/\s+/g, '-');
+    // remove dots and replace non-alphanumeric characters with dashes
+    const normalizedBranchName = branchName
+        .toLowerCase()
+        .replace(/\./g, '-') // Replace periods with hyphens
+        .replace(/\//g, '-') // Replace slashes with hyphens
+        .replace(/[^a-z0-9-_]/g, '') // Remove any characters that aren't alphanumeric, hyphens, or underscores
+        .replace(/-+/g, '-') // Collapse multiple hyphens into a single hyphen
+        .replace(/^-+|-+$/g, ''); // Trim hyphens from start and end
+    if (!normalizedProjectName || !normalizedBranchName) {
+        return null;
+    }
+    return `${normalizedBranchName}.${normalizedProjectName}.pages.dev`;
+};