@basis-theory/web-elements 1.13.0 → 1.14.0

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+## [1.14.0] - 2025-06-03
+
+### Features
+
+- b3f5c0c 2025-06-03 feat: add custom iframe title (#431) by kevin@basistheory.com
+- f458627 2025-05-29 feat: detect when network issues prevent elements from loading (#429) by kevin@basistheory.com
+- 7c49687 2025-05-29 feat(card element): add support for autocomplete (#428) by kevin@basistheory.com
+
+### Bug Fixes
+
+- 0fa1fc1 2025-05-30 fix: improve net check for mobile devices on slow networks (#430) by kevin@basistheory.com
+
+## [1.13.1] - 2025-05-27
+
+### Bug Fixes
+
+- 99b9550 2025-05-26 fix: surface validate in all elements (#427) by kevin@basistheory.com
+- 2d77b78 2025-05-26 fix: re-export card types (#426) by kevin@basistheory.com
+
 ## [1.13.0] - 2025-05-13
 
 ### Features

package/dist/bundle/index.js

@@ -1 +1 @@
-!function(){function e(e,r,n,t,o,i,l){try{var s=e[i](l),c=s.value}catch(e){n(e);return}s.done?r(c):Promise.resolve(c).then(t,o)}function r(r){return function(){var n=this,t=arguments;return new Promise(function(o,i){var l=r.apply(n,t);function s(r){e(l,o,i,s,c,"next",r)}function c(r){e(l,o,i,s,c,"throw",r)}s(void 0)})}}function n(e,r){var n,t,o,i,l={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return i={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function s(i){return function(s){var c=[i,s];if(n)throw TypeError("Generator is already executing.");for(;l;)try{if(n=1,t&&(o=2&c[0]?t.return:c[0]?t.throw||((o=t.return)&&o.call(t),0):t.next)&&!(o=o.call(t,c[1])).done)return o;switch(t=0,o&&(c=[2&c[0],o.value]),c[0]){case 0:case 1:o=c;break;case 4:return l.label++,{value:c[1],done:!1};case 5:l.label++,t=c[1],c=[0];continue;case 7:c=l.ops.pop(),l.trys.pop();continue;default:if(!(o=(o=l.trys).length>0&&o[o.length-1])&&(6===c[0]||2===c[0])){l=0;continue}if(3===c[0]&&(!o||c[1]>o[0]&&c[1]<o[3])){l.label=c[1];break}if(6===c[0]&&l.label<o[1]){l.label=o[1],o=c;break}if(o&&l.label<o[2]){l.label=o[2],l.ops.push(c);break}o[2]&&l.ops.pop(),l.trys.pop();continue}c=r.call(e,l)}catch(e){c=[6,e],t=0}finally{n=o=0}if(5&c[0])throw c[1];return{value:c[0]?c[1]:void 0,done:!0}}}}var t,o,i,l,s,c,a,u=(l=r(function(e,r){var t,l,s,c,a,u,d,f=arguments;return n(this,function(n){switch(n.label){case 0:if(t=f.length>2&&void 0!==f[2]?f[2]:{},o)return[2];d=function(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},t=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),t.forEach(function(r){var t;t=n[r],r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t})}return e}({level:r,message:e,service:"web-elements-loader",env:u=!i||(null==i?void 0:i.includes("localhost"))?"local":i.includes("dev")?"dev":"prod",referrer:null===(l=document)||void 0===l?void 0:l.referrer,origin:null===(s=window)||void 0===s?void 0:s.location.origin,url:null===(c=window)||void 0===c?void 0:c.location.href,userAgent:null===(a=navigator)||void 0===a?void 0:a.userAgent},t),["local","dev"].includes(u)&&console.log(d),n.label=1;case 1:return n.trys.push([1,3,,4]),[4,fetch("https://http-intake.logs.datadoghq.com/v1/input/".concat("pubb96b84a13912504f4354f2d794ea4fab"),{method:"POST",body:JSON.stringify(d),headers:{"Content-Type":"application/json"}})];case 2:return n.sent(),[3,4];case 3:return n.sent(),console.warn("There was an error sending telemetry."),[3,4];case 4:return[2]}})}),s=function(e,r){return l.apply(this,arguments)},{disableTelemetry:function(e){o=e},setBaseUrl:function(e){i=e},log:{error:function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(e,"error",r)},info:function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(e,"info",r)},warn:function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(e,"warn",r)}}}),d=function(e){var r=document.querySelector('script[src^="'.concat(e,'"]'));if(r)return r;var n=document.head||document.body;if(!n)throw Error("No <head> or <body> elements found in the document.");var t=Object.assign(document.createElement("script"),{src:e});return n.append(t),t},f="Tried to load BasisTheoryElements in a non-DOM environment.",h="Unable to load the Elements script. This may be due to network restrictions or browser extensions like ad blockers interfering with script loading. Check browser settings or network connection and try again.",p=function(e,t){return new Promise(function(o,i){var l,s=d(e),c=!1;s.addEventListener("load",function(){window.BasisTheoryElements?o(window.BasisTheoryElements):(r(function(){return n(this,function(e){switch(e.label){case 0:return[4,u.log.error("Elements not found on window on load",{logType:"elementsNotFoundOnWindow",logOrigin:"loadScript",retryCount:t})];case 1:return e.sent(),[2]}})})(),i(Error("Basis Theory Elements did not load properly. Check network tab for more details.")))}),s.addEventListener("error",(l=r(function(r){var l,a,d;return n(this,function(n){switch(n.label){case 0:if(c)return[2];return c=!0,[4,u.log.error("Elements script onError event",{logType:"elementsScriptOnError",logOrigin:"loadScript",retryCount:t,event:{message:null==r?void 0:r.message,source:null==r?void 0:r.filename,lineno:null==r?void 0:r.lineno,colno:null==r?void 0:r.colno,error:null==r?void 0:r.error,target:null==r?void 0:r.target}})];case 1:n.sent(),n.label=2;case 2:return n.trys.push([2,3,,5]),null==s||s.remove(),[3,5];case 3:return l=n.sent(),[4,u.log.error("Error removing script from DOM on retry attempt ".concat(t),{logType:"scriptRemovalError",logOrigin:"loadScript",retryCount:t,removalError:l})];case 4:return n.sent(),[3,5];case 5:if(0===t)return p(e,t+1).then(o).catch(i),[2];n.label=6;case 6:return n.trys.push([6,12,,14]),[4,fetch(e)];case 7:if((a=n.sent()).ok)return[3,9];return[4,u.log.error("Second attempt to load elements script failed, fetch failed with status: ".concat(a.status,"."),{logType:"elementsScriptFetchFailure",logOrigin:"loadScript",retryCount:t,fetchResult:"error",fetchResponse:a})];case 8:return n.sent(),i(Error(f)),[3,11];case 9:return[4,u.log.error("Second attempt to load elements script failed, fetch success",{logType:"elementsScriptFetchFailure",logOrigin:"loadScript",retryCount:t,fetchResult:"success",fetchResponse:a})];case 10:n.sent(),i(Error(h)),n.label=11;case 11:return[3,14];case 12:return d=n.sent(),[4,u.log.error("Second attempt failed to load elements script failed, fetch network error.",{logType:"elementsScriptFetchError",logOrigin:"loadScript",retryCount:t,fetchResult:"error",fetchError:d})];case 13:return n.sent(),i(Error(h)),[3,14];case 14:return i((null==r?void 0:r.error)||(null==r?void 0:r.message)||Error(h)),[2]}})}),function(e){return l.apply(this,arguments)}))})},v={};v={version:"1.13.0"};var m=(c=r(function(e,o){var i,l,s,c;return n(this,function(a){switch(a.label){case 0:var d;if(!e||0===e.length)throw Error("API key is required");return i=(null==o?void 0:o._devMode)?"js.flock-dev.com":"js.basistheory.com",u.setBaseUrl(i),u.disableTelemetry(!!(null==o?void 0:o.disableTelemetry)),[4,(d="https://".concat(i,"/web-elements/").concat(v.version,"/client/index.js"),t||(t=new Promise(function(e,t){var o;if(("undefined"==typeof window?"undefined":(o=window)&&"undefined"!=typeof Symbol&&o.constructor===Symbol?"symbol":typeof o)!="object"){r(function(){return n(this,function(e){switch(e.label){case 0:return[4,u.log.warn(f,{logType:"elementsNonDomError",logOrigin:"loadElements"})];case 1:return e.sent(),t(Error(f)),[2]}})})();return}if(window.BasisTheoryElements){e(window.BasisTheoryElements);return}p(new URL(d).toString().replace(RegExp("\\/$","u"),""),0).then(e).catch(function(e){t(e)})})),t)];case 1:return[2,a.sent().init(e,"https://".concat(i,"/web-elements/").concat(v.version,"/hosted-elements/"),!1,null===(l=null==o?void 0:o.useSameOriginApi)||void 0===l||l,null!==(s=null==o?void 0:o.disableTelemetry)&&void 0!==s&&s,null!==(c=null==o?void 0:o.debug)&&void 0!==c&&c)]}})}),function(e,r){return c.apply(this,arguments)}),y=((a=y||{}).DECIMAL="decimal",a.EMAIL="email",a.NONE="none",a.NUMERIC="numeric",a.SEARCH="search",a.TEL="tel",a.TEXT="text",a.URL="url",a);"undefined"!=typeof window&&document.currentScript&&!window.basistheory&&(window.basistheory=m)}();
+!function(){function e(e,r,n,t,o,i,l){try{var s=e[i](l),c=s.value}catch(e){n(e);return}s.done?r(c):Promise.resolve(c).then(t,o)}function r(r){return function(){var n=this,t=arguments;return new Promise(function(o,i){var l=r.apply(n,t);function s(r){e(l,o,i,s,c,"next",r)}function c(r){e(l,o,i,s,c,"throw",r)}s(void 0)})}}function n(e,r){var n,t,o,i,l={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return i={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function s(i){return function(s){var c=[i,s];if(n)throw TypeError("Generator is already executing.");for(;l;)try{if(n=1,t&&(o=2&c[0]?t.return:c[0]?t.throw||((o=t.return)&&o.call(t),0):t.next)&&!(o=o.call(t,c[1])).done)return o;switch(t=0,o&&(c=[2&c[0],o.value]),c[0]){case 0:case 1:o=c;break;case 4:return l.label++,{value:c[1],done:!1};case 5:l.label++,t=c[1],c=[0];continue;case 7:c=l.ops.pop(),l.trys.pop();continue;default:if(!(o=(o=l.trys).length>0&&o[o.length-1])&&(6===c[0]||2===c[0])){l=0;continue}if(3===c[0]&&(!o||c[1]>o[0]&&c[1]<o[3])){l.label=c[1];break}if(6===c[0]&&l.label<o[1]){l.label=o[1],o=c;break}if(o&&l.label<o[2]){l.label=o[2],l.ops.push(c);break}o[2]&&l.ops.pop(),l.trys.pop();continue}c=r.call(e,l)}catch(e){c=[6,e],t=0}finally{n=o=0}if(5&c[0])throw c[1];return{value:c[0]?c[1]:void 0,done:!0}}}}var t,o,i,l,s,c,a,u=(l=r(function(e,r){var t,l,s,c,a,u,d,f=arguments;return n(this,function(n){switch(n.label){case 0:if(t=f.length>2&&void 0!==f[2]?f[2]:{},o)return[2];d=function(e){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{},t=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(n).filter(function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),t.forEach(function(r){var t;t=n[r],r in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t})}return e}({level:r,message:e,service:"web-elements-loader",env:u=!i||(null==i?void 0:i.includes("localhost"))?"local":i.includes("dev")?"dev":"prod",referrer:null===(l=document)||void 0===l?void 0:l.referrer,origin:null===(s=window)||void 0===s?void 0:s.location.origin,url:null===(c=window)||void 0===c?void 0:c.location.href,userAgent:null===(a=navigator)||void 0===a?void 0:a.userAgent},t),["local","dev"].includes(u)&&console.log(d),n.label=1;case 1:return n.trys.push([1,3,,4]),[4,fetch("https://http-intake.logs.datadoghq.com/v1/input/".concat("pubb96b84a13912504f4354f2d794ea4fab"),{method:"POST",body:JSON.stringify(d),headers:{"Content-Type":"application/json"}})];case 2:return n.sent(),[3,4];case 3:return n.sent(),console.warn("There was an error sending telemetry."),[3,4];case 4:return[2]}})}),s=function(e,r){return l.apply(this,arguments)},{disableTelemetry:function(e){o=e},setBaseUrl:function(e){i=e},log:{error:function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(e,"error",r)},info:function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(e,"info",r)},warn:function(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return s(e,"warn",r)}}}),d=function(e){var r=document.querySelector('script[src^="'.concat(e,'"]'));if(r)return r;var n=document.head||document.body;if(!n)throw Error("No <head> or <body> elements found in the document.");var t=Object.assign(document.createElement("script"),{src:e});return n.append(t),t},f="Tried to load BasisTheoryElements in a non-DOM environment.",h="Unable to load the Elements script. This may be due to network restrictions or browser extensions like ad blockers interfering with script loading. Check browser settings or network connection and try again.",p=function(e,t){return new Promise(function(o,i){var l,s=d(e),c=!1;s.addEventListener("load",function(){window.BasisTheoryElements?o(window.BasisTheoryElements):(r(function(){return n(this,function(e){switch(e.label){case 0:return[4,u.log.error("Elements not found on window on load",{logType:"elementsNotFoundOnWindow",logOrigin:"loadScript",retryCount:t})];case 1:return e.sent(),[2]}})})(),i(Error("Basis Theory Elements did not load properly. Check network tab for more details.")))}),s.addEventListener("error",(l=r(function(r){var l,a,d;return n(this,function(n){switch(n.label){case 0:if(c)return[2];return c=!0,[4,u.log.error("Elements script onError event",{logType:"elementsScriptOnError",logOrigin:"loadScript",retryCount:t,event:{message:null==r?void 0:r.message,source:null==r?void 0:r.filename,lineno:null==r?void 0:r.lineno,colno:null==r?void 0:r.colno,error:null==r?void 0:r.error,target:null==r?void 0:r.target}})];case 1:n.sent(),n.label=2;case 2:return n.trys.push([2,3,,5]),null==s||s.remove(),[3,5];case 3:return l=n.sent(),[4,u.log.error("Error removing script from DOM on retry attempt ".concat(t),{logType:"scriptRemovalError",logOrigin:"loadScript",retryCount:t,removalError:l})];case 4:return n.sent(),[3,5];case 5:if(0===t)return p(e,t+1).then(o).catch(i),[2];n.label=6;case 6:return n.trys.push([6,12,,14]),[4,fetch(e)];case 7:if((a=n.sent()).ok)return[3,9];return[4,u.log.error("Second attempt to load elements script failed, fetch failed with status: ".concat(a.status,"."),{logType:"elementsScriptFetchFailure",logOrigin:"loadScript",retryCount:t,fetchResult:"error",fetchResponse:a})];case 8:return n.sent(),i(Error(f)),[3,11];case 9:return[4,u.log.error("Second attempt to load elements script failed, fetch success",{logType:"elementsScriptFetchFailure",logOrigin:"loadScript",retryCount:t,fetchResult:"success",fetchResponse:a})];case 10:n.sent(),i(Error(h)),n.label=11;case 11:return[3,14];case 12:return d=n.sent(),[4,u.log.error("Second attempt failed to load elements script failed, fetch network error.",{logType:"elementsScriptFetchError",logOrigin:"loadScript",retryCount:t,fetchResult:"error",fetchError:d})];case 13:return n.sent(),i(Error(h)),[3,14];case 14:return i((null==r?void 0:r.error)||(null==r?void 0:r.message)||Error(h)),[2]}})}),function(e){return l.apply(this,arguments)}))})},v={};v={version:"1.14.0"};var m=(c=r(function(e,o){var i,l,s,c;return n(this,function(a){switch(a.label){case 0:var d;if(!e||0===e.length)throw Error("API key is required");return i=(null==o?void 0:o._devMode)?"js.flock-dev.com":"js.basistheory.com",u.setBaseUrl(i),u.disableTelemetry(!!(null==o?void 0:o.disableTelemetry)),[4,(d="https://".concat(i,"/web-elements/").concat(v.version,"/client/index.js"),t||(t=new Promise(function(e,t){var o;if(("undefined"==typeof window?"undefined":(o=window)&&"undefined"!=typeof Symbol&&o.constructor===Symbol?"symbol":typeof o)!="object"){r(function(){return n(this,function(e){switch(e.label){case 0:return[4,u.log.warn(f,{logType:"elementsNonDomError",logOrigin:"loadElements"})];case 1:return e.sent(),t(Error(f)),[2]}})})();return}if(window.BasisTheoryElements){e(window.BasisTheoryElements);return}p(new URL(d).toString().replace(RegExp("\\/$","u"),""),0).then(e).catch(function(e){t(e)})})),t)];case 1:return[2,a.sent().init(e,"https://".concat(i,"/web-elements/").concat(v.version,"/hosted-elements/"),!1,null===(l=null==o?void 0:o.useSameOriginApi)||void 0===l||l,null!==(s=null==o?void 0:o.disableTelemetry)&&void 0!==s&&s,null!==(c=null==o?void 0:o.debug)&&void 0!==c&&c)]}})}),function(e,r){return c.apply(this,arguments)}),y=((a=y||{}).DECIMAL="decimal",a.EMAIL="email",a.NONE="none",a.NUMERIC="numeric",a.SEARCH="search",a.TEL="tel",a.TEXT="text",a.URL="url",a);"undefined"!=typeof window&&document.currentScript&&!window.basistheory&&(window.basistheory=m)}();

package/dist/main/index.js

@@ -304,7 +304,7 @@ const $6477b722f43d24f2$export$2b0a6e5a1c78018f = (elementsUrl)=>{
 
 
 var $eef42ce81412d9ae$exports = {};
-const $eef42ce81412d9ae$var$version = '1.13.0';
+const $eef42ce81412d9ae$var$version = '1.14.0';
 $eef42ce81412d9ae$exports = {
     version: $eef42ce81412d9ae$var$version
 };

package/dist/module/module.js

@@ -304,7 +304,7 @@ const $2cc07a9862fd14af$export$2b0a6e5a1c78018f = (elementsUrl)=>{
 
 
 var $6a2f0bfcc5905f21$exports = {};
-const $6a2f0bfcc5905f21$var$version = '1.13.0';
+const $6a2f0bfcc5905f21$var$version = '1.14.0';
 $6a2f0bfcc5905f21$exports = {
     version: $6a2f0bfcc5905f21$var$version
 };

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@basis-theory/web-elements",
-  "version": "1.13.0",
+  "version": "1.14.0",
   "repository": "https://github.com/basis-theory/web-elements",
   "license": "Apache-2.0",
   "author": {

package/dist/types/index.d.ts

@@ -186,6 +186,7 @@ export interface SanitizedElementOptions {
     skipLuhnValidation?: boolean;
     style?: ElementStyle;
     targetId?: string;
+    title?: string;
     transform?: [RegExp, string] | null;
     validateOnChange?: boolean;
     validation?: RegExp;
@@ -216,7 +217,13 @@ export interface CardExpirationDateValue<T extends ElementValueType> {
     month: T extends 'reference' ? DataElementReference : number;
     year: T extends 'reference' ? DataElementReference : number;
 }
-export type CreateCardElementOptions = CustomizableElementOptions & Pick<ElementOptions, 'cardTypes' | 'skipLuhnValidation'> & {
+export interface CardElementAutoComplete {
+    number: AutoCompleteValue;
+    expirationDate: AutoCompleteValue;
+    csc: AutoCompleteValue;
+}
+export type CreateCardElementOptions = Omit<CustomizableElementOptions, 'autoComplete'> & Pick<ElementOptions, 'cardTypes' | 'skipLuhnValidation'> & {
+    autoComplete?: CardElementAutoComplete;
     placeholder?: CardElementPlaceholder;
     value?: CardElementValue<'static'>;
 };
@@ -476,6 +483,7 @@ export interface BaseElement<UpdateOptions, ElementEvents> {
     mount(selector: string): Promise<void>;
     mount(element: Element): Promise<void>;
     update(options: UpdateOptions): Promise<void>;
+    validate(): void;
     clear(): void;
     focus(): void;
     blur(): void;
@@ -485,7 +493,6 @@ export interface BaseElement<UpdateOptions, ElementEvents> {
 export type ICardElement = BaseElement<UpdateCardElementOptions, CardElementEvents> & {
     readonly cardMetadata?: CardMetadata;
     setValue(value: CardElementValue<'reference'>): void;
-    validate(): void;
 };
 export type ITextElement = BaseElement<UpdateTextElementOptions, TextElementEvents> & {
     setValueRef(value: ITextElement): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@basis-theory/web-elements",
-  "version": "1.13.0",
+  "version": "1.14.0",
   "repository": "https://github.com/basis-theory/web-elements",
   "license": "Apache-2.0",
   "author": {