import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { p as postalOnlySchema } from './billing-form-schema.js';
import { x as billingForm } from './parts.js';
import { F as FormController } from './form.js';
import { c as checkoutStore, o as onChange } from './checkout.store.js';
import { d as defineCustomElement$3 } from './custom-popper2.js';
import { d as defineCustomElement$2 } from './form-control-text2.js';
import { d as defineCustomElement$1 } from './form-control-tooltip2.js';

const CardBillingFormSimple = /*@__PURE__*/ proxyCustomElement(class CardBillingFormSimple extends HTMLElement {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
        this.errors = {};
        this.inputHandler = (name, value) => {
            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
        };
    }
    componentWillLoad() {
        this.formController = new FormController(postalOnlySchema());
        const fields = checkoutStore.billingFormFields;
        if (fields && Object.keys(fields).some((k) => fields[k])) {
            this.formController.setInitialValues(fields);
        }
    }
    componentDidLoad() {
        this.formController.values.subscribe(values => this.billingInfo = Object.assign({}, values));
        this.formController.errors.subscribe(errors => {
            this.errors = Object.assign({}, errors);
        });
        this.unsubscribeFromStore = onChange('billingFormFields', (newValue) => {
            this.formController.setInitialValues(newValue);
        });
    }
    disconnectedCallback() {
        var _a;
        (_a = this.unsubscribeFromStore) === null || _a === void 0 ? void 0 : _a.call(this);
    }
    async getValues() {
        return this.formController.values.getValue();
    }
    async validate() {
        const isValid = await this.formController.validate();
        const errors = this.formController.errors.getValue();
        return { isValid, errors };
    }
    render() {
        const billingFormDefaultValue = this.formController.getInitialValues();
        return (h("div", { key: '41a7f26e12bfa3da4e7926d8a535218a0580be14', part: billingForm }, h("form", { key: 'b48cf148ec6d16fd8e5859dfe96a3b9fd6d3036d' }, h("fieldset", { key: '88094544642af8fadb270dfafd838d450ad88cdd' }, this.legend && (h("legend", { key: '13c19557aa4c0c127305cc54f6346eeb74d4f750' }, this.legend)), h("div", { key: 'bbcf1a622720df2d21db718eaf823e4e33155070', class: "row gy-3" }, h("div", { key: '96b9d590fd68fd4f2a54760e58c0f2bc166a832b', class: "col-12" }, h("form-control-text", { key: '57050d0274782cb2ff5f1a9b13726a8319438a36', name: 'address_postal_code', label: "Postal Code", defaultValue: billingFormDefaultValue.address_postal_code, errorText: this.errors.address_postal_code, inputHandler: this.inputHandler, maxLength: 7 })))))));
    }
}, [256, "card-billing-form-simple", {
        "legend": [1025],
        "formController": [32],
        "billingInfo": [32],
        "errors": [32],
        "getValues": [64],
        "validate": [64]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["card-billing-form-simple", "custom-popper", "form-control-text", "form-control-tooltip"];
    components.forEach(tagName => { switch (tagName) {
        case "card-billing-form-simple":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, CardBillingFormSimple);
            }
            break;
        case "custom-popper":
            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 { CardBillingFormSimple as C, defineCustomElement as d };
