import { h } from "@stencil/core";
import { randomIdGenerator } from "../../../global/utils/randomIdGenerator";
import { NotificationAlertSize } from "./notification-alert-size.enum";
import { NotificationAlertHeadingLevel } from "./notification-alert-heading-level.enum";
import { NotificationAlertVariation } from "./notification-alert-variation.enum";
import { ButtonVariation, TypographyVariation } from "../../../enums";
/**
 * @slot default - Kan innehålla vad som helst
 *
 * @enums NotificationAlertSize - notification-alert-size.enum.ts
 * @enums NotificationAlertHeadingLevel - notification-alert-heading-level.enum.ts
 * @enums NotificationAlertVariation - notification-alert-variation.enum.ts
 * @swedishName Informationsmeddelande
 */
export class NotificationAlert {
    constructor() {
        this.listItems = [];
        this.afHeading = undefined;
        this.afHeadingLevel = NotificationAlertHeadingLevel.H2;
        this.afSize = NotificationAlertSize.LARGE;
        this.afVariation = NotificationAlertVariation.INFO;
        this.afCloseable = false;
        this.afCloseAriaLabel = 'Stäng meddelandet';
        this.afId = randomIdGenerator('digi-notification-alert');
    }
    /**
     * Hämtar en referens till rubrikelementet. Bra för att t.ex. sätta fokus programmatiskt.
     * @en Returns a reference to the heading element. Handy for setting focus programmatically.
     */
    async afMGetHeadingElement() {
        return this._heading;
    }
    clickHandler(e) {
        this.afOnClose.emit(e);
    }
    componentDidLoad() {
        this.afOnReady.emit();
    }
    get cssModifiers() {
        return {
            [`digi-notification-alert--size-${this.afSize}`]: !!this.afSize,
            [`digi-notification-alert--variation-${this.afVariation}`]: !!this.afVariation,
            'digi-notification-alert--closeable': this.afCloseable
        };
    }
    get icon() {
        switch (this.afVariation) {
            case NotificationAlertVariation.SUCCESS:
                return h("digi-icon-notification-succes", null);
            case NotificationAlertVariation.WARNING:
                return h("digi-icon-notification-warning", null);
            case NotificationAlertVariation.DANGER:
                return h("digi-icon-notification-error", null);
            default:
                return h("digi-icon-notification-info", null);
        }
    }
    render() {
        return (h("div", { key: 'a65e377eef21711500336dffce094f7b40f35ce4', class: Object.assign({ 'digi-notification-alert': true }, this.cssModifiers) }, h("div", { key: 'a9a876baf7de65aa8eb93d5137c9059f93344d0a', class: "digi-notification-alert__layout" }, h("div", { key: '07193a4975b0f7f4f90423b36ac94b56d211c4e0', class: "icon-wrapper" }, h("div", { key: '66b386e44e4efb140964441afbaec022cc0d39ec', class: "digi-notification-alert__icon", slot: "media" }, this.icon)), h("div", { key: '3ae5fe83e801949034abef041510eb135a59f13b', class: "main-wrapper" }, h("div", { key: '3bd030aae0bbe614f6d3b5d60ede4eedfe94e199', class: "digi-notification-alert__wrapper" }, this.afCloseable && (h("digi-button", { key: 'b9378b953d4c075539cc6b8d523a52418633b3bc', "af-aria-label": this.afCloseAriaLabel, "af-variation": ButtonVariation.FUNCTION, onAfOnClick: (e) => this.clickHandler(e), class: "digi-notification-alert__close-button" }, h("span", { key: '491e27b98a6311c6a946a0c087b2312dd02bf0de', class: "digi-notification-alert__close-button__text" }, "St\u00E4ng"), h("digi-icon-x", { key: '6aba84a687b5fab08c1086a03628a3be7c9e9a30', slot: "icon-secondary", "aria-hidden": "true" }))), h("div", { key: '124516eb32cce95d50019522e808ebe0e0ccc5f8', class: "digi-notification-alert__text" }, this.afHeading &&
            this.afSize === NotificationAlertSize.LARGE && (h(this.afHeadingLevel, { key: '201565155f6d59df45b5127ce99bc7b65972d303', ref: (el) => (this._heading = el), tabindex: "-1", class: "digi-notification-alert__heading" }, this.afHeading)), h("div", { key: 'f5dc3c6c2f150b3ce472903955a4b2eae65e7f21', class: "digi-notification-alert__content" }, h("digi-typography", { key: 'e32223d898eabb4b2798e780548e6bff3fbfaf38', "af-variation": TypographyVariation.SMALL }, h("slot", { key: '7188bfa5ddbbe94832968dc9a1ae0bbd2c668e06' })))))))));
    }
    static get is() { return "digi-notification-alert"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "$": ["notification-alert.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["notification-alert.css"]
        };
    }
    static get properties() {
        return {
            "afHeading": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "The heading text"
                        }],
                    "text": "Rubrikens text"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-heading",
                "reflect": false
            },
            "afHeadingLevel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "`${NotificationAlertHeadingLevel}`",
                    "resolved": "\"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\"",
                    "references": {
                        "NotificationAlertHeadingLevel": {
                            "location": "import",
                            "path": "./notification-alert-heading-level.enum",
                            "id": "src/components/_notification/notification-alert/notification-alert-heading-level.enum.ts::NotificationAlertHeadingLevel"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set heading level. Default is 'h2'"
                        }],
                    "text": "S\u00E4tter rubrikens vikt. 'h2' \u00E4r f\u00F6rvalt."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-heading-level",
                "reflect": false,
                "defaultValue": "NotificationAlertHeadingLevel.H2"
            },
            "afSize": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "`${NotificationAlertSize}`",
                    "resolved": "\"large\" | \"medium\" | \"small\"",
                    "references": {
                        "NotificationAlertSize": {
                            "location": "import",
                            "path": "./notification-alert-size.enum",
                            "id": "src/components/_notification/notification-alert/notification-alert-size.enum.ts::NotificationAlertSize"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set size of alert notification. Can be 'small', 'medium' or 'large'."
                        }],
                    "text": "S\u00E4tter storlek. Kan vara 'small', 'medium' eller 'large'."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-size",
                "reflect": false,
                "defaultValue": "NotificationAlertSize.LARGE"
            },
            "afVariation": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "`${NotificationAlertVariation}`",
                    "resolved": "\"danger\" | \"info\" | \"success\" | \"warning\"",
                    "references": {
                        "NotificationAlertVariation": {
                            "location": "import",
                            "path": "./notification-alert-variation.enum",
                            "id": "src/components/_notification/notification-alert/notification-alert-variation.enum.ts::NotificationAlertVariation"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set variation of alert notification. Can be 'info', 'success', 'warning' or 'danger'."
                        }],
                    "text": "S\u00E4tter variant. Kan vara 'info', 'success', 'warning' eller 'danger'."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-variation",
                "reflect": false,
                "defaultValue": "NotificationAlertVariation.INFO"
            },
            "afCloseable": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "If true, the close button is added to the component"
                        }],
                    "text": "G\u00F6r det m\u00F6jligt att st\u00E4nga meddelandet med en st\u00E4ngknapp"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-closeable",
                "reflect": false,
                "defaultValue": "false"
            },
            "afCloseAriaLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Close button aria-label attribute"
                        }],
                    "text": "St\u00E4ngknappens attribut 'aria-label'"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-close-aria-label",
                "reflect": false,
                "defaultValue": "'St\u00E4ng meddelandet'"
            },
            "afId": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Label id attribute. Defaults to random string."
                        }],
                    "text": "S\u00E4tter attributet 'id'. Ges inget v\u00E4rde s\u00E5 genereras ett slumpm\u00E4ssigt."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-id",
                "reflect": false,
                "defaultValue": "randomIdGenerator('digi-notification-alert')"
            }
        };
    }
    static get events() {
        return [{
                "method": "afOnClose",
                "name": "afOnClose",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Close button's 'onclick' event"
                        }],
                    "text": "St\u00E4ngknappens 'onclick'-event"
                },
                "complexType": {
                    "original": "MouseEvent",
                    "resolved": "MouseEvent",
                    "references": {
                        "MouseEvent": {
                            "location": "global",
                            "id": "global::MouseEvent"
                        }
                    }
                }
            }, {
                "method": "afOnReady",
                "name": "afOnReady",
                "bubbles": false,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "When the component and slots are loaded and initialized this event will trigger."
                        }],
                    "text": "N\u00E4r komponenten och slotsen \u00E4r laddade och initierade s\u00E5 skickas detta eventet."
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }];
    }
    static get methods() {
        return {
            "afMGetHeadingElement": {
                "complexType": {
                    "signature": "() => Promise<any>",
                    "parameters": [],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<any>"
                },
                "docs": {
                    "text": "H\u00E4mtar en referens till rubrikelementet. Bra f\u00F6r att t.ex. s\u00E4tta fokus programmatiskt.",
                    "tags": [{
                            "name": "en",
                            "text": "Returns a reference to the heading element. Handy for setting focus programmatically."
                        }]
                }
            }
        };
    }
    static get elementRef() { return "hostElement"; }
}
