@watermarkinsights/ripple 3.24.0 → 3.24.1

package/dist/ripple/{p-54f29e18.entry.js → p-d23db6e2.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as i,H as s,g as o,f as r}from"./p-1c23de4a.js";import{i as n,d as a,g as l,m as h,v as p}from"./p-9fd3badc.js";const d=':host(:not(:last-child)),wm-option:not(:last-child){border-bottom:2px solid rgba(46, 27, 70, 0.05)}:host,wm-option{display:block;cursor:pointer;position:relative;padding:1.25rem;background:#fff;font-family:inherit;list-style:none;color:#4a4a4a;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host:focus,:host.focus,wm-option:focus,wm-option.focus{outline:none;background:#f4f4f4}:host.icon,wm-option.icon{color:#575195}:host .sr-only,wm-option .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.checkbox:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f131";display:inline;margin-right:0.25rem;color:#575195}:host([aria-selected=true]),wm-option[aria-selected=true]{background:rgba(46, 27, 70, 0.05);font-weight:500}:host([aria-selected=true]) .checkbox:before,wm-option[aria-selected=true] .checkbox:before{content:"\\f132"}:host([aria-disabled=true]),wm-option[aria-disabled=true]{font-style:italic;color:#6b6b6b;cursor:default}:host([aria-disabled=true]) .checkbox:before,wm-option[aria-disabled=true] .checkbox:before{color:#6b6b6b}:host(.multi-option),wm-option.multi-option{background:unset}:host(.hidden),wm-option.hidden,:host(.filtered-out),wm-option.filtered-out{display:none}:host(.duplicate.last),wm-option.duplicate.last{border-bottom:12px solid rgba(46, 27, 70, 0.05)}:host(.hassubinfo),wm-option.hassubinfo{display:-ms-flexbox;display:flex}:host(.hassubinfo) .option-wrapper,wm-option.hassubinfo .option-wrapper{-ms-flex:1;flex:1}:host(.hassubinfo) .subinfo,wm-option.hassubinfo .subinfo{-ms-flex:none;flex:none}.subinfo{font-style:italic}.option-wrapper{display:inline-block}::slotted{font-family:inherit}::slotted(i){font-size:0.875rem}::slotted(i):before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block;margin-right:0.625rem;pointer-events:none}:host(:focus),wm-option:focus{outline:none;background:#f4f4f4}:host(:hover){background:#f4f4f4;outline:none}';const c=class{constructor(i){t(this,i);this.wmOptionSelected=e(this,"wmOptionSelected",7);this.wmKeyUpPressed=e(this,"wmKeyUpPressed",7);this.wmKeyDownPressed=e(this,"wmKeyDownPressed",7);this.wmEscKeyPressed=e(this,"wmEscKeyPressed",7);this.wmHomeKeyPressed=e(this,"wmHomeKeyPressed",7);this.wmEndKeyPressed=e(this,"wmEndKeyPressed",7);this.wmEnterKeyPressed=e(this,"wmEnterKeyPressed",7);this.wmLetterPressed=e(this,"wmLetterPressed",7);this.wmOptionBlurred=e(this,"wmOptionBlurred",7);this.value=undefined;this.subinfo=undefined;this.disabled=false;this.selected=false;this.focused=false;this.searchTerm=""}get hostClasses(){let t=[];if(this.subinfo){t.push("hassubinfo")}if(this.parentSelectEl.multiple){t.push("multi-option")}if(!this.el.textContent.toLowerCase().includes(this.searchTerm)){t.push("filtered-out")}return t.join(" ")}get parentSelectEl(){var t;return((t=this.el.parentElement)===null||t===void 0?void 0:t.nodeName)!=="WM-SELECT"?this.el.getRootNode().host:this.el.parentElement}handleKeydown(t){switch(t.key){case"ArrowUp":t.preventDefault();this.wmKeyUpPressed.emit(this.el);break;case"ArrowDown":t.preventDefault();this.wmKeyDownPressed.emit(this.el);break;case"Enter":t.preventDefault();if(!this.disabled){this.el.click();this.wmEnterKeyPressed.emit(this.el)}break;case" ":t.preventDefault();this.el.click();break;case"Escape":t.preventDefault();t.stopPropagation();this.wmEscKeyPressed.emit();break;case"Home":t.preventDefault();this.wmHomeKeyPressed.emit();break;case"End":t.preventDefault();this.wmEndKeyPressed.emit();break;default:if(t.key.length===1){this.wmLetterPressed.emit(t.key)}}}handleSelection(){if(!this.disabled){this.wmOptionSelected.emit(this.el)}}handleBlur(t){this.wmOptionBlurred.emit({relatedTarget:t.relatedTarget})}syncAriaSelected(){this.selected?this.el.setAttribute("aria-selected","true"):this.el.removeAttribute("aria-selected")}syncAriaDisabled(){this.disabled?this.el.setAttribute("aria-disabled","true"):this.el.removeAttribute("aria-disabled")}updateDisabledOnClick(){if(this.disabled&&this.el.onclick){this.onClickFunc=this.el.onclick;this.el.onclick=null}else if(!this.disabled&&this.onClickFunc){this.el.onclick=this.onClickFunc}}handleSearch(t){this.searchTerm=t.detail.searchTerm.toLowerCase();if(this.searchTerm){const t=new RegExp(`${this.searchTerm}`,"gi");const e=this.el.textContent.replace(t,(t=>`<strong>${t}</strong>`));this.textEl.innerHTML=e}else{this.textEl.innerHTML=this.el.textContent}}componentWillLoad(){this.syncAriaSelected();this.syncAriaDisabled();this.updateDisabledOnClick();this.parentSelectEl.addEventListener("wmSelectSearchChanged",(t=>this.handleSearch(t)))}render(){return i(s,{role:"option",tabindex:this.focused?0:-1,class:this.hostClasses},i("div",{class:`option-wrapper ${this.parentSelectEl.multiple?"checkbox":""}`},i("span",{"aria-hidden":"true",ref:t=>this.textEl=t},this.el.textContent),i("span",{class:"sr-only"},this.el.textContent)),i("div",{class:"subinfo"},this.subinfo))}get el(){return o(this)}static get watchers(){return{selected:["syncAriaSelected"],disabled:["syncAriaDisabled","updateDisabledOnClick"]}}};c.style=d;const f=':host{position:relative;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:inherit}:host .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}.wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}.wrapper .label .required{color:#c0392b}.wrapper.label-left{-ms-flex-direction:row;flex-direction:row}.wrapper.label-left .label-wrapper{line-height:2.5rem}.wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}.wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.wrapper.invalid .label{color:#c0392b}.wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}.wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}.wrapper .button-wrapper{position:relative;-ms-flex:1;flex:1;font-size:1.125rem;color:#575195;min-width:8.75rem}.wrapper .button-wrapper .displayedoption{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;background:transparent;width:100%;border:solid 1px rgba(35, 35, 35, 0.6);padding:0 1.875rem 0 0.9375rem;cursor:pointer;height:2.5rem;line-height:normal;font-family:inherit;color:#575195;font-weight:400;font-size:0.875rem;text-transform:none;text-align:left}@media only screen and (max-width: 768px){.wrapper .button-wrapper .displayedoption{height:2.75rem}}.wrapper .button-wrapper .displayedoption:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f140";position:absolute;right:0.5625rem;pointer-events:none}.wrapper .button-wrapper .displayedoption:hover:not(:disabled):not(.-disabled):not(.-raised){background:transparent;text-decoration:none}.wrapper .button-wrapper .displayedoption:active{-ms-transform:scale(1, 1) !important;-webkit-transform:scale(1, 1) !important;transform:scale(1, 1) !important}.wrapper .button-wrapper .displayedoption:focus{outline:none}.wrapper .button-wrapper .displayedoption::-moz-focus-inner{border:0}.wrapper .button-wrapper .displayedoption.user-is-tabbing:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}.wrapper .button-wrapper .displayedoption.user-is-tabbing:focus::-moz-focus-inner{border:0}.wrapper .button-wrapper .displayedoption .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;-ms-flex:1;flex:1}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo{display:-ms-flexbox;display:flex}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo .button-text{-ms-flex:1;flex:1;text-overflow:ellipsis;overflow:hidden;min-width:0}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo .subinfo{-ms-flex:none;flex:none;font-style:italic}.wrapper .button-wrapper .displayedoption .overflow-counter{font-weight:bold;margin-left:0.5rem}.wrapper .button-wrapper>.displayedoption[disabled]{color:#6b6b6b;border-color:#8a8a8a;background:#f0f0f0;cursor:default}.wrapper .button-wrapper>.dropdown{-webkit-overflow-scrolling:touch;-webkit-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-ms-transition:transform 0.25s ease;-webkit-transition:transform 0.25s ease;-moz-transition:transform 0.25s ease;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-ms-transform:scale(1, 0);-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);transform:scale(1, 0);-ms-transform-origin:center top;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:absolute;top:0;right:0;background:#fff;z-index:100;width:100%;font-size:0.875rem}.wrapper .button-wrapper>.dropdown.upwards{top:unset;bottom:calc(100% - 2.5rem);-ms-transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;transform-origin:center bottom}.wrapper .button-wrapper>.dropdown.hidden{visibility:hidden}.wrapper .button-wrapper>.dropdown.open{-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}.wrapper.invalid .button-wrapper .displayedoption{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}.wrapper .error-message{color:#c0392b;font-size:0.875rem;margin-top:0.25rem;margin-bottom:0.25rem;display:block;top:100%;left:0;font-style:italic}.options-wrapper{max-height:12.5rem;overflow:auto}.select-all{width:100%;cursor:pointer;padding:1.25rem;border:none;margin:0;border-bottom:2px solid rgba(46, 27, 70, 0.05);background:#fff;font-family:inherit;font-size:inherit;text-align:left;text-align:start;font-weight:500;color:#575195;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.select-all:hover,.select-all:focus{outline:none;background:#f4f4f4}.search{-webkit-box-sizing:border-box;box-sizing:border-box;border-bottom:2px solid rgba(46, 27, 70, 0.05);padding:1.25rem}.search .searchfield-wrapper{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.75rem;width:100%;padding:0 0.75rem;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:1px solid #4a4a4a}.search .searchfield-wrapper:focus,.search .searchfield-wrapper.focus{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}.search .searchfield{width:100%;border:none;outline:none;font-family:inherit;font-size:0.875rem;margin-left:0.25rem}.search .icon:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f349";color:#6b6b6b;font-size:0.875rem}.search-results-message{padding:1.25rem;color:#4a4a4a;font-size:0.875rem;font-style:italic}.rtl>.dropdown{-ms-transform-origin:left top;-webkit-transform-origin:left top;-moz-transform-origin:left top;transform-origin:left top;left:0;right:auto}.rtl>.dropdown .option{padding-left:3rem;padding-right:1.25rem}.rtl>.displayedoption{padding:0 0.9375rem 0 1.875rem;text-align:right}.rtl>.displayedoption:before{right:auto;left:0.5625rem}';const b=class{constructor(i){t(this,i);this.wmSelectDidLoad=e(this,"wmSelectDidLoad",7);this.wmSelectBlurred=e(this,"wmSelectBlurred",7);this.wmSelectChanged=e(this,"wmSelectChanged",7);this.wmComponentBlurred=e(this,"wmComponentBlurred",7);this.wmSelectSearchChanged=e(this,"wmSelectSearchChanged",7);this.requiredMessage=n.formatMessage({id:"global.requiredField",defaultMessage:"required field"});this.selectAllMessage=n.formatMessage({id:"select.selectAll",defaultMessage:"Select All"});this.deselectAllMessage=n.formatMessage({id:"select.deselectAll",defaultMessage:"Deselect All"});this.allOptionsSelectedMessage=n.formatMessage({id:"select.allOptionsSelected",defaultMessage:"All options selected"});this.allOptionsDeselectedMessage=n.formatMessage({id:"select.allOptionsDeselected",defaultMessage:"All options deselected"});this.keysSoFar="";this.searchIndex=0;this.openUp=false;this.overflowCount=0;this.displayedOptions=[];this.debouncedClearKeysSoFar=a((()=>{this.keysSoFar=""}),500);this.debouncedSearch=a((()=>{this.wmSelectSearchChanged.emit({searchTerm:this.searchTerm});if(this.filteredOptions.length){this.announce(this.resultsFoundMessage)}else{this.announce(this.noResultsFoundMessage)}}),150);this.disabled=false;this.invalid=false;this.maxHeight=undefined;this.label=undefined;this.labelPosition="top";this.requiredField=false;this.errorMessage="";this.multiple=false;this.search=false;this.selectAll=false;this.placeholder=n.formatMessage({id:"select.multiPlaceholder",defaultMessage:"Make a selection",description:"Placeholder text. Use imperative"});this.searchPlaceholder=n.formatMessage({id:"select.searchPlaceholder",defaultMessage:"Search",description:"Placeholder text. Use imperative"});this.allSelectedMessage=n.formatMessage({id:"select.allSelected",defaultMessage:"All selected",description:"Text displayed when all options are selected"});this.isTabbing=false;this.isExpanded=false;this.announcement=""}get childOptions(){return Array.from(this.el.querySelectorAll("wm-option"))}get duplicateOptions(){return Array.from(this.el.shadowRoot.querySelectorAll("wm-option"))}get allOptionEls(){return this.duplicateOptions.concat(this.childOptions)}get visibleOptionEls(){return this.allOptionEls.filter((t=>!t.classList.contains("hidden")&&!t.classList.contains("filtered-out")))}get searchTerm(){return this.searchFieldEl?this.searchFieldEl.value:""}get filteredOptions(){return this.childOptions.filter((t=>{var e;return(e=t.textContent)===null||e===void 0?void 0:e.toLowerCase().includes(this.searchTerm.toLowerCase())}))}get selectedOptions(){return Array.from(this.el.querySelectorAll("wm-option")).filter((t=>t.selected))}get allSelected(){return this.childOptions.every((t=>t.selected))}get resultsFoundMessage(){return n.formatMessage({id:"select.searchResultsFound",defaultMessage:"{numResults, plural, one {1 option found} other {# options found}}",description:"The message read by the screen reader, indicating how many results a search returned"},{numResults:this.filteredOptions.length})}get noResultsFoundMessage(){return n.formatMessage({id:"select.noSearchResults",defaultMessage:"No results found. Please try your search again.",description:"The message displayed when no options pass the search filter"})}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleOptionSelection(t){const e=t.detail;this.focusOption(e);if(!this.multiple){if(!e.selected){this.selectOption(e);const t={changedOption:e,selectedOptions:[e]};this.wmSelectChanged.emit(t);const i=new CustomEvent("change",{detail:t});this.el.dispatchEvent(i)}this.close()}else{this.selectOption(e);const t=e.classList.contains("duplicate");const i=t?this.findCorrespondingOption(e):e;const s=this.childOptions.filter((t=>t.selected));const o={changedOption:i,selectedOptions:s};this.wmSelectChanged.emit(o);const r=new CustomEvent("change",{detail:o});this.el.dispatchEvent(r)}}handleChildEnter(){this.close()}handleChildUp(t){this.moveUp(t.detail)}handleChildDown(t){this.moveDown(t.detail)}moveToFirstOption(){this.focusOption(this.visibleOptionEls[0])}moveToLastOption(){this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length-1])}closePopupOnEscape(){this.close()}handleOptionBlur(t){if(!this.isElOrChild(t.detail.relatedTarget)){const e=new CustomEvent("blur");e.relatedTarget=t.detail.relatedTarget;this.el.dispatchEvent(e)}}handleClick(t){if(!this.isElOrChild(t.target)){this.close()}}handleSelectAllClick(){this.allSelected?this.deselectAllOptions():this.selectAllOptions()}selectAllOptions(){this.allOptionEls.forEach((t=>t.selected=true));this.setSelectAllButton();this.setButtonText();const t={changedOption:null,selectedOptions:this.childOptions};this.wmSelectChanged.emit(t)}deselectAllOptions(){this.allOptionEls.forEach((t=>t.selected=false));this.setSelectAllButton();this.setButtonText();const t={changedOption:null,selectedOptions:[]};this.wmSelectChanged.emit(t)}handleButtonBlur(t){if(this.isElOrChild(t.relatedTarget)){t.stopPropagation()}}handleSearchFieldBlur(t){this.searchFieldWrapperEl.classList.remove("focus");if(this.isElOrChild(t.relatedTarget)){t.stopPropagation()}}handleKey(t){switch(t.key){case"ArrowDown":if(this.isExpanded===false){t.preventDefault();this.open("next")}break;case"ArrowUp":if(this.isExpanded===false){t.preventDefault();this.open("previous")}break}}componentWillLoad(){if(!this.label){console.error("For accessibility purposes, this component requires a label (even if `label-position` is set to `none`).")}this.uid=this.el.id?this.el.id:l();if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}if(this.selectedOptions.length>0){this.selectedOptions.forEach((t=>{this.displayedOptions.push(t)}))}else if(!this.multiple){this.selectOption(this.allOptionEls[0])}}componentDidLoad(){this.wmSelectDidLoad.emit();this.dropdownEl.classList.add("hidden");r(this.el);if(this.maxHeight){this.listboxEl.style.maxHeight=this.maxHeight}if(this.multiple){this.updateOptionVisibility()}this.setButtonText()}componentWillUpdate(){if(this.multiple){const t=this.visibleOptionEls.filter((t=>t.classList.contains("duplicate")));t.forEach(((e,i)=>{if(i===t.length-1){e.classList.add("last")}else{e.classList.remove("last")}}))}}moveUp(t){const e=this.visibleOptionEls;if(this.selectAllEl){e.unshift(this.selectAllEl)}if(this.searchFieldEl){e.unshift(this.searchFieldEl)}const i=e[e.indexOf(t)-1]||e[e.length-1];if(i){this.focusOption(i)}}moveDown(t){const e=this.visibleOptionEls;if(this.selectAllEl){e.unshift(this.selectAllEl)}if(this.searchFieldEl){e.unshift(this.searchFieldEl)}const i=e[e.indexOf(t)+1]||e[0];if(i){this.focusOption(i)}}open(t){if(!this.disabled){const e=this.el.clientHeight;const i=this.buttonEl.clientHeight;this.openUp=h(this.el,this.dropdownEl,e,i);this.isExpanded=true;this.dropdownEl.classList.remove("hidden");window.requestAnimationFrame((()=>{switch(t){case"next":if(this.search){this.searchFieldEl.focus();this.listboxEl.scrollTop=0}else{this.moveDown(this.visibleOptionEls.filter((t=>t.selected)).slice(-1)[0])}break;case"previous":if(this.search){this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length-1])}else{this.moveUp(this.visibleOptionEls.filter((t=>t.selected))[0])}break;default:if(this.search){this.searchFieldEl.focus();this.listboxEl.scrollTop=0}else if(this.selectedOptions.length>0){this.focusOption(this.visibleOptionEls.filter((t=>t.selected))[0])}else{this.focusOption(this.visibleOptionEls[0])}break}}))}}close(t=true){if(this.isExpanded){this.isExpanded=false;this.allOptionEls.map((t=>t.focused=false));window.setTimeout((()=>{this.dropdownEl.classList.add("hidden");if(this.multiple){this.updateOptionVisibility()}if(this.search){this.searchFieldEl.value="";this.wmSelectSearchChanged.emit({searchTerm:this.searchTerm})}if(t){this.buttonEl.focus()}}),150)}}updateOptionVisibility(){this.childOptions.forEach(((t,e)=>{const i=this.duplicateOptions[e];if(t.selected){t.classList.add("hidden");i.classList.remove("hidden")}else{t.classList.remove("hidden");i.classList.add("hidden")}}))}focusOption(t){this.allOptionEls.forEach((e=>e.focused=e===t));t.scrollIntoView({block:"nearest"});window.setTimeout((()=>t.scrollIntoView({block:"nearest"})),60);t.focus()}selectOption(t){if(t.classList.contains("duplicate")){const e=this.findCorrespondingOption(t);e.selected=!e.selected;r(this.el)}else if(this.multiple){t.selected=!t.selected}else{this.childOptions.forEach((e=>e.selected=e===t))}if(this.selectAllEl){this.setSelectAllButton()}this.setButtonText()}findAndFocusOption(t){const e=t.detail.toLowerCase();if(!this.keysSoFar){this.visibleOptionEls.forEach(((t,e)=>{if(t.focused){this.searchIndex=e}}))}this.keysSoFar+=e;let i=this.findMatchInRange(this.visibleOptionEls,this.searchIndex+1,this.visibleOptionEls.length);if(!i){i=this.findMatchInRange(this.visibleOptionEls,0,this.searchIndex)}if(i){this.focusOption(i)}this.debouncedClearKeysSoFar()}findMatchInRange(t,e,i){let s=null;let o=t.slice(e,i);o.forEach((t=>{const e=t.textContent;if(!s&&e&&e.toLowerCase().startsWith(this.keysSoFar)){s=t}}));return s}findCorrespondingOption(t){const e=t.classList.contains("duplicate");return e?this.childOptions[this.duplicateOptions.indexOf(t)]:this.duplicateOptions[this.childOptions.indexOf(t)]}isElOrChild(t){var e;return t===this.el||this.el.contains(t)||((e=this.el.shadowRoot)===null||e===void 0?void 0:e.contains(t))}exposeErrors(){const t=l();this.errorContainer.id=`wm-errors-${t}`;this.buttonEl.setAttribute("aria-describedby",`wm-errors-${t}`)}renderErrorContainer(){return i("div",{id:"wm-errors",class:this.errorMessage?"error-message":"",ref:t=>this.errorContainer=t,"aria-live":"assertive","aria-atomic":"true"},this.errorMessage)}handleComponentBlur(t){if(!this.el.contains(t.relatedTarget)){this.close(false);this.wmSelectBlurred.emit();this.wmComponentBlurred.emit()}}handleKeyDown(t){const e=t.target;switch(t.key){case"ArrowDown":t.preventDefault();this.moveDown(t.target);break;case"ArrowUp":t.preventDefault();this.moveUp(t.target);break;case"Escape":t.preventDefault();this.close();break;case"Enter":if(e===this.selectAllEl){t.preventDefault();this.handleSelectAllClick();this.close()}break;case" ":if(e===this.selectAllEl){t.preventDefault();this.handleSelectAllClick()}break}}setButtonText(){this.displayedOptions=this.childOptions.filter((t=>t.selected)).map((t=>!t.classList.contains("hidden")?t:this.findCorrespondingOption(t)));if(this.multiple){const t=38;const e=window.getComputedStyle(this.buttonEl);const i=parseInt(e.getPropertyValue("padding-left").slice(0,-2));const s=parseInt(e.getPropertyValue("padding-right").slice(0,-2));const o=this.buttonEl.clientWidth-i-s-t;let r=this.displayedOptions.map((t=>t.shadowRoot.querySelector(".option-wrapper").clientWidth));let n=r.reduce(((t,e)=>t+e),0);this.overflowCount=0;while(n>o&&this.displayedOptions.length>1){this.overflowCount++;n-=r[r.length-1];r.pop();this.displayedOptions.pop()}}}setSelectAllButton(){if(this.allSelected){this.selectAllEl.textContent=this.deselectAllMessage;this.announce(this.allOptionsSelectedMessage)}else{this.selectAllEl.textContent=this.selectAllMessage;if(this.selectedOptions.length===0){this.announce(this.allOptionsDeselectedMessage)}}}announce(t){if(this.liveRegionEl.textContent===t){t+=" "}this.announcement=t}renderButtonText(){if(this.multiple&&this.displayedOptions.length<1){return i("span",null,this.placeholder)}else if(this.multiple&&this.allSelected&&this.overflowCount>0){return this.allSelectedMessage}else{return this.displayedOptions.map(((t,e)=>i("span",null,e>0?", ":"",t.textContent)))}}renderSubinfo(){if(!this.multiple&&this.selectedOptions.length>0&&this.selectedOptions[0].subinfo){return i("span",{class:"subinfo"},this.selectedOptions[0].subinfo)}}renderOverflowCount(){if(this.overflowCount>0&&!this.allSelected){return i("span",null,i("span",{class:"overflow-counter"},"+",this.overflowCount))}}renderSearchField(){return i("div",{class:"search"},i("div",{class:"searchfield-wrapper",ref:t=>this.searchFieldWrapperEl=t},i("div",{class:"icon"}),i("input",{ref:t=>this.searchFieldEl=t,class:"searchfield",role:"combobox","aria-controls":`list-${this.uid}`,"aria-expanded":this.isExpanded?"true":"false",onKeyDown:t=>this.handleKeyDown(t),onFocus:()=>this.searchFieldWrapperEl.classList.add("focus"),onBlur:t=>this.handleSearchFieldBlur(t),onInput:()=>this.debouncedSearch(),placeholder:this.searchPlaceholder})))}renderSearchFailedMessage(){return i("div",{class:"search-results-message"},this.noResultsFoundMessage)}renderSelectAllButton(){if(this.selectAll&&this.multiple&&this.searchTerm==""){return i("button",{ref:t=>this.selectAllEl=t,class:"select-all",onClick:()=>this.handleSelectAllClick(),onKeyDown:t=>this.handleKeyDown(t),tabindex:"-1"},this.allSelected?this.deselectAllMessage:this.selectAllMessage)}}renderDuplicateOptions(){return Array.from(this.el.children).map((t=>i("wm-option",{class:"duplicate",selected:t.selected},t.textContent)))}render(){const t={id:`selectbtn-${this.uid}`,["disabled"]:this.disabled,["aria-controls"]:`list-${this.uid}`,["aria-labelledby"]:`label-${this.uid} selectbtn-${this.uid}`,["aria-describedby"]:"wm-errors",["aria-expanded"]:this.isExpanded?"true":"false",onClick:()=>this.isExpanded?this.close():this.open()};return i(s,{onBlur:t=>this.handleComponentBlur(t)},i("div",{class:`wrapper ${p()} label-${this.labelPosition} ${this.invalid||this.errorMessage?"invalid":""}`},i("div",{class:"label-wrapper"},i("label",{class:"label",id:`label-${this.uid}`,htmlFor:`selectbtn-${this.uid}`},this.label,this.requiredField?i("span",{class:"required"},i("span",{class:"sr-only"},this.requiredMessage),i("span",{"aria-hidden":"true"},"*")):"")),i("div",{class:"button-wrapper"},i("button",Object.assign({},t,{class:`displayedoption ${this.isTabbing?"user-is-tabbing":""}`,ref:t=>this.buttonEl=t,onBlur:t=>this.handleButtonBlur(t),onFocus:()=>this.close()}),i("span",{class:this.selectedOptions.length>0&&this.selectedOptions.filter((t=>t.subinfo)).length>0?"overflowcontrol hassubinfo":"overflowcontrol"},i("span",{class:"button-text"},this.renderButtonText()),this.renderSubinfo()),this.renderOverflowCount()),i("div",{class:`dropdown ${this.isExpanded?"open":""} ${this.openUp?"upwards":""}`,ref:t=>this.dropdownEl=t},this.search&&this.renderSearchField(),i("div",{id:`list-${this.uid}`,class:"options-wrapper",tabindex:-1,role:"listbox","aria-multiselectable":this.multiple?"true":null,"aria-labelledby":`label-${this.uid}`,ref:t=>this.listboxEl=t},this.search&&this.filteredOptions.length===0&&this.renderSearchFailedMessage(),this.renderSelectAllButton(),this.multiple&&this.renderDuplicateOptions(),i("slot",null))),this.renderErrorContainer(),i("div",{id:"announcement","aria-live":"polite",class:"sr-only",ref:t=>this.liveRegionEl=t},this.announcement))))}static get delegatesFocus(){return true}get el(){return o(this)}static get watchers(){return{errorMessage:["exposeErrors"]}}};b.style=f;export{c as wm_option,b as wm_select};
-//# sourceMappingURL=p-54f29e18.entry.js.map
+import{r as t,c as e,h as i,H as s,g as o,f as r}from"./p-1c23de4a.js";import{i as n,d as a,g as l,m as h,v as p}from"./p-edfba0e1.js";const d=':host(:not(:last-child)),wm-option:not(:last-child){border-bottom:2px solid rgba(46, 27, 70, 0.05)}:host,wm-option{display:block;cursor:pointer;position:relative;padding:1.25rem;background:#fff;font-family:inherit;list-style:none;color:#4a4a4a;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host:focus,:host.focus,wm-option:focus,wm-option.focus{outline:none;background:#f4f4f4}:host.icon,wm-option.icon{color:#575195}:host .sr-only,wm-option .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.checkbox:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f131";display:inline;margin-right:0.25rem;color:#575195}:host([aria-selected=true]),wm-option[aria-selected=true]{background:rgba(46, 27, 70, 0.05);font-weight:500}:host([aria-selected=true]) .checkbox:before,wm-option[aria-selected=true] .checkbox:before{content:"\\f132"}:host([aria-disabled=true]),wm-option[aria-disabled=true]{font-style:italic;color:#6b6b6b;cursor:default}:host([aria-disabled=true]) .checkbox:before,wm-option[aria-disabled=true] .checkbox:before{color:#6b6b6b}:host(.multi-option),wm-option.multi-option{background:unset}:host(.hidden),wm-option.hidden,:host(.filtered-out),wm-option.filtered-out{display:none}:host(.duplicate.last),wm-option.duplicate.last{border-bottom:12px solid rgba(46, 27, 70, 0.05)}:host(.hassubinfo),wm-option.hassubinfo{display:-ms-flexbox;display:flex}:host(.hassubinfo) .option-wrapper,wm-option.hassubinfo .option-wrapper{-ms-flex:1;flex:1}:host(.hassubinfo) .subinfo,wm-option.hassubinfo .subinfo{-ms-flex:none;flex:none}.subinfo{font-style:italic}.option-wrapper{display:inline-block}::slotted{font-family:inherit}::slotted(i){font-size:0.875rem}::slotted(i):before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:inline-block;margin-right:0.625rem;pointer-events:none}:host(:focus),wm-option:focus{outline:none;background:#f4f4f4}:host(:hover){background:#f4f4f4;outline:none}';const c=class{constructor(i){t(this,i);this.wmOptionSelected=e(this,"wmOptionSelected",7);this.wmKeyUpPressed=e(this,"wmKeyUpPressed",7);this.wmKeyDownPressed=e(this,"wmKeyDownPressed",7);this.wmEscKeyPressed=e(this,"wmEscKeyPressed",7);this.wmHomeKeyPressed=e(this,"wmHomeKeyPressed",7);this.wmEndKeyPressed=e(this,"wmEndKeyPressed",7);this.wmEnterKeyPressed=e(this,"wmEnterKeyPressed",7);this.wmLetterPressed=e(this,"wmLetterPressed",7);this.wmOptionBlurred=e(this,"wmOptionBlurred",7);this.value=undefined;this.subinfo=undefined;this.disabled=false;this.selected=false;this.focused=false;this.searchTerm=""}get hostClasses(){let t=[];if(this.subinfo){t.push("hassubinfo")}if(this.parentSelectEl.multiple){t.push("multi-option")}if(!this.el.textContent.toLowerCase().includes(this.searchTerm)){t.push("filtered-out")}return t.join(" ")}get parentSelectEl(){var t;return((t=this.el.parentElement)===null||t===void 0?void 0:t.nodeName)!=="WM-SELECT"?this.el.getRootNode().host:this.el.parentElement}handleKeydown(t){switch(t.key){case"ArrowUp":t.preventDefault();this.wmKeyUpPressed.emit(this.el);break;case"ArrowDown":t.preventDefault();this.wmKeyDownPressed.emit(this.el);break;case"Enter":t.preventDefault();if(!this.disabled){this.el.click();this.wmEnterKeyPressed.emit(this.el)}break;case" ":t.preventDefault();this.el.click();break;case"Escape":t.preventDefault();t.stopPropagation();this.wmEscKeyPressed.emit();break;case"Home":t.preventDefault();this.wmHomeKeyPressed.emit();break;case"End":t.preventDefault();this.wmEndKeyPressed.emit();break;default:if(t.key.length===1){this.wmLetterPressed.emit(t.key)}}}handleSelection(){if(!this.disabled){this.wmOptionSelected.emit(this.el)}}handleBlur(t){this.wmOptionBlurred.emit({relatedTarget:t.relatedTarget})}syncAriaSelected(){this.selected?this.el.setAttribute("aria-selected","true"):this.el.removeAttribute("aria-selected")}syncAriaDisabled(){this.disabled?this.el.setAttribute("aria-disabled","true"):this.el.removeAttribute("aria-disabled")}updateDisabledOnClick(){if(this.disabled&&this.el.onclick){this.onClickFunc=this.el.onclick;this.el.onclick=null}else if(!this.disabled&&this.onClickFunc){this.el.onclick=this.onClickFunc}}handleSearch(t){this.searchTerm=t.detail.searchTerm.toLowerCase();if(this.searchTerm){const t=new RegExp(`${this.searchTerm}`,"gi");const e=this.el.textContent.replace(t,(t=>`<strong>${t}</strong>`));this.textEl.innerHTML=e}else{this.textEl.innerHTML=this.el.textContent}}componentWillLoad(){this.syncAriaSelected();this.syncAriaDisabled();this.updateDisabledOnClick();this.parentSelectEl.addEventListener("wmSelectSearchChanged",(t=>this.handleSearch(t)))}render(){return i(s,{role:"option",tabindex:this.focused?0:-1,class:this.hostClasses},i("div",{class:`option-wrapper ${this.parentSelectEl.multiple?"checkbox":""}`},i("span",{"aria-hidden":"true",ref:t=>this.textEl=t},this.el.textContent),i("span",{class:"sr-only"},this.el.textContent)),i("div",{class:"subinfo"},this.subinfo))}get el(){return o(this)}static get watchers(){return{selected:["syncAriaSelected"],disabled:["syncAriaDisabled","updateDisabledOnClick"]}}};c.style=d;const f=':host{position:relative;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:inherit}:host .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}.wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}.wrapper .label .required{color:#c0392b}.wrapper.label-left{-ms-flex-direction:row;flex-direction:row}.wrapper.label-left .label-wrapper{line-height:2.5rem}.wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}.wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.wrapper.invalid .label{color:#c0392b}.wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}.wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}.wrapper .button-wrapper{position:relative;-ms-flex:1;flex:1;font-size:1.125rem;color:#575195;min-width:8.75rem}.wrapper .button-wrapper .displayedoption{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:nowrap;flex-wrap:nowrap;background:transparent;width:100%;border:solid 1px rgba(35, 35, 35, 0.6);padding:0 1.875rem 0 0.9375rem;cursor:pointer;height:2.5rem;line-height:normal;font-family:inherit;color:#575195;font-weight:400;font-size:0.875rem;text-transform:none;text-align:left}@media only screen and (max-width: 768px){.wrapper .button-wrapper .displayedoption{height:2.75rem}}.wrapper .button-wrapper .displayedoption:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f140";position:absolute;right:0.5625rem;pointer-events:none}.wrapper .button-wrapper .displayedoption:hover:not(:disabled):not(.-disabled):not(.-raised){background:transparent;text-decoration:none}.wrapper .button-wrapper .displayedoption:active{-ms-transform:scale(1, 1) !important;-webkit-transform:scale(1, 1) !important;transform:scale(1, 1) !important}.wrapper .button-wrapper .displayedoption:focus{outline:none}.wrapper .button-wrapper .displayedoption::-moz-focus-inner{border:0}.wrapper .button-wrapper .displayedoption.user-is-tabbing:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}.wrapper .button-wrapper .displayedoption.user-is-tabbing:focus::-moz-focus-inner{border:0}.wrapper .button-wrapper .displayedoption .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;-ms-flex:1;flex:1}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo{display:-ms-flexbox;display:flex}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo .button-text{-ms-flex:1;flex:1;text-overflow:ellipsis;overflow:hidden;min-width:0}.wrapper .button-wrapper .displayedoption .overflowcontrol.hassubinfo .subinfo{-ms-flex:none;flex:none;font-style:italic}.wrapper .button-wrapper .displayedoption .overflow-counter{font-weight:bold;margin-left:0.5rem}.wrapper .button-wrapper>.displayedoption[disabled]{color:#6b6b6b;border-color:#8a8a8a;background:#f0f0f0;cursor:default}.wrapper .button-wrapper>.dropdown{-webkit-overflow-scrolling:touch;-webkit-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-ms-transition:transform 0.25s ease;-webkit-transition:transform 0.25s ease;-moz-transition:transform 0.25s ease;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-ms-transform:scale(1, 0);-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);transform:scale(1, 0);-ms-transform-origin:center top;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:absolute;top:0;right:0;background:#fff;z-index:100;width:100%;font-size:0.875rem}.wrapper .button-wrapper>.dropdown.upwards{top:unset;bottom:calc(100% - 2.5rem);-ms-transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;transform-origin:center bottom}.wrapper .button-wrapper>.dropdown.hidden{visibility:hidden}.wrapper .button-wrapper>.dropdown.open{-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}.wrapper.invalid .button-wrapper .displayedoption{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}.wrapper .error-message{color:#c0392b;font-size:0.875rem;margin-top:0.25rem;margin-bottom:0.25rem;display:block;top:100%;left:0;font-style:italic}.options-wrapper{max-height:12.5rem;overflow:auto}.select-all{width:100%;cursor:pointer;padding:1.25rem;border:none;margin:0;border-bottom:2px solid rgba(46, 27, 70, 0.05);background:#fff;font-family:inherit;font-size:inherit;text-align:left;text-align:start;font-weight:500;color:#575195;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.select-all:hover,.select-all:focus{outline:none;background:#f4f4f4}.search{-webkit-box-sizing:border-box;box-sizing:border-box;border-bottom:2px solid rgba(46, 27, 70, 0.05);padding:1.25rem}.search .searchfield-wrapper{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.75rem;width:100%;padding:0 0.75rem;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:1px solid #4a4a4a}.search .searchfield-wrapper:focus,.search .searchfield-wrapper.focus{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}.search .searchfield{width:100%;border:none;outline:none;font-family:inherit;font-size:0.875rem;margin-left:0.25rem}.search .icon:before{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f349";color:#6b6b6b;font-size:0.875rem}.search-results-message{padding:1.25rem;color:#4a4a4a;font-size:0.875rem;font-style:italic}.rtl>.dropdown{-ms-transform-origin:left top;-webkit-transform-origin:left top;-moz-transform-origin:left top;transform-origin:left top;left:0;right:auto}.rtl>.dropdown .option{padding-left:3rem;padding-right:1.25rem}.rtl>.displayedoption{padding:0 0.9375rem 0 1.875rem;text-align:right}.rtl>.displayedoption:before{right:auto;left:0.5625rem}';const b=class{constructor(i){t(this,i);this.wmSelectDidLoad=e(this,"wmSelectDidLoad",7);this.wmSelectBlurred=e(this,"wmSelectBlurred",7);this.wmSelectChanged=e(this,"wmSelectChanged",7);this.wmComponentBlurred=e(this,"wmComponentBlurred",7);this.wmSelectSearchChanged=e(this,"wmSelectSearchChanged",7);this.requiredMessage=n.formatMessage({id:"global.requiredField",defaultMessage:"required field"});this.selectAllMessage=n.formatMessage({id:"select.selectAll",defaultMessage:"Select All"});this.deselectAllMessage=n.formatMessage({id:"select.deselectAll",defaultMessage:"Deselect All"});this.allOptionsSelectedMessage=n.formatMessage({id:"select.allOptionsSelected",defaultMessage:"All options selected"});this.allOptionsDeselectedMessage=n.formatMessage({id:"select.allOptionsDeselected",defaultMessage:"All options deselected"});this.keysSoFar="";this.searchIndex=0;this.openUp=false;this.overflowCount=0;this.displayedOptions=[];this.debouncedClearKeysSoFar=a((()=>{this.keysSoFar=""}),500);this.debouncedSearch=a((()=>{this.wmSelectSearchChanged.emit({searchTerm:this.searchTerm});if(this.filteredOptions.length){this.announce(this.resultsFoundMessage)}else{this.announce(this.noResultsFoundMessage)}}),150);this.disabled=false;this.invalid=false;this.maxHeight=undefined;this.label=undefined;this.labelPosition="top";this.requiredField=false;this.errorMessage="";this.multiple=false;this.search=false;this.selectAll=false;this.placeholder=n.formatMessage({id:"select.multiPlaceholder",defaultMessage:"Make a selection",description:"Placeholder text. Use imperative"});this.searchPlaceholder=n.formatMessage({id:"select.searchPlaceholder",defaultMessage:"Search",description:"Placeholder text. Use imperative"});this.allSelectedMessage=n.formatMessage({id:"select.allSelected",defaultMessage:"All selected",description:"Text displayed when all options are selected"});this.isTabbing=false;this.isExpanded=false;this.announcement=""}get childOptions(){return Array.from(this.el.querySelectorAll("wm-option"))}get duplicateOptions(){return Array.from(this.el.shadowRoot.querySelectorAll("wm-option"))}get allOptionEls(){return this.duplicateOptions.concat(this.childOptions)}get visibleOptionEls(){return this.allOptionEls.filter((t=>!t.classList.contains("hidden")&&!t.classList.contains("filtered-out")))}get searchTerm(){return this.searchFieldEl?this.searchFieldEl.value:""}get filteredOptions(){return this.childOptions.filter((t=>{var e;return(e=t.textContent)===null||e===void 0?void 0:e.toLowerCase().includes(this.searchTerm.toLowerCase())}))}get selectedOptions(){return Array.from(this.el.querySelectorAll("wm-option")).filter((t=>t.selected))}get allSelected(){return this.childOptions.every((t=>t.selected))}get resultsFoundMessage(){return n.formatMessage({id:"select.searchResultsFound",defaultMessage:"{numResults, plural, one {1 option found} other {# options found}}",description:"The message read by the screen reader, indicating how many results a search returned"},{numResults:this.filteredOptions.length})}get noResultsFoundMessage(){return n.formatMessage({id:"select.noSearchResults",defaultMessage:"No results found. Please try your search again.",description:"The message displayed when no options pass the search filter"})}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleOptionSelection(t){const e=t.detail;this.focusOption(e);if(!this.multiple){if(!e.selected){this.selectOption(e);const t={changedOption:e,selectedOptions:[e]};this.wmSelectChanged.emit(t);const i=new CustomEvent("change",{detail:t});this.el.dispatchEvent(i)}this.close()}else{this.selectOption(e);const t=e.classList.contains("duplicate");const i=t?this.findCorrespondingOption(e):e;const s=this.childOptions.filter((t=>t.selected));const o={changedOption:i,selectedOptions:s};this.wmSelectChanged.emit(o);const r=new CustomEvent("change",{detail:o});this.el.dispatchEvent(r)}}handleChildEnter(){this.close()}handleChildUp(t){this.moveUp(t.detail)}handleChildDown(t){this.moveDown(t.detail)}moveToFirstOption(){this.focusOption(this.visibleOptionEls[0])}moveToLastOption(){this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length-1])}closePopupOnEscape(){this.close()}handleOptionBlur(t){if(!this.isElOrChild(t.detail.relatedTarget)){const e=new CustomEvent("blur");e.relatedTarget=t.detail.relatedTarget;this.el.dispatchEvent(e)}}handleClick(t){if(!this.isElOrChild(t.target)){this.close()}}handleSelectAllClick(){this.allSelected?this.deselectAllOptions():this.selectAllOptions()}selectAllOptions(){this.allOptionEls.forEach((t=>t.selected=true));this.setSelectAllButton();this.setButtonText();const t={changedOption:null,selectedOptions:this.childOptions};this.wmSelectChanged.emit(t)}deselectAllOptions(){this.allOptionEls.forEach((t=>t.selected=false));this.setSelectAllButton();this.setButtonText();const t={changedOption:null,selectedOptions:[]};this.wmSelectChanged.emit(t)}handleButtonBlur(t){if(this.isElOrChild(t.relatedTarget)){t.stopPropagation()}}handleSearchFieldBlur(t){this.searchFieldWrapperEl.classList.remove("focus");if(this.isElOrChild(t.relatedTarget)){t.stopPropagation()}}handleKey(t){switch(t.key){case"ArrowDown":if(this.isExpanded===false){t.preventDefault();this.open("next")}break;case"ArrowUp":if(this.isExpanded===false){t.preventDefault();this.open("previous")}break}}componentWillLoad(){if(!this.label){console.error("For accessibility purposes, this component requires a label (even if `label-position` is set to `none`).")}this.uid=this.el.id?this.el.id:l();if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}if(this.selectedOptions.length>0){this.selectedOptions.forEach((t=>{this.displayedOptions.push(t)}))}else if(!this.multiple){this.selectOption(this.allOptionEls[0])}}componentDidLoad(){this.wmSelectDidLoad.emit();this.dropdownEl.classList.add("hidden");r(this.el);if(this.maxHeight){this.listboxEl.style.maxHeight=this.maxHeight}if(this.multiple){this.updateOptionVisibility()}this.setButtonText()}componentWillUpdate(){if(this.multiple){const t=this.visibleOptionEls.filter((t=>t.classList.contains("duplicate")));t.forEach(((e,i)=>{if(i===t.length-1){e.classList.add("last")}else{e.classList.remove("last")}}))}}moveUp(t){const e=this.visibleOptionEls;if(this.selectAllEl){e.unshift(this.selectAllEl)}if(this.searchFieldEl){e.unshift(this.searchFieldEl)}const i=e[e.indexOf(t)-1]||e[e.length-1];if(i){this.focusOption(i)}}moveDown(t){const e=this.visibleOptionEls;if(this.selectAllEl){e.unshift(this.selectAllEl)}if(this.searchFieldEl){e.unshift(this.searchFieldEl)}const i=e[e.indexOf(t)+1]||e[0];if(i){this.focusOption(i)}}open(t){if(!this.disabled){const e=this.el.clientHeight;const i=this.buttonEl.clientHeight;this.openUp=h(this.el,this.dropdownEl,e,i);this.isExpanded=true;this.dropdownEl.classList.remove("hidden");window.requestAnimationFrame((()=>{switch(t){case"next":if(this.search){this.searchFieldEl.focus();this.listboxEl.scrollTop=0}else{this.moveDown(this.visibleOptionEls.filter((t=>t.selected)).slice(-1)[0])}break;case"previous":if(this.search){this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length-1])}else{this.moveUp(this.visibleOptionEls.filter((t=>t.selected))[0])}break;default:if(this.search){this.searchFieldEl.focus();this.listboxEl.scrollTop=0}else if(this.selectedOptions.length>0){this.focusOption(this.visibleOptionEls.filter((t=>t.selected))[0])}else{this.focusOption(this.visibleOptionEls[0])}break}}))}}close(t=true){if(this.isExpanded){this.isExpanded=false;this.allOptionEls.map((t=>t.focused=false));window.setTimeout((()=>{this.dropdownEl.classList.add("hidden");if(this.multiple){this.updateOptionVisibility()}if(this.search){this.searchFieldEl.value="";this.wmSelectSearchChanged.emit({searchTerm:this.searchTerm})}if(t){this.buttonEl.focus()}}),150)}}updateOptionVisibility(){this.childOptions.forEach(((t,e)=>{const i=this.duplicateOptions[e];if(t.selected){t.classList.add("hidden");i.classList.remove("hidden")}else{t.classList.remove("hidden");i.classList.add("hidden")}}))}focusOption(t){this.allOptionEls.forEach((e=>e.focused=e===t));t.scrollIntoView({block:"nearest"});window.setTimeout((()=>t.scrollIntoView({block:"nearest"})),60);t.focus()}selectOption(t){if(t.classList.contains("duplicate")){const e=this.findCorrespondingOption(t);e.selected=!e.selected;r(this.el)}else if(this.multiple){t.selected=!t.selected}else{this.childOptions.forEach((e=>e.selected=e===t))}if(this.selectAllEl){this.setSelectAllButton()}this.setButtonText()}findAndFocusOption(t){const e=t.detail.toLowerCase();if(!this.keysSoFar){this.visibleOptionEls.forEach(((t,e)=>{if(t.focused){this.searchIndex=e}}))}this.keysSoFar+=e;let i=this.findMatchInRange(this.visibleOptionEls,this.searchIndex+1,this.visibleOptionEls.length);if(!i){i=this.findMatchInRange(this.visibleOptionEls,0,this.searchIndex)}if(i){this.focusOption(i)}this.debouncedClearKeysSoFar()}findMatchInRange(t,e,i){let s=null;let o=t.slice(e,i);o.forEach((t=>{const e=t.textContent;if(!s&&e&&e.toLowerCase().startsWith(this.keysSoFar)){s=t}}));return s}findCorrespondingOption(t){const e=t.classList.contains("duplicate");return e?this.childOptions[this.duplicateOptions.indexOf(t)]:this.duplicateOptions[this.childOptions.indexOf(t)]}isElOrChild(t){var e;return t===this.el||this.el.contains(t)||((e=this.el.shadowRoot)===null||e===void 0?void 0:e.contains(t))}exposeErrors(){const t=l();this.errorContainer.id=`wm-errors-${t}`;this.buttonEl.setAttribute("aria-describedby",`wm-errors-${t}`)}renderErrorContainer(){return i("div",{id:"wm-errors",class:this.errorMessage?"error-message":"",ref:t=>this.errorContainer=t,"aria-live":"assertive","aria-atomic":"true"},this.errorMessage)}handleComponentBlur(t){if(!this.el.contains(t.relatedTarget)){this.close(false);this.wmSelectBlurred.emit();this.wmComponentBlurred.emit()}}handleKeyDown(t){const e=t.target;switch(t.key){case"ArrowDown":t.preventDefault();this.moveDown(t.target);break;case"ArrowUp":t.preventDefault();this.moveUp(t.target);break;case"Escape":t.preventDefault();this.close();break;case"Enter":if(e===this.selectAllEl){t.preventDefault();this.handleSelectAllClick();this.close()}break;case" ":if(e===this.selectAllEl){t.preventDefault();this.handleSelectAllClick()}break}}setButtonText(){this.displayedOptions=this.childOptions.filter((t=>t.selected)).map((t=>!t.classList.contains("hidden")?t:this.findCorrespondingOption(t)));if(this.multiple){const t=38;const e=window.getComputedStyle(this.buttonEl);const i=parseInt(e.getPropertyValue("padding-left").slice(0,-2));const s=parseInt(e.getPropertyValue("padding-right").slice(0,-2));const o=this.buttonEl.clientWidth-i-s-t;let r=this.displayedOptions.map((t=>t.shadowRoot.querySelector(".option-wrapper").clientWidth));let n=r.reduce(((t,e)=>t+e),0);this.overflowCount=0;while(n>o&&this.displayedOptions.length>1){this.overflowCount++;n-=r[r.length-1];r.pop();this.displayedOptions.pop()}}}setSelectAllButton(){if(this.allSelected){this.selectAllEl.textContent=this.deselectAllMessage;this.announce(this.allOptionsSelectedMessage)}else{this.selectAllEl.textContent=this.selectAllMessage;if(this.selectedOptions.length===0){this.announce(this.allOptionsDeselectedMessage)}}}announce(t){if(this.liveRegionEl.textContent===t){t+=" "}this.announcement=t}renderButtonText(){if(this.multiple&&this.displayedOptions.length<1){return i("span",null,this.placeholder)}else if(this.multiple&&this.allSelected&&this.overflowCount>0){return this.allSelectedMessage}else{return this.displayedOptions.map(((t,e)=>i("span",null,e>0?", ":"",t.textContent)))}}renderSubinfo(){if(!this.multiple&&this.selectedOptions.length>0&&this.selectedOptions[0].subinfo){return i("span",{class:"subinfo"},this.selectedOptions[0].subinfo)}}renderOverflowCount(){if(this.overflowCount>0&&!this.allSelected){return i("span",null,i("span",{class:"overflow-counter"},"+",this.overflowCount))}}renderSearchField(){return i("div",{class:"search"},i("div",{class:"searchfield-wrapper",ref:t=>this.searchFieldWrapperEl=t},i("div",{class:"icon"}),i("input",{ref:t=>this.searchFieldEl=t,class:"searchfield",role:"combobox","aria-controls":`list-${this.uid}`,"aria-expanded":this.isExpanded?"true":"false",onKeyDown:t=>this.handleKeyDown(t),onFocus:()=>this.searchFieldWrapperEl.classList.add("focus"),onBlur:t=>this.handleSearchFieldBlur(t),onInput:()=>this.debouncedSearch(),placeholder:this.searchPlaceholder})))}renderSearchFailedMessage(){return i("div",{class:"search-results-message"},this.noResultsFoundMessage)}renderSelectAllButton(){if(this.selectAll&&this.multiple&&this.searchTerm==""){return i("button",{ref:t=>this.selectAllEl=t,class:"select-all",onClick:()=>this.handleSelectAllClick(),onKeyDown:t=>this.handleKeyDown(t),tabindex:"-1"},this.allSelected?this.deselectAllMessage:this.selectAllMessage)}}renderDuplicateOptions(){return Array.from(this.el.children).map((t=>i("wm-option",{class:"duplicate",selected:t.selected},t.textContent)))}render(){const t={id:`selectbtn-${this.uid}`,["disabled"]:this.disabled,["aria-controls"]:`list-${this.uid}`,["aria-labelledby"]:`label-${this.uid} selectbtn-${this.uid}`,["aria-describedby"]:"wm-errors",["aria-expanded"]:this.isExpanded?"true":"false",onClick:()=>this.isExpanded?this.close():this.open()};return i(s,{onBlur:t=>this.handleComponentBlur(t)},i("div",{class:`wrapper ${p()} label-${this.labelPosition} ${this.invalid||this.errorMessage?"invalid":""}`},i("div",{class:"label-wrapper"},i("label",{class:"label",id:`label-${this.uid}`,htmlFor:`selectbtn-${this.uid}`},this.label,this.requiredField?i("span",{class:"required"},i("span",{class:"sr-only"},this.requiredMessage),i("span",{"aria-hidden":"true"},"*")):"")),i("div",{class:"button-wrapper"},i("button",Object.assign({},t,{class:`displayedoption ${this.isTabbing?"user-is-tabbing":""}`,ref:t=>this.buttonEl=t,onBlur:t=>this.handleButtonBlur(t),onFocus:()=>this.close()}),i("span",{class:this.selectedOptions.length>0&&this.selectedOptions.filter((t=>t.subinfo)).length>0?"overflowcontrol hassubinfo":"overflowcontrol"},i("span",{class:"button-text"},this.renderButtonText()),this.renderSubinfo()),this.renderOverflowCount()),i("div",{class:`dropdown ${this.isExpanded?"open":""} ${this.openUp?"upwards":""}`,ref:t=>this.dropdownEl=t},this.search&&this.renderSearchField(),i("div",{id:`list-${this.uid}`,class:"options-wrapper",tabindex:-1,role:"listbox","aria-multiselectable":this.multiple?"true":null,"aria-labelledby":`label-${this.uid}`,ref:t=>this.listboxEl=t},this.search&&this.filteredOptions.length===0&&this.renderSearchFailedMessage(),this.renderSelectAllButton(),this.multiple&&this.renderDuplicateOptions(),i("slot",null))),this.renderErrorContainer(),i("div",{id:"announcement","aria-live":"polite",class:"sr-only",ref:t=>this.liveRegionEl=t},this.announcement))))}static get delegatesFocus(){return true}get el(){return o(this)}static get watchers(){return{errorMessage:["exposeErrors"]}}};b.style=f;export{c as wm_option,b as wm_select};
+//# sourceMappingURL=p-d23db6e2.entry.js.map

