@carbon/web-components 2.0.0-beta.3 → 2.0.0-beta.4

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

@@ -5,7 +5,9 @@ let _ = t => t,
   _t,
   _t2,
   _t3,
-  _t4;
+  _t4,
+  _t5,
+  _t6;
 /**
  * @license
  *
@@ -17,12 +19,15 @@ let _ = t => t,
 
 import { html } from 'lit';
 import { property, customElement, query } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
 import Close16 from "../../icons/close/16";
 import { prefix } from '../../globals/settings';
 import { filter, forEach, indexOf } from '../../globals/internal/collection-helpers';
-import CDSDropdown, { DROPDOWN_KEYBOARD_ACTION } from '../dropdown/dropdown';
+import CDSDropdown, { DROPDOWN_KEYBOARD_ACTION, DROPDOWN_TYPE } from '../dropdown/dropdown';
+import { SELECTION_FEEDBACK_OPTION } from './defs';
 import styles from "././multi-select.css.js";
-export { DROPDOWN_SIZE, DROPDOWN_TYPE } from '../dropdown/dropdown';
+export { DROPDOWN_SIZE, DROPDOWN_TYPE, DROPDOWN_DIRECTION } from '../dropdown/dropdown';
+export { SELECTION_FEEDBACK_OPTION };
 
 /**
  * Multi select.
@@ -70,6 +75,11 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
       decorators: [query('#selection-button')],
       key: "_selectionButtonNode",
       value: void 0
+    }, {
+      kind: "field",
+      decorators: [query('#menu-body')],
+      key: "_menuBodyNode",
+      value: void 0
     }, {
       kind: "field",
       decorators: [query('input')],
@@ -96,6 +106,10 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
        * The selection button.
        */
 
+      /**
+       * The menu body.
+       */
+
       /**
        * The `<input>` for filtering.
        */
