'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-d337cd8a.js');
const helpers = require('./helpers-81cd6930.js');
const chevronIcon = require('./chevron-icon-3bf07531.js');
const OpenInNew = require('./OpenInNew-d5d30e77.js');
require('./constants-4d389abc.js');

const icNavigationItemCss = "/*! 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;--navigation-link-colour:var(--ic-brand-text-color)}:host(:focus-within){z-index:var(--ic-z-index-navigation-item)}svg{width:var(--ic-space-xl);fill:var(--ic-brand-text-color)}.svg{margin-left:auto}.chevron-container svg,.chevron-container .svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.chevron-container{flex-grow:1}:host(.expandable.navigation-item) .link,:host(.expandable.navigation-item) ::slotted(a){padding-right:0}:host(.navigation-item) .link,:host(.navigation-item) ::slotted(a){height:calc(100% - var(--ic-space-xxs));width:-moz-fit-content;width:fit-content;color:var(--navigation-link-colour);display:flex;align-items:center;justify-content:center;padding:0 var(--ic-space-md) var(--ic-space-xxs);text-decoration:none;transition:var(--ic-easing-transition-fast);position:relative;white-space:nowrap;--ic-typography-color:var(--navigation-link-colour)}:host(.navigation-item) ::slotted(a){height:100%;font:var(--ic-font-label) !important;letter-spacing:var(--ic-font-letter-spacing-0pt025) !important;padding:0 var(--ic-space-md) !important}:host(.navigation-item-selected) .link::after,:host(.navigation-item-selected) ::slotted(a.active)::after,:host(.navigation-item-top-nav) ::slotted(a.active)::after{content:\"\";height:0.25rem;width:100%;position:absolute;bottom:0;background-color:var(--ic-top-navigation-theme)}:host(.navigation-item-selected.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-selected.navigation-item-page-header) .link::after,:host(.navigation-item.navigation-item-page-header) ::slotted(a.active)::after,:host(.navigation-item-top-nav-child) ::slotted(a.active)::after{content:none}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){box-shadow:none}:host(.navigation-item) .link:hover:not(:focus){background-color:var(--ic-brand-hover);cursor:pointer}:host(.navigation-item:not(.navigation-item-page-header,.navigation-item-side-menu,.navigation-item-top-nav-child)) ::slotted(a:hover:not(:focus)),:host(.navigation-item-side-nav.navigation-item) .link:hover:not(:focus){background-color:var(--ic-brand-hover) !important}:host(.navigation-item:not(.navigation-item-top-nav-child,.navigation-item-side-menu,.navigation-item-top-nav-child-selected .navigation-item-side-menu-selected)) .focus-indicator:focus-within{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius)}:host(.navigation-item) .link:focus,:host(.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);outline-offset:calc(-1 * (var(--ic-space-xxxs) + var(--ic-space-1px) / 2))}:host(.navigation-item-selected) .link:focus,:host(.navigation-item) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);outline:var(--ic-hc-focus-outline);outline-offset:calc(-1 * (var(--ic-space-xxxs) + var(--ic-space-1px) / 2))}:host(.navigation-item) .link:active:not(:focus),:host(.navigation-item) ::slotted(a:active:not(:focus)){background-color:var(--ic-brand-active)}:host(.navigation-item-side-menu) .link,:host(.navigation-item-side-menu) ::slotted(a){min-height:2.5rem;height:auto;width:100%;box-sizing:border-box;color:var(--ic-top-navigation-nav-item);--ic-typography-color:var(--ic-top-navigation-nav-item);display:flex;align-items:center;justify-content:flex-start;text-decoration:none;text-wrap:wrap;white-space:normal;transition:box-shadow var(--ic-transition-duration-fast),\n    border-radius var(--ic-transition-duration-fast)}:host(.navigation-item-top-nav-child) ::slotted(svg),:host(.navigation-item-side-menu) ::slotted(svg),:host(.navigation-item-page-header) ::slotted(svg){fill:var(--ic-color-text-primary)}:host(.navigation-item-side-menu) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important;transition:box-shadow var(--ic-easing-transition-fast),\n    background-color var(--ic-easing-transition-fast)}:host(.navigation-item-side-menu) .link:hover:not(:focus){background-color:var(--ic-top-navigation-nav-item-hover)}:host(.navigation-item-side-menu) ::slotted(a:hover:not(:focus)){background-color:var(--ic-top-navigation-nav-item-hover) !important}:host(.navigation-item-side-menu) .focus-indicator:focus-within{box-shadow:none}:host(.navigation-item-side-menu) .link:focus,:host(.navigation-item-side-menu) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset) !important;width:auto;border-radius:var(--ic-border-radius-inset) !important}:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu-selected) ::slotted(a){transition:box-shadow var(--ic-easing-transition-slow),\n    background-color var(--ic-easing-transition-slow)}:host(.navigation-item-side-menu-selected) .link:focus,:host(.navigation-item-side-menu) ::slotted(a.active:focus),:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){margin-left:var(--ic-space-xs) !important;padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child) .link,:host(.navigation-item-top-nav-child) ::slotted(a){height:2.5rem;width:calc(100% - var(--ic-space-xl));min-width:9.063rem;color:var(--ic-top-navigation-nav-item);display:flex;align-items:center;justify-content:flex-start;padding:0 var(--ic-space-md) !important;text-decoration:none;position:relative;transition:box-shadow var(--ic-transition-duration-fast),\n    border-radius var(--ic-transition-duration-slow);--ic-typography-color:var(--ic-color-text-primary)}:host(.navigation-item-top-nav-child) ::slotted(a){font:var(--ic-font-body) !important;letter-spacing:var(--ic-font-letter-spacing-0pt005) !important}:host(.navigation-item-top-nav-child) .link:hover:not(:focus),:host(.navigation-item-top-nav-child) ::slotted(a:hover:not(:focus)){background-color:var(--ic-top-navigation-nav-item-hover) !important}:host(.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-top-nav-child) ::slotted(a:focus){z-index:1;outline:var(--ic-hc-focus-outline);border-radius:var(--ic-border-radius-inset);box-shadow:var(--ic-border-focus-inset);transition:border-radius 0s, box-shadow var(--ic-transition-duration-fast)}:host(.navigation-item-top-nav-child) ::slotted(a.active:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset)}:host(.navigation-item-side-menu) .link:active:not(:focus){background-color:var(--ic-top-navigation-nav-item-pressed)}:host(.navigation-item-top-nav-child) .link:active:not(:focus),:host(.navigation-item-top-nav-child) ::slotted(a:active:not(:focus)){outline:var(--ic-hc-focus-outline);background-color:var(--ic-top-navigation-nav-item-pressed)}:host(.navigation-item-top-nav-child) ::slotted(a:active:not(:focus)),:host(.navigation-item-side-menu) ::slotted(a:active:not(:focus)){background-color:var(--ic-top-navigation-nav-item-pressed) !important}:host(.navigation-item-side-menu-selected) *,:host(.navigation-item-top-nav-child-selected) *,:host(.navigation-item-side-menu) ::slotted(a.active),:host(.navigation-item-top-nav-child) ::slotted(a.active){font-weight:700 !important}:host(.navigation-item-top-nav-child) ::slotted(a.active)::before,:host(.navigation-item-top-nav-child-selected) .link::before,:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{content:\"\";position:absolute;left:0;width:var(--ic-space-xs);height:inherit;min-height:2.5rem;background-color:var(--ic-top-navigation-nav-item-banner);transition:left 0s}:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu-selected) .link:focus::before{margin-top:var(--ic-space-xxs)}:host(.navigation-item-top-nav-child-selected) .link:focus{margin-left:var(--ic-space-xs);margin-right:calc(-1 * var(--ic-space-xs));padding-left:var(--ic-space-xs) !important}:host(.navigation-item-top-nav-child-selected) .link:focus::before{left:calc(-1 * var(--ic-space-xs));z-index:1}:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before{z-index:1}:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before,:host(.navigation-item-top-nav-child) ::slotted(a.active:focus)::before{left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-side-menu-selected) .link::after{display:none}:host(.navigation-item-side-nav-collapsed) .link{height:100%}:host(.navigation-item-side-nav-collapsed) ::slotted(svg),:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(svg){margin:auto;pointer-events:none}:host(.navigation-item-side-nav-collapsed) .icon,:host(.navigation-item-side-nav-collapsed-with-label) .icon,:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{align-items:center;padding:0;margin:auto 0;width:-moz-fit-content;width:fit-content;pointer-events:none}:host(.navigation-item-side-nav-collapsed-with-label) ic-typography{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:center}:host(.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:flex;flex-direction:column;height:-moz-fit-content;height:fit-content;padding:var(--ic-space-xs) !important;gap:var(--ic-space-xxs)}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){height:auto !important;gap:0;width:auto;padding:var(--ic-space-xs) !important}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block;text-align:center}:host(.navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link ic-typography{opacity:1;min-width:-moz-min-content;min-width:min-content}:host(.navigation-item-side-nav-collapsed) svg,:host(.navigation-item-side-nav-collapsed-with-label) svg{display:none}::slotted(svg){fill:var(--ic-brand-text-color);height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-md)}.icon{height:1.5rem;width:var(--ic-space-xxl);margin-left:calc(-1 * var(--ic-space-md));flex:0 1 0%;position:relative}.icon>::slotted(*){margin-left:var(--ic-space-md) !important;margin-right:var(--ic-space-xs)}.inline-badge{margin-left:var(--ic-space-xs)}.badge{margin-left:0}:host(.navigation-item-side-nav-collapsed) .icon>::slotted(*){margin:auto !important}:host(.navigation-item-side-nav) .icon>::slotted(*){margin-right:0}:host(.navigation-item-side-nav) .link,:host(.navigation-item-side-nav) ::slotted(a){height:var(--navigation-item-height, 4rem);min-height:var(--navigation-item-min-height);width:var(--navigation-item-width, auto);justify-content:var(--navigation-item-justify-content);display:flex;gap:var(--ic-space-xs);box-sizing:border-box;color:var(--navigation-item-child-color) !important;text-decoration:none !important;white-space:nowrap;padding:0 var(--ic-space-md);text-wrap:wrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a){height:var(--navigation-item-child-height);width:var(--navigation-group-width);color:var(--navigation-item-child-color) !important;display:flex;gap:0.625rem;box-sizing:border-box;min-width:0;transition:box-shadow var(--ic-easing-transition-fast);text-decoration:none !important;white-space:nowrap}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:focus){box-shadow:var(--ic-border-focus-dark)}:host(.navigation-item-side-nav.navigation-item-side-menu) .link:active{background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link:active,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a:active){background-color:var(--navigation-item-child-active)}:host(.navigation-item-side-nav) a.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) a.link ic-typography,:host(.navigation-item-side-nav) div.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) div.link ic-typography,.navigation-item-side-nav-slotted-text{opacity:var(--navigation-item-label-opacity);transition:opacity var(--ic-easing-transition-slow);white-space:wrap;text-overflow:ellipsis;overflow:hidden}:host(.navigation-item-side-nav.navigation-item-selected) .link,:host(.navigation-item-side-nav.navigation-item) ::slotted(a.active){box-shadow:inset 0.313rem 0 0 var(--ic-brand-text-color)}:host(.navigation-item-side-nav.navigation-item-selected) .link::before,:host(.navigation-item-side-nav) ::slotted(a.active)::before{content:\"\";display:block;position:absolute;inset:0 0 0 0.313rem;border-radius:0.688rem !important;transition:var(--ic-easing-transition-slow)}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus::before,:host(.navigation-item-side-nav) ::slotted(a.active:focus)::before{box-shadow:var(--ic-border-focus-inset)}:host(:not(.navigation-item-side-nav-collapsed).navigation-item-side-nav.navigation-item-side-nav-collapsed-with-label) .link{opacity:var(--navigation-item-label-opacity);height:auto}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) .link,:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){min-width:var(--navigation-group-item-min-width);padding:var(--ic-space-xs) !important;height:auto;gap:0}:host(.navigation-item-top-nav-child.navigation-item-side-nav-collapsed-with-label) ::slotted(a){display:block}:host(.navigation-item-side-nav.navigation-item-selected) .link::after,:host(.navigation-item-side-nav) ::slotted(a.active)::after{display:none}:host(.navigation-item-side-nav.navigation-item) .link:focus,:host(.navigation-item-side-nav.navigation-item) ::slotted(a:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);background-color:transparent}:host(.navigation-item-side-nav.navigation-item-selected) .link:focus,:host(.navigation-item-side-nav) ::slotted(a.active:focus){margin:0 auto;box-shadow:inset 0.313rem 0 0 var(--ic-brand-text-color);border-radius:0}:host(.navigation-item-page-header).link,:host(.navigation-item-page-header) a,:host(.navigation-item-page-header) ::slotted(a){height:2.5rem !important;color:var(--ic-color-text-primary) !important;transition:all var(--ic-easing-transition-fast) !important;box-shadow:rgba(23 89 188 / 0%) !important}:host(.navigation-item-page-header.navigation-item-selected) .link::after,:host(.navigation-item-page-header) ::slotted(a.active)::after{content:\" \" !important;position:absolute;bottom:0;left:0;right:0;height:var(--ic-space-xxs);background-color:var(--ic-action-default) !important}:host(.navigation-item-page-header) .link:hover,:host(.navigation-item-page-header) ::slotted(.link:hover),:host(.navigation-item-page-header) ::slotted(a:hover),:host(.navigation-item-page-header) .link:hover:not(:focus){background-color:var(--ic-action-default-bg-hover) !important;cursor:pointer}:host(.navigation-item-page-header) .link:focus,:host(.navigation-item-page-header) ::slotted(a:focus){box-shadow:var(--ic-border-focus)}:host(.navigation-item-page-header) .link:active,:host(.navigation-item-page-header) ::slotted(a:active){background-color:var(--ic-action-default-bg-pressed) !important}:host(.navigation-item-page-header.navigation-item-selected) .link:focus::after,:host(.navigation-item-page-header) ::slotted(a.active:focus)::after{border-bottom-left-radius:var(--ic-border-radius);border-bottom-right-radius:var(--ic-border-radius)}:host(.navigation-item-page-header.navigation-item-selected.with-transition) .link,:host(.navigation-item-page-header.navigation-item-selected.with-transition) ::slotted(a.active){transition:all var(--ic-easing-transition-fast),\n    border-color var(--ic-transition-duration-fast)}:host(.navigation-item-page-header) ::slotted(a.active)::before,:host(.navigation-item-page-header) ::slotted(a.active:focus)::before,:host(.navigation-item-page-header.navigation-item-selected) .link:focus::before{display:none}.open-in-new-icon{flex:1}.open-in-new-icon svg{margin-top:var(--ic-space-xxs);padding-left:var(--ic-space-xs)}:host(.navigation-item-side-nav) .open-in-new-icon{margin-left:calc(-1 * var(--ic-space-xs))}:host(.navigation-item-top-nav) .open-in-new-icon svg,:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-side-nav) .open-in-new-icon svg{height:0.875rem;width:0.875rem}:host(.navigation-item-side-menu) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg{height:var(--ic-space-md);width:var(--ic-space-md)}:host(.navigation-item-page-header) .open-in-new-icon svg,:host(.navigation-item-top-nav-child) .open-in-new-icon svg,:host(.navigation-item-side-menu) .open-in-new-icon svg{fill:var(--ic-color-text-primary)}@media (forced-colors: active){.open-in-new-icon svg{fill:currentcolor}}@media (prefers-reduced-motion: reduce){:host(.navigation-item) .link,:host(.navigation-item) ::slotted(a),:host(.navigation-item-side-menu) .link,:host(.navigation-item-side-menu) ::slotted(a),:host(.navigation-item-side-menu-selected) .link,:host(.navigation-item-side-menu-selected) ::slotted(a),:host(.navigation-item-top-nav-child) .link,:host(.navigation-item-top-nav-child) ::slotted(a),:host(.navigation-item-top-nav-child) .link:focus,:host(.navigation-item-top-nav-child) ::slotted(a:focus),:host(.navigation-item-top-nav-child) ::slotted(a.active)::before,:host(.navigation-item-top-nav-child-selected) .link::before,:host(.navigation-item-side-menu-selected) .link::before,:host(.navigation-item-side-menu) ::slotted(a.active)::before,:host(.navigation-item-side-menu-selected) .link:focus::before,:host(.navigation-item-side-menu) ::slotted(a.active:focus)::before,:host(.navigation-item-side-nav.navigation-item-top-nav-child) .link,:host(.navigation-item-side-nav.navigation-item-top-nav-child) ::slotted(a),:host(.navigation-item-side-nav) a.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) a.link ic-typography,:host(.navigation-item-side-nav) div.link ic-typography,:host(.navigation-item-side-nav.navigation-item-top-nav-child) div.link ic-typography,.navigation-item-side-nav-slotted-text,:host(.navigation-item-side-nav.navigation-item-selected) .link::before,:host(.navigation-item-side-nav) ::slotted(a.active)::before,:host(.navigation-item-page-header).link,:host(.navigation-item-page-header) a,:host(.navigation-item-page-header) ::slotted(a),:host(.navigation-item-page-header.navigation-item-selected.with-transition) .link,:host(.navigation-item-page-header.navigation-item-selected.with-transition) ::slotted(a.active){transition:none}}";
const IcNavigationItemStyle0 = icNavigationItemCss;

const NavigationItem = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.childBlur = index.createEvent(this, "childBlur", 7);
        this.navItemClicked = index.createEvent(this, "navItemClicked", 7);
        this.isInitialRender = true;
        this.hostMutationObserver = null;
        this.ANIMATION_DURATION = window.matchMedia("(prefers-reduced-motion: reduce)").matches
            ? 0
            : parseInt(helpers.getCssProperty("--ic-transition-duration-slow")) || 0;
        this.ARIA_LABEL_STRING = "aria-label";
        this.isInSideNav = false;
        this.deviceSize = helpers.DEVICE_SIZES.XL;
        this.focusStyle = helpers.getBrandForegroundAppearance();
        this.inTopNavSideMenu = false;
        this.isSideNavMobile = false;
        this.isTopNavChild = false;
        this.sideNavExpanded = false;
        this.ariaLabel = "";
        /**
         * @internal If `true`, the icon and label will be displayed when side navigation is collapsed.
         */
        this.collapsedIconLabel = false;
        /**
         * @internal If `true`, the navigation item will be displayed within a tooltip.
         */
        this.displayNavigationTooltip = false;
        /**
         * If `true`, the user can save the linked URL instead of navigating to it.
         */
        this.download = false;
        /**
         *  @internal If `true`, the navigation item will be expandable.
         */
        this.expandable = false;
        /**
         * The destination of the navigation item.
         */
        this.href = "";
        /**
         *  If `true`, the navigation item will be set in a selected state.
         */
        this.selected = 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";
        this.displayDefaultNavigationItem = (href, label, hreflang, target, rel, referrerpolicy, download) => {
            const variant = this.isTopNavChild || this.inTopNavSideMenu ? "body" : "label";
            const ChevronIconComponent = this.expandable && (index.h("div", { class: { svg: true }, innerHTML: chevronIcon.Chevron }));
            const slottedBadgeEl = this.el.querySelector('[slot="badge"]');
            const BadgeComponent = slottedBadgeEl && (index.h("div", { class: "inline-badge" }, index.h("slot", { name: "badge" })));
            const IconComponent = this.el.querySelector('[slot="icon"]') && (index.h("div", { class: "icon" }, index.h("slot", { name: "icon" }), this.isInSideNav && BadgeComponent));
            return href !== "" ? (index.h("a", { href: href, target: target, rel: rel, hreflang: hreflang, referrerPolicy: referrerpolicy, download: download !== false ? download : null, class: "link", ref: (el) => (this.itemEl = el), part: "link", "aria-label": this.ariaLabel ? this.ariaLabel : null }, IconComponent, index.h("ic-typography", { variant: variant }, label), target === "_blank" && (index.h("span", { class: "open-in-new-icon", innerHTML: OpenInNew.OpenInNew })), BadgeComponent, index.h("div", { class: "chevron-container" }, ChevronIconComponent))) : (index.h("div", { tabindex: "0", class: "link", ref: (el) => (this.itemEl = el) }, IconComponent, index.h("ic-typography", { variant: variant }, label), ChevronIconComponent, BadgeComponent));
        };
        this.topNavResizedHandler = ({ detail, }) => {
            var _a;
            const { size } = detail;
            if (size !== this.deviceSize) {
                this.deviceSize = size;
                this.inTopNavSideMenu =
                    size <=
                        (((_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.customMobileBreakpoint) || helpers.DEVICE_SIZES.L);
            }
        };
        this.sideNavExpandHandler = ({ detail, }) => {
            const { sideNavExpanded, sideNavMobile } = detail;
            this.sideNavExpanded = sideNavExpanded;
            this.isSideNavMobile = sideNavMobile;
            this.sideNavToggleTooltip(!sideNavExpanded && !sideNavMobile);
        };
        this.handleBlur = ({ relatedTarget }) => {
            if (relatedTarget === null ||
                relatedTarget.tagName !== "IC-NAVIGATION-ITEM") {
                this.childBlur.emit();
            }
        };
        this.handleClick = () => this.navItemClicked.emit();
        // 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 && attributeName === this.ARIA_LABEL_STRING) {
                        this.ariaLabel = attribute;
                        forceComponentUpdate = true;
                    }
                }
            });
            if (forceComponentUpdate) {
                index.forceUpdate(this);
            }
        };
        this.generateTooltipLabel = () => {
            var _a;
            if (this.label) {
                return this.label;
            }
            if (this.navigationSlot) {
                return this.navigationSlot.textContent || "";
            }
            return ((_a = this.el.children[0]) === null || _a === void 0 ? void 0 : _a.textContent) || "";
        };
        this.renderNavigationItemContent = () => {
            if (!this.label && !this.navigationSlot)
                return index.h("slot", null);
            return this.label ? (this.displayDefaultNavigationItem(this.href, this.label, this.hreflang, this.target, this.rel, this.referrerpolicy, this.download)) : (index.h("slot", { name: "navigation-item" }));
        };
        // Displays tooltip only once the collapsing animation is finished
        this.sideNavToggleTooltip = (showTooltip) => {
            var _a;
            const tooltip = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector("ic-tooltip");
            const collapsedClass = "tooltip-navigation-item-side-nav-collapsed";
            let timer;
            if (!tooltip)
                return;
            if (showTooltip) {
                tooltip.displayTooltip(false); // Hides tooltip for when mouse is hovering over icon
                timer = setTimeout(() => {
                    tooltip.classList.add(collapsedClass);
                }, this.ANIMATION_DURATION);
            }
            else {
                clearTimeout(timer);
                tooltip.classList.remove(collapsedClass);
            }
        };
    }
    navigationTypeChangeHandler() {
        this.isInSideNav = this.navigationType === "side";
    }
    disconnectedCallback() {
        var _a, _b, _c;
        if (this.isInSideNav) {
            (_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.removeEventListener("icSideNavExpanded", this.sideNavExpandHandler);
        }
        else if (this.navigationType === "top") {
            (_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.removeEventListener("icTopNavResized", this.topNavResizedHandler);
        }
        (_c = this.hostMutationObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
    }
    componentWillLoad() {
        var _a, _b, _c, _d, _e, _f;
        const { navType, parent } = helpers.getNavItemParentDetails(this.el);
        this.navigationType = navType;
        this.isInSideNav = this.navigationType === "side";
        this.parentEl = parent;
        this.deviceSize = helpers.getCurrentDeviceSize();
        this.sideNavExpanded =
            ((_a = this.parentEl) === null || _a === void 0 ? void 0 : _a.classList.contains("sm-expanded")) ||
                ((_b = this.parentEl) === null || _b === void 0 ? void 0 : _b.classList.contains("xs-menu-open")) ||
                false;
        if (this.isInSideNav) {
            (_c = this.parentEl) === null || _c === void 0 ? void 0 : _c.addEventListener("icSideNavExpanded", this.sideNavExpandHandler);
        }
        else if (this.navigationType === "top") {
            (_d = this.parentEl) === null || _d === void 0 ? void 0 : _d.addEventListener("icTopNavResized", this.topNavResizedHandler);
            if (((_e = this.el.parentElement) === null || _e === void 0 ? void 0 : _e.tagName) === "IC-NAVIGATION-GROUP")
                this.isTopNavChild = true;
            if (this.deviceSize <=
                this.parentEl.customMobileBreakpoint)
                this.inTopNavSideMenu = true;
        }
        this.navigationSlot = this.el.querySelector('[slot="navigation-item"]');
        if (this.navigationSlot) {
            this.navigationSlot.ariaLabel =
                ((_f = this.navigationSlot.textContent) === null || _f === void 0 ? void 0 : _f.trim()) || null;
        }
        if (this.el.hasAttribute(this.ARIA_LABEL_STRING)) {
            this.ariaLabel = this.el.getAttribute(this.ARIA_LABEL_STRING) || "";
        }
    }
    componentDidLoad() {
        this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
        this.hostMutationObserver.observe(this.el, {
            attributes: true,
        });
    }
    componentDidUpdate() {
        this.isInitialRender = false;
    }
    brandChangeHandler({ detail }) {
        this.focusStyle = detail.mode;
    }
    /**
     * Sets focus on the nav item.
     */
    async setFocus() {
        var _a;
        this.itemEl ? this.itemEl.focus() : (_a = this.el.querySelector("a")) === null || _a === void 0 ? void 0 : _a.focus();
    }
    render() {
        const { inTopNavSideMenu, isTopNavChild, selected, navigationType, focusStyle, isInitialRender, sideNavExpanded, displayNavigationTooltip, collapsedIconLabel, isSideNavMobile, expandable, isInSideNav, theme, } = this;
        const isTopNavChildDesktop = isTopNavChild && !inTopNavSideMenu;
        return (index.h(index.Host, { key: '0ee3b882000ebba6190009f65dbfc2aa89134e4c', class: {
                "navigation-item": true,
                "navigation-item-selected": !isTopNavChild && selected,
                "navigation-item-top-nav": !inTopNavSideMenu && navigationType === "top",
                "navigation-item-top-nav-child": isTopNavChildDesktop,
                "navigation-item-top-nav-child-selected": isTopNavChildDesktop && selected,
                "navigation-item-side-menu": inTopNavSideMenu,
                "navigation-item-side-menu-selected": inTopNavSideMenu && selected,
                "navigation-item-page-header": navigationType === "page-header",
                "navigation-item-side-nav": isInSideNav,
                "navigation-item-side-nav-collapsed": (!sideNavExpanded || displayNavigationTooltip) && isInSideNav,
                "navigation-item-side-nav-collapsed-with-label": !sideNavExpanded &&
                    isInSideNav &&
                    collapsedIconLabel &&
                    !isSideNavMobile,
                "with-transition": !isInitialRender,
                expandable,
                [focusStyle]: isTopNavChild ? isInSideNav : !inTopNavSideMenu,
                [`ic-theme-${theme}`]: theme !== "inherit",
            }, onBlur: isTopNavChildDesktop ? this.handleBlur : null, onClick: this.handleClick, "aria-current": selected ? "page" : null, role: "listitem" }, index.h("ic-tooltip", { key: '997a0efbb6d8426818e57381f5848cf37fa05ec9', label: this.generateTooltipLabel(), target: "navigation-item", placement: "right", class: {
                "tooltip-navigation-item": true,
                "tooltip-navigation-item-side-nav-collapsed": displayNavigationTooltip && isInSideNav,
                "tooltip-long-label-navigation-item-side-nav-expanded": this.el.hasAttribute("[display-navigation-tooltip = 'true']"),
            } }, this.renderNavigationItemContent())));
    }
    static get delegatesFocus() { return true; }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "navigationType": ["navigationTypeChangeHandler"]
    }; }
};
NavigationItem.style = IcNavigationItemStyle0;

exports.ic_navigation_item = NavigationItem;

//# sourceMappingURL=ic-navigation-item.cjs.entry.js.map