@govtechsg/sgds-web-component 3.13.2-rc.0 → 3.14.1-rc.0

package/components/Sidebar/sgds-sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-sidebar.js","sources":["../../../src/components/Sidebar/sgds-sidebar.ts"],"sourcesContent":["import { html, PropertyValues } from \"lit\";\nimport { property, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport sidebarStyle from \"./sidebar.css\";\n\nimport { provide } from \"@lit/context\";\nimport {\n  SidebarCollapsed,\n  SidebarActiveItem,\n  SidebarActiveGroup,\n  SidebarDrawerItems,\n  SidebarDrawerOpen\n} from \"./sidebar-context\";\nimport { watch } from \"../../utils/watch\";\nimport { SidebarElement } from \"../../base/sidebar-element\";\nimport SgdsSidebarGroup from \"./sgds-sidebar-group\";\n\n/**\n * @summary Sidebar is a collapsible navigation component that displays menu items and groups.\n * Users can expand and collapse the sidebar to save screen space while navigating through organized menu items.\n * The sidebar coordinates selection and navigation across nested items using context providers and custom events.\n *\n * Features:\n * - Collapsible state for space-saving layouts with icon-only mode\n * - Multi-level nesting (up to 3 levels) with drawer overlay for root-level groups\n * - Keyboard navigation with full ARIA support for accessibility\n * - Programmatic link navigation support with anchor elements\n * - Active item tracking and synchronized state management\n *\n * Keyboard Navigation:\n * - Arrow Up/Down: Navigate between sidebar items and groups\n * - Arrow Left/Right: Collapse/expand groups or navigate drawer overlays\n * - Enter/Space: Activate focused item or toggle group\n * - Tab: Standard focus management to interactive elements\n *\n * @slot - Insert sgds-sidebar-item, sgds-sidebar-group, and sgds-sidebar-section elements\n * @slot brandName - Insert brand/logo content in sidebar header\n *\n * @fires sgds-select - Emitted when a sidebar item or group is selected.\n *   Event detail: { activeItem: string } - name of the selected item\n *\n */\n\nconst SGDS_SIDEBAR_GROUP = \"sgds-sidebar-group\";\nexport class SgdsSidebar extends SgdsElement {\n  static styles = [...SgdsElement.styles, sidebarStyle];\n\n  /**\n   * Controls whether the sidebar is collapsed or expanded.\n   * When true, the sidebar is in collapsed state showing only icons.\n   * When false, the sidebar is expanded displaying full labels and content.\n   * Affects all child items by toggling visibility of labels and adjusting spacing.\n   * @attribute collapsed\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true }) collapsed = false;\n\n  /**\n   * The name of the currently active sidebar item or group.\n   * Reflects the selected item and allows external control of sidebar selection.\n   * Used to synchronize sidebar state with external navigation state or programmatic selection.\n   * When set, the corresponding item with matching `name` attribute will be highlighted as active.\n   * @attribute active\n   * @type {string}\n   * @default \"\"\n   */\n  @property({ type: String, reflect: true }) active = \"\";\n\n  /** @internal Tracks the currently active group and provides it via context to all child elements */\n  @provide({ context: SidebarActiveGroup })\n  @state()\n  _sidebarActiveGroup: SgdsSidebarGroup | null = null;\n\n  /** @internal Tracks the collapsed state and provides it via context to all child elements */\n  @provide({ context: SidebarCollapsed })\n  @state()\n  private _sidebarCollapsed: boolean;\n\n  /** @internal Tracks the currently active item and provides it via context to all child elements */\n  @provide({ context: SidebarActiveItem })\n  @state()\n  private _sidebarActiveItem: SidebarElement | null = null;\n\n  /** @internal Provides the list of items shown in the drawer overlay */\n  @provide({ context: SidebarDrawerItems })\n  @state()\n  private _drawerItems = [];\n\n  /** @internal Indicates whether a drawer overlay is currently open */\n  @provide({ context: SidebarDrawerOpen })\n  @state()\n  private _showDrawer = false;\n\n  /** @internal */\n  @queryAssignedElements()\n  private _defaultNodes!: SidebarElement[];\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute(\"role\", \"navigation\");\n    this.setAttribute(\"aria-label\", \"Main navigation\");\n\n    this.updateComplete.then(() => {\n      this.addItemListeners();\n      this._handleActive();\n      document.addEventListener(\"click\", this._handleClickOutOfElement);\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener(\"click\", this._handleClickOutOfElement);\n  }\n\n  @watch(\"collapsed\")\n  _handleCollapsed() {\n    this._sidebarCollapsed = this.collapsed;\n  }\n\n  /**\n   * Handles changes to the active item selection.\n   * Updates selection state and manages drawer overlay visibility based on the active item's nesting level.\n   * For root-level items with children, opens the drawer overlay.\n   * For nested items, expands parent groups and opens the appropriate drawer if needed.\n   * @private\n   * @returns {void}\n   */\n  @watch(\"_sidebarActiveItem\")\n  _handleActiveItem() {\n    if (!this._sidebarActiveItem) return;\n\n    const childLevel = this._sidebarActiveItem._childLevel;\n    this._sidebarActiveItem._selected = true;\n\n    if (childLevel === 0) {\n      // First level of navigation, check if need to open drawer or not.\n      if (this._sidebarActiveItem._childElements.length > 0) {\n        this._setNodesToDrawer(this._sidebarActiveItem as SgdsSidebarGroup);\n      } else {\n        this._revertNodesToParent();\n      }\n    } else {\n      // when nested, we will find the top level of parent\n      let parentEle = this._sidebarActiveItem.parentElement as SgdsSidebarGroup;\n\n      while (parentEle._childLevel >= 0 && parentEle.tagName.toLowerCase() === SGDS_SIDEBAR_GROUP) {\n        if (parentEle.tagName.toLowerCase() === SGDS_SIDEBAR_GROUP) {\n          if (parentEle._childLevel === 0) {\n            // when active item not in drawer, set nodes into drawer.\n            if (!parentEle.classList.contains(\"sidebar-nested-overlay\")) {\n              this._setNodesToDrawer(parentEle);\n            }\n          }\n\n          parentEle._selected = true;\n\n          parentEle._showMenu = parentEle._childLevel > 0; //setting this to true as the child is active\n          parentEle = parentEle.parentElement as SgdsSidebarGroup;\n        }\n      }\n\n      if (this._sidebarActiveGroup) {\n        this._sidebarActiveGroup._selected = true;\n      }\n    }\n  }\n\n  @watch(\"active\")\n  _handleActive() {\n    // Return early if active is empty\n    if (!this.active) {\n      this._sidebarActiveItem = null;\n      return;\n    }\n\n    this._sidebarActiveItem = this._getActiveChild();\n  }\n\n  private _getActiveChild() {\n    const findByName = (elements: SidebarElement[]): SidebarElement | null => {\n      for (const element of elements) {\n        if (element.name === this.active) {\n          return element;\n        }\n        if (element._childElements?.length) {\n          const found = findByName(element._childElements);\n          if (found) return found;\n        }\n      }\n      return null;\n    };\n\n    return findByName(this._defaultNodes);\n  }\n\n  /**\n   * Manages the drawer overlay content based on the selected parent item.\n   * If element is provided: Opens drawer for that element's children.\n   * If element is undefined: Closes drawer and reverts items to their parent.\n   * @private\n   * @param {SgdsSidebarGroup} [element] - The parent item to display in drawer. Undefined closes drawer.\n   * @returns {void}\n   */\n  private _setNodesToDrawer(element: SgdsSidebarGroup) {\n    if (!element) return;\n\n    // when there is element, we will revert the nodes of the previous active group before setting new value into the active group\n    if (this._sidebarActiveGroup && element !== this._sidebarActiveGroup) {\n      this._revertNodesToParent();\n    }\n\n    this._sidebarActiveGroup = element;\n\n    // when there is an active group set, always set new menu items\n    this._drawerItems = []; // always set to empty to prevent duplicate\n    const menuItems = this._sidebarActiveGroup.querySelectorAll(\n      \":scope > sgds-sidebar-group, :scope > sgds-sidebar-item\"\n    );\n    menuItems.forEach(e => {\n      this._drawerItems.push(e);\n    });\n  }\n\n  /**\n   * Reverts nested items back to their original parent element.\n   * Clears the drawer overlay content and updates selected attributes.\n   * Called when closing the drawer or switching to a different parent item.\n   * @private\n   * @param {SgdsSidebarItem} element - The parent item to return nodes to\n   * @returns {void}\n   */\n  private _revertNodesToParent() {\n    if (this._sidebarActiveGroup) {\n      this._drawerItems.forEach(e => {\n        this._sidebarActiveGroup.append(e);\n      });\n\n      this._drawerItems = [];\n    }\n\n    this._sidebarActiveGroup = null;\n  }\n\n  /**\n   * Attaches event listeners to all direct child sidebar items.\n   * Handles item selection events and drawer overlay state management.\n   * Manages emitting sgds-select custom events for external components.\n   * @private\n   * @returns {void}\n   */\n  private addItemListeners() {\n    const items = this.querySelectorAll(\"sgds-sidebar-item\");\n    const groups = this.querySelectorAll(SGDS_SIDEBAR_GROUP);\n    const allItems = [...items, ...groups] as SidebarElement[];\n\n    allItems.forEach(item => {\n      item.addEventListener(\"i-sgds-click\", (e: CustomEvent) => {\n        const element = e.detail.element as SidebarElement;\n\n        if (element === this._sidebarActiveGroup) {\n          // just toggle drawer\n          this._showDrawer = !this._showDrawer;\n        } else {\n          if (this.active !== element.name) {\n            this.active = element.name;\n            allItems.forEach(item => (item._selected = false));\n          }\n\n          if (element._childElements.length > 0) {\n            this._showDrawer = true;\n          } else {\n            this._showDrawer = false;\n\n            // when there is anchorLink we will trigger click to redirect and allow user to handle the navigation themselves\n            const anchorLink = item.querySelector(\":scope > a\") as HTMLAnchorElement;\n            if (anchorLink) anchorLink.click();\n          }\n\n          // Emit sgds-select event when an item is selected\n          this.emit(\"sgds-select\", { detail: { activeItem: element.name } });\n        }\n      });\n    });\n  }\n\n  /**\n   * Toggles the sidebar between collapsed and expanded states.\n   * Updates the collapsed property and emits sgds-sidebar-toggle event.\n   *\n   * @emits sgds-sidebar-toggle Emitted with detail.collapsed indicating new state\n   * @returns {void}\n   */\n  private toggleCollapsed() {\n    this.collapsed = !this.collapsed;\n  }\n\n  private _handleClickOutOfElement = (e: MouseEvent) => {\n    if (!this._sidebarActiveGroup) return;\n\n    if (!e.composedPath().includes(this)) {\n      this._showDrawer = false;\n    }\n  };\n\n  render() {\n    return html`\n      <div\n        class=${classMap({\n          sidebar: true,\n          \"sidebar--expanded\": !this._sidebarCollapsed,\n          \"sidebar--collapsed\": this._sidebarCollapsed\n        })}\n      >\n        <div class=\"sidebar-wrapper\">\n          <div class=\"sidebar-header\">\n            <div class=\"sidebar-brand-name\">\n              <slot name=\"brandName\"></slot>\n            </div>\n\n            <sgds-icon-button\n              name=${this._sidebarCollapsed ? \"sidebar-expand\" : \"sidebar-collapse\"}\n              variant=\"ghost\"\n              tone=\"neutral\"\n              size=\"sm\"\n              @click=${this.toggleCollapsed}\n              aria-label=${this._sidebarCollapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n              aria-expanded=${!this._sidebarCollapsed}\n            ></sgds-icon-button>\n          </div>\n\n          <nav class=\"sidebar-content\" role=\"navigation\" aria-label=\"Main navigation\" aria-activedescendant=${\n            this._sidebarActiveItem?.name || \"\"\n          }>\n            <slot></slot>\n          </nav>\n        </div>\n\n          <div\n            class=${classMap({\n              \"sidebar-nested-overlay\": true,\n              show: this._showDrawer\n            })}\n            role=\"dialog\"\n            aria-label=${this._sidebarActiveGroup?.title ? `Nested items for ${this._sidebarActiveGroup.title}` : \"\"}\n          >\n            ${this._drawerItems}\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsSidebar;\n"],"names":["sidebarStyle"],"mappings":"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"}
+{"version":3,"file":"sgds-sidebar.js","sources":["../../../src/components/Sidebar/sgds-sidebar.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport sidebarStyle from \"./sidebar.css\";\n\nimport { provide } from \"@lit/context\";\nimport {\n  SidebarCollapsed,\n  SidebarActiveItem,\n  SidebarActiveGroup,\n  SidebarDrawerItems,\n  SidebarDrawerOpen\n} from \"./sidebar-context\";\nimport { watch } from \"../../utils/watch\";\nimport { SidebarElement } from \"../../base/sidebar-element\";\nimport SgdsSidebarGroup from \"./sgds-sidebar-group\";\nimport SgdsIconButton from \"../IconButton/sgds-icon-button\";\nimport { SM_BREAKPOINT } from \"../../utils/breakpoints\";\n\nconst SGDS_SIDEBAR_GROUP = \"sgds-sidebar-group\";\n\n/**\n * @summary Sidebar is a collapsible navigation component that displays menu items and groups.\n * Users can expand and collapse the sidebar to save screen space while navigating through organized menu items.\n * The sidebar coordinates selection and navigation across nested items using context providers and custom events.\n *\n * Features:\n * - Collapsible state for space-saving layouts with icon-only mode\n * - Multi-level nesting (up to 3 levels) with drawer overlay for root-level groups\n * - Keyboard navigation with full ARIA support for accessibility\n * - Programmatic link navigation support with anchor elements\n * - Active item tracking and synchronized state management\n *\n * Keyboard Navigation:\n * - Arrow Up/Down: Navigate between sidebar items and groups\n * - Arrow Left/Right: Collapse/expand groups or navigate drawer overlays\n * - Enter/Space: Activate focused item or toggle group\n * - Tab: Standard focus management to interactive elements\n *\n * @slot default - Insert sgds-sidebar-item, sgds-sidebar-group, and sgds-sidebar-section elements\n * @slot top - Insert brand/logo content in sidebar header\n * @slot bottom - Insert content in sidebar footer\n *\n * @fires sgds-select - Emitted when a sidebar item or group is selected.\n *   Event detail: { activeItem: string } - name of the selected item\n *\n */\n\nexport class SgdsSidebar extends SgdsElement {\n  static styles = [...SgdsElement.styles, sidebarStyle];\n\n  static dependencies = {\n    \"sgds-icon-button\": SgdsIconButton\n  };\n  /**\n   * Controls whether the sidebar is collapsed or expanded.\n   * When true, the sidebar is in collapsed state showing only icons.\n   * When false, the sidebar is expanded displaying full labels and content.\n   * Affects all child items by toggling visibility of labels and adjusting spacing.\n   * @attribute collapsed\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true }) collapsed = false;\n\n  /**\n   * The name of the currently active sidebar item or group.\n   * Reflects the selected item and allows external control of sidebar selection.\n   * Used to synchronize sidebar state with external navigation state or programmatic selection.\n   * When set, the corresponding item with matching `name` attribute will be highlighted as active.\n   * @attribute active\n   * @type {string}\n   * @default \"\"\n   */\n  @property({ type: String, reflect: true }) active = \"\";\n\n  /** @internal Tracks the currently active group and provides it via context to all child elements */\n  @provide({ context: SidebarActiveGroup })\n  @state()\n  _sidebarActiveGroup: SgdsSidebarGroup | null = null;\n\n  /** @internal Tracks the collapsed state and provides it via context to all child elements */\n  @provide({ context: SidebarCollapsed })\n  @state()\n  private _sidebarCollapsed: boolean;\n\n  /** @internal Tracks the currently active item and provides it via context to all child elements */\n  @provide({ context: SidebarActiveItem })\n  @state()\n  private _sidebarActiveItem: SidebarElement | null = null;\n\n  /** @internal Provides the list of items shown in the drawer overlay */\n  @provide({ context: SidebarDrawerItems })\n  @state()\n  private _drawerItems = [];\n\n  /** @internal Indicates whether a drawer overlay is currently open */\n  @provide({ context: SidebarDrawerOpen })\n  @state()\n  private _showDrawer = false;\n\n  /** @internal */\n  @queryAssignedElements()\n  private _defaultNodes!: SidebarElement[];\n\n  /** @internal */\n  @state()\n  private _isMobile = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute(\"role\", \"navigation\");\n    this.setAttribute(\"aria-label\", \"Main navigation\");\n\n    this.updateComplete.then(() => {\n      this.addItemListeners();\n      this._handleActive();\n      document.addEventListener(\"click\", this._handleClickOutOfElement);\n    });\n\n    window.addEventListener(\"resize\", this._handleResize.bind(this));\n    this._handleResize();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener(\"click\", this._handleClickOutOfElement);\n    window.removeEventListener(\"resize\", this._handleResize.bind(this));\n  }\n\n  /**\n   * Watch handler for the collapsed property.\n   * Syncs the internal collapsed state with the property value.\n   * Triggers re-render and updates all child items' collapsed styling.\n   * @private\n   * @returns {void}\n   */\n  @watch(\"collapsed\")\n  _handleCollapsed() {\n    this._sidebarCollapsed = this.collapsed;\n  }\n\n  /**\n   * Handles changes to the active item selection.\n   * Updates selection state and manages drawer overlay visibility based on the active item's nesting level.\n   * For root-level items with children, opens the drawer overlay.\n   * For nested items, expands parent groups and opens the appropriate drawer if needed.\n   * @private\n   * @returns {void}\n   */\n  @watch(\"_sidebarActiveItem\")\n  _handleActiveItem() {\n    if (!this._sidebarActiveItem) return;\n\n    const childLevel = this._sidebarActiveItem._childLevel;\n    this._sidebarActiveItem._selected = true;\n\n    if (childLevel === 0) {\n      // First level of navigation, check if need to open drawer or not.\n      if (this._sidebarActiveItem._childElements.length > 0) {\n        this._setNodesToDrawer(this._sidebarActiveItem as SgdsSidebarGroup);\n      } else {\n        this._revertNodesToParent();\n      }\n    } else {\n      // when nested, we will find the top level of parent\n      let parentEle = this._sidebarActiveItem.parentElement as SgdsSidebarGroup;\n\n      while (parentEle._childLevel >= 0 && parentEle.tagName.toLowerCase() === SGDS_SIDEBAR_GROUP) {\n        if (parentEle.tagName.toLowerCase() === SGDS_SIDEBAR_GROUP) {\n          if (parentEle._childLevel === 0) {\n            // when active item not in drawer, set nodes into drawer.\n            if (!parentEle.classList.contains(\"sidebar-nested-overlay\")) {\n              this._setNodesToDrawer(parentEle);\n            }\n          }\n\n          parentEle._selected = true;\n\n          parentEle._showMenu = parentEle._childLevel > 0; //setting this to true as the child is active\n          parentEle = parentEle.parentElement as SgdsSidebarGroup;\n        }\n      }\n\n      if (this._sidebarActiveGroup) {\n        this._sidebarActiveGroup._selected = true;\n      }\n    }\n  }\n\n  /**\n   * Watch handler for the active property.\n   * Finds and sets the active item by name from the sidebar hierarchy.\n   * Clears active state when active property is empty.\n   * @private\n   * @returns {void}\n   */\n  @watch(\"active\")\n  _handleActive() {\n    // Return early if active is empty\n    if (!this.active) {\n      this._sidebarActiveItem = null;\n      return;\n    }\n\n    this._sidebarActiveItem = this._getActiveChild();\n  }\n\n  /**\n   * Recursively searches the sidebar hierarchy for an item matching the active name.\n   * Traverses through all nested levels to find the target element.\n   * Used to support programmatic selection of deeply nested items.\n   * @private\n   * @returns {SidebarElement | null} The matching sidebar element or null if not found\n   */\n  private _getActiveChild() {\n    const findByName = (elements: SidebarElement[]): SidebarElement | null => {\n      for (const element of elements) {\n        if (element.name === this.active) {\n          return element;\n        }\n        if (element._childElements?.length) {\n          const found = findByName(element._childElements);\n          if (found) return found;\n        }\n      }\n      return null;\n    };\n\n    return findByName(this._defaultNodes);\n  }\n  /**\n   * Handles window resize events to manage responsive behavior.\n   * Automatically collapses sidebar on mobile devices (width <= SM_BREAKPOINT).\n   * Expands sidebar on larger screens.\n   * @private\n   * @returns {void}\n   */ private _handleResize() {\n    const isMobile = window.innerWidth <= SM_BREAKPOINT;\n\n    if (isMobile !== this._isMobile) {\n      this._isMobile = isMobile;\n      this.collapsed = this._isMobile;\n    }\n  }\n\n  /**\n   * Manages the drawer overlay content based on the selected parent item.\n   * If element is provided: Opens drawer for that element's children.\n   * If element is undefined: Closes drawer and reverts items to their parent.\n   * @private\n   * @param {SgdsSidebarGroup} [element] - The parent item to display in drawer. Undefined closes drawer.\n   * @returns {void}\n   */\n  private _setNodesToDrawer(element: SgdsSidebarGroup) {\n    if (!element) return;\n\n    // when there is element, we will revert the nodes of the previous active group before setting new value into the active group\n    if (this._sidebarActiveGroup && element !== this._sidebarActiveGroup) {\n      this._revertNodesToParent();\n    }\n\n    this._sidebarActiveGroup = element;\n\n    // when there is an active group set, always set new menu items\n    this._drawerItems = []; // always set to empty to prevent duplicate\n    const menuItems = this._sidebarActiveGroup.querySelectorAll(\n      \":scope > sgds-sidebar-group, :scope > sgds-sidebar-item\"\n    );\n    menuItems.forEach(e => {\n      this._drawerItems.push(e);\n    });\n  }\n\n  /**\n   * Reverts nested items back to their original parent element.\n   * Clears the drawer overlay content and updates selected attributes.\n   * Called when closing the drawer or switching to a different parent item.\n   * @private\n   * @param {SgdsSidebarItem} element - The parent item to return nodes to\n   * @returns {void}\n   */\n  private _revertNodesToParent() {\n    if (this._sidebarActiveGroup) {\n      this._drawerItems.forEach(e => {\n        this._sidebarActiveGroup.append(e);\n      });\n\n      this._drawerItems = [];\n    }\n\n    this._sidebarActiveGroup = null;\n  }\n\n  /**\n   * Attaches event listeners to all direct child sidebar items.\n   * Handles item selection events and drawer overlay state management.\n   * Manages emitting sgds-select custom events for external components.\n   * @private\n   * @returns {void}\n   */\n  private addItemListeners() {\n    const items = this.querySelectorAll(\"sgds-sidebar-item\");\n    const groups = this.querySelectorAll(SGDS_SIDEBAR_GROUP);\n    const allItems = [...items, ...groups] as SidebarElement[];\n\n    allItems.forEach(item => {\n      item.addEventListener(\"i-sgds-click\", (e: CustomEvent) => {\n        const element = e.detail.element as SidebarElement;\n\n        if (element === this._sidebarActiveGroup) {\n          // just toggle drawer\n          this._showDrawer = !this._showDrawer;\n        } else {\n          if (this.active !== element.name) {\n            this.active = element.name;\n            allItems.forEach(item => (item._selected = false));\n          }\n\n          if (element._childElements.length > 0) {\n            this._showDrawer = true;\n          } else {\n            this._showDrawer = false;\n\n            // when there is anchorLink we will trigger click to redirect and allow user to handle the navigation themselves\n            const anchorLink = item.querySelector(\":scope > a\") as HTMLAnchorElement;\n            if (anchorLink) anchorLink.click();\n          }\n\n          // Emit sgds-select event when an item is selected\n          this.emit(\"sgds-select\", { detail: { activeItem: element.name } });\n        }\n      });\n    });\n  }\n\n  /**\n   * Toggles the sidebar between collapsed and expanded states.\n   * Updates the collapsed property to show/hide labels and adjust item spacing.\n   * Called when user clicks the collapse/expand button in the sidebar header.\n   * @private\n   * @returns {void}\n   */\n  private toggleCollapsed() {\n    this.collapsed = !this.collapsed;\n  }\n\n  /**\n   * Handles clicks outside the sidebar to close the drawer overlay.\n   * Closes the nested items drawer when user clicks outside the sidebar.\n   * Maintains drawer visibility when clicking within sidebar boundaries.\n   * @private\n   * @param {MouseEvent} e - The click event from the document\n   * @returns {void}\n   */\n  private _handleClickOutOfElement = (e: MouseEvent) => {\n    if (!this._sidebarActiveGroup) return;\n\n    if (!e.composedPath().includes(this)) {\n      this._showDrawer = false;\n    }\n  };\n\n  render() {\n    return html`\n      <div\n        class=${classMap({\n          sidebar: true,\n          \"sidebar--expanded\": !this._sidebarCollapsed,\n          \"sidebar--collapsed\": this._sidebarCollapsed\n        })}\n      >\n        <div class=\"sidebar-main\">\n          <div class=\"sidebar-wrapper\">\n            <div class=\"sidebar-top\">\n              <div class=\"sidebar-brand-name\">\n                <slot name=\"top\"></slot>\n              </div>\n\n              <sgds-icon-button\n                name=${this._sidebarCollapsed ? \"sidebar-expand\" : \"sidebar-collapse\"}\n                variant=\"ghost\"\n                tone=\"neutral\"\n                size=\"sm\"\n                @click=${this.toggleCollapsed}\n                aria-label=${this._sidebarCollapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n                aria-expanded=${!this._sidebarCollapsed}\n              ></sgds-icon-button>\n            </div>\n\n            <nav\n              class=\"sidebar-content\"\n              role=\"navigation\"\n              aria-label=\"Main navigation\"\n              aria-activedescendant=${this._sidebarActiveItem?.name || \"\"}\n            >\n              <slot></slot>\n            </nav>\n\n            <slot name=\"bottom\"></slot>\n          </div>\n        </div>\n\n        <div\n          class=${classMap({\n            \"sidebar-nested-overlay\": true,\n            show: this._showDrawer\n          })}\n          role=\"dialog\"\n          aria-label=${this._sidebarActiveGroup?.title ? `Nested items for ${this._sidebarActiveGroup.title}` : \"\"}\n        >\n          <sgds-icon-button\n            name=\"chevron-left\"\n            variant=\"ghost\"\n            tone=\"neutral\"\n            size=\"sm\"\n            @click=${() => (this._showDrawer = false)}\n            aria-label=${\"Close drawer\"}\n            aria-expanded=${this._showDrawer}\n          ></sgds-icon-button>\n\n          ${this._drawerItems}\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default SgdsSidebar;\n"],"names":["sidebarStyle"],"mappings":"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"}

