@justifi/webcomponents 4.19.1-rc-6 → 4.19.1

package/dist/webcomponents/p-1bbbf15d.js

@@ -1,79 +0,0 @@
-const name = "@justifi/webcomponents";
-const version = "4.19.1-rc-6";
-const description = "JustiFi Web Components";
-const collection = "dist/collection/collection-manifest.json";
-const main = "dist/index.cjs.js";
-const module = "dist/module/index.js";
-const types = "dist/module/index.d.ts";
-const repository = {
-	type: "git",
-	url: "git+https://github.com/justifi-tech/web-component-library.git"
-};
-const homepage = "https://storybook.justifi.ai/?path=/docs/introduction--docs";
-const publishConfig = {
-	registry: "https://registry.npmjs.org"
-};
-const files = [
-	"dist/"
-];
-const scripts = {
-	build: "stencil build --docs",
-	dev: "stencil build --watch",
-	lint: "eslint . --max-warnings 0",
-	clean: "rm -rf .turbo && rm -rf node_modules && rm -rf dist",
-	generate: "stencil generate",
-	test: "TZ=utc stencil test --spec",
-	"test:watch": "TZ=utc stencil test --spec --watchAll",
-	"test:file": "stencil test --spec --watch --"
-};
-const dependencies = {
-	"@stencil/core": "^4.0.5",
-	"@stencil/store": "^2.0.8",
-	bootstrap: "^5.2.3",
-	"chart.js": "^4.4.1",
-	"date-fns": "^2.29.3",
-	"dinero.js": "^1.9.1",
-	"iframe-resizer": "^4.3.7",
-	imask: "^7.6.0",
-	rxjs: "^7.8.1",
-	"ts-dedent": "^2.2.0",
-	uuid: "^9.0.0",
-	yup: "^1.0.0"
-};
-const devDependencies = {
-	"@babel/preset-env": "^7.21.5",
-	"@babel/preset-react": "^7.18.6",
-	"@babel/preset-typescript": "^7.21.5",
-	"@rollup/plugin-replace": "^5.0.7",
-	"@stencil/sass": "^3.0.1",
-	"@types/jest": "27.0.3",
-	"@types/react": "^18.0.37",
-	"@types/react-dom": "^18.0.11",
-	dotenv: "^16.3.1",
-	jest: "^29.7.0",
-	"jest-cli": "^29.7.0",
-	"jest-environment-node": "^29.7.0",
-	"ts-jest": "^29.1.2"
-};
-const license = "MIT";
-const gitHead = "507bac1d941eae6e1f56e185ecd9bc9d22637783";
-const packageJson = {
-	name: name,
-	version: version,
-	description: description,
-	collection: collection,
-	main: main,
-	module: module,
-	types: types,
-	repository: repository,
-	homepage: homepage,
-	publishConfig: publishConfig,
-	files: files,
-	scripts: scripts,
-	dependencies: dependencies,
-	devDependencies: devDependencies,
-	license: license,
-	gitHead: gitHead
-};
-
-export { packageJson as p };

package/dist/webcomponents/p-20abace7.js

@@ -1,77 +0,0 @@
-import { p as packageJson } from './p-1bbbf15d.js';
-import { A as Api } from './p-29c0b182.js';
-
-class AnalyticsService {
-    async record(body) {
-        const endpoint = 'analytics';
-        return Api({ apiOrigin: undefined }).post(endpoint, JSON.stringify(body));
-    }
-}
-
-/**
- * @class JustifiAnalytics
- * @description A class to track analytics for a component
- * @param { component } ComponentInterface - The component to track
- *
- */
-class JustifiAnalytics {
-    constructor(component) {
-        this.handleCustomEvent = async (data) => {
-            // Track the event
-            await this.service.record(data);
-        };
-        this.service = new AnalyticsService();
-        this.componentInstance = component;
-        this.setUpBasicData();
-        this.setupLifecycleTracking();
-        this.trackCustomEvents();
-    }
-    get resourceId() {
-        return (this.componentInstance.accountId ||
-            this.componentInstance.businessId ||
-            this.componentInstance.paymentId ||
-            this.componentInstance.payoutId ||
-            this.componentInstance.checkoutId);
-    }
-    setUpBasicData() {
-        this.basicData = {
-            component_name: this.componentInstance.tagName,
-            component_version: packageJson.version,
-            client_user_agent: navigator.userAgent,
-            // navigator.platform is deprecated, use navigator.userAgent instead
-            client_platform: navigator.userAgent,
-            client_origin: window.location.origin,
-            resource_id: this.resourceId,
-        };
-    }
-    trackCustomEvents() {
-        this.eventEmitters = ['submitted', 'error-event'];
-        // for each event, add an event listener
-        this.eventEmitters.forEach((eventName) => {
-            // if this.componentInstance.addEventListener is a function add the event listener
-            if (typeof this.componentInstance.addEventListener === 'function') {
-                this.componentInstance.addEventListener(eventName, (event) => this.handleCustomEvent({
-                    event_type: eventName,
-                    data: Object.assign(Object.assign({}, this.basicData), { error: event.detail }),
-                }));
-            }
-        });
-    }
-    setupLifecycleTracking() {
-        const originalComponentDidLoad = this.componentInstance.componentDidLoad;
-        this.componentInstance.componentDidLoad = () => {
-            this.service.record({ event_type: 'init', data: this.basicData });
-            if (originalComponentDidLoad) {
-                return originalComponentDidLoad.apply(this.componentInstance);
-            }
-        };
-    }
-    cleanup() {
-        // Remove event listeners
-        this.eventEmitters.forEach((event) => {
-            this.componentInstance.removeEventListener(event, this.handleCustomEvent);
-        });
-    }
-}
-
-export { JustifiAnalytics as J };

