npm - @vscode-elements/elements - Versions diffs - 1.16.1 → 1.16.2-pre.0 - Mend

@vscode-elements/elements 1.16.1 → 1.16.2-pre.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (47) hide show

package/dist/vscode-multi-select/vscode-multi-select.js CHANGED Viewed

@@ -6,6 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html, LitElement, nothing } from 'lit';
 import { property, query } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { customElement } from '../includes/VscElement.js';
 import { chevronDownIcon } from '../includes/vscode-select/template-elements.js';
 import { VscodeSelectBase } from '../includes/vscode-select/vscode-select-base.js';
@@ -47,37 +48,14 @@ import styles from './vscode-multi-select.styles.js';
  */
 let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
     set selectedIndexes(val) {
-        const newIndexes = [];
-        val.forEach((v) => {
-            if (typeof this._options[v] !== 'undefined') {
-                if (!newIndexes.includes(v)) {
-                    this._options[v].selected = true;
-                    newIndexes.push(v);
-                }
-            }
-        });
-        this._selectedIndexes = newIndexes;
+        this._opts.selectedIndexes = val;
     }
     get selectedIndexes() {
-        return this._selectedIndexes;
+        return this._opts.selectedIndexes;
     }
     set value(val) {
-        const sanitizedVal = Array.isArray(val)
-            ? val.map((v) => String(v))
-            : [String(val)];
-        this._values = [];
-        this._selectedIndexes.forEach((i) => {
-            this._options[i].selected = false;
-        });
-        this._selectedIndexes = [];
-        sanitizedVal.forEach((v) => {
-            if (typeof this._valueOptionIndexMap[v] === 'number') {
-                this._selectedIndexes.push(this._valueOptionIndexMap[v]);
-                this._options[this._valueOptionIndexMap[v]].selected = true;
-                this._values.push(v);
-            }
-        });
-        if (this._selectedIndexes.length > 0) {
+        this._opts.multiSelectValue = val;
+        if (this._opts.selectedIndexes.length > 0) {
             this._requestedValueToSetLater = [];
         }
         else {
@@ -87,7 +65,7 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         this._manageRequired();
     }
     get value() {
-        return this._values;
+        return this._opts.multiSelectValue;
     }
     get form() {
         return this._internals.form;
@@ -111,6 +89,12 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
     reportValidity() {
         return this._internals.reportValidity();
     }
+    selectAll() {
+        this._opts.selectAll();
+    }
+    selectNone() {
+        this._opts.selectNone();
+    }
     constructor() {
         super();
         this.defaultValue = [];
@@ -134,26 +118,12 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
                 return;
             }
             const index = Number(optEl.dataset.index);
-            if (this._options[index]) {
-                if (this._options[index].disabled) {
-                    return;
-                }
-                this._options[index].selected = !this._options[index].selected;
-            }
-            this._selectedIndexes = [];
-            this._values = [];
-            this._options.forEach((op) => {
-                if (op.selected) {
-                    this._selectedIndexes.push(op.index);
-                    this._values.push(op.value);
-                }
-            });
+            this._opts.toggleOptionSelected(index);
             this._setFormValue();
             this._manageRequired();
             this._dispatchChangeEvent();
         };
-        /** @internal */
-        this._multiple = true;
+        this._opts.multiSelect = true;
         this._internals = this.attachInternals();
     }
     connectedCallback() {
@@ -182,6 +152,24 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
             this.value = val;
         }
     }
