@fluid-topics/ft-filterable-table 1.3.13 → 1.3.15

package/build/ft-filterable-table.light.js

@@ -699,7 +699,7 @@ Also for action icons.`,r.colorGray200),contentGlobalSubtle:t.extend("--ft-conte
                 <ft-ripple ?primary=${a} ?activated=${a}></ft-ripple>
                 <span>${e.label}</span>
             </div>
-        `}update(e){super.update(e),e.has("options")&&(this.selectedOption=this.options.filter(a=>a.selected)[0]),e.has("selectedOption")&&(this.optionsDisplayed=!1)}contentAvailableCallback(e){var a,i;if(super.contentAvailableCallback(e),e.has("focusOptions")&&this.focusOptions&&((i=(a=this.selectedOptionElement)!==null&&a!==void 0?a:this.firstOption)===null||i===void 0||i.focus(),this.focusOptions=!1),e.has("optionsDisplayed")&&this.hasOptionsMenuOpen){this.optionsMenu.style.width=this.mainPanel.getBoundingClientRect().width+"px";let n=["bottom","top"];(0,re.computeOffsetAutoPosition)(this.mainPanel,this.optionsMenu,"bottom",n,"fixed",A.optionsHeight.name,0).then(({x:c,y:s})=>{this.optionsMenu.style.left=`${c}px`,this.optionsMenu.style.top=`${s}px`})}}get hasOptionsMenuOpen(){return!this.disabled&&this.optionsDisplayed&&this.hasOptions}get hasOptions(){return this.options.length>0}updateOptionsFromSlot(e){var a;e.stopPropagation();let i=(a=this.optionsSlot)===null||a===void 0?void 0:a.assignedElements().map(n=>n);i&&i.length>0&&(this.options=i)}onMainPanelKeyDown(e){switch(e.key){case" ":e.preventDefault(),e.stopPropagation();case"Enter":this.optionsDisplayed=!this.optionsDisplayed,this.focusOptions=!0;break;case"ArrowUp":case"ArrowDown":e.preventDefault(),e.stopPropagation(),this.optionsDisplayed=!0,this.focusOptions=!0;break}}onOptionsKeyDown(e){var a,i,n,c,s;let d;switch(e.key){case"Escape":this.optionsDisplayed=!1,(a=this.mainPanel)===null||a===void 0||a.focus();break;case"Tab":this.optionsDisplayed=!1;break;case"ArrowUp":e.preventDefault(),e.stopPropagation(),d=(n=(i=this.focusedOption)===null||i===void 0?void 0:i.previousElementSibling)!==null&&n!==void 0?n:this.lastOption;break;case"ArrowDown":e.preventDefault(),e.stopPropagation(),d=(s=(c=this.focusedOption)===null||c===void 0?void 0:c.nextElementSibling)!==null&&s!==void 0?s:this.firstOption;break;default:if(e.key.length!=1)break;this.isKeyAlphanumeric(e.key)&&(d=this.handleAlphanumericPress(e.key));break}d?.focus()}isKeyAlphanumeric(e){let a=e.charCodeAt(0);return a>47&&a<58||a>64&&a<91||a>96&&a<123}handleAlphanumericPress(e){var a,i;let n=new Date;n.getTime()-this.lastSearchInputDate.getTime()>o.searchTimeoutMilliseconds&&(this.currentSearch=""),this.currentSearch+=e.toLowerCase();let c=this.options.find(d=>{var f;return((f=d.label)===null||f===void 0?void 0:f.toLowerCase().substring(0,this.currentSearch.length))===this.currentSearch});if(c===void 0){this.lastSearchInputDate=n;return}let s=(i=(a=this.optionsMenu)===null||a===void 0?void 0:a.querySelector(`[data-value="${c.value}"]`))!==null&&i!==void 0?i:void 0;return this.lastSearchInputDate=n,s}onOptionKeyDown(e,a){var i;(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),e.stopPropagation(),this.selectOption(a),this.optionsDisplayed=!1,(i=this.mainPanel)===null||i===void 0||i.focus())}selectOption(e){var a,i;if(!(0,re.deepEqual)((a=this.selectedOption)===null||a===void 0?void 0:a.value,e.value)){this.selectedOption=e;for(let n of this.options)n.selected=n===e;this.dispatchEvent(new CustomEvent("change",{detail:(i=this.selectedOption)===null||i===void 0?void 0:i.value}))}this.optionsDisplayed=!1}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.hideOptions)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.hideOptions)}};W.elementDefinitions={"ft-input-label":mt,"ft-typography":it,"ft-ripple":z,"ft-icon":tt};W.searchTimeoutMilliseconds=2e3;W.styles=[eo,Mt,Ba];_([(0,T.property)({type:String})],W.prototype,"label",void 0);_([(0,T.property)({type:String})],W.prototype,"ariaLabel",void 0);_([(0,T.property)({type:String})],W.prototype,"helper",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"outlined",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"disabled",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"error",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"fixedMenuPosition",void 0);_([(0,T.property)({type:Array})],W.prototype,"options",void 0);_([(0,T.state)()],W.prototype,"selectedOption",void 0);_([(0,T.state)()],W.prototype,"optionsDisplayed",void 0);_([(0,T.state)()],W.prototype,"focusOptions",void 0);_([(0,T.state)()],W.prototype,"currentSearch",void 0);_([(0,T.state)()],W.prototype,"lastSearchInputDate",void 0);_([(0,T.query)(".ft-select")],W.prototype,"container",void 0);_([(0,T.query)(".ft-select--options")],W.prototype,"optionsMenu",void 0);_([(0,T.query)(".ft-select--input-panel")],W.prototype,"mainPanel",void 0);_([(0,T.query)(".ft-select--option:first-child")],W.prototype,"firstOption",void 0);_([(0,T.query)(".ft-select--option:focus")],W.prototype,"focusedOption",void 0);_([(0,T.query)(".ft-select--option.ft-select--option-selected")],W.prototype,"selectedOptionElement",void 0);_([(0,T.query)(".ft-select--option:last-child")],W.prototype,"lastOption",void 0);_([(0,T.query)("slot:not([name])")],W.prototype,"optionsSlot",void 0);(0,Wo.customElement)("ft-select")(W);(0,Wo.customElement)("ft-select-option")(Vt);var Do=g(L());var et=g(D()),P=g(ut()),Ga=g(Ke()),Ua=g(_t());var ro=o=>o??K;var Kt=g(L());var za=g(D()),O=g(L());var N={fontSize:O.FtCssVariableFactory.create("--ft-text-field-font-size","","SIZE","14px"),labelSize:O.FtCssVariableFactory.create("--ft-text-field-label-size","","SIZE","11px"),verticalSpacing:O.FtCssVariableFactory.create("--ft-text-field-vertical-spacing","","SIZE","4px"),horizontalSpacing:O.FtCssVariableFactory.create("--ft-text-field-horizontal-spacing","","SIZE","16px"),helperColor:O.FtCssVariableFactory.extend("--ft-text-field-helper-color","",O.designSystemVariables.colorOnSurfaceMedium),colorPrimary:O.FtCssVariableFactory.external(O.designSystemVariables.colorPrimary,"Design system"),colorOnSurface:O.FtCssVariableFactory.external(O.designSystemVariables.colorOnSurface,"Design system"),colorOnSurfaceDisabled:O.FtCssVariableFactory.external(O.designSystemVariables.colorOnSurfaceDisabled,"Design system"),borderRadiusS:O.FtCssVariableFactory.external(O.designSystemVariables.borderRadiusS,"Design system"),colorError:O.FtCssVariableFactory.external(O.designSystemVariables.colorError,"Design system"),prefixColor:O.FtCssVariableFactory.extend("--ft-text-field-prefix-color","",O.designSystemVariables.colorOnSurfaceMedium),iconColor:O.FtCssVariableFactory.extend("--ft-text-field-icon-color","",O.designSystemVariables.colorOnSurfaceMedium),floatingZIndex:O.FtCssVariableFactory.create("--ft-text-field-floating-components-z-index","","NUMBER","3"),backgroundColor:O.FtCssVariableFactory.extend("--ft-text-field-background-color","",O.designSystemVariables.colorSurface),colorOutline:O.FtCssVariableFactory.external(O.designSystemVariables.colorOutline,"Design system"),elevation02:O.FtCssVariableFactory.external(O.designSystemVariables.elevation02,"Design system"),suggestSize:O.FtCssVariableFactory.create("--ft-text-field-suggest-size","","SIZE","300px")},Wa=za.css`
+        `}update(e){super.update(e),e.has("options")&&(this.selectedOption=this.options.filter(a=>a.selected)[0]),e.has("selectedOption")&&(this.optionsDisplayed=!1)}contentAvailableCallback(e){var a,i;if(super.contentAvailableCallback(e),e.has("focusOptions")&&this.focusOptions&&((i=(a=this.selectedOptionElement)!==null&&a!==void 0?a:this.firstOption)===null||i===void 0||i.focus(),this.focusOptions=!1),e.has("optionsDisplayed")&&this.hasOptionsMenuOpen){this.optionsMenu.style.width=this.mainPanel.getBoundingClientRect().width+"px";let n=["bottom","top"];(0,re.computeOffsetAutoPosition)(this.mainPanel,this.optionsMenu,"bottom",n,"fixed",A.optionsHeight,0).then(({x:c,y:s})=>{this.optionsMenu.style.left=`${c}px`,this.optionsMenu.style.top=`${s}px`})}}get hasOptionsMenuOpen(){return!this.disabled&&this.optionsDisplayed&&this.hasOptions}get hasOptions(){return this.options.length>0}updateOptionsFromSlot(e){var a;e.stopPropagation();let i=(a=this.optionsSlot)===null||a===void 0?void 0:a.assignedElements().map(n=>n);i&&i.length>0&&(this.options=i)}onMainPanelKeyDown(e){switch(e.key){case" ":e.preventDefault(),e.stopPropagation();case"Enter":this.optionsDisplayed=!this.optionsDisplayed,this.focusOptions=!0;break;case"ArrowUp":case"ArrowDown":e.preventDefault(),e.stopPropagation(),this.optionsDisplayed=!0,this.focusOptions=!0;break}}onOptionsKeyDown(e){var a,i,n,c,s;let d;switch(e.key){case"Escape":this.optionsDisplayed=!1,(a=this.mainPanel)===null||a===void 0||a.focus();break;case"Tab":this.optionsDisplayed=!1;break;case"ArrowUp":e.preventDefault(),e.stopPropagation(),d=(n=(i=this.focusedOption)===null||i===void 0?void 0:i.previousElementSibling)!==null&&n!==void 0?n:this.lastOption;break;case"ArrowDown":e.preventDefault(),e.stopPropagation(),d=(s=(c=this.focusedOption)===null||c===void 0?void 0:c.nextElementSibling)!==null&&s!==void 0?s:this.firstOption;break;default:if(e.key.length!=1)break;this.isKeyAlphanumeric(e.key)&&(d=this.handleAlphanumericPress(e.key));break}d?.focus()}isKeyAlphanumeric(e){let a=e.charCodeAt(0);return a>47&&a<58||a>64&&a<91||a>96&&a<123}handleAlphanumericPress(e){var a,i;let n=new Date;n.getTime()-this.lastSearchInputDate.getTime()>o.searchTimeoutMilliseconds&&(this.currentSearch=""),this.currentSearch+=e.toLowerCase();let c=this.options.find(d=>{var f;return((f=d.label)===null||f===void 0?void 0:f.toLowerCase().substring(0,this.currentSearch.length))===this.currentSearch});if(c===void 0){this.lastSearchInputDate=n;return}let s=(i=(a=this.optionsMenu)===null||a===void 0?void 0:a.querySelector(`[data-value="${c.value}"]`))!==null&&i!==void 0?i:void 0;return this.lastSearchInputDate=n,s}onOptionKeyDown(e,a){var i;(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),e.stopPropagation(),this.selectOption(a),this.optionsDisplayed=!1,(i=this.mainPanel)===null||i===void 0||i.focus())}selectOption(e){var a,i;if(!(0,re.deepEqual)((a=this.selectedOption)===null||a===void 0?void 0:a.value,e.value)){this.selectedOption=e;for(let n of this.options)n.selected=n===e;this.dispatchEvent(new CustomEvent("change",{detail:(i=this.selectedOption)===null||i===void 0?void 0:i.value}))}this.optionsDisplayed=!1}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.hideOptions)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.hideOptions)}};W.elementDefinitions={"ft-input-label":mt,"ft-typography":it,"ft-ripple":z,"ft-icon":tt};W.searchTimeoutMilliseconds=2e3;W.styles=[eo,Mt,Ba];_([(0,T.property)({type:String})],W.prototype,"label",void 0);_([(0,T.property)({type:String})],W.prototype,"ariaLabel",void 0);_([(0,T.property)({type:String})],W.prototype,"helper",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"outlined",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"disabled",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"error",void 0);_([(0,T.property)({type:Boolean})],W.prototype,"fixedMenuPosition",void 0);_([(0,T.property)({type:Array})],W.prototype,"options",void 0);_([(0,T.state)()],W.prototype,"selectedOption",void 0);_([(0,T.state)()],W.prototype,"optionsDisplayed",void 0);_([(0,T.state)()],W.prototype,"focusOptions",void 0);_([(0,T.state)()],W.prototype,"currentSearch",void 0);_([(0,T.state)()],W.prototype,"lastSearchInputDate",void 0);_([(0,T.query)(".ft-select")],W.prototype,"container",void 0);_([(0,T.query)(".ft-select--options")],W.prototype,"optionsMenu",void 0);_([(0,T.query)(".ft-select--input-panel")],W.prototype,"mainPanel",void 0);_([(0,T.query)(".ft-select--option:first-child")],W.prototype,"firstOption",void 0);_([(0,T.query)(".ft-select--option:focus")],W.prototype,"focusedOption",void 0);_([(0,T.query)(".ft-select--option.ft-select--option-selected")],W.prototype,"selectedOptionElement",void 0);_([(0,T.query)(".ft-select--option:last-child")],W.prototype,"lastOption",void 0);_([(0,T.query)("slot:not([name])")],W.prototype,"optionsSlot",void 0);(0,Wo.customElement)("ft-select")(W);(0,Wo.customElement)("ft-select-option")(Vt);var Do=g(L());var et=g(D()),P=g(ut()),Ga=g(Ke()),Ua=g(_t());var ro=o=>o??K;var Kt=g(L());var za=g(D()),O=g(L());var N={fontSize:O.FtCssVariableFactory.create("--ft-text-field-font-size","","SIZE","14px"),labelSize:O.FtCssVariableFactory.create("--ft-text-field-label-size","","SIZE","11px"),verticalSpacing:O.FtCssVariableFactory.create("--ft-text-field-vertical-spacing","","SIZE","4px"),horizontalSpacing:O.FtCssVariableFactory.create("--ft-text-field-horizontal-spacing","","SIZE","16px"),helperColor:O.FtCssVariableFactory.extend("--ft-text-field-helper-color","",O.designSystemVariables.colorOnSurfaceMedium),colorPrimary:O.FtCssVariableFactory.external(O.designSystemVariables.colorPrimary,"Design system"),colorOnSurface:O.FtCssVariableFactory.external(O.designSystemVariables.colorOnSurface,"Design system"),colorOnSurfaceDisabled:O.FtCssVariableFactory.external(O.designSystemVariables.colorOnSurfaceDisabled,"Design system"),borderRadiusS:O.FtCssVariableFactory.external(O.designSystemVariables.borderRadiusS,"Design system"),colorError:O.FtCssVariableFactory.external(O.designSystemVariables.colorError,"Design system"),prefixColor:O.FtCssVariableFactory.extend("--ft-text-field-prefix-color","",O.designSystemVariables.colorOnSurfaceMedium),iconColor:O.FtCssVariableFactory.extend("--ft-text-field-icon-color","",O.designSystemVariables.colorOnSurfaceMedium),floatingZIndex:O.FtCssVariableFactory.create("--ft-text-field-floating-components-z-index","","NUMBER","3"),backgroundColor:O.FtCssVariableFactory.extend("--ft-text-field-background-color","",O.designSystemVariables.colorSurface),colorOutline:O.FtCssVariableFactory.external(O.designSystemVariables.colorOutline,"Design system"),elevation02:O.FtCssVariableFactory.external(O.designSystemVariables.elevation02,"Design system"),suggestSize:O.FtCssVariableFactory.create("--ft-text-field-suggest-size","","SIZE","300px")},Wa=za.css`
     *:focus {
         outline: none;
     }