q2-tecton-elements 1.11.4 → 1.12.1

package/dist/types/components.d.ts

@@ -6,6 +6,8 @@
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { IEventDetail } from "./components/q2-input/types";
+import { IOptionValue } from "./components/q2-option-list/index";
+import { IOptionValue as IOptionValue1 } from "./components/q2-option-list";
 export namespace Components {
     interface ClickElsewhere {
     }
@@ -219,12 +221,29 @@ export namespace Components {
         "display": string;
         "hidden": boolean;
         "multiline": boolean;
+        "noSelect": boolean;
         "optionId": string;
         "role": string;
         "selected": boolean;
         "tabindex": string;
         "value": string;
     }
+    interface Q2OptionList {
+        "align": 'left' | 'right';
+        "customSearch": boolean;
+        "direction": 'up' | 'down';
+        "disabled": boolean;
+        "handleExternalKeydown": (event: KeyboardEvent) => Promise<void>;
+        "multiple": boolean;
+        "noSelect": boolean;
+        "open": boolean;
+        "role": 'listbox' | 'menu';
+        "selectedOptions": IOptionValue[];
+        "setActiveElement": (index: number) => Promise<void>;
+        "setDefaultActiveElement": () => Promise<void>;
+        "toggle": () => Promise<void>;
+        "type": 'menu' | 'listbox';
+    }
     interface Q2Pagination {
         "page": number;
         "pages": number;
@@ -234,6 +253,16 @@ export namespace Components {
         "recordsOnly": boolean;
         "total": number;
     }
+    interface Q2Pill {
+        "active": boolean;
+        "disabled": boolean;
+        "label": string;
+        "multiple": boolean;
+        "open": boolean;
+        "selectedOptions": IOptionValue[];
+        "theme": 'primary' | 'secondary' | 'tertiary';
+        "value": string;
+    }
     interface Q2Radio {
         "ariaLabel": string;
         "checked": boolean;
@@ -305,6 +334,12 @@ export namespace Components {
         "selected": boolean;
         "value": string;
     }
+    interface Q2Tag {
+        "label": string;
+        "open": boolean;
+        "role": string;
+        "theme": 'primary' | 'secondary' | 'tertiary';
+    }
     interface Q2Textarea {
         "cols": number;
         "disabled": boolean;
@@ -458,12 +493,24 @@ declare global {
         prototype: HTMLQ2OptionElement;
         new (): HTMLQ2OptionElement;
     };
+    interface HTMLQ2OptionListElement extends Components.Q2OptionList, HTMLStencilElement {
+    }
+    var HTMLQ2OptionListElement: {
+        prototype: HTMLQ2OptionListElement;
+        new (): HTMLQ2OptionListElement;
+    };
     interface HTMLQ2PaginationElement extends Components.Q2Pagination, HTMLStencilElement {
     }
     var HTMLQ2PaginationElement: {
         prototype: HTMLQ2PaginationElement;
         new (): HTMLQ2PaginationElement;
     };
+    interface HTMLQ2PillElement extends Components.Q2Pill, HTMLStencilElement {
+    }
+    var HTMLQ2PillElement: {
+        prototype: HTMLQ2PillElement;
+        new (): HTMLQ2PillElement;
+    };
     interface HTMLQ2RadioElement extends Components.Q2Radio, HTMLStencilElement {
     }
     var HTMLQ2RadioElement: {
@@ -512,6 +559,12 @@ declare global {
         prototype: HTMLQ2TabPaneElement;
         new (): HTMLQ2TabPaneElement;
     };
+    interface HTMLQ2TagElement extends Components.Q2Tag, HTMLStencilElement {
+    }
+    var HTMLQ2TagElement: {
+        prototype: HTMLQ2TagElement;
+        new (): HTMLQ2TagElement;
+    };
     interface HTMLQ2TextareaElement extends Components.Q2Textarea, HTMLStencilElement {
     }
     var HTMLQ2TextareaElement: {
@@ -545,7 +598,9 @@ declare global {
         "q2-message": HTMLQ2MessageElement;
         "q2-optgroup": HTMLQ2OptgroupElement;
         "q2-option": HTMLQ2OptionElement;
+        "q2-option-list": HTMLQ2OptionListElement;
         "q2-pagination": HTMLQ2PaginationElement;
+        "q2-pill": HTMLQ2PillElement;
         "q2-radio": HTMLQ2RadioElement;
         "q2-radio-group": HTMLQ2RadioGroupElement;
         "q2-section": HTMLQ2SectionElement;
@@ -554,6 +609,7 @@ declare global {
         "q2-stepper-pane": HTMLQ2StepperPaneElement;
         "q2-tab-container": HTMLQ2TabContainerElement;
         "q2-tab-pane": HTMLQ2TabPaneElement;
+        "q2-tag": HTMLQ2TagElement;
         "q2-textarea": HTMLQ2TextareaElement;
         "tecton-tab-pane": HTMLTectonTabPaneElement;
     }
@@ -783,13 +839,27 @@ declare namespace LocalJSX {
         "display"?: string;
         "hidden"?: boolean;
         "multiline"?: boolean;
-        "onClick"?: (event: CustomEvent<any>) => void;
+        "noSelect"?: boolean;
         "optionId"?: string;
         "role"?: string;
         "selected"?: boolean;
         "tabindex"?: string;
         "value"?: string;
     }
+    interface Q2OptionList {
+        "align"?: 'left' | 'right';
+        "customSearch"?: boolean;
+        "direction"?: 'up' | 'down';
+        "disabled"?: boolean;
+        "multiple"?: boolean;
+        "noSelect"?: boolean;
+        "onChange"?: (event: CustomEvent<{ value: string; values: IOptionValue[] }>) => void;
+        "onOptionListState"?: (event: CustomEvent<{ open: boolean }>) => void;
+        "open"?: boolean;
+        "role"?: 'listbox' | 'menu';
+        "selectedOptions"?: IOptionValue[];
+        "type"?: 'menu' | 'listbox';
+    }
     interface Q2Pagination {
         "onChange"?: (event: CustomEvent<any>) => void;
         "page"?: number;
@@ -800,6 +870,17 @@ declare namespace LocalJSX {
         "recordsOnly"?: boolean;
         "total"?: number;
     }
+    interface Q2Pill {
+        "active"?: boolean;
+        "disabled"?: boolean;
+        "label"?: string;
+        "multiple"?: boolean;
+        "onChange"?: (event: CustomEvent<{ value: string; values: IOptionValue[]; active: boolean }>) => void;
+        "open"?: boolean;
+        "selectedOptions"?: IOptionValue[];
+        "theme"?: 'primary' | 'secondary' | 'tertiary';
+        "value"?: string;
+    }
     interface Q2Radio {
         "ariaLabel"?: string;
         "checked"?: boolean;
@@ -879,6 +960,13 @@ declare namespace LocalJSX {
         "selected"?: boolean;
         "value"?: string;
     }
+    interface Q2Tag {
+        "label"?: string;
+        "onClick"?: (event: CustomEvent<{ value: string }>) => void;
+        "open"?: boolean;
+        "role"?: string;
+        "theme"?: 'primary' | 'secondary' | 'tertiary';
+    }
     interface Q2Textarea {
         "cols"?: number;
         "disabled"?: boolean;
@@ -933,7 +1021,9 @@ declare namespace LocalJSX {
         "q2-message": Q2Message;
         "q2-optgroup": Q2Optgroup;
         "q2-option": Q2Option;
+        "q2-option-list": Q2OptionList;
         "q2-pagination": Q2Pagination;
+        "q2-pill": Q2Pill;
         "q2-radio": Q2Radio;
         "q2-radio-group": Q2RadioGroup;
         "q2-section": Q2Section;
@@ -942,6 +1032,7 @@ declare namespace LocalJSX {
         "q2-stepper-pane": Q2StepperPane;
         "q2-tab-container": Q2TabContainer;
         "q2-tab-pane": Q2TabPane;
+        "q2-tag": Q2Tag;
         "q2-textarea": Q2Textarea;
         "tecton-tab-pane": TectonTabPane;
     }
@@ -970,7 +1061,9 @@ declare module "@stencil/core" {
             "q2-message": LocalJSX.Q2Message & JSXBase.HTMLAttributes<HTMLQ2MessageElement>;
             "q2-optgroup": LocalJSX.Q2Optgroup & JSXBase.HTMLAttributes<HTMLQ2OptgroupElement>;
             "q2-option": LocalJSX.Q2Option & JSXBase.HTMLAttributes<HTMLQ2OptionElement>;
+            "q2-option-list": LocalJSX.Q2OptionList & JSXBase.HTMLAttributes<HTMLQ2OptionListElement>;
             "q2-pagination": LocalJSX.Q2Pagination & JSXBase.HTMLAttributes<HTMLQ2PaginationElement>;
+            "q2-pill": LocalJSX.Q2Pill & JSXBase.HTMLAttributes<HTMLQ2PillElement>;
             "q2-radio": LocalJSX.Q2Radio & JSXBase.HTMLAttributes<HTMLQ2RadioElement>;
             "q2-radio-group": LocalJSX.Q2RadioGroup & JSXBase.HTMLAttributes<HTMLQ2RadioGroupElement>;
             "q2-section": LocalJSX.Q2Section & JSXBase.HTMLAttributes<HTMLQ2SectionElement>;
@@ -979,6 +1072,7 @@ declare module "@stencil/core" {
             "q2-stepper-pane": LocalJSX.Q2StepperPane & JSXBase.HTMLAttributes<HTMLQ2StepperPaneElement>;
             "q2-tab-container": LocalJSX.Q2TabContainer & JSXBase.HTMLAttributes<HTMLQ2TabContainerElement>;
             "q2-tab-pane": LocalJSX.Q2TabPane & JSXBase.HTMLAttributes<HTMLQ2TabPaneElement>;
+            "q2-tag": LocalJSX.Q2Tag & JSXBase.HTMLAttributes<HTMLQ2TagElement>;
             "q2-textarea": LocalJSX.Q2Textarea & JSXBase.HTMLAttributes<HTMLQ2TextareaElement>;
             "tecton-tab-pane": LocalJSX.TectonTabPane & JSXBase.HTMLAttributes<HTMLTectonTabPaneElement>;
         }

package/dist/types/workspace/workspace/tecton-production_release_1.12.x/packages/q2-tecton-elements/.stencil/test/elements/q2-tag-test.d.ts

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

package/dist/types/workspace/workspace/{tecton-production_release_1.11.x → tecton-production_release_1.12.x}/packages/q2-tecton-elements/.stencil/test/helpers.d.ts

@@ -11,3 +11,4 @@ export declare function setWindowHeight(height: number): void;
 export declare function makeDomRect(customAttributes: any): any;
 export declare const base64Image = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII=";
 export declare function getActiveElementTestId(page: E2EPage): Promise<string>;
+export declare function getFocusedAttribute(page: E2EPage, attribute: string): Promise<string>;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "q2-tecton-elements",
-    "version": "1.11.4",
+    "version": "1.12.1",
     "description": "Q2 Tecton Custom Elements",
     "main": "dist/index.js",
     "module": "dist/index.mjs",
@@ -48,5 +48,5 @@
         "smoothscroll-polyfill": "^0.4.4",
         "swiper": "7.4.1"
     },
-    "gitHead": "766452301a0e293da66eb59a1484492e4c249b0d"
+    "gitHead": "b433f2bf3dc1756f899a2b06d183603f378a8e85"
 }

package/dist/q2-tecton-elements/p-564154f3.entry.js

@@ -1 +0,0 @@
-import{r as t,c as s,h as i,g as e}from"./p-080839ed.js";import{c as o,s as a,l as h,h as r,o as n,i as l}from"./p-f85da2a8.js";const c=class{constructor(i){t(this,i),this.change=s(this,"change",7),this.input=s(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.hasCustomDisplay=!1,this.inputFocused=!1,this.scheduledAfterRender=[],this.keyStore={queue:[],lastPressedAt:new Date},this.guid=o(),this.onMutationObserved=()=>{const t=this.hostElement.querySelector(".custom-display-content"),s=this.hostElement.shadowRoot.querySelector('slot[name="q2-select-display"]'),i=s?s.assignedNodes().length>0:t.children.length>0;if(this.hasCustomDisplay!==i&&(this.hasCustomDisplay=i),this.multiple)return void this.updateMultipleOptionAttrs();this.updateSingleOptionAttrs();const e=this.optionElements[this.activeIndex];e&&e.id===this.activeOptionId||(this.activeIndex=this.getDefaultActiveIndex(),this.setActiveOption())},this.searchAndFocus=t=>{(()=>{const s=new Date;s.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=s})();const s=(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,s)=>({element:t,index:s})));return[...t.slice(this.pivotIndex),...t.slice(0,this.pivotIndex)]})());s&&(({element:t,index:s})=>{this.dropdownOpen||this.multiple?this.openDropdownWithActiveElement(s):(this.activeIndex=s,this.change.emit({value:t.value}))})(s)},this.dropdownFocusoutHandler=t=>{const{relatedTarget:s}=t,i=this.dropdownContainer.contains(s),e=!i&&this.hostElement.contains(s);i||e||this.dropdownOpen&&this.closeDropdown()},this.dropdownKeydownHandler=t=>{t.stopPropagation();const{activeIndex:s,searchable:i,optionElements:e,multiSelectHeader:o}=this,{key:a,shiftKey:h}=t;if(!(this.readonly||o&&o.contains(t.target)&&[" ","Enter"].includes(a)))switch(a){case" ":case"Enter":t.preventDefault(),t.stopPropagation();const o=this.hostElement.querySelector(`[option-id="${this.activeOptionId}"]`);if(!o||o.disabled)break;this.selectOption(o.value,!0);break;case"ArrowUp":if(t.preventDefault(),0===s)break;if(void 0!==s){const t=this.getNextVisibleIndex(-1);if(-1===t)break;this.adjustActiveOptionAndScroll(t-s)}else this.setDefaultActiveElement();break;case"ArrowDown":if(t.preventDefault(),s===e.length-1)break;if(void 0!==s){const t=this.getNextVisibleIndex(1);if(-1===t)break;this.adjustActiveOptionAndScroll(t-s)}else this.setDefaultActiveElement();break;case"Home":t.preventDefault(),this.openDropdownWithActiveElement(0);break;case"End":t.preventDefault(),this.openDropdownWithActiveElement(e.length-1);break;case"PageUp":t.preventDefault(),this.openDropdownWithActiveElement(Math.max(s-10,0));break;case"PageDown":t.preventDefault(),this.openDropdownWithActiveElement(Math.min(s+10,e.length-1));break;case"Tab":if(h)break;const r=this.hostElement.querySelector(`[option-id="${this.activeOptionId}"]`);if(!r||r.disabled)return;this.selectOption(r.value);break;case"Esc":case"Escape":this.closeDropdown(),this.focusInput();break;default:if(i)break;if(!a.match(/^[A-Za-z0-9]$/))break;this.searchAndFocus(a)}},this.inputKeydownHandler=t=>{t.stopPropagation();const{key:s}=t,{optionElements:i,dropdownOpen:e,searchable:o}=this;switch(s){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":e?this.closeDropdown():this.searchText="";break;default:if(o){this.openDropdownWithoutActiveElement();break}if(!s.match(/^[A-Za-z0-9]$/))break;this.searchAndFocus(s)}},this.inputClickHandler=t=>{t.stopPropagation(),a(this),this.toggleDropdown(),this.focusInput()},this.inputInputHandler=t=>{t.stopPropagation(),this.dropdownOpen||this.openDropdownWithoutActiveElement(),this.searchText=t.detail.value,this.input.emit({query:t.detail.value})},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.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}))},this.onCustomDisplayClick=t=>{t.stopPropagation(),this.focusInput(),this.toggleDropdown()}}resizeIframe(){return window.TectonElements&&window.TectonElements.resizeIframe&&window.TectonElements.resizeIframe()}getDefaultActiveIndex(){const t=this.optionElements.findIndex((t=>t.selected));if(t>-1)return t;const s=this.optionElements.findIndex((t=>!t.hidden));return s>-1?s:0}getLastEnabledIndex(){const t=this.optionElements.reduce(((t,s,i)=>(s.hidden||s.disabled||t.push(i),t)),[]);return t[t.length-1]}setActiveOption(){if(!this.dropdownOpen)return;const t=this.activeIndex;this.optionElements.forEach(((s,i)=>{t===i?(s.active=!0,this.activeOptionId=s.optionId):s.active=!1}))}setFocusedOption(){const t=this.optionElements[this.activeIndex];t&&(t.dispatchEvent(new FocusEvent("focus")),t.focus())}calculateMultiSelectSelectedDisplay(){if(1===this.selectedOptions.length){const t=this.optionElements.find((t=>t.value===this.selectedOptions[0]));return t&&t.display&&h(t.display)||t&&t.value||this.selectedOptions[0]}return this.selectedOptions.length>1?h("tecton.element.select.multiDisplay",[this.selectedOptions.length]):""}calculateSingleSelectSelectedDisplay(){const t=this.optionElements.find((t=>this.value===t.value));return t&&t.display&&h(t.display)||this.value||""}get minPopHeight(){const{minRows:t}=this,s=this.hostElement.querySelector("q2-option:not([hidden])"),i=s?window.getComputedStyle(s).minHeight:"44px";return t*parseInt(i)}get selectedDisplay(){return this.hasCustomDisplay&&!this.searchText?"":this.searchable&&this.dropdownOpen&&!this.value?this.searchText||"":this.multiple?this.calculateMultiSelectSelectedDisplay():this.calculateSingleSelectSelectedDisplay()}get selectedOptionsCount(){return this.selectedOptions.length}get optionElements(){return Array.from(this.hostElement.querySelectorAll("q2-option"))}get wrapperClasses(){return`q2-select-container${this.dropdownOpen?" dropdown-open":""}${Array.isArray(this.errors)&&this.errors.length>0?" has-error":""}${this.inputFocused?" is-focused":""}${this.searchable?" is-searchable":""}`}updateSingleOptionAttrs(){this.optionElements.forEach(((t,s)=>{t.selected=this.value===t.value,t.optionId=`q2-select-${this.guid}-option-${s}`,t.multiline=this.multilineOptions}))}updateMultipleOptionAttrs(){0===this.selectedOptions.length&&(this.onlyShowingSelected=!1),this.optionElements.forEach(((t,s)=>{t.selected=this.selectedOptions.includes(t.value),t._multiSelectHidden=!!this.onlyShowingSelected&&!t.selected,t.optionId=`q2-select-${this.guid}-option-${s}`,t.multiline=this.multilineOptions}))}selectOption(t,s=!1){if(this.multiple){const s=this.selectedOptions.includes(t);this.change.emit(s?{selectedOptions:this.selectedOptions.filter((s=>s!==t))}:{selectedOptions:[...this.selectedOptions,t]})}else this.change.emit({value:t}),this.closeDropdown(),s&&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(this.resizeIframe))}openDropdownWithActiveElement(t){this.readonly||(this.activeIndex=t,this.dropdownOpen=!0,this.setActiveOption(),this.scheduledAfterRender.push((()=>{this.setFocusedOption(),this.scrollToActiveOption(),this.resizeIframe()})))}closeDropdown(){this.dropdownOpen=!1,this.searchText&&(this.searchText="",this.input.emit({query:""})),this.scheduledAfterRender.push(this.resizeIframe)}toggleDropdown(){this.disabled||(this.searchable?this.dropdownOpen||this.openDropdownWithoutActiveElement():this.dropdownOpen?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 s=this.activeIndex+t;for(;s>=0&&s<=this.optionElements.length-1;){const{display:i,visibility:e}=window.getComputedStyle(this.optionElements[s]);if("none"!==i&&"hidden"!==e)return s;s+=t}return-1}componentWillLoad(){r(this)}componentDidLoad(){const t=new MutationObserver(this.onMutationObserved);t.observe(this.hostElement,{childList:!0,subtree:!0}),this.mutationObserver=t,this.onMutationObserved(),n(this.hostElement)}componentDidRender(){setTimeout((()=>{this.scheduledAfterRender.forEach((t=>t())),this.scheduledAfterRender=[]}),25)}disconnectedCallback(){this.mutationObserver&&(this.mutationObserver.disconnect(),this.mutationObserver=null)}ariaLabelObserver(){r(this)}valueUpdated(){this.multiple||this.updateSingleOptionAttrs()}selectedOptionsUpdated(){this.multiple&&this.updateMultipleOptionAttrs()}multilineOptionsChanged(t,s){t!==s&&this.optionElements.forEach((t=>{t.multiline=this.multilineOptions}))}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){const s=this.optionElements,i=t.detail.query.trim().toLowerCase();let e=0;s.forEach((t=>{if(""===i)t.style.display="";else{const{display:s="",innerText:o=""}=t,a=s.toLowerCase().includes(i)||o.toLowerCase().includes(i);t.hidden=!a,a&&e++}})),this.setStatusMessage(h(i?"tecton.element.select.searchable.results":"tecton.element.select.allOptions",[i?e:s.length]))}}delegateFocus(t){l(t,this.hostElement)&&this.inputField.shadowRoot.querySelector(".input-field").focus()}setStatusMessage(t){clearTimeout(this.statusMessageTimer),this.statusMessage="",this.statusMessageTimer=setTimeout((()=>{this.statusMessage=t}),1e3)}clickHandler(t){const s=t.target;"q2-option"!==s.localName||s.disabled||this.selectOption(s.value,!0)}keydownHandler(t){this.inputKeydownHandler(t)}render(){return i("click-elsewhere",{class:this.wrapperClasses,onChange:this.clickedElsewhere},i("div",{"aria-live":"polite","aria-atomic":"true",role:"status",class:"sr"},this.statusMessage),i("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:!this.searchable,"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}),i("div",{class:"custom-display-content",hidden:!this.hasCustomDisplay||!!this.searchText,onClick:this.onCustomDisplayClick},i("slot",{name:"q2-select-display"})),this.optionsDropdown())}optionsDropdown(){return i("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():"",i("div",{class:"q2-select-options",id:"dropdown",role:"listbox"},i("slot",null)))}visibilityToggle(){return i("div",{class:"multi-select-header",ref:t=>this.multiSelectHeader=t},h("tecton.element.select.multiHeader.showing"),i("q2-btn",{class:"option-toggle 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")),i("q2-btn",{class:"option-toggle 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",[this.selectedOptionsCount]),"hide-label":!0},h("tecton.element.select.multiHeader.selected",[this.selectedOptionsCount])))}get hostElement(){return e(this)}static get watchers(){return{ariaLabel:["ariaLabelObserver"],value:["valueUpdated"],selectedOptions:["selectedOptionsUpdated"],multilineOptions:["multilineOptionsChanged"]}}};c.style="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size: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);color:var(--t-font-color);left:0;width:100%;z-index:100;margin-top:1px;box-shadow:var(--app-shadow-1);height:0;overflow:hidden;opacity:0;visibility:hidden;transition:opacity var(--app-tween-1);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{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}.custom-display-content{position:absolute;bottom:0;left:calc(var-list(--tct-scale-2, --app-scale-2, 10px) + 1px);height:44px;width:calc(100% - 34px - var-list(--tct-scale-3, --app-scale-3, 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-list(--tct-scale-3, --app-scale-3, 15px) + 1px)}.has-error .custom-display-content{width:calc(100% - 68px - var-list(--tct-scale-3, --app-scale-3, 15px))}.dropdown-open .q2-select-dropdown{overflow-y:auto;max-height:300px}.multi-select-header{padding:var(--tct-scale-1, var(--app-scale-1, 5px)) var(--tct-scale-2, var(--app-scale-2, 10px))}.show-all-options{margin-right:var(--tct-scale-1, var(--app-scale-1, 5px));margin-left:var(--tct-scale-2, var(--app-scale-2, 10px))}.q2-element-dropdown.dropup{bottom:40px}";export{c as q2_select}

package/dist/q2-tecton-elements/p-6702eb4d.entry.js

@@ -1 +0,0 @@
-import{r as t,c as i,h as e,H as o,g as a}from"./p-080839ed.js";const n=class{constructor(e){t(this,e),this.click=i(this,"click",7),this.role="option",this.tabindex="-1",this._multiSelectHidden=!1,this.onClick=t=>{t.stopImmediatePropagation();const{disabled:i,disabledGroup:e}=this;i||e||this.click.emit()}}render(){const{disabled:t,disabledGroup:i,selected:a,_multiSelectHidden:n}=this;return e(o,{"aria-disabled":t||i?"true":void 0,"aria-selected":a?"true":void 0,"aria-hidden":n?"true":void 0},this.selected&&e("q2-icon",{type:"checkmark"}),e("div",{class:"content",onClick:this.onClick},e("slot",null)))}get hostElement(){return a(this)}};n.style='*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size: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{padding:0 var(--tct-scale-2, var(--app-scale-2, 10px));min-height:44px;align-items:center;cursor:pointer;grid-template-columns:var(--tct-option-selected-icon-size, var(--tct-scale-3, var(--app-scale-3, 15px))) 1fr;align-items:center;grid-template-areas:"icon content";gap:var(--tct-scale-1, var(--app-scale-1, 5px))}:host([aria-disabled]){cursor:not-allowed;opacity:var(--tct-disabled-opacity, var(--app-disabled-opacity, 0.4));pointer-events:none}:host([aria-hidden]){display:none}:host(:not([hidden]):not([aria-hidden])){display:grid}:host(:not([aria-disabled]):hover),:host([active]),:host(:focus){background-color:var(--tct-option-active-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, #f2f2f2)))))}q2-icon{grid-area:icon;--tct-icon-size:var(--tct-option-selected-icon-size, var(--tct-scale-3, var(--app-scale-3, 15px)))}.content{display:block;grid-area:content}:host(:not([multiline])) .content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}';export{n as q2_option}

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

@@ -1 +0,0 @@
-import{r as t,c as a,h as i,F as r,g as e}from"./p-080839ed.js";import{b as o,c as s,l as n,i as c,o as l}from"./p-f85da2a8.js";o();const h=class{constructor(i){t(this,i),this.change=a(this,"change",7),this.settled=a(this,"settled",7),this.noPrint=!1,this.guid=s(),this.scheduledAfterRender=[],this.lastScrolled=new Date(null).getTime(),this.hasLeft=!1,this.hasRight=!1,this.scrollEnabled=!1,this.showScrollLeft=!1,this.showScrollRight=!1,this.updateTabData=()=>{this.updateTabPaneProps(),this.setTabs()},this.updateTabPaneProps=()=>{this.tabPanes.forEach(((t,a)=>{t.selected=t.value===this.selectedTabValue,t.guid=this.guid,t.index=a}))},this.setTabs=()=>{this.tabs=this.tabPanes.map((({label:t,value:a})=>({label:t&&n(t)||"",value:a})))},this.onTabClick=t=>{this.value===t.target.dataset.value||this.change.emit({value:t.target.dataset.value})},this.onTabKeyDown=t=>{const a=t.target.dataset.value;switch(t.key){case"ArrowRight":t.preventDefault(),this.moveToAdjacentTab(a,"next");break;case"ArrowLeft":t.preventDefault(),this.moveToAdjacentTab(a,"prev");break;case"Home":t.preventDefault(),this.moveToAdjacentTab(a,"first");break;case"End":t.preventDefault(),this.moveToAdjacentTab(a,"last");break;case"Space":case"Enter":t.preventDefault(),this.change.emit({value:a})}},this.moveToAdjacentTab=(t,a)=>{let i,r=this.tabs.map((({value:t})=>t)).indexOf(t);switch(a){case"next":i=Math.min(r+1,this.tabs.length-1);break;case"prev":i=Math.max(r-1,0);break;case"first":i=0;break;case"last":i=this.tabs.length-1}r!==i&&this.moveFocus(i,!1)},this.moveFocus=(t,a=!0)=>{const i=this.listElement.querySelector(`[data-value="${this.tabs[t].value}"]`);return i.focus({preventScroll:a}),this.listElement.scrollTo({left:i.offsetLeft-this.listElement.clientWidth/2,behavior:"smooth"}),i},this.checkScrollState=()=>{if(!this.listElement)return;const{scrollLeft:t,scrollWidth:a,clientWidth:i}=this.listElement;this.scrollEnabled=a>i,this.showScrollLeft=!!t,this.showScrollRight=a!==t+i},this.onScrollBtnClick=t=>{const a=Math.floor(this.listElement.clientWidth/2);this.listElement.scrollBy({left:"left"===t?-a:a,behavior:"smooth"})},this.onSlotChange=()=>{this.checkScrollState()}}resizeIframe(){var t,a;return null===(a=null===(t=window.TectonElements)||void 0===t?void 0:t.resizeIframe)||void 0===a?void 0:a.call(t)}get tabPanes(){const t=this.hostElement.querySelectorAll("q2-tab-pane, tecton-tab-pane");return 0===t.length?[]:Array.from(t).filter((t=>t.name===this.name))}get selectedTabValue(){return this.value||this.tabPanes[0].value||""}get tabList(){return this.hostElement.shadowRoot.querySelector(".tab-list")}defaultChangeHandler(t){t.target!==this.hostElement||this.hostElement.onchange||(this.value=t.detail.value)}onResize(){this.checkScrollState()}onFocus(t){if(!c(t,this.hostElement))return;const a=this.tabs.findIndex((t=>t.value===this.selectedTabValue));this.moveFocus(a)}componentWillLoad(){const t=new MutationObserver(this.updateTabData);t.observe(this.hostElement,{childList:!0,attributes:!0}),this.mutationObserver=t,this.resizeObserver=new ResizeObserver((()=>this.checkScrollState())),this.updateTabData()}componentDidRender(){this.scheduledAfterRender.forEach((t=>t())),this.scheduledAfterRender=[],this.settled.emit()}componentDidLoad(){this.resizeObserver.observe(this.listElement),this.checkScrollState(),l(this.hostElement);const t=this.tabs.findIndex((t=>t.value===this.value));this.scheduledAfterRender.push((()=>{const a=this.moveFocus(Math.max(t,0));this.value=a.dataset.value,a.blur()}))}disconnectedCallback(){this.resizeObserver.disconnect(),this.mutationObserver.disconnect(),this.mutationObserver=null}valueObserver(){this.updateTabData(),this.scheduledAfterRender.push(this.resizeIframe);const t=this.tabs.findIndex((t=>t.value===this.value));t>-1&&this.scheduledAfterRender.push((()=>this.moveFocus(t,!1)))}nameObserver(){this.updateTabData()}render(){return i(r,null,i("div",{class:"tab-container"},this.scrollEnabled&&i(r,null,i("div",{class:"gradient-left",hidden:!this.showScrollLeft}),i("div",{class:"gradient-right",hidden:!this.showScrollRight}),i("q2-btn",{class:"btn-left",hidden:!this.showScrollLeft,onClick:()=>this.onScrollBtnClick("left")},i("q2-icon",{type:"chevron-left"})),i("q2-btn",{class:"btn-right",hidden:!this.showScrollRight,onClick:()=>this.onScrollBtnClick("right")},i("q2-icon",{type:"chevron-right"}))),i("ul",{onScroll:this.checkScrollState,ref:t=>this.listElement=t,class:this.noPrint?"no-print":null,role:"tablist"},this.tabs.map(((t,a)=>this.generateTab(t,a))))),i("div",{class:"tab-content"},i("slot",{onSlotchange:()=>this.onSlotChange()})))}generateTab(t,a){const{label:r,value:e}=t,o=this.selectedTabValue===e;return i("li",{role:"presentation"},i("button",{id:`tab-${this.guid}-${a}`,"data-value":e,"test-id":"tabLink",tabIndex:o?0:-1,role:"tab","aria-selected":o?"true":void 0,"aria-controls":`tab-pane-${this.guid}-${a}`,onClick:this.onTabClick,onKeyDown:this.onTabKeyDown},r))}get hostElement(){return e(this)}static get watchers(){return{value:["valueObserver"],name:["nameObserver"]}}};h.style="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size: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;position:relative}button{cursor:pointer;margin:0}.tab-container{position:relative}ul{--comp-container-padding:var(--tct-scale-1, var(--app-scale-1, 5px)) var(--tct-scale-1, var(--app-scale-1, 5px)) 0;padding:var(--tct-tab-container-padding, var(--t-tab-container-padding, var(--comp-container-padding)));display:flex;gap:var(--tct-tab-gap, var(--t-tab-gap, var(--tct-scale-1, var(--app-scale-1, 5px))));list-style:none;border-bottom:1px solid var(--tct-tab-container-border-color, var(--t-tab-container-border-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc))))));overflow-x:auto;align-items:center;scrollbar-width:none;scrollbar-color:transparent}ul::-webkit-scrollbar{width:0;height:0}ul::-webkit-scrollbar-thumb{background:transparent}ul::-webkit-scrollbar-track{background:transparent}@media print{ul.no-print{display:none}}li{flex:0 0 auto}li button{background:var(--tct-tab-inactive-bg-color, var(--t-tab-inactive-bg-color, transparent));border-width:var(--tct-tab-inactive-border-width, var(--t-tab-inactive-border-width, 0 0 3px 0));border-color:var(--tct-tab-inactive-border-color, var(--t-tab-inactive-border-color, transparent));border-style:var(--tct-tab-inactive-border-style, var(--t-tab-inactive-border-style, solid));border-radius:var(--tct-tab-border-radius, var(--t-tab-border-radius, 0));width:var(--tct-tab-width, var(--t-tab-width, 100%));text-align:var(--tct-tab-text-align, var(--t-tab-text-align, center));text-decoration:var(--tct-tab-text-decoration, var(--t-tab-text-decoration, none));padding:var(--tct-tab-padding, var(--t-tab-padding, var(--tct-scale-2, var(--app-scale-2, 10px))));color:var(--tct-tab-inactive-color, var(--t-tab-inactive-color, inherit));font-size:var(--tct-tab-font-size, var(--t-tab-font-size, 17px));display:block;transition:color var(--tct-tween-2, var(--app-tween-2, 0.4s ease)), border-color var(--tct-tween-1, var(--app-tween-1, 0.2s ease))}:host([type=section]) li button{--comp-tab-section-padding:var(--tct-scale-2, var(--app-scale-2, 10px)) var(--tct-scale-1, var(--app-scale-1, 5px));font-size:inherit;padding:var(--tct-tab-section-padding, var(--t-tab-section-padding, var(--comp-tab-section-padding)))}li button:hover{color:var(--tct-tab-hover-color, var(--t-tab-hover-color, var(--tct-tab-active-color, var(--t-tab-active-color, #2e2e2e))));background-color:var(--tct-tab-hover-bg-color, var(--t-tab-hover-bg-color, inherit));width:var(--tct-tab-hover-width, var(--t-tab-hover-width, 100%))}li button[aria-selected=true]{color:var(--tct-tab-active-color, var(--t-tab-active-color, #2e2e2e));border-color:var(--tct-tab-active-border-color, var(--t-tab-active-border-color, currentColor));border-style:var(--tct-tab-active-border-style, var(--t-tab-active-border-style, solid));width:var(--tct-tab-active-width, var(--t-tab-active-width, 100%));background-color:var(--tct-tab-active-bg-color, var(--t-tab-active-bg-color, inherit))}:host([color=alt]) li button{color:var(--tct-tab-alt-inactive-color, var(--t-tab-alt-inactive-color, inherit))}:host([color=alt]) li button:hover,:host([color=alt]) li button[aria-selected=true]{color:var(--tct-tab-alt-active-color, var(--t-tab-alt-active-color, inherit))}@media screen and (max-width: 767px){li button{--comp-tab-padding:var(--tct-scale-2, var(--app-scale-2, 10px)) var(--tct-scale-1, var(--app-scale-1, 5px));font-size:inherit;padding:var(--tct-tab-padding, var(--t-tab-padding, var(--comp-tab-padding)))}}.tab-content{--comp-tab-content-padding:var(--tct-scale-2, var(--app-scale-2, 10px)) 0;padding:var(--tct-tab-content-padding, var(--t-tab-content-padding, var(--comp-tab-content-padding)))}.tab-content:focus{outline:none;box-shadow:none}.gradient-left,.gradient-right{z-index:1;position:absolute;top:0;height:100%;width:44px}.gradient-left{background-image:linear-gradient(to right, var(--t-base), var(--t-base-a0));left:0}.gradient-right{background-image:linear-gradient(to right, var(--t-base-a0), var(--t-base));right:0}.btn-left,.btn-right{--tct-icon-size:18px;--tct-btn-icon-hover-bg:transparent;--tct-btn-icon-width:22px;--tct-icon-stroke-primary:var(--tct-stepper-scroll-arrow-color, var(--t-stepper-scroll-arrow-color, var(--t-text, #4d4d4d)));position:absolute;top:calc(50% - 22px);z-index:2}.btn-left{left:0}.btn-right{right:0}";export{h as q2_tab_container}