import { Host, h } from "@stencil/core";
import { isNestedInIfxComponent } from "../..//shared/utils/dom-utils";
import { detectFramework } from "../..//shared/utils/framework-detection";
import { trackComponent } from "../../shared/utils/tracking";
export class Notification {
    el;
    /** Icon to display in the notification. */
    icon;
    /** Visual style of the notification (e.g. success, error). */
    variant = "success";
    /** Text for the optional action link. */
    linkText;
    /** URL the notification link should navigate to. */
    linkHref;
    /** Where to open the link (same tab, new tab, etc.). */
    linkTarget = "_blank";
    async componentDidLoad() {
        if (!isNestedInIfxComponent(this.el)) {
            const framework = detectFramework();
            trackComponent("ifx-notification", await framework);
        }
    }
    getClassName() {
        switch (this.variant) {
            case "success":
                return "ifx-notification__wrapper--success";
            case "locked":
                return "ifx-notification__wrapper--locked";
            case "error":
                return "ifx-notification__wrapper--error";
            case "neutral":
                return "ifx-notification__wrapper--neutral";
            default:
                return "ifx-notification__wrapper--success";
        }
    }
    render() {
        return (h(Host, { key: '639e4e57f82a683329109c5d8d92ca1e1208d53c' }, h("div", { key: '6ee39a684b391ba39c76e0d2a97844f7ac80267b', class: "ifx-notification__wrapper " + this.getClassName() }, h("div", { key: '423762970fd3da912776ca8544ae07af3093383f', class: "ifx-notification__icon" }, h("ifx-icon", { key: '166cd01e6e0949f1b07213ce73d78fe5a64c1877', icon: this.icon })), h("div", { key: 'acb811f46e5ff8d6aa7a8e1d476882ab5b800f49', class: "ifx-notification__body" }, h("div", { key: 'fe2788d80c72477fa933fd31621416675e10c99d', class: "ifx-notification__slot" }, h("slot", { key: '49799ed83313157ef21b2cddadb92ac54147ea2d' })), this.linkText && this.linkHref && (h("div", { key: '20df178bf642167583a9fec45605030ae5941352', class: "ifx-notification__link" }, h("ifx-link", { key: '3316fec443320be7a4d893e086c4ca4dd66f1852', href: this.linkHref, target: this.linkTarget }, this.linkText, h("ifx-icon", { key: '630a2531e399af39e0c1bfa745605a49c05efa2f', icon: "arrow-right-16" }))))))));
    }
    static get is() { return "ifx-notification"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["notification.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["notification.css"]
        };
    }
    static get properties() {
        return {
            "icon": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Icon to display in the notification."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "icon"
            },
            "variant": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "NotificationVariant",
                    "resolved": "\"error\" | \"locked\" | \"neutral\" | \"success\"",
                    "references": {
                        "NotificationVariant": {
                            "location": "local",
                            "path": "/home/runner/work/infineon-design-system-stencil/infineon-design-system-stencil/packages/components/src/components/notification/notification.tsx",
                            "id": "src/components/notification/notification.tsx::NotificationVariant"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Visual style of the notification (e.g. success, error)."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "variant",
                "defaultValue": "\"success\""
            },
            "linkText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Text for the optional action link."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "link-text"
            },
            "linkHref": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "URL the notification link should navigate to."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "link-href"
            },
            "linkTarget": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Where to open the link (same tab, new tab, etc.)."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "link-target",
                "defaultValue": "\"_blank\""
            }
        };
    }
    static get elementRef() { return "el"; }
}
