import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { c as createStore } from './index4.js';
import { a as arrow_right } from './arrow_right.js';

const icon = '<svg class="pn-icon-svg" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="#000" fill-rule="evenodd" d="M21.78 11.375a1 1 0 0 1 0 1.25l-4 5a1 1 0 1 1-1.56-1.25L18.92 13H7a1 1 0 1 1 0-2h11.92l-2.7-3.375a1 1 0 1 1 1.56-1.25zM11 3a3 3 0 0 1 3 3v2a1 1 0 1 1-2 0V6a1 1 0 0 0-1-1H5a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1v-2a1 1 0 1 1 2 0v2a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3V6a3 3 0 0 1 3-3z" clip-rule="evenodd"/></svg>';
const transfer = icon;

// Read more about how stencil stores work here: https://stenciljs.com/docs/stencil-store
const { state, onChange } = createStore({
    loginManager: null,
});

const pnMarketwebSiteheaderLoginLinklistCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-marketweb-siteheader-login-linklist{--login-linklist-heading-color:var(--siteheader-login-linklist-heading-color, inherit);--login-linklist-link-color:var(--siteheader-login-linklist-link-color, #005d92);--login-linklist-link-hover-color:var(--siteheader-login-linklist-link-hover-color, #0d234b);--login-linklist-button-link-color:var(--siteheader-login-linklist-button-link-color, #ffffff);--login-linklist-icon-color:var(--siteheader-login-linklist-icon-color, #005d92);--login-linklist-icon-hover-color:var(--siteheader-login-linklist-icon-hover-color, #0d234b)}pn-marketweb-siteheader-login-linklist{display:flex;flex-direction:column}.pn-marketweb-siteheader-login-linklist-heading{font-weight:500;font-size:1.6rem;margin-bottom:2.4rem;color:var(--login-linklist-heading-color)}pn-marketweb-siteheader-login-linklist strong{margin-bottom:2.4rem}pn-marketweb-siteheader-login-linklist ul{list-style-type:none;padding:0;margin:0}pn-marketweb-siteheader-login-linklist ul>li{margin-bottom:2.4rem}pn-marketweb-siteheader-login-linklist ul>li:last-of-type{margin-bottom:0}pn-marketweb-siteheader-login-linklist ul>li a{text-decoration:none;font-size:1.6rem;line-height:1.5;font-weight:500}pn-marketweb-siteheader-login-linklist ul>li a:hover{color:var(--login-linklist-button-link-color)}pn-marketweb-siteheader-login-linklist ul>li a:not(.pn-button){color:var(--login-linklist-link-color)}pn-marketweb-siteheader-login-linklist ul>li:hover a:not(.pn-button){color:var(--login-linklist-link-hover-color);text-decoration:underline}pn-marketweb-siteheader-login-linklist ul>li pn-icon{padding-left:0.8rem}pn-marketweb-siteheader-login-linklist ul>li pn-icon svg>path{fill:var(--login-linklist-icon-color) !important}pn-marketweb-siteheader-login-linklist ul>li:hover pn-icon svg>path{fill:var(--login-linklist-icon-hover-color) !important}";
const PnMarketwebSiteheaderLoginLinklistStyle0 = pnMarketwebSiteheaderLoginLinklistCss;

const PnMarketwebSiteheaderLoginLinklist = /*@__PURE__*/ proxyCustomElement(class PnMarketwebSiteheaderLoginLinklist extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.heading = null;
        this.links = [];
        this.idNamespace = '';
        this.showUnifiedLogin = false;
    }
    get hostElement() { return this; }
    componentWillLoad() { }
    uniqueId(text) {
        return 'loginlink-' + text.replace(/[^A-Za-z0-9.\\\/]/gim, '') + '-' + this.idNamespace;
    }
    linkAppearanceAttributes(link) {
        let attributes = {};
        if (link.linkType) {
            switch (link.linkType) {
                case 'primary':
                    attributes = {
                        appearance: '',
                        variant: '',
                    };
                    break;
                case 'secondary':
                    attributes = {
                        appearance: 'light',
                        variant: 'outlined',
                    };
                    break;
                case 'regularlink':
                default:
                    attributes = {
                        appearance: 'light',
                        variant: 'borderless',
                        icon: arrow_right,
                    };
                    break;
            }
            return attributes;
        }
        if (!link.linkType) {
            attributes = {
                appearance: link.primaryLinkApperance ? 'dark' : 'light',
            };
        }
        return attributes;
    }
    renderListAsButtons(link) {
        return (h("li", null, h("pn-button", { href: link.href, id: this.uniqueId(link.linkText), ...(link.openInNewWindow && { target: '_blank' }), ...this.linkAppearanceAttributes(link), onClick: () => {
                if (link.isLogoutLink) {
                    state.loginManager.clearUserData();
                }
            } }, link.linkText)));
    }
    renderListAsLinks(link) {
        return (h("li", null, h("a", { href: link.href, id: this.uniqueId(link.linkText), ...(link.openInNewWindow && { target: '_blank' }), onClick: () => {
                if (link.isLogoutLink) {
                    state.loginManager.clearUserData();
                }
            } }, link.linkText, link.isLogoutLink ? h("pn-icon", { icon: transfer }) : h("pn-icon", { icon: arrow_right }))));
    }
    render() {
        if (!this.links || this.links.length === 0) {
            return;
        }
        return (h(Host, null, this.heading ? h("p", { class: "pn-marketweb-siteheader-login-linklist-heading" }, this.heading) : null, h("ul", null, this.links.map(link => {
            {
                return this.showUnifiedLogin ? this.renderListAsLinks(link) : this.renderListAsButtons(link);
            }
        }))));
    }
    static get style() { return PnMarketwebSiteheaderLoginLinklistStyle0; }
}, [0, "pn-marketweb-siteheader-login-linklist", {
        "heading": [1],
        "links": [16],
        "idNamespace": [1, "id-namespace"],
        "showUnifiedLogin": [4, "show-unified-login"]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["pn-marketweb-siteheader-login-linklist"];
    components.forEach(tagName => { switch (tagName) {
        case "pn-marketweb-siteheader-login-linklist":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, PnMarketwebSiteheaderLoginLinklist);
            }
            break;
    } });
}

export { PnMarketwebSiteheaderLoginLinklist as P, defineCustomElement as d, state as s };

//# sourceMappingURL=pn-marketweb-siteheader-login-linklist2.js.map