wcs-core 7.2.1 → 7.2.2

package/dist/cjs/wcs-select_2.cjs.entry.js

@@ -5960,7 +5960,7 @@ const Select = class {
     onAutocompleteInputEvent(e) {
         var _a;
         const filter = (_a = this.autocompleteInput.value) !== null && _a !== void 0 ? _a : '';
-        this.setAutocompleteValue(filter);
+        this.setAutocompleteValue(filter, false, true); // fromUserInteraction = true
         // Avoid the inputEvent event to bubble and be emitted, we rather use wcsFilterChange in this case :
         e.stopPropagation();
     }
@@ -5968,13 +5968,15 @@ const Select = class {
      * Set the autocomplete value and open the select if needed.
      * @param filter - The new filter value
      * @param isReset - If true, the filter is reset and the select is closed
+     * @param fromUserInteraction - If true, the change comes from user interaction (typing), if false it's programmatic
      * @private
      */
-    setAutocompleteValue(filter, isReset = false) {
+    setAutocompleteValue(filter, isReset = false, fromUserInteraction = false) {
         var _a, _b;
         this.clearHighlightOnLastHighlightedOption();
         const newValueIsDifferentFromLastModifiedOption = this.lastModifiedOptionElement == null || ((_a = this.lastModifiedOptionElement) === null || _a === void 0 ? void 0 : _a.textContent) !== this.autocompleteValue;
-        if (!this.expanded && newValueIsDifferentFromLastModifiedOption && !isReset) {
+        // Only open the select automatically when the change comes from user interaction
+        if (!this.expanded && newValueIsDifferentFromLastModifiedOption && !isReset && fromUserInteraction) {
             this.open();
         }
         // Prevents client-side filtering logic from being applied when serverMode is enabled.
@@ -6043,14 +6045,14 @@ const Select = class {
         var _a;
         const ariaLabelValue = `${this.labelElement ? this.labelElement.innerText : ''} ${this.hasValue ? this.displayText : ''}`.trimEnd();
         const noResultContainerId = 'no-result-container';
-        return (index.h(index.Host, Object.assign({ key: '6a973d4f68de6f668fda8b17de1da78b94076dc0', class: this.expanded ? 'expanded ' : '', overlayDirection: this.overlayDirection }, this.focusedAttributes(), { role: !this.autocomplete ? "combobox" : null, "aria-haspopup": !this.autocomplete ? "listbox" : null, "aria-owns": !this.autocomplete ? this.optionsId : null, "aria-controls": !this.autocomplete ? this.optionsId : null, "aria-disabled": !this.autocomplete ? (this.disabled ? 'true' : null) : null, "aria-required": !this.autocomplete ? (this.required ? 'true' : 'false') : null, "aria-expanded": !this.autocomplete ? (this.expanded ? 'true' : 'false') : null, "aria-multiselectable": !this.autocomplete ? (this.multiple ? 'true' : 'false') : null, "aria-label": !this.autocomplete ? ariaLabelValue : null }), index.h("div", { key: '190343789a5d2b4227b4a9822348aa087b4bbbad', class: "wcs-select-control" }, index.h("div", { key: '2f61ddd11d08bd25d8acf00ecfdced4a97a33320', class: "wcs-select-value-container" }, this.hasValue
+        return (index.h(index.Host, Object.assign({ key: '71154caab9c0b2244716f5c5626cc0de3ed7d327', class: this.expanded ? 'expanded ' : '', overlayDirection: this.overlayDirection }, this.focusedAttributes(), { role: !this.autocomplete ? "combobox" : null, "aria-haspopup": !this.autocomplete ? "listbox" : null, "aria-owns": !this.autocomplete ? this.optionsId : null, "aria-controls": !this.autocomplete ? this.optionsId : null, "aria-disabled": !this.autocomplete ? (this.disabled ? 'true' : null) : null, "aria-required": !this.autocomplete ? (this.required ? 'true' : 'false') : null, "aria-expanded": !this.autocomplete ? (this.expanded ? 'true' : 'false') : null, "aria-multiselectable": !this.autocomplete ? (this.multiple ? 'true' : 'false') : null, "aria-label": !this.autocomplete ? ariaLabelValue : null }), index.h("div", { key: '2dff342eb864a28ac960583102de88cfd7f63d98', class: "wcs-select-control" }, index.h("div", { key: '0f2028f2eb8245fa08da06ccebbfbac880d0e090', class: "wcs-select-value-container" }, this.hasValue
             ?
                 (this.chips ?
                     this.values.map((option) => index.h(SelectChips, { disabled: this.disabled, option: option, onRemove: this.removeChip.bind(this) }))
                     : (!this.autocomplete || this.autocomplete && this.multiple) &&
                         index.h("label", { class: "wcs-select-value" }, this.displayText))
-            : !this.autocomplete && index.h("label", { class: "wcs-select-placeholder" }, this.placeholder), this.autocomplete && index.h("input", Object.assign({ key: '7f2fc76276628b45ebcbcb40f64a82acafa5e192', class: "autocomplete-field", value: this.autocompleteValue, role: "combobox", "aria-haspopup": "listbox", "aria-label": ariaLabelValue, "aria-describedby": noResultContainerId, "aria-disabled": this.disabled ? 'true' : null, "aria-expanded": this.expanded ? 'true' : 'false', "aria-controls": this.optionsId, "aria-owns": this.optionsId, "aria-multiselectable": this.multiple ? 'true' : 'false', "aria-autocomplete": "list", autocomplete: "off", disabled: this.disabled, required: this.required, onBlur: (e) => this.onAutocompleteFieldBlur(e), placeholder: ((_a = this.values) === null || _a === void 0 ? void 0 : _a.length) ? null : this.placeholder, onInput: (e) => this.onAutocompleteInputEvent(e), ref: el => this.autocompleteInput = el }, this.inheritedAttributes))), index.h(selectArrow.SelectArrow, { key: 'a6075fc5a325bc1e19cc3d62ddbffb8a3409d454', up: this.expanded })), index.h("div", { key: '36a6ea6029659db97f174c12a4a5ff3c4c0bfd69', class: "wcs-select-options", id: this.optionsId, role: "listbox" }, index.h("slot", { key: '3a02c19f0b77c98807a684ae77f2612c422cb096', name: "options", onSlotchange: this.onSlotchange.bind(this) }), (this.autocomplete && this.showNoResultFoundLabel) &&
-            index.h("div", { key: '82ecd4b70ed11d8497e9d5d3aea0c3c95f20ec36', role: "alert", id: noResultContainerId, class: "noresult-container" }, index.h("slot", { key: '607e7d9c3c112e64218d2170ca4e07aaf5cbd25c', name: "filter-no-result" }, index.h("span", { key: 'da3800fefd8f57c0d7b62e261933e3293bea2161' }, "Aucun r\u00E9sultat"))))));
+            : !this.autocomplete && index.h("label", { class: "wcs-select-placeholder" }, this.placeholder), this.autocomplete && index.h("input", Object.assign({ key: '000f05300690b402f77b210b4e6808e73647d607', class: "autocomplete-field", value: this.autocompleteValue, role: "combobox", "aria-haspopup": "listbox", "aria-label": ariaLabelValue, "aria-describedby": noResultContainerId, "aria-disabled": this.disabled ? 'true' : null, "aria-expanded": this.expanded ? 'true' : 'false', "aria-controls": this.optionsId, "aria-owns": this.optionsId, "aria-multiselectable": this.multiple ? 'true' : 'false', "aria-autocomplete": "list", autocomplete: "off", disabled: this.disabled, required: this.required, onBlur: (e) => this.onAutocompleteFieldBlur(e), placeholder: ((_a = this.values) === null || _a === void 0 ? void 0 : _a.length) ? null : this.placeholder, onInput: (e) => this.onAutocompleteInputEvent(e), ref: el => this.autocompleteInput = el }, this.inheritedAttributes))), index.h(selectArrow.SelectArrow, { key: 'cbbb2ef8b0c49b69c2a3509e6444f52d114efd23', up: this.expanded })), index.h("div", { key: '9330811ed0b8e0a2380692cdca34f2196b087466', class: "wcs-select-options", id: this.optionsId, role: "listbox" }, index.h("slot", { key: '9efd1b1d83e7bc1af1733909060854025c21df07', name: "options", onSlotchange: this.onSlotchange.bind(this) }), (this.autocomplete && this.showNoResultFoundLabel) &&
+            index.h("div", { key: 'a8438df62c26f1d4cfcd25c43d5636031138c71f', role: "alert", id: noResultContainerId, class: "noresult-container" }, index.h("slot", { key: '95397947cdef93512fec2c168ca42893500950ba', name: "filter-no-result" }, index.h("span", { key: 'd5fc78e9ba099a017f6ed3116b23aa929c34dcb9' }, "Aucun r\u00E9sultat"))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {