@hashicorp/design-system-components 4.24.0-rc-20250923215537 → 4.24.0-rc-20250924193913

package/declarations/components/hds/flyout/index.d.ts

@@ -4,7 +4,6 @@
  */
 import Component from '@glimmer/component';
 import type { WithBoundArgs } from '@glint/template';
-import type Owner from '@ember/owner';
 import type { HdsFlyoutSizes } from './types.ts';
 import { HdsFlyoutSizesValues } from './types.ts';
 import HdsDialogPrimitiveBodyComponent from '../dialog-primitive/body.ts';
@@ -39,7 +38,6 @@ export default class HdsFlyout extends Component<HdsFlyoutSignature> {
     private _body;
     private _bodyInitialOverflowValue;
     private _clickHandler;
-    constructor(owner: Owner, args: HdsFlyoutSignature['Args']);
     /**
      * Sets the size of the flyout
      * Accepted values: medium, large

package/declarations/components/hds/modal/index.d.ts

@@ -4,7 +4,6 @@
  */
 import Component from '@glimmer/component';
 import type { WithBoundArgs } from '@glint/template';
-import type Owner from '@ember/owner';
 import type { HdsModalSizes, HdsModalColors } from './types.ts';
 import HdsDialogPrimitiveHeaderComponent from '../dialog-primitive/header.ts';
 import HdsDialogPrimitiveBodyComponent from '../dialog-primitive/body.ts';
@@ -40,7 +39,6 @@ export default class HdsModal extends Component<HdsModalSignature> {
     private _body;
     private _bodyInitialOverflowValue;
     private _clickHandler;
-    constructor(owner: Owner, args: HdsModalSignature['Args']);
     get isDismissDisabled(): boolean;
     get size(): HdsModalSizes;
     get color(): HdsModalColors;

package/dist/components/hds/flyout/index.js

@@ -5,7 +5,6 @@ import { assert } from '@ember/debug';
 import { getElementId } from '../../../utils/hds-get-element-id.js';
 import { buildWaiter } from '@ember/test-waiters';
 import { modifier } from 'ember-modifier';
-import { registerDestructor } from '@ember/destroyable';
 import { HdsFlyoutSizesValues } from './types.js';
 import '../dialog-primitive/body.js';
 import '../dialog-primitive/description.js';
@@ -39,19 +38,6 @@ class HdsFlyout extends Component {
   _body;
   _bodyInitialOverflowValue = '';
   _clickHandler;
-  constructor(owner, args) {
-    super(owner, args);
-    registerDestructor(this, () => {
-      // if the <dialog> is removed from the dom while open we emulate the close event
-      if (this._element && this._isOpen) {
-        this._element.dispatchEvent(new Event('close'));
-        this._element.removeEventListener('close',
-        // eslint-disable-next-line @typescript-eslint/unbound-method
-        this.registerOnCloseCallback, true);
-      }
-      document.removeEventListener('click', this._clickHandler, true);
-    });
-  }
 
   /**
    * Sets the size of the flyout
@@ -124,6 +110,16 @@ class HdsFlyout extends Component {
       capture: true,
       passive: false
     });
+    return () => {
+      // if the <dialog> is removed from the dom while open we emulate the close event
+      if (this._element && this._isOpen) {
+        this._element.dispatchEvent(new Event('close'));
+        this._element.removeEventListener('close',
+        // eslint-disable-next-line @typescript-eslint/unbound-method
+        this.registerOnCloseCallback, true);
+      }
+      document.removeEventListener('click', this._clickHandler, true);
+    };
   });
   willDestroyNode() {
     if (this._element) {

package/dist/components/hds/flyout/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/hds/flyout/index.ts"],"sourcesContent":["/**\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 { getElementId } from '../../../utils/hds-get-element-id.ts';\nimport { buildWaiter } from '@ember/test-waiters';\nimport type { WithBoundArgs } from '@glint/template';\nimport { modifier } from 'ember-modifier';\nimport { registerDestructor } from '@ember/destroyable';\nimport type Owner from '@ember/owner';\n\nimport type { HdsFlyoutSizes } from './types.ts';\n\nimport { HdsFlyoutSizesValues } from './types.ts';\nimport HdsDialogPrimitiveBodyComponent from '../dialog-primitive/body.ts';\nimport HdsDialogPrimitiveDescriptionComponent from '../dialog-primitive/description.ts';\nimport HdsDialogPrimitiveFooterComponent from '../dialog-primitive/footer.ts';\nimport HdsDialogPrimitiveHeaderComponent from '../dialog-primitive/header.ts';\n\nconst waiter = buildWaiter('@hashicorp/design-system-components:flyout');\n\nexport const DEFAULT_SIZE = HdsFlyoutSizesValues.Medium;\nexport const DEFAULT_HAS_OVERLAY = true;\nexport const SIZES: HdsFlyoutSizes[] = Object.values(HdsFlyoutSizesValues);\n\nexport interface HdsFlyoutSignature {\n  Args: {\n    size?: HdsFlyoutSizes;\n    returnFocusTo?: string;\n    onOpen?: () => void;\n    onClose?: (event: Event) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        Header?: WithBoundArgs<\n          typeof HdsDialogPrimitiveHeaderComponent,\n          'id' | 'onDismiss' | 'contextualClassPrefix'\n        >;\n        Description?: WithBoundArgs<\n          typeof HdsDialogPrimitiveDescriptionComponent,\n          'contextualClass'\n        >;\n        Body?: WithBoundArgs<\n          typeof HdsDialogPrimitiveBodyComponent,\n          'contextualClass'\n        >;\n        Footer?: WithBoundArgs<\n          typeof HdsDialogPrimitiveFooterComponent,\n          'onDismiss' | 'contextualClass'\n        >;\n      },\n    ];\n  };\n  Element: HTMLDialogElement;\n}\n\nexport default class HdsFlyout extends Component<HdsFlyoutSignature> {\n  @tracked private _isOpen = false;\n  // TODO: make this property private; currently blocked by our consumers relying on it despite not being part of the public API: https://github.com/hashicorp/cloud-ui/blob/main/engines/waypoint/addon/components/preview-pane.ts#L15\n  // private _element!: HTMLDialogElement;\n  _element!: HTMLDialogElement;\n  private _body!: HTMLElement;\n  private _bodyInitialOverflowValue = '';\n  private _clickHandler!: (event: MouseEvent) => void;\n\n  constructor(owner: Owner, args: HdsFlyoutSignature['Args']) {\n    super(owner, args);\n\n    registerDestructor(this, (): void => {\n      // if the <dialog> is removed from the dom while open we emulate the close event\n      if (this._element && this._isOpen) {\n        this._element.dispatchEvent(new Event('close'));\n\n        this._element.removeEventListener(\n          'close',\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          this.registerOnCloseCallback,\n          true\n        );\n      }\n\n      document.removeEventListener('click', this._clickHandler, true);\n    });\n  }\n\n  /**\n   * Sets the size of the flyout\n   * Accepted values: medium, large\n   *\n   * @param size\n   * @type {string}\n   * @default 'medium'\n   */\n  get size(): HdsFlyoutSizes {\n    const { size = DEFAULT_SIZE } = this.args;\n\n    assert(\n      `@size for \"Hds::Flyout\" must be one of the following: ${SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Calculates the unique ID to assign to the title\n   */\n  get id(): string {\n    return getElementId(this);\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-flyout'];\n\n    // add a class based on the @size argument\n    classes.push(`hds-flyout--size-${this.size}`);\n\n    return classes.join(' ');\n  }\n\n  @action registerOnCloseCallback(event: Event) {\n    if (this.args.onClose && typeof this.args.onClose === 'function') {\n      this.args.onClose(event);\n    }\n\n    this._isOpen = false;\n  }\n\n  private _registerDialog = modifier((element: HTMLDialogElement) => {\n    // Store references of `<dialog>` and `<body>` elements\n    this._element = element;\n    this._body = document.body;\n\n    if (this._body) {\n      // Store the initial `overflow` value of `<body>` so we can reset to it\n      this._bodyInitialOverflowValue =\n        this._body.style.getPropertyValue('overflow');\n    }\n\n    // Register \"onClose\" callback function to be called when a native 'close' event is dispatched\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    this._element.addEventListener('close', this.registerOnCloseCallback, true);\n\n    // If the flyout dialog is not already open\n    if (!this._element.open) {\n      this.open();\n    }\n\n    this._clickHandler = (event: MouseEvent) => {\n      // check if the click is outside the flyout and the flyout is open\n      if (!this._element.contains(event.target as Node) && this._isOpen) {\n        void this.onDismiss();\n      }\n    };\n\n    document.addEventListener('click', this._clickHandler, {\n      capture: true,\n      passive: false,\n    });\n  });\n\n  @action\n  willDestroyNode(): void {\n    if (this._element) {\n      this._element.removeEventListener(\n        'close',\n        // eslint-disable-next-line @typescript-eslint/unbound-method\n        this.registerOnCloseCallback,\n        true\n      );\n    }\n  }\n\n  @action\n  open(): void {\n    // Make flyout dialog visible using the native `showModal` method\n    this._element.showModal();\n    this._isOpen = true;\n\n    // Prevent page from scrolling when the dialog is open\n    if (this._body) this._body.style.setProperty('overflow', 'hidden');\n\n    // Call \"onOpen\" callback function\n    if (this.args.onOpen && typeof this.args.onOpen === 'function') {\n      this.args.onOpen();\n    }\n  }\n\n  @action\n  // eslint-disable-next-line @typescript-eslint/require-await\n  async onDismiss(): Promise<void> {\n    // allow ember test helpers to be aware of when the `close` event fires\n    // when using `click` or other helpers from '@ember/test-helpers'\n    // Notice: this code will get stripped out in production builds (DEBUG evaluates to `true` in dev/test builds, but `false` in prod builds)\n    if (this._element.open) {\n      const token = waiter.beginAsync();\n      const listener = () => {\n        waiter.endAsync(token);\n        this._element.removeEventListener('close', listener);\n      };\n      this._element.addEventListener('close', listener);\n    }\n\n    // Make flyout dialog invisible using the native `close` method\n    this._element.close();\n\n    // Reset page `overflow` property\n    if (this._body) {\n      this._body.style.removeProperty('overflow');\n      if (this._bodyInitialOverflowValue === '') {\n        if (this._body.style.length === 0) {\n          this._body.removeAttribute('style');\n        }\n      } else {\n        this._body.style.setProperty(\n          'overflow',\n          this._bodyInitialOverflowValue\n        );\n      }\n    }\n\n    // Return focus to a specific element (if provided)\n    if (this.args.returnFocusTo) {\n      const initiator = document.getElementById(this.args.returnFocusTo);\n      if (initiator) {\n        initiator.focus();\n      }\n    }\n  }\n}\n"],"names":["waiter","buildWaiter","DEFAULT_SIZE","HdsFlyoutSizesValues","Medium","DEFAULT_HAS_OVERLAY","SIZES","Object","values","HdsFlyout","Component","g","prototype","tracked","i","void 0","_element","_body","_bodyInitialOverflowValue","_clickHandler","constructor","owner","args","registerDestructor","_isOpen","dispatchEvent","Event","removeEventListener","registerOnCloseCallback","document","size","assert","join","includes","id","getElementId","classNames","classes","push","event","onClose","n","action","_registerDialog","modifier","element","body","style","getPropertyValue","addEventListener","open","contains","target","onDismiss","capture","passive","willDestroyNode","showModal","setProperty","onOpen","token","beginAsync","listener","endAsync","close","removeProperty","length","removeAttribute","returnFocusTo","initiator","getElementById","focus","setComponentTemplate","TEMPLATE"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/hds/flyout/index.ts"],"sourcesContent":["/**\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 { getElementId } from '../../../utils/hds-get-element-id.ts';\nimport { buildWaiter } from '@ember/test-waiters';\nimport type { WithBoundArgs } from '@glint/template';\nimport { modifier } from 'ember-modifier';\n\nimport type { HdsFlyoutSizes } from './types.ts';\n\nimport { HdsFlyoutSizesValues } from './types.ts';\nimport HdsDialogPrimitiveBodyComponent from '../dialog-primitive/body.ts';\nimport HdsDialogPrimitiveDescriptionComponent from '../dialog-primitive/description.ts';\nimport HdsDialogPrimitiveFooterComponent from '../dialog-primitive/footer.ts';\nimport HdsDialogPrimitiveHeaderComponent from '../dialog-primitive/header.ts';\n\nconst waiter = buildWaiter('@hashicorp/design-system-components:flyout');\n\nexport const DEFAULT_SIZE = HdsFlyoutSizesValues.Medium;\nexport const DEFAULT_HAS_OVERLAY = true;\nexport const SIZES: HdsFlyoutSizes[] = Object.values(HdsFlyoutSizesValues);\n\nexport interface HdsFlyoutSignature {\n  Args: {\n    size?: HdsFlyoutSizes;\n    returnFocusTo?: string;\n    onOpen?: () => void;\n    onClose?: (event: Event) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        Header?: WithBoundArgs<\n          typeof HdsDialogPrimitiveHeaderComponent,\n          'id' | 'onDismiss' | 'contextualClassPrefix'\n        >;\n        Description?: WithBoundArgs<\n          typeof HdsDialogPrimitiveDescriptionComponent,\n          'contextualClass'\n        >;\n        Body?: WithBoundArgs<\n          typeof HdsDialogPrimitiveBodyComponent,\n          'contextualClass'\n        >;\n        Footer?: WithBoundArgs<\n          typeof HdsDialogPrimitiveFooterComponent,\n          'onDismiss' | 'contextualClass'\n        >;\n      },\n    ];\n  };\n  Element: HTMLDialogElement;\n}\n\nexport default class HdsFlyout extends Component<HdsFlyoutSignature> {\n  @tracked private _isOpen = false;\n  // TODO: make this property private; currently blocked by our consumers relying on it despite not being part of the public API: https://github.com/hashicorp/cloud-ui/blob/main/engines/waypoint/addon/components/preview-pane.ts#L15\n  // private _element!: HTMLDialogElement;\n  _element!: HTMLDialogElement;\n  private _body!: HTMLElement;\n  private _bodyInitialOverflowValue = '';\n  private _clickHandler!: (event: MouseEvent) => void;\n\n  /**\n   * Sets the size of the flyout\n   * Accepted values: medium, large\n   *\n   * @param size\n   * @type {string}\n   * @default 'medium'\n   */\n  get size(): HdsFlyoutSizes {\n    const { size = DEFAULT_SIZE } = this.args;\n\n    assert(\n      `@size for \"Hds::Flyout\" must be one of the following: ${SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  /**\n   * Calculates the unique ID to assign to the title\n   */\n  get id(): string {\n    return getElementId(this);\n  }\n\n  /**\n   * Get the class names to apply to the component.\n   * @method classNames\n   * @return {string} The \"class\" attribute to apply to the component.\n   */\n  get classNames(): string {\n    const classes = ['hds-flyout'];\n\n    // add a class based on the @size argument\n    classes.push(`hds-flyout--size-${this.size}`);\n\n    return classes.join(' ');\n  }\n\n  @action registerOnCloseCallback(event: Event) {\n    if (this.args.onClose && typeof this.args.onClose === 'function') {\n      this.args.onClose(event);\n    }\n\n    this._isOpen = false;\n  }\n\n  private _registerDialog = modifier((element: HTMLDialogElement) => {\n    // Store references of `<dialog>` and `<body>` elements\n    this._element = element;\n    this._body = document.body;\n\n    if (this._body) {\n      // Store the initial `overflow` value of `<body>` so we can reset to it\n      this._bodyInitialOverflowValue =\n        this._body.style.getPropertyValue('overflow');\n    }\n\n    // Register \"onClose\" callback function to be called when a native 'close' event is dispatched\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    this._element.addEventListener('close', this.registerOnCloseCallback, true);\n\n    // If the flyout dialog is not already open\n    if (!this._element.open) {\n      this.open();\n    }\n\n    this._clickHandler = (event: MouseEvent) => {\n      // check if the click is outside the flyout and the flyout is open\n      if (!this._element.contains(event.target as Node) && this._isOpen) {\n        void this.onDismiss();\n      }\n    };\n\n    document.addEventListener('click', this._clickHandler, {\n      capture: true,\n      passive: false,\n    });\n\n    return () => {\n      // if the <dialog> is removed from the dom while open we emulate the close event\n      if (this._element && this._isOpen) {\n        this._element.dispatchEvent(new Event('close'));\n\n        this._element.removeEventListener(\n          'close',\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          this.registerOnCloseCallback,\n          true\n        );\n      }\n\n      document.removeEventListener('click', this._clickHandler, true);\n    };\n  });\n\n  @action\n  willDestroyNode(): void {\n    if (this._element) {\n      this._element.removeEventListener(\n        'close',\n        // eslint-disable-next-line @typescript-eslint/unbound-method\n        this.registerOnCloseCallback,\n        true\n      );\n    }\n  }\n\n  @action\n  open(): void {\n    // Make flyout dialog visible using the native `showModal` method\n    this._element.showModal();\n    this._isOpen = true;\n\n    // Prevent page from scrolling when the dialog is open\n    if (this._body) this._body.style.setProperty('overflow', 'hidden');\n\n    // Call \"onOpen\" callback function\n    if (this.args.onOpen && typeof this.args.onOpen === 'function') {\n      this.args.onOpen();\n    }\n  }\n\n  @action\n  // eslint-disable-next-line @typescript-eslint/require-await\n  async onDismiss(): Promise<void> {\n    // allow ember test helpers to be aware of when the `close` event fires\n    // when using `click` or other helpers from '@ember/test-helpers'\n    // Notice: this code will get stripped out in production builds (DEBUG evaluates to `true` in dev/test builds, but `false` in prod builds)\n    if (this._element.open) {\n      const token = waiter.beginAsync();\n      const listener = () => {\n        waiter.endAsync(token);\n        this._element.removeEventListener('close', listener);\n      };\n      this._element.addEventListener('close', listener);\n    }\n\n    // Make flyout dialog invisible using the native `close` method\n    this._element.close();\n\n    // Reset page `overflow` property\n    if (this._body) {\n      this._body.style.removeProperty('overflow');\n      if (this._bodyInitialOverflowValue === '') {\n        if (this._body.style.length === 0) {\n          this._body.removeAttribute('style');\n        }\n      } else {\n        this._body.style.setProperty(\n          'overflow',\n          this._bodyInitialOverflowValue\n        );\n      }\n    }\n\n    // Return focus to a specific element (if provided)\n    if (this.args.returnFocusTo) {\n      const initiator = document.getElementById(this.args.returnFocusTo);\n      if (initiator) {\n        initiator.focus();\n      }\n    }\n  }\n}\n"],"names":["waiter","buildWaiter","DEFAULT_SIZE","HdsFlyoutSizesValues","Medium","DEFAULT_HAS_OVERLAY","SIZES","Object","values","HdsFlyout","Component","g","prototype","tracked","i","void 0","_element","_body","_bodyInitialOverflowValue","_clickHandler","size","args","assert","join","includes","id","getElementId","classNames","classes","push","registerOnCloseCallback","event","onClose","_isOpen","n","action","_registerDialog","modifier","element","document","body","style","getPropertyValue","addEventListener","open","contains","target","onDismiss","capture","passive","dispatchEvent","Event","removeEventListener","willDestroyNode","showModal","setProperty","onOpen","token","beginAsync","listener","endAsync","close","removeProperty","length","removeAttribute","returnFocusTo","initiator","getElementById","focus","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/dist/components/hds/modal/index.js

@@ -4,7 +4,6 @@ import { action } from '@ember/object';
 import { assert } from '@ember/debug';
 import { getElementId } from '../../../utils/hds-get-element-id.js';
 import { buildWaiter } from '@ember/test-waiters';
-import { registerDestructor } from '@ember/destroyable';
 import { modifier } from 'ember-modifier';
 import '../dialog-primitive/header.js';
 import '../dialog-primitive/body.js';
@@ -37,19 +36,6 @@ class HdsModal extends Component {
   _body;
   _bodyInitialOverflowValue = '';
   _clickHandler;
-  constructor(owner, args) {
-    super(owner, args);
-    registerDestructor(this, () => {
-      // if the <dialog> is removed from the dom while open we emulate the close event
-      if (this._element && this._isOpen) {
-        this._element.dispatchEvent(new Event('close'));
-        this._element.removeEventListener('close',
-        // eslint-disable-next-line @typescript-eslint/unbound-method
-        this.registerOnCloseCallback, true);
-      }
-      document.removeEventListener('click', this._clickHandler, true);
-    });
-  }
   get isDismissDisabled() {
     return this.args.isDismissDisabled ?? false;
   }
@@ -150,6 +136,16 @@ class HdsModal extends Component {
       capture: true,
       passive: false
     });
+    return () => {
+      // if the <dialog> is removed from the dom while open we emulate the close event
+      if (this._element && this._isOpen) {
+        this._element.dispatchEvent(new Event('close'));
+        this._element.removeEventListener('close',
+        // eslint-disable-next-line @typescript-eslint/unbound-method
+        this.registerOnCloseCallback, true);
+      }
+      document.removeEventListener('click', this._clickHandler, true);
+    };
   });
   open() {
     // Make modal dialog visible using the native `showModal` method

package/dist/components/hds/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/hds/modal/index.ts"],"sourcesContent":["/**\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 { getElementId } from '../../../utils/hds-get-element-id.ts';\nimport { buildWaiter } from '@ember/test-waiters';\nimport { registerDestructor } from '@ember/destroyable';\nimport { modifier } from 'ember-modifier';\n\nimport type { WithBoundArgs } from '@glint/template';\nimport type Owner from '@ember/owner';\nimport type { HdsModalSizes, HdsModalColors } from './types.ts';\n\nimport HdsDialogPrimitiveHeaderComponent from '../dialog-primitive/header.ts';\nimport HdsDialogPrimitiveBodyComponent from '../dialog-primitive/body.ts';\nimport HdsDialogPrimitiveFooterComponent from '../dialog-primitive/footer.ts';\nimport { HdsModalSizeValues, HdsModalColorValues } from './types.ts';\n\nconst waiter = buildWaiter('@hashicorp/design-system-components:modal');\n\nexport const DEFAULT_SIZE = HdsModalSizeValues.Medium;\nexport const DEFAULT_COLOR = HdsModalColorValues.Neutral;\n\nexport const SIZES: HdsModalSizes[] = Object.values(HdsModalSizeValues);\nexport const COLORS: HdsModalColors[] = Object.values(HdsModalColorValues);\n\nexport interface HdsModalSignature {\n  Args: {\n    isDismissDisabled?: boolean;\n    size?: HdsModalSizes;\n    color?: HdsModalColors;\n    returnFocusTo?: string;\n    onOpen?: () => void;\n    onClose?: (event: Event) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        Header?: WithBoundArgs<\n          typeof HdsDialogPrimitiveHeaderComponent,\n          'id' | 'onDismiss' | 'contextualClassPrefix'\n        >;\n        Body?: WithBoundArgs<\n          typeof HdsDialogPrimitiveBodyComponent,\n          'contextualClass'\n        >;\n        Footer?: WithBoundArgs<\n          typeof HdsDialogPrimitiveFooterComponent,\n          'onDismiss' | 'contextualClass'\n        >;\n      },\n    ];\n  };\n  Element: HTMLDialogElement;\n}\n\nexport default class HdsModal extends Component<HdsModalSignature> {\n  @tracked private _isOpen = false;\n  private _element!: HTMLDialogElement;\n  private _body!: HTMLElement;\n  private _bodyInitialOverflowValue = '';\n  private _clickHandler!: (event: MouseEvent) => void;\n\n  constructor(owner: Owner, args: HdsModalSignature['Args']) {\n    super(owner, args);\n\n    registerDestructor(this, (): void => {\n      // if the <dialog> is removed from the dom while open we emulate the close event\n      if (this._element && this._isOpen) {\n        this._element.dispatchEvent(new Event('close'));\n\n        this._element.removeEventListener(\n          'close',\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          this.registerOnCloseCallback,\n          true\n        );\n      }\n\n      document.removeEventListener('click', this._clickHandler, true);\n    });\n  }\n\n  get isDismissDisabled(): boolean {\n    return this.args.isDismissDisabled ?? false;\n  }\n\n  get size(): HdsModalSizes {\n    const { size = DEFAULT_SIZE } = this.args;\n\n    assert(\n      `@size for \"Hds::Modal\" must be one of the following: ${SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  get color(): HdsModalColors {\n    const { color = DEFAULT_COLOR } = this.args;\n\n    assert(\n      `@color for \"Hds::Modal\" must be one of the following: ${COLORS.join(\n        ', '\n      )}; received: ${color}`,\n      COLORS.includes(color)\n    );\n\n    return color;\n  }\n\n  get id(): string {\n    return getElementId(this);\n  }\n\n  get classNames(): string {\n    const classes = ['hds-modal'];\n\n    // add a class based on the @size argument\n    classes.push(`hds-modal--size-${this.size}`);\n\n    // add a class based on the @color argument\n    classes.push(`hds-modal--color-${this.color}`);\n\n    return classes.join(' ');\n  }\n\n  @action registerOnCloseCallback(event: Event): void {\n    if (\n      !this.isDismissDisabled &&\n      this.args.onClose &&\n      typeof this.args.onClose === 'function'\n    ) {\n      this.args.onClose(event);\n    }\n\n    // If the dismissal of the modal is disabled, we keep the modal open/visible otherwise we mark it as closed\n    if (this.isDismissDisabled) {\n      // If, in a chain of events, the element is not attached to the DOM, the `showModal` would fail\n      // so we add this safeguard condition that checks for the `<dialog>` to have a parent\n      if (this._element.parentElement) {\n        // As there is no way to `preventDefault` on `close` events, we call the `showModal` function\n        // preserving the state of the modal dialog\n        this._element.showModal();\n      }\n    } else {\n      this._isOpen = false;\n\n      // Reset page `overflow` property\n      if (this._body) {\n        this._body.style.removeProperty('overflow');\n        if (this._bodyInitialOverflowValue === '') {\n          if (this._body.style.length === 0) {\n            this._body.removeAttribute('style');\n          }\n        } else {\n          this._body.style.setProperty(\n            'overflow',\n            this._bodyInitialOverflowValue\n          );\n        }\n      }\n\n      // Return focus to a specific element (if provided)\n      if (this.args.returnFocusTo) {\n        const initiator = document.getElementById(this.args.returnFocusTo);\n        if (initiator) {\n          initiator.focus();\n        }\n      }\n    }\n  }\n\n  private _registerDialog = modifier((element: HTMLDialogElement) => {\n    // Store references of `<dialog>` and `<body>` elements\n    this._element = element;\n    this._body = document.body;\n\n    if (this._body) {\n      // Store the initial `overflow` value of `<body>` so we can reset to it\n      this._bodyInitialOverflowValue =\n        this._body.style.getPropertyValue('overflow');\n    }\n\n    // Register \"onClose\" callback function to be called when a native 'close' event is dispatched\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    this._element.addEventListener('close', this.registerOnCloseCallback, true);\n\n    // If the modal dialog is not already open\n    if (!this._element.open) {\n      this.open();\n    }\n\n    this._clickHandler = (event: MouseEvent) => {\n      // check if the click is outside the modal and the modal is open\n      if (!this._element.contains(event.target as Node) && this._isOpen) {\n        if (!this.isDismissDisabled) {\n          void this.onDismiss();\n        }\n      }\n    };\n\n    document.addEventListener('click', this._clickHandler, {\n      capture: true,\n      passive: false,\n    });\n  });\n\n  @action\n  open(): void {\n    // Make modal dialog visible using the native `showModal` method\n    this._element.showModal();\n    this._isOpen = true;\n\n    // Prevent page from scrolling when the dialog is open\n    if (this._body) this._body.style.setProperty('overflow', 'hidden');\n\n    // Call \"onOpen\" callback function\n    if (this.args.onOpen && typeof this.args.onOpen === 'function') {\n      this.args.onOpen();\n    }\n  }\n\n  @action\n  // eslint-disable-next-line @typescript-eslint/require-await\n  async onDismiss(): Promise<void> {\n    // allow ember test helpers to be aware of when the `close` event fires\n    // when using `click` or other helpers from '@ember/test-helpers'\n    if (this._element.open) {\n      const token = waiter.beginAsync();\n      const listener = () => {\n        waiter.endAsync(token);\n        this._element.removeEventListener('close', listener);\n      };\n      this._element.addEventListener('close', listener);\n    }\n\n    // Make modal dialog invisible using the native `close` method\n    this._element.close();\n  }\n}\n"],"names":["waiter","buildWaiter","DEFAULT_SIZE","HdsModalSizeValues","Medium","DEFAULT_COLOR","HdsModalColorValues","Neutral","SIZES","Object","values","COLORS","HdsModal","Component","g","prototype","tracked","i","void 0","_element","_body","_bodyInitialOverflowValue","_clickHandler","constructor","owner","args","registerDestructor","_isOpen","dispatchEvent","Event","removeEventListener","registerOnCloseCallback","document","isDismissDisabled","size","assert","join","includes","color","id","getElementId","classNames","classes","push","event","onClose","parentElement","showModal","style","removeProperty","length","removeAttribute","setProperty","returnFocusTo","initiator","getElementById","focus","n","action","_registerDialog","modifier","element","body","getPropertyValue","addEventListener","open","contains","target","onDismiss","capture","passive","onOpen","token","beginAsync","listener","endAsync","close","setComponentTemplate","TEMPLATE"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/hds/modal/index.ts"],"sourcesContent":["/**\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 { getElementId } from '../../../utils/hds-get-element-id.ts';\nimport { buildWaiter } from '@ember/test-waiters';\nimport { modifier } from 'ember-modifier';\n\nimport type { WithBoundArgs } from '@glint/template';\nimport type { HdsModalSizes, HdsModalColors } from './types.ts';\n\nimport HdsDialogPrimitiveHeaderComponent from '../dialog-primitive/header.ts';\nimport HdsDialogPrimitiveBodyComponent from '../dialog-primitive/body.ts';\nimport HdsDialogPrimitiveFooterComponent from '../dialog-primitive/footer.ts';\nimport { HdsModalSizeValues, HdsModalColorValues } from './types.ts';\n\nconst waiter = buildWaiter('@hashicorp/design-system-components:modal');\n\nexport const DEFAULT_SIZE = HdsModalSizeValues.Medium;\nexport const DEFAULT_COLOR = HdsModalColorValues.Neutral;\n\nexport const SIZES: HdsModalSizes[] = Object.values(HdsModalSizeValues);\nexport const COLORS: HdsModalColors[] = Object.values(HdsModalColorValues);\n\nexport interface HdsModalSignature {\n  Args: {\n    isDismissDisabled?: boolean;\n    size?: HdsModalSizes;\n    color?: HdsModalColors;\n    returnFocusTo?: string;\n    onOpen?: () => void;\n    onClose?: (event: Event) => void;\n  };\n  Blocks: {\n    default: [\n      {\n        Header?: WithBoundArgs<\n          typeof HdsDialogPrimitiveHeaderComponent,\n          'id' | 'onDismiss' | 'contextualClassPrefix'\n        >;\n        Body?: WithBoundArgs<\n          typeof HdsDialogPrimitiveBodyComponent,\n          'contextualClass'\n        >;\n        Footer?: WithBoundArgs<\n          typeof HdsDialogPrimitiveFooterComponent,\n          'onDismiss' | 'contextualClass'\n        >;\n      },\n    ];\n  };\n  Element: HTMLDialogElement;\n}\n\nexport default class HdsModal extends Component<HdsModalSignature> {\n  @tracked private _isOpen = false;\n  private _element!: HTMLDialogElement;\n  private _body!: HTMLElement;\n  private _bodyInitialOverflowValue = '';\n  private _clickHandler!: (event: MouseEvent) => void;\n\n  get isDismissDisabled(): boolean {\n    return this.args.isDismissDisabled ?? false;\n  }\n\n  get size(): HdsModalSizes {\n    const { size = DEFAULT_SIZE } = this.args;\n\n    assert(\n      `@size for \"Hds::Modal\" must be one of the following: ${SIZES.join(\n        ', '\n      )}; received: ${size}`,\n      SIZES.includes(size)\n    );\n\n    return size;\n  }\n\n  get color(): HdsModalColors {\n    const { color = DEFAULT_COLOR } = this.args;\n\n    assert(\n      `@color for \"Hds::Modal\" must be one of the following: ${COLORS.join(\n        ', '\n      )}; received: ${color}`,\n      COLORS.includes(color)\n    );\n\n    return color;\n  }\n\n  get id(): string {\n    return getElementId(this);\n  }\n\n  get classNames(): string {\n    const classes = ['hds-modal'];\n\n    // add a class based on the @size argument\n    classes.push(`hds-modal--size-${this.size}`);\n\n    // add a class based on the @color argument\n    classes.push(`hds-modal--color-${this.color}`);\n\n    return classes.join(' ');\n  }\n\n  @action registerOnCloseCallback(event: Event): void {\n    if (\n      !this.isDismissDisabled &&\n      this.args.onClose &&\n      typeof this.args.onClose === 'function'\n    ) {\n      this.args.onClose(event);\n    }\n\n    // If the dismissal of the modal is disabled, we keep the modal open/visible otherwise we mark it as closed\n    if (this.isDismissDisabled) {\n      // If, in a chain of events, the element is not attached to the DOM, the `showModal` would fail\n      // so we add this safeguard condition that checks for the `<dialog>` to have a parent\n      if (this._element.parentElement) {\n        // As there is no way to `preventDefault` on `close` events, we call the `showModal` function\n        // preserving the state of the modal dialog\n        this._element.showModal();\n      }\n    } else {\n      this._isOpen = false;\n\n      // Reset page `overflow` property\n      if (this._body) {\n        this._body.style.removeProperty('overflow');\n        if (this._bodyInitialOverflowValue === '') {\n          if (this._body.style.length === 0) {\n            this._body.removeAttribute('style');\n          }\n        } else {\n          this._body.style.setProperty(\n            'overflow',\n            this._bodyInitialOverflowValue\n          );\n        }\n      }\n\n      // Return focus to a specific element (if provided)\n      if (this.args.returnFocusTo) {\n        const initiator = document.getElementById(this.args.returnFocusTo);\n        if (initiator) {\n          initiator.focus();\n        }\n      }\n    }\n  }\n\n  private _registerDialog = modifier((element: HTMLDialogElement) => {\n    // Store references of `<dialog>` and `<body>` elements\n    this._element = element;\n    this._body = document.body;\n\n    if (this._body) {\n      // Store the initial `overflow` value of `<body>` so we can reset to it\n      this._bodyInitialOverflowValue =\n        this._body.style.getPropertyValue('overflow');\n    }\n\n    // Register \"onClose\" callback function to be called when a native 'close' event is dispatched\n    // eslint-disable-next-line @typescript-eslint/unbound-method\n    this._element.addEventListener('close', this.registerOnCloseCallback, true);\n\n    // If the modal dialog is not already open\n    if (!this._element.open) {\n      this.open();\n    }\n\n    this._clickHandler = (event: MouseEvent) => {\n      // check if the click is outside the modal and the modal is open\n      if (!this._element.contains(event.target as Node) && this._isOpen) {\n        if (!this.isDismissDisabled) {\n          void this.onDismiss();\n        }\n      }\n    };\n\n    document.addEventListener('click', this._clickHandler, {\n      capture: true,\n      passive: false,\n    });\n\n    return () => {\n      // if the <dialog> is removed from the dom while open we emulate the close event\n      if (this._element && this._isOpen) {\n        this._element.dispatchEvent(new Event('close'));\n\n        this._element.removeEventListener(\n          'close',\n          // eslint-disable-next-line @typescript-eslint/unbound-method\n          this.registerOnCloseCallback,\n          true\n        );\n      }\n\n      document.removeEventListener('click', this._clickHandler, true);\n    };\n  });\n\n  @action\n  open(): void {\n    // Make modal dialog visible using the native `showModal` method\n    this._element.showModal();\n    this._isOpen = true;\n\n    // Prevent page from scrolling when the dialog is open\n    if (this._body) this._body.style.setProperty('overflow', 'hidden');\n\n    // Call \"onOpen\" callback function\n    if (this.args.onOpen && typeof this.args.onOpen === 'function') {\n      this.args.onOpen();\n    }\n  }\n\n  @action\n  // eslint-disable-next-line @typescript-eslint/require-await\n  async onDismiss(): Promise<void> {\n    // allow ember test helpers to be aware of when the `close` event fires\n    // when using `click` or other helpers from '@ember/test-helpers'\n    if (this._element.open) {\n      const token = waiter.beginAsync();\n      const listener = () => {\n        waiter.endAsync(token);\n        this._element.removeEventListener('close', listener);\n      };\n      this._element.addEventListener('close', listener);\n    }\n\n    // Make modal dialog invisible using the native `close` method\n    this._element.close();\n  }\n}\n"],"names":["waiter","buildWaiter","DEFAULT_SIZE","HdsModalSizeValues","Medium","DEFAULT_COLOR","HdsModalColorValues","Neutral","SIZES","Object","values","COLORS","HdsModal","Component","g","prototype","tracked","i","void 0","_element","_body","_bodyInitialOverflowValue","_clickHandler","isDismissDisabled","args","size","assert","join","includes","color","id","getElementId","classNames","classes","push","registerOnCloseCallback","event","onClose","parentElement","showModal","_isOpen","style","removeProperty","length","removeAttribute","setProperty","returnFocusTo","initiator","document","getElementById","focus","n","action","_registerDialog","modifier","element","body","getPropertyValue","addEventListener","open","contains","target","onDismiss","capture","passive","dispatchEvent","Event","removeEventListener","onOpen","token","beginAsync","listener","endAsync","close","setComponentTemplate","TEMPLATE"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hashicorp/design-system-components",
-  "version": "4.24.0-rc-20250923215537",
+  "version": "4.24.0-rc-20250924193913",
   "description": "Helios Design System Components",
   "keywords": [
     "hashicorp",
@@ -35,7 +35,7 @@
     "@embroider/macros": "^1.18.1",
     "@embroider/util": "^1.13.4",
     "@floating-ui/dom": "^1.6.12",
-    "@hashicorp/design-system-tokens": "3.0.0-rc-20250923215537",
+    "@hashicorp/design-system-tokens": "3.0.0-rc-20250924193913",
     "@hashicorp/flight-icons": "^3.13.0",
     "@lezer/highlight": "^1.2.1",
     "@nullvoxpopuli/ember-composable-helpers": "^5.2.11",