@watermarkinsights/ripple 3.25.0-2 → 3.25.0

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

@@ -1 +0,0 @@
-{"version":3,"names":["privChartPopoverCss","ChartPopover","this","chartEl","el","parentElement","getRootNode","host","popoverWidth","popoverClicked","eventToEmit","nodeName","wmChartPopoverButtonTriggered","wmProgressIndicatorButtonTriggered","handleClickOnDocument","open","handleClick","ev","popoverBtnClicked","btnEl","target","contains","handleButtonClick","sliceRef","click","emit","renderLiveRegion","liveRegion","innerHTML","wrapper","document","createElement","titleEl","popoverTitle","appendChild","textEl","popoverText","buttonText","buttonEl","intl","formatMessage","id","defaultMessage","positionPopover","style","top","coords","y","window","innerWidth","x","left","render","titleAffordance","h","Host","class","tabindex","focusable","ref","onClick","height","width","fill","d"],"sources":["./src/components/charts/priv-chart-popover/priv-chart-popover.scss?tag=priv-chart-popover","./src/components/charts/priv-chart-popover/priv-chart-popover.tsx"],"sourcesContent":["priv-chart-popover {\r\n  position: fixed;\r\n\r\n  z-index: 10;\r\n  border-radius: rem-calc(3);\r\n  @include box-shadow(0 11px 15px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.12));\r\n  background-color: $light-background;\r\n  font-size: 0.875rem;\r\n  text-align: left;\r\n\r\n  &.user-is-tabbing {\r\n    .button-text {\r\n      background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;\r\n      background-size: 6px 3px;\r\n      background-position: 0 1em;\r\n      border-radius: 0;\r\n      line-height: normal;\r\n    }\r\n  }\r\n}\r\n\r\n.sr-only {\r\n  @include srOnly;\r\n}\r\n\r\n.popover {\r\n  width: rem-calc(168);\r\n  padding: rem-calc(10 15);\r\n  box-sizing: border-box;\r\n\r\n  & .title {\r\n    font-size: 1em;\r\n    font-weight: 500;\r\n    margin: 0;\r\n    padding-top: 0;\r\n    padding-left: 0;\r\n    padding-bottom: rem-calc(4);\r\n\r\n    &.positive {\r\n      color: $success;\r\n    }\r\n\r\n    &.negative {\r\n      color: $error;\r\n    }\r\n  }\r\n\r\n  & .text {\r\n    margin: 0;\r\n    margin-bottom: rem-calc(8);\r\n  }\r\n\r\n  & .popover-button {\r\n    @include box-shadow(none);\r\n    position: relative;\r\n    display: inline-block;\r\n    margin-left: rem-calc(16);\r\n    padding-left: 0;\r\n    padding-right: 0;\r\n    height: auto;\r\n    border: none;\r\n    background: transparent;\r\n    cursor: pointer;\r\n\r\n    text-decoration: none;\r\n    letter-spacing: 0;\r\n    text-transform: none;\r\n    text-align: initial;\r\n    font-size: rem-calc(14);\r\n    font-weight: 700;\r\n    color: $button-default-text;\r\n    line-height: normal;\r\n\r\n    & .btn-icon {\r\n      position: absolute;\r\n      top: rem-calc(3);\r\n      left: rem-calc(-16);\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    &:hover {\r\n      text-decoration: none;\r\n      background: none;\r\n      color: #454077;\r\n      span {\r\n        text-decoration: underline;\r\n      }\r\n    }\r\n  }\r\n}\r\n","import { h, Component, Prop, Host, Element, Watch, Listen, Event, EventEmitter } from \"@stencil/core\";\r\nimport { intl } from \"../../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"priv-chart-popover\",\r\n  styleUrl: \"priv-chart-popover.scss\",\r\n})\r\nexport class ChartPopover {\r\n  @Element() el!: HTMLPrivChartPopoverElement;\r\n  private chartEl: Element = (this.el.parentElement!.getRootNode() as ShadowRoot).host;\r\n  private btnEl?: HTMLButtonElement;\r\n  private liveRegion?: HTMLDivElement;\r\n\r\n  @Event()\r\n  wmChartPopoverButtonTriggered!: EventEmitter<HTMLWmChartSliceElement>;\r\n  @Event()\r\n  wmProgressIndicatorButtonTriggered!: EventEmitter<HTMLWmProgressSliceElement>;\r\n  get eventToEmit() {\r\n    return this.chartEl.nodeName === \"WM-CHART\"\r\n      ? this.wmChartPopoverButtonTriggered\r\n      : this.wmProgressIndicatorButtonTriggered;\r\n  }\r\n\r\n  @Prop() sliceRef?: HTMLWmChartSliceElement;\r\n  @Prop() popoverTitle?: string;\r\n  @Prop() popoverText?: string;\r\n  @Prop() buttonText?: string;\r\n  @Prop({ mutable: true }) open: boolean = false;\r\n  @Prop() coords: { x?: number; y?: number } = {};\r\n  private popoverWidth: number = 168;\r\n\r\n  private popoverClicked = false;\r\n\r\n  @Listen(\"click\", { capture: false, target: \"document\" })\r\n  handleClickOnDocument() {\r\n    // because this listener is set document-wide, whenever something inside it is clicked\r\n    // the event target returned will always be the host (wm-chart)\r\n    // the element within wm-chart is determined by the other listener and saved as var popoverClicked for use here\r\n    // capture = false in @Listen ensures order of execution\r\n    this.open = this.popoverClicked;\r\n    this.popoverClicked = false;\r\n  }\r\n\r\n  @Listen(\"click\", { capture: false })\r\n  handleClick(ev: MouseEvent) {\r\n    let popoverBtnClicked = false;\r\n    if (this.btnEl) {\r\n      popoverBtnClicked = ev.target === this.btnEl || this.btnEl.contains(ev.target as HTMLElement);\r\n    }\r\n    // if the click is on the popover (except the popover button),\r\n    // set popoverClicked to true. It will be used by the other listener above\r\n    this.popoverClicked = !popoverBtnClicked && (ev.target === this.el || this.el.contains(ev.target as HTMLElement));\r\n  }\r\n\r\n  handleButtonClick() {\r\n    if (this.sliceRef) {\r\n      this.sliceRef.click();\r\n      this.eventToEmit.emit(this.sliceRef);\r\n    }\r\n    this.open = false;\r\n  }\r\n\r\n  renderLiveRegion() {\r\n    if (this.liveRegion) {\r\n      this.liveRegion.innerHTML = \"\";\r\n\r\n      const wrapper = document.createElement(\"div\");\r\n\r\n      const titleEl = document.createElement(\"span\");\r\n      titleEl.innerHTML = this.popoverTitle + \" \" || \"\";\r\n      wrapper.appendChild(titleEl);\r\n\r\n      const textEl = document.createElement(\"span\");\r\n      textEl.innerHTML = this.popoverText + \" \" || \"\";\r\n      wrapper.appendChild(textEl);\r\n\r\n      if (this.buttonText) {\r\n        const buttonEl = document.createElement(\"span\");\r\n        buttonEl.innerHTML =\r\n          this.buttonText +\r\n          \" \" +\r\n          intl.formatMessage({\r\n            id: \"chart.infoButton\",\r\n            defaultMessage: \"Button. Click for more information.\",\r\n          });\r\n        wrapper.appendChild(buttonEl);\r\n      }\r\n      this.liveRegion.appendChild(wrapper);\r\n    }\r\n  }\r\n\r\n  @Watch(\"coords\")\r\n  positionPopover() {\r\n    this.el!.style.top = this.coords.y + \"px\";\r\n    if (window.innerWidth - this.coords.x! >= this.popoverWidth + 10) {\r\n      this.el!.style.left = this.coords.x + \"px\"; // opens on the right\r\n    } else {\r\n      this.el!.style.left = this.coords.x! - this.popoverWidth + \"px\"; // opens on the left\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const titleAffordance = this.popoverTitle && (this.popoverTitle[0] === \"-\" ? \"negative\" : this.popoverTitle[0] === \"+\" ? \"positive\" : \"\"); \r\n    return (\r\n      <Host>\r\n        {!!this.open ? (\r\n          <div aria-hidden=\"true\" class=\"popover\">\r\n            <h1 class={`title ${titleAffordance}`}>{this.popoverTitle}</h1>\r\n            <p class=\"text\">{this.popoverText}</p>\r\n            {this.buttonText ? (\r\n              // @ts-ignore\r\n              <button\r\n                tabindex=\"-1\"\r\n                // @ts-ignore\r\n                focusable=\"false\"\r\n                ref={(el) => (this.btnEl = el as HTMLButtonElement)}\r\n                class=\"popover-button\"\r\n                onClick={() => this.handleButtonClick()}\r\n              >\r\n                <svg class=\"btn-icon\" height=\"9\" width=\"9\">\r\n                  <path fill=\"#575195\" d=\"M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z\" />\r\n                </svg>\r\n                <span class=\"button-text\">{this.buttonText}</span>\r\n              </button>\r\n            ) : (\r\n              \"\"\r\n            )}\r\n          </div>\r\n        ) : (\r\n          \"\"\r\n        )}\r\n        <div\r\n          ref={(el) => (this.liveRegion = el as HTMLDivElement)}\r\n          class=\"live-region sr-only\"\r\n          aria-live=\"polite\"\r\n          aria-atomic=\"true\"\r\n        >\r\n          {this.open && this.renderLiveRegion()}\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"oGAAA,MAAMA,EAAsB,kgE,MCOfC,EAAY,M,6LAEfC,KAAAC,QAAoBD,KAAKE,GAAGC,cAAeC,cAA6BC,KAoBxEL,KAAAM,aAAuB,IAEvBN,KAAAO,eAAiB,M,mHAJgB,M,YACI,E,CAXzCC,kBACF,OAAOR,KAAKC,QAAQQ,WAAa,WAC7BT,KAAKU,8BACLV,KAAKW,kC,CAcXC,wBAKEZ,KAAKa,KAAOb,KAAKO,eACjBP,KAAKO,eAAiB,K,CAIxBO,YAAYC,GACV,IAAIC,EAAoB,MACxB,GAAIhB,KAAKiB,MAAO,CACdD,EAAoBD,EAAGG,SAAWlB,KAAKiB,OAASjB,KAAKiB,MAAME,SAASJ,EAAGG,O,CAIzElB,KAAKO,gBAAkBS,IAAsBD,EAAGG,SAAWlB,KAAKE,IAAMF,KAAKE,GAAGiB,SAASJ,EAAGG,Q,CAG5FE,oBACE,GAAIpB,KAAKqB,SAAU,CACjBrB,KAAKqB,SAASC,QACdtB,KAAKQ,YAAYe,KAAKvB,KAAKqB,S,CAE7BrB,KAAKa,KAAO,K,CAGdW,mBACE,GAAIxB,KAAKyB,WAAY,CACnBzB,KAAKyB,WAAWC,UAAY,GAE5B,MAAMC,EAAUC,SAASC,cAAc,OAEvC,MAAMC,EAAUF,SAASC,cAAc,QACvCC,EAAQJ,UAAY1B,KAAK+B,aAAe,KAAO,GAC/CJ,EAAQK,YAAYF,GAEpB,MAAMG,EAASL,SAASC,cAAc,QACtCI,EAAOP,UAAY1B,KAAKkC,YAAc,KAAO,GAC7CP,EAAQK,YAAYC,GAEpB,GAAIjC,KAAKmC,WAAY,CACnB,MAAMC,EAAWR,SAASC,cAAc,QACxCO,EAASV,UACP1B,KAAKmC,WACL,IACAE,EAAKC,cAAc,CACjBC,GAAI,mBACJC,eAAgB,wCAEpBb,EAAQK,YAAYI,E,CAEtBpC,KAAKyB,WAAWO,YAAYL,E,EAKhCc,kBACEzC,KAAKE,GAAIwC,MAAMC,IAAM3C,KAAK4C,OAAOC,EAAI,KACrC,GAAIC,OAAOC,WAAa/C,KAAK4C,OAAOI,GAAMhD,KAAKM,aAAe,GAAI,CAChEN,KAAKE,GAAIwC,MAAMO,KAAOjD,KAAK4C,OAAOI,EAAI,I,KACjC,CACLhD,KAAKE,GAAIwC,MAAMO,KAAOjD,KAAK4C,OAAOI,EAAKhD,KAAKM,aAAe,I,EAI/D4C,SACE,MAAMC,EAAkBnD,KAAK+B,eAAiB/B,KAAK+B,aAAa,KAAO,IAAM,WAAa/B,KAAK+B,aAAa,KAAO,IAAM,WAAa,IACtI,OACEqB,EAACC,EAAI,OACArD,KAAKa,KACNuC,EAAA,qBAAiB,OAAOE,MAAM,WAC5BF,EAAA,MAAIE,MAAO,SAASH,KAAoBnD,KAAK+B,cAC7CqB,EAAA,KAAGE,MAAM,QAAQtD,KAAKkC,aACrBlC,KAAKmC,WAEJiB,EAAA,UACEG,SAAS,KAETC,UAAU,QACVC,IAAMvD,GAAQF,KAAKiB,MAAQf,EAC3BoD,MAAM,iBACNI,QAAS,IAAM1D,KAAKoB,qBAEpBgC,EAAA,OAAKE,MAAM,WAAWK,OAAO,IAAIC,MAAM,KACrCR,EAAA,QAAMS,KAAK,UAAUC,EAAE,uEAEzBV,EAAA,QAAME,MAAM,eAAetD,KAAKmC,aACzB,IAIP,GAIRiB,EAAA,OACEK,IAAMvD,GAAQF,KAAKyB,WAAavB,EAChCoD,MAAM,sBAAqB,YACjB,SAAQ,cACN,QAEXtD,KAAKa,MAAQb,KAAKwB,oB"}

package/dist/ripple/p-ed14d37c.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-7b2fc615.system.js","./p-bc28c815.system.js"],(function(e){"use strict";var t,i,o,s,n,r,l,a,p,c,d;return{setters:[function(e){t=e.r;i=e.c;o=e.h;s=e.H;n=e.g;r=e.f},function(e){l=e.i;a=e.d;p=e.g;c=e.m;d=e.w}],execute:function(){var h=':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}';var u=e("wm_option",function(){function e(e){t(this,e);this.wmOptionSelected=i(this,"wmOptionSelected",7);this.wmKeyUpPressed=i(this,"wmKeyUpPressed",7);this.wmKeyDownPressed=i(this,"wmKeyDownPressed",7);this.wmEscKeyPressed=i(this,"wmEscKeyPressed",7);this.wmHomeKeyPressed=i(this,"wmHomeKeyPressed",7);this.wmEndKeyPressed=i(this,"wmEndKeyPressed",7);this.wmEnterKeyPressed=i(this,"wmEnterKeyPressed",7);this.wmLetterPressed=i(this,"wmLetterPressed",7);this.wmOptionBlurred=i(this,"wmOptionBlurred",7);this.value=undefined;this.subinfo=undefined;this.disabled=false;this.selected=false;this.focused=false;this.searchTerm=""}Object.defineProperty(e.prototype,"hostClasses",{get:function(){var e=[];if(this.subinfo){e.push("hassubinfo")}if(this.parentSelectEl.multiple){e.push("multi-option")}if(!this.el.textContent.toLowerCase().includes(this.searchTerm)){e.push("filtered-out")}return e.join(" ")},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"parentSelectEl",{get:function(){var e;return((e=this.el.parentElement)===null||e===void 0?void 0:e.nodeName)!=="WM-SELECT"?this.el.getRootNode().host:this.el.parentElement},enumerable:false,configurable:true});e.prototype.handleKeydown=function(e){switch(e.key){case"ArrowUp":e.preventDefault();this.wmKeyUpPressed.emit(this.el);break;case"ArrowDown":e.preventDefault();this.wmKeyDownPressed.emit(this.el);break;case"Enter":e.preventDefault();if(!this.disabled){this.el.click();this.wmEnterKeyPressed.emit(this.el)}break;case" ":e.preventDefault();this.el.click();break;case"Escape":e.preventDefault();e.stopPropagation();this.wmEscKeyPressed.emit();break;case"Home":e.preventDefault();this.wmHomeKeyPressed.emit();break;case"End":e.preventDefault();this.wmEndKeyPressed.emit();break;default:if(e.key.length===1){this.wmLetterPressed.emit(e.key)}}};e.prototype.handleSelection=function(){if(!this.disabled){this.wmOptionSelected.emit(this.el)}};e.prototype.handleBlur=function(e){this.wmOptionBlurred.emit({relatedTarget:e.relatedTarget})};e.prototype.syncAriaSelected=function(){this.selected?this.el.setAttribute("aria-selected","true"):this.el.removeAttribute("aria-selected")};e.prototype.syncAriaDisabled=function(){this.disabled?this.el.setAttribute("aria-disabled","true"):this.el.removeAttribute("aria-disabled")};e.prototype.updateDisabledOnClick=function(){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}};e.prototype.handleSearch=function(e){this.searchTerm=e.detail.searchTerm.toLowerCase();if(this.searchTerm){var t=new RegExp("".concat(this.searchTerm),"gi");var i=this.el.textContent.replace(t,(function(e){return"<strong>".concat(e,"</strong>")}));this.textEl.innerHTML=i}else{this.textEl.innerHTML=this.el.textContent}};e.prototype.componentWillLoad=function(){var e=this;this.syncAriaSelected();this.syncAriaDisabled();this.updateDisabledOnClick();this.parentSelectEl.addEventListener("wmSelectSearchChanged",(function(t){return e.handleSearch(t)}))};e.prototype.render=function(){var e=this;return o(s,{role:"option",tabindex:this.focused?0:-1,class:this.hostClasses},o("div",{class:"option-wrapper ".concat(this.parentSelectEl.multiple?"checkbox":"")},o("span",{"aria-hidden":"true",ref:function(t){return e.textEl=t}},this.el.textContent),o("span",{class:"sr-only"},this.el.textContent)),o("div",{class:"subinfo"},this.subinfo))};Object.defineProperty(e.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{selected:["syncAriaSelected"],disabled:["syncAriaDisabled","updateDisabledOnClick"]}},enumerable:false,configurable:true});return e}());u.style=h;var 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{display:block;font-style:italic;color:#c0392b;font-size:0.875rem;margin-top:0.25rem;margin-bottom:0.25rem;top:100%;left:0}.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}';var m=e("wm_select",function(){function e(e){var o=this;t(this,e);this.wmSelectDidLoad=i(this,"wmSelectDidLoad",7);this.wmSelectBlurred=i(this,"wmSelectBlurred",7);this.wmSelectChanged=i(this,"wmSelectChanged",7);this.wmComponentBlurred=i(this,"wmComponentBlurred",7);this.wmSelectSearchChanged=i(this,"wmSelectSearchChanged",7);this.requiredMessage=l.formatMessage({id:"global.requiredField",defaultMessage:"required field"});this.selectAllMessage=l.formatMessage({id:"select.selectAll",defaultMessage:"Select All"});this.deselectAllMessage=l.formatMessage({id:"select.deselectAll",defaultMessage:"Deselect All"});this.allOptionsSelectedMessage=l.formatMessage({id:"select.allOptionsSelected",defaultMessage:"All options selected"});this.allOptionsDeselectedMessage=l.formatMessage({id:"select.allOptionsDeselected",defaultMessage:"All options deselected"});this.keysSoFar="";this.searchIndex=0;this.openUp=false;this.overflowCount=0;this.displayedOptions=[];this.debouncedClearKeysSoFar=a((function(){o.keysSoFar=""}),500);this.debouncedSearch=a((function(){o.wmSelectSearchChanged.emit({searchTerm:o.searchTerm});if(o.filteredOptions.length){o.announce(o.resultsFoundMessage)}else{o.announce(o.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=l.formatMessage({id:"select.multiPlaceholder",defaultMessage:"Make a selection",description:"Placeholder text. Use imperative"});this.searchPlaceholder=l.formatMessage({id:"select.searchPlaceholder",defaultMessage:"Search",description:"Placeholder text. Use imperative"});this.allSelectedMessage=l.formatMessage({id:"select.allSelected",defaultMessage:"All selected",description:"Text displayed when all options are selected"});this.isTabbing=false;this.isExpanded=false;this.announcement=""}Object.defineProperty(e.prototype,"childOptions",{get:function(){return Array.from(this.el.querySelectorAll("wm-option"))},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"duplicateOptions",{get:function(){return Array.from(this.el.shadowRoot.querySelectorAll("wm-option"))},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"allOptionEls",{get:function(){return this.duplicateOptions.concat(this.childOptions)},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"visibleOptionEls",{get:function(){return this.allOptionEls.filter((function(e){return!e.classList.contains("hidden")&&!e.classList.contains("filtered-out")}))},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"searchTerm",{get:function(){return this.searchFieldEl?this.searchFieldEl.value:""},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"filteredOptions",{get:function(){var e=this;return this.childOptions.filter((function(t){var i;return(i=t.textContent)===null||i===void 0?void 0:i.toLowerCase().includes(e.searchTerm.toLowerCase())}))},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"selectedOptions",{get:function(){return Array.from(this.el.querySelectorAll("wm-option")).filter((function(e){return e.selected}))},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"allSelected",{get:function(){return this.childOptions.every((function(e){return e.selected}))},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"resultsFoundMessage",{get:function(){return l.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})},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"noResultsFoundMessage",{get:function(){return l.formatMessage({id:"select.noSearchResults",defaultMessage:"No results found. Please try your search again.",description:"The message displayed when no options pass the search filter"})},enumerable:false,configurable:true});e.prototype.toggleTabbingOn=function(){this.isTabbing=true};e.prototype.toggleTabbingOff=function(){this.isTabbing=false};e.prototype.handleOptionSelection=function(e){var t=e.detail;this.focusOption(t);if(!this.multiple){if(!t.selected){this.selectOption(t);var i={changedOption:t,selectedOptions:[t]};this.wmSelectChanged.emit(i);var o=new CustomEvent("change",{detail:i});this.el.dispatchEvent(o)}this.close()}else{this.selectOption(t);var s=t.classList.contains("duplicate");var n=s?this.findCorrespondingOption(t):t;var r=this.childOptions.filter((function(e){return e.selected}));var i={changedOption:n,selectedOptions:r};this.wmSelectChanged.emit(i);var o=new CustomEvent("change",{detail:i});this.el.dispatchEvent(o)}};e.prototype.handleChildEnter=function(){this.close()};e.prototype.handleChildUp=function(e){this.moveUp(e.detail)};e.prototype.handleChildDown=function(e){this.moveDown(e.detail)};e.prototype.moveToFirstOption=function(){this.focusOption(this.visibleOptionEls[0])};e.prototype.moveToLastOption=function(){this.focusOption(this.visibleOptionEls[this.visibleOptionEls.length-1])};e.prototype.closePopupOnEscape=function(){this.close()};e.prototype.handleOptionBlur=function(e){if(!this.isElOrChild(e.detail.relatedTarget)){var t=new CustomEvent("blur");t.relatedTarget=e.detail.relatedTarget;this.el.dispatchEvent(t)}};e.prototype.handleClick=function(e){if(!this.isElOrChild(e.target)){this.close()}};e.prototype.handleSelectAllClick=function(){this.allSelected?this.deselectAllOptions():this.selectAllOptions()};e.prototype.selectAllOptions=function(){this.allOptionEls.forEach((function(e){return e.selected=true}));this.setSelectAllButton();this.setButtonText();var e={changedOption:null,selectedOptions:this.childOptions};this.wmSelectChanged.emit(e)};e.prototype.deselectAllOptions=function(){this.allOptionEls.forEach((function(e){return e.selected=false}));this.setSelectAllButton();this.setButtonText();var e={changedOption:null,selectedOptions:[]};this.wmSelectChanged.emit(e)};e.prototype.handleButtonBlur=function(e){if(this.isElOrChild(e.relatedTarget)){e.stopPropagation()}};e.prototype.handleSearchFieldBlur=function(e){this.searchFieldWrapperEl.classList.remove("focus");if(this.isElOrChild(e.relatedTarget)){e.stopPropagation()}};e.prototype.handleKey=function(e){switch(e.key){case"ArrowDown":if(this.isExpanded===false){e.preventDefault();this.open("next")}break;case"ArrowUp":if(this.isExpanded===false){e.preventDefault();this.open("previous")}break}};e.prototype.componentWillLoad=function(){var e=this;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:p();if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}if(this.selectedOptions.length>0){this.selectedOptions.forEach((function(t){e.displayedOptions.push(t)}))}else if(!this.multiple){this.selectOption(this.allOptionEls[0])}};e.prototype.componentDidLoad=function(){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()};e.prototype.componentWillUpdate=function(){if(this.multiple){var e=this.visibleOptionEls.filter((function(e){return e.classList.contains("duplicate")}));e.forEach((function(t,i){if(i===e.length-1){t.classList.add("last")}else{t.classList.remove("last")}}))}};e.prototype.moveUp=function(e){var t=this.visibleOptionEls;if(this.selectAllEl){t.unshift(this.selectAllEl)}if(this.searchFieldEl){t.unshift(this.searchFieldEl)}var i=t[t.indexOf(e)-1]||t[t.length-1];if(i){this.focusOption(i)}};e.prototype.moveDown=function(e){var t=this.visibleOptionEls;if(this.selectAllEl){t.unshift(this.selectAllEl)}if(this.searchFieldEl){t.unshift(this.searchFieldEl)}var i=t[t.indexOf(e)+1]||t[0];if(i){this.focusOption(i)}};e.prototype.open=function(e){var t=this;if(!this.disabled){var i=this.el.clientHeight;var o=this.buttonEl.clientHeight;this.openUp=c(this.el,this.dropdownEl,i,o);this.isExpanded=true;this.dropdownEl.classList.remove("hidden");window.requestAnimationFrame((function(){switch(e){case"next":if(t.search){t.searchFieldEl.focus();t.listboxEl.scrollTop=0}else{t.moveDown(t.visibleOptionEls.filter((function(e){return e.selected})).slice(-1)[0])}break;case"previous":if(t.search){t.focusOption(t.visibleOptionEls[t.visibleOptionEls.length-1])}else{t.moveUp(t.visibleOptionEls.filter((function(e){return e.selected}))[0])}break;default:if(t.search){t.searchFieldEl.focus();t.listboxEl.scrollTop=0}else if(t.selectedOptions.length>0){t.focusOption(t.visibleOptionEls.filter((function(e){return e.selected}))[0])}else{t.focusOption(t.visibleOptionEls[0])}break}}))}};e.prototype.close=function(e){var t=this;if(e===void 0){e=true}if(this.isExpanded){this.isExpanded=false;this.allOptionEls.map((function(e){return e.focused=false}));window.setTimeout((function(){t.dropdownEl.classList.add("hidden");if(t.multiple){t.updateOptionVisibility()}if(t.search){t.searchFieldEl.value="";t.wmSelectSearchChanged.emit({searchTerm:t.searchTerm})}if(e){t.buttonEl.focus()}}),150)}};e.prototype.updateOptionVisibility=function(){var e=this;this.childOptions.forEach((function(t,i){var o=e.duplicateOptions[i];if(t.selected){t.classList.add("hidden");o.classList.remove("hidden")}else{t.classList.remove("hidden");o.classList.add("hidden")}}))};e.prototype.focusOption=function(e){this.allOptionEls.forEach((function(t){return t.focused=t===e}));e.scrollIntoView({block:"nearest"});window.setTimeout((function(){return e.scrollIntoView({block:"nearest"})}),60);e.focus()};e.prototype.selectOption=function(e){if(e.classList.contains("duplicate")){var t=this.findCorrespondingOption(e);t.selected=!t.selected;r(this.el)}else if(this.multiple){e.selected=!e.selected}else{this.childOptions.forEach((function(t){return t.selected=t===e}))}if(this.selectAllEl){this.setSelectAllButton()}this.setButtonText()};e.prototype.findAndFocusOption=function(e){var t=this;var i=e.detail.toLowerCase();if(!this.keysSoFar){this.visibleOptionEls.forEach((function(e,i){if(e.focused){t.searchIndex=i}}))}this.keysSoFar+=i;var o=this.findMatchInRange(this.visibleOptionEls,this.searchIndex+1,this.visibleOptionEls.length);if(!o){o=this.findMatchInRange(this.visibleOptionEls,0,this.searchIndex)}if(o){this.focusOption(o)}this.debouncedClearKeysSoFar()};e.prototype.findMatchInRange=function(e,t,i){var o=this;var s=null;var n=e.slice(t,i);n.forEach((function(e){var t=e.textContent;if(!s&&t&&t.toLowerCase().startsWith(o.keysSoFar)){s=e}}));return s};e.prototype.findCorrespondingOption=function(e){var t=e.classList.contains("duplicate");return t?this.childOptions[this.duplicateOptions.indexOf(e)]:this.duplicateOptions[this.childOptions.indexOf(e)]};e.prototype.isElOrChild=function(e){var t;return e===this.el||this.el.contains(e)||((t=this.el.shadowRoot)===null||t===void 0?void 0:t.contains(e))};e.prototype.exposeErrors=function(){var e=p();this.errorContainer.id="wm-errors-".concat(e);this.buttonEl.setAttribute("aria-describedby","wm-errors-".concat(e))};e.prototype.renderErrorContainer=function(){var e=this;return o("div",{id:"wm-errors",class:this.errorMessage?"error-message":"",ref:function(t){return e.errorContainer=t},"aria-live":"assertive","aria-atomic":"true"},this.errorMessage)};e.prototype.handleComponentBlur=function(e){if(!this.el.contains(e.relatedTarget)){this.close(false);this.wmSelectBlurred.emit();this.wmComponentBlurred.emit()}};e.prototype.handleKeyDown=function(e){var t=e.target;switch(e.key){case"ArrowDown":e.preventDefault();this.moveDown(e.target);break;case"ArrowUp":e.preventDefault();this.moveUp(e.target);break;case"Escape":e.preventDefault();this.close();break;case"Enter":if(t===this.selectAllEl){e.preventDefault();this.handleSelectAllClick();this.close()}break;case" ":if(t===this.selectAllEl){e.preventDefault();this.handleSelectAllClick()}break}};e.prototype.setButtonText=function(){var e=this;this.displayedOptions=this.childOptions.filter((function(e){return e.selected})).map((function(t){return!t.classList.contains("hidden")?t:e.findCorrespondingOption(t)}));if(this.multiple){var t=38;var i=window.getComputedStyle(this.buttonEl);var o=parseInt(i.getPropertyValue("padding-left").slice(0,-2));var s=parseInt(i.getPropertyValue("padding-right").slice(0,-2));var n=this.buttonEl.clientWidth-o-s-t;var r=this.displayedOptions.map((function(e){return e.shadowRoot.querySelector(".option-wrapper").clientWidth}));var l=r.reduce((function(e,t){return e+t}),0);this.overflowCount=0;while(l>n&&this.displayedOptions.length>1){this.overflowCount++;l-=r[r.length-1];r.pop();this.displayedOptions.pop()}}};e.prototype.setSelectAllButton=function(){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)}}};e.prototype.announce=function(e){if(this.liveRegionEl.textContent===e){e+=" "}this.announcement=e};e.prototype.renderButtonText=function(){if(this.multiple&&this.displayedOptions.length<1){return o("span",null,this.placeholder)}else if(this.multiple&&this.allSelected&&this.overflowCount>0){return this.allSelectedMessage}else{return this.displayedOptions.map((function(e,t){return o("span",null,t>0?", ":"",e.textContent)}))}};e.prototype.renderSubinfo=function(){if(!this.multiple&&this.selectedOptions.length>0&&this.selectedOptions[0].subinfo){return o("span",{class:"subinfo"},this.selectedOptions[0].subinfo)}};e.prototype.renderOverflowCount=function(){if(this.overflowCount>0&&!this.allSelected){return o("span",null,o("span",{class:"overflow-counter"},"+",this.overflowCount))}};e.prototype.renderSearchField=function(){var e=this;return o("div",{class:"search"},o("div",{class:"searchfield-wrapper",ref:function(t){return e.searchFieldWrapperEl=t}},o("div",{class:"icon"}),o("input",{ref:function(t){return e.searchFieldEl=t},class:"searchfield",role:"combobox","aria-controls":"list-".concat(this.uid),"aria-expanded":this.isExpanded?"true":"false",onKeyDown:function(t){return e.handleKeyDown(t)},onFocus:function(){return e.searchFieldWrapperEl.classList.add("focus")},onBlur:function(t){return e.handleSearchFieldBlur(t)},onInput:function(){return e.debouncedSearch()},placeholder:this.searchPlaceholder})))};e.prototype.renderSearchFailedMessage=function(){return o("div",{class:"search-results-message"},this.noResultsFoundMessage)};e.prototype.renderSelectAllButton=function(){var e=this;if(this.selectAll&&this.multiple&&this.searchTerm==""){return o("button",{ref:function(t){return e.selectAllEl=t},class:"select-all",onClick:function(){return e.handleSelectAllClick()},onKeyDown:function(t){return e.handleKeyDown(t)},tabindex:"-1"},this.allSelected?this.deselectAllMessage:this.selectAllMessage)}};e.prototype.renderDuplicateOptions=function(){return Array.from(this.el.children).map((function(e){return o("wm-option",{class:"duplicate",selected:e.selected},e.textContent)}))};e.prototype.render=function(){var e;var t=this;var i=(e={id:"selectbtn-".concat(this.uid)},e["disabled"]=this.disabled,e["aria-controls"]="list-".concat(this.uid),e["aria-labelledby"]="label-".concat(this.uid," selectbtn-").concat(this.uid),e["aria-describedby"]="wm-errors",e["aria-expanded"]=this.isExpanded?"true":"false",e.onClick=function(){return t.isExpanded?t.close():t.open()},e);return o(s,{onBlur:function(e){return t.handleComponentBlur(e)}},o("div",{class:"wrapper ".concat(d()," label-").concat(this.labelPosition," ").concat(this.invalid||this.errorMessage?"invalid":"")},o("div",{class:"label-wrapper"},o("label",{class:"label",id:"label-".concat(this.uid),htmlFor:"selectbtn-".concat(this.uid)},this.label,this.requiredField?o("span",{class:"required"},o("span",{class:"sr-only"},this.requiredMessage),o("span",{"aria-hidden":"true"},"*")):"")),o("div",{class:"button-wrapper"},o("button",Object.assign({},i,{class:"displayedoption ".concat(this.isTabbing?"user-is-tabbing":""),ref:function(e){return t.buttonEl=e},onBlur:function(e){return t.handleButtonBlur(e)},onFocus:function(){return t.close()}}),o("span",{class:this.selectedOptions.length>0&&this.selectedOptions.filter((function(e){return e.subinfo})).length>0?"overflowcontrol hassubinfo":"overflowcontrol"},o("span",{class:"button-text"},this.renderButtonText()),this.renderSubinfo()),this.renderOverflowCount()),o("div",{class:"dropdown ".concat(this.isExpanded?"open":""," ").concat(this.openUp?"upwards":""),ref:function(e){return t.dropdownEl=e}},this.search&&this.renderSearchField(),o("div",{id:"list-".concat(this.uid),class:"options-wrapper",tabindex:-1,role:"listbox","aria-multiselectable":this.multiple?"true":null,"aria-labelledby":"label-".concat(this.uid),ref:function(e){return t.listboxEl=e}},this.search&&this.filteredOptions.length===0&&this.renderSearchFailedMessage(),this.renderSelectAllButton(),this.multiple&&this.renderDuplicateOptions(),o("slot",null))),this.renderErrorContainer(),o("div",{id:"announcement","aria-live":"polite",class:"sr-only",ref:function(e){return t.liveRegionEl=e}},this.announcement))))};Object.defineProperty(e,"delegatesFocus",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"el",{get:function(){return n(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{errorMessage:["exposeErrors"]}},enumerable:false,configurable:true});return e}());m.style=f}}}));
-//# sourceMappingURL=p-ed14d37c.system.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["wmOptionCss","Option","exports","undefined","Object","defineProperty","class_1","prototype","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","concat","boldedText","replace","match","textEl","innerHTML","componentWillLoad","_this","addEventListener","render","h","Host","role","tabindex","focused","class","hostClasses","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","class_2","Array","from","querySelectorAll","shadowRoot","duplicateOptions","childOptions","allOptionEls","filter","option","classList","contains","searchFieldEl","value","x","every","numResults","toggleTabbingOn","isTabbing","toggleTabbingOff","handleOptionSelection","focusOption","selectOption","changedOption","selectedOptions","wmSelectChanged","event","CustomEvent","dispatchEvent","close","isDuplicate","originalOption","findCorrespondingOption","o","handleChildEnter","handleChildUp","moveUp","handleChildDown","moveDown","moveToFirstOption","visibleOptionEls","moveToLastOption","closePopupOnEscape","handleOptionBlur","isElOrChild","handleClick","target","handleSelectAllClick","allSelected","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_1","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","_b","getTextDir","labelPosition","invalid","htmlFor","requiredField","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 invalidBorder;\r\n      }\r\n    }\r\n  }\r\n\r\n  & .error-message {\r\n    @include errorMessage;\r\n    margin-bottom: rem-calc(4);\r\n    top: 100%;\r\n    left: 0;\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-ee97c3f6.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["wmButtonCss","Button","this","btnPos","old","new","id","generateId","ariaPopup","isDisabled","toBool","disabled","tempButtonType","buttonType","buttonStyle","isTruncated","buttonEl","offsetWidth","scrollWidth","hasTooltip","tooltipEl","document","getElementById","buttonClasses","classes","permanentlyDelete","textWrap","isTabbing","customBackground","iconStyles","transformStyle","iconRotate","iconFlip","Object","assign","iconSize","fontSize","transform","toggleTabbingOn","toggleTabbingOff","handleScroll","tooltipVisible","hideTooltip","validateType","newValue","valid","includes","validateIcon","validateDeprecatedType","updateIcon","icon","getIconCodeFromName","console","error","tooltip","handleKeydown","ev","key","preventDefault","el","click","componentWillLoad","warn","componentDidLoad","body","classList","contains","getAttribute","getBoundingClientRect","showTooltip","tooltipText","textContent","hasNoWhitespace","match","add","style","setProperty","remove","removeProperty","adjustedTooltipPlacement","adjustTooltipPlacement","tooltipPosition","tooltipRect","transitionDelay","opacity","setTimeout","positionTooltip","tPos","window","requestAnimationFrame","top","left","vDiff","height","hDiff","width","vPos","hPos","bottom","right","Math","max","showTooltipForKeyboardUsers","getAriaLabel","labelForIdenticalButtons","render","h","Host","class","ref","onMouseEnter","onMouseLeave","onFocus","onBlur","onClick","String","fromCodePoint","parseInt"],"sources":["./src/components/wm-button/wm-button.scss?tag=wm-button&encapsulation=shadow","./src/components/wm-button/wm-button.tsx"],"sourcesContent":[":host([disabled]),\r\n:host(.button-disabled) {\r\n  pointer-events: none;\r\n}\r\n\r\n:host([disabled=\"false\"]) {\r\n  // override disabled behavior from occuring when the string is \"false\", which would evaluate as truthy\r\n  pointer-events: initial;\r\n}\r\n\r\n:host,\r\nwm-button {\r\n  display: inline-block;\r\n  width: fit-content;\r\n  position: relative; // for tooltip\r\n  @include box-shadow(none);\r\n\r\n  .sr-only {\r\n    @include srOnly;\r\n  }\r\n\r\n  @extend %wm-button;\r\n}\r\n","import { h, Component, Prop, Element, Listen, Watch, Host, State } from \"@stencil/core\";\r\nimport { getIconCodeFromName, TooltipPlacement, validButtonTypes } from \"../../global/interfaces\";\r\nimport { generateId, adjustTooltipPlacement, toBool } from \"../../global/functions\";\r\n\r\n@Component({\r\n  tag: \"wm-button\",\r\n  styleUrl: \"wm-button.scss\",\r\n  shadow: { delegatesFocus: true },\r\n})\r\nexport class Button {\r\n  @Element() el!: HTMLWmButtonElement;\r\n  private buttonEl!: HTMLButtonElement;\r\n\r\n  // icon and tooltip have reflect set to true. Without reflect, the react wrappers don't expose the attribute\r\n  // and the component throws errors when they are required (when buttonType is icononly or navigational)\r\n  @Prop({ reflect: true }) disabled: boolean = false;\r\n  get isDisabled(): boolean {\r\n    // string \"false\" needs to be treated as bool False because react wrappers convert bool to string.\r\n    return toBool(this.disabled);\r\n  }\r\n  @Prop({ mutable: true }) buttonType: validButtonTypes | null = null;\r\n  @Prop({ mutable: true }) buttonStyle: validButtonTypes | null = null; // DEPRECATED in favor of button-type\r\n  get tempButtonType(): validButtonTypes {\r\n    // uses of this getter should be replaced with this.buttonType when buttonStyle is fully phased out\r\n    // don't forget to reset this.buttonType's default value to secondary\r\n    return this.buttonType || this.buttonStyle || \"secondary\";\r\n  }\r\n  @Prop({ reflect: true, mutable: true }) icon?: string;\r\n  @Prop() iconSize?: string;\r\n  @Prop() iconRotate?: number;\r\n  @Prop() iconFlip?: \"horizontal\" | \"vertical\";\r\n  @Prop({ reflect: true, mutable: true }) tooltip?: string;\r\n  @Prop() labelForIdenticalButtons?: string;\r\n  @Prop() tooltipPosition: TooltipPlacement = \"bottom-right\";\r\n  @Prop() permanentlyDelete?: boolean = false;\r\n  @Prop() textWrap: boolean = true;\r\n  @Prop() customBackground?: string;\r\n  @Prop({ mutable: true }) tooltipVisible = false; // this is not part of the documented API but we need to expose as prop in order to change it from the focus method defined in WillLoad()\r\n\r\n  @State() isTabbing: boolean = false;\r\n\r\n  private btnPos: any = { old: {}, new: {} }; // for tooltip position. old and new are DOMRect\r\n  private id = generateId();\r\n  private ariaPopup: boolean = false;\r\n\r\n  get isTruncated(): boolean {\r\n    return (\r\n      !!this.buttonEl && this.tempButtonType === \"textonly\" && this.buttonEl.offsetWidth < this.buttonEl.scrollWidth\r\n    );\r\n  }\r\n\r\n  get hasTooltip(): boolean {\r\n    // tooltip is only rendered for icononly and navigational types, or if the button text is truncated\r\n    return this.tempButtonType === \"icononly\" || this.tempButtonType === \"navigational\" || this.isTruncated;\r\n  }\r\n\r\n  get tooltipEl(): HTMLElement {\r\n    return document.getElementById(\"wm-tooltip\")!;\r\n  }\r\n\r\n  get buttonClasses() {\r\n    let classes = \"wm-button\";\r\n    classes += this.permanentlyDelete ? \" -permanentlydelete\" : \"\";\r\n    classes += this.tempButtonType ? \" -\" + this.tempButtonType : \" -secondary\";\r\n    classes += this.textWrap ? \"\" : \" nowrap\";\r\n    classes += this.isTabbing ? \" user-is-tabbing\" : \"\";\r\n    classes += this.isTruncated ? \" -truncated\" : \"\";\r\n    classes += this.customBackground === \"dark\" ? \" dark\" : \"\";\r\n    return classes;\r\n  }\r\n\r\n  get iconStyles() {\r\n    let transformStyle = \"\";\r\n    transformStyle += this.iconRotate ? `rotate(${this.iconRotate}deg)` : \"\";\r\n    transformStyle += this.iconFlip === \"horizontal\" ? `scaleX(-1)` : \"\";\r\n    transformStyle += this.iconFlip === \"vertical\" ? `scaleY(-1)` : \"\";\r\n\r\n    return {\r\n      ...(this.iconSize && { fontSize: this.iconSize }),\r\n      ...((this.iconRotate || this.iconFlip) && { transform: transformStyle }),\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  // we need to listen for scroll events during the capture phase because they do not bubble up\r\n  // there can be layouts where the main content has 100vh and overflows\r\n  // in these cases window will register no scroll events unless we catch on they way down\r\n  @Listen(\"scroll\", { target: \"window\", capture: true })\r\n  handleScroll() {\r\n    if (this.tooltipVisible) {\r\n      this.hideTooltip();\r\n    }\r\n  }\r\n\r\n  @Watch(\"buttonType\")\r\n  validateType(newValue: string) {\r\n    const valid = [\r\n      \"primary\",\r\n      \"secondary\",\r\n      \"textonly\",\r\n      \"icononly\",\r\n      \"navigational\",\r\n      \"selector\",\r\n      \"selector-primary\",\r\n      \"pairpositive\",\r\n      \"pairnegative\",\r\n    ].includes(newValue);\r\n\r\n    if (!valid) {\r\n      this.buttonType = \"secondary\";\r\n    }\r\n\r\n    this.validateIcon();\r\n  }\r\n\r\n  // remove entire watcher after buttonStyle has been fully removed\r\n  @Watch(\"buttonStyle\")\r\n  validateDeprecatedType(newValue: string) {\r\n    const valid = [\"primary\", \"secondary\", \"textonly\", \"icononly\", \"navigational\", \"selector\"].includes(newValue);\r\n\r\n    if (!valid) {\r\n      this.buttonStyle = \"secondary\";\r\n    }\r\n\r\n    this.validateIcon();\r\n  }\r\n\r\n  @Watch(\"icon\")\r\n  updateIcon() {\r\n    this.icon = getIconCodeFromName(this.icon!);\r\n  }\r\n\r\n  validateIcon() {\r\n    switch (this.tempButtonType) {\r\n      case \"icononly\":\r\n      case \"navigational\":\r\n        // if the style is icononly or navigational...\r\n        // - an icon must be provided\r\n        if (!this.icon) {\r\n          console.error(\r\n            \"wm-button should have a valid 'icon' property when button-type is set to 'icononly' or 'navigational'.\"\r\n          );\r\n        }\r\n        // - if no tooltip text was passed and we couldn't generate one, throw an error\r\n        if (!this.tooltip) {\r\n          console.error(\r\n            \"wm-button should have a valid 'tooltip' property when button-type is set to 'icononly' or 'navigational'.\"\r\n          );\r\n        }\r\n        break;\r\n      case \"pairpositive\":\r\n        this.icon = \"f12c\";\r\n        break;\r\n      case \"pairnegative\":\r\n        this.icon = \"f739\";\r\n        break;\r\n    }\r\n  }\r\n\r\n  @Listen(\"keydown\")\r\n  handleKeydown(ev: KeyboardEvent) {\r\n    switch (ev.key) {\r\n      case \"Enter\":\r\n        ev.preventDefault();\r\n        if (!this.isDisabled) {\r\n          this.el.click();\r\n        }\r\n        break;\r\n    }\r\n  }\r\n\r\n  componentWillLoad() {\r\n    if (this.buttonStyle) {\r\n      console.warn(\"wm-button: button-style has been deprecated as of v3.1.0. Please use button-type instead.\");\r\n    }\r\n\r\n    this.validateType(this.tempButtonType);\r\n\r\n    if (this.icon) {\r\n      this.icon = this.icon = getIconCodeFromName(this.icon);\r\n    }\r\n  }\r\n\r\n  componentDidLoad() {\r\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\r\n      this.toggleTabbingOn();\r\n    }\r\n\r\n    this.ariaPopup = !!this.el.getAttribute(\"aria-haspopup\");\r\n\r\n    this.btnPos.new = this.buttonEl.getBoundingClientRect();\r\n  }\r\n\r\n  showTooltip() {\r\n    if (this.hasTooltip) {\r\n      // set tooltip text\r\n      let tooltipText = \"\";\r\n      if (this.isTruncated && this.el.textContent) {\r\n        // when truncated, tooltip text is the button's content\r\n        tooltipText = this.el.textContent;\r\n      } else if (this.tooltip) {\r\n        // otherwise it is the tooltip property if present\r\n        tooltipText = this.tooltip;\r\n      }\r\n      this.tooltipEl.textContent = tooltipText;\r\n\r\n      // tooltip only has a maxWidth if it contains whitespace and can break\r\n      const hasNoWhitespace = tooltipText.match(/^[^\\s]+$/);\r\n      if (hasNoWhitespace) {\r\n        this.tooltipEl.classList.add(\"single-word\");\r\n        this.tooltipEl.style.setProperty(\"--wmTooltipMaxWidth\", \"none\");\r\n      } else {\r\n        this.tooltipEl.classList.remove(\"single-word\");\r\n        this.tooltipEl.style.removeProperty(\"--wmTooltipMaxWidth\");\r\n      }\r\n\r\n      // adjust placement in case there is no space to place the tooltip where specified via prop\r\n      // calculation outside of the function to keep it pure\r\n      const adjustedTooltipPlacement = adjustTooltipPlacement(this.tooltipPosition, this.buttonEl, this.tooltipEl);\r\n\r\n      this.btnPos.old = {};\r\n      const tooltipRect = this.tooltipEl.getBoundingClientRect();\r\n      this.tooltipEl.style.transitionDelay = \"500ms\";\r\n      this.tooltipEl.style.opacity = \"1\";\r\n      // This slight delay fixes an issue for keyboard users:\r\n      // if they tab to a button out of screen bounds, the page scrolls\r\n      // and hideTooltip() would be triggered before the tooltip would show\r\n      setTimeout(() => {\r\n        this.tooltipVisible = true;\r\n        this.positionTooltip(adjustedTooltipPlacement, tooltipRect);\r\n      }, 50);\r\n    }\r\n  }\r\n\r\n  positionTooltip(tPos: string, tooltipRect: DOMRect) {\r\n    if (this.tooltipVisible) {\r\n      window.requestAnimationFrame(() => this.positionTooltip(tPos, tooltipRect));\r\n    }\r\n    this.btnPos.new = this.buttonEl.getBoundingClientRect();\r\n    if (this.btnPos.new.top != this.btnPos.old.top || this.btnPos.new.left != this.btnPos.old.left) {\r\n      // this is to figure out how to offset, given the size of the button and of the tooltip\r\n      // to get the center positions, calculate the difference between the button width and the tooltip width\r\n      const vDiff = (this.btnPos.new.height - tooltipRect.height) / 2;\r\n      const hDiff = (this.btnPos.new.width - tooltipRect.width) / 2;\r\n      // the naming convention defaults to center in the absence of a value\r\n      // Values \"top\" and \"bottom\" imply horizontal centering; Values \"right\" and \"left\" imply vertical centering\r\n      // therefore we first set to center first, then adjust accordingly\r\n      let vPos = this.btnPos.new.top + vDiff;\r\n      let hPos = this.btnPos.new.left + hDiff;\r\n\r\n      if (tPos.includes(\"top\")) {\r\n        vPos = this.btnPos.new.top - tooltipRect.height - 8;\r\n      }\r\n      if (tPos.includes(\"bottom\")) {\r\n        vPos = this.btnPos.new.bottom + 8;\r\n      }\r\n      if (tPos.includes(\"left\")) {\r\n        hPos = this.btnPos.new.left - tooltipRect.width - 8;\r\n      }\r\n      if (tPos.includes(\"right\")) {\r\n        hPos = this.btnPos.new.right + 8;\r\n      }\r\n\r\n      // after all positioning has been calculated, if tooltip is off-screen or closer than 24px it is readjusted\r\n      // this only occurs when the tooltip is overflowing to the left and is positioned top or bottom\r\n      // (button placed too far left, or screen size under 268px)\r\n      hPos = Math.max(hPos, 24);\r\n      this.tooltipEl.style.setProperty(\"--wmTooltipTop\", vPos + \"px\");\r\n      this.tooltipEl.style.setProperty(\"--wmTooltipLeft\", hPos + \"px\");\r\n      // this.tooltipEl.style.top = vPos + \"px\";\r\n      // this.tooltipEl.style.left = hPos + \"px\";\r\n      // this.tooltipEl.style.top = (vPos / 16).toString() + \"rem\";\r\n      // this.tooltipEl.style.left = (hPos / 16).toString() + \"rem\";\r\n\r\n      this.btnPos.old = this.btnPos.new;\r\n    }\r\n  }\r\n\r\n  hideTooltip() {\r\n    if (this.hasTooltip) {\r\n      this.tooltipEl.style.transitionDelay = \"0s\";\r\n      this.tooltipEl.style.opacity = \"0\";\r\n      this.tooltipVisible = false;\r\n    }\r\n  }\r\n\r\n  showTooltipForKeyboardUsers() {\r\n    if (this.isTabbing) {\r\n      this.showTooltip();\r\n    }\r\n  }\r\n\r\n  getAriaLabel() {\r\n    if (this.tempButtonType === \"icononly\" || this.tempButtonType === \"navigational\") {\r\n      return this.labelForIdenticalButtons || this.tooltip;\r\n    }\r\n\r\n    if (this.labelForIdenticalButtons) {\r\n      return this.labelForIdenticalButtons;\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host class={this.isDisabled ? \"button-disabled\" : \"\"}>\r\n        <button\r\n          id={this.id}\r\n          class={`${this.buttonClasses}`}\r\n          disabled={this.isDisabled}\r\n          ref={(el) => (this.buttonEl = el as HTMLButtonElement)}\r\n          aria-label={this.getAriaLabel()}\r\n          aria-hasPopup={this.ariaPopup ? \"menu\" : null}\r\n          onMouseEnter={() => this.showTooltip()}\r\n          onMouseLeave={() => this.hideTooltip()}\r\n          onFocus={() => this.showTooltipForKeyboardUsers()}\r\n          onBlur={() => this.hideTooltip()}\r\n          onClick={() => this.hideTooltip()}\r\n        >\r\n          {this.icon && (\r\n            <span class=\"mdi\" style={this.iconStyles}>\r\n              {String.fromCodePoint(parseInt(`0x${this.icon}`))}\r\n            </span>\r\n          )}\r\n          <span class=\"button-text\">\r\n            <slot />\r\n          </span>\r\n        </button>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"],"mappings":"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"}

package/dist/ripple/p-f3130941.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,f as i,h as s,H as r,g as a}from"./p-1c23de4a.js";import{g as o,d as n,q as h,i as l,r as d,u as p,j as c,s as w,m as g}from"./p-05e0f901.js";const m=':host,wm-tag-input{font-family:inherit;width:100%;display:block}:host *,wm-tag-input *{-webkit-box-sizing:border-box;box-sizing:border-box;font-size:14px}:host .wrapper,wm-tag-input .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-tag-input .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required,wm-tag-input .wrapper .label .required{color:#c0392b}:host .wrapper.label-left,wm-tag-input .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper,wm-tag-input .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label,wm-tag-input .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-tag-input .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-tag-input .wrapper.invalid .label{color:#c0392b}:host .wrapper.invalid .label:after,wm-tag-input .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-tag-input .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label,wm-tag-input .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper,wm-tag-input .wrapper{width:100%;height:100%;position:relative}:host .field-wrapper,wm-tag-input .field-wrapper{position:relative;width:100%;border:1px solid #4a4a4a;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px}:host .field-wrapper.focused,wm-tag-input .field-wrapper.focused{-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}:host .field-wrapper.invalid,wm-tag-input .field-wrapper.invalid{-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 .character-count,wm-tag-input .character-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:5rem;background-color:rgba(74, 74, 74, 0.05);font-size:0.875rem;font-weight:500;-ms-flex-item-align:stretch;align-self:stretch}:host .tags-and-input-wrapper,wm-tag-input .tags-and-input-wrapper{position:relative;width:100%;padding:0.5rem 0.25rem 0.5rem 0;margin-bottom:-0.5rem}:host .upper-row,wm-tag-input .upper-row{width:100%;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-pack:justify;justify-content:space-between}:host .upper-row:before,wm-tag-input .upper-row:before{-ms-flex-item-align:start;align-self:flex-start;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:#b5b5b5;padding:0.75rem 0.5rem 0.75rem 0.75rem}:host .lower-row,wm-tag-input .lower-row{width:100%;min-height:1.875rem}:host #max-tags,wm-tag-input #max-tags{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:1.875rem;background-color:#e6e6e6;padding:0.5rem 1rem;color:#4a4a4a;font-size:0.875rem;border-top:1px solid rgba(35, 35, 35, 0.6);border-radius:0 0 3px 3px}:host .tag-area,wm-tag-input .tag-area{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin:0;padding:0}:host .tag-area:focus,wm-tag-input .tag-area:focus{outline:none}:host .tag-area [role=option],wm-tag-input .tag-area [role=option]{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;height:1.75rem;list-style:none;color:#4a4a4a;background-color:rgba(3, 0, 0, 0.1);padding:0.5rem 0.625rem;margin-bottom:0.5rem;margin-right:0.25rem;margin-left:0.25rem;-webkit-transition:background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);white-space:pre}:host .tag-area [role=option].highlight,wm-tag-input .tag-area [role=option].highlight{-webkit-animation:fadeIn 1s;animation:fadeIn 1s}@-webkit-keyframes fadeIn{0%{background-color:rgba(3, 0, 0, 0.1)}50%{background-color:#c8dfcc}100%{background-color:rgba(3, 0, 0, 0.1)}}@keyframes fadeIn{0%{background-color:rgba(3, 0, 0, 0.1)}50%{background-color:#c8dfcc}100%{background-color:rgba(3, 0, 0, 0.1)}}:host .tag-area [role=option].focused,wm-tag-input .tag-area [role=option].focused{background-color:#d1d1d1}:host .tag-area [role=option].locked,wm-tag-input .tag-area [role=option].locked{background-color:#6b6b6b;color:white}:host .tag-area [role=option] .icon,wm-tag-input .tag-area [role=option] .icon{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;height:1.25rem;width:1.25rem;padding:0;margin-left:0.5rem}:host .tag-area [role=option] .icon.remove-btn,wm-tag-input .tag-area [role=option] .icon.remove-btn{border:1px solid #575195;color:#575195;border-radius:50%;cursor:pointer;-webkit-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1)}:host .tag-area [role=option] .icon.remove-btn:hover,wm-tag-input .tag-area [role=option] .icon.remove-btn:hover{color:white;background-color:#575195}:host .tag-area [role=option] .icon.remove-btn:before,wm-tag-input .tag-area [role=option] .icon.remove-btn: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:"\\f156"}:host .tag-area [role=option] .icon.lock,wm-tag-input .tag-area [role=option] .icon.lock{color:white}:host .tag-area [role=option] .icon.lock:before,wm-tag-input .tag-area [role=option] .icon.lock: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:"\\f341"}:host input,wm-tag-input input{font-family:inherit;border:none;height:1.75rem;padding:0;margin-bottom:0.5rem;margin-right:0.25rem;padding-left:0.5rem;right:0px}:host input.hidden,wm-tag-input input.hidden{display:none}:host input:focus,wm-tag-input input:focus{outline:none}:host .dropdown-wrapper,wm-tag-input .dropdown-wrapper{margin:0;padding:0;-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:calc(100% + 2px);right:0;background:#fff;z-index:100;width:100%;font-size:0.875rem}:host .dropdown-wrapper .dropdown,wm-tag-input .dropdown-wrapper .dropdown{-webkit-overflow-scrolling:touch;overflow:auto;max-height:12.5rem;margin:0;padding:0}:host .dropdown-wrapper.open,wm-tag-input .dropdown-wrapper.open{-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}:host .dropdown-wrapper.upwards,wm-tag-input .dropdown-wrapper.upwards{top:unset;bottom:calc(100% + 2px);-ms-transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;transform-origin:center bottom}:host .dropdown-wrapper li,:host .dropdown-wrapper div,wm-tag-input .dropdown-wrapper li,wm-tag-input .dropdown-wrapper div{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:0 1rem;background:#fff;list-style:none;height:2.6875rem;white-space:pre}:host .dropdown-wrapper li[role=option],:host .dropdown-wrapper li.add-new-btn,:host .dropdown-wrapper div[role=option],:host .dropdown-wrapper div.add-new-btn,wm-tag-input .dropdown-wrapper li[role=option],wm-tag-input .dropdown-wrapper li.add-new-btn,wm-tag-input .dropdown-wrapper div[role=option],wm-tag-input .dropdown-wrapper div.add-new-btn{cursor:pointer;color:#575195;font-weight:bold;width:100%;border:none}:host .dropdown-wrapper li[role=option][aria-selected=true],:host .dropdown-wrapper li.add-new-btn[aria-selected=true],:host .dropdown-wrapper div[role=option][aria-selected=true],:host .dropdown-wrapper div.add-new-btn[aria-selected=true],wm-tag-input .dropdown-wrapper li[role=option][aria-selected=true],wm-tag-input .dropdown-wrapper li.add-new-btn[aria-selected=true],wm-tag-input .dropdown-wrapper div[role=option][aria-selected=true],wm-tag-input .dropdown-wrapper div.add-new-btn[aria-selected=true]{color:#6b6b6b;font-style:italic;font-weight:normal;cursor:unset}:host .dropdown-wrapper li[role=option]:hover:not([aria-selected=true]),:host .dropdown-wrapper li[role=option].focused,:host .dropdown-wrapper li.add-new-btn:hover:not([aria-selected=true]),:host .dropdown-wrapper li.add-new-btn.focused,:host .dropdown-wrapper div[role=option]:hover:not([aria-selected=true]),:host .dropdown-wrapper div[role=option].focused,:host .dropdown-wrapper div.add-new-btn:hover:not([aria-selected=true]),:host .dropdown-wrapper div.add-new-btn.focused,wm-tag-input .dropdown-wrapper li[role=option]:hover:not([aria-selected=true]),wm-tag-input .dropdown-wrapper li[role=option].focused,wm-tag-input .dropdown-wrapper li.add-new-btn:hover:not([aria-selected=true]),wm-tag-input .dropdown-wrapper li.add-new-btn.focused,wm-tag-input .dropdown-wrapper div[role=option]:hover:not([aria-selected=true]),wm-tag-input .dropdown-wrapper div[role=option].focused,wm-tag-input .dropdown-wrapper div.add-new-btn:hover:not([aria-selected=true]),wm-tag-input .dropdown-wrapper div.add-new-btn.focused{outline:none;background:#f4f4f4}:host .dropdown-wrapper li.help-text,:host .dropdown-wrapper div.help-text,wm-tag-input .dropdown-wrapper li.help-text,wm-tag-input .dropdown-wrapper div.help-text{color:#4a4a4a;height:auto;min-height:2.6875rem;padding-top:0.25rem;padding-bottom:0.25rem;white-space:normal}:host .dropdown-wrapper li:not(:last-child),:host .dropdown-wrapper div:not(:last-child),wm-tag-input .dropdown-wrapper li:not(:last-child),wm-tag-input .dropdown-wrapper div:not(:last-child){border-bottom:2px solid rgba(46, 27, 70, 0.05)}:host .info-text,wm-tag-input .info-text{font-style:italic;margin-top:0.25rem}:host .table-wrapper,wm-tag-input .table-wrapper{min-height:10rem;overflow:auto;margin-top:1.5rem}:host .table-wrapper #table,wm-tag-input .table-wrapper #table{width:100%;border-spacing:0px}:host .table-wrapper #table.fixed-widths,wm-tag-input .table-wrapper #table.fixed-widths{table-layout:fixed}:host .table-wrapper #table .headers,wm-tag-input .table-wrapper #table .headers{height:2.5rem;background-color:#eeedf4}:host .table-wrapper #table .headers th,wm-tag-input .table-wrapper #table .headers th{text-align:left;font-size:0.75rem;font-weight:700;text-transform:uppercase;padding:0 1.5rem}:host .table-wrapper tr:nth-child(even),wm-tag-input .table-wrapper tr:nth-child(even){background-color:#fafafa}:host .table-wrapper tr.selected,wm-tag-input .table-wrapper tr.selected{background-color:rgba(25, 161, 169, 0.2);-webkit-box-shadow:inset 0 0 0 1px #19a1a9;box-shadow:inset 0 0 0 1px #19a1a9;font-weight:500}:host .table-wrapper tr.focused:not(.locked),:host .table-wrapper tr:hover:not(.locked),wm-tag-input .table-wrapper tr.focused:not(.locked),wm-tag-input .table-wrapper tr:hover:not(.locked){background-color:#e9e7ec;-webkit-box-shadow:none;box-shadow:none}:host .table-wrapper tr.locked td,wm-tag-input .table-wrapper tr.locked td{cursor:auto}:host .table-wrapper tr.locked td:first-child .cell-content-wrapper:before,wm-tag-input .table-wrapper tr.locked td:first-child .cell-content-wrapper: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:"\\f33e";margin-right:0.5rem;color:#4a4a4a}:host .table-wrapper td,wm-tag-input .table-wrapper td{height:3.75rem;vertical-align:middle;padding:0 1.5rem;cursor:pointer}:host .table-wrapper td.focused,wm-tag-input .table-wrapper td.focused{-webkit-box-shadow:inset 0 2px 2px 0 rgba(244, 243, 246, 0.2), inset 0 2px 2px 0 rgba(0, 0, 0, 0.1), inset 0 0 4px 3px #61279e;box-shadow:inset 0 2px 2px 0 rgba(244, 243, 246, 0.2), inset 0 2px 2px 0 rgba(0, 0, 0, 0.1), inset 0 0 4px 3px #61279e}:host .table-wrapper td .cell-content-wrapper.trunc,wm-tag-input .table-wrapper td .cell-content-wrapper.trunc{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .table-wrapper td .description,wm-tag-input .table-wrapper td .description{display:none}:host .no-results,wm-tag-input .no-results{padding:1.25rem 1.5rem}:host .sr-only,wm-tag-input .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 #error,wm-tag-input #error{display:block;font-style:italic;color:#c0392b;font-size:0.875rem;margin-top:0.25rem}';const u=class{constructor(s){t(this,s);this.wmTagInputChanged=e(this,"wmTagInputChanged",7);this.uid=this.el.id?this.el.id:o();this.openUp=false;this.tooltipVisible=false;this.debouncedUpdate=n((()=>i(this.el)),30);this.label=undefined;this.labelPosition="top";this.options="";this.selectedTags="";this.info=undefined;this.errorMessage=undefined;this.addNew=true;this.placeholder=undefined;this.requiredField=false;this.characterLimit=50;this.maxTags=undefined;this.tagInputType="dropdown";this.colHeaders=undefined;this.colWidths=undefined;this.colWrap=undefined;this.messageConfig="";this.focusedListItem=undefined;this.focusedTag=null;this.tablePosition={row:0,column:1};this.isExpanded=false;this.tagsList=h(this.selectedTags);this.optionsList=h(this.options);this.charCount=0;this.liveRegionMessage=""}get focusedElement(){return this.el.shadowRoot.activeElement}get listItemEls(){return Array.from(this.dropdownEl.querySelectorAll("li"))}get tagEls(){return this.tagAreaEl?Array.from(this.tagAreaEl.querySelectorAll(".tag")):[]}get nonLockedTagEls(){return this.tagEls.filter((t=>!t.classList.contains("locked")))}get optionEls(){return Array.from(this.dropdownEl.querySelectorAll(".option"))}get wmRowEls(){return Array.from(this.el.querySelectorAll("wm-tag-input-row"))}get localRowEls(){return Array.from(this.el.shadowRoot.querySelectorAll("tr"))}get filteredRows(){return this.wmRowEls.filter((t=>{const e=[t.col1,t.col2,t.col3,t.col4].join("").toLowerCase();return this.inputEl&&this.inputEl.value?e.includes(this.inputEl.value.toLowerCase()):true}))}get nonLockedTagsList(){let t=[];if(this.tagInputType==="table"){this.tagsList.forEach((e=>{const i=this.wmRowEls.filter((t=>e===t.id))[0];if(!i.locked){t.push(e)}}))}else if(this.tagInputType==="dropdown"){t=this.tagsList}return t}get tagLimitReached(){return!!(this.maxTags&&this.tagsList.length>=this.maxTags)}get noResultsMessage(){return l.formatMessage({id:"tagInput.noResults",defaultMessage:"No results match your search.",description:"Message displayed when a user's search returns empty."})}get componentMessages(){const t=l.formatMessage({id:"tagInput.addNewHelpText",defaultMessage:"Press the Enter or Comma key to add a new tag.",description:"Help text appearing in a dropdown. Use imperative"});const e=l.formatMessage({id:"tagInput.selectionHelpText",defaultMessage:"Search and select a tag.",description:"Help text appearing in a dropdown. Use imperative"});const i=l.formatMessage({id:"tagInput.maxTagsReached",defaultMessage:"No more tags can be added because the limit has been reached."});const s=l.formatMessage({id:"tagInput.tagAreaInstructions",defaultMessage:"tag selection. Press Backspace or Delete to remove a tag."});const r=l.formatMessage({id:"tagInput.tagsAdded",defaultMessage:"Tags added",description:"For the user to understand how close they are to the tag limit, followed by x/y count"});const a={addNewHelpText:t,selectionHelpText:e,maxTagsReached:i,tagAreaInstructions:s,tagsAdded:r};const o=d(this.messageConfig);return o?Object.assign(Object.assign({},a),o):a}get inputMinimumWidth(){const t=getComputedStyle(this.inputEl);const e=getComputedStyle(this.tagEls[this.tagEls.length-1]);const i=[t.paddingLeft,t.paddingRight,t.marginLeft,t.marginRight,e.marginRight].reduce(((t,e)=>t+parseInt(e.replace("px",""))),0);const s=Math.max(150,p(this.inputEl,this.placeholder).width+i);return s}generateTagAddedMessage(t){return l.formatMessage({id:"tagInput.tagAdded",defaultMessage:"{tagName} added.",description:"A confirmation for adding a tag."},{tagName:t})}generateTagAlreadyAddedMessage(t){return l.formatMessage({id:"tagInput.tagAlreadyAdded",defaultMessage:"{tagName} has already been added.",description:"An alert for adding a tag that is already present."},{tagName:t})}generateCharacterLimitLabel(t){return l.formatMessage({id:"global.characterLimit",defaultMessage:"{limit, number} characters allowed.",description:"for screen readers"},{limit:t})}componentWillLoad(){if(!this.placeholder){this.placeholder=this.createPlaceholderDefault(this.addNew,!!this.options)}if(!this.label){console.error("wm-tag-input must have a label property")}this.consolidateSelectedTags();this.el.focus=()=>{const t=this.nonLockedTagEls[0];if(t){this.tagAreaEl.focus();this.focusTag(t)}else{this.inputEl.focus()}};const t=new ResizeObserver((()=>this.debouncedUpdate()));t.observe(this.el)}componentDidLoad(){this.tagEls.forEach((t=>t.classList.remove("highlight")))}componentDidRender(){this.positionInput()}consolidateSelectedTags(){this.tagsList.forEach((t=>{if(!this.includesCaseInsensitive(this.optionsList,t)){this.options+=`${this.options.length>0?",":""}${t}`}}));this.optionsList=h(this.options)}createPlaceholderDefault(t,e){const i=l.formatMessage({id:"tagInput.placeholderAddAndSearch",defaultMessage:"Add or search for a tag",description:"Placeholder text. Use imperative"});const s=l.formatMessage({id:"tagInput.placeholderSearch",defaultMessage:"Search and select a tag",description:"Placeholder text. Use imperative"});const r=l.formatMessage({id:"tagInput.placeholderAdd",defaultMessage:"Add a new tag",description:"Placeholder text. Use imperative"});let a="";if(t&&e){a=i}else if(!t&&e){a=s}else if(t){a=r}return a}reflectSelectedTags(t,e){const i=t.length>e.length;let s="";let r=this.tagsList;if(i){s=t.filter((t=>!e.includes(t)))[0]}else{s=e.filter((e=>!t.includes(e)))[0]}if(this.tagInputType==="table"){s=this.wmRowEls.filter((t=>t.id===s))[0];r=this.tagsList.map((t=>this.el.querySelector(`#${t}`)))}this.selectedTags=this.listToCSV(this.tagsList);let a={value:r,tagChanged:s};this.wmTagInputChanged.emit(a)}handleErrorMessageChange(){if(this.errorMessage){this.announce(this.errorMessage)}}handleRowUpdate(){i(this.el)}closeIfNotElOrChild(t){const e=t.target!==this.el&&!this.el.shadowRoot.contains(t.target);if(this.tagInputType==="dropdown"&&e&&this.isExpanded){this.closeDropdown()}}dismissTooltip(){if(this.tooltipVisible){c();this.tooltipVisible=false}}handleInputKeyDown(t){if(/^.$/.test(t.key)&&this.inputEl.value.length>=this.characterLimit){this.announceCharacterLimitWarning(this.inputEl.value.length,this.characterLimit)}t.stopPropagation();switch(t.key){case"Enter":case",":t.preventDefault();this.handleInputEnter();break;case"ArrowDown":t.preventDefault();this.handleInputArrowDown();break;case"ArrowUp":t.preventDefault();this.handleInputArrowUp();break;case"ArrowLeft":t.preventDefault();if(this.tagInputType==="table"&&this.tablePosition.row){this.moveLeftCell()}break;case"ArrowRight":t.preventDefault();if(this.tagInputType==="table"&&this.tablePosition.row){this.moveRightCell()}break;case"Escape":if(this.tagInputType==="dropdown"&&this.isExpanded){this.closeDropdown()}break;case"ArrowLeft":case"Backspace":this.handleInputBackspace();break}}handleInputFocus(){if(this.tagInputType==="dropdown"){this.openDropdown();this.clearListItemFocus()}i(this.el)}handleInputChanged(t){this.charCount=t.length;if(this.tagInputType==="dropdown"){this.clearListItemFocus();if(this.charCount>=this.characterLimit-5){this.announceCharacterLimitWarning(this.charCount,this.characterLimit)}if(!this.isExpanded){this.openDropdown()}}else if(this.tagInputType==="table"){this.clearCellFocus()}this.announceExistingOptions()}handleInputEnter(){if(this.tagInputType==="dropdown"){if(this.focusedListItem){this.handleListItemClick(this.focusedListItem)}else{this.submitInput(this.addNew,this.inputEl.value.trim())}}else if(this.tagInputType==="table"&&this.tablePosition.row>0){this.handleTableRowClick(this.localRowEls[this.tablePosition.row].id)}}submitInput(t,e){const i=e.match(/\S/);if(t&&i){this.addTag(e);this.optionsList=this.addOption(e);this.resetInput()}}handleInputArrowDown(){if(this.tagInputType==="table"){this.moveDownRow()}else if(this.tagInputType==="dropdown"&&this.isExpanded){this.moveDownListItem()}else if(this.tagInputType==="dropdown"){this.openDropdown()}}handleInputArrowUp(){if(this.tagInputType==="table"){this.moveUpRow()}else if(this.tagInputType==="dropdown"&&this.isExpanded){this.moveUpListItem()}else if(this.tagInputType==="dropdown"){this.openDropdown()}}handleInputBackspace(){if(this.inputEl.value===""&&this.tagsList.length>0){window.requestAnimationFrame((()=>{if(this.nonLockedTagsList.length>0){this.tagAreaEl.focus();this.focusTag(this.tagEls[this.tagEls.length-1])}}))}}handleListItemKeyDown(t){const e=t.target;switch(t.key){case"Enter":case" ":t.preventDefault();e.click();break;case"ArrowDown":t.preventDefault();this.moveDownListItem();break;case"ArrowUp":t.preventDefault();this.moveUpListItem();break;case"Escape":if(this.focusedElement!==this.inputEl){this.inputEl.focus()}else if(this.tagInputType==="dropdown"){this.closeDropdown()}break}}handleListItemClick(t){const e=t.dataset.option.trim()||"";if(this.includesCaseInsensitive(this.tagsList,e)){this.announce(this.generateTagAlreadyAddedMessage(e))}else{this.resetInput();this.addTag(e);this.optionsList=this.addOption(e);this.focusedListItem=null}}handleTableRowClick(t){const e=this.el.querySelector(`#${t}`);const i=e.locked;if(!i){if(this.includesCaseInsensitive(this.tagsList,t)){this.removeTag(t)}else if(!this.tagLimitReached){this.addTag(t);this.resetInput()}}}handleTagAreaKeyDown(t){switch(t.key){case"ArrowLeft":case"ArrowUp":t.preventDefault();this.moveLeftTag();break;case"ArrowRight":case"ArrowDown":t.preventDefault();this.moveRightTag();break;case"Backspace":case"Delete":this.handleTagAreaDelete();break}}handleTagAreaDelete(){const t=this.focusedTag&&this.focusedTag.classList.contains("locked");if(this.focusedTag&&this.focusedTag.dataset.tag&&!t){this.removeTag(this.focusedTag.dataset.tag);if(this.nonLockedTagsList.length===0){this.inputEl.focus()}else if(this.focusedTag===this.tagEls[this.tagEls.length-1]){this.focusedTag=this.tagEls[this.tagEls.length-2];this.focusTag(this.focusedTag)}}}handleBlur(t,e){const i=t.relatedTarget!==e&&!this.el.shadowRoot.contains(t.relatedTarget);this.dismissTooltip();this.clearCellFocus();if(i){this.fieldWrapperEl.classList.remove("focused");if(this.tagInputType==="dropdown"){this.closeDropdown()}}}handleCellMouseEnter(t){const e=t.target;const i=e.querySelector(".cell-content-wrapper");const s=i.scrollWidth>i.clientWidth;if(s){w("bottom",e,e.innerText);this.tooltipVisible=true}}handleTagAreaFocus(){if(this.tagInputType==="dropdown"){this.closeDropdown()}const t=this.nonLockedTagEls[0];t&&this.focusTag(t)}handleRemoveButtonClick(t){this.moveLeftTag();this.removeTag(t)}moveDownListItem(){if(this.listItemEls.length>0){const t=this.listItemEls[0];if(!this.focusedListItem){this.focusListItem(t)}else if(this.focusedListItem.nextElementSibling){this.focusListItem(this.focusedListItem.nextElementSibling)}else{this.focusListItem(t)}}}moveUpListItem(){if(this.listItemEls.length>0){const t=this.listItemEls[this.listItemEls.length-1];if(!this.focusedListItem){this.focusListItem(t)}else if(this.focusedListItem.previousElementSibling){this.focusListItem(this.focusedListItem.previousElementSibling)}else{this.clearListItemFocus()}}}moveDownRow(){if(this.filteredRows.length>0){if(this.tablePosition.row===0){this.tablePosition.row=1}else if(this.tablePosition.row===this.filteredRows.length){this.tablePosition.row=1}else{this.tablePosition.row++}const t=this.wmRowEls[this.tablePosition.row-1];if(t.locked){this.moveDownRow()}else{this.focusCell(this.tablePosition)}}}moveUpRow(){if(this.filteredRows.length>0){if(this.tablePosition.row===0){this.tablePosition.row=this.filteredRows.length}else if(this.tablePosition.row===1){this.tablePosition.row=0}else{this.tablePosition.row--}const t=this.wmRowEls[this.tablePosition.row-1];if(t&&t.locked){this.moveUpRow()}else if(t){this.focusCell(this.tablePosition)}else{this.clearCellFocus()}}}moveLeftCell(){if(this.tablePosition.column!=1){this.tablePosition.column--;this.focusCell(this.tablePosition)}}moveRightCell(){const t=h(this.colHeaders).length;if(this.tablePosition.column<t){this.tablePosition.column++;this.focusCell(this.tablePosition)}}moveLeftTag(){const t=this.tagEls[this.tagEls.length-1];if(this.focusedTag&&this.tagEls.includes(this.focusedTag.previousElementSibling)){this.focusedTag=this.focusedTag.previousElementSibling}else{this.focusedTag=t}if(this.focusedTag.classList.contains("locked")&&this.nonLockedTagEls.length>0){this.moveLeftTag()}else{this.focusTag(this.focusedTag)}}moveRightTag(){const t=this.tagEls[0];if(this.focusedTag&&this.tagEls.includes(this.focusedTag.nextElementSibling)){this.focusedTag=this.focusedTag.nextElementSibling}else{this.focusedTag=t}if(this.focusedTag.classList.contains("locked")){this.moveRightTag()}else{this.focusTag(this.focusedTag)}}addOption(t){let e=this.optionsList;const i=this.includesCaseInsensitive(this.optionsList,t);if(!i){e=e.concat(t)}return e}removeOption(t){this.optionsList=this.filterCaseInsensitive(this.optionsList,t)}addTag(t){let e=this.tagsList;const i=this.includesCaseInsensitive(this.tagsList,t);const s=this.optionsList.filter((e=>e.toLowerCase()===t.toLowerCase()))[0];if(!i){let i=t;if(this.tagInputType==="table"){const e=this.el.querySelector(`#${t}`);i=e.col1}this.announce(this.generateTagAddedMessage(i));this.tagsList=e.concat(s||t);if(this.tagLimitReached){this.tagAreaEl.focus()}}}removeTag(t){let e=t;if(this.tagInputType==="table"){const i=this.el.querySelector(`#${t}`);e=i.col1}const i=l.formatMessage({id:"tagInput.tagRemoved",defaultMessage:"{tag} removed"},{tag:e});this.announce(i);this.tagsList=this.filterCaseInsensitive(this.tagsList,t);if(this.tagInputType==="dropdown"){const e=h(this.options);if(this.includesCaseInsensitive(this.optionsList,t)&&!this.includesCaseInsensitive(e,t)){this.removeOption(t)}}}focusListItem(t){this.focusedListItem=t;this.inputEl.setAttribute("aria-activedescendant",this.focusedListItem.id);t.scrollIntoView({block:"nearest"})}focusTag(t){if(t.classList.contains("locked")){this.focusedTag=null;this.tagAreaEl.setAttribute("aria-activedescendant","")}else{this.focusedTag=t;this.tagAreaEl.setAttribute("aria-activedescendant",this.focusedTag.id)}}focusCell(t){this.clearCellFocus(false);if(t.row){const e=this.localRowEls[t.row];const i=e.querySelectorAll("td");const s=i[t.column-1];const r=s.querySelector(".cell-content-wrapper");const a=r.scrollWidth>r.clientWidth;e.classList.add("focused");s.classList.add("focused");s.scrollIntoView({block:"nearest"});this.inputEl.setAttribute("aria-activedescendant",s.id);this.dismissTooltip();if(a){w("bottom",s,s.innerText);this.tooltipVisible=true}}}clearTagFocus(){this.tagAreaEl.setAttribute("aria-activedescendant","");this.focusedTag=null}clearCellFocus(t=true){this.inputEl.setAttribute("aria-activedescendant","");if(t){this.tablePosition={row:0,column:1}}this.localRowEls.forEach((t=>{t.classList.remove("focused");t.querySelectorAll("td").forEach((t=>{t.classList.remove("focused")}))}))}openDropdown(){this.openUp=g(this.el,this.dropdownEl,this.el.clientHeight,-2);this.isExpanded=true}closeDropdown(){this.clearListItemFocus();this.isExpanded=false}clearListItemFocus(){this.focusedListItem=null;this.inputEl.setAttribute("aria-activedescendant","");this.listItemEls.forEach((t=>{t.classList.remove("focused")}))}resetInput(){this.charCount=0;this.inputEl.value=""}announce(t){if(this.liveRegionEl.textContent===t){t+=" "}this.liveRegionMessage=t}announceExistingOptions(){window.requestAnimationFrame((()=>{let t=0;if(this.tagInputType==="dropdown"){t=this.optionEls.length}else if(this.tagInputType==="table"){t=this.filteredRows.length}const e=l.formatMessage({id:"tagInput.existingOptions",defaultMessage:"{num, plural, one {1 existing option.} other {# existing options.}}"},{num:t});this.announce(e)}))}announceCharacterLimitWarning(t,e){const i=l.formatMessage({id:"global.charactersEntered",defaultMessage:"{x, number} of {y, number} characters entered.",description:"for screen readers"},{x:t,y:e});const s=l.formatMessage({id:"global.characterLimitReached",defaultMessage:"No additional characters will be entered.",description:"for screen readers"});this.announce(`${i}${t>=e?" "+s:""}`)}positionInput(){const t=this.tagEls[this.tagEls.length-1];this.inputEl.style.position="static";this.inputEl.style.width="100%";if(t){const e=this.tagAreaEl.getBoundingClientRect().right-t.getBoundingClientRect().right;if(e>=this.inputMinimumWidth){this.inputEl.style.position="absolute";this.inputEl.style.top=t.offsetTop.toString()+"px";this.inputEl.style.width=(this.tagAreaEl.getBoundingClientRect().right-t.getBoundingClientRect().right-8).toString()+"px"}}}listToCSV(t){return t.join(",")}includesCaseInsensitive(t,e){const i=t.map((t=>t.toLowerCase()));return i.includes(e.toLowerCase())}filterCaseInsensitive(t,e){return t.filter((t=>t.toLowerCase()!==e.toLowerCase()))}sortCaseInsensitive(t){return t.sort(((t,e)=>{t=t.toLowerCase();e=e.toLowerCase();return t>e?1:t<e?-1:0}))}renderTags(){let t=[];let e=[];this.tagsList.forEach(((i,r)=>{const a=`tag${r+1}`;let o="";let n=false;if(this.tagInputType==="dropdown"){o=i}else if(this.tagInputType==="table"){const t=this.el.querySelector(`#${i}`);o=t?t.col1:"";n=t?t.locked:false}const h=n?t:e;h.push(s("li",{id:a,class:`tag highlight ${this.focusedTag&&this.focusedTag.id===a?"focused":""} ${n?"locked":""}`,"data-tag":i,role:"option"},o,n?s("div",{class:"icon lock"}):s("button",{class:"icon remove-btn",tabIndex:-1,onClick:()=>this.handleRemoveButtonClick(i)})))}));return[...t,...e]}renderDropdown(){return s("div",{class:`dropdown-wrapper ${this.isExpanded?"open":""} ${this.openUp?"upwards":""}`,ref:t=>this.dropdownEl=t},s("div",{id:"help-text",class:"help-text"},this.renderHelpText()),s("ul",{class:"dropdown",id:"dropdown",role:"listbox","aria-multiselectable":"true","aria-expanded":this.isExpanded?"true":false,"aria-label":this.label,tabindex:-1},this.inputEl&&this.renderAddNewButton(),this.renderListItems(this.optionsList)))}renderListItems(t){t=this.sortCaseInsensitive(t);if(this.inputEl&&this.inputEl.value){t=this.optionsList.filter((t=>t.toLowerCase().includes(this.inputEl.value.toLowerCase())))}return t.map(((t,e)=>{const i=`option${e+1}`;const r=this.focusedListItem&&this.focusedListItem.id===i;const a=this.includesCaseInsensitive(this.tagsList,t);return s("li",{class:`option ${r?"focused":""}`,role:"option",id:i,"data-option":t,"aria-selected":a?"true":"false","aria-disabled":a?"true":"false",onKeyDown:t=>this.handleListItemKeyDown(t),onBlur:t=>this.handleBlur(t,this.el),onClick:t=>this.handleListItemClick(t.target)},t)}))}renderAddNewButton(){const t=this.inputEl.value.match(/\S/);const e=this.includesCaseInsensitive(this.optionsList,this.inputEl.value.trim());if(this.addNew&&t&&!e){const t=`add-new-btn`;const e=this.focusedListItem&&this.focusedListItem.id===t;return s("li",{role:"option",class:`add-new-btn ${e?"focused":""}`,id:t,"data-option":this.inputEl.value,onKeyDown:t=>this.handleListItemKeyDown(t),onBlur:t=>this.handleBlur(t,this.el),onClick:t=>this.handleListItemClick(t.target),tabIndex:e?0:-1},`Add "${this.inputEl.value.trim()}"`)}else return""}renderHelpText(){let t="";if(this.optionsList.length>0){t+=this.componentMessages.selectionHelpText}if(this.addNew){t+=" "+this.componentMessages.addNewHelpText}return t}renderTagCounter(){if(this.maxTags){return s("div",{class:"lower-row"},s("div",{id:"max-tags"},`${this.componentMessages.tagsAdded}: ${this.tagsList.length}/${this.maxTags}`,this.tagLimitReached&&` - ${this.componentMessages.maxTagsReached}`))}}renderTable(){return s("div",{class:"table-wrapper",onScroll:()=>this.dismissTooltip()},s("table",{id:"table",role:"grid",class:`${this.colWidths?"fixed-widths":""}`,"aria-label":this.label,"aria-multiselectable":"true"},this.renderTableHeaders(),this.filteredRows.length?this.renderTableRows():s("div",{class:"no-results"},this.noResultsMessage)))}renderTableHeaders(){return s("tr",{class:"headers",role:"row"},h(this.colHeaders).map(((t,e)=>{let i="wrap";if(this.colWrap&&h(this.colWrap)[e]){i=h(this.colWrap)[e]}return s("th",{class:`header-cell ${i}`,role:"columnheader",width:this.colWidths?h(this.colWidths)[e]:""},t)})))}renderTableRows(){return this.filteredRows.map((t=>{const e=this.includesCaseInsensitive(this.tagsList,t.id);return s("tr",{id:t.id,class:`${t.locked?"locked":""} ${e?"selected":""}`,role:"row",onClick:()=>this.handleTableRowClick(t.id)},this.renderTableCells(t))}))}renderTableCells(t){const e=[t.col1,t.col2,t.col3,t.col4].filter((t=>!!t));const i=this.includesCaseInsensitive(this.tagsList,t.id);return e.map(((e,r)=>{const a=`${t.id}-col${r+1}`;let o="wrap";if(this.colWrap&&h(this.colWrap)[r]){o=h(this.colWrap)[r]}return s("td",{id:a,role:"gridcell","aria-describedby":`${a}-description`,"aria-selected":i.toString(),onMouseEnter:t=>this.handleCellMouseEnter(t),onMouseLeave:()=>this.dismissTooltip()},s("div",{class:`cell-content-wrapper ${o}`},e),s("div",{class:"description",id:`${a}-description`},t.locked?"locked":""))}))}render(){return s(r,{id:this.uid},s("div",{class:`wrapper label-${this.labelPosition} ${this.errorMessage?"invalid":""}`},s("div",{class:"label-wrapper"},s("label",{class:"label",htmlFor:`input${this.uid}`},this.label,this.requiredField&&s("span",{class:"required","aria-hidden":"true"},"*"))),s("div",{class:`field-wrapper ${this.focusedElement?"focused":""} ${this.errorMessage?"invalid":""}`,ref:t=>this.fieldWrapperEl=t},s("div",{class:"upper-row"},s("div",{class:"tags-and-input-wrapper"},this.tagsList.length>0&&s("ul",{ref:t=>this.tagAreaEl=t,class:"tag-area",role:"listbox","aria-activedescendant":"","aria-orientation":"horizontal","aria-label":`${this.label} ${this.tagsList.length>0?this.componentMessages.tagAreaInstructions:""}`,tabindex:this.nonLockedTagsList.length>0?0:-1,"aria-describedby":`info max-tags`,onFocus:()=>this.handleTagAreaFocus(),onBlur:t=>{this.clearTagFocus();this.handleBlur(t,this.el)},onKeyDown:t=>this.handleTagAreaKeyDown(t)},this.renderTags()),s("input",{id:`input${this.uid}`,class:this.tagLimitReached?"hidden":"",role:"combobox",ref:t=>this.inputEl=t,autocomplete:"off","aria-required":this.requiredField?"true":null,"aria-controls":this.tagInputType,"aria-describedby":`help-text${this.errorMessage?" error ":""}`,"aria-label":`${this.label} ${this.tagInputType==="dropdown"?this.generateCharacterLimitLabel(this.characterLimit):""}`,"aria-expanded":this.tagInputType==="dropdown"?this.isExpanded.toString():null,placeholder:this.placeholder,maxLength:this.tagInputType==="dropdown"?this.characterLimit:undefined,onInput:()=>this.handleInputChanged(this.inputEl.value),onBlur:t=>{this.handleBlur(t,this.el)},onFocus:()=>this.handleInputFocus(),onKeyDown:t=>this.handleInputKeyDown(t)})),this.tagInputType==="dropdown"&&s("div",{class:"character-count"},this.charCount,"/",this.characterLimit)),this.renderTagCounter(),this.tagInputType==="dropdown"&&this.renderDropdown()),this.info&&s("div",{id:"info",class:"info-text"},this.info),this.errorMessage&&s("div",{id:"error"},this.errorMessage),s("div",{class:"sr-only","aria-live":"assertive",ref:t=>this.liveRegionEl=t,"aria-atomic":"true"},this.liveRegionMessage),this.tagInputType==="table"&&this.renderTable()))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{tagsList:["reflectSelectedTags"],errorMessage:["handleErrorMessageChange"]}}};u.style=m;export{u as wm_tag_input};
-//# sourceMappingURL=p-f3130941.entry.js.map