npm - q2-tecton-elements - Versions diffs - 1.47.0 → 1.48.0 - Mend

q2-tecton-elements 1.47.0 → 1.48.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (164) hide show

package/dist/q2-tecton-elements/{p-a3d58a50.entry.js → p-56dd051a.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as s,H as i,g as n}from"./p-a5f18e27.js";import{n as o,l as h,o as a,w as c,q as r,i as l}from"./p-84190698.js";const d="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{position:relative;width:100%;display:block;line-height:var(--tct-option-list-line-height, var(--t-option-list-line-height, var(--app-line-height, 1.428571429em)))}.content{text-align:start}:host([is-sizeable]) .content{display:block;height:auto}";const f=d;const p=class{constructor(s){t(this,s);this.change=e(this,"change",7);this.popoverState=e(this,"popoverState",7);this.ready=e(this,"ready",3);this.scheduledAfterRender=[];this.keyStore={queue:[],lastPressedAt:new Date};this.searchAndFocus=(t,e)=>{const s=()=>{this.pivotIndex=this.pivotIndex===undefined?0:(this.activeIndex||0)+1;const t=this.allOptions.map(((t,e)=>({element:t,index:e})));return[...t.slice(this.pivotIndex),...t.slice(0,this.pivotIndex)]};const i=()=>{const e=new Date;if(e.getTime()-this.keyStore.lastPressedAt.getTime()>1e3){this.keyStore.queue.length=0}if(this.keyStore.queue.length!==1||this.keyStore.queue[0]!==t){this.keyStore.queue.push(t)}this.keyStore.lastPressedAt=e};const n=t=>{const e=this.keyStore.queue.join("");return t.find((t=>!t.element.disabled&&t.element.display&&(t.element.display.match(new RegExp(`^${e}`,"i"))||t.element.display.replace(/\s/g,"").match(new RegExp(`^${e}`,"i")))))};const o=({index:t})=>{if(this.multiple){this.openDropdownWithActiveElement(t)}else{this.activeIndex=t;if(e){this.selectOption(this.allOptions[t]);this.popoverState.emit({open:false,action:"select"})}else this.setActiveElement(t)}};i();const h=n(s());if(h){o(h)}};this.externalKeydownHandler=t=>{t.stopPropagation();const{activeIndex:e,customSearch:s,allOptions:i}=this;const{key:n}=t;let h;switch(n){case" ":if(this.searchString){if(s)break;this.searchOptions(n,true);break}else if(this.type==="menu"){this.activeIndex=0;this.openDropdownWithActiveElement(0)}else{this.setDefaultActiveElement();o((()=>this.popoverState.emit({open:true,action:"open"})))}break;case"Enter":if(this.type==="menu"){this.activeIndex=0;this.openDropdownWithActiveElement(0)}else{this.setDefaultActiveElement();o((()=>this.popoverState.emit({open:true,action:"open"})))}break;case"ArrowUp":t.preventDefault();this.activeIndex=0;h=!!this.selectedOptions.length?this.getDefaultActiveIndex():this.getNextVisibleIndex(-1);if(h===-1)break;this.openDropdownWithActiveElement(h);break;case"ArrowDown":t.preventDefault();this.activeIndex=0;h=!!this.selectedOptions.length?this.getDefaultActiveIndex():this.getNextVisibleIndex(0);if(h===-1)break;this.openDropdownWithActiveElement(h);break;case"Home":t.preventDefault();this.openDropdownWithActiveElement(0);break;case"End":t.preventDefault();this.openDropdownWithActiveElement(i.length-1);break;case"PageUp":t.preventDefault();this.openDropdownWithActiveElement(Math.max((e||0)-10,0));break;case"PageDown":t.preventDefault();this.openDropdownWithActiveElement(Math.min((e||0)+10,i.length-1));break;case"Tab":this.popoverState.emit({open:false,action:"close"});break;case"Esc":case"Escape":if(this.noSelect)this.setActiveElement(null);this.popoverState.emit({open:false,action:"close"});break;default:if(s)break;if(!n.match(/^[\w]$/))break;this.searchOptions(n,true);break}};this.internalKeydownHandler=t=>{t.stopPropagation();const{activeIndex:e,customSearch:s,allOptions:i,multiple:n}=this;const{key:o,shiftKey:h}=t;let a;switch(o){case" ":if(this.searchString&&!this.multiple){if(s)break;this.searchOptions(o,false);break}t.preventDefault();a=i.find((t=>t.active));if(!a||a.disabled)break;this.selectOption(a);if(n)break;this.popoverState.emit({open:false,action:"select"});break;case"Enter":t.preventDefault();a=i.find((t=>t.active));if(!a||a.disabled)break;this.selectOption(a);if(n)break;this.popoverState.emit({open:false,action:"select"});break;case"ArrowUp":t.preventDefault();const c=e===0;if(c)break;if(e===undefined){this.setDefaultActiveElement();break}else{const t=this.getNextVisibleIndex(-1);if(t===-1)break;this.adjustActiveOptionAndScroll(t-e);break}case"ArrowDown":t.preventDefault();const r=e===i.length-1;if(r)break;if(e===undefined){this.setDefaultActiveElement();break}else{const t=this.getNextVisibleIndex(1);if(t===-1)break;this.adjustActiveOptionAndScroll(t-e);break}case"Home":t.preventDefault();this.openDropdownWithActiveElement(0);break;case"End":t.preventDefault();this.openDropdownWithActiveElement(i.length-1);break;case"PageUp":t.preventDefault();this.openDropdownWithActiveElement(Math.max(e-10,0));break;case"PageDown":t.preventDefault();this.openDropdownWithActiveElement(Math.min(e+10,i.length-1));break;case"Tab":if(h)break;if(this.multiple&&this.type==="listbox")break;a=i.find((t=>t.active));if(!a||a.disabled)return;this.selectOption(a);break;case"Esc":case"Escape":if(this.noSelect)this.setActiveElement(null);this.popoverState.emit({open:false,action:"close"});break;default:if(s)break;if(!o.match(/^[\w]$/))break;this.searchOptions(o,false);break}};this.focusoutHandler=t=>{const{relatedTarget:e}=t;const s=this.allOptions.includes(e);const i=!s&&this.hostElement.contains(e);if(s||i){t.stopPropagation()}};this.clickHandler=t=>{const e=t.target;const s=e.closest("q2-option");this.selectOption(s);if(this.multiple)return;this.popoverState.emit({open:false,action:"select"})};this.align=undefined;this.customSearch=undefined;this.disabled=undefined;this.label=h("tecton.element.optionList.label");this.multiple=undefined;this.noSelect=undefined;this.selectedOptions=[];this.showSelected=undefined;this.type="listbox";this.hasOptions=undefined}componentWillLoad(){this.hasOptions=!!this.hostElement.querySelectorAll("q2-option").length}componentDidLoad(){a(this.hostElement);this.checkOptions();this.selectedOptionsUpdated();this.ready.emit()}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}get allContents(){const t=this.getRootSlot(this.hostElement);const e=["Q2-OPTGROUP","Q2-OPTION"];return t.filter((t=>e.includes(t.tagName)))}get allOptions(){const t=this.allContents;const e=t=>t.reduce(((t,s)=>{if(s.tagName==="Q2-OPTGROUP"){return[...t,...e(Array.from(s.children))]}else if(s.tagName==="Q2-OPTION"){return[...t,s]}else{return t}}),[]);return e(t)}get allVisibleOptions(){return this.allOptions.filter((t=>!t.hidden&&!t._multiSelectHidden&&!t.disabled&&!t.disabledGroup))}async checkOptions(){const{type:t}=this;const e=await this.getOptions();if(!t)return;const s=t==="menu"?"menuitem":"option";e.forEach((t=>{t.role=s}))}getRootSlot(t){var e;const s=t.querySelector("slot");const i=(e=s===null||s===void 0?void 0:s.assignedElements())!==null&&e!==void 0?e:Array.from(t.children);const n=!!i.length&&i[0].tagName==="SLOT";if(n){return this.getRootSlot(i[0])}else{return i}}scrollToActiveOption(){const t=this.allOptions[this.activeIndex];t===null||t===void 0?void 0:t.scrollIntoView({block:"nearest"})}async openDropdownWithActiveElement(t){if(this.disabled)return;this.activeIndex=t;this.popoverState.emit({open:true,action:"open"});await c();this.setActiveOption();await c();this.setFocusedOption();this.scrollToActiveOption()}getDefaultActiveIndex(){const{allOptions:t}=this;const e=t.findIndex((t=>t.selected));if(e>-1)return e;const s=t.findIndex((t=>!t.hidden));if(s>-1)return s;return 0}updateSingleOptionAttrs(){var t;const{allOptions:e,selectedOptions:s}=this;const i=((t=s[0])===null||t===void 0?void 0:t.value)||undefined;e.forEach((t=>{t.selected=t.value===i}))}updateMultipleOptionAttrs(){const{allOptions:t,selectedOptions:e}=this;const s=e.map((({value:t})=>t));t.forEach((t=>{t.selected=s.includes(t.value)}))}setActiveOption(){const t=this.activeIndex;this.allOptions.forEach(((e,s)=>{e.active=t===s}))}setFocusedOption(){const t=this.allOptions[this.activeIndex];if(!t)return;const e=r(t);if(e)t.focus();else o((()=>t.focus()))}getNextVisibleIndex(t){const{allVisibleOptions:e,allOptions:s,activeIndex:i}=this;const n=s[i];const o=e.indexOf(n);let h=o+t;if(h<0){h=e.length-1}else if(h>e.length-1){h=0}const a=e[h];return s.indexOf(a)}focusSelectedSibling(t){const{allVisibleOptions:e,allOptions:s}=this;const i=e.length<2;if(i){this.showSelected=false;return}const n=e.indexOf(t);const o=n?n-1:n+1;const h=e[o];const a=s.indexOf(h);this.activeIndex=a;this.setFocusedOption();this.scheduledAfterRender.push((()=>{t._multiSelectHidden=!t.selected}))}selectOption(t){const{multiple:e,noSelect:s,showSelected:i}=this;if(!t||t.disabled||t.disabledGroup)return;const n=t.value;const o={value:n,display:t.display||t.innerText.trim()};let h=[];if(e){const{selectedOptions:e}=this;const s=e.find((t=>t.value===n));if(s){h=e.filter((({value:t})=>t!==n))}else{h=[...e,o]}if(i)this.focusSelectedSibling(t)}else{h=[o]}if(s)this.setActiveElement(null);else this.selectedOptions=h;this.change.emit({value:n,values:h})}adjustActiveOptionAndScroll(t){this.activeIndex+=t;this.setActiveOption();this.setFocusedOption();this.scrollToActiveOption()}resetTimer(){if(this.searchStringTimer){clearTimeout(this.searchStringTimer)}this.searchStringTimer=window.setTimeout((()=>{this.searchString=null}),2e3)}searchOptions(t,e){this.searchString=t;this.searchAndFocus(t,e)}showSelectedUpdated(t){if(t&&this.selectedOptions.length===0){this.showSelected=false;return}this.allOptions.forEach((e=>e._multiSelectHidden=t?!e.selected:false))}selectedOptionsUpdated(){if(this.multiple){this.updateMultipleOptionAttrs()}else{this.updateSingleOptionAttrs()}}delegateFocus(t){if(!l(t,this.hostElement))return;this.popoverState.emit({open:true,action:"open"});const{activeIndex:e}=this;if(typeof e==="number"&&e>-1){this.setActiveOption();this.setFocusedOption()}else{this.setDefaultActiveElement()}}handleClick(t){t.stopPropagation()}async setDefaultActiveElement(){this.activeIndex=this.getDefaultActiveIndex();this.setActiveOption();this.setFocusedOption()}async setActiveElement(t){this.activeIndex=t;this.setActiveOption();this.setFocusedOption()}async handleExternalKeydown(t){this.externalKeydownHandler(t)}async getContents(){return this.allContents}async getOptions(){return this.allOptions}render(){return s(i,{key:"c3c1aa149c1696c2025e7be8d0185a500cdc40e1"},s("div",{key:"0788af1766ce408de56b8d56f87898c048dfd618",class:"content",ref:t=>this.contentElement=t,onFocusout:this.focusoutHandler},s("div",{key:"04341860dc01b4c64905bdead1125adc03c3d036",class:"options","aria-label":h("tecton.element.optionList.label",[this.label]),"aria-multiselectable":`${!!this.multiple}`,role:this.type||"listbox",onKeyDown:this.internalKeydownHandler,onClick:this.clickHandler},s("slot",{key:"e1fa1fc07a9dd268a84491177a6c8e15632f3afa"}))))}get hostElement(){return n(this)}static get watchers(){return{showSelected:["showSelectedUpdated"],selectedOptions:["selectedOptionsUpdated"]}}};p.style=f;export{p as q2_option_list};
-//# sourceMappingURL=p-a3d58a50.entry.js.map
+import{r as t,c as e,h as s,H as i,g as n}from"./p-a5f18e27.js";import{n as o,l as h,o as a,w as c,q as r,i as l}from"./p-84190698.js";const d="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{position:relative;width:100%;display:block;line-height:var(--tct-option-list-line-height, var(--t-option-list-line-height, var(--app-line-height, 1.428571429em)))}.content{text-align:start}:host([is-sizeable]) .content{display:block;height:auto}";const f=d;const p=class{constructor(s){t(this,s);this.change=e(this,"change",7);this.popoverState=e(this,"popoverState",7);this.ready=e(this,"ready",3);this.scheduledAfterRender=[];this.keyStore={queue:[],lastPressedAt:new Date};this.searchAndFocus=(t,e)=>{const s=()=>{this.pivotIndex=this.pivotIndex===undefined?0:(this.activeIndex||0)+1;const t=this.allOptions.map(((t,e)=>({element:t,index:e})));return[...t.slice(this.pivotIndex),...t.slice(0,this.pivotIndex)]};const i=()=>{const e=new Date;if(e.getTime()-this.keyStore.lastPressedAt.getTime()>1e3){this.keyStore.queue.length=0}if(this.keyStore.queue.length!==1||this.keyStore.queue[0]!==t){this.keyStore.queue.push(t)}this.keyStore.lastPressedAt=e};const n=t=>{const e=this.keyStore.queue.join("");return t.find((t=>!t.element.disabled&&t.element.display&&(t.element.display.match(new RegExp(`^${e}`,"i"))||t.element.display.replace(/\s/g,"").match(new RegExp(`^${e}`,"i")))))};const o=({index:t})=>{if(this.multiple){this.openDropdownWithActiveElement(t)}else{this.activeIndex=t;if(e){this.selectOption(this.allOptions[t]);this.popoverState.emit({open:false,action:"select"})}else this.setActiveElement(t)}};i();const h=n(s());if(h){o(h)}};this.externalKeydownHandler=t=>{t.stopPropagation();const{activeIndex:e,customSearch:s,allOptions:i}=this;const{key:n}=t;let h;switch(n){case" ":if(this.searchString){if(s)break;this.searchOptions(n,true);break}else if(this.type==="menu"){this.activeIndex=0;this.openDropdownWithActiveElement(0)}else{this.setDefaultActiveElement();o((()=>this.popoverState.emit({open:true,action:"open"})))}break;case"Enter":if(this.type==="menu"){this.activeIndex=0;this.openDropdownWithActiveElement(0)}else{this.setDefaultActiveElement();o((()=>this.popoverState.emit({open:true,action:"open"})))}break;case"ArrowUp":t.preventDefault();this.activeIndex=0;h=!!this.selectedOptions.length?this.getDefaultActiveIndex():this.getNextVisibleIndex(-1);if(h===-1)break;this.openDropdownWithActiveElement(h);break;case"ArrowDown":t.preventDefault();this.activeIndex=0;h=!!this.selectedOptions.length?this.getDefaultActiveIndex():this.getNextVisibleIndex(0);if(h===-1)break;this.openDropdownWithActiveElement(h);break;case"Home":t.preventDefault();this.openDropdownWithActiveElement(0);break;case"End":t.preventDefault();this.openDropdownWithActiveElement(i.length-1);break;case"PageUp":t.preventDefault();this.openDropdownWithActiveElement(Math.max((e||0)-10,0));break;case"PageDown":t.preventDefault();this.openDropdownWithActiveElement(Math.min((e||0)+10,i.length-1));break;case"Tab":this.popoverState.emit({open:false,action:"close"});break;case"Esc":case"Escape":if(this.noSelect)this.setActiveElement(null);this.popoverState.emit({open:false,action:"close"});break;default:if(s)break;if(!n.match(/^[\w]$/))break;this.searchOptions(n,true);break}};this.internalKeydownHandler=t=>{t.stopPropagation();const{activeIndex:e,customSearch:s,allOptions:i,multiple:n}=this;const{key:o,shiftKey:h}=t;let a;switch(o){case" ":if(this.searchString&&!this.multiple){if(s)break;this.searchOptions(o,false);break}t.preventDefault();a=i.find((t=>t.active));if(!a||a.disabled)break;this.selectOption(a);if(n)break;this.popoverState.emit({open:false,action:"select"});break;case"Enter":t.preventDefault();a=i.find((t=>t.active));if(!a||a.disabled)break;this.selectOption(a);if(n)break;this.popoverState.emit({open:false,action:"select"});break;case"ArrowUp":t.preventDefault();const c=e===0;if(c)break;if(e===undefined){this.setDefaultActiveElement();break}else{const t=this.getNextVisibleIndex(-1);if(t===-1)break;this.adjustActiveOptionAndScroll(t-e);break}case"ArrowDown":t.preventDefault();const r=e===i.length-1;if(r)break;if(e===undefined){this.setDefaultActiveElement();break}else{const t=this.getNextVisibleIndex(1);if(t===-1)break;this.adjustActiveOptionAndScroll(t-e);break}case"Home":t.preventDefault();this.openDropdownWithActiveElement(0);break;case"End":t.preventDefault();this.openDropdownWithActiveElement(i.length-1);break;case"PageUp":t.preventDefault();this.openDropdownWithActiveElement(Math.max(e-10,0));break;case"PageDown":t.preventDefault();this.openDropdownWithActiveElement(Math.min(e+10,i.length-1));break;case"Tab":if(h)break;if(this.multiple&&this.type==="listbox")break;a=i.find((t=>t.active));if(!a||a.disabled)return;this.selectOption(a);break;case"Esc":case"Escape":if(this.noSelect)this.setActiveElement(null);this.popoverState.emit({open:false,action:"close"});break;default:if(s)break;if(!o.match(/^[\w]$/))break;this.searchOptions(o,false);break}};this.focusoutHandler=t=>{const{relatedTarget:e}=t;const s=this.allOptions.includes(e);const i=!s&&this.hostElement.contains(e);if(s||i){t.stopPropagation()}};this.clickHandler=t=>{const e=t.target;const s=e.closest("q2-option");this.selectOption(s);if(this.multiple)return;this.popoverState.emit({open:false,action:"select"})};this.align=undefined;this.customSearch=undefined;this.disabled=undefined;this.label=h("tecton.element.optionList.label");this.multiple=undefined;this.noSelect=undefined;this.selectedOptions=[];this.showSelected=undefined;this.type="listbox";this.hasOptions=undefined}componentWillLoad(){this.hasOptions=!!this.hostElement.querySelectorAll("q2-option").length}componentDidLoad(){a(this.hostElement);this.checkOptions();this.selectedOptionsUpdated();this.ready.emit()}componentDidRender(){this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}get allContents(){const t=this.getRootSlot(this.hostElement);const e=["Q2-OPTGROUP","Q2-OPTION"];return t.filter((t=>e.includes(t.tagName)))}get allOptions(){const t=this.allContents;const e=t=>t.reduce(((t,s)=>{if(s.tagName==="Q2-OPTGROUP"){return[...t,...e(Array.from(s.children))]}else if(s.tagName==="Q2-OPTION"){return[...t,s]}else{return t}}),[]);return e(t)}get allVisibleOptions(){return this.allOptions.filter((t=>!t.hidden&&!t._multiSelectHidden&&!t.disabled&&!t.disabledGroup))}async checkOptions(){const{type:t}=this;const e=await this.getOptions();if(!t)return;const s=t==="menu"?"menuitem":"option";e.forEach((t=>{t.role=s}))}getRootSlot(t){var e;const s=t.querySelector("slot");const i=(e=s===null||s===void 0?void 0:s.assignedElements())!==null&&e!==void 0?e:Array.from(t.children);const n=!!i.length&&i[0].tagName==="SLOT";if(n){return this.getRootSlot(i[0])}else{return i}}scrollToActiveOption(){const t=this.allOptions[this.activeIndex];t===null||t===void 0?void 0:t.scrollIntoView({block:"nearest"})}async openDropdownWithActiveElement(t){if(this.disabled)return;this.popoverState.emit({open:true,action:"open"});await c();this.activeIndex=t;this.setActiveOption();this.setFocusedOption();this.scrollToActiveOption()}getDefaultActiveIndex(){const{allOptions:t}=this;const e=t.findIndex((t=>t.selected));if(e>-1)return e;const s=t.findIndex((t=>!t.hidden));if(s>-1)return s;return 0}updateSingleOptionAttrs(){var t;const{allOptions:e,selectedOptions:s}=this;const i=((t=s[0])===null||t===void 0?void 0:t.value)||undefined;e.forEach((t=>{t.selected=t.value===i}))}updateMultipleOptionAttrs(){const{allOptions:t,selectedOptions:e}=this;const s=e.map((({value:t})=>t));t.forEach((t=>{t.selected=s.includes(t.value)}))}setActiveOption(){const t=this.activeIndex;this.allOptions.forEach(((e,s)=>{e.active=t===s}))}setFocusedOption(){const t=this.allOptions[this.activeIndex];if(!t)return;const e=r(t);if(e)t.focus();else o((()=>t.focus()))}getNextVisibleIndex(t){const{allVisibleOptions:e,allOptions:s,activeIndex:i}=this;const n=s[i];const o=e.indexOf(n);let h=o+t;if(h<0){h=e.length-1}else if(h>e.length-1){h=0}const a=e[h];return s.indexOf(a)}focusSelectedSibling(t){const{allVisibleOptions:e,allOptions:s}=this;const i=e.length<2;if(i){this.showSelected=false;return}const n=e.indexOf(t);const o=n?n-1:n+1;const h=e[o];const a=s.indexOf(h);this.activeIndex=a;this.setFocusedOption();this.scheduledAfterRender.push((()=>{t._multiSelectHidden=!t.selected}))}selectOption(t){const{multiple:e,noSelect:s,showSelected:i}=this;if(!t||t.disabled||t.disabledGroup)return;const n=t.value;const o={value:n,display:t.display||t.innerText.trim()};let h=[];if(e){const{selectedOptions:e}=this;const s=e.find((t=>t.value===n));if(s){h=e.filter((({value:t})=>t!==n))}else{h=[...e,o]}if(i)this.focusSelectedSibling(t)}else{h=[o]}if(s)this.setActiveElement(null);else this.selectedOptions=h;this.change.emit({value:n,values:h})}adjustActiveOptionAndScroll(t){this.activeIndex+=t;this.setActiveOption();this.setFocusedOption();this.scrollToActiveOption()}resetTimer(){if(this.searchStringTimer){clearTimeout(this.searchStringTimer)}this.searchStringTimer=window.setTimeout((()=>{this.searchString=null}),2e3)}searchOptions(t,e){this.searchString=t;this.searchAndFocus(t,e)}showSelectedUpdated(t){if(t&&this.selectedOptions.length===0){this.showSelected=false;return}this.allOptions.forEach((e=>e._multiSelectHidden=t?!e.selected:false))}selectedOptionsUpdated(){if(this.multiple){this.updateMultipleOptionAttrs()}else{this.updateSingleOptionAttrs()}}delegateFocus(t){if(!l(t,this.hostElement))return;this.popoverState.emit({open:true,action:"open"});const{activeIndex:e}=this;if(typeof e==="number"&&e>-1){this.setActiveOption();this.setFocusedOption()}else{this.setDefaultActiveElement()}}handleClick(t){t.stopPropagation()}async setDefaultActiveElement(){this.activeIndex=this.getDefaultActiveIndex();this.setActiveOption();this.setFocusedOption()}async setActiveElement(t){this.activeIndex=t;this.setActiveOption();this.setFocusedOption()}async handleExternalKeydown(t){this.externalKeydownHandler(t)}async getContents(){return this.allContents}async getOptions(){return this.allOptions}render(){return s(i,{key:"2a470de268f16262aa675475fd2425bd50b4edad"},s("div",{key:"549deb2fbe009ea6cef0444a4867710b4ad1abf6",class:"content",ref:t=>this.contentElement=t,onFocusout:this.focusoutHandler},s("div",{key:"0f5857df5db8f073ef28e2a6760d6d798ab3d1fd",class:"options","aria-label":h("tecton.element.optionList.label",[this.label]),"aria-multiselectable":`${!!this.multiple}`,role:this.type||"listbox",onKeyDown:this.internalKeydownHandler,onClick:this.clickHandler},s("slot",{key:"cbee273a92302a2b8c9302d65444534a6c04b42f"}))))}get hostElement(){return n(this)}static get watchers(){return{showSelected:["showSelectedUpdated"],selectedOptions:["selectedOptionsUpdated"]}}};p.style=f;export{p as q2_option_list};
+//# sourceMappingURL=p-56dd051a.entry.js.map

