@carbon/web-components 2.57.0 → 2.58.0-rc.0

package/es/components/modal/modal-header.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import modal_default from "./modal.scss.js";
 import { LitElement, html } from "lit";
 //#region src/components/modal/modal-header.ts

package/es/components/modal/modal-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-header.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal-header.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Modal header.\n *\n * @element cds-modal-header\n */\n@customElement(`${prefix}-modal-header`)\nclass CDSModalHeader extends LitElement {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSModalHeader).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSModalHeader).slugItem\n            )\n          : false\n      );\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'sm');\n    }\n    this.requestUpdate();\n  }\n\n  updated() {\n    if (this._hasAILabel) {\n      this.parentElement?.setAttribute('ai-label', '');\n    } else {\n      this.parentElement?.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    return html` <slot></slot>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>`;\n  }\n\n  /**\n   * A selector that will return the slug item.\n   *\n   * remove in v12\n   */\n  static get slugItem() {\n    return `${prefix}-slug`;\n  }\n\n  /**\n   * A selector that will return the AI Label item.\n   */\n  static get aiLabelItem() {\n    return `${prefix}-ai-label`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default CDSModalHeader;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAiBA,IAAA,iBAAA,MACM,uBAAuB,WAAW;;;qBAId;;;;;CAKxB,kBAA4B,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,eAAe,CACf,QAAQ,SACN,KAAqB,YAAY,KAAA,IAC7B,KAAqB,QACnB,KAAK,YAAsC,YAC7C,IAEA,KAAqB,QACnB,KAAK,YAAsC,SAC7C,GACD,MACL;AACH,MAAI,WAAW,SAAS,GAAG;AACzB,QAAK,cAAc,QAAQ,WAAW;AACrC,cAAW,GAAmB,aAAa,QAAQ,KAAK;;AAE3D,OAAK,eAAe;;CAGtB,UAAU;AACR,MAAI,KAAK,YACP,MAAK,eAAe,aAAa,YAAY,GAAG;MAEhD,MAAK,eAAe,gBAAgB,WAAW;;CAInD,SAAS;AACP,SAAO,IAAI;2CAC4B,KAAK,kBAAkB;uCAC3B,KAAK,kBAAkB;;;;;;;CAQ5D,WAAW,WAAW;AACpB,SAAO;;;;;CAMT,WAAW,cAAc;AACvB,SAAO;;;gBAGOA;;;6BA7DjBC,cAAc,mBAAyB,CAAA,EAAA,eAAA;AAgExC,IAAA,uBAAe"}
+{"version":3,"file":"modal-header.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal-header.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Modal header.\n *\n * @element cds-modal-header\n */\n@customElement(`${prefix}-modal-header`)\nclass CDSModalHeader extends LitElement {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSModalHeader).aiLabelItem\n            ) ||\n            // remove reference to slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSModalHeader).slugItem\n            )\n          : false\n      );\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'sm');\n    }\n    this.requestUpdate();\n  }\n\n  updated() {\n    if (this._hasAILabel) {\n      this.parentElement?.setAttribute('ai-label', '');\n    } else {\n      this.parentElement?.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    return html` <slot></slot>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>`;\n  }\n\n  /**\n   * A selector that will return the slug item.\n   *\n   * remove in v12\n   */\n  static get slugItem() {\n    return `${prefix}-slug`;\n  }\n\n  /**\n   * A selector that will return the AI Label item.\n   */\n  static get aiLabelItem() {\n    return `${prefix}-ai-label`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default CDSModalHeader;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAiBA,IAAA,iBAAA,MACM,uBAAuB,WAAW;;;qBAId;;;;;CAKxB,kBAA4B,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,cAAc,CAAC,CACf,QAAQ,SACN,KAAqB,YAAY,KAAA,IAC7B,KAAqB,QACnB,KAAK,YAAsC,WAC9C,KAEC,KAAqB,QACnB,KAAK,YAAsC,QAC9C,IACA,KACN;EACF,IAAI,WAAW,SAAS,GAAG;GACzB,KAAK,cAAc,QAAQ,UAAU;GACrC,WAAY,EAAE,CAAiB,aAAa,QAAQ,IAAI;EAC1D;EACA,KAAK,cAAc;CACrB;CAEA,UAAU;EACR,IAAI,KAAK,aACP,KAAK,eAAe,aAAa,YAAY,EAAE;OAE/C,KAAK,eAAe,gBAAgB,UAAU;CAElD;CAEA,SAAS;EACP,OAAO,IAAI;2CAC4B,KAAK,kBAAkB;uCAC3B,KAAK,kBAAkB;CAC5D;;;;;;CAOA,WAAW,WAAW;EACpB,OAAO;CACT;;;;CAKA,WAAW,cAAc;EACvB,OAAO;CACT;;gBAEgBA;;AAClB;6BA9DCC,cAAc,kBAAwB,CAAA,GAAA,cAAA;AAgEvC,IAAA,uBAAe"}

package/es/components/modal/modal-heading.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import modal_default from "./modal.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";

package/es/components/modal/modal-heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-heading.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal-heading.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Modal heading.\n *\n * @element cds-modal-heading\n */\n@customElement(`${prefix}-modal-heading`)\nclass CDSModalHeading extends LitElement {\n  /**\n   * The unique identifier for this heading element\n   */\n  @property({ type: String, reflect: true })\n  id = `${prefix}--modal-heading--id-${Math.random().toString(16).slice(2)}`;\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSModalHeading;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,kBAAA,MACM,wBAAwB,WAAW;;;YAKlC,0BAAgC,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,EAAE;;CAExE,SAAS;AACP,SAAO,IAAI;;;gBAGGA;;;YAPf,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,MAAA,KAAA,EAAA;8BAL3CC,cAAc,oBAA0B,CAAA,EAAA,gBAAA;AAezC,IAAA,wBAAe"}
+{"version":3,"file":"modal-heading.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal-heading.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Modal heading.\n *\n * @element cds-modal-heading\n */\n@customElement(`${prefix}-modal-heading`)\nclass CDSModalHeading extends LitElement {\n  /**\n   * The unique identifier for this heading element\n   */\n  @property({ type: String, reflect: true })\n  id = `${prefix}--modal-heading--id-${Math.random().toString(16).slice(2)}`;\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSModalHeading;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,kBAAA,MACM,wBAAwB,WAAW;;;YAKlC,0BAAgC,KAAK,OAAO,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC;;CAEvE,SAAS;EACP,OAAO,IAAI;CACb;;gBAEgBA;;AAClB;YARG,SAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,gBAAA,WAAA,MAAA,KAAA,CAAA;8BAL1CC,cAAc,mBAAyB,CAAA,GAAA,eAAA;AAexC,IAAA,wBAAe"}

package/es/components/modal/modal-label.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import modal_default from "./modal.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";

package/es/components/modal/modal-label.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-label.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal-label.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Modal label.\n *\n * @element cds-modal-label\n */\n@customElement(`${prefix}-modal-label`)\nclass CDSModalLabel extends LitElement {\n  /**\n   * The unique identifier for this label element\n   */\n  @property({ type: String, reflect: true })\n  id = `${prefix}--modal-label--id-${Math.random().toString(16).slice(2)}`;\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSModalLabel;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,gBAAA,MACM,sBAAsB,WAAW;;;YAKhC,wBAA8B,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,EAAE;;CAEtE,SAAS;AACP,SAAO,IAAI;;;gBAGGA;;;YAPf,SAAS;CAAE,MAAM;CAAQ,SAAS;CAAM,CAAC,CAAA,EAAA,cAAA,WAAA,MAAA,KAAA,EAAA;4BAL3CC,cAAc,kBAAwB,CAAA,EAAA,cAAA;AAevC,IAAA,sBAAe"}
+{"version":3,"file":"modal-label.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal-label.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Modal label.\n *\n * @element cds-modal-label\n */\n@customElement(`${prefix}-modal-label`)\nclass CDSModalLabel extends LitElement {\n  /**\n   * The unique identifier for this label element\n   */\n  @property({ type: String, reflect: true })\n  id = `${prefix}--modal-label--id-${Math.random().toString(16).slice(2)}`;\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSModalLabel;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,gBAAA,MACM,sBAAsB,WAAW;;;YAKhC,wBAA8B,KAAK,OAAO,CAAC,CAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC;;CAErE,SAAS;EACP,OAAO,IAAI;CACb;;gBAEgBA;;AAClB;YARG,SAAS;CAAE,MAAM;CAAQ,SAAS;AAAK,CAAC,CAAA,GAAA,cAAA,WAAA,MAAA,KAAA,CAAA;4BAL1CC,cAAc,iBAAuB,CAAA,GAAA,aAAA;AAetC,IAAA,sBAAe"}

package/es/components/modal/modal.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import { MODAL_SIZE } from "./defs.js";
 import modal_default$1 from "./modal.scss.js";

package/es/components/modal/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { MODAL_SIZE } from './defs';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport CDSModalBase from './modal-base';\nimport '../dialog/dialog';\n\nexport { MODAL_SIZE };\n\n/**\n * Modal.\n *\n * @element cds-modal\n * @csspart dialog The dialog.\n * @fires cds-modal-beingclosed\n *   The custom event fired before this modal is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this modal.\n * @fires cds-modal-closed - The custom event fired after this modal is closed upon a user gesture.\n */\n@customElement(`${prefix}-modal`)\nclass CDSModal extends CDSModalBase {\n  /**\n   * Enable the use of native dialog element instead of div with role=\"dialog\"\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'enable-dialog-element',\n  })\n  enableDialogElement = false;\n\n  /**\n   * MutationObserver that observes the modal-footer\n   */\n  private _footerObserver?: MutationObserver;\n\n  /**\n   * MutationObserver that observes the modal-header\n   */\n  private _headerObserver?: MutationObserver;\n\n  /**\n   * Handles `click` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  protected _handleClick = (event: MouseEvent) => {\n    if (\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      event.composedPath().indexOf(this.shadowRoot!) < 0 &&\n      !this.preventCloseOnClickOutside\n    ) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  };\n\n  @HostListener('document:keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  protected _handleKeydown = ({ key, target }: KeyboardEvent) => {\n    // let the Dialog handle the event if using `enable-dialog-element` feature flag\n    if (!this.open || this.enableDialogElement) return;\n\n    if (key === 'Esc' || key === 'Escape') {\n      this._handleUserInitiatedClose(target);\n    }\n  };\n\n  /**\n   * Handle the keydown event.\n   * Trap the focus inside the side-panel by tracking keydown.key == `Tab`\n   *\n   * @param {KeyboardEvent} event The keyboard event object.\n   */\n  @HostListener('keydown')\n  protected _handleHostKeydown = (event: KeyboardEvent) => {\n    const target = event.target as HTMLElement | null;\n    const { primaryButton } = this._getFooterElements();\n\n    if (\n      this.open &&\n      this.shouldSubmitOnEnter &&\n      event.key === 'Enter' &&\n      target &&\n      document.activeElement !== primaryButton\n    ) {\n      const closeButton = (this.constructor as typeof CDSModal)\n        .selectorCloseButton;\n\n      const targetIsCloseButton =\n        !!target.closest(closeButton) ||\n        !!document.activeElement?.closest?.(closeButton);\n\n      if (!targetIsCloseButton) {\n        primaryButton?.click();\n        return;\n      }\n    }\n\n    if (this.enableDialogElement) return;\n\n    if (event.key === 'Tab') {\n      const { first: _firstElement, last: _lastElement } = this.getFocusable();\n\n      if (\n        event.shiftKey &&\n        (this.shadowRoot?.activeElement === _firstElement ||\n          document.activeElement === _firstElement)\n      ) {\n        event.preventDefault();\n\n        _lastElement?.focus();\n      } else if (!event.shiftKey && document.activeElement === _lastElement) {\n        event.preventDefault();\n\n        _firstElement?.focus();\n      }\n    }\n  };\n\n  /**\n   * `enable-dialog-element`\n   *\n   * Handles `cds-dialog-closed` event from the nested dialog element.\n   * Syncs the open state when the dialog closes, and stops the propagation of the\n   * event in favour of `cds-modal-closed`\n   */\n  protected _handleDialogClosed = (event: CustomEvent) => {\n    event.stopPropagation();\n\n    this.open = false;\n\n    // fire modal closed event\n    this.dispatchEvent(\n      new CustomEvent((this.constructor as typeof CDSModal).eventClose, {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: event.detail,\n      })\n    );\n  };\n\n  /**\n   * `enable-dialog-element`\n   *\n   * Handles `cds-dialog-beingclosed` event from the nested dialog element.\n   * Stops the propagation of the event in favour of `cds-modal-beingclosed`\n   */\n  protected _handleDialogBeingClosed = (event: CustomEvent) => {\n    event.stopPropagation();\n\n    const modalEvent = new CustomEvent(\n      (this.constructor as typeof CDSModal).eventBeforeClose,\n      {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: event.detail,\n      }\n    );\n\n    // allow the user to cancel the beingclosed event\n    if (!this.dispatchEvent(modalEvent)) {\n      event.preventDefault();\n    }\n  };\n\n  /**\n   * Specify whether the Modal is displaying an alert, error or warning.\n   * Should go hand in hand with the danger prop.\n   */\n  @property({ type: Boolean, reflect: true })\n  alert = false;\n\n  /**\n   * Specify text for the accessibility label of the header\n   */\n  @property({ attribute: 'aria-label' })\n  ariaLabel: string | null = null;\n\n  /**\n   * The additional CSS class names for the container <div> of the element.\n   */\n  @property({ attribute: 'container-class' })\n  containerClass = '';\n\n  /**\n   * Specify whether or not the Modal content should have any inner padding.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'full-width' })\n  fullWidth = false;\n\n  /**\n   * Specify whether the modal contains scrolling content\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'has-scrolling-content',\n  })\n  hasScrollingContent = false;\n\n  /**\n   * `true` if the modal should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * Modal size.\n   */\n  @property({ reflect: true })\n  size = MODAL_SIZE.MEDIUM;\n\n  /**\n   * Specify if Enter key should be used as \"submit\" action that clicks the primary footer button\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'should-submit-on-enter',\n  })\n  shouldSubmitOnEnter = false;\n\n  async firstUpdated() {\n    const body = this.querySelector(\n      (this.constructor as typeof CDSModal).selectorModalBody\n    );\n\n    if (!body) {\n      const bodyElement = document.createElement(\n        (this.constructor as typeof CDSModal).selectorModalBody\n      );\n      this.appendChild(bodyElement);\n    }\n  }\n\n  /**\n   * Computes the aria-label of the modal based on (in order of highest to lowest precedence):\n   * - `modal-label`\n   * - `aria-label`\n   * - `modal-heading`\n   */\n  private _computeAriaLabel(): string {\n    const labelEl = this.querySelector(`${prefix}-modal-label`);\n    const label = labelEl?.textContent?.trim();\n    if (label) return label;\n\n    const ariaLabel = this.ariaLabel?.trim();\n    if (ariaLabel) return ariaLabel;\n\n    const headingEl = this.querySelector(`${prefix}-modal-heading`);\n    const heading = headingEl?.textContent?.trim();\n    return heading || '';\n  }\n\n  /**\n   * Observes the modal footer's `has-three-buttons` attribute to account for cases\n   * where the loading status and the amount of footer-buttons\n   * are being changed dynamically\n   */\n  private _observeFooter() {\n    const footer = this.querySelector(`${prefix}-modal-footer`);\n    if (!footer) return;\n\n    this._footerObserver = new MutationObserver(() => {\n      this._updateLoadingElement();\n    });\n    this._footerObserver.observe(footer, {\n      attributes: true,\n      childList: true,\n      attributeFilter: ['has-three-buttons'],\n    });\n  }\n\n  /**\n   * Observes the modal header to account for cases where the modal-heading,\n   * modal-label, and/or `aria-label` are dynamically changing\n   * to update the `aria-label` put on the modal\n   */\n  private _observeHeader() {\n    const header = this.querySelector(`${prefix}-modal-header`);\n    if (!header) return;\n\n    this._headerObserver = new MutationObserver(() => {\n      this.requestUpdate('ariaLabel');\n    });\n    this._headerObserver.observe(header, {\n      subtree: true,\n      characterData: true,\n      childList: true,\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback?.();\n    this._observeFooter();\n    this._observeHeader();\n  }\n\n  disconnectedCallback() {\n    this._footerObserver?.disconnect();\n    this._headerObserver?.disconnect();\n    super.disconnectedCallback?.();\n  }\n\n  render() {\n    const { alert, size, hasScrollingContent, enableDialogElement } = this;\n    const containerClass = this.containerClass\n      .split(' ')\n      .filter(Boolean)\n      .reduce((acc, item) => ({ ...acc, [item]: true }), {});\n    const containerClasses = classMap({\n      [`${prefix}--modal-container`]: true,\n      [`${prefix}--modal-container--${size}`]: size,\n      ...containerClass,\n    });\n\n    const ariaLabel = this._computeAriaLabel();\n\n    if (enableDialogElement) {\n      return html`\n        <cds-dialog\n          .open=${this.open}\n          .alert=${this.alert}\n          .preventCloseOnClickOutside=${this.preventCloseOnClickOutside}\n          .preventClose=${this.preventClose}\n          role=\"${alert ? 'alertdialog' : 'dialog'}\"\n          aria-label=${ariaLabel}\n          modal-controlled\n          @cds-dialog-closed=${this._handleDialogClosed}\n          @cds-dialog-beingclosed=${this._handleDialogBeingClosed}>\n          <slot @slotchange=\"${this._handleSlotChange}\"></slot>\n          ${hasScrollingContent\n            ? html` <div class=\"cds--modal-content--overflow-indicator\"></div> `\n            : ``}\n        </cds-dialog>\n      `;\n    } else {\n      return html`\n        <div\n          aria-label=${ariaLabel}\n          part=\"dialog\"\n          class=${containerClasses}\n          aria-modal=${true}\n          role=\"${alert ? 'alert' : 'dialog'}\"\n          tabindex=\"-1\"\n          @click=${this._handleClickContainer}>\n          <slot @slotchange=\"${this._handleSlotChange}\"></slot>\n          ${hasScrollingContent\n            ? html` <div class=\"cds--modal-content--overflow-indicator\"></div> `\n            : ``}\n        </div>\n      `;\n    }\n  }\n\n  async updated(changedProperties) {\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._launcher = this.ownerDocument!.activeElement;\n        const primaryFocusNode = this.querySelector(\n          (this.constructor as typeof CDSModal).selectorPrimaryFocus\n        );\n        await (this.constructor as typeof CDSModal)._delay();\n        if (primaryFocusNode) {\n          // For cases where a `carbon-web-components` component (e.g. `<cds-button>`) being `primaryFocusNode`,\n          // where its first update/render cycle that makes it focusable happens after `<cds-modal>`'s first update/render cycle\n          (primaryFocusNode as HTMLElement).focus();\n        } else {\n          const { primaryButton, secondaryButtons } = this._getFooterElements();\n\n          if (primaryButton) {\n            const kind = primaryButton?.getAttribute('kind');\n\n            if (kind === 'danger' && secondaryButtons[0]) {\n              secondaryButtons[0].focus();\n            } else {\n              primaryButton.focus();\n            }\n          } else {\n            const { first } = this.getFocusable();\n\n            first?.focus();\n          }\n        }\n      } else if (\n        this._launcher &&\n        typeof (this._launcher as HTMLElement).focus === 'function'\n      ) {\n        (this._launcher as HTMLElement).focus();\n        this._launcher = null;\n      }\n    }\n    if (\n      changedProperties.has('loadingStatus') ||\n      changedProperties.has('loadingDescription') ||\n      changedProperties.has('loadingSuccessDelay') ||\n      changedProperties.has('loadingIconDescription')\n    ) {\n      await (this.constructor as typeof CDSModal)._delay();\n      this._updateLoadingElement();\n    }\n  }\n\n  /**\n   * @param ms The number of milliseconds.\n   * @returns A promise that is resolves after the given milliseconds.\n   */\n  protected static _delay(ms = 0) {\n    return new Promise((resolve) => {\n      setTimeout(resolve, ms);\n    });\n  }\n\n  /**\n   * A selector selecting buttons that should close this modal.\n   */\n  static get selectorCloseButton() {\n    return `[data-modal-close],${prefix}-modal-close-button`;\n  }\n\n  /**\n   * A selector selecting the nodes that should be focused when modal gets open.\n   */\n  static get selectorPrimaryFocus() {\n    return `[data-modal-primary-focus],${prefix}-modal-footer ${prefix}-button[kind=\"primary\"]`;\n  }\n\n  /**\n   * A selector selecting the modal body component\n   */\n  static get selectorModalBody() {\n    return `${prefix}-modal-body`;\n  }\n\n  /**\n   * The name of the custom event fired before this modal is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this modal.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-modal-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this modal is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-modal-closed`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSModal;\n"],"mappings":"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"}
+{"version":3,"file":"modal.js","names":["styles","customElement"],"sources":["../../../src/components/modal/modal.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { MODAL_SIZE } from './defs';\nimport styles from './modal.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport CDSModalBase from './modal-base';\nimport '../dialog/dialog';\n\nexport { MODAL_SIZE };\n\n/**\n * Modal.\n *\n * @element cds-modal\n * @csspart dialog The dialog.\n * @fires cds-modal-beingclosed\n *   The custom event fired before this modal is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this modal.\n * @fires cds-modal-closed - The custom event fired after this modal is closed upon a user gesture.\n */\n@customElement(`${prefix}-modal`)\nclass CDSModal extends CDSModalBase {\n  /**\n   * Enable the use of native dialog element instead of div with role=\"dialog\"\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'enable-dialog-element',\n  })\n  enableDialogElement = false;\n\n  /**\n   * MutationObserver that observes the modal-footer\n   */\n  private _footerObserver?: MutationObserver;\n\n  /**\n   * MutationObserver that observes the modal-header\n   */\n  private _headerObserver?: MutationObserver;\n\n  /**\n   * Handles `click` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  protected _handleClick = (event: MouseEvent) => {\n    if (\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      event.composedPath().indexOf(this.shadowRoot!) < 0 &&\n      !this.preventCloseOnClickOutside\n    ) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  };\n\n  @HostListener('document:keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  protected _handleKeydown = ({ key, target }: KeyboardEvent) => {\n    // let the Dialog handle the event if using `enable-dialog-element` feature flag\n    if (!this.open || this.enableDialogElement) return;\n\n    if (key === 'Esc' || key === 'Escape') {\n      this._handleUserInitiatedClose(target);\n    }\n  };\n\n  /**\n   * Handle the keydown event.\n   * Trap the focus inside the side-panel by tracking keydown.key == `Tab`\n   *\n   * @param {KeyboardEvent} event The keyboard event object.\n   */\n  @HostListener('keydown')\n  protected _handleHostKeydown = (event: KeyboardEvent) => {\n    const target = event.target as HTMLElement | null;\n    const { primaryButton } = this._getFooterElements();\n\n    if (\n      this.open &&\n      this.shouldSubmitOnEnter &&\n      event.key === 'Enter' &&\n      target &&\n      document.activeElement !== primaryButton\n    ) {\n      const closeButton = (this.constructor as typeof CDSModal)\n        .selectorCloseButton;\n\n      const targetIsCloseButton =\n        !!target.closest(closeButton) ||\n        !!document.activeElement?.closest?.(closeButton);\n\n      if (!targetIsCloseButton) {\n        primaryButton?.click();\n        return;\n      }\n    }\n\n    if (this.enableDialogElement) return;\n\n    if (event.key === 'Tab') {\n      const { first: _firstElement, last: _lastElement } = this.getFocusable();\n\n      if (\n        event.shiftKey &&\n        (this.shadowRoot?.activeElement === _firstElement ||\n          document.activeElement === _firstElement)\n      ) {\n        event.preventDefault();\n\n        _lastElement?.focus();\n      } else if (!event.shiftKey && document.activeElement === _lastElement) {\n        event.preventDefault();\n\n        _firstElement?.focus();\n      }\n    }\n  };\n\n  /**\n   * `enable-dialog-element`\n   *\n   * Handles `cds-dialog-closed` event from the nested dialog element.\n   * Syncs the open state when the dialog closes, and stops the propagation of the\n   * event in favour of `cds-modal-closed`\n   */\n  protected _handleDialogClosed = (event: CustomEvent) => {\n    event.stopPropagation();\n\n    this.open = false;\n\n    // fire modal closed event\n    this.dispatchEvent(\n      new CustomEvent((this.constructor as typeof CDSModal).eventClose, {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: event.detail,\n      })\n    );\n  };\n\n  /**\n   * `enable-dialog-element`\n   *\n   * Handles `cds-dialog-beingclosed` event from the nested dialog element.\n   * Stops the propagation of the event in favour of `cds-modal-beingclosed`\n   */\n  protected _handleDialogBeingClosed = (event: CustomEvent) => {\n    event.stopPropagation();\n\n    const modalEvent = new CustomEvent(\n      (this.constructor as typeof CDSModal).eventBeforeClose,\n      {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: event.detail,\n      }\n    );\n\n    // allow the user to cancel the beingclosed event\n    if (!this.dispatchEvent(modalEvent)) {\n      event.preventDefault();\n    }\n  };\n\n  /**\n   * Specify whether the Modal is displaying an alert, error or warning.\n   * Should go hand in hand with the danger prop.\n   */\n  @property({ type: Boolean, reflect: true })\n  alert = false;\n\n  /**\n   * Specify text for the accessibility label of the header\n   */\n  @property({ attribute: 'aria-label' })\n  ariaLabel: string | null = null;\n\n  /**\n   * The additional CSS class names for the container <div> of the element.\n   */\n  @property({ attribute: 'container-class' })\n  containerClass = '';\n\n  /**\n   * Specify whether or not the Modal content should have any inner padding.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'full-width' })\n  fullWidth = false;\n\n  /**\n   * Specify whether the modal contains scrolling content\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'has-scrolling-content',\n  })\n  hasScrollingContent = false;\n\n  /**\n   * `true` if the modal should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * Modal size.\n   */\n  @property({ reflect: true })\n  size = MODAL_SIZE.MEDIUM;\n\n  /**\n   * Specify if Enter key should be used as \"submit\" action that clicks the primary footer button\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'should-submit-on-enter',\n  })\n  shouldSubmitOnEnter = false;\n\n  async firstUpdated() {\n    const body = this.querySelector(\n      (this.constructor as typeof CDSModal).selectorModalBody\n    );\n\n    if (!body) {\n      const bodyElement = document.createElement(\n        (this.constructor as typeof CDSModal).selectorModalBody\n      );\n      this.appendChild(bodyElement);\n    }\n  }\n\n  /**\n   * Computes the aria-label of the modal based on (in order of highest to lowest precedence):\n   * - `modal-label`\n   * - `aria-label`\n   * - `modal-heading`\n   */\n  private _computeAriaLabel(): string {\n    const labelEl = this.querySelector(`${prefix}-modal-label`);\n    const label = labelEl?.textContent?.trim();\n    if (label) return label;\n\n    const ariaLabel = this.ariaLabel?.trim();\n    if (ariaLabel) return ariaLabel;\n\n    const headingEl = this.querySelector(`${prefix}-modal-heading`);\n    const heading = headingEl?.textContent?.trim();\n    return heading || '';\n  }\n\n  /**\n   * Observes the modal footer's `has-three-buttons` attribute to account for cases\n   * where the loading status and the amount of footer-buttons\n   * are being changed dynamically\n   */\n  private _observeFooter() {\n    const footer = this.querySelector(`${prefix}-modal-footer`);\n    if (!footer) return;\n\n    this._footerObserver = new MutationObserver(() => {\n      this._updateLoadingElement();\n    });\n    this._footerObserver.observe(footer, {\n      attributes: true,\n      childList: true,\n      attributeFilter: ['has-three-buttons'],\n    });\n  }\n\n  /**\n   * Observes the modal header to account for cases where the modal-heading,\n   * modal-label, and/or `aria-label` are dynamically changing\n   * to update the `aria-label` put on the modal\n   */\n  private _observeHeader() {\n    const header = this.querySelector(`${prefix}-modal-header`);\n    if (!header) return;\n\n    this._headerObserver = new MutationObserver(() => {\n      this.requestUpdate('ariaLabel');\n    });\n    this._headerObserver.observe(header, {\n      subtree: true,\n      characterData: true,\n      childList: true,\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback?.();\n    this._observeFooter();\n    this._observeHeader();\n  }\n\n  disconnectedCallback() {\n    this._footerObserver?.disconnect();\n    this._headerObserver?.disconnect();\n    super.disconnectedCallback?.();\n  }\n\n  render() {\n    const { alert, size, hasScrollingContent, enableDialogElement } = this;\n    const containerClass = this.containerClass\n      .split(' ')\n      .filter(Boolean)\n      .reduce((acc, item) => ({ ...acc, [item]: true }), {});\n    const containerClasses = classMap({\n      [`${prefix}--modal-container`]: true,\n      [`${prefix}--modal-container--${size}`]: size,\n      ...containerClass,\n    });\n\n    const ariaLabel = this._computeAriaLabel();\n\n    if (enableDialogElement) {\n      return html`\n        <cds-dialog\n          .open=${this.open}\n          .alert=${this.alert}\n          .preventCloseOnClickOutside=${this.preventCloseOnClickOutside}\n          .preventClose=${this.preventClose}\n          role=\"${alert ? 'alertdialog' : 'dialog'}\"\n          aria-label=${ariaLabel}\n          modal-controlled\n          @cds-dialog-closed=${this._handleDialogClosed}\n          @cds-dialog-beingclosed=${this._handleDialogBeingClosed}>\n          <slot @slotchange=\"${this._handleSlotChange}\"></slot>\n          ${hasScrollingContent\n            ? html` <div class=\"cds--modal-content--overflow-indicator\"></div> `\n            : ``}\n        </cds-dialog>\n      `;\n    } else {\n      return html`\n        <div\n          aria-label=${ariaLabel}\n          part=\"dialog\"\n          class=${containerClasses}\n          aria-modal=${true}\n          role=\"${alert ? 'alert' : 'dialog'}\"\n          tabindex=\"-1\"\n          @click=${this._handleClickContainer}>\n          <slot @slotchange=\"${this._handleSlotChange}\"></slot>\n          ${hasScrollingContent\n            ? html` <div class=\"cds--modal-content--overflow-indicator\"></div> `\n            : ``}\n        </div>\n      `;\n    }\n  }\n\n  async updated(changedProperties) {\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._launcher = this.ownerDocument!.activeElement;\n        const primaryFocusNode = this.querySelector(\n          (this.constructor as typeof CDSModal).selectorPrimaryFocus\n        );\n        await (this.constructor as typeof CDSModal)._delay();\n        if (primaryFocusNode) {\n          // For cases where a `carbon-web-components` component (e.g. `<cds-button>`) being `primaryFocusNode`,\n          // where its first update/render cycle that makes it focusable happens after `<cds-modal>`'s first update/render cycle\n          (primaryFocusNode as HTMLElement).focus();\n        } else {\n          const { primaryButton, secondaryButtons } = this._getFooterElements();\n\n          if (primaryButton) {\n            const kind = primaryButton?.getAttribute('kind');\n\n            if (kind === 'danger' && secondaryButtons[0]) {\n              secondaryButtons[0].focus();\n            } else {\n              primaryButton.focus();\n            }\n          } else {\n            const { first } = this.getFocusable();\n\n            first?.focus();\n          }\n        }\n      } else if (\n        this._launcher &&\n        typeof (this._launcher as HTMLElement).focus === 'function'\n      ) {\n        (this._launcher as HTMLElement).focus();\n        this._launcher = null;\n      }\n    }\n    if (\n      changedProperties.has('loadingStatus') ||\n      changedProperties.has('loadingDescription') ||\n      changedProperties.has('loadingSuccessDelay') ||\n      changedProperties.has('loadingIconDescription')\n    ) {\n      await (this.constructor as typeof CDSModal)._delay();\n      this._updateLoadingElement();\n    }\n  }\n\n  /**\n   * @param ms The number of milliseconds.\n   * @returns A promise that is resolves after the given milliseconds.\n   */\n  protected static _delay(ms = 0) {\n    return new Promise((resolve) => {\n      setTimeout(resolve, ms);\n    });\n  }\n\n  /**\n   * A selector selecting buttons that should close this modal.\n   */\n  static get selectorCloseButton() {\n    return `[data-modal-close],${prefix}-modal-close-button`;\n  }\n\n  /**\n   * A selector selecting the nodes that should be focused when modal gets open.\n   */\n  static get selectorPrimaryFocus() {\n    return `[data-modal-primary-focus],${prefix}-modal-footer ${prefix}-button[kind=\"primary\"]`;\n  }\n\n  /**\n   * A selector selecting the modal body component\n   */\n  static get selectorModalBody() {\n    return `${prefix}-modal-body`;\n  }\n\n  /**\n   * The name of the custom event fired before this modal is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this modal.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-modal-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this modal is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-modal-closed`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSModal;\n"],"mappings":"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"}

package/es/components/multi-select/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/multi-select/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Multi-select selection feedback options.\n */\nexport enum SELECTION_FEEDBACK_OPTION {\n  /**\n   * selected item stays at it's position\n   */\n  FIXED = 'fixed',\n\n  /**\n   * selected item jumps to top\n   */\n  TOP = 'top',\n\n  /**\n   * selected item jump to top after reopen dropdown\n   */\n  TOP_AFTER_REOPEN = 'top-after-reopen',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,4BAAL,yBAAA,2BAAA;;;;AAIL,2BAAA,WAAA;;;;AAKA,2BAAA,SAAA;;;;AAKA,2BAAA,sBAAA;;KACD"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/multi-select/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n/**\n * Multi-select selection feedback options.\n */\nexport enum SELECTION_FEEDBACK_OPTION {\n  /**\n   * selected item stays at it's position\n   */\n  FIXED = 'fixed',\n\n  /**\n   * selected item jumps to top\n   */\n  TOP = 'top',\n\n  /**\n   * selected item jump to top after reopen dropdown\n   */\n  TOP_AFTER_REOPEN = 'top-after-reopen',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,4BAAL,yBAAA,2BAAA;;;;CAIL,0BAAA,WAAA;;;;CAKA,0BAAA,SAAA;;;;CAKA,0BAAA,sBAAA;;AACF,EAAA,CAAA,CAAA"}

package/es/components/multi-select/multi-select-item.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import dropdown_item_default from "../dropdown/dropdown-item.js";
 import "../checkbox/index.js";
 import multi_select_default from "./multi-select.scss.js";

package/es/components/multi-select/multi-select-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select-item.js","names":["CDSDropdownItem","styles","customElement"],"sources":["../../../src/components/multi-select/multi-select-item.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport CDSDropdownItem from '../dropdown/dropdown-item';\nimport styles from './multi-select.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport '../checkbox';\n/**\n * Multi select item.\n *\n * @element cds-multi-select-item\n */\n@customElement(`${prefix}-multi-select-item`)\nclass CDSMultiSelectItem extends CDSDropdownItem {\n  /**\n   * The property to hide when item is filtered from input\n   */\n  @property({ type: Boolean })\n  filtered;\n\n  /**\n   * Marks this item as the “select all” item.\n   */\n  @property({ type: Boolean, attribute: 'is-select-all', reflect: true })\n  isSelectAll = false;\n\n  /**\n   * When `true`, renders the checkbox in its indeterminate state.\n   */\n  @property({ type: Boolean, reflect: true })\n  indeterminate = false;\n\n  /**\n   * The `name` attribute for the `<input>` for selection.\n   */\n  @property({ attribute: 'selection-name' })\n  selectionName = '';\n\n  render() {\n    const { disabled, selected, selectionName, value, indeterminate } = this;\n    return html`\n      <div class=\"${prefix}--list-box__menu-item__option\">\n        <cds-checkbox\n          tabindex=\"-1\"\n          class=\"${prefix}--form-item ${prefix}--checkbox-wrapper\"\n          .checked=${selected}\n          .indeterminate=${indeterminate}\n          ?disabled=${disabled}\n          name=${ifDefined(selectionName || undefined)}\n          value=${value}>\n          <slot></slot>\n        </cds-checkbox>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that will return multi select.\n   */\n  static get selectorList() {\n    return `${prefix}-multi-select`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSMultiSelectItem;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAA,qBAAA,MACM,2BAA2BA,sBAAgB;;;qBAWjC;uBAME;uBAMA;;CAEhB,SAAS;EACP,MAAM,EAAE,UAAU,UAAU,eAAe,OAAO,kBAAkB;AACpE,SAAO,IAAI;0BACY;;;yBAGD,cAAA,MAAqB;qBAC1B,SAAS;2BACH,cAAc;sBACnB,SAAS;iBACd,UAAU,iBAAiB,KAAA,EAAU,CAAC;kBACrC,MAAM;;;;;;;;;CAUtB,WAAW,eAAe;AACxB,SAAO;;;gBAGOC;;;YA9Cf,SAAS,EAAE,MAAM,SAAS,CAAC,CAAA,EAAA,mBAAA,WAAA,YAAA,KAAA,EAAA;YAM3B,SAAS;CAAE,MAAM;CAAS,WAAW;CAAiB,SAAS;CAAM,CAAC,CAAA,EAAA,mBAAA,WAAA,eAAA,KAAA,EAAA;YAMtE,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,mBAAA,WAAA,iBAAA,KAAA,EAAA;YAM1C,SAAS,EAAE,WAAW,kBAAkB,CAAC,CAAA,EAAA,mBAAA,WAAA,iBAAA,KAAA,EAAA;iCAvB3CC,cAAc,wBAA8B,CAAA,EAAA,mBAAA;AAsD7C,IAAA,4BAAe"}
+{"version":3,"file":"multi-select-item.js","names":["CDSDropdownItem","styles","customElement"],"sources":["../../../src/components/multi-select/multi-select-item.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport CDSDropdownItem from '../dropdown/dropdown-item';\nimport styles from './multi-select.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport '../checkbox';\n/**\n * Multi select item.\n *\n * @element cds-multi-select-item\n */\n@customElement(`${prefix}-multi-select-item`)\nclass CDSMultiSelectItem extends CDSDropdownItem {\n  /**\n   * The property to hide when item is filtered from input\n   */\n  @property({ type: Boolean })\n  filtered;\n\n  /**\n   * Marks this item as the “select all” item.\n   */\n  @property({ type: Boolean, attribute: 'is-select-all', reflect: true })\n  isSelectAll = false;\n\n  /**\n   * When `true`, renders the checkbox in its indeterminate state.\n   */\n  @property({ type: Boolean, reflect: true })\n  indeterminate = false;\n\n  /**\n   * The `name` attribute for the `<input>` for selection.\n   */\n  @property({ attribute: 'selection-name' })\n  selectionName = '';\n\n  render() {\n    const { disabled, selected, selectionName, value, indeterminate } = this;\n    return html`\n      <div class=\"${prefix}--list-box__menu-item__option\">\n        <cds-checkbox\n          tabindex=\"-1\"\n          class=\"${prefix}--form-item ${prefix}--checkbox-wrapper\"\n          .checked=${selected}\n          .indeterminate=${indeterminate}\n          ?disabled=${disabled}\n          name=${ifDefined(selectionName || undefined)}\n          value=${value}>\n          <slot></slot>\n        </cds-checkbox>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that will return multi select.\n   */\n  static get selectorList() {\n    return `${prefix}-multi-select`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSMultiSelectItem;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,IAAA,qBAAA,MACM,2BAA2BA,sBAAgB;;;qBAWjC;uBAME;uBAMA;;CAEhB,SAAS;EACP,MAAM,EAAE,UAAU,UAAU,eAAe,OAAO,kBAAkB;EACpE,OAAO,IAAI;0BACY;;;yBAGD,cAAA,MAAqB;qBAC1B,SAAS;2BACH,cAAc;sBACnB,SAAS;iBACd,UAAU,iBAAiB,KAAA,CAAS,EAAE;kBACrC,MAAM;;;;;CAKtB;;;;CAKA,WAAW,eAAe;EACxB,OAAO;CACT;;gBAEgBC;;AAClB;YA/CG,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,mBAAA,WAAA,YAAA,KAAA,CAAA;YAM1B,SAAS;CAAE,MAAM;CAAS,WAAW;CAAiB,SAAS;AAAK,CAAC,CAAA,GAAA,mBAAA,WAAA,eAAA,KAAA,CAAA;YAMrE,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,mBAAA,WAAA,iBAAA,KAAA,CAAA;YAMzC,SAAS,EAAE,WAAW,iBAAiB,CAAC,CAAA,GAAA,mBAAA,WAAA,iBAAA,KAAA,CAAA;iCAvB1CC,cAAc,uBAA6B,CAAA,GAAA,kBAAA;AAsD5C,IAAA,4BAAe"}

package/es/components/multi-select/multi-select.js

@@ -8,7 +8,7 @@
 import "../../globals/settings.js";
 import { filter, forEach } from "../../globals/internal/collection-helpers.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import ai_label_default from "../ai-label/ai-label.js";

package/es/components/multi-select/multi-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select.js","names":["CDSDropdown","CDSAILabel","styles","customElement"],"sources":["../../../src/components/multi-select/multi-select.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, PropertyValues, TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport Close16 from '@carbon/icons/es/close/16.js';\nimport { filter, forEach } from '../../globals/internal/collection-helpers';\nimport CDSDropdown, {\n  DROPDOWN_KEYBOARD_ACTION,\n  DROPDOWN_TYPE,\n} from '../dropdown/dropdown';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport { SELECTION_FEEDBACK_OPTION } from './defs';\nimport CDSMultiSelectItem from './multi-select-item';\nimport styles from './multi-select.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport HostListener from '../../globals/decorators/host-listener';\nimport CDSAILabel from '../ai-label/ai-label';\n\nexport {\n  DROPDOWN_SIZE,\n  DROPDOWN_TYPE,\n  DROPDOWN_DIRECTION,\n} from '../dropdown/dropdown';\n\nexport { SELECTION_FEEDBACK_OPTION };\n\n/**\n * Multi select.\n *\n * @element cds-multi-select\n * @fires cds-multi-select-beingselected\n *   The custom event fired before a multi select item is selected upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated selection.\n * @fires cds-multi-select-selected - The custom event fired after a multi select item is selected upon a user gesture.\n * @fires cds-multi-select-beingtoggled\n *   The custom event fired before the open state of this multi select is toggled upon a user gesture.\n *   Cancellation of this event stops the user-initiated toggling.\n * @fires cds-multi-select-toggled\n *   The custom event fired after the open state of this multi select is toggled upon a user gesture.\n */\n@customElement(`${prefix}-multi-select`)\nclass CDSMultiSelect extends CDSDropdown {\n  @property({ type: Boolean })\n  filterable;\n\n  /**\n   * The native `autocomplete` attribute for the filterable input.\n   */\n  @property({ type: String })\n  autocomplete = 'off';\n\n  /**\n   * The count of selected items.\n   */\n  private _selectedItemsCount = 0;\n\n  /**\n   * The clear button.\n   */\n  @query('#clear-button')\n  private _clearButtonNode!: HTMLElement;\n\n  /**\n   * The selection button.\n   */\n  @query('#selection-button')\n  private _selectionButtonNode!: HTMLElement;\n\n  /**\n   * The `<input>` for filtering.\n   */\n  @query('input')\n  private _filterInputNode!: HTMLInputElement;\n\n  protected get _supportsMenuInputFiltering() {\n    return Boolean(this.filterable);\n  }\n\n  protected willUpdate(changedProperties: PropertyValues) {\n    this._shouldTriggerBeFocusable = !this.filterable;\n    super.willUpdate(changedProperties);\n  }\n\n  protected get _menuInputNode(): HTMLInputElement | null {\n    return this.filterable ? (this._filterInputNode ?? null) : null;\n  }\n\n  protected _clearMenuInputFiltering() {\n    if (this.filterable) {\n      this._handleUserInitiatedClearInput();\n    }\n  }\n\n  protected _shouldClearMenuInputOnEscape({\n    menuOpen,\n    isInputTarget,\n  }: {\n    event: KeyboardEvent;\n    menuOpen: boolean;\n    isInputTarget: boolean;\n  }) {\n    if (!isInputTarget) {\n      return false;\n    }\n\n    if (menuOpen) {\n      return false;\n    }\n\n    if (!menuOpen) {\n      if (this._selectedItemsCount > 0) {\n        this._handleUserInitiatedSelectItem();\n      }\n\n      return Boolean(this._filterInputNode?.value);\n    }\n\n    return false;\n  }\n\n  /**\n   * The trigger button.\n   */\n  @query(`.${prefix}--list-box__field`)\n  private _triggerNode!: HTMLElement;\n\n  protected _selectionShouldChange(itemToSelect?: CDSMultiSelectItem) {\n    // If we are selecting an item, assumes we always toggle\n    return Boolean(this.value || itemToSelect);\n  }\n\n  protected _selectionDidChange(itemToSelect?: CDSMultiSelectItem) {\n    const allItems = Array.from(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      )\n    ) as CDSMultiSelectItem[];\n\n    // clicked \"select all\" when it was indeterminate\n    if (itemToSelect?.isSelectAll && itemToSelect.indeterminate) {\n      allItems.forEach((i) => {\n        i.selected = false;\n        i.indeterminate = false;\n      });\n      this.value = '';\n      return;\n    }\n\n    if (itemToSelect) {\n      // clicked select all\n      if (itemToSelect.isSelectAll) {\n        const items = this.filterable\n          ? Array.from(\n              this.querySelectorAll(\n                (this.constructor as typeof CDSMultiSelect).selectorItemResults\n              )\n            )\n          : allItems;\n        items.forEach((i) => {\n          if (\n            !(i as CDSMultiSelectItem).isSelectAll &&\n            !(i as CDSMultiSelectItem).disabled\n          ) {\n            (i as CDSMultiSelectItem).selected = !itemToSelect.selected;\n          }\n          (i as CDSMultiSelectItem).indeterminate = false;\n        });\n        itemToSelect.selected = !itemToSelect.selected;\n        // clicked regular item\n      } else {\n        itemToSelect.selected = !itemToSelect.selected;\n      }\n    } else {\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSMultiSelect).selectorItemSelected\n        ),\n        (item) => {\n          (item as CDSMultiSelectItem).selected = false;\n        }\n      );\n      this._handleUserInitiatedToggle(false);\n    }\n    if (this.selectAll) this._computeSelectAllState();\n    // Change in `.selected` hasn't been reflected to the corresponding attribute yet\n    this.value = filter(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      ),\n      (item) => (item as CDSMultiSelectItem).selected\n    )\n      .map((item) => (item as CDSMultiSelectItem).value)\n      .join(',');\n  }\n\n  // Keep the menu open for individual selections, close only when clearing.\n\n  protected _shouldCloseAfterSelection(item?: CDSMultiSelectItem) {\n    return !item;\n  }\n\n  protected _handleClickInner(event: MouseEvent) {\n    const clickedItem = (event.target as HTMLElement).closest(\n      `${prefix}-multi-select-item`\n    ) as CDSMultiSelectItem | null;\n    if (\n      this._selectionButtonNode?.contains(event.target as Node) &&\n      !this.readOnly\n    ) {\n      this._handleUserInitiatedSelectItem();\n      if (this.filterable) {\n        this._filterInputNode.focus();\n      } else {\n        this._triggerNode.focus();\n      }\n    } else if (clickedItem && !clickedItem.hasAttribute('disabled')) {\n      // Handle focus highlight\n      const allItems = this.querySelectorAll(`${prefix}-multi-select-item`);\n      allItems.forEach((el) => el.removeAttribute('highlighted'));\n      clickedItem.setAttribute('highlighted', '');\n      this._handleUserInitiatedSelectItem(clickedItem);\n      this.setAttribute('item-clicked', '');\n      if (this.filterable) {\n        this._filterInputNode.focus();\n      }\n    } else if (this._clearButtonNode?.contains(event.target as Node)) {\n      this._handleUserInitiatedClearInput();\n    } else if (\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSMultiSelect).aiLabelItem\n      ) &&\n      // remove reference to slug in v12\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSMultiSelect).slugItem\n      )\n    ) {\n      super._handleClickInner(event);\n      if (this.filterable) {\n        if (!this.open && this._filterInputNode) {\n          this._clearInput();\n        }\n        this._filterInputNode.focus();\n      }\n    }\n  }\n\n  /**\n   * Clears selections on Escape click\n   */\n  protected _handleKeydownInner(event: KeyboardEvent) {\n    if (event.target instanceof CDSAILabel) {\n      return;\n    }\n    const { key } = event;\n    if (\n      key === 'Escape' &&\n      !this.filterable &&\n      !this.open &&\n      this._selectedItemsCount > 0\n    ) {\n      this._handleUserInitiatedSelectItem();\n      return;\n    }\n    super._handleKeydownInner(event);\n  }\n\n  @HostListener('focusout')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  protected _handleFocusOut(event: FocusEvent) {\n    if (\n      this.filterable &&\n      this._filterInputNode &&\n      !this.contains(event.relatedTarget as Node)\n    ) {\n      this._clearInput();\n    }\n    super._handleFocusOut(event);\n  }\n\n  /**\n   * Handler for the `keypress` event, ensures filter still works upon entering space\n   */\n  protected _handleKeypressInner(event: KeyboardEvent) {\n    if (event.target instanceof CDSAILabel) {\n      return;\n    }\n    const { key } = event;\n    const action = (this.constructor as typeof CDSDropdown).getAction(key);\n    const { TRIGGERING } = DROPDOWN_KEYBOARD_ACTION;\n\n    if (\n      this._clearButtonNode?.contains(event.target as Node) &&\n      // Space key should be handled by `<input>` unless \"clear selection\" button has focus\n      (action === TRIGGERING || key === ' ')\n    ) {\n      this._handleUserInitiatedClearInput();\n    } else if (this._selectionButtonNode?.contains(event.target as Node)) {\n      this._handleUserInitiatedSelectItem();\n      this.open = true;\n      if (this.filterable) {\n        this._filterInputNode.focus();\n      } else {\n        this._triggerNode.focus();\n      }\n    } else if (this.filterable) {\n      this._handleKeypressInnerFlterable(event);\n    } else {\n      super._handleKeypressInner(event);\n    }\n  }\n\n  protected _handleMouseoverInner(event: MouseEvent) {\n    const item = this._getDropdownItemFromEvent(event);\n    const isFiltering =\n      this.filterable && Boolean(this._filterInputNode?.value.length);\n\n    if (\n      !item ||\n      isFiltering ||\n      !item.hasAttribute('selected') ||\n      !item.hasAttribute('highlighted')\n    ) {\n      return;\n    }\n\n    super._handleMouseoverInner(event);\n  }\n\n  protected _handleMouseleaveInner(event: MouseEvent) {\n    const constructor = this.constructor as typeof CDSMultiSelect;\n    const isFiltering =\n      this.filterable && Boolean(this._filterInputNode?.value.length);\n    const highlightedItem = this.querySelector(\n      constructor.selectorItemHighlighted\n    ) as CDSMultiSelectItem | null;\n\n    if (isFiltering || highlightedItem?.hasAttribute('selected')) {\n      return;\n    }\n\n    super._handleMouseleaveInner(event);\n  }\n\n  /**\n   * Special andler for the `keypress` event, ensures space selection for filterable\n   * variation is disabled\n   */\n\n  protected _handleKeypressInnerFlterable(event: KeyboardEvent) {\n    const { key } = event;\n    const action = (this.constructor as typeof CDSDropdown).getAction(key);\n    if (!this.open) {\n      switch (action) {\n        case DROPDOWN_KEYBOARD_ACTION.TRIGGERING:\n          this._handleUserInitiatedToggle(true);\n          break;\n        default:\n          break;\n      }\n    } else {\n      switch (key) {\n        case 'Enter':\n          {\n            const constructor = this.constructor as typeof CDSDropdown;\n            const highlightedItem = this.querySelector(\n              constructor.selectorItemHighlighted\n            ) as CDSMultiSelectItem;\n            if (highlightedItem) {\n              this._handleUserInitiatedSelectItem(highlightedItem);\n            } else {\n              this._handleUserInitiatedToggle(false);\n            }\n          }\n          break;\n        default:\n          break;\n      }\n    }\n  }\n\n  protected _renderTitleLabel() {\n    const {\n      clearSelectionDescription,\n      clearSelectionText,\n      disabled,\n      hideLabel,\n      titleText,\n      _selectedItemsCount: selectedItemsCount,\n      _slotTitleTextNode: slotTitleTextNode,\n      _handleSlotchangeLabelText: handleSlotchangeLabelText,\n    } = this;\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--label--disabled`]: disabled,\n      [`${prefix}--visually-hidden`]: hideLabel,\n    });\n\n    const hasTitleText =\n      titleText ||\n      (slotTitleTextNode && slotTitleTextNode.assignedNodes().length > 0);\n\n    return html`\n      <label\n        part=\"title-text\"\n        class=\"${labelClasses}\"\n        ?hidden=\"${!hasTitleText}\">\n        <slot name=\"title-text\" @slotchange=\"${handleSlotchangeLabelText}\"\n          >${titleText}</slot\n        >\n        ${selectedItemsCount > 0\n          ? html`\n              <span class=\"${prefix}--visually-hidden\">\n                ${clearSelectionDescription} ${selectedItemsCount},\n                ${clearSelectionText}\n              </span>\n            `\n          : null}\n      </label>\n    `;\n  }\n\n  protected _renderPrecedingLabel() {\n    const {\n      disabled,\n      readOnly,\n      clearSelectionLabel,\n      _selectedItemsCount: selectedItemsCount,\n    } = this;\n\n    const selectionButtonClasses = classMap({\n      [`${prefix}--list-box__selection`]: true,\n      [`${prefix}--list-box__selection--multi`]: true,\n      [`${prefix}--tag`]: true,\n      [`${prefix}--tag--filter`]: true,\n      [`${prefix}--tag--high-contrast`]: true,\n      [`${prefix}--tag--disabled`]: disabled,\n    });\n    return selectedItemsCount === 0\n      ? undefined\n      : html`\n          <div\n            id=\"selection-button\"\n            role=\"button\"\n            class=\"${selectionButtonClasses}\"\n            tabindex=\"-1\"\n            aria-disabled=${readOnly}\n            title=\"${clearSelectionLabel}\">\n            ${selectedItemsCount}\n            ${iconLoader(Close16, {\n              'aria-label': clearSelectionLabel,\n              class: `${prefix}--tag__close-icon`,\n            })}\n          </div>\n        `;\n  }\n\n  /**\n    @returns The main content of the trigger button.\n   */\n  protected _renderLabel(): TemplateResult {\n    const {\n      label,\n      value,\n      autocomplete,\n      _selectedItemContent: selectedItemContent,\n    } = this;\n\n    const inputClasses = classMap({\n      [`${prefix}--text-input`]: true,\n      [`${prefix}--text-input--empty`]: !value,\n    });\n\n    return !this.filterable\n      ? html`\n          <span id=\"trigger-label\" class=\"${prefix}--list-box__label\"\n            >${selectedItemContent || label}</span\n          >\n        `\n      : html`\n          <input\n            id=\"trigger-label\"\n            class=\"${inputClasses}\"\n            placeholder=\"${label}\"\n            role=\"combobox\"\n            aria-controls=\"menu-body\"\n            aria-expanded=\"${String(this.open)}\"\n            aria-autocomplete=\"list\"\n            autocomplete=\"${autocomplete}\"\n            @input=\"${this._handleInput}\" />\n        `;\n  }\n\n  protected _renderFollowingLabel(): TemplateResult | undefined {\n    const { clearSelectionLabel, _filterInputNode: filterInputNode } = this;\n    return filterInputNode &&\n      filterInputNode.value.length > 0 &&\n      this.filterable\n      ? html`\n          <div\n            id=\"clear-button\"\n            role=\"button\"\n            class=\"${prefix}--list-box__selection\"\n            tabindex=\"-1\"\n            title=\"${clearSelectionLabel}\">\n            ${iconLoader(Close16, { 'aria-label': clearSelectionLabel })}\n          </div>\n        `\n      : undefined;\n  }\n\n  /**\n   * Handles `input` event on the `<input>` for filtering.\n   */\n  protected _handleInput() {\n    const items = this.querySelectorAll(\n      (this.constructor as typeof CDSMultiSelect).selectorItem\n    );\n    const inputValue = this._filterInputNode.value.toLocaleLowerCase();\n    this.toggleAttribute('has-value', inputValue.length > 0);\n\n    if (!this.open && inputValue.length > 0) {\n      this.open = true;\n    }\n\n    forEach(items, (item) => {\n      // always show the selectAll item\n      if ((item as CDSMultiSelectItem).isSelectAll) {\n        item.removeAttribute('filtered');\n        return;\n      }\n      const itemValue = (item as HTMLElement).innerText.toLocaleLowerCase();\n\n      if (!itemValue.includes(inputValue)) {\n        (item as CDSMultiSelectItem).setAttribute('filtered', '');\n        (item as CDSMultiSelectItem).removeAttribute('highlighted');\n      } else {\n        (item as CDSMultiSelectItem).removeAttribute('filtered');\n      }\n    });\n\n    this.requestUpdate();\n\n    if (this.selectAll) {\n      const selectAllItem = this.querySelector(\n        `${prefix}-multi-select-item[is-select-all]`\n      ) as CDSMultiSelectItem;\n      if (selectAllItem) {\n        const visible = Array.from(\n          this.querySelectorAll(\n            (this.constructor as typeof CDSMultiSelect).selectorItemResults\n          )\n        ) as CDSMultiSelectItem[];\n        const actionable = visible.filter((i) => !i.isSelectAll && !i.disabled);\n        if (actionable.length === 0) {\n          selectAllItem.setAttribute('filtered', '');\n        } else {\n          selectAllItem.removeAttribute('filtered');\n          this._computeSelectAllState();\n        }\n      }\n    }\n\n    const constructor = this.constructor as typeof CDSMultiSelect;\n    const visibleItems = Array.from(\n      this.querySelectorAll(constructor.selectorItemResults)\n    ) as CDSMultiSelectItem[];\n\n    if (visibleItems.length > 0) {\n      visibleItems.forEach((i) => i.removeAttribute('highlighted'));\n      this.toggleAttribute('item-clicked', inputValue.length > 0);\n      const first = visibleItems[0] as HTMLElement;\n      first.setAttribute('highlighted', '');\n      first.focus();\n    } else {\n      this._filterInputNode.focus();\n    }\n  }\n\n  /**\n   * Navigate through dropdown items.\n   *\n   * @param direction `-1` to navigate backward, `1` to navigate forward.\n   */\n  protected _navigate(direction: number) {\n    super._navigate(direction);\n    if (this.filterable) {\n      this.setAttribute('item-clicked', '');\n    } else {\n      this._triggerNode.classList.add('no-focus-style');\n    }\n  }\n\n  /**\n   * Handles user-initiated clearing the `<input>` for filtering.\n   */\n  protected _handleUserInitiatedClearInput() {\n    const constructor = this.constructor as typeof CDSMultiSelect;\n    const items = this.querySelectorAll(constructor.selectorItemFiltered);\n    this._filterInputNode.value = '';\n    this._filterInputNode.focus();\n    forEach(items, (item) => {\n      (item as CDSMultiSelectItem).removeAttribute('filtered');\n    });\n    this._filterInputNode.dispatchEvent(\n      new Event('input', { bubbles: true, composed: true })\n    );\n  }\n\n  /**\n   * The `aria-label` attribute for the icon to clear selection.\n   */\n  @property({ attribute: 'clear-selection-label' })\n  clearSelectionLabel = '';\n\n  /**\n   * Specify the text that should be read for screen readers that describes total items selected\n   */\n  @property({ attribute: 'clear-selection-description' })\n  clearSelectionDescription = 'Total items selected: ';\n\n  /**\n   * Specify the text that should be read for screen readers to clear selection.\n   */\n  @property({ attribute: 'clear-selection-text' })\n  clearSelectionText = 'To clear selection, press Delete or Backspace.';\n\n  /**\n   * Specify the locale of the control. Used for the default compareItems used for sorting the list of items in the control.\n   */\n  @property()\n  locale = 'en';\n\n  /**\n   * Enables rendering of a “Select all” multi-select-item\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'select-all' })\n  selectAll = false;\n\n  /**\n   * Specify feedback (mode) of the selection.\n   * `top`: selected item jumps to top\n   * `fixed`: selected item stays at it's position\n   * `top-after-reopen`: selected item jump to top after reopen dropdown\n   */\n  @property({ attribute: 'selection-feedback' })\n  selectionFeedback = SELECTION_FEEDBACK_OPTION.TOP_AFTER_REOPEN;\n\n  /**\n   * The CSS class list for multi-select listbox\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n  protected get _classes(): any {\n    const {\n      disabled,\n      size,\n      type,\n      invalid,\n      readOnly,\n      open,\n      warn,\n      _selectedItemsCount: selectedItemsCount,\n    } = this;\n    const inline = type === DROPDOWN_TYPE.INLINE;\n\n    const isInteractive = !readOnly && !disabled;\n\n    const normalizedProps: {\n      invalid: boolean;\n      warn: boolean;\n    } = {\n      invalid: isInteractive && invalid,\n      warn: isInteractive && !invalid && warn,\n    };\n\n    return classMap({\n      [`${prefix}--multi-select`]: true,\n      [`${prefix}--list-box`]: true,\n      [`${prefix}--list-box--disabled`]: disabled,\n      [`${prefix}--list-box--inline`]: inline,\n      [`${prefix}--list-box--expanded`]: open,\n      [`${prefix}--list-box--${size}`]: size,\n      [`${prefix}--multi-select--invalid`]: normalizedProps.invalid,\n      [`${prefix}--multi-select--warn`]: normalizedProps.warn,\n      [`${prefix}--multi-select--inline`]: inline,\n      [`${prefix}--multi-select--readonly`]: readOnly,\n      [`${prefix}--multi-select--selected`]: selectedItemsCount > 0,\n      [`${prefix}--list-box__wrapper--decorator`]: this._hasAILabel, // inherited from CDSDropdown\n      [`${prefix}--multi-select--selectall`]: this.selectAll,\n    });\n  }\n\n  protected defaultCompareItems = (\n    itemA: string,\n    itemB: string,\n    { locale }: { locale: string }\n  ) => {\n    return itemA.localeCompare(itemB, locale, { numeric: true });\n  };\n\n  /**\n   * Provide a custom function that is used to determine the ordering of\n   * options. The compare function should return a number whose sign indicates\n   * the relative order of the two elements: negative if a is less than b,\n   * positive if a is greater than b, and zero if they are equal. See 'sortItems'\n   * for more control.\n   *\n   * (itemA: string, itemB: string, { locale }: { locale: string }) => number\n   */\n  @property({ attribute: false })\n  compareItems: (\n    itemA: string,\n    itemB: string,\n    options: { locale: string }\n  ) => number = this.defaultCompareItems;\n\n  private getItemValue = (item: Node) =>\n    item instanceof Element ? (item.getAttribute('value') ?? '') : '';\n\n  protected defaultSortItems = (\n    menuItems: NodeList,\n    { values, compareItems, locale = 'en' }\n  ): Node[] => {\n    const menuItemsArray = Array.from(menuItems);\n\n    const sortedArray = menuItemsArray.sort((itemA, itemB) => {\n      const hasItemA = values.includes(this.getItemValue(itemA));\n      const hasItemB = values.includes(this.getItemValue(itemB));\n\n      // Prefer whichever item is in the `value` array first\n      if (hasItemA && !hasItemB) {\n        return -1;\n      }\n\n      if (hasItemB && !hasItemA) {\n        return 1;\n      }\n\n      return compareItems(\n        itemA.textContent?.trim() ?? '',\n        itemB.textContent?.trim() ?? '',\n        {\n          locale,\n        }\n      );\n    });\n\n    return sortedArray;\n  };\n\n  /**\n   * Provide a method that sorts all options in the control. Overriding this\n   * prop means that you also have to handle the sort logic for selected versus\n   * un-selected items. If you just want to control ordering, consider the\n   * `compareItems` prop instead.\n   *\n   * sortItems :\n   * (menuItems: NodeList, {\n   *   values: string[],\n   *   compareItems: (itemA: string, itemB: string, { locale }: { locale: string }) => number,\n   *   locale: string,\n   * }) => Node[]\n   *\n   */\n  @property({ attribute: false })\n  sortItems: (\n    menuItems: NodeList,\n    options: {\n      values: string[];\n      compareItems: (\n        itemA: string,\n        itemB: string,\n        options: { locale: string }\n      ) => number;\n      locale: string;\n    }\n  ) => Node[] = this.defaultSortItems;\n\n  shouldUpdate(changedProperties) {\n    const { selectorItem, aiLabelItem, slugItem } = this\n      .constructor as typeof CDSMultiSelect;\n    const aiLabel =\n      this.querySelector(aiLabelItem) || this.querySelector(slugItem);\n    const items = this.querySelectorAll(selectorItem);\n\n    const { value, locale } = this;\n    const values = !value ? [] : value.split(',');\n\n    if (changedProperties.has('size')) {\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        (elem as CDSMultiSelectItem).size = this.size;\n      });\n    }\n    if (changedProperties.has('value')) {\n      // Updates selection beforehand because our rendering logic for `<cds-multi-select>` looks for selected items via `qSA()`\n      forEach(items, (elem) => {\n        (elem as CDSMultiSelectItem).selected =\n          values.indexOf((elem as CDSMultiSelectItem).value) >= 0;\n      });\n      this._selectedItemsCount = filter(\n        items,\n        (elem) =>\n          values.indexOf((elem as CDSMultiSelectItem).value) >= 0 &&\n          !(elem as CDSMultiSelectItem).isSelectAll\n      ).length;\n    }\n\n    const shouldSortItems =\n      changedProperties.has('value') ||\n      changedProperties.has('compareItems') ||\n      changedProperties.has('sortItems') ||\n      changedProperties.has('locale');\n\n    if (\n      shouldSortItems &&\n      this.selectionFeedback === SELECTION_FEEDBACK_OPTION.TOP\n    ) {\n      const sortedMenuItems = this.sortItems(items, {\n        values,\n        compareItems: this.compareItems,\n        locale,\n      });\n\n      if (aiLabel) {\n        sortedMenuItems.unshift(aiLabel);\n      }\n\n      this.replaceChildren(...sortedMenuItems);\n    }\n\n    const shouldSortItemsAfterReopen =\n      changedProperties.has('open') ||\n      changedProperties.has('compareItems') ||\n      changedProperties.has('sortItems') ||\n      changedProperties.has('locale');\n\n    if (\n      shouldSortItemsAfterReopen &&\n      this.selectionFeedback === SELECTION_FEEDBACK_OPTION.TOP_AFTER_REOPEN\n    ) {\n      const sortedMenuItems = this.sortItems(items, {\n        values,\n        compareItems: this.compareItems,\n        locale,\n      });\n\n      sortedMenuItems.forEach((item) => {\n        this.appendChild(item);\n      });\n    }\n    return true;\n  }\n\n  updated(changedProperties) {\n    super.updated(changedProperties);\n\n    if (changedProperties.has('open') && this.open) {\n      const selectedItems = Array.from(\n        this.querySelectorAll(`${prefix}-multi-select-item[selected]`)\n      ) as CDSMultiSelectItem[];\n\n      if (selectedItems.length > 0) {\n        let itemToFocus: HTMLElement | null = null;\n        if (this.selectAll) {\n          itemToFocus = this.querySelector(\n            `${prefix}-multi-select-item[is-select-all]`\n          ) as CDSMultiSelectItem;\n        }\n        if (!itemToFocus) {\n          itemToFocus = selectedItems[0] as HTMLElement;\n        }\n        this.setAttribute('item-clicked', '');\n        itemToFocus.focus();\n        itemToFocus.setAttribute('highlighted', '');\n      } else {\n        if (this.filterable) {\n          this._filterInputNode.focus();\n        } else {\n          this._triggerNode.focus();\n        }\n      }\n    }\n    // reorder items so that select all is always at the top of the list\n    if (this.selectAll && changedProperties.has('open') && this.open) {\n      const items = Array.from(\n        this.querySelectorAll('cds-multi-select-item')\n      ) as CDSMultiSelectItem[];\n\n      const selectAllItem = items.find((i) => i.isSelectAll);\n      if (selectAllItem) {\n        this.appendChild(selectAllItem);\n        items\n          .filter((i) => i !== selectAllItem)\n          .forEach((i) => this.appendChild(i));\n      }\n    }\n\n    // flush the top of the first element\n    Array.from(this.querySelectorAll('cds-multi-select-item')).forEach(\n      (item, index) => {\n        if (index === 0 && !item.hasAttribute('is-select-all')) {\n          item.setAttribute('flush-top', '');\n        } else if (index === 1 && this.selectAll) {\n          item.setAttribute('flush-top', '');\n        } else {\n          item.removeAttribute('flush-top');\n        }\n      }\n    );\n\n    if (changedProperties.has('open') && !this.open) {\n      this._triggerNode.classList.remove('no-focus-style');\n      this.removeAttribute('item-clicked');\n    }\n  }\n\n  firstUpdated(changedProperties) {\n    super.firstUpdated?.(changedProperties);\n\n    // whenever more items are added/removed, recompute the state of the select all option\n    if (!this.selectAll) return;\n    const defaultSlot =\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!;\n    defaultSlot.addEventListener('slotchange', () =>\n      this._computeSelectAllState()\n    );\n  }\n\n  /**\n   * Computes the state of the select all option and sets it to either\n   * 'selected' or 'indeterminate'\n   */\n  private _computeSelectAllState() {\n    if (!this.selectAll) return;\n\n    const allItems = Array.from(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      )\n    ) as CDSMultiSelectItem[];\n    const selectAllItem = allItems.find((i) => i.isSelectAll);\n    if (!selectAllItem || selectAllItem.hasAttribute('filtered')) {\n      return;\n    }\n\n    const enabledItems = allItems\n      .filter((i) => !i.isSelectAll && !i.disabled)\n      .filter((i) => !this.filterable || !i.hasAttribute('filtered'));\n    const selectedCount = enabledItems.filter((i) => i.selected).length;\n    const allSelected = selectedCount === enabledItems.length;\n\n    selectAllItem.selected = allSelected;\n    selectAllItem.indeterminate = selectedCount > 0 && !allSelected;\n  }\n\n  /**\n   * Clears the filterable input field\n   */\n  private _clearInput() {\n    this._filterInputNode.value = '';\n    this.toggleAttribute('has-value', false);\n\n    const items = this.querySelectorAll(\n      (this.constructor as typeof CDSMultiSelect).selectorItemFiltered\n    );\n    forEach(items, (item) => {\n      (item as CDSMultiSelectItem).removeAttribute('filtered');\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    /**\n     * Detect if multi-select already has initially selected items\n     */\n    this.value = filter(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      ),\n      (item) => (item as CDSMultiSelectItem).hasAttribute('selected')\n    )\n      .map((item) => (item as CDSMultiSelectItem).getAttribute('value'))\n      .join(',');\n  }\n\n  /**\n   * A selector that will return menu body.\n   */\n  static get selectorMenuBody() {\n    return `div[part=\"menu-body\"]`;\n  }\n\n  /**\n   * A selector that will return highlighted items.\n   */\n  static get selectorItemHighlighted() {\n    return `${prefix}-multi-select-item[highlighted]`;\n  }\n\n  /**\n   * A selector that will return multi select items.\n   * We use a separate property from `.itemTagName` due to the nature in difference of tag name vs. selector.\n   */\n  static get selectorItem() {\n    return `${prefix}-multi-select-item`;\n  }\n\n  /**\n   * A selector that will return remaining items after a filter.\n   */\n  static get selectorItemFiltered() {\n    return `${prefix}-multi-select-item[filtered]`;\n  }\n\n  /**\n   * A selector that will return remaining items after a filter.\n   */\n  static get selectorItemResults() {\n    return `${prefix}-multi-select-item:not([filtered])`;\n  }\n\n  /**\n   * A selector that will return selected items.\n   */\n  static get selectorItemSelected() {\n    return `${prefix}-multi-select-item[selected]`;\n  }\n\n  /**\n   * The name of the custom event fired before this multi select item is being toggled upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of toggling this multi select item.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-multi-select-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after this multi select item is toggled upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-multi-select-toggled`;\n  }\n\n  /**\n   * The name of the custom event fired before a multi select item is selected upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated selection.\n   */\n  static get eventBeforeSelect() {\n    return `${prefix}-multi-select-beingselected`;\n  }\n\n  /**\n   * The name of the custom event fired after a a multi select item is selected upon a user gesture.\n   */\n  static get eventSelect() {\n    return `${prefix}-multi-select-selected`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSMultiSelect;\n"],"mappings":"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"}
+{"version":3,"file":"multi-select.js","names":["CDSDropdown","CDSAILabel","styles","customElement"],"sources":["../../../src/components/multi-select/multi-select.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, PropertyValues, TemplateResult } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport Close16 from '@carbon/icons/es/close/16.js';\nimport { filter, forEach } from '../../globals/internal/collection-helpers';\nimport CDSDropdown, {\n  DROPDOWN_KEYBOARD_ACTION,\n  DROPDOWN_TYPE,\n} from '../dropdown/dropdown';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport { SELECTION_FEEDBACK_OPTION } from './defs';\nimport CDSMultiSelectItem from './multi-select-item';\nimport styles from './multi-select.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport HostListener from '../../globals/decorators/host-listener';\nimport CDSAILabel from '../ai-label/ai-label';\n\nexport {\n  DROPDOWN_SIZE,\n  DROPDOWN_TYPE,\n  DROPDOWN_DIRECTION,\n} from '../dropdown/dropdown';\n\nexport { SELECTION_FEEDBACK_OPTION };\n\n/**\n * Multi select.\n *\n * @element cds-multi-select\n * @fires cds-multi-select-beingselected\n *   The custom event fired before a multi select item is selected upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated selection.\n * @fires cds-multi-select-selected - The custom event fired after a multi select item is selected upon a user gesture.\n * @fires cds-multi-select-beingtoggled\n *   The custom event fired before the open state of this multi select is toggled upon a user gesture.\n *   Cancellation of this event stops the user-initiated toggling.\n * @fires cds-multi-select-toggled\n *   The custom event fired after the open state of this multi select is toggled upon a user gesture.\n */\n@customElement(`${prefix}-multi-select`)\nclass CDSMultiSelect extends CDSDropdown {\n  @property({ type: Boolean })\n  filterable;\n\n  /**\n   * The native `autocomplete` attribute for the filterable input.\n   */\n  @property({ type: String })\n  autocomplete = 'off';\n\n  /**\n   * The count of selected items.\n   */\n  private _selectedItemsCount = 0;\n\n  /**\n   * The clear button.\n   */\n  @query('#clear-button')\n  private _clearButtonNode!: HTMLElement;\n\n  /**\n   * The selection button.\n   */\n  @query('#selection-button')\n  private _selectionButtonNode!: HTMLElement;\n\n  /**\n   * The `<input>` for filtering.\n   */\n  @query('input')\n  private _filterInputNode!: HTMLInputElement;\n\n  protected get _supportsMenuInputFiltering() {\n    return Boolean(this.filterable);\n  }\n\n  protected willUpdate(changedProperties: PropertyValues) {\n    this._shouldTriggerBeFocusable = !this.filterable;\n    super.willUpdate(changedProperties);\n  }\n\n  protected get _menuInputNode(): HTMLInputElement | null {\n    return this.filterable ? (this._filterInputNode ?? null) : null;\n  }\n\n  protected _clearMenuInputFiltering() {\n    if (this.filterable) {\n      this._handleUserInitiatedClearInput();\n    }\n  }\n\n  protected _shouldClearMenuInputOnEscape({\n    menuOpen,\n    isInputTarget,\n  }: {\n    event: KeyboardEvent;\n    menuOpen: boolean;\n    isInputTarget: boolean;\n  }) {\n    if (!isInputTarget) {\n      return false;\n    }\n\n    if (menuOpen) {\n      return false;\n    }\n\n    if (!menuOpen) {\n      if (this._selectedItemsCount > 0) {\n        this._handleUserInitiatedSelectItem();\n      }\n\n      return Boolean(this._filterInputNode?.value);\n    }\n\n    return false;\n  }\n\n  /**\n   * The trigger button.\n   */\n  @query(`.${prefix}--list-box__field`)\n  private _triggerNode!: HTMLElement;\n\n  protected _selectionShouldChange(itemToSelect?: CDSMultiSelectItem) {\n    // If we are selecting an item, assumes we always toggle\n    return Boolean(this.value || itemToSelect);\n  }\n\n  protected _selectionDidChange(itemToSelect?: CDSMultiSelectItem) {\n    const allItems = Array.from(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      )\n    ) as CDSMultiSelectItem[];\n\n    // clicked \"select all\" when it was indeterminate\n    if (itemToSelect?.isSelectAll && itemToSelect.indeterminate) {\n      allItems.forEach((i) => {\n        i.selected = false;\n        i.indeterminate = false;\n      });\n      this.value = '';\n      return;\n    }\n\n    if (itemToSelect) {\n      // clicked select all\n      if (itemToSelect.isSelectAll) {\n        const items = this.filterable\n          ? Array.from(\n              this.querySelectorAll(\n                (this.constructor as typeof CDSMultiSelect).selectorItemResults\n              )\n            )\n          : allItems;\n        items.forEach((i) => {\n          if (\n            !(i as CDSMultiSelectItem).isSelectAll &&\n            !(i as CDSMultiSelectItem).disabled\n          ) {\n            (i as CDSMultiSelectItem).selected = !itemToSelect.selected;\n          }\n          (i as CDSMultiSelectItem).indeterminate = false;\n        });\n        itemToSelect.selected = !itemToSelect.selected;\n        // clicked regular item\n      } else {\n        itemToSelect.selected = !itemToSelect.selected;\n      }\n    } else {\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSMultiSelect).selectorItemSelected\n        ),\n        (item) => {\n          (item as CDSMultiSelectItem).selected = false;\n        }\n      );\n      this._handleUserInitiatedToggle(false);\n    }\n    if (this.selectAll) this._computeSelectAllState();\n    // Change in `.selected` hasn't been reflected to the corresponding attribute yet\n    this.value = filter(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      ),\n      (item) => (item as CDSMultiSelectItem).selected\n    )\n      .map((item) => (item as CDSMultiSelectItem).value)\n      .join(',');\n  }\n\n  // Keep the menu open for individual selections, close only when clearing.\n\n  protected _shouldCloseAfterSelection(item?: CDSMultiSelectItem) {\n    return !item;\n  }\n\n  protected _handleClickInner(event: MouseEvent) {\n    const clickedItem = (event.target as HTMLElement).closest(\n      `${prefix}-multi-select-item`\n    ) as CDSMultiSelectItem | null;\n    if (\n      this._selectionButtonNode?.contains(event.target as Node) &&\n      !this.readOnly\n    ) {\n      this._handleUserInitiatedSelectItem();\n      if (this.filterable) {\n        this._filterInputNode.focus();\n      } else {\n        this._triggerNode.focus();\n      }\n    } else if (clickedItem && !clickedItem.hasAttribute('disabled')) {\n      // Handle focus highlight\n      const allItems = this.querySelectorAll(`${prefix}-multi-select-item`);\n      allItems.forEach((el) => el.removeAttribute('highlighted'));\n      clickedItem.setAttribute('highlighted', '');\n      this._handleUserInitiatedSelectItem(clickedItem);\n      this.setAttribute('item-clicked', '');\n      if (this.filterable) {\n        this._filterInputNode.focus();\n      }\n    } else if (this._clearButtonNode?.contains(event.target as Node)) {\n      this._handleUserInitiatedClearInput();\n    } else if (\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSMultiSelect).aiLabelItem\n      ) &&\n      // remove reference to slug in v12\n      !(event.target as HTMLElement)?.matches(\n        (this.constructor as typeof CDSMultiSelect).slugItem\n      )\n    ) {\n      super._handleClickInner(event);\n      if (this.filterable) {\n        if (!this.open && this._filterInputNode) {\n          this._clearInput();\n        }\n        this._filterInputNode.focus();\n      }\n    }\n  }\n\n  /**\n   * Clears selections on Escape click\n   */\n  protected _handleKeydownInner(event: KeyboardEvent) {\n    if (event.target instanceof CDSAILabel) {\n      return;\n    }\n    const { key } = event;\n    if (\n      key === 'Escape' &&\n      !this.filterable &&\n      !this.open &&\n      this._selectedItemsCount > 0\n    ) {\n      this._handleUserInitiatedSelectItem();\n      return;\n    }\n    super._handleKeydownInner(event);\n  }\n\n  @HostListener('focusout')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  protected _handleFocusOut(event: FocusEvent) {\n    if (\n      this.filterable &&\n      this._filterInputNode &&\n      !this.contains(event.relatedTarget as Node)\n    ) {\n      this._clearInput();\n    }\n    super._handleFocusOut(event);\n  }\n\n  /**\n   * Handler for the `keypress` event, ensures filter still works upon entering space\n   */\n  protected _handleKeypressInner(event: KeyboardEvent) {\n    if (event.target instanceof CDSAILabel) {\n      return;\n    }\n    const { key } = event;\n    const action = (this.constructor as typeof CDSDropdown).getAction(key);\n    const { TRIGGERING } = DROPDOWN_KEYBOARD_ACTION;\n\n    if (\n      this._clearButtonNode?.contains(event.target as Node) &&\n      // Space key should be handled by `<input>` unless \"clear selection\" button has focus\n      (action === TRIGGERING || key === ' ')\n    ) {\n      this._handleUserInitiatedClearInput();\n    } else if (this._selectionButtonNode?.contains(event.target as Node)) {\n      this._handleUserInitiatedSelectItem();\n      this.open = true;\n      if (this.filterable) {\n        this._filterInputNode.focus();\n      } else {\n        this._triggerNode.focus();\n      }\n    } else if (this.filterable) {\n      this._handleKeypressInnerFlterable(event);\n    } else {\n      super._handleKeypressInner(event);\n    }\n  }\n\n  protected _handleMouseoverInner(event: MouseEvent) {\n    const item = this._getDropdownItemFromEvent(event);\n    const isFiltering =\n      this.filterable && Boolean(this._filterInputNode?.value.length);\n\n    if (\n      !item ||\n      isFiltering ||\n      !item.hasAttribute('selected') ||\n      !item.hasAttribute('highlighted')\n    ) {\n      return;\n    }\n\n    super._handleMouseoverInner(event);\n  }\n\n  protected _handleMouseleaveInner(event: MouseEvent) {\n    const constructor = this.constructor as typeof CDSMultiSelect;\n    const isFiltering =\n      this.filterable && Boolean(this._filterInputNode?.value.length);\n    const highlightedItem = this.querySelector(\n      constructor.selectorItemHighlighted\n    ) as CDSMultiSelectItem | null;\n\n    if (isFiltering || highlightedItem?.hasAttribute('selected')) {\n      return;\n    }\n\n    super._handleMouseleaveInner(event);\n  }\n\n  /**\n   * Special andler for the `keypress` event, ensures space selection for filterable\n   * variation is disabled\n   */\n\n  protected _handleKeypressInnerFlterable(event: KeyboardEvent) {\n    const { key } = event;\n    const action = (this.constructor as typeof CDSDropdown).getAction(key);\n    if (!this.open) {\n      switch (action) {\n        case DROPDOWN_KEYBOARD_ACTION.TRIGGERING:\n          this._handleUserInitiatedToggle(true);\n          break;\n        default:\n          break;\n      }\n    } else {\n      switch (key) {\n        case 'Enter':\n          {\n            const constructor = this.constructor as typeof CDSDropdown;\n            const highlightedItem = this.querySelector(\n              constructor.selectorItemHighlighted\n            ) as CDSMultiSelectItem;\n            if (highlightedItem) {\n              this._handleUserInitiatedSelectItem(highlightedItem);\n            } else {\n              this._handleUserInitiatedToggle(false);\n            }\n          }\n          break;\n        default:\n          break;\n      }\n    }\n  }\n\n  protected _renderTitleLabel() {\n    const {\n      clearSelectionDescription,\n      clearSelectionText,\n      disabled,\n      hideLabel,\n      titleText,\n      _selectedItemsCount: selectedItemsCount,\n      _slotTitleTextNode: slotTitleTextNode,\n      _handleSlotchangeLabelText: handleSlotchangeLabelText,\n    } = this;\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--label--disabled`]: disabled,\n      [`${prefix}--visually-hidden`]: hideLabel,\n    });\n\n    const hasTitleText =\n      titleText ||\n      (slotTitleTextNode && slotTitleTextNode.assignedNodes().length > 0);\n\n    return html`\n      <label\n        part=\"title-text\"\n        class=\"${labelClasses}\"\n        ?hidden=\"${!hasTitleText}\">\n        <slot name=\"title-text\" @slotchange=\"${handleSlotchangeLabelText}\"\n          >${titleText}</slot\n        >\n        ${selectedItemsCount > 0\n          ? html`\n              <span class=\"${prefix}--visually-hidden\">\n                ${clearSelectionDescription} ${selectedItemsCount},\n                ${clearSelectionText}\n              </span>\n            `\n          : null}\n      </label>\n    `;\n  }\n\n  protected _renderPrecedingLabel() {\n    const {\n      disabled,\n      readOnly,\n      clearSelectionLabel,\n      _selectedItemsCount: selectedItemsCount,\n    } = this;\n\n    const selectionButtonClasses = classMap({\n      [`${prefix}--list-box__selection`]: true,\n      [`${prefix}--list-box__selection--multi`]: true,\n      [`${prefix}--tag`]: true,\n      [`${prefix}--tag--filter`]: true,\n      [`${prefix}--tag--high-contrast`]: true,\n      [`${prefix}--tag--disabled`]: disabled,\n    });\n    return selectedItemsCount === 0\n      ? undefined\n      : html`\n          <div\n            id=\"selection-button\"\n            role=\"button\"\n            class=\"${selectionButtonClasses}\"\n            tabindex=\"-1\"\n            aria-disabled=${readOnly}\n            title=\"${clearSelectionLabel}\">\n            ${selectedItemsCount}\n            ${iconLoader(Close16, {\n              'aria-label': clearSelectionLabel,\n              class: `${prefix}--tag__close-icon`,\n            })}\n          </div>\n        `;\n  }\n\n  /**\n    @returns The main content of the trigger button.\n   */\n  protected _renderLabel(): TemplateResult {\n    const {\n      label,\n      value,\n      autocomplete,\n      _selectedItemContent: selectedItemContent,\n    } = this;\n\n    const inputClasses = classMap({\n      [`${prefix}--text-input`]: true,\n      [`${prefix}--text-input--empty`]: !value,\n    });\n\n    return !this.filterable\n      ? html`\n          <span id=\"trigger-label\" class=\"${prefix}--list-box__label\"\n            >${selectedItemContent || label}</span\n          >\n        `\n      : html`\n          <input\n            id=\"trigger-label\"\n            class=\"${inputClasses}\"\n            placeholder=\"${label}\"\n            role=\"combobox\"\n            aria-controls=\"menu-body\"\n            aria-expanded=\"${String(this.open)}\"\n            aria-autocomplete=\"list\"\n            autocomplete=\"${autocomplete}\"\n            @input=\"${this._handleInput}\" />\n        `;\n  }\n\n  protected _renderFollowingLabel(): TemplateResult | undefined {\n    const { clearSelectionLabel, _filterInputNode: filterInputNode } = this;\n    return filterInputNode &&\n      filterInputNode.value.length > 0 &&\n      this.filterable\n      ? html`\n          <div\n            id=\"clear-button\"\n            role=\"button\"\n            class=\"${prefix}--list-box__selection\"\n            tabindex=\"-1\"\n            title=\"${clearSelectionLabel}\">\n            ${iconLoader(Close16, { 'aria-label': clearSelectionLabel })}\n          </div>\n        `\n      : undefined;\n  }\n\n  /**\n   * Handles `input` event on the `<input>` for filtering.\n   */\n  protected _handleInput() {\n    const items = this.querySelectorAll(\n      (this.constructor as typeof CDSMultiSelect).selectorItem\n    );\n    const inputValue = this._filterInputNode.value.toLocaleLowerCase();\n    this.toggleAttribute('has-value', inputValue.length > 0);\n\n    if (!this.open && inputValue.length > 0) {\n      this.open = true;\n    }\n\n    forEach(items, (item) => {\n      // always show the selectAll item\n      if ((item as CDSMultiSelectItem).isSelectAll) {\n        item.removeAttribute('filtered');\n        return;\n      }\n      const itemValue = (item as HTMLElement).innerText.toLocaleLowerCase();\n\n      if (!itemValue.includes(inputValue)) {\n        (item as CDSMultiSelectItem).setAttribute('filtered', '');\n        (item as CDSMultiSelectItem).removeAttribute('highlighted');\n      } else {\n        (item as CDSMultiSelectItem).removeAttribute('filtered');\n      }\n    });\n\n    this.requestUpdate();\n\n    if (this.selectAll) {\n      const selectAllItem = this.querySelector(\n        `${prefix}-multi-select-item[is-select-all]`\n      ) as CDSMultiSelectItem;\n      if (selectAllItem) {\n        const visible = Array.from(\n          this.querySelectorAll(\n            (this.constructor as typeof CDSMultiSelect).selectorItemResults\n          )\n        ) as CDSMultiSelectItem[];\n        const actionable = visible.filter((i) => !i.isSelectAll && !i.disabled);\n        if (actionable.length === 0) {\n          selectAllItem.setAttribute('filtered', '');\n        } else {\n          selectAllItem.removeAttribute('filtered');\n          this._computeSelectAllState();\n        }\n      }\n    }\n\n    const constructor = this.constructor as typeof CDSMultiSelect;\n    const visibleItems = Array.from(\n      this.querySelectorAll(constructor.selectorItemResults)\n    ) as CDSMultiSelectItem[];\n\n    if (visibleItems.length > 0) {\n      visibleItems.forEach((i) => i.removeAttribute('highlighted'));\n      this.toggleAttribute('item-clicked', inputValue.length > 0);\n      const first = visibleItems[0] as HTMLElement;\n      first.setAttribute('highlighted', '');\n      first.focus();\n    } else {\n      this._filterInputNode.focus();\n    }\n  }\n\n  /**\n   * Navigate through dropdown items.\n   *\n   * @param direction `-1` to navigate backward, `1` to navigate forward.\n   */\n  protected _navigate(direction: number) {\n    super._navigate(direction);\n    if (this.filterable) {\n      this.setAttribute('item-clicked', '');\n    } else {\n      this._triggerNode.classList.add('no-focus-style');\n    }\n  }\n\n  /**\n   * Handles user-initiated clearing the `<input>` for filtering.\n   */\n  protected _handleUserInitiatedClearInput() {\n    const constructor = this.constructor as typeof CDSMultiSelect;\n    const items = this.querySelectorAll(constructor.selectorItemFiltered);\n    this._filterInputNode.value = '';\n    this._filterInputNode.focus();\n    forEach(items, (item) => {\n      (item as CDSMultiSelectItem).removeAttribute('filtered');\n    });\n    this._filterInputNode.dispatchEvent(\n      new Event('input', { bubbles: true, composed: true })\n    );\n  }\n\n  /**\n   * The `aria-label` attribute for the icon to clear selection.\n   */\n  @property({ attribute: 'clear-selection-label' })\n  clearSelectionLabel = '';\n\n  /**\n   * Specify the text that should be read for screen readers that describes total items selected\n   */\n  @property({ attribute: 'clear-selection-description' })\n  clearSelectionDescription = 'Total items selected: ';\n\n  /**\n   * Specify the text that should be read for screen readers to clear selection.\n   */\n  @property({ attribute: 'clear-selection-text' })\n  clearSelectionText = 'To clear selection, press Delete or Backspace.';\n\n  /**\n   * Specify the locale of the control. Used for the default compareItems used for sorting the list of items in the control.\n   */\n  @property()\n  locale = 'en';\n\n  /**\n   * Enables rendering of a “Select all” multi-select-item\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'select-all' })\n  selectAll = false;\n\n  /**\n   * Specify feedback (mode) of the selection.\n   * `top`: selected item jumps to top\n   * `fixed`: selected item stays at it's position\n   * `top-after-reopen`: selected item jump to top after reopen dropdown\n   */\n  @property({ attribute: 'selection-feedback' })\n  selectionFeedback = SELECTION_FEEDBACK_OPTION.TOP_AFTER_REOPEN;\n\n  /**\n   * The CSS class list for multi-select listbox\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n  protected get _classes(): any {\n    const {\n      disabled,\n      size,\n      type,\n      invalid,\n      readOnly,\n      open,\n      warn,\n      _selectedItemsCount: selectedItemsCount,\n    } = this;\n    const inline = type === DROPDOWN_TYPE.INLINE;\n\n    const isInteractive = !readOnly && !disabled;\n\n    const normalizedProps: {\n      invalid: boolean;\n      warn: boolean;\n    } = {\n      invalid: isInteractive && invalid,\n      warn: isInteractive && !invalid && warn,\n    };\n\n    return classMap({\n      [`${prefix}--multi-select`]: true,\n      [`${prefix}--list-box`]: true,\n      [`${prefix}--list-box--disabled`]: disabled,\n      [`${prefix}--list-box--inline`]: inline,\n      [`${prefix}--list-box--expanded`]: open,\n      [`${prefix}--list-box--${size}`]: size,\n      [`${prefix}--multi-select--invalid`]: normalizedProps.invalid,\n      [`${prefix}--multi-select--warn`]: normalizedProps.warn,\n      [`${prefix}--multi-select--inline`]: inline,\n      [`${prefix}--multi-select--readonly`]: readOnly,\n      [`${prefix}--multi-select--selected`]: selectedItemsCount > 0,\n      [`${prefix}--list-box__wrapper--decorator`]: this._hasAILabel, // inherited from CDSDropdown\n      [`${prefix}--multi-select--selectall`]: this.selectAll,\n    });\n  }\n\n  protected defaultCompareItems = (\n    itemA: string,\n    itemB: string,\n    { locale }: { locale: string }\n  ) => {\n    return itemA.localeCompare(itemB, locale, { numeric: true });\n  };\n\n  /**\n   * Provide a custom function that is used to determine the ordering of\n   * options. The compare function should return a number whose sign indicates\n   * the relative order of the two elements: negative if a is less than b,\n   * positive if a is greater than b, and zero if they are equal. See 'sortItems'\n   * for more control.\n   *\n   * (itemA: string, itemB: string, { locale }: { locale: string }) => number\n   */\n  @property({ attribute: false })\n  compareItems: (\n    itemA: string,\n    itemB: string,\n    options: { locale: string }\n  ) => number = this.defaultCompareItems;\n\n  private getItemValue = (item: Node) =>\n    item instanceof Element ? (item.getAttribute('value') ?? '') : '';\n\n  protected defaultSortItems = (\n    menuItems: NodeList,\n    { values, compareItems, locale = 'en' }\n  ): Node[] => {\n    const menuItemsArray = Array.from(menuItems);\n\n    const sortedArray = menuItemsArray.sort((itemA, itemB) => {\n      const hasItemA = values.includes(this.getItemValue(itemA));\n      const hasItemB = values.includes(this.getItemValue(itemB));\n\n      // Prefer whichever item is in the `value` array first\n      if (hasItemA && !hasItemB) {\n        return -1;\n      }\n\n      if (hasItemB && !hasItemA) {\n        return 1;\n      }\n\n      return compareItems(\n        itemA.textContent?.trim() ?? '',\n        itemB.textContent?.trim() ?? '',\n        {\n          locale,\n        }\n      );\n    });\n\n    return sortedArray;\n  };\n\n  /**\n   * Provide a method that sorts all options in the control. Overriding this\n   * prop means that you also have to handle the sort logic for selected versus\n   * un-selected items. If you just want to control ordering, consider the\n   * `compareItems` prop instead.\n   *\n   * sortItems :\n   * (menuItems: NodeList, {\n   *   values: string[],\n   *   compareItems: (itemA: string, itemB: string, { locale }: { locale: string }) => number,\n   *   locale: string,\n   * }) => Node[]\n   *\n   */\n  @property({ attribute: false })\n  sortItems: (\n    menuItems: NodeList,\n    options: {\n      values: string[];\n      compareItems: (\n        itemA: string,\n        itemB: string,\n        options: { locale: string }\n      ) => number;\n      locale: string;\n    }\n  ) => Node[] = this.defaultSortItems;\n\n  shouldUpdate(changedProperties) {\n    const { selectorItem, aiLabelItem, slugItem } = this\n      .constructor as typeof CDSMultiSelect;\n    const aiLabel =\n      this.querySelector(aiLabelItem) || this.querySelector(slugItem);\n    const items = this.querySelectorAll(selectorItem);\n\n    const { value, locale } = this;\n    const values = !value ? [] : value.split(',');\n\n    if (changedProperties.has('size')) {\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        (elem as CDSMultiSelectItem).size = this.size;\n      });\n    }\n    if (changedProperties.has('value')) {\n      // Updates selection beforehand because our rendering logic for `<cds-multi-select>` looks for selected items via `qSA()`\n      forEach(items, (elem) => {\n        (elem as CDSMultiSelectItem).selected =\n          values.indexOf((elem as CDSMultiSelectItem).value) >= 0;\n      });\n      this._selectedItemsCount = filter(\n        items,\n        (elem) =>\n          values.indexOf((elem as CDSMultiSelectItem).value) >= 0 &&\n          !(elem as CDSMultiSelectItem).isSelectAll\n      ).length;\n    }\n\n    const shouldSortItems =\n      changedProperties.has('value') ||\n      changedProperties.has('compareItems') ||\n      changedProperties.has('sortItems') ||\n      changedProperties.has('locale');\n\n    if (\n      shouldSortItems &&\n      this.selectionFeedback === SELECTION_FEEDBACK_OPTION.TOP\n    ) {\n      const sortedMenuItems = this.sortItems(items, {\n        values,\n        compareItems: this.compareItems,\n        locale,\n      });\n\n      if (aiLabel) {\n        sortedMenuItems.unshift(aiLabel);\n      }\n\n      this.replaceChildren(...sortedMenuItems);\n    }\n\n    const shouldSortItemsAfterReopen =\n      changedProperties.has('open') ||\n      changedProperties.has('compareItems') ||\n      changedProperties.has('sortItems') ||\n      changedProperties.has('locale');\n\n    if (\n      shouldSortItemsAfterReopen &&\n      this.selectionFeedback === SELECTION_FEEDBACK_OPTION.TOP_AFTER_REOPEN\n    ) {\n      const sortedMenuItems = this.sortItems(items, {\n        values,\n        compareItems: this.compareItems,\n        locale,\n      });\n\n      sortedMenuItems.forEach((item) => {\n        this.appendChild(item);\n      });\n    }\n    return true;\n  }\n\n  updated(changedProperties) {\n    super.updated(changedProperties);\n\n    if (changedProperties.has('open') && this.open) {\n      const selectedItems = Array.from(\n        this.querySelectorAll(`${prefix}-multi-select-item[selected]`)\n      ) as CDSMultiSelectItem[];\n\n      if (selectedItems.length > 0) {\n        let itemToFocus: HTMLElement | null = null;\n        if (this.selectAll) {\n          itemToFocus = this.querySelector(\n            `${prefix}-multi-select-item[is-select-all]`\n          ) as CDSMultiSelectItem;\n        }\n        if (!itemToFocus) {\n          itemToFocus = selectedItems[0] as HTMLElement;\n        }\n        this.setAttribute('item-clicked', '');\n        itemToFocus.focus();\n        itemToFocus.setAttribute('highlighted', '');\n      } else {\n        if (this.filterable) {\n          this._filterInputNode.focus();\n        } else {\n          this._triggerNode.focus();\n        }\n      }\n    }\n    // reorder items so that select all is always at the top of the list\n    if (this.selectAll && changedProperties.has('open') && this.open) {\n      const items = Array.from(\n        this.querySelectorAll('cds-multi-select-item')\n      ) as CDSMultiSelectItem[];\n\n      const selectAllItem = items.find((i) => i.isSelectAll);\n      if (selectAllItem) {\n        this.appendChild(selectAllItem);\n        items\n          .filter((i) => i !== selectAllItem)\n          .forEach((i) => this.appendChild(i));\n      }\n    }\n\n    // flush the top of the first element\n    Array.from(this.querySelectorAll('cds-multi-select-item')).forEach(\n      (item, index) => {\n        if (index === 0 && !item.hasAttribute('is-select-all')) {\n          item.setAttribute('flush-top', '');\n        } else if (index === 1 && this.selectAll) {\n          item.setAttribute('flush-top', '');\n        } else {\n          item.removeAttribute('flush-top');\n        }\n      }\n    );\n\n    if (changedProperties.has('open') && !this.open) {\n      this._triggerNode.classList.remove('no-focus-style');\n      this.removeAttribute('item-clicked');\n    }\n  }\n\n  firstUpdated(changedProperties) {\n    super.firstUpdated?.(changedProperties);\n\n    // whenever more items are added/removed, recompute the state of the select all option\n    if (!this.selectAll) return;\n    const defaultSlot =\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      this.shadowRoot!.querySelector<HTMLSlotElement>('slot:not([name])')!;\n    defaultSlot.addEventListener('slotchange', () =>\n      this._computeSelectAllState()\n    );\n  }\n\n  /**\n   * Computes the state of the select all option and sets it to either\n   * 'selected' or 'indeterminate'\n   */\n  private _computeSelectAllState() {\n    if (!this.selectAll) return;\n\n    const allItems = Array.from(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      )\n    ) as CDSMultiSelectItem[];\n    const selectAllItem = allItems.find((i) => i.isSelectAll);\n    if (!selectAllItem || selectAllItem.hasAttribute('filtered')) {\n      return;\n    }\n\n    const enabledItems = allItems\n      .filter((i) => !i.isSelectAll && !i.disabled)\n      .filter((i) => !this.filterable || !i.hasAttribute('filtered'));\n    const selectedCount = enabledItems.filter((i) => i.selected).length;\n    const allSelected = selectedCount === enabledItems.length;\n\n    selectAllItem.selected = allSelected;\n    selectAllItem.indeterminate = selectedCount > 0 && !allSelected;\n  }\n\n  /**\n   * Clears the filterable input field\n   */\n  private _clearInput() {\n    this._filterInputNode.value = '';\n    this.toggleAttribute('has-value', false);\n\n    const items = this.querySelectorAll(\n      (this.constructor as typeof CDSMultiSelect).selectorItemFiltered\n    );\n    forEach(items, (item) => {\n      (item as CDSMultiSelectItem).removeAttribute('filtered');\n    });\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    /**\n     * Detect if multi-select already has initially selected items\n     */\n    this.value = filter(\n      this.querySelectorAll(\n        (this.constructor as typeof CDSMultiSelect).selectorItem\n      ),\n      (item) => (item as CDSMultiSelectItem).hasAttribute('selected')\n    )\n      .map((item) => (item as CDSMultiSelectItem).getAttribute('value'))\n      .join(',');\n  }\n\n  /**\n   * A selector that will return menu body.\n   */\n  static get selectorMenuBody() {\n    return `div[part=\"menu-body\"]`;\n  }\n\n  /**\n   * A selector that will return highlighted items.\n   */\n  static get selectorItemHighlighted() {\n    return `${prefix}-multi-select-item[highlighted]`;\n  }\n\n  /**\n   * A selector that will return multi select items.\n   * We use a separate property from `.itemTagName` due to the nature in difference of tag name vs. selector.\n   */\n  static get selectorItem() {\n    return `${prefix}-multi-select-item`;\n  }\n\n  /**\n   * A selector that will return remaining items after a filter.\n   */\n  static get selectorItemFiltered() {\n    return `${prefix}-multi-select-item[filtered]`;\n  }\n\n  /**\n   * A selector that will return remaining items after a filter.\n   */\n  static get selectorItemResults() {\n    return `${prefix}-multi-select-item:not([filtered])`;\n  }\n\n  /**\n   * A selector that will return selected items.\n   */\n  static get selectorItemSelected() {\n    return `${prefix}-multi-select-item[selected]`;\n  }\n\n  /**\n   * The name of the custom event fired before this multi select item is being toggled upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of toggling this multi select item.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-multi-select-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after this multi select item is toggled upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-multi-select-toggled`;\n  }\n\n  /**\n   * The name of the custom event fired before a multi select item is selected upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated selection.\n   */\n  static get eventBeforeSelect() {\n    return `${prefix}-multi-select-beingselected`;\n  }\n\n  /**\n   * The name of the custom event fired after a a multi select item is selected upon a user gesture.\n   */\n  static get eventSelect() {\n    return `${prefix}-multi-select-selected`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSMultiSelect;\n"],"mappings":"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"}