package/dist/ripple/p-d23db6e2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmOptionCss","Option","undefined","hostClasses","classes","this","subinfo","push","parentSelectEl","multiple","el","textContent","toLowerCase","includes","searchTerm","join","_a","parentElement","nodeName","getRootNode","host","handleKeydown","ev","key","preventDefault","wmKeyUpPressed","emit","wmKeyDownPressed","disabled","click","wmEnterKeyPressed","stopPropagation","wmEscKeyPressed","wmHomeKeyPressed","wmEndKeyPressed","length","wmLetterPressed","handleSelection","wmOptionSelected","handleBlur","wmOptionBlurred","relatedTarget","syncAriaSelected","selected","setAttribute","removeAttribute","syncAriaDisabled","updateDisabledOnClick","onclick","onClickFunc","handleSearch","detail","regexp","RegExp","boldedText","replace","match","textEl","innerHTML","componentWillLoad","addEventListener","render","h","Host","role","tabindex","focused","class","ref","wmSelectCss","Select","requiredMessage","intl","formatMessage","id","defaultMessage","selectAllMessage","deselectAllMessage","allOptionsSelectedMessage","allOptionsDeselectedMessage","keysSoFar","searchIndex","openUp","overflowCount","displayedOptions","debouncedClearKeysSoFar","debounce","debouncedSearch","wmSelectSearchChanged","filteredOptions","announce","resultsFoundMessage","noResultsFoundMessage","description","childOptions","Array","from","querySelectorAll","duplicateOptions","shadowRoot","allOptionEls","concat","visibleOptionEls","filter","option","classList","contains","searchFieldEl","value","selectedOptions","x","allSelected","every","numResults","toggleTabbingOn","isTabbing","toggleTabbingOff","handleOptionSelection","focusOption","selectOption","changedOption","wmSelectChanged","event","CustomEvent","dispatchEvent","close","isDuplicate","originalOption","findCorrespondingOption","o","handleChildEnter","handleChildUp","moveUp","handleChildDown","moveDown","moveToFirstOption","moveToLastOption","closePopupOnEscape","handleOptionBlur","isElOrChild","handleClick","target","handleSelectAllClick","deselectAllOptions","selectAllOptions","forEach","setSelectAllButton","setButtonText","handleButtonBlur","handleSearchFieldBlur","searchFieldWrapperEl","remove","handleKey","isExpanded","open","label","console","error","uid","generateId","document","body","componentDidLoad","wmSelectDidLoad","dropdownEl","add","forceUpdate","maxHeight","listboxEl","style","updateOptionVisibility","componentWillUpdate","visibleDuplicateOptions","idx","focusableEls","selectAllEl","unshift","prevEl","indexOf","nextEl","optionToSelect","elHeight","clientHeight","buttonHeight","buttonEl","shouldOpenUp","window","requestAnimationFrame","search","focus","scrollTop","slice","returnFocus","map","i","setTimeout","duplicateOption","scrollIntoView","block","correspondingOption","findAndFocusOption","character","nextMatch","findMatchInRange","list","startIndex","endIndex","optionsInRange","startsWith","exposeErrors","newId","errorContainer","renderErrorContainer","errorMessage","handleComponentBlur","wmSelectBlurred","wmComponentBlurred","handleKeyDown","y","overflowCounterWidth","computedStyle","getComputedStyle","paddingLeft","parseInt","getPropertyValue","paddingRight","availableSpace","clientWidth","optionsWidths","querySelector","optionsTotalWidth","reduce","acc","pop","message","liveRegionEl","announcement","renderButtonText","placeholder","allSelectedMessage","renderSubinfo","renderOverflowCount","renderSearchField","onKeyDown","onFocus","onBlur","onInput","searchPlaceholder","renderSearchFailedMessage","renderSelectAllButton","selectAll","onClick","renderDuplicateOptions","children","buttonProps","getTextDir","labelPosition","invalid","htmlFor","requiredField","Object","assign"],"sources":["./src/components/wm-option/wm-option.scss?tag=wm-option&encapsulation=shadow","./src/components/wm-option/wm-option.tsx","./src/components/wm-select/wm-select.scss?tag=wm-select&encapsulation=shadow","./src/components/wm-select/wm-select.tsx"],"sourcesContent":[":host(:not(:last-child)),\r\nwm-option:not(:last-child) {\r\n  border-bottom: 2px solid $list-border-bottom-color;\r\n}\r\n\r\n:host,\r\nwm-option {\r\n  display: block;\r\n  cursor: pointer;\r\n  position: relative;\r\n  padding: rem-calc(20);\r\n  background: $light-background;\r\n  font-family: inherit;\r\n  list-style: none;\r\n  color: $body-text-color;\r\n  user-select: none;\r\n\r\n  &:focus,\r\n  &.focus {\r\n    outline: none;\r\n    background: $background;\r\n  }\r\n\r\n  &.icon {\r\n    color: $button-default-text;\r\n  }\r\n\r\n  .sr-only {\r\n    @include srOnly;\r\n  }\r\n}\r\n\r\n.checkbox {\r\n  &:before {\r\n    @include mdi-icon;\r\n    content: \"\\f131\";\r\n    display: inline;\r\n    margin-right: rem-calc(4);\r\n    color: $periwinkle;\r\n  }\r\n}\r\n\r\n:host([aria-selected=\"true\"]),\r\nwm-option[aria-selected=\"true\"] {\r\n  background: $list-selected-background-color;\r\n  font-weight: 500;\r\n\r\n  .checkbox {\r\n    &:before {\r\n      content: \"\\f132\";\r\n    }\r\n  }\r\n}\r\n\r\n:host([aria-disabled=\"true\"]),\r\nwm-option[aria-disabled=\"true\"] {\r\n  font-style: italic;\r\n  color: $gray;\r\n  cursor: default;\r\n\r\n  .checkbox {\r\n    &:before {\r\n      color: $gray;\r\n    }\r\n  }\r\n}\r\n\r\n:host(.multi-option),\r\nwm-option.multi-option {\r\n  background: unset;\r\n}\r\n\r\n:host(.hidden),\r\nwm-option.hidden,\r\n:host(.filtered-out),\r\nwm-option.filtered-out {\r\n  display: none;\r\n}\r\n\r\n:host(.duplicate.last),\r\nwm-option.duplicate.last {\r\n  border-bottom: 12px solid $list-border-bottom-color;\r\n}\r\n\r\n:host(.hassubinfo),\r\nwm-option.hassubinfo {\r\n  display: flex;\r\n\r\n  .option-wrapper {\r\n    flex: 1;\r\n  }\r\n  .subinfo {\r\n    flex: none;\r\n  }\r\n}\r\n\r\n.subinfo {\r\n  font-style: italic;\r\n}\r\n\r\n.option-wrapper {\r\n  // necessary for multiselect overflow measurement\r\n  display: inline-block;\r\n}\r\n\r\n::slotted {\r\n  font-family: inherit;\r\n}\r\n\r\n::slotted(i) {\r\n  font-size: rem-calc(14);\r\n\r\n  &:before {\r\n    @include mdi-icon;\r\n    display: inline-block;\r\n    margin-right: rem-calc(10);\r\n    pointer-events: none;\r\n  }\r\n}\r\n\r\n:host(:focus),\r\nwm-option:focus {\r\n  outline: none;\r\n  background: $background;\r\n}\r\n\r\n:host(:hover) {\r\n  background: $background;\r\n  outline: none;\r\n}\r\n","import { h, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"wm-option\",\r\n  styleUrl: \"wm-option.scss\",\r\n  shadow: true,\r\n})\r\nexport class Option {\r\n  @Element() el!: HTMLElement;\r\n\r\n  @Prop() value?: string | null; // if devs pass a value as attribute they should be able to retrieve it by querying the property. This is untouched by the component.\r\n  @Prop({ mutable: true }) subinfo?: string = undefined;\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n  @Prop({ reflect: true }) selected: boolean = false;\r\n  @Prop() focused: boolean = false;\r\n\r\n  @Event() wmOptionSelected!: EventEmitter<HTMLWmOptionElement>;\r\n  @Event() wmKeyUpPressed!: EventEmitter<HTMLWmOptionElement>;\r\n  @Event() wmKeyDownPressed!: EventEmitter<HTMLWmOptionElement>;\r\n  @Event() wmEscKeyPressed!: EventEmitter<HTMLWmOptionElement>;\r\n  @Event() wmHomeKeyPressed!: EventEmitter<HTMLWmOptionElement>;\r\n  @Event() wmEndKeyPressed!: EventEmitter<HTMLWmOptionElement>;\r\n  @Event() wmEnterKeyPressed!: EventEmitter<HTMLWmOptionElement>;\r\n  @Event() wmLetterPressed!: EventEmitter<string>;\r\n  @Event() wmOptionBlurred!: EventEmitter<{ relatedTarget: EventTarget | null }>;\r\n\r\n  private onClickFunc!: (this: GlobalEventHandlers, ev: MouseEvent) => any;\r\n  @State() searchTerm: string = \"\";\r\n  private textEl!: HTMLDivElement;\r\n\r\n  get hostClasses() {\r\n    let classes = [];\r\n    if (this.subinfo) {\r\n      classes.push(\"hassubinfo\");\r\n    }\r\n    if (this.parentSelectEl.multiple) {\r\n      classes.push(\"multi-option\");\r\n    }\r\n    if (!this.el.textContent!.toLowerCase().includes(this.searchTerm)) {\r\n      classes.push(\"filtered-out\");\r\n    }\r\n    return classes.join(\" \");\r\n  }\r\n\r\n  get parentSelectEl() {\r\n    return this.el.parentElement?.nodeName !== \"WM-SELECT\"\r\n      ? ((this.el.getRootNode() as ShadowRoot).host as HTMLWmSelectElement)\r\n      : (this.el.parentElement as HTMLWmSelectElement);\r\n  }\r\n\r\n  @Listen(\"keydown\")\r\n  handleKeydown(ev: KeyboardEvent) {\r\n    switch (ev.key) {\r\n      case \"ArrowUp\":\r\n        ev.preventDefault();\r\n        this.wmKeyUpPressed.emit(this.el as HTMLWmOptionElement);\r\n        break;\r\n\r\n      case \"ArrowDown\":\r\n        ev.preventDefault();\r\n        this.wmKeyDownPressed.emit(this.el as HTMLWmOptionElement);\r\n        break;\r\n\r\n      case \"Enter\":\r\n        ev.preventDefault();\r\n        if (!this.disabled) {\r\n          this.el.click();\r\n          this.wmEnterKeyPressed.emit(this.el as HTMLWmOptionElement);\r\n        }\r\n        break;\r\n\r\n      case \" \":\r\n        ev.preventDefault();\r\n        this.el.click();\r\n        break;\r\n\r\n      case \"Escape\":\r\n        ev.preventDefault();\r\n        ev.stopPropagation(); // for instance if select is in a modal, esc should close the select but not the modal\r\n        this.wmEscKeyPressed.emit();\r\n        break;\r\n\r\n      case \"Home\":\r\n        ev.preventDefault();\r\n        this.wmHomeKeyPressed.emit();\r\n        break;\r\n\r\n      case \"End\":\r\n        ev.preventDefault();\r\n        this.wmEndKeyPressed.emit();\r\n        break;\r\n\r\n      default:\r\n        if (ev.key.length === 1) {\r\n          // emit for single characters (\"a\",\"l\",\"5\", etc), avoid others (\"shift\", \"control\", etc)\r\n          this.wmLetterPressed.emit(ev.key);\r\n        }\r\n    }\r\n  }\r\n\r\n  @Listen(\"click\")\r\n  handleSelection() {\r\n    if (!this.disabled) {\r\n      // the parent wm-select is in charge of the actual selection\r\n      // using ev.detail because ev.target returns the wm-select for duplicate options\r\n      this.wmOptionSelected.emit(this.el as HTMLWmOptionElement);\r\n    }\r\n  }\r\n\r\n  @Listen(\"blur\")\r\n  handleBlur(ev: FocusEvent) {\r\n    this.wmOptionBlurred.emit({ relatedTarget: ev.relatedTarget });\r\n  }\r\n\r\n  @Watch(\"selected\")\r\n  syncAriaSelected() {\r\n    // this function only keeps the aria-selected attr in sync with the selected prop\r\n    // all the logic for selecting / deselecting happens in the parent wm-select\r\n    this.selected ? this.el.setAttribute(\"aria-selected\", \"true\") : this.el.removeAttribute(\"aria-selected\");\r\n  }\r\n\r\n  @Watch(\"disabled\")\r\n  syncAriaDisabled() {\r\n    this.disabled ? this.el.setAttribute(\"aria-disabled\", \"true\") : this.el.removeAttribute(\"aria-disabled\");\r\n  }\r\n\r\n  @Watch(\"disabled\")\r\n  updateDisabledOnClick() {\r\n    if (this.disabled && this.el.onclick) {\r\n      this.onClickFunc = this.el.onclick;\r\n      this.el.onclick = null;\r\n    } else if (!this.disabled && this.onClickFunc) {\r\n      this.el.onclick = this.onClickFunc;\r\n    }\r\n  }\r\n\r\n  handleSearch(ev: CustomEvent) {\r\n    // filter is case-insensitive, so\r\n    this.searchTerm = ev.detail.searchTerm.toLowerCase();\r\n\r\n    if (this.searchTerm) {\r\n      const regexp = new RegExp(`${this.searchTerm}`, \"gi\");\r\n      const boldedText = this.el.textContent!.replace(regexp, (match) => `<strong>${match}</strong>`);\r\n      // for voiceover, text splitting is read as separate phrases. i.e. hel<b>lo</b> will be read as \"hel lo\"\r\n      // aria-hidden and sr-only is used to circumvent this\r\n      this.textEl.innerHTML = boldedText;\r\n    } else {\r\n      this.textEl.innerHTML = this.el.textContent!;\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.syncAriaSelected();\r\n    this.syncAriaDisabled();\r\n    this.updateDisabledOnClick();\r\n\r\n    this.parentSelectEl.addEventListener(\"wmSelectSearchChanged\", (ev) => this.handleSearch(ev as CustomEvent));\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host role=\"option\" tabindex={this.focused ? 0 : -1} class={this.hostClasses}>\r\n        <div class={`option-wrapper ${this.parentSelectEl.multiple ? \"checkbox\" : \"\"}`}>\r\n          <span aria-hidden=\"true\" ref={(el) => (this.textEl = el as HTMLDivElement)}>\r\n            {this.el.textContent}\r\n          </span>\r\n          <span class=\"sr-only\">{this.el.textContent}</span>\r\n        </div>\r\n        <div class=\"subinfo\">{this.subinfo}</div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n",":host {\r\n  position: relative;\r\n  display: block;\r\n  box-sizing: border-box;\r\n  font-family: inherit;\r\n\r\n  .sr-only {\r\n    @include srOnly;\r\n  }\r\n}\r\n\r\n@include label;\r\n\r\n.wrapper {\r\n  & .button-wrapper {\r\n    position: relative;\r\n    flex: 1;\r\n    font-size: rem-calc(18);\r\n    color: $button-default-text;\r\n    min-width: rem-calc(140);\r\n\r\n    .displayedoption {\r\n      @include border-radius(3px);\r\n      @include box-shadow(none);\r\n      display: flex;\r\n      align-items: center;\r\n      flex-wrap: nowrap;\r\n      background: transparent;\r\n      width: 100%;\r\n      border: solid 1px rgba(35, 35, 35, 0.6);\r\n      padding: rem-calc(0 30 0 15);\r\n      cursor: pointer;\r\n      height: rem-calc(40);\r\n      line-height: normal;\r\n      font-family: inherit;\r\n      color: $button-default-text;\r\n      font-weight: 400;\r\n      font-size: rem-calc(14);\r\n      text-transform: none;\r\n      text-align: left;\r\n\r\n      @media only screen and (max-width: 768px) {\r\n        height: rem-calc(44);\r\n      }\r\n\r\n      &:before {\r\n        @include mdi-icon;\r\n        content: \"\\f140\";\r\n        position: absolute;\r\n        right: rem-calc(9);\r\n        pointer-events: none;\r\n      }\r\n\r\n      &:hover:not(:disabled):not(.-disabled):not(.-raised) {\r\n        background: transparent;\r\n        text-decoration: none;\r\n      }\r\n\r\n      &:active {\r\n        // fix style bleed in Edge\r\n        -ms-transform: scale(1, 1) !important;\r\n        transform: scale(1, 1) !important;\r\n      }\r\n\r\n      &:focus {\r\n        outline: none;\r\n      }\r\n\r\n      &::-moz-focus-inner {\r\n        border: 0;\r\n      }\r\n\r\n      &.user-is-tabbing:focus {\r\n        @include focus-style;\r\n      }\r\n\r\n      .overflowcontrol {\r\n        display: block;\r\n        white-space: nowrap;\r\n        text-overflow: ellipsis;\r\n        overflow: hidden;\r\n        flex: 1;\r\n\r\n        &.hassubinfo {\r\n          display: flex;\r\n\r\n          .button-text {\r\n            flex: 1;\r\n            text-overflow: ellipsis;\r\n            overflow: hidden;\r\n            min-width: 0;\r\n          }\r\n          .subinfo {\r\n            flex: none;\r\n            font-style: italic;\r\n          }\r\n        }\r\n      }\r\n\r\n      .overflow-counter {\r\n        font-weight: bold;\r\n        margin-left: rem-calc(8);\r\n      }\r\n    }\r\n\r\n    > .displayedoption[disabled] {\r\n      color: #6b6b6b;\r\n      border-color: #8a8a8a;\r\n      background: #f0f0f0;\r\n      cursor: default;\r\n    }\r\n\r\n    > .dropdown {\r\n      -webkit-overflow-scrolling: touch;\r\n\r\n      @include box-shadow(0 4px 15px 0 rgba(0, 0, 0, 0.2));\r\n      @include transition(transform 0.25s ease);\r\n      @include scale($xVal: 1, $yVal: 0);\r\n      @include transformOrigin(center top);\r\n      @include border-radius(3px);\r\n      position: absolute;\r\n      top: 0;\r\n      right: 0;\r\n      background: #fff;\r\n      z-index: 100;\r\n      width: 100%;\r\n      font-size: rem-calc(14);\r\n\r\n      &.upwards {\r\n        top: unset;\r\n        bottom: calc(100% - 2.5rem);\r\n        @include transformOrigin(center bottom);\r\n      }\r\n\r\n      &.hidden {\r\n        visibility: hidden;\r\n      }\r\n    }\r\n\r\n    > .dropdown.open {\r\n      @include scale($xVal: 1, $yVal: 1);\r\n    }\r\n  }\r\n\r\n  &.invalid {\r\n    & .button-wrapper {\r\n      & .displayedoption {\r\n        @include invalid;\r\n      }\r\n    }\r\n  }\r\n\r\n  & .error-message {\r\n    color: $error-color;\r\n    font-size: rem-calc(14);\r\n    margin-top: rem-calc(4);\r\n    margin-bottom: rem-calc(4);\r\n    display: block;\r\n    top: 100%;\r\n    left: 0;\r\n    font-style: italic;\r\n  }\r\n}\r\n\r\n.options-wrapper {\r\n  max-height: rem-calc(200);\r\n  overflow: auto;\r\n}\r\n\r\n.select-all {\r\n  //display: inline-block;\r\n  width: 100%;\r\n  cursor: pointer;\r\n  padding: rem-calc(20);\r\n  border: none;\r\n  margin: 0;\r\n  border-bottom: 2px solid $list-border-bottom-color;\r\n  background: $light-background;\r\n  font-family: inherit;\r\n  font-size: inherit;\r\n  text-align: left; // fallback for browsers not supporting logical properties\r\n  text-align: start;\r\n  font-weight: 500;\r\n  color: $interactive-element;\r\n  user-select: none;\r\n\r\n  &:hover,\r\n  &:focus {\r\n    outline: none;\r\n    background: #f4f4f4;\r\n  }\r\n}\r\n\r\n.search {\r\n  box-sizing: border-box;\r\n  border-bottom: 2px solid $list-border-bottom-color;\r\n  padding: rem-calc(20);\r\n\r\n  .searchfield-wrapper {\r\n    box-sizing: border-box;\r\n    display: flex;\r\n    align-items: center;\r\n    height: rem-calc(44);\r\n    width: 100%;\r\n    padding: 0 rem-calc(12);\r\n    @include border-radius(3px);\r\n    border: 1px solid $input-border-color;\r\n    &:focus,\r\n    &.focus {\r\n      @include field-focus;\r\n    }\r\n  }\r\n  .searchfield {\r\n    width: 100%;\r\n    border: none;\r\n    outline: none;\r\n    font-family: inherit;\r\n    font-size: rem-calc(14);\r\n    margin-left: rem-calc(4);\r\n  }\r\n  .icon:before {\r\n    @include mdi-icon;\r\n    content: \"\\f349\";\r\n    color: $gray;\r\n    font-size: rem-calc(14);\r\n  }\r\n}\r\n\r\n.search-results-message {\r\n  padding: rem-calc(20);\r\n  color: $body-text-color;\r\n  font-size: rem-calc(14);\r\n  font-style: italic;\r\n}\r\n\r\n.rtl {\r\n  > .dropdown {\r\n    @include transformOrigin(left top);\r\n    left: 0;\r\n    right: auto;\r\n\r\n    .option {\r\n      padding-left: rem-calc(48);\r\n      padding-right: rem-calc(20);\r\n    }\r\n  }\r\n\r\n  > .displayedoption {\r\n    padding: rem-calc(0 15 0 30);\r\n    text-align: right;\r\n\r\n    &:before {\r\n      right: auto;\r\n      left: rem-calc(9);\r\n    }\r\n  }\r\n}\r\n","import { h, Component, Element, Event, EventEmitter, Listen, Prop, State, Watch, Host } from \"@stencil/core\";\r\nimport { forceUpdate } from \"@stencil/core\";\r\nimport { generateId, getTextDir, shouldOpenUp, intl, debounce } from \"../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"wm-select\",\r\n  styleUrl: \"wm-select.scss\",\r\n  shadow: { delegatesFocus: true },\r\n})\r\nexport class Select {\r\n  @Element() el!: HTMLWmSelectElement;\r\n\r\n  private uid!: string;\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n  @Prop({ mutable: true }) invalid: boolean = false;\r\n  @Prop() maxHeight?: string;\r\n  @Prop({ mutable: true }) label?: string;\r\n  @Prop() labelPosition: \"top\" | \"left\" | \"none\" = \"top\";\r\n  @Prop() requiredField: boolean = false;\r\n  @Prop({ mutable: true }) errorMessage: string = \"\";\r\n  @Prop() multiple: boolean = false;\r\n  @Prop() search: boolean = false;\r\n  @Prop() selectAll: boolean = false;\r\n  @Prop() placeholder: string = intl.formatMessage({\r\n    id: \"select.multiPlaceholder\",\r\n    defaultMessage: \"Make a selection\",\r\n    description: \"Placeholder text. Use imperative\",\r\n  });\r\n  @Prop() searchPlaceholder: string = intl.formatMessage({\r\n    id: \"select.searchPlaceholder\",\r\n    defaultMessage: \"Search\",\r\n    description: \"Placeholder text. Use imperative\",\r\n  });\r\n  @Prop() allSelectedMessage: string = intl.formatMessage({\r\n    id: \"select.allSelected\",\r\n    defaultMessage: \"All selected\",\r\n    description: \"Text displayed when all options are selected\",\r\n  });\r\n\r\n  requiredMessage = intl.formatMessage({\r\n    id: \"global.requiredField\",\r\n    defaultMessage: \"required field\",\r\n  });\r\n\r\n  selectAllMessage = intl.formatMessage({\r\n    id: \"select.selectAll\",\r\n    defaultMessage: \"Select All\",\r\n  });\r\n\r\n  deselectAllMessage = intl.formatMessage({\r\n    id: \"select.deselectAll\",\r\n    defaultMessage: \"Deselect All\",\r\n  });\r\n\r\n  allOptionsSelectedMessage = intl.formatMessage({\r\n    id: \"select.allOptionsSelected\",\r\n    defaultMessage: \"All options selected\",\r\n  });\r\n\r\n  allOptionsDeselectedMessage = intl.formatMessage({\r\n    id: \"select.allOptionsDeselected\",\r\n    defaultMessage: \"All options deselected\",\r\n  });\r\n\r\n  @State() isTabbing: boolean = false;\r\n  @State() isExpanded: boolean = false;\r\n  @State() announcement: string = \"\";\r\n  @Event() wmSelectDidLoad!: EventEmitter<void>;\r\n  @Event() wmSelectBlurred!: EventEmitter<void>;\r\n  @Event() wmSelectChanged!: EventEmitter<Object>;\r\n  @Event() wmComponentBlurred!: EventEmitter<void>; // deprecated in favor of wmSelectBlurred\r\n  @Event() wmSelectSearchChanged!: EventEmitter<Object>;\r\n\r\n  private buttonEl!: HTMLButtonElement;\r\n  private dropdownEl!: HTMLDivElement;\r\n  private selectAllEl!: HTMLButtonElement;\r\n  private listboxEl!: HTMLDivElement;\r\n  private liveRegionEl!: HTMLDivElement;\r\n  private searchFieldWrapperEl!: HTMLDivElement;\r\n  private searchFieldEl!: HTMLInputElement;\r\n  private errorContainer!: HTMLDivElement;\r\n  private keysSoFar: string = \"\";\r\n  private searchIndex: number = 0;\r\n  private openUp: boolean = false;\r\n  get childOptions() {\r\n    return Array.from(this.el.querySelectorAll(\"wm-option\"));\r\n  }\r\n  get duplicateOptions(): HTMLWmOptionElement[] {\r\n    return Array.from(this.el.shadowRoot!.querySelectorAll(\"wm-option\"));\r\n  }\r\n  get allOptionEls(): HTMLWmOptionElement[] {\r\n    // this includes both slotted wm-options and internally created wm-options\r\n    return this.duplicateOptions.concat(this.childOptions);\r\n  }\r\n  get visibleOptionEls(): HTMLWmOptionElement[] {\r\n    return this.allOptionEls.filter(\r\n      (option) => !option.classList.contains(\"hidden\") && !option.classList.contains(\"filtered-out\")\r\n    );\r\n  }\r\n\r\n  //////////////////////////////////////\r\n  // for search variants\r\n  get searchTerm(): string {\r\n    return this.searchFieldEl ? this.searchFieldEl.value : \"\";\r\n  }\r\n  get filteredOptions(): HTMLWmOptionElement[] {\r\n    return this.childOptions.filter((option) =>\r\n      option.textContent?.toLowerCase().includes(this.searchTerm.toLowerCase())\r\n    );\r\n  }\r\n  //////////////////////////////////////\r\n\r\n  //////////////////////////////////////\r\n  // for multiselect button text\r\n  private overflowCount: number = 0;\r\n  get selectedOptions(): HTMLWmOptionElement[] {\r\n    return Array.from(this.el.querySelectorAll(\"wm-option\")).filter((x) => x.selected);\r\n  }\r\n  private displayedOptions: HTMLWmOptionElement[] = [];\r\n  get allSelected() {\r\n    return this.childOptions.every((option) => option.selected);\r\n  }\r\n  //////////////////////////////////////\r\n\r\n  get resultsFoundMessage() {\r\n    return intl.formatMessage(\r\n      {\r\n        id: \"select.searchResultsFound\",\r\n        defaultMessage: \"{numResults, plural, one {1 option found} other {# options found}}\",\r\n        description: \"The message read by the screen reader, indicating how many results a search returned\",\r\n      },\r\n      { numResults: this.filteredOptions.length }\r\n    );\r\n  }\r\n\r\n  get noResultsFoundMessage() {\r\n    return intl.formatMessage({\r\n      id: \"select.noSearchResults\",\r\n      defaultMessage: \"No results found. Please try your search again.\",\r\n      description: \"The message displayed when no options pass the search filter\",\r\n    });\r\n  }\r\n\r\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\r\n  toggleTabbingOn() {\r\n    this.isTabbing = true;\r\n  }\r\n\r\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\r\n  toggleTabbingOff() {\r\n    this.isTabbing = false;\r\n  }\r\n\r\n  @Listen(\"wmOptionSelected\")\r\n  handleOptionSelection(ev: CustomEvent): void {\r\n    const option: HTMLWmOptionElement = ev.detail;\r\n    this.focusOption(option);\r\n    if (!this.multiple) {\r\n      // if the option was already selected, leave selected states untouched and don't fire the event\r\n      if (!option.selected) {\r\n        this.selectOption(option);\r\n        const detail = { changedOption: option, selectedOptions: [option] };\r\n        this.wmSelectChanged.emit(detail);\r\n        // change is deprecated in favor of wmSelectChanged\r\n        // because of issues with React wrappers when using native events name\r\n        const event = new CustomEvent(\"change\", { detail: detail });\r\n        // @ts-ignore\r\n        this.el.dispatchEvent(event);\r\n      }\r\n      this.close();\r\n    } else {\r\n      this.selectOption(option);\r\n      // we pass the original option with the event, as it's the only one the devs know or care about\r\n      // devs will typically set a `value` on the option, which is not copied over\r\n      // we could have taken the value and put it on the duplicate option,\r\n      // but this approach is more flexible (what if they want to have a data attribute?)\r\n      const isDuplicate: boolean = option.classList.contains(\"duplicate\");\r\n      const originalOption: HTMLWmOptionElement = isDuplicate ? this.findCorrespondingOption(option) : option;\r\n      const selectedOptions = this.childOptions.filter((o) => o.selected);\r\n      const detail = { changedOption: originalOption, selectedOptions: selectedOptions };\r\n      this.wmSelectChanged.emit(detail);\r\n      // change is deprecated in favor of wmSelectChanged\r\n      // because of issues with React wrappers when using native events name\r\n      const event = new CustomEvent(\"change\", { detail: detail });\r\n      // @ts-ignore\r\n      this.el.dispatchEvent(event);\r\n    }\r\n  }\r\n\r\n  @Listen(\"wmEnterKeyPressed\")\r\n  handleChildEnter(): void {\r\n    // only occurs for multiselects. handle the click, then close\r\n    this.close();\r\n  }\r\n\r\n  @Listen(\"wmKeyUpPressed\")\r\n  handleChildUp(ev: CustomEvent): void {\r\n    this.moveUp(ev.detail as HTMLWmOptionElement);\r\n  }\r\n\r\n  @Listen(\"wmKeyDownPressed\")\r\n  handleChildDown(ev: CustomEvent): void {\r\n    this.moveDown(ev.detail as HTMLWmOptionElement);\r\n  }\r\n\r\n  @Listen(\"wmHomeKeyPressed\")\r\n  moveToFirstOption(): void {\r\n    this.focusOption(this.visibleOptionEls[0]);\r\n  }\r\n\r\n  @Listen(\"wmEndKeyPressed\")\r\n  moveToLastOption(): void {\r\n    this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length - 1]);\r\n  }\r\n\r\n  @Listen(\"wmEscKeyPressed\")\r\n  closePopupOnEscape(): void {\r\n    this.close();\r\n  }\r\n\r\n  @Listen(\"wmOptionBlurred\")\r\n  handleOptionBlur(ev: CustomEvent): void {\r\n    // if the Option is blurred to something other than the component emit a blur event with the appropriate relatedTarget\r\n    // keeps our component's blur events accurate, and closes when focusing browser address bar\r\n    if (!this.isElOrChild(ev.detail.relatedTarget)) {\r\n      const event = new CustomEvent(\"blur\");\r\n      // @ts-ignore\r\n      event.relatedTarget = ev.detail.relatedTarget;\r\n      this.el.dispatchEvent(event);\r\n    }\r\n  }\r\n\r\n  @Listen(\"click\", { target: \"document\", capture: true })\r\n  handleClick(ev: MouseEvent): void {\r\n    if (!this.isElOrChild(ev.target as HTMLElement)) {\r\n      this.close();\r\n    }\r\n  }\r\n\r\n  handleSelectAllClick() {\r\n    this.allSelected ? this.deselectAllOptions() : this.selectAllOptions();\r\n  }\r\n\r\n  selectAllOptions() {\r\n    this.allOptionEls.forEach((o) => (o.selected = true));\r\n    this.setSelectAllButton();\r\n    this.setButtonText();\r\n    const detail = { changedOption: null, selectedOptions: this.childOptions };\r\n    this.wmSelectChanged.emit(detail);\r\n  }\r\n\r\n  deselectAllOptions() {\r\n    this.allOptionEls.forEach((o) => (o.selected = false));\r\n    this.setSelectAllButton();\r\n    this.setButtonText();\r\n    const detail = { changedOption: null, selectedOptions: [] };\r\n    this.wmSelectChanged.emit(detail);\r\n  }\r\n\r\n  handleButtonBlur(ev: FocusEvent) {\r\n    if (this.isElOrChild(ev.relatedTarget as HTMLElement)) {\r\n      // do not emit a blur event when opening the dropdown and focusing the Options\r\n      ev.stopPropagation();\r\n    }\r\n  }\r\n\r\n  handleSearchFieldBlur(ev: FocusEvent) {\r\n    this.searchFieldWrapperEl.classList.remove(\"focus\");\r\n    if (this.isElOrChild(ev.relatedTarget as HTMLElement)) {\r\n      // do not emit a blur event when moving from searchfield to options\r\n      ev.stopPropagation();\r\n    }\r\n  }\r\n\r\n  @Listen(\"keydown\")\r\n  handleKey(ev: KeyboardEvent): void {\r\n    switch (ev.key) {\r\n      case \"ArrowDown\":\r\n        if (this.isExpanded === false) {\r\n          ev.preventDefault();\r\n          this.open(\"next\");\r\n        }\r\n        break;\r\n\r\n      case \"ArrowUp\":\r\n        if (this.isExpanded === false) {\r\n          ev.preventDefault();\r\n          this.open(\"previous\");\r\n        }\r\n        break;\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (!this.label) {\r\n      console.error(\r\n        \"For accessibility purposes, this component requires a label (even if `label-position` is set to `none`).\"\r\n      );\r\n    }\r\n\r\n    this.uid = this.el.id ? this.el.id : generateId();\r\n\r\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\r\n      this.toggleTabbingOn();\r\n    }\r\n\r\n    // set initial selections\r\n    if (this.selectedOptions.length > 0) {\r\n      this.selectedOptions.forEach((x) => {\r\n        this.displayedOptions.push(x);\r\n      });\r\n      // single Select only, pre-select if no default option from dev\r\n    } else if (!this.multiple) {\r\n      this.selectOption(this.allOptionEls[0]);\r\n    }\r\n  }\r\n\r\n  componentDidLoad() {\r\n    this.wmSelectDidLoad.emit();\r\n    this.dropdownEl.classList.add(\"hidden\");\r\n    forceUpdate(this.el);\r\n\r\n    // Dev can overwrite the max-height rule set in the Sass file\r\n    if (this.maxHeight) {\r\n      this.listboxEl.style.maxHeight = this.maxHeight;\r\n    }\r\n\r\n    if (this.multiple) {\r\n      this.updateOptionVisibility();\r\n    }\r\n    this.setButtonText();\r\n  }\r\n\r\n  componentWillUpdate() {\r\n    if (this.multiple) {\r\n      // find last visible duplicate option and apply .last class\r\n      const visibleDuplicateOptions = this.visibleOptionEls.filter((option) => option.classList.contains(\"duplicate\"));\r\n      visibleDuplicateOptions.forEach((option, idx) => {\r\n        if (idx === visibleDuplicateOptions.length - 1) {\r\n          option.classList.add(\"last\");\r\n        } else {\r\n          option.classList.remove(\"last\");\r\n        }\r\n      });\r\n    }\r\n  }\r\n\r\n  moveUp(el: HTMLElement) {\r\n    const focusableEls: HTMLElement[] = this.visibleOptionEls;\r\n    if (this.selectAllEl) {\r\n      focusableEls.unshift(this.selectAllEl);\r\n    }\r\n    if (this.searchFieldEl) {\r\n      focusableEls.unshift(this.searchFieldEl);\r\n    }\r\n\r\n    const prevEl = focusableEls[focusableEls.indexOf(el) - 1] || focusableEls[focusableEls.length - 1];\r\n\r\n    if (prevEl) {\r\n      this.focusOption(prevEl);\r\n    }\r\n  }\r\n\r\n  moveDown(el: HTMLElement) {\r\n    const focusableEls: HTMLElement[] = this.visibleOptionEls;\r\n    if (this.selectAllEl) {\r\n      focusableEls.unshift(this.selectAllEl);\r\n    }\r\n    if (this.searchFieldEl) {\r\n      focusableEls.unshift(this.searchFieldEl);\r\n    }\r\n\r\n    const nextEl = focusableEls[focusableEls.indexOf(el) + 1] || focusableEls[0];\r\n\r\n    if (nextEl) {\r\n      this.focusOption(nextEl);\r\n    }\r\n  }\r\n\r\n  open(optionToSelect?: \"next\" | \"previous\"): void {\r\n    if (!this.disabled) {\r\n      const elHeight = this.el.clientHeight;\r\n      const buttonHeight = this.buttonEl.clientHeight;\r\n      this.openUp = shouldOpenUp(\r\n        this.el,\r\n        this.dropdownEl,\r\n        // when opening up, dropdown covers both label and button\r\n        elHeight,\r\n        // when opening down, dropdown covers only the button\r\n        buttonHeight\r\n      );\r\n      this.isExpanded = true;\r\n      this.dropdownEl.classList.remove(\"hidden\");\r\n\r\n      window.requestAnimationFrame(() => {\r\n        switch (optionToSelect) {\r\n          case \"next\":\r\n            // search variant focuses search field\r\n            // all others focus option \"after\" last selected option  (this can be the first option)\r\n            if (this.search) {\r\n              this.searchFieldEl.focus();\r\n              this.listboxEl.scrollTop = 0;\r\n            } else {\r\n              this.moveDown(this.visibleOptionEls.filter((x) => x.selected).slice(-1)[0]);\r\n            }\r\n            break;\r\n          case \"previous\":\r\n            // search variant focuses last option\r\n            // all others focus option \"above\" first selected option (this can be the last option)\r\n            if (this.search) {\r\n              this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length - 1]);\r\n            } else {\r\n              this.moveUp(this.visibleOptionEls.filter((x) => x.selected)[0]);\r\n            }\r\n            break;\r\n          default:\r\n            // search variant focuses search field\r\n            // all others focus the selected option\r\n            // if no option is selected (empty multiselect), focuses first option\r\n            if (this.search) {\r\n              this.searchFieldEl.focus();\r\n              this.listboxEl.scrollTop = 0;\r\n            } else if (this.selectedOptions.length > 0) {\r\n              this.focusOption(this.visibleOptionEls.filter((x) => x.selected)[0]);\r\n            } else {\r\n              this.focusOption(this.visibleOptionEls[0]);\r\n            }\r\n            break;\r\n        }\r\n      });\r\n    }\r\n  }\r\n\r\n  close(returnFocus: boolean = true): void {\r\n    if (this.isExpanded) {\r\n      this.isExpanded = false;\r\n      this.allOptionEls.map((i) => (i.focused = false));\r\n\r\n      window.setTimeout(() => {\r\n        this.dropdownEl.classList.add(\"hidden\");\r\n        if (this.multiple) {\r\n          this.updateOptionVisibility();\r\n        }\r\n        // clear search field, reset filtered / bolded state of wm-options\r\n        if (this.search) {\r\n          this.searchFieldEl.value = \"\";\r\n          this.wmSelectSearchChanged.emit({ searchTerm: this.searchTerm });\r\n        }\r\n        // Returns focus to button after popup closes (no need if user is tabbing)\r\n        // Delay is necessary for screenreader to get new expanded state before focus\r\n        // window.requestAnimationFrame is probably enough, but since we are already using setTimeout it may as well be here\r\n        // also UX wise, it makes sense for the button to only be focused after the animation is complete\r\n        if (returnFocus) {\r\n          this.buttonEl.focus();\r\n        }\r\n      }, 150);\r\n    }\r\n  }\r\n\r\n  updateOptionVisibility() {\r\n    // this runs for search multiselects, where selected options are rendered at the top of the dropdown list\r\n    // slotted wm-options are hidden if selected, and duplicate wm-options are made visible if selected\r\n    this.childOptions.forEach((option, idx) => {\r\n      const duplicateOption = this.duplicateOptions[idx];\r\n      if (option.selected) {\r\n        option.classList.add(\"hidden\");\r\n        duplicateOption.classList.remove(\"hidden\");\r\n      } else {\r\n        option.classList.remove(\"hidden\");\r\n        duplicateOption.classList.add(\"hidden\");\r\n      }\r\n    });\r\n  }\r\n\r\n  focusOption(option: HTMLElement): void {\r\n    this.allOptionEls.forEach((i) => (i.focused = i === option));\r\n\r\n    // option must be scrolledIntoView before focused\r\n    // if focus is called first the option might be positioned incorrectly (in the center of the dropdown) and scrollIntoView will do nothing as the option will already be in view\r\n    option.scrollIntoView({ block: \"nearest\" });\r\n\r\n    // scrollIntoView does not work when the container of the element it's called on is not rendered to the page (in our case the dropdown is still closed and has transform: scaleY(0))\r\n    // when opening the dropdown, scrollIntoView must be delayed to a point where the browser recognizes content within it as able to be scrolled to\r\n    // in Safari in particular, the soonest this seems to happen is 20ms. The longest we can wait before any jumping in the open dropdown is noticeable is 60ms\r\n    window.setTimeout(() => option.scrollIntoView({ block: \"nearest\" }), 60);\r\n\r\n    option.focus();\r\n  }\r\n\r\n  selectOption(option: HTMLWmOptionElement): void {\r\n    // beware of this function's name. For multiselect it actually toggles the selected state, so it can also deselect the option\r\n    if (option.classList.contains(\"duplicate\")) {\r\n      // if clicking on a duplicate option, toggle selected property of real one, then rerender\r\n      const correspondingOption = this.findCorrespondingOption(option);\r\n      correspondingOption.selected = !correspondingOption.selected;\r\n      forceUpdate(this.el);\r\n    } else if (this.multiple) {\r\n      option.selected = !option.selected;\r\n    } else {\r\n      this.childOptions.forEach((x) => (x.selected = x === option));\r\n    }\r\n    // update the selectAll checkbox when an option is de/selected\r\n    // checking is the el is present, implies that this.multiple and this.selectAll are true\r\n    if (this.selectAllEl) {\r\n      this.setSelectAllButton();\r\n    }\r\n    this.setButtonText();\r\n  }\r\n\r\n  @Listen(\"wmLetterPressed\")\r\n  findAndFocusOption(ev: CustomEvent): void {\r\n    const character = ev.detail.toLowerCase();\r\n\r\n    if (!this.keysSoFar) {\r\n      // if first character entered, set currently focused option as the starting index for the search\r\n      this.visibleOptionEls.forEach((option, idx) => {\r\n        if (option.focused) {\r\n          this.searchIndex = idx;\r\n        }\r\n      });\r\n    }\r\n\r\n    this.keysSoFar += character;\r\n\r\n    let nextMatch = this.findMatchInRange(this.visibleOptionEls, this.searchIndex + 1, this.visibleOptionEls.length);\r\n    if (!nextMatch) {\r\n      // if match can't be found from starting option downwards, search from top\r\n      nextMatch = this.findMatchInRange(this.visibleOptionEls, 0, this.searchIndex);\r\n    }\r\n\r\n    if (nextMatch) {\r\n      // findMatchInRange still might have returned null, only focus if match found\r\n      this.focusOption(nextMatch as HTMLWmOptionElement);\r\n    }\r\n    this.debouncedClearKeysSoFar();\r\n  }\r\n\r\n  debouncedClearKeysSoFar = debounce(() => {\r\n    this.keysSoFar = \"\";\r\n  }, 500);\r\n\r\n  findMatchInRange(list: HTMLWmOptionElement[], startIndex: number, endIndex: number): HTMLWmOptionElement | null {\r\n    let match: HTMLWmOptionElement | null = null;\r\n    let optionsInRange = list.slice(startIndex, endIndex);\r\n\r\n    // Find the first option starting with the keysSoFar substring, searching in\r\n    // the specified range of options\r\n    optionsInRange.forEach((option) => {\r\n      const label = option.textContent;\r\n      if (!match && label && label.toLowerCase().startsWith(this.keysSoFar)) {\r\n        match = option;\r\n      }\r\n    });\r\n\r\n    return match;\r\n  }\r\n\r\n  findCorrespondingOption(el: HTMLWmOptionElement): HTMLWmOptionElement {\r\n    // if duplicate, returns the child wm-option\r\n    // if child wm-option, returns duplicate\r\n    const isDuplicate = el.classList.contains(\"duplicate\");\r\n    return isDuplicate\r\n      ? this.childOptions[this.duplicateOptions.indexOf(el)]\r\n      : this.duplicateOptions[this.childOptions.indexOf(el)];\r\n  }\r\n\r\n  isElOrChild(el: HTMLElement) {\r\n    // determines whether or not the element is the component, a child of the component, or exists within the component's shadowroot\r\n    return el === this.el || this.el.contains(el) || this.el.shadowRoot?.contains(el);\r\n  }\r\n\r\n  @Watch(\"errorMessage\")\r\n  exposeErrors() {\r\n    // When the error changes, a new id is set for the error container and the button's aria-describedby attribute is updated accordingly. This is to make sure the screen reader announces teh updated errors in Firefox. See this longstanding bug: https://bugzilla.mozilla.org/show_bug.cgi?id=493683\r\n    const newId = generateId();\r\n    this.errorContainer.id = `wm-errors-${newId}`;\r\n    this.buttonEl.setAttribute(\"aria-describedby\", `wm-errors-${newId}`);\r\n  }\r\n\r\n  renderErrorContainer() {\r\n    return (\r\n      <div\r\n        id=\"wm-errors\"\r\n        class={this.errorMessage ? \"error-message\" : \"\"}\r\n        ref={(el) => (this.errorContainer = el as HTMLDivElement)}\r\n        aria-live=\"assertive\"\r\n        aria-atomic=\"true\"\r\n      >\r\n        {this.errorMessage}\r\n      </div>\r\n    );\r\n  }\r\n\r\n  handleComponentBlur(ev: FocusEvent): void {\r\n    // Do not close or emit custom blur event when blurring to an element inside (wm-option)\r\n    if (!this.el.contains(ev.relatedTarget as Node)) {\r\n      this.close(false);\r\n      this.wmSelectBlurred.emit();\r\n      this.wmComponentBlurred.emit(); // deprecated\r\n    }\r\n  }\r\n\r\n  // on search field or select all. keydown on options is handled via events.\r\n  handleKeyDown(ev: KeyboardEvent) {\r\n    const el = ev.target as HTMLElement;\r\n    switch (ev.key) {\r\n      case \"ArrowDown\":\r\n        ev.preventDefault();\r\n        this.moveDown(ev.target as HTMLElement);\r\n        break;\r\n      case \"ArrowUp\":\r\n        ev.preventDefault();\r\n        this.moveUp(ev.target as HTMLElement);\r\n        break;\r\n      case \"Escape\":\r\n        ev.preventDefault();\r\n        this.close();\r\n        break;\r\n      case \"Enter\":\r\n        if (el === this.selectAllEl) {\r\n          ev.preventDefault();\r\n          this.handleSelectAllClick();\r\n          this.close();\r\n        }\r\n        break;\r\n      case \" \":\r\n        if (el === this.selectAllEl) {\r\n          ev.preventDefault();\r\n          this.handleSelectAllClick();\r\n        }\r\n        break;\r\n    }\r\n  }\r\n\r\n  debouncedSearch = debounce(() => {\r\n    this.wmSelectSearchChanged.emit({ searchTerm: this.searchTerm });\r\n\r\n    if (this.filteredOptions.length) {\r\n      this.announce(this.resultsFoundMessage);\r\n    } else {\r\n      this.announce(this.noResultsFoundMessage);\r\n    }\r\n  }, 150);\r\n\r\n  setButtonText() {\r\n    this.displayedOptions = this.childOptions\r\n      .filter((x) => x.selected)\r\n      .map((y) => (!y.classList.contains(\"hidden\") ? y : this.findCorrespondingOption(y)));\r\n\r\n    // handle overflow + counter for multiselect\r\n    if (this.multiple) {\r\n      // this is a fixed measurement accounting for the max width of a 3 character overflow counter\r\n      const overflowCounterWidth = 38;\r\n      const computedStyle = window.getComputedStyle(this.buttonEl);\r\n\r\n      // there seems to be no quick way to get an elements width without padding, except for subtracting padding manually\r\n      const paddingLeft = parseInt(computedStyle.getPropertyValue(\"padding-left\").slice(0, -2));\r\n      const paddingRight = parseInt(computedStyle.getPropertyValue(\"padding-right\").slice(0, -2));\r\n\r\n      const availableSpace = this.buttonEl.clientWidth - paddingLeft - paddingRight - overflowCounterWidth;\r\n\r\n      let optionsWidths = this.displayedOptions.map((x) => x.shadowRoot!.querySelector(\".option-wrapper\")!.clientWidth);\r\n\r\n      let optionsTotalWidth = optionsWidths.reduce((acc, x) => acc + x, 0);\r\n      this.overflowCount = 0;\r\n\r\n      while (optionsTotalWidth > availableSpace && this.displayedOptions.length > 1) {\r\n        this.overflowCount++;\r\n        optionsTotalWidth -= optionsWidths[optionsWidths.length - 1];\r\n        optionsWidths.pop();\r\n        this.displayedOptions.pop();\r\n      }\r\n    }\r\n  }\r\n\r\n  setSelectAllButton() {\r\n    if (this.allSelected) {\r\n      this.selectAllEl.textContent = this.deselectAllMessage;\r\n      this.announce(this.allOptionsSelectedMessage);\r\n    } else {\r\n      this.selectAllEl.textContent = this.selectAllMessage;\r\n      if (this.selectedOptions.length === 0) {\r\n        this.announce(this.allOptionsDeselectedMessage);\r\n      }\r\n    }\r\n  }\r\n\r\n  announce(message: string) {\r\n    // \\u00A0 is a non-breaking space character, which causes the message to be read as a new one\r\n    if (this.liveRegionEl.textContent === message) {\r\n      message += \"\\u00A0\";\r\n    }\r\n    this.announcement = message;\r\n  }\r\n\r\n  renderButtonText() {\r\n    if (this.multiple && this.displayedOptions.length < 1) {\r\n      return <span>{this.placeholder}</span>;\r\n    } else if (this.multiple && this.allSelected && this.overflowCount > 0) {\r\n      return this.allSelectedMessage;\r\n    } else {\r\n      return this.displayedOptions.map((x, idx) => (\r\n        <span>\r\n          {idx > 0 ? \", \" : \"\"}\r\n          {x.textContent}\r\n        </span>\r\n      ));\r\n    }\r\n  }\r\n\r\n  renderSubinfo() {\r\n    // multiselects cannot have subinfo for options\r\n    if (!this.multiple && this.selectedOptions.length > 0 && this.selectedOptions[0].subinfo) {\r\n      return <span class=\"subinfo\">{this.selectedOptions[0].subinfo}</span>;\r\n    }\r\n  }\r\n\r\n  renderOverflowCount() {\r\n    if (this.overflowCount > 0 && !this.allSelected) {\r\n      return (\r\n        <span>\r\n          <span class=\"overflow-counter\">+{this.overflowCount}</span>\r\n        </span>\r\n      );\r\n    }\r\n  }\r\n\r\n  renderSearchField() {\r\n    return (\r\n      <div class=\"search\">\r\n        <div class=\"searchfield-wrapper\" ref={(el) => (this.searchFieldWrapperEl = el as HTMLInputElement)}>\r\n          <div class=\"icon\"></div>\r\n          <input\r\n            ref={(el) => (this.searchFieldEl = el as HTMLInputElement)}\r\n            class=\"searchfield\"\r\n            role=\"combobox\"\r\n            aria-controls={`list-${this.uid}`}\r\n            aria-expanded={this.isExpanded ? \"true\" : \"false\"}\r\n            onKeyDown={(ev) => this.handleKeyDown(ev)}\r\n            onFocus={() => this.searchFieldWrapperEl.classList.add(\"focus\")}\r\n            onBlur={(ev) => this.handleSearchFieldBlur(ev)}\r\n            onInput={() => this.debouncedSearch()}\r\n            placeholder={this.searchPlaceholder}\r\n          ></input>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  renderSearchFailedMessage() {\r\n    return <div class=\"search-results-message\">{this.noResultsFoundMessage}</div>;\r\n  }\r\n\r\n  renderSelectAllButton() {\r\n    if (this.selectAll && this.multiple && this.searchTerm == \"\") {\r\n      return (\r\n        <button\r\n          ref={(el) => (this.selectAllEl = el as HTMLButtonElement)}\r\n          class=\"select-all\"\r\n          onClick={() => this.handleSelectAllClick()}\r\n          onKeyDown={(ev) => this.handleKeyDown(ev)}\r\n          tabindex=\"-1\"\r\n        >\r\n          {this.allSelected ? this.deselectAllMessage : this.selectAllMessage}\r\n        </button>\r\n      );\r\n    }\r\n  }\r\n\r\n  renderDuplicateOptions() {\r\n    return Array.from(this.el.children).map((option) => {\r\n      return (\r\n        <wm-option class=\"duplicate\" selected={(option as HTMLWmOptionElement).selected}>\r\n          {option.textContent}\r\n        </wm-option>\r\n      );\r\n    });\r\n  }\r\n\r\n  render() {\r\n    const buttonProps = {\r\n      id: `selectbtn-${this.uid}`,\r\n      [\"disabled\"]: this.disabled,\r\n      [\"aria-controls\"]: `list-${this.uid}`,\r\n      [\"aria-labelledby\"]: `label-${this.uid} selectbtn-${this.uid}`,\r\n      [\"aria-describedby\"]: \"wm-errors\",\r\n      [\"aria-expanded\"]: this.isExpanded ? \"true\" : \"false\",\r\n      onClick: () => (this.isExpanded ? this.close() : this.open()),\r\n    };\r\n\r\n    return (\r\n      <Host onBlur={(ev: FocusEvent) => this.handleComponentBlur(ev)}>\r\n        <div\r\n          class={`wrapper ${getTextDir()} label-${this.labelPosition} ${\r\n            this.invalid || this.errorMessage ? \"invalid\" : \"\"\r\n          }`}\r\n        >\r\n          <div class=\"label-wrapper\">\r\n            <label class=\"label\" id={`label-${this.uid}`} htmlFor={`selectbtn-${this.uid}`}>\r\n              {this.label}\r\n              {\r\n                // we can't use aria-required or required attributes because it's invalid on the elements we're using (button controlling a listbox)\r\n                this.requiredField ? (\r\n                  <span class=\"required\">\r\n                    <span class=\"sr-only\">{this.requiredMessage}</span>\r\n                    <span aria-hidden=\"true\">*</span>\r\n                  </span>\r\n                ) : (\r\n                  \"\"\r\n                )\r\n              }\r\n            </label>\r\n          </div>\r\n          <div class=\"button-wrapper\">\r\n            <button\r\n              {...buttonProps}\r\n              class={`displayedoption ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}\r\n              ref={(el) => (this.buttonEl = el as HTMLButtonElement)}\r\n              onBlur={(ev) => this.handleButtonBlur(ev)}\r\n              onFocus={() => this.close()}\r\n            >\r\n              <span\r\n                class={\r\n                  this.selectedOptions.length > 0 && this.selectedOptions.filter((x) => x.subinfo).length > 0\r\n                    ? \"overflowcontrol hassubinfo\"\r\n                    : \"overflowcontrol\"\r\n                }\r\n              >\r\n                <span class=\"button-text\">{this.renderButtonText()}</span>\r\n                {this.renderSubinfo()}\r\n              </span>\r\n              {this.renderOverflowCount()}\r\n            </button>\r\n            <div\r\n              class={`dropdown ${this.isExpanded ? \"open\" : \"\"} ${this.openUp ? \"upwards\" : \"\"}`}\r\n              ref={(el) => (this.dropdownEl = el as HTMLDivElement)}\r\n            >\r\n              {this.search && this.renderSearchField()}\r\n              <div\r\n                id={`list-${this.uid}`}\r\n                class=\"options-wrapper\"\r\n                tabindex={-1}\r\n                role=\"listbox\"\r\n                aria-multiselectable={this.multiple ? \"true\" : null}\r\n                aria-labelledby={`label-${this.uid}`}\r\n                ref={(el) => (this.listboxEl = el as HTMLDivElement)}\r\n              >\r\n                {this.search && this.filteredOptions.length === 0 && this.renderSearchFailedMessage()}\r\n                {this.renderSelectAllButton()}\r\n                {this.multiple && this.renderDuplicateOptions()}\r\n                <slot />\r\n              </div>\r\n            </div>\r\n            {this.renderErrorContainer()}\r\n            <div\r\n              id=\"announcement\"\r\n              aria-live=\"polite\"\r\n              class=\"sr-only\"\r\n              ref={(el) => (this.liveRegionEl = el as HTMLDivElement)}\r\n            >\r\n              {this.announcement}\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/p-d939cb54.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["wmFileListCss","FileList","fileList","this","files","JSON","parse","handleFileDownloaded","ev","wmFileDownload","emit","detail","handleFilePreviewed","wmFilePreview","handleFileDeleted","wmFileDelete","renderFile","file","fileActions","undefined","h","stringify","showInfo","render","role","class","map"],"sources":["./src/components/wm-file-list/wm-file-list.scss?tag=wm-file-list&encapsulation=shadow","./src/components/wm-file-list/wm-file-list.tsx"],"sourcesContent":[":host,\nwm-file-list {\n  display: block;\n}\n\n.list-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: rem-calc(8);\n}\n","import { h, Component, Element, Event, EventEmitter, Listen, Prop } from \"@stencil/core\";\nimport { UploadedFile } from \"../../global/interfaces\";\n\n@Component({\n  tag: \"wm-file-list\",\n  styleUrl: \"wm-file-list.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class FileList {\n  @Element() el!: HTMLWmFileListElement;\n  @Prop() files?: string;\n  @Prop() showInfo: \"time\" | \"size\" | \"none\" = \"time\";\n\n  @Event() wmFileDelete!: EventEmitter<string>;\n  @Event() wmFileDownload!: EventEmitter<string>;\n  @Event() wmFilePreview!: EventEmitter<string>;\n\n  get fileList(): [UploadedFile] {\n    return this.files ? JSON.parse(this.files) : [];\n  }\n\n  @Listen(\"wmIntFileDownloaded\")\n  handleFileDownloaded(ev: CustomEvent) {\n    this.wmFileDownload.emit(ev.detail);\n  }\n\n  @Listen(\"wmIntFilePreviewed\")\n  handleFilePreviewed(ev: CustomEvent) {\n    this.wmFilePreview.emit(ev.detail);\n  }\n\n  @Listen(\"wmIntFileDeleted\")\n  handleFileDeleted(ev: CustomEvent) {\n    this.wmFileDelete.emit(ev.detail);\n  }\n\n  renderFile(file: UploadedFile) {\n    // file list does not allow for default file actions\n    // if none are passed, display no buttons\n    if (file.fileActions === undefined) {\n      file.fileActions = \"\";\n    }\n    return <wm-file file={JSON.stringify(file)} show-info={this.showInfo}></wm-file>;\n  }\n\n  render() {\n    return (\n      <div role=\"list\" class=\"list-wrapper\">\n        {this.fileList.map((file: UploadedFile) => this.renderFile(file))}\n      </div>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,8I,MCQTC,EAAQ,M,mMAG0B,M,CAMzCC,eACF,OAAOC,KAAKC,MAAQC,KAAKC,MAAMH,KAAKC,OAAS,E,CAI/CG,qBAAqBC,GACnBL,KAAKM,eAAeC,KAAKF,EAAGG,O,CAI9BC,oBAAoBJ,GAClBL,KAAKU,cAAcH,KAAKF,EAAGG,O,CAI7BG,kBAAkBN,GAChBL,KAAKY,aAAaL,KAAKF,EAAGG,O,CAG5BK,WAAWC,GAGT,GAAIA,EAAKC,cAAgBC,UAAW,CAClCF,EAAKC,YAAc,E,CAErB,OAAOE,EAAA,WAASH,KAAMZ,KAAKgB,UAAUJ,GAAK,YAAad,KAAKmB,U,CAG9DC,SACE,OACEH,EAAA,OAAKI,KAAK,OAAOC,MAAM,gBACpBtB,KAAKD,SAASwB,KAAKT,GAAuBd,KAAKa,WAAWC,K"}
+{"version":3,"names":["wmFileListCss","FileList","fileList","this","files","JSON","parse","handleFileDownloaded","ev","wmFileDownload","emit","detail","handleFilePreviewed","wmFilePreview","handleFileDeleted","wmFileDelete","renderFile","file","fileActions","undefined","h","stringify","showInfo","render","role","class","map"],"sources":["./src/components/wm-file-list/wm-file-list.scss?tag=wm-file-list&encapsulation=shadow","./src/components/wm-file-list/wm-file-list.tsx"],"sourcesContent":[":host,\r\nwm-file-list {\r\n  display: block;\r\n}\r\n\r\n.list-wrapper {\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: rem-calc(8);\r\n}\r\n","import { h, Component, Element, Event, EventEmitter, Listen, Prop } from \"@stencil/core\";\r\nimport { UploadedFile } from \"../../global/interfaces\";\r\n\r\n@Component({\r\n  tag: \"wm-file-list\",\r\n  styleUrl: \"wm-file-list.scss\",\r\n  shadow: { delegatesFocus: true },\r\n})\r\nexport class FileList {\r\n  @Element() el!: HTMLWmFileListElement;\r\n  @Prop() files?: string;\r\n  @Prop() showInfo: \"time\" | \"size\" | \"none\" = \"time\";\r\n\r\n  @Event() wmFileDelete!: EventEmitter<string>;\r\n  @Event() wmFileDownload!: EventEmitter<string>;\r\n  @Event() wmFilePreview!: EventEmitter<string>;\r\n\r\n  get fileList(): [UploadedFile] {\r\n    return this.files ? JSON.parse(this.files) : [];\r\n  }\r\n\r\n  @Listen(\"wmIntFileDownloaded\")\r\n  handleFileDownloaded(ev: CustomEvent) {\r\n    this.wmFileDownload.emit(ev.detail);\r\n  }\r\n\r\n  @Listen(\"wmIntFilePreviewed\")\r\n  handleFilePreviewed(ev: CustomEvent) {\r\n    this.wmFilePreview.emit(ev.detail);\r\n  }\r\n\r\n  @Listen(\"wmIntFileDeleted\")\r\n  handleFileDeleted(ev: CustomEvent) {\r\n    this.wmFileDelete.emit(ev.detail);\r\n  }\r\n\r\n  renderFile(file: UploadedFile) {\r\n    // file list does not allow for default file actions\r\n    // if none are passed, display no buttons\r\n    if (file.fileActions === undefined) {\r\n      file.fileActions = \"\";\r\n    }\r\n    return <wm-file file={JSON.stringify(file)} show-info={this.showInfo}></wm-file>;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div role=\"list\" class=\"list-wrapper\">\r\n        {this.fileList.map((file: UploadedFile) => this.renderFile(file))}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"yDAAA,MAAMA,EAAgB,8I,MCQTC,EAAQ,M,mMAG0B,M,CAMzCC,eACF,OAAOC,KAAKC,MAAQC,KAAKC,MAAMH,KAAKC,OAAS,E,CAI/CG,qBAAqBC,GACnBL,KAAKM,eAAeC,KAAKF,EAAGG,O,CAI9BC,oBAAoBJ,GAClBL,KAAKU,cAAcH,KAAKF,EAAGG,O,CAI7BG,kBAAkBN,GAChBL,KAAKY,aAAaL,KAAKF,EAAGG,O,CAG5BK,WAAWC,GAGT,GAAIA,EAAKC,cAAgBC,UAAW,CAClCF,EAAKC,YAAc,E,CAErB,OAAOE,EAAA,WAASH,KAAMZ,KAAKgB,UAAUJ,GAAK,YAAad,KAAKmB,U,CAG9DC,SACE,OACEH,EAAA,OAAKI,KAAK,OAAOC,MAAM,gBACpBtB,KAAKD,SAASwB,KAAKT,GAAuBd,KAAKa,WAAWC,K"}

package/dist/ripple/p-dbfd1640.system.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["TagInputRow","exports","class_1","prototype","componentDidUpdate","this","wmTagInputRowUpdated","emit"],"sources":["src/components/wm-tag-input/wm-tag-input-row/wm-tag-input-row.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter, Prop } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-tag-input-row\",\n})\nexport class TagInputRow {\n  @Element() el!: HTMLWmTagInputRowElement;\n\n  @Prop({ attribute: \"col1\" }) col1?: string;\n  @Prop({ attribute: \"col2\" }) col2?: string;\n  @Prop({ attribute: \"col3\" }) col3?: string;\n  @Prop({ attribute: \"col4\" }) col4?: string;\n  @Prop() locked: boolean = false;\n\n  @Event() wmTagInputRowUpdated!: EventEmitter<void>;\n\n  componentDidUpdate() {\n    this.wmTagInputRowUpdated.emit();\n  }\n}\n"],"mappings":"sJAKaA,EAAWC,EAAA,8B,+KAOI,K,CAI1BC,EAAAC,UAAAC,mBAAA,WACEC,KAAKC,qBAAqBC,M,uHAZN,G"}
+{"version":3,"names":["TagInputRow","exports","class_1","prototype","componentDidUpdate","this","wmTagInputRowUpdated","emit"],"sources":["src/components/wm-tag-input/wm-tag-input-row/wm-tag-input-row.tsx"],"sourcesContent":["import { Component, Element, Event, EventEmitter, Prop } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"wm-tag-input-row\",\r\n})\r\nexport class TagInputRow {\r\n  @Element() el!: HTMLWmTagInputRowElement;\r\n\r\n  @Prop({ attribute: \"col1\" }) col1?: string;\r\n  @Prop({ attribute: \"col2\" }) col2?: string;\r\n  @Prop({ attribute: \"col3\" }) col3?: string;\r\n  @Prop({ attribute: \"col4\" }) col4?: string;\r\n  @Prop() locked: boolean = false;\r\n\r\n  @Event() wmTagInputRowUpdated!: EventEmitter<void>;\r\n\r\n  componentDidUpdate() {\r\n    this.wmTagInputRowUpdated.emit();\r\n  }\r\n}\r\n"],"mappings":"sJAKaA,EAAWC,EAAA,8B,+KAOI,K,CAI1BC,EAAAC,UAAAC,mBAAA,WACEC,KAAKC,qBAAqBC,M,uHAZN,G"}

package/dist/ripple/{p-bc883afc.entry.js → p-e29c4789.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as a,g as n}from"./p-1c23de4a.js";import{d as i}from"./p-9fd3badc.js";const s='nav .largescreen,nav .smallscreen{margin-bottom:0.625rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:flex-end;-ms-flex-pack:flex-end;-webkit-justify-content:flex-end;justify-content:flex-end;font-size:0.875rem}nav .largescreen .pageview,nav .smallscreen .pageview{font-size:0.875rem;margin:0 0.625rem}nav .largescreen .paginationbtn,nav .smallscreen .paginationbtn{position:relative;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-ms-transition:none;-webkit-transition:none;-moz-transition:none;transition:none;border:none;color:#575195;background-color:transparent;margin:0;padding:0;height:2.5rem;width:2.5rem;font-family:inherit;letter-spacing:0.3px;font-size:0.875rem;font-weight:500;cursor:pointer;text-transform:none}nav .largescreen .paginationbtn svg *,nav .smallscreen .paginationbtn svg *{fill:#565397}nav .largescreen .paginationbtn:hover:not([aria-current=page]):not([disabled]),nav .smallscreen .paginationbtn:hover:not([aria-current=page]):not([disabled]){text-decoration:underline}nav .largescreen .paginationbtn:focus,nav .smallscreen .paginationbtn:focus{outline:none}nav .largescreen .paginationbtn::-moz-focus-inner,nav .smallscreen .paginationbtn::-moz-focus-inner{border:0;outline:none}nav .largescreen .paginationbtn[disabled],nav .smallscreen .paginationbtn[disabled]{color:#9f9f9f;pointer-events:none}nav .largescreen .paginationbtn[disabled] svg *,nav .smallscreen .paginationbtn[disabled] svg *{fill:#9f9f9f}nav .largescreen .previousbtn,nav .smallscreen .previousbtn{margin-right:0.625rem;width:auto !important}nav .largescreen .nextbtn,nav .smallscreen .nextbtn{margin-left:0.625rem;margin-right:0;width:auto !important}nav .largescreen .previousbtn,nav .largescreen .nextbtn,nav .smallscreen .previousbtn,nav .smallscreen .nextbtn{-ms-transition:none;-webkit-transition:none;-moz-transition:none;transition:none}nav .largescreen .ellipsis,nav .smallscreen .ellipsis{display:inline-block;width:2.5rem;text-align:center}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]),nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]):before,nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]):before{position:absolute;content:"";height:auto;width:16px;top:0;bottom:0;left:12px;right:0;background:-webkit-gradient(linear, left top, right top, color-stop(66%, #3862e9), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 2px;background-position:0 2em;border-radius:0;line-height:normal}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).previousbtn:focus:before,nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).previousbtn:focus:before{left:0 !important}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).nextbtn:focus:before,nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).nextbtn:focus:before{left:0 !important}nav .largescreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus,nav .smallscreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}nav .largescreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus::-moz-focus-inner,nav .smallscreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus::-moz-focus-inner{border:0}nav .largescreen .user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).previousbtn:focus:before{width:56px !important}nav .largescreen .user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).nextbtn:focus:before{width:32px !important}nav .largescreen .paginationbtn[aria-current=page]{-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;-webkit-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);background-color:#575195;color:#fff}nav .largescreen .paginationbtn[aria-current=page]:hover{-webkit-box-shadow:0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);background:#4e4986}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}';const r=class{constructor(a){t(this,a);this.wmPaginationPageClicked=e(this,"wmPaginationPageClicked",7);this.pageClicked=e(this,"pageClicked",7);this.focusCurrentPage=e(this,"focusCurrentPage",7);this.totalPages=0;this.debouncedResize=i((()=>{this.isLargeViewport=window.innerWidth>600}),250);this.getMiddlePageNums=()=>{let t;if(this.currentPage<4){t=[2,3,4]}else if(this.currentPage>this.totalPages-3){t=[this.totalPages-3,this.totalPages-2,this.totalPages-1]}else{t=[this.currentPage-1,this.currentPage,this.currentPage+1]}return t};this.currentPage=1;this.totalItems=undefined;this.itemsPerPage=undefined;this.value=1;this.isLargeViewport=window.innerWidth>600;this.isTabbing=false;this.srAnnouncement=""}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}maintainFocusOnNumberChange(t){window.requestAnimationFrame((()=>{switch(t){case"previous":this.currentPage===1&&this.el.shadowRoot.querySelector(`button#wm-1`).focus();break;case"next":this.currentPage===this.totalPages&&this.el.shadowRoot.querySelector(`button#wm-${this.totalPages}`).focus();break;case"prev-arrow":this.currentPage===1&&this.el.shadowRoot.querySelector("#next-arw").focus();break;case"next-arrow":this.currentPage===this.totalPages&&this.el.shadowRoot.querySelector("#previous-arw").focus();break;case"page":this.el.shadowRoot.querySelector(`button#wm-${this.currentPage}`).focus();default:return}}))}handleResize(){this.debouncedResize()}calculateTotalPages(){this.totalPages=Math.ceil(this.totalItems/this.itemsPerPage)}componentWillLoad(){if(!this.totalItems||!this.itemsPerPage||!this.currentPage){throw new Error("Please check the required attributes")}this.calculateTotalPages();if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}this.el.focus=()=>{if(this.isLargeViewport){this.el.shadowRoot.getElementById(`wm-${this.currentPage}`).focus()}else{this.currentPage===1?this.el.shadowRoot.getElementById("next-arw").focus():this.el.shadowRoot.getElementById("wm-1-arw").focus()}}}updatePageDisplayed(t){this.value=t;this.wmPaginationPageClicked.emit();this.pageClicked.emit();this.srAnnouncement=`Current page, ${this.currentPage}. ${this.getCurrentPagesInView()}`}displayShortPagination(){let t=[];for(let e=1;e<=this.totalPages;e++){t.push(this.displayPageNumber(e))}return t}displayLongPagination(){let t=[this.displayPageNumber(1),this.currentPage>3&&this.displayEllipsis(),...this.getMiddlePageNums().map((t=>this.displayPageNumber(t))),this.currentPage+2<this.totalPages&&this.displayEllipsis(),this.displayPageNumber(this.totalPages)];return t}displayPageNumber(t){return a("button",{id:`wm-${t}`,class:"paginationbtn",onClick:()=>{this.currentPage=t;this.updatePageDisplayed(t);this.maintainFocusOnNumberChange("page")},value:t,"aria-label":this.currentPage!==t?`Go to page ${t}`:"","aria-current":this.currentPage===t?"page":undefined},t)}displayEllipsis(){return a("span",{class:"ellipsis"},"...")}getCurrentPagesInView(){let t=this.itemsPerPage*this.currentPage;const e=t-this.itemsPerPage+1;if(t>this.totalItems){t=this.totalItems}return"Viewing "+(e===t?`${e}`:`${e}–${t} of ${this.totalItems}`)}renderLarge(){return a("div",{class:"largescreen"},a("div",{class:"pageview"},this.getCurrentPagesInView()),a("div",{class:`pagebtncontainer ${this.isTabbing?"user-is-tabbing":""}`},a("button",{id:"previous",class:"paginationbtn previousbtn",onClick:()=>{this.currentPage=this.currentPage-1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("previous")},disabled:this.currentPage===1,"aria-label":"Go to previous page","aria-controls":"status"},"Previous"),this.totalPages<6?this.displayShortPagination():this.displayLongPagination(),a("button",{id:"next",class:"paginationbtn nextbtn",onClick:()=>{this.currentPage=this.currentPage+1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("next")},disabled:this.currentPage===this.totalPages,"aria-label":"Go to next page","aria-controls":"status"},"Next")))}renderSmall(){return a("div",{class:"smallscreen"},a("div",{class:`pagebtncontainer ${this.isTabbing?"user-is-tabbing":""}`},a("button",{id:`wm-1-arw`,class:"paginationbtn",onClick:()=>{this.currentPage=1;this.updatePageDisplayed(1);this.maintainFocusOnNumberChange("prev-arrow")},value:1,"aria-current":this.currentPage===1?"page":undefined,"aria-label":`Go to page 1`,"aria-controls":"status",disabled:this.currentPage===1},a("svg",{width:"16",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6zM15.41 10.59L10.83 6l4.58-4.59L14 0 8 6l6 6z"}))),a("button",{id:"previous-arw",class:"paginationbtn previousbtn",onClick:()=>{this.currentPage-=1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("prev-arrow")},disabled:this.currentPage===1,"aria-label":"Go to previous page"},a("svg",{width:"8",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6z"}))),"Page ",this.currentPage," of ",this.totalPages,a("button",{id:"next-arw",class:"paginationbtn nextbtn",onClick:()=>{this.currentPage+=1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("next-arrow")},disabled:this.currentPage===this.totalPages,"aria-label":"Go to next page"},a("svg",{width:"8",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6z"}))),a("button",{id:`wm-${this.totalPages}-arw`,class:"paginationbtn",onClick:()=>{this.currentPage=this.totalPages;this.updatePageDisplayed(this.totalPages);this.maintainFocusOnNumberChange("next-arrow")},value:this.totalPages,"aria-current":this.currentPage===this.totalPages?"page":undefined,"aria-label":`Go to last page, page ${this.totalPages}`,"aria-controls":"status",disabled:this.currentPage===this.totalPages},a("svg",{width:"17",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6zM9.59 10.59L14.17 6 9.59 1.41 11 0l6 6-6 6z"})))))}render(){return this.totalItems>this.itemsPerPage&&a("nav",{"aria-label":`Pagination Navigation. ${this.getCurrentPagesInView()}. Current page, ${this.currentPage}.`},this.isLargeViewport?this.renderLarge():this.renderSmall(),a("div",{id:"status",class:"sr-only","aria-live":"polite","aria-relevant":"text","aria-atomic":"true"},this.srAnnouncement))}static get delegatesFocus(){return true}get el(){return n(this)}static get watchers(){return{totalItems:["calculateTotalPages"],itemsPerPage:["calculateTotalPages"]}}};r.style=s;export{r as wm_pagination};
-//# sourceMappingURL=p-bc883afc.entry.js.map
+import{r as t,c as e,h as a,g as n}from"./p-1c23de4a.js";import{d as i}from"./p-edfba0e1.js";const s='nav .largescreen,nav .smallscreen{margin-bottom:0.625rem;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:flex-end;-ms-flex-pack:flex-end;-webkit-justify-content:flex-end;justify-content:flex-end;font-size:0.875rem}nav .largescreen .pageview,nav .smallscreen .pageview{font-size:0.875rem;margin:0 0.625rem}nav .largescreen .paginationbtn,nav .smallscreen .paginationbtn{position:relative;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-ms-transition:none;-webkit-transition:none;-moz-transition:none;transition:none;border:none;color:#575195;background-color:transparent;margin:0;padding:0;height:2.5rem;width:2.5rem;font-family:inherit;letter-spacing:0.3px;font-size:0.875rem;font-weight:500;cursor:pointer;text-transform:none}nav .largescreen .paginationbtn svg *,nav .smallscreen .paginationbtn svg *{fill:#565397}nav .largescreen .paginationbtn:hover:not([aria-current=page]):not([disabled]),nav .smallscreen .paginationbtn:hover:not([aria-current=page]):not([disabled]){text-decoration:underline}nav .largescreen .paginationbtn:focus,nav .smallscreen .paginationbtn:focus{outline:none}nav .largescreen .paginationbtn::-moz-focus-inner,nav .smallscreen .paginationbtn::-moz-focus-inner{border:0;outline:none}nav .largescreen .paginationbtn[disabled],nav .smallscreen .paginationbtn[disabled]{color:#9f9f9f;pointer-events:none}nav .largescreen .paginationbtn[disabled] svg *,nav .smallscreen .paginationbtn[disabled] svg *{fill:#9f9f9f}nav .largescreen .previousbtn,nav .smallscreen .previousbtn{margin-right:0.625rem;width:auto !important}nav .largescreen .nextbtn,nav .smallscreen .nextbtn{margin-left:0.625rem;margin-right:0;width:auto !important}nav .largescreen .previousbtn,nav .largescreen .nextbtn,nav .smallscreen .previousbtn,nav .smallscreen .nextbtn{-ms-transition:none;-webkit-transition:none;-moz-transition:none;transition:none}nav .largescreen .ellipsis,nav .smallscreen .ellipsis{display:inline-block;width:2.5rem;text-align:center}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]),nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]):before,nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]):before{position:absolute;content:"";height:auto;width:16px;top:0;bottom:0;left:12px;right:0;background:-webkit-gradient(linear, left top, right top, color-stop(66%, #3862e9), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 2px;background-position:0 2em;border-radius:0;line-height:normal}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).previousbtn:focus:before,nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).previousbtn:focus:before{left:0 !important}nav .largescreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).nextbtn:focus:before,nav .smallscreen .pagebtncontainer.user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).nextbtn:focus:before{left:0 !important}nav .largescreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus,nav .smallscreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}nav .largescreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus::-moz-focus-inner,nav .smallscreen .pagebtncontainer.user-is-tabbing [aria-current=page]:focus::-moz-focus-inner{border:0}nav .largescreen .user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).previousbtn:focus:before{width:56px !important}nav .largescreen .user-is-tabbing :focus:not(.-disabled):not([aria-current=page]).nextbtn:focus:before{width:32px !important}nav .largescreen .paginationbtn[aria-current=page]{-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;-webkit-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);background-color:#575195;color:#fff}nav .largescreen .paginationbtn[aria-current=page]:hover{-webkit-box-shadow:0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);background:#4e4986}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}';const r=class{constructor(a){t(this,a);this.wmPaginationPageClicked=e(this,"wmPaginationPageClicked",7);this.pageClicked=e(this,"pageClicked",7);this.focusCurrentPage=e(this,"focusCurrentPage",7);this.totalPages=0;this.debouncedResize=i((()=>{this.isLargeViewport=window.innerWidth>600}),250);this.getMiddlePageNums=()=>{let t;if(this.currentPage<4){t=[2,3,4]}else if(this.currentPage>this.totalPages-3){t=[this.totalPages-3,this.totalPages-2,this.totalPages-1]}else{t=[this.currentPage-1,this.currentPage,this.currentPage+1]}return t};this.currentPage=1;this.totalItems=undefined;this.itemsPerPage=undefined;this.value=1;this.isLargeViewport=window.innerWidth>600;this.isTabbing=false;this.srAnnouncement=""}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}maintainFocusOnNumberChange(t){window.requestAnimationFrame((()=>{switch(t){case"previous":this.currentPage===1&&this.el.shadowRoot.querySelector(`button#wm-1`).focus();break;case"next":this.currentPage===this.totalPages&&this.el.shadowRoot.querySelector(`button#wm-${this.totalPages}`).focus();break;case"prev-arrow":this.currentPage===1&&this.el.shadowRoot.querySelector("#next-arw").focus();break;case"next-arrow":this.currentPage===this.totalPages&&this.el.shadowRoot.querySelector("#previous-arw").focus();break;case"page":this.el.shadowRoot.querySelector(`button#wm-${this.currentPage}`).focus();default:return}}))}handleResize(){this.debouncedResize()}calculateTotalPages(){this.totalPages=Math.ceil(this.totalItems/this.itemsPerPage)}componentWillLoad(){if(!this.totalItems||!this.itemsPerPage||!this.currentPage){throw new Error("Please check the required attributes")}this.calculateTotalPages();if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}this.el.focus=()=>{if(this.isLargeViewport){this.el.shadowRoot.getElementById(`wm-${this.currentPage}`).focus()}else{this.currentPage===1?this.el.shadowRoot.getElementById("next-arw").focus():this.el.shadowRoot.getElementById("wm-1-arw").focus()}}}updatePageDisplayed(t){this.value=t;this.wmPaginationPageClicked.emit();this.pageClicked.emit();this.srAnnouncement=`Current page, ${this.currentPage}. ${this.getCurrentPagesInView()}`}displayShortPagination(){let t=[];for(let e=1;e<=this.totalPages;e++){t.push(this.displayPageNumber(e))}return t}displayLongPagination(){let t=[this.displayPageNumber(1),this.currentPage>3&&this.displayEllipsis(),...this.getMiddlePageNums().map((t=>this.displayPageNumber(t))),this.currentPage+2<this.totalPages&&this.displayEllipsis(),this.displayPageNumber(this.totalPages)];return t}displayPageNumber(t){return a("button",{id:`wm-${t}`,class:"paginationbtn",onClick:()=>{this.currentPage=t;this.updatePageDisplayed(t);this.maintainFocusOnNumberChange("page")},value:t,"aria-label":this.currentPage!==t?`Go to page ${t}`:"","aria-current":this.currentPage===t?"page":undefined},t)}displayEllipsis(){return a("span",{class:"ellipsis"},"...")}getCurrentPagesInView(){let t=this.itemsPerPage*this.currentPage;const e=t-this.itemsPerPage+1;if(t>this.totalItems){t=this.totalItems}return"Viewing "+(e===t?`${e}`:`${e}–${t} of ${this.totalItems}`)}renderLarge(){return a("div",{class:"largescreen"},a("div",{class:"pageview"},this.getCurrentPagesInView()),a("div",{class:`pagebtncontainer ${this.isTabbing?"user-is-tabbing":""}`},a("button",{id:"previous",class:"paginationbtn previousbtn",onClick:()=>{this.currentPage=this.currentPage-1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("previous")},disabled:this.currentPage===1,"aria-label":"Go to previous page","aria-controls":"status"},"Previous"),this.totalPages<6?this.displayShortPagination():this.displayLongPagination(),a("button",{id:"next",class:"paginationbtn nextbtn",onClick:()=>{this.currentPage=this.currentPage+1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("next")},disabled:this.currentPage===this.totalPages,"aria-label":"Go to next page","aria-controls":"status"},"Next")))}renderSmall(){return a("div",{class:"smallscreen"},a("div",{class:`pagebtncontainer ${this.isTabbing?"user-is-tabbing":""}`},a("button",{id:`wm-1-arw`,class:"paginationbtn",onClick:()=>{this.currentPage=1;this.updatePageDisplayed(1);this.maintainFocusOnNumberChange("prev-arrow")},value:1,"aria-current":this.currentPage===1?"page":undefined,"aria-label":`Go to page 1`,"aria-controls":"status",disabled:this.currentPage===1},a("svg",{width:"16",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6zM15.41 10.59L10.83 6l4.58-4.59L14 0 8 6l6 6z"}))),a("button",{id:"previous-arw",class:"paginationbtn previousbtn",onClick:()=>{this.currentPage-=1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("prev-arrow")},disabled:this.currentPage===1,"aria-label":"Go to previous page"},a("svg",{width:"8",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6z"}))),"Page ",this.currentPage," of ",this.totalPages,a("button",{id:"next-arw",class:"paginationbtn nextbtn",onClick:()=>{this.currentPage+=1;this.updatePageDisplayed(this.currentPage);this.maintainFocusOnNumberChange("next-arrow")},disabled:this.currentPage===this.totalPages,"aria-label":"Go to next page"},a("svg",{width:"8",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6z"}))),a("button",{id:`wm-${this.totalPages}-arw`,class:"paginationbtn",onClick:()=>{this.currentPage=this.totalPages;this.updatePageDisplayed(this.totalPages);this.maintainFocusOnNumberChange("next-arrow")},value:this.totalPages,"aria-current":this.currentPage===this.totalPages?"page":undefined,"aria-label":`Go to last page, page ${this.totalPages}`,"aria-controls":"status",disabled:this.currentPage===this.totalPages},a("svg",{width:"17",height:"12",xmlns:"http://www.w3.org/2000/svg"},a("path",{d:"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6zM9.59 10.59L14.17 6 9.59 1.41 11 0l6 6-6 6z"})))))}render(){return this.totalItems>this.itemsPerPage&&a("nav",{"aria-label":`Pagination Navigation. ${this.getCurrentPagesInView()}. Current page, ${this.currentPage}.`},this.isLargeViewport?this.renderLarge():this.renderSmall(),a("div",{id:"status",class:"sr-only","aria-live":"polite","aria-relevant":"text","aria-atomic":"true"},this.srAnnouncement))}static get delegatesFocus(){return true}get el(){return n(this)}static get watchers(){return{totalItems:["calculateTotalPages"],itemsPerPage:["calculateTotalPages"]}}};r.style=s;export{r as wm_pagination};
+//# sourceMappingURL=p-e29c4789.entry.js.map

package/dist/ripple/p-e29c4789.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmPaginationCss","Pagination","this","totalPages","debouncedResize","debounce","isLargeViewport","window","innerWidth","getMiddlePageNums","coreBtns","currentPage","undefined","toggleTabbingOn","isTabbing","toggleTabbingOff","maintainFocusOnNumberChange","el","requestAnimationFrame","shadowRoot","querySelector","focus","handleResize","calculateTotalPages","Math","ceil","totalItems","itemsPerPage","componentWillLoad","Error","document","body","classList","contains","getElementById","updatePageDisplayed","pageNum","value","wmPaginationPageClicked","emit","pageClicked","srAnnouncement","getCurrentPagesInView","displayShortPagination","pages","i","push","displayPageNumber","displayLongPagination","view","displayEllipsis","map","page","h","id","class","onClick","end","begin","renderLarge","disabled","renderSmall","width","height","xmlns","d","render"],"sources":["./src/components/wm-pagination/wm-pagination.scss?tag=wm-pagination&encapsulation=shadow","./src/components/wm-pagination/wm-pagination.tsx"],"sourcesContent":["nav .largescreen,\r\nnav .smallscreen {\r\n  margin-bottom: rem-calc(10);\r\n  @include displayFlex();\r\n  @include alignItems(center);\r\n  @include justifyContent(flex-end);\r\n  @include type-level-4;\r\n\r\n  .pageview {\r\n    @include type-level-4;\r\n    margin: rem-calc(0 10);\r\n  }\r\n\r\n  .paginationbtn {\r\n    position: relative;\r\n    @include box-shadow(none); // fix for Edge\r\n    @include transition(none);\r\n    border: none;\r\n    color: $button-default-text;\r\n    background-color: transparent;\r\n    margin: 0;\r\n    padding: 0;\r\n    height: rem-calc(40);\r\n    width: rem-calc(40);\r\n    font-family: inherit;\r\n    letter-spacing: 0.3px;\r\n    font-size: rem-calc(14);\r\n    font-weight: 500;\r\n    cursor: pointer;\r\n    text-transform: none; //For Edge\r\n\r\n    svg * {\r\n      fill: #565397;\r\n    }\r\n\r\n    &:hover:not([aria-current=\"page\"]):not([disabled]) {\r\n      text-decoration: underline;\r\n    }\r\n\r\n    &:focus {\r\n      outline: none;\r\n    }\r\n\r\n    &::-moz-focus-inner {\r\n      border: 0;\r\n      outline: none;\r\n    }\r\n\r\n    &[disabled] {\r\n      color: #9f9f9f;\r\n      pointer-events: none;\r\n      svg * {\r\n        fill: #9f9f9f;\r\n      }\r\n    }\r\n  }\r\n\r\n  .previousbtn {\r\n    margin-right: rem-calc(10);\r\n    width: auto !important;\r\n  }\r\n\r\n  .nextbtn {\r\n    margin-left: rem-calc(10);\r\n    margin-right: 0;\r\n    width: auto !important;\r\n  }\r\n\r\n  .previousbtn,\r\n  .nextbtn {\r\n    @include transition(none);\r\n  }\r\n\r\n  .ellipsis {\r\n    display: inline-block;\r\n    width: rem-calc(40);\r\n    text-align: center;\r\n  }\r\n\r\n  .pagebtncontainer {\r\n    &.user-is-tabbing {\r\n      :focus:not(.-disabled):not([aria-current=\"page\"]) {\r\n        @include box-shadow(none); // fix for Edge\r\n\r\n        &:before {\r\n          position: absolute;\r\n          content: \"\";\r\n          height: auto;\r\n          width: 16px;\r\n          top: 0;\r\n          bottom: 0;\r\n          left: 12px;\r\n          right: 0;\r\n          background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;\r\n          background-size: 6px 2px;\r\n          background-position: 0 2em;\r\n          border-radius: 0;\r\n          line-height: normal;\r\n        }\r\n\r\n        &.previousbtn:focus:before {\r\n          left: 0 !important;\r\n        }\r\n\r\n        &.nextbtn:focus:before {\r\n          left: 0 !important;\r\n        }\r\n      }\r\n\r\n      [aria-current=\"page\"]:focus {\r\n        @include focus-style;\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\nnav .largescreen {\r\n  & .user-is-tabbing {\r\n    :focus:not(.-disabled):not([aria-current=\"page\"]) {\r\n      // to make focus indicator as wide as text \"previous\" and \"next\"\r\n      &.previousbtn:focus:before {\r\n        width: 56px !important;\r\n      }\r\n      &.nextbtn:focus:before {\r\n        width: 32px !important;\r\n      }\r\n    }\r\n  }\r\n  .paginationbtn {\r\n    &[aria-current=\"page\"] {\r\n      @include border-radius(50%);\r\n      @include box-shadow(0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2));\r\n      background-color: $button-primary-background;\r\n      color: $button-primary-text;\r\n\r\n      &:hover {\r\n        @include box-shadow(0 4px 2px 0 rgba(87, 81, 149, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2));\r\n        background: mix(black, $button-primary-background, 10%);\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\n.sr-only {\r\n  @include srOnly;\r\n}\r\n","import { h, Component, EventEmitter, Prop, Watch, Event, Element, Listen, State } from \"@stencil/core\";\r\nimport { debounce } from \"../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"wm-pagination\",\r\n  styleUrl: \"wm-pagination.scss\",\r\n  shadow: { delegatesFocus: true },\r\n})\r\nexport class Pagination {\r\n  @Element() el!: any;\r\n\r\n  @Prop() currentPage: number = 1;\r\n  @Prop() totalItems?: number = undefined;\r\n  @Prop() itemsPerPage?: number = undefined;\r\n  @Prop() value = 1;\r\n  @Prop() isLargeViewport: boolean = window.innerWidth > 600;\r\n  @State() isTabbing: boolean = false;\r\n  @State() srAnnouncement: string = \"\";\r\n\r\n  private totalPages: number = 0;\r\n\r\n  @Event() wmPaginationPageClicked!: EventEmitter<String>;\r\n  @Event() pageClicked!: EventEmitter<String>; // deprecated in favor of wmPaginationPageClicked\r\n  @Event() focusCurrentPage!: EventEmitter;\r\n\r\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\r\n  toggleTabbingOn() {\r\n    this.isTabbing = true;\r\n  }\r\n\r\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\r\n  toggleTabbingOff() {\r\n    this.isTabbing = false;\r\n  }\r\n\r\n  maintainFocusOnNumberChange(el: \"previous\" | \"next\" | \"prev-arrow\" | \"next-arrow\" | \"page\") {\r\n    window.requestAnimationFrame(() => {\r\n      switch (el) {\r\n        case \"previous\":\r\n          this.currentPage === 1 && this.el.shadowRoot.querySelector(`button#wm-1`).focus(); //Only shift focus from previous button to page 1 if page 1 is reached, which disables previous button. Otherwise, maintain focus on previous button.\r\n          break;\r\n        case \"next\":\r\n          this.currentPage === this.totalPages &&\r\n            this.el.shadowRoot.querySelector(`button#wm-${this.totalPages}`).focus(); //Only shift focus from next button if last page is reached, disabling next button. Otherwise, maintain focus on next button.\r\n          break;\r\n        case \"prev-arrow\":\r\n          this.currentPage === 1 && this.el.shadowRoot.querySelector(\"#next-arw\").focus(); //Only shift focus if page 1 is reached, disabling previous buttons. Otherwise, maintain focus on previous buttons.\r\n          break;\r\n        case \"next-arrow\":\r\n          this.currentPage === this.totalPages && this.el.shadowRoot.querySelector(\"#previous-arw\").focus(); //Only shift focus if last page is reached, disabling next buttons. Otherwise, maintain focus on next buttons.\r\n          break;\r\n        case \"page\":\r\n          this.el.shadowRoot.querySelector(`button#wm-${this.currentPage}`).focus();\r\n        default:\r\n          return;\r\n      }\r\n    });\r\n  }\r\n\r\n  debouncedResize = debounce(() => {\r\n    this.isLargeViewport = window.innerWidth > 600;\r\n  }, 250);\r\n\r\n  @Listen(\"resize\", { target: \"window\" })\r\n  handleResize() {\r\n    this.debouncedResize();\r\n  }\r\n\r\n  @Watch(\"totalItems\")\r\n  @Watch(\"itemsPerPage\")\r\n  calculateTotalPages() {\r\n    this.totalPages = Math.ceil(this.totalItems! / this.itemsPerPage!);\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (!this.totalItems || !this.itemsPerPage || !this.currentPage) {\r\n      throw new Error(\"Please check the required attributes\");\r\n    }\r\n\r\n    this.calculateTotalPages();\r\n\r\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\r\n      this.toggleTabbingOn();\r\n    }\r\n\r\n    this.el.focus = () => {\r\n      // in addition to delegatesFocus, we need to highjack the focus method to send focus to the appropriate element based on the components's state\r\n      if (this.isLargeViewport) {\r\n        this.el.shadowRoot.getElementById(`wm-${this.currentPage}`).focus();\r\n      } else {\r\n        this.currentPage === 1\r\n          ? this.el.shadowRoot.getElementById(\"next-arw\").focus()\r\n          : this.el.shadowRoot.getElementById(\"wm-1-arw\").focus();\r\n      }\r\n    };\r\n  }\r\n\r\n  updatePageDisplayed(pageNum: any) {\r\n    this.value = pageNum;\r\n    this.wmPaginationPageClicked.emit();\r\n    this.pageClicked.emit(); // deprecated\r\n    this.srAnnouncement = `Current page, ${this.currentPage}. ${this.getCurrentPagesInView()}`;\r\n  }\r\n\r\n  displayShortPagination() {\r\n    let pages = [];\r\n    for (let i = 1; i <= this.totalPages; i++) {\r\n      pages.push(this.displayPageNumber(i));\r\n    }\r\n    return pages;\r\n  }\r\n\r\n  displayLongPagination() {\r\n    let view = [\r\n      this.displayPageNumber(1),\r\n      this.currentPage > 3 && this.displayEllipsis(),\r\n      ...this.getMiddlePageNums().map((page) => this.displayPageNumber(page)),\r\n      this.currentPage + 2 < this.totalPages && this.displayEllipsis(),\r\n      this.displayPageNumber(this.totalPages),\r\n    ];\r\n    return view;\r\n  }\r\n\r\n  displayPageNumber(pageNum: number) {\r\n    return (\r\n      <button\r\n        id={`wm-${pageNum}`}\r\n        class=\"paginationbtn\"\r\n        onClick={() => {\r\n          this.currentPage = pageNum;\r\n          this.updatePageDisplayed(pageNum);\r\n          this.maintainFocusOnNumberChange(\"page\");\r\n        }}\r\n        value={pageNum}\r\n        aria-label={this.currentPage !== pageNum ? `Go to page ${pageNum}` : \"\"}\r\n        aria-current={this.currentPage === pageNum ? \"page\" : undefined}\r\n      >\r\n        {pageNum}\r\n      </button>\r\n    );\r\n  }\r\n\r\n  displayEllipsis() {\r\n    return <span class=\"ellipsis\">...</span>;\r\n  }\r\n\r\n  getMiddlePageNums = () => {\r\n    let coreBtns;\r\n    // if pg is 1, 2 or 3\r\n    if (this.currentPage < 4) {\r\n      coreBtns = [2, 3, 4];\r\n    } else if (this.currentPage > this.totalPages - 3) {\r\n      coreBtns = [this.totalPages - 3, this.totalPages - 2, this.totalPages - 1];\r\n    } else {\r\n      coreBtns = [this.currentPage - 1, this.currentPage, this.currentPage + 1];\r\n    }\r\n    return coreBtns;\r\n  };\r\n\r\n  // displayPageView = () => {\r\n  //   // let end = this.itemsPerPage! * this.currentPage;\r\n  //   // const begin = end - this.itemsPerPage! + 1;\r\n  //   // if (end > this.totalItems!) {\r\n  //   //   end = this.totalItems!;\r\n  //   // }\r\n  //   return <div class=\"pageview\">{this.getCurrentView()}</div>;\r\n  // };\r\n\r\n  getCurrentPagesInView() {\r\n    let end = this.itemsPerPage! * this.currentPage;\r\n    const begin = end - this.itemsPerPage! + 1;\r\n    if (end > this.totalItems!) {\r\n      end = this.totalItems!;\r\n    }\r\n    return \"Viewing \" + (begin === end ? `${begin}` : `${begin}–${end} of ${this.totalItems}`);\r\n  }\r\n\r\n  renderLarge() {\r\n    return (\r\n      <div class=\"largescreen\">\r\n        <div class=\"pageview\">{this.getCurrentPagesInView()}</div>\r\n        <div class={`pagebtncontainer ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}>\r\n          <button\r\n            id=\"previous\"\r\n            class=\"paginationbtn previousbtn\"\r\n            onClick={() => {\r\n              this.currentPage = this.currentPage - 1;\r\n              this.updatePageDisplayed(this.currentPage);\r\n              this.maintainFocusOnNumberChange(\"previous\");\r\n            }}\r\n            disabled={this.currentPage === 1}\r\n            aria-label=\"Go to previous page\"\r\n            aria-controls=\"status\"\r\n          >\r\n            Previous\r\n          </button>\r\n          {this.totalPages < 6 ? this.displayShortPagination() : this.displayLongPagination()}\r\n          <button\r\n            id=\"next\"\r\n            class=\"paginationbtn nextbtn\"\r\n            onClick={() => {\r\n              this.currentPage = this.currentPage + 1;\r\n              this.updatePageDisplayed(this.currentPage);\r\n              this.maintainFocusOnNumberChange(\"next\");\r\n            }}\r\n            disabled={this.currentPage === this.totalPages}\r\n            aria-label=\"Go to next page\"\r\n            aria-controls=\"status\"\r\n          >\r\n            Next\r\n          </button>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  renderSmall() {\r\n    return (\r\n      <div class=\"smallscreen\">\r\n        <div class={`pagebtncontainer ${this.isTabbing ? \"user-is-tabbing\" : \"\"}`}>\r\n          <button\r\n            id={`wm-1-arw`}\r\n            class=\"paginationbtn\"\r\n            onClick={() => {\r\n              this.currentPage = 1;\r\n              this.updatePageDisplayed(1);\r\n              this.maintainFocusOnNumberChange(\"prev-arrow\");\r\n            }}\r\n            value={1}\r\n            aria-current={this.currentPage === 1 ? \"page\" : undefined}\r\n            aria-label={`Go to page 1`}\r\n            aria-controls=\"status\"\r\n            disabled={this.currentPage === 1}\r\n          >\r\n            <svg width=\"16\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\r\n              <path d=\"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6zM15.41 10.59L10.83 6l4.58-4.59L14 0 8 6l6 6z\" />\r\n            </svg>\r\n          </button>\r\n          <button\r\n            id=\"previous-arw\"\r\n            class=\"paginationbtn previousbtn\"\r\n            onClick={() => {\r\n              this.currentPage -= 1;\r\n              this.updatePageDisplayed(this.currentPage);\r\n              this.maintainFocusOnNumberChange(\"prev-arrow\");\r\n            }}\r\n            disabled={this.currentPage === 1}\r\n            aria-label=\"Go to previous page\"\r\n          >\r\n            <svg width=\"8\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\r\n              <path d=\"M7.41 10.59L2.83 6l4.58-4.59L6 0 0 6l6 6z\" />\r\n            </svg>\r\n          </button>\r\n          Page {this.currentPage} of {this.totalPages}\r\n          <button\r\n            id=\"next-arw\"\r\n            class=\"paginationbtn nextbtn\"\r\n            onClick={() => {\r\n              this.currentPage += 1;\r\n              this.updatePageDisplayed(this.currentPage);\r\n              this.maintainFocusOnNumberChange(\"next-arrow\");\r\n            }}\r\n            disabled={this.currentPage === this.totalPages}\r\n            aria-label=\"Go to next page\"\r\n          >\r\n            <svg width=\"8\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\r\n              <path d=\"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6z\" />\r\n            </svg>\r\n          </button>\r\n          <button\r\n            id={`wm-${this.totalPages}-arw`}\r\n            class=\"paginationbtn\"\r\n            onClick={() => {\r\n              this.currentPage = this.totalPages;\r\n              this.updatePageDisplayed(this.totalPages);\r\n              this.maintainFocusOnNumberChange(\"next-arrow\");\r\n            }}\r\n            value={this.totalPages}\r\n            aria-current={this.currentPage === this.totalPages ? \"page\" : undefined}\r\n            aria-label={`Go to last page, page ${this.totalPages}`}\r\n            aria-controls=\"status\"\r\n            disabled={this.currentPage === this.totalPages}\r\n          >\r\n            <svg width=\"17\" height=\"12\" xmlns=\"http://www.w3.org/2000/svg\">\r\n              <path d=\"M.59 10.59L5.17 6 .59 1.41 2 0l6 6-6 6zM9.59 10.59L14.17 6 9.59 1.41 11 0l6 6-6 6z\" />\r\n            </svg>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      // do not render the component if there's only one page\r\n      this.totalItems! > this.itemsPerPage! && (\r\n        <nav aria-label={`Pagination Navigation. ${this.getCurrentPagesInView()}. Current page, ${this.currentPage}.`}>\r\n          {/* both \"desktop\" and \"mobile\" versions are renderered. media queries hide the unnecessary stuff */}\r\n          {this.isLargeViewport ? this.renderLarge() : this.renderSmall()}\r\n          {/* The below is for screenreader purposes, ensuring it announces the new current page.*/}\r\n          <div id=\"status\" class=\"sr-only\" aria-live=\"polite\" aria-relevant=\"text\" aria-atomic=\"true\">\r\n            {this.srAnnouncement}\r\n          </div>\r\n        </nav>\r\n      )\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/{p-0cd88c74.entry.js → p-e6b9766e.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as i,h as r,H as t,g as s}from"./p-1c23de4a.js";import{i as o,g as a,m as n,e as p}from"./p-9fd3badc.js";const l=':host,wm-timepicker{font-family:inherit}:host *,wm-timepicker *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .sr-only,wm-timepicker .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .wrapper,wm-timepicker .wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}:host .wrapper .label,wm-timepicker .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required,wm-timepicker .wrapper .label .required{color:#c0392b}:host .wrapper.label-left,wm-timepicker .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper,wm-timepicker .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label,wm-timepicker .wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}:host .wrapper.label-none label,wm-timepicker .wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .wrapper.invalid .label,wm-timepicker .wrapper.invalid .label{color:#c0392b}:host .wrapper.invalid .label:after,wm-timepicker .wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] :host .wrapper.invalid .label:after,[dir=RTL] wm-timepicker .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label,wm-timepicker .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper .inner-wrapper,wm-timepicker .wrapper .inner-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.5rem;border:1px solid #4a4a4a;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;max-width:236px;-ms-flex-pack:justify;justify-content:space-between;position:relative}:host .wrapper .inner-wrapper input,wm-timepicker .wrapper .inner-wrapper input{-moz-border-top-left-radius:3px;-webkit-border-top-left-radius:3px;border-top-left-radius:3px;-moz-border-bottom-left-radius:3px;-webkit-border-bottom-left-radius:3px;border-bottom-left-radius:3px;border:none;font-size:0.875rem;padding:0.625rem 0.9375rem 0.5rem;min-width:0;height:100%;-ms-flex:1;flex:1;margin:0;font-family:inherit}:host .wrapper .inner-wrapper input:disabled,wm-timepicker .wrapper .inner-wrapper input:disabled{background-color:#f0f0f0;color:#737373}:host .wrapper .inner-wrapper input:focus,wm-timepicker .wrapper .inner-wrapper input:focus{outline:none}:host .wrapper .inner-wrapper button,wm-timepicker .wrapper .inner-wrapper button{all:unset;cursor:pointer;padding:0 0.375rem;height:2.375rem;background-color:#fff;border:none;-moz-border-top-right-radius:3px;-webkit-border-top-right-radius:3px;border-top-right-radius:3px;-moz-border-bottom-right-radius:3px;-webkit-border-bottom-right-radius:3px;border-bottom-right-radius:3px;-moz-border-top-left-radius:0;-webkit-border-top-left-radius:0;border-top-left-radius:0;-moz-border-bottom-left-radius:0;-webkit-border-bottom-left-radius:0;border-bottom-left-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wrapper .inner-wrapper button .clock::after,wm-timepicker .wrapper .inner-wrapper button .clock::after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f150";color:#575195;font-size:1.5rem;padding:0;line-height:2.5rem}:host .wrapper .inner-wrapper button:hover,wm-timepicker .wrapper .inner-wrapper button:hover{background:#e6e6e6;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wrapper .inner-wrapper button:disabled,wm-timepicker .wrapper .inner-wrapper button:disabled{background-color:rgba(74, 74, 74, 0.05);pointer-events:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wrapper .inner-wrapper button:disabled .clock::after,wm-timepicker .wrapper .inner-wrapper button:disabled .clock::after{color:#7b7b7b}[dir=RTL] :host .wrapper .inner-wrapper button,[dir=RTL] wm-timepicker .wrapper .inner-wrapper button{right:auto;left:0}:host .wrapper .inner-wrapper button:focus,wm-timepicker .wrapper .inner-wrapper button:focus{outline:none}:host .wrapper .inner-wrapper button.user-is-tabbing:focus,wm-timepicker .wrapper .inner-wrapper button.user-is-tabbing:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .wrapper .inner-wrapper button.user-is-tabbing:focus::-moz-focus-inner,wm-timepicker .wrapper .inner-wrapper button.user-is-tabbing:focus::-moz-focus-inner{border:0}:host .wrapper .inner-wrapper button::-moz-focus-inner,wm-timepicker .wrapper .inner-wrapper button::-moz-focus-inner{border:0}:host .wrapper .inner-wrapper .options,wm-timepicker .wrapper .inner-wrapper .options{margin:0;padding:0;-webkit-overflow-scrolling:touch;overflow:auto;max-height:19.0625rem;-webkit-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-ms-transition:transform 0.25s ease;-webkit-transition:transform 0.25s ease;-moz-transition:transform 0.25s ease;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-ms-transform:scale(1, 0);-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);transform:scale(1, 0);-ms-transform-origin:center top;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:absolute;top:2.5rem;right:0;background:#fff;z-index:100;width:100%;font-size:0.875rem}:host .wrapper .inner-wrapper .options.upwards,wm-timepicker .wrapper .inner-wrapper .options.upwards{top:unset;bottom:2.5rem;-ms-transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;transform-origin:center bottom}:host .wrapper .inner-wrapper .options.hidden,wm-timepicker .wrapper .inner-wrapper .options.hidden{visibility:hidden}:host .wrapper .inner-wrapper .options [role=option],wm-timepicker .wrapper .inner-wrapper .options [role=option]{display:block;cursor:pointer;position:relative;padding:1.25rem;background:#fff;font-family:inherit;list-style:none;color:#4a4a4a}:host .wrapper .inner-wrapper .options [role=option]:hover,wm-timepicker .wrapper .inner-wrapper .options [role=option]:hover{background:#f4f4f4;outline:none}:host .wrapper .inner-wrapper .options [role=option]:focus,wm-timepicker .wrapper .inner-wrapper .options [role=option]:focus{outline:none;background:#f4f4f4}:host .wrapper .inner-wrapper .options [role=option]:not(:last-child),wm-timepicker .wrapper .inner-wrapper .options [role=option]:not(:last-child){border-bottom:2px solid rgba(46, 27, 70, 0.05)}:host .wrapper .inner-wrapper .options.open,wm-timepicker .wrapper .inner-wrapper .options.open{-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}:host .wrapper.invalid .inner-wrapper,wm-timepicker .wrapper.invalid .inner-wrapper{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}:host .wrapper.invalid .error,wm-timepicker .wrapper.invalid .error{color:#c0392b;margin-top:4px;margin-bottom:4px;display:block;top:100%;left:0;font-style:italic}:host .wrapper:focus .inner-wrapper,:host .wrapper.focus .inner-wrapper,wm-timepicker .wrapper:focus .inner-wrapper,wm-timepicker .wrapper.focus .inner-wrapper{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}';const h=class{constructor(r){e(this,r);this.wmTimepickerNewValidValue=i(this,"wmTimepickerNewValidValue",7);this.wmTimepickerOnChange=i(this,"wmTimepickerOnChange",7);this.twelveHrValid=/^(0?[0-9]|1[0-2])\s*:?\s*([0-5][0-9])?\s?(a|p|am|pm)?$/i;this.twentyFourHrValid=/^(0?[0-9]|1[0-9]|2[0-4])\s*:?\s*([0-5][0-9])?$/;this.uid="";this.timeFormat="hh:mm";this.times=[];this.openUp=false;this.buttonAriaLabel=o.formatMessage({id:"time.selectTime",defaultMessage:"Select time",description:"Button text for screen readers."});this.disabled=false;this.value="";this.errorMessage=undefined;this.label="";this.labelPosition="top";this.requiredField=false;this.requiredFieldMessage=undefined;this.preventValidation=undefined;this.selectedOption=undefined;this.isExpanded=false;this.isTabbing=false;this.displayedErrorMessage=undefined}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleKey(e){switch(e.key){case"ArrowDown":e.preventDefault();if(this.isExpanded===false){this.open("next")}else{this.moveDown(this.selectedOption)}break;case"ArrowUp":e.preventDefault();if(this.isExpanded===false){this.open("previous")}else{this.moveUp(this.selectedOption)}break;case"Enter":case" ":if(this.isExpanded){e.preventDefault();this.handleOptionClick(this.selectedOption.textContent)}break;case"Escape":e.preventDefault();if(this.isExpanded){e.stopPropagation();this.close()}break;case"Tab":if(this.isExpanded){this.close(false)}break;case"Home":e.preventDefault();if(this.isExpanded){this.focusOption(this.optionsList[0]);this.setDropdownPosition("first")}break;case"End":e.preventDefault();if(this.isExpanded){this.focusOption(this.optionsList[this.optionsList.length-1]);this.setDropdownPosition("last")}break}}updateErrorState(){this.displayedErrorMessage=this.errorMessage}componentWillLoad(){if(this.label===""){console.error("You must include a label prop for the timepicker (for accessibility reasons), even if the label position is none.")}this.uid=this.el.id?this.el.id:a();this.updateErrorState();this.timeFormat=o.formatMessage({id:"time.timeFormat",defaultMessage:"hh:mm"});this.times=this.generateTimes()}componentDidLoad(){this.optionsEl.classList.add("hidden");this.optionsList=Array.from(this.optionsEl.querySelectorAll("li"));if(this.value){this.processInput()}}isValidTime(e){return this.twelveHrValid.test(e)||this.twentyFourHrValid.test(e)}generateTimes(){let e=[];let i=0;for(let r=0;i<24*60;r++){const t=Math.floor(i/60);const s=t.toString().padStart(2,"0");const o=(i%60).toString();const a=o.padStart(2,"0");e[r]=`${s}:${a}`;i=i+15}return e}findNearestTimeInterval(e){let i=this.formatToStorage(e);const r=parseInt(i.slice(3,5));if(r%15!==0){const t=parseInt(i.slice(0,2));let s=(Math.round(r/15)*15).toString().padStart(2,"0");if(s==="60"){s="00";let e=t+1;if(e===24){e=0}i=i.replace(`${t.toString().padStart(2,"0")}:`,`${e.toString().padStart(2,"0")}:`)}if(parseInt(s)<8){s="00"}e=i.replace(`:${r.toString().padStart(2,"0")}`,`:${s}`)}return e}handleListSelection(e){e=this.findNearestTimeInterval(e);const i=this.optionsList.filter((i=>i.textContent==this.formatToDisplay(e)))[0];i&&this.focusOption(i)}setValue(e){const i=this.value;this.inputEl.value=this.formatToDisplay(e);this.value=this.formatToStorage(e);this.handleListSelection(e);if(i!==this.value){this.wmTimepickerNewValidValue.emit({value:this.value})}this.wmTimepickerOnChange.emit({value:this.value,isValid:!!this.displayedErrorMessage})}processInput(){if(this.isValidTime(this.value)){this.setValue(this.value)}const e=this.determineErrorMessage();this.displayedErrorMessage=e}determineErrorMessage(){let e=this.errorMessage;const i=this.requiredFieldMessage||o.formatMessage({id:"time.requiredError",defaultMessage:"A time is required."});const r=o.formatMessage({id:"time.invalidTime",defaultMessage:"Please enter a valid time."});const t=this.isValidTime(this.value);if(t&&!this.errorMessage){e=null}else if(!t&&!this.errorMessage){if(this.requiredField&&!this.value){e=i}else if(this.value){e=r}else{e=null}}return e}splitTime(e){const i=this.twelveHrValid.exec(e)||this.twentyFourHrValid.exec(e);let r=parseInt(i[1]);let t=i[2]||"00";let s=i?i[3]:undefined;if(r===0&&(s===null||s===void 0?void 0:s.toUpperCase().includes("P"))){s="AM"}return[r,t,s]}formatToDisplay(e){let[i,r,t]=this.splitTime(e);if(i===12&&!t){t="PM"}if(i===0||i===24){i=12}if(i>12){i-=12;t="PM"}if(t&&t.toUpperCase().includes("P")){t="PM"}else{t="AM"}return`${i.toString().padStart(2,"0")}:${r} ${t}`}formatToStorage(e){let[i,r,t]=this.splitTime(e);if(i===24){i=0}if(i===12&&t&&t.toUpperCase().includes("A")){i-=12}if(t&&t.toUpperCase().includes("P")&&i!==12){i+=12}return`${i.toString().padStart(2,"0")}:${r}`}open(e){this.openUp=n(this.el,this.optionsEl);this.isExpanded=true;this.optionsEl.classList.remove("hidden");if(this.errorMessage||!this.value){this.handleListSelection("09:00")}this.setDropdownPosition("center",this.selectedOption);this.focusOption(this.selectedOption);window.requestAnimationFrame((()=>{if(e==="next"){this.moveDown(this.selectedOption)}else if(e==="previous"){this.moveUp(this.selectedOption)}}))}close(e=true){this.isExpanded=false;window.setTimeout((()=>{this.optionsEl.classList.add("hidden");if(e){this.buttonEl.focus()}}),150)}focusOption(e){this.optionsList.forEach((e=>{e.tabIndex=-1}));e.tabIndex=0;this.selectedOption=e;e.focus()}setDropdownPosition(e,i){switch(e){case"top":const e=i===null||i===void 0?void 0:i.previousElementSibling;this.optionsEl.scrollTop=e.getBoundingClientRect().top-this.optionsEl.getBoundingClientRect().top+this.optionsEl.scrollTop;break;case"bottom":const r=i===null||i===void 0?void 0:i.nextElementSibling;this.optionsEl.scrollTop=r.getBoundingClientRect().bottom-this.optionsEl.getBoundingClientRect().top+this.optionsEl.scrollTop-this.optionsEl.offsetHeight;break;case"center":this.optionsEl.scrollTop=(this.optionsList.findIndex((e=>e.textContent===(i===null||i===void 0?void 0:i.textContent)))-2)*i.offsetHeight;break;case"first":this.optionsEl.scrollTop=0;break;case"last":this.optionsEl.scrollTop=this.optionsList[0].clientHeight*this.optionsList.length;break}}moveUp(e){const i=e.previousElementSibling;if(i){if(i.getBoundingClientRect().top<this.optionsEl.getBoundingClientRect().top){this.setDropdownPosition("top",e)}this.focusOption(i)}else{this.focusOption(this.optionsList[this.optionsList.length-1]);this.setDropdownPosition("last")}}moveDown(e){const i=e.nextElementSibling;if(i){if(i.getBoundingClientRect().bottom>this.optionsEl.getBoundingClientRect().bottom){this.setDropdownPosition("bottom",e)}this.focusOption(i)}else{this.focusOption(this.optionsList[0]);this.setDropdownPosition("first")}}handleOptionClick(e){this.close();this.setValue(e);this.processInput()}handleInput(){this.value=this.inputEl.value;if(this.isValidTime(this.value)){this.handleListSelection(this.findNearestTimeInterval(this.value));this.setDropdownPosition("center",this.selectedOption)}}handleInputBlur(e){const i=this.preventValidation&&p(e,this.preventValidation);if(!i){this.processInput()}this.tpWrapper.classList.remove("focus")}renderOptions(){return this.times.map(((e,i)=>r("li",{id:`option${i+1}`,role:"option",onClick:()=>this.handleOptionClick(e)},this.formatToDisplay(e))))}render(){return r(t,{id:this.uid,invalid:!!this.displayedErrorMessage?"true":null,onBlur:()=>this.close(false)},r("div",{class:`wrapper label-${this.labelPosition} ${!!this.displayedErrorMessage?"invalid":""}`,ref:e=>this.tpWrapper=e},r("div",{class:"label-wrapper"},this.labelPosition!=="none"&&r("label",{id:`label-${this.uid}`,class:"label",htmlFor:`time-input-${this.uid}`},this.label,this.requiredField&&r("span",{class:"required","aria-hidden":"true"},"*"))),r("div",null,r("div",{class:"inner-wrapper"},r("input",{id:`time-input-${this.uid}`,"aria-label":this.label,"aria-describedby":`error-${this.uid}`,ref:e=>this.inputEl=e,onBlur:e=>this.handleInputBlur(e),onInput:()=>this.handleInput(),disabled:this.disabled,"aria-required":this.requiredField?"true":null,placeholder:this.timeFormat,autocomplete:"off",onFocus:()=>this.tpWrapper.classList.add("focus")}),r("button",{id:`btn-${this.uid}`,class:this.isTabbing?"user-is-tabbing":"",ref:e=>this.buttonEl=e,disabled:this.disabled,"aria-controls":`list-${this.uid}`,"aria-expanded":this.isExpanded?"true":"false","aria-label":this.buttonAriaLabel,"aria-describedby":`time-input-${this.uid}`,onClick:()=>this.isExpanded?this.close():this.open(),onMouseDown:e=>{e.preventDefault();this.buttonEl.focus()}},r("span",{class:"clock"})),r("ul",{class:`options ${this.isExpanded?"open":""}  ${this.openUp?"upwards":""}`,id:`list-${this.uid}`,role:"listbox","aria-labelledby":`label-${this.uid}`,"aria-describedby":this.isExpanded?"collapsed":null,tabindex:-1,ref:e=>this.optionsEl=e},this.renderOptions())),r("div",{id:`error-${this.uid}`,class:"error","aria-live":"assertive","aria-atomic":"true"},this.displayedErrorMessage))))}static get delegatesFocus(){return true}get el(){return s(this)}static get watchers(){return{errorMessage:["updateErrorState"]}}};h.style=l;export{h as wm_timepicker};
-//# sourceMappingURL=p-0cd88c74.entry.js.map
+import{r as e,c as i,h as r,H as t,g as s}from"./p-1c23de4a.js";import{i as o,g as a,m as n,e as p}from"./p-edfba0e1.js";const l=':host,wm-timepicker{font-family:inherit}:host *,wm-timepicker *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .sr-only,wm-timepicker .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .wrapper,wm-timepicker .wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}:host .wrapper .label,wm-timepicker .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required,wm-timepicker .wrapper .label .required{color:#c0392b}:host .wrapper.label-left,wm-timepicker .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper,wm-timepicker .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label,wm-timepicker .wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}:host .wrapper.label-none label,wm-timepicker .wrapper.label-none label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .wrapper.invalid .label,wm-timepicker .wrapper.invalid .label{color:#c0392b}:host .wrapper.invalid .label:after,wm-timepicker .wrapper.invalid .label:after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f026";margin-left:0.3125rem}[dir=RTL] :host .wrapper.invalid .label:after,[dir=RTL] wm-timepicker .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label,wm-timepicker .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper .inner-wrapper,wm-timepicker .wrapper .inner-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.5rem;border:1px solid #4a4a4a;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;max-width:236px;-ms-flex-pack:justify;justify-content:space-between;position:relative}:host .wrapper .inner-wrapper input,wm-timepicker .wrapper .inner-wrapper input{-moz-border-top-left-radius:3px;-webkit-border-top-left-radius:3px;border-top-left-radius:3px;-moz-border-bottom-left-radius:3px;-webkit-border-bottom-left-radius:3px;border-bottom-left-radius:3px;border:none;font-size:0.875rem;padding:0.625rem 0.9375rem 0.5rem;min-width:0;height:100%;-ms-flex:1;flex:1;margin:0;font-family:inherit}:host .wrapper .inner-wrapper input:disabled,wm-timepicker .wrapper .inner-wrapper input:disabled{background-color:#f0f0f0;color:#737373}:host .wrapper .inner-wrapper input:focus,wm-timepicker .wrapper .inner-wrapper input:focus{outline:none}:host .wrapper .inner-wrapper button,wm-timepicker .wrapper .inner-wrapper button{all:unset;cursor:pointer;padding:0 0.375rem;height:2.375rem;background-color:#fff;border:none;-moz-border-top-right-radius:3px;-webkit-border-top-right-radius:3px;border-top-right-radius:3px;-moz-border-bottom-right-radius:3px;-webkit-border-bottom-right-radius:3px;border-bottom-right-radius:3px;-moz-border-top-left-radius:0;-webkit-border-top-left-radius:0;border-top-left-radius:0;-moz-border-bottom-left-radius:0;-webkit-border-bottom-left-radius:0;border-bottom-left-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wrapper .inner-wrapper button .clock::after,wm-timepicker .wrapper .inner-wrapper button .clock::after{display:inline-block;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:"\\f150";color:#575195;font-size:1.5rem;padding:0;line-height:2.5rem}:host .wrapper .inner-wrapper button:hover,wm-timepicker .wrapper .inner-wrapper button:hover{background:#e6e6e6;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wrapper .inner-wrapper button:disabled,wm-timepicker .wrapper .inner-wrapper button:disabled{background-color:rgba(74, 74, 74, 0.05);pointer-events:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wrapper .inner-wrapper button:disabled .clock::after,wm-timepicker .wrapper .inner-wrapper button:disabled .clock::after{color:#7b7b7b}[dir=RTL] :host .wrapper .inner-wrapper button,[dir=RTL] wm-timepicker .wrapper .inner-wrapper button{right:auto;left:0}:host .wrapper .inner-wrapper button:focus,wm-timepicker .wrapper .inner-wrapper button:focus{outline:none}:host .wrapper .inner-wrapper button.user-is-tabbing:focus,wm-timepicker .wrapper .inner-wrapper button.user-is-tabbing:focus{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .wrapper .inner-wrapper button.user-is-tabbing:focus::-moz-focus-inner,wm-timepicker .wrapper .inner-wrapper button.user-is-tabbing:focus::-moz-focus-inner{border:0}:host .wrapper .inner-wrapper button::-moz-focus-inner,wm-timepicker .wrapper .inner-wrapper button::-moz-focus-inner{border:0}:host .wrapper .inner-wrapper .options,wm-timepicker .wrapper .inner-wrapper .options{margin:0;padding:0;-webkit-overflow-scrolling:touch;overflow:auto;max-height:19.0625rem;-webkit-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-ms-transition:transform 0.25s ease;-webkit-transition:transform 0.25s ease;-moz-transition:transform 0.25s ease;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-ms-transform:scale(1, 0);-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);transform:scale(1, 0);-ms-transform-origin:center top;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:absolute;top:2.5rem;right:0;background:#fff;z-index:100;width:100%;font-size:0.875rem}:host .wrapper .inner-wrapper .options.upwards,wm-timepicker .wrapper .inner-wrapper .options.upwards{top:unset;bottom:2.5rem;-ms-transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;transform-origin:center bottom}:host .wrapper .inner-wrapper .options.hidden,wm-timepicker .wrapper .inner-wrapper .options.hidden{visibility:hidden}:host .wrapper .inner-wrapper .options [role=option],wm-timepicker .wrapper .inner-wrapper .options [role=option]{display:block;cursor:pointer;position:relative;padding:1.25rem;background:#fff;font-family:inherit;list-style:none;color:#4a4a4a}:host .wrapper .inner-wrapper .options [role=option]:hover,wm-timepicker .wrapper .inner-wrapper .options [role=option]:hover{background:#f4f4f4;outline:none}:host .wrapper .inner-wrapper .options [role=option]:focus,wm-timepicker .wrapper .inner-wrapper .options [role=option]:focus{outline:none;background:#f4f4f4}:host .wrapper .inner-wrapper .options [role=option]:not(:last-child),wm-timepicker .wrapper .inner-wrapper .options [role=option]:not(:last-child){border-bottom:2px solid rgba(46, 27, 70, 0.05)}:host .wrapper .inner-wrapper .options.open,wm-timepicker .wrapper .inner-wrapper .options.open{-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}:host .wrapper.invalid .inner-wrapper,wm-timepicker .wrapper.invalid .inner-wrapper{-webkit-box-shadow:0 0 0 1px #c0392b;-moz-box-shadow:0 0 0 1px #c0392b;box-shadow:0 0 0 1px #c0392b;border-color:#c0392b}:host .wrapper.invalid .error,wm-timepicker .wrapper.invalid .error{color:#c0392b;margin-top:4px;margin-bottom:4px;display:block;top:100%;left:0;font-style:italic}:host .wrapper:focus .inner-wrapper,:host .wrapper.focus .inner-wrapper,wm-timepicker .wrapper:focus .inner-wrapper,wm-timepicker .wrapper.focus .inner-wrapper{-webkit-box-shadow:0 0 0 1px #20cbd4;-moz-box-shadow:0 0 0 1px #20cbd4;box-shadow:0 0 0 1px #20cbd4;outline:none;border-color:#20cbd4}';const h=class{constructor(r){e(this,r);this.wmTimepickerNewValidValue=i(this,"wmTimepickerNewValidValue",7);this.wmTimepickerOnChange=i(this,"wmTimepickerOnChange",7);this.twelveHrValid=/^(0?[0-9]|1[0-2])\s*:?\s*([0-5][0-9])?\s?(a|p|am|pm)?$/i;this.twentyFourHrValid=/^(0?[0-9]|1[0-9]|2[0-4])\s*:?\s*([0-5][0-9])?$/;this.uid="";this.timeFormat="hh:mm";this.times=[];this.openUp=false;this.buttonAriaLabel=o.formatMessage({id:"time.selectTime",defaultMessage:"Select time",description:"Button text for screen readers."});this.disabled=false;this.value="";this.errorMessage=undefined;this.label="";this.labelPosition="top";this.requiredField=false;this.requiredFieldMessage=undefined;this.preventValidation=undefined;this.selectedOption=undefined;this.isExpanded=false;this.isTabbing=false;this.displayedErrorMessage=undefined}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleKey(e){switch(e.key){case"ArrowDown":e.preventDefault();if(this.isExpanded===false){this.open("next")}else{this.moveDown(this.selectedOption)}break;case"ArrowUp":e.preventDefault();if(this.isExpanded===false){this.open("previous")}else{this.moveUp(this.selectedOption)}break;case"Enter":case" ":if(this.isExpanded){e.preventDefault();this.handleOptionClick(this.selectedOption.textContent)}break;case"Escape":e.preventDefault();if(this.isExpanded){e.stopPropagation();this.close()}break;case"Tab":if(this.isExpanded){this.close(false)}break;case"Home":e.preventDefault();if(this.isExpanded){this.focusOption(this.optionsList[0]);this.setDropdownPosition("first")}break;case"End":e.preventDefault();if(this.isExpanded){this.focusOption(this.optionsList[this.optionsList.length-1]);this.setDropdownPosition("last")}break}}updateErrorState(){this.displayedErrorMessage=this.errorMessage}componentWillLoad(){if(this.label===""){console.error("You must include a label prop for the timepicker (for accessibility reasons), even if the label position is none.")}this.uid=this.el.id?this.el.id:a();this.updateErrorState();this.timeFormat=o.formatMessage({id:"time.timeFormat",defaultMessage:"hh:mm"});this.times=this.generateTimes()}componentDidLoad(){this.optionsEl.classList.add("hidden");this.optionsList=Array.from(this.optionsEl.querySelectorAll("li"));if(this.value){this.processInput()}}isValidTime(e){return this.twelveHrValid.test(e)||this.twentyFourHrValid.test(e)}generateTimes(){let e=[];let i=0;for(let r=0;i<24*60;r++){const t=Math.floor(i/60);const s=t.toString().padStart(2,"0");const o=(i%60).toString();const a=o.padStart(2,"0");e[r]=`${s}:${a}`;i=i+15}return e}findNearestTimeInterval(e){let i=this.formatToStorage(e);const r=parseInt(i.slice(3,5));if(r%15!==0){const t=parseInt(i.slice(0,2));let s=(Math.round(r/15)*15).toString().padStart(2,"0");if(s==="60"){s="00";let e=t+1;if(e===24){e=0}i=i.replace(`${t.toString().padStart(2,"0")}:`,`${e.toString().padStart(2,"0")}:`)}if(parseInt(s)<8){s="00"}e=i.replace(`:${r.toString().padStart(2,"0")}`,`:${s}`)}return e}handleListSelection(e){e=this.findNearestTimeInterval(e);const i=this.optionsList.filter((i=>i.textContent==this.formatToDisplay(e)))[0];i&&this.focusOption(i)}setValue(e){const i=this.value;this.inputEl.value=this.formatToDisplay(e);this.value=this.formatToStorage(e);this.handleListSelection(e);if(i!==this.value){this.wmTimepickerNewValidValue.emit({value:this.value})}this.wmTimepickerOnChange.emit({value:this.value,isValid:!!this.displayedErrorMessage})}processInput(){if(this.isValidTime(this.value)){this.setValue(this.value)}const e=this.determineErrorMessage();this.displayedErrorMessage=e}determineErrorMessage(){let e=this.errorMessage;const i=this.requiredFieldMessage||o.formatMessage({id:"time.requiredError",defaultMessage:"A time is required."});const r=o.formatMessage({id:"time.invalidTime",defaultMessage:"Please enter a valid time."});const t=this.isValidTime(this.value);if(t&&!this.errorMessage){e=null}else if(!t&&!this.errorMessage){if(this.requiredField&&!this.value){e=i}else if(this.value){e=r}else{e=null}}return e}splitTime(e){const i=this.twelveHrValid.exec(e)||this.twentyFourHrValid.exec(e);let r=parseInt(i[1]);let t=i[2]||"00";let s=i?i[3]:undefined;if(r===0&&(s===null||s===void 0?void 0:s.toUpperCase().includes("P"))){s="AM"}return[r,t,s]}formatToDisplay(e){let[i,r,t]=this.splitTime(e);if(i===12&&!t){t="PM"}if(i===0||i===24){i=12}if(i>12){i-=12;t="PM"}if(t&&t.toUpperCase().includes("P")){t="PM"}else{t="AM"}return`${i.toString().padStart(2,"0")}:${r} ${t}`}formatToStorage(e){let[i,r,t]=this.splitTime(e);if(i===24){i=0}if(i===12&&t&&t.toUpperCase().includes("A")){i-=12}if(t&&t.toUpperCase().includes("P")&&i!==12){i+=12}return`${i.toString().padStart(2,"0")}:${r}`}open(e){this.openUp=n(this.el,this.optionsEl);this.isExpanded=true;this.optionsEl.classList.remove("hidden");if(this.errorMessage||!this.value){this.handleListSelection("09:00")}this.setDropdownPosition("center",this.selectedOption);this.focusOption(this.selectedOption);window.requestAnimationFrame((()=>{if(e==="next"){this.moveDown(this.selectedOption)}else if(e==="previous"){this.moveUp(this.selectedOption)}}))}close(e=true){this.isExpanded=false;window.setTimeout((()=>{this.optionsEl.classList.add("hidden");if(e){this.buttonEl.focus()}}),150)}focusOption(e){this.optionsList.forEach((e=>{e.tabIndex=-1}));e.tabIndex=0;this.selectedOption=e;e.focus()}setDropdownPosition(e,i){switch(e){case"top":const e=i===null||i===void 0?void 0:i.previousElementSibling;this.optionsEl.scrollTop=e.getBoundingClientRect().top-this.optionsEl.getBoundingClientRect().top+this.optionsEl.scrollTop;break;case"bottom":const r=i===null||i===void 0?void 0:i.nextElementSibling;this.optionsEl.scrollTop=r.getBoundingClientRect().bottom-this.optionsEl.getBoundingClientRect().top+this.optionsEl.scrollTop-this.optionsEl.offsetHeight;break;case"center":this.optionsEl.scrollTop=(this.optionsList.findIndex((e=>e.textContent===(i===null||i===void 0?void 0:i.textContent)))-2)*i.offsetHeight;break;case"first":this.optionsEl.scrollTop=0;break;case"last":this.optionsEl.scrollTop=this.optionsList[0].clientHeight*this.optionsList.length;break}}moveUp(e){const i=e.previousElementSibling;if(i){if(i.getBoundingClientRect().top<this.optionsEl.getBoundingClientRect().top){this.setDropdownPosition("top",e)}this.focusOption(i)}else{this.focusOption(this.optionsList[this.optionsList.length-1]);this.setDropdownPosition("last")}}moveDown(e){const i=e.nextElementSibling;if(i){if(i.getBoundingClientRect().bottom>this.optionsEl.getBoundingClientRect().bottom){this.setDropdownPosition("bottom",e)}this.focusOption(i)}else{this.focusOption(this.optionsList[0]);this.setDropdownPosition("first")}}handleOptionClick(e){this.close();this.setValue(e);this.processInput()}handleInput(){this.value=this.inputEl.value;if(this.isValidTime(this.value)){this.handleListSelection(this.findNearestTimeInterval(this.value));this.setDropdownPosition("center",this.selectedOption)}}handleInputBlur(e){const i=this.preventValidation&&p(e,this.preventValidation);if(!i){this.processInput()}this.tpWrapper.classList.remove("focus")}renderOptions(){return this.times.map(((e,i)=>r("li",{id:`option${i+1}`,role:"option",onClick:()=>this.handleOptionClick(e)},this.formatToDisplay(e))))}render(){return r(t,{id:this.uid,invalid:!!this.displayedErrorMessage?"true":null,onBlur:()=>this.close(false)},r("div",{class:`wrapper label-${this.labelPosition} ${!!this.displayedErrorMessage?"invalid":""}`,ref:e=>this.tpWrapper=e},r("div",{class:"label-wrapper"},this.labelPosition!=="none"&&r("label",{id:`label-${this.uid}`,class:"label",htmlFor:`time-input-${this.uid}`},this.label,this.requiredField&&r("span",{class:"required","aria-hidden":"true"},"*"))),r("div",null,r("div",{class:"inner-wrapper"},r("input",{id:`time-input-${this.uid}`,"aria-label":this.label,"aria-describedby":`error-${this.uid}`,ref:e=>this.inputEl=e,onBlur:e=>this.handleInputBlur(e),onInput:()=>this.handleInput(),disabled:this.disabled,"aria-required":this.requiredField?"true":null,placeholder:this.timeFormat,autocomplete:"off",onFocus:()=>this.tpWrapper.classList.add("focus")}),r("button",{id:`btn-${this.uid}`,class:this.isTabbing?"user-is-tabbing":"",ref:e=>this.buttonEl=e,disabled:this.disabled,"aria-controls":`list-${this.uid}`,"aria-expanded":this.isExpanded?"true":"false","aria-label":this.buttonAriaLabel,"aria-describedby":`time-input-${this.uid}`,onClick:()=>this.isExpanded?this.close():this.open(),onMouseDown:e=>{e.preventDefault();this.buttonEl.focus()}},r("span",{class:"clock"})),r("ul",{class:`options ${this.isExpanded?"open":""}  ${this.openUp?"upwards":""}`,id:`list-${this.uid}`,role:"listbox","aria-labelledby":`label-${this.uid}`,"aria-describedby":this.isExpanded?"collapsed":null,tabindex:-1,ref:e=>this.optionsEl=e},this.renderOptions())),r("div",{id:`error-${this.uid}`,class:"error","aria-live":"assertive","aria-atomic":"true"},this.displayedErrorMessage))))}static get delegatesFocus(){return true}get el(){return s(this)}static get watchers(){return{errorMessage:["updateErrorState"]}}};h.style=l;export{h as wm_timepicker};
+//# sourceMappingURL=p-e6b9766e.entry.js.map