@@ -130,7 +144,7 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
       key: "_handleClickInner",
       value: function _handleClickInner(event) {
         var _this$_selectionButto, _this$_clearButtonNod;
-        if ((_this$_selectionButto = this._selectionButtonNode) !== null && _this$_selectionButto !== void 0 && _this$_selectionButto.contains(event.target)) {
+        if ((_this$_selectionButto = this._selectionButtonNode) !== null && _this$_selectionButto !== void 0 && _this$_selectionButto.contains(event.target) && !this.readOnly) {
           this._handleUserInitiatedSelectItem();
           if (this.filterable) {
             this._filterInputNode.focus();
@@ -140,10 +154,7 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
         } else if ((_this$_clearButtonNod = this._clearButtonNode) !== null && _this$_clearButtonNod !== void 0 && _this$_clearButtonNod.contains(event.target)) {
           this._handleUserInitiatedClearInput();
         } else {
-          const shouldIgnoreClickInner = elem => elem.closest && elem.closest(this.constructor.selectorIgnoreClickInner);
-          if (!event.composedPath().some(shouldIgnoreClickInner)) {
-            _get(_getPrototypeOf(CDSMultiSelect.prototype), "_handleClickInner", this).call(this, event);
-          }
+          _get(_getPrototypeOf(CDSMultiSelect.prototype), "_handleClickInner", this).call(this, event);
           if (this.filterable) this._filterInputNode.focus();
         }
       }
@@ -222,24 +233,73 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
       }
     }, {
       kind: "method",
-      key: "_renderPrecedingTriggerContent",
-      value: function _renderPrecedingTriggerContent() {
+      key: "_renderTitleLabel",
+      value: function _renderTitleLabel() {
         const {
+          clearSelectionDescription,
+          clearSelectionText,
+          disabled,
+          hideLabel,
+          titleText,
+          _selectedItemsCount: selectedItemsCount,
+          _slotTitleTextNode: slotTitleTextNode,
+          _handleSlotchangeLabelText: handleSlotchangeLabelText
+        } = this;
+        const labelClasses = classMap({
+          [`${prefix}--label`]: true,
+          [`${prefix}--label--disabled`]: disabled,
+          [`${prefix}--visually-hidden`]: hideLabel
+        });
+        const hasTitleText = titleText || slotTitleTextNode && slotTitleTextNode.assignedNodes().length > 0;
+        return html(_t || (_t = _`
+      <label
+        part="title-text"
+        class="${0}"
+        ?hidden="${0}">
+        <slot name="title-text" @slotchange="${0}"
+          >${0}</slot
+        >
+        ${0}
+      </label>
+    `), labelClasses, !hasTitleText, handleSlotchangeLabelText, titleText, selectedItemsCount > 0 ? html(_t2 || (_t2 = _`
+              <span class="${0}--visually-hidden">
+                ${0} ${0},
+                ${0}
+              </span>
+            `), prefix, clearSelectionDescription, selectedItemsCount, clearSelectionText) : null);
+      }
+    }, {
+      kind: "method",
+      key: "_renderPrecedingLabel",
+      value: function _renderPrecedingLabel() {
+        const {
+          disabled,
+          readOnly,
           clearSelectionLabel,
           _selectedItemsCount: selectedItemsCount
         } = this;
-        return selectedItemsCount === 0 ? undefined : html(_t || (_t = _`
+        const selectionButtonClasses = classMap({
+          [`${prefix}--list-box__selection`]: true,
+          [`${prefix}--list-box__selection--multi`]: true,
+          [`${prefix}--tag`]: true,
+          [`${prefix}--tag--filter`]: true,
+          [`${prefix}--tag--high-contrast`]: true,
+          [`${prefix}--tag--disabled`]: disabled
+        });
+        return selectedItemsCount === 0 ? undefined : html(_t3 || (_t3 = _`
           <div
             id="selection-button"
             role="button"
-            class="${0}--list-box__selection ${0}--list-box__selection--multi ${0}--tag--filter"
-            tabindex="0"
+            class="${0}"
+            tabindex="-1"
+            aria-disabled=${0}
             title="${0}">
             ${0}
             ${0}
           </div>
-        `), prefix, prefix, prefix, clearSelectionLabel, selectedItemsCount, Close16({
-          'aria-label': clearSelectionLabel
+        `), selectionButtonClasses, readOnly, clearSelectionLabel, selectedItemsCount, Close16({
+          'aria-label': clearSelectionLabel,
+          class: `${prefix}--tag__close-icon`
         }));
       }
 
@@ -254,11 +314,11 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
           label,
           _selectedItemContent: selectedItemContent
         } = this;
-        return !this.filterable ? html(_t2 || (_t2 = _`
+        return !this.filterable ? html(_t4 || (_t4 = _`
           <span id="trigger-label" class="${0}--list-box__label"
             >${0}</span
           >
-        `), prefix, selectedItemContent || label) : html(_t3 || (_t3 = _`
+        `), prefix, selectedItemContent || label) : html(_t5 || (_t5 = _`
           <input
             id="trigger-label"
             class="${0}--text-input"
@@ -277,7 +337,7 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
           clearSelectionLabel,
           _filterInputNode: filterInputNode
         } = this;
-        return filterInputNode && filterInputNode.value.length > 0 && this.filterable ? html(_t4 || (_t4 = _`
+        return filterInputNode && filterInputNode.value.length > 0 && this.filterable ? html(_t6 || (_t6 = _`
           <div
             id="clear-button"
             role="button"
@@ -323,7 +383,6 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
       key: "_navigate",
       value: function _navigate(direction) {
         if (!this.filterable) {
-          this._triggerNode.focus();
           _get(_getPrototypeOf(CDSMultiSelect.prototype), "_navigate", this).call(this, direction);
         } else {
           // only navigate through remaining item
@@ -373,6 +432,31 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
       value() {
         return '';
       }
+    }, {
+      kind: "field",
+      decorators: [property({
+        attribute: 'clear-selection-description'
+      })],
+      key: "clearSelectionDescription",
+      value() {
+        return 'Total items selected: ';
+      }
+    }, {
+      kind: "field",
+      decorators: [property({
+        attribute: 'clear-selection-text'
+      })],
+      key: "clearSelectionText",
+      value() {
+        return 'To clear selection, press Delete or Backspace.';
+      }
+    }, {
+      kind: "field",
+      decorators: [property()],
+      key: "locale",
+      value() {
+        return 'en';
+      }
     }, {
       kind: "field",
       decorators: [property({
@@ -392,49 +476,183 @@ let CDSMultiSelect = _decorate([customElement(`${prefix}-multi-select`)], functi
         return 'Unselected all items.';
       }
     }, {
-      kind: "method",
-      key: "shouldUpdate",
+      kind: "field",
+      decorators: [property({
+        attribute: 'selection-feedback'
+      })],
+      key: "selectionFeedback",
+      value() {
+        return SELECTION_FEEDBACK_OPTION.TOP_AFTER_REOPEN;
+      }
+    }, {
+      kind: "get",
+      key: "_classes",
       value:
+      /**
+       * Specify the text that should be read for screen readers that describes total items selected
+       */
+      /**
+       * Specify the text that should be read for screen readers to clear selection.
+       */
+      /**
+       * Specify the locale of the control. Used for the default compareItems used for sorting the list of items in the control.
+       */
       /**
        * An assistive text for screen reader to announce, telling that an item is unselected.
        */
       /**
        * An assistive text for screen reader to announce, telling that all items are unselected.
        */
-      function shouldUpdate(changedProperties) {
+      /**
+       * Specify feedback (mode) of the selection.
+       * `top`: selected item jumps to top
+       * `fixed`: selected item stays at it's position
+       * `top-after-reopen`: selected item jump to top after reopen dropdown
+       */
+      /**
+       * The CSS class list for multi-select listbox
+       */
+      function _classes() {
+        const {
+          disabled,
+          size,
+          type,
+          invalid,
+          readOnly,
+          open,
+          warn,
+          _selectedItemsCount: selectedItemsCount
+        } = this;
+        const inline = type === DROPDOWN_TYPE.INLINE;
+        return classMap({
+          [`${prefix}--multi-select`]: true,
+          [`${prefix}--list-box`]: true,
+          [`${prefix}--list-box--disabled`]: disabled,
+          [`${prefix}--list-box--inline`]: inline,
+          [`${prefix}--list-box--expanded`]: open,
+          [`${prefix}--list-box--${size}`]: size,
+          [`${prefix}--multi-select--invalid`]: invalid,
+          [`${prefix}--multi-select--warn`]: warn,
+          [`${prefix}--multi-select--inline`]: inline,
+          [`${prefix}--list-box--inline`]: inline,
+          [`${prefix}--multi-select--readonly`]: readOnly,
+          [`${prefix}--multi-select--selected`]: selectedItemsCount > 0
+        });
+      }
+    }, {
+      kind: "field",
+      key: "compareItems",
+      value() {
+        return (itemA, itemB, {
+          locale
+        }) => {
+          itemA.localeCompare(itemB, locale, {
+            numeric: true
+          });
+        };
+      }
+    }, {
+      kind: "field",
+      key: "sortItems",
+      value() {
+        return (menuItems, {
+          values,
+          compareItems,
+          locale: _locale = 'en'
+        }) => {
+          const menuItemsArray = Array.from(menuItems);
+          const sortedArray = menuItemsArray.sort((itemA, itemB) => {
+            const hasItemA = values.includes(itemA.value);
+            const hasItemB = values.includes(itemB.value);
+
+            // Prefer whichever item is in the `value` array first
+            if (hasItemA && !hasItemB) {
+              return -1;
+            }
+            if (hasItemB && !hasItemA) {
+              return 1;
+            }
+            return compareItems(itemA.value, itemB.value, {
+              locale: _locale
+            });
+          });
+          return sortedArray;
+        };
+      }
+    }, {
+      kind: "method",
+      key: "shouldUpdate",
+      value: function shouldUpdate(changedProperties) {
         const {
           selectorItem
         } = this.constructor;
+        const items = this.querySelectorAll(selectorItem);
+        const {
+          value,
+          locale
+        } = this;
+        const values = !value ? [] : value.split(',');
         if (changedProperties.has('size')) {
           forEach(this.querySelectorAll(selectorItem), elem => {
             elem.size = this.size;
           });
         }
         if (changedProperties.has('value')) {
-          const {
-            value
-          } = this;
-          const values = !value ? [] : value.split(',');
           // Updates selection beforehand because our rendering logic for `<cds-multi-select>` looks for selected items via `qSA()`
-          const items = this.querySelectorAll(selectorItem);
           forEach(items, elem => {
             elem.selected = values.indexOf(elem.value) >= 0;
           });
           this._selectedItemsCount = filter(items, elem => values.indexOf(elem.value) >= 0).length;
+          if (this.selectionFeedback === SELECTION_FEEDBACK_OPTION.TOP) {
+            const sortedMenuItems = this.sortItems(items, {
+              values,
+              compareItems: this.compareItems,
+              locale
+            });
+            this.replaceChildren(...sortedMenuItems);
+          }
+        }
+        if (changedProperties.has('open')) {
+          if (this.selectionFeedback === SELECTION_FEEDBACK_OPTION.TOP_AFTER_REOPEN) {
+            const sortedMenuItems = this.sortItems(items, {
+              values,
+              compareItems: this.compareItems,
+              locale
+            });
+            this.replaceChildren(...sortedMenuItems);
+          }
         }
         return true;
       }
+    }, {
+      kind: "method",
+      key: "updated",
+      value: function updated(changedProperties) {
+        if (changedProperties.has('open') && this.open && !this.filterable) {
+          // move focus to menu body when open for non-filterable mulit-select
+          this._menuBodyNode.focus();
+        }
+      }
+    }, {
+      kind: "method",
+      key: "connectedCallback",
+      value: function connectedCallback() {
+        _get(_getPrototypeOf(CDSMultiSelect.prototype), "connectedCallback", this).call(this);
+        /**
+         * Detect if multi-select already has initially selected items
+         */
+        this.value = filter(this.querySelectorAll(this.constructor.selectorItem), item => item.selected).map(item => item.value).join(',');
+      }
 
       /**
-       * A selector to ignore the `click` events from.
-       * Primary for the checkbox label where the `click` event will happen from the associated check box.
+       * A selector that will return menu body.
        */
     }, {
       kind: "get",
       static: true,
-      key: "selectorIgnoreClickInner",
-      value: function selectorIgnoreClickInner() {
-        return `.${prefix}--checkbox-label`;
+      key: "selectorMenuBody",
+      value: function selectorMenuBody() {
+        return `div[part="menu-body"]`;
       }
 
       /**

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

@@ -1 +1 @@
-{"version":3,"file":"multi-select.js","names":["html","property","customElement","query","Close16","prefix","filter","forEach","indexOf","CDSDropdown","DROPDOWN_KEYBOARD_ACTION","styles","DROPDOWN_SIZE","DROPDOWN_TYPE","CDSMultiSelect","_decorate","_initialize","_CDSDropdown","constructor","args","F","d","kind","decorators","type","Boolean","key","value","_selectionShouldChange","itemToSelect","_selectionDidChange","selected","_assistiveStatusText","selectedItemAssistiveText","unselectedItemAssistiveText","querySelectorAll","selectorItemSelected","item","_handleUserInitiatedToggle","unselectedAllAssistiveText","selectorItem","map","join","_handleClickInner","event","_this$_selectionButto","_this$_clearButtonNod","_selectionButtonNode","contains","target","_handleUserInitiatedSelectItem","filterable","_filterInputNode","focus","_triggerNode","_clearButtonNode","_handleUserInitiatedClearInput","shouldIgnoreClickInner","elem","closest","selectorIgnoreClickInner","composedPath","some","_get","_getPrototypeOf","prototype","call","_handleKeypressInner","_this$_clearButtonNod2","_this$_selectionButto2","action","getAction","TRIGGERING","open","_handleKeypressInnerFlterable","highlightedItem","querySelector","selectorItemHighlighted","_renderPrecedingTriggerContent","clearSelectionLabel","_selectedItemsCount","selectedItemsCount","undefined","_t","_","_renderLabel","label","_selectedItemContent","selectedItemContent","_t2","_t3","_handleInput","_renderFollowingLabel","filterInputNode","length","_t4","items","inputValue","toLocaleLowerCase","itemValue","innerText","includes","setAttribute","removeAttribute","requestUpdate","_navigate","direction","selectorItemResults","highlightedIndex","nextIndex","i","highlighted","selectorItemFiltered","attribute","shouldUpdate","changedProperties","has","size","values","split","static","eventBeforeToggle","eventToggle","eventBeforeSelect","eventSelect"],"sources":["components/multi-select/multi-select.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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\nimport { html, TemplateResult } from 'lit';\nimport { property, customElement, query } from 'lit/decorators.js';\nimport Close16 from '@carbon/icons/lib/close/16';\nimport { prefix } from '../../globals/settings';\nimport {\n  filter,\n  forEach,\n  indexOf,\n} from '../../globals/internal/collection-helpers';\nimport CDSDropdown, { DROPDOWN_KEYBOARD_ACTION } from '../dropdown/dropdown';\nimport CDSMultiSelectItem from './multi-select-item';\nimport styles from './multi-select.scss';\n\nexport { DROPDOWN_SIZE, DROPDOWN_TYPE } from '../dropdown/dropdown';\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 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  /**\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    if (itemToSelect) {\n      itemToSelect.selected = !itemToSelect.selected;\n      this._assistiveStatusText = itemToSelect.selected\n        ? this.selectedItemAssistiveText\n        : this.unselectedItemAssistiveText;\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      this._assistiveStatusText = this.unselectedAllAssistiveText;\n    }\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  protected _handleClickInner(event: MouseEvent) {\n    if (this._selectionButtonNode?.contains(event.target as Node)) {\n      this._handleUserInitiatedSelectItem();\n      if (this.filterable) {\n        this._filterInputNode.focus();\n      } else {\n        this._triggerNode.focus();\n      }\n    } else if (this._clearButtonNode?.contains(event.target as Node)) {\n      this._handleUserInitiatedClearInput();\n    } else {\n      const shouldIgnoreClickInner = (elem) =>\n        elem.closest &&\n        elem.closest(\n          (this.constructor as typeof CDSMultiSelect).selectorIgnoreClickInner\n        );\n      if (!event.composedPath().some(shouldIgnoreClickInner)) {\n        super._handleClickInner(event);\n      }\n      if (this.filterable) this._filterInputNode.focus();\n    }\n  }\n\n  /**\n   * Handler for the `keypress` event, ensures filter still works upon entering space\n   */\n  protected _handleKeypressInner(event: KeyboardEvent) {\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  /**\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 _renderPrecedingTriggerContent() {\n    const { clearSelectionLabel, _selectedItemsCount: selectedItemsCount } =\n      this;\n    return selectedItemsCount === 0\n      ? undefined\n      : html`\n          <div\n            id=\"selection-button\"\n            role=\"button\"\n            class=\"${prefix}--list-box__selection ${prefix}--list-box__selection--multi ${prefix}--tag--filter\"\n            tabindex=\"0\"\n            title=\"${clearSelectionLabel}\">\n            ${selectedItemsCount}\n            ${Close16({ 'aria-label': clearSelectionLabel })}\n          </div>\n        `;\n  }\n\n  /**\n    @returns The main content of the trigger button.\n   */\n  protected _renderLabel(): TemplateResult {\n    const { label, _selectedItemContent: selectedItemContent } = this;\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=\"${prefix}--text-input\"\n            placeholder=\"${label}\"\n            role=\"combobox\"\n            aria-controls=\"menu-body\"\n            aria-autocomplete=\"list\"\n            @input=\"${this._handleInput}\" />\n        `;\n  }\n\n  protected _renderFollowingLabel(): TemplateResult | void {\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=\"0\"\n            title=\"${clearSelectionLabel}\">\n            ${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\n    if (!this.open) this.open = true;\n\n    forEach(items, (item) => {\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\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    if (!this.filterable) {\n      this._triggerNode.focus();\n      super._navigate(direction);\n    } else {\n      // only navigate through remaining item\n      const constructor = this.constructor as typeof CDSMultiSelect;\n      const items = this.querySelectorAll(constructor.selectorItemResults);\n      const highlightedItem = this.querySelector(\n        constructor.selectorItemHighlighted\n      );\n      const highlightedIndex = indexOf(items, highlightedItem!);\n\n      let nextIndex = highlightedIndex + direction;\n      if (nextIndex < 0) {\n        nextIndex = items.length - 1;\n      }\n      if (nextIndex >= items.length) {\n        nextIndex = 0;\n      }\n      forEach(items, (item, i) => {\n        (item as CDSMultiSelectItem).highlighted = i === nextIndex;\n      });\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.open = true;\n    this._filterInputNode.focus();\n    forEach(items, (item) => {\n      (item as CDSMultiSelectItem).removeAttribute('filtered');\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   * An assistive text for screen reader to announce, telling that an item is unselected.\n   */\n  @property({ attribute: 'unselected-item-assistive-text' })\n  unselectedItemAssistiveText = 'Unselected an item.';\n\n  /**\n   * An assistive text for screen reader to announce, telling that all items are unselected.\n   */\n  @property({ attribute: 'unselected-all-assistive-text' })\n  unselectedAllAssistiveText = 'Unselected all items.';\n\n  shouldUpdate(changedProperties) {\n    const { selectorItem } = this.constructor as typeof CDSMultiSelect;\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      const { value } = this;\n      const values = !value ? [] : value.split(',');\n      // Updates selection beforehand because our rendering logic for `<cds-multi-select>` looks for selected items via `qSA()`\n      const items = this.querySelectorAll(selectorItem);\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) => values.indexOf((elem as CDSMultiSelectItem).value) >= 0\n      ).length;\n    }\n    return true;\n  }\n\n  /**\n   * A selector to ignore the `click` events from.\n   * Primary for the checkbox label where the `click` event will happen from the associated check box.\n   */\n  private static get selectorIgnoreClickInner() {\n    return `.${prefix}--checkbox-label`;\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":["html","property","customElement","query","classMap","Close16","prefix","filter","forEach","indexOf","CDSDropdown","DROPDOWN_KEYBOARD_ACTION","DROPDOWN_TYPE","SELECTION_FEEDBACK_OPTION","styles","DROPDOWN_SIZE","DROPDOWN_DIRECTION","CDSMultiSelect","_decorate","_initialize","_CDSDropdown","constructor","args","F","d","kind","decorators","type","Boolean","key","value","_selectionShouldChange","itemToSelect","_selectionDidChange","selected","_assistiveStatusText","selectedItemAssistiveText","unselectedItemAssistiveText","querySelectorAll","selectorItemSelected","item","_handleUserInitiatedToggle","unselectedAllAssistiveText","selectorItem","map","join","_handleClickInner","event","_this$_selectionButto","_this$_clearButtonNod","_selectionButtonNode","contains","target","readOnly","_handleUserInitiatedSelectItem","filterable","_filterInputNode","focus","_triggerNode","_clearButtonNode","_handleUserInitiatedClearInput","_get","_getPrototypeOf","prototype","call","_handleKeypressInner","_this$_clearButtonNod2","_this$_selectionButto2","action","getAction","TRIGGERING","open","_handleKeypressInnerFlterable","highlightedItem","querySelector","selectorItemHighlighted","_renderTitleLabel","clearSelectionDescription","clearSelectionText","disabled","hideLabel","titleText","_selectedItemsCount","selectedItemsCount","_slotTitleTextNode","slotTitleTextNode","_handleSlotchangeLabelText","handleSlotchangeLabelText","labelClasses","hasTitleText","assignedNodes","length","_t","_","_t2","_renderPrecedingLabel","clearSelectionLabel","selectionButtonClasses","undefined","_t3","class","_renderLabel","label","_selectedItemContent","selectedItemContent","_t4","_t5","_handleInput","_renderFollowingLabel","filterInputNode","_t6","items","inputValue","toLocaleLowerCase","itemValue","innerText","includes","setAttribute","removeAttribute","requestUpdate","_navigate","direction","selectorItemResults","highlightedIndex","nextIndex","i","highlighted","selectorItemFiltered","attribute","TOP_AFTER_REOPEN","_classes","size","invalid","warn","inline","INLINE","itemA","itemB","locale","localeCompare","numeric","menuItems","values","compareItems","menuItemsArray","Array","from","sortedArray","sort","hasItemA","hasItemB","shouldUpdate","changedProperties","split","has","elem","selectionFeedback","TOP","sortedMenuItems","sortItems","replaceChildren","updated","_menuBodyNode","connectedCallback","static","selectorMenuBody","eventBeforeToggle","eventToggle","eventBeforeSelect","eventSelect"],"sources":["components/multi-select/multi-select.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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\nimport { html, TemplateResult } from 'lit';\nimport { property, customElement, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport Close16 from '@carbon/icons/lib/close/16';\nimport { prefix } from '../../globals/settings';\nimport {\n  filter,\n  forEach,\n  indexOf,\n} from '../../globals/internal/collection-helpers';\nimport CDSDropdown, {\n  DROPDOWN_KEYBOARD_ACTION,\n  DROPDOWN_TYPE,\n} from '../dropdown/dropdown';\nimport { SELECTION_FEEDBACK_OPTION } from './defs';\nimport CDSMultiSelectItem from './multi-select-item';\nimport styles from './multi-select.scss';\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 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 menu body.\n   */\n  @query('#menu-body')\n  private _menuBodyNode!: HTMLElement;\n\n  /**\n   * The `<input>` for filtering.\n   */\n  @query('input')\n  private _filterInputNode!: HTMLInputElement;\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    if (itemToSelect) {\n      itemToSelect.selected = !itemToSelect.selected;\n      this._assistiveStatusText = itemToSelect.selected\n        ? this.selectedItemAssistiveText\n        : this.unselectedItemAssistiveText;\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      this._assistiveStatusText = this.unselectedAllAssistiveText;\n    }\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  protected _handleClickInner(event: MouseEvent) {\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 (this._clearButtonNode?.contains(event.target as Node)) {\n      this._handleUserInitiatedClearInput();\n    } else {\n      super._handleClickInner(event);\n      if (this.filterable) this._filterInputNode.focus();\n    }\n  }\n\n  /**\n   * Handler for the `keypress` event, ensures filter still works upon entering space\n   */\n  protected _handleKeypressInner(event: KeyboardEvent) {\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  /**\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            ${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 { label, _selectedItemContent: selectedItemContent } = this;\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=\"${prefix}--text-input\"\n            placeholder=\"${label}\"\n            role=\"combobox\"\n            aria-controls=\"menu-body\"\n            aria-autocomplete=\"list\"\n            @input=\"${this._handleInput}\" />\n        `;\n  }\n\n  protected _renderFollowingLabel(): TemplateResult | void {\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=\"0\"\n            title=\"${clearSelectionLabel}\">\n            ${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\n    if (!this.open) this.open = true;\n\n    forEach(items, (item) => {\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\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    if (!this.filterable) {\n      super._navigate(direction);\n    } else {\n      // only navigate through remaining item\n      const constructor = this.constructor as typeof CDSMultiSelect;\n      const items = this.querySelectorAll(constructor.selectorItemResults);\n      const highlightedItem = this.querySelector(\n        constructor.selectorItemHighlighted\n      );\n      const highlightedIndex = indexOf(items, highlightedItem!);\n\n      let nextIndex = highlightedIndex + direction;\n      if (nextIndex < 0) {\n        nextIndex = items.length - 1;\n      }\n      if (nextIndex >= items.length) {\n        nextIndex = 0;\n      }\n      forEach(items, (item, i) => {\n        (item as CDSMultiSelectItem).highlighted = i === nextIndex;\n      });\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.open = true;\n    this._filterInputNode.focus();\n    forEach(items, (item) => {\n      (item as CDSMultiSelectItem).removeAttribute('filtered');\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   * An assistive text for screen reader to announce, telling that an item is unselected.\n   */\n  @property({ attribute: 'unselected-item-assistive-text' })\n  unselectedItemAssistiveText = 'Unselected an item.';\n\n  /**\n   * An assistive text for screen reader to announce, telling that all items are unselected.\n   */\n  @property({ attribute: 'unselected-all-assistive-text' })\n  unselectedAllAssistiveText = 'Unselected all items.';\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  protected get _classes() {\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    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`]: invalid,\n      [`${prefix}--multi-select--warn`]: warn,\n      [`${prefix}--multi-select--inline`]: inline,\n      [`${prefix}--list-box--inline`]: inline,\n      [`${prefix}--multi-select--readonly`]: readOnly,\n      [`${prefix}--multi-select--selected`]: selectedItemsCount > 0,\n    });\n  }\n\n  protected compareItems = (itemA, itemB, { locale }) => {\n    itemA.localeCompare(itemB, locale, { numeric: true });\n  };\n\n  protected sortItems = (\n    menuItems: NodeList,\n    { values, compareItems, locale = 'en' }\n  ) => {\n    const menuItemsArray = Array.from(menuItems);\n\n    const sortedArray = menuItemsArray.sort((itemA, itemB) => {\n      const hasItemA = values.includes((itemA as HTMLInputElement).value);\n      const hasItemB = values.includes((itemB as HTMLInputElement).value);\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 as HTMLInputElement).value,\n        (itemB as HTMLInputElement).value,\n        {\n          locale,\n        }\n      );\n    });\n\n    return sortedArray;\n  };\n\n  shouldUpdate(changedProperties) {\n    const { selectorItem } = this.constructor as typeof CDSMultiSelect;\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) => values.indexOf((elem as CDSMultiSelectItem).value) >= 0\n      ).length;\n\n      if (this.selectionFeedback === SELECTION_FEEDBACK_OPTION.TOP) {\n        const sortedMenuItems = this.sortItems(items, {\n          values,\n          compareItems: this.compareItems,\n          locale,\n        });\n\n        this.replaceChildren(...sortedMenuItems);\n      }\n    }\n    if (changedProperties.has('open')) {\n      if (\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        this.replaceChildren(...sortedMenuItems);\n      }\n    }\n    return true;\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('open') && this.open && !this.filterable) {\n      // move focus to menu body when open for non-filterable mulit-select\n      this._menuBodyNode.focus();\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).selected\n    )\n      .map((item) => (item as CDSMultiSelectItem).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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"}