package/components/Sidebar/sidebar-item.js

@@ -1,6 +1,6 @@
 import { css } from 'lit';
 
-var css_248z = css`.sidebar-item{border-radius:var(--sgds-border-radius-md);cursor:pointer;padding:var(--sgds-padding-xs);transition:background-color .15s ease-in-out,color .15s ease-in-out}.sidebar-item.active,.sidebar-item:hover{background-color:var(--sgds-surface-raised)}.sidebar-item:focus,.sidebar-item:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sidebar-item-label-wrapper,.sidebar-item-label-wrapper>div{align-items:center;display:flex;gap:var(--sgds-gap-xs)}.sidebar-item-label-wrapper{justify-content:space-between}.sidebar-item-label{-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;display:-webkit-box;font-size:var(--sgds-font-size-1);line-height:var(--sgds-line-height-20);max-height:calc(var(--sgds-line-height-20, 20px)*2);overflow:hidden}.sidebar-item-label.offset{margin-left:var(--sgds-margin-2-xl)}.sidebar-item-label-wrapper .sidebar-item.active{background-color:var(--sgds-surface-raised);color:var(--sgds-primary-color-default)}.sidebar-item-label-wrapper .sidebar-item-trailingIcon{align-items:center;display:flex;gap:var(--sgds-gap-2-xs)}.sidebar-item--collapsed .sidebar-item-label,.sidebar-item--collapsed .sidebar-item-trailingIcon{display:none}.sidebar-item--collapsed .sidebar-item-label-wrapper{justify-content:center}.sidebar-submenu{overflow:hidden}.sidebar-submenu>div{margin-top:-100%;opacity:0;pointer-events:none;transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard)}.sidebar-submenu.show>div{margin-top:0;opacity:1;pointer-events:auto}.sidebar-submenu--collapsed{display:none}`;
+var css_248z = css`.sidebar-item{border-radius:var(--sgds-border-radius-md);cursor:pointer;padding:var(--sgds-padding-xs);transition:background-color .15s ease-in-out,color .15s ease-in-out}.sidebar-item.active,.sidebar-item:hover{background-color:var(--sgds-bg-translucent-subtle)}.sidebar-item:focus,.sidebar-item:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sidebar-item-label-wrapper,.sidebar-item-label-wrapper>div{align-items:center;display:flex;gap:var(--sgds-gap-xs)}.sidebar-item-label-wrapper{justify-content:space-between}.sidebar-item-label{-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;display:-webkit-box;font-size:var(--sgds-font-size-1);line-height:var(--sgds-line-height-20);max-height:calc(var(--sgds-line-height-20, 20px)*2);overflow:hidden}.sidebar-item-label.offset{margin-left:var(--sgds-margin-2-xl)}.sidebar-item-label-wrapper .sidebar-item.active{background-color:var(--sgds-surface-raised);color:var(--sgds-primary-color-default)}.sidebar-item-label-wrapper .sidebar-item-trailingIcon{align-items:center;display:flex;gap:var(--sgds-gap-2-xs)}.sidebar-item--collapsed .sidebar-item-label,.sidebar-item--collapsed .sidebar-item-trailingIcon{display:none}.sidebar-item--collapsed .sidebar-item-label-wrapper{justify-content:center}.sidebar-submenu{overflow:hidden}.sidebar-submenu>div{margin-top:-100%;opacity:0;pointer-events:none;transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard)}.sidebar-submenu.show>div{margin-top:0;opacity:1;pointer-events:auto}.sidebar-submenu--collapsed{display:none}`;
 
 export { css_248z as default };
 //# sourceMappingURL=sidebar-item.js.map

