import { r as registerInstance, h, H as Host, g as getElement } from './index-ClISz4NF.js';
import { g as govForm, b as FormControlClass } from './form-DvhJiKwA.js';
import { g as govHost } from './template-CoD1xawt.js';
import { s as splitByWhitespace } from './string.utils-vN03FcXN.js';
import { i as isString } from './helpers.types-DNztiAH0.js';
import './sizes-BcQO4NH2.js';
import './utils-CQvUntGY.js';
import './constants-BegH8u6i.js';
import './colors-U40vKHrs.js';
import './constants-aqe7GX2n.js';
import './constants-CysDgoMA.js';

const GovFormControl = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        /**
         * Indicates the entered value of a child form element does not conform to the format expected by the application.
         */
        this.invalid = false;
        /**
        /**
        * Indicates the form control is disabled
         */
        this.disabled = false;
        /**
        /**
        * Indicates the entered value of a child form element does conform to the format expected by the application.
         */
        this.success = false;
        /**
         * Use control as a fieldset for better accessibility.
         * Note: Remember to set the legend attribute of the gov-form-label component
         */
        this.fieldset = false;
        /**
         * Form element size.
         */
        this.size = "m";
        this.h = govHost(this.host);
        this.f = govForm(this.h);
    }
    componentDidRender() {
        this.syncControlMessages();
        this.formElementDescriptionControl();
    }
    disconnectedCallback() {
        var _a;
        (_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
    }
    formElementDescriptionControl() {
        const bottomSlot = this.host.querySelector("." + FormControlClass.bottom);
        if (!bottomSlot)
            return;
        this.observer = new MutationObserver(function () {
            this.syncControlMessages();
        }.bind(this));
        this.observer.observe(bottomSlot, { childList: true });
    }
    syncControlMessages() {
        Promise.all(this.f.messageElements.map((message) => message.identifier())).then((ids) => {
            this.f.mainElementsInControl.forEach((element) => {
                const currentValue = splitByWhitespace(element.getAttribute("aria-describedby"));
                element.removeAttribute("aria-describedby");
                if (Array.isArray(currentValue)) {
                    currentValue.forEach(id => (isString(id) && id.indexOf("GovFormMessage") === -1 ? ids.push(id) : null));
                }
                if (ids.length) {
                    element.setAttribute("aria-describedby", ids.join(" "));
                }
            });
        });
    }
    render() {
        const Tag = this.fieldset ? "fieldset" : "div";
        return (h(Host, { key: '04e4ab3533f5d22939573fa20a354a0b76319986', size: this.size, class: this.h.classes(FormControlClass.root) }, h(Tag, { key: '9851627baf138775fe24a673d6a095fc8980b6e9', class: FormControlClass.holder }, this.h.hasSlot("top") && h("slot", { key: 'beffe147db943648861b9775dee76ef6b20dffa3', name: "top" }), h("slot", { key: '6667b41d2720045a93b10a92ef300e2842ff57b4' }), this.h.hasSlot("bottom") && (h("div", { key: 'fe117fdc7d64b3c2b4e18e95d1f213c8a8fe3766', class: FormControlClass.bottom }, h("slot", { key: '07eabb48c2849d624bed7f59ba14811ed35732fb', name: "bottom" }))))));
    }
    get host() { return getElement(this); }
};

export { GovFormControl as gov_form_control };
//# sourceMappingURL=gov-form-control.entry.js.map

//# sourceMappingURL=gov-form-control.entry.js.map