/**
 * @since Last modified: 2024/06/20 22:35:59
 * @class AlertElem
 * @description The custom element : ax-alert .
 * @augments CustomElement
 * @see {@link https://codepen.io/axui/pen/qBwEzLp|demo @ codepen}
 * @example
 * <ax-alert>Long article</ax-alert>;
 */
import createEl from '../utils/createEl';
import CustomElement from './CustomElem';
import Alert from '../modules/Alert';
import optAlert from '../options/optAlert';
class AlertElem extends CustomElement {
    constructor() {
        super();
        this.createShadow();
        super.createObs();
    }
    createShadow() {
        this.shadowEl = this.attachShadow({ mode: "open" });
        this.slotEl = createEl('slot');
        this.shadowEl.appendChild(this.slotEl);
    }
    render() {
        this.wrapEl = createEl('div', { role: 'slot-host' }, this.innerHTML);
        this.innerHTML = '';
        this.appendChild(this.wrapEl);
        this.ins = new Alert(this.wrapEl);
    }
    static get observedAttributes() {
        return [...optAlert.map((k) => k.attr), 'options'];
    }
    connectedCallback() {
        this.render();
    }
    attributeChangedCallback(name, oldVal, newVal) {
        super.updateProxy(name, newVal, optAlert);
    }
    disconnectedCallback() {
    }
    adoptedCallback() {
    }
}
window.customElements.define("ax-alert", AlertElem);
export default AlertElem;
