@justifi/webcomponents 3.0.3 → 3.0.4

package/dist/cjs/justifi-billing-form_2.cjs.entry.js

@@ -2129,9 +2129,16 @@ const BillingForm = class {
       this.billingFields = billingFieldsClone;
     }
   }
+  /**
+   * Method for filling the form with provided data
+   * @argument {BillingFormFields} fields - The fields to fill the form with
+   */
   async fill(fields) {
     this.billingFields = Object.assign({}, fields);
   }
+  /**
+   * Run validation on the form
+   */
   async validate() {
     const newErrors = {};
     let isValid = true;
@@ -2147,6 +2154,10 @@ const BillingForm = class {
     this.billingFieldsErrors = newErrors;
     return { isValid: isValid };
   }
+  /**
+   * Returns the values of the form as an object
+   * @returns {Promise<BillingFormFields>} The values of the form
+   */
   async getValues() {
     return this.billingFields;
   }

package/dist/cjs/justifi-payment-method-form.cjs.entry.js

@@ -22,7 +22,7 @@ const MessageEventType = {
 };
 
 const name = "@justifi/webcomponents";
-const version = "3.0.3";
+const version = "3.0.4";
 const description = "JustiFi Web Components";
 const main = "dist/index.cjs.js";
 const module$1 = "dist/components/index.js";

package/dist/collection/components/billing-form/billing-form.js

@@ -23,9 +23,16 @@ export class BillingForm {
       this.billingFields = billingFieldsClone;
     }
   }
+  /**
+   * Method for filling the form with provided data
+   * @argument {BillingFormFields} fields - The fields to fill the form with
+   */
   async fill(fields) {
     this.billingFields = Object.assign({}, fields);
   }
+  /**
+   * Run validation on the form
+   */
   async validate() {
     const newErrors = {};
     let isValid = true;
@@ -41,6 +48,10 @@ export class BillingForm {
     this.billingFieldsErrors = newErrors;
     return { isValid: isValid };
   }
+  /**
+   * Returns the values of the form as an object
+   * @returns {Promise<BillingFormFields>} The values of the form
+   */
   async getValues() {
     return this.billingFields;
   }
@@ -92,8 +103,11 @@ export class BillingForm {
         "complexType": {
           "signature": "(fields: BillingFormFields) => Promise<void>",
           "parameters": [{
-              "tags": [],
-              "text": ""
+              "tags": [{
+                  "name": "argument",
+                  "text": "fields - The fields to fill the form with"
+                }],
+              "text": "- The fields to fill the form with"
             }],
           "references": {
             "Promise": {
@@ -107,8 +121,11 @@ export class BillingForm {
           "return": "Promise<void>"
         },
         "docs": {
-          "text": "",
-          "tags": []
+          "text": "Method for filling the form with provided data",
+          "tags": [{
+              "name": "argument",
+              "text": "fields - The fields to fill the form with"
+            }]
         }
       },
       "validate": {
@@ -127,7 +144,7 @@ export class BillingForm {
           "return": "Promise<{ isValid: boolean; }>"
         },
         "docs": {
-          "text": "",
+          "text": "Run validation on the form",
           "tags": []
         }
       },
@@ -147,8 +164,11 @@ export class BillingForm {
           "return": "Promise<BillingFormFields>"
         },
         "docs": {
-          "text": "",
-          "tags": []
+          "text": "Returns the values of the form as an object",
+          "tags": [{
+              "name": "returns",
+              "text": "The values of the form"
+            }]
         }
       }
     };

package/dist/components/billing-form.js

@@ -2129,9 +2129,16 @@ const BillingForm = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       this.billingFields = billingFieldsClone;
     }
   }
+  /**
+   * Method for filling the form with provided data
+   * @argument {BillingFormFields} fields - The fields to fill the form with
+   */
   async fill(fields) {
     this.billingFields = Object.assign({}, fields);
   }
+  /**
+   * Run validation on the form
+   */
   async validate() {
     const newErrors = {};
     let isValid = true;
@@ -2147,6 +2154,10 @@ const BillingForm = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.billingFieldsErrors = newErrors;
     return { isValid: isValid };
   }
+  /**
+   * Returns the values of the form as an object
+   * @returns {Promise<BillingFormFields>} The values of the form
+   */
   async getValues() {
     return this.billingFields;
   }

