import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-a7a720e7.js';
import { g as getBrandForegroundAppearance, x as inheritAttributes, b as onComponentRequiredPropUndefined, i as isSlotUsed, y as IC_INHERITED_ARIA, I as IcBrandForegroundEnum } from './helpers-f2ffaa7c.js';

const icNavigationButtonCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;margin-right:var(--ic-space-xs);list-style:none}:host(.in-side-menu){margin-right:0}:host::part(button){height:100%;min-height:2.5rem}:host(.in-side-menu) ::part(button){color:var(--ic-top-navigation-icon-active)}:host(.in-side-menu) ::part(button):hover{color:var(--ic-top-navigation-icon-hover);background-color:var(--ic-top-navigation-icon-hover-background)}:host(.in-side-menu) ::part(button):active{color:var(--ic-top-navigation-icon-pressed);background-color:var(--ic-top-navigation-icon-pressed-background)}:host(.in-side-menu) ::slotted(ic-badge){margin-left:var(--ic-space-xs)}";
const IcNavigationButtonStyle0 = icNavigationButtonCss;

const MUTABLE_ATTRIBUTES = [...IC_INHERITED_ARIA, "title"];
const NavigationButton = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.inheritedAttributes = {};
        this.hostMutationObserver = null;
        this.initialAppearance = getBrandForegroundAppearance();
        /**
         * The display mode.
         */
        this.mode = "navbar";
        /**
         * If `true`, the user can save the linked URL instead of navigating to it.
         */
        this.download = false;
        /**
         * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
         */
        this.theme = "inherit";
        // triggered when attributes of host element change
        this.hostMutationCallback = (mutationList) => {
            let forceComponentUpdate = false;
            mutationList.forEach(({ attributeName }) => {
                if (attributeName) {
                    const attribute = this.el.getAttribute(attributeName);
                    if (attribute && MUTABLE_ATTRIBUTES.includes(attributeName)) {
                        this.inheritedAttributes[attributeName] = attribute;
                        forceComponentUpdate = true;
                    }
                }
            });
            if (forceComponentUpdate) {
                forceUpdate(this);
            }
        };
    }
    componentWillLoad() {
        this.inheritedAttributes = inheritAttributes(this.el, MUTABLE_ATTRIBUTES);
    }
    componentDidLoad() {
        onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Navigation Button");
        this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
        this.hostMutationObserver.observe(this.el, {
            attributes: true,
        });
    }
    componentWillRender() {
        const iconEl = this.el.querySelector(`[slot="icon"]`);
        iconEl !== null && iconEl.setAttribute("viewBox", "0 0 24 24");
    }
    disconnectedCallback() {
        var _a;
        (_a = this.hostMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
    }
    navBarMenuOpenHandler() {
        this.mode = "menu";
    }
    navBarMenuCloseHandler() {
        this.mode = "navbar";
    }
    brandChangeHandler(ev) {
        this.initialAppearance = ev.detail.mode;
    }
    /**
     * Sets focus on the native `button`.
     */
    async setFocus() {
        if (this.buttonEl) {
            this.buttonEl.focus();
        }
    }
    render() {
        const { href, target, rel, download, referrerpolicy } = this;
        let label = "";
        let className = "";
        let variant = "icon";
        let appearance = this.initialAppearance;
        let size = "large";
        let fullWidth = false;
        let disableTooltip = false;
        if (this.mode === "menu") {
            label = this.label;
            variant = "tertiary";
            appearance = IcBrandForegroundEnum.Default;
            size = "medium";
            fullWidth = true;
            className = "popout-menu-button";
            disableTooltip = true;
        }
        const buttonProps = {
            variant,
            appearance,
            size,
            href,
            target,
            rel,
            download,
            referrerpolicy,
            fullWidth,
            disableTooltip,
        };
        return (h(Host, { key: 'a750cb73987d5c9d0c7bcdb6ece9807bcc688c9f', class: {
                ["in-side-menu"]: this.mode === "menu",
                [`ic-theme-${this.theme}`]: this.theme !== "inherit",
            } }, h("ic-button", Object.assign({ key: 'd55eb3e8c54c6bb76e61044af2a5b1a2dddafbf6', class: className, "aria-label": variant == "icon" ? this.label : null, ref: (el) => (this.buttonEl = el) }, buttonProps, this.inheritedAttributes, { monochrome: this.mode !== "menu", theme: getBrandForegroundAppearance() == "light" ? "light" : "dark" }), label, h("slot", { key: '4193d9cd02c05a3b12946233cb86256e2c729abc', slot: "left-icon", name: "icon" }), isSlotUsed(this.el, "badge") && h("slot", { key: 'a53d6158424e97fddc62b25006f6060b2cbee4c5', name: "badge" }))));
    }
    static get delegatesFocus() { return true; }
    get el() { return getElement(this); }
};
NavigationButton.style = IcNavigationButtonStyle0;

export { NavigationButton as ic_navigation_button };

//# sourceMappingURL=ic-navigation-button.entry.js.map