+    _dispatchChangeEvent() {
+        /** @deprecated */
+        this.dispatchEvent(new CustomEvent('vsc-change', {
+            detail: {
+                selectedIndexes: this._opts.selectedIndexes,
+                value: this._opts.multiSelectValue,
+            },
+        }));
+        super._dispatchChangeEvent();
+    }
+    _onFaceClick() {
+        super._onFaceClick();
+        this._opts.activeIndex = 0;
+    }
+    _toggleComboboxDropdown() {
+        super._toggleComboboxDropdown();
+        this._opts.activeIndex = -1;
+    }
     _manageRequired() {
         const { value } = this;
         if (value.length === 0 && this.required) {
@@ -208,35 +196,47 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         this._dispatchChangeEvent();
         const opCreateEvent = new CustomEvent('vsc-multi-select-create-option', { detail: { value: this._options[nextIndex]?.value ?? '' } });
         this.dispatchEvent(opCreateEvent);
-        this._toggleDropdown(false);
+        this.open = false;
         this._isPlaceholderOptionActive = false;
     }
+    //#region event handlers
     _onSlotChange() {
         super._onSlotChange();
         if (this._requestedValueToSetLater.length > 0) {
-            this.options.forEach((o, i) => {
-                if (this._requestedValueToSetLater.includes(o.value)) {
-                    this._selectedIndexes.push(i);
-                    this._values.push(o.value);
-                    this._options[i].selected = true;
-                    this._requestedValueToSetLater =
-                        this._requestedValueToSetLater.filter((v) => v !== o.value);
-                }
-            });
+            this._opts.expandMultiSelection(this._requestedValueToSetLater);
+            this._requestedValueToSetLater = this._requestedValueToSetLater.filter((v) => this._opts.findOptionIndex(v) === -1);
+        }
+    }
+    _onEnterKeyDown(ev) {
+        super._onEnterKeyDown(ev);
+        if (!this.open) {
+            this._opts.filterPattern = '';
+            this.open = true;
+        }
+        else {
+            if (this._isPlaceholderOptionActive) {
+                this._createAndSelectSuggestedOption();
+            }
+            else {
+                this._opts.toggleActiveMultiselectOption();
+                this._setFormValue();
+                this._manageRequired();
+                this._dispatchChangeEvent();
+            }
         }
     }
     _onMultiAcceptClick() {
-        this._toggleDropdown(false);
+        this.open = false;
     }
     _onMultiDeselectAllClick() {
-        this._selectedIndexes = [];
+        this._opts.selectedIndexes = [];
         this._values = [];
         this._options = this._options.map((op) => ({ ...op, selected: false }));
         this._manageRequired();
         this._dispatchChangeEvent();
     }
     _onMultiSelectAllClick() {
-        this._selectedIndexes = [];
+        this._opts.selectedIndexes = [];
         this._values = [];
         this._options = this._options.map((op) => ({ ...op, selected: true }));
         this._options.forEach((op, index) => {
@@ -247,26 +247,77 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         this._setFormValue();
         this._manageRequired();
     }
+    //#endregion
+    //#region render functions
     _renderLabel() {
-        switch (this._selectedIndexes.length) {
+        switch (this._opts.selectedIndexes.length) {
             case 0:
-                return html `<span class="select-face-badge no-item"
-          >No items selected</span
-        >`;
-            case 1:
-                return html `<span class="select-face-badge">1 item selected</span>`;
+                return html `<span class="select-face-badge no-item">0 Selected</span>`;
             default:
                 return html `<span class="select-face-badge"
-          >${this._selectedIndexes.length} items selected</span
+          >${this._opts.selectedIndexes.length} Selected</span
         >`;
         }
     }
+    _renderComboboxFace() {
+        let inputVal = '';
+        if (this._isBeingFiltered) {
+            inputVal = this._opts.filterPattern;
+        }
+        else {
+            const op = this._opts.getSelectedOption();
+            inputVal = op?.label ?? '';
+        }
+        const activeDescendant = this._opts.activeIndex > -1 ? `op-${this._opts.activeIndex}` : '';
+        const expanded = this.open ? 'true' : 'false';
+        return html `
+      <div class="combobox-face face">
+        ${this._opts.multiSelect ? this._renderLabel() : nothing}
+        <input
+          aria-activedescendant=${activeDescendant}
+          aria-autocomplete="list"
+          aria-controls="select-listbox"
+          aria-expanded=${expanded}
+          aria-haspopup="listbox"
+          aria-label=${ifDefined(this.label)}
+          class="combobox-input"
+          role="combobox"
+          spellcheck="false"
+          type="text"
+          autocomplete="off"
+          .value=${inputVal}
+          @focus=${this._onComboboxInputFocus}
+          @blur=${this._onComboboxInputBlur}
+          @input=${this._onComboboxInputInput}
+          @click=${this._onComboboxInputClick}
+          @keydown=${this._onComboboxInputSpaceKeyDown}
+        >
+        <button
+          aria-label="Open the list of options"
+          class="combobox-button"
+          type="button"
+          @click=${this._onComboboxButtonClick}
+          @keydown=${this._onComboboxButtonKeyDown}
+          tabindex="-1"
+        >
+          ${chevronDownIcon}
+        </button>
+      </div>
+    `;
+    }
     _renderSelectFace() {
+        const activeDescendant = this._opts.activeIndex > -1 ? `op-${this._opts.activeIndex}` : '';
+        const expanded = this.open ? 'true' : 'false';
         return html `
       <div
+        aria-activedescendant=${ifDefined(this._opts.multiSelect ? undefined : activeDescendant)}
+        aria-controls="select-listbox"
+        aria-expanded=${ifDefined(this._opts.multiSelect ? undefined : expanded)}
+        aria-haspopup="listbox"
+        aria-label=${ifDefined(this.label ?? undefined)}
         class="select-face face multiselect"
         @click=${this._onFaceClick}
-        tabindex=${this.tabIndex > -1 ? 0 : -1}
+        .tabIndex=${this.disabled ? -1 : 0}
       >
         ${this._renderLabel()} ${chevronDownIcon}
       </div>
@@ -303,6 +354,15 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         `
             : html `${nothing}`;
     }
+    render() {
+        return html `
+      <div class="multi-select">
+        <slot class="main-slot" @slotchange=${this._onSlotChange}></slot>
+        ${this.combobox ? this._renderComboboxFace() : this._renderSelectFace()}
+        ${this._renderDropdown()}
+      </div>
+    `;
+    }
 };
 VscodeMultiSelect.styles = styles;
 /** @internal */

package/dist/vscode-multi-select/vscode-multi-select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-multi-select.js","sourceRoot":"","sources":["../../src/vscode-multi-select/vscode-multi-select.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, LitElement, nothing, TemplateResult} from 'lit';\nimport {property, query} from 'lit/decorators.js';\nimport {customElement} from '../includes/VscElement.js';\nimport {chevronDownIcon} from '../includes/vscode-select/template-elements.js';\nimport {VscodeSelectBase} from '../includes/vscode-select/vscode-select-base.js';\nimport styles from './vscode-multi-select.styles.js';\nimport {AssociatedFormControl} from '../includes/AssociatedFormControl.js';\n\nexport type VscMultiSelectCreateOptionEvent = CustomEvent<{value: string}>;\n\n/*\n Allows to select multiple items from a list of options.\n \n When participating in a form, it supports the `:invalid` pseudo class. Otherwise the error styles\n * can be applied through the `invalid` property.\n \n @tag vscode-multi-select\n \n @prop {boolean} invalid\n * @attr {boolean} invalid\n * @attr name - Name which is used as a variable name in the data of the form-container.\n \n @cssprop [--dropdown-z-index=2]\n * @cssprop [--vscode-badge-background=#616161]\n * @cssprop [--vscode-badge-foreground=#f8f8f8]\n * @cssprop [--vscode-settings-dropdownBorder=#3c3c3c]\n * @cssprop [--vscode-settings-checkboxBackground=#313131]\n * @cssprop [--vscode-settings-dropdownBackground=#313131]\n * @cssprop [--vscode-settings-dropdownForeground=#cccccc]\n * @cssprop [--vscode-settings-dropdownListBorder=#454545]\n * @cssprop [--vscode-focusBorder=#0078d4]\n * @cssprop [--vscode-foreground=#cccccc]\n * @cssprop [--vscode-font-family=sans-serif]\n * @cssprop [--vscode-font-size=13px]\n * @cssprop [--vscode-font-weight=normal]\n * @cssprop [--vscode-inputValidation-errorBackground=#5a1d1d]\n * @cssprop [--vscode-inputValidation-errorBorder=#be1100]\n * @cssprop [--vscode-list-activeSelectionBackground=#04395e]\n * @cssprop [--vscode-list-activeSelectionForeground=#ffffff]\n * @cssprop [--vscode-list-focusOutline=#0078d4]\n * @cssprop [--vscode-list-focusHighlightForeground=#2aaaff]\n * @cssprop [--vscode-list-highlightForeground=#2aaaff]\n * @cssprop [--vscode-list-hoverBackground=#2a2d2e]\n * @cssprop [--vscode-list-hoverForeground=#ffffff]\n /\n@customElement('vscode-multi-select')\nexport class VscodeMultiSelect\n extends VscodeSelectBase\n implements AssociatedFormControl\n{\n static override styles = styles;\n\n /* @internal /\n static override shadowRootOptions: ShadowRootInit = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n static formAssociated = true;\n\n @property({type: Array, attribute: 'default-value'})\n defaultValue: string[] = [];\n\n @property({type: Boolean, reflect: true})\n required = false;\n\n @property({reflect: true})\n name: string \| undefined = undefined;\n\n @property({type: Array, attribute: false})\n set selectedIndexes(val: number[]) {\n const newIndexes: number[] = [];\n\n val.forEach((v) => {\n if (typeof this._options[v] !== 'undefined') {\n if (!newIndexes.includes(v)) {\n this._options[v].selected = true;\n newIndexes.push(v);\n }\n }\n });\n\n this._selectedIndexes = newIndexes;\n }\n get selectedIndexes(): number[] {\n return this._selectedIndexes;\n }\n\n @property({type: Array})\n set value(val: string[] \| string) {\n const sanitizedVal = Array.isArray(val)\n ? val.map((v) => String(v))\n : [String(val)];\n this._values = [];\n\n this._selectedIndexes.forEach((i) => {\n this._options[i].selected = false;\n });\n\n this._selectedIndexes = [];\n\n sanitizedVal.forEach((v) => {\n if (typeof this._valueOptionIndexMap[v] === 'number') {\n this._selectedIndexes.push(this._valueOptionIndexMap[v]);\n this._options[this._valueOptionIndexMap[v]].selected = true;\n this._values.push(v);\n }\n });\n\n if (this._selectedIndexes.length > 0) {\n this._requestedValueToSetLater = [];\n } else {\n this._requestedValueToSetLater = Array.isArray(val) ? val : [val];\n }\n\n this._setFormValue();\n this._manageRequired();\n }\n get value(): string[] {\n return this._values;\n }\n\n get form() {\n return this._internals.form;\n }\n\n /* @internal /\n get type() {\n return 'select-multiple';\n }\n\n get validity(): ValidityState {\n return this._internals.validity;\n }\n\n get validationMessage(): string {\n return this._internals.validationMessage;\n }\n\n get willValidate() {\n return this._internals.willValidate;\n }\n\n checkValidity(): boolean {\n return this._internals.checkValidity();\n }\n\n reportValidity(): boolean {\n return this._internals.reportValidity();\n }\n\n private _internals: ElementInternals;\n\n constructor() {\n super();\n /* @internal /\n this._multiple = true;\n this._internals = this.attachInternals();\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n this.updateComplete.then(() => {\n this._setDefaultValue();\n this._manageRequired();\n });\n }\n\n /* @internal /\n formResetCallback(): void {\n this.updateComplete.then(() => {\n this.value = this.defaultValue;\n });\n }\n\n /* @internal */\n formStateRestoreCallback(\n state: FormData,\n _mode: 'restore' \| 'autocomplete'\n ): void {\n const entries = Array.from(state.entries()).map((e) => String(e[1]));\n\n this.updateComplete.then(() => {\n this.value = entries;\n });\n }\n\n @query('.face')\n private _faceElement!: HTMLDivElement;\n\n private _setDefaultValue() {\n if (Array.isArray(this.defaultValue) && this.defaultValue.length > 0) {\n const val = this.defaultValue.map((v) => String(v));\n this.value = val;\n }\n }\n\n protected override _manageRequired() {\n const {value} = this;\n if (value.length === 0 && this.required) {\n this._internals.setValidity(\n {\n valueMissing: true,\n },\n 'Please select an item in the list.',\n this._faceElement\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n private _setFormValue() {\n const fd = new FormData();\n\n this._values.forEach((v) => {\n fd.append(this.name ?? '', v);\n });\n\n this._internals.setFormValue(fd);\n }\n\n private _requestedValueToSetLater: string[] = [];\n\n protected override async _createAndSelectSuggestedOption() {\n super._createAndSelectSuggestedOption();\n const nextIndex = this._createSuggestedOption();\n\n await this.updateComplete;\n\n this.selectedIndexes = [...this.selectedIndexes, nextIndex];\n this._dispatchChangeEvent();\n const opCreateEvent: VscMultiSelectCreateOptionEvent = new CustomEvent(\n 'vsc-multi-select-create-option',\n {detail: {value: this._options[nextIndex]?.value ?? ''}}\n );\n this.dispatchEvent(opCreateEvent);\n this._toggleDropdown(false);\n this._isPlaceholderOptionActive = false;\n }\n\n protected override _onSlotChange(): void {\n super._onSlotChange();\n\n if (this._requestedValueToSetLater.length > 0) {\n this.options.forEach((o, i) => {\n if (this._requestedValueToSetLater.includes(o.value)) {\n this._selectedIndexes.push(i);\n this._values.push(o.value);\n this._options[i].selected = true;\n this._requestedValueToSetLater =\n this._requestedValueToSetLater.filter((v) => v !== o.value);\n }\n });\n }\n }\n\n protected override _onOptionClick = (ev: MouseEvent) => {\n const composedPath = ev.composedPath();\n const optEl = composedPath.find((et) => {\n if ('matches' in et) {\n return (et as HTMLElement).matches('li.option');\n }\n\n return false;\n });\n\n if (!optEl) {\n return;\n }\n\n const isPlaceholderOption = (optEl as HTMLElement).classList.contains(\n 'placeholder'\n );\n\n if (isPlaceholderOption) {\n this._createAndSelectSuggestedOption();\n return;\n }\n\n const index = Number((optEl as HTMLElement).dataset.index);\n\n if (this._options[index]) {\n if (this._options[index].disabled) {\n return;\n }\n\n this._options[index].selected = !this._options[index].selected;\n }\n\n this._selectedIndexes = [];\n this._values = [];\n\n this._options.forEach((op) => {\n if (op.selected) {\n this._selectedIndexes.push(op.index);\n this._values.push(op.value);\n }\n });\n\n this._setFormValue();\n this._manageRequired();\n this._dispatchChangeEvent();\n };\n\n private _onMultiAcceptClick(): void {\n this._toggleDropdown(false);\n }\n\n private _onMultiDeselectAllClick(): void {\n this._selectedIndexes = [];\n this._values = [];\n this._options = this._options.map((op) => ({...op, selected: false}));\n this._manageRequired();\n this._dispatchChangeEvent();\n }\n\n private _onMultiSelectAllClick(): void {\n this._selectedIndexes = [];\n this._values = [];\n this._options = this._options.map((op) => ({...op, selected: true}));\n this._options.forEach((op, index) => {\n this._selectedIndexes.push(index);\n this._values.push(op.value);\n this._dispatchChangeEvent();\n });\n\n this._setFormValue();\n this._manageRequired();\n }\n\n private _renderLabel() {\n switch (this._selectedIndexes.length) {\n case 0:\n return html`<span class=\"select-face-badge no-item\"\n >No items selected</span\n >`;\n case 1:\n return html`<span class=\"select-face-badge\">1 item selected</span>`;\n default:\n return html`<span class=\"select-face-badge\"\n >${this._selectedIndexes.length} items selected</span\n >`;\n }\n }\n\n protected override _renderSelectFace(): TemplateResult {\n return html`\n <div\n class=\"select-face face multiselect\"\n @click=${this._onFaceClick}\n tabindex=${this.tabIndex > -1 ? 0 : -1}\n >\n ${this._renderLabel()} ${chevronDownIcon}\n </div>\n `;\n }\n\n protected override _renderDropdownControls(): TemplateResult {\n return this._filteredOptions.length > 0\n ? html`\n <div class=\"dropdown-controls\">\n <button\n type=\"button\"\n @click=${this._onMultiSelectAllClick}\n title=\"Select all\"\n class=\"action-icon\"\n id=\"select-all\"\n >\n <vscode-icon name=\"checklist\"></vscode-icon>\n </button>\n <button\n type=\"button\"\n @click=${this._onMultiDeselectAllClick}\n title=\"Deselect all\"\n class=\"action-icon\"\n id=\"select-none\"\n >\n <vscode-icon name=\"clear-all\"></vscode-icon>\n </button>\n <vscode-button\n class=\"button-accept\"\n @click=${this._onMultiAcceptClick}\n >OK</vscode-button\n >\n </div>\n `\n : html`${nothing}`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-multi-select': VscodeMultiSelect;\n }\n\n interface GlobalEventHandlersEventMap {\n 'vsc-multi-select-create-option': VscMultiSelectCreateOptionEvent;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-multi-select.js","sourceRoot":"","sources":["../../src/vscode-multi-select/vscode-multi-select.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, LitElement, nothing, TemplateResult} from 'lit';\nimport {property, query} from 'lit/decorators.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\nimport {customElement} from '../includes/VscElement.js';\nimport {chevronDownIcon} from '../includes/vscode-select/template-elements.js';\nimport {VscodeSelectBase} from '../includes/vscode-select/vscode-select-base.js';\nimport styles from './vscode-multi-select.styles.js';\nimport {AssociatedFormControl} from '../includes/AssociatedFormControl.js';\n\nexport type VscMultiSelectCreateOptionEvent = CustomEvent<{value: string}>;\n\n/*\n Allows to select multiple items from a list of options.\n \n When participating in a form, it supports the `:invalid` pseudo class. Otherwise the error styles\n * can be applied through the `invalid` property.\n \n @tag vscode-multi-select\n \n @prop {boolean} invalid\n * @attr {boolean} invalid\n * @attr name - Name which is used as a variable name in the data of the form-container.\n \n @cssprop [--dropdown-z-index=2]\n * @cssprop [--vscode-badge-background=#616161]\n * @cssprop [--vscode-badge-foreground=#f8f8f8]\n * @cssprop [--vscode-settings-dropdownBorder=#3c3c3c]\n * @cssprop [--vscode-settings-checkboxBackground=#313131]\n * @cssprop [--vscode-settings-dropdownBackground=#313131]\n * @cssprop [--vscode-settings-dropdownForeground=#cccccc]\n * @cssprop [--vscode-settings-dropdownListBorder=#454545]\n * @cssprop [--vscode-focusBorder=#0078d4]\n * @cssprop [--vscode-foreground=#cccccc]\n * @cssprop [--vscode-font-family=sans-serif]\n * @cssprop [--vscode-font-size=13px]\n * @cssprop [--vscode-font-weight=normal]\n * @cssprop [--vscode-inputValidation-errorBackground=#5a1d1d]\n * @cssprop [--vscode-inputValidation-errorBorder=#be1100]\n * @cssprop [--vscode-list-activeSelectionBackground=#04395e]\n * @cssprop [--vscode-list-activeSelectionForeground=#ffffff]\n * @cssprop [--vscode-list-focusOutline=#0078d4]\n * @cssprop [--vscode-list-focusHighlightForeground=#2aaaff]\n * @cssprop [--vscode-list-highlightForeground=#2aaaff]\n * @cssprop [--vscode-list-hoverBackground=#2a2d2e]\n * @cssprop [--vscode-list-hoverForeground=#ffffff]\n /\n@customElement('vscode-multi-select')\nexport class VscodeMultiSelect\n extends VscodeSelectBase\n implements AssociatedFormControl\n{\n static override styles = styles;\n\n /* @internal /\n static override shadowRootOptions: ShadowRootInit = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n static formAssociated = true;\n\n @property({type: Array, attribute: 'default-value'})\n defaultValue: string[] = [];\n\n @property({type: Boolean, reflect: true})\n required = false;\n\n @property({reflect: true})\n name: string \| undefined = undefined;\n\n @property({type: Array, attribute: false})\n set selectedIndexes(val: number[]) {\n this._opts.selectedIndexes = val;\n }\n get selectedIndexes(): number[] {\n return this._opts.selectedIndexes;\n }\n\n @property({type: Array})\n set value(val: string[]) {\n this._opts.multiSelectValue = val;\n\n if (this._opts.selectedIndexes.length > 0) {\n this._requestedValueToSetLater = [];\n } else {\n this._requestedValueToSetLater = Array.isArray(val) ? val : [val];\n }\n\n this._setFormValue();\n this._manageRequired();\n }\n get value(): string[] {\n return this._opts.multiSelectValue;\n }\n\n get form() {\n return this._internals.form;\n }\n\n /* @internal /\n get type() {\n return 'select-multiple';\n }\n\n get validity(): ValidityState {\n return this._internals.validity;\n }\n\n get validationMessage(): string {\n return this._internals.validationMessage;\n }\n\n get willValidate() {\n return this._internals.willValidate;\n }\n\n checkValidity(): boolean {\n return this._internals.checkValidity();\n }\n\n reportValidity(): boolean {\n return this._internals.reportValidity();\n }\n\n selectAll() {\n this._opts.selectAll();\n }\n\n selectNone() {\n this._opts.selectNone();\n }\n\n private _internals: ElementInternals;\n\n constructor() {\n super();\n this._opts.multiSelect = true;\n this._internals = this.attachInternals();\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n this.updateComplete.then(() => {\n this._setDefaultValue();\n this._manageRequired();\n });\n }\n\n /* @internal /\n formResetCallback(): void {\n this.updateComplete.then(() => {\n this.value = this.defaultValue;\n });\n }\n\n /* @internal /\n formStateRestoreCallback(\n state: FormData,\n _mode: 'restore' \| 'autocomplete'\n ): void {\n const entries = Array.from(state.entries()).map((e) => String(e[1]));\n\n this.updateComplete.then(() => {\n this.value = entries;\n });\n }\n\n @query('.face')\n private _faceElement!: HTMLDivElement;\n\n private _setDefaultValue() {\n if (Array.isArray(this.defaultValue) && this.defaultValue.length > 0) {\n const val = this.defaultValue.map((v) => String(v));\n this.value = val;\n }\n }\n\n protected override _dispatchChangeEvent(): void {\n /* @deprecated */\n this.dispatchEvent(\n new CustomEvent('vsc-change', {\n detail: {\n selectedIndexes: this._opts.selectedIndexes,\n value: this._opts.multiSelectValue,\n },\n })\n );\n\n super._dispatchChangeEvent();\n }\n\n protected override _onFaceClick(): void {\n super._onFaceClick();\n this._opts.activeIndex = 0;\n }\n\n protected override _toggleComboboxDropdown(): void {\n super._toggleComboboxDropdown();\n this._opts.activeIndex = -1;\n }\n\n protected override _manageRequired() {\n const {value} = this;\n if (value.length === 0 && this.required) {\n this._internals.setValidity(\n {\n valueMissing: true,\n },\n 'Please select an item in the list.',\n this._faceElement\n );\n } else {\n this._internals.setValidity({});\n }\n }\n\n private _setFormValue() {\n const fd = new FormData();\n\n this._values.forEach((v) => {\n fd.append(this.name ?? '', v);\n });\n\n this._internals.setFormValue(fd);\n }\n\n private _requestedValueToSetLater: string[] = [];\n\n protected override async _createAndSelectSuggestedOption() {\n super._createAndSelectSuggestedOption();\n const nextIndex = this._createSuggestedOption();\n\n await this.updateComplete;\n\n this.selectedIndexes = [...this.selectedIndexes, nextIndex];\n this._dispatchChangeEvent();\n const opCreateEvent: VscMultiSelectCreateOptionEvent = new CustomEvent(\n 'vsc-multi-select-create-option',\n {detail: {value: this._options[nextIndex]?.value ?? ''}}\n );\n this.dispatchEvent(opCreateEvent);\n this.open = false;\n this._isPlaceholderOptionActive = false;\n }\n\n //#region event handlers\n protected override _onSlotChange(): void {\n super._onSlotChange();\n\n if (this._requestedValueToSetLater.length > 0) {\n this._opts.expandMultiSelection(this._requestedValueToSetLater);\n this._requestedValueToSetLater = this._requestedValueToSetLater.filter(\n (v) => this._opts.findOptionIndex(v) === -1\n );\n }\n }\n\n protected override _onOptionClick = (ev: MouseEvent) => {\n const composedPath = ev.composedPath();\n const optEl = composedPath.find((et) => {\n if ('matches' in et) {\n return (et as HTMLElement).matches('li.option');\n }\n\n return false;\n });\n\n if (!optEl) {\n return;\n }\n\n const isPlaceholderOption = (optEl as HTMLElement).classList.contains(\n 'placeholder'\n );\n\n if (isPlaceholderOption) {\n this._createAndSelectSuggestedOption();\n return;\n }\n\n const index = Number((optEl as HTMLElement).dataset.index);\n\n this._opts.toggleOptionSelected(index);\n\n this._setFormValue();\n this._manageRequired();\n this._dispatchChangeEvent();\n };\n\n protected override _onEnterKeyDown(ev: KeyboardEvent): void {\n super._onEnterKeyDown(ev);\n\n if (!this.open) {\n this._opts.filterPattern = '';\n this.open = true;\n } else {\n if (this._isPlaceholderOptionActive) {\n this._createAndSelectSuggestedOption();\n } else {\n this._opts.toggleActiveMultiselectOption();\n this._setFormValue();\n this._manageRequired();\n this._dispatchChangeEvent();\n }\n }\n }\n\n private _onMultiAcceptClick(): void {\n this.open = false;\n }\n\n private _onMultiDeselectAllClick(): void {\n this._opts.selectedIndexes = [];\n this._values = [];\n this._options = this._options.map((op) => ({...op, selected: false}));\n this._manageRequired();\n this._dispatchChangeEvent();\n }\n\n private _onMultiSelectAllClick(): void {\n this._opts.selectedIndexes = [];\n this._values = [];\n this._options = this._options.map((op) => ({...op, selected: true}));\n this._options.forEach((op, index) => {\n this._selectedIndexes.push(index);\n this._values.push(op.value);\n this._dispatchChangeEvent();\n });\n\n this._setFormValue();\n this._manageRequired();\n }\n //#endregion\n\n //#region render functions\n private _renderLabel() {\n switch (this._opts.selectedIndexes.length) {\n case 0:\n return html`<span class=\"select-face-badge no-item\">0 Selected</span>`;\n default:\n return html`<span class=\"select-face-badge\"\n >${this._opts.selectedIndexes.length} Selected</span\n >`;\n }\n }\n\n protected override _renderComboboxFace(): TemplateResult {\n let inputVal = '';\n\n if (this._isBeingFiltered) {\n inputVal = this._opts.filterPattern;\n } else {\n const op = this._opts.getSelectedOption();\n inputVal = op?.label ?? '';\n }\n\n const activeDescendant =\n this._opts.activeIndex > -1 ? `op-${this._opts.activeIndex}` : '';\n const expanded = this.open ? 'true' : 'false';\n\n return html`\n <div class=\"combobox-face face\">\n ${this._opts.multiSelect ? this._renderLabel() : nothing}\n <input\n aria-activedescendant=${activeDescendant}\n aria-autocomplete=\"list\"\n aria-controls=\"select-listbox\"\n aria-expanded=${expanded}\n aria-haspopup=\"listbox\"\n aria-label=${ifDefined(this.label)}\n class=\"combobox-input\"\n role=\"combobox\"\n spellcheck=\"false\"\n type=\"text\"\n autocomplete=\"off\"\n .value=${inputVal}\n @focus=${this._onComboboxInputFocus}\n @blur=${this._onComboboxInputBlur}\n @input=${this._onComboboxInputInput}\n @click=${this._onComboboxInputClick}\n @keydown=${this._onComboboxInputSpaceKeyDown}\n >\n <button\n aria-label=\"Open the list of options\"\n class=\"combobox-button\"\n type=\"button\"\n @click=${this._onComboboxButtonClick}\n @keydown=${this._onComboboxButtonKeyDown}\n tabindex=\"-1\"\n >\n ${chevronDownIcon}\n </button>\n </div>\n `;\n }\n\n protected override _renderSelectFace(): TemplateResult {\n const activeDescendant =\n this._opts.activeIndex > -1 ? `op-${this._opts.activeIndex}` : '';\n const expanded = this.open ? 'true' : 'false';\n\n return html`\n <div\n aria-activedescendant=${ifDefined(\n this._opts.multiSelect ? undefined : activeDescendant\n )}\n aria-controls=\"select-listbox\"\n aria-expanded=${ifDefined(\n this._opts.multiSelect ? undefined : expanded\n )}\n aria-haspopup=\"listbox\"\n aria-label=${ifDefined(this.label ?? undefined)}\n class=\"select-face face multiselect\"\n @click=${this._onFaceClick}\n .tabIndex=${this.disabled ? -1 : 0}\n >\n ${this._renderLabel()} ${chevronDownIcon}\n </div>\n `;\n }\n\n protected override _renderDropdownControls(): TemplateResult {\n return this._filteredOptions.length > 0\n ? html`\n <div class=\"dropdown-controls\">\n <button\n type=\"button\"\n @click=${this._onMultiSelectAllClick}\n title=\"Select all\"\n class=\"action-icon\"\n id=\"select-all\"\n >\n <vscode-icon name=\"checklist\"></vscode-icon>\n </button>\n <button\n type=\"button\"\n @click=${this._onMultiDeselectAllClick}\n title=\"Deselect all\"\n class=\"action-icon\"\n id=\"select-none\"\n >\n <vscode-icon name=\"clear-all\"></vscode-icon>\n </button>\n <vscode-button\n class=\"button-accept\"\n @click=${this._onMultiAcceptClick}\n >OK</vscode-button\n >\n </div>\n `\n : html`${nothing}`;\n }\n\n override render(): TemplateResult {\n return html`\n <div class=\"multi-select\">\n <slot class=\"main-slot\" @slotchange=${this._onSlotChange}></slot>\n ${this.combobox ? this._renderComboboxFace() : this._renderSelectFace()}\n ${this._renderDropdown()}\n </div>\n `;\n }\n //#endregion\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-multi-select': VscodeMultiSelect;\n }\n\n interface GlobalEventHandlersEventMap {\n 'vsc-multi-select-create-option': VscMultiSelectCreateOptionEvent;\n }\n}\n"]}

package/dist/vscode-single-select/vscode-single-select.d.ts CHANGED Viewed

@@ -57,8 +57,6 @@ export declare class VscodeSingleSelect extends VscodeSelectBase implements Asso
     /** @internal */
     static formAssociated: boolean;
     defaultValue: string;
-    /** @internal */
-    role: string;
     name: string | undefined;
     set selectedIndex(val: number);
     get selectedIndex(): number;
@@ -88,13 +86,15 @@ export declare class VscodeSingleSelect extends VscodeSelectBase implements Asso
      */
     private _requestedValueToSetLater;
     protected _createAndSelectSuggestedOption(): Promise<void>;
+    protected _dispatchChangeEvent(): void;
+    protected _setStateFromSlottedElements(): void;
     protected _onSlotChange(): void;
-    protected _onArrowUpKeyDown(): void;
-    protected _onArrowDownKeyDown(): void;
     protected _onEnterKeyDown(ev: KeyboardEvent): void;
     protected _onOptionClick(ev: MouseEvent): void;
     protected _manageRequired(): void;
     protected _renderSelectFace(): TemplateResult;
+    protected _renderComboboxFace(): TemplateResult;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/vscode-single-select/vscode-single-select.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-single-select.d.ts","sourceRoot":"","sources":["../../src/vscode-single-select/vscode-single-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;~~AAIrD~~,OAAO,EAAC,gBAAgB,EAAC,MAAM,iDAAiD,CAAC;~~AAEjF~~,OAAO,EAAC,qBAAqB,EAAC,MAAM,sCAAsC,CAAC;~~AAM3E~~,MAAM,MAAM,gCAAgC,GAAG,WAAW,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAC,CAAC,CAAC;AAE5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,qBACa,kBACX,SAAQ,gBACR,YAAW,qBAAqB;IAEhC,OAAgB,MAAM,4BAAU;IAEhC,gBAAgB;IAChB,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,gBAAgB;IAChB,MAAM,CAAC,cAAc,UAAQ;IAG7B,YAAY,SAAM;~~IAElB~~,~~gBAAgB;IAEP,~~IAAI,~~SAAa;IAG1B,IAAI,~~EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,IACI,aAAa,CAAC,GAAG,EAAE,MAAM,~~EAa5B~~;IACD,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED,IACI,KAAK,CAAC,GAAG,EAAE,MAAM,~~EAkBpB~~;IACD,IAAI,KAAK,IAAI,MAAM,~~CAMlB~~;IAGD,QAAQ,UAAS;IAEjB,IAAI,QAAQ,IAAI,aAAa,CAE5B;IAED,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED,IAAI,YAAY,YAEf;IAED,aAAa,IAAI,OAAO;IAIxB,cAAc,IAAI,OAAO;IAKzB,OAAO,CAAC,KAAK,CAAkB;IAE/B,OAAO,CAAC,UAAU,CAAmB;IAErC,OAAO,CAAC,gBAAgB;;~~IAuBf~~,iBAAiB,IAAI,IAAI;IAQlC,gBAAgB;IAChB,iBAAiB,IAAI,IAAI;IAIzB,gBAAgB;IAChB,wBAAwB,CACtB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,SAAS,GAAG,cAAc,GAChC,IAAI;IAMP,gBAAgB;IAChB,IAAI,IAAI,IAAI,YAAY,CAEvB;IAED,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED;;;OAGG;IACH,OAAO,CAAC,yBAAyB,CAAM;cAEd,+BAA+B;cAgBrC,~~aAAa~~,IAAI,IAAI;~~cAwBrB~~,~~iBAAiB~~,IAAI,IAAI;~~cAmBzB~~,~~mBAAmB~~,IAAI,IAAI;~~cAmB3B~~,eAAe,CAAC,EAAE,EAAE,aAAa,GAAG,IAAI;~~cAQxC~~,cAAc,CAAC,EAAE,EAAE,UAAU;cAkC7B,eAAe;~~cAaf~~,iBAAiB,IAAI,cAAc;~~CAavD~~;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;IAED,UAAU,2BAA2B;QACnC,iCAAiC,EAAE,gCAAgC,CAAC;KACrE;CACF"}
1	+ {"version":3,"file":"vscode-single-select.d.ts","sourceRoot":"","sources":["../../src/vscode-single-select/vscode-single-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;AAKrD,OAAO,EAAC,gBAAgB,EAAC,MAAM,iDAAiD,CAAC;AACjF,OAAO,EAAC,qBAAqB,EAAC,MAAM,sCAAsC,CAAC;AAG3E,MAAM,MAAM,gCAAgC,GAAG,WAAW,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAC,CAAC,CAAC;AAE5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,qBACa,kBACX,SAAQ,gBACR,YAAW,qBAAqB;IAEhC,OAAgB,MAAM,4BAAU;IAEhC,gBAAgB;IAChB,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,gBAAgB;IAChB,MAAM,CAAC,cAAc,UAAQ;IAG7B,YAAY,SAAM;IAGlB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,IACI,aAAa,CAAC,GAAG,EAAE,MAAM,EAe5B;IACD,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED,IACI,KAAK,CAAC,GAAG,EAAE,MAAM,EAWpB;IACD,IAAI,KAAK,IAAI,MAAM,CAElB;IAGD,QAAQ,UAAS;IAEjB,IAAI,QAAQ,IAAI,aAAa,CAE5B;IAED,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED,IAAI,YAAY,YAEf;IAED,aAAa,IAAI,OAAO;IAIxB,cAAc,IAAI,OAAO;IAKzB,OAAO,CAAC,KAAK,CAAkB;IAE/B,OAAO,CAAC,UAAU,CAAmB;IAErC,OAAO,CAAC,gBAAgB;;IAqBf,iBAAiB,IAAI,IAAI;IAQlC,gBAAgB;IAChB,iBAAiB,IAAI,IAAI;IAIzB,gBAAgB;IAChB,wBAAwB,CACtB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,SAAS,GAAG,cAAc,GAChC,IAAI;IAMP,gBAAgB;IAChB,IAAI,IAAI,IAAI,YAAY,CAEvB;IAED,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED;;;OAGG;IACH,OAAO,CAAC,yBAAyB,CAAM;cAEd,+BAA+B;cAgBrC,oBAAoB,IAAI,IAAI;cAc5B,4BAA4B,IAAI,IAAI;cASpC,aAAa,IAAI,IAAI;cAwBrB,eAAe,CAAC,EAAE,EAAE,aAAa,GAAG,IAAI;cAoCxC,cAAc,CAAC,EAAE,EAAE,UAAU;cAkC7B,eAAe;cAcf,iBAAiB,IAAI,cAAc;cAuBnC,mBAAmB,IAAI,cAAc;IAiD/C,MAAM,IAAI,cAAc;CAUlC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;IAED,UAAU,2BAA2B;QACnC,iCAAiC,EAAE,gCAAgC,CAAC;KACrE;CACF"}