@govtechsg/sgds-web-component 3.26.1-rc.2 → 3.27.0-rc.0

package/components/Mainnav/sgds-mainnav.js

@@ -1,29 +1,13 @@
 import { __decorate } from 'tslib';
 import { provide } from '@lit/context';
-import { html, nothing } from 'lit';
-import { state, query, property, queryAssignedElements } from 'lit/decorators.js';
+import { html } from 'lit';
+import { state, property, queryAssignedElements } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
-import SgdsElement from '../../base/sgds-element.js';
-import { stopAnimations, animateTo, shimKeyframesHeightAuto } from '../../utils/animate.js';
-import { setDefaultAnimation, getAnimation } from '../../utils/animation-registry.js';
-import { SM_BREAKPOINT, MD_BREAKPOINT, LG_BREAKPOINT, XL_BREAKPOINT, XXL_BREAKPOINT } from '../../utils/breakpoints.js';
-import { waitForEvent } from '../../utils/event.js';
-import genId from '../../utils/generateId.js';
-import { watch } from '../../utils/watch.js';
-import { SgdsIconButton } from '../IconButton/sgds-icon-button.js';
+import NavElement from '../../base/nav-element.js';
+import { HasSlotController } from '../../utils/slot.js';
 import { MainnavBreakpointContext, MainnavExpandedContext } from './mainnav-context.js';
 import css_248z from './mainnav.js';
-import { HasSlotController } from '../../utils/slot.js';
 
-const SIZES = {
-    sm: SM_BREAKPOINT,
-    md: MD_BREAKPOINT,
-    lg: LG_BREAKPOINT,
-    xl: XL_BREAKPOINT,
-    xxl: XXL_BREAKPOINT,
-    never: Infinity,
-    always: -1
-};
 /**
  * @summary This component is the primary means that your users will use to navigate through your portal. It includes horizontal navigation and branding to identify your site.
  *
@@ -40,29 +24,16 @@ const SIZES = {
  * @slot non-collapsible - Elements in this slot will not be collapsed
  *
  */
