import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { M as alertDanger } from './parts.js';

const FormAlert = /*@__PURE__*/ proxyCustomElement(class FormAlert extends HTMLElement {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
    }
    render() {
        if (!this.text) {
            return null;
        }
        if (this.hideAlert) {
            return null;
        }
        return (h("div", { class: 'alert alert-danger d-flex align-items-center', role: 'alert', part: alertDanger }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", fill: "currentColor", class: "bi bi-exclamation-triangle-fill flex-shrink-0 me-2", viewBox: "0 0 16 16", role: "img", "aria-label": "Warning:" }, h("path", { d: "M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z" })), h("div", null, this.text)));
    }
}, [256, "form-alert", {
        "text": [1],
        "hideAlert": [4, "hide-alert"]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["form-alert"];
    components.forEach(tagName => { switch (tagName) {
        case "form-alert":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, FormAlert);
            }
            break;
    } });
}
defineCustomElement();

export { FormAlert as F, defineCustomElement as d };
