@fluid-topics/ft-combobox 2.2.12 → 2.2.14

package/build/ft-combobox.light.js

@@ -565,6 +565,10 @@
         outline: none;
     }
 
+    .ft-text-field-suggestion--remove {
+        margin: 0 4px;
+    }
+
     .ft-text-field-suggestion,
     .ft-text-field-suggestion--suggestion,
     .ft-text-field-suggestion--label {
@@ -1015,7 +1019,7 @@
                      .variant=${this.iconVariant}
                      .value=${this.icon}
                      @click=${()=>{var e;return(e=this.input)===null||e===void 0?void 0:e.focus()}}></ft-icon>
-        `:ie.nothing}update(e){super.update(e),(e.has("value")||e.has("filterSuggestions")||e.has("suggestionsProvider"))&&this.updateSuggestions(),e.has("value")&&e.get("value")!=null&&(this.hideSuggestions=!1),e.has("dispatchedValue")&&e.get("dispatchedValue")!=null&&(this.hideSuggestions=!0)}async updateSuggestions(){var e;if(this.suggestionsProvider){(e=this.cancelableSuggest)===null||e===void 0||e.cancel();let i=this.suggestionsProvider(this.value);i instanceof Promise?(this.cancelableSuggest=(0,xe.cancelable)(i),this.providedSuggestions=await this.cancelableSuggest):(this.cancelableSuggest=void 0,this.providedSuggestions=i)}else this.filterSuggestionsIfNeeded()}filterSuggestionsIfNeeded(){this.filterSuggestions?(this.slottedSuggestions.forEach(e=>e.hidden=!e.getValue().toLowerCase().includes(this.value.toLowerCase())),this.visibleSuggestions=this.slottedSuggestions.filter(e=>!e.hidden)):this.visibleSuggestions=this.slottedSuggestions,this.newValueSuggestion&&(this.visibleSuggestions=[...this.visibleSuggestions,this.newValueSuggestion]),this.hideSuggestions=this.visibleSuggestions.length<=0}contentAvailableCallback(e){super.contentAvailableCallback(e),e.has("focused")&&!this.hideSuggestions&&this.visibleSuggestions.length>0&&this.setSuggestionPosition(),e.has("providedSuggestions")&&(this.visibleSuggestions=[...this.providedSuggestionsInDom]),e.has("autocomplete")&&this.setupWatchAutofill(),this.suggestionsShouldBeDisplayed()&&this.setSuggestionPosition()}setupWatchAutofill(){var e;this.clearWatchAutofill(),((e=this.autocomplete)!==null&&e!==void 0?e:"off")!=="off"&&(this.watchAutofillInterval=setInterval(()=>{var i,r,n;!((i=this.input)===null||i===void 0)&&i.matches(":autofill")&&this.dispatchedValue!==((r=this.input)===null||r===void 0?void 0:r.value)&&this.setValue((n=this.input)===null||n===void 0?void 0:n.value,!0)},200))}clearWatchAutofill(){this.watchAutofillInterval&&clearInterval(this.watchAutofillInterval)}connectedCallback(){super.connectedCallback(),this.setupWatchAutofill()}disconnectedCallback(){super.disconnectedCallback(),this.clearWatchAutofill()}setValue(e,i=!1){var r,n;this.value!==e&&(this.inputValid=!0,this.setInternalValue(e),this.dispatchEvent(new qi(e))),i&&this.dispatchedValue!==e&&(this.inputValid=(n=(r=this.input)===null||r===void 0?void 0:r.checkValidity())!==null&&n!==void 0?n:!0,this.inputValid?(this.dispatchedValue=e,this.dispatchEvent(new Yi(e))):this.dispatchEvent(new Xi(this.input.validationMessage)))}handleInput(e){var i;let r=((i=this.input)===null||i===void 0?void 0:i.value)||"";this.setValue(r,e.key=="Escape"||e.key=="Enter")}catchComposingEvents(e){}handleClick(){this.hideSuggestions=!1}handleKeyboardNavigation(e){var i,r;if(e.key==="ArrowDown"||e.key==="ArrowUp"){e.preventDefault(),e.stopPropagation(),this.hideSuggestions=!1;let n=this.visibleSuggestions.findIndex(s=>s.matches(":focus-within")),o;e.key==="ArrowDown"?o=n<this.visibleSuggestions.length-1?n+1:0:o=n>0?n-1:this.visibleSuggestions.length-1,(i=this.visibleSuggestions[o])===null||i===void 0||i.focus(void 0,(r=this.visibleSuggestions[n])===null||r===void 0?void 0:r.isRemoveButtonFocused())}(e.key=="Escape"||e.key=="Enter")&&(this.hideSuggestions=!0)}onSuggestionSelected(e){var i;this.setValue(e.detail,!0),(i=this.input)===null||i===void 0||i.focus(),setTimeout(()=>this.hideSuggestions=!0,0)}onSuggestionRemoved(){setTimeout(()=>this.updateSuggestions())}onFocus(){this.focused=!0,this.hideSuggestions=!1}onMainPanelBlur(){var e,i;!((e=this.mainPanel)===null||e===void 0)&&e.matches(":focus-within")||(this.focused=!1,this.setValue(((i=this.input)===null||i===void 0?void 0:i.value)||"",!0))}togglePasswordVisibility(){this.hidePassword=!this.hidePassword}isPasswordField(){return this.password||this.type==="password"}setSuggestionPosition(){this.suggestionsContainer.style.width=this.mainPanel.getBoundingClientRect().width+"px";let e=["bottom","top"];(0,xe.computeOffsetAutoPosition)(this.mainPanel,this.suggestionsContainer,"bottom",e,"fixed","--text-field-internal-suggest-size",0).then(({x:i,y:r})=>{this.suggestionsContainer.style.left=`${i}px`,this.suggestionsContainer.style.top=`${r}px`})}suggestionsShouldBeDisplayed(){return!this.hideSuggestions&&(this.visibleSuggestions.length||this.providedSuggestions.length)}};C.elementDefinitions={"ft-input-label":Te,"ft-ripple":F,"ft-typography":ne,"ft-icon":J,"ft-text-field-suggestion":be};C.styles=[qt,xe.noTextInputDefaultClearButton,is];$([(0,N.property)()],C.prototype,"label",void 0);$([(0,N.property)({noAccessor:!0})],C.prototype,"value",null);$([(0,N.state)()],C.prototype,"dispatchedValue",void 0);$([(0,N.property)()],C.prototype,"helper",void 0);$([(0,N.property)()],C.prototype,"suggestionsHelper",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"outlined",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"disabled",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"error",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"fixedMenuPosition",void 0);$([(0,N.property)()],C.prototype,"prefix",void 0);$([(0,N.property)()],C.prototype,"icon",void 0);$([(0,N.property)()],C.prototype,"name",void 0);$([(0,N.property)()],C.prototype,"type",void 0);$([(0,N.property)()],C.prototype,"passwordHiddenIcon",void 0);$([(0,N.property)()],C.prototype,"passwordRevealedIcon",void 0);$([(0,N.property)()],C.prototype,"iconVariant",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"filterSuggestions",void 0);$([(0,xe.numberProperty)()],C.prototype,"maxLength",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"password",void 0);$([(0,N.property)({type:String})],C.prototype,"autocomplete",void 0);$([(0,N.property)({attribute:!1})],C.prototype,"suggestionsProvider",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"hideCurrentValueSuggestion",void 0);$([(0,N.state)()],C.prototype,"focused",void 0);$([(0,N.state)()],C.prototype,"inputValid",void 0);$([(0,N.state)()],C.prototype,"hidePassword",void 0);$([(0,N.state)()],C.prototype,"hideSuggestions",void 0);$([(0,N.state)()],C.prototype,"visibleSuggestions",void 0);$([(0,N.state)()],C.prototype,"providedSuggestions",void 0);$([(0,N.query)(".ft-text-field--main-panel")],C.prototype,"mainPanel",void 0);$([(0,N.query)(".ft-text-field--input")],C.prototype,"input",void 0);$([(0,N.query)(".ft-text-field-suggestion--new-value")],C.prototype,"newValueSuggestion",void 0);$([(0,N.query)(".ft-text-field--suggestions")],C.prototype,"suggestionsContainer",void 0);$([(0,N.queryAll)("ft-text-field-suggestion")],C.prototype,"providedSuggestionsInDom",void 0);$([(0,N.queryAssignedElements)({selector:"ft-text-field-suggestion"})],C.prototype,"slottedSuggestions",void 0);$([(0,xe.ignoreComposingEvents)()],C.prototype,"handleInput",null);$([(0,xe.ignoreComposingEvents)()],C.prototype,"catchComposingEvents",null);var Pc=f(S());var Lc={"ft-text-field":C,"ft-text-field-suggestion":be};(0,Pc.customElements)(Lc);var w={..._,chipGap:he.FtCssVariableFactory.extend("--ft-combobox-chip-gap","",he.foundation.spacing1),chipsMarginTop:he.FtCssVariableFactory.extend("--ft-combobox-chips-margin-top","",he.foundation.spacing2),suggestSize:he.FtCssVariableFactory.create("--ft-combobox-suggest-size","","SIZE","370px")},Nc=Dc.css`
+        `:ie.nothing}update(e){super.update(e),(e.has("value")||e.has("filterSuggestions")||e.has("suggestionsProvider"))&&this.updateSuggestions(),e.has("value")&&e.get("value")!=null&&(this.hideSuggestions=!1),e.has("dispatchedValue")&&e.get("dispatchedValue")!=null&&(this.hideSuggestions=!0)}async updateSuggestions(){var e;if(this.suggestionsProvider){(e=this.cancelableSuggest)===null||e===void 0||e.cancel();let i=this.suggestionsProvider(this.value);i instanceof Promise?(this.cancelableSuggest=(0,xe.cancelable)(i),this.providedSuggestions=await this.cancelableSuggest):(this.cancelableSuggest=void 0,this.providedSuggestions=i)}else this.filterSuggestionsIfNeeded()}filterSuggestionsIfNeeded(){this.filterSuggestions?(this.slottedSuggestions.forEach(e=>e.hidden=!e.getValue().toLowerCase().includes(this.value.toLowerCase())),this.visibleSuggestions=this.slottedSuggestions.filter(e=>!e.hidden)):this.visibleSuggestions=this.slottedSuggestions,this.newValueSuggestion&&(this.visibleSuggestions=[...this.visibleSuggestions,this.newValueSuggestion]),this.hideSuggestions=this.visibleSuggestions.length<=0}contentAvailableCallback(e){super.contentAvailableCallback(e),e.has("focused")&&!this.hideSuggestions&&this.visibleSuggestions.length>0&&this.setSuggestionPosition(),e.has("providedSuggestions")&&this.suggestionsProvider&&(this.visibleSuggestions=[...this.providedSuggestionsInDom]),e.has("autocomplete")&&this.setupWatchAutofill(),this.suggestionsShouldBeDisplayed()&&this.setSuggestionPosition()}setupWatchAutofill(){var e;this.clearWatchAutofill(),((e=this.autocomplete)!==null&&e!==void 0?e:"off")!=="off"&&(this.watchAutofillInterval=setInterval(()=>{var i,r,n;!((i=this.input)===null||i===void 0)&&i.matches(":autofill")&&this.dispatchedValue!==((r=this.input)===null||r===void 0?void 0:r.value)&&this.setValue((n=this.input)===null||n===void 0?void 0:n.value,!0)},200))}clearWatchAutofill(){this.watchAutofillInterval&&clearInterval(this.watchAutofillInterval)}connectedCallback(){super.connectedCallback(),this.setupWatchAutofill()}disconnectedCallback(){super.disconnectedCallback(),this.clearWatchAutofill()}setValue(e,i=!1){var r,n;this.value!==e&&(this.inputValid=!0,this.setInternalValue(e),this.dispatchEvent(new qi(e))),i&&this.dispatchedValue!==e&&(this.inputValid=(n=(r=this.input)===null||r===void 0?void 0:r.checkValidity())!==null&&n!==void 0?n:!0,this.inputValid?(this.dispatchedValue=e,this.dispatchEvent(new Yi(e))):this.dispatchEvent(new Xi(this.input.validationMessage)))}handleInput(e){var i;let r=((i=this.input)===null||i===void 0?void 0:i.value)||"";this.setValue(r,e.key=="Escape"||e.key=="Enter")}catchComposingEvents(e){}handleClick(){this.hideSuggestions=!1}handleKeyboardNavigation(e){var i,r;if(e.key==="ArrowDown"||e.key==="ArrowUp"){e.preventDefault(),e.stopPropagation(),this.hideSuggestions=!1;let n=this.visibleSuggestions.findIndex(s=>s.matches(":focus-within")),o;e.key==="ArrowDown"?o=n<this.visibleSuggestions.length-1?n+1:0:o=n>0?n-1:this.visibleSuggestions.length-1,(i=this.visibleSuggestions[o])===null||i===void 0||i.focus(void 0,(r=this.visibleSuggestions[n])===null||r===void 0?void 0:r.isRemoveButtonFocused())}(e.key=="Escape"||e.key=="Enter")&&(this.hideSuggestions=!0)}onSuggestionSelected(e){var i;this.setValue(e.detail,!0),(i=this.input)===null||i===void 0||i.focus(),setTimeout(()=>this.hideSuggestions=!0,0)}onSuggestionRemoved(){setTimeout(()=>this.updateSuggestions())}onFocus(){this.focused=!0,this.hideSuggestions=!1}onMainPanelBlur(){var e,i;!((e=this.mainPanel)===null||e===void 0)&&e.matches(":focus-within")||(this.focused=!1,this.setValue(((i=this.input)===null||i===void 0?void 0:i.value)||"",!0))}togglePasswordVisibility(){this.hidePassword=!this.hidePassword}isPasswordField(){return this.password||this.type==="password"}setSuggestionPosition(){this.suggestionsContainer.style.width=this.mainPanel.getBoundingClientRect().width+"px";let e=["bottom","top"];(0,xe.computeOffsetAutoPosition)(this.mainPanel,this.suggestionsContainer,"bottom",e,"fixed","--text-field-internal-suggest-size",0).then(({x:i,y:r})=>{this.suggestionsContainer.style.left=`${i}px`,this.suggestionsContainer.style.top=`${r}px`})}suggestionsShouldBeDisplayed(){return!this.hideSuggestions&&(this.visibleSuggestions.length||this.providedSuggestions.length)}};C.elementDefinitions={"ft-input-label":Te,"ft-ripple":F,"ft-typography":ne,"ft-icon":J,"ft-text-field-suggestion":be};C.styles=[qt,xe.noTextInputDefaultClearButton,is];$([(0,N.property)()],C.prototype,"label",void 0);$([(0,N.property)({noAccessor:!0})],C.prototype,"value",null);$([(0,N.state)()],C.prototype,"dispatchedValue",void 0);$([(0,N.property)()],C.prototype,"helper",void 0);$([(0,N.property)()],C.prototype,"suggestionsHelper",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"outlined",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"disabled",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"error",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"fixedMenuPosition",void 0);$([(0,N.property)()],C.prototype,"prefix",void 0);$([(0,N.property)()],C.prototype,"icon",void 0);$([(0,N.property)()],C.prototype,"name",void 0);$([(0,N.property)()],C.prototype,"type",void 0);$([(0,N.property)()],C.prototype,"passwordHiddenIcon",void 0);$([(0,N.property)()],C.prototype,"passwordRevealedIcon",void 0);$([(0,N.property)()],C.prototype,"iconVariant",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"filterSuggestions",void 0);$([(0,xe.numberProperty)()],C.prototype,"maxLength",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"password",void 0);$([(0,N.property)({type:String})],C.prototype,"autocomplete",void 0);$([(0,N.property)({attribute:!1})],C.prototype,"suggestionsProvider",void 0);$([(0,N.property)({type:Boolean})],C.prototype,"hideCurrentValueSuggestion",void 0);$([(0,N.state)()],C.prototype,"focused",void 0);$([(0,N.state)()],C.prototype,"inputValid",void 0);$([(0,N.state)()],C.prototype,"hidePassword",void 0);$([(0,N.state)()],C.prototype,"hideSuggestions",void 0);$([(0,N.state)()],C.prototype,"visibleSuggestions",void 0);$([(0,N.state)()],C.prototype,"providedSuggestions",void 0);$([(0,N.query)(".ft-text-field--main-panel")],C.prototype,"mainPanel",void 0);$([(0,N.query)(".ft-text-field--input")],C.prototype,"input",void 0);$([(0,N.query)(".ft-text-field-suggestion--new-value")],C.prototype,"newValueSuggestion",void 0);$([(0,N.query)(".ft-text-field--suggestions")],C.prototype,"suggestionsContainer",void 0);$([(0,N.queryAll)("ft-text-field-suggestion")],C.prototype,"providedSuggestionsInDom",void 0);$([(0,N.queryAssignedElements)({selector:"ft-text-field-suggestion"})],C.prototype,"slottedSuggestions",void 0);$([(0,xe.ignoreComposingEvents)()],C.prototype,"handleInput",null);$([(0,xe.ignoreComposingEvents)()],C.prototype,"catchComposingEvents",null);var Pc=f(S());var Lc={"ft-text-field":C,"ft-text-field-suggestion":be};(0,Pc.customElements)(Lc);var w={..._,chipGap:he.FtCssVariableFactory.extend("--ft-combobox-chip-gap","",he.foundation.spacing1),chipsMarginTop:he.FtCssVariableFactory.extend("--ft-combobox-chips-margin-top","",he.foundation.spacing2),suggestSize:he.FtCssVariableFactory.create("--ft-combobox-suggest-size","","SIZE","370px")},Nc=Dc.css`
     *:focus {
         outline: none;
     }

package/build/ft-combobox.min.js

@@ -646,6 +646,10 @@ Also for action icons.`,l.colorGray200),contentGlobalSubtle:o.extend("--ftds-con
         outline: none;
     }
 
+    .ft-text-field-suggestion--remove {
+        margin: 0 4px;
+    }
+
     .ft-text-field-suggestion,
     .ft-text-field-suggestion--suggestion,
     .ft-text-field-suggestion--label {
@@ -1096,7 +1100,7 @@ Also for action icons.`,l.colorGray200),contentGlobalSubtle:o.extend("--ftds-con
                      .variant=${this.iconVariant}
                      .value=${this.icon}
                      @click=${()=>{var e;return(e=this.input)===null||e===void 0?void 0:e.focus()}}></ft-icon>
-        `:D}update(e){super.update(e),(e.has("value")||e.has("filterSuggestions")||e.has("suggestionsProvider"))&&this.updateSuggestions(),e.has("value")&&e.get("value")!=null&&(this.hideSuggestions=!1),e.has("dispatchedValue")&&e.get("dispatchedValue")!=null&&(this.hideSuggestions=!0)}async updateSuggestions(){var e;if(this.suggestionsProvider){(e=this.cancelableSuggest)===null||e===void 0||e.cancel();let r=this.suggestionsProvider(this.value);r instanceof Promise?(this.cancelableSuggest=Wr(r),this.providedSuggestions=await this.cancelableSuggest):(this.cancelableSuggest=void 0,this.providedSuggestions=r)}else this.filterSuggestionsIfNeeded()}filterSuggestionsIfNeeded(){this.filterSuggestions?(this.slottedSuggestions.forEach(e=>e.hidden=!e.getValue().toLowerCase().includes(this.value.toLowerCase())),this.visibleSuggestions=this.slottedSuggestions.filter(e=>!e.hidden)):this.visibleSuggestions=this.slottedSuggestions,this.newValueSuggestion&&(this.visibleSuggestions=[...this.visibleSuggestions,this.newValueSuggestion]),this.hideSuggestions=this.visibleSuggestions.length<=0}contentAvailableCallback(e){super.contentAvailableCallback(e),e.has("focused")&&!this.hideSuggestions&&this.visibleSuggestions.length>0&&this.setSuggestionPosition(),e.has("providedSuggestions")&&(this.visibleSuggestions=[...this.providedSuggestionsInDom]),e.has("autocomplete")&&this.setupWatchAutofill(),this.suggestionsShouldBeDisplayed()&&this.setSuggestionPosition()}setupWatchAutofill(){var e;this.clearWatchAutofill(),((e=this.autocomplete)!==null&&e!==void 0?e:"off")!=="off"&&(this.watchAutofillInterval=setInterval(()=>{var r,n,i;!((r=this.input)===null||r===void 0)&&r.matches(":autofill")&&this.dispatchedValue!==((n=this.input)===null||n===void 0?void 0:n.value)&&this.setValue((i=this.input)===null||i===void 0?void 0:i.value,!0)},200))}clearWatchAutofill(){this.watchAutofillInterval&&clearInterval(this.watchAutofillInterval)}connectedCallback(){super.connectedCallback(),this.setupWatchAutofill()}disconnectedCallback(){super.disconnectedCallback(),this.clearWatchAutofill()}setValue(e,r=!1){var n,i;this.value!==e&&(this.inputValid=!0,this.setInternalValue(e),this.dispatchEvent(new yn(e))),r&&this.dispatchedValue!==e&&(this.inputValid=(i=(n=this.input)===null||n===void 0?void 0:n.checkValidity())!==null&&i!==void 0?i:!0,this.inputValid?(this.dispatchedValue=e,this.dispatchEvent(new bn(e))):this.dispatchEvent(new xn(this.input.validationMessage)))}handleInput(e){var r;let n=((r=this.input)===null||r===void 0?void 0:r.value)||"";this.setValue(n,e.key=="Escape"||e.key=="Enter")}catchComposingEvents(e){}handleClick(){this.hideSuggestions=!1}handleKeyboardNavigation(e){var r,n;if(e.key==="ArrowDown"||e.key==="ArrowUp"){e.preventDefault(),e.stopPropagation(),this.hideSuggestions=!1;let i=this.visibleSuggestions.findIndex(s=>s.matches(":focus-within")),a;e.key==="ArrowDown"?a=i<this.visibleSuggestions.length-1?i+1:0:a=i>0?i-1:this.visibleSuggestions.length-1,(r=this.visibleSuggestions[a])===null||r===void 0||r.focus(void 0,(n=this.visibleSuggestions[i])===null||n===void 0?void 0:n.isRemoveButtonFocused())}(e.key=="Escape"||e.key=="Enter")&&(this.hideSuggestions=!0)}onSuggestionSelected(e){var r;this.setValue(e.detail,!0),(r=this.input)===null||r===void 0||r.focus(),setTimeout(()=>this.hideSuggestions=!0,0)}onSuggestionRemoved(){setTimeout(()=>this.updateSuggestions())}onFocus(){this.focused=!0,this.hideSuggestions=!1}onMainPanelBlur(){var e,r;!((e=this.mainPanel)===null||e===void 0)&&e.matches(":focus-within")||(this.focused=!1,this.setValue(((r=this.input)===null||r===void 0?void 0:r.value)||"",!0))}togglePasswordVisibility(){this.hidePassword=!this.hidePassword}isPasswordField(){return this.password||this.type==="password"}setSuggestionPosition(){this.suggestionsContainer.style.width=this.mainPanel.getBoundingClientRect().width+"px";let e=["bottom","top"];Mi(this.mainPanel,this.suggestionsContainer,"bottom",e,"fixed","--text-field-internal-suggest-size",0).then(({x:r,y:n})=>{this.suggestionsContainer.style.left=`${r}px`,this.suggestionsContainer.style.top=`${n}px`})}suggestionsShouldBeDisplayed(){return!this.hideSuggestions&&(this.visibleSuggestions.length||this.providedSuggestions.length)}};F.elementDefinitions={"ft-input-label":De,"ft-ripple":J,"ft-typography":de,"ft-icon":ae,"ft-text-field-suggestion":Oe};F.styles=[Tr,qi,Pd];q([m()],F.prototype,"label",void 0);q([m({noAccessor:!0})],F.prototype,"value",null);q([M()],F.prototype,"dispatchedValue",void 0);q([m()],F.prototype,"helper",void 0);q([m()],F.prototype,"suggestionsHelper",void 0);q([m({type:Boolean})],F.prototype,"outlined",void 0);q([m({type:Boolean})],F.prototype,"disabled",void 0);q([m({type:Boolean})],F.prototype,"error",void 0);q([m({type:Boolean})],F.prototype,"fixedMenuPosition",void 0);q([m()],F.prototype,"prefix",void 0);q([m()],F.prototype,"icon",void 0);q([m()],F.prototype,"name",void 0);q([m()],F.prototype,"type",void 0);q([m()],F.prototype,"passwordHiddenIcon",void 0);q([m()],F.prototype,"passwordRevealedIcon",void 0);q([m()],F.prototype,"iconVariant",void 0);q([m({type:Boolean})],F.prototype,"filterSuggestions",void 0);q([Xe()],F.prototype,"maxLength",void 0);q([m({type:Boolean})],F.prototype,"password",void 0);q([m({type:String})],F.prototype,"autocomplete",void 0);q([m({attribute:!1})],F.prototype,"suggestionsProvider",void 0);q([m({type:Boolean})],F.prototype,"hideCurrentValueSuggestion",void 0);q([M()],F.prototype,"focused",void 0);q([M()],F.prototype,"inputValid",void 0);q([M()],F.prototype,"hidePassword",void 0);q([M()],F.prototype,"hideSuggestions",void 0);q([M()],F.prototype,"visibleSuggestions",void 0);q([M()],F.prototype,"providedSuggestions",void 0);q([Q(".ft-text-field--main-panel")],F.prototype,"mainPanel",void 0);q([Q(".ft-text-field--input")],F.prototype,"input",void 0);q([Q(".ft-text-field-suggestion--new-value")],F.prototype,"newValueSuggestion",void 0);q([Q(".ft-text-field--suggestions")],F.prototype,"suggestionsContainer",void 0);q([qn("ft-text-field-suggestion")],F.prototype,"providedSuggestionsInDom",void 0);q([Yn({selector:"ft-text-field-suggestion"})],F.prototype,"slottedSuggestions",void 0);q([Tt()],F.prototype,"handleInput",null);q([Tt()],F.prototype,"catchComposingEvents",null);var uu={"ft-text-field":F,"ft-text-field-suggestion":Oe};ee(uu);var U={...$,chipGap:o.extend("--ft-combobox-chip-gap","",l.spacing1),chipsMarginTop:o.extend("--ft-combobox-chips-margin-top","",l.spacing2),suggestSize:o.create("--ft-combobox-suggest-size","","SIZE","370px")},pu=I`
+        `:D}update(e){super.update(e),(e.has("value")||e.has("filterSuggestions")||e.has("suggestionsProvider"))&&this.updateSuggestions(),e.has("value")&&e.get("value")!=null&&(this.hideSuggestions=!1),e.has("dispatchedValue")&&e.get("dispatchedValue")!=null&&(this.hideSuggestions=!0)}async updateSuggestions(){var e;if(this.suggestionsProvider){(e=this.cancelableSuggest)===null||e===void 0||e.cancel();let r=this.suggestionsProvider(this.value);r instanceof Promise?(this.cancelableSuggest=Wr(r),this.providedSuggestions=await this.cancelableSuggest):(this.cancelableSuggest=void 0,this.providedSuggestions=r)}else this.filterSuggestionsIfNeeded()}filterSuggestionsIfNeeded(){this.filterSuggestions?(this.slottedSuggestions.forEach(e=>e.hidden=!e.getValue().toLowerCase().includes(this.value.toLowerCase())),this.visibleSuggestions=this.slottedSuggestions.filter(e=>!e.hidden)):this.visibleSuggestions=this.slottedSuggestions,this.newValueSuggestion&&(this.visibleSuggestions=[...this.visibleSuggestions,this.newValueSuggestion]),this.hideSuggestions=this.visibleSuggestions.length<=0}contentAvailableCallback(e){super.contentAvailableCallback(e),e.has("focused")&&!this.hideSuggestions&&this.visibleSuggestions.length>0&&this.setSuggestionPosition(),e.has("providedSuggestions")&&this.suggestionsProvider&&(this.visibleSuggestions=[...this.providedSuggestionsInDom]),e.has("autocomplete")&&this.setupWatchAutofill(),this.suggestionsShouldBeDisplayed()&&this.setSuggestionPosition()}setupWatchAutofill(){var e;this.clearWatchAutofill(),((e=this.autocomplete)!==null&&e!==void 0?e:"off")!=="off"&&(this.watchAutofillInterval=setInterval(()=>{var r,n,i;!((r=this.input)===null||r===void 0)&&r.matches(":autofill")&&this.dispatchedValue!==((n=this.input)===null||n===void 0?void 0:n.value)&&this.setValue((i=this.input)===null||i===void 0?void 0:i.value,!0)},200))}clearWatchAutofill(){this.watchAutofillInterval&&clearInterval(this.watchAutofillInterval)}connectedCallback(){super.connectedCallback(),this.setupWatchAutofill()}disconnectedCallback(){super.disconnectedCallback(),this.clearWatchAutofill()}setValue(e,r=!1){var n,i;this.value!==e&&(this.inputValid=!0,this.setInternalValue(e),this.dispatchEvent(new yn(e))),r&&this.dispatchedValue!==e&&(this.inputValid=(i=(n=this.input)===null||n===void 0?void 0:n.checkValidity())!==null&&i!==void 0?i:!0,this.inputValid?(this.dispatchedValue=e,this.dispatchEvent(new bn(e))):this.dispatchEvent(new xn(this.input.validationMessage)))}handleInput(e){var r;let n=((r=this.input)===null||r===void 0?void 0:r.value)||"";this.setValue(n,e.key=="Escape"||e.key=="Enter")}catchComposingEvents(e){}handleClick(){this.hideSuggestions=!1}handleKeyboardNavigation(e){var r,n;if(e.key==="ArrowDown"||e.key==="ArrowUp"){e.preventDefault(),e.stopPropagation(),this.hideSuggestions=!1;let i=this.visibleSuggestions.findIndex(s=>s.matches(":focus-within")),a;e.key==="ArrowDown"?a=i<this.visibleSuggestions.length-1?i+1:0:a=i>0?i-1:this.visibleSuggestions.length-1,(r=this.visibleSuggestions[a])===null||r===void 0||r.focus(void 0,(n=this.visibleSuggestions[i])===null||n===void 0?void 0:n.isRemoveButtonFocused())}(e.key=="Escape"||e.key=="Enter")&&(this.hideSuggestions=!0)}onSuggestionSelected(e){var r;this.setValue(e.detail,!0),(r=this.input)===null||r===void 0||r.focus(),setTimeout(()=>this.hideSuggestions=!0,0)}onSuggestionRemoved(){setTimeout(()=>this.updateSuggestions())}onFocus(){this.focused=!0,this.hideSuggestions=!1}onMainPanelBlur(){var e,r;!((e=this.mainPanel)===null||e===void 0)&&e.matches(":focus-within")||(this.focused=!1,this.setValue(((r=this.input)===null||r===void 0?void 0:r.value)||"",!0))}togglePasswordVisibility(){this.hidePassword=!this.hidePassword}isPasswordField(){return this.password||this.type==="password"}setSuggestionPosition(){this.suggestionsContainer.style.width=this.mainPanel.getBoundingClientRect().width+"px";let e=["bottom","top"];Mi(this.mainPanel,this.suggestionsContainer,"bottom",e,"fixed","--text-field-internal-suggest-size",0).then(({x:r,y:n})=>{this.suggestionsContainer.style.left=`${r}px`,this.suggestionsContainer.style.top=`${n}px`})}suggestionsShouldBeDisplayed(){return!this.hideSuggestions&&(this.visibleSuggestions.length||this.providedSuggestions.length)}};F.elementDefinitions={"ft-input-label":De,"ft-ripple":J,"ft-typography":de,"ft-icon":ae,"ft-text-field-suggestion":Oe};F.styles=[Tr,qi,Pd];q([m()],F.prototype,"label",void 0);q([m({noAccessor:!0})],F.prototype,"value",null);q([M()],F.prototype,"dispatchedValue",void 0);q([m()],F.prototype,"helper",void 0);q([m()],F.prototype,"suggestionsHelper",void 0);q([m({type:Boolean})],F.prototype,"outlined",void 0);q([m({type:Boolean})],F.prototype,"disabled",void 0);q([m({type:Boolean})],F.prototype,"error",void 0);q([m({type:Boolean})],F.prototype,"fixedMenuPosition",void 0);q([m()],F.prototype,"prefix",void 0);q([m()],F.prototype,"icon",void 0);q([m()],F.prototype,"name",void 0);q([m()],F.prototype,"type",void 0);q([m()],F.prototype,"passwordHiddenIcon",void 0);q([m()],F.prototype,"passwordRevealedIcon",void 0);q([m()],F.prototype,"iconVariant",void 0);q([m({type:Boolean})],F.prototype,"filterSuggestions",void 0);q([Xe()],F.prototype,"maxLength",void 0);q([m({type:Boolean})],F.prototype,"password",void 0);q([m({type:String})],F.prototype,"autocomplete",void 0);q([m({attribute:!1})],F.prototype,"suggestionsProvider",void 0);q([m({type:Boolean})],F.prototype,"hideCurrentValueSuggestion",void 0);q([M()],F.prototype,"focused",void 0);q([M()],F.prototype,"inputValid",void 0);q([M()],F.prototype,"hidePassword",void 0);q([M()],F.prototype,"hideSuggestions",void 0);q([M()],F.prototype,"visibleSuggestions",void 0);q([M()],F.prototype,"providedSuggestions",void 0);q([Q(".ft-text-field--main-panel")],F.prototype,"mainPanel",void 0);q([Q(".ft-text-field--input")],F.prototype,"input",void 0);q([Q(".ft-text-field-suggestion--new-value")],F.prototype,"newValueSuggestion",void 0);q([Q(".ft-text-field--suggestions")],F.prototype,"suggestionsContainer",void 0);q([qn("ft-text-field-suggestion")],F.prototype,"providedSuggestionsInDom",void 0);q([Yn({selector:"ft-text-field-suggestion"})],F.prototype,"slottedSuggestions",void 0);q([Tt()],F.prototype,"handleInput",null);q([Tt()],F.prototype,"catchComposingEvents",null);var uu={"ft-text-field":F,"ft-text-field-suggestion":Oe};ee(uu);var U={...$,chipGap:o.extend("--ft-combobox-chip-gap","",l.spacing1),chipsMarginTop:o.extend("--ft-combobox-chips-margin-top","",l.spacing2),suggestSize:o.create("--ft-combobox-suggest-size","","SIZE","370px")},pu=I`
     *:focus {
         outline: none;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fluid-topics/ft-combobox",
-    "version": "2.2.12",
+    "version": "2.2.14",
     "description": "A",
     "keywords": [
         "Lit"
@@ -19,11 +19,11 @@
         "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
     },
     "dependencies": {
-        "@fluid-topics/ft-wc-utils": "2.2.12",
+        "@fluid-topics/ft-wc-utils": "2.2.14",
         "lit": "3.3.3"
     },
     "devDependencies": {
-        "@fluid-topics/ft-wc-test-utils": "2.2.12"
+        "@fluid-topics/ft-wc-test-utils": "2.2.14"
     },
-    "gitHead": "3f8686496b8ce4f3b095e6184e387a89c353c3b8"
+    "gitHead": "854d6984b9b23dbce23a195e12814084a8317fa5"
 }