@nylas/web-elements 2.5.4 → 2.5.6

package/dist/nylas-web-elements/{p-e63c997e.entry.js → p-4c51d165.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as o,h as s,H as a,a as r}from"./p-0EQQA0nE.js";import{a as n}from"./p-BW6igRcf.js";const l=':host{display:block;width:inherit;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff}.dropdown{display:inline-block;width:100%;position:relative}.dropdown .dropdown-label{display:flex;align-items:center;gap:0.25rem;color:var(--nylas-base-800)}.dropdown .dropdown-label p{margin:0}.dropdown .dropdown-label span.required{color:var(--nylas-error);padding:0 0.25rem}.dropdown span.error{color:var(--nylas-error);font-size:14px}.dropbtn{width:inherit;height:48px;color:var(--nylas-base-900);padding:0.5rem;font-size:16px;cursor:pointer;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:var(--nylas-base-0);border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.dropbtn.focus{background:var(--nylas-base-0)}.dropbtn.error{border:1px solid var(--nylas-error)}.dropbtn:hover,.dropbtn:active{border:1px solid var(--nylas-primary)}.dropbtn:active{outline:2px solid var(--nylas-primary)}.dropbtn:disabled{cursor:not-allowed;background:var(--nylas-base-100)}.dropbtn span.open{transform:rotate(90deg)}.dropbtn span.closed{transform:rotate(270deg)}.dropdown-content{display:block;margin-top:0.5rem;background-color:var(--nylas-base-0);width:100%;max-height:336px;overflow:auto;z-index:1;border-radius:4px;position:absolute;top:72px;box-shadow:0px 4px 6px -2px rgba(0, 0, 0, 0.0509803922);box-shadow:0px 10px 15px -3px rgba(0, 0, 0, 0.1019607843)}.dropdown-content ul{padding:0;list-style-type:none;color:var(--nylas-base-900);max-height:336px}.dropdown-content ul li{padding:16px, 12px, 16px, 12px;color:var(--nylas-base-900);padding:12px 16px;text-decoration:none;display:block;font-family:inherit;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px;text-align:left;cursor:pointer}.dropdown-content ul li:hover,.dropdown-content ul li:focus{background-color:var(--nylas-base-100)}.dropdown-content ul li label{display:flex;align-items:center;gap:0.5rem;cursor:pointer}.dropdown-content ul li label span{word-break:break-word;overflow-wrap:break-word}.dropdown-content ul li label input{margin:0;flex-shrink:0}.dropdown-content ul li.disabled{cursor:not-allowed;opacity:0.5}.dropdown-content ul li.disabled label{cursor:not-allowed}.dropdown-content ul li.disabled label input{cursor:not-allowed}.selected-options{display:flex;flex-wrap:wrap;gap:0.5rem;padding:0.5rem 0;margin-top:0.25rem}.selected-options .selected-option{display:flex;align-items:center;gap:0.5rem;padding:4px 8px;border-radius:var(--nylas-border-radius-2x);background:var(--nylas-base-100);color:var(--nylas-base-800);font-size:16px;font-weight:500;line-height:1.5rem;letter-spacing:0.5px;word-break:break-word;overflow-wrap:break-word}.selected-options .selected-option button{background:transparent;border:none;cursor:pointer;padding:0}.selected-options .selected-option button:hover{color:var(--nylas-primary)}.selected-options .selected-option button:disabled{cursor:not-allowed;background:var(--nylas-base-100)}';const t=class{constructor(s){e(this,s);this.selectedOptionsChanged=o(this,"selectedOptionsChanged",7);this.options=[];this.error="";this.required=false;this.readOnly=false;this.multipleOptionsSelectedLabel="Multiple options selected";this.selectAtLeastOneOptionLabel="Please select at least one option";this.errorMessage="Please select at least one option.";this.availableOptions=this.options;this.isOpen=false;this.ariaActivedescendant="";this.shouldFocusFirstOption=false}areOptionsEqual(e,o){if(e.length!==o.length)return false;const s=[...e].sort(((e,o)=>e.label.localeCompare(o.label)||e.value.localeCompare(o.value)));const a=[...o].sort(((e,o)=>e.label.localeCompare(o.label)||e.value.localeCompare(o.value)));return s.every(((e,o)=>{const s=a[o];return e.label===s.label&&e.value===s.value}))}optionsChangedHandler(e){if(!this.areOptionsEqual(e,this.availableOptions)){this.availableOptions=e}}themeConfigChangedHandler(e,o){this.applyThemeConfig(e)}applyThemeConfig(e){if(e){for(const[o,s]of Object.entries(e)){this.el.style.setProperty(`${o}`,s)}}}connectedCallback(){queueMicrotask((()=>{if(this.themeConfig){this.applyThemeConfig(this.themeConfig);this.el.setAttribute("data-themed","")}}))}componentWillLoad(){n("multi-select-dropdown","componentWillLoad")}componentDidLoad(){n("multi-select-dropdown","componentDidLoad");if(this.options){this.availableOptions=this.options}}componentDidRender(){n("multi-select-dropdown","componentDidRender");if(this.isOpen&&this.shouldFocusFirstOption){this.ariaActivedescendant=this.availableOptions[0]?.value;this.focusOption(0);this.shouldFocusFirstOption=false}}handleOutsideClick(e){const o=e.composedPath();const s=o.includes(this.el);if(!s&&this.isOpen){this.isOpen=false}}handleBookingFormSubmitted(e){const o=this.availableOptions.filter((e=>e.selected)).map((e=>e.value));if(this.required&&(!o||o.length<=0)){this.error=this.errorMessage||this.selectAtLeastOneOptionLabel}if(this.error){e.preventDefault()}}selectOption(e){this.availableOptions=this.availableOptions.map((o=>{if(o.value===e.value){o.selected=e.selected?false:true;if(o.selected){this.error=""}}return o}));const o=this.availableOptions.filter((e=>e.selected)).map((e=>e.value));this.selectedOptionsChanged.emit({value:o,name:this.name})}toggleDropdown(){this.isOpen=!this.isOpen;if(this.isOpen){this.shouldFocusFirstOption=true}else{this.ariaActivedescendant=""}}async openDropdown(){this.isOpen=true;this.shouldFocusFirstOption=true}async closeDropdown(){this.isOpen=false;this.ariaActivedescendant=""}handleSelectButtonKeyDown(e){switch(e.key){case"ArrowDown":case"Enter":e.preventDefault();if(!this.isOpen){this.toggleDropdown()}break;case"Escape":this.isOpen=false;break}}handleListboxKeydown(e){const o=this.availableOptions;const s=o.findIndex((e=>e.value===this.ariaActivedescendant));switch(e.key){case"ArrowDown":case"Tab":{if(!e.shiftKey){e.preventDefault();const a=s+1<o.length?s+1:0;this.ariaActivedescendant=o[a].value;this.focusOption(a)}else{e.preventDefault();const a=s-1>=0?s-1:o.length-1;this.ariaActivedescendant=o[a].value;this.focusOption(a)}break}case"ArrowUp":{e.preventDefault();const a=s-1>=0?s-1:o.length-1;this.ariaActivedescendant=o[a].value;this.focusOption(a);break}case"Enter":{e.preventDefault();if(this.ariaActivedescendant){this.selectOption(o[s])}break}case"Escape":{this.isOpen=false;break}}}focusOption(e){const o=this.availableOptions[e];if(!o)return;const s=o.value;const a=this.el.shadowRoot?.getElementById(s);if(a){a.focus();a.scrollIntoView({behavior:"smooth",block:"nearest"})}}getSelectedOptions(){return this.availableOptions.filter((e=>e.selected))}renderOption(e){return s("li",{key:e.value,id:e.value,role:"option",tabindex:"0","aria-selected":e.selected?"true":"false",onClick:o=>{o.stopImmediatePropagation();if(!e?.disabled){this.selectOption(e)}},class:{selected:!!e.selected,disabled:!!e.disabled}},s("label",{htmlFor:e.value},s("input",{"aria-hidden":"true",id:e.value,type:"checkbox",checked:e.selected,disabled:!!e?.disabled}),s("span",null,e.label)))}render(){return s(a,{key:"377989dab511f67cd9d0ebc7d5a18767fe33371d"},s("div",{key:"b48b1bac54a6db475c56bb7dd82f4f7e32eae083",class:"dropdown",part:"msd_dropdown"},s("label",{key:"e41d7acfda9c43c46c318051c9c8f758fccfb697",class:"dropdown-label",part:"msd_dropdown-label"},s("p",{key:"2114c39648780206139c0981ef1f4fd3b32d1ef9"},s("span",{key:"ab8f7928a7ff5218c2cf080d1dcf901ac3140f77",class:"label"},this.label),this.required&&s("span",{key:"4e9e47ef9a8d27e7d8f94747abf9287bbeb14e04",class:"required"},"*")),s("slot",{key:"b9a5a0615e984b815aef31d3bc9d35e1424328aa",name:"label-icon","aria-hidden":"true"})),s("button",{key:"06c9e68cad859f3c355982c5f52ddd35bf25fd40",name:this.name,part:`msd_dropdown-button ${this.error?"msd_dropdown-button--error":""}`,class:{dropbtn:true,open:this.isOpen,error:!!this.error},onClick:()=>this.toggleDropdown(),disabled:this.readOnly,title:this.readOnly?"read-only field":undefined,"aria-haspopup":"listbox","aria-expanded":this.isOpen?"true":"false","aria-label":this.name,onKeyDown:e=>this.handleSelectButtonKeyDown(e)},s("slot",{key:"a72aecf06d86fd375e25300c1649113e3a09234a",name:"select-icon","aria-hidden":"true"}),s("span",{key:"247ae4b99460f6bba4481a27f35b4a161d65586b",class:"selected-option",part:"msd_dropdown-button-selected-label"},this.getSelectedOptions().length>1?this.multipleOptionsSelectedLabel:this.availableOptions.filter((e=>e.selected))[0]?.label??this.selectAtLeastOneOptionLabel??this.availableOptions[0]?.label),s("span",{key:"ebcc202059542c797f12a64912b98b51bba55578",class:this.isOpen?"open":"closed","aria-hidden":"true"},s("chevron-icon",{key:"c9315cd2929d1ce08f7417f2c5a814f980758d8f",width:"16",height:"16"}))),this.error?s("span",{class:"error",part:"msd_dropdown_error"},this.error):null,s("div",{key:"346e0ef8a75edb234287dc81737c216c8f12058d",class:"selected-options"},this.getSelectedOptions().map((e=>s("span",{class:"selected-option"},e.label,s("button",{disabled:this.readOnly||!!e?.disabled,key:e.label,onClick:()=>this.selectOption(e)},s("close-icon",null)))))),this.isOpen?s("div",{class:"dropdown-content",part:"msd_dropdown-content"},s("ul",{tabindex:"-1",role:"listbox","aria-label":this.name,"aria-multiselectable":true,"aria-activedescendant":this.ariaActivedescendant,onKeyDown:e=>this.handleListboxKeydown(e)},this.availableOptions.map((e=>this.renderOption(e))))):null))}get el(){return r(this)}static get watchers(){return{options:["optionsChangedHandler"],themeConfig:["themeConfigChangedHandler"]}}};t.style=l;export{t as multi_select_dropdown};
-//# sourceMappingURL=p-e63c997e.entry.js.map
+import{r as e,c as o,h as s,H as a,a as r}from"./p-0EQQA0nE.js";import{a as n}from"./p-DDKV6-nQ.js";const l=':host{display:block;width:inherit;--nylas-primary:#2563eb;--nylas-error:#cc4841;--nylas-error-50:#ffeae8;--nylas-error-100:#ffc5bf;--nylas-error-200:#fecaca;--nylas-error-pressed:#992222;--nylas-wraning:#f06c00;--nylas-success:#16a392;--nylas-info:#2b8fc2;--nylas-base-0:#ffffff;--nylas-base-25:#fcfcfd;--nylas-base-50:#f8f9fc;--nylas-base-100:#eaecf5;--nylas-base-200:#d5d9eb;--nylas-base-300:#b3b8d8;--nylas-base-400:#717bbc;--nylas-base-500:#4e5ba6;--nylas-base-600:#3e4784;--nylas-base-700:#263f72;--nylas-base-800:#293056;--nylas-base-900:#101323;--nylas-base-950:#0e101b;--nylas-color-blue-100:#e0e6f9;--nylas-border-radius:0.25rem;--nylas-border-radius-2x:0.5rem;--nylas-border-radius-3x:0.75rem;--nylas-font-family:"Inter", sans-serif;--nylas-color-black:#000000;--nylas-color-grey-900:#2c2c2c;--nylas-color-grey-800:#4b4b4b;--nylas-color-grey-700:#6e6e6e;--nylas-color-grey-600:#8e8e8e;--nylas-color-grey-500:#b3b3b3;--nylas-color-grey-400:#cacaca;--nylas-color-grey-300:#e1e1e1;--nylas-color-grey-200:#eaeaea;--nylas-color-grey-100:#f5f5f5;--nylas-color-grey-50:#fbfcfe;--nylas-color-white:#ffffff;--nylas-color-red-900:#992222;--nylas-color-red-700:#cc4841;--nylas-color-red-500:#ff786a;--nylas-color-red-300:#ffa79e;--nylas-color-red-100:#ffc5bf;--nylas-color-red-50:#ffeae8;--nylas-color-blue-900:#213571;--nylas-color-blue-700:#314fa9;--nylas-color-blue-500:#4169e1;--nylas-color-blue-300:#bdccf9;--nylas-color-blue-100:#e0e6f9;--nylas-color-blue-50:#f6f8fd;--nylas-color-yellow-900:#7c6506;--nylas-color-yellow-700:#c29f09;--nylas-color-yellow-500:#f7c90b;--nylas-color-yellow-300:#f9de70;--nylas-color-yellow-100:#fceba9;--nylas-color-yellow-50:#fdf4ce;--nylas-color-green-900:#0e6b60;--nylas-color-green-700:#16a392;--nylas-color-green-500:#17c3b2;--nylas-color-green-300:#74dbd1;--nylas-color-green-100:#a2e7e0;--nylas-color-green-50:#d1f3f0;--nylas-color-purple-900:#643554;--nylas-color-purple-700:#954f7d;--nylas-color-purple-500:#c769a7;--nylas-color-purple-300:#dda5ca;--nylas-color-purple-100:#e0bdd6;--nylas-color-purple-50:#e9dde5;--nylas-color-sky-900:#20698f;--nylas-color-sky-700:#2b8fc2;--nylas-color-sky-500:#6dceff;--nylas-color-sky-300:#8fdaff;--nylas-color-sky-100:#b8e7ff;--nylas-color-sky-50:#d9f2ff}.dropdown{display:inline-block;width:100%;position:relative}.dropdown .dropdown-label{display:flex;align-items:center;gap:0.25rem;color:var(--nylas-base-800)}.dropdown .dropdown-label p{margin:0}.dropdown .dropdown-label span.required{color:var(--nylas-error);padding:0 0.25rem}.dropdown span.error{color:var(--nylas-error);font-size:14px}.dropbtn{width:inherit;height:48px;color:var(--nylas-base-900);padding:0.5rem;font-size:16px;cursor:pointer;display:flex;gap:0.5rem;justify-content:space-between;align-items:center;background:var(--nylas-base-0);border:1px solid var(--nylas-base-200);border-radius:var(--nylas-border-radius-2x)}.dropbtn.focus{background:var(--nylas-base-0)}.dropbtn.error{border:1px solid var(--nylas-error)}.dropbtn:hover,.dropbtn:active{border:1px solid var(--nylas-primary)}.dropbtn:active{outline:2px solid var(--nylas-primary)}.dropbtn:disabled{cursor:not-allowed;background:var(--nylas-base-100)}.dropbtn span.open{transform:rotate(90deg)}.dropbtn span.closed{transform:rotate(270deg)}.dropdown-content{display:block;margin-top:0.5rem;background-color:var(--nylas-base-0);width:100%;max-height:336px;overflow:auto;z-index:1;border-radius:4px;position:absolute;top:72px;box-shadow:0px 4px 6px -2px rgba(0, 0, 0, 0.0509803922);box-shadow:0px 10px 15px -3px rgba(0, 0, 0, 0.1019607843)}.dropdown-content ul{padding:0;list-style-type:none;color:var(--nylas-base-900);max-height:336px}.dropdown-content ul li{padding:16px, 12px, 16px, 12px;color:var(--nylas-base-900);padding:12px 16px;text-decoration:none;display:block;font-family:inherit;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0px;text-align:left;cursor:pointer}.dropdown-content ul li:hover,.dropdown-content ul li:focus{background-color:var(--nylas-base-100)}.dropdown-content ul li label{display:flex;align-items:center;gap:0.5rem;cursor:pointer}.dropdown-content ul li label span{word-break:break-word;overflow-wrap:break-word}.dropdown-content ul li label input{margin:0;flex-shrink:0}.dropdown-content ul li.disabled{cursor:not-allowed;opacity:0.5}.dropdown-content ul li.disabled label{cursor:not-allowed}.dropdown-content ul li.disabled label input{cursor:not-allowed}.selected-options{display:flex;flex-wrap:wrap;gap:0.5rem;padding:0.5rem 0;margin-top:0.25rem}.selected-options .selected-option{display:flex;align-items:center;gap:0.5rem;padding:4px 8px;border-radius:var(--nylas-border-radius-2x);background:var(--nylas-base-100);color:var(--nylas-base-800);font-size:16px;font-weight:500;line-height:1.5rem;letter-spacing:0.5px;word-break:break-word;overflow-wrap:break-word}.selected-options .selected-option button{background:transparent;border:none;cursor:pointer;padding:0}.selected-options .selected-option button:hover{color:var(--nylas-primary)}.selected-options .selected-option button:disabled{cursor:not-allowed;background:var(--nylas-base-100)}';const t=class{constructor(s){e(this,s);this.selectedOptionsChanged=o(this,"selectedOptionsChanged",7);this.options=[];this.error="";this.required=false;this.readOnly=false;this.multipleOptionsSelectedLabel="Multiple options selected";this.selectAtLeastOneOptionLabel="Please select at least one option";this.errorMessage="Please select at least one option.";this.availableOptions=this.options;this.isOpen=false;this.ariaActivedescendant="";this.shouldFocusFirstOption=false}areOptionsEqual(e,o){if(e.length!==o.length)return false;const s=[...e].sort(((e,o)=>e.label.localeCompare(o.label)||e.value.localeCompare(o.value)));const a=[...o].sort(((e,o)=>e.label.localeCompare(o.label)||e.value.localeCompare(o.value)));return s.every(((e,o)=>{const s=a[o];return e.label===s.label&&e.value===s.value}))}optionsChangedHandler(e){if(!this.areOptionsEqual(e,this.availableOptions)){this.availableOptions=e}}themeConfigChangedHandler(e,o){this.applyThemeConfig(e)}applyThemeConfig(e){if(e){for(const[o,s]of Object.entries(e)){this.el.style.setProperty(`${o}`,s)}}}connectedCallback(){queueMicrotask((()=>{if(this.themeConfig){this.applyThemeConfig(this.themeConfig);this.el.setAttribute("data-themed","")}}))}componentWillLoad(){n("multi-select-dropdown","componentWillLoad")}componentDidLoad(){n("multi-select-dropdown","componentDidLoad");if(this.options){this.availableOptions=this.options}}componentDidRender(){n("multi-select-dropdown","componentDidRender");if(this.isOpen&&this.shouldFocusFirstOption){this.ariaActivedescendant=this.availableOptions[0]?.value;this.focusOption(0);this.shouldFocusFirstOption=false}}handleOutsideClick(e){const o=e.composedPath();const s=o.includes(this.el);if(!s&&this.isOpen){this.isOpen=false}}handleBookingFormSubmitted(e){const o=this.availableOptions.filter((e=>e.selected)).map((e=>e.value));if(this.required&&(!o||o.length<=0)){this.error=this.errorMessage||this.selectAtLeastOneOptionLabel}if(this.error){e.preventDefault()}}selectOption(e){this.availableOptions=this.availableOptions.map((o=>{if(o.value===e.value){o.selected=e.selected?false:true;if(o.selected){this.error=""}}return o}));const o=this.availableOptions.filter((e=>e.selected)).map((e=>e.value));this.selectedOptionsChanged.emit({value:o,name:this.name})}toggleDropdown(){this.isOpen=!this.isOpen;if(this.isOpen){this.shouldFocusFirstOption=true}else{this.ariaActivedescendant=""}}async openDropdown(){this.isOpen=true;this.shouldFocusFirstOption=true}async closeDropdown(){this.isOpen=false;this.ariaActivedescendant=""}handleSelectButtonKeyDown(e){switch(e.key){case"ArrowDown":case"Enter":e.preventDefault();if(!this.isOpen){this.toggleDropdown()}break;case"Escape":this.isOpen=false;break}}handleListboxKeydown(e){const o=this.availableOptions;const s=o.findIndex((e=>e.value===this.ariaActivedescendant));switch(e.key){case"ArrowDown":case"Tab":{if(!e.shiftKey){e.preventDefault();const a=s+1<o.length?s+1:0;this.ariaActivedescendant=o[a].value;this.focusOption(a)}else{e.preventDefault();const a=s-1>=0?s-1:o.length-1;this.ariaActivedescendant=o[a].value;this.focusOption(a)}break}case"ArrowUp":{e.preventDefault();const a=s-1>=0?s-1:o.length-1;this.ariaActivedescendant=o[a].value;this.focusOption(a);break}case"Enter":{e.preventDefault();if(this.ariaActivedescendant){this.selectOption(o[s])}break}case"Escape":{this.isOpen=false;break}}}focusOption(e){const o=this.availableOptions[e];if(!o)return;const s=o.value;const a=this.el.shadowRoot?.getElementById(s);if(a){a.focus();a.scrollIntoView({behavior:"smooth",block:"nearest"})}}getSelectedOptions(){return this.availableOptions.filter((e=>e.selected))}renderOption(e){return s("li",{key:e.value,id:e.value,role:"option",tabindex:"0","aria-selected":e.selected?"true":"false",onClick:o=>{o.stopImmediatePropagation();if(!e?.disabled){this.selectOption(e)}},class:{selected:!!e.selected,disabled:!!e.disabled}},s("label",{htmlFor:e.value},s("input",{"aria-hidden":"true",id:e.value,type:"checkbox",checked:e.selected,disabled:!!e?.disabled}),s("span",null,e.label)))}render(){return s(a,{key:"377989dab511f67cd9d0ebc7d5a18767fe33371d"},s("div",{key:"b48b1bac54a6db475c56bb7dd82f4f7e32eae083",class:"dropdown",part:"msd_dropdown"},s("label",{key:"e41d7acfda9c43c46c318051c9c8f758fccfb697",class:"dropdown-label",part:"msd_dropdown-label"},s("p",{key:"2114c39648780206139c0981ef1f4fd3b32d1ef9"},s("span",{key:"ab8f7928a7ff5218c2cf080d1dcf901ac3140f77",class:"label"},this.label),this.required&&s("span",{key:"4e9e47ef9a8d27e7d8f94747abf9287bbeb14e04",class:"required"},"*")),s("slot",{key:"b9a5a0615e984b815aef31d3bc9d35e1424328aa",name:"label-icon","aria-hidden":"true"})),s("button",{key:"06c9e68cad859f3c355982c5f52ddd35bf25fd40",name:this.name,part:`msd_dropdown-button ${this.error?"msd_dropdown-button--error":""}`,class:{dropbtn:true,open:this.isOpen,error:!!this.error},onClick:()=>this.toggleDropdown(),disabled:this.readOnly,title:this.readOnly?"read-only field":undefined,"aria-haspopup":"listbox","aria-expanded":this.isOpen?"true":"false","aria-label":this.name,onKeyDown:e=>this.handleSelectButtonKeyDown(e)},s("slot",{key:"a72aecf06d86fd375e25300c1649113e3a09234a",name:"select-icon","aria-hidden":"true"}),s("span",{key:"247ae4b99460f6bba4481a27f35b4a161d65586b",class:"selected-option",part:"msd_dropdown-button-selected-label"},this.getSelectedOptions().length>1?this.multipleOptionsSelectedLabel:this.availableOptions.filter((e=>e.selected))[0]?.label??this.selectAtLeastOneOptionLabel??this.availableOptions[0]?.label),s("span",{key:"ebcc202059542c797f12a64912b98b51bba55578",class:this.isOpen?"open":"closed","aria-hidden":"true"},s("chevron-icon",{key:"c9315cd2929d1ce08f7417f2c5a814f980758d8f",width:"16",height:"16"}))),this.error?s("span",{class:"error",part:"msd_dropdown_error"},this.error):null,s("div",{key:"346e0ef8a75edb234287dc81737c216c8f12058d",class:"selected-options"},this.getSelectedOptions().map((e=>s("span",{class:"selected-option"},e.label,s("button",{disabled:this.readOnly||!!e?.disabled,key:e.label,onClick:()=>this.selectOption(e)},s("close-icon",null)))))),this.isOpen?s("div",{class:"dropdown-content",part:"msd_dropdown-content"},s("ul",{tabindex:"-1",role:"listbox","aria-label":this.name,"aria-multiselectable":true,"aria-activedescendant":this.ariaActivedescendant,onKeyDown:e=>this.handleListboxKeydown(e)},this.availableOptions.map((e=>this.renderOption(e))))):null))}get el(){return r(this)}static get watchers(){return{options:["optionsChangedHandler"],themeConfig:["themeConfigChangedHandler"]}}};t.style=l;export{t as multi_select_dropdown};
+//# sourceMappingURL=p-4c51d165.entry.js.map