package/dist/components/payment-method-form.js

@@ -18,7 +18,7 @@ const MessageEventType = {
 };
 
 const name = "@justifi/webcomponents";
-const version = "3.0.3";
+const version = "3.0.4";
 const description = "JustiFi Web Components";
 const main = "dist/index.cjs.js";
 const module = "dist/components/index.js";

package/dist/esm/justifi-billing-form_2.entry.js

@@ -2125,9 +2125,16 @@ const BillingForm = class {
       this.billingFields = billingFieldsClone;
     }
   }
+  /**
+   * Method for filling the form with provided data
+   * @argument {BillingFormFields} fields - The fields to fill the form with
+   */
   async fill(fields) {
     this.billingFields = Object.assign({}, fields);
   }
+  /**
+   * Run validation on the form
+   */
   async validate() {
     const newErrors = {};
     let isValid = true;
@@ -2143,6 +2150,10 @@ const BillingForm = class {
     this.billingFieldsErrors = newErrors;
     return { isValid: isValid };
   }
+  /**
+   * Returns the values of the form as an object
+   * @returns {Promise<BillingFormFields>} The values of the form
+   */
   async getValues() {
     return this.billingFields;
   }

package/dist/esm/justifi-payment-method-form.entry.js

@@ -18,7 +18,7 @@ const MessageEventType = {
 };
 
 const name = "@justifi/webcomponents";
-const version = "3.0.3";
+const version = "3.0.4";
 const description = "JustiFi Web Components";
 const main = "dist/index.cjs.js";
 const module = "dist/components/index.js";

package/dist/types/components/billing-form/billing-form.d.ts

@@ -7,10 +7,21 @@ export declare class BillingForm {
   billingFields: BillingFormFields;
   billingFieldsErrors: any;
   setFormValue(event: any): void;
+  /**
+   * Method for filling the form with provided data
+   * @argument {BillingFormFields} fields - The fields to fill the form with
+   */
   fill(fields: BillingFormFields): Promise<void>;
+  /**
+   * Run validation on the form
+   */
   validate(): Promise<{
     isValid: boolean;
   }>;
+  /**
+   * Returns the values of the form as an object
+   * @returns {Promise<BillingFormFields>} The values of the form
+   */
   getValues(): Promise<BillingFormFields>;
   legendBlock: any;
   render(): any;

package/dist/types/components.d.ts

@@ -28,12 +28,23 @@ export namespace Components {
         "validationMode": 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';
     }
     interface JustifiBillingForm {
+        /**
+          * Method for filling the form with provided data
+          * @argument fields - The fields to fill the form with
+         */
         "fill": (fields: BillingFormFields) => Promise<void>;
+        /**
+          * Returns the values of the form as an object
+          * @returns The values of the form
+         */
         "getValues": () => Promise<BillingFormFields>;
         /**
           * (Optional) A label for the form.
          */
         "legend"?: string;
+        /**
+          * Run validation on the form
+         */
         "validate": () => Promise<{ isValid: boolean; }>;
     }
     interface JustifiCardForm {

package/dist/webcomponents/{p-cf46c082.entry.js → p-defe7fd5.entry.js}

@@ -1 +1 @@
-import{r as o,c as r,h as t,H as i}from"./p-48c17d38.js";const e={card:{ready:"justifi.card.ready",tokenize:"justifi.card.tokenize",validate:"justifi.card.validate",resize:"justifi.card.resize",styleOverrides:"justifi.card.styleOverrides"},bankAccount:{ready:"justifi.bankAccount.ready",tokenize:"justifi.bankAccount.tokenize",validate:"justifi.bankAccount.validate",resize:"justifi.bankAccount.resize",styleOverrides:"justifi.bankAccount.styleOverrides"}},s=class{constructor(t){o(this,t),this.paymentMethodFormReady=r(this,"paymentMethodFormReady",7),this.paymentMethodFormTokenize=r(this,"paymentMethodFormTokenize",7),this.computedTheme=(()=>{const o=getComputedStyle(document.body);return{layout:{padding:o.getPropertyValue("--jfi-layout-padding"),formControlSpacingHorizontal:o.getPropertyValue("--jfi-layout-form-control-spacing-x"),formControlSpacingVertical:o.getPropertyValue("--jfi-layout-form-control-spacing-y")},formControl:{backgroundColor:o.getPropertyValue("--jfi-form-control-background-color"),borderColor:o.getPropertyValue("--jfi-form-control-border-color"),borderColorFocus:o.getPropertyValue("--jfi-form-control-border-color-focus"),borderColorError:o.getPropertyValue("--jfi-form-control-border-color-error"),borderWidth:o.getPropertyValue("--jfi-form-control-border-width"),borderBottomWidth:o.getPropertyValue("--jfi-form-control-border-bottom-width"),borderLeftWidth:o.getPropertyValue("--jfi-form-control-border-left-width"),borderRightWidth:o.getPropertyValue("--jfi-form-control-border-right-width"),borderTopWidth:o.getPropertyValue("--jfi-form-control-border-top-width"),borderRadius:o.getPropertyValue("--jfi-form-control-border-radius"),borderStyle:o.getPropertyValue("--jfi-form-control-border-style"),boxShadow:o.getPropertyValue("--jfi-form-control-box-shadow"),boxShadowError:o.getPropertyValue("--jfi-form-control-box-shadow-error"),boxShadowErrorFocus:o.getPropertyValue("--jfi-form-control-box-shadow-error-focus"),boxShadowFocus:o.getPropertyValue("--jfi-form-control-box-shadow-focus"),color:o.getPropertyValue("--jfi-form-control-color"),colorFocus:o.getPropertyValue("--jfi-form-control-color-focus"),fontSize:o.getPropertyValue("--jfi-form-control-font-size"),fontWeight:o.getPropertyValue("--jfi-form-control-font-weight"),lineHeight:o.getPropertyValue("--jfi-form-control-line-height"),margin:o.getPropertyValue("--jfi-form-control-margin"),padding:o.getPropertyValue("--jfi-form-control-padding")},formLabel:{color:o.getPropertyValue("--jfi-form-label-color"),fontFamily:o.getPropertyValue("--jfi-form-label-font-family"),fontSize:o.getPropertyValue("--jfi-form-label-font-size"),fontWeight:o.getPropertyValue("--jfi-form-label-font-weight"),margin:o.getPropertyValue("--jfi-form-label-margin")},errorMessage:{color:o.getPropertyValue("--jfi-error-message-color"),margin:o.getPropertyValue("--jfi-error-message-margin"),fontSize:o.getPropertyValue("--jfi-error-message-font-size")}}})(),this.paymentMethodFormType=void 0,this.paymentMethodFormValidationMode=void 0,this.iframeOrigin=void 0,this.singleLine=void 0,this.height=55}connectedCallback(){window.addEventListener("message",this.dispatchMessageEvent.bind(this))}disconnectedCallback(){window.removeEventListener("message",this.dispatchMessageEvent.bind(this))}componentShouldUpdate(){this.sendStyleOverrides()}sendStyleOverrides(){this.computedTheme&&this.postMessage(e[this.paymentMethodFormType].styleOverrides,{styleOverrides:this.computedTheme})}dispatchMessageEvent(o){const r=o.data,t=r.eventType,i=r.data;t===e[this.paymentMethodFormType].ready&&this.paymentMethodFormReady.emit(i),t===e[this.paymentMethodFormType].resize&&(this.height=i.height)}postMessage(o,r){var t,i;null===(i=null===(t=this.iframeElement)||void 0===t?void 0:t.contentWindow)||void 0===i||i.postMessage(Object.assign({eventType:o},r),"*")}async postMessageWithResponseListener(o,r){return new Promise((t=>{const i=r=>{r.data.eventType===o&&(window.removeEventListener("message",i),t(r.data.data))};window.addEventListener("message",i),this.postMessage(o,r)}))}async tokenize(o,r,t){return this.postMessageWithResponseListener(e[this.paymentMethodFormType].tokenize,{clientId:o,componentVersion:"3.0.3",paymentMethodMetadata:r,account:t})}async validate(){return this.postMessageWithResponseListener(e[this.paymentMethodFormType].validate)}composeQueryParams(o){return o.map((r=>r===o[0]?`?${r}`:`&${r}`)).join("")}getIframeSrc(){let o=`${this.iframeOrigin||"https://js.justifi.ai/v2"}/${this.paymentMethodFormType}`,r=[];return this.paymentMethodFormValidationMode&&r.push(`validationMode=${this.paymentMethodFormValidationMode}`),this.singleLine&&r.push(`singleLine=${this.singleLine}`),o.concat(this.composeQueryParams(r))}render(){return t(i,null,t("iframe",{id:`justifi-payment-method-form-${this.paymentMethodFormType}`,src:this.getIframeSrc(),ref:o=>this.iframeElement=o,height:this.height}))}};s.style=":host{display:block}justifi-payment-method-form iframe{border:none;width:100%}";export{s as justifi_payment_method_form}
+import{r as o,c as r,h as t,H as i}from"./p-48c17d38.js";const e={card:{ready:"justifi.card.ready",tokenize:"justifi.card.tokenize",validate:"justifi.card.validate",resize:"justifi.card.resize",styleOverrides:"justifi.card.styleOverrides"},bankAccount:{ready:"justifi.bankAccount.ready",tokenize:"justifi.bankAccount.tokenize",validate:"justifi.bankAccount.validate",resize:"justifi.bankAccount.resize",styleOverrides:"justifi.bankAccount.styleOverrides"}},s=class{constructor(t){o(this,t),this.paymentMethodFormReady=r(this,"paymentMethodFormReady",7),this.paymentMethodFormTokenize=r(this,"paymentMethodFormTokenize",7),this.computedTheme=(()=>{const o=getComputedStyle(document.body);return{layout:{padding:o.getPropertyValue("--jfi-layout-padding"),formControlSpacingHorizontal:o.getPropertyValue("--jfi-layout-form-control-spacing-x"),formControlSpacingVertical:o.getPropertyValue("--jfi-layout-form-control-spacing-y")},formControl:{backgroundColor:o.getPropertyValue("--jfi-form-control-background-color"),borderColor:o.getPropertyValue("--jfi-form-control-border-color"),borderColorFocus:o.getPropertyValue("--jfi-form-control-border-color-focus"),borderColorError:o.getPropertyValue("--jfi-form-control-border-color-error"),borderWidth:o.getPropertyValue("--jfi-form-control-border-width"),borderBottomWidth:o.getPropertyValue("--jfi-form-control-border-bottom-width"),borderLeftWidth:o.getPropertyValue("--jfi-form-control-border-left-width"),borderRightWidth:o.getPropertyValue("--jfi-form-control-border-right-width"),borderTopWidth:o.getPropertyValue("--jfi-form-control-border-top-width"),borderRadius:o.getPropertyValue("--jfi-form-control-border-radius"),borderStyle:o.getPropertyValue("--jfi-form-control-border-style"),boxShadow:o.getPropertyValue("--jfi-form-control-box-shadow"),boxShadowError:o.getPropertyValue("--jfi-form-control-box-shadow-error"),boxShadowErrorFocus:o.getPropertyValue("--jfi-form-control-box-shadow-error-focus"),boxShadowFocus:o.getPropertyValue("--jfi-form-control-box-shadow-focus"),color:o.getPropertyValue("--jfi-form-control-color"),colorFocus:o.getPropertyValue("--jfi-form-control-color-focus"),fontSize:o.getPropertyValue("--jfi-form-control-font-size"),fontWeight:o.getPropertyValue("--jfi-form-control-font-weight"),lineHeight:o.getPropertyValue("--jfi-form-control-line-height"),margin:o.getPropertyValue("--jfi-form-control-margin"),padding:o.getPropertyValue("--jfi-form-control-padding")},formLabel:{color:o.getPropertyValue("--jfi-form-label-color"),fontFamily:o.getPropertyValue("--jfi-form-label-font-family"),fontSize:o.getPropertyValue("--jfi-form-label-font-size"),fontWeight:o.getPropertyValue("--jfi-form-label-font-weight"),margin:o.getPropertyValue("--jfi-form-label-margin")},errorMessage:{color:o.getPropertyValue("--jfi-error-message-color"),margin:o.getPropertyValue("--jfi-error-message-margin"),fontSize:o.getPropertyValue("--jfi-error-message-font-size")}}})(),this.paymentMethodFormType=void 0,this.paymentMethodFormValidationMode=void 0,this.iframeOrigin=void 0,this.singleLine=void 0,this.height=55}connectedCallback(){window.addEventListener("message",this.dispatchMessageEvent.bind(this))}disconnectedCallback(){window.removeEventListener("message",this.dispatchMessageEvent.bind(this))}componentShouldUpdate(){this.sendStyleOverrides()}sendStyleOverrides(){this.computedTheme&&this.postMessage(e[this.paymentMethodFormType].styleOverrides,{styleOverrides:this.computedTheme})}dispatchMessageEvent(o){const r=o.data,t=r.eventType,i=r.data;t===e[this.paymentMethodFormType].ready&&this.paymentMethodFormReady.emit(i),t===e[this.paymentMethodFormType].resize&&(this.height=i.height)}postMessage(o,r){var t,i;null===(i=null===(t=this.iframeElement)||void 0===t?void 0:t.contentWindow)||void 0===i||i.postMessage(Object.assign({eventType:o},r),"*")}async postMessageWithResponseListener(o,r){return new Promise((t=>{const i=r=>{r.data.eventType===o&&(window.removeEventListener("message",i),t(r.data.data))};window.addEventListener("message",i),this.postMessage(o,r)}))}async tokenize(o,r,t){return this.postMessageWithResponseListener(e[this.paymentMethodFormType].tokenize,{clientId:o,componentVersion:"3.0.4",paymentMethodMetadata:r,account:t})}async validate(){return this.postMessageWithResponseListener(e[this.paymentMethodFormType].validate)}composeQueryParams(o){return o.map((r=>r===o[0]?`?${r}`:`&${r}`)).join("")}getIframeSrc(){let o=`${this.iframeOrigin||"https://js.justifi.ai/v2"}/${this.paymentMethodFormType}`,r=[];return this.paymentMethodFormValidationMode&&r.push(`validationMode=${this.paymentMethodFormValidationMode}`),this.singleLine&&r.push(`singleLine=${this.singleLine}`),o.concat(this.composeQueryParams(r))}render(){return t(i,null,t("iframe",{id:`justifi-payment-method-form-${this.paymentMethodFormType}`,src:this.getIframeSrc(),ref:o=>this.iframeElement=o,height:this.height}))}};s.style=":host{display:block}justifi-payment-method-form iframe{border:none;width:100%}";export{s as justifi_payment_method_form}

package/dist/webcomponents/webcomponents.esm.js

@@ -1 +1 @@
-import{p as e,b as t}from"./p-48c17d38.js";(()=>{const t=import.meta.url,i={};return""!==t&&(i.resourcesUrl=new URL(".",t).href),e(i)})().then((e=>t([["p-587697d6",[[1,"justifi-payment-form",{bankAccount:[4,"bank-account"],card:[4],email:[1],iframeOrigin:[1,"iframe-origin"],clientId:[1,"client-id"],accountId:[1,"account-id"],submitButtonText:[1,"submit-button-text"],submitButtonEnabled:[32],selectedPaymentMethodType:[32],allowedPaymentMethodTypes:[32],fillBillingForm:[64],enableSubmitButton:[64]},[[0,"paymentMethodSelected","paymentMethodSelectedHandler"]]]]],["p-282af003",[[0,"justifi-bank-account-form",{validationMode:[1025,"validation-mode"],iframeOrigin:[1025,"iframe-origin"],internalStyleOverrides:[32],tokenize:[64],validate:[64]},[[0,"paymentMethodFormReady","readyHandler"],[0,"paymentMethodFormTokenize","tokenizeHandler"],[0,"paymentMethodFormValidate","validateHandler"]]]]],["p-af8d98bb",[[0,"justifi-card-form",{validationMode:[1025,"validation-mode"],iframeOrigin:[1025,"iframe-origin"],singleLine:[4,"single-line"],internalStyleOverrides:[32],tokenize:[64],validate:[64]},[[0,"paymentMethodFormReady","readyHandler"],[0,"paymentMethodFormTokenize","tokenizeHandler"],[0,"paymentMethodFormValidate","validateHandler"]]]]],["p-57d070c8",[[1,"justifi-payments-list",{accountId:[1,"account-id"],auth:[16],payments:[32]}]]],["p-f2438424",[[1,"select-input",{name:[1],label:[1],defaultValue:[1,"default-value"],error:[1],options:[16],internalValue:[32]}],[1,"text-input",{name:[1],label:[1],defaultValue:[1,"default-value"],error:[1],internalValue:[32]}]]],["p-0d4b4f19",[[1,"justifi-billing-form",{legend:[1],billingFields:[32],billingFieldsErrors:[32],fill:[64],validate:[64],getValues:[64]},[[0,"fieldReceivedInput","setFormValue"]]],[0,"justifi-payment-method-selector",{paymentMethodTypes:[16],selectedPaymentMethodType:[1,"selected-payment-method-type"]}]]],["p-cf46c082",[[0,"justifi-payment-method-form",{paymentMethodFormType:[1,"payment-method-form-type"],paymentMethodFormValidationMode:[1025,"payment-method-form-validation-mode"],iframeOrigin:[1,"iframe-origin"],singleLine:[4,"single-line"],height:[32],tokenize:[64],validate:[64]}]]]],e)));
+import{p as e,b as t}from"./p-48c17d38.js";(()=>{const t=import.meta.url,i={};return""!==t&&(i.resourcesUrl=new URL(".",t).href),e(i)})().then((e=>t([["p-587697d6",[[1,"justifi-payment-form",{bankAccount:[4,"bank-account"],card:[4],email:[1],iframeOrigin:[1,"iframe-origin"],clientId:[1,"client-id"],accountId:[1,"account-id"],submitButtonText:[1,"submit-button-text"],submitButtonEnabled:[32],selectedPaymentMethodType:[32],allowedPaymentMethodTypes:[32],fillBillingForm:[64],enableSubmitButton:[64]},[[0,"paymentMethodSelected","paymentMethodSelectedHandler"]]]]],["p-282af003",[[0,"justifi-bank-account-form",{validationMode:[1025,"validation-mode"],iframeOrigin:[1025,"iframe-origin"],internalStyleOverrides:[32],tokenize:[64],validate:[64]},[[0,"paymentMethodFormReady","readyHandler"],[0,"paymentMethodFormTokenize","tokenizeHandler"],[0,"paymentMethodFormValidate","validateHandler"]]]]],["p-af8d98bb",[[0,"justifi-card-form",{validationMode:[1025,"validation-mode"],iframeOrigin:[1025,"iframe-origin"],singleLine:[4,"single-line"],internalStyleOverrides:[32],tokenize:[64],validate:[64]},[[0,"paymentMethodFormReady","readyHandler"],[0,"paymentMethodFormTokenize","tokenizeHandler"],[0,"paymentMethodFormValidate","validateHandler"]]]]],["p-57d070c8",[[1,"justifi-payments-list",{accountId:[1,"account-id"],auth:[16],payments:[32]}]]],["p-f2438424",[[1,"select-input",{name:[1],label:[1],defaultValue:[1,"default-value"],error:[1],options:[16],internalValue:[32]}],[1,"text-input",{name:[1],label:[1],defaultValue:[1,"default-value"],error:[1],internalValue:[32]}]]],["p-0d4b4f19",[[1,"justifi-billing-form",{legend:[1],billingFields:[32],billingFieldsErrors:[32],fill:[64],validate:[64],getValues:[64]},[[0,"fieldReceivedInput","setFormValue"]]],[0,"justifi-payment-method-selector",{paymentMethodTypes:[16],selectedPaymentMethodType:[1,"selected-payment-method-type"]}]]],["p-defe7fd5",[[0,"justifi-payment-method-form",{paymentMethodFormType:[1,"payment-method-form-type"],paymentMethodFormValidationMode:[1025,"payment-method-form-validation-mode"],iframeOrigin:[1,"iframe-origin"],singleLine:[4,"single-line"],height:[32],tokenize:[64],validate:[64]}]]]],e)));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@justifi/webcomponents",
-  "version": "3.0.3",
+  "version": "3.0.4",
   "description": "JustiFi Web Components",
   "main": "dist/index.cjs.js",
   "module": "dist/components/index.js",
@@ -69,4 +69,4 @@
     "storybook": "^7.0.4"
   },
   "license": "MIT"
-}
+}