@hashicorp/design-system-components 4.4.0 → 4.5.0

package/dist/components/hds/side-nav/index.js

@@ -1,4 +1,4 @@
-import { _ as _applyDecoratedDescriptor, b as _initializerDefineProperty, a as _defineProperty } from '../../../_rollupPluginBabelHelpers-NoJJJNhk.js';
+import { _ as _applyDecoratedDescriptor, b as _initializerDefineProperty, a as _defineProperty } from '../../../_rollupPluginBabelHelpers-KIi_qCIU.js';
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
@@ -7,12 +7,12 @@ import { registerDestructor } from '@ember/destroyable';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::Base\n  class={{this.classNames}}\n  ...attributes\n  {{on \"transitionstart\" (fn this.setTransition \"start\")}}\n  {{on \"transitionend\" (fn this.setTransition \"end\")}}\n  {{focus-trap isActive=this.shouldTrapFocus}}\n  {{did-insert this.didInsert}}\n>\n  <:root>\n    {{#if this.hasA11yRefocus}}\n      <NavigationNarrator\n        @routeChangeValidator={{@a11yRefocusRouteChangeValidator}}\n        @skipTo=\"#{{@a11yRefocusSkipTo}}\"\n        @skipText={{@a11yRefocusSkipText}}\n        @navigationText={{@a11yRefocusNavigationText}}\n      />\n    {{/if}}\n    {{#if this.showToggleButton}}\n      {{! template-lint-disable no-invalid-interactive}}\n      <div class=\"hds-side-nav__overlay\" {{on \"click\" this.toggleMinimizedStatus}} />\n      {{! template-lint-enable no-invalid-interactive}}\n      <Hds::SideNav::ToggleButton\n        aria-label={{this.ariaLabel}}\n        @icon={{if this.isMinimized \"chevrons-right\" \"chevrons-left\"}}\n        {{on \"click\" this.toggleMinimizedStatus}}\n      />\n    {{/if}}\n  </:root>\n  <:header as |Header|>\n    {{yield (hash Header=Header isMinimized=this.isMinimized) to=\"header\"}}\n  </:header>\n  <:body as |Body|>\n    {{yield (hash Body=Body isMinimized=this.isMinimized) to=\"body\"}}\n  </:body>\n  <:footer as |Footer|>\n    {{yield (hash Footer=Footer isMinimized=this.isMinimized) to=\"footer\"}}\n  </:footer>\n</Hds::SideNav::Base>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::Base\n  class={{this.classNames}}\n  ...attributes\n  {{on \"transitionstart\" (fn this.setTransition \"start\")}}\n  {{on \"transitionend\" (fn this.setTransition \"end\")}}\n  {{! @glint-expect-error - https://github.com/josemarluedke/ember-focus-trap/issues/86 }}\n  {{focus-trap isActive=this.shouldTrapFocus}}\n  {{did-insert this.didInsert}}\n>\n  <:root>\n    {{#if this.hasA11yRefocus}}\n      {{! @glint-expect-error - `ember-a11y-refocus` doesn\'t expose types yet }}\n      <NavigationNarrator\n        @routeChangeValidator={{@a11yRefocusRouteChangeValidator}}\n        @skipTo=\"#{{@a11yRefocusSkipTo}}\"\n        @skipText={{@a11yRefocusSkipText}}\n        @navigationText={{@a11yRefocusNavigationText}}\n        @excludeAllQueryParams={{@a11yRefocusExcludeAllQueryParams}}\n      />\n    {{/if}}\n    {{#if this.showToggleButton}}\n      {{! template-lint-disable no-invalid-interactive}}\n      <div class=\"hds-side-nav__overlay\" {{on \"click\" this.toggleMinimizedStatus}} />\n      {{! template-lint-enable no-invalid-interactive}}\n      <Hds::SideNav::ToggleButton\n        aria-label={{this.ariaLabel}}\n        @icon={{if this.isMinimized \"chevrons-right\" \"chevrons-left\"}}\n        {{on \"click\" this.toggleMinimizedStatus}}\n      />\n    {{/if}}\n  </:root>\n  <:header as |Header|>\n    {{yield (hash Header=Header isMinimized=this.isMinimized) to=\"header\"}}\n  </:header>\n  <:body as |Body|>\n    {{yield (hash Body=Body isMinimized=this.isMinimized) to=\"body\"}}\n  </:body>\n  <:footer as |Footer|>\n    {{yield (hash Footer=Footer isMinimized=this.isMinimized) to=\"footer\"}}\n  </:footer>\n</Hds::SideNav::Base>");
 
 var _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5;
 let HdsSideNavComponent = (_class = class HdsSideNavComponent extends Component {
-  constructor() {
-    super(...arguments);
+  constructor(owner, args) {
+    super(owner, args);
     _initializerDefineProperty(this, "isResponsive", _descriptor, this);
     // controls if the component reacts to viewport changes
     _initializerDefineProperty(this, "isMinimized", _descriptor2, this);
@@ -21,6 +21,8 @@ let HdsSideNavComponent = (_class = class HdsSideNavComponent extends Component
     // controls if users can collapse the sidenav on 'desktop' viewports
     _initializerDefineProperty(this, "isAnimating", _descriptor4, this);
     _initializerDefineProperty(this, "isDesktop", _descriptor5, this);
+    _defineProperty(this, "desktopMQ", void 0);
+    _defineProperty(this, "containersToHide", void 0);
     _defineProperty(this, "hasA11yRefocus", this.args.hasA11yRefocus ?? true);
     _defineProperty(this, "desktopMQVal", getComputedStyle(document.documentElement).getPropertyValue('--hds-app-desktop-breakpoint'));
     this.desktopMQ = window.matchMedia(`(min-width:${this.desktopMQVal})`);
@@ -37,10 +39,12 @@ let HdsSideNavComponent = (_class = class HdsSideNavComponent extends Component
     this.desktopMQ.addEventListener('change', this.updateDesktopVariable, true);
     // if not instantiated as minimized via arguments
     if (!this.args.isMinimized) {
-      // set initial state based on viewport
-      this.updateDesktopVariable({
-        matches: this.desktopMQ.matches
+      // set initial state based on viewport using a "synthetic" event
+      const syntheticEvent = new MediaQueryListEvent('change', {
+        matches: this.desktopMQ.matches,
+        media: this.desktopMQ.media
       });
+      this.updateDesktopVariable(syntheticEvent);
     }
   }
   removeEventListeners() {
@@ -66,7 +70,7 @@ let HdsSideNavComponent = (_class = class HdsSideNavComponent extends Component
     return this.args.ariaLabel ?? 'Close menu';
   }
   get classNames() {
-    let classes = []; // `hds-side-nav` is already set by the "Hds::SideNav::Base" component
+    const classes = []; // `hds-side-nav` is already set by the "Hds::SideNav::Base" component
 
     // add specific class names for the different possible states
     if (this.isResponsive) {
@@ -101,7 +105,7 @@ let HdsSideNavComponent = (_class = class HdsSideNavComponent extends Component
         element.removeAttribute('inert');
       }
     });
-    let {
+    const {
       onToggleMinimizedStatus
     } = this.args;
     if (typeof onToggleMinimizedStatus === 'function') {
@@ -127,7 +131,7 @@ let HdsSideNavComponent = (_class = class HdsSideNavComponent extends Component
 
     // automatically minimize on narrow viewports (when not in desktop mode)
     this.isMinimized = !this.isDesktop;
-    let {
+    const {
       onDesktopViewportChange
     } = this.args;
     if (typeof onDesktopViewportChange === 'function') {

package/dist/components/hds/side-nav/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/hds/side-nav/index.hbs","../../../../src/components/hds/side-nav/index.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::Base\\n  class={{this.classNames}}\\n  ...attributes\\n  {{on \\\"transitionstart\\\" (fn this.setTransition \\\"start\\\")}}\\n  {{on \\\"transitionend\\\" (fn this.setTransition \\\"end\\\")}}\\n  {{focus-trap isActive=this.shouldTrapFocus}}\\n  {{did-insert this.didInsert}}\\n>\\n  <:root>\\n    {{#if this.hasA11yRefocus}}\\n      <NavigationNarrator\\n        @routeChangeValidator={{@a11yRefocusRouteChangeValidator}}\\n        @skipTo=\\\"#{{@a11yRefocusSkipTo}}\\\"\\n        @skipText={{@a11yRefocusSkipText}}\\n        @navigationText={{@a11yRefocusNavigationText}}\\n      />\\n    {{/if}}\\n    {{#if this.showToggleButton}}\\n      {{! template-lint-disable no-invalid-interactive}}\\n      <div class=\\\"hds-side-nav__overlay\\\" {{on \\\"click\\\" this.toggleMinimizedStatus}} />\\n      {{! template-lint-enable no-invalid-interactive}}\\n      <Hds::SideNav::ToggleButton\\n        aria-label={{this.ariaLabel}}\\n        @icon={{if this.isMinimized \\\"chevrons-right\\\" \\\"chevrons-left\\\"}}\\n        {{on \\\"click\\\" this.toggleMinimizedStatus}}\\n      />\\n    {{/if}}\\n  </:root>\\n  <:header as |Header|>\\n    {{yield (hash Header=Header isMinimized=this.isMinimized) to=\\\"header\\\"}}\\n  </:header>\\n  <:body as |Body|>\\n    {{yield (hash Body=Body isMinimized=this.isMinimized) to=\\\"body\\\"}}\\n  </:body>\\n  <:footer as |Footer|>\\n    {{yield (hash Footer=Footer isMinimized=this.isMinimized) to=\\\"footer\\\"}}\\n  </:footer>\\n</Hds::SideNav::Base>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { assert } from '@ember/debug';\nimport { registerDestructor } from '@ember/destroyable';\n\nexport default class HdsSideNavComponent extends Component {\n  @tracked isResponsive = this.args.isResponsive ?? true; // controls if the component reacts to viewport changes\n  @tracked isMinimized = this.args.isMinimized ?? false; // sets the default state on 'desktop' viewports\n  @tracked isCollapsible = this.args.isCollapsible ?? false; // controls if users can collapse the sidenav on 'desktop' viewports\n  @tracked isAnimating = false;\n  @tracked isDesktop = true;\n  hasA11yRefocus = this.args.hasA11yRefocus ?? true;\n\n  desktopMQVal = getComputedStyle(document.documentElement).getPropertyValue(\n    '--hds-app-desktop-breakpoint'\n  );\n\n  constructor() {\n    super(...arguments);\n    this.desktopMQ = window.matchMedia(`(min-width:${this.desktopMQVal})`);\n    this.addEventListeners();\n    registerDestructor(this, () => {\n      this.removeEventListeners();\n    });\n\n    if (this.args.hasA11yRefocus) {\n      assert(\n        '@a11yRefocusSkipTo for NavigatorNarrator (a11y-refocus) in \"Hds::SideNav\" must have a valid value',\n        this.args.a11yRefocusSkipTo !== undefined\n      );\n    }\n  }\n\n  addEventListeners() {\n    document.addEventListener('keydown', this.escapePress, true);\n    this.desktopMQ.addEventListener('change', this.updateDesktopVariable, true);\n    // if not instantiated as minimized via arguments\n    if (!this.args.isMinimized) {\n      // set initial state based on viewport\n      this.updateDesktopVariable({ matches: this.desktopMQ.matches });\n    }\n  }\n\n  removeEventListeners() {\n    document.removeEventListener('keydown', this.escapePress, true);\n    this.desktopMQ.removeEventListener(\n      'change',\n      this.updateDesktopVariable,\n      true\n    );\n  }\n\n  get shouldTrapFocus() {\n    return this.isResponsive && !this.isDesktop && !this.isMinimized;\n  }\n\n  get showToggleButton() {\n    return (this.isResponsive && !this.isDesktop) || this.isCollapsible;\n  }\n\n  /**\n   * @param ariaLabel\n   * @type {string}\n   * @default 'close menu'\n   */\n  get ariaLabel() {\n    if (this.isMinimized) {\n      return this.args.ariaLabel ?? 'Open menu';\n    }\n    return this.args.ariaLabel ?? 'Close menu';\n  }\n\n  get classNames() {\n    let classes = []; // `hds-side-nav` is already set by the \"Hds::SideNav::Base\" component\n\n    // add specific class names for the different possible states\n    if (this.isResponsive) {\n      classes.push('hds-side-nav--is-responsive');\n    }\n    if (!this.isDesktop && this.isResponsive) {\n      classes.push('hds-side-nav--is-mobile');\n    } else {\n      classes.push('hds-side-nav--is-desktop');\n    }\n    if (this.isMinimized && this.isResponsive) {\n      classes.push('hds-side-nav--is-minimized');\n    } else {\n      classes.push('hds-side-nav--is-not-minimized');\n    }\n    if (this.isAnimating) {\n      classes.push('hds-side-nav--is-animating');\n    }\n\n    return classes.join(' ');\n  }\n\n  @action\n  escapePress(event) {\n    if (event.key === 'Escape' && !this.isMinimized && !this.isDesktop) {\n      this.isMinimized = true;\n    }\n  }\n\n  @action\n  toggleMinimizedStatus() {\n    this.isMinimized = !this.isMinimized;\n\n    this.containersToHide.forEach((element) => {\n      if (this.isMinimized) {\n        element.setAttribute('inert', '');\n      } else {\n        element.removeAttribute('inert');\n      }\n    });\n\n    let { onToggleMinimizedStatus } = this.args;\n\n    if (typeof onToggleMinimizedStatus === 'function') {\n      onToggleMinimizedStatus(this.isMinimized);\n    }\n  }\n\n  @action\n  didInsert(element) {\n    this.containersToHide = element.querySelectorAll(\n      '.hds-side-nav-hide-when-minimized'\n    );\n  }\n\n  @action\n  setTransition(phase, event) {\n    // we only want to respond to `width` animation/transitions\n    if (event.propertyName !== 'width') {\n      return;\n    }\n    if (phase === 'start') {\n      this.isAnimating = true;\n    } else {\n      this.isAnimating = false;\n    }\n  }\n\n  @action\n  updateDesktopVariable(event) {\n    this.isDesktop = event.matches;\n\n    // automatically minimize on narrow viewports (when not in desktop mode)\n    this.isMinimized = !this.isDesktop;\n\n    let { onDesktopViewportChange } = this.args;\n\n    if (typeof onDesktopViewportChange === 'function') {\n      onDesktopViewportChange(this.isDesktop);\n    }\n  }\n}\n"],"names":["HdsSideNavComponent","_class","Component","constructor","arguments","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","_descriptor4","_descriptor5","_defineProperty","args","hasA11yRefocus","getComputedStyle","document","documentElement","getPropertyValue","desktopMQ","window","matchMedia","desktopMQVal","addEventListeners","registerDestructor","removeEventListeners","assert","a11yRefocusSkipTo","undefined","addEventListener","escapePress","updateDesktopVariable","isMinimized","matches","removeEventListener","shouldTrapFocus","isResponsive","isDesktop","showToggleButton","isCollapsible","ariaLabel","classNames","classes","push","isAnimating","join","event","key","toggleMinimizedStatus","containersToHide","forEach","element","setAttribute","removeAttribute","onToggleMinimizedStatus","didInsert","querySelectorAll","setTransition","phase","propertyName","onDesktopViewportChange","_applyDecoratedDescriptor","prototype","tracked","configurable","enumerable","writable","initializer","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/hds/side-nav/index.hbs","../../../../src/components/hds/side-nav/index.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::Base\\n  class={{this.classNames}}\\n  ...attributes\\n  {{on \\\"transitionstart\\\" (fn this.setTransition \\\"start\\\")}}\\n  {{on \\\"transitionend\\\" (fn this.setTransition \\\"end\\\")}}\\n  {{! @glint-expect-error - https://github.com/josemarluedke/ember-focus-trap/issues/86 }}\\n  {{focus-trap isActive=this.shouldTrapFocus}}\\n  {{did-insert this.didInsert}}\\n>\\n  <:root>\\n    {{#if this.hasA11yRefocus}}\\n      {{! @glint-expect-error - `ember-a11y-refocus` doesn\\'t expose types yet }}\\n      <NavigationNarrator\\n        @routeChangeValidator={{@a11yRefocusRouteChangeValidator}}\\n        @skipTo=\\\"#{{@a11yRefocusSkipTo}}\\\"\\n        @skipText={{@a11yRefocusSkipText}}\\n        @navigationText={{@a11yRefocusNavigationText}}\\n        @excludeAllQueryParams={{@a11yRefocusExcludeAllQueryParams}}\\n      />\\n    {{/if}}\\n    {{#if this.showToggleButton}}\\n      {{! template-lint-disable no-invalid-interactive}}\\n      <div class=\\\"hds-side-nav__overlay\\\" {{on \\\"click\\\" this.toggleMinimizedStatus}} />\\n      {{! template-lint-enable no-invalid-interactive}}\\n      <Hds::SideNav::ToggleButton\\n        aria-label={{this.ariaLabel}}\\n        @icon={{if this.isMinimized \\\"chevrons-right\\\" \\\"chevrons-left\\\"}}\\n        {{on \\\"click\\\" this.toggleMinimizedStatus}}\\n      />\\n    {{/if}}\\n  </:root>\\n  <:header as |Header|>\\n    {{yield (hash Header=Header isMinimized=this.isMinimized) to=\\\"header\\\"}}\\n  </:header>\\n  <:body as |Body|>\\n    {{yield (hash Body=Body isMinimized=this.isMinimized) to=\\\"body\\\"}}\\n  </:body>\\n  <:footer as |Footer|>\\n    {{yield (hash Footer=Footer isMinimized=this.isMinimized) to=\\\"footer\\\"}}\\n  </:footer>\\n</Hds::SideNav::Base>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { assert } from '@ember/debug';\nimport { registerDestructor } from '@ember/destroyable';\n\nimport type { HdsSideNavBaseSignature } from './base';\n\ninterface HdsSideNavSignature {\n  Args: {\n    isResponsive?: boolean;\n    isCollapsible?: boolean;\n    isMinimized?: boolean;\n    hasA11yRefocus?: boolean;\n    a11yRefocusSkipTo?: string;\n    a11yRefocusSkipText?: string;\n    a11yRefocusNavigationText?: string;\n    a11yRefocusRouteChangeValidator?: string;\n    a11yRefocusExcludeAllQueryParams?: boolean;\n    ariaLabel?: string;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    onToggleMinimizedStatus?: (arg: boolean) => void;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    onDesktopViewportChange?: (arg: boolean) => void;\n  };\n  Blocks: {\n    header?: [\n      {\n        Header?: HdsSideNavBaseSignature['Blocks']['header'];\n        isMinimized?: boolean;\n      }\n    ];\n    body?: [\n      {\n        Body?: HdsSideNavBaseSignature['Blocks']['body'];\n        isMinimized?: boolean;\n      }\n    ];\n    footer?: [\n      {\n        Footer?: HdsSideNavBaseSignature['Blocks']['footer'];\n        isMinimized?: boolean;\n      }\n    ];\n  };\n  Element: HdsSideNavBaseSignature['Element'];\n}\n\nexport default class HdsSideNavComponent extends Component<HdsSideNavSignature> {\n  @tracked isResponsive = this.args.isResponsive ?? true; // controls if the component reacts to viewport changes\n  @tracked isMinimized = this.args.isMinimized ?? false; // sets the default state on 'desktop' viewports\n  @tracked isCollapsible = this.args.isCollapsible ?? false; // controls if users can collapse the sidenav on 'desktop' viewports\n  @tracked isAnimating = false;\n  @tracked isDesktop = true;\n  desktopMQ: MediaQueryList;\n  containersToHide!: NodeListOf<Element>;\n  hasA11yRefocus = this.args.hasA11yRefocus ?? true;\n\n  desktopMQVal = getComputedStyle(document.documentElement).getPropertyValue(\n    '--hds-app-desktop-breakpoint'\n  );\n\n  constructor(owner: unknown, args: HdsSideNavSignature['Args']) {\n    super(owner, args);\n    this.desktopMQ = window.matchMedia(`(min-width:${this.desktopMQVal})`);\n    this.addEventListeners();\n    registerDestructor(this, () => {\n      this.removeEventListeners();\n    });\n\n    if (this.args.hasA11yRefocus) {\n      assert(\n        '@a11yRefocusSkipTo for NavigatorNarrator (a11y-refocus) in \"Hds::SideNav\" must have a valid value',\n        this.args.a11yRefocusSkipTo !== undefined\n      );\n    }\n  }\n\n  addEventListeners() {\n    document.addEventListener('keydown', this.escapePress, true);\n    this.desktopMQ.addEventListener('change', this.updateDesktopVariable, true);\n    // if not instantiated as minimized via arguments\n    if (!this.args.isMinimized) {\n      // set initial state based on viewport using a \"synthetic\" event\n      const syntheticEvent = new MediaQueryListEvent('change', {\n        matches: this.desktopMQ.matches,\n        media: this.desktopMQ.media,\n      });\n      this.updateDesktopVariable(syntheticEvent);\n    }\n  }\n\n  removeEventListeners() {\n    document.removeEventListener('keydown', this.escapePress, true);\n    this.desktopMQ.removeEventListener(\n      'change',\n      this.updateDesktopVariable,\n      true\n    );\n  }\n\n  get shouldTrapFocus() {\n    return this.isResponsive && !this.isDesktop && !this.isMinimized;\n  }\n\n  get showToggleButton() {\n    return (this.isResponsive && !this.isDesktop) || this.isCollapsible;\n  }\n\n  /**\n   * @param ariaLabel\n   * @type {string}\n   * @default 'close menu'\n   */\n  get ariaLabel() {\n    if (this.isMinimized) {\n      return this.args.ariaLabel ?? 'Open menu';\n    }\n    return this.args.ariaLabel ?? 'Close menu';\n  }\n\n  get classNames() {\n    const classes = []; // `hds-side-nav` is already set by the \"Hds::SideNav::Base\" component\n\n    // add specific class names for the different possible states\n    if (this.isResponsive) {\n      classes.push('hds-side-nav--is-responsive');\n    }\n    if (!this.isDesktop && this.isResponsive) {\n      classes.push('hds-side-nav--is-mobile');\n    } else {\n      classes.push('hds-side-nav--is-desktop');\n    }\n    if (this.isMinimized && this.isResponsive) {\n      classes.push('hds-side-nav--is-minimized');\n    } else {\n      classes.push('hds-side-nav--is-not-minimized');\n    }\n    if (this.isAnimating) {\n      classes.push('hds-side-nav--is-animating');\n    }\n\n    return classes.join(' ');\n  }\n\n  @action\n  escapePress(event: KeyboardEvent) {\n    if (event.key === 'Escape' && !this.isMinimized && !this.isDesktop) {\n      this.isMinimized = true;\n    }\n  }\n\n  @action\n  toggleMinimizedStatus() {\n    this.isMinimized = !this.isMinimized;\n\n    this.containersToHide.forEach((element) => {\n      if (this.isMinimized) {\n        element.setAttribute('inert', '');\n      } else {\n        element.removeAttribute('inert');\n      }\n    });\n\n    const { onToggleMinimizedStatus } = this.args;\n\n    if (typeof onToggleMinimizedStatus === 'function') {\n      onToggleMinimizedStatus(this.isMinimized);\n    }\n  }\n\n  @action\n  didInsert(element: HTMLElement) {\n    this.containersToHide = element.querySelectorAll(\n      '.hds-side-nav-hide-when-minimized'\n    );\n  }\n\n  @action\n  setTransition(phase: string, event: TransitionEvent) {\n    // we only want to respond to `width` animation/transitions\n    if (event.propertyName !== 'width') {\n      return;\n    }\n    if (phase === 'start') {\n      this.isAnimating = true;\n    } else {\n      this.isAnimating = false;\n    }\n  }\n\n  @action\n  updateDesktopVariable(event: MediaQueryListEvent) {\n    this.isDesktop = event.matches;\n\n    // automatically minimize on narrow viewports (when not in desktop mode)\n    this.isMinimized = !this.isDesktop;\n\n    const { onDesktopViewportChange } = this.args;\n\n    if (typeof onDesktopViewportChange === 'function') {\n      onDesktopViewportChange(this.isDesktop);\n    }\n  }\n}\n"],"names":["HdsSideNavComponent","_class","Component","constructor","owner","args","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","_descriptor4","_descriptor5","_defineProperty","hasA11yRefocus","getComputedStyle","document","documentElement","getPropertyValue","desktopMQ","window","matchMedia","desktopMQVal","addEventListeners","registerDestructor","removeEventListeners","assert","a11yRefocusSkipTo","undefined","addEventListener","escapePress","updateDesktopVariable","isMinimized","syntheticEvent","MediaQueryListEvent","matches","media","removeEventListener","shouldTrapFocus","isResponsive","isDesktop","showToggleButton","isCollapsible","ariaLabel","classNames","classes","push","isAnimating","join","event","key","toggleMinimizedStatus","containersToHide","forEach","element","setAttribute","removeAttribute","onToggleMinimizedStatus","didInsert","querySelectorAll","setTransition","phase","propertyName","onDesktopViewportChange","_applyDecoratedDescriptor","prototype","tracked","configurable","enumerable","writable","initializer","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/dist/components/hds/side-nav/list/back-link.js

@@ -2,9 +2,15 @@ import templateOnly from '@ember/component/template-only';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::List::Item>\n  <Hds::Interactive\n    class=\"hds-side-nav__list-item-link hds-side-nav__list-item-link--back-link\"\n    @current-when={{@current-when}}\n    @models={{hds-link-to-models @model @models}}\n    @query={{hds-link-to-query @query}}\n    @replace={{@replace}}\n    @route={{@route}}\n    @isRouteExternal={{@isRouteExternal}}\n    @href={{@href}}\n    @isHrefExternal={{@isHrefExternal}}\n    ...attributes\n  >\n    <FlightIcon class=\"hds-side-nav__list-item-icon-leading\" @name=\"chevron-left\" />\n    <span class=\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\">\n      {{@text}}\n    </span>\n  </Hds::Interactive>\n</Hds::SideNav::List::Item>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::List::Item>\n  <Hds::Interactive\n    class=\"hds-side-nav__list-item-link hds-side-nav__list-item-link--back-link\"\n    @current-when={{@current-when}}\n    @models={{hds-link-to-models @model @models}}\n    @query={{hds-link-to-query @query}}\n    @replace={{@replace}}\n    @route={{@route}}\n    @isRouteExternal={{@isRouteExternal}}\n    @href={{@href}}\n    @isHrefExternal={{@isHrefExternal}}\n    ...attributes\n  >\n    <FlightIcon class=\"hds-side-nav__list-item-icon-leading\" @name=\"chevron-left\" />\n    <span class=\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\">\n      {{@text}}\n    </span>\n  </Hds::Interactive>\n</Hds::SideNav::List::Item>");
 
-var backLink = setComponentTemplate(TEMPLATE, templateOnly());
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+const HdsSideNavListBackLinkComponent = templateOnly();
+var backLink = setComponentTemplate(TEMPLATE, HdsSideNavListBackLinkComponent);
 
 export { backLink as default };
 //# sourceMappingURL=back-link.js.map

package/dist/components/hds/side-nav/list/back-link.js.map

@@ -1 +1 @@
-{"version":3,"file":"back-link.js","sources":["../../../../../src/components/hds/side-nav/list/back-link.hbs","../../../../../src/components/hds/side-nav/list/back-link.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::List::Item>\\n  <Hds::Interactive\\n    class=\\\"hds-side-nav__list-item-link hds-side-nav__list-item-link--back-link\\\"\\n    @current-when={{@current-when}}\\n    @models={{hds-link-to-models @model @models}}\\n    @query={{hds-link-to-query @query}}\\n    @replace={{@replace}}\\n    @route={{@route}}\\n    @isRouteExternal={{@isRouteExternal}}\\n    @href={{@href}}\\n    @isHrefExternal={{@isHrefExternal}}\\n    ...attributes\\n  >\\n    <FlightIcon class=\\\"hds-side-nav__list-item-icon-leading\\\" @name=\\\"chevron-left\\\" />\\n    <span class=\\\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\\\">\\n      {{@text}}\\n    </span>\\n  </Hds::Interactive>\\n</Hds::SideNav::List::Item>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,g0BAAg0B;;ACAl2B,eAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
+{"version":3,"file":"back-link.js","sources":["../../../../../src/components/hds/side-nav/list/back-link.hbs","../../../../../src/components/hds/side-nav/list/back-link.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::List::Item>\\n  <Hds::Interactive\\n    class=\\\"hds-side-nav__list-item-link hds-side-nav__list-item-link--back-link\\\"\\n    @current-when={{@current-when}}\\n    @models={{hds-link-to-models @model @models}}\\n    @query={{hds-link-to-query @query}}\\n    @replace={{@replace}}\\n    @route={{@route}}\\n    @isRouteExternal={{@isRouteExternal}}\\n    @href={{@href}}\\n    @isHrefExternal={{@isHrefExternal}}\\n    ...attributes\\n  >\\n    <FlightIcon class=\\\"hds-side-nav__list-item-icon-leading\\\" @name=\\\"chevron-left\\\" />\\n    <span class=\\\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\\\">\\n      {{@text}}\\n    </span>\\n  </Hds::Interactive>\\n</Hds::SideNav::List::Item>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport TemplateOnlyComponent from '@ember/component/template-only';\n\nimport type { HdsInteractiveSignature } from '../../interactive/';\n\nexport interface HdsSideNavListBackLinkSignature {\n  Args: HdsInteractiveSignature['Args'] & {\n    text: string;\n  };\n  Element: HdsInteractiveSignature['Element'];\n}\n\nconst HdsSideNavListBackLinkComponent =\n  TemplateOnlyComponent<HdsSideNavListBackLinkSignature>();\n\nexport default HdsSideNavListBackLinkComponent;\n"],"names":["HdsSideNavListBackLinkComponent","TemplateOnlyComponent","setComponentTemplate","TEMPLATE"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,uxBAAuxB;;ACDzzB;AACA;AACA;AACA;;AAaA,MAAMA,+BAA+B,GACnCC,YAAqB,EAAmC,CAAA;AAE1D,eAAAC,oBAAA,CAAAC,QAAA,EAAeH,+BAA+B,CAAA;;;;"}

package/dist/components/hds/side-nav/list/index.js

@@ -2,9 +2,15 @@ import templateOnly from '@ember/component/template-only';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<nav class=\"hds-side-nav__list-wrapper\" ...attributes>\n  {{yield (hash ExtraBefore=(component \"hds/yield\"))}}\n  <ul class=\"hds-side-nav__list\" role=\"list\">\n    {{yield\n      (hash\n        Item=(component \"hds/side-nav/list/item\")\n        BackLink=(component \"hds/side-nav/list/back-link\")\n        Title=(component \"hds/side-nav/list/title\")\n        Link=(component \"hds/side-nav/list/link\")\n      )\n    }}\n  </ul>\n  {{yield (hash ExtraAfter=(component \"hds/yield\"))}}\n</nav>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<nav class=\"hds-side-nav__list-wrapper\" ...attributes>\n  {{yield (hash ExtraBefore=(component \"hds/yield\"))}}\n  <ul class=\"hds-side-nav__list\" role=\"list\">\n    {{yield\n      (hash\n        Item=(component \"hds/side-nav/list/item\")\n        BackLink=(component \"hds/side-nav/list/back-link\")\n        Title=(component \"hds/side-nav/list/title\")\n        Link=(component \"hds/side-nav/list/link\")\n      )\n    }}\n  </ul>\n  {{yield (hash ExtraAfter=(component \"hds/yield\"))}}\n</nav>");
 
-var index = setComponentTemplate(TEMPLATE, templateOnly());
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+const HdsSideNavListComponent = templateOnly();
+var index = setComponentTemplate(TEMPLATE, HdsSideNavListComponent);
 
 export { index as default };
 //# sourceMappingURL=index.js.map

package/dist/components/hds/side-nav/list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/hds/side-nav/list/index.hbs","../../../../../src/components/hds/side-nav/list/index.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<nav class=\\\"hds-side-nav__list-wrapper\\\" ...attributes>\\n  {{yield (hash ExtraBefore=(component \\\"hds/yield\\\"))}}\\n  <ul class=\\\"hds-side-nav__list\\\" role=\\\"list\\\">\\n    {{yield\\n      (hash\\n        Item=(component \\\"hds/side-nav/list/item\\\")\\n        BackLink=(component \\\"hds/side-nav/list/back-link\\\")\\n        Title=(component \\\"hds/side-nav/list/title\\\")\\n        Link=(component \\\"hds/side-nav/list/link\\\")\\n      )\\n    }}\\n  </ul>\\n  {{yield (hash ExtraAfter=(component \\\"hds/yield\\\"))}}\\n</nav>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,onBAAonB;;ACAtpB,YAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/hds/side-nav/list/index.hbs","../../../../../src/components/hds/side-nav/list/index.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<nav class=\\\"hds-side-nav__list-wrapper\\\" ...attributes>\\n  {{yield (hash ExtraBefore=(component \\\"hds/yield\\\"))}}\\n  <ul class=\\\"hds-side-nav__list\\\" role=\\\"list\\\">\\n    {{yield\\n      (hash\\n        Item=(component \\\"hds/side-nav/list/item\\\")\\n        BackLink=(component \\\"hds/side-nav/list/back-link\\\")\\n        Title=(component \\\"hds/side-nav/list/title\\\")\\n        Link=(component \\\"hds/side-nav/list/link\\\")\\n      )\\n    }}\\n  </ul>\\n  {{yield (hash ExtraAfter=(component \\\"hds/yield\\\"))}}\\n</nav>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport TemplateOnlyComponent from '@ember/component/template-only';\n\nimport type { ComponentLike } from '@glint/template';\nimport type { HdsYieldSignature } from '../../yield';\nimport type { HdsSideNavListItemSignature } from './item';\nimport type { HdsSideNavListBackLinkSignature } from './back-link';\nimport type { HdsSideNavListTitleSignature } from './title';\nimport type { HdsSideNavListLinkSignature } from './link';\n\nexport interface HdsSideNavListSignature {\n  Blocks: {\n    default: [\n      {\n        ExtraBefore?: ComponentLike<HdsYieldSignature>;\n        Item?: ComponentLike<HdsSideNavListItemSignature>;\n        BackLink?: ComponentLike<HdsSideNavListBackLinkSignature>;\n        Title?: ComponentLike<HdsSideNavListTitleSignature>;\n        Link?: ComponentLike<HdsSideNavListLinkSignature>;\n        ExtraAfter?: ComponentLike<HdsYieldSignature>;\n      }\n    ];\n  };\n  Element: HTMLElement;\n}\n\nconst HdsSideNavListComponent =\n  TemplateOnlyComponent<HdsSideNavListSignature>();\n\nexport default HdsSideNavListComponent;\n"],"names":["HdsSideNavListComponent","TemplateOnlyComponent","setComponentTemplate","TEMPLATE"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,2kBAA2kB;;ACD7mB;AACA;AACA;AACA;;AA2BA,MAAMA,uBAAuB,GAC3BC,YAAqB,EAA2B,CAAA;AAElD,YAAAC,oBAAA,CAAAC,QAAA,EAAeH,uBAAuB,CAAA;;;;"}

package/dist/components/hds/side-nav/list/item.js

@@ -2,9 +2,15 @@ import templateOnly from '@ember/component/template-only';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<li class=\"hds-side-nav__list-item\" ...attributes>\n  {{yield}}\n</li>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<li class=\"hds-side-nav__list-item\" ...attributes>\n  {{yield}}\n</li>");
 
-var item = setComponentTemplate(TEMPLATE, templateOnly());
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+const HdsSideNavListItemComponent = templateOnly();
+var item = setComponentTemplate(TEMPLATE, HdsSideNavListItemComponent);
 
 export { item as default };
 //# sourceMappingURL=item.js.map

package/dist/components/hds/side-nav/list/item.js.map

@@ -1 +1 @@
-{"version":3,"file":"item.js","sources":["../../../../../src/components/hds/side-nav/list/item.hbs","../../../../../src/components/hds/side-nav/list/item.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<li class=\\\"hds-side-nav__list-item\\\" ...attributes>\\n  {{yield}}\\n</li>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,mMAAmM;;ACArO,WAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
+{"version":3,"file":"item.js","sources":["../../../../../src/components/hds/side-nav/list/item.hbs","../../../../../src/components/hds/side-nav/list/item.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<li class=\\\"hds-side-nav__list-item\\\" ...attributes>\\n  {{yield}}\\n</li>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport TemplateOnlyComponent from '@ember/component/template-only';\n\nexport interface HdsSideNavListItemSignature {\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLLIElement;\n}\n\nconst HdsSideNavListItemComponent =\n  TemplateOnlyComponent<HdsSideNavListItemSignature>();\n\nexport default HdsSideNavListItemComponent;\n"],"names":["HdsSideNavListItemComponent","TemplateOnlyComponent","setComponentTemplate","TEMPLATE"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,0JAA0J;;ACD5L;AACA;AACA;AACA;;AAWA,MAAMA,2BAA2B,GAC/BC,YAAqB,EAA+B,CAAA;AAEtD,WAAAC,oBAAA,CAAAC,QAAA,EAAeH,2BAA2B,CAAA;;;;"}

package/dist/components/hds/side-nav/list/link.js

@@ -2,9 +2,15 @@ import templateOnly from '@ember/component/template-only';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::List::Item>\n  <Hds::Interactive\n    class=\"hds-side-nav__list-item-link {{if @isActive \'active\'}}\"\n    @current-when={{@current-when}}\n    @models={{hds-link-to-models @model @models}}\n    @query={{hds-link-to-query @query}}\n    @replace={{@replace}}\n    @route={{@route}}\n    @isRouteExternal={{@isRouteExternal}}\n    @href={{@href}}\n    @isHrefExternal={{@isHrefExternal}}\n    ...attributes\n  >\n    {{#if @icon}}\n      <FlightIcon class=\"hds-side-nav__list-item-icon-leading\" @name={{@icon}} />\n    {{/if}}\n\n    {{#if @text}}\n      <span class=\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\">\n        {{@text}}\n      </span>\n    {{/if}}\n\n    {{#if @count}}\n      <Hds::BadgeCount @text={{@count}} @type=\"inverted\" @size=\"small\" />\n    {{/if}}\n\n    {{#if @badge}}\n      <Hds::Badge @text={{@badge}} @type=\"inverted\" @size=\"small\" />\n    {{/if}}\n\n    {{yield}}\n\n    {{#if @hasSubItems}}\n      <span class=\"hds-side-nav__list-item-icon-trailing\">\n        <FlightIcon @name=\"chevron-right\" @isInlineBlock={{false}} />\n      </span>\n    {{/if}}\n    {{#if @isHrefExternal}}\n      <span class=\"hds-side-nav__list-item-icon-trailing\">\n        <FlightIcon @name=\"external-link\" @isInlineBlock={{false}} />\n      </span>\n    {{/if}}\n  </Hds::Interactive>\n</Hds::SideNav::List::Item>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::List::Item>\n  <Hds::Interactive\n    class=\"hds-side-nav__list-item-link {{if @isActive \'active\'}}\"\n    @current-when={{@current-when}}\n    @models={{hds-link-to-models @model @models}}\n    @query={{hds-link-to-query @query}}\n    @replace={{@replace}}\n    @route={{@route}}\n    @isRouteExternal={{@isRouteExternal}}\n    @href={{@href}}\n    @isHrefExternal={{@isHrefExternal}}\n    ...attributes\n  >\n    {{#if @icon}}\n      <FlightIcon class=\"hds-side-nav__list-item-icon-leading\" @name={{@icon}} />\n    {{/if}}\n\n    {{#if @text}}\n      <span class=\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\">\n        {{@text}}\n      </span>\n    {{/if}}\n\n    {{#if @count}}\n      <Hds::BadgeCount @text={{@count}} @type=\"inverted\" @size=\"small\" />\n    {{/if}}\n\n    {{#if @badge}}\n      <Hds::Badge @text={{@badge}} @type=\"inverted\" @size=\"small\" />\n    {{/if}}\n\n    {{yield}}\n\n    {{#if @hasSubItems}}\n      <span class=\"hds-side-nav__list-item-icon-trailing\">\n        <FlightIcon @name=\"chevron-right\" @isInlineBlock={{false}} />\n      </span>\n    {{/if}}\n    {{#if @isHrefExternal}}\n      <span class=\"hds-side-nav__list-item-icon-trailing\">\n        <FlightIcon @name=\"external-link\" @isInlineBlock={{false}} />\n      </span>\n    {{/if}}\n  </Hds::Interactive>\n</Hds::SideNav::List::Item>");
 
-var link = setComponentTemplate(TEMPLATE, templateOnly());
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+const HdsSideNavListLinkComponent = templateOnly();
+var link = setComponentTemplate(TEMPLATE, HdsSideNavListLinkComponent);
 
 export { link as default };
 //# sourceMappingURL=link.js.map

package/dist/components/hds/side-nav/list/link.js.map

@@ -1 +1 @@
-{"version":3,"file":"link.js","sources":["../../../../../src/components/hds/side-nav/list/link.hbs","../../../../../src/components/hds/side-nav/list/link.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::List::Item>\\n  <Hds::Interactive\\n    class=\\\"hds-side-nav__list-item-link {{if @isActive \\'active\\'}}\\\"\\n    @current-when={{@current-when}}\\n    @models={{hds-link-to-models @model @models}}\\n    @query={{hds-link-to-query @query}}\\n    @replace={{@replace}}\\n    @route={{@route}}\\n    @isRouteExternal={{@isRouteExternal}}\\n    @href={{@href}}\\n    @isHrefExternal={{@isHrefExternal}}\\n    ...attributes\\n  >\\n    {{#if @icon}}\\n      <FlightIcon class=\\\"hds-side-nav__list-item-icon-leading\\\" @name={{@icon}} />\\n    {{/if}}\\n\\n    {{#if @text}}\\n      <span class=\\\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\\\">\\n        {{@text}}\\n      </span>\\n    {{/if}}\\n\\n    {{#if @count}}\\n      <Hds::BadgeCount @text={{@count}} @type=\\\"inverted\\\" @size=\\\"small\\\" />\\n    {{/if}}\\n\\n    {{#if @badge}}\\n      <Hds::Badge @text={{@badge}} @type=\\\"inverted\\\" @size=\\\"small\\\" />\\n    {{/if}}\\n\\n    {{yield}}\\n\\n    {{#if @hasSubItems}}\\n      <span class=\\\"hds-side-nav__list-item-icon-trailing\\\">\\n        <FlightIcon @name=\\\"chevron-right\\\" @isInlineBlock={{false}} />\\n      </span>\\n    {{/if}}\\n    {{#if @isHrefExternal}}\\n      <span class=\\\"hds-side-nav__list-item-icon-trailing\\\">\\n        <FlightIcon @name=\\\"external-link\\\" @isInlineBlock={{false}} />\\n      </span>\\n    {{/if}}\\n  </Hds::Interactive>\\n</Hds::SideNav::List::Item>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,s+CAAs+C;;ACAxgD,WAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
+{"version":3,"file":"link.js","sources":["../../../../../src/components/hds/side-nav/list/link.hbs","../../../../../src/components/hds/side-nav/list/link.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::List::Item>\\n  <Hds::Interactive\\n    class=\\\"hds-side-nav__list-item-link {{if @isActive \\'active\\'}}\\\"\\n    @current-when={{@current-when}}\\n    @models={{hds-link-to-models @model @models}}\\n    @query={{hds-link-to-query @query}}\\n    @replace={{@replace}}\\n    @route={{@route}}\\n    @isRouteExternal={{@isRouteExternal}}\\n    @href={{@href}}\\n    @isHrefExternal={{@isHrefExternal}}\\n    ...attributes\\n  >\\n    {{#if @icon}}\\n      <FlightIcon class=\\\"hds-side-nav__list-item-icon-leading\\\" @name={{@icon}} />\\n    {{/if}}\\n\\n    {{#if @text}}\\n      <span class=\\\"hds-side-nav__list-item-text hds-typography-body-200 hds-font-weight-medium\\\">\\n        {{@text}}\\n      </span>\\n    {{/if}}\\n\\n    {{#if @count}}\\n      <Hds::BadgeCount @text={{@count}} @type=\\\"inverted\\\" @size=\\\"small\\\" />\\n    {{/if}}\\n\\n    {{#if @badge}}\\n      <Hds::Badge @text={{@badge}} @type=\\\"inverted\\\" @size=\\\"small\\\" />\\n    {{/if}}\\n\\n    {{yield}}\\n\\n    {{#if @hasSubItems}}\\n      <span class=\\\"hds-side-nav__list-item-icon-trailing\\\">\\n        <FlightIcon @name=\\\"chevron-right\\\" @isInlineBlock={{false}} />\\n      </span>\\n    {{/if}}\\n    {{#if @isHrefExternal}}\\n      <span class=\\\"hds-side-nav__list-item-icon-trailing\\\">\\n        <FlightIcon @name=\\\"external-link\\\" @isInlineBlock={{false}} />\\n      </span>\\n    {{/if}}\\n  </Hds::Interactive>\\n</Hds::SideNav::List::Item>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport TemplateOnlyComponent from '@ember/component/template-only';\n\nimport type { FlightIconSignature } from '@hashicorp/ember-flight-icons/components/flight-icon';\nimport type { HdsInteractiveSignature } from '../../interactive';\n\nexport interface HdsSideNavListLinkSignature {\n  Args: HdsInteractiveSignature['Args'] & {\n    icon?: FlightIconSignature['Args']['name'];\n    text?: string;\n    badge?: string;\n    count?: string;\n    hasSubItems?: boolean;\n    isActive?: boolean;\n  };\n  Blocks: {\n    default: [];\n  };\n  Element: HdsInteractiveSignature['Element'];\n}\n\nconst HdsSideNavListLinkComponent =\n  TemplateOnlyComponent<HdsSideNavListLinkSignature>();\n\nexport default HdsSideNavListLinkComponent;\n"],"names":["HdsSideNavListLinkComponent","TemplateOnlyComponent","setComponentTemplate","TEMPLATE"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,67CAA67C;;ACD/9C;AACA;AACA;AACA;;AAsBA,MAAMA,2BAA2B,GAC/BC,YAAqB,EAA+B,CAAA;AAEtD,WAAAC,oBAAA,CAAAC,QAAA,EAAeH,2BAA2B,CAAA;;;;"}

package/dist/components/hds/side-nav/list/title.js

@@ -2,9 +2,15 @@ import templateOnly from '@ember/component/template-only';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::List::Item>\n  <div class=\"hds-side-nav__list-title hds-typography-body-100 hds-font-weight-semibold\" ...attributes>{{~yield~}}</div>\n</Hds::SideNav::List::Item>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Hds::SideNav::List::Item>\n  <div class=\"hds-side-nav__list-title hds-typography-body-100 hds-font-weight-semibold\" ...attributes>{{~yield~}}</div>\n</Hds::SideNav::List::Item>");
 
-var title = setComponentTemplate(TEMPLATE, templateOnly());
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+const HdsSideNavListTitleComponent = templateOnly();
+var title = setComponentTemplate(TEMPLATE, HdsSideNavListTitleComponent);
 
 export { title as default };
 //# sourceMappingURL=title.js.map

package/dist/components/hds/side-nav/list/title.js.map

@@ -1 +1 @@
-{"version":3,"file":"title.js","sources":["../../../../../src/components/hds/side-nav/list/title.hbs","../../../../../src/components/hds/side-nav/list/title.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::List::Item>\\n  <div class=\\\"hds-side-nav__list-title hds-typography-body-100 hds-font-weight-semibold\\\" ...attributes>{{~yield~}}</div>\\n</Hds::SideNav::List::Item>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,8SAA8S;;ACAhV,YAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
+{"version":3,"file":"title.js","sources":["../../../../../src/components/hds/side-nav/list/title.hbs","../../../../../src/components/hds/side-nav/list/title.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Hds::SideNav::List::Item>\\n  <div class=\\\"hds-side-nav__list-title hds-typography-body-100 hds-font-weight-semibold\\\" ...attributes>{{~yield~}}</div>\\n</Hds::SideNav::List::Item>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport TemplateOnlyComponent from '@ember/component/template-only';\n\nexport interface HdsSideNavListTitleSignature {\n  Blocks: {\n    default: [];\n  };\n  Element: HTMLDivElement;\n}\n\nconst HdsSideNavListTitleComponent =\n  TemplateOnlyComponent<HdsSideNavListTitleSignature>();\n\nexport default HdsSideNavListTitleComponent;\n"],"names":["HdsSideNavListTitleComponent","TemplateOnlyComponent","setComponentTemplate","TEMPLATE"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,qQAAqQ;;ACDvS;AACA;AACA;AACA;;AAWA,MAAMA,4BAA4B,GAChCC,YAAqB,EAAgC,CAAA;AAEvD,YAAAC,oBAAA,CAAAC,QAAA,EAAeH,4BAA4B,CAAA;;;;"}

package/dist/components/hds/side-nav/portal/index.js

@@ -1,10 +1,16 @@
-import templateOnly from '@ember/component/template-only';
+import Component from '@glimmer/component';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Portal @target={{if @targetName @targetName \"hds-side-nav-portal-target\"}}>\n  <div class=\"hds-side-nav__content-panel\" ...attributes>\n    <Hds::SideNav::List aria-label={{@ariaLabel}} as |ListElements|>\n      {{yield ListElements}}\n    </Hds::SideNav::List>\n  </div>\n</Portal>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<Portal @target={{if @targetName @targetName \"hds-side-nav-portal-target\"}}>\n  <div class=\"hds-side-nav__content-panel\" ...attributes>\n    <Hds::SideNav::List aria-label={{@ariaLabel}} as |ListElements|>\n      {{yield ListElements}}\n    </Hds::SideNav::List>\n  </div>\n</Portal>");
 
-var index = setComponentTemplate(TEMPLATE, templateOnly());
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
 
-export { index as default };
+class HdsSideNavPortalComponent extends Component {}
+setComponentTemplate(TEMPLATE, HdsSideNavPortalComponent);
+
+export { HdsSideNavPortalComponent as default };
 //# sourceMappingURL=index.js.map

package/dist/components/hds/side-nav/portal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/hds/side-nav/portal/index.hbs","../../../../../src/components/hds/side-nav/portal/index.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Portal @target={{if @targetName @targetName \\\"hds-side-nav-portal-target\\\"}}>\\n  <div class=\\\"hds-side-nav__content-panel\\\" ...attributes>\\n    <Hds::SideNav::List aria-label={{@ariaLabel}} as |ListElements|>\\n      {{yield ListElements}}\\n    </Hds::SideNav::List>\\n  </div>\\n</Portal>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,0ZAA0Z;;ACA5b,YAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/hds/side-nav/portal/index.hbs","../../../../../src/components/hds/side-nav/portal/index.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<Portal @target={{if @targetName @targetName \\\"hds-side-nav-portal-target\\\"}}>\\n  <div class=\\\"hds-side-nav__content-panel\\\" ...attributes>\\n    <Hds::SideNav::List aria-label={{@ariaLabel}} as |ListElements|>\\n      {{yield ListElements}}\\n    </Hds::SideNav::List>\\n  </div>\\n</Portal>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\n\nimport type { HdsSideNavListSignature } from '../list/index';\n\n// TODO! understand how this should be done \"correctly\"\n// import type { PortalSignature } from 'ember-stargate/components/portal';\ninterface PortalSignature {\n  Args: {\n    target: string;\n    renderInPlace?: boolean;\n    fallback?: 'inplace';\n  };\n  Blocks: {\n    default: [];\n  };\n}\n\nexport interface HdsSideNavPortalSignature {\n  Args: PortalSignature['Args'] & {\n    ariaLabel?: string;\n    targetName?: string;\n  };\n  Blocks: HdsSideNavListSignature['Blocks'];\n  Element: HTMLDivElement;\n}\n\nexport default class HdsSideNavPortalComponent extends Component<HdsSideNavPortalSignature> {}\n"],"names":["HdsSideNavPortalComponent","Component","setComponentTemplate","TEMPLATE"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,iXAAiX;;ACDnZ;AACA;AACA;AACA;;AA4Be,MAAMA,yBAAyB,SAASC,SAAS,CAA4B,EAAA;AAAEC,oBAAA,CAAAC,QAAA,EAAzEH,yBAAyB,CAAA;;;;"}

package/dist/components/hds/side-nav/portal/target.js

@@ -1,4 +1,4 @@
-import { _ as _applyDecoratedDescriptor, b as _initializerDefineProperty, a as _defineProperty } from '../../../../_rollupPluginBabelHelpers-NoJJJNhk.js';
+import { _ as _applyDecoratedDescriptor, b as _initializerDefineProperty, a as _defineProperty } from '../../../../_rollupPluginBabelHelpers-KIi_qCIU.js';
 import Component from '@glimmer/component';
 import { inject } from '@ember/service';
 import { tracked } from '@glimmer/tracking';
@@ -8,10 +8,10 @@ import Ember from 'ember';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<div class=\"hds-side-nav__content\" ...attributes>\n  <PortalTarget\n    @multiple={{true}}\n    @onChange={{this.panelsChanged}}\n    @name={{if @targetName @targetName \"hds-side-nav-portal-target\"}}\n    class=\"hds-side-nav__content-panels hds-side-nav-hide-when-minimized\"\n    {{did-update this.didUpdateSubnav this.numSubnavs}}\n  />\n</div>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n\n<div class=\"hds-side-nav__content\" ...attributes>\n  <PortalTarget\n    @multiple={{true}}\n    @onChange={{this.panelsChanged}}\n    @name={{if @targetName @targetName \"hds-side-nav-portal-target\"}}\n    class=\"hds-side-nav__content-panels hds-side-nav-hide-when-minimized\"\n    {{did-update this.didUpdateSubnav this.numSubnavs}}\n  />\n</div>");
 
 var _class, _descriptor, _descriptor2, _descriptor3;
-let SidenavPortalTarget = (_class = class SidenavPortalTarget extends Component {
+let HdsSideNavPortalTargetComponent = (_class = class HdsSideNavPortalTargetComponent extends Component {
   constructor(...args) {
     super(...args);
     _initializerDefineProperty(this, "router", _descriptor, this);
@@ -23,7 +23,7 @@ let SidenavPortalTarget = (_class = class SidenavPortalTarget extends Component
     return Ember.testing;
   }
   get prefersReducedMotion() {
-    return this.constructor.prefersReducedMotionOverride || this.prefersReducedMotionMQ && this.prefersReducedMotionMQ.matches;
+    return HdsSideNavPortalTargetComponent.prefersReducedMotionOverride || this.prefersReducedMotionMQ && this.prefersReducedMotionMQ.matches;
   }
   panelsChanged(portalCount) {
     this.numSubnavs = portalCount;
@@ -76,21 +76,21 @@ let SidenavPortalTarget = (_class = class SidenavPortalTarget extends Component
      *
      * */
 
-    let activeIndex = count - 1;
-    let targetElement = element;
-    let {
+    const activeIndex = count - 1;
+    const targetElement = element;
+    const {
       prefersReducedMotion
     } = this;
-    let styles = getComputedStyle(targetElement);
-    let columnWidth = styles.getPropertyValue('--hds-app-sidenav-width-expanded');
-    let slideDuration = prefersReducedMotion ? 0 : 150;
+    const styles = getComputedStyle(targetElement);
+    const columnWidth = styles.getPropertyValue('--hds-app-sidenav-width-expanded');
+    const slideDuration = prefersReducedMotion ? 0 : 150;
     let fadeDuration = prefersReducedMotion ? 0 : 175;
     let fadeDelay = prefersReducedMotion ? 0 : 50;
 
     // slide entire parent panel
-    let start = styles.transform;
-    let end = `translateX(-${activeIndex * parseInt(columnWidth, 10)}px)`;
-    let anim = targetElement.animate([{
+    const start = styles.transform;
+    const end = `translateX(-${activeIndex * parseInt(columnWidth, 10)}px)`;
+    const anim = targetElement.animate([{
       transform: start
     }, {
       transform: end
@@ -103,8 +103,8 @@ let SidenavPortalTarget = (_class = class SidenavPortalTarget extends Component
       // uncomment this if we need/want to scroll the element to the top
       // targetElement.scrollIntoView(true);
       if (activeIndex > 0) {
-        let allPrev = Array.from(targetElement.children).slice(0, activeIndex);
-        for (let ele of allPrev) {
+        const allPrev = Array.from(targetElement.children).slice(0, activeIndex);
+        for (const ele of allPrev) {
           ele.ariaHidden = 'true';
           ele.style.setProperty('visibility', 'hidden');
           ele.style.setProperty('opacity', '0');
@@ -120,18 +120,20 @@ let SidenavPortalTarget = (_class = class SidenavPortalTarget extends Component
     });
 
     // fade in next panel
-    let nextPanelEl = targetElement.children[activeIndex];
+    const nextPanelEl = targetElement.children[activeIndex];
 
     // get reference to last child panel
-    let lastPanelEl = targetElement.children[targetElement.children.length - 1];
+    const lastPanelEl = targetElement.children[targetElement.children.length - 1];
     if (nextPanelEl) {
       nextPanelEl.ariaHidden = 'false';
       nextPanelEl.style.setProperty('visibility', 'visible');
       // this eliminates a flicker if there's only one subnav rendering or if we
       // already just rendered this panel.
-      if (activeIndex === 0 || nextPanelEl.isSameNode(this.lastPanelEl)) {
-        fadeDelay = 0;
-        fadeDuration = 0;
+      if (this.lastPanelEl) {
+        if (activeIndex === 0 || nextPanelEl.isSameNode(this.lastPanelEl)) {
+          fadeDelay = 0;
+          fadeDuration = 0;
+        }
       }
 
       // remember the last panel
@@ -163,11 +165,9 @@ let SidenavPortalTarget = (_class = class SidenavPortalTarget extends Component
   configurable: true,
   enumerable: true,
   writable: true,
-  initializer: function () {
-    return null;
-  }
+  initializer: null
 }), _applyDecoratedDescriptor(_class.prototype, "panelsChanged", [action], Object.getOwnPropertyDescriptor(_class.prototype, "panelsChanged"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "didUpdateSubnav", [action], Object.getOwnPropertyDescriptor(_class.prototype, "didUpdateSubnav"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "animateSubnav", [action], Object.getOwnPropertyDescriptor(_class.prototype, "animateSubnav"), _class.prototype)), _class);
-setComponentTemplate(TEMPLATE, SidenavPortalTarget);
+setComponentTemplate(TEMPLATE, HdsSideNavPortalTargetComponent);
 
-export { SidenavPortalTarget as default };
+export { HdsSideNavPortalTargetComponent as default };
 //# sourceMappingURL=target.js.map

package/dist/components/hds/side-nav/portal/target.js.map

@@ -1 +1 @@
-{"version":3,"file":"target.js","sources":["../../../../../src/components/hds/side-nav/portal/target.hbs","../../../../../src/components/hds/side-nav/portal/target.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<div class=\\\"hds-side-nav__content\\\" ...attributes>\\n  <PortalTarget\\n    @multiple={{true}}\\n    @onChange={{this.panelsChanged}}\\n    @name={{if @targetName @targetName \\\"hds-side-nav-portal-target\\\"}}\\n    class=\\\"hds-side-nav__content-panels hds-side-nav-hide-when-minimized\\\"\\n    {{did-update this.didUpdateSubnav this.numSubnavs}}\\n  />\\n</div>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { inject as service } from '@ember/service';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { DEBUG } from '@glimmer/env';\nimport Ember from 'ember';\n\nexport default class SidenavPortalTarget extends Component {\n  @service router;\n\n  @tracked numSubnavs = 0;\n  @tracked lastPanelEl = null;\n\n  static get prefersReducedMotionOverride() {\n    return Ember.testing;\n  }\n\n  prefersReducedMotionMQ = window.matchMedia(\n    '(prefers-reduced-motion: reduce)'\n  );\n\n  get prefersReducedMotion() {\n    return (\n      this.constructor.prefersReducedMotionOverride ||\n      (this.prefersReducedMotionMQ && this.prefersReducedMotionMQ.matches)\n    );\n  }\n\n  @action\n  panelsChanged(portalCount) {\n    this.numSubnavs = portalCount;\n  }\n\n  @action\n  didUpdateSubnav(element, [count]) {\n    this.animateSubnav(element, [count]);\n  }\n\n  @action\n  animateSubnav(element, [count]) {\n    /*\n     * Here is what the layout looks like for this setup\n     *\n\n                                    SideNav\n                                    +----------------------+\n                                    | +------------------+ |\n                                    | |    (\"header\")    | |\n                                    | +------------------+ |\n                                    |                      |\n                                    | +------------------+ |\n                                    | |    (\"body\")      | |\n        (PortalTarget)              | |                  | |\n        +----------------------------------------------+ | |\n        | +----------+  +----------+  |  +----------+  | | |\n        | | (Portal) |  | (Portal) |     | (Portal) |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |  hidden  |  |  hidden  |     | *active* |  | | |\n        | |   panel  |  |   panel  |  |  |   panel  |  | | |\n        | |          |  |          |     |          |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |          |  |          |     |          |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |          |  |          |     |          |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |          |  |          |     |          |  | | |\n        | +----------+  +----------+  |  +----------+  | | |\n        +----------------------------------------------+ | |\n                                    | |                  | |\n                                    | +------------------+ |\n                                    |                      |\n                                    | +------------------+ |\n                                    | |    (\"footer\")    | |\n                                    | +------------------+ |\n                                    +----------------------+\n\n     *\n     * every time `HcAppFrame::SideNav::Portal` renders, it contains a portaled \"panel\"\n     * that is rendered into the `hds-side-nav__content-panels` (inside the PortalTarget).\n     *\n     * Rendering or unrendering other `HcAppFrame::SideNav::Portal`s triggers the number of\n     * subnavs to change (via `numSubnavs`), so this function runs and slides\n     * `hds-side-nav__content-panels` left or right using the `element.animate` api.\n     *\n     * */\n\n    let activeIndex = count - 1;\n    let targetElement = element;\n    let { prefersReducedMotion } = this;\n\n    let styles = getComputedStyle(targetElement);\n    let columnWidth = styles.getPropertyValue(\n      '--hds-app-sidenav-width-expanded'\n    );\n    let slideDuration = prefersReducedMotion ? 0 : 150;\n    let fadeDuration = prefersReducedMotion ? 0 : 175;\n    let fadeDelay = prefersReducedMotion ? 0 : 50;\n\n    // slide entire parent panel\n    let start = styles.transform;\n    let end = `translateX(-${activeIndex * parseInt(columnWidth, 10)}px)`;\n    let anim = targetElement.animate(\n      [{ transform: start }, { transform: end }],\n      {\n        duration: slideDuration,\n        easing: 'cubic-bezier(0.65, 0, 0.35, 1)',\n        fill: 'forwards',\n      }\n    );\n\n    anim.finished.then(() => {\n      // uncomment this if we need/want to scroll the element to the top\n      // targetElement.scrollIntoView(true);\n      if (activeIndex > 0) {\n        let allPrev = Array.from(targetElement.children).slice(0, activeIndex);\n        for (let ele of allPrev) {\n          ele.ariaHidden = 'true';\n          ele.style.setProperty('visibility', 'hidden');\n          ele.style.setProperty('opacity', '0');\n        }\n      }\n      // Notice: we don't add the styles by default because it writes a `style` attribute to the element and it causes an additional re-render\n      if (DEBUG) {\n        // Check the visibility of the element before attempting to commitStyles.\n        if (targetElement.offsetParent !== null) {\n          anim.commitStyles();\n        }\n      }\n    });\n\n    // fade in next panel\n    let nextPanelEl = targetElement.children[activeIndex];\n\n    // get reference to last child panel\n    let lastPanelEl = targetElement.children[targetElement.children.length - 1];\n\n    if (nextPanelEl) {\n      nextPanelEl.ariaHidden = 'false';\n      nextPanelEl.style.setProperty('visibility', 'visible');\n      // this eliminates a flicker if there's only one subnav rendering or if we\n      // already just rendered this panel.\n      if (activeIndex === 0 || nextPanelEl.isSameNode(this.lastPanelEl)) {\n        fadeDelay = 0;\n        fadeDuration = 0;\n      }\n\n      // remember the last panel\n      this.lastPanelEl = lastPanelEl;\n\n      nextPanelEl.animate([{ opacity: '0' }, { opacity: '1' }], {\n        delay: fadeDelay,\n        duration: fadeDuration,\n        fill: 'forwards',\n      });\n    }\n  }\n}\n"],"names":["SidenavPortalTarget","_class","Component","constructor","args","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","_defineProperty","window","matchMedia","prefersReducedMotionOverride","Ember","testing","prefersReducedMotion","prefersReducedMotionMQ","matches","panelsChanged","portalCount","numSubnavs","didUpdateSubnav","element","count","animateSubnav","activeIndex","targetElement","styles","getComputedStyle","columnWidth","getPropertyValue","slideDuration","fadeDuration","fadeDelay","start","transform","end","parseInt","anim","animate","duration","easing","fill","finished","then","allPrev","Array","from","children","slice","ele","ariaHidden","style","setProperty","DEBUG","offsetParent","commitStyles","nextPanelEl","lastPanelEl","length","isSameNode","opacity","delay","_applyDecoratedDescriptor","prototype","service","configurable","enumerable","writable","initializer","tracked","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}
+{"version":3,"file":"target.js","sources":["../../../../../src/components/hds/side-nav/portal/target.hbs","../../../../../src/components/hds/side-nav/portal/target.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n\\n<div class=\\\"hds-side-nav__content\\\" ...attributes>\\n  <PortalTarget\\n    @multiple={{true}}\\n    @onChange={{this.panelsChanged}}\\n    @name={{if @targetName @targetName \\\"hds-side-nav-portal-target\\\"}}\\n    class=\\\"hds-side-nav__content-panels hds-side-nav-hide-when-minimized\\\"\\n    {{did-update this.didUpdateSubnav this.numSubnavs}}\\n  />\\n</div>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport Component from '@glimmer/component';\nimport { inject as service } from '@ember/service';\nimport { tracked } from '@glimmer/tracking';\nimport { action } from '@ember/object';\nimport { DEBUG } from '@glimmer/env';\nimport Ember from 'ember';\n\nimport type { HdsSideNavPortalSignature } from './index';\n\n// import { PortalTargetSignature } from 'ember-stargate/components/portal-target';\ninterface PortalTargetSignature {\n  Element: HTMLDivElement;\n  Args: {\n    name: string;\n    multiple?: boolean;\n    onChange?: (count: number) => void;\n  };\n  Blocks: {\n    default: [number];\n  };\n}\n\nimport type { Registry as Services } from '@ember/service';\n\ninterface HdsSideNavPortalTargetSignature {\n  Args: PortalTargetSignature['Args'] & {\n    targetName?: HdsSideNavPortalSignature['Args']['targetName'];\n  };\n  Element: HTMLDivElement;\n}\n\nexport default class HdsSideNavPortalTargetComponent extends Component<HdsSideNavPortalTargetSignature> {\n  @service router!: Services['router'];\n\n  @tracked numSubnavs = 0;\n  @tracked lastPanelEl: Element | undefined;\n\n  static get prefersReducedMotionOverride() {\n    return Ember.testing;\n  }\n\n  prefersReducedMotionMQ = window.matchMedia(\n    '(prefers-reduced-motion: reduce)'\n  );\n\n  get prefersReducedMotion() {\n    return (\n      HdsSideNavPortalTargetComponent.prefersReducedMotionOverride ||\n      (this.prefersReducedMotionMQ && this.prefersReducedMotionMQ.matches)\n    );\n  }\n\n  @action\n  panelsChanged(portalCount: number) {\n    this.numSubnavs = portalCount;\n  }\n\n  @action\n  didUpdateSubnav(element: HTMLElement, [count]: [number]) {\n    this.animateSubnav(element, [count]);\n  }\n\n  @action\n  animateSubnav(element: HTMLElement, [count]: [number]) {\n    /*\n     * Here is what the layout looks like for this setup\n     *\n\n                                    SideNav\n                                    +----------------------+\n                                    | +------------------+ |\n                                    | |    (\"header\")    | |\n                                    | +------------------+ |\n                                    |                      |\n                                    | +------------------+ |\n                                    | |    (\"body\")      | |\n        (PortalTarget)              | |                  | |\n        +----------------------------------------------+ | |\n        | +----------+  +----------+  |  +----------+  | | |\n        | | (Portal) |  | (Portal) |     | (Portal) |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |  hidden  |  |  hidden  |     | *active* |  | | |\n        | |   panel  |  |   panel  |  |  |   panel  |  | | |\n        | |          |  |          |     |          |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |          |  |          |     |          |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |          |  |          |     |          |  | | |\n        | |          |  |          |  |  |          |  | | |\n        | |          |  |          |     |          |  | | |\n        | +----------+  +----------+  |  +----------+  | | |\n        +----------------------------------------------+ | |\n                                    | |                  | |\n                                    | +------------------+ |\n                                    |                      |\n                                    | +------------------+ |\n                                    | |    (\"footer\")    | |\n                                    | +------------------+ |\n                                    +----------------------+\n\n     *\n     * every time `HcAppFrame::SideNav::Portal` renders, it contains a portaled \"panel\"\n     * that is rendered into the `hds-side-nav__content-panels` (inside the PortalTarget).\n     *\n     * Rendering or unrendering other `HcAppFrame::SideNav::Portal`s triggers the number of\n     * subnavs to change (via `numSubnavs`), so this function runs and slides\n     * `hds-side-nav__content-panels` left or right using the `element.animate` api.\n     *\n     * */\n\n    const activeIndex = count - 1;\n    const targetElement = element;\n    const { prefersReducedMotion } = this;\n\n    const styles = getComputedStyle(targetElement);\n    const columnWidth = styles.getPropertyValue(\n      '--hds-app-sidenav-width-expanded'\n    );\n    const slideDuration = prefersReducedMotion ? 0 : 150;\n    let fadeDuration = prefersReducedMotion ? 0 : 175;\n    let fadeDelay = prefersReducedMotion ? 0 : 50;\n\n    // slide entire parent panel\n    const start = styles.transform;\n    const end = `translateX(-${activeIndex * parseInt(columnWidth, 10)}px)`;\n    const anim = targetElement.animate(\n      [{ transform: start }, { transform: end }],\n      {\n        duration: slideDuration,\n        easing: 'cubic-bezier(0.65, 0, 0.35, 1)',\n        fill: 'forwards',\n      }\n    );\n\n    anim.finished.then(() => {\n      // uncomment this if we need/want to scroll the element to the top\n      // targetElement.scrollIntoView(true);\n      if (activeIndex > 0) {\n        const allPrev = Array.from(targetElement.children).slice(\n          0,\n          activeIndex\n        ) as HTMLElement[];\n        for (const ele of allPrev) {\n          ele.ariaHidden = 'true';\n          ele.style.setProperty('visibility', 'hidden');\n          ele.style.setProperty('opacity', '0');\n        }\n      }\n      // Notice: we don't add the styles by default because it writes a `style` attribute to the element and it causes an additional re-render\n      if (DEBUG) {\n        // Check the visibility of the element before attempting to commitStyles.\n        if (targetElement.offsetParent !== null) {\n          anim.commitStyles();\n        }\n      }\n    });\n\n    // fade in next panel\n    const nextPanelEl = targetElement.children[activeIndex] as HTMLElement;\n\n    // get reference to last child panel\n    const lastPanelEl = targetElement.children[\n      targetElement.children.length - 1\n    ] as HTMLElement;\n\n    if (nextPanelEl) {\n      nextPanelEl.ariaHidden = 'false';\n      nextPanelEl.style.setProperty('visibility', 'visible');\n      // this eliminates a flicker if there's only one subnav rendering or if we\n      // already just rendered this panel.\n      if (this.lastPanelEl) {\n        if (activeIndex === 0 || nextPanelEl.isSameNode(this.lastPanelEl)) {\n          fadeDelay = 0;\n          fadeDuration = 0;\n        }\n      }\n\n      // remember the last panel\n      this.lastPanelEl = lastPanelEl;\n\n      nextPanelEl.animate([{ opacity: '0' }, { opacity: '1' }], {\n        delay: fadeDelay,\n        duration: fadeDuration,\n        fill: 'forwards',\n      });\n    }\n  }\n}\n"],"names":["HdsSideNavPortalTargetComponent","_class","Component","constructor","args","_initializerDefineProperty","_descriptor","_descriptor2","_descriptor3","_defineProperty","window","matchMedia","prefersReducedMotionOverride","Ember","testing","prefersReducedMotion","prefersReducedMotionMQ","matches","panelsChanged","portalCount","numSubnavs","didUpdateSubnav","element","count","animateSubnav","activeIndex","targetElement","styles","getComputedStyle","columnWidth","getPropertyValue","slideDuration","fadeDuration","fadeDelay","start","transform","end","parseInt","anim","animate","duration","easing","fill","finished","then","allPrev","Array","from","children","slice","ele","ariaHidden","style","setProperty","DEBUG","offsetParent","commitStyles","nextPanelEl","lastPanelEl","length","isSameNode","opacity","delay","_applyDecoratedDescriptor","prototype","service","configurable","enumerable","writable","initializer","tracked","action","Object","getOwnPropertyDescriptor","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/dist/components/hds/side-nav/toggle-button.js

@@ -2,9 +2,15 @@ import templateOnly from '@ember/component/template-only';
 import { precompileTemplate } from '@ember/template-compilation';
 import { setComponentTemplate } from '@ember/component';
 
-var TEMPLATE = precompileTemplate("{{! @glint-nocheck: not typesafe yet }}\n{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n<button class=\"hds-side-nav__toggle-button\" type=\"button\" ...attributes>\n  <FlightIcon @name={{@icon}} />\n</button>");
+var TEMPLATE = precompileTemplate("{{!\n  Copyright (c) HashiCorp, Inc.\n  SPDX-License-Identifier: MPL-2.0\n}}\n<button class=\"hds-side-nav__toggle-button\" type=\"button\" ...attributes>\n  <FlightIcon @name={{@icon}} />\n</button>");
 
-var toggleButton = setComponentTemplate(TEMPLATE, templateOnly());
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+const HdsSideNavToggleButtonComponent = templateOnly();
+var toggleButton = setComponentTemplate(TEMPLATE, HdsSideNavToggleButtonComponent);
 
 export { toggleButton as default };
 //# sourceMappingURL=toggle-button.js.map

package/dist/components/hds/side-nav/toggle-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-button.js","sources":["../../../../src/components/hds/side-nav/toggle-button.hbs","../../../../src/components/hds/side-nav/toggle-button.js"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{! @glint-nocheck: not typesafe yet }}\\n{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n<button class=\\\"hds-side-nav__toggle-button\\\" type=\\\"button\\\" ...attributes>\\n  <FlightIcon @name={{@icon}} />\\n</button>\")","import templateOnly from '@ember/component/template-only';\nexport default templateOnly();\n"],"names":["setComponentTemplate","TEMPLATE","templateOnly"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,kPAAkP;;ACApR,mBAAAA,oBAAA,CAAAC,QAAA,EAAeC,YAAY,EAAE,CAAA;;;;"}
+{"version":3,"file":"toggle-button.js","sources":["../../../../src/components/hds/side-nav/toggle-button.hbs","../../../../src/components/hds/side-nav/toggle-button.ts"],"sourcesContent":["import { precompileTemplate } from \"@ember/template-compilation\";\nexport default precompileTemplate(\"{{!\\n  Copyright (c) HashiCorp, Inc.\\n  SPDX-License-Identifier: MPL-2.0\\n}}\\n<button class=\\\"hds-side-nav__toggle-button\\\" type=\\\"button\\\" ...attributes>\\n  <FlightIcon @name={{@icon}} />\\n</button>\")","/**\n * Copyright (c) HashiCorp, Inc.\n * SPDX-License-Identifier: MPL-2.0\n */\n\nimport TemplateOnlyComponent from '@ember/component/template-only';\n\nimport type { FlightIconSignature } from '@hashicorp/ember-flight-icons/components/flight-icon';\n\ninterface HdsSideNavToggleButtonSignature {\n  Args: {\n    icon: FlightIconSignature['Args']['name'];\n  };\n  Element: HTMLButtonElement;\n}\n\nconst HdsSideNavToggleButtonComponent =\n  TemplateOnlyComponent<HdsSideNavToggleButtonSignature>();\n\nexport default HdsSideNavToggleButtonComponent;\n"],"names":["HdsSideNavToggleButtonComponent","TemplateOnlyComponent","setComponentTemplate","TEMPLATE"],"mappings":";;;;AACA,eAAe,kBAAkB,CAAC,yMAAyM;;ACD3O;AACA;AACA;AACA;;AAaA,MAAMA,+BAA+B,GACnCC,YAAqB,EAAmC,CAAA;AAE1D,mBAAAC,oBAAA,CAAAC,QAAA,EAAeH,+BAA+B,CAAA;;;;"}