@justifi/webcomponents 5.7.6-rc-19 → 5.7.6-rc-21

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-BoUUKfeC.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-C-8mOnW0.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: 'ff15c98bae7f78f81f48db8314ceda2902056210' }, index.h(BankAccountFormSkeleton, { key: 'bd874e12ddec0df3f6e8c73b2ff25fbda7cf626e', isReady: this.isReady }), index.h("hidden-input", { key: 'a4ead10782d1dabcf7b0c3ca6d67263e134b79b0' }), index.h("div", { key: '5557ebe982d2fe51a03a6d124e22045dbe94f3f1', class: "container-fluid p-0", style: {
-                opacity: this.isReady ? '1' : '0',
-                height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: 'e2ffdae6b516fb62642f274b995a5670a0c3ea7a', class: "row mb-3" }, index.h("iframe-input", { key: 'e189e5d5589d542db0aaf3c628a16760888d83ba', inputId: "accountNumber", ref: (el) => (this.accountNumberIframeElement = el), label: "Account Number", iframeOrigin: `${this.iframeOrigin}/v2/accountNumber` })), index.h("div", { key: 'ad2617da7b2d199aedaf1e51709817b9c172542d', class: "row" }, index.h("iframe-input", { key: 'd1ec652e802e083580ff033c365ffe2e7d6ffdd1', 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: 'a6ce1995bc8f0bc79b52c692d71bde1235d90622' }, index.h("div", { key: '5ce8118beaf6cfc090c3b6858fb2888741aa7e53', part: parts.billingForm }, index.h("form", { key: '15a9035e31659a0ce08d675d1868afea612811d5' }, index.h("fieldset", { key: '9c57ae450cc38e0fe50a6e0d2949b18d945ace1c' }, index.h("div", { key: '0f6dfd8c20b64e60f22fed232ab56cc0d2509b82', class: "row gy-3" }, index.h("div", { key: '40024642467bd869d4e1b926e6dde10a4f200f8b', class: "col-12" }, index.h("form-control-text", { key: 'ead74011aa5097a6c3ae9634a149ded0399729ef', name: 'name', label: 'Full Name', defaultValue: billingFormDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: 'c31e9d4cf5285a0113f4d931035534949709a1ca', class: "col-12" }, index.h("form-control-text", { key: '1cef8e3f7fd41d46046a214b1d442923074f7a41', name: 'address_line1', label: 'Street Address', defaultValue: billingFormDefaultValue.address_line1, errorText: this.errors.address_line1, inputHandler: this.inputHandler })), index.h("div", { key: '9d6dd8dd7894866ecbffeb7dfb347e0ea4099946', class: "col-12" }, index.h("form-control-text", { key: 'a65736751e7d8a6470c3eb2d04cf4ff173e660b6', name: 'address_line2', label: "Apartment, Suite, etc. (optional)", defaultValue: billingFormDefaultValue.address_line2, errorText: this.errors.address_line2, inputHandler: this.inputHandler })), index.h("div", { key: '1c0ba7f2720bc71434b69cb285ddf6214932d063', class: "col-12" }, index.h("form-control-text", { key: 'de507ce3010e4cb09d3b659823b097fd9c9d9d63', name: 'address_city', label: "City", defaultValue: billingFormDefaultValue.address_city, errorText: this.errors.address_city, inputHandler: this.inputHandler })), index.h("div", { key: '31421327f01601abe6aaaae8ac2391afcdc485d9', class: "col-12" }, index.h("form-control-select", { key: '30be012a7b96e75b57808922bc689f31a056e8d7', name: 'address_state', label: 'State', options: stateOptions.StateOptions, defaultValue: billingFormDefaultValue.address_state, errorText: this.errors.address_state, inputHandler: this.inputHandler })), index.h("div", { key: 'f24ba6174800f8f57a02a295e71fb0b018249634', class: "col-12" }, index.h("form-control-text", { key: 'cf69224b9af53ad11971ccea42756dbacebb104d', 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: '3ea6e5a7cb667a94d71686a202d232f6360d25d8' }, index.h(CardFormSkeleton, { key: '3bd2aba27d83ce47cb147bcaae13232e554d7f56', isReady: this.isReady }), index.h("hidden-input", { key: 'e144b2394bfe0a9639dd512f25f83ab115c6916a' }), index.h("div", { key: '86e718f1e8dbfb9341dc62c82db7c043dbf444fb', class: "container-fluid p-0", style: {
-                opacity: this.isReady ? '1' : '0',
-                height: this.isReady ? 'auto' : '0',
-            } }, index.h("div", { key: '8a7d518ef2a91663fb951f625c6e3113991a752a', class: "mb-3" }, index.h("iframe-input", { key: '89d2c67e1b03658e43395ba224341c889391eecc', inputId: "cardNumber", ref: (el) => (this.cardNumberIframeElement = el), label: "Card Number", iframeOrigin: `${this.iframeOrigin}/v2/cardNumber` })), index.h("div", { key: 'ae5920f94fddaaa2bf068a44d33ec693087a4ff6', class: "row" }, index.h("div", { key: 'a4ab2b40162cbc9d5b6b353fdf92699d2a7d1297', class: "col-4 align-content-end" }, index.h("iframe-input", { key: 'd7dc593be2fe53910c7c34c389bab9eb32158482', inputId: "expirationMonth", ref: (el) => (this.expirationMonthIframeElement = el), label: "Expiration", iframeOrigin: `${this.iframeOrigin}/v2/expirationMonth` })), index.h("div", { key: 'ebef3068915a5ec98513594670306a90a40353c4', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '8bc26264bab83aaef4a8962ae7a4769deed6ec28', inputId: "expirationYear", ref: (el) => (this.expirationYearIframeElement = el), label: "", iframeOrigin: `${this.iframeOrigin}/v2/expirationYear` })), index.h("div", { key: 'bcd782486a95fc0fb8ff197bb5f62ba6051f1a42', class: "col-4 align-content-end" }, index.h("iframe-input", { key: '792afe884631622898079e54264dfed3541bf5cb', 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: '5ad010bc8968661c250eb3b029e93026cc6545e7' }, index.h("form", { key: 'cbe9d05605241f7c2c8d48b7e12bbaa3f83b3724' }, index.h("form-control-text", { key: 'bfe2ffa8ec34b564127426b220d64fce0809361c', 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;