@momentum-design/components 0.133.20 → 0.133.21

package/dist/browser/index.js

@@ -5708,7 +5708,7 @@
   slot[name='filters']::slotted(:first-child) {
     margin-left: 0.25rem;
   }
-`,ny=[xS];var ly=z.constructTagName("searchfield"),ac={TYPE:bo.SEARCH,ICON:"search-bold",CLOSE_BTN:!0};var AS=[wd,na,$l],dy=AS.join(", ");var Es=class extends hi(Lt(jr)){constructor(){super(...arguments);this.isInputFocused=!1;this.hasChips=!1;this.focusedChipIndex=-1;this.navigatingToInput=!1;this.chipsWithListeners=new WeakMap;this.handleChipKeyDown=t=>{let e=this.getActionForKeyEvent(t);if(t.key==="Backspace"||t.key==="Delete"){t.preventDefault(),this.removeChipAtIndex(this.focusedChipIndex);return}if(e===Y.LEFT){t.preventDefault(),this.focusedChipIndex>0&&this.focusChipAtIndex(this.focusedChipIndex-1);return}if(e===Y.RIGHT){t.preventDefault(),this.chips&&this.focusedChipIndex<this.chips.length-1?this.focusChipAtIndex(this.focusedChipIndex+1):this.focusInputField();return}if(e===Y.ESCAPE){t.preventDefault(),this.clearInputText(),this.keyDownEventHandled();return}if(e===Y.HOME){t.preventDefault(),this.focusChipAtIndex(0);return}if(e===Y.END){t.preventDefault(),this.focusInputField();let i=this.inputElement,l=i.value.length;i.setSelectionRange(l,l),this.scrollContainerToEnd();return}t.key.length===1&&!t.ctrlKey&&!t.metaKey&&!t.altKey&&this.focusInputField()};this.handleChipFocus=t=>{var c,f;let e=t.currentTarget,i=this.getChipForFocusTarget(e),l=i&&(f=(c=this.chips)==null?void 0:c.indexOf(i))!=null?f:-1;l>=0&&(this.focusedChipIndex=l,this.isInputFocused=!0)};this.handleFilterContainerClick=()=>{this.inputElement.focus()}}handleKeyDown(t){var c;super.handleKeyDown(t);let e=this.getActionForKeyEvent(t);if(e===Y.ESCAPE){this.clearInputText(),this.keyDownEventHandled();return}if(!this.hasChips||!((c=this.chips)!=null&&c.length))return;let i=this.inputElement,l=i.selectionStart===0&&i.selectionEnd===0;if(e===Y.BACKSPACE&&l){t.preventDefault(),this.removeChipAtIndex(this.chips.length-1),this.keyDownEventHandled();return}if(e===Y.LEFT&&l){t.preventDefault(),this.focusChipAtIndex(this.chips.length-1),this.keyDownEventHandled();return}e===Y.HOME&&(t.preventDefault(),this.focusChipAtIndex(0),this.keyDownEventHandled())}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.chips)==null||t.forEach(e=>this.removeChipListeners(e))}connectedCallback(){super.connectedCallback(),this.leadingIcon=ac.ICON,this.trailingButton=ac.CLOSE_BTN,this.helpText=void 0,this.helpTextType=void 0,this.required=void 0,this.validationMessage=void 0,this.prefixText=void 0}renderChips(){var t;this.hasChips=!!((t=this.chips)!=null&&t.length),this.chips&&this.chips.forEach(e=>{if(!e.matches(dy)){this.removeChip(e);return}if(e.setAttribute("tabindex","-1"),!this.chipsWithListeners.has(e)){let i=this.getFocusTargetForChip(e);i.addEventListener("keydown",this.handleChipKeyDown),i.addEventListener("focus",this.handleChipFocus),this.chipsWithListeners.set(e,i)}}),this.focusedChipIndex=-1}firstUpdated(t){this.inputElement.onfocus=()=>{if(this.isInputFocused=!0,this.focusedChipIndex=-1,this.resetChipTabIndices(),!this.navigatingToInput&&this.hasChips){let e=this.scrollContainer;e&&(e.scrollLeft=0)}this.navigatingToInput=!1},this.inputElement.onblur=()=>{requestAnimationFrame(()=>{this.focusedChipIndex<0&&(this.isInputFocused=!1)})},super.firstUpdated(t)}removeChip(t){this.dispatchEvent(new CustomEvent("chipRemove",{detail:{chip:t},bubbles:!0,composed:!0})),this.controlType!=="controlled"&&t.remove()}clearInputText(){var e;super.clearInputText(),[...(e=this.chips)!=null?e:[]].forEach(i=>{this.removeChip(i)})}removeChipListeners(t){let e=this.chipsWithListeners.get(t);e&&(e.removeEventListener("keydown",this.handleChipKeyDown),e.removeEventListener("focus",this.handleChipFocus),this.chipsWithListeners.delete(t))}focusChipAtIndex(t){if(!this.chips||t<0||t>=this.chips.length)return;this.focusedChipIndex=t,this.resetChipTabIndices();let e=this.chips[t],i=this.getFocusTargetForChip(e);i.setAttribute("tabindex","0"),i.focus({preventScroll:!0}),this.scrollChipIntoView(e),this.isInputFocused=!1}focusInputField(){this.focusedChipIndex=-1,this.resetChipTabIndices(),this.navigatingToInput=!0,this.inputElement.focus({preventScroll:!0})}removeChipAtIndex(t){if(!this.chips||t<0||t>=this.chips.length)return;let e=this.chips[t];this.removeChipListeners(e),this.removeChip(e),requestAnimationFrame(()=>{if(this.chips&&this.chips.length>0){let i=Math.min(t,this.chips.length-1);this.focusChipAtIndex(i)}else this.focusInputField()})}resetChipTabIndices(){var t;(t=this.chips)==null||t.forEach(e=>{this.getFocusTargetForChip(e).setAttribute("tabindex","-1")})}getFocusTargetForChip(t){var e;if(t.matches(na)){let i=(e=t.shadowRoot)==null?void 0:e.querySelector('[part="close-icon"]');if(i)return i}return t}getChipForFocusTarget(t){var i,l,c;if((i=this.chips)!=null&&i.includes(t))return t;let e=(l=t.getRootNode())==null?void 0:l.host;return e&&((c=this.chips)!=null&&c.includes(e))?e:null}get scrollContainer(){var t,e;return(e=(t=this.shadowRoot)==null?void 0:t.querySelector('[part="searchfield-container"]'))!=null?e:null}scrollChipIntoView(t){let e=this.scrollContainer;if(!e)return;if(this.chips&&this.chips.indexOf(t)===0){e.scrollLeft=0;return}let i=e.getBoundingClientRect(),l=t.getBoundingClientRect();l.left<i.left?e.scrollLeft-=i.left-l.left:l.right>i.right&&(e.scrollLeft+=l.right-i.right)}scrollContainerToEnd(){let t=this.scrollContainer,e=this.inputElement;if(!t||!e)return;let l=e.offsetLeft+e.offsetWidth-t.clientWidth;t.scrollLeft=Math.max(0,l)}render(){return S`
+`,ny=[xS];var ly=z.constructTagName("searchfield"),ac={TYPE:bo.SEARCH,ICON:"search-bold",CLOSE_BTN:!0};var AS=[wd,na,$l],dy=AS.join(", ");var Es=class extends hi(Lt(jr)){constructor(){super(...arguments);this.isInputFocused=!1;this.hasChips=!1;this.focusedChipIndex=-1;this.navigatingToInput=!1;this.chipsWithListeners=new WeakMap;this.handleChipKeyDown=t=>{let e=this.getActionForKeyEvent(t);if(t.key==="Backspace"||t.key==="Delete"){t.preventDefault(),this.removeChipAtIndex(this.focusedChipIndex);return}if(e===Y.LEFT){t.preventDefault(),this.focusedChipIndex>0&&this.focusChipAtIndex(this.focusedChipIndex-1);return}if(e===Y.RIGHT){t.preventDefault(),this.chips&&this.focusedChipIndex<this.chips.length-1?this.focusChipAtIndex(this.focusedChipIndex+1):this.focusInputField();return}if(e===Y.ESCAPE){t.preventDefault(),this.clearInputText(),this.keyDownEventHandled();return}if(e===Y.HOME){t.preventDefault(),this.focusChipAtIndex(0);return}if(e===Y.END){t.preventDefault(),this.focusInputField();let i=this.inputElement,l=i.value.length;i.setSelectionRange(l,l),this.scrollContainerToEnd();return}t.key.length===1&&!t.ctrlKey&&!t.metaKey&&!t.altKey&&this.focusInputField()};this.handleChipFocus=t=>{var c,f;let e=t.currentTarget,i=this.getChipForFocusTarget(e),l=i&&(f=(c=this.chips)==null?void 0:c.indexOf(i))!=null?f:-1;l>=0&&(this.focusedChipIndex=l,this.isInputFocused=!0)};this.handleFilterContainerClick=()=>{this.inputElement.focus()}}handleKeyDown(t){var c;super.handleKeyDown(t);let e=this.getActionForKeyEvent(t);if(e===Y.ESCAPE){this.clearInputText(),this.keyDownEventHandled();return}if(!this.hasChips||!((c=this.chips)!=null&&c.length))return;let i=this.inputElement,l=i.selectionStart===0&&i.selectionEnd===0;if(e===Y.BACKSPACE&&l){t.preventDefault(),this.removeChipAtIndex(this.chips.length-1),this.keyDownEventHandled();return}if(e===Y.LEFT&&l){t.preventDefault(),this.focusChipAtIndex(this.chips.length-1),this.keyDownEventHandled();return}e===Y.HOME&&(t.preventDefault(),this.focusChipAtIndex(0),this.keyDownEventHandled())}focus(t){var e;(e=this.inputElement)==null||e.focus(t)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.chips)==null||t.forEach(e=>this.removeChipListeners(e))}connectedCallback(){super.connectedCallback(),this.leadingIcon=ac.ICON,this.trailingButton=ac.CLOSE_BTN,this.helpText=void 0,this.helpTextType=void 0,this.required=void 0,this.validationMessage=void 0,this.prefixText=void 0}renderChips(){var t;this.hasChips=!!((t=this.chips)!=null&&t.length),this.chips&&this.chips.forEach(e=>{if(!e.matches(dy)){this.removeChip(e);return}if(e.setAttribute("tabindex","-1"),!this.chipsWithListeners.has(e)){let i=this.getFocusTargetForChip(e);i.addEventListener("keydown",this.handleChipKeyDown),i.addEventListener("focus",this.handleChipFocus),this.chipsWithListeners.set(e,i)}}),this.focusedChipIndex=-1}firstUpdated(t){this.inputElement.onfocus=()=>{if(this.isInputFocused=!0,this.focusedChipIndex=-1,this.resetChipTabIndices(),!this.navigatingToInput&&this.hasChips){let e=this.scrollContainer;e&&(e.scrollLeft=0)}this.navigatingToInput=!1},this.inputElement.onblur=()=>{requestAnimationFrame(()=>{this.focusedChipIndex<0&&(this.isInputFocused=!1)})},super.firstUpdated(t)}removeChip(t){this.dispatchEvent(new CustomEvent("chipRemove",{detail:{chip:t},bubbles:!0,composed:!0})),this.controlType!=="controlled"&&t.remove()}clearInputText(){var e;super.clearInputText(),[...(e=this.chips)!=null?e:[]].forEach(i=>{this.removeChip(i)})}removeChipListeners(t){let e=this.chipsWithListeners.get(t);e&&(e.removeEventListener("keydown",this.handleChipKeyDown),e.removeEventListener("focus",this.handleChipFocus),this.chipsWithListeners.delete(t))}focusChipAtIndex(t){if(!this.chips||t<0||t>=this.chips.length)return;this.focusedChipIndex=t,this.resetChipTabIndices();let e=this.chips[t],i=this.getFocusTargetForChip(e);i.setAttribute("tabindex","0"),i.focus({preventScroll:!0}),this.scrollChipIntoView(e),this.isInputFocused=!1}focusInputField(){this.focusedChipIndex=-1,this.resetChipTabIndices(),this.navigatingToInput=!0,this.inputElement.focus({preventScroll:!0})}removeChipAtIndex(t){if(!this.chips||t<0||t>=this.chips.length)return;let e=this.chips[t];this.removeChipListeners(e),this.removeChip(e),requestAnimationFrame(()=>{if(this.chips&&this.chips.length>0){let i=Math.min(t,this.chips.length-1);this.focusChipAtIndex(i)}else this.focusInputField()})}resetChipTabIndices(){var t;(t=this.chips)==null||t.forEach(e=>{this.getFocusTargetForChip(e).setAttribute("tabindex","-1")})}getFocusTargetForChip(t){var e;if(t.matches(na)){let i=(e=t.shadowRoot)==null?void 0:e.querySelector('[part="close-icon"]');if(i)return i}return t}getChipForFocusTarget(t){var i,l,c;if((i=this.chips)!=null&&i.includes(t))return t;let e=(l=t.getRootNode())==null?void 0:l.host;return e&&((c=this.chips)!=null&&c.includes(e))?e:null}get scrollContainer(){var t,e;return(e=(t=this.shadowRoot)==null?void 0:t.querySelector('[part="searchfield-container"]'))!=null?e:null}scrollChipIntoView(t){let e=this.scrollContainer;if(!e)return;if(this.chips&&this.chips.indexOf(t)===0){e.scrollLeft=0;return}let i=e.getBoundingClientRect(),l=t.getBoundingClientRect();l.left<i.left?e.scrollLeft-=i.left-l.left:l.right>i.right&&(e.scrollLeft+=l.right-i.right)}scrollContainerToEnd(){let t=this.scrollContainer,e=this.inputElement;if(!t||!e)return;let l=e.offsetLeft+e.offsetWidth-t.clientWidth;t.scrollLeft=Math.max(0,l)}render(){return S`
       ${this.renderLabelElement()}
       <div
         class="${Yr({"mdc-focus-ring":this.isInputFocused})}"