package/dist/webcomponents/p-258b1ee2.entry.js

@@ -1,149 +0,0 @@
-import { r as registerInstance, c as createEvent, h } from './p-fad19d75.js';
-import { f as formatCurrency } from './p-83125497.js';
-import { C as ComponentErrorSeverity } from './p-14c91ffd.js';
-import { i as insuranceValuesOn, v as validateInsuranceValues, a as insuranceValues } from './p-2338affa.js';
-import { B as Button } from './p-9c9c7dac.js';
-import { S as StyledHost } from './p-ba4bae6f.js';
-import { S as Skeleton } from './p-08b0fb31.js';
-
-class Checkout {
-    constructor(data) {
-        Object.assign(this, data);
-    }
-}
-
-const checkoutCoreCss = ":host{display:block}justifi-payment-method-form{display:block;margin-left:calc(var(--jfi-layout-padding) * -1);margin-right:calc(var(--jfi-layout-padding) * -1)}.jfi-checkout-core{color:var(--jfi-body-color)}*::part(label){color:var(--jfi-form-label-color);font-family:var(--jfi-form-label-font-family);font-weight:var(--jfi-form-label-font-weight);font-size:var(--jfi-form-label-font-size);margin:var(--jfi-form-label-margin)}*::part(input){font-family:var(--jfi-layout-font-family);background-color:var(--jfi-form-control-background-color);border-color:var(--jfi-form-control-border-color);border-width:var(--jfi-form-control-border-width);border-bottom-width:var(--jfi-form-control-border-bottom-width);border-left-width:var(--jfi-form-control-border-left-width);border-right-width:var(--jfi-form-control-border-right-width);border-top-width:var(--jfi-form-control-border-top-width);border-radius:var(--jfi-form-control-border-radius);border-style:var(--jfi-form-control-border-style);box-shadow:var(--jfi-form-control-box-shadow);color:var(--jfi-form-control-color);font-size:var(--jfi-form-control-font-size);font-weight:var(--jfi-form-control-font-weight);line-height:var(--jfi-form-control-line-height);margin:var(--jfi-form-control-margin);padding:var(--jfi-form-control-padding)}*::part(input):focus{color:var(--jfi-form-control-color-focus);border-color:var(--jfi-form-control-border-color-focus);box-shadow:var(--jfi-form-control-box-shadow-focus)}*::part(input-invalid){border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error)}*::part(input-invalid):focus{border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error-focus)}*::part(invalid-feedback){color:var(--jfi-error-message-color);font-size:var(--jfi-error-message-font-size);margin:var(--jfi-error-message-margin);line-height:normal}.jfi-submit-button{font-family:var(--jfi-layout-font-family);color:var(--jfi-submit-button-color);background-color:var(--jfi-submit-button-background-color);border-color:var(--jfi-submit-button-border-color);padding:var(--jfi-submit-button-padding);font-size:var(--jfi-submit-button-font-size);border-radius:var(--jfi-submit-button-border-radius);width:var(--jfi-submit-button-width);box-shadow:var(--jfi-submit-button-box-shadow);line-height:var(--jfi-submit-button-line-height);text-transform:var(--jfi-submit-button-text-transform)}.jfi-submit-button:hover{color:var(--jfi-submit-button-color-hover);background-color:var(--jfi-submit-button-background-color-hover);border-color:var(--jfi-submit-button-border-color-hover)}.jfi-submit-button:focus{color:var(--jfi-submit-button-color-focus);background-color:var(--jfi-submit-button-background-color-focus);border-color:var(--jfi-submit-button-border-color-focus)}.btn.jfi-submit-button:active{color:var(--jfi-submit-button-color-active);background-color:var(--jfi-submit-button-background-color-active);border-color:var(--jfi-submit-button-border-color-active)}.btn.jfi-submit-button-loading{min-width:75px;color:var(--jfi-submit-button-color-loading);background-color:var(--jfi-submit-button-background-color-loading);border-color:var(--jfi-submit-button-border-color-loading)}.btn.jfi-submit-button-loading .spinner-border{border-top-color:var(--jfi-submit-button-color-loading);border-bottom-color:var(--jfi-submit-button-color-loading);border-left-color:var(--jfi-submit-button-color-loading)}";
-const JustifiCheckoutCoreStyle0 = checkoutCoreCss;
-
-const headerCss = ".jfi-header{color:var(--jfi-header-color);border-bottom:var(--jfi-header-border)}";
-const JustifiCheckoutCoreStyle1 = headerCss;
-
-const CheckoutCore = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.submitted = createEvent(this, "submitted", 7);
-        this.errorEvent = createEvent(this, "error-event", 7);
-        this.loaded = createEvent(this, "loaded", 7);
-        this.completeCheckout = async (payment) => {
-            this.complete({
-                payment,
-                onSuccess: this.onSubmitted,
-                onError: this.onError,
-            });
-        };
-        this.onSubmitted = (data) => {
-            this.submitted.emit(data);
-            this.renderState = 'success';
-        };
-        this.onError = ({ error, code, severity }) => {
-            this.serverError = error;
-            this.errorEvent.emit({
-                errorCode: code,
-                message: error,
-                severity,
-            });
-            this.renderState = 'error';
-        };
-        this.iframeOrigin = undefined;
-        this.authToken = undefined;
-        this.getCheckout = undefined;
-        this.complete = undefined;
-        this.checkoutId = undefined;
-        this.disableCreditCard = undefined;
-        this.disableBankAccount = undefined;
-        this.disableBnpl = undefined;
-        this.disablePaymentMethodGroup = undefined;
-        this.hasLoadedFonts = false;
-        this.checkout = undefined;
-        this.serverError = undefined;
-        this.renderState = 'loading';
-        this.creatingNewPaymentMethod = false;
-        this.insuranceToggled = false;
-    }
-    async fillBillingForm(fields) {
-        this.paymentMethodOptionsRef.fillBillingForm(fields);
-    }
-    componentWillLoad() {
-        console.log('CheckoutCore: componentWillLoad iframeOrigin', this, this.iframeOrigin);
-        if (this.getCheckout) {
-            this.fetchData();
-            // Refresh the checkout data when insurance is added or removed
-            insuranceValuesOn('set', (key) => {
-                const value = insuranceValues[key];
-                if (value !== undefined) {
-                    this.insuranceToggled = value;
-                    this.fetchData();
-                }
-            });
-        }
-    }
-    fetchData() {
-        this.renderState = 'loading';
-        this.getCheckout({
-            onSuccess: ({ checkout }) => {
-                this.checkout = new Checkout(checkout);
-                const { status } = this.checkout;
-                this.loaded.emit({ checkout_status: status });
-                this.renderState = 'success';
-            },
-            onError: ({ error, code, severity }) => {
-                this.serverError = error;
-                this.renderState = 'error';
-                this.errorEvent.emit({
-                    errorCode: code,
-                    message: error,
-                    severity,
-                });
-            }
-        });
-    }
-    ;
-    async submit(event) {
-        var _a;
-        event.preventDefault();
-        this.renderState = 'loading';
-        const insuranceValidation = validateInsuranceValues();
-        const payload = await this.paymentMethodOptionsRef.resolvePaymentMethod(insuranceValidation);
-        if (payload.validationError) {
-            this.renderState = 'error';
-        }
-        else if (payload.error) {
-            this.renderState = 'error';
-            this.serverError = payload.error.message;
-            this.onError({
-                code: payload.error.code,
-                error: payload.error.message,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-        }
-        else if (payload.token) {
-            this.completeCheckout({ payment_mode: 'ecom', payment_token: payload.token });
-        }
-        else if (((_a = payload.bnpl) === null || _a === void 0 ? void 0 : _a.status) === 'success') {
-            this.completeCheckout({ payment_mode: 'bnpl' });
-        }
-        else {
-            this.renderState = 'error';
-        }
-    }
-    get isLoading() {
-        return this.renderState === 'loading';
-    }
-    get isError() {
-        return this.renderState === 'error';
-    }
-    get paymentType() {
-        var _a, _b, _c, _d, _e;
-        return (h("section", null, h("div", { class: !this.isLoading && 'visually-hidden' }, h(Skeleton, { variant: "rounded", height: "300px" })), h("div", { class: this.isLoading && 'visually-hidden' }, h("justifi-payment-method-options", { ref: (el) => (this.paymentMethodOptionsRef = el), "show-card": !this.disableCreditCard, "show-ach": !this.disableBankAccount, "show-bnpl": !this.disableBnpl, paymentMethodGroupId: (_a = this.checkout) === null || _a === void 0 ? void 0 : _a.payment_method_group_id, "show-saved-payment-methods": !this.disablePaymentMethodGroup, bnpl: (_b = this.checkout) === null || _b === void 0 ? void 0 : _b.bnpl, authToken: this.authToken, "account-id": (_c = this.checkout) === null || _c === void 0 ? void 0 : _c.account_id, savedPaymentMethods: ((_d = this.checkout) === null || _d === void 0 ? void 0 : _d.payment_methods) || [], paymentAmount: (_e = this.checkout) === null || _e === void 0 ? void 0 : _e.payment_amount, insuranceToggled: this.insuranceToggled }))));
-    }
-    get summary() {
-        var _a, _b;
-        return (h("section", null, h("div", { class: !this.isLoading && 'visually-hidden' }, h(Skeleton, { height: "24px" })), h("div", { class: this.isLoading && 'visually-hidden' }, h("div", { class: "jfi-payment-description" }, (_a = this.checkout) === null || _a === void 0 ? void 0 : _a.payment_description), h("div", { class: "jfi-payment-total" }, h("span", { class: "jfi-payment-total-label" }, "Total"), "\u00A0", h("span", { class: "jfi-payment-total-amount" }, formatCurrency(+((_b = this.checkout) === null || _b === void 0 ? void 0 : _b.total_amount)))))));
-    }
-    render() {
-        return (h(StyledHost, { key: '991ae6970e426028ace0d1e8327119bc197639b0' }, h("div", { key: '1e57ee21429b494240e644235a2d5815ced99d43', class: "row gy-3 jfi-checkout-core" }, h("div", { key: '70023ce10dea6ff8d5bd8e30c7d474f774682c65', class: "col-12" }, h("h2", { key: '8b09b03c1998e4d60e174fefb3d196e48d50b84a', class: "fs-5 fw-bold pb-3 jfi-header" }, "Summary"), this.summary), h("div", { key: 'e3bbdaaaf010451a31fe9c60bdf81e89bdd142f2', class: "col-12" }, h("slot", { key: '442a01184960f42b5e1f6694798633d3e7219bf5', name: "insurance" })), h("div", { key: '716e26e3dc675e9d72a3a992b1cb212ce48ffb1a', class: "col-12 mt-4" }, h("h2", { key: '762cfc8549b20d16583d0fd8748bde8035042c00', class: "fs-5 fw-bold pb-3 jfi-header" }, "Payment"), h("h3", { key: 'f07d716a87f3e2bd44471f7e93f7af5f5d20440e', class: "fs-6 fw-bold lh-lg" }, "Select payment type"), h("div", { key: '1156291dd748b90d64a08916ffb98c3123132175', class: "d-flex flex-column" }, this.paymentType)), h("div", { key: 'a5bd142a1c72c5abb29338a2cf24c180119d4ea7', class: "col-12" }, h("div", { key: '5a94ed9d54fd3dd24cfe3e34c23ee3c4995eca6d', class: "d-flex justify-content-end" }, h(Button, { key: '7fce3940d8fe562aa7c23e38201b5d2924157288', type: "submit", variant: "primary", onClick: (e) => this.submit(e), disabled: this.isLoading, isLoading: this.isLoading, style: { width: '100%' } }, "Pay"))))));
-    }
-};
-CheckoutCore.style = JustifiCheckoutCoreStyle0 + JustifiCheckoutCoreStyle1;
-
-export { CheckoutCore as justifi_checkout_core };

package/dist/webcomponents/p-25d8cd65.entry.js

@@ -1,102 +0,0 @@
-import { r as registerInstance, c as createEvent, h } from './p-fad19d75.js';
-import { a as BusinessFormClickActions } from './p-d89bad72.js';
-import { a as ComponentErrorCodes, C as ComponentErrorSeverity } from './p-14c91ffd.js';
-import { a as checkProvisioningStatus } from './p-1ff8810b.js';
-import { S as StyledHost } from './p-ba4bae6f.js';
-import './p-6078a370.js';
-
-const PaymentProvisioningCore = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.clickEvent = createEvent(this, "click-event", 7);
-        this.errorEvent = createEvent(this, "error-event", 7);
-        this.submitted = createEvent(this, "submitted", 7);
-        this.setBusinessProvisioned = () => {
-            this.getBusiness({
-                onSuccess: (response) => {
-                    this.businessProvisioned = checkProvisioningStatus(response.data);
-                    if (this.businessProvisioned) {
-                        this.errorEvent.emit({
-                            message: 'A request to provision payments for this business has already been submitted.',
-                            errorCode: ComponentErrorCodes.PROVISIONING_REQUESTED,
-                            severity: ComponentErrorSeverity.INFO,
-                        });
-                    }
-                },
-                onError: ({ error, code, severity }) => {
-                    this.errorEvent.emit({
-                        message: error,
-                        errorCode: code,
-                        severity: severity
-                    });
-                }
-            });
-        };
-        this.postProvisioningData = () => {
-            this.postProvisioning({
-                onSuccess: (response) => {
-                    this.submitted.emit({ data: { response } });
-                },
-                onError: ({ error, code, severity }) => {
-                    this.submitted.emit({ data: { error } });
-                    this.errorEvent.emit({
-                        message: error,
-                        errorCode: code,
-                        severity: severity
-                    });
-                }
-            });
-        };
-        this.refs = [];
-        this.incrementSteps = () => {
-            if (this.currentStep < this.totalSteps) {
-                return this.currentStep++;
-            }
-        };
-        this.decrementSteps = () => { return this.currentStep--; };
-        this.previousStepButtonOnClick = () => {
-            this.clickEvent.emit({ name: BusinessFormClickActions.previousStep });
-            this.decrementSteps();
-        };
-        this.nextStepButtonOnClick = (e, clickEventName) => {
-            e.preventDefault();
-            this.clickEvent.emit({ name: clickEventName });
-            const currentStep = this.refs[this.currentStep];
-            currentStep.validateAndSubmit({ onSuccess: this.incrementSteps });
-        };
-        this.loading = false;
-        this.businessProvisioned = false;
-        this.currentStep = 0;
-        this.errorMessage = undefined;
-        this.businessId = undefined;
-        this.authToken = undefined;
-        this.allowOptionalFields = false;
-        this.formTitle = undefined;
-        this.getBusiness = undefined;
-        this.postProvisioning = undefined;
-    }
-    componentWillLoad() {
-        this.getBusiness && this.setBusinessProvisioned();
-        this.refs = [this.coreInfoRef, this.legalAddressRef, this.additionalQuestionsRef, this.representativeRef, this.ownersRef, this.bankAccountRef, this.documentUploadRef, this.termsRef];
-    }
-    get businessEndpoint() {
-        return `entities/business/${this.businessId}`;
-    }
-    get formDisabled() {
-        return this.loading || this.businessProvisioned;
-    }
-    get totalSteps() {
-        return this.refs.length - 1;
-    }
-    get stepCounter() {
-        return `${this.currentStep + 1} of ${this.totalSteps + 1}`;
-    }
-    handleFormLoading(event) {
-        this.loading = event.detail;
-    }
-    render() {
-        return (h(StyledHost, { key: '80f2730a6a4e273391888b086c3633a3dec012b8', exportparts: 'label,input,input-invalid' }, h("div", { key: 'b4e7be2fed14b404ee7bcbe42c3c1c54bb78fdb6', class: 'row gap-3' }, h("h1", { key: 'f477beb7934a94a74dfc6b8a9c18cc54a720f70e' }, this.formTitle), h("justifi-payment-provisioning-form-steps", { key: 'e74aa3a01cfe7550f4917d28ccda1aca211d9394', businessId: this.businessId, authToken: this.authToken, refs: this.refs, currentStep: this.currentStep, allowOptionalFields: this.allowOptionalFields, handleFormLoading: this.handleFormLoading, onFormCompleted: () => this.postProvisioningData() }), h("div", { key: '26a585ec4b6b677cb01ac17696269168887f4c76', class: 'd-flex justify-content-between align-items-center' }, h("div", { key: 'ca5ddc176f8c2eb3315620076b401e47f45039bd', class: 'd-flex align-items-center' }, this.stepCounter), h("justifi-payment-provisioning-form-buttons", { key: '8299387bf859b33c829d29d66947c3c053ffa53c', currentStep: this.currentStep, totalSteps: this.totalSteps, formLoading: this.loading, formDisabled: this.formDisabled, previousStepButtonOnClick: this.previousStepButtonOnClick, nextStepButtonOnClick: this.nextStepButtonOnClick })))));
-    }
-};
-
-export { PaymentProvisioningCore as justifi_payment_provisioning_core };

package/dist/webcomponents/p-3b5948ea.entry.js

@@ -1,133 +0,0 @@
-import { r as registerInstance, c as createEvent, h } from './p-fad19d75.js';
-import './p-56f6ce4c.js';
-import { a as PaymentMethodTypes } from './p-df21aaad.js';
-import './p-e3fab0e2.js';
-import { l as loadFontsOnParent } from './p-83125497.js';
-import { a as ComponentErrorCodes, C as ComponentErrorSeverity } from './p-14c91ffd.js';
-import { g as getErrorMessage } from './p-8115b2f4.js';
-import { J as JustifiAnalytics } from './p-20abace7.js';
-import { B as Button } from './p-9c9c7dac.js';
-import { S as StyledHost } from './p-ba4bae6f.js';
-import './p-1bbbf15d.js';
-import './p-29c0b182.js';
-
-const paymentFormCss = ":host{display:block}justifi-payment-method-form{display:block;margin-left:calc(var(--jfi-layout-padding) * -1);margin-right:calc(var(--jfi-layout-padding) * -1)}*::part(label){color:var(--jfi-form-label-color);font-family:var(--jfi-form-label-font-family);font-weight:var(--jfi-form-label-font-weight);font-size:var(--jfi-form-label-font-size);margin:var(--jfi-form-label-margin)}*::part(input){font-family:var(--jfi-layout-font-family);background-color:var(--jfi-form-control-background-color);border-color:var(--jfi-form-control-border-color);border-width:var(--jfi-form-control-border-width);border-bottom-width:var(--jfi-form-control-border-bottom-width);border-left-width:var(--jfi-form-control-border-left-width);border-right-width:var(--jfi-form-control-border-right-width);border-top-width:var(--jfi-form-control-border-top-width);border-radius:var(--jfi-form-control-border-radius);border-style:var(--jfi-form-control-border-style);box-shadow:var(--jfi-form-control-box-shadow);color:var(--jfi-form-control-color);font-size:var(--jfi-form-control-font-size);font-weight:var(--jfi-form-control-font-weight);line-height:var(--jfi-form-control-line-height);margin:var(--jfi-form-control-margin);padding:var(--jfi-form-control-padding)}*::part(input):focus{color:var(--jfi-form-control-color-focus);border-color:var(--jfi-form-control-border-color-focus);box-shadow:var(--jfi-form-control-box-shadow-focus)}*::part(input-invalid){border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error)}*::part(input-invalid):focus{border-color:var(--jfi-form-control-border-color-error);box-shadow:var(--jfi-form-control-box-shadow-error-focus)}.jfi-submit-button{font-family:var(--jfi-layout-font-family);color:var(--jfi-submit-button-color);background-color:var(--jfi-submit-button-background-color);border-color:var(--jfi-submit-button-border-color);padding:var(--jfi-submit-button-padding);font-size:var(--jfi-submit-button-font-size);border-radius:var(--jfi-submit-button-border-radius);width:var(--jfi-submit-button-width);box-shadow:var(--jfi-submit-button-box-shadow)}.jfi-submit-button:hover{color:var(--jfi-submit-button-color-hover);background-color:var(--jfi-submit-button-background-color-hover);border-color:var(--jfi-submit-button-border-color-hover)}.jfi-submit-button:focus{color:var(--jfi-submit-button-color-focus);background-color:var(--jfi-submit-button-background-color-focus);border-color:var(--jfi-submit-button-border-color-focus)}.btn.jfi-submit-button:active{color:var(--jfi-submit-button-color-active);background-color:var(--jfi-submit-button-background-color-active);border-color:var(--jfi-submit-button-border-color-active)}.btn.jfi-submit-button-loading{min-width:75px;color:var(--jfi-submit-button-color-loading);background-color:var(--jfi-submit-button-background-color-loading);border-color:var(--jfi-submit-button-border-color-loading)}.btn.jfi-submit-button-loading .spinner-border{border-top-color:var(--jfi-submit-button-color-loading);border-bottom-color:var(--jfi-submit-button-color-loading);border-left-color:var(--jfi-submit-button-color-loading)}";
-const JustifiPaymentFormStyle0 = paymentFormCss;
-
-const PaymentForm = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.submitted = createEvent(this, "submitted", 7);
-        this.errorEvent = createEvent(this, "error-event", 7);
-        this.bankAccount = undefined;
-        this.card = undefined;
-        this.email = undefined;
-        this.clientId = undefined;
-        this.authToken = undefined;
-        this.accountId = undefined;
-        this.submitButtonText = undefined;
-        this.submitButtonEnabled = true;
-        this.isLoading = false;
-        this.selectedPaymentMethodType = PaymentMethodTypes.card;
-    }
-    componentWillLoad() {
-        this.analytics = new JustifiAnalytics(this);
-        if (!this.validateProps()) {
-            this.errorEvent.emit({
-                errorCode: ComponentErrorCodes.MISSING_PROPS,
-                message: 'clientId or authToken is required',
-                severity: ComponentErrorSeverity.ERROR
-            });
-            this.submitButtonEnabled = false;
-        }
-    }
-    connectedCallback() {
-        loadFontsOnParent();
-    }
-    disconnectedCallback() {
-        this.analytics.cleanup();
-    }
-    async fillBillingForm(fields) {
-        this.billingFormRef.fill(fields);
-    }
-    async enableSubmitButton() {
-        this.submitButtonEnabled = true;
-    }
-    async disableSubmitButton() {
-        this.submitButtonEnabled = false;
-    }
-    showPaymentMethodTypeSelector() {
-        return this.card && this.bankAccount;
-    }
-    getSelectedPaymentMethodType() {
-        if (this.showPaymentMethodTypeSelector()) {
-            return this.selectedPaymentMethodType;
-        }
-        else if (this.card) {
-            return PaymentMethodTypes.card;
-        }
-        else if (this.bankAccount) {
-            return PaymentMethodTypes.bankAccount;
-        }
-        else {
-            return PaymentMethodTypes.card;
-        }
-    }
-    paymentMethodSelectedHandler(event) {
-        const paymentMethodType = event.detail;
-        this.selectedPaymentMethodType = paymentMethodType;
-    }
-    validateProps() {
-        return !!(this.clientId || this.authToken);
-    }
-    getToken() {
-        return this.authToken || this.clientId;
-    }
-    async submit(event) {
-        event.preventDefault();
-        if (!this.paymentMethodFormRef || !this.billingFormRef)
-            return;
-        const billingFormValidation = await this.billingFormRef.validate();
-        const paymentMethodFormValidation = await this.paymentMethodFormRef.validate();
-        if (!billingFormValidation.isValid || !paymentMethodFormValidation.isValid)
-            return;
-        this.isLoading = true;
-        try {
-            const billingFormFieldValues = await this.billingFormRef.getValues();
-            const paymentMethodData = Object.assign({ email: this.email }, billingFormFieldValues);
-            const tokenizeResponse = await this.paymentMethodFormRef.tokenize(this.getToken(), paymentMethodData, this.accountId);
-            if (tokenizeResponse.error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentErrorCodes.TOKENIZE_ERROR,
-                    message: tokenizeResponse.error.message,
-                    severity: ComponentErrorSeverity.ERROR
-                });
-            }
-            this.submitted.emit(tokenizeResponse);
-        }
-        catch (error) {
-            this.errorEvent.emit({
-                errorCode: ComponentErrorCodes.UNKNOWN_ERROR,
-                message: getErrorMessage(error),
-                severity: ComponentErrorSeverity.ERROR
-            });
-        }
-        finally {
-            this.isLoading = false;
-        }
-    }
-    render() {
-        return (h(StyledHost, { key: '8cb6e3903a0045fbffed5f17dc29aacc6b57ad7f' }, h("form", { key: '4e8f00c3d29c0db0bc99fd79da46abe7c40e3e30', class: "row gy-3" }, this.showPaymentMethodTypeSelector() && (h("div", { key: '344a1356f6f482493a35015c32f8e9a9b4cc8a80', class: "col-12" }, h("justifi-payment-method-selector", { key: '36b9dd7a9bc8336b4bef0d12f56c811effbc0a0b', selectedPaymentMethodType: this.getSelectedPaymentMethodType(), onPaymentMethodSelected: event => this.paymentMethodSelectedHandler(event) }))), h("div", { key: '225a260f817f9dd02a7f0a5b25562179ab80f7de', class: "col-12" }, h("justifi-payment-method-form", { key: '52e2bf20b265cc96ab556571a323370cc27ac278', "payment-method-form-type": this.getSelectedPaymentMethodType(), iframeOrigin: undefined, ref: el => {
-                if (el) {
-                    this.paymentMethodFormRef = el;
-                }
-            } })), h("div", { key: '433a8ac42c0eec9180e37da222da1dbb1112e48e', class: "col-12" }, h("justifi-billing-form", { key: '4f24f1c8b4083e2d9e5bb2272d32d20bb5cc225d', legend: "Billing Info", ref: el => {
-                if (el) {
-                    this.billingFormRef = el;
-                }
-            } })), h("slot", { key: '9397ae7fdd2677cd61a425fcf5818ae14fabbed0', name: 'insurance' }), h("div", { key: 'db9131f6f35165e69d3b59da7fa25b95f1e46168', class: "col-12" }, h(Button, { key: 'c280836cf6445a7132ff9202a09b6fdac8e29f77', variant: "primary", type: "submit", onClick: event => this.submit(event), disabled: !this.submitButtonEnabled || this.isLoading, isLoading: this.isLoading, "data-testid": "submit-button", style: { width: '100%' } }, this.submitButtonText || 'Submit')))));
-    }
-};
-PaymentForm.style = JustifiPaymentFormStyle0;
-
-export { PaymentForm as justifi_payment_form };