package/components/Sidebar/sidebar-section.js

@@ -1,6 +1,6 @@
 import { css } from 'lit';
 
-var css_248z = css`.sidebar-section{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);display:flex;flex-direction:column;padding:var(--sgds-padding-sm) 0}.sidebar-section.no-border{border-bottom:none}.sidebar-section-label{align-items:center;border-radius:var(--sgds-border-radius-md);color:var(--sgds-label-color-subtle);cursor:pointer;display:flex;font-size:var(--sgds-font-size-0);gap:var(--sgds-gap-2-xs);line-height:var(--sgds-line-height-20);padding:var(--sgds-padding-xs)}.sidebar-section-label:hover{color:var(--sgds-label-color-default)}.sidebar-section-label:focus,.sidebar-section-label:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sidebar-section--collapsed .sidebar-section-label{height:0;margin:0;opacity:0;overflow:hidden;padding:0;pointer-events:none;width:0}.sidebar-section-content{overflow:hidden}.sidebar-section-content>div{margin-top:0;pointer-events:auto;transition:all var(--sgds-motion-duration-slow) var(--sgds-motion-easing-standard)}.sidebar-section-content.sidebar-section-content--collapsed>div{margin-top:-100%;pointer-events:none}.sidebar-section--collapsed .sidebar-section-content--collapsed>div{margin-top:0}`;
+var css_248z = css`.sidebar-section{display:flex;flex-direction:column}.sidebar-section-label{align-items:center;border-radius:var(--sgds-border-radius-md);color:var(--sgds-label-color-subtle);cursor:pointer;display:flex;font-size:var(--sgds-font-size-0);gap:var(--sgds-gap-2-xs);line-height:var(--sgds-line-height-20);padding:var(--sgds-padding-xs) var(--sgds-padding-sm)}.sidebar-section-label:hover{color:var(--sgds-label-color-default)}.sidebar-section-label:focus,.sidebar-section-label:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sidebar-section--collapsed .sidebar-section-label{height:0;margin:0;opacity:0;overflow:hidden;padding:0;pointer-events:none;width:0}.sidebar-section-content{overflow:hidden;padding:0 var(--sgds-padding-xs)}.sidebar-section-content>div{margin-top:0;pointer-events:auto;transition:all var(--sgds-motion-duration-slow) var(--sgds-motion-easing-standard)}.sidebar-section-content.sidebar-section-content--collapsed>div{margin-top:-100%;pointer-events:none}.sidebar-section--collapsed .sidebar-section-content--collapsed>div{margin-top:0}.sidebar-section-seperator{margin-bottom:var(--sgds-margin-md)}`;
 
 export { css_248z as default };
 //# sourceMappingURL=sidebar-section.js.map

package/components/Sidebar/sidebar.js

@@ -1,6 +1,6 @@
 import { css } from 'lit';
 
-var css_248z = css`.sidebar{display:flex;flex-direction:column;height:100%;position:relative;transition:width var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);z-index:1100}.sidebar--expanded{width:var(--sgds-dimension-288)}.sidebar--collapsed{width:var(--sgds-dimension-72)}.sidebar-header{align-items:center;display:flex;justify-content:space-between;padding:var(--sgds-padding-xs)}.sidebar .sidebar-brand-name{padding-left:var(--sgds-padding-xs)}.sidebar--collapsed .sidebar-brand-name{display:none}.sidebar--collapsed .sidebar-header{justify-content:center}.sidebar-wrapper{background-color:var(--sgds-bg-default);border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);height:100%;overflow-x:hidden;overflow-y:auto;position:relative;z-index:2}.sidebar-content{flex:1;overflow-y:auto;padding:0 var(--sgds-padding-xs)}.sidebar-nested-overlay{background-color:var(--sgds-bg-default);bottom:0;left:0;opacity:0;overflow-y:scroll;padding:var(--sgds-padding-md) var(--sgds-padding-xs);pointer-events:none;position:absolute;top:0;transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);transition-property:opacity left;width:var(--sgds-dimension-288);z-index:0}.sidebar-nested-overlay.show{border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);left:var(--sgds-dimension-288);opacity:1;pointer-events:auto}.sidebar--collapsed .sidebar-nested-overlay.show{left:var(--sgds-dimension-72)}.sidebar::-webkit-scrollbar{width:var(--sgds-dimension-2)}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-xs)}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--sgds-color-subtle)}`;
+var css_248z = css`.sidebar{display:flex;flex-direction:column;height:100%;position:relative;transition:width var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);z-index:1100}.sidebar--expanded{width:var(--sgds-dimension-288)}.sidebar--collapsed{width:var(--sgds-dimension-72)}.sidebar-top{align-items:center;display:flex;gap:var(--sgds-gap-md);justify-content:space-between;padding:0 var(--sgds-padding-xs)}.sidebar--collapsed .sidebar-brand-name{display:none}.sidebar--collapsed .sidebar-top{justify-content:center}.sidebar-main{background-color:var(--sgds-bg-default);border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);height:100%;overflow-x:hidden;overflow-y:auto;padding:var(--sgds-padding-lg) 0;position:relative;z-index:1}.sidebar-wrapper{display:flex;flex-direction:column;height:100%;justify-content:space-between}.sidebar-content{display:flex;flex:1;flex-direction:column;gap:var(--sgds-gap-md);overflow-y:auto}.sidebar-nested-overlay{background-color:var(--sgds-surface-raised);bottom:0;left:0;opacity:0;overflow-y:scroll;padding:var(--sgds-padding-md) var(--sgds-padding-xs);pointer-events:none;position:absolute;top:0;transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);transition-property:opacity left;width:var(--sgds-dimension-288);z-index:0}.sidebar-nested-overlay.show{border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);left:var(--sgds-dimension-288);opacity:1;pointer-events:auto}.sidebar--collapsed .sidebar-nested-overlay.show{left:var(--sgds-dimension-72)}.sidebar::-webkit-scrollbar{width:var(--sgds-dimension-2)}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-xs)}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--sgds-color-subtle)}@media only screen and (max-width:511px){.sidebar--expanded{position:absolute;width:100dvw}.sidebar-nested-overlay{left:-100dvw;width:100dvw;z-index:2}.sidebar--collapsed .sidebar-nested-overlay.show,.sidebar-nested-overlay.show{left:0}}@media only screen and (max-width:767px){.sidebar--expanded,.sidebar-nested-overlay{width:var(--sgds-dimension-256)}.sidebar-nested-overlay,.sidebar-nested-overlay.show{left:var(--sgds-dimension-256)}}`;
 
 export { css_248z as default };
 //# sourceMappingURL=sidebar.js.map

package/components/index.umd.min.js

@@ -2391,7 +2391,7 @@ const Ft=e=>e??ae;var Pt=r`:host{cursor:pointer;display:inline-block}.alert-link
           <slot id="default" @click=${this.handleSelectSlot}></slot>
         </div>
       </div>
-    `}}ji.styles=[...Ui.styles,Yi,qi],t([De({type:Boolean,reflect:!0,state:!1})],ji.prototype,"noFlip",void 0),t([De({type:Boolean,reflect:!0,state:!1})],ji.prototype,"menuAlignRight",void 0),t([De({type:String,reflect:!0,state:!1})],ji.prototype,"drop",void 0),t([Te({slot:"toggler",flatten:!0})],ji.prototype,"_toggler",void 0),t([ot("disabled",{waitUntilFirstUpdate:!0})],ji.prototype,"_handleDisabled",null);var Wi=r`:host([disabled]){cursor:not-allowed}.dropdown-item{align-items:center;background-color:var(--sgds-bg-transparent);clear:both;color:var(--sgds-color-default);cursor:pointer;display:flex;gap:var(--sgds-gap-sm);padding:var(--sgds-padding-sm) var(--sgds-padding-lg);text-align:inherit}.dropdown-item:hover{background-color:var(--sgds-bg-translucent-subtle)}.dropdown-item:focus,.dropdown-item:focus-visible{background-color:var(--sgds-bg-translucent-subtle)}.dropdown-item:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.dropdown-item.active{background-color:var(--sgds-bg-translucent-subtle);color:var(--sgds-primary-color-default);text-decoration:none}.dropdown-item.disabled,.dropdown-item:disabled{opacity:var(--sgds-opacity-50);pointer-events:none}::slotted(*){color:inherit!important;display:flex;gap:var(--sgds-gap-sm);text-decoration:none!important}::slotted(a),::slotted(sgds-checkbox){flex:1;margin:calc(var(--sgds-padding-sm)*-1) calc(var(--sgds-padding-lg)*-1);padding:var(--sgds-padding-sm) var(--sgds-padding-lg)}`;class Ki extends He{constructor(){super(...arguments),this.active=!1,this.disabled=!1}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",e=>{"Enter"===e.key&&this.anchor[0].click()}),this.setAttribute("role","menuitem"),this.setAttribute("aria-disabled",`${this.disabled}`)}render(){return te`
+    `}}ji.styles=[...Ui.styles,Yi,qi],t([De({type:Boolean,reflect:!0,state:!1})],ji.prototype,"noFlip",void 0),t([De({type:Boolean,reflect:!0,state:!1})],ji.prototype,"menuAlignRight",void 0),t([De({type:String,reflect:!0,state:!1})],ji.prototype,"drop",void 0),t([Te({slot:"toggler",flatten:!0})],ji.prototype,"_toggler",void 0),t([ot("disabled",{waitUntilFirstUpdate:!0})],ji.prototype,"_handleDisabled",null);var Wi=r`:host([disabled]){cursor:not-allowed}.dropdown-item{align-items:center;background-color:var(--sgds-bg-transparent);clear:both;color:var(--sgds-color-default);cursor:pointer;display:flex;gap:var(--sgds-gap-sm);padding:var(--sgds-padding-sm) var(--sgds-padding-lg);text-align:inherit}.dropdown-item:hover{background-color:var(--sgds-bg-translucent-subtle)}.dropdown-item:focus,.dropdown-item:focus-visible{background-color:var(--sgds-bg-translucent-subtle)}.dropdown-item:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.dropdown-item.active{background-color:var(--sgds-bg-translucent-subtle);color:var(--sgds-primary-color-default);text-decoration:none}.dropdown-item.disabled,.dropdown-item:disabled{opacity:var(--sgds-opacity-50);pointer-events:none}::slotted(*){color:inherit!important;display:flex;gap:var(--sgds-gap-sm);text-decoration:none!important}::slotted(a),::slotted(sgds-checkbox){flex:1;margin:calc(var(--sgds-padding-sm)*-1) calc(var(--sgds-padding-lg)*-1);padding:var(--sgds-padding-sm) var(--sgds-padding-lg)}.dropdown-item.mainnav-dropdown-link{padding:var(--sgds-padding-none)}.dropdown-item.mainnav-dropdown-link ::slotted(*){box-sizing:border-box;margin:auto;max-width:var(--sgds-mainnav-max-width,1440px);padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}@media screen and (min-width:1024px){.dropdown-item.mainnav-dropdown-link ::slotted(*){padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x)}}`;class Ki extends He{constructor(){super(...arguments),this.active=!1,this.disabled=!1}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",e=>{"Enter"===e.key&&this.anchor[0].click()}),this.setAttribute("role","menuitem"),this.setAttribute("aria-disabled",`${this.disabled}`)}render(){return te`
       <div
         class="dropdown-item ${Ke({disabled:this.disabled,active:this.active})}"
         tabindex=${this.disabled?"-1":"0"}
