/*!
 * KoliBri - The accessible HTML-Standard
 */
import { h } from "@stencil/core";
import KolAlertFc from "../../functional-components/Alert";
import { setState, validateAlertType, validateAlertVariant, validateHasCloser, validateLabel, watchBoolean } from "../../schema";
import { dispatchDomEvent, KolEvent } from "../../utils/events";
import { watchHeadingLevel } from "../heading/validation";
export class KolAlertWc {
    constructor() {
        this.close = () => {
            var _a, _b;
            (_b = (_a = this._on) === null || _a === void 0 ? void 0 : _a.onClose) === null || _b === void 0 ? void 0 : _b.call(_a, new Event('Close'));
            if (this.host) {
                dispatchDomEvent(this.host, KolEvent.close);
            }
        };
        this.handleAlertTimeout = () => {
            this.validateAlert(false);
        };
        this._alert = false;
        this._hasCloser = false;
        this._level = 0;
        this._type = 'default';
        this._variant = 'msg';
        this.state = {
            _level: 0,
        };
        this.validateOnValue = (value) => typeof value === 'object' && value !== null && typeof value.onClose === 'function';
    }
    render() {
        const { _alert, _hasCloser, _label, _level, _type, _variant } = this.state;
        const props = {
            alert: _alert,
            hasCloser: _hasCloser,
            label: _label,
            level: _level,
            type: _type,
            variant: _variant,
            onCloserClick: this.close,
            onAlertTimeout: this.handleAlertTimeout,
        };
        return (h(KolAlertFc, Object.assign({ key: 'ab90b52cbda1d61514c3acd292d0bd6d91f0c9d5' }, props), h("slot", { key: '6a7e2a89cfabde71c1140d4cf5de28e99bc09ef4' })));
    }
    validateAlert(value) {
        watchBoolean(this, '_alert', value);
    }
    validateHasCloser(value) {
        validateHasCloser(this, value);
    }
    validateLabel(value) {
        validateLabel(this, value);
    }
    validateLevel(value) {
        watchHeadingLevel(this, value);
    }
    validateOn(value) {
        if (this.validateOnValue(value)) {
            setState(this, '_on', {
                onClose: value.onClose,
            });
        }
    }
    validateType(value) {
        validateAlertType(this, value);
    }
    validateVariant(value) {
        validateAlertVariant(this, value);
    }
    componentWillLoad() {
        this.validateAlert(this._alert);
        this.validateHasCloser(this._hasCloser);
        this.validateLabel(this._label);
        this.validateLevel(this._level);
        this.validateOn(this._on);
        this.validateType(this._type);
        this.validateVariant(this._variant);
    }
    static get is() { return "kol-alert-wc"; }
    static get properties() {
        return {
            "_alert": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Defines whether the screen-readers should read out the notification."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "_alert",
                "defaultValue": "false"
            },
            "_hasCloser": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "TODO",
                            "text": ": Change type back to `HasCloserPropType` after Stencil#4663 has been resolved."
                        }],
                    "text": "Defines whether the element can be closed."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "_has-closer",
                "defaultValue": "false"
            },
            "_label": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "LabelPropType",
                    "resolved": "string | undefined",
                    "references": {
                        "LabelPropType": {
                            "location": "import",
                            "path": "../../schema",
                            "id": "src/schema/index.ts::LabelPropType"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "_label"
            },
            "_level": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "HeadingLevel",
                    "resolved": "0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined",
                    "references": {
                        "HeadingLevel": {
                            "location": "import",
                            "path": "../../schema",
                            "id": "src/schema/index.ts::HeadingLevel"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "_level",
                "defaultValue": "0"
            },
            "_on": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "KoliBriAlertEventCallbacks",
                    "resolved": "undefined | { onClose?: EventCallback<Event> | undefined; }",
                    "references": {
                        "KoliBriAlertEventCallbacks": {
                            "location": "import",
                            "path": "../../schema",
                            "id": "src/schema/index.ts::KoliBriAlertEventCallbacks"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Gibt die EventCallback-Function f\u00FCr das Schlie\u00DFen des Alerts an."
                },
                "getter": false,
                "setter": false
            },
            "_type": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "AlertTypePropType",
                    "resolved": "\"default\" | \"error\" | \"info\" | \"success\" | \"warning\" | undefined",
                    "references": {
                        "AlertTypePropType": {
                            "location": "import",
                            "path": "../../schema",
                            "id": "src/schema/index.ts::AlertTypePropType"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Defines either the type of the component or of the components interactive element."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "_type",
                "defaultValue": "'default'"
            },
            "_variant": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "AlertVariantPropType",
                    "resolved": "\"card\" | \"msg\" | undefined",
                    "references": {
                        "AlertVariantPropType": {
                            "location": "import",
                            "path": "../../schema",
                            "id": "src/schema/index.ts::AlertVariantPropType"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Defines which variant should be used for presentation."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "_variant",
                "defaultValue": "'msg'"
            }
        };
    }
    static get states() {
        return {
            "state": {}
        };
    }
    static get elementRef() { return "host"; }
    static get watchers() {
        return [{
                "propName": "_alert",
                "methodName": "validateAlert"
            }, {
                "propName": "_hasCloser",
                "methodName": "validateHasCloser"
            }, {
                "propName": "_label",
                "methodName": "validateLabel"
            }, {
                "propName": "_level",
                "methodName": "validateLevel"
            }, {
                "propName": "_on",
                "methodName": "validateOn"
            }, {
                "propName": "_type",
                "methodName": "validateType"
            }, {
                "propName": "_variant",
                "methodName": "validateVariant"
            }];
    }
}
//# sourceMappingURL=component.js.map
