@sankhyalabs/ezui 7.3.3 → 7.3.4-dev.1

package/dist/ezui/p-7fe97ef5.entry.js

@@ -1 +0,0 @@
-import{r as i,c as t,h as s,H as o,g as e}from"./p-23a36bb6.js";import{ElementIDUtils as h,KeyboardManager as a}from"@sankhyalabs/core";const l=class{constructor(s){i(this,s),this.ezChange=t(this,"ezChange",7),this.ezBlur=t(this,"ezBlur",7),this.iconClick=t(this,"iconClick",7),this.ezVisibilityChange=t(this,"ezVisibilityChange",7),this.ezType=t(this,"ezType",7),this._keyboardManager=void 0,this._boundHandleDocumentClick=this.handleDocumentClick.bind(this),this.popoverVisible=!1,this.hasSlotContent=!1,this.highlightedIndex=0,this.filteredOptions=[],this.inputValue="",this.value=null,this.label=void 0,this.placeholder=void 0,this.enabled=!0,this.readonly=!1,this.name=void 0,this.state="default",this.helpText=void 0,this.iconName=void 0,this.titleIcon=void 0,this.iconClickable=!1,this.suppressSearch=!1,this.options=void 0,this.textEmptyOption=void 0,this.suppressEmptyOption=!1}async setFocus(i){var t;await(null===(t=this._inputElem)||void 0===t?void 0:t.setFocus(i))}async setBlur(){var i;await(null===(i=this._inputElem)||void 0===i?void 0:i.setBlur()),await this.hidePopover()}async showPopover(){var i,t,s;if(!this._popoverElem||!this._inputElem||this.popoverVisible)return;this.popoverVisible=!0;const o=null===(t=null===(i=this._inputElem)||void 0===i?void 0:i.shadowRoot)||void 0===t?void 0:t.querySelector(".input-container");await(null===(s=this._popoverElem)||void 0===s?void 0:s.showUnder(null!=o?o:this._inputElem))}async hidePopover(){var i;this.popoverVisible=!1,await(null===(i=this._popoverElem)||void 0===i?void 0:i.hide())}compareOptionValues(i,t){var s,o;return JSON.stringify(null!==(s=null==i?void 0:i.value)&&void 0!==s?s:null)===JSON.stringify(null!==(o=null==t?void 0:t.value)&&void 0!==o?o:null)}setEmptyValue(){this.value=null,this.inputValue=""}async setValue(i){if(!i||!this.options)return this.setEmptyValue(),void await this.hidePopover();this.compareOptionValues(this.value,i)||(i.value?(this.value=i,this.inputValue=i.label):this.setEmptyValue(),this.ezChange.emit(this.value)),await this.hidePopover()}async optionsChanged(){this.filterOptions("")}async valueChanged(i){i?(this.inputValue=i.label,this.setHighlightedIndexToValue()):(this.inputValue="",this.highlightedIndex=0)}async handleIconClick(i){i.stopPropagation(),i.preventDefault(),"right"===i.detail.icon?this.popoverVisible?await this.hidePopover():await this.showPopover():this.iconClick.emit()}async handleEzChange(i){i.stopPropagation(),this.inputValue=i.detail,!this.popoverVisible&&this.inputValue.length>0&&await this.showPopover(),this.ezType.emit(this.inputValue),this.highlightedIndex=0,this.filterOptions(this.inputValue)}async handleEzBlur(i){var t,s;i.stopPropagation(),(null===(t=this.value)||void 0===t?void 0:t.label)!==this.inputValue&&(this.inputValue=(null===(s=this.value)||void 0===s?void 0:s.label)||""),this.ezBlur.emit(this.value)}filterOptions(i){if(!this.options)return void(this.filteredOptions=[]);let t=[];if(i&&""!==i.trim()){const s=i.toLowerCase().trim();t=t.concat(this.options.filter((i=>i.label.toLowerCase().includes(s)||i.value.toLowerCase().includes(s))))}else t=t.concat([...this.options]);!this.suppressEmptyOption&&t.length>0&&(t=[{value:null,label:this.textEmptyOption||"Selecione um item"},...t]),this.filteredOptions=t,this.setHighlightedIndexToValue(),this.scrollToHighlightedOption()}scrollToHighlightedOption(){if(this.highlightedIndex<0||!this._listElem)return;const i=this._listElem.children[this.highlightedIndex];i&&i.scrollIntoView({behavior:"smooth",block:"nearest",inline:"start"})}async selectOption(i){i&&!this.readonly&&this.enabled&&await this.setValue(i)}async handleArrowUp(){var i;this.popoverVisible?((null===(i=this.filteredOptions)||void 0===i?void 0:i.length)||0)<=0||this.highlightedIndex<=0||(this.highlightedIndex=Math.max(0,this.highlightedIndex-1),this.scrollToHighlightedOption()):await this.showPopover()}handleArrowDown(){var i;if(!this.popoverVisible)return void this.showPopover();const t=(null===(i=this.filteredOptions)||void 0===i?void 0:i.length)||0;t<=0||(this.highlightedIndex=Math.min(t-1,this.highlightedIndex+1),this.scrollToHighlightedOption())}async selectCurrentItem(){!this.popoverVisible||this.highlightedIndex<0||(this.hasSlotContent||0===this.filteredOptions.length||this.readonly||!this.enabled?await this.hidePopover():this.filteredOptions&&this.filteredOptions[this.highlightedIndex]&&this.selectOption(this.filteredOptions[this.highlightedIndex]))}handleVisibilityChange(i){this.popoverVisible=i.detail,this.ezVisibilityChange.emit(this.popoverVisible)}checkSlotContent(){const i=this._element.querySelector("slot")||this._element;this.hasSlotContent=i instanceof HTMLSlotElement?i.assignedNodes().length>0:i.children.length>0}setHighlightedIndexToValue(){if(this.value&&this.filteredOptions){const i=this.filteredOptions.findIndex((i=>i.value===this.value.value));if(i>=0)return void(this.highlightedIndex=i);this.highlightedIndex=0}}async handleDocumentClick(i){const t=i.target;this._element.contains(t)||this._popoverElem.contains(t)||await this.hidePopover()}addInfoId(){const i={id:"embedded"};this._element&&h.addIDInfo(this._element),this._inputElem&&h.addIDInfo(this._inputElem,"classic-combo-box-input",i),this._popoverElem&&h.addIDInfo(this._popoverElem,"classic-combo-box-popover",i)}async initKeyboardManager(){this._keyboardManager=new a({element:this._element,propagate:!0}),this._keyboardManager.bind("ArrowUp",(()=>this.handleArrowUp()),{propagate:!1}).bind("ArrowDown",(()=>this.handleArrowDown()),{propagate:!1}).bind("Enter",(()=>this.selectCurrentItem()),{propagate:!1}).bind("Tab",(()=>this.selectCurrentItem())).bind("shift+Tab",(()=>this.selectCurrentItem())).bind("Escape",(()=>this.hidePopover()))}async connectedCallback(){await this.initKeyboardManager(),document.addEventListener("mouseup",this._boundHandleDocumentClick)}disconnectedCallback(){this._keyboardManager.unbindAllShortcutKeys(),document.removeEventListener("mouseup",this._boundHandleDocumentClick)}componentWillLoad(){this.filterOptions("")}componentDidLoad(){this.addInfoId(),this.checkSlotContent(),this.value&&(this.inputValue=this.value.label,this.setHighlightedIndexToValue())}render(){var i;return s(o,null,s("ez-classic-input",{ref:i=>this._inputElem=i,name:this.name,label:this.label,placeholder:this.placeholder,value:this.inputValue,state:this.state,enabled:this.enabled,readonly:this.readonly||this.suppressSearch,leftIconName:this.iconName,leftIconTooltip:this.titleIcon,leftIconClickable:this.iconClickable,rightIconClickable:!0,helpText:this.helpText,rightIconName:this.popoverVisible?"chevron-up":"chevron-down",onIconClick:this.handleIconClick.bind(this),onEzChange:this.handleEzChange.bind(this),onEzFocus:this.showPopover.bind(this),onEzBlur:this.handleEzBlur.bind(this)}),s("ez-popover-core",{ref:i=>this._popoverElem=i,useAnchorSize:!0,onEzVisibilityChange:this.handleVisibilityChange.bind(this),overlayType:"none",options:{verticalGap:2,horizontalGap:0},autoClose:!1},s("slot",{onSlotchange:this.checkSlotContent.bind(this)}),!this.hasSlotContent&&((null===(i=this.filteredOptions)||void 0===i?void 0:i.length)>0?s("ul",{ref:i=>this._listElem=i,tabIndex:-1},this.filteredOptions.map(((i,t)=>{var o,e;return s("li",{key:null!==(o=i.value)&&void 0!==o?o:"__empty__",value:i.value,class:{highlighted:this.highlightedIndex===t,selected:(null===(e=this.value)||void 0===e?void 0:e.value)===i.value},onMouseDown:()=>this.selectOption(i)},i.label)}))):s("span",{class:"no-results"},"Nenhum resultado encontrado"))))}get _element(){return e(this)}static get watchers(){return{options:["optionsChanged"],value:["valueChanged"]}}};l.style=":host{display:block;box-sizing:border-box;font-family:var(--font--pattern, 'Roboto', Arial, sans-serif);font-size:var(--font-size--default, 14px);color:var(--color--gray-500, #494A4E);--ez-classic-combo-box-highlighted-bg-color:var(--color--gray-90, #EAEAEA);--ez-classic-combo-box-max-height:180px;--ez-classic-combo-box-list-bg-color:var(--color--gray-70, #FFFFFF);--ez-classic-combo-box-item-hover-bg-color:var(--color--gray-100, #DEDEDE);--ez-classic-combo-box-selected-bg-color:var(--color--ocean-green-90, #E6F3EF);--ez-classic-combo-box-selected-text-color:var(--color--ocean-green-600, #008561);--ez-classic-combo-box-selected-font-weight:var(--font-weight--medium, 500);--ez-classic-combo-box-item-padding:var(--space--8, 8px) var(--space--4, 4px);--ez-classic-combo-box-item-border-radius:var(--border--radius-8, 8px);--ez-classic-combo-box-list-margin:var(--space--6, 6px);--ez-classic-combo-box-transition-duration:150ms;--ez-classic-combo-box-scrollbar-color:var(--color--gray-300, #C4C4C4);--ez-classic-combo-box-no-results-margin:var(--space--52, 52px) 0;--ez-classic-combo-box-item-text-color:inherit;--ez-classic-combo-box-item-min-height:auto}ul{list-style:none;padding:0;margin:var(--ez-classic-combo-box-list-margin);display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--ez-classic-combo-box-scrollbar-color) transparent;max-height:var(--ez-classic-combo-box-max-height);scroll-behavior:smooth;background-color:var(--ez-classic-combo-box-list-bg-color)}li{cursor:pointer;border-radius:var(--ez-classic-combo-box-item-border-radius);padding:var(--ez-classic-combo-box-item-padding);transition:var(--ez-classic-combo-box-transition-duration) background-color linear;color:var(--ez-classic-combo-box-item-text-color);min-height:var(--ez-classic-combo-box-item-min-height)}li:hover{background-color:var(--ez-classic-combo-box-item-hover-bg-color)}li.highlighted{background-color:var(--ez-classic-combo-box-highlighted-bg-color)}li.selected{background-color:var(--ez-classic-combo-box-selected-bg-color);color:var(--ez-classic-combo-box-selected-text-color);font-weight:var(--ez-classic-combo-box-selected-font-weight)}span.no-results{margin:var(--ez-classic-combo-box-no-results-margin);cursor:default;text-align:center;display:flex;align-items:center;justify-content:center}";export{l as ez_classic_combo_box}