import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
import { C as ComponentErrorSeverity, a as ComponentErrorCodes } from './Plaid.js';
import { m as makeGetBusiness, a as makePatchBusiness } from './payment-provisioning-actions.js';
import { B as BusinessService } from './business.service.js';
import { a as additionalQuestionsSchema } from './business-additional-questions-schema.js';
import { F as FormController } from './form.js';
import { A as AdditionalQuestions } from './Business.js';
import { C as CURRENCY_MASK } from './form-input-masks.js';
import { h as heading2 } from './parts.js';
import { P as PaymentProvisioningLoading } from './payment-provisioning-loading.js';
import { b as businessServiceReceivedOptions } from './business-form-options.js';
import { B as BusinessFormStep } from './event-types2.js';
import { d as defineCustomElement$6 } from './custom-popper2.js';
import { d as defineCustomElement$5 } from './form-control-monetary-provisioning2.js';
import { d as defineCustomElement$4 } from './form-control-number2.js';
import { d as defineCustomElement$3 } from './form-control-select2.js';
import { d as defineCustomElement$2 } from './form-control-text2.js';
import { d as defineCustomElement$1 } from './form-control-tooltip2.js';

const AdditionalQuestionsFormStep = /*@__PURE__*/ proxyCustomElement(class AdditionalQuestionsFormStep extends HTMLElement {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
        this.errorEvent = createEvent(this, "error-event", 7);
        this.stepCompleteEvent = createEvent(this, "complete-form-step-event", 7);
        this.formLoading = createEvent(this, "formLoading", 7);
        this.errors = {};
        this.additional_questions = {};
        this.recurringPayments = false;
        this.isLoading = false;
        this.getData = () => {
            this.formLoading.emit(true);
            this.isLoading = true;
            this.getBusiness({
                onSuccess: (response) => {
                    this.additional_questions = new AdditionalQuestions(response.data.additional_questions || {});
                    this.formController.setInitialValues(Object.assign({}, this.additional_questions));
                },
                onError: ({ error, code, severity }) => {
                    this.errorEvent.emit({
                        message: error,
                        errorCode: code,
                        severity: severity
                    });
                },
                final: () => {
                    this.formLoading.emit(false);
                    this.isLoading = false;
                }
            });
        };
        this.sendData = (onSuccess) => {
            let submittedData;
            this.formLoading.emit(true);
            this.patchBusiness({
                payload: this.patchPayload,
                onSuccess: (response) => {
                    submittedData = response;
                    onSuccess();
                },
                onError: ({ error, code, severity }) => {
                    submittedData = error;
                    this.errorEvent.emit({
                        message: error,
                        errorCode: code,
                        severity: severity
                    });
                },
                final: () => {
                    this.stepCompleteEvent.emit({ response: submittedData, formStep: BusinessFormStep.additionalQuestions });
                    this.formLoading.emit(false);
                }
            });
        };
        this.inputHandler = (name, value) => {
            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
            this.additional_questions = new AdditionalQuestions(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
        };
    }
    propChanged() {
        this.initializeApi();
    }
    recurringPaymentsWatcher(newValue) {
        if ((newValue === null || newValue === void 0 ? void 0 : newValue.business_recurring_payments) === 'Yes') {
            this.recurringPayments = true;
        }
        else {
            this.recurringPayments = false;
        }
    }
    async validateAndSubmit({ onSuccess }) {
        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
    }
    get patchPayload() {
        const formValues = new AdditionalQuestions(this.formController.values.getValue()).payload;
        return { additional_questions: formValues };
    }
    componentWillLoad() {
        this.initializeApi();
        this.formController = new FormController(additionalQuestionsSchema(this.allowOptionalFields));
    }
    componentDidLoad() {
        this.getBusiness && this.getData();
        this.formController.errors.subscribe(errors => {
            this.errors = Object.assign({}, errors);
        });
    }
    initializeApi() {
        if (this.authToken && this.businessId) {
            this.getBusiness = makeGetBusiness({
                authToken: this.authToken,
                businessId: this.businessId,
                service: new BusinessService()
            });
            this.patchBusiness = makePatchBusiness({
                authToken: this.authToken,
                businessId: this.businessId,
                service: new BusinessService()
            });
        }
        else {
            this.errorEvent.emit({
                message: 'Missing required props',
                errorCode: ComponentErrorCodes.MISSING_PROPS,
                severity: ComponentErrorSeverity.ERROR,
            });
        }
    }
    render() {
        var _a, _b, _c, _d, _e;
        const additionalQuestionsDefaultValue = this.formController.getInitialValues();
        if (this.isLoading) {
            return h(PaymentProvisioningLoading, null);
        }
        return (h("form", null, h("fieldset", null, h("div", { class: "d-flex align-items-center gap-2" }, h("legend", { class: "mb-0", part: heading2 }, "Additional Questions"), h("form-control-tooltip", { helpText: "This information helps us understand the business and identify and monitor trends to safeguard you and your customers." })), h("hr", { class: "mt-2" }), h("div", { class: "row gy-3" }, h("div", { class: "col-12 col-md-6" }, h("form-control-monetary-provisioning", { name: "business_revenue", label: "What is your business' estimated annual revenue from its primary business activities?", inputHandler: this.inputHandler, errorText: (_a = this.errors) === null || _a === void 0 ? void 0 : _a.business_revenue, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_revenue, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { class: "col-12 col-md-6" }, h("form-control-monetary-provisioning", { name: "business_payment_volume", label: "What is your business' annual credit card & ACH volume anticipated to process?", inputHandler: this.inputHandler, errorText: (_b = this.errors) === null || _b === void 0 ? void 0 : _b.business_payment_volume, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_payment_volume, maskOptions: CURRENCY_MASK.WHOLE })), h("div", { class: "col-12" }, h("form-control-number", { name: "business_average_transaction_amount", label: "What is your average transaction size?", inputHandler: this.inputHandler, errorText: (_c = this.errors) === null || _c === void 0 ? void 0 : _c.business_average_transaction_amount, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_average_transaction_amount })), h("div", { class: "col-12" }, h("form-control-select", { name: "business_when_service_received", label: "On average, how long after paying will your customers typically receive their goods or services?", inputHandler: this.inputHandler, errorText: (_d = this.errors) === null || _d === void 0 ? void 0 : _d.business_when_service_received, options: businessServiceReceivedOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_when_service_received })), h("div", { class: "col-12" }, h("form-control-text", { name: "business_other_payment_details", label: "Is there anything else you would like us to know about how your customers pay the business? (optional)", inputHandler: this.inputHandler, errorText: (_e = this.errors) === null || _e === void 0 ? void 0 : _e.business_other_payment_details, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_other_payment_details }))))));
    }
    static get watchers() { return {
        "authToken": ["propChanged"],
        "businessId": ["propChanged"],
        "additional_questions": ["recurringPaymentsWatcher"]
    }; }
}, [256, "additional-questions-form-step", {
        "authToken": [1, "auth-token"],
        "businessId": [1, "business-id"],
        "allowOptionalFields": [4, "allow-optional-fields"],
        "getBusiness": [32],
        "patchBusiness": [32],
        "formController": [32],
        "errors": [32],
        "additional_questions": [32],
        "recurringPayments": [32],
        "isLoading": [32],
        "validateAndSubmit": [64]
    }, undefined, {
        "authToken": ["propChanged"],
        "businessId": ["propChanged"],
        "additional_questions": ["recurringPaymentsWatcher"]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["additional-questions-form-step", "custom-popper", "form-control-monetary-provisioning", "form-control-number", "form-control-select", "form-control-text", "form-control-tooltip"];
    components.forEach(tagName => { switch (tagName) {
        case "additional-questions-form-step":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, AdditionalQuestionsFormStep);
            }
            break;
        case "custom-popper":
            if (!customElements.get(tagName)) {
                defineCustomElement$6();
            }
            break;
        case "form-control-monetary-provisioning":
            if (!customElements.get(tagName)) {
                defineCustomElement$5();
            }
            break;
        case "form-control-number":
            if (!customElements.get(tagName)) {
                defineCustomElement$4();
            }
            break;
        case "form-control-select":
            if (!customElements.get(tagName)) {
                defineCustomElement$3();
            }
            break;
        case "form-control-text":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
        case "form-control-tooltip":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}
defineCustomElement();

export { AdditionalQuestionsFormStep as A, defineCustomElement as d };