package/dist/webcomponents/p-3c50942c.entry.js

@@ -1,94 +0,0 @@
-import { r as registerInstance, c as createEvent, h } from './p-fad19d75.js';
-import { P as PaymentService } from './p-cb26f708.js';
-import './p-56f6ce4c.js';
-import { P as Payment } from './p-df21aaad.js';
-import './p-e3fab0e2.js';
-import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './p-14c91ffd.js';
-import { g as getErrorMessage, a as getErrorCode } from './p-8115b2f4.js';
-import { E as ErrorState } from './p-dce846bf.js';
-import { J as JustifiAnalytics } from './p-20abace7.js';
-import './p-29c0b182.js';
-import './p-1bbbf15d.js';
-
-const makeGetPayments = ({ id, authToken, service }) => async ({ params, onSuccess, onError }) => {
-    var _a, _b;
-    try {
-        const response = await service.fetchPayments(id, authToken, params);
-        if (!response.error) {
-            const pagingInfo = Object.assign({}, response.page_info);
-            const payments = ((_a = response.data) === null || _a === void 0 ? void 0 : _a.map((dataItem) => new Payment(dataItem))) || [];
-            onSuccess({ payments, pagingInfo });
-        }
-        else {
-            const responseError = getErrorMessage(response.error);
-            const code = getErrorCode((_b = response.error) === null || _b === void 0 ? void 0 : _b.code);
-            return onError({
-                error: responseError,
-                code,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-        }
-    }
-    catch (error) {
-        const code = getErrorCode(error === null || error === void 0 ? void 0 : error.code);
-        return onError({
-            error: error.message || error,
-            code,
-            severity: ComponentErrorSeverity.ERROR,
-        });
-    }
-};
-
-const PaymentsList = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.errorEvent = createEvent(this, "error-event", 7);
-        this.handleErrorEvent = (event) => {
-            this.errorMessage = event.detail.message;
-            this.errorEvent.emit(event.detail);
-        };
-        this.accountId = undefined;
-        this.authToken = undefined;
-        this.getPayments = undefined;
-        this.errorMessage = null;
-    }
-    componentWillLoad() {
-        this.analytics = new JustifiAnalytics(this);
-        this.initializeGetPayments();
-    }
-    disconnectedCallback() {
-        this.analytics.cleanup();
-    }
-    propChanged() {
-        this.initializeGetPayments();
-    }
-    initializeGetPayments() {
-        if (this.accountId && this.authToken) {
-            this.getPayments = makeGetPayments({
-                id: this.accountId,
-                authToken: this.authToken,
-                service: new PaymentService(),
-            });
-        }
-        else {
-            this.errorMessage = 'Account ID and Auth Token are required';
-            this.errorEvent.emit({
-                errorCode: ComponentErrorCodes.MISSING_PROPS,
-                message: this.errorMessage,
-                severity: ComponentErrorSeverity.ERROR,
-            });
-        }
-    }
-    render() {
-        if (this.errorMessage) {
-            return ErrorState(this.errorMessage);
-        }
-        return (h("payments-list-core", { getPayments: this.getPayments, "onError-event": this.handleErrorEvent }));
-    }
-    static get watchers() { return {
-        "accountId": ["propChanged"],
-        "authToken": ["propChanged"]
-    }; }
-};
-
-export { PaymentsList as justifi_payments_list };