q2-tecton-elements 1.17.0 → 1.18.0

package/dist/q2-tecton-elements/p-b595b415.entry.js

@@ -1 +0,0 @@
-import{r as t,c as e,h as s,g as i}from"./p-c5691700.js";import{c as o,s as l,h as n,o as a,l as h,b as r,i as c,r as d}from"./p-41fcf343.js";const p=class{constructor(s){t(this,s),this.change=e(this,"change",7),this.input=e(this,"input",7),this.selectedOptions=[],this.disabled=!1,this.readonly=!1,this.multiple=!1,this.minRows=3,this.searchable=!1,this.multilineOptions=!1,this.optional=!1,this.dropdownOpen=!1,this.onlyShowingSelected=!1,this.searchText="",this.hasCustomDisplay=!1,this.inputFocused=!1,this.prioritizeSearch=!1,this.scheduledAfterRender=[],this.keyStore={queue:[],lastPressedAt:new Date},this.guid=o(),this.onMutationObserved=()=>{const t=this.hostElement.querySelector(".custom-display-content"),e=this.hostElement.shadowRoot.querySelector('slot[name="q2-select-display"]'),s=e?e.assignedNodes().length>0:t.children.length>0;if(this.hasCustomDisplay!==s&&(this.hasCustomDisplay=s),this.multiple)return void this.updateMultipleOptionAttrs();this.updateSingleOptionAttrs();const i=this.optionElements[this.activeIndex];i&&i.id===this.activeOptionId||(this.activeIndex=this.getDefaultActiveIndex(),this.setActiveOption())},this.searchAndFocus=t=>{(()=>{const e=new Date;e.getTime()-this.keyStore.lastPressedAt.getTime()>1e3&&(this.keyStore.queue=[]),1===this.keyStore.queue.length&&this.keyStore.queue[0]===t||this.keyStore.queue.push(t),this.keyStore.lastPressedAt=e})();const e=(t=>t.find((t=>!t.element.disabled&&t.element.display&&t.element.display.replace(/\s/g,"").match(new RegExp(`^${this.keyStore.queue.join("")}`,"i")))))((()=>{this.pivotIndex=void 0===this.pivotIndex?0:(this.activeIndex||0)+1;const t=this.optionElements.map(((t,e)=>({element:t,index:e})));return[...t.slice(this.pivotIndex),...t.slice(0,this.pivotIndex)]})());e&&(({element:t,index:e})=>{this.dropdownOpen||this.multiple?this.openDropdownWithActiveElement(e):(this.activeIndex=e,this.change.emit({value:t.value}))})(e)},this.dropdownFocusoutHandler=t=>{const{relatedTarget:e}=t,s=this.dropdownContainer.contains(e),i=!s&&this.hostElement.contains(e);s||i||this.dropdownOpen&&this.closeDropdown()},this.dropdownKeydownHandler=t=>{t.stopPropagation();const{activeIndex:e,searchable:s,optionElements:i,multiSelectHeader:o}=this,{key:l,shiftKey:n}=t;if(!(this.readonly||o&&o.contains(t.target)&&[" ","Enter"].includes(l)))switch(l){case" ":case"Enter":t.preventDefault();const o=this.hostElement.querySelector(`[option-id="${this.activeOptionId}"]`);if(!o||o.disabled)break;this.selectOption(o,!0);break;case"ArrowUp":if(t.preventDefault(),0===e)break;if(void 0!==e){const t=this.getNextVisibleIndex(-1);if(-1===t)break;this.adjustActiveOptionAndScroll(t-e)}else this.setDefaultActiveElement();break;case"ArrowDown":if(t.preventDefault(),e===i.length-1)break;if(void 0!==e){const t=this.getNextVisibleIndex(1);if(-1===t)break;this.adjustActiveOptionAndScroll(t-e)}else this.setDefaultActiveElement();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(n)break;const a=this.hostElement.querySelector(`[option-id="${this.activeOptionId}"]`);if(!a||a.disabled)return;if(a.selected)return;this.selectOption(a);break;case"Esc":case"Escape":this.closeDropdown(),this.focusInput();break;default:if(s)break;if(!l.match(/^[A-Za-z0-9]$/))break;this.searchAndFocus(l)}},this.inputKeydownHandler=t=>{t.stopPropagation();const{key:e,shiftKey:s}=t,{optionElements:i,searchable:o}=this;switch(e){case"ArrowDown":t.preventDefault(),this.openDropdownWithActiveElement(this.getDefaultActiveIndex());break;case"ArrowUp":t.preventDefault(),this.openDropdownWithActiveElement(this.getLastEnabledIndex()),this.setFocusedOption();break;case"Home":t.preventDefault(),this.openDropdownWithActiveElement(0);break;case"End":t.preventDefault(),this.openDropdownWithActiveElement(i.length-1);break;case"Escape":case"Esc":case"Tab":this.closeDropdown();break;default:if(s)break;if(o){this.openDropdownWithoutActiveElement();break}if(!e.match(/^[A-Za-z0-9]$/))break;this.searchAndFocus(e)}},this.inputClickHandler=t=>{t.stopPropagation(),l(this),this.toggleDropdown(),this.focusInput()},this.inputInputHandler=t=>{t.stopPropagation();const e=t.detail.value;!!this.value&&this.inputField.value!==e&&this.selectOption(null),this.dropdownOpen||this.openDropdownWithoutActiveElement(),this.prioritizeSearch=!0,this.searchText=e,this.input.emit({query:e})},this.inputFocusHandler=()=>{this.inputFocused=!0},this.inputBlurHandler=()=>{this.inputFocused=!1},this.inputChangeHandler=t=>{t.stopPropagation()},this.clickedElsewhere=t=>{"click-elsewhere"===t.target.localName&&(t.stopPropagation(),this.dropdownOpen&&this.closeDropdown())},this.onCustomDisplayClick=t=>{t.stopPropagation(),this.focusInput(),this.toggleDropdown()},this.showSelectedOptions=t=>{t.stopImmediatePropagation(),this.onlyShowingSelected=!0,this.optionElements.forEach((t=>{t._multiSelectHidden=!t.selected}))},this.showAllOptions=t=>{t.stopPropagation(),this.onlyShowingSelected=!1,this.optionElements.forEach((t=>{t._multiSelectHidden=!1}))}}componentWillLoad(){n(this)}componentDidLoad(){const t=new MutationObserver(this.onMutationObserved);t.observe(this.hostElement,{childList:!0,subtree:!0}),this.mutationObserver=t,this.onMutationObserved(),a(this.hostElement),setTimeout((()=>this.checkSelectedDisplay()),0)}componentDidRender(){setTimeout((()=>{this.scheduledAfterRender.forEach((t=>t())),this.scheduledAfterRender=[]}),25)}disconnectedCallback(){var t;null===(t=this.mutationObserver)||void 0===t||t.disconnect(),this.mutationObserver=null}get isComponentFocused(){return document.activeElement===this.hostElement||!!this.hostElement.querySelector(":focus")}get isSearchMode(){return this.searchable&&this.inputFocused||this.searchText}get badgeValue(){if(!this.multiple)return;const t=this.selectedOptions.length;return this.dropdownOpen&&this.searchable?t||null:t>1?"+"+(t-1):null}get minPopHeight(){const{minRows:t}=this,e=this.hostElement.querySelector("q2-option:not([hidden])"),s=e?window.getComputedStyle(e).minHeight:"44px";return t*parseInt(s)}get selectedDisplay(){return this.prioritizeSearch||this.searchText?this.searchText:this.hasCustomDisplay?"":this.multiple?this.calculateMultiSelectSelectedDisplay():this.calculateSingleSelectSelectedDisplay()}get selectedDisplaySlot(){return this.hostElement.querySelector('[slot="_selected-display"]')}get firstSelectedValue(){var t,e;return this.multiple?null!==(e=null===(t=this.selectedOptions)||void 0===t?void 0:t[0])&&void 0!==e?e:null: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 visibleOptionElements(){return Array.from(this.hostElement.querySelectorAll("q2-option:not([_multiselecthidden])"))}get wrapperClasses(){const{errors:t}=this,e=["q2-select-container"];return this.dropdownOpen&&e.push("dropdown-open"),Array.isArray(t)&&t.length>0&&e.push("has-error"),this.inputFocused&&e.push("is-focused"),this.searchable&&e.push("is-searchable"),e.join(" ")}ariaLabelObserver(){n(this)}valueUpdated(){this.multiple||this.updateSingleOptionAttrs()}selectedOptionsUpdated(){this.multiple&&this.updateMultipleOptionAttrs()}multilineOptionsChanged(t,e){t!==e&&this.optionElements.forEach((e=>e.multiline=t))}dropdownOpenChanged(t){this.scheduledAfterRender.push((()=>{const{multiple:e,multiSelectHeader:s,dropdownContainer:i}=this,o=t&&e&&(null==s?void 0:s.offsetHeight)||0;o?i.style.setProperty("--comp-multi-select-header-height",`${o}px`):i.style.removeProperty("--comp-multi-select-header-height")}))}keydownHandler(t){this.inputKeydownHandler(t)}onHostElementChange(t){this.readonly||t.target!==this.hostElement||this.hostElement.onchange||(this.multiple?this.selectedOptions=t.detail.selectedOptions:this.value=t.detail.value)}onHostElementInput(t){if(!this.searchable||t.target!==this.hostElement||this.hostElement.oninput)return;const e=this.optionElements,s=this.searchText.trim().toLocaleLowerCase();let i=0;e.forEach((t=>{var e;if(""===s)return void(t.hidden=!1);const o="Q2-CARD"===(null===(e=t.firstElementChild)||void 0===e?void 0:e.tagName)?t.firstElementChild.title:null,{display:l="",innerText:n=""}=t,a=[l,o,n].some((t=>{var e;return null!==(e=null==t?void 0:t.toLocaleLowerCase().includes(s))&&void 0!==e&&e}));t.hidden=!a,a&&i++})),this.setStatusMessage(h(s?"tecton.element.select.searchable.results":"tecton.element.select.allOptions",[s?i:e.length]))}delegateFocus(t){const e=r(t,this.hostElement);(this.prioritizeSearch=e&&this.searchable)?this.clearSelectedDisplay():c(t,this.hostElement)&&this.inputField.shadowRoot.querySelector(".input-field").focus()}handleFocusout(t){this.prioritizeSearch=!r(t,this.hostElement)&&this.searchable}clickHandler(t){const e=t.target.closest("q2-option");!e||e.hasAttribute("disabled")&&"false"!==e.getAttribute("disabled")||this.selectOption(e,!0)}getDefaultActiveIndex(){const t=this.optionElements.findIndex((t=>t.selected&&!t.hidden));if(t>-1)return t;const e=this.optionElements.findIndex((t=>!t.hidden));return e>-1?e:0}getLastEnabledIndex(){const t=this.optionElements.reduce(((t,e,s)=>(e.hidden||e.disabled||t.push(s),t)),[]);return t[t.length-1]}setActiveOption(){if(!this.dropdownOpen)return;const t=this.activeIndex;this.optionElements.forEach(((e,s)=>{t===s?(e.active=!0,this.activeOptionId=e.optionId):e.active=!1}))}setFocusedOption(){const t=this.optionElements[this.activeIndex];t&&(t.dispatchEvent(new FocusEvent("focus")),t.focus())}calculateMultiSelectSelectedDisplay(){var t;const{firstSelectedOptionElement:e,firstSelectedValue:s,multilineOptions:i}=this;return s?(null==e?void 0:e.display)?h(e.display):i&&this.searchable?this.searchText:i?"":null!==(t=null==e?void 0:e.value)&&void 0!==t?t:s:""}calculateSingleSelectSelectedDisplay(){const{firstSelectedOptionElement:t}=this;return(null==t?void 0:t.display)&&h(t.display)||this.value||""}updateSingleOptionAttrs(){const{value:t,guid:e,multilineOptions:s}=this;this.optionElements.forEach(((i,o)=>{i.selected=i.value===t,i.optionId=`q2-select-${e}-option-${o}`,i.multiline=s}))}updateMultipleOptionAttrs(){0===this.selectedOptions.length&&(this.onlyShowingSelected=!1);const{selectedOptions:t,onlyShowingSelected:e,guid:s,multilineOptions:i}=this;this.optionElements.forEach(((o,l)=>{o.selected=t.includes(o.value),o._multiSelectHidden=!!e&&!o.selected,o.optionId=`q2-select-${s}-option-${l}`,o.multiline=i}))}focusSelectedSibling(t){if(!this.onlyShowingSelected)return;const{visibleOptionElements:e}=this;if(e.length<2)return;const s=e.indexOf(t),i=this.optionElements.indexOf(e[s?s-1:s+1]);this.activeIndex=i,this.setFocusedOption()}selectOption(t,e=!1){var s;const i=null!==(s=null==t?void 0:t.value)&&void 0!==s?s:"";this.multiple?this.selectedOptions.includes(i)?(this.focusSelectedSibling(t),this.change.emit({selectedOptions:this.selectedOptions.filter((t=>t!==i))})):i&&this.change.emit({selectedOptions:[...this.selectedOptions,i]}):(this.change.emit({value:i}),this.closeDropdown(),e&&this.focusInput())}scrollToActiveOption(){const t=this.optionElements[this.activeIndex];null==t||t.scrollIntoView({block:"nearest"})}openDropdownWithoutActiveElement(){this.readonly||(this.activeIndex=void 0,this.setActiveOption(),this.dropdownOpen=!0,this.scheduledAfterRender.push(d))}openDropdownWithActiveElement(t){this.readonly||(this.activeIndex=t,this.dropdownOpen=!0,this.setActiveOption(),this.scheduledAfterRender.push((()=>{this.setFocusedOption(),this.scrollToActiveOption(),d()})))}closeDropdown(){this.dropdownOpen=!1,this.searchText&&(this.searchText="",this.input.emit({query:""})),this.scheduledAfterRender.push(d)}toggleDropdown(){this.disabled||(this.dropdownOpen&&!this.searchText?this.closeDropdown():this.openDropdownWithoutActiveElement())}adjustActiveOptionAndScroll(t){this.activeIndex+=t,this.setActiveOption(),this.setFocusedOption(),this.scrollToActiveOption()}setDefaultActiveElement(){this.activeIndex=this.getDefaultActiveIndex(),this.setActiveOption(),this.setFocusedOption()}focusInput(){var t;null===(t=this.inputField)||void 0===t||t.dispatchEvent(new FocusEvent("focus"))}getNextVisibleIndex(t){let e=this.activeIndex+t;const{optionElements:s}=this;for(;e>=0&&e<=s.length-1;){const{display:i,visibility:o}=window.getComputedStyle(s[e]);if("none"!==i&&"hidden"!==o)return e;e+=t}return-1}setStatusMessage(t){clearTimeout(this.statusMessageTimer),this.statusMessage="",this.statusMessageTimer=setTimeout((()=>{this.statusMessage=t}),1e3)}clearSelectedDisplay(){var t;null===(t=this.selectedDisplaySlot)||void 0===t||t.remove()}checkSelectedDisplay(){let t=this.selectedDisplaySlot;const{value:e,multiple:s,selectedOptions:i,multilineOptions:o,firstSelectedOptionElement:l,prioritizeSearch:n}=this;if(n||!o||!e&&s&&!i.length)return this.clearSelectedDisplay();if(!l||l.display)return this.clearSelectedDisplay();const a=l.firstElementChild.cloneNode(!0);return a.querySelectorAll("[hide-on-select]").forEach((t=>t.remove())),t?(t.style.setProperty("--comp-selected-display-height",0===t.clientHeight?"auto":`${t.clientHeight}px`),t.firstElementChild.outerHTML!==a.outerHTML&&t.replaceChild(a,t.firstElementChild)):(t=document.createElement("div"),t.slot="_selected-display",t.appendChild(a),this.hostElement.appendChild(t)),t}checkSelectedDisplayHeight(){const{selectedDisplaySlot:t}=this;t&&t.style.setProperty("--comp-selected-display-height","44px")}renderCustomDisplay(){if(this.checkSelectedDisplay())return this.checkSelectedDisplayHeight(),s("slot",{name:"_selected-display",slot:"custom-display"})}render(){const t=!this.searchable;return s("click-elsewhere",{class:this.wrapperClasses,onChange:this.clickedElsewhere},s("div",{"aria-live":"polite","aria-atomic":"true",role:"status",class:"sr"},this.statusMessage),s("q2-input",{ref:t=>this.inputField=t,class:"q2-select-input",label:this.label&&h(this.label)||"",value:this.selectedDisplay,errors:Array.isArray(this.errors)&&this.errors.length>0&&this.errors.map((t=>h(t)))||this.invalid&&["tecton.element.select.invalid"]||[],disabled:this.disabled,optional:this.optional,readonly:this.readonly,hideLabel:this.hideLabel,ariaExpanded:`${!!this.dropdownOpen}`,ariaOwns:"dropdown",ariaHaspopup:"listbox",role:this.searchable?"combobox":null,pseudo:t,"test-id":"toggleDropdown","hide-messages":!0,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.isComponentFocused?"primary":void 0},this.renderCustomDisplay()),s("div",{class:"custom-display-content",hidden:!this.hasCustomDisplay||!!this.searchText,onClick:this.onCustomDisplayClick},s("slot",{name:"q2-select-display"})),this.optionsDropdown())}optionsDropdown(){return s("div",{class:"q2-select-dropdown q2-element-dropdown "+("up"===this.privatePopDirection?"dropup":""),ref:t=>this.dropdownContainer=t,onKeyDown:this.dropdownKeydownHandler,onFocusout:this.dropdownFocusoutHandler},this.multiple?this.visibilityToggle():"",s("div",{class:"q2-select-options",id:"dropdown",role:"listbox"},s("slot",null)))}visibilityToggle(){const t=this.selectedOptions.length;return s("div",{class:"multi-select-header",ref:t=>this.multiSelectHeader=t},h("tecton.element.select.multiHeader.showing"),s("q2-btn",{class:"show-all-options"+(this.onlyShowingSelected?"":" selected"),badge:!0,"aria-selected":!this.onlyShowingSelected||void 0,"test-id":"allOptionsButton",onClick:this.showAllOptions,label:h("tecton.element.select.multiHeader.allAriaLabel"),"hide-label":!0},h("tecton.element.select.multiHeader.all")),s("q2-btn",{class:"show-selected-options"+(this.onlyShowingSelected?" selected":""),"aria-selected":this.onlyShowingSelected||void 0,disabled:0===this.selectedOptions.length,badge:!0,"test-id":"selectedOptionsButton",onClick:this.showSelectedOptions,label:h("tecton.element.select.multiHeader.selectedAriaLabel",[t]),"hide-label":!0},h("tecton.element.select.multiHeader.selected",[t])))}get hostElement(){return i(this)}static get watchers(){return{ariaLabel:["ariaLabelObserver"],value:["valueUpdated"],selectedOptions:["selectedOptionsUpdated"],multilineOptions:["multilineOptionsChanged"],dropdownOpen:["dropdownOpenChanged"]}}};p.style="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus, 0 0 0 2px #33b4ff)}: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{display:block;margin-top:var(--tct-select-margin-top, var(--app-scale-4, 30px));margin-bottom:var(--tct-select-margin-bottom, var(--app-scale-4, 30px))}.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, 100px))}::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)))}.dropdown-open .q2-select-dropdown{overflow-y:auto;max-height:300px}.multi-select-header{padding:var(--tct-scale-1, var(--app-scale-1x, 5px)) var(--tct-scale-2, var(--app-scale-2x, 10px));position:sticky;top:0;z-index:5;background:var(--app-white)}.show-all-options{margin-right:var(--tct-scale-1, var(--app-scale-1x, 5px));margin-left:var(--tct-scale-2, var(--app-scale-2x, 10px))}.q2-element-dropdown.dropup{bottom:var(--comp-dropup-offset)}";export{p as q2_select}

package/dist/test/elements/q2-tag-test.js

@@ -1,151 +0,0 @@
-import { setup, getFocusedAttribute } from '../helpers';
-describe('q2-tag', () => {
-  let page;
-  let tag;
-  let optionList;
-  let controlBtn;
-  let allOptions;
-  let optionContainer;
-  let clickSpy;
-  let changeSpy;
-  const getFocusedValue = async (page) => {
-    return page.$eval('body', () => document.activeElement.getAttribute('value'));
-  };
-  it('does not render button or dropdown by default', async () => {
-    page = await setup({
-      html: `<q2-tag label="My tag"></q2-tag>`,
-    });
-    optionList = await page.find('q2-tag >>> q2-option-list');
-    controlBtn = await page.find('q2-tag >>> button');
-    expect(controlBtn).toBeNull();
-    expect(optionList).toBeNull();
-  });
-  describe('when options are provided', () => {
-    beforeEach(async () => {
-      page = await setup({
-        html: `
-                    <q2-tag label="My tag">
-                        <q2-option value="1">Option 1</q2-option>
-                        <q2-option value="2">Option 2</q2-option>
-                        <q2-option value="3">Option 3</q2-option>
-                    </q2-tag>
-                `,
-      });
-      tag = await page.find('q2-tag');
-      allOptions = await page.findAll('q2-option');
-      optionList = await page.find('q2-tag >>> q2-option-list');
-      optionContainer = await page.find('q2-tag >>> q2-option-list >>> .options');
-      controlBtn = await page.find('q2-tag >>> button');
-      clickSpy = await tag.spyOnEvent('click');
-      changeSpy = await tag.spyOnEvent('change');
-    });
-    it('can select option via keyboard', async () => {
-      const tagWrapper = await page.find('q2-tag >>> .tag-wrapper');
-      expect(tagWrapper.classList.contains('has-options')).toBe(true);
-      expect(optionList).not.toHaveAttribute('open');
-      await controlBtn.press('ArrowDown');
-      await page.waitForChanges();
-      expect(tag).toHaveAttribute('open');
-      expect(optionList).toHaveAttribute('open');
-      expect(await getFocusedValue(page)).toEqual('1');
-      await optionContainer.press('ArrowDown');
-      await page.waitForChanges();
-      expect(await getFocusedValue(page)).toEqual('2');
-      await allOptions[1].press(' ');
-      await page.waitForChanges();
-      expect(tag).not.toHaveAttribute('open');
-      expect(optionList).not.toHaveAttribute('open');
-      expect(clickSpy).toHaveReceivedEventDetail({
-        value: '2',
-      });
-      expect(changeSpy).not.toHaveReceivedEvent();
-    });
-    it('can select option via mouse', async () => {
-      const tagWrapper = await page.find('q2-tag >>> .tag-wrapper');
-      expect(tagWrapper.classList.contains('has-options')).toBe(true);
-      expect(optionList).not.toHaveAttribute('open');
-      await controlBtn.click();
-      await page.waitForChanges();
-      expect(tag).toHaveAttribute('open');
-      expect(optionList).toHaveAttribute('open');
-      await allOptions[1].click();
-      await page.waitForChanges();
-      expect(tag).not.toHaveAttribute('open');
-      expect(optionList).not.toHaveAttribute('open');
-      expect(clickSpy).toHaveReceivedEventDetail({
-        value: '2',
-      });
-      expect(changeSpy).not.toHaveReceivedEvent();
-    });
-    describe('when keyboard is pressed', () => {
-      it('opens list and focuses first option on ArrowDown', async () => {
-        await controlBtn.press('ArrowDown');
-        await page.waitForChanges();
-        expect(tag).toHaveAttribute('open');
-        expect(optionList).toHaveAttribute('open');
-        expect(await getFocusedAttribute(page, 'value')).toEqual('1');
-      });
-      it('opens list and focuses first option on ArrowUp', async () => {
-        await controlBtn.press('ArrowUp');
-        await page.waitForChanges();
-        expect(tag).toHaveAttribute('open');
-        expect(optionList).toHaveAttribute('open');
-        expect(await getFocusedAttribute(page, 'value')).toEqual('1');
-      });
-      it('opens list and focuses first option on Enter', async () => {
-        await controlBtn.press('Enter');
-        await page.waitForChanges();
-        expect(tag).toHaveAttribute('open');
-        expect(optionList).toHaveAttribute('open');
-        expect(await getFocusedAttribute(page, 'value')).toEqual('1');
-      });
-      it('opens list and focuses first option on Space', async () => {
-        await controlBtn.press(' ');
-        await page.waitForChanges();
-        expect(tag).toHaveAttribute('open');
-        expect(optionList).toHaveAttribute('open');
-        expect(await getFocusedValue(page)).toEqual('1');
-      });
-      it('opens list and focuses last option on Home', async () => {
-        await controlBtn.press('Home');
-        await page.waitForChanges();
-        expect(tag).toHaveAttribute('open');
-        expect(optionList).toHaveAttribute('open');
-        expect(await getFocusedAttribute(page, 'value')).toEqual('1');
-      });
-      it('opens list and focuses last option on End', async () => {
-        await controlBtn.press('End');
-        await page.waitForChanges();
-        expect(tag).toHaveAttribute('open');
-        expect(optionList).toHaveAttribute('open');
-        expect(await getFocusedAttribute(page, 'value')).toEqual('3');
-      });
-    });
-  });
-  describe('focus', () => {
-    let page;
-    let tag;
-    beforeEach(async () => {
-      page = await setup({
-        html: `
-                    <q2-tag label="My tag">
-                        <q2-option value="1">Option 1</q2-option>
-                        <q2-option value="2">Option 2</q2-option>
-                        <q2-option value="3">Option 3</q2-option>
-                    </q2-tag>
-                `,
-      });
-      tag = await page.find('q2-tag');
-    });
-    it('focuses active option and opens the list when focus event is dispatched', async function () {
-      await tag.triggerEvent('focus');
-      await page.waitForChanges();
-      expect(await getFocusedAttribute(page, 'test-id')).toEqual('btn-control');
-    });
-    it('focuses active option and opens the list when element.focus() is called', async function () {
-      await tag.focus();
-      await page.waitForChanges();
-      expect(await getFocusedAttribute(page, 'test-id')).toEqual('btn-control');
-    });
-  });
-});

package/dist/types/workspace/workspace/Tecton_tecton-production_master/packages/q2-tecton-elements/.stencil/test/elements/q2-tag-test.d.ts

@@ -1 +0,0 @@
-export {};