@@ -3194,7 +3194,7 @@ class fl{constructor(e,t,s,i){if(this.subscribe=!1,this.provided=!1,this.value=v
    * @license
    * Copyright 2022 Google LLC
    * SPDX-License-Identifier: BSD-3-Clause
-   */function kl({context:e,subscribe:t}){return(s,i)=>{"object"==typeof i?i.addInitializer(function(){new fl(this,{context:e,callback:e=>{s.set.call(this,e)},subscribe:t})}):s.constructor.addInitializer(s=>{new fl(s,{context:e,callback:e=>{s[i]=e},subscribe:t})})}}const _l=1024,Cl="mainnav-context",Sl="mainnav-expanded-context";var Ml=r`:host{display:block;position:relative;z-index:1200}nav{background-color:var(--sgds-surface-default);box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08)}.navbar{align-items:stretch;display:flex;flex-wrap:wrap;gap:var(--sgds-gap-xs);justify-content:space-between;margin:auto;max-width:var(--sgds-mainnav-max-width,1440px);min-height:80px;padding:0 var(--sgds-mainnav-padding-x);position:relative;width:100%}:host([fluid]) .navbar{max-width:none}@media screen and (max-width:767px){.navbar{padding:0 var(--sgds-mainnav-mobile-padding-x)}}.navbar-brand{align-items:center;display:flex;text-decoration:none;white-space:nowrap}.navbar-brand:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.navbar-nav{display:flex;flex-direction:column;height:100%;margin-bottom:0;margin-top:0;width:100%}nav>.navbar-body .navbar-nav{height:100dvh}nav>.navbar-body{background-color:var(--sgds-surface-default);border-top:var(--sgds-border-width-1) solid var(--sgds-border-color-translucent);box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08);padding:var(--sgds-padding-md) 0;position:absolute;transition:transform .2s ease-in-out;width:100%;z-index:2000}nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x)}@media screen and (max-width:767px){nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}.navbar-collapse{align-items:center;flex-basis:100%;flex-grow:1}.navbar-toggler{align-self:center}@media (prefers-reduced-motion:reduce){.navbar-toggler{transition:none}}.navbar-nav-scroll{overflow-y:auto}@media (min-width:512px){.navbar-expand-sm{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-sm .navbar-nav{flex-direction:row}.navbar-expand-sm .navbar-nav-scroll{overflow:visible}.navbar-expand-sm .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-sm .navbar-toggler{display:none}}@media (min-width:768px){.navbar-expand-md{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-md .navbar-nav{flex-direction:row}.navbar-expand-md .navbar-nav-scroll{overflow:visible}.navbar-expand-md .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-md .navbar-toggler{display:none}}@media (min-width:1024px){.navbar-expand-lg{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav-scroll{overflow:visible}.navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}}@media (min-width:1280px){.navbar-expand-xl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xl .navbar-nav{flex-direction:row}.navbar-expand-xl .navbar-nav .nav-link{padding-left:var(--mainnav-nav-link-padding-x);padding-right:var(--mainnav-nav-link-padding-x)}.navbar-expand-xl .navbar-nav-scroll{overflow:visible}.navbar-expand-xl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xl .navbar-toggler{display:none}}@media (min-width:1440px){.navbar-expand-xxl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xxl .navbar-nav{flex-direction:row}.navbar-expand-xxl .navbar-nav-scroll{overflow:visible}.navbar-expand-xxl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xxl .navbar-toggler{display:none}}.navbar-expand{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand .navbar-nav{flex-direction:row}.navbar-expand .navbar-nav-scroll{overflow:visible}.navbar-expand .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand .navbar-toggler{display:none}slot[name=non-collapsible]{align-items:center;display:flex;gap:var(--sgds-spacer-4);margin-left:auto}.slot-end{align-items:stretch;display:flex;gap:var(--sgds-gap-xs);margin-left:auto}.slot-end::slotted(:not([name$=-mainnav-item]):not([name$=-mainnav-dropdown])){align-self:center}`;const $l={sm:512,md:768,lg:_l,xl:1280,xxl:1440,never:1/0,always:-1};class Al extends He{constructor(){super(...arguments),this._breakpointReached=!1,this.expanded=!1,this.expanding=!1,this.brandHref="",this.collapseId=Ni("mainnav","collapse"),this.expand="lg",this.fluid=!1,this.breakpointReached=!1,this._handleMobileNavBound=this._handleMobileNav.bind(this)}get defaultSlotItems(){return[...this.defaultNodes||[]].filter(e=>void 0!==e.tagName)}get endSlotItems(){return[...this.endNodes||[]].filter(e=>void 0!==e.tagName)}connectedCallback(){super.connectedCallback(),this._handleResize(),window.addEventListener("click",e=>this._handleClickOutOfElement(e,this.body)),window.addEventListener("resize",this._handleResize.bind(this))}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("click",e=>this._handleClickOutOfElement(e,this.body)),window.removeEventListener("resize",this._handleResize.bind(this))}firstUpdated(e){super.firstUpdated(e),this.breakpointReached&&this.body&&(this.expanded=!1,this.body.hidden=!0,this._handleMobileNav(),this._breakpointReached=!0);[...this.defaultSlotItems,...this.endSlotItems].forEach(e=>{e.setAttribute("expand",this.expand)})}_handleClickOutOfElement(e,t){e.composedPath().includes(t)||e.composedPath().includes(this.header)||this.hide()}_handleSummaryClick(){this.expanded?this.hide():(document.querySelector("body").style.overflow="hidden",this.show())}_handleResize(){const e=window.innerWidth<$l[this.expand];e!==this.breakpointReached?this.requestUpdate():(this.body&&(this.body.hidden=!0),this.expanding=!1),e?(this._handleMobileNav(),this._breakpointReached||(this._breakpointReached=!0,window.addEventListener("scrollend",this._handleMobileNavBound))):(this._handleDesktopNav(),this._breakpointReached=!1,window.removeEventListener("scrollend",this._handleMobileNavBound))}async _handleMobileNav(){if(!this.nav)return;this.nav.appendChild(this.body),await customElements.whenDefined("sgds-masthead");const{bottom:e}=this.nav.getBoundingClientRect(),t=parseFloat(getComputedStyle(this.body).paddingTop)+parseFloat(getComputedStyle(this.body).paddingBottom);this.navScroll.style.maxHeight=`calc(100dvh - ${e}px - ${t}px)`}_handleDesktopNav(){var e;null===(e=this.navbar)||void 0===e||e.insertBefore(this.body,this.nonCollapsibleSlot)}async _animateToShow(){if(this.emit("sgds-show",{cancelable:!0}).defaultPrevented)return this.expanding=!1,void(this.expanded=!1);await Je(this.body),this.body.hidden=!1;const{keyframes:e,options:t}=st(this,"mainnav.show");await Ge(this.body,Qe(e,this.body.scrollHeight),t),this.body.style.height="auto",this.emit("sgds-after-show")}async _animateToHide(){if(this.emit("sgds-hide",{cancelable:!0}).defaultPrevented)return this.expanding=!1,void(this.expanded=!0);await Je(this.body);const{keyframes:e,options:t}=st(this,"mainnav.hide");await Ge(this.body,Qe(e,this.body.scrollHeight),t),this.body.hidden=!0,this.body.style.height="auto",this.emit("sgds-after-hide")}async handleOpenChange(){this.expanding?(await this._animateToShow(),this.expanded=!0):(this.header.focus(),await this._animateToHide(),this.expanded=!1)}async show(){if(!this.expanded)return this.expanding=!0,at(this,"sgds-after-show")}async hide(){if(this.expanded)return this.expanding=!1,document.querySelector("body").style.removeProperty("overflow"),at(this,"sgds-after-hide")}_handleSlotChange(e){e.target.assignedElements({flatten:!0}).forEach(e=>{e.setAttribute("name",e.tagName.toLowerCase())})}render(){return this.breakpointReached=window.innerWidth<$l[this.expand],te`
+   */function kl({context:e,subscribe:t}){return(s,i)=>{"object"==typeof i?i.addInitializer(function(){new fl(this,{context:e,callback:e=>{s.set.call(this,e)},subscribe:t})}):s.constructor.addInitializer(s=>{new fl(s,{context:e,callback:e=>{s[i]=e},subscribe:t})})}}const _l=1024,Cl="mainnav-context",Sl="mainnav-expanded-context";var Ml=r`:host{display:block;position:relative;z-index:1200}nav{background-color:var(--sgds-surface-default);box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08)}.navbar{align-items:stretch;display:flex;flex-wrap:wrap;gap:var(--sgds-gap-xs);justify-content:space-between;margin:auto;max-width:var(--sgds-mainnav-max-width,1440px);min-height:80px;padding:0 var(--sgds-mainnav-mobile-padding-x);position:relative;width:100%}:host([fluid]) .navbar{max-width:none}.navbar-brand{align-items:center;display:flex;text-decoration:none;white-space:nowrap}.navbar-brand:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.navbar-nav{display:flex;flex-direction:column;height:100%;margin-bottom:0;margin-top:0;width:100%}nav>.navbar-body{background-color:var(--sgds-surface-default);border-top:var(--sgds-border-width-1) solid var(--sgds-border-color-translucent);box-shadow:0 2px 2px 0 hsla(0,0%,5%,.08);padding:var(--sgds-padding-md) 0;position:absolute;transition:transform .2s ease-in-out;width:100%;z-index:2000}nav>.navbar-body .navbar-nav{height:100dvh;margin:auto;max-width:var(--sgds-mainnav-max-width,1440px)}nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x)}@media screen and (max-width:767px){nav>.navbar-body slot::slotted(:not(sgds-mainnav-item):not(sgds-mainnav-dropdown)){padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}.navbar-collapse{align-items:center;flex-basis:100%;flex-grow:1}.navbar-toggler{align-self:center}@media (prefers-reduced-motion:reduce){.navbar-toggler{transition:none}}.navbar-nav-scroll{overflow-y:auto}@media (min-width:512px){.navbar-expand-sm{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-sm .navbar-nav{flex-direction:row}.navbar-expand-sm .navbar-nav-scroll{overflow:visible}.navbar-expand-sm .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-sm .navbar-toggler{display:none}}@media (min-width:768px){.navbar-expand-md{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-md .navbar-nav{flex-direction:row}.navbar-expand-md .navbar-nav-scroll{overflow:visible}.navbar-expand-md .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-md .navbar-toggler{display:none}}@media (min-width:1024px){.navbar{padding:0 var(--sgds-mainnav-padding-x)}.navbar-expand-lg{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav-scroll{overflow:visible}.navbar-expand-lg .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}}@media (min-width:1280px){.navbar-expand-xl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xl .navbar-nav{flex-direction:row}.navbar-expand-xl .navbar-nav .nav-link{padding-left:var(--mainnav-nav-link-padding-x);padding-right:var(--mainnav-nav-link-padding-x)}.navbar-expand-xl .navbar-nav-scroll{overflow:visible}.navbar-expand-xl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xl .navbar-toggler{display:none}}@media (min-width:1440px){.navbar-expand-xxl{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand-xxl .navbar-nav{flex-direction:row}.navbar-expand-xxl .navbar-nav-scroll{overflow:visible}.navbar-expand-xxl .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand-xxl .navbar-toggler{display:none}}.navbar-expand{flex-wrap:nowrap;gap:var(--sgds-gap-xl);justify-content:flex-start}.navbar-expand .navbar-nav{flex-direction:row}.navbar-expand .navbar-nav-scroll{overflow:visible}.navbar-expand .navbar-collapse{display:flex!important;flex-basis:auto}.navbar-expand .navbar-toggler{display:none}slot[name=non-collapsible]{align-items:center;display:flex;gap:var(--sgds-spacer-4);margin-left:auto}.slot-end{align-items:stretch;display:flex;gap:var(--sgds-gap-xs);margin-left:auto}.slot-end::slotted(:not([name$=-mainnav-item]):not([name$=-mainnav-dropdown])){align-self:center}`;const $l={sm:512,md:768,lg:_l,xl:1280,xxl:1440,never:1/0,always:-1};class Al extends He{constructor(){super(...arguments),this._breakpointReached=!1,this.expanded=!1,this.expanding=!1,this.brandHref="",this.collapseId=Ni("mainnav","collapse"),this.expand="lg",this.fluid=!1,this.breakpointReached=!1,this._handleMobileNavBound=this._handleMobileNav.bind(this)}get defaultSlotItems(){return[...this.defaultNodes||[]].filter(e=>void 0!==e.tagName)}get endSlotItems(){return[...this.endNodes||[]].filter(e=>void 0!==e.tagName)}connectedCallback(){super.connectedCallback(),this._handleResize(),window.addEventListener("click",e=>this._handleClickOutOfElement(e,this.body)),window.addEventListener("resize",this._handleResize.bind(this))}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("click",e=>this._handleClickOutOfElement(e,this.body)),window.removeEventListener("resize",this._handleResize.bind(this))}firstUpdated(e){super.firstUpdated(e),this.breakpointReached&&this.body&&(this.expanded=!1,this.body.hidden=!0,this._handleMobileNav(),this._breakpointReached=!0);[...this.defaultSlotItems,...this.endSlotItems].forEach(e=>{e.setAttribute("expand",this.expand)})}_handleClickOutOfElement(e,t){e.composedPath().includes(t)||e.composedPath().includes(this.header)||this.hide()}_handleSummaryClick(){this.expanded?this.hide():(document.querySelector("body").style.overflow="hidden",this.show())}_handleResize(){const e=window.innerWidth<$l[this.expand];e!==this.breakpointReached?this.requestUpdate():(this.body&&(this.body.hidden=!0),this.expanding=!1),e?(this._handleMobileNav(),this._breakpointReached||(this._breakpointReached=!0,window.addEventListener("scrollend",this._handleMobileNavBound))):(this._handleDesktopNav(),this._breakpointReached=!1,window.removeEventListener("scrollend",this._handleMobileNavBound))}async _handleMobileNav(){if(!this.nav)return;this.nav.appendChild(this.body),await customElements.whenDefined("sgds-masthead");const{bottom:e}=this.nav.getBoundingClientRect(),t=parseFloat(getComputedStyle(this.body).paddingTop)+parseFloat(getComputedStyle(this.body).paddingBottom);this.navScroll.style.maxHeight=`calc(100dvh - ${e}px - ${t}px)`}_handleDesktopNav(){var e;null===(e=this.navbar)||void 0===e||e.insertBefore(this.body,this.nonCollapsibleSlot)}async _animateToShow(){if(this.emit("sgds-show",{cancelable:!0}).defaultPrevented)return this.expanding=!1,void(this.expanded=!1);await Je(this.body),this.body.hidden=!1;const{keyframes:e,options:t}=st(this,"mainnav.show");await Ge(this.body,Qe(e,this.body.scrollHeight),t),this.body.style.height="auto",this.emit("sgds-after-show")}async _animateToHide(){if(this.emit("sgds-hide",{cancelable:!0}).defaultPrevented)return this.expanding=!1,void(this.expanded=!0);await Je(this.body);const{keyframes:e,options:t}=st(this,"mainnav.hide");await Ge(this.body,Qe(e,this.body.scrollHeight),t),this.body.hidden=!0,this.body.style.height="auto",this.emit("sgds-after-hide")}async handleOpenChange(){this.expanding?(await this._animateToShow(),this.expanded=!0):(this.header.focus(),await this._animateToHide(),this.expanded=!1)}async show(){if(!this.expanded)return this.expanding=!0,at(this,"sgds-after-show")}async hide(){if(this.expanded)return this.expanding=!1,document.querySelector("body").style.removeProperty("overflow"),at(this,"sgds-after-hide")}_handleSlotChange(e){e.target.assignedElements({flatten:!0}).forEach(e=>{e.setAttribute("name",e.tagName.toLowerCase())})}render(){return this.breakpointReached=window.innerWidth<$l[this.expand],te`
       <nav>
         <div class="navbar ${this._expandClass()}">
           <a class="navbar-brand" href=${this.brandHref} aria-label="brand-link">
@@ -3223,7 +3223,7 @@ class fl{constructor(e,t,s,i){if(this.subscribe=!1,this.provided=!1,this.value=v
           ></sgds-icon-button>
         </div>
       </nav>
-    `}_expandClass(){switch(this.expand){case"always":return"navbar-expand";case"never":break;default:return`navbar-expand-${this.expand}`}}}Al.styles=[...He.styles,Ml],Al.dependencies={"sgds-icon-button":er},t([xl({context:Cl}),Ee()],Al.prototype,"_breakpointReached",void 0),t([xl({context:Sl}),Ee()],Al.prototype,"expanded",void 0),t([Ee()],Al.prototype,"expanding",void 0),t([Be("nav")],Al.prototype,"nav",void 0),t([Be(".navbar")],Al.prototype,"navbar",void 0),t([Be(".navbar-toggler")],Al.prototype,"header",void 0),t([Be(".navbar-body")],Al.prototype,"body",void 0),t([Be(".navbar-nav-scroll")],Al.prototype,"navScroll",void 0),t([Be("slot[name='non-collapsible']")],Al.prototype,"nonCollapsibleSlot",void 0),t([De({type:String})],Al.prototype,"brandHref",void 0),t([De({type:String})],Al.prototype,"expand",void 0),t([De({type:Boolean,reflect:!0})],Al.prototype,"fluid",void 0),t([Ee()],Al.prototype,"breakpointReached",void 0),t([Te()],Al.prototype,"defaultNodes",void 0),t([Te({slot:"end"})],Al.prototype,"endNodes",void 0),t([ot("expanding",{waitUntilFirstUpdate:!0})],Al.prototype,"handleOpenChange",null),it("mainnav.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:200,easing:"ease-in-out"}}),it("mainnav.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:200,easing:"ease-in-out"}});var Vl=r`:host([expand=always]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}@media (min-width:512px){:host([expand=sm]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:768px){:host([expand=md]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:1024px){:host(:not([expand])) .nav-link,:host([expand=lg]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:1280px){:host([expand=xl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:1440px){:host([expand=xxl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}.nav-link{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;gap:var(--sgds-gap-xs);padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none}@media screen and (max-width:767px){.nav-link{padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}.nav-link.show,.nav-link:not(.disabled).active{border-color:var(--sgds-primary-border-color-default);color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):hover{color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):focus-visible{color:var(--sgds-primary-color-default);outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.nav-link.disabled{cursor:not-allowed;opacity:var(--sgds-opacity-50)}.dropdown-items{background-color:var(--sgds-surface-default);height:100%;left:100%;padding:var(--sgds-padding-md) 0;position:absolute;top:0;width:100%}.dropdown-items a{align-items:center;color:var(--sgds-color-default);cursor:pointer;display:flex;gap:var(--sgds-gap-xs);padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none}.dropdown-items a:hover{color:var(--sgds-primary-color-default)}.dropdown-items a:focus-visible{color:var(--sgds-primary-color-default);outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus);outline-offset:-5px}slot[name=toggler]::slotted(*){flex:1}sgds-dropdown{display:block;height:100%}`;const Dl="Enter";class El extends He{constructor(){super(...arguments),this._breakpointReached=!0,this.togglerId=Ni("dropdown","button"),this.active=!1,this.disabled=!1}get defaultSlotItems(){return[...this.defaultNodes||[]].filter(e=>void 0!==e.tagName)}updated(){this._breakpointReached&&(this._copyTextToMenu(),this._resetDropdownMenu(),this._hideDropdownMenuItems())}_handleSlotChange(e){e.target.assignedElements({flatten:!0}).forEach(e=>{var t;e.addEventListener("keydown",this._handleKeyboardMenuItemsEvent.bind(this));const s=e.shadowRoot.querySelector(".dropdown-item");s.classList.add("nav-link");const i=(null===(t=e.shadowRoot)||void 0===t?void 0:t.querySelector("a"))||e.querySelector("a");i.tabIndex=-1,s.classList.contains("disabled")?(i.setAttribute("href","javascript:void(0)"),i.setAttribute("tabindex","-1")):i.addEventListener("click",e=>{e.target.closest("sgds-mainnav").hide()})})}_handleDesktopSlotChange(e){e.target.assignedElements({flatten:!0}).forEach(e=>{const t=e.shadowRoot.querySelector(".dropdown-item");t.classList.remove("nav-link");e.shadowRoot.querySelector(".dropdown-item slot").assignedElements({flatten:!0}).forEach(e=>{t.classList.contains("disabled")&&(e.setAttribute("href","javascript:void(0)"),e.setAttribute("tabindex","-1"))})})}_handleKeyboardMenuItemsEvent(e){if(!this._breakpointReached)return;const t=this.defaultSlotItems.filter(e=>!e.hasAttribute("disabled")),s=[this.menuHeaderButton,...t],i=s.length;if(0===i)return;const a=s[0],o=s[i-1].shadowRoot.querySelector(".dropdown-item");let n=document.activeElement;if(n===this&&(n=this.shadowRoot.activeElement),"Tab"===e.key)if(e.shiftKey)n===a&&(e.preventDefault(),setTimeout(()=>{o.focus()},0));else{const t=n.shadowRoot?n.shadowRoot.querySelector(".dropdown-item"):null;t&&t===o&&(e.preventDefault(),a.focus())}}_copyTextToMenu(){this.menuHeaderText.innerHTML=this.togglerNodes[0].innerHTML}_hideDropdownMenuItems(){this.dropdownItems.style.display="none",this.dropdownItems.setAttribute("aria-hidden","true")}_resetDropdownMenu(){const e=this._getNavbarBody();return e?new Promise(t=>{const s=i=>{"transform"===i.propertyName&&(e.removeEventListener("transitionend",s),t())};getComputedStyle(e).transitionProperty.includes("transform")?(e.addEventListener("transitionend",s),e.style.removeProperty("transform")):(e.style.removeProperty("transform"),t())}):Promise.resolve()}_handleKeyboardOpen(e){this.disabled||e.key!==Dl&&" "!==e.key||(e.preventDefault(),this._openMenu())}_getNavbarBody(){const e=document.querySelector("sgds-mainnav");if(!(null==e?void 0:e.shadowRoot))return void console.warn("sgds-mainnav or its shadowRoot not found");const t=e.shadowRoot.querySelector(".navbar-body");if(t)return t;console.warn(".navbar-body not found in sgds-mainnav")}_openMenu(){this._getNavbarBody().style.transform="translateX(-100%)",this.dropdownItems.style.removeProperty("display"),this.dropdownItems.setAttribute("aria-hidden","false"),setTimeout(()=>{this.menuHeaderButton.focus()},50)}_handleHeaderKeyboardEvent(e){switch(e.key){case"Tab":this._handleKeyboardMenuItemsEvent(e);break;case Dl:case" ":e.preventDefault(),this._closeMenu()}}async _closeMenu(){await this._resetDropdownMenu(),this._hideDropdownMenuItems(),this.navLink.focus()}render(){const e=te`
+    `}_expandClass(){switch(this.expand){case"always":return"navbar-expand";case"never":break;default:return`navbar-expand-${this.expand}`}}}Al.styles=[...He.styles,Ml],Al.dependencies={"sgds-icon-button":er},t([xl({context:Cl}),Ee()],Al.prototype,"_breakpointReached",void 0),t([xl({context:Sl}),Ee()],Al.prototype,"expanded",void 0),t([Ee()],Al.prototype,"expanding",void 0),t([Be("nav")],Al.prototype,"nav",void 0),t([Be(".navbar")],Al.prototype,"navbar",void 0),t([Be(".navbar-toggler")],Al.prototype,"header",void 0),t([Be(".navbar-body")],Al.prototype,"body",void 0),t([Be(".navbar-nav-scroll")],Al.prototype,"navScroll",void 0),t([Be("slot[name='non-collapsible']")],Al.prototype,"nonCollapsibleSlot",void 0),t([De({type:String})],Al.prototype,"brandHref",void 0),t([De({type:String})],Al.prototype,"expand",void 0),t([De({type:Boolean,reflect:!0})],Al.prototype,"fluid",void 0),t([Ee()],Al.prototype,"breakpointReached",void 0),t([Te()],Al.prototype,"defaultNodes",void 0),t([Te({slot:"end"})],Al.prototype,"endNodes",void 0),t([ot("expanding",{waitUntilFirstUpdate:!0})],Al.prototype,"handleOpenChange",null),it("mainnav.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:200,easing:"ease-in-out"}}),it("mainnav.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:200,easing:"ease-in-out"}});var Vl=r`:host([expand=always]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}@media (min-width:512px){:host([expand=sm]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:768px){:host([expand=md]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:1024px){:host(:not([expand])) .nav-link,:host([expand=lg]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:1280px){:host([expand=xl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}@media (min-width:1440px){:host([expand=xxl]) .nav-link{border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}}.nav-link{align-items:center;box-sizing:border-box;cursor:pointer;display:flex;gap:var(--sgds-gap-xs);padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x);text-decoration:none}.nav-link.show,.nav-link:not(.disabled).active{border-color:var(--sgds-primary-border-color-default);color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):hover{color:var(--sgds-primary-color-default)}.nav-link:not(.disabled):focus-visible{color:var(--sgds-primary-color-default);outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.nav-link.disabled{cursor:not-allowed;opacity:var(--sgds-opacity-50)}.dropdown-items{background-color:var(--sgds-surface-default);height:100%;left:100%;overflow-y:auto;padding:var(--sgds-padding-md) 0;position:absolute;top:0;width:100%}.dropdown-items a{align-items:center;color:var(--sgds-color-default);cursor:pointer;display:flex;gap:var(--sgds-gap-xs);margin:auto;max-width:var(--sgds-mainnav-max-width,1440px);padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x);text-decoration:none}.dropdown-items a:hover{color:var(--sgds-primary-color-default)}.dropdown-items a:focus-visible{color:var(--sgds-primary-color-default);outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus);outline-offset:-5px}slot[name=toggler]::slotted(*){flex:1}sgds-dropdown{display:block;height:100%}@media screen and (min-width:1024px){.dropdown-items a,.nav-link{padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x)}}`;const Dl="Enter";class El extends He{constructor(){super(...arguments),this._breakpointReached=!0,this.togglerId=Ni("dropdown","button"),this.active=!1,this.disabled=!1}get defaultSlotItems(){return[...this.defaultNodes||[]].filter(e=>void 0!==e.tagName)}updated(){this._breakpointReached&&(this._copyTextToMenu(),this._resetDropdownMenu(),this._hideDropdownMenuItems())}_handleSlotChange(e){e.target.assignedElements({flatten:!0}).forEach(e=>{var t;e.addEventListener("keydown",this._handleKeyboardMenuItemsEvent.bind(this));const s=e.shadowRoot.querySelector(".dropdown-item");s.classList.add("mainnav-dropdown-link");const i=(null===(t=e.shadowRoot)||void 0===t?void 0:t.querySelector("a"))||e.querySelector("a");i.tabIndex=-1,s.classList.contains("disabled")?(i.setAttribute("href","javascript:void(0)"),i.setAttribute("tabindex","-1")):i.addEventListener("click",e=>{e.target.closest("sgds-mainnav").hide()})})}_handleDesktopSlotChange(e){e.target.assignedElements({flatten:!0}).forEach(e=>{const t=e.shadowRoot.querySelector(".dropdown-item");t.classList.remove("mainnav-dropdown-link");e.shadowRoot.querySelector(".dropdown-item slot").assignedElements({flatten:!0}).forEach(e=>{t.classList.contains("disabled")&&(e.setAttribute("href","javascript:void(0)"),e.setAttribute("tabindex","-1"))})})}_handleKeyboardMenuItemsEvent(e){if(!this._breakpointReached)return;const t=this.defaultSlotItems.filter(e=>!e.hasAttribute("disabled")),s=[this.menuHeaderButton,...t],i=s.length;if(0===i)return;const a=s[0],o=s[i-1].shadowRoot.querySelector(".dropdown-item");let n=document.activeElement;if(n===this&&(n=this.shadowRoot.activeElement),"Tab"===e.key)if(e.shiftKey)n===a&&(e.preventDefault(),setTimeout(()=>{o.focus()},0));else{const t=n.shadowRoot?n.shadowRoot.querySelector(".dropdown-item"):null;t&&t===o&&(e.preventDefault(),a.focus())}}_copyTextToMenu(){this.menuHeaderText.innerHTML=this.togglerNodes[0].innerHTML}_hideDropdownMenuItems(){this.dropdownItems.style.display="none",this.dropdownItems.setAttribute("aria-hidden","true")}_resetDropdownMenu(){const e=this._getNavbarBody();return e?new Promise(t=>{const s=i=>{"transform"===i.propertyName&&(e.removeEventListener("transitionend",s),t())};getComputedStyle(e).transitionProperty.includes("transform")?(e.addEventListener("transitionend",s),e.style.removeProperty("transform")):(e.style.removeProperty("transform"),t())}):Promise.resolve()}_handleKeyboardOpen(e){this.disabled||e.key!==Dl&&" "!==e.key||(e.preventDefault(),this._openMenu())}_getNavbarBody(){const e=document.querySelector("sgds-mainnav");if(!(null==e?void 0:e.shadowRoot))return void console.warn("sgds-mainnav or its shadowRoot not found");const t=e.shadowRoot.querySelector(".navbar-body");if(t)return t;console.warn(".navbar-body not found in sgds-mainnav")}_openMenu(){this._getNavbarBody().style.transform="translateX(-100%)",this.dropdownItems.style.removeProperty("display"),this.dropdownItems.setAttribute("aria-hidden","false"),setTimeout(()=>{this.menuHeaderButton.focus()},50)}_handleHeaderKeyboardEvent(e){switch(e.key){case"Tab":this._handleKeyboardMenuItemsEvent(e);break;case Dl:case" ":e.preventDefault(),this._closeMenu()}}async _closeMenu(){await this._resetDropdownMenu(),this._hideDropdownMenuItems(),this.navLink.focus()}render(){const e=te`
       <a
         class="${Ke({"nav-link":!0,active:this.active,disabled:this.disabled})}"
         aria-disabled=${this.disabled?"true":"false"}
@@ -3258,7 +3258,7 @@ class fl{constructor(e,t,s,i){if(this.subscribe=!1,this.provided=!1,this.value=v
         <sgds-icon name="chevron-down"></sgds-icon>
       </a>
       <slot @slotchange=${this._handleDesktopSlotChange}></slot>
-    </sgds-dropdown>`;return this._breakpointReached?e:t}}El.styles=[...He.styles,Yi,qi,Vl],El.dependencies={"sgds-dropdown":ji,"sgds-dropdown-item":Ki,"sgds-icon":Bt},t([kl({context:Cl,subscribe:!0}),Ee()],El.prototype,"_breakpointReached",void 0),t([kl({context:Sl,subscribe:!0}),Ee()],El.prototype,"expanded",void 0),t([Be(".nav-link")],El.prototype,"navLink",void 0),t([Be(".dropdown-items")],El.prototype,"dropdownItems",void 0),t([Be(".dropdown-items a")],El.prototype,"menuHeaderButton",void 0),t([Be(".dropdown-items span")],El.prototype,"menuHeaderText",void 0),t([De({type:Boolean})],El.prototype,"active",void 0),t([De({type:Boolean,reflect:!0})],El.prototype,"disabled",void 0),t([Te({slot:"toggler"})],El.prototype,"togglerNodes",void 0),t([Te()],El.prototype,"defaultNodes",void 0);var Il=r`:host([expand=always]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;padding:0 var(--sgds-padding-md)}@media screen and (min-width:512px){:host([expand=sm]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=sm]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:768px){:host([expand=md]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=md]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:1024px){::slotted(*){min-height:100%}:host([expand=lg]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=lg]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:1280px){:host([expand=xl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:1440px){:host([expand=xxl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xxl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (max-width:511px){:host(:not([disabled])[active][expand=sm]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:767px){:host(:not([disabled])[active][expand=md]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1023px){:host(:not([disabled])[active][expand=lg]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1279px){:host(:not([disabled])[active][expand=xl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1439px){:host(:not([disabled])[active][expand=xxl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}::slotted(*){--sgds-link-color-default:var(--sgds-color-default);align-items:center;box-sizing:border-box;color:var(--sgds-link-color-default,var(--sgds-color-default));cursor:pointer;display:flex;height:auto!important;padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x);text-decoration:none!important;text-decoration:none}@media screen and (max-width:767px){::slotted(*){padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x)}}:host(:not([disabled])[active]) ::slotted(*){--sgds-link-color-default:var(--sgds-primary-color-default);color:var(--sgds-link-color-default,var(--sgds-primary-color-default))}:host([disabled]) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-color-default))}:host(:not([disabled])) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-primary-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default))}::slotted(a:focus-visible){--sgds-link-color-emphasis:var(--sgds-primary-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default));outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}:host([disabled]) ::slotted(*){cursor:not-allowed;opacity:var(--sgds-opacity-50)}`;class Zl extends He{constructor(){super(...arguments),this.active=!1,this.disabled=!1}_handleDisabled(){this.setAttribute("aria-disabled",`${this.disabled}`)}_handleSlotChange(e){const t=e.target,s=t.assignedElements({flatten:!0}).filter(e=>"a"===e.tagName.toLowerCase()||"sgds-link"===e.tagName.toLowerCase());if(s.length>1)console.error("More than one anchor tag is added to sgds-mainnav-item");else{if(0===s.length){t.assignedNodes({flatten:!0}).forEach(e=>{if(e.nodeType===Node.TEXT_NODE){const t=document.createElement("a");t.textContent=e.textContent,e.parentNode.replaceChild(t,e)}})}if(1===s.length){const e=s[0];if(this.active&&e.setAttribute("aria-current","true"),this.disabled)return e.setAttribute("href","javascript:void(0)"),void e.setAttribute("tabindex","-1");e.addEventListener("click",e=>{e.target.closest("sgds-mainnav").hide()})}}}render(){return te`<slot @slotchange=${this._handleSlotChange}></slot>`}}Zl.styles=[...He.styles,Il],t([De({type:Boolean,reflect:!0})],Zl.prototype,"active",void 0),t([De({type:Boolean,reflect:!0})],Zl.prototype,"disabled",void 0),t([ot("disabled")],Zl.prototype,"_handleDisabled",null);var Bl=r`b{font-weight:bolder}[role=button]{cursor:pointer}a{color:#0049dc;text-decoration:none!important}a[target=_blank]:after{height:var(--sgds-icon-size-sm)!important;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.516 2.933h.017a.4.4 0 1 1 0 .8c-.566 0-.967 0-1.28.026-.31.025-.498.073-.646.149a1.6 1.6 0 0 0-.7.699c-.075.148-.123.336-.148.645-.025.314-.026.714-.026 1.281v2.933c0 .567 0 .968.026 1.282.026.308.073.497.149.645a1.6 1.6 0 0 0 .699.699c.148.075.337.123.645.149.314.025.715.025 1.281.025h2.934c.566 0 .967 0 1.28-.025.31-.026.498-.073.646-.149a1.6 1.6 0 0 0 .7-.7c.075-.147.123-.336.148-.644.025-.314.026-.715.026-1.282a.4.4 0 0 1 .8 0v.018c0 .545 0 .979-.029 1.329-.03.358-.09.663-.233.943a2.4 2.4 0 0 1-1.049 1.049c-.28.142-.585.204-.943.233-.35.028-.784.028-1.329.028H6.516c-.545 0-.979 0-1.329-.028-.358-.03-.664-.09-.943-.233a2.4 2.4 0 0 1-1.05-1.049c-.142-.28-.203-.585-.232-.943-.029-.35-.029-.784-.029-1.33V6.517c0-.546 0-.98.029-1.33.03-.357.09-.663.233-.942a2.4 2.4 0 0 1 1.049-1.05c.28-.142.585-.203.943-.232.35-.029.784-.029 1.329-.029Zm1.75.4c0-.22.18-.4.4-.4h4c.222 0 .4.18.4.4v4a.4.4 0 0 1-.8 0V4.3L8.284 8.283a.4.4 0 0 1-.566-.566l3.984-3.984H8.667a.4.4 0 0 1-.4-.4Z' fill='%230269D0'/%3E%3C/svg%3E")!important;mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.516 2.933h.017a.4.4 0 1 1 0 .8c-.566 0-.967 0-1.28.026-.31.025-.498.073-.646.149a1.6 1.6 0 0 0-.7.699c-.075.148-.123.336-.148.645-.025.314-.026.714-.026 1.281v2.933c0 .567 0 .968.026 1.282.026.308.073.497.149.645a1.6 1.6 0 0 0 .699.699c.148.075.337.123.645.149.314.025.715.025 1.281.025h2.934c.566 0 .967 0 1.28-.025.31-.026.498-.073.646-.149a1.6 1.6 0 0 0 .7-.7c.075-.147.123-.336.148-.644.025-.314.026-.715.026-1.282a.4.4 0 0 1 .8 0v.018c0 .545 0 .979-.029 1.329-.03.358-.09.663-.233.943a2.4 2.4 0 0 1-1.049 1.049c-.28.142-.585.204-.943.233-.35.028-.784.028-1.329.028H6.516c-.545 0-.979 0-1.329-.028-.358-.03-.664-.09-.943-.233a2.4 2.4 0 0 1-1.05-1.049c-.142-.28-.203-.585-.232-.943-.029-.35-.029-.784-.029-1.33V6.517c0-.546 0-.98.029-1.33.03-.357.09-.663.233-.942a2.4 2.4 0 0 1 1.049-1.05c.28-.142.585-.203.943-.232.35-.029.784-.029 1.329-.029Zm1.75.4c0-.22.18-.4.4-.4h4c.222 0 .4.18.4.4v4a.4.4 0 0 1-.8 0V4.3L8.284 8.283a.4.4 0 0 1-.566-.566l3.984-3.984H8.667a.4.4 0 0 1-.4-.4Z' fill='%230269D0'/%3E%3C/svg%3E")!important;width:var(--sgds-icon-size-sm)!important}a:hover{color:#0022b9}.sgds-masthead{font-family:Inter,system-ui,sans-serif;font-size:.875rem;line-height:1.25rem}.banner{background-color:light-dark(#f7f7f7,#1a1a1a)}.container{margin-left:auto;margin-right:auto;max-width:var(--sgds-mainnav-max-width,1440px);padding:.25rem var(--sgds-mainnav-padding-x,2rem);width:100%}:host([fluid]) .container{max-width:none}.sg-crest{flex-shrink:0;height:20px;width:20px}.sg-crest path{fill:#db0000}.masthead-layout{display:flex;gap:.25rem}.masthead-text-layout{align-items:center;display:flex;flex-wrap:wrap;gap:0 .75rem}.sgds-masthead-identify-icon{align-self:center;display:block;height:20px;transform:rotate(180deg);transition:transform .3s ease-in-out 0s;user-select:none;width:20px}.sgds-masthead-identify-icon.show{transform:rotate(0deg)}.sgds-masthead-button{align-items:center;color:light-dark(#0269d0,#60aaf4);cursor:pointer;display:flex;gap:4px}.sgds-masthead-button:hover{color:light-dark(#0151a0,#96c7f7)}.panel{background-color:light-dark(#f7f7f7,#1a1a1a)}.sgds-masthead .sgds-masthead-content{display:none;padding-bottom:1rem;padding-top:1rem}.sgds-masthead .sgds-masthead-content.show{display:block}.content-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.icon{margin-top:-.1em}.wrapper{display:flex;gap:.5rem}.content{display:flex;flex-direction:column;gap:.25rem}.content .title{font-weight:600}.content article{color:light-dark(#525252,#a5a5a5)}.banner-icon,.banner-icon-inline{height:20px;width:20px}.banner-icon path,.banner-icon-inline path{fill:light-dark(#1a1a1a,#f3f3f3)}a.trusted-websites-link{color:light-dark(#0269d0,#60aaf4);text-decoration:underline;width:fit-content}a.trusted-websites-link:hover{color:light-dark(#0151a0,#96c7f7)}.sgds-masthead-button:focus-visible,a.trusted-websites-link:focus-visible{outline:4px solid #60aaf4}@media screen and (max-width:767px){.container{padding:.25rem var(--sgds-mainnav-mobile-padding-x,1.25rem)}.sgds-masthead-content .content-grid{gap:1rem;grid-template-columns:1fr}}`,Ll=r`svg{vertical-align:middle}`;class Tl extends He{constructor(){super(...arguments),this.fluid=!1,this.toggleVisibility=!1}_handleKeydown(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this._toggleVisibility())}_toggleVisibility(){this.toggleVisibility=!this.toggleVisibility}render(){return te`
+    </sgds-dropdown>`;return this._breakpointReached?e:t}}El.styles=[...He.styles,Yi,qi,Vl],El.dependencies={"sgds-dropdown":ji,"sgds-dropdown-item":Ki,"sgds-icon":Bt},t([kl({context:Cl,subscribe:!0}),Ee()],El.prototype,"_breakpointReached",void 0),t([kl({context:Sl,subscribe:!0}),Ee()],El.prototype,"expanded",void 0),t([Be(".nav-link")],El.prototype,"navLink",void 0),t([Be(".dropdown-items")],El.prototype,"dropdownItems",void 0),t([Be(".dropdown-items a")],El.prototype,"menuHeaderButton",void 0),t([Be(".dropdown-items span")],El.prototype,"menuHeaderText",void 0),t([De({type:Boolean})],El.prototype,"active",void 0),t([De({type:Boolean,reflect:!0})],El.prototype,"disabled",void 0),t([Te({slot:"toggler"})],El.prototype,"togglerNodes",void 0),t([Te()],El.prototype,"defaultNodes",void 0);var Il=r`:host([expand=always]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}@media screen and (min-width:512px){:host([expand=sm]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=sm]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:768px){:host([expand=md]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=md]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:1024px){:host([expand=lg]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=lg]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:1280px){:host([expand=xl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (min-width:1440px){:host([expand=xxl]) ::slotted(*){border-bottom:var(--sgds-border-width-4) solid transparent;min-height:100%;padding:0 var(--sgds-padding-md)}:host(:not([disabled])[active][expand=xxl]) ::slotted(*){border-color:var(--sgds-primary-border-color-default)}}@media screen and (max-width:511px){:host(:not([disabled])[active][expand=sm]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:767px){:host(:not([disabled])[active][expand=md]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1023px){:host(:not([disabled])[active][expand=lg]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1279px){:host(:not([disabled])[active][expand=xl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}@media screen and (max-width:1439px){:host(:not([disabled])[active][expand=xxl]) ::slotted(*){background-color:var(--sgds-bg-translucent-subtle)}}::slotted(*){--sgds-link-color-default:var(--sgds-color-default);align-items:center;box-sizing:border-box;color:var(--sgds-link-color-default,var(--sgds-color-default));cursor:pointer;display:flex;height:auto!important;padding:var(--sgds-padding-sm) var(--sgds-mainnav-mobile-padding-x);text-decoration:none!important;text-decoration:none}@media screen and (min-width:1024px){::slotted(*){padding:var(--sgds-padding-sm) var(--sgds-mainnav-padding-x)}}:host(:not([disabled])[active]) ::slotted(*){--sgds-link-color-default:var(--sgds-primary-color-default);color:var(--sgds-link-color-default,var(--sgds-primary-color-default))}:host([disabled]) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-color-default))}:host(:not([disabled])) ::slotted(a:hover){--sgds-link-color-emphasis:var(--sgds-primary-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default))}::slotted(a:focus-visible){--sgds-link-color-emphasis:var(--sgds-primary-color-default);color:var(--sgds-link-color-emphasis,var(--sgds-primary-color-default));outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}:host([disabled]) ::slotted(*){cursor:not-allowed;opacity:var(--sgds-opacity-50)}`;class Zl extends He{constructor(){super(...arguments),this.active=!1,this.disabled=!1}_handleDisabled(){this.setAttribute("aria-disabled",`${this.disabled}`)}_handleSlotChange(e){const t=e.target,s=t.assignedElements({flatten:!0}).filter(e=>"a"===e.tagName.toLowerCase()||"sgds-link"===e.tagName.toLowerCase());if(s.length>1)console.error("More than one anchor tag is added to sgds-mainnav-item");else{if(0===s.length){t.assignedNodes({flatten:!0}).forEach(e=>{if(e.nodeType===Node.TEXT_NODE){const t=document.createElement("a");t.textContent=e.textContent,e.parentNode.replaceChild(t,e)}})}if(1===s.length){const e=s[0];if(this.active&&e.setAttribute("aria-current","true"),this.disabled)return e.setAttribute("href","javascript:void(0)"),void e.setAttribute("tabindex","-1");e.addEventListener("click",e=>{e.target.closest("sgds-mainnav").hide()})}}}render(){return te`<slot @slotchange=${this._handleSlotChange}></slot>`}}Zl.styles=[...He.styles,Il],t([De({type:Boolean,reflect:!0})],Zl.prototype,"active",void 0),t([De({type:Boolean,reflect:!0})],Zl.prototype,"disabled",void 0),t([ot("disabled")],Zl.prototype,"_handleDisabled",null);var Bl=r`b{font-weight:bolder}[role=button]{cursor:pointer}a{color:#0049dc;text-decoration:none!important}a[target=_blank]:after{height:var(--sgds-icon-size-sm)!important;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.516 2.933h.017a.4.4 0 1 1 0 .8c-.566 0-.967 0-1.28.026-.31.025-.498.073-.646.149a1.6 1.6 0 0 0-.7.699c-.075.148-.123.336-.148.645-.025.314-.026.714-.026 1.281v2.933c0 .567 0 .968.026 1.282.026.308.073.497.149.645a1.6 1.6 0 0 0 .699.699c.148.075.337.123.645.149.314.025.715.025 1.281.025h2.934c.566 0 .967 0 1.28-.025.31-.026.498-.073.646-.149a1.6 1.6 0 0 0 .7-.7c.075-.147.123-.336.148-.644.025-.314.026-.715.026-1.282a.4.4 0 0 1 .8 0v.018c0 .545 0 .979-.029 1.329-.03.358-.09.663-.233.943a2.4 2.4 0 0 1-1.049 1.049c-.28.142-.585.204-.943.233-.35.028-.784.028-1.329.028H6.516c-.545 0-.979 0-1.329-.028-.358-.03-.664-.09-.943-.233a2.4 2.4 0 0 1-1.05-1.049c-.142-.28-.203-.585-.232-.943-.029-.35-.029-.784-.029-1.33V6.517c0-.546 0-.98.029-1.33.03-.357.09-.663.233-.942a2.4 2.4 0 0 1 1.049-1.05c.28-.142.585-.203.943-.232.35-.029.784-.029 1.329-.029Zm1.75.4c0-.22.18-.4.4-.4h4c.222 0 .4.18.4.4v4a.4.4 0 0 1-.8 0V4.3L8.284 8.283a.4.4 0 0 1-.566-.566l3.984-3.984H8.667a.4.4 0 0 1-.4-.4Z' fill='%230269D0'/%3E%3C/svg%3E")!important;mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.516 2.933h.017a.4.4 0 1 1 0 .8c-.566 0-.967 0-1.28.026-.31.025-.498.073-.646.149a1.6 1.6 0 0 0-.7.699c-.075.148-.123.336-.148.645-.025.314-.026.714-.026 1.281v2.933c0 .567 0 .968.026 1.282.026.308.073.497.149.645a1.6 1.6 0 0 0 .699.699c.148.075.337.123.645.149.314.025.715.025 1.281.025h2.934c.566 0 .967 0 1.28-.025.31-.026.498-.073.646-.149a1.6 1.6 0 0 0 .7-.7c.075-.147.123-.336.148-.644.025-.314.026-.715.026-1.282a.4.4 0 0 1 .8 0v.018c0 .545 0 .979-.029 1.329-.03.358-.09.663-.233.943a2.4 2.4 0 0 1-1.049 1.049c-.28.142-.585.204-.943.233-.35.028-.784.028-1.329.028H6.516c-.545 0-.979 0-1.329-.028-.358-.03-.664-.09-.943-.233a2.4 2.4 0 0 1-1.05-1.049c-.142-.28-.203-.585-.232-.943-.029-.35-.029-.784-.029-1.33V6.517c0-.546 0-.98.029-1.33.03-.357.09-.663.233-.942a2.4 2.4 0 0 1 1.049-1.05c.28-.142.585-.203.943-.232.35-.029.784-.029 1.329-.029Zm1.75.4c0-.22.18-.4.4-.4h4c.222 0 .4.18.4.4v4a.4.4 0 0 1-.8 0V4.3L8.284 8.283a.4.4 0 0 1-.566-.566l3.984-3.984H8.667a.4.4 0 0 1-.4-.4Z' fill='%230269D0'/%3E%3C/svg%3E")!important;width:var(--sgds-icon-size-sm)!important}a:hover{color:#0022b9}.sgds-masthead{font-family:Inter,system-ui,sans-serif;font-size:.875rem;line-height:1.25rem}.banner{background-color:light-dark(#f7f7f7,#1a1a1a)}.container{margin-left:auto;margin-right:auto;max-width:var(--sgds-mainnav-max-width,1440px);padding:.25rem var(--sgds-mainnav-mobile-padding-x,1.25rem);width:100%}:host([fluid]) .container{max-width:none}.sg-crest{flex-shrink:0;height:20px;width:20px}.sg-crest path{fill:#db0000}.masthead-layout{display:flex;gap:.25rem}.masthead-text-layout{align-items:center;display:flex;flex-wrap:wrap;gap:0 .75rem}.sgds-masthead-identify-icon{align-self:center;display:block;height:20px;transform:rotate(180deg);transition:transform .3s ease-in-out 0s;user-select:none;width:20px}.sgds-masthead-identify-icon.show{transform:rotate(0deg)}.sgds-masthead-button{align-items:center;color:light-dark(#0269d0,#60aaf4);cursor:pointer;display:flex;gap:4px}.sgds-masthead-button:hover{color:light-dark(#0151a0,#96c7f7)}.panel{background-color:light-dark(#f7f7f7,#1a1a1a)}.sgds-masthead .sgds-masthead-content{display:none;padding-bottom:1rem;padding-top:1rem}.sgds-masthead .sgds-masthead-content.show{display:block}.content-grid{display:grid;gap:1rem;grid-template-columns:1fr}.icon{margin-top:-.1em}.wrapper{display:flex;gap:.5rem}.content{display:flex;flex-direction:column;gap:.25rem}.content .title{font-weight:600}.content article{color:light-dark(#525252,#a5a5a5)}.banner-icon,.banner-icon-inline{height:20px;width:20px}.banner-icon path,.banner-icon-inline path{fill:light-dark(#1a1a1a,#f3f3f3)}a.trusted-websites-link{color:light-dark(#0269d0,#60aaf4);text-decoration:underline;width:fit-content}a.trusted-websites-link:hover{color:light-dark(#0151a0,#96c7f7)}.sgds-masthead-button:focus-visible,a.trusted-websites-link:focus-visible{outline:4px solid #60aaf4}@media screen and (min-width:768px){.content-grid{gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}}@media screen and (min-width:1024px){.container{padding:.25rem var(--sgds-mainnav-padding-x,2rem)}}`,Ll=r`svg{vertical-align:middle}`;class Tl extends He{constructor(){super(...arguments),this.fluid=!1,this.toggleVisibility=!1}_handleKeydown(e){"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this._toggleVisibility())}_toggleVisibility(){this.toggleVisibility=!this.toggleVisibility}render(){return te`
       <div id="sgds-masthead" class="sgds-masthead">
         <div class="banner">
           <div class="container">
@@ -3736,42 +3736,60 @@ const Ul="important",ql=" !"+Ul;const Yl=je(class extends We{constructor(e){if(s
           ${this.loading?this._renderLoadingMenu():ae}
         </ul>
       </div>
-    `}}id.styles=[...Za.styles,Ea,td],id.childName="sgds-select-option",id.dependencies={"sgds-icon":Bt,"sgds-spinner":Ra,[id.childName]:sd},t([Te({flatten:!0,selector:"sgds-select-option"})],id.prototype,"options",void 0),t([ot("value",{waitUntilFirstUpdate:!0})],id.prototype,"_handleValueChange",null);var ad=r`.sidebar{display:flex;flex-direction:column;height:100%;position:relative;transition:width var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);z-index:1100}.sidebar--expanded{width:var(--sgds-dimension-288)}.sidebar--collapsed{width:var(--sgds-dimension-72)}.sidebar-header{align-items:center;display:flex;justify-content:space-between;padding:var(--sgds-padding-xs)}.sidebar .sidebar-brand-name{padding-left:var(--sgds-padding-xs)}.sidebar--collapsed .sidebar-brand-name{display:none}.sidebar--collapsed .sidebar-header{justify-content:center}.sidebar-wrapper{background-color:var(--sgds-bg-default);border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);height:100%;overflow-x:hidden;overflow-y:auto;position:relative;z-index:2}.sidebar-content{flex:1;overflow-y:auto;padding:0 var(--sgds-padding-xs)}.sidebar-nested-overlay{background-color:var(--sgds-bg-default);bottom:0;left:0;opacity:0;overflow-y:scroll;padding:var(--sgds-padding-md) var(--sgds-padding-xs);pointer-events:none;position:absolute;top:0;transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);transition-property:opacity left;width:var(--sgds-dimension-288);z-index:0}.sidebar-nested-overlay.show{border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);left:var(--sgds-dimension-288);opacity:1;pointer-events:auto}.sidebar--collapsed .sidebar-nested-overlay.show{left:var(--sgds-dimension-72)}.sidebar::-webkit-scrollbar{width:var(--sgds-dimension-2)}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-xs)}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--sgds-color-subtle)}`;const od="sgds-sidebar-group";class nd extends He{constructor(){super(...arguments),this.collapsed=!1,this.active="",this._sidebarActiveGroup=null,this._sidebarActiveItem=null,this._drawerItems=[],this._showDrawer=!1,this._handleClickOutOfElement=e=>{this._sidebarActiveGroup&&(e.composedPath().includes(this)||(this._showDrawer=!1))}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","navigation"),this.setAttribute("aria-label","Main navigation"),this.updateComplete.then(()=>{this.addItemListeners(),this._handleActive(),document.addEventListener("click",this._handleClickOutOfElement)})}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._handleClickOutOfElement)}_handleCollapsed(){this._sidebarCollapsed=this.collapsed}_handleActiveItem(){if(!this._sidebarActiveItem)return;const e=this._sidebarActiveItem._childLevel;if(this._sidebarActiveItem._selected=!0,0===e)this._sidebarActiveItem._childElements.length>0?this._setNodesToDrawer(this._sidebarActiveItem):this._revertNodesToParent();else{let e=this._sidebarActiveItem.parentElement;for(;e._childLevel>=0&&e.tagName.toLowerCase()===od;)e.tagName.toLowerCase()===od&&(0===e._childLevel&&(e.classList.contains("sidebar-nested-overlay")||this._setNodesToDrawer(e)),e._selected=!0,e._showMenu=e._childLevel>0,e=e.parentElement);this._sidebarActiveGroup&&(this._sidebarActiveGroup._selected=!0)}}_handleActive(){this.active?this._sidebarActiveItem=this._getActiveChild():this._sidebarActiveItem=null}_getActiveChild(){const e=t=>{var s;for(const i of t){if(i.name===this.active)return i;if(null===(s=i._childElements)||void 0===s?void 0:s.length){const t=e(i._childElements);if(t)return t}}return null};return e(this._defaultNodes)}_setNodesToDrawer(e){if(!e)return;this._sidebarActiveGroup&&e!==this._sidebarActiveGroup&&this._revertNodesToParent(),this._sidebarActiveGroup=e,this._drawerItems=[];this._sidebarActiveGroup.querySelectorAll(":scope > sgds-sidebar-group, :scope > sgds-sidebar-item").forEach(e=>{this._drawerItems.push(e)})}_revertNodesToParent(){this._sidebarActiveGroup&&(this._drawerItems.forEach(e=>{this._sidebarActiveGroup.append(e)}),this._drawerItems=[]),this._sidebarActiveGroup=null}addItemListeners(){const e=[...this.querySelectorAll("sgds-sidebar-item"),...this.querySelectorAll(od)];e.forEach(t=>{t.addEventListener("i-sgds-click",s=>{const i=s.detail.element;if(i===this._sidebarActiveGroup)this._showDrawer=!this._showDrawer;else{if(this.active!==i.name&&(this.active=i.name,e.forEach(e=>e._selected=!1)),i._childElements.length>0)this._showDrawer=!0;else{this._showDrawer=!1;const e=t.querySelector(":scope > a");e&&e.click()}this.emit("sgds-select",{detail:{activeItem:i.name}})}})})}toggleCollapsed(){this.collapsed=!this.collapsed}render(){var e,t;return te`
+    `}}id.styles=[...Za.styles,Ea,td],id.childName="sgds-select-option",id.dependencies={"sgds-icon":Bt,"sgds-spinner":Ra,[id.childName]:sd},t([Te({flatten:!0,selector:"sgds-select-option"})],id.prototype,"options",void 0),t([ot("value",{waitUntilFirstUpdate:!0})],id.prototype,"_handleValueChange",null);var ad=r`.sidebar{display:flex;flex-direction:column;height:100%;position:relative;transition:width var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);z-index:1100}.sidebar--expanded{width:var(--sgds-dimension-288)}.sidebar--collapsed{width:var(--sgds-dimension-72)}.sidebar-top{align-items:center;display:flex;gap:var(--sgds-gap-md);justify-content:space-between;padding:0 var(--sgds-padding-xs)}.sidebar--collapsed .sidebar-brand-name{display:none}.sidebar--collapsed .sidebar-top{justify-content:center}.sidebar-main{background-color:var(--sgds-bg-default);border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);height:100%;overflow-x:hidden;overflow-y:auto;padding:var(--sgds-padding-lg) 0;position:relative;z-index:1}.sidebar-wrapper{display:flex;flex-direction:column;height:100%;justify-content:space-between}.sidebar-content{display:flex;flex:1;flex-direction:column;gap:var(--sgds-gap-md);overflow-y:auto}.sidebar-nested-overlay{background-color:var(--sgds-surface-raised);bottom:0;left:0;opacity:0;overflow-y:scroll;padding:var(--sgds-padding-md) var(--sgds-padding-xs);pointer-events:none;position:absolute;top:0;transition:all var(--sgds-motion-duration-standard) var(--sgds-motion-easing-standard);transition-property:opacity left;width:var(--sgds-dimension-288);z-index:0}.sidebar-nested-overlay.show{border-right:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);left:var(--sgds-dimension-288);opacity:1;pointer-events:auto}.sidebar--collapsed .sidebar-nested-overlay.show{left:var(--sgds-dimension-72)}.sidebar::-webkit-scrollbar{width:var(--sgds-dimension-2)}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-xs)}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--sgds-color-subtle)}@media only screen and (max-width:511px){.sidebar--expanded{position:absolute;width:100dvw}.sidebar-nested-overlay{left:-100dvw;width:100dvw;z-index:2}.sidebar--collapsed .sidebar-nested-overlay.show,.sidebar-nested-overlay.show{left:0}}@media only screen and (max-width:767px){.sidebar--expanded,.sidebar-nested-overlay{width:var(--sgds-dimension-256)}.sidebar-nested-overlay,.sidebar-nested-overlay.show{left:var(--sgds-dimension-256)}}`;const od="sgds-sidebar-group";class nd extends He{constructor(){super(...arguments),this.collapsed=!1,this.active="",this._sidebarActiveGroup=null,this._sidebarActiveItem=null,this._drawerItems=[],this._showDrawer=!1,this._isMobile=!1,this._handleClickOutOfElement=e=>{this._sidebarActiveGroup&&(e.composedPath().includes(this)||(this._showDrawer=!1))}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","navigation"),this.setAttribute("aria-label","Main navigation"),this.updateComplete.then(()=>{this.addItemListeners(),this._handleActive(),document.addEventListener("click",this._handleClickOutOfElement)}),window.addEventListener("resize",this._handleResize.bind(this)),this._handleResize()}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._handleClickOutOfElement),window.removeEventListener("resize",this._handleResize.bind(this))}_handleCollapsed(){this._sidebarCollapsed=this.collapsed}_handleActiveItem(){if(!this._sidebarActiveItem)return;const e=this._sidebarActiveItem._childLevel;if(this._sidebarActiveItem._selected=!0,0===e)this._sidebarActiveItem._childElements.length>0?this._setNodesToDrawer(this._sidebarActiveItem):this._revertNodesToParent();else{let e=this._sidebarActiveItem.parentElement;for(;e._childLevel>=0&&e.tagName.toLowerCase()===od;)e.tagName.toLowerCase()===od&&(0===e._childLevel&&(e.classList.contains("sidebar-nested-overlay")||this._setNodesToDrawer(e)),e._selected=!0,e._showMenu=e._childLevel>0,e=e.parentElement);this._sidebarActiveGroup&&(this._sidebarActiveGroup._selected=!0)}}_handleActive(){this.active?this._sidebarActiveItem=this._getActiveChild():this._sidebarActiveItem=null}_getActiveChild(){const e=t=>{var s;for(const i of t){if(i.name===this.active)return i;if(null===(s=i._childElements)||void 0===s?void 0:s.length){const t=e(i._childElements);if(t)return t}}return null};return e(this._defaultNodes)}_handleResize(){const e=window.innerWidth<=512;e!==this._isMobile&&(this._isMobile=e,this.collapsed=this._isMobile)}_setNodesToDrawer(e){if(!e)return;this._sidebarActiveGroup&&e!==this._sidebarActiveGroup&&this._revertNodesToParent(),this._sidebarActiveGroup=e,this._drawerItems=[];this._sidebarActiveGroup.querySelectorAll(":scope > sgds-sidebar-group, :scope > sgds-sidebar-item").forEach(e=>{this._drawerItems.push(e)})}_revertNodesToParent(){this._sidebarActiveGroup&&(this._drawerItems.forEach(e=>{this._sidebarActiveGroup.append(e)}),this._drawerItems=[]),this._sidebarActiveGroup=null}addItemListeners(){const e=[...this.querySelectorAll("sgds-sidebar-item"),...this.querySelectorAll(od)];e.forEach(t=>{t.addEventListener("i-sgds-click",s=>{const i=s.detail.element;if(i===this._sidebarActiveGroup)this._showDrawer=!this._showDrawer;else{if(this.active!==i.name&&(this.active=i.name,e.forEach(e=>e._selected=!1)),i._childElements.length>0)this._showDrawer=!0;else{this._showDrawer=!1;const e=t.querySelector(":scope > a");e&&e.click()}this.emit("sgds-select",{detail:{activeItem:i.name}})}})})}toggleCollapsed(){this.collapsed=!this.collapsed}render(){var e,t;return te`
       <div
         class=${Ke({sidebar:!0,"sidebar--expanded":!this._sidebarCollapsed,"sidebar--collapsed":this._sidebarCollapsed})}
       >
-        <div class="sidebar-wrapper">
-          <div class="sidebar-header">
-            <div class="sidebar-brand-name">
-              <slot name="brandName"></slot>
+        <div class="sidebar-main">
+          <div class="sidebar-wrapper">
+            <div class="sidebar-top">
+              <div class="sidebar-brand-name">
+                <slot name="top"></slot>
+              </div>
+
+              <sgds-icon-button
+                name=${this._sidebarCollapsed?"sidebar-expand":"sidebar-collapse"}
+                variant="ghost"
+                tone="neutral"
+                size="sm"
+                @click=${this.toggleCollapsed}
+                aria-label=${this._sidebarCollapsed?"Expand sidebar":"Collapse sidebar"}
+                aria-expanded=${!this._sidebarCollapsed}
+              ></sgds-icon-button>
             </div>
 
-            <sgds-icon-button
-              name=${this._sidebarCollapsed?"sidebar-expand":"sidebar-collapse"}
-              variant="ghost"
-              tone="neutral"
-              size="sm"
-              @click=${this.toggleCollapsed}
-              aria-label=${this._sidebarCollapsed?"Expand sidebar":"Collapse sidebar"}
-              aria-expanded=${!this._sidebarCollapsed}
-            ></sgds-icon-button>
-          </div>
+            <nav
+              class="sidebar-content"
+              role="navigation"
+              aria-label="Main navigation"
+              aria-activedescendant=${(null===(e=this._sidebarActiveItem)||void 0===e?void 0:e.name)||""}
+            >
+              <slot></slot>
+            </nav>
 
-          <nav class="sidebar-content" role="navigation" aria-label="Main navigation" aria-activedescendant=${(null===(e=this._sidebarActiveItem)||void 0===e?void 0:e.name)||""}>
-            <slot></slot>
-          </nav>
+            <slot name="bottom"></slot>
+          </div>
         </div>
 
-          <div
-            class=${Ke({"sidebar-nested-overlay":!0,show:this._showDrawer})}
-            role="dialog"
-            aria-label=${(null===(t=this._sidebarActiveGroup)||void 0===t?void 0:t.title)?`Nested items for ${this._sidebarActiveGroup.title}`:""}
-          >
-            ${this._drawerItems}
-          </div>
+        <div
+          class=${Ke({"sidebar-nested-overlay":!0,show:this._showDrawer})}
+          role="dialog"
+          aria-label=${(null===(t=this._sidebarActiveGroup)||void 0===t?void 0:t.title)?`Nested items for ${this._sidebarActiveGroup.title}`:""}
+        >
+          <sgds-icon-button
+            name="chevron-left"
+            variant="ghost"
+            tone="neutral"
+            size="sm"
+            @click=${()=>this._showDrawer=!1}
+            aria-label=${"Close drawer"}
+            aria-expanded=${this._showDrawer}
+          ></sgds-icon-button>
+
+          ${this._drawerItems}
         </div>
       </div>
-    `}}nd.styles=[...He.styles,ad],t([De({type:Boolean,reflect:!0})],nd.prototype,"collapsed",void 0),t([De({type:String,reflect:!0})],nd.prototype,"active",void 0),t([xl({context:"sidebar-active-group"}),Ee()],nd.prototype,"_sidebarActiveGroup",void 0),t([xl({context:"sidebar-collapsed"}),Ee()],nd.prototype,"_sidebarCollapsed",void 0),t([xl({context:"sidebar-active"}),Ee()],nd.prototype,"_sidebarActiveItem",void 0),t([xl({context:"sidebar-drawer-items"}),Ee()],nd.prototype,"_drawerItems",void 0),t([xl({context:"sidebar-drawer-open"}),Ee()],nd.prototype,"_showDrawer",void 0),t([Te()],nd.prototype,"_defaultNodes",void 0),t([ot("collapsed")],nd.prototype,"_handleCollapsed",null),t([ot("_sidebarActiveItem")],nd.prototype,"_handleActiveItem",null),t([ot("active")],nd.prototype,"_handleActive",null);var rd=r`:host{--sidenav-sticky-top:0rem;padding:var(--sgds-padding-md)}.sticky{height:calc(100vh - var(--sidenav-sticky-top));overflow-y:visible;position:sticky;top:var(--sidenav-sticky-top)}`;class ld extends He{constructor(){super(...arguments),this.sticky=!1}get items(){return[...this.defaultNodes||[]].filter(e=>void 0!==e.tagName)}async onToggle(e){const t="SGDS-SIDENAV-LINK"===e.target.tagName;if(e.defaultPrevented||t)return;this.items}render(){return te`
+    `}}nd.styles=[...He.styles,ad],nd.dependencies={"sgds-icon-button":er},t([De({type:Boolean,reflect:!0})],nd.prototype,"collapsed",void 0),t([De({type:String,reflect:!0})],nd.prototype,"active",void 0),t([xl({context:"sidebar-active-group"}),Ee()],nd.prototype,"_sidebarActiveGroup",void 0),t([xl({context:"sidebar-collapsed"}),Ee()],nd.prototype,"_sidebarCollapsed",void 0),t([xl({context:"sidebar-active"}),Ee()],nd.prototype,"_sidebarActiveItem",void 0),t([xl({context:"sidebar-drawer-items"}),Ee()],nd.prototype,"_drawerItems",void 0),t([xl({context:"sidebar-drawer-open"}),Ee()],nd.prototype,"_showDrawer",void 0),t([Te()],nd.prototype,"_defaultNodes",void 0),t([Ee()],nd.prototype,"_isMobile",void 0),t([ot("collapsed")],nd.prototype,"_handleCollapsed",null),t([ot("_sidebarActiveItem")],nd.prototype,"_handleActiveItem",null),t([ot("active")],nd.prototype,"_handleActive",null);var rd=r`:host{--sidenav-sticky-top:0rem;padding:var(--sgds-padding-md)}.sticky{height:calc(100vh - var(--sidenav-sticky-top));overflow-y:visible;position:sticky;top:var(--sidenav-sticky-top)}`;class ld extends He{constructor(){super(...arguments),this.sticky=!1}get items(){return[...this.defaultNodes||[]].filter(e=>void 0!==e.tagName)}async onToggle(e){const t="SGDS-SIDENAV-LINK"===e.target.tagName;if(e.defaultPrevented||t)return;this.items}render(){return te`
       <nav class=${Ke({sticky:this.sticky})}>
         <div>
           <slot @click=${this.onToggle}></slot>