-class SgdsMainnav extends SgdsElement {
+class SgdsMainnav extends NavElement {
     constructor() {
         super(...arguments);
         this._breakpointReached = false;
-        /** Indicates if mobile menu is open or closed */
-        this.expanded = false;
-        /** Denotes the transition state of mobile mainnav menu opening  */
-        this.expanding = false;
-        /** @internal Whether sgds-mainnav-profile is slotted in the profile slot */
-        this._hasProfileComponent = false;
+        this._expanded = false;
         /** Used only for SSR to indicate the presence of the `non-collapsible` slot. */
         this.hasNonCollapsibleSlot = false;
-        /** The href link for brand logo */
-        this.brandHref = "";
-        this.tone = "default";
-        this.collapseId = genId("mainnav", "collapse");
-        /** The breakpoint, below which, the Navbar will collapse. When always the Navbar will always be expanded regardless of screen size. When never, the Navbar will always be collapsed */
-        this.expand = "lg";
         /** When true, removes max-width constraint to allow content to stretch full screen width */
         this.fluid = false;
-        this.breakpointReached = false;
         this.hasSlotController = new HasSlotController(this, "non-collapsible");
-        this._handleMobileNavBound = this._handleMobileNav.bind(this);
     }
     /** @internal */
     get defaultSlotItems() {
@@ -72,145 +43,22 @@ class SgdsMainnav extends SgdsElement {
     get endSlotItems() {
         return [...(this.endNodes || [])].filter((node) => typeof node.tagName !== "undefined");
     }
-    connectedCallback() {
-        super.connectedCallback();
-        this._handleResize();
-        window.addEventListener("click", (event) => this._handleClickOutOfElement(event, this.body));
-        window.addEventListener("resize", this._handleResize.bind(this));
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        window.removeEventListener("click", (event) => this._handleClickOutOfElement(event, this.body));
-        window.removeEventListener("resize", this._handleResize.bind(this));
-    }
-    firstUpdated(changedProperties) {
-        super.firstUpdated(changedProperties);
-        if (this.breakpointReached && this.body) {
-            this.expanded = false;
-            this.body.hidden = true;
-            this._handleMobileNav();
-            this._breakpointReached = true;
-        }
-    }
     updated() {
         if (!this.hasNonCollapsibleSlot)
             this.hasNonCollapsibleSlot = this.hasSlotController.test("non-collapsible");
+        // Sync expanded state to context
+        this._expanded = this.expanded;
     }
-    _handleClickOutOfElement(e, self) {
-        if (!e.composedPath().includes(self) && !(this.header && e.composedPath().includes(this.header))) {
-            this.hide();
-        }
-    }
-    _handleSummaryClick() {
-        if (this.expanded) {
-            this.hide();
-        }
-        else {
-            document.body.style.overflow = "hidden";
-            this.show();
-        }
-    }
-    _handleResize() {
-        const newBreakpointReachedValue = window.innerWidth < SIZES[this.expand];
-        if (newBreakpointReachedValue !== this.breakpointReached) {
-            this.requestUpdate();
-        }
-        else {
-            this.body ? (this.body.hidden = true) : null;
-            // this.expanded = false;
-            this.expanding = false;
-        }
-        if (newBreakpointReachedValue) {
-            this._handleMobileNav();
-            if (!this._breakpointReached) {
-                this._breakpointReached = true;
-                window.addEventListener("scrollend", this._handleMobileNavBound);
-            }
-        }
-        else {
-            this._handleDesktopNav();
-            this._breakpointReached = false;
-            window.removeEventListener("scrollend", this._handleMobileNavBound);
-        }
-    }
-    async _handleMobileNav() {
-        if (!this.nav)
-            return;
-        this.nav.appendChild(this.body);
-        await customElements.whenDefined("sgds-masthead");
-        const { bottom } = this.nav.getBoundingClientRect();
-        const navBodyPaddingY = parseFloat(getComputedStyle(this.body).paddingTop) + parseFloat(getComputedStyle(this.body).paddingBottom);
-        this.navScroll.style.maxHeight = `calc(100dvh - ${bottom}px - ${navBodyPaddingY}px)`;
-    }
-    _handleDesktopNav() {
-        var _a;
-        (_a = this.navbar) === null || _a === void 0 ? void 0 : _a.insertBefore(this.body, this.navbarEnd);
-    }
-    async _animateToShow() {
-        const sgdsShow = this.emit("sgds-show", { cancelable: true });
-        if (sgdsShow.defaultPrevented) {
-            this.expanding = false;
-            this.expanded = false;
-            return;
-        }
-        await stopAnimations(this.body);
-        this.body.hidden = false;
-        const { keyframes, options } = getAnimation(this, "mainnav.show");
-        await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);
-        this.body.style.height = "auto";
-        this.emit("sgds-after-show");
-    }
-    async _animateToHide() {
-        const slHide = this.emit("sgds-hide", { cancelable: true });
-        if (slHide.defaultPrevented) {
-            this.expanding = false;
-            this.expanded = true;
-            return;
-        }
-        await stopAnimations(this.body);
-        const { keyframes, options } = getAnimation(this, "mainnav.hide");
-        await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);
-        this.body.hidden = true;
-        this.body.style.height = "auto";
-        this.emit("sgds-after-hide");
-    }
-    /** @internal */
-    async handleOpenChange() {
-        var _a;
-        if (this.expanding) {
-            // Show
-            await this._animateToShow();
-            this.expanded = true;
-        }
-        else {
-            (_a = this.header) === null || _a === void 0 ? void 0 : _a.focus();
-            // Hide
-            await this._animateToHide();
-            this.expanded = false;
-        }
-    }
-    /** Shows the menu. For when mainnav is in the collapsed form */
-    async show() {
-        if (this.expanded) {
-            return;
-        }
-        this.expanding = true;
-        return waitForEvent(this, "sgds-after-show");
+    _onBreakpointReached(reached) {
+        this._breakpointReached = reached;
     }
-    /** Hide the menu. For when mainnav is in the collapsed form */
-    async hide() {
-        if (!this.expanded) {
-            return;
-        }
-        this.expanding = false;
-        document.body.style.removeProperty("overflow");
-        return waitForEvent(this, "sgds-after-hide");
+    _isBreakpointReached() {
+        return this._breakpointReached;
     }
     _handleDefaultSlotChange(e) {
         const childElements = e.target.assignedElements({ flatten: true });
         childElements.forEach(el => {
             el.setAttribute("expand", this.expand);
-            el.setAttribute("tone", this.tone);
         });
         if (this._hasProfileComponent && childElements.length > 0) {
             console.warn("[sgds-mainnav] Using <sgds-mainnav-item> alongside <sgds-mainnav-profile> is not recommended. " +
@@ -218,30 +66,27 @@ class SgdsMainnav extends SgdsElement {
                 "Use a sidebar for navigation in operational apps.");
         }
     }
-    // assigning name attribute to elements added in slot="end", to use wildcard css selector to assign styles only to *-mainnav-item
     _handleSlotChange(e) {
         const childElements = e.target.assignedElements({ flatten: true });
         childElements.forEach(e => {
             e.setAttribute("name", e.tagName.toLowerCase());
             e.setAttribute("expand", this.expand);
-            e.setAttribute("tone", this.tone);
         });
     }
     _handleProfileSlotChange(e) {
         const childElements = e.target.assignedElements({ flatten: true });
-        this._hasProfileComponent = childElements.some(el => el.tagName.toLowerCase() === "sgds-mainnav-profile");
         childElements.forEach(el => {
             el.setAttribute("expand", this.expand);
-            el.setAttribute("tone", this.tone);
         });
-        if (this._hasProfileComponent && this.defaultSlotItems.length > 0) {
-            console.warn("[sgds-mainnav] Using <sgds-mainnav-item> alongside <sgds-mainnav-profile> is not recommended. " +
-                "The profile component disables the mainnav hamburger menu, so nav items will have no mobile menu. " +
-                "Use a sidebar for navigation in operational apps.");
-        }
     }
     render() {
-        this.breakpointReached = window.innerWidth < SIZES[this.expand];
+        this.breakpointReached =
+            window.innerWidth <
+                (this.expand === "always"
+                    ? -1
+                    : this.expand === "never"
+                        ? Infinity
+                        : { sm: 512, md: 768, lg: 1024, xl: 1280, xxl: 1440 }[this.expand]);
         return html `
       <nav>
         <div class="navbar ${this._expandClass()}">
@@ -260,45 +105,16 @@ class SgdsMainnav extends SgdsElement {
             </div>
           </div>
           <div class="navbar-end">
-            <slot
-              name="non-collapsible"
-              class=${classMap({ "non-collapsible-empty": !this.hasNonCollapsibleSlot })}
-            ></slot>
+            <slot name="non-collapsible" class=${classMap({ "slot-empty": !this.hasNonCollapsibleSlot })}></slot>
             <slot name="profile" @slotchange=${this._handleProfileSlotChange}></slot>
-            ${!(this._hasProfileComponent && this.breakpointReached)
-            ? html `<sgds-icon-button
-                  name=${this.expanded ? "cross" : "menu"}
-                  variant="ghost"
-                  size="sm"
-                  tone=${this.tone !== "default" ? "fixed-light" : nothing}
-                  class="navbar-toggler"
-                  @click=${this._handleSummaryClick}
-                  aria-controls="${this.collapseId}"
-                  aria-expanded="${this.expanded}"
-                  .ariaLabel=${"Toggle navigation"}
-                ></sgds-icon-button>`
-            : nothing}
+            ${this._renderToggler()}
           </div>
         </div>
       </nav>
     `;
     }
-    _expandClass() {
-        switch (this.expand) {
-            case "always":
-                return "navbar-expand";
-            case "never":
-                break;
-            default:
-                return `navbar-expand-${this.expand}`;
-        }
-    }
 }
-SgdsMainnav.styles = [...SgdsElement.styles, css_248z];
-/** @internal */
-SgdsMainnav.dependencies = {
-    "sgds-icon-button": SgdsIconButton
-};
+SgdsMainnav.styles = [...NavElement.styles, css_248z];
 __decorate([
     provide({ context: MainnavBreakpointContext }),
     state()
@@ -306,72 +122,20 @@ __decorate([
 __decorate([
     provide({ context: MainnavExpandedContext }),
     state()
-], SgdsMainnav.prototype, "expanded", void 0);
-__decorate([
-    state()
-], SgdsMainnav.prototype, "expanding", void 0);
-__decorate([
-    query("nav")
-], SgdsMainnav.prototype, "nav", void 0);
-__decorate([
-    query(".navbar")
-], SgdsMainnav.prototype, "navbar", void 0);
-__decorate([
-    query(".navbar-toggler")
-], SgdsMainnav.prototype, "header", void 0);
-__decorate([
-    query(".navbar-body")
-], SgdsMainnav.prototype, "body", void 0);
-__decorate([
-    query(".navbar-nav-scroll")
-], SgdsMainnav.prototype, "navScroll", void 0);
-__decorate([
-    query(".navbar-end")
-], SgdsMainnav.prototype, "navbarEnd", void 0);
-__decorate([
-    state()
-], SgdsMainnav.prototype, "_hasProfileComponent", void 0);
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+], SgdsMainnav.prototype, "_expanded", void 0);
 __decorate([
     property({ type: Boolean })
 ], SgdsMainnav.prototype, "hasNonCollapsibleSlot", void 0);
-__decorate([
-    property({ type: String })
-], SgdsMainnav.prototype, "brandHref", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], SgdsMainnav.prototype, "tone", void 0);
-__decorate([
-    property({ type: String })
-], SgdsMainnav.prototype, "expand", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], SgdsMainnav.prototype, "fluid", void 0);
-__decorate([
-    state()
-], SgdsMainnav.prototype, "breakpointReached", void 0);
 __decorate([
     queryAssignedElements()
 ], SgdsMainnav.prototype, "defaultNodes", void 0);
 __decorate([
     queryAssignedElements({ slot: "end" })
 ], SgdsMainnav.prototype, "endNodes", void 0);
-__decorate([
-    watch("expanding", { waitUntilFirstUpdate: true })
-], SgdsMainnav.prototype, "handleOpenChange", null);
-setDefaultAnimation("mainnav.show", {
-    keyframes: [
-        { height: "0", opacity: "0" },
-        { height: "auto", opacity: "1" }
-    ],
-    options: { duration: 200, easing: "ease-in-out" }
-});
-setDefaultAnimation("mainnav.hide", {
-    keyframes: [
-        { height: "auto", opacity: "1" },
-        { height: "0", opacity: "0" }
-    ],
-    options: { duration: 200, easing: "ease-in-out" }
-});
 
 export { SgdsMainnav, SgdsMainnav as default };
 //# sourceMappingURL=sgds-mainnav.js.map

package/components/Mainnav/sgds-mainnav.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-mainnav.js","sources":["../../../src/components/Mainnav/sgds-mainnav.ts"],"sourcesContent":["import { provide } from \"@lit/context\";\nimport { html, nothing, PropertyValueMap } from \"lit\";\nimport { property, query, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { LG_BREAKPOINT, MD_BREAKPOINT, SM_BREAKPOINT, XL_BREAKPOINT, XXL_BREAKPOINT } from \"../../utils/breakpoints\";\nimport { waitForEvent } from \"../../utils/event\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport SgdsIconButton from \"../IconButton/sgds-icon-button\";\nimport { MainnavBreakpointContext, MainnavExpandedContext } from \"./mainnav-context\";\nimport mainnavStyle from \"./mainnav.css\";\nimport SgdsMainnavDropdown from \"./sgds-mainnav-dropdown\";\nimport SgdsMainnavItem from \"./sgds-mainnav-item\";\nimport { HasSlotController } from \"../../utils/slot\";\nexport type MainnavExpandSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\" | \"always\" | \"never\";\nexport type MainnavTone = \"default\" | \"brand\" | \"gradient-1\" | \"gradient-2\" | \"gradient-3\" | \"gradient-4\";\n\nconst SIZES = {\n  sm: SM_BREAKPOINT,\n  md: MD_BREAKPOINT,\n  lg: LG_BREAKPOINT,\n  xl: XL_BREAKPOINT,\n  xxl: XXL_BREAKPOINT,\n  never: Infinity,\n  always: -1\n};\n\n/**\n * @summary This component is the primary means that your users will use to navigate through your portal. It includes horizontal navigation and branding to identify your site.\n *\n * @event sgds-show - Emitted on show. Only for collapsed menu.\n * @event sgds-after-show - Emitted on show after animation has completed. Only for collapsed menu.\n * @event sgds-hide - Emitted on hide. Only for collapsed menu.\n * @event sgds-after-hide - Emitted on hide after animation has completed. Only for collapsed menu.\n *\n * @slot default - Default slot of SgdsMainnav. Pass in SgdsMainnavItem elements here.\n * @slot start - Elements in this slot will be positioned to the left of the brand.\n * @slot end - Elements in this slot will be positioned to the right end of .navbar-nav. Elements in this slot will also be included in collapsed menu.\n * @slot brand - Brand slot of SgdsMainnav. Pass in brand logo img here\n * @slot profile - Profile slot positioned at the far right in desktop. In mobile, moves into the collapsed menu as the first item.\n * @slot non-collapsible - Elements in this slot will not be collapsed\n *\n */\nexport class SgdsMainnav extends SgdsElement {\n  static styles = [...SgdsElement.styles, mainnavStyle];\n  /** @internal */\n  static dependencies = {\n    \"sgds-icon-button\": SgdsIconButton\n  };\n\n  @provide({ context: MainnavBreakpointContext })\n  @state()\n  private _breakpointReached = false;\n  /** Indicates if mobile menu is open or closed */\n  @provide({ context: MainnavExpandedContext })\n  @state()\n  private expanded = false;\n  /** Denotes the transition state of mobile mainnav menu opening  */\n  @state()\n  private expanding = false;\n\n  @query(\"nav\") private nav: HTMLElement;\n  @query(\".navbar\") private navbar: HTMLElement;\n  @query(\".navbar-toggler\") private header: HTMLElement;\n  @query(\".navbar-body\") private body: HTMLElement;\n  @query(\".navbar-nav-scroll\") private navScroll: HTMLElement;\n  @query(\".navbar-end\") private navbarEnd: HTMLElement;\n\n  /** @internal Whether sgds-mainnav-profile is slotted in the profile slot */\n  @state()\n  private _hasProfileComponent = false;\n\n  /** Used only for SSR to indicate the presence of the `non-collapsible` slot. */\n  @property({ type: Boolean }) hasNonCollapsibleSlot = false;\n\n  /** The href link for brand logo */\n  @property({ type: String })\n  brandHref = \"\";\n\n  @property({ type: String, reflect: true })\n  tone: MainnavTone = \"default\";\n\n  private collapseId = genId(\"mainnav\", \"collapse\");\n\n  /** The breakpoint, below which, the Navbar will collapse. When always the Navbar will always be expanded regardless of screen size. When never, the Navbar will always be collapsed */\n  @property({ type: String })\n  expand: MainnavExpandSize = \"lg\";\n\n  /** When true, removes max-width constraint to allow content to stretch full screen width */\n  @property({ type: Boolean, reflect: true })\n  fluid = false;\n\n  @state()\n  private breakpointReached = false;\n\n  @queryAssignedElements() private defaultNodes!: SgdsMainnavItem[] | SgdsMainnavDropdown[];\n\n  @queryAssignedElements({ slot: \"end\" }) private endNodes!: SgdsMainnavItem[] | SgdsMainnavDropdown[];\n\n  /** @internal */\n  get defaultSlotItems(): SgdsMainnavItem[] | SgdsMainnavDropdown[] {\n    return [...(this.defaultNodes || [])].filter((node: HTMLElement) => typeof node.tagName !== \"undefined\") as\n      | SgdsMainnavItem[]\n      | SgdsMainnavDropdown[];\n  }\n\n  /** @internal */\n  get endSlotItems(): SgdsMainnavItem[] | SgdsMainnavDropdown[] {\n    return [...(this.endNodes || [])].filter((node: HTMLElement) => typeof node.tagName !== \"undefined\") as\n      | SgdsMainnavItem[]\n      | SgdsMainnavDropdown[];\n  }\n\n  private readonly hasSlotController = new HasSlotController(this, \"non-collapsible\");\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    this._handleResize();\n\n    window.addEventListener(\"click\", (event: MouseEvent) => this._handleClickOutOfElement(event, this.body));\n    window.addEventListener(\"resize\", this._handleResize.bind(this));\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    window.removeEventListener(\"click\", (event: MouseEvent) => this._handleClickOutOfElement(event, this.body));\n    window.removeEventListener(\"resize\", this._handleResize.bind(this));\n  }\n\n  firstUpdated(changedProperties: PropertyValueMap<this>) {\n    super.firstUpdated(changedProperties);\n\n    if (this.breakpointReached && this.body) {\n      this.expanded = false;\n      this.body.hidden = true;\n      this._handleMobileNav();\n      this._breakpointReached = true;\n    }\n  }\n\n  updated() {\n    if (!this.hasNonCollapsibleSlot) this.hasNonCollapsibleSlot = this.hasSlotController.test(\"non-collapsible\");\n  }\n\n  private _handleClickOutOfElement(e: MouseEvent, self: HTMLElement) {\n    if (!e.composedPath().includes(self) && !(this.header && e.composedPath().includes(this.header))) {\n      this.hide();\n    }\n  }\n\n  private _handleSummaryClick() {\n    if (this.expanded) {\n      this.hide();\n    } else {\n      document.body.style.overflow = \"hidden\";\n      this.show();\n    }\n  }\n\n  private _handleResize() {\n    const newBreakpointReachedValue = window.innerWidth < SIZES[this.expand];\n    if (newBreakpointReachedValue !== this.breakpointReached) {\n      this.requestUpdate();\n    } else {\n      this.body ? (this.body.hidden = true) : null;\n      // this.expanded = false;\n      this.expanding = false;\n    }\n\n    if (newBreakpointReachedValue) {\n      this._handleMobileNav();\n\n      if (!this._breakpointReached) {\n        this._breakpointReached = true;\n\n        window.addEventListener(\"scrollend\", this._handleMobileNavBound);\n      }\n    } else {\n      this._handleDesktopNav();\n      this._breakpointReached = false;\n      window.removeEventListener(\"scrollend\", this._handleMobileNavBound);\n    }\n  }\n\n  private _handleMobileNavBound = this._handleMobileNav.bind(this);\n\n  private async _handleMobileNav() {\n    if (!this.nav) return;\n\n    this.nav.appendChild(this.body);\n    await customElements.whenDefined(\"sgds-masthead\");\n\n    const { bottom } = this.nav.getBoundingClientRect();\n    const navBodyPaddingY =\n      parseFloat(getComputedStyle(this.body).paddingTop) + parseFloat(getComputedStyle(this.body).paddingBottom);\n\n    this.navScroll.style.maxHeight = `calc(100dvh - ${bottom}px - ${navBodyPaddingY}px)`;\n  }\n\n  private _handleDesktopNav() {\n    this.navbar?.insertBefore(this.body, this.navbarEnd);\n  }\n\n  private async _animateToShow() {\n    const sgdsShow = this.emit(\"sgds-show\", { cancelable: true });\n    if (sgdsShow.defaultPrevented) {\n      this.expanding = false;\n      this.expanded = false;\n      return;\n    }\n\n    await stopAnimations(this.body);\n    this.body.hidden = false;\n\n    const { keyframes, options } = getAnimation(this, \"mainnav.show\");\n    await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n    this.body.style.height = \"auto\";\n\n    this.emit(\"sgds-after-show\");\n  }\n\n  private async _animateToHide() {\n    const slHide = this.emit(\"sgds-hide\", { cancelable: true });\n    if (slHide.defaultPrevented) {\n      this.expanding = false;\n      this.expanded = true;\n      return;\n    }\n\n    await stopAnimations(this.body);\n\n    const { keyframes, options } = getAnimation(this, \"mainnav.hide\");\n    await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n    this.body.hidden = true;\n    this.body.style.height = \"auto\";\n    this.emit(\"sgds-after-hide\");\n  }\n  /** @internal */\n  @watch(\"expanding\", { waitUntilFirstUpdate: true })\n  async handleOpenChange() {\n    if (this.expanding) {\n      // Show\n      await this._animateToShow();\n      this.expanded = true;\n    } else {\n      this.header?.focus();\n      // Hide\n      await this._animateToHide();\n      this.expanded = false;\n    }\n  }\n\n  /** Shows the menu. For when mainnav is in the collapsed form */\n  public async show() {\n    if (this.expanded) {\n      return;\n    }\n\n    this.expanding = true;\n    return waitForEvent(this, \"sgds-after-show\");\n  }\n\n  /** Hide the menu. For when mainnav is in the collapsed form */\n  public async hide() {\n    if (!this.expanded) {\n      return;\n    }\n\n    this.expanding = false;\n    document.body.style.removeProperty(\"overflow\");\n\n    return waitForEvent(this, \"sgds-after-hide\");\n  }\n\n  private _handleDefaultSlotChange(e: Event) {\n    const childElements = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\n    childElements.forEach(el => {\n      el.setAttribute(\"expand\", this.expand);\n      el.setAttribute(\"tone\", this.tone);\n    });\n\n    if (this._hasProfileComponent && childElements.length > 0) {\n      console.warn(\n        \"[sgds-mainnav] Using <sgds-mainnav-item> alongside <sgds-mainnav-profile> is not recommended. \" +\n          \"The profile component disables the mainnav hamburger menu, so nav items will have no mobile menu. \" +\n          \"Use a sidebar for navigation in operational apps.\"\n      );\n    }\n  }\n\n  // assigning name attribute to elements added in slot=\"end\", to use wildcard css selector to assign styles only to *-mainnav-item\n  private _handleSlotChange(e: Event) {\n    const childElements = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\n    childElements.forEach(e => {\n      e.setAttribute(\"name\", e.tagName.toLowerCase());\n      e.setAttribute(\"expand\", this.expand);\n      e.setAttribute(\"tone\", this.tone);\n    });\n  }\n\n  private _handleProfileSlotChange(e: Event) {\n    const childElements = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\n    this._hasProfileComponent = childElements.some(el => el.tagName.toLowerCase() === \"sgds-mainnav-profile\");\n    childElements.forEach(el => {\n      el.setAttribute(\"expand\", this.expand);\n      el.setAttribute(\"tone\", this.tone);\n    });\n\n    if (this._hasProfileComponent && this.defaultSlotItems.length > 0) {\n      console.warn(\n        \"[sgds-mainnav] Using <sgds-mainnav-item> alongside <sgds-mainnav-profile> is not recommended. \" +\n          \"The profile component disables the mainnav hamburger menu, so nav items will have no mobile menu. \" +\n          \"Use a sidebar for navigation in operational apps.\"\n      );\n    }\n  }\n\n  render() {\n    this.breakpointReached = window.innerWidth < SIZES[this.expand];\n\n    return html`\n      <nav>\n        <div class=\"navbar ${this._expandClass()}\">\n          <slot name=\"start\"></slot>\n          <a class=\"navbar-brand\" href=${this.brandHref} aria-label=\"brand-link\">\n            <slot name=\"brand\"></slot>\n          </a>\n          <div class=\"navbar-body navbar-collapse\" id=${this.collapseId}>\n            <div class=\"navbar-nav navbar-nav-scroll\">\n              <slot @slotchange=${this._handleDefaultSlotChange}></slot>\n              <slot\n                name=\"end\"\n                class=${classMap({ \"slot-end\": !this.breakpointReached })}\n                @slotchange=${this._handleSlotChange}\n              ></slot>\n            </div>\n          </div>\n          <div class=\"navbar-end\">\n            <slot\n              name=\"non-collapsible\"\n              class=${classMap({ \"non-collapsible-empty\": !this.hasNonCollapsibleSlot })}\n            ></slot>\n            <slot name=\"profile\" @slotchange=${this._handleProfileSlotChange}></slot>\n            ${!(this._hasProfileComponent && this.breakpointReached)\n              ? html`<sgds-icon-button\n                  name=${this.expanded ? \"cross\" : \"menu\"}\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  tone=${this.tone !== \"default\" ? \"fixed-light\" : nothing}\n                  class=\"navbar-toggler\"\n                  @click=${this._handleSummaryClick}\n                  aria-controls=\"${this.collapseId}\"\n                  aria-expanded=\"${this.expanded}\"\n                  .ariaLabel=${\"Toggle navigation\"}\n                ></sgds-icon-button>`\n              : nothing}\n          </div>\n        </div>\n      </nav>\n    `;\n  }\n  _expandClass() {\n    switch (this.expand) {\n      case \"always\":\n        return \"navbar-expand\";\n      case \"never\":\n        break;\n      default:\n        return `navbar-expand-${this.expand}`;\n    }\n  }\n}\nsetDefaultAnimation(\"mainnav.show\", {\n  keyframes: [\n    { height: \"0\", opacity: \"0\" },\n    { height: \"auto\", opacity: \"1\" }\n  ],\n  options: { duration: 200, easing: \"ease-in-out\" }\n});\n\nsetDefaultAnimation(\"mainnav.hide\", {\n  keyframes: [\n    { height: \"auto\", opacity: \"1\" },\n    { height: \"0\", opacity: \"0\" }\n  ],\n  options: { duration: 200, easing: \"ease-in-out\" }\n});\n\nexport default SgdsMainnav;\n"],"names":["mainnavStyle"],"mappings":"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"}
+{"version":3,"file":"sgds-mainnav.js","sources":["../../../src/components/Mainnav/sgds-mainnav.ts"],"sourcesContent":["import { provide } from \"@lit/context\";\nimport { html } from \"lit\";\nimport { property, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport NavElement from \"../../base/nav-element\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport { MainnavBreakpointContext, MainnavExpandedContext } from \"./mainnav-context\";\nimport mainnavStyle from \"./mainnav.css\";\nimport SgdsMainnavDropdown from \"./sgds-mainnav-dropdown\";\nimport SgdsMainnavItem from \"./sgds-mainnav-item\";\n\nexport type MainnavExpandSize = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\" | \"always\" | \"never\";\n\n/**\n * @summary This component is the primary means that your users will use to navigate through your portal. It includes horizontal navigation and branding to identify your site.\n *\n * @event sgds-show - Emitted on show. Only for collapsed menu.\n * @event sgds-after-show - Emitted on show after animation has completed. Only for collapsed menu.\n * @event sgds-hide - Emitted on hide. Only for collapsed menu.\n * @event sgds-after-hide - Emitted on hide after animation has completed. Only for collapsed menu.\n *\n * @slot default - Default slot of SgdsMainnav. Pass in SgdsMainnavItem elements here.\n * @slot start - Elements in this slot will be positioned to the left of the brand.\n * @slot end - Elements in this slot will be positioned to the right end of .navbar-nav. Elements in this slot will also be included in collapsed menu.\n * @slot brand - Brand slot of SgdsMainnav. Pass in brand logo img here\n * @slot profile - Profile slot positioned at the far right in desktop. In mobile, moves into the collapsed menu as the first item.\n * @slot non-collapsible - Elements in this slot will not be collapsed\n *\n */\nexport class SgdsMainnav extends NavElement {\n  static styles = [...NavElement.styles, mainnavStyle];\n\n  @provide({ context: MainnavBreakpointContext })\n  @state()\n  private _breakpointReached = false;\n\n  @provide({ context: MainnavExpandedContext })\n  @state()\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  private _expanded = false;\n\n  /** Used only for SSR to indicate the presence of the `non-collapsible` slot. */\n  @property({ type: Boolean }) hasNonCollapsibleSlot = false;\n\n  /** When true, removes max-width constraint to allow content to stretch full screen width */\n  @property({ type: Boolean, reflect: true })\n  fluid = false;\n\n  @queryAssignedElements() private defaultNodes!: SgdsMainnavItem[] | SgdsMainnavDropdown[];\n\n  @queryAssignedElements({ slot: \"end\" }) private endNodes!: SgdsMainnavItem[] | SgdsMainnavDropdown[];\n\n  /** @internal */\n  get defaultSlotItems(): SgdsMainnavItem[] | SgdsMainnavDropdown[] {\n    return [...(this.defaultNodes || [])].filter((node: HTMLElement) => typeof node.tagName !== \"undefined\") as\n      | SgdsMainnavItem[]\n      | SgdsMainnavDropdown[];\n  }\n\n  /** @internal */\n  get endSlotItems(): SgdsMainnavItem[] | SgdsMainnavDropdown[] {\n    return [...(this.endNodes || [])].filter((node: HTMLElement) => typeof node.tagName !== \"undefined\") as\n      | SgdsMainnavItem[]\n      | SgdsMainnavDropdown[];\n  }\n\n  private readonly hasSlotController = new HasSlotController(this, \"non-collapsible\");\n\n  updated() {\n    if (!this.hasNonCollapsibleSlot) this.hasNonCollapsibleSlot = this.hasSlotController.test(\"non-collapsible\");\n    // Sync expanded state to context\n    this._expanded = this.expanded;\n  }\n\n  protected _onBreakpointReached(reached: boolean): void {\n    this._breakpointReached = reached;\n  }\n\n  protected _isBreakpointReached(): boolean {\n    return this._breakpointReached;\n  }\n\n  private _handleDefaultSlotChange(e: Event) {\n    const childElements = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\n    childElements.forEach(el => {\n      el.setAttribute(\"expand\", this.expand);\n    });\n\n    if (this._hasProfileComponent && childElements.length > 0) {\n      console.warn(\n        \"[sgds-mainnav] Using <sgds-mainnav-item> alongside <sgds-mainnav-profile> is not recommended. \" +\n          \"The profile component disables the mainnav hamburger menu, so nav items will have no mobile menu. \" +\n          \"Use a sidebar for navigation in operational apps.\"\n      );\n    }\n  }\n\n  private _handleSlotChange(e: Event) {\n    const childElements = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\n    childElements.forEach(e => {\n      e.setAttribute(\"name\", e.tagName.toLowerCase());\n      e.setAttribute(\"expand\", this.expand);\n    });\n  }\n\n  private _handleProfileSlotChange(e: Event) {\n    const childElements = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\n    childElements.forEach(el => {\n      el.setAttribute(\"expand\", this.expand);\n    });\n  }\n\n  render() {\n    this.breakpointReached =\n      window.innerWidth <\n      (this.expand === \"always\"\n        ? -1\n        : this.expand === \"never\"\n        ? Infinity\n        : { sm: 512, md: 768, lg: 1024, xl: 1280, xxl: 1440 }[this.expand]);\n\n    return html`\n      <nav>\n        <div class=\"navbar ${this._expandClass()}\">\n          <slot name=\"start\"></slot>\n          <a class=\"navbar-brand\" href=${this.brandHref} aria-label=\"brand-link\">\n            <slot name=\"brand\"></slot>\n          </a>\n          <div class=\"navbar-body navbar-collapse\" id=${this.collapseId}>\n            <div class=\"navbar-nav navbar-nav-scroll\">\n              <slot @slotchange=${this._handleDefaultSlotChange}></slot>\n              <slot\n                name=\"end\"\n                class=${classMap({ \"slot-end\": !this.breakpointReached })}\n                @slotchange=${this._handleSlotChange}\n              ></slot>\n            </div>\n          </div>\n          <div class=\"navbar-end\">\n            <slot name=\"non-collapsible\" class=${classMap({ \"slot-empty\": !this.hasNonCollapsibleSlot })}></slot>\n            <slot name=\"profile\" @slotchange=${this._handleProfileSlotChange}></slot>\n            ${this._renderToggler()}\n          </div>\n        </div>\n      </nav>\n    `;\n  }\n}\n\nexport default SgdsMainnav;\n"],"names":["mainnavStyle"],"mappings":"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"}