package/dist/q2-tecton-elements/p-56dd051a.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["q2OptionListCss","Q2OptionListStyle0","Q2OptionList","this","scheduledAfterRender","keyStore","queue","lastPressedAt","Date","searchAndFocus","keyValue","shouldSelect","reorder","pivotIndex","undefined","activeIndex","list","allOptions","map","element","index","slice","buildQueue","now","getTime","length","push","searchIndex","keyStr","join","find","v","disabled","display","match","RegExp","replace","setFocus","multiple","openDropdownWithActiveElement","selectOption","popoverState","emit","open","action","setActiveElement","matched","externalKeydownHandler","event","stopPropagation","customSearch","key","nextIndex","searchString","searchOptions","type","setDefaultActiveElement","nextPaint","preventDefault","selectedOptions","getDefaultActiveIndex","getNextVisibleIndex","Math","max","min","noSelect","internalKeydownHandler","shiftKey","newOption","active","isFirstOptionActive","adjustActiveOptionAndScroll","isLastOptionActive","focusoutHandler","relatedTarget","isInQ2OptionList","includes","isInLightDom","hostElement","contains","clickHandler","target","option","closest","loc","componentWillLoad","hasOptions","querySelectorAll","componentDidLoad","overrideFocus","checkOptions","selectedOptionsUpdated","ready","componentDidRender","forEach","fn","allContents","rootSlot","getRootSlot","acceptedTags","filter","tagName","contents","extractOptions","elements","reduce","acc","Array","from","children","allVisibleOptions","hidden","_multiSelectHidden","disabledGroup","options","getOptions","optionRole","role","slot","querySelector","assignedElements","_a","hasAnotherSlot","scrollToActiveOption","activeOption","scrollIntoView","block","waitForNextPaint","setActiveOption","setFocusedOption","firstSelected","findIndex","selected","firstEnabled","updateSingleOptionAttrs","selectedValue","value","updateMultipleOptionAttrs","selectedValues","elementIndex","isOptionVisible","isVisible","focus","direction","visibleActiveOptionIndex","indexOf","nextVisibleOptionIndex","nextVisibleOption","focusSelectedSibling","hasNoSiblings","showSelected","selectedOptionVisibleIndex","nextVisibleSiblingIndex","nextVisibleSibling","nextSiblingIndex","selectedOption","valueObject","innerText","trim","values","isAlreadySelected","change","numToAdd","resetTimer","searchStringTimer","clearTimeout","window","setTimeout","showSelectedUpdated","delegateFocus","isEventFromElement","handleClick","handleExternalKeydown","getContents","render","h","Host","class","ref","el","contentElement","onFocusout","label","onKeyDown","onClick"],"sources":["src/components/q2-option-list/q2-option-list.scss?tag=q2-option-list&encapsulation=shadow","src/components/q2-option-list/q2-option-list.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n:host {\n position: relative;\n width: 100%;\n display: block;\n line-height: var-list(var-prefixer(option-list-line-height),--app-line-height, 1.428571429em);\n}\n\n.content {\n text-align: start;\n\n :host([is-sizeable]) & {\n display: block;\n height: auto;\n }\n}\n","import {\n Component,\n Prop,\n h,\n Event,\n State,\n Element,\n ComponentInterface,\n Host,\n EventEmitter,\n Method,\n Watch,\n Listen,\n} from '@stencil/core';\nimport { isEventFromElement, isVisible, loc, nextPaint, overrideFocus, waitForNextPaint } from 'src/utils';\n\nexport interface IOptionValue {\n value: string;\n display?: string;\n}\n\n@Component({ tag: 'q2-option-list', shadow: true, styleUrl: 'q2-option-list.scss' })\nexport class Q2OptionList implements ComponentInterface {\n @Prop({ reflect: true }) align: 'left' | 'right';\n\n /** Indicates a custom search is being implemented for the option list. */\n @Prop({ reflect: true }) customSearch: boolean;\n\n /** Disables the option list. */\n @Prop({ reflect: true }) disabled: boolean;\n\n /** Determines the label that is applied to the option list for accessibility purposes. */\n @Prop() label: string = loc('tecton.element.optionList.label');\n\n /**\n * Enables the multi-select ability for the option list.\n * @info\n * Only applicable when options are provided.\n */\n @Prop({ reflect: true }) multiple: boolean;\n\n /** Disables the logic that handles selecting and focusing an option in the option list. */\n @Prop({ reflect: true }) noSelect: boolean;\n\n /** A list of the selected options on the element. */\n @Prop({ mutable: true }) selectedOptions: IOptionValue[] = [];\n\n /** Applies focus to the selected option. */\n @Prop({ reflect: true, mutable: true }) showSelected: boolean;\n\n /** Translates to the role of the option list */\n @Prop() type: 'menu' | 'listbox' = 'listbox';\n\n /**\n * Emitted when an option is selected or deselected.\n *\n * When the multi-select is enabled, the `value` property will be `undefined` and the `selectedOptions` property\n * will contain the selected option values.\n */\n @Event() change: EventEmitter<{ value: string; values: IOptionValue[] }>;\n\n /**\n * Emitted to indicate the intended state of the popover.\n * @private\n */\n @Event() popoverState: EventEmitter<{ open: boolean; action: 'close' | 'select' | 'open' }>;\n\n /**\n * Emitted when the component has finished rendering.\n * @private\n */\n @Event({ bubbles: false }) ready: EventEmitter<undefined>;\n @State() hasOptions: boolean;\n contentElement: HTMLElement;\n activeIndex: number;\n pivotIndex: number;\n scheduledAfterRender: (() => void)[] = [];\n searchString: string;\n searchStringTimer: number;\n keyStore: {\n queue: string[];\n lastPressedAt: Date;\n } = {\n queue: [],\n lastPressedAt: new Date(),\n };\n\n @Element() hostElement: HTMLElement;\n\n /// LifeCycle Hooks ///\n componentWillLoad() {\n this.hasOptions = !!this.hostElement.querySelectorAll('q2-option').length;\n }\n\n componentDidLoad(): void {\n overrideFocus(this.hostElement);\n this.checkOptions();\n this.selectedOptionsUpdated();\n this.ready.emit();\n }\n\n componentDidRender() {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n }\n\n /// Getters ///\n get allContents(): (HTMLQ2OptgroupElement | HTMLQ2OptionElement)[] {\n const rootSlot = this.getRootSlot(this.hostElement);\n const acceptedTags = ['Q2-OPTGROUP', 'Q2-OPTION'];\n return rootSlot.filter(element => acceptedTags.includes(element.tagName)) as (\n | HTMLQ2OptgroupElement\n | HTMLQ2OptionElement\n )[];\n }\n\n get allOptions(): HTMLQ2OptionElement[] {\n const contents = this.allContents;\n\n const extractOptions = (\n elements: (HTMLQ2OptgroupElement | HTMLQ2OptionElement | Element)[]\n ): HTMLQ2OptionElement[] => {\n return elements.reduce((acc, element) => {\n if (element.tagName === 'Q2-OPTGROUP') {\n return [...acc, ...extractOptions(Array.from(element.children))];\n } else if (element.tagName === 'Q2-OPTION') {\n return [...acc, element];\n } else {\n return acc;\n }\n }, []);\n };\n\n return extractOptions(contents);\n }\n\n get allVisibleOptions(): HTMLQ2OptionElement[] {\n return this.allOptions.filter(\n option => !option.hidden && !option._multiSelectHidden && !option.disabled && !option.disabledGroup\n );\n }\n\n /// Helpers ///\n async checkOptions() {\n const { type } = this;\n const options = await this.getOptions();\n if (!type) return;\n const optionRole = type === 'menu' ? 'menuitem' : 'option';\n options.forEach(option => {\n option.role = optionRole;\n });\n }\n\n getRootSlot(element: Element): Element[] {\n const slot = element.querySelector('slot');\n const assignedElements = slot?.assignedElements() ?? Array.from(element.children);\n const hasAnotherSlot = !!assignedElements.length && assignedElements[0].tagName === 'SLOT';\n if (hasAnotherSlot) {\n return this.getRootSlot(assignedElements[0]);\n } else {\n return assignedElements;\n }\n }\n\n scrollToActiveOption() {\n const activeOption = this.allOptions[this.activeIndex];\n activeOption?.scrollIntoView({ block: 'nearest' });\n }\n\n async openDropdownWithActiveElement(activeIndex: number) {\n if (this.disabled) return;\n this.popoverState.emit({ open: true, action: 'open' });\n await waitForNextPaint();\n this.activeIndex = activeIndex;\n this.setActiveOption();\n this.setFocusedOption();\n this.scrollToActiveOption();\n }\n\n getDefaultActiveIndex() {\n const { allOptions } = this;\n const firstSelected = allOptions.findIndex(element => element.selected);\n if (firstSelected > -1) return firstSelected;\n\n const firstEnabled = allOptions.findIndex(element => !element.hidden);\n if (firstEnabled > -1) return firstEnabled;\n\n return 0;\n }\n\n updateSingleOptionAttrs() {\n const { allOptions, selectedOptions } = this;\n const selectedValue = selectedOptions[0]?.value || undefined;\n allOptions.forEach(element => {\n element.selected = element.value === selectedValue;\n });\n }\n\n updateMultipleOptionAttrs() {\n const { allOptions, selectedOptions } = this;\n const selectedValues = selectedOptions.map(({ value }) => value);\n allOptions.forEach(element => {\n element.selected = selectedValues.includes(element.value);\n });\n }\n\n setActiveOption() {\n const activeIndex = this.activeIndex;\n\n this.allOptions.forEach((element, elementIndex) => {\n element.active = activeIndex === elementIndex;\n });\n }\n\n setFocusedOption() {\n const option = this.allOptions[this.activeIndex];\n if (!option) return;\n\n const isOptionVisible = isVisible(option);\n if (isOptionVisible) option.focus();\n else nextPaint(() => option.focus());\n }\n\n getNextVisibleIndex(direction) {\n const { allVisibleOptions, allOptions, activeIndex } = this;\n const activeOption = allOptions[activeIndex];\n const visibleActiveOptionIndex = allVisibleOptions.indexOf(activeOption);\n let nextVisibleOptionIndex = visibleActiveOptionIndex + direction;\n\n if (nextVisibleOptionIndex < 0) {\n nextVisibleOptionIndex = allVisibleOptions.length - 1;\n } else if (nextVisibleOptionIndex > allVisibleOptions.length - 1) {\n nextVisibleOptionIndex = 0;\n }\n\n const nextVisibleOption = allVisibleOptions[nextVisibleOptionIndex];\n return allOptions.indexOf(nextVisibleOption);\n }\n\n focusSelectedSibling(option: HTMLQ2OptionElement) {\n const { allVisibleOptions, allOptions } = this;\n const hasNoSiblings = allVisibleOptions.length < 2;\n if (hasNoSiblings) {\n this.showSelected = false;\n return;\n }\n\n const selectedOptionVisibleIndex = allVisibleOptions.indexOf(option);\n const nextVisibleSiblingIndex = selectedOptionVisibleIndex\n ? selectedOptionVisibleIndex - 1\n : selectedOptionVisibleIndex + 1;\n const nextVisibleSibling = allVisibleOptions[nextVisibleSiblingIndex];\n const nextSiblingIndex = allOptions.indexOf(nextVisibleSibling);\n\n this.activeIndex = nextSiblingIndex;\n this.setFocusedOption();\n this.scheduledAfterRender.push(() => {\n option._multiSelectHidden = !option.selected;\n });\n }\n\n selectOption(selectedOption: HTMLQ2OptionElement) {\n const { multiple, noSelect, showSelected } = this;\n if (!selectedOption || selectedOption.disabled || selectedOption.disabledGroup) return;\n const selectedValue = selectedOption.value;\n const valueObject = {\n value: selectedValue,\n display: selectedOption.display || selectedOption.innerText.trim(),\n };\n\n let values: IOptionValue[] = [];\n if (multiple) {\n const { selectedOptions } = this;\n const isAlreadySelected = selectedOptions.find(option => option.value === selectedValue);\n\n if (isAlreadySelected) {\n values = selectedOptions.filter(({ value }) => value !== selectedValue);\n } else {\n values = [...selectedOptions, valueObject];\n }\n\n if (showSelected) this.focusSelectedSibling(selectedOption);\n } else {\n values = [valueObject];\n }\n\n if (noSelect) this.setActiveElement(null);\n else this.selectedOptions = values;\n\n this.change.emit({ value: selectedValue, values });\n }\n\n adjustActiveOptionAndScroll(numToAdd: number) {\n this.activeIndex += numToAdd;\n this.setActiveOption();\n this.setFocusedOption();\n this.scrollToActiveOption();\n }\n\n resetTimer() {\n if (this.searchStringTimer) {\n clearTimeout(this.searchStringTimer);\n }\n\n this.searchStringTimer = window.setTimeout(() => {\n this.searchString = null;\n }, 2000);\n }\n\n searchAndFocus = (keyValue: string, shouldSelect: boolean) => {\n // pseudo search in non-searchable select\n const reorder = () => {\n this.pivotIndex = this.pivotIndex === undefined ? 0 : (this.activeIndex || 0) + 1;\n const list = this.allOptions.map((element, index) => ({ element, index }));\n return [...list.slice(this.pivotIndex), ...list.slice(0, this.pivotIndex)];\n };\n\n const buildQueue = () => {\n const now = new Date();\n if (now.getTime() - this.keyStore.lastPressedAt.getTime() > 1000) {\n // empty stored keys if delay > 1s\n this.keyStore.queue.length = 0;\n }\n if (this.keyStore.queue.length !== 1 || this.keyStore.queue[0] !== keyValue) {\n this.keyStore.queue.push(keyValue);\n }\n this.keyStore.lastPressedAt = now;\n };\n\n const searchIndex = (list: any[]) => {\n const keyStr = this.keyStore.queue.join('');\n return list.find(v => {\n return (\n !v.element.disabled &&\n v.element.display &&\n (v.element.display.match(new RegExp(`^${keyStr}`, 'i')) ||\n v.element.display.replace(/\\s/g, '').match(new RegExp(`^${keyStr}`, 'i')))\n );\n });\n };\n\n const setFocus = ({ index }) => {\n if (this.multiple) {\n // multiple: should open to make sure that which options are selected\n this.openDropdownWithActiveElement(index);\n } else {\n this.activeIndex = index;\n if (shouldSelect) {\n this.selectOption(this.allOptions[index]);\n this.popoverState.emit({ open: false, action: 'select' });\n } else this.setActiveElement(index);\n }\n };\n\n buildQueue();\n const matched = searchIndex(reorder());\n if (matched) {\n setFocus(matched);\n }\n };\n\n searchOptions(key: string, shouldSelect?: boolean) {\n this.searchString = key;\n this.searchAndFocus(key, shouldSelect);\n }\n\n /// Watchers ///\n @Watch('showSelected')\n showSelectedUpdated(showSelected: boolean) {\n if (showSelected && this.selectedOptions.length === 0) {\n this.showSelected = false;\n return;\n }\n this.allOptions.forEach(option => (option._multiSelectHidden = showSelected ? !option.selected : false));\n }\n\n @Watch('selectedOptions')\n selectedOptionsUpdated() {\n if (this.multiple) {\n this.updateMultipleOptionAttrs();\n } else {\n this.updateSingleOptionAttrs();\n }\n }\n\n /// Listeners ///\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n if (!isEventFromElement(event, this.hostElement)) return;\n this.popoverState.emit({ open: true, action: 'open' });\n const { activeIndex } = this;\n if (typeof activeIndex === 'number' && activeIndex > -1) {\n this.setActiveOption();\n this.setFocusedOption();\n } else {\n this.setDefaultActiveElement();\n }\n }\n\n @Listen('click')\n handleClick(event: MouseEvent) {\n event.stopPropagation();\n }\n\n /// Public Methods ///\n @Method()\n async setDefaultActiveElement() {\n this.activeIndex = this.getDefaultActiveIndex();\n this.setActiveOption();\n this.setFocusedOption();\n }\n\n @Method()\n async setActiveElement(index: number) {\n this.activeIndex = index;\n this.setActiveOption();\n this.setFocusedOption();\n }\n\n @Method()\n async handleExternalKeydown(event: KeyboardEvent) {\n this.externalKeydownHandler(event);\n }\n\n @Method()\n async getContents(): Promise<(HTMLQ2OptgroupElement | HTMLQ2OptionElement)[]> {\n return this.allContents;\n }\n\n @Method()\n async getOptions(): Promise<HTMLQ2OptionElement[]> {\n return this.allOptions;\n }\n\n /// Event Handlers ///\n /* tslint:disable:cyclomatic-complexity */\n externalKeydownHandler = (event: KeyboardEvent) => {\n event.stopPropagation();\n const { activeIndex, customSearch, allOptions } = this;\n const { key } = event;\n\n let nextIndex;\n switch (key) {\n case ' ':\n if (this.searchString) {\n if (customSearch) break;\n\n this.searchOptions(key, true);\n break;\n } else if (this.type === 'menu') {\n this.activeIndex = 0;\n this.openDropdownWithActiveElement(0);\n } else {\n this.setDefaultActiveElement();\n nextPaint(() => this.popoverState.emit({ open: true, action: 'open' }));\n }\n break;\n\n case 'Enter':\n if (this.type === 'menu') {\n this.activeIndex = 0;\n this.openDropdownWithActiveElement(0);\n } else {\n this.setDefaultActiveElement();\n nextPaint(() => this.popoverState.emit({ open: true, action: 'open' }));\n }\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n this.activeIndex = 0;\n nextIndex = !!this.selectedOptions.length ? this.getDefaultActiveIndex() : this.getNextVisibleIndex(-1);\n if (nextIndex === -1) break;\n this.openDropdownWithActiveElement(nextIndex);\n break;\n\n case 'ArrowDown':\n event.preventDefault();\n this.activeIndex = 0;\n nextIndex = !!this.selectedOptions.length ? this.getDefaultActiveIndex() : this.getNextVisibleIndex(0);\n if (nextIndex === -1) break;\n this.openDropdownWithActiveElement(nextIndex);\n break;\n\n case 'Home':\n event.preventDefault();\n this.openDropdownWithActiveElement(0);\n break;\n\n case 'End':\n event.preventDefault();\n this.openDropdownWithActiveElement(allOptions.length - 1);\n break;\n\n case 'PageUp':\n event.preventDefault();\n this.openDropdownWithActiveElement(Math.max((activeIndex || 0) - 10, 0));\n break;\n\n case 'PageDown':\n event.preventDefault();\n this.openDropdownWithActiveElement(Math.min((activeIndex || 0) + 10, allOptions.length - 1));\n break;\n\n case 'Tab':\n this.popoverState.emit({ open: false, action: 'close' });\n break;\n\n case 'Esc':\n case 'Escape':\n if (this.noSelect) this.setActiveElement(null);\n this.popoverState.emit({ open: false, action: 'close' });\n break;\n\n default:\n if (customSearch) break;\n if (!key.match(/^[\\w]$/)) break;\n\n this.searchOptions(key, true);\n break;\n }\n };\n\n internalKeydownHandler = (event: KeyboardEvent) => {\n event.stopPropagation();\n const { activeIndex, customSearch, allOptions, multiple } = this;\n const { key, shiftKey } = event;\n\n let newOption;\n switch (key) {\n case ' ':\n if (this.searchString && !this.multiple) {\n if (customSearch) break;\n\n this.searchOptions(key, false);\n break;\n }\n\n event.preventDefault();\n newOption = allOptions.find(element => element.active);\n if (!newOption || newOption.disabled) break;\n this.selectOption(newOption);\n if (multiple) break;\n this.popoverState.emit({ open: false, action: 'select' });\n break;\n\n case 'Enter':\n event.preventDefault();\n newOption = allOptions.find(element => element.active);\n if (!newOption || newOption.disabled) break;\n this.selectOption(newOption);\n if (multiple) break;\n this.popoverState.emit({ open: false, action: 'select' });\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n const isFirstOptionActive = activeIndex === 0;\n if (isFirstOptionActive) break;\n if (activeIndex === undefined) {\n this.setDefaultActiveElement();\n break;\n } else {\n const nextIndex = this.getNextVisibleIndex(-1);\n if (nextIndex === -1) break;\n this.adjustActiveOptionAndScroll(nextIndex - activeIndex);\n break;\n }\n\n case 'ArrowDown':\n event.preventDefault();\n const isLastOptionActive = activeIndex === allOptions.length - 1;\n if (isLastOptionActive) break;\n if (activeIndex === undefined) {\n this.setDefaultActiveElement();\n break;\n } else {\n const nextIndex = this.getNextVisibleIndex(1);\n if (nextIndex === -1) break;\n this.adjustActiveOptionAndScroll(nextIndex - activeIndex);\n break;\n }\n\n case 'Home':\n event.preventDefault();\n this.openDropdownWithActiveElement(0);\n break;\n\n case 'End':\n event.preventDefault();\n this.openDropdownWithActiveElement(allOptions.length - 1);\n break;\n\n case 'PageUp':\n event.preventDefault();\n this.openDropdownWithActiveElement(Math.max(activeIndex - 10, 0));\n break;\n\n case 'PageDown':\n event.preventDefault();\n this.openDropdownWithActiveElement(Math.min(activeIndex + 10, allOptions.length - 1));\n break;\n\n case 'Tab':\n if (shiftKey) break;\n if (this.multiple && this.type === 'listbox') break;\n newOption = allOptions.find(element => element.active);\n if (!newOption || newOption.disabled) return;\n this.selectOption(newOption);\n break;\n\n case 'Esc':\n case 'Escape':\n if (this.noSelect) this.setActiveElement(null);\n this.popoverState.emit({ open: false, action: 'close' });\n break;\n\n default:\n if (customSearch) break;\n if (!key.match(/^[\\w]$/)) break;\n\n this.searchOptions(key, false);\n break;\n }\n };\n /* tslint:enable:cyclomatic-complexity */\n\n focusoutHandler = (event: FocusEvent) => {\n const { relatedTarget } = event as unknown as { relatedTarget: HTMLQ2OptionElement };\n const isInQ2OptionList = this.allOptions.includes(relatedTarget);\n const isInLightDom = !isInQ2OptionList && this.hostElement.contains(relatedTarget);\n if (isInQ2OptionList || isInLightDom) {\n event.stopPropagation();\n }\n };\n\n clickHandler = (event: Event) => {\n const target = event.target as HTMLQ2OptionElement;\n const option = target.closest('q2-option');\n this.selectOption(option);\n if (this.multiple) return;\n this.popoverState.emit({ open: false, action: 'select' });\n };\n\n /// DOM ///\n render() {\n return (\n <Host>\n <div\n class=\"content\"\n ref={el => (this.contentElement = el)}\n onFocusout={this.focusoutHandler}\n >\n <div\n class=\"options\"\n aria-label={loc('tecton.element.optionList.label', [this.label])}\n aria-multiselectable={`${!!this.multiple}`}\n role={this.type || 'listbox'}\n onKeyDown={this.internalKeydownHandler}\n onClick={this.clickHandler}\n >\n <slot />\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/p-6986a60e.entry.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{r as t,c as e,h as i,g as s}from"./p-a5f18e27.js";import{l as o,h as l,o as n,w as r,g as a,i as c,j as d}from"./p-84190698.js";import{s as h,a as p}from"./p-780a1d0e.js";const u="{box-sizing:border-box}:active{outline:none}:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.q2-element-dropdown{display:none;position:absolute;background-color:var(--app-white, #ffffff);color:var(--t-text, #4d4d4d);left:0;width:100%;z-index:100;margin-top:1px;box-shadow:var(--app-shadow-1, 0 2px 4px rgba(0, 0, 0, 0.3));height:0;overflow:hidden;opacity:0;visibility:hidden;transition:opacity var(--app-tween-1, 0.2s ease);border-radius:var(--tct-dropdown-border-radius, --t-dropdown-border-radius, 0);--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 3px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}.q2-element-dropdown::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}.q2-element-dropdown::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}.q2-element-dropdown::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}.q2-element-dropdown.sizable{display:block;height:auto}.dropdown-open .q2-element-dropdown{display:block;height:auto;overflow:auto;opacity:1;visibility:visible}:host([alignment=right]) .q2-element-dropdown{left:auto;right:0}:host([block]) q2-btn,:host([block]){display:block}:host{--comp-select-margin:var(--tct-select-margin, var(--tct-select-margin-top, var(--t-select-margin-top, var(--app-scale-4, 30px))) 0 var(--tct-select-margin-bottom, var(--t-select-margin-bottom, var(--app-scale-4, 30px))));display:block;margin:var(--comp-select-margin)}.q2-select-container{position:relative;display:block}.q2-select-input{margin:0;--tct-input-min-height:var(--tct-select-input-min-height, var(--t-select-input-min-height));--tct-input-max-height:var(--tct-select-input-max-height, var(--t-select-input-max-height, none))}::slotted([slot=_selected-display]){width:100%;min-height:var(--comp-selected-display-height, 44px)}.custom-display-content{position:absolute;bottom:0;left:calc(var(--tct-scale-2, var(--app-scale-2x, 10px)) + 1px);height:44px;width:calc(100% - 34px - var(--tct-scale-3, var(--app-scale-3x, 15px)));overflow:hidden;cursor:pointer;transition:left var(--tct-tween-2, var(--app-tween-1, 0.2s ease))}.custom-display-content:not([hidden]){display:flex;align-items:center}.is-searchable.is-focused .custom-display-content,.is-searchable .custom-display-content:active{left:calc(var(--tct-scale-3, var(--app-scale-3x, 15px)) + 1px)}.has-error .custom-display-content{width:calc(100% - 68px - var(--tct-scale-3, var(--app-scale-3x, 15px)))}.popover-content{display:flex;flex-direction:column-reverse}.popover-bottom-container{position:sticky;bottom:0;z-index:5}.popover-top-container{position:sticky;top:0;z-index:5}.popover-top-container .multi-select-header{padding:var(--tct-scale-2, var(--app-scale-2x, 10px)) var(--tct-scale-2, var(--app-scale-2x, 10px));background:var(--app-white);display:flex;gap:var(--app-scale-2x, 10px);align-items:center}.popover-top-container .multi-select-header fieldset{margin:0;padding:0;border:0;display:flex;gap:var(--app-scale-2x, 10px)}.popover-top-container .multi-select-header legend{padding:0;float:left}.popover-top-container .multi-select-header label{cursor:pointer;padding:var(--tct-select-multi-select-option-padding, var(--t-select-multi-select-option-padding, var(--tct-btn-badge-padding, var(--t-btn-badge-padding, 2px 5px))));font-size:var(--tct-select-multi-select-option-font-size, var(--t-select-multi-select-option-font-size, var(--tct-btn-badge-font-size, var(--t-btn-badge-font-size, inherit))));border-radius:var(--tct-select-multi-select-option-radius, var(--t-select-multi-select-option-radius, var(--tct-btn-badge-border-radius, var(--t-btn-badge-border-radius, var(--app-border-radius-1, 3px)))));background:var(--tct-select-multi-select-option-background, var(--tct-select-multi-select-option-bg, var(--t-select-multi-select-option-bg, var(--tct-badge-background, var(--tct-btn-badge-bg, var(--t-btn-badge-bg, transparent))))));color:var(--tct-select-multi-select-option-color, var(--t-select-multi-select-option-color, var(--tct-btn-badge-font-color, var(--t-btn-badge-font-color, inherit))))}.popover-top-container .multi-select-header label:hover{background:var(--tct-select-multi-select-option-hover-background, var(--tct-select-multi-select-option-hover-background-color, var(--t-select-multi-select-option-hover-background-color, var(--tct-btn-badge-hover-bg, var(--t-btn-badge-hover-bg, var(--tct-gray-14, var(--t-gray-14, var(--app-gray-l3, #f2f2f2))))))));color:var(--tct-select-multi-select-option-hover-color, var(--tct-select-multi-select-option-color, var(--t-select-multi-select-option-color, var(--tct-btn-badge-hover-font-color, var(--t-btn-badge-hover-font-color, var(--tct-gray-5, var(--t-gray-5, var(--app-gray-d2, #404040))))))))}.popover-top-container .multi-select-header input:checked+label,.popover-top-container .multi-select-header input:checked+label:enabled:hover{background:var(--tct-select-multi-select-option-active-background, var(--tct-select-multi-select-option-active-background-color, var(--t-select-multi-select-option-active-background-color, var(--tct-btn-primary-bg, var(--t-btn-primary-bg, #2e2e2e)))));color:var(--tct-select-multi-select-option-active-color, var(--t-select-multi-select-option-active-color, var(--tct-btn-primary-font-color, var(--t-btn-primary-font-color, var(--app-white, #ffffff)))))}.popover-top-container .multi-select-header input:disabled+label{opacity:var(--tct-select-multi-select-option-disabled-opacity, var(--t-select-multi-select-option-disabled-opacity, var(--tct-btn-disabled-opacity, var(--t-btn-disabled-opacity, var(--app-disabled-opacity, 0.4)))));cursor:not-allowed}.popover-top-container .multi-select-header input:focus+label{box-shadow:var(--const-double-focus-ring)}";const v=u;const b=class{constructor(i){t(this,i);this.change=e(this,"change",7);this.input=e(this,"input",7);var s;this.scheduledAfterRender=[];this.showSelectedOptions=()=>{this.showSelected=true};this.showAllOptions=()=>{this.showSelected=false};this.onMutationObserved=()=>{const{hostElement:t,hasPopoverTop:e,hasPopoverBottom:i}=this;const s=t.querySelector(".custom-display-content");const o=t.shadowRoot.querySelector('slot[name="q2-select-display"]');const l=!!o?o.assignedNodes().length>0:s.children.length>0;if(this.hasCustomDisplay!==l){this.hasCustomDisplay=l}const n=t.shadowRoot.querySelector('slot[name="popover-top"]');const r=n.assignedNodes().length>0;if(e!==r){this.hasPopoverTop=r}const a=t.shadowRoot.querySelector('slot[name="popover-bottom"]');const c=a.assignedNodes().length>0;if(i!==c){this.hasPopoverBottom=c}this.checkSelectedOptions()};this.onOptionListChange=t=>{t.stopPropagation();const{values:e}=t.detail;if(e.length===0)this.showAllOptions();this.handleSelectionChanges(t.detail)};this.onPopoverState=({detail:{open:t,action:e}})=>{if(!t\|\|this.searchText){if(e!=="select"){this.optionList.setActiveElement(null)}this.inputField.focus()}if(this.open===t)return;this.open=t};this.inputKeydownHandler=t=>{if(this.readonly\|\|this.disabled)return;const e=t.key;const i=this.hasPopoverTop\|\|this.hasPopoverBottom;const s=e==="Tab"&&t.shiftKey;if(i&&(e==="Tab"\|\|e==="Enter"\|\|s))return;if(h(this,t)){return this.executeActionSheet(t)}const o=["ArrowDown","ArrowUp","PageDown","PageUp","Home","End","Escape","Tab"];if(this.searchable&&(e===" "\|\|e==="Enter")&&this.inputField.value==""){t.preventDefault();if(!this.open)this.openDropdownWithoutActiveElement()}if(this.searchable&&!o.includes(e))return;if(this.shouldClearSearchText(t))this.clearSearchText();if(e===" ")t.preventDefault();this.optionList.handleExternalKeydown(t)};this.visibilityToggleKeyDown=t=>{const e=t.key;const i=e==="Tab"&&t.shiftKey;const s=["ArrowLeft","ArrowRight","ArrowUp","ArrowDown"].includes(e);if(s)t.stopPropagation();if(i){t.stopPropagation();if(this.hasPopoverTop)return;this.optionList.setDefaultActiveElement()}};this.inputClickHandler=async t=>{t.stopPropagation();if(h(this)){return this.executeActionSheet(t)}this.toggleDropdown();this.focusInput()};this.inputInputHandler=t=>{t.stopPropagation();const e=t.detail.value;const i=!!this.value;if(i)this.clearValue();if(!this.open)this.openDropdownWithoutActiveElement();this.prioritizeSearch=true;this.searchText=e;this.input.emit({query:e})};this.inputFocusHandler=()=>{this.inputFocused=true};this.inputBlurHandler=()=>{this.inputFocused=false};this.inputChangeHandler=t=>{t.stopPropagation()};this.clickedElsewhere=t=>{const e=t.target;if(e.localName!=="click-elsewhere")return;t.stopPropagation()};this.onCustomDisplayClick=t=>{t.stopPropagation();this.focusInput();this.toggleDropdown()};this.disabled=false;this.errors=undefined;this.hideLabel=undefined;this.clearable=undefined;this.hoist=!!((s=window.Tecton)===null\|\|s===void 0?void 0:s.useActionSheets);this.invalid=undefined;this.label=undefined;this.listLabel=o("tecton.element.select.listLabel");this.minRows=3;this.multilineOptions=false;this.multiple=false;this.optional=false;this.placeholder=undefined;this.popDirection=undefined;this.popoverMode=null;this.readonly=false;this.searchable=false;this.selectedOptions=[];this.value=undefined;this.ariaLabel=undefined;this.open=false;this.showSelected=false;this.searchText="";this.hasCustomDisplay=false;this.hasPopoverTop=false;this.hasPopoverBottom=false;this.inputFocused=false;this.statusMessage=undefined;this.prioritizeSearch=false;this.structuredSelectedOptions=[]}componentWillLoad(){l(this);this.buildStructuredSelectedOptions();this.handleMultilineOptionsUpdate(this.multilineOptions,false)}componentDidLoad(){const t=new MutationObserver(this.onMutationObserved);t.observe(this.hostElement,{childList:true,subtree:true});this.mutationObserver=t;this.onMutationObserved();n(this.hostElement);setTimeout((()=>this.checkSelectedDisplay()),0)}componentDidRender(){setTimeout((()=>{this.scheduledAfterRender.forEach((t=>t()));this.scheduledAfterRender=[]}),25)}disconnectedCallback(){var t;(t=this.mutationObserver)===null\|\|t===void 0?void 0:t.disconnect();this.mutationObserver=null}get innerInputField(){var t,e;return(e=(t=this.inputField)===null\|\|t===void 0?void 0:t.shadowRoot)===null\|\|e===void 0?void 0:e.querySelector(".input-field")}get innerInputContainer(){var t,e;return(e=(t=this.inputField)===null\|\|t===void 0?void 0:t.shadowRoot)===null\|\|e===void 0?void 0:e.querySelector(".input-container")}get badgeValue(){var t,e;if(!this.multiple)return null;const i=(e=(t=this.selectedOptions)===null\|\|t===void 0?void 0:t.length)!==null&&e!==void 0?e:0;if(this.open&&this.searchable)return i?`${i}`:null;else return i>1?`+${i-1}`:null}get popoverMinHeight(){const{minRows:t}=this;const e=this.hostElement.querySelector("q2-option:not([hidden])");let i=e&&window.getComputedStyle(e).minHeight;if(!i\|\|i==="0px")i="44px";return tparseInt(i)}get selectedDisplay(){if(this.prioritizeSearch\|\|this.searchText)return this.searchText;if(this.hasCustomDisplay)return"";return this.multiple?this.calculateMultiSelectSelectedDisplay():this.calculateSingleSelectSelectedDisplay()}get selectedDisplaySlot(){return this.hostElement.querySelector('[slot="_selected-display"]')}get firstSelectedValue(){var t;return this.multiple?(t=this.selectedOptions)===null\|\|t===void 0?void 0:t[0]:this.value}get firstSelectedOptionElement(){const{firstSelectedValue:t}=this;return t?this.optionElements.find((({value:e})=>e===t)):null}get optionElements(){return Array.from(this.hostElement.querySelectorAll("q2-option"))}get wrapperClasses(){const{errors:t}=this;const e=["q2-select-container"];if(Array.isArray(t)&&t.length>0)e.push("has-error");if(this.inputFocused)e.push("is-focused");if(this.searchable)e.push("is-searchable");return e.join(" ")}buildStructuredSelectedOptions(){const{multiple:t,selectedOptions:e,value:i}=this;if(t){this.structuredSelectedOptions=!!(e===null\|\|e===void 0?void 0:e.length)?e.map((t=>typeof t==="string"?{value:t}:t)):[]}else{this.structuredSelectedOptions=i?[{value:i}]:[]}}ariaLabelObserver(){l(this)}valueUpdated(){if(this.multiple)return;this.clearSearchText()}handleMultilineOptionsUpdate(t,e){if(t===e)return;this.optionElements.forEach((e=>e.multiline=t))}openChanged(t){this.scheduledAfterRender.push((async()=>{await r();const{popoverTopContainer:e,popoverElement:i}=this;const s=t&&(e===null\|\|e===void 0?void 0:e.offsetHeight)\|\|0;if(s){i.style.setProperty("--comp-popover-top-container-height",`${s}px`)}else{i.style.removeProperty("--comp-popover-top-container-height")}}))}_togglePopover(){const{innerInputField:t}=this;t===null\|\|t===void 0?void 0:t.click();t===null\|\|t===void 0?void 0:t.focus();t.dispatchEvent(new FocusEvent("focus"))}async openPopover(){if(this.open\|\|this.disabled)return;this._togglePopover()}async closePopover(){if(!this.open\|\|this.disabled)return;this._togglePopover()}async setValue(t,e={closePopover:true}){const i=new Set(Array.isArray(t)?t:[t]);if(!this.open){await this.openPopover();await r()}i.forEach((t=>{var e;(e=this.optionElements.find((e=>e.value===t)))===null\|\|e===void 0?void 0:e.click()}));if(e.closePopover){await this.closePopover();await r()}}searchOptions(t){if(!this.searchable)return;const{innerInputField:e}=this;e.focus();e.dispatchEvent(new FocusEvent("focus"));e.value=t;e.dispatchEvent(new InputEvent("input"))}keydownHandler(t){this.inputKeydownHandler(t)}onHostElementChange(t){if(this.readonly\|\|this.disabled)return;if(t.target!==this.hostElement\|\|this.hostElement.onchange)return;if(this.multiple){this.value=null;this.selectedOptions=t.detail.selectedOptions}else{this.value=t.detail.value;this.selectedOptions=[]}}onClearHandler(){this.clearValue()}onHostElementInput(t){if(!this.searchable\|\|t.target!==this.hostElement\|\|this.hostElement.oninput)return;const e=this.optionElements;const i=this.searchText.trim().toLocaleLowerCase();let s=0;e.forEach((t=>{var e;if(i===""){t.hidden=false;return}const o=((e=t.firstElementChild)===null\|\|e===void 0?void 0:e.tagName)==="Q2-CARD"?t.firstElementChild.title:null;const{display:l="",innerText:n=""}=t;const r=[l,o,n];const a=r.some((t=>{var e;return(e=t===null\|\|t===void 0?void 0:t.toLocaleLowerCase().includes(i))!==null&&e!==void 0?e:false}));t.hidden=!a;if(a)s++}));const l=i?"tecton.element.select.searchable.results":"tecton.element.select.allOptions";const n=i?s:e.length;this.setStatusMessage(o(l,[n]))}delegateFocus(t){const e=a(t,this.hostElement);const i=this.prioritizeSearch=e&&this.searchable;if(i){this.clearSelectedDisplay()}else if(c(t,this.hostElement)){this.inputField.shadowRoot.querySelector(".input-field").focus()}}handleFocusout(t){const e=d(t,this.hostElement);if(e)this.closeDropdown();this.prioritizeSearch=!e&&this.searchable}handleSelectedDisplay(t){if(this.multiple)return;this.inputField.value=t.detail.display}async executeActionSheet(t){const e=await p(this,t);this.handleSelectionChanges(e)}handleSelectionChanges(t){const{value:e="",values:i=[]}=t;const s=i.map((t=>t.value));const{multiple:o}=this;if(!this.hostElement.onchange){this.selectedOptions=s}this.change.emit({value:o?undefined:e,selectedOptions:o?s:undefined})}clearValue(){const{multiple:t}=this;this.value="";this.selectedOptions=[];this.change.emit({value:t?undefined:"",selectedOptions:t?[]:undefined})}calculateMultiSelectSelectedDisplay(){var t,e,i;const{firstSelectedOptionElement:s,firstSelectedValue:l,multilineOptions:n}=this;if(!l)return"";if(s===null\|\|s===void 0?void 0:s.display)return o(s.display);if(n&&this.searchable)return this.searchText;if(n)return"";return(i=(e=(t=s===null\|\|s===void 0?void 0:s.textContent)===null\|\|t===void 0?void 0:t.trim())!==null&&e!==void 0?e:s===null\|\|s===void 0?void 0:s.value)!==null&&i!==void 0?i:l}calculateSingleSelectSelectedDisplay(){var t;const{firstSelectedOptionElement:e,multilineOptions:i}=this;if(i){return(e===null\|\|e===void 0?void 0:e.display)&&o(e.display)\|\|this.value\|\|""}else{return(e===null\|\|e===void 0?void 0:e.display)&&o(e.display)\|\|((t=e===null\|\|e===void 0?void 0:e.textContent)===null\|\|t===void 0?void 0:t.trim())\|\|this.value\|\|""}}openDropdownWithoutActiveElement(){if(this.readonly\|\|this.disabled)return;this.optionList.setActiveElement(null);this.open=true}closeDropdown(){this.open=false;this.clearSearchText()}clearSearchText(){if(!this.searchText)return;this.searchText="";this.input.emit({query:""})}toggleDropdown(){if(this.readonly\|\|this.disabled)return;if(this.open&&!this.searchText){this.closeDropdown()}else{this.openDropdownWithoutActiveElement()}}focusInput(){var t;(t=this.inputField)===null\|\|t===void 0?void 0:t.dispatchEvent(new FocusEvent("focus"))}setStatusMessage(t){clearTimeout(this.statusMessageTimer);this.statusMessage="";this.statusMessageTimer=setTimeout((()=>{this.statusMessage=t}),1e3)}checkSelectedOptions(){const{multiple:t,selectedOptions:e,value:i}=this;this.optionElements.forEach((s=>{if(t){s.selected=e.includes(s.value)}else{s.selected=s.value===i}}))}clearSelectedDisplay(){var t;(t=this.selectedDisplaySlot)===null\|\|t===void 0?void 0:t.remove()}checkSelectedDisplay(){let t=this.selectedDisplaySlot;const{value:e,multiple:i,selectedOptions:s,multilineOptions:o,firstSelectedOptionElement:l,prioritizeSearch:n}=this;const r=!e&&i&&!(s===null\|\|s===void 0?void 0:s.length);if(n\|\|!o\|\|r)return this.clearSelectedDisplay();if(!l\|\|l.display)return this.clearSelectedDisplay();const a=l.firstElementChild.cloneNode(true);a.querySelectorAll("[hide-on-select]").forEach((t=>t.remove()));if(t){const e=t.clientHeight===0?"auto":`${t.clientHeight}px`;t.style.setProperty("--comp-selected-display-height",e);if(t.firstElementChild.outerHTML!==a.outerHTML){t.replaceChild(a,t.firstElementChild)}}else{t=document.createElement("div");t.slot="_selected-display";t.appendChild(a);this.hostElement.appendChild(t)}return t}checkSelectedDisplayHeight(){const{selectedDisplaySlot:t}=this;if(!t)return;t.style.setProperty("--comp-selected-display-height","44px")}shouldClearSearchText(t){return this.searchable&&!!this.searchText&&t.key==="Escape"}renderCustomDisplay(){const t=this.checkSelectedDisplay();if(!t)return;this.checkSelectedDisplayHeight();return i("slot",{name:"_selected-display",slot:"custom-display"})}render(){var t;return i("click-elsewhere",{key:"421fc4811bdf2f8cfb899ee9823ce20e3301032c",class:this.wrapperClasses,onChange:this.clickedElsewhere},i("div",{key:"1a2b96c2e6dbacfa7dcc8918ff4acab71046dc8d","aria-live":"polite","aria-atomic":"true",role:"status",class:"sr"},this.statusMessage),i("q2-input",{key:"fd678010a8f0d53a4d93c265204bedf72679221a",ref:t=>this.inputField=t,class:"q2-select-input",label:this.label&&o(this.label)\|\|"",value:this.selectedDisplay,clearable:this.clearable&&(!!this.value\|\|!!((t=this.selectedOptions)===null\|\|t===void 0?void 0:t.length))\|\|undefined,errors:Array.isArray(this.errors)&&this.errors.length>0&&this.errors.map((t=>o(t)))\|\|this.invalid&&["tecton.element.select.invalid"]\|\|[],disabled:this.disabled,optional:this.optional,readonly:!!this.readonly,placeholder:this.placeholder\|\|undefined,hideLabel:this.hideLabel,ariaExpanded:`${this.open}`,ariaControls:"option-list",ariaHaspopup:"listbox","test-id":"toggleDropdown","hide-messages":true,iconRight:"chevron-down",onClick:this.inputClickHandler,onInput:this.inputInputHandler,onKeyDown:this.inputKeydownHandler,onFocus:this.inputFocusHandler,onBlur:this.inputBlurHandler,onChange:this.inputChangeHandler,badgeValue:this.badgeValue,badgeTheme:this.inputFocused?"primary":undefined,_role:"combobox",_preventEntry:!this.searchable},this.renderCustomDisplay()),i("div",{key:"26f8c78fb455e7fc9451018ed2745ab53018c270",class:"custom-display-content",hidden:!this.hasCustomDisplay\|\|!!this.searchText,onClick:this.onCustomDisplayClick},i("slot",{key:"4f76ab176fbd88b99aab88ad9e9a3cb87ccb943b",name:"q2-select-display"})),this.optionsDropdown())}optionsDropdown(){return i("q2-popover",{ref:t=>this.popoverElement=t,controlElement:this.innerInputContainer,open:this.open,minHeight:this.popoverMinHeight,direction:this.popDirection,mode:this.popoverMode\|\|undefined,block:true},i("div",{class:"popover-content"},i("q2-option-list",{onPopoverState:this.onPopoverState,ref:t=>this.optionList=t,type:"listbox",id:"option-list","show-selected":this.showSelected,label:this.listLabel,multiple:this.multiple,selectedOptions:this.structuredSelectedOptions,onChange:this.onOptionListChange},i("slot",null)),i("div",{class:"popover-top-container",ref:t=>this.popoverTopContainer=t,hidden:!this.multiple&&!this.hasPopoverTop,tabindex:"-1"},i("slot",{name:"popover-top"}),this.multiple&&this.visibilityToggle())),i("div",{class:"popover-bottom-container",hidden:!this.hasPopoverBottom,tabindex:"-1"},i("slot",{name:"popover-bottom"})))}visibilityToggle(){var t,e;const s=(e=(t=this.selectedOptions)===null\|\|t===void 0?void 0:t.length)!==null&&e!==void 0?e:0;const{showSelected:l}=this;return i("div",{class:"multi-select-header"},i("fieldset",null,i("legend",{"aria-label":o("tecton.element.select.multiHeader.showing")},o("tecton.element.select.multiHeader.showing")),i("div",null,i("input",{class:"sr",type:"radio",id:"all",name:"viewDisplay",value:"all",checked:!l,"aria-label":o("tecton.element.select.multiHeader.allAriaLabel"),"test-id":"allOptionsButton",onClick:this.showAllOptions,onKeyDown:this.visibilityToggleKeyDown}),i("label",{htmlFor:"all"},o("tecton.element.select.multiHeader.all"))),i("div",null,i("input",{class:"sr",type:"radio",id:"selected",disabled:s===0,name:"viewDisplay",value:"selected","aria-label":o("tecton.element.select.multiHeader.selectedAriaLabel",[s]),checked:l,"test-id":"selectedOptionsButton",onClick:this.showSelectedOptions,onKeyDown:this.visibilityToggleKeyDown}),i("label",{htmlFor:"selected"},o("tecton.element.select.multiHeader.selected",[s])))))}get hostElement(){return s(this)}static get watchers(){return{value:["buildStructuredSelectedOptions","valueUpdated"],selectedOptions:["buildStructuredSelectedOptions"],ariaLabel:["ariaLabelObserver"],multilineOptions:["handleMultilineOptionsUpdate"],open:["openChanged"]}}};b.style=v;export{b as q2_select};
2	+ //# sourceMappingURL=p-6986a60e.entry.js.map

package/dist/q2-tecton-elements/{p-6eac40be.entry.js.map → p-6986a60e.entry.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["q2SelectCss","Q2SelectStyle0","Q2Select","this","scheduledAfterRender","showSelectedOptions","showSelected","showAllOptions","onMutationObserved","hostElement","hasPopoverTop","hasPopoverBottom","slotContainer","querySelector","displaySlot","shadowRoot","hasCustomDisplay","assignedNodes","length","children","popTopSlot","topSlotHasNode","popBottomSlot","bottomSlotHasNode","checkSelectedOptions","onOptionListChange","event","stopPropagation","values","detail","handleSelectionChanges","onPopoverState","open","action","searchText","optionList","setActiveElement","inputField","focus","inputKeydownHandler","readonly","disabled","key","hasSlot","isShiftTab","shiftKey","shouldShowActionSheet","executeActionSheet","keysForOptionListToHandle","searchable","includes","shouldClearSearchText","clearSearchText","preventDefault","handleExternalKeydown","visibilityToggleKeyDown","isRadioControlKey","setDefaultActiveElement","inputClickHandler","async","toggleDropdown","focusInput","inputInputHandler","eventValue","value","shouldClearValue","clearValue","openDropdownWithoutActiveElement","prioritizeSearch","input","emit","query","inputFocusHandler","inputFocused","inputBlurHandler","inputChangeHandler","clickedElsewhere","target","localName","onCustomDisplayClick","_a","window","Tecton","useActionSheets","loc","componentWillLoad","handleAriaLabel","buildStructuredSelectedOptions","handleMultilineOptionsUpdate","multilineOptions","componentDidLoad","observer","MutationObserver","observe","childList","subtree","mutationObserver","overrideFocus","setTimeout","checkSelectedDisplay","componentDidRender","forEach","fn","disconnectedCallback","disconnect","innerInputField","_b","innerInputContainer","badgeValue","multiple","optionsLength","selectedOptions","popoverMinHeight","minRows","firstOption","minHeight","getComputedStyle","parseInt","selectedDisplay","calculateMultiSelectSelectedDisplay","calculateSingleSelectSelectedDisplay","selectedDisplaySlot","firstSelectedValue","firstSelectedOptionElement","optionElements","find","Array","from","querySelectorAll","wrapperClasses","errors","classes","isArray","push","join","structuredSelectedOptions","map","option","ariaLabelObserver","valueUpdated","newValue","oldValue","element","multiline","openChanged","isOpen","waitForNextPaint","popoverTopContainer","popoverElement","height","offsetHeight","style","setProperty","removeProperty","_togglePopover","click","dispatchEvent","FocusEvent","openPopover","closePopover","setValue","options","valuesSet","Set","searchOptions","InputEvent","keydownHandler","onHostElementChange","onchange","onClearHandler","onHostElementInput","oninput","trim","toLocaleLowerCase","matchedCount","hidden","title","firstElementChild","tagName","display","innerText","searchParams","matched","some","text","statusMessageLocString","count","setStatusMessage","delegateFocus","fromHost","isRelatedTargetWithinHost","clearSelectedDisplay","isEventFromElement","handleFocusout","isLeavingHost","isHostLosingFocus","closeDropdown","handleSelectedDisplay","result","showActionSheetList","changeDetails","selectedOptionValues","change","undefined","_c","textContent","message","clearTimeout","statusMessageTimer","statusMessage","selected","remove","namedSlot","hasNoValue","selectionClone","cloneNode","clientHeight","outerHTML","replaceChild","document","createElement","slot","appendChild","checkSelectedDisplayHeight","renderCustomDisplay","hasSelectedDisplay","h","name","render","class","onChange","role","ref","el","label","clearable","error","invalid","optional","placeholder","hideLabel","ariaExpanded","ariaControls","ariaHaspopup","iconRight","onClick","onInput","onKeyDown","onFocus","onBlur","badgeTheme","_role","_preventEntry","optionsDropdown","controlElement","direction","popDirection","mode","popoverMode","block","type","id","listLabel","tabindex","visibilityToggle","selectedOptionsCount","checked","htmlFor"],"sources":["src/components/q2-select/q2-select.scss?tag=q2-select&encapsulation=shadow","src/components/q2-select/q2-select.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../../styles/dropdowns';\n\n:host {\n --comp-select-margin: #{var-list(\n --tct-select-margin,\n unquote(\n '#{var-list(var-prefixer(select-margin-top), --app-scale-4, 30px)} 0 #{var-list(var-prefixer(select-margin-bottom), --app-scale-4, 30px)}'\n )\n )};\n display: block;\n margin: var(--comp-select-margin);\n}\n\n.q2-select-container {\n position: relative;\n display: block;\n}\n\n.q2-select-input {\n margin: 0;\n\n --tct-input-min-height: #{var-list(var-prefixer(select-input-min-height))};\n --tct-input-max-height: #{var-list(var-prefixer(select-input-max-height), none)};\n}\n\n::slotted([slot='_selected-display']) {\n width: 100%;\n min-height: var(--comp-selected-display-height, 44px);\n}\n\n.custom-display-content {\n position: absolute;\n bottom: 0;\n left: calc(var-list(--tct-scale-2, --app-scale-2x, 10px) + 1px);\n height: 44px;\n width: calc(100% - 34px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n overflow: hidden;\n cursor: pointer;\n transition: left var-list(--tct-tween-2, --app-tween-1, unquote('0.2s ease'));\n}\n\n.custom-display-content:not([hidden]) {\n display: flex;\n align-items: center;\n}\n\n.is-searchable.is-focused .custom-display-content,\n.is-searchable .custom-display-content:active {\n left: calc(var-list(--tct-scale-3, --app-scale-3x, 15px) + 1px);\n}\n\n.has-error .custom-display-content {\n width: calc(100% - 68px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n}\n\n.popover-content {\n display: flex;\n flex-direction: column-reverse;\n}\n\n.popover-bottom-container {\n position: sticky;\n bottom: 0;\n z-index: 5;\n}\n\n.popover-top-container {\n position: sticky;\n top: 0;\n z-index: 5;\n .multi-select-header {\n padding: var(--tct-scale-2, var(--app-scale-2x, 10px)) var(--tct-scale-2, var(--app-scale-2x, 10px));\n background: var(--app-white);\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n align-items: center;\n\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n }\n\n legend {\n padding: 0;\n float: left;\n }\n\n label {\n cursor: pointer;\n padding: var-list(\n var-prefixer(select-multi-select-option-padding),\n var-prefixer(btn-badge-padding),\n unquote('2px 5px')\n );\n font-size: var-list(\n var-prefixer(select-multi-select-option-font-size),\n var-prefixer(btn-badge-font-size),\n inherit\n );\n border-radius: var-list(\n var-prefixer(select-multi-select-option-radius),\n var-prefixer(btn-badge-border-radius),\n --app-border-radius-1,\n 3px\n );\n background: var-list(\n --tct-select-multi-select-option-background,\n var-prefixer(select-multi-select-option-bg),\n --tct-badge-background,\n var-prefixer(btn-badge-bg),\n transparent\n );\n color: var-list(\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-font-color),\n inherit\n );\n\n &:hover {\n background: var-list(\n --tct-select-multi-select-option-hover-background,\n var-prefixer(select-multi-select-option-hover-background-color),\n var-prefixer(btn-badge-hover-bg),\n var-prefixer(gray-14),\n --app-gray-l3,\n #f2f2f2\n );\n color: var-list(\n --tct-select-multi-select-option-hover-color,\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-hover-font-color),\n var-prefixer(gray-5),\n --app-gray-d2,\n #404040\n );\n }\n }\n\n input {\n &:checked + label {\n &,\n &:enabled:hover {\n background: var-list(\n --tct-select-multi-select-option-active-background,\n var-prefixer(select-multi-select-option-active-background-color),\n var-prefixer(btn-primary-bg),\n #2e2e2e\n );\n color: var-list(\n var-prefixer(select-multi-select-option-active-color),\n var-prefixer(btn-primary-font-color),\n --app-white,\n #ffffff\n );\n }\n }\n\n &:disabled + label {\n opacity: var-list(\n var-prefixer(select-multi-select-option-disabled-opacity),\n var-prefixer(btn-disabled-opacity),\n --app-disabled-opacity,\n 0.4\n );\n cursor: not-allowed;\n }\n\n &:focus + label {\n box-shadow: var(--const-double-focus-ring);\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n Element,\n h,\n Listen,\n State,\n EventEmitter,\n Event,\n ComponentInterface,\n Watch,\n Method,\n} from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent, Q2OptionListCustomEvent } from 'src/components';\nimport {\n handleAriaLabel,\n isEventFromElement,\n isHostLosingFocus,\n isRelatedTargetWithinHost,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from '../../utils';\nimport { IOptionValue } from '../q2-option-list/q2-option-list';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\n\n@Component({ tag: 'q2-select', shadow: true, styleUrl: 'q2-select.scss' })\nexport class Q2Select implements ComponentInterface {\n /** Disables all interaction with the field and leverages the disabled visual style of `q2-input`. /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /\n The presence of `errors` will mark the field as invalid, putting it into an error state.\n * @localizable\n /\n @Prop() errors: string[];\n\n /\n Hide's the field's `<label>` element from view.\n * @warning\n * Only use when a visible label is impractical.\n /\n @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n\n /* Renders an icon button when the field is non-empty. Pressing the button clears all input from the field. /\n @Prop({ reflect: true }) clearable: boolean;\n\n /\n Instructs the component to use the action sheet workflow for displaying its options.\n \n For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n * @warning\n * If your `q2-select` renders inside of an iframe, and you are using multiline/robust content options,\n * any custom CSS you apply to your options will not get passed up to the platform which displays the action sheet.\n * For this reason, we strongly suggest using the [q2-card](https://tecton.q2developer.com/ui/q2-card/) component since its styling is managed by Tecton.\n /\n @Prop() hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /* Determines whether to show an error state. Its primary use-case is for an unfilled field. /\n @Prop({ reflect: true }) invalid: boolean;\n\n /\n The text that will be used as the label for the field.\n * @localizable\n /\n @Prop({ reflect: true, mutable: true }) label: string;\n\n /\n Determines the label that is applied to the option list for accessibility purposes.\n * @localizable\n /\n @Prop() listLabel: string = loc('tecton.element.select.listLabel');\n\n /* The minimum number of rows the component will try to display below or above the component when opened. /\n @Prop() minRows: number = 3;\n\n /* Enables text wrapping for `q2-option` elements. When `false`, the text truncates and does not wrap. /\n @Prop({ reflect: true }) multilineOptions: boolean = false;\n\n /* Enables multi-select functionality. /\n @Prop({ reflect: true }) multiple: boolean = false;\n\n /* Appends \"(optional)\" to the field label, and sets `aria-required` on the nested input tag to `false`. /\n @Prop({ reflect: true }) optional: boolean = false;\n\n /\n Text that appears within the field when it is blurred and empty.\n * Placeholder text disappears when the user selects an option.\n * @localizable\n /\n @Prop({ reflect: true }) placeholder: string;\n\n /* @deprecated /\n @Prop({ reflect: true }) popDirection: 'up' \| 'down';\n\n /\n Determines the display mode of the popover.\n \n Providing a value of `legacy` instructs the popover to use absolute positioning instead of fixed positioning.\n \n @info\n * This is a temporary solution to work around styling issues related to using fixed positioning for the popover\n * when nested inside of elements with transform properties. This will be removed once the popover API is available\n * for use.\n /\n @Prop({ mutable: true }) popoverMode: 'legacy' = null;\n\n /\n Appends \"(read only)\" to the field label, and field becomes unusable, but remains focusable.\n * Takes priority over `optional` if both are `true`.\n /\n @Prop({ reflect: true }) readonly: boolean = false;\n\n /* Enables search functionality. /\n @Prop({ reflect: true }) searchable: boolean = false;\n\n /\n Each item in this array should correspond to the value of a `q2-option` element.\n * This property is only relevant for `multiple` (i.e., multi-select) implementations.\n /\n @Prop({ mutable: true }) selectedOptions: string[] = [];\n\n /\n The current value for the select. This should correspond to the value of a nested q2-option element.\n * This property is only relevant for single-select implementations.\n /\n @Prop({ mutable: true }) value: string;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n @Element() hostElement: HTMLElement;\n\n @State() open: boolean = false;\n @State() showSelected: boolean = false;\n @State() searchText: string = '';\n @State() hasCustomDisplay: boolean = false;\n @State() hasPopoverTop: boolean = false;\n @State() hasPopoverBottom: boolean = false;\n @State() inputFocused: boolean = false;\n @State() statusMessage: string;\n @State() prioritizeSearch: boolean = false;\n @State() structuredSelectedOptions: IOptionValue[] = [];\n\n inputField?: HTMLQ2InputElement;\n optionList: HTMLQ2OptionListElement;\n popoverElement?: HTMLQ2PopoverElement;\n popoverTopContainer?: HTMLDivElement;\n scheduledAfterRender: (() => void)[] = [];\n mutationObserver: MutationObserver;\n\n /// Lifecycle Hooks ///\n componentWillLoad() {\n handleAriaLabel(this);\n this.buildStructuredSelectedOptions();\n this.handleMultilineOptionsUpdate(this.multilineOptions, false);\n }\n\n componentDidLoad() {\n const observer = new MutationObserver(this.onMutationObserved);\n observer.observe(this.hostElement, { childList: true, subtree: true });\n this.mutationObserver = observer;\n this.onMutationObserved();\n overrideFocus(this.hostElement);\n setTimeout(() => this.checkSelectedDisplay(), 0);\n }\n\n componentDidRender() {\n setTimeout(() => {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n }, 25);\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n this.mutationObserver = null;\n }\n\n /// Getters ///\n get innerInputField(): HTMLInputElement \| HTMLButtonElement {\n return this.inputField?.shadowRoot?.querySelector('.input-field');\n }\n\n get innerInputContainer(): HTMLElement {\n return this.inputField?.shadowRoot?.querySelector('.input-container');\n }\n\n get badgeValue(): string {\n if (!this.multiple) return null;\n const optionsLength = this.selectedOptions?.length ?? 0;\n if (this.open && this.searchable) return optionsLength ? `${optionsLength}` : null;\n else return optionsLength > 1 ? `+${optionsLength - 1}` : null;\n }\n\n get popoverMinHeight() {\n const { minRows } = this;\n const firstOption = this.hostElement.querySelector<HTMLQ2OptionElement>('q2-option:not([hidden])');\n let minHeight = firstOption && window.getComputedStyle(firstOption).minHeight;\n\n // Safari doesn't return a min-height for non-visible items\n if (!minHeight \|\| minHeight === '0px') minHeight = '44px';\n\n return minRows parseInt(minHeight);\n }\n\n get selectedDisplay() {\n if (this.prioritizeSearch \|\| this.searchText) return this.searchText;\n if (this.hasCustomDisplay) return '';\n return this.multiple ? this.calculateMultiSelectSelectedDisplay() : this.calculateSingleSelectSelectedDisplay();\n }\n\n get selectedDisplaySlot() {\n return this.hostElement.querySelector<HTMLElement>('[slot=\"_selected-display\"]');\n }\n\n get firstSelectedValue() {\n return this.multiple ? this.selectedOptions?.[0] : this.value;\n }\n\n get firstSelectedOptionElement() {\n const { firstSelectedValue } = this;\n return firstSelectedValue ? this.optionElements.find(({ value }) => value === firstSelectedValue) : null;\n }\n\n get optionElements() {\n return Array.from(this.hostElement.querySelectorAll<HTMLQ2OptionElement>('q2-option'));\n }\n\n get wrapperClasses() {\n const { errors } = this;\n const classes = ['q2-select-container'];\n if (Array.isArray(errors) && errors.length > 0) classes.push('has-error');\n if (this.inputFocused) classes.push('is-focused');\n if (this.searchable) classes.push('is-searchable');\n return classes.join(' ');\n }\n\n /// Watchers ///\n @Watch('value')\n @Watch('selectedOptions')\n buildStructuredSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n if (multiple) {\n this.structuredSelectedOptions = !!selectedOptions?.length\n ? selectedOptions.map(option => (typeof option === 'string' ? { value: option } : option))\n : [];\n } else {\n this.structuredSelectedOptions = value ? [{ value }] : [];\n }\n }\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('value')\n valueUpdated() {\n if (this.multiple) return;\n this.clearSearchText();\n }\n\n @Watch('multilineOptions')\n handleMultilineOptionsUpdate(newValue, oldValue) {\n if (newValue === oldValue) return;\n this.optionElements.forEach(element => (element.multiline = newValue));\n }\n\n @Watch('open')\n openChanged(isOpen: boolean) {\n this.scheduledAfterRender.push(async () => {\n await waitForNextPaint();\n const { popoverTopContainer, popoverElement } = this;\n const height = (isOpen && popoverTopContainer?.offsetHeight) \|\| 0;\n if (height) {\n popoverElement.style.setProperty('--comp-popover-top-container-height', `${height}px`);\n } else {\n popoverElement.style.removeProperty('--comp-popover-top-container-height');\n }\n });\n }\n\n /// Events ///\n /*\n Emitted when an option is selected or deselected.\n \n When the multi-select is enabled, the `value` property will be `undefined` and the `selectedOptions` property\n * will contain the selected option values.\n \n @legacyEvent\n /\n @Event() change: EventEmitter<{ value: string; selectedOptions: string[] }>;\n\n /\n Emitted when the input value changes.\n \n Requires the `searchable` prop to be set to `true`.\n /\n @Event() input: EventEmitter<{ query: string }>;\n\n /// Methods ///\n _togglePopover() {\n const { innerInputField } = this;\n innerInputField?.click();\n innerInputField?.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n }\n\n /\n Emulates clicking the `<input>` to display the popover if it is hidden.\n \n @testOnly\n /\n @Method()\n async openPopover() {\n if (this.open \|\| this.disabled) return;\n this._togglePopover();\n }\n\n /\n Emulates clicking the `<input>` to hide the popover if it is visible.\n \n @testOnly\n /\n @Method()\n async closePopover() {\n if (!this.open \|\| this.disabled) return;\n this._togglePopover();\n }\n\n /\n Emulates clicking the `<input>` to display the popover and selecting the option(s) with the specified value(s).\n \n If the multi-select is enabled and the `closePopover` argument is `true` (default), the popover will be closed\n * after the option(s) are selected.\n \n @testOnly\n /\n @Method()\n async setValue(values: string \| string[], options: { closePopover?: boolean } = { closePopover: true }) {\n const valuesSet = new Set(Array.isArray(values) ? values : [values]);\n if (!this.open) {\n await this.openPopover();\n await waitForNextPaint();\n }\n\n valuesSet.forEach(value => {\n this.optionElements.find(option => option.value === value)?.click();\n });\n\n if (options.closePopover) {\n await this.closePopover();\n await waitForNextPaint();\n }\n }\n\n /\n Emulates focusing the `<input>`, entering the provided value, and emitting an `input` event.\n \n @warning\n * Only applicable when the input is searchable.\n \n @testOnly\n */\n @Method()\n searchOptions(query: string) {\n if (!this.searchable) return;\n\n const { innerInputField } = this;\n innerInputField.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n innerInputField.value = query;\n innerInputField.dispatchEvent(new InputEvent('input'));\n }\n\n /// Listeners ///\n @Listen('keydown')\n keydownHandler(event: KeyboardEvent) {\n this.inputKeydownHandler(event);\n }\n\n @Listen('change')\n onHostElementChange(event: CustomEvent<{ value: string; selectedOptions: string[] }>) {\n if (this.readonly \|\| this.disabled) return;\n if (event.target !== this.hostElement \|\| this.hostElement.onchange) return;\n if (this.multiple) {\n this.value = null;\n this.selectedOptions = event.detail.selectedOptions;\n } else {\n this.value = event.detail.value;\n this.selectedOptions = [];\n }\n }\n\n @Listen('clear')\n onClearHandler() {\n this.clearValue();\n }\n\n @Listen('input')\n onHostElementInput(event: CustomEvent) {\n if (!this.searchable \|\| event.target !== this.hostElement \|\| this.hostElement.oninput) return;\n const options = this.optionElements;\n const query = this.searchText.trim().toLocaleLowerCase();\n let matchedCount = 0;\n options.forEach(option => {\n if (query === '') {\n option.hidden = false;\n return;\n }\n\n const title =\n option.firstElementChild?.tagName === 'Q2-CARD'\n ? (option.firstElementChild as HTMLQ2CardElement).title\n : null;\n const { display = '', innerText = '' } = option;\n const searchParams = [display, title, innerText];\n const matched = searchParams.some(text => text?.toLocaleLowerCase().includes(query) ?? false);\n\n option.hidden = !matched;\n if (matched) matchedCount++;\n });\n\n const statusMessageLocString = query\n ? 'tecton.element.select.searchable.results'\n : 'tecton.element.select.allOptions';\n const count = query ? matchedCount : options.length;\n this.setStatusMessage(loc(statusMessageLocString, [count]));\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n const fromHost = isRelatedTargetWithinHost(event, this.hostElement);\n const prioritizeSearch = (this.prioritizeSearch = fromHost && this.searchable);\n if (prioritizeSearch) {\n this.clearSelectedDisplay();\n } else if (isEventFromElement(event, this.hostElement)) {\n this.inputField.shadowRoot.querySelector<HTMLElement>('.input-field').focus();\n }\n }\n\n @Listen('focusout')\n handleFocusout(event: FocusEvent) {\n const isLeavingHost = isHostLosingFocus(event, this.hostElement);\n if (isLeavingHost) this.closeDropdown();\n this.prioritizeSearch = !isLeavingHost && this.searchable;\n }\n\n @Listen('displayChanged')\n handleSelectedDisplay(event: CustomEvent) {\n if (this.multiple) return;\n this.inputField.value = event.detail.display;\n }\n\n /// Helpers ///\n async executeActionSheet(event: MouseEvent \| KeyboardEvent) {\n const result = await showActionSheetList(this, event);\n this.handleSelectionChanges(result);\n }\n\n handleSelectionChanges(changeDetails: { value?: string; values?: IOptionValue[] }) {\n const { value = '', values = [] } = changeDetails;\n const selectedOptionValues = values.map(value => value.value);\n const { multiple } = this;\n if (!this.hostElement.onchange) {\n this.selectedOptions = selectedOptionValues;\n }\n\n this.change.emit({\n value: multiple ? undefined : value,\n selectedOptions: multiple ? selectedOptionValues : undefined,\n });\n }\n\n showSelectedOptions = () => {\n this.showSelected = true;\n };\n\n showAllOptions = () => {\n this.showSelected = false;\n };\n\n clearValue() {\n const { multiple } = this;\n this.value = '';\n this.selectedOptions = [];\n this.change.emit({ value: multiple ? undefined : '', selectedOptions: multiple ? [] : undefined });\n }\n\n calculateMultiSelectSelectedDisplay() {\n const { firstSelectedOptionElement, firstSelectedValue, multilineOptions } = this;\n if (!firstSelectedValue) return '';\n if (firstSelectedOptionElement?.display) return loc(firstSelectedOptionElement.display);\n if (multilineOptions && this.searchable) return this.searchText;\n if (multilineOptions) return '';\n return (\n firstSelectedOptionElement?.textContent?.trim() ?? firstSelectedOptionElement?.value ?? firstSelectedValue\n );\n }\n\n calculateSingleSelectSelectedDisplay() {\n const { firstSelectedOptionElement, multilineOptions } = this;\n if (multilineOptions) {\n return (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) \|\| this.value \|\| '';\n } else {\n return (\n (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) \|\|\n firstSelectedOptionElement?.textContent?.trim() \|\|\n this.value \|\|\n ''\n );\n }\n }\n\n onMutationObserved = () => {\n const { hostElement, hasPopoverTop, hasPopoverBottom } = this;\n const slotContainer = hostElement.querySelector('.custom-display-content');\n const displaySlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"q2-select-display\"]');\n const hasCustomDisplay = !!displaySlot\n ? displaySlot.assignedNodes().length > 0\n : slotContainer.children.length > 0;\n\n if (this.hasCustomDisplay !== hasCustomDisplay) {\n this.hasCustomDisplay = hasCustomDisplay;\n }\n\n const popTopSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-top\"]');\n const topSlotHasNode = popTopSlot.assignedNodes().length > 0;\n if (hasPopoverTop !== topSlotHasNode) {\n this.hasPopoverTop = topSlotHasNode;\n }\n\n const popBottomSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-bottom\"]');\n const bottomSlotHasNode = popBottomSlot.assignedNodes().length > 0;\n if (hasPopoverBottom !== bottomSlotHasNode) {\n this.hasPopoverBottom = bottomSlotHasNode;\n }\n\n this.checkSelectedOptions();\n };\n\n onOptionListChange = (event: Q2OptionListCustomEvent<{ value: string; values: IOptionValue[] }>) => {\n event.stopPropagation();\n const { values } = event.detail;\n\n if (values.length === 0) this.showAllOptions();\n this.handleSelectionChanges(event.detail);\n };\n\n openDropdownWithoutActiveElement() {\n if (this.readonly \|\| this.disabled) return;\n this.optionList.setActiveElement(null);\n this.open = true;\n }\n\n closeDropdown() {\n this.open = false;\n this.clearSearchText();\n }\n\n clearSearchText() {\n if (!this.searchText) return;\n this.searchText = '';\n this.input.emit({ query: '' });\n }\n\n toggleDropdown() {\n if (this.readonly \|\| this.disabled) return;\n\n if (this.open && !this.searchText) {\n this.closeDropdown();\n } else {\n this.openDropdownWithoutActiveElement();\n }\n }\n\n focusInput() {\n this.inputField?.dispatchEvent(new FocusEvent('focus'));\n }\n\n statusMessageTimer: NodeJS.Timeout;\n setStatusMessage(message) {\n clearTimeout(this.statusMessageTimer);\n this.statusMessage = '';\n this.statusMessageTimer = setTimeout(() => {\n this.statusMessage = message;\n }, 1000);\n }\n\n checkSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n this.optionElements.forEach(option => {\n if (multiple) {\n option.selected = selectedOptions.includes(option.value);\n } else {\n option.selected = option.value === value;\n }\n });\n }\n\n clearSelectedDisplay() {\n this.selectedDisplaySlot?.remove();\n }\n\n checkSelectedDisplay() {\n let namedSlot = this.selectedDisplaySlot;\n const { value, multiple, selectedOptions, multilineOptions, firstSelectedOptionElement, prioritizeSearch } =\n this;\n const hasNoValue = !value && multiple && !selectedOptions?.length;\n if (prioritizeSearch \|\| !multilineOptions \|\| hasNoValue) return this.clearSelectedDisplay();\n\n if (!firstSelectedOptionElement \|\| firstSelectedOptionElement.display) return this.clearSelectedDisplay();\n\n // Clone selected option and remove elements with hide-on-select attribute\n const selectionClone = firstSelectedOptionElement.firstElementChild.cloneNode(true) as HTMLElement;\n selectionClone.querySelectorAll('[hide-on-select]').forEach(element => element.remove());\n\n if (namedSlot) {\n const height = namedSlot.clientHeight === 0 ? 'auto' : `${namedSlot.clientHeight}px`;\n namedSlot.style.setProperty('--comp-selected-display-height', height);\n if (namedSlot.firstElementChild.outerHTML !== selectionClone.outerHTML) {\n namedSlot.replaceChild(selectionClone, namedSlot.firstElementChild);\n }\n } else {\n namedSlot = document.createElement('div');\n namedSlot.slot = '_selected-display';\n namedSlot.appendChild(selectionClone);\n this.hostElement.appendChild(namedSlot);\n }\n return namedSlot;\n }\n\n checkSelectedDisplayHeight() {\n const { selectedDisplaySlot } = this;\n if (!selectedDisplaySlot) return;\n selectedDisplaySlot.style.setProperty('--comp-selected-display-height', '44px');\n }\n\n /// Event handlers ///\n onPopoverState = ({\n detail: { open, action },\n }: CustomEvent<{ open: boolean; action: 'close' \| 'select' \| 'open' }>) => {\n if (!open \|\| this.searchText) {\n if (action !== 'select') {\n this.optionList.setActiveElement(null);\n }\n this.inputField.focus();\n }\n\n if (this.open === open) return;\n this.open = open;\n };\n\n inputKeydownHandler = (event: KeyboardEvent) => {\n if (this.readonly \|\| this.disabled) return;\n const key = event.key;\n const hasSlot = this.hasPopoverTop \|\| this.hasPopoverBottom;\n const isShiftTab = key === 'Tab' && event.shiftKey;\n if (hasSlot && (key === 'Tab' \|\| key === 'Enter' \|\| isShiftTab)) return;\n if (shouldShowActionSheet(this, event)) {\n return this.executeActionSheet(event);\n }\n\n const keysForOptionListToHandle = [\n 'ArrowDown',\n 'ArrowUp',\n 'PageDown',\n 'PageUp',\n 'Home',\n 'End',\n 'Escape',\n 'Tab',\n ];\n if (this.searchable && !keysForOptionListToHandle.includes(key)) return;\n if (this.shouldClearSearchText(event)) this.clearSearchText();\n\n // Prevent click event from firing when spacebar is pressed\n if (key === ' ') event.preventDefault();\n\n this.optionList.handleExternalKeydown(event);\n };\n\n shouldClearSearchText(event: KeyboardEvent) {\n return this.searchable && !!this.searchText && event.key === 'Escape';\n }\n\n visibilityToggleKeyDown = (event: KeyboardEvent) => {\n const key = event.key;\n const isShiftTab = key === 'Tab' && event.shiftKey;\n const isRadioControlKey = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'].includes(key);\n if (isRadioControlKey) event.stopPropagation();\n if (isShiftTab) {\n event.stopPropagation();\n // allows shift+tab keys to select the top slot when present\n if (this.hasPopoverTop) return;\n\n this.optionList.setDefaultActiveElement();\n }\n };\n\n inputClickHandler = async (event: MouseEvent) => {\n event.stopPropagation();\n if (shouldShowActionSheet(this)) {\n return this.executeActionSheet(event);\n }\n this.toggleDropdown();\n this.focusInput();\n };\n\n inputInputHandler = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n event.stopPropagation();\n const eventValue = event.detail.value;\n const shouldClearValue = !!this.value;\n\n if (shouldClearValue) this.clearValue();\n if (!this.open) this.openDropdownWithoutActiveElement();\n\n this.prioritizeSearch = true;\n this.searchText = eventValue;\n this.input.emit({ query: eventValue });\n };\n\n inputFocusHandler = () => {\n this.inputFocused = true;\n };\n\n inputBlurHandler = () => {\n this.inputFocused = false;\n };\n\n inputChangeHandler = (event: Event) => {\n event.stopPropagation();\n };\n\n clickedElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName !== 'click-elsewhere') return;\n event.stopPropagation();\n };\n\n onCustomDisplayClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.focusInput();\n this.toggleDropdown();\n };\n\n /// DOM ///\n renderCustomDisplay() {\n const hasSelectedDisplay = this.checkSelectedDisplay();\n if (!hasSelectedDisplay) return;\n this.checkSelectedDisplayHeight();\n\n return (\n <slot\n name=\"_selected-display\"\n slot=\"custom-display\"\n />\n );\n }\n\n render() {\n return (\n <click-elsewhere\n class={this.wrapperClasses}\n onChange={this.clickedElsewhere}\n >\n <div\n aria-live=\"polite\"\n aria-atomic=\"true\"\n role=\"status\"\n class=\"sr\"\n >\n {this.statusMessage}\n </div>\n <q2-input\n ref={el => (this.inputField = el)}\n class=\"q2-select-input\"\n label={(this.label && loc(this.label)) \|\| ''}\n value={this.selectedDisplay}\n clearable={(this.clearable && (!!this.value \|\| !!this.selectedOptions?.length)) \|\| undefined}\n errors={\n (Array.isArray(this.errors) &&\n this.errors.length > 0 &&\n this.errors.map(error => loc(error))) \|\|\n (this.invalid && ['tecton.element.select.invalid']) \|\|\n []\n }\n disabled={this.disabled}\n optional={this.optional}\n readonly={!!this.readonly}\n placeholder={this.placeholder \|\| undefined}\n hideLabel={this.hideLabel}\n ariaExpanded={`${this.open}`}\n ariaControls=\"option-list\"\n ariaHaspopup=\"listbox\"\n test-id=\"toggleDropdown\"\n hide-messages\n iconRight=\"chevron-down\"\n onClick={this.inputClickHandler}\n onInput={this.inputInputHandler}\n onKeyDown={this.inputKeydownHandler}\n onFocus={this.inputFocusHandler}\n onBlur={this.inputBlurHandler}\n onChange={this.inputChangeHandler}\n badgeValue={this.badgeValue}\n badgeTheme={this.inputFocused ? 'primary' : undefined}\n _role=\"combobox\"\n _preventEntry={!this.searchable}\n >\n {this.renderCustomDisplay()}\n </q2-input>\n <div\n class=\"custom-display-content\"\n hidden={!this.hasCustomDisplay \|\| !!this.searchText}\n onClick={this.onCustomDisplayClick}\n >\n <slot name=\"q2-select-display\" />\n </div>\n {this.optionsDropdown()}\n </click-elsewhere>\n );\n }\n\n optionsDropdown() {\n return (\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.innerInputContainer}\n open={this.open}\n minHeight={this.popoverMinHeight}\n direction={this.popDirection}\n mode={this.popoverMode \|\| undefined}\n block\n >\n <div class=\"popover-content\">\n <q2-option-list\n onPopoverState={this.onPopoverState}\n ref={el => (this.optionList = el)}\n type=\"listbox\"\n id=\"option-list\"\n show-selected={this.showSelected}\n label={this.listLabel}\n multiple={this.multiple}\n selectedOptions={this.structuredSelectedOptions}\n onChange={this.onOptionListChange}\n >\n <slot />\n </q2-option-list>\n <div\n class=\"popover-top-container\"\n ref={el => (this.popoverTopContainer = el)}\n hidden={!this.multiple && !this.hasPopoverTop}\n tabindex=\"-1\"\n >\n <slot name=\"popover-top\"></slot>\n {this.multiple && this.visibilityToggle()}\n </div>\n </div>\n <div\n class=\"popover-bottom-container\"\n hidden={!this.hasPopoverBottom}\n tabindex=\"-1\"\n >\n <slot name=\"popover-bottom\" />\n </div>\n </q2-popover>\n );\n }\n\n visibilityToggle() {\n const selectedOptionsCount = this.selectedOptions?.length ?? 0;\n const { showSelected } = this;\n return (\n <div class=\"multi-select-header\">\n <fieldset>\n <legend aria-label={loc('tecton.element.select.multiHeader.showing')}>\n {loc('tecton.element.select.multiHeader.showing')}\n </legend>\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"all\"\n name=\"viewDisplay\"\n value=\"all\"\n checked={!showSelected}\n aria-label={loc('tecton.element.select.multiHeader.allAriaLabel')}\n test-id=\"allOptionsButton\"\n onClick={this.showAllOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"all\">{loc('tecton.element.select.multiHeader.all')}</label>\n </div>\n\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"selected\"\n disabled={selectedOptionsCount === 0}\n name=\"viewDisplay\"\n value=\"selected\"\n aria-label={loc('tecton.element.select.multiHeader.selectedAriaLabel', [\n selectedOptionsCount,\n ])}\n checked={showSelected}\n test-id=\"selectedOptionsButton\"\n onClick={this.showSelectedOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"selected\">\n {loc('tecton.element.select.multiHeader.selected', [selectedOptionsCount])}\n </label>\n </div>\n </fieldset>\n </div>\n );\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["q2SelectCss","Q2SelectStyle0","Q2Select","this","scheduledAfterRender","showSelectedOptions","showSelected","showAllOptions","onMutationObserved","hostElement","hasPopoverTop","hasPopoverBottom","slotContainer","querySelector","displaySlot","shadowRoot","hasCustomDisplay","assignedNodes","length","children","popTopSlot","topSlotHasNode","popBottomSlot","bottomSlotHasNode","checkSelectedOptions","onOptionListChange","event","stopPropagation","values","detail","handleSelectionChanges","onPopoverState","open","action","searchText","optionList","setActiveElement","inputField","focus","inputKeydownHandler","readonly","disabled","key","hasSlot","isShiftTab","shiftKey","shouldShowActionSheet","executeActionSheet","keysForOptionListToHandle","searchable","value","preventDefault","openDropdownWithoutActiveElement","includes","shouldClearSearchText","clearSearchText","handleExternalKeydown","visibilityToggleKeyDown","isRadioControlKey","setDefaultActiveElement","inputClickHandler","async","toggleDropdown","focusInput","inputInputHandler","eventValue","shouldClearValue","clearValue","prioritizeSearch","input","emit","query","inputFocusHandler","inputFocused","inputBlurHandler","inputChangeHandler","clickedElsewhere","target","localName","onCustomDisplayClick","_a","window","Tecton","useActionSheets","loc","componentWillLoad","handleAriaLabel","buildStructuredSelectedOptions","handleMultilineOptionsUpdate","multilineOptions","componentDidLoad","observer","MutationObserver","observe","childList","subtree","mutationObserver","overrideFocus","setTimeout","checkSelectedDisplay","componentDidRender","forEach","fn","disconnectedCallback","disconnect","innerInputField","_b","innerInputContainer","badgeValue","multiple","optionsLength","selectedOptions","popoverMinHeight","minRows","firstOption","minHeight","getComputedStyle","parseInt","selectedDisplay","calculateMultiSelectSelectedDisplay","calculateSingleSelectSelectedDisplay","selectedDisplaySlot","firstSelectedValue","firstSelectedOptionElement","optionElements","find","Array","from","querySelectorAll","wrapperClasses","errors","classes","isArray","push","join","structuredSelectedOptions","map","option","ariaLabelObserver","valueUpdated","newValue","oldValue","element","multiline","openChanged","isOpen","waitForNextPaint","popoverTopContainer","popoverElement","height","offsetHeight","style","setProperty","removeProperty","_togglePopover","click","dispatchEvent","FocusEvent","openPopover","closePopover","setValue","options","valuesSet","Set","searchOptions","InputEvent","keydownHandler","onHostElementChange","onchange","onClearHandler","onHostElementInput","oninput","trim","toLocaleLowerCase","matchedCount","hidden","title","firstElementChild","tagName","display","innerText","searchParams","matched","some","text","statusMessageLocString","count","setStatusMessage","delegateFocus","fromHost","isRelatedTargetWithinHost","clearSelectedDisplay","isEventFromElement","handleFocusout","isLeavingHost","isHostLosingFocus","closeDropdown","handleSelectedDisplay","result","showActionSheetList","changeDetails","selectedOptionValues","change","undefined","_c","textContent","message","clearTimeout","statusMessageTimer","statusMessage","selected","remove","namedSlot","hasNoValue","selectionClone","cloneNode","clientHeight","outerHTML","replaceChild","document","createElement","slot","appendChild","checkSelectedDisplayHeight","renderCustomDisplay","hasSelectedDisplay","h","name","render","class","onChange","role","ref","el","label","clearable","error","invalid","optional","placeholder","hideLabel","ariaExpanded","ariaControls","ariaHaspopup","iconRight","onClick","onInput","onKeyDown","onFocus","onBlur","badgeTheme","_role","_preventEntry","optionsDropdown","controlElement","direction","popDirection","mode","popoverMode","block","type","id","listLabel","tabindex","visibilityToggle","selectedOptionsCount","checked","htmlFor"],"sources":["src/components/q2-select/q2-select.scss?tag=q2-select&encapsulation=shadow","src/components/q2-select/q2-select.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n@import '../../styles/dropdowns';\n\n:host {\n --comp-select-margin: #{var-list(\n --tct-select-margin,\n unquote(\n '#{var-list(var-prefixer(select-margin-top), --app-scale-4, 30px)} 0 #{var-list(var-prefixer(select-margin-bottom), --app-scale-4, 30px)}'\n )\n )};\n display: block;\n margin: var(--comp-select-margin);\n}\n\n.q2-select-container {\n position: relative;\n display: block;\n}\n\n.q2-select-input {\n margin: 0;\n\n --tct-input-min-height: #{var-list(var-prefixer(select-input-min-height))};\n --tct-input-max-height: #{var-list(var-prefixer(select-input-max-height), none)};\n}\n\n::slotted([slot='_selected-display']) {\n width: 100%;\n min-height: var(--comp-selected-display-height, 44px);\n}\n\n.custom-display-content {\n position: absolute;\n bottom: 0;\n left: calc(var-list(--tct-scale-2, --app-scale-2x, 10px) + 1px);\n height: 44px;\n width: calc(100% - 34px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n overflow: hidden;\n cursor: pointer;\n transition: left var-list(--tct-tween-2, --app-tween-1, unquote('0.2s ease'));\n}\n\n.custom-display-content:not([hidden]) {\n display: flex;\n align-items: center;\n}\n\n.is-searchable.is-focused .custom-display-content,\n.is-searchable .custom-display-content:active {\n left: calc(var-list(--tct-scale-3, --app-scale-3x, 15px) + 1px);\n}\n\n.has-error .custom-display-content {\n width: calc(100% - 68px - var-list(--tct-scale-3, --app-scale-3x, 15px));\n}\n\n.popover-content {\n display: flex;\n flex-direction: column-reverse;\n}\n\n.popover-bottom-container {\n position: sticky;\n bottom: 0;\n z-index: 5;\n}\n\n.popover-top-container {\n position: sticky;\n top: 0;\n z-index: 5;\n .multi-select-header {\n padding: var(--tct-scale-2, var(--app-scale-2x, 10px)) var(--tct-scale-2, var(--app-scale-2x, 10px));\n background: var(--app-white);\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n align-items: center;\n\n fieldset {\n margin: 0;\n padding: 0;\n border: 0;\n display: flex;\n gap: var-list(--app-scale-2x, 10px);\n }\n\n legend {\n padding: 0;\n float: left;\n }\n\n label {\n cursor: pointer;\n padding: var-list(\n var-prefixer(select-multi-select-option-padding),\n var-prefixer(btn-badge-padding),\n unquote('2px 5px')\n );\n font-size: var-list(\n var-prefixer(select-multi-select-option-font-size),\n var-prefixer(btn-badge-font-size),\n inherit\n );\n border-radius: var-list(\n var-prefixer(select-multi-select-option-radius),\n var-prefixer(btn-badge-border-radius),\n --app-border-radius-1,\n 3px\n );\n background: var-list(\n --tct-select-multi-select-option-background,\n var-prefixer(select-multi-select-option-bg),\n --tct-badge-background,\n var-prefixer(btn-badge-bg),\n transparent\n );\n color: var-list(\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-font-color),\n inherit\n );\n\n &:hover {\n background: var-list(\n --tct-select-multi-select-option-hover-background,\n var-prefixer(select-multi-select-option-hover-background-color),\n var-prefixer(btn-badge-hover-bg),\n var-prefixer(gray-14),\n --app-gray-l3,\n #f2f2f2\n );\n color: var-list(\n --tct-select-multi-select-option-hover-color,\n var-prefixer(select-multi-select-option-color),\n var-prefixer(btn-badge-hover-font-color),\n var-prefixer(gray-5),\n --app-gray-d2,\n #404040\n );\n }\n }\n\n input {\n &:checked + label {\n &,\n &:enabled:hover {\n background: var-list(\n --tct-select-multi-select-option-active-background,\n var-prefixer(select-multi-select-option-active-background-color),\n var-prefixer(btn-primary-bg),\n #2e2e2e\n );\n color: var-list(\n var-prefixer(select-multi-select-option-active-color),\n var-prefixer(btn-primary-font-color),\n --app-white,\n #ffffff\n );\n }\n }\n\n &:disabled + label {\n opacity: var-list(\n var-prefixer(select-multi-select-option-disabled-opacity),\n var-prefixer(btn-disabled-opacity),\n --app-disabled-opacity,\n 0.4\n );\n cursor: not-allowed;\n }\n\n &:focus + label {\n box-shadow: var(--const-double-focus-ring);\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n Element,\n h,\n Listen,\n State,\n EventEmitter,\n Event,\n ComponentInterface,\n Watch,\n Method,\n} from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent, Q2OptionListCustomEvent } from 'src/components';\nimport {\n handleAriaLabel,\n isEventFromElement,\n isHostLosingFocus,\n isRelatedTargetWithinHost,\n loc,\n overrideFocus,\n waitForNextPaint,\n} from '../../utils';\nimport { IOptionValue } from '../q2-option-list/q2-option-list';\nimport { shouldShowActionSheet, showActionSheetList } from 'src/utils/action-sheet';\n\n@Component({ tag: 'q2-select', shadow: true, styleUrl: 'q2-select.scss' })\nexport class Q2Select implements ComponentInterface {\n /** Disables all interaction with the field and leverages the disabled visual style of `q2-input`. /\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /\n The presence of `errors` will mark the field as invalid, putting it into an error state.\n * @localizable\n /\n @Prop() errors: string[];\n\n /\n Hide's the field's `<label>` element from view.\n * @warning\n * Only use when a visible label is impractical.\n /\n @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n\n /* Renders an icon button when the field is non-empty. Pressing the button clears all input from the field. /\n @Prop({ reflect: true }) clearable: boolean;\n\n /\n Instructs the component to use the action sheet workflow for displaying its options.\n \n For more information, see [Action Sheets](https://tecton.q2developer.com/guides/action-sheets/).\n * @warning\n * If your `q2-select` renders inside of an iframe, and you are using multiline/robust content options,\n * any custom CSS you apply to your options will not get passed up to the platform which displays the action sheet.\n * For this reason, we strongly suggest using the [q2-card](https://tecton.q2developer.com/ui/q2-card/) component since its styling is managed by Tecton.\n /\n @Prop() hoist: boolean = !!window.Tecton?.useActionSheets;\n\n /* Determines whether to show an error state. Its primary use-case is for an unfilled field. /\n @Prop({ reflect: true }) invalid: boolean;\n\n /\n The text that will be used as the label for the field.\n * @localizable\n /\n @Prop({ reflect: true, mutable: true }) label: string;\n\n /\n Determines the label that is applied to the option list for accessibility purposes.\n * @localizable\n /\n @Prop() listLabel: string = loc('tecton.element.select.listLabel');\n\n /* The minimum number of rows the component will try to display below or above the component when opened. /\n @Prop() minRows: number = 3;\n\n /* Enables text wrapping for `q2-option` elements. When `false`, the text truncates and does not wrap. /\n @Prop({ reflect: true }) multilineOptions: boolean = false;\n\n /* Enables multi-select functionality. /\n @Prop({ reflect: true }) multiple: boolean = false;\n\n /* Appends \"(optional)\" to the field label, and sets `aria-required` on the nested input tag to `false`. /\n @Prop({ reflect: true }) optional: boolean = false;\n\n /\n Text that appears within the field when it is blurred and empty.\n * Placeholder text disappears when the user selects an option.\n * @localizable\n /\n @Prop({ reflect: true }) placeholder: string;\n\n /* @deprecated /\n @Prop({ reflect: true }) popDirection: 'up' \| 'down';\n\n /\n Determines the display mode of the popover.\n \n Providing a value of `legacy` instructs the popover to use absolute positioning instead of fixed positioning.\n \n @info\n * This is a temporary solution to work around styling issues related to using fixed positioning for the popover\n * when nested inside of elements with transform properties. This will be removed once the popover API is available\n * for use.\n /\n @Prop({ mutable: true }) popoverMode: 'legacy' = null;\n\n /\n Appends \"(read only)\" to the field label, and field becomes unusable, but remains focusable.\n * Takes priority over `optional` if both are `true`.\n /\n @Prop({ reflect: true }) readonly: boolean = false;\n\n /* Enables search functionality. /\n @Prop({ reflect: true }) searchable: boolean = false;\n\n /\n Each item in this array should correspond to the value of a `q2-option` element.\n * This property is only relevant for `multiple` (i.e., multi-select) implementations.\n /\n @Prop({ mutable: true }) selectedOptions: string[] = [];\n\n /\n The current value for the select. This should correspond to the value of a nested q2-option element.\n * This property is only relevant for single-select implementations.\n /\n @Prop({ mutable: true }) value: string;\n\n /* @deprecated /\n @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n @Element() hostElement: HTMLElement;\n\n @State() open: boolean = false;\n @State() showSelected: boolean = false;\n @State() searchText: string = '';\n @State() hasCustomDisplay: boolean = false;\n @State() hasPopoverTop: boolean = false;\n @State() hasPopoverBottom: boolean = false;\n @State() inputFocused: boolean = false;\n @State() statusMessage: string;\n @State() prioritizeSearch: boolean = false;\n @State() structuredSelectedOptions: IOptionValue[] = [];\n\n inputField?: HTMLQ2InputElement;\n optionList: HTMLQ2OptionListElement;\n popoverElement?: HTMLQ2PopoverElement;\n popoverTopContainer?: HTMLDivElement;\n scheduledAfterRender: (() => void)[] = [];\n mutationObserver: MutationObserver;\n\n /// Lifecycle Hooks ///\n componentWillLoad() {\n handleAriaLabel(this);\n this.buildStructuredSelectedOptions();\n this.handleMultilineOptionsUpdate(this.multilineOptions, false);\n }\n\n componentDidLoad() {\n const observer = new MutationObserver(this.onMutationObserved);\n observer.observe(this.hostElement, { childList: true, subtree: true });\n this.mutationObserver = observer;\n this.onMutationObserved();\n overrideFocus(this.hostElement);\n setTimeout(() => this.checkSelectedDisplay(), 0);\n }\n\n componentDidRender() {\n setTimeout(() => {\n this.scheduledAfterRender.forEach(fn => fn());\n this.scheduledAfterRender = [];\n }, 25);\n }\n\n disconnectedCallback() {\n this.mutationObserver?.disconnect();\n this.mutationObserver = null;\n }\n\n /// Getters ///\n get innerInputField(): HTMLInputElement \| HTMLButtonElement {\n return this.inputField?.shadowRoot?.querySelector('.input-field');\n }\n\n get innerInputContainer(): HTMLElement {\n return this.inputField?.shadowRoot?.querySelector('.input-container');\n }\n\n get badgeValue(): string {\n if (!this.multiple) return null;\n const optionsLength = this.selectedOptions?.length ?? 0;\n if (this.open && this.searchable) return optionsLength ? `${optionsLength}` : null;\n else return optionsLength > 1 ? `+${optionsLength - 1}` : null;\n }\n\n get popoverMinHeight() {\n const { minRows } = this;\n const firstOption = this.hostElement.querySelector<HTMLQ2OptionElement>('q2-option:not([hidden])');\n let minHeight = firstOption && window.getComputedStyle(firstOption).minHeight;\n\n // Safari doesn't return a min-height for non-visible items\n if (!minHeight \|\| minHeight === '0px') minHeight = '44px';\n\n return minRows parseInt(minHeight);\n }\n\n get selectedDisplay() {\n if (this.prioritizeSearch \|\| this.searchText) return this.searchText;\n if (this.hasCustomDisplay) return '';\n return this.multiple ? this.calculateMultiSelectSelectedDisplay() : this.calculateSingleSelectSelectedDisplay();\n }\n\n get selectedDisplaySlot() {\n return this.hostElement.querySelector<HTMLElement>('[slot=\"_selected-display\"]');\n }\n\n get firstSelectedValue() {\n return this.multiple ? this.selectedOptions?.[0] : this.value;\n }\n\n get firstSelectedOptionElement() {\n const { firstSelectedValue } = this;\n return firstSelectedValue ? this.optionElements.find(({ value }) => value === firstSelectedValue) : null;\n }\n\n get optionElements() {\n return Array.from(this.hostElement.querySelectorAll<HTMLQ2OptionElement>('q2-option'));\n }\n\n get wrapperClasses() {\n const { errors } = this;\n const classes = ['q2-select-container'];\n if (Array.isArray(errors) && errors.length > 0) classes.push('has-error');\n if (this.inputFocused) classes.push('is-focused');\n if (this.searchable) classes.push('is-searchable');\n return classes.join(' ');\n }\n\n /// Watchers ///\n @Watch('value')\n @Watch('selectedOptions')\n buildStructuredSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n if (multiple) {\n this.structuredSelectedOptions = !!selectedOptions?.length\n ? selectedOptions.map(option => (typeof option === 'string' ? { value: option } : option))\n : [];\n } else {\n this.structuredSelectedOptions = value ? [{ value }] : [];\n }\n }\n\n @Watch('ariaLabel')\n ariaLabelObserver() {\n handleAriaLabel(this);\n }\n\n @Watch('value')\n valueUpdated() {\n if (this.multiple) return;\n this.clearSearchText();\n }\n\n @Watch('multilineOptions')\n handleMultilineOptionsUpdate(newValue, oldValue) {\n if (newValue === oldValue) return;\n this.optionElements.forEach(element => (element.multiline = newValue));\n }\n\n @Watch('open')\n openChanged(isOpen: boolean) {\n this.scheduledAfterRender.push(async () => {\n await waitForNextPaint();\n const { popoverTopContainer, popoverElement } = this;\n const height = (isOpen && popoverTopContainer?.offsetHeight) \|\| 0;\n if (height) {\n popoverElement.style.setProperty('--comp-popover-top-container-height', `${height}px`);\n } else {\n popoverElement.style.removeProperty('--comp-popover-top-container-height');\n }\n });\n }\n\n /// Events ///\n /*\n Emitted when an option is selected or deselected.\n \n When the multi-select is enabled, the `value` property will be `undefined` and the `selectedOptions` property\n * will contain the selected option values.\n \n @legacyEvent\n /\n @Event() change: EventEmitter<{ value: string; selectedOptions: string[] }>;\n\n /\n Emitted when the input value changes.\n \n Requires the `searchable` prop to be set to `true`.\n /\n @Event() input: EventEmitter<{ query: string }>;\n\n /// Methods ///\n _togglePopover() {\n const { innerInputField } = this;\n innerInputField?.click();\n innerInputField?.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n }\n\n /\n Emulates clicking the `<input>` to display the popover if it is hidden.\n \n @testOnly\n /\n @Method()\n async openPopover() {\n if (this.open \|\| this.disabled) return;\n this._togglePopover();\n }\n\n /\n Emulates clicking the `<input>` to hide the popover if it is visible.\n \n @testOnly\n /\n @Method()\n async closePopover() {\n if (!this.open \|\| this.disabled) return;\n this._togglePopover();\n }\n\n /\n Emulates clicking the `<input>` to display the popover and selecting the option(s) with the specified value(s).\n \n If the multi-select is enabled and the `closePopover` argument is `true` (default), the popover will be closed\n * after the option(s) are selected.\n \n @testOnly\n /\n @Method()\n async setValue(values: string \| string[], options: { closePopover?: boolean } = { closePopover: true }) {\n const valuesSet = new Set(Array.isArray(values) ? values : [values]);\n if (!this.open) {\n await this.openPopover();\n await waitForNextPaint();\n }\n\n valuesSet.forEach(value => {\n this.optionElements.find(option => option.value === value)?.click();\n });\n\n if (options.closePopover) {\n await this.closePopover();\n await waitForNextPaint();\n }\n }\n\n /\n Emulates focusing the `<input>`, entering the provided value, and emitting an `input` event.\n \n @warning\n * Only applicable when the input is searchable.\n \n @testOnly\n */\n @Method()\n searchOptions(query: string) {\n if (!this.searchable) return;\n\n const { innerInputField } = this;\n innerInputField.focus();\n innerInputField.dispatchEvent(new FocusEvent('focus'));\n innerInputField.value = query;\n innerInputField.dispatchEvent(new InputEvent('input'));\n }\n\n /// Listeners ///\n @Listen('keydown')\n keydownHandler(event: KeyboardEvent) {\n this.inputKeydownHandler(event);\n }\n\n @Listen('change')\n onHostElementChange(event: CustomEvent<{ value: string; selectedOptions: string[] }>) {\n if (this.readonly \|\| this.disabled) return;\n if (event.target !== this.hostElement \|\| this.hostElement.onchange) return;\n if (this.multiple) {\n this.value = null;\n this.selectedOptions = event.detail.selectedOptions;\n } else {\n this.value = event.detail.value;\n this.selectedOptions = [];\n }\n }\n\n @Listen('clear')\n onClearHandler() {\n this.clearValue();\n }\n\n @Listen('input')\n onHostElementInput(event: CustomEvent) {\n if (!this.searchable \|\| event.target !== this.hostElement \|\| this.hostElement.oninput) return;\n const options = this.optionElements;\n const query = this.searchText.trim().toLocaleLowerCase();\n let matchedCount = 0;\n options.forEach(option => {\n if (query === '') {\n option.hidden = false;\n return;\n }\n\n const title =\n option.firstElementChild?.tagName === 'Q2-CARD'\n ? (option.firstElementChild as HTMLQ2CardElement).title\n : null;\n const { display = '', innerText = '' } = option;\n const searchParams = [display, title, innerText];\n const matched = searchParams.some(text => text?.toLocaleLowerCase().includes(query) ?? false);\n\n option.hidden = !matched;\n if (matched) matchedCount++;\n });\n\n const statusMessageLocString = query\n ? 'tecton.element.select.searchable.results'\n : 'tecton.element.select.allOptions';\n const count = query ? matchedCount : options.length;\n this.setStatusMessage(loc(statusMessageLocString, [count]));\n }\n\n @Listen('focus')\n delegateFocus(event: FocusEvent) {\n const fromHost = isRelatedTargetWithinHost(event, this.hostElement);\n const prioritizeSearch = (this.prioritizeSearch = fromHost && this.searchable);\n if (prioritizeSearch) {\n this.clearSelectedDisplay();\n } else if (isEventFromElement(event, this.hostElement)) {\n this.inputField.shadowRoot.querySelector<HTMLElement>('.input-field').focus();\n }\n }\n\n @Listen('focusout')\n handleFocusout(event: FocusEvent) {\n const isLeavingHost = isHostLosingFocus(event, this.hostElement);\n if (isLeavingHost) this.closeDropdown();\n this.prioritizeSearch = !isLeavingHost && this.searchable;\n }\n\n @Listen('displayChanged')\n handleSelectedDisplay(event: CustomEvent) {\n if (this.multiple) return;\n this.inputField.value = event.detail.display;\n }\n\n /// Helpers ///\n async executeActionSheet(event: MouseEvent \| KeyboardEvent) {\n const result = await showActionSheetList(this, event);\n this.handleSelectionChanges(result);\n }\n\n handleSelectionChanges(changeDetails: { value?: string; values?: IOptionValue[] }) {\n const { value = '', values = [] } = changeDetails;\n const selectedOptionValues = values.map(value => value.value);\n const { multiple } = this;\n if (!this.hostElement.onchange) {\n this.selectedOptions = selectedOptionValues;\n }\n\n this.change.emit({\n value: multiple ? undefined : value,\n selectedOptions: multiple ? selectedOptionValues : undefined,\n });\n }\n\n showSelectedOptions = () => {\n this.showSelected = true;\n };\n\n showAllOptions = () => {\n this.showSelected = false;\n };\n\n clearValue() {\n const { multiple } = this;\n this.value = '';\n this.selectedOptions = [];\n this.change.emit({ value: multiple ? undefined : '', selectedOptions: multiple ? [] : undefined });\n }\n\n calculateMultiSelectSelectedDisplay() {\n const { firstSelectedOptionElement, firstSelectedValue, multilineOptions } = this;\n if (!firstSelectedValue) return '';\n if (firstSelectedOptionElement?.display) return loc(firstSelectedOptionElement.display);\n if (multilineOptions && this.searchable) return this.searchText;\n if (multilineOptions) return '';\n return (\n firstSelectedOptionElement?.textContent?.trim() ?? firstSelectedOptionElement?.value ?? firstSelectedValue\n );\n }\n\n calculateSingleSelectSelectedDisplay() {\n const { firstSelectedOptionElement, multilineOptions } = this;\n if (multilineOptions) {\n return (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) \|\| this.value \|\| '';\n } else {\n return (\n (firstSelectedOptionElement?.display && loc(firstSelectedOptionElement.display)) \|\|\n firstSelectedOptionElement?.textContent?.trim() \|\|\n this.value \|\|\n ''\n );\n }\n }\n\n onMutationObserved = () => {\n const { hostElement, hasPopoverTop, hasPopoverBottom } = this;\n const slotContainer = hostElement.querySelector('.custom-display-content');\n const displaySlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"q2-select-display\"]');\n const hasCustomDisplay = !!displaySlot\n ? displaySlot.assignedNodes().length > 0\n : slotContainer.children.length > 0;\n\n if (this.hasCustomDisplay !== hasCustomDisplay) {\n this.hasCustomDisplay = hasCustomDisplay;\n }\n\n const popTopSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-top\"]');\n const topSlotHasNode = popTopSlot.assignedNodes().length > 0;\n if (hasPopoverTop !== topSlotHasNode) {\n this.hasPopoverTop = topSlotHasNode;\n }\n\n const popBottomSlot = hostElement.shadowRoot.querySelector<HTMLSlotElement>('slot[name=\"popover-bottom\"]');\n const bottomSlotHasNode = popBottomSlot.assignedNodes().length > 0;\n if (hasPopoverBottom !== bottomSlotHasNode) {\n this.hasPopoverBottom = bottomSlotHasNode;\n }\n\n this.checkSelectedOptions();\n };\n\n onOptionListChange = (event: Q2OptionListCustomEvent<{ value: string; values: IOptionValue[] }>) => {\n event.stopPropagation();\n const { values } = event.detail;\n\n if (values.length === 0) this.showAllOptions();\n this.handleSelectionChanges(event.detail);\n };\n\n openDropdownWithoutActiveElement() {\n if (this.readonly \|\| this.disabled) return;\n this.optionList.setActiveElement(null);\n this.open = true;\n }\n\n closeDropdown() {\n this.open = false;\n this.clearSearchText();\n }\n\n clearSearchText() {\n if (!this.searchText) return;\n this.searchText = '';\n this.input.emit({ query: '' });\n }\n\n toggleDropdown() {\n if (this.readonly \|\| this.disabled) return;\n\n if (this.open && !this.searchText) {\n this.closeDropdown();\n } else {\n this.openDropdownWithoutActiveElement();\n }\n }\n\n focusInput() {\n this.inputField?.dispatchEvent(new FocusEvent('focus'));\n }\n\n statusMessageTimer: NodeJS.Timeout;\n setStatusMessage(message) {\n clearTimeout(this.statusMessageTimer);\n this.statusMessage = '';\n this.statusMessageTimer = setTimeout(() => {\n this.statusMessage = message;\n }, 1000);\n }\n\n checkSelectedOptions() {\n const { multiple, selectedOptions, value } = this;\n this.optionElements.forEach(option => {\n if (multiple) {\n option.selected = selectedOptions.includes(option.value);\n } else {\n option.selected = option.value === value;\n }\n });\n }\n\n clearSelectedDisplay() {\n this.selectedDisplaySlot?.remove();\n }\n\n checkSelectedDisplay() {\n let namedSlot = this.selectedDisplaySlot;\n const { value, multiple, selectedOptions, multilineOptions, firstSelectedOptionElement, prioritizeSearch } =\n this;\n const hasNoValue = !value && multiple && !selectedOptions?.length;\n if (prioritizeSearch \|\| !multilineOptions \|\| hasNoValue) return this.clearSelectedDisplay();\n\n if (!firstSelectedOptionElement \|\| firstSelectedOptionElement.display) return this.clearSelectedDisplay();\n\n // Clone selected option and remove elements with hide-on-select attribute\n const selectionClone = firstSelectedOptionElement.firstElementChild.cloneNode(true) as HTMLElement;\n selectionClone.querySelectorAll('[hide-on-select]').forEach(element => element.remove());\n\n if (namedSlot) {\n const height = namedSlot.clientHeight === 0 ? 'auto' : `${namedSlot.clientHeight}px`;\n namedSlot.style.setProperty('--comp-selected-display-height', height);\n if (namedSlot.firstElementChild.outerHTML !== selectionClone.outerHTML) {\n namedSlot.replaceChild(selectionClone, namedSlot.firstElementChild);\n }\n } else {\n namedSlot = document.createElement('div');\n namedSlot.slot = '_selected-display';\n namedSlot.appendChild(selectionClone);\n this.hostElement.appendChild(namedSlot);\n }\n return namedSlot;\n }\n\n checkSelectedDisplayHeight() {\n const { selectedDisplaySlot } = this;\n if (!selectedDisplaySlot) return;\n selectedDisplaySlot.style.setProperty('--comp-selected-display-height', '44px');\n }\n\n /// Event handlers ///\n onPopoverState = ({\n detail: { open, action },\n }: CustomEvent<{ open: boolean; action: 'close' \| 'select' \| 'open' }>) => {\n if (!open \|\| this.searchText) {\n if (action !== 'select') {\n this.optionList.setActiveElement(null);\n }\n this.inputField.focus();\n }\n\n if (this.open === open) return;\n this.open = open;\n };\n\n inputKeydownHandler = (event: KeyboardEvent) => {\n if (this.readonly \|\| this.disabled) return;\n const key = event.key;\n const hasSlot = this.hasPopoverTop \|\| this.hasPopoverBottom;\n const isShiftTab = key === 'Tab' && event.shiftKey;\n if (hasSlot && (key === 'Tab' \|\| key === 'Enter' \|\| isShiftTab)) return;\n if (shouldShowActionSheet(this, event)) {\n return this.executeActionSheet(event);\n }\n\n const keysForOptionListToHandle = [\n 'ArrowDown',\n 'ArrowUp',\n 'PageDown',\n 'PageUp',\n 'Home',\n 'End',\n 'Escape',\n 'Tab',\n ];\n\n if (this.searchable && (key === ' ' \|\| key === 'Enter') && this.inputField.value == '') {\n event.preventDefault();\n if (!this.open) this.openDropdownWithoutActiveElement();\n }\n\n if (this.searchable && !keysForOptionListToHandle.includes(key)) return;\n if (this.shouldClearSearchText(event)) this.clearSearchText();\n\n // Prevent click event from firing when spacebar is pressed\n if (key === ' ') event.preventDefault();\n\n this.optionList.handleExternalKeydown(event);\n };\n\n shouldClearSearchText(event: KeyboardEvent) {\n return this.searchable && !!this.searchText && event.key === 'Escape';\n }\n\n visibilityToggleKeyDown = (event: KeyboardEvent) => {\n const key = event.key;\n const isShiftTab = key === 'Tab' && event.shiftKey;\n const isRadioControlKey = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'].includes(key);\n if (isRadioControlKey) event.stopPropagation();\n if (isShiftTab) {\n event.stopPropagation();\n // allows shift+tab keys to select the top slot when present\n if (this.hasPopoverTop) return;\n\n this.optionList.setDefaultActiveElement();\n }\n };\n\n inputClickHandler = async (event: MouseEvent) => {\n event.stopPropagation();\n if (shouldShowActionSheet(this)) {\n return this.executeActionSheet(event);\n }\n this.toggleDropdown();\n this.focusInput();\n };\n\n inputInputHandler = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n event.stopPropagation();\n const eventValue = event.detail.value;\n const shouldClearValue = !!this.value;\n\n if (shouldClearValue) this.clearValue();\n if (!this.open) this.openDropdownWithoutActiveElement();\n\n this.prioritizeSearch = true;\n this.searchText = eventValue;\n this.input.emit({ query: eventValue });\n };\n\n inputFocusHandler = () => {\n this.inputFocused = true;\n };\n\n inputBlurHandler = () => {\n this.inputFocused = false;\n };\n\n inputChangeHandler = (event: Event) => {\n event.stopPropagation();\n };\n\n clickedElsewhere = (event: CustomEvent) => {\n const target = event.target as HTMLClickElsewhereElement;\n if (target.localName !== 'click-elsewhere') return;\n event.stopPropagation();\n };\n\n onCustomDisplayClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.focusInput();\n this.toggleDropdown();\n };\n\n /// DOM ///\n renderCustomDisplay() {\n const hasSelectedDisplay = this.checkSelectedDisplay();\n if (!hasSelectedDisplay) return;\n this.checkSelectedDisplayHeight();\n\n return (\n <slot\n name=\"_selected-display\"\n slot=\"custom-display\"\n />\n );\n }\n\n render() {\n return (\n <click-elsewhere\n class={this.wrapperClasses}\n onChange={this.clickedElsewhere}\n >\n <div\n aria-live=\"polite\"\n aria-atomic=\"true\"\n role=\"status\"\n class=\"sr\"\n >\n {this.statusMessage}\n </div>\n <q2-input\n ref={el => (this.inputField = el)}\n class=\"q2-select-input\"\n label={(this.label && loc(this.label)) \|\| ''}\n value={this.selectedDisplay}\n clearable={(this.clearable && (!!this.value \|\| !!this.selectedOptions?.length)) \|\| undefined}\n errors={\n (Array.isArray(this.errors) &&\n this.errors.length > 0 &&\n this.errors.map(error => loc(error))) \|\|\n (this.invalid && ['tecton.element.select.invalid']) \|\|\n []\n }\n disabled={this.disabled}\n optional={this.optional}\n readonly={!!this.readonly}\n placeholder={this.placeholder \|\| undefined}\n hideLabel={this.hideLabel}\n ariaExpanded={`${this.open}`}\n ariaControls=\"option-list\"\n ariaHaspopup=\"listbox\"\n test-id=\"toggleDropdown\"\n hide-messages\n iconRight=\"chevron-down\"\n onClick={this.inputClickHandler}\n onInput={this.inputInputHandler}\n onKeyDown={this.inputKeydownHandler}\n onFocus={this.inputFocusHandler}\n onBlur={this.inputBlurHandler}\n onChange={this.inputChangeHandler}\n badgeValue={this.badgeValue}\n badgeTheme={this.inputFocused ? 'primary' : undefined}\n _role=\"combobox\"\n _preventEntry={!this.searchable}\n >\n {this.renderCustomDisplay()}\n </q2-input>\n <div\n class=\"custom-display-content\"\n hidden={!this.hasCustomDisplay \|\| !!this.searchText}\n onClick={this.onCustomDisplayClick}\n >\n <slot name=\"q2-select-display\" />\n </div>\n {this.optionsDropdown()}\n </click-elsewhere>\n );\n }\n\n optionsDropdown() {\n return (\n <q2-popover\n ref={el => (this.popoverElement = el)}\n controlElement={this.innerInputContainer}\n open={this.open}\n minHeight={this.popoverMinHeight}\n direction={this.popDirection}\n mode={this.popoverMode \|\| undefined}\n block\n >\n <div class=\"popover-content\">\n <q2-option-list\n onPopoverState={this.onPopoverState}\n ref={el => (this.optionList = el)}\n type=\"listbox\"\n id=\"option-list\"\n show-selected={this.showSelected}\n label={this.listLabel}\n multiple={this.multiple}\n selectedOptions={this.structuredSelectedOptions}\n onChange={this.onOptionListChange}\n >\n <slot />\n </q2-option-list>\n <div\n class=\"popover-top-container\"\n ref={el => (this.popoverTopContainer = el)}\n hidden={!this.multiple && !this.hasPopoverTop}\n tabindex=\"-1\"\n >\n <slot name=\"popover-top\"></slot>\n {this.multiple && this.visibilityToggle()}\n </div>\n </div>\n <div\n class=\"popover-bottom-container\"\n hidden={!this.hasPopoverBottom}\n tabindex=\"-1\"\n >\n <slot name=\"popover-bottom\" />\n </div>\n </q2-popover>\n );\n }\n\n visibilityToggle() {\n const selectedOptionsCount = this.selectedOptions?.length ?? 0;\n const { showSelected } = this;\n return (\n <div class=\"multi-select-header\">\n <fieldset>\n <legend aria-label={loc('tecton.element.select.multiHeader.showing')}>\n {loc('tecton.element.select.multiHeader.showing')}\n </legend>\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"all\"\n name=\"viewDisplay\"\n value=\"all\"\n checked={!showSelected}\n aria-label={loc('tecton.element.select.multiHeader.allAriaLabel')}\n test-id=\"allOptionsButton\"\n onClick={this.showAllOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"all\">{loc('tecton.element.select.multiHeader.all')}</label>\n </div>\n\n <div>\n <input\n class=\"sr\"\n type=\"radio\"\n id=\"selected\"\n disabled={selectedOptionsCount === 0}\n name=\"viewDisplay\"\n value=\"selected\"\n aria-label={loc('tecton.element.select.multiHeader.selectedAriaLabel', [\n selectedOptionsCount,\n ])}\n checked={showSelected}\n test-id=\"selectedOptionsButton\"\n onClick={this.showSelectedOptions}\n onKeyDown={this.visibilityToggleKeyDown}\n />\n <label htmlFor=\"selected\">\n {loc('tecton.element.select.multiHeader.selected', [selectedOptionsCount])}\n </label>\n </div>\n </fieldset>\n </div>\n );\n }\n}\n"],"mappings":"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"}

package/dist/q2-tecton-elements/{p-774975fa.entry.js → p-6fdda37e.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as t,c as e,h as i,g as a}from"./p-a5f18e27.js";import{r as n,o as s,i as r,n as o,l as c}from"./p-84190698.js";const d="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block;background:var(--tct-section-background, var(--tct-section-background-color, var(--t-section-background-color, var(--tct-section-bg, var(--t-section-bg, var(--app-white, #ffffff))))));color:var(--tct-section-font-color, var(--t-section-font-color, var(--t-text, #4d4d4d)));border-radius:var(--tct-section-border-radius, var(--t-section-border-radius, var(--app-border-radius-1, 3px)));margin:var(--tct-section-margin, var(--t-section-margin, var(--app-scale-3x, 15px)));border-width:var(--tct-section-border-width, 0);border-style:var(--tct-section-border-style, solid);border-color:var(--tct-section-border-color, none)}@media screen and (max-width: 767px){:host{--comp-default-margin:var(--app-scale-3x, 15px) 0;margin:var(--tct-section-margin, var(--t-section-margin, var(--comp-default-margin)))}}@media print{:host{--comp-default-print-margin:var(--app-scale-3x, 15px) 0;margin:var(--tct-section-print-margin, var(--comp-default-print-margin))}}.wrapper{--comp-tween:var(--tct-section-tween, var(--t-section-tween, var(--app-tween-1, 0.2s ease)));--comp-default-wrapper-padding:var(--app-scale-1x, 5px) 0;display:block;padding:var(--tct-section-wrapper-padding, var(--t-section-wrapper-padding, var(--comp-default-wrapper-padding)))}.wrapper:hover{box-shadow:var(--tct-section-wrapper-hover-box-shadow, var(--t-section-wrapper-hover-box-shadow, inherit))}:host([collapsible]) .wrapper{--comp-tween:var(--tct-section-tween, var(--t-section-tween, var(--app-tween-2, 0.4s ease)))}header{--comp-default-header-padding:0 var(--app-scale-3x, 15px);padding:var(--tct-section-header-padding, var(--t-section-header-padding, var(--comp-default-header-padding)));display:flex}@media print{header{padding:var(--tct-section-header-print-padding, 0)}}header.has-header{min-height:var(--tct-section-header-min-height, var(--t-section-header-min-height, 44px))}.header-content{flex:1 1 100%;min-width:0;align-self:center}:host([collapsible]) .header-content{cursor:pointer}.title{margin:var(--tct-section-title-margin, 0);font-size:var(--tct-section-title-font-size, 20px);font-weight:var(--tct-section-title-font-weight, 600);text-transform:var(--tct-section-title-text-transform, uppercase);letter-spacing:var(--tct-section-title-letter-spacing, 0.5px)}q2-icon{transition:transform var(--comp-tween)}:host(:not([expanded])) q2-icon,:host([expanded=false]) q2-icon{transform:rotate(180deg)}.content-wrapper{height:auto}.content-wrapper.is-closed{display:none;overflow:hidden}.content-wrapper.is-transitioning{overflow:hidden}:host([collapsible]) .content-wrapper{transition:height var(--comp-tween)}.content{--comp-default-content-padding:var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);padding:var(--tct-section-content-padding, var(--t-section-content-padding, var(--comp-default-content-padding)))}@media print{.content{padding:var(--tct-section-content-print-padding, 0)}}.content:focus{box-shadow:none}:host([collapsible]) :host(:not([expanded])) .content{visibility:hidden}";const h=d;const p=class{constructor(i){t(this,i);this.change=e(this,"change",7);this.titleId="title";this.contentId="content";this.onHeaderClick=()=>{this.change.emit({expanded:!this.expanded})};this.onTransitionEnd=()=>{if(this.expanded){this.contentHeight=undefined}else{this.hideContent=true}setTimeout((()=>{this.clearResizeInterval()}),1e3)};this.onHeaderSlotChange=()=>{const t=!!this.hostElement.querySelector('[slot="q2-section-header"]');if(this.hasYieldedHeader!==t){this.hasYieldedHeader=!!t}};this.clearResizeInterval=()=>{this.resizerFn&&clearInterval(this.resizerFn)};this.addHeaderSlotListener=()=>{if(this.headerSlot){this.headerSlot.addEventListener("slotchange",this.onHeaderSlotChange);return}const t=new MutationObserver(this.onHeaderSlotChange);t.observe(this.headerSlotWrapper,{childList:true});this.headerSlotMutationObserver=t};this.removeHeaderSlotListener=()=>{if(this.headerSlot){this.headerSlot.removeEventListener("slotchange",this.onHeaderSlotChange);return}this.headerSlotMutationObserver.disconnect()};this.addContentSlotListener=()=>{if(this.contentSlot){this.contentSlot.addEventListener("slotchange",n);return}const t=new MutationObserver(n);t.observe(this.contentContainer,{childList:true,subtree:true});this.contentSlotMutationObserver=t};this.removeContentSlotListener=()=>{if(this.contentSlot){this.contentSlot.removeEventListener("slotchange",n);return}this.contentSlotMutationObserver.disconnect()};this.collapsible=undefined;this.expanded=undefined;this.label=undefined;this.noCollapseIcon=undefined;this.contentHeight=undefined;this.hideContent=false;this.hasYieldedHeader=false}componentWillLoad(){this.onHeaderSlotChange();const{collapsible:t,expanded:e}=this;this.contentHeight=t&&e?undefined:"0px";this.hideContent=!e}componentDidLoad(){this.addHeaderSlotListener();this.addContentSlotListener();s(this.hostElement)}disconnectedCallback(){this.removeHeaderSlotListener();this.removeContentSlotListener()}defaultChangeHandler(t){if(t.target===this.hostElement&&!this.hostElement.onchange&&!!t.detail){this.expanded=t.detail.expanded}}delegateFocus(t){if(!r(t,this.hostElement))return;this.contentContainer.focus()}async expandedObserver(t){this.clearResizeInterval();this.resizerFn=setInterval(n,5);if(t){this.expandSection()}else{this.collapseSection()}}async collapseSection(){this.contentHeight=this.contentContainerHeight;await o((()=>{this.contentHeight=this.currentHeight}))}async expandSection(){this.hideContent=false;await o((()=>{this.contentHeight=this.currentHeight}))}collapsibleObserver(){this.contentHeight=this.currentHeight}get currentHeight(){const{collapsible:t,expanded:e}=this;if(!t){return null}else if(e){return this.contentContainerHeight}else{return"0"}}get contentContainerHeight(){return`${this.contentContainer.offsetHeight||0}px`}render(){const t=this.label||this.hasYieldedHeader;const e=["content-wrapper"];const{collapsible:a,hideContent:n,contentHeight:s}=this;if(a){if(n)e.push("is-closed");else if(s)e.push("is-transitioning")}const r=!this.hasYieldedHeader&&!!this.label;return i("section",{key:"4cae0e6f0057c318e45274cdabe74878bad2a995",class:"wrapper"},i("header",{key:"bb4439e069cb85a3950cabfcc08d220415229082",class:t?"has-header":""},i("div",{key:"036bd23de5da7bd0c45a31521fdeffa240e398b0",class:"header-content",id:this.titleId,onClick:this.collapsible&&this.onHeaderClick},r&&i("h2",{key:"2742ab3ad5654864b0951637e0b5a5a5028ea34d",class:"title"},c(this.label)),i("div",{key:"b772b2028190079db060d28ebaab67723b030462",ref:t=>this.headerSlotWrapper=t,class:"header-slot-wrapper"},i("slot",{key:"986a404b7a5297af31d4122ffe4daa4697b90203",ref:t=>this.headerSlot=t,name:"q2-section-header"}))),this.collapsible&&!this.noCollapseIcon&&i("q2-btn",{key:"678f61529c25ceb257cf7d26abdd46448b0f0d96",label:c(this.label||"tecton.element.section.defaultToggleLabel"),ariaExpanded:`${!!this.expanded}`,ariaControls:this.contentId,"test-id":"toggleButton","hide-label":true,onClick:this.onHeaderClick},i("q2-icon",{key:"5494baf730dd97d54e1e50b6366dbaea3676ce16",type:"chevron-up"}))),i("div",{key:"33cdc24262ad444f8d61cd557371963e5ebf4ce0",class:e.join(" "),id:this.contentId,"aria-labelledby":this.titleId,role:"region",onTransitionEnd:this.onTransitionEnd,style:this.collapsible&&{height:this.contentHeight}},i("div",{key:"f30463473a96a1e5fe8dc4f5951c147a1847d2f4",ref:t=>this.contentContainer=t,class:"content",tabindex:"-1"},i("slot",{key:"e41200b2ed13a0e280c223020c7b7ada8d3b6056",ref:t=>this.contentSlot=t}))))}get hostElement(){return a(this)}static get watchers(){return{expanded:["expandedObserver"],collapsible:["collapsibleObserver"]}}};p.style=h;export{p as q2_section};
-//# sourceMappingURL=p-774975fa.entry.js.map
+import{r as t,c as e,h as i,g as a}from"./p-a5f18e27.js";import{r as n,o as s,i as r,n as o,l as c}from"./p-84190698.js";const d="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block;background:var(--tct-section-background, var(--tct-section-background-color, var(--t-section-background-color, var(--tct-section-bg, var(--t-section-bg, var(--app-white, #ffffff))))));color:var(--tct-section-font-color, var(--t-section-font-color, var(--t-text, #4d4d4d)));border-radius:var(--tct-section-border-radius, var(--t-section-border-radius, var(--app-border-radius-1, 3px)));margin:var(--tct-section-margin, var(--t-section-margin, var(--app-scale-3x, 15px)));border-width:var(--tct-section-border-width, 0);border-style:var(--tct-section-border-style, solid);border-color:var(--tct-section-border-color, none)}@media screen and (max-width: 767px){:host{--comp-default-margin:var(--app-scale-3x, 15px) 0;margin:var(--tct-section-margin, var(--t-section-margin, var(--comp-default-margin)))}}@media print{:host{--comp-default-print-margin:var(--app-scale-3x, 15px) 0;margin:var(--tct-section-print-margin, var(--comp-default-print-margin))}}.wrapper{--comp-tween:var(--tct-section-tween, var(--t-section-tween, var(--app-tween-1, 0.2s ease)));--comp-default-wrapper-padding:var(--app-scale-1x, 5px) 0;display:block;padding:var(--tct-section-wrapper-padding, var(--t-section-wrapper-padding, var(--comp-default-wrapper-padding)))}.wrapper:hover{box-shadow:var(--tct-section-wrapper-hover-box-shadow, var(--t-section-wrapper-hover-box-shadow, inherit))}:host([collapsible]) .wrapper{--comp-tween:var(--tct-section-tween, var(--t-section-tween, var(--app-tween-2, 0.4s ease)))}header{--comp-default-header-padding:0 var(--app-scale-3x, 15px);padding:var(--tct-section-header-padding, var(--t-section-header-padding, var(--comp-default-header-padding)));display:flex}@media print{header{padding:var(--tct-section-header-print-padding, 0)}}header.has-header{min-height:var(--tct-section-header-min-height, var(--t-section-header-min-height, 44px))}.header-content{flex:1 1 100%;min-width:0;align-self:center}:host([collapsible]) .header-content{cursor:pointer}.title{margin:var(--tct-section-title-margin, 0);font-size:var(--tct-section-title-font-size, 20px);font-weight:var(--tct-section-title-font-weight, 600);text-transform:var(--tct-section-title-text-transform, uppercase);letter-spacing:var(--tct-section-title-letter-spacing, 0.5px)}q2-icon{transition:transform var(--comp-tween)}:host(:not([expanded])) q2-icon,:host([expanded=false]) q2-icon{transform:rotate(180deg)}.content-wrapper{height:auto}.content-wrapper.is-closed{display:none;overflow:hidden}.content-wrapper.is-transitioning{overflow:hidden}:host([collapsible]) .content-wrapper{transition:height var(--comp-tween)}.content{--comp-default-content-padding:var(--app-scale-2x, 10px) var(--app-scale-3x, 15px);padding:var(--tct-section-content-padding, var(--t-section-content-padding, var(--comp-default-content-padding)))}@media print{.content{padding:var(--tct-section-content-print-padding, 0)}}.content:focus{box-shadow:none}:host([collapsible]) :host(:not([expanded])) .content{visibility:hidden}";const h=d;const p=class{constructor(i){t(this,i);this.change=e(this,"change",7);this.titleId="title";this.contentId="content";this.onHeaderClick=()=>{this.change.emit({expanded:!this.expanded})};this.onTransitionEnd=()=>{if(this.expanded){this.contentHeight=undefined}else{this.hideContent=true}setTimeout((()=>{this.clearResizeInterval()}),1e3)};this.onHeaderSlotChange=()=>{const t=!!this.hostElement.querySelector('[slot="q2-section-header"]');if(this.hasYieldedHeader!==t){this.hasYieldedHeader=!!t}};this.clearResizeInterval=()=>{this.resizerFn&&clearInterval(this.resizerFn)};this.addHeaderSlotListener=()=>{if(this.headerSlot){this.headerSlot.addEventListener("slotchange",this.onHeaderSlotChange);return}const t=new MutationObserver(this.onHeaderSlotChange);t.observe(this.headerSlotWrapper,{childList:true});this.headerSlotMutationObserver=t};this.removeHeaderSlotListener=()=>{if(this.headerSlot){this.headerSlot.removeEventListener("slotchange",this.onHeaderSlotChange);return}this.headerSlotMutationObserver.disconnect()};this.addContentSlotListener=()=>{if(this.contentSlot){this.contentSlot.addEventListener("slotchange",n);return}const t=new MutationObserver(n);t.observe(this.contentContainer,{childList:true,subtree:true});this.contentSlotMutationObserver=t};this.removeContentSlotListener=()=>{if(this.contentSlot){this.contentSlot.removeEventListener("slotchange",n);return}this.contentSlotMutationObserver.disconnect()};this.collapsible=undefined;this.expanded=undefined;this.label=undefined;this.noCollapseIcon=undefined;this.contentHeight=undefined;this.hideContent=false;this.hasYieldedHeader=false}componentWillLoad(){this.onHeaderSlotChange();const{collapsible:t,expanded:e}=this;this.contentHeight=t&&e?undefined:"0px";this.hideContent=!e}componentDidLoad(){this.addHeaderSlotListener();this.addContentSlotListener();s(this.hostElement)}disconnectedCallback(){this.removeHeaderSlotListener();this.removeContentSlotListener()}defaultChangeHandler(t){if(t.target===this.hostElement&&!this.hostElement.onchange&&!!t.detail){this.expanded=t.detail.expanded}}delegateFocus(t){if(!r(t,this.hostElement))return;this.contentContainer.focus()}async expandedObserver(t){this.clearResizeInterval();this.resizerFn=setInterval(n,5);if(t){this.expandSection()}else{this.collapseSection()}}async collapseSection(){this.contentHeight=this.contentContainerHeight;await o((()=>{this.contentHeight=this.currentHeight}))}async expandSection(){this.hideContent=false;await o((()=>{this.contentHeight=this.currentHeight}))}collapsibleObserver(){this.contentHeight=this.currentHeight}get currentHeight(){const{collapsible:t,expanded:e}=this;if(!t){return null}else if(e){return this.contentContainerHeight}else{return"0"}}get contentContainerHeight(){return`${this.contentContainer.offsetHeight||0}px`}render(){const t=this.label||this.hasYieldedHeader;const e=["content-wrapper"];const{collapsible:a,hideContent:n,contentHeight:s}=this;if(a){if(n)e.push("is-closed");else if(s)e.push("is-transitioning")}const r=!this.hasYieldedHeader&&!!this.label;return i("section",{key:"245c8a2da4a8c8ae1787d91c9b35872105912e95",class:"wrapper"},i("header",{key:"bfc10eaaa837d4a8cb49bc3f4397288d546f9e67",class:t?"has-header":""},i("div",{key:"d25b05626ca123afb549ec16c1ce5bec625db4d7",class:"header-content",id:this.titleId,onClick:this.collapsible&&this.onHeaderClick},r&&i("h2",{key:"f2f8c57e3af85b954096e2e25ebef50bd7b79cb0",class:"title"},c(this.label)),i("div",{key:"efd8d321da74b310a48c0c7457d30c4e2386611e",ref:t=>this.headerSlotWrapper=t,class:"header-slot-wrapper"},i("slot",{key:"ceb27324426a2b7db0d91ce275fa18df588ada1d",ref:t=>this.headerSlot=t,name:"q2-section-header"}))),this.collapsible&&!this.noCollapseIcon&&i("q2-btn",{key:"a3e309075ca001daddcd645b9160837155ce7506",label:c(this.label||"tecton.element.section.defaultToggleLabel"),ariaExpanded:`${!!this.expanded}`,ariaControls:this.contentId,"test-id":"toggleButton","hide-label":true,onClick:this.onHeaderClick},i("q2-icon",{key:"3f349cda906286b7a346a9bc9fa6688f47a5392f",type:"chevron-up"}))),i("div",{key:"974f2eaa3ff5e607561154906ec4b58f44f2bd84",class:e.join(" "),id:this.contentId,"aria-labelledby":this.titleId,role:"region",onTransitionEnd:this.onTransitionEnd,style:this.collapsible&&{height:this.contentHeight}},i("div",{key:"63e20753fdfca17b6022903d38a22d0f61ea439d",ref:t=>this.contentContainer=t,class:"content",tabindex:"-1"},i("slot",{key:"08150c784b5a0d2ca7af67bbc5763754c165564f",ref:t=>this.contentSlot=t}))))}get hostElement(){return a(this)}static get watchers(){return{expanded:["expandedObserver"],collapsible:["collapsibleObserver"]}}};p.style=h;export{p as q2_section};
+//# sourceMappingURL=p-6fdda37e.entry.js.map