@fluid-topics/ft-select 2.1.18 → 2.1.20

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.
@@ -175,12 +175,12 @@ export class FtSelect extends FtLitElement {
175
175
  }
176
176
  }
177
177
  onMainPanelKeyDown(e) {
178
+ if (e.key === " ") {
179
+ e.preventDefault();
180
+ e.stopPropagation();
181
+ }
178
182
  switch (e.key) {
179
- // @ts-ignore
180
183
  case " ":
181
- e.preventDefault();
182
- e.stopPropagation();
183
- // No break
184
184
  case "Enter":
185
185
  this.optionsDisplayed = !this.optionsDisplayed;
186
186
  this.focusOptions = true;
@@ -641,7 +641,7 @@
641
641
  label="${t.label}"
642
642
  .value=${t.value}
643
643
  ></ft-select-option>
644
- `}willUpdate(t){super.willUpdate(t),t.has("options")&&(this.selectedOption=this.options.filter(i=>i.selected)[0]),t.has("selectedOption")&&(this.optionsDisplayed=!1)}contentAvailableCallback(t){var i,o;if(super.contentAvailableCallback(t),t.has("focusOptions")&&this.focusOptions&&((o=(i=this.selectedOptionElement)!==null&&i!==void 0?i:this.firstOption)===null||o===void 0||o.focus(),this.focusOptions=!1),t.has("optionsDisplayed")&&this.hasOptionsMenuOpen){this.optionsMenu.style.minWidth=this.mainPanel.getBoundingClientRect().width+"px";let r=["bottom","top"];(0,w.computeOffsetAutoPosition)(this.mainPanel,this.optionsMenu,"bottom",r,"fixed",u.optionsHeight,0).then(({x:n,y:l})=>{this.optionsMenu.style.left=`${n}px`,this.optionsMenu.style.top=`${l}px`})}}get hasOptionsMenuOpen(){return!this.disabled&&this.optionsDisplayed&&this.hasOptions}get hasOptions(){return this.options.length>0}updateOptionsFromSlot(t){var i;t.stopPropagation(),this.isSlotEmpty=(0,w.isSlotEmptyOrWithoutContent)(this.optionsSlot);let o=(i=this.optionsSlot)===null||i===void 0?void 0:i.assignedElements().map(r=>r);o&&o.length>0&&(this.options=o)}onMainPanelKeyDown(t){switch(t.key){case" ":t.preventDefault(),t.stopPropagation();case"Enter":this.optionsDisplayed=!this.optionsDisplayed,this.focusOptions=!0;break;case"ArrowUp":case"ArrowDown":t.preventDefault(),t.stopPropagation(),this.optionsDisplayed=!0,this.focusOptions=!0;break}}onOptionsKeyDown(t){var i,o;let r,n=this.focusedOption?this.optionsList.indexOf(this.focusedOption):0;switch(t.key){case" ":case"Enter":t.preventDefault(),t.stopPropagation(),this.onSelectOption(t),this.optionsDisplayed=!1,(i=this.mainPanel)===null||i===void 0||i.focus();break;case"Escape":this.optionsDisplayed=!1,(o=this.mainPanel)===null||o===void 0||o.focus();break;case"Tab":this.optionsDisplayed=!1;break;case"ArrowUp":t.preventDefault(),t.stopPropagation(),r=this.optionsList[(n-1+this.optionsList.length)%this.optionsList.length];break;case"ArrowDown":t.preventDefault(),t.stopPropagation(),r=this.optionsList[(n+1)%this.optionsList.length];break;default:if(t.key.length!=1)break;this.isKeyAlphanumeric(t.key)&&(r=this.handleAlphanumericPress(t.key));break}r?.focus()}isKeyAlphanumeric(t){let i=t.charCodeAt(0);return i>47&&i<58||i>64&&i<91||i>96&&i<123}handleAlphanumericPress(t){let i=new Date;i.getTime()-this.lastSearchInputDate.getTime()>e.searchTimeoutMilliseconds&&(this.currentSearch=""),this.currentSearch+=t.toLowerCase();let o=this.options.find(r=>{var n;return((n=r.label)===null||n===void 0?void 0:n.toLowerCase().substring(0,this.currentSearch.length))===this.currentSearch});return this.lastSearchInputDate=i,o&&this.optionsList.find(r=>r.value===o.value)}getOptionId(t){if(!t)return;let i=this.options.findIndex(o=>(0,w.deepEqual)(o.value,t.value));if(i!==-1)return`option-${i}`}onSelectOption(t){t.stopPropagation(),this.setValue(t.target.value)}setValue(t,i=!0){let o=this.options.find(r=>(0,w.deepEqual)(r.value,t));o&&this.selectOption(o,i)}selectOption(t,i=!0){var o,r;if(!(0,w.deepEqual)((o=this.selectedOption)===null||o===void 0?void 0:o.value,t?.value)){this.selectedOption=t;for(let n of this.options)n.selected=n===t;i&&this.dispatchEvent(new CustomEvent("change",{detail:(r=this.selectedOption)===null||r===void 0?void 0:r.value}))}this.optionsDisplayed=!1}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.hideOptions)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.hideOptions)}};v.elementDefinitions={"ft-input-label":M,"ft-typography":k,"ft-ripple":b,"ft-icon":D,"ft-select-option":L};v.searchTimeoutMilliseconds=2e3;v.styles=[he,li];T([(0,E.property)({type:String})],v.prototype,"label",void 0);T([(0,E.property)({type:String})],v.prototype,"ariaLabel",void 0);T([(0,E.property)({type:String})],v.prototype,"helper",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"outlined",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"disabled",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"error",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"fixedMenuPosition",void 0);T([(0,E.property)({type:Array})],v.prototype,"options",void 0);T([(0,E.state)()],v.prototype,"selectedOption",void 0);T([(0,E.state)()],v.prototype,"optionsDisplayed",void 0);T([(0,E.state)()],v.prototype,"focusOptions",void 0);T([(0,E.state)()],v.prototype,"currentSearch",void 0);T([(0,E.state)()],v.prototype,"lastSearchInputDate",void 0);T([(0,E.query)(".ft-select")],v.prototype,"container",void 0);T([(0,E.query)(".ft-select--options")],v.prototype,"optionsMenu",void 0);T([(0,E.query)(".ft-select--input-panel")],v.prototype,"mainPanel",void 0);T([(0,E.query)("slot:not([name])")],v.prototype,"optionsSlot",void 0);var hi={"ft-select":v,"ft-select-option":L};(0,ci.customElements)(hi);})();
644
+ `}willUpdate(t){super.willUpdate(t),t.has("options")&&(this.selectedOption=this.options.filter(i=>i.selected)[0]),t.has("selectedOption")&&(this.optionsDisplayed=!1)}contentAvailableCallback(t){var i,o;if(super.contentAvailableCallback(t),t.has("focusOptions")&&this.focusOptions&&((o=(i=this.selectedOptionElement)!==null&&i!==void 0?i:this.firstOption)===null||o===void 0||o.focus(),this.focusOptions=!1),t.has("optionsDisplayed")&&this.hasOptionsMenuOpen){this.optionsMenu.style.minWidth=this.mainPanel.getBoundingClientRect().width+"px";let r=["bottom","top"];(0,w.computeOffsetAutoPosition)(this.mainPanel,this.optionsMenu,"bottom",r,"fixed",u.optionsHeight,0).then(({x:n,y:l})=>{this.optionsMenu.style.left=`${n}px`,this.optionsMenu.style.top=`${l}px`})}}get hasOptionsMenuOpen(){return!this.disabled&&this.optionsDisplayed&&this.hasOptions}get hasOptions(){return this.options.length>0}updateOptionsFromSlot(t){var i;t.stopPropagation(),this.isSlotEmpty=(0,w.isSlotEmptyOrWithoutContent)(this.optionsSlot);let o=(i=this.optionsSlot)===null||i===void 0?void 0:i.assignedElements().map(r=>r);o&&o.length>0&&(this.options=o)}onMainPanelKeyDown(t){switch(t.key===" "&&(t.preventDefault(),t.stopPropagation()),t.key){case" ":case"Enter":this.optionsDisplayed=!this.optionsDisplayed,this.focusOptions=!0;break;case"ArrowUp":case"ArrowDown":t.preventDefault(),t.stopPropagation(),this.optionsDisplayed=!0,this.focusOptions=!0;break}}onOptionsKeyDown(t){var i,o;let r,n=this.focusedOption?this.optionsList.indexOf(this.focusedOption):0;switch(t.key){case" ":case"Enter":t.preventDefault(),t.stopPropagation(),this.onSelectOption(t),this.optionsDisplayed=!1,(i=this.mainPanel)===null||i===void 0||i.focus();break;case"Escape":this.optionsDisplayed=!1,(o=this.mainPanel)===null||o===void 0||o.focus();break;case"Tab":this.optionsDisplayed=!1;break;case"ArrowUp":t.preventDefault(),t.stopPropagation(),r=this.optionsList[(n-1+this.optionsList.length)%this.optionsList.length];break;case"ArrowDown":t.preventDefault(),t.stopPropagation(),r=this.optionsList[(n+1)%this.optionsList.length];break;default:if(t.key.length!=1)break;this.isKeyAlphanumeric(t.key)&&(r=this.handleAlphanumericPress(t.key));break}r?.focus()}isKeyAlphanumeric(t){let i=t.charCodeAt(0);return i>47&&i<58||i>64&&i<91||i>96&&i<123}handleAlphanumericPress(t){let i=new Date;i.getTime()-this.lastSearchInputDate.getTime()>e.searchTimeoutMilliseconds&&(this.currentSearch=""),this.currentSearch+=t.toLowerCase();let o=this.options.find(r=>{var n;return((n=r.label)===null||n===void 0?void 0:n.toLowerCase().substring(0,this.currentSearch.length))===this.currentSearch});return this.lastSearchInputDate=i,o&&this.optionsList.find(r=>r.value===o.value)}getOptionId(t){if(!t)return;let i=this.options.findIndex(o=>(0,w.deepEqual)(o.value,t.value));if(i!==-1)return`option-${i}`}onSelectOption(t){t.stopPropagation(),this.setValue(t.target.value)}setValue(t,i=!0){let o=this.options.find(r=>(0,w.deepEqual)(r.value,t));o&&this.selectOption(o,i)}selectOption(t,i=!0){var o,r;if(!(0,w.deepEqual)((o=this.selectedOption)===null||o===void 0?void 0:o.value,t?.value)){this.selectedOption=t;for(let n of this.options)n.selected=n===t;i&&this.dispatchEvent(new CustomEvent("change",{detail:(r=this.selectedOption)===null||r===void 0?void 0:r.value}))}this.optionsDisplayed=!1}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.hideOptions)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.hideOptions)}};v.elementDefinitions={"ft-input-label":M,"ft-typography":k,"ft-ripple":b,"ft-icon":D,"ft-select-option":L};v.searchTimeoutMilliseconds=2e3;v.styles=[he,li];T([(0,E.property)({type:String})],v.prototype,"label",void 0);T([(0,E.property)({type:String})],v.prototype,"ariaLabel",void 0);T([(0,E.property)({type:String})],v.prototype,"helper",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"outlined",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"disabled",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"error",void 0);T([(0,E.property)({type:Boolean})],v.prototype,"fixedMenuPosition",void 0);T([(0,E.property)({type:Array})],v.prototype,"options",void 0);T([(0,E.state)()],v.prototype,"selectedOption",void 0);T([(0,E.state)()],v.prototype,"optionsDisplayed",void 0);T([(0,E.state)()],v.prototype,"focusOptions",void 0);T([(0,E.state)()],v.prototype,"currentSearch",void 0);T([(0,E.state)()],v.prototype,"lastSearchInputDate",void 0);T([(0,E.query)(".ft-select")],v.prototype,"container",void 0);T([(0,E.query)(".ft-select--options")],v.prototype,"optionsMenu",void 0);T([(0,E.query)(".ft-select--input-panel")],v.prototype,"mainPanel",void 0);T([(0,E.query)("slot:not([name])")],v.prototype,"optionsSlot",void 0);var hi={"ft-select":v,"ft-select-option":L};(0,ci.customElements)(hi);})();
645
645
  /*! Bundled license information:
646
646
 
647
647
  lit-html/directives/when.js: