@justifi/webcomponents 5.7.6-rc-07 → 5.7.6

package/dist/cjs/justifi-bank-account-form_5.cjs.entry.js

@@ -1,277 +0,0 @@
-'use strict';
-
-var index = require('./index-dm_GlYlb.js');
-var styledHost = require('./styled-host-CqQYxX-w.js');
-require('./event-types-YOY5TKUN.js');
-var skeleton = require('./skeleton-x-GSs3xk.js');
-var checkPkgVersion = require('./check-pkg-version-DEcNwH27.js');
-var configState = require('./config-state-5xZf-jax.js');
-var index_esm = require('./index.esm-BleZSAc0.js');
-var schemaValidations = require('./schema-validations-jek_iZ9W.js');
-var parts = require('./parts-9jMf1erK.js');
-var utils = require('./utils-DAyWinG2.js');
-var stateOptions = require('./state-options-CIT9xdTz.js');
-var checkout_store = require('./checkout.store-mEv437nN.js');
-require('./package-cJqLX2S4.js');
-require('./Api-p2pK86Zd.js');
-require('./utils-Dka3MplB.js');
-require('./ComponentError-D4OLnOkg.js');
-require('./Refund-BztCb6AK.js');
-require('./Pagination-Dediz133.js');
-require('./Payment-2Zmn-l6G.js');
-require('./Dispute-CruQTF6_.js');
-require('./Business-DCRzZf0w.js');
-require('./helpers-B5OCqlIM.js');
-require('./index-Yd9aLenr.js');
-require('./_commonjsHelpers-BJu3ubxk.js');
-require('./business-form-options-CMII7nIK.js');
-
-const BankAccountFormSkeleton = (props) => {
-    const { isReady } = props;
-    if (isReady) {
-        return null;
-    }
-    return (index.h("div", { class: "container-fluid p-0" },
-        index.h("div", { class: "row mb-3" },
-            index.h("div", { class: "col-12 align-content-end" },
-                index.h(skeleton.Skeleton, { height: "18px", width: "120px" }),
-                index.h(skeleton.Skeleton, { height: "36px" }))),
-        index.h("div", { class: "row" },
-            index.h("div", { class: "col-12 align-content-end" },
-                index.h(skeleton.Skeleton, { height: "18px", width: "110px" }),
-                index.h(skeleton.Skeleton, { height: "36px" })))));
-};
-
-const BankAccountForm = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.isReady = false;
-    }
-    async componentWillLoad() {
-        await configState.waitForConfig();
-        this.iframeOrigin = configState.configState.iframeOrigin;
-        checkPkgVersion.checkPkgVersion();
-        this.analytics = new checkPkgVersion.JustifiAnalytics(this);
-    }
-    componentDidRender() {
-        const elements = [
-            this.accountNumberIframeElement,
-            this.routingNumberIframeElement,
-        ];
-        Promise.all(elements.map((element) => {
-            return new Promise((resolve) => {
-                element.addEventListener('iframeLoaded', () => { resolve(); });
-            });
-        })).then(() => {
-            this.isReady = true;
-        });
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
-    }
-    async validate() {
-        const accountNumberIsValid = await this.accountNumberIframeElement.validate();
-        const routingNumberIsValid = await this.routingNumberIframeElement.validate();
-        return accountNumberIsValid && routingNumberIsValid;
-    }
-    async tokenize({ clientId, paymentMethodMetadata, account }) {
-        return this.accountNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
-    }
-    render() {
-        return (index.h(styledHost.StyledHost, { key: '1cf811a60b481271f29c151aff5ab8c132d65d4b' }, index.h(BankAccountFormSkeleton, { key: '3b81c1b9456f2be69fb89f0abac6c0bb95d5f2d3', isReady: this.isReady }), index.h("hidden-input", { key: 'd1d02debee100c4a851f7eb5aa9196587e58e54d' }), index.h("div", { key: '49ced4f6c7c3b9b42fc2b08fd14161ed9a21fdfa', class: "container-fluid p-0", style: {
-                opacity: this.isReady ? '1' : '0',
-                height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: '5d44c0b231532e4b98ff6a777db820c41ce5ce0b', class: "row mb-3" }, index.h("iframe-input", { key: '1628067e98f44f9e7e0f404b1df9e61d756e9d50', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/v2/accountNumber` })), index.h("div", { key: '513aa503c8df3f79d340bf9f4bec9cdee2679a69', class: "row" }, index.h("iframe-input", { key: 'fdbaf1f56b3d0fbc5d1395293240f3b27c134bdd', inputId: "routingNumber", ref: (el) => (this.routingNumberIframeElement = el), label: "Routing Number", iframeOrigin: `${this.iframeOrigin}/v2/routingNumber` })))));
-    }
-};
-
-const billingFormSchema = (postalOnly) => {
-    const fullBillingForm = index_esm.create$3({
-        name: schemaValidations.identityNameValidation.required('Enter full name'),
-        address_line1: schemaValidations.lineOneValidation.required('Enter street address'),
-        address_line2: schemaValidations.lineTwoValidation.nullable(),
-        address_city: schemaValidations.cityValidation.required('Enter city'),
-        address_state: schemaValidations.stateValidation.required('Select state'),
-        address_postal_code: schemaValidations.postalValidation.required('Enter postal code'),
-    });
-    const postalForm = index_esm.create$3({
-        name: schemaValidations.identityNameValidation.nullable(),
-        address_line1: schemaValidations.lineOneValidation.nullable(),
-        address_line2: schemaValidations.lineTwoValidation.nullable(),
-        address_city: schemaValidations.cityValidation.nullable(),
-        address_state: schemaValidations.stateValidation.nullable(),
-        address_postal_code: schemaValidations.postalValidation.required('Enter postal code'),
-    });
-    return postalOnly ? postalForm : fullBillingForm;
-};
-
-const BillingInformationForm = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.errors = {};
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-    }
-    connectedCallback() {
-        this.unsubscribe = checkout_store.onChange('billingFormFields', (newValue) => {
-            this.formController.setInitialValues(newValue);
-        });
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.unsubscribe) === null || _a === void 0 ? void 0 : _a.call(this);
-    }
-    componentWillLoad() {
-        this.formController = new index_esm.FormController(billingFormSchema());
-    }
-    componentDidLoad() {
-        this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
-        this.formController.errors.subscribe(errors => {
-            this.errors = Object.assign({}, errors);
-        });
-    }
-    async getValues() {
-        return this.formController.values.getValue();
-    }
-    async validate() {
-        let isValid = await this.formController.validate();
-        return { isValid: isValid };
-    }
-    render() {
-        const billingFormDefaultValue = this.formController.getInitialValues();
-        return (index.h(styledHost.StyledHost, { key: 'abaa29c5d463c95801ebeadb254a2b87fe116dd0' }, index.h("div", { key: 'f3327594ec80d1365e23cebc523d18581093ed70', part: parts.billingForm }, index.h("form", { key: '2aa614c338af201f648cb03f7865238bb82aa2e4' }, index.h("fieldset", { key: 'a00e9457818d996eee924e996464146a741a5468' }, index.h("div", { key: 'a7d18b979c2505ea8e0ba8b8427f0191060da3c0', class: "row gy-3" }, index.h("div", { key: 'a3ee71f96aafa50cf65e54a1e259d59b44de7494', class: "col-12" }, index.h("form-control-text", { key: 'd9bd8c2db3ed0b7d6062a8ca454f1c33caf84471', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: '539f0e9ec635487c6118ec40b1bcf683efa5b64d', class: "col-12" }, index.h("form-control-text", { key: '10ae18b859dffb202ba014fb303917c58b95953b', name: 'address_line1', label: 'Street Address', defaultValue: billingFormDefaultValue.address_line1, errorText: this.errors.address_line1, inputHandler: this.inputHandler })), index.h("div", { key: 'bc6aba1d85cef27587e07bcf15073c766936ca8f', class: "col-12" }, index.h("form-control-text", { key: '073673edb594797a2158a1d5b04022b407b9ed0c', name: 'address_line2', label: "Apartment, Suite, etc. (optional)", defaultValue: billingFormDefaultValue.address_line2, errorText: this.errors.address_line2, inputHandler: this.inputHandler })), index.h("div", { key: '50062f42ee4da8238ffcc42b2f6850bbad309ffd', class: "col-12" }, index.h("form-control-text", { key: '4bf1c47edb3faca18aec278bef52d078d59f60ed', name: 'address_city', label: "City", defaultValue: billingFormDefaultValue.address_city, errorText: this.errors.address_city, inputHandler: this.inputHandler })), index.h("div", { key: 'd2b8c326762474d38b5271f89d682be763fb0f44', class: "col-12" }, index.h("form-control-select", { key: '506286fed3c031d72cae737c4631ec4f91428ceb', name: 'address_state', label: 'State', options: stateOptions.StateOptions, defaultValue: billingFormDefaultValue.address_state, errorText: this.errors.address_state, inputHandler: this.inputHandler })), index.h("div", { key: 'f70fd74b32594b43a524cb305c79854bcb5ea2ba', class: "col-12" }, index.h("form-control-text", { key: '8f24531c98865727c2b585feef088f9f2c9c7e96', name: 'address_postal_code', label: "ZIP", defaultValue: billingFormDefaultValue.address_postal_code, errorText: this.errors.address_postal_code, inputHandler: this.inputHandler, maxLength: 5, keyDownHandler: utils.numberOnlyHandler }))))))));
-    }
-};
-
-const CardFormSkeleton = (props) => {
-    const { isReady } = props;
-    if (isReady) {
-        return null;
-    }
-    return (index.h("div", { class: "container-fluid p-0" },
-        index.h("div", { class: "mb-3" },
-            index.h(skeleton.Skeleton, { height: "18px", width: "100px" }),
-            index.h(skeleton.Skeleton, { height: "36px" })),
-        index.h("div", { class: "row" },
-            index.h("div", { class: "col-4 align-content-end" },
-                index.h(skeleton.Skeleton, { height: "18px", width: "80px" }),
-                index.h(skeleton.Skeleton, { height: "36px" })),
-            index.h("div", { class: "col-4 align-content-end" },
-                index.h(skeleton.Skeleton, { height: "36px" })),
-            index.h("div", { class: "col-4 align-content-end" },
-                index.h(skeleton.Skeleton, { height: "18px", width: "30px" }),
-                index.h(skeleton.Skeleton, { height: "36px" })))));
-};
-
-const JustifiCardForm = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.isReady = false;
-    }
-    async componentWillLoad() {
-        await configState.waitForConfig();
-        this.iframeOrigin = configState.configState.iframeOrigin;
-        checkPkgVersion.checkPkgVersion();
-        this.analytics = new checkPkgVersion.JustifiAnalytics(this);
-    }
-    componentDidRender() {
-        const elements = [
-            this.cardNumberIframeElement,
-            this.expirationMonthIframeElement,
-            this.expirationYearIframeElement,
-            this.cvvIframeElement,
-        ];
-        Promise.all(elements.map((element) => {
-            return new Promise((resolve) => {
-                element.addEventListener('iframeLoaded', () => { resolve(); });
-            });
-        })).then(() => {
-            this.isReady = true;
-        });
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.analytics) === null || _a === void 0 ? void 0 : _a.cleanup();
-    }
-    async validate() {
-        const cardNumberIsValid = await this.cardNumberIframeElement.validate();
-        const expirationMonthIsValid = await this.expirationMonthIframeElement.validate();
-        const expirationYearIsValid = await this.expirationYearIframeElement.validate();
-        const cvvIsValid = await this.cvvIframeElement.validate();
-        return cardNumberIsValid && expirationMonthIsValid && expirationYearIsValid && cvvIsValid;
-    }
-    async tokenize({ clientId, paymentMethodMetadata, account, }) {
-        return this.cardNumberIframeElement.tokenize(clientId, paymentMethodMetadata, account);
-    }
-    render() {
-        return (index.h(styledHost.StyledHost, { key: '7cb0c0a08ef0572fa1604e17edbf19478ea3f36b' }, index.h(CardFormSkeleton, { key: '5314b766fd972e03dbb7632776c97617132a861d', isReady: this.isReady }), index.h("hidden-input", { key: '479b8a68d10eb9e7e0358e165345020290ed6690' }), index.h("div", { key: 'a71bc32cfbef8b37d47c56662094dc6e292ff1f3', class: "container-fluid p-0", style: {
-                opacity: this.isReady ? '1' : '0',
-                height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: '64c8b172e9786cf1cdefaea11bcb27d665015ecf', class: "mb-3" }, index.h("iframe-input", { key: 'c31ef9a392acbe9b2aabcacb0a37d4999853bbfc', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: '7c60c66b4212423fa08a902c6550c2ca757198b8', class: "row" }, index.h("div", { key: '712d7b397299596d4b9dfd91ebdce84e028ec925', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '2caf6a11018a30dbac0b973387e23fd0d00f96bd', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: '41122ae04a8b6c568157213874df4a7d483cba41', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'abd6e99b75446663e428094dd3588e02f849fb85', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: 'c974afa273e7f150cb365704401e49408074faac', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'c3998a85c9043a08d60b667c86e20bee5e5f007c', inputId: "CVV", ref: (el) => (this.cvvIframeElement = el), label: "CVV", iframeOrigin: `${this.iframeOrigin}/v2/CVV` }))))));
-    }
-};
-
-const PostalCodeForm = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.errors = {};
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-    }
-    connectedCallback() {
-        this.unsubscribe = checkout_store.onChange('billingFormFields', (newValue) => {
-            this.formController.setInitialValues(newValue);
-        });
-    }
-    disconnectedCallback() {
-        var _a;
-        (_a = this.unsubscribe) === null || _a === void 0 ? void 0 : _a.call(this);
-    }
-    componentWillLoad() {
-        this.formController = new index_esm.FormController(billingFormSchema(true));
-    }
-    componentDidLoad() {
-        this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
-        this.formController.errors.subscribe(errors => {
-            this.errors = Object.assign({}, errors);
-        });
-    }
-    async getValues() {
-        return this.formController.values.getValue();
-    }
-    async fill(fields) {
-        this.formController.setInitialValues(fields);
-    }
-    async validate() {
-        let isValid = await this.formController.validate();
-        return { isValid: isValid };
-    }
-    render() {
-        const billingFormDefaultValue = this.formController.getInitialValues();
-        return (index.h(styledHost.StyledHost, { key: 'be5335622cb907795f13522a0b12e70e9854b2b6' }, index.h("form", { key: '9fd26fb2568030bf000d5501e5063b79a98ab02e' }, index.h("form-control-text", { key: 'aed14596c15442d99705dd75f5349186b60a8a89', name: 'address_postal_code', label: "ZIP", defaultValue: billingFormDefaultValue.address_postal_code, errorText: this.errors.address_postal_code, inputHandler: this.inputHandler, maxLength: 5, keyDownHandler: utils.numberOnlyHandler }))));
-    }
-};
-
-const SaveNewPaymentMethod = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.checkboxChanged = index.createEvent(this, "checkboxChanged");
-        this.isChecked = false;
-    }
-    handleCheckboxChange(_name, value) {
-        this.isChecked = value;
-        this.checkboxChanged.emit(this.isChecked);
-    }
-    render() {
-        return (index.h(styledHost.StyledHost, { key: '114f1887f2aebee2440d5c0b187fe1f361137230' }, index.h("div", { key: '8a967beb89065a8b3ee501f0589b6617764c641e', class: "mt-4 form-check" }, index.h("form-control-checkbox", { key: 'b22ca881a5fcda9dc044dfd1175e9ae06fd9f504', label: "Save new payment method", name: "saveNewPaymentMethod", checked: this.isChecked, inputHandler: this.handleCheckboxChange.bind(this) }))));
-    }
-};
-
-exports.justifi_bank_account_form = BankAccountForm;
-exports.justifi_billing_information_form = BillingInformationForm;
-exports.justifi_card_form = JustifiCardForm;
-exports.justifi_postal_code_form = PostalCodeForm;
-exports.justifi_save_new_payment_method = SaveNewPaymentMethod;

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

@@ -1,76 +0,0 @@
-'use strict';
-
-var index = require('./index-dm_GlYlb.js');
-var index_esm = require('./index.esm-BleZSAc0.js');
-var schemaValidations = require('./schema-validations-jek_iZ9W.js');
-var parts = require('./parts-9jMf1erK.js');
-var header3 = require('./header-3-D9Wa0IfT.js');
-require('./event-types-YOY5TKUN.js');
-require('./_commonjsHelpers-BJu3ubxk.js');
-require('./state-options-CIT9xdTz.js');
-require('./business-form-options-CMII7nIK.js');
-require('./Business-DCRzZf0w.js');
-require('./helpers-B5OCqlIM.js');
-
-const billingFormSchema = (postalOnly) => {
-    const fullBillingForm = index_esm.create$3({
-        name: schemaValidations.identityNameValidation.required('Enter full name'),
-        address_line1: schemaValidations.lineOneValidation.required('Enter street address'),
-        address_line2: schemaValidations.lineTwoValidation.nullable(),
-        address_city: schemaValidations.cityValidation.required('Enter city'),
-        address_state: schemaValidations.stateValidation.required('Select state'),
-        address_postal_code: schemaValidations.postalValidation.required('Enter postal code'),
-    });
-    const postalForm = index_esm.create$3({
-        name: schemaValidations.identityNameValidation.nullable(),
-        address_line1: schemaValidations.lineOneValidation.nullable(),
-        address_line2: schemaValidations.lineTwoValidation.nullable(),
-        address_city: schemaValidations.cityValidation.nullable(),
-        address_state: schemaValidations.stateValidation.nullable(),
-        address_postal_code: schemaValidations.postalValidation.required('Enter postal code'),
-    });
-    return postalOnly ? postalForm : fullBillingForm;
-};
-
-const BillingForm = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.errors = {};
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-    }
-    componentWillLoad() {
-        const postalOnly = this.isPostalOnlyMode;
-        this.formController = new index_esm.FormController(billingFormSchema(postalOnly));
-    }
-    componentDidLoad() {
-        this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
-        this.formController.errors.subscribe(errors => {
-            this.errors = Object.assign({}, errors);
-        });
-    }
-    get isPostalOnlyMode() {
-        return this.paymentMethodType === 'card' && this.hideCardBillingForm;
-    }
-    get hideAllBillingFields() {
-        return this.paymentMethodType === 'bankAccount' && this.hideBankAccountBillingForm;
-    }
-    async getValues() {
-        return this.formController.values.getValue();
-    }
-    async fill(fields) {
-        this.formController.setInitialValues(fields);
-    }
-    async validate() {
-        const isValid = await this.formController.validate();
-        const errors = this.formController.errors.getValue();
-        return { isValid, errors };
-    }
-    render() {
-        const showHeader = !this.isPostalOnlyMode && !this.hideAllBillingFields;
-        return (index.h("div", { key: '91beaa8646dd35b12e4ef90ce4cdcb73f1a441b2', part: parts.billingForm, class: "mt-4", hidden: this.hideAllBillingFields }, showHeader && index.h(header3.Header3, { key: 'ca3c1fbba66828371c2172e0d6c6607b36836b00', text: "Billing address", class: "fs-6 fw-bold lh-lg mb-4" }), this.legend && index.h("legend", { key: '50f2c5e1f7a7b4f14841a91afb7ad7be79e0f89d' }, this.legend), this.isPostalOnlyMode ? (index.h("justifi-postal-code-form", null)) : (index.h("justifi-billing-information-form", null))));
-    }
-};
-
-exports.justifi_billing_form = BillingForm;