npm - q2-tecton-elements - Versions diffs - 1.67.0 → 1.67.1 - Mend

q2-tecton-elements 1.67.0 → 1.67.1

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 (256) hide show

package/dist/components/q2-month-picker.js CHANGED Viewed

@@ -145,10 +145,10 @@ const Q2MonthPicker$1 = /*@__PURE__*/ proxyCustomElement(class Q2MonthPicker ext
     // #endregion
     // #region Render Methods
     render() {
-        return (h("div", { key: 'a79408285992125baf4ab6771f6501d79a6245df', class: "month-container", onKeyDown: this.onMonthKeydown }, h("div", { key: '857185b3278ee9b9f346686e587a39250130e532', class: "navigation" }, h("q2-btn", { key: 'f698f8ea247ba18ecd40d22c74c4247fa300cf3d', class: "year-btn", onClick: () => this.viewChange.emit({
+        return (h("div", { key: 'b7429b5ed21f7cda666f140a9a93ee643176979c', class: "month-container", onKeyDown: this.onMonthKeydown }, h("div", { key: '802900b16d0efa602df89edb22e174329736dca4', class: "navigation" }, h("q2-btn", { key: '0a318088ab2eb826620c056246599f5b7803c51e', class: "year-btn", onClick: () => this.viewChange.emit({
                 view: 'year',
                 selectedYear: this.year,
-            }) }, h("span", { key: 'fc467f87579a2a1c90c72e22aa49715ed4130d22', class: "year" }, this.year), h("q2-icon", { key: '545d4a90b2c57ef0109475746f963a879c4d69d8', class: "year-icon off", type: "chevron-down" })), h("div", { key: '1b1c130e07944ab988e981f41b3351237a638f7e', class: "month-controller" }, h("div", { key: '5967309b329f2f0697a26a69d91dfb50b0a6d526', class: "cal-year-prev-next" }, h("q2-btn", { key: '23295dbba205dd04a809511501b49b74bd845f16', label: loc('tecton.element.calendar.previousYear'), "hide-label": true, class: "cal-nav-btn prev-year", "test-id": "previousYearButton", onClick: () => this.selectYear(this.year - 1) }, h("q2-icon", { key: '845a1a049fe80fd08470cbaf1b530bcf41734c39', type: "arrow-left" })), h("q2-btn", { key: '2074d486e8a0d00cee2ac874230ff2411444f669', label: loc('tecton.element.calendar.nextYear'), "hide-label": true, class: "cal-nav-btn next-year", "test-id": "nextYearButton", onClick: () => this.selectYear(this.year + 1) }, h("q2-icon", { key: '97699d8fa0378afa468bbb71e8bce6ccb9e78423', type: "arrow-right" }))))), h("div", { key: 'f373f6a783137aca3691fdfdc70bea04d487b63e', class: "month-list", onClick: this.onMonthSelection }, this.months.map((month, index) => (h("div", { class: "month" }, h("span", { role: "button", class: "month-button", "data-index": index, "aria-label": month.label, tabindex: index === this.focusedIndex ? 0 : -1 }, month.abbr))))), this.today && (h("div", { key: 'b85641400c0c17171278735aa8e8b81f2497ac27', class: "today-label" }, loc('tecton.element.calendar.today'), ": ", this.today))));
+            }) }, h("span", { key: '02018f884cb7b48fb581597fc7d5a2a323497668', class: "year" }, this.year), h("q2-icon", { key: '9ab23a381d4fedb5aca2ecee19eb975d76ff4465', class: "year-icon off", type: "chevron-down" })), h("div", { key: '79dd4cd0864d051a4252c21ebbd697e0e75b0ec3', class: "month-controller" }, h("div", { key: 'd94ad2ebfc317206bfff5b16861c52507a168e09', class: "cal-year-prev-next" }, h("q2-btn", { key: '4d8b12fde9825bd5dca90012d42e73453f2cb777', label: loc('tecton.element.calendar.previousYear'), "hide-label": true, class: "cal-nav-btn prev-year", "test-id": "previousYearButton", onClick: () => this.selectYear(this.year - 1) }, h("q2-icon", { key: '428b2feb8854e145bdbc88bdd2c6a2c25a3a50ce', type: "arrow-left" })), h("q2-btn", { key: '2f7ef439402c9788ae002a199813387a370e0ed3', label: loc('tecton.element.calendar.nextYear'), "hide-label": true, class: "cal-nav-btn next-year", "test-id": "nextYearButton", onClick: () => this.selectYear(this.year + 1) }, h("q2-icon", { key: '5931c20eac7a2268c6b945b336f44e143e9fe484', type: "arrow-right" }))))), h("div", { key: '9e18ae0e86a741201eb2a8c6ff04b9007899cbae', class: "month-list", onClick: this.onMonthSelection }, this.months.map((month, index) => (h("div", { class: "month" }, h("span", { role: "button", class: "month-button", "data-index": index, "aria-label": month.label, tabindex: index === this.focusedIndex ? 0 : -1 }, month.abbr))))), this.today && (h("div", { key: '8dfee8bcf4ee9b4137c9c8644be7f38f5794bf4d', class: "today-label" }, loc('tecton.element.calendar.today'), ": ", this.today))));
     }
     get hostElement() { return this; }
     static get style() { return q2MonthPickerCss; }

package/dist/components/q2-mutation-observer.js CHANGED Viewed

@@ -92,7 +92,7 @@ const Q2MutationObserver$1 = /*@__PURE__*/ proxyCustomElement(class Q2MutationOb
     // #endregion
     // #region Render Methods
     render() {
-        return h("slot", { key: 'b383eb3c2f5d2983f3658f776bd52736b4b6f9a5', onSlotchange: this.handleSlotChange });
+        return h("slot", { key: 'a7a47f38488edeb403658d1ad7464e79ef254709', onSlotchange: this.handleSlotChange });
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-optgroup2.js CHANGED Viewed

@@ -56,7 +56,7 @@ const Q2Optgroup = /*@__PURE__*/ proxyCustomElement(class Q2Optgroup extends HTM
     // #endregion
     // #region Render Methods
     render() {
-        return (h("div", { key: '03ea146fc88b43ccd10050cffb20c95bcc64c565', class: "q2-optgroup-container", hidden: this.hidden, "aria-labelledby": this.headerId, role: "group" }, h("div", { key: '4738ff37a955e7d742a634ce7f043bdfc9f9720d', class: "q2-optgroup-header", id: this.headerId }, (this.label && loc(this.label)) || ''), h("div", { key: '5f387ec9d47194ee11415a3c91f01ea5b2107822', class: "q2-optgroup-options" }, h("slot", { key: '765abe9037d131fa65f5c4ace78de0282c2e17a1' }))));
+        return (h("div", { key: '1193ca6f02dab8603a148059edfd6b3f01e55556', class: "q2-optgroup-container", hidden: this.hidden, "aria-labelledby": this.headerId, role: "group" }, h("div", { key: '5731f04b1976e5e1f96ab37f577ead3889b80e8c', class: "q2-optgroup-header", id: this.headerId }, (this.label && loc(this.label)) || ''), h("div", { key: 'a52522a81176e91855514da0f051058c740ee4b6', class: "q2-optgroup-options" }, h("slot", { key: '8b0c0e1f18f3b8ca76cd3c00e28e5cef73457ca6' }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-option-list2.js CHANGED Viewed

@@ -582,7 +582,7 @@ const Q2OptionList = /*@__PURE__*/ proxyCustomElement(class Q2OptionList extends
     // #endregion
     // #region Render Methods
     render() {
-        return (h(Host, { key: '05e3dbeb1ffe4910f7c3c922311f51e0e34a4771' }, h("div", { key: '152c7430207325f6d6bcb6b5253c61528f9338eb', class: "content", ref: el => (this.contentElement = el), onFocusout: this.focusoutHandler }, h("div", { key: 'd94b9d6fe8fe5221b44c59424351cd2fa4e2139b', class: "options", "aria-label": loc('tecton.element.optionList.label', [this.label]), "aria-multiselectable": this.type === 'menu' ? undefined : `${!!this.multiple}`, role: this.type || 'listbox', onKeyDown: this.internalKeydownHandler, onClick: this.clickHandler }, h("slot", { key: 'c655e10092d73bdeb985ee08776024c5dbd6fc96' })))));
+        return (h(Host, { key: '99c8a52ef8c6adbd138bdd4ff40340fabe670903' }, h("div", { key: '632777fab876b3ef838e8658de35df410fc1d3b7', class: "content", ref: el => (this.contentElement = el), onFocusout: this.focusoutHandler }, h("div", { key: '97079fcb63d10e57ae3e3f1fcbc0a4c307dcda3c', class: "options", "aria-label": loc('tecton.element.optionList.label', [this.label]), "aria-multiselectable": this.type === 'menu' ? undefined : `${!!this.multiple}`, role: this.type || 'listbox', onKeyDown: this.internalKeydownHandler, onClick: this.clickHandler }, h("slot", { key: '07f07e638defb8427f320db9bf3cfb87f6711f9e' })))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-pagination.js CHANGED Viewed

@@ -317,7 +317,7 @@ const Q2Pagination$1 = /*@__PURE__*/ proxyCustomElement(class Q2Pagination exten
                 total,
             });
         }
-        return (h("nav", { key: 'f99b44d19603ae3981ef849748ef6163fc45919b', class: this.containerClasses.join(' '), ref: el => (this.containerElement = el), "aria-label": loc('tecton.element.pagination.title') }, h("div", { key: 'd1643de16462d1f16fc252eeed2e568e246648a1', class: "description", "test-id": "description" }, pagesOnly
+        return (h("nav", { key: '642369130b2d57d4e6a89927608636a4da87f11d', class: this.containerClasses.join(' '), ref: el => (this.containerElement = el), "aria-label": loc('tecton.element.pagination.title') }, h("div", { key: 'e988b3374cec5bb1a73dfbcc705899fb3a3474d6', class: "description", "test-id": "description" }, pagesOnly
             ? loc('tecton.element.pagination.pages', {
                 current: page,
                 total: totalPages,
@@ -326,10 +326,10 @@ const Q2Pagination$1 = /*@__PURE__*/ proxyCustomElement(class Q2Pagination exten
                 range: currentRange,
                 recordType: recordType.toLowerCase(),
                 total: total.toLocaleString(),
-            })), h("div", { key: '6ffec6ee2128172163a381f76d9e06fe82c7316b', class: "controls" }, h("div", { key: 'decc2ca51ad2365a07ffd112c1d1726e174b5d0c', class: "btn-group" }, h("q2-btn", { key: '7b85578c7595c4285c995c5e5359f6c441bdda51', ref: el => (this.firstPageBtn = el), label: loc('tecton.element.pagination.goToFirstPage'), disabled: disabled || onFirstPage, hidden: isFullViewHidden, onTctClick: () => this.handlePageChange(1), "test-id": "firstPageBtn", "hide-label": true }, h("q2-icon", { key: '550559c6d68876121fb3aaa87414e4adb11f4429', type: "chevron-double-left" })), h("q2-btn", { key: '6bf47805cabef90404a66317fc4bff10921818bd', ref: el => (this.prevPageBtn = el), label: prevButtonLabel, disabled: disabled || onFirstPage, onTctClick: () => this.handlePageChange(page - 1), "test-id": "prevPageBtn", "hide-label": true }, h("q2-icon", { key: 'cd7e55771f9de549a7729236df927274745825b9', type: "chevron-left" }))), h("div", { key: '730078a28d7d555bfed57381b972e54c8059a556', class: "input-display", hidden: isFullViewHidden }, h("span", { key: '35b93b8034569d72bf0670d73f7ce1ec0fef826e', "aria-hidden": "true" }, loc('tecton.element.pagination.page')), h("div", { key: 'd28c27c41044573a0fb1adf2b8a89ef582c5aa98', class: "input-wrapper", onClick: () => this.inputField.dispatchEvent(new FocusEvent('focus')) }, h("q2-input", { key: '28bf16274c57944a7a7132dd29a2e606d9f6c108', ref: el => (this.inputField = el), type: "number", value: `${page}`, min: 1, max: this.totalPages, hideLabel: true, optional: true, label: `${loc('tecton.element.pagination.page')} (${loc('tecton.element.pagination.ofPages', [totalPages.toLocaleString()])})`, onChange: event => event.stopImmediatePropagation(), onTctChange: event => {
+            })), h("div", { key: '8ac5316082ab9fcc03fd6c605e56e31124f5d5dc', class: "controls" }, h("div", { key: 'c7e99c77f10d0d587d31af19b3bd39ba2d64aeb7', class: "btn-group" }, h("q2-btn", { key: 'ba7cc1e9b1eee9d0db75e7f653c74974e06435a6', ref: el => (this.firstPageBtn = el), label: loc('tecton.element.pagination.goToFirstPage'), disabled: disabled || onFirstPage, hidden: isFullViewHidden, onTctClick: () => this.handlePageChange(1), "test-id": "firstPageBtn", "hide-label": true }, h("q2-icon", { key: '90b82dd3b935af151d517c997086e5779e51bd3c', type: "chevron-double-left" })), h("q2-btn", { key: '179b59d1c5cebff1897d5e0a3e825e969da90719', ref: el => (this.prevPageBtn = el), label: prevButtonLabel, disabled: disabled || onFirstPage, onTctClick: () => this.handlePageChange(page - 1), "test-id": "prevPageBtn", "hide-label": true }, h("q2-icon", { key: 'b23b78e56fc5df453036c07c055f2bc7bf10da11', type: "chevron-left" }))), h("div", { key: '5ac4941af9479fe7c2644cfe56fb1bf3f4e2c968', class: "input-display", hidden: isFullViewHidden }, h("span", { key: 'f748874515ec184a25bc2f10f16f1031b4ed5583', "aria-hidden": "true" }, loc('tecton.element.pagination.page')), h("div", { key: '2e870838a5ca57ccfd80f648f8eaf6f895c950be', class: "input-wrapper", onClick: () => this.inputField.dispatchEvent(new FocusEvent('focus')) }, h("q2-input", { key: '3c765b872520ae12cf6d86789a5dfb56fe140d97', ref: el => (this.inputField = el), type: "number", value: `${page}`, min: 1, max: this.totalPages, hideLabel: true, optional: true, label: `${loc('tecton.element.pagination.page')} (${loc('tecton.element.pagination.ofPages', [totalPages.toLocaleString()])})`, onChange: event => event.stopImmediatePropagation(), onTctChange: event => {
                 event.stopPropagation();
                 this.handlePageChange(event.detail.value);
-            }, "test-id": "pageInput", current: "page", disabled: disabled })), h("span", { key: '5fc845812367d39bf91826657da31f39436fc670', "aria-hidden": "true" }, loc('tecton.element.pagination.ofPages', [totalPages.toLocaleString()]))), h("div", { key: '73183db09f66cad393b33571260579720f2e8c12', class: "btn-group" }, h("q2-btn", { key: 'c3daf5fd49273bede94ce2a9994309d282f1bdbf', ref: el => (this.nextPageBtn = el), label: nextButtonLabel, disabled: disabled || onLastPage, onTctClick: () => this.handlePageChange(page + 1), "test-id": "nextPageBtn", "hide-label": true }, h("q2-icon", { key: '427474ab8f77a0e314a687bb00d199858234f30d', type: "chevron-right" })), h("q2-btn", { key: '607732d95674f7620423817e7394ec4e88ac6e9b', ref: el => (this.lastPageBtn = el), label: "tecton.element.pagination.goToLastPage", disabled: disabled || onLastPage, hidden: isFullViewHidden, onTctClick: () => this.handlePageChange(totalPages), "test-id": "lastPageBtn", "hide-label": true }, h("q2-icon", { key: 'ff871b93e2f4932eddde86761f126fb6937b43fb', type: "chevron-double-right" })))), h("div", { key: '506a9fd9aa1790d1a2efb7b8a744a8fc1d76a409', class: "per-page", hidden: isFullViewHidden || !((_a = this.perPageIncrements) === null || _a === void 0 ? void 0 : _a.length) }, showPerPageSelect && this.renderPerPage())));
+            }, "test-id": "pageInput", current: "page", disabled: disabled })), h("span", { key: '1fad0a391c7b5b2bac9439b7116674d43d205a95', "aria-hidden": "true" }, loc('tecton.element.pagination.ofPages', [totalPages.toLocaleString()]))), h("div", { key: '52dc5be6a7deae84418c2cfbf108b68451c3db5b', class: "btn-group" }, h("q2-btn", { key: 'b1aa2468c227ad4f251736eee6596a0525f620dd', ref: el => (this.nextPageBtn = el), label: nextButtonLabel, disabled: disabled || onLastPage, onTctClick: () => this.handlePageChange(page + 1), "test-id": "nextPageBtn", "hide-label": true }, h("q2-icon", { key: '689bc3f2f90724c53ff67d9724d17cc303af716c', type: "chevron-right" })), h("q2-btn", { key: 'bb1bb9cbbbc58454e6f811fcaa5359d561d79042', ref: el => (this.lastPageBtn = el), label: "tecton.element.pagination.goToLastPage", disabled: disabled || onLastPage, hidden: isFullViewHidden, onTctClick: () => this.handlePageChange(totalPages), "test-id": "lastPageBtn", "hide-label": true }, h("q2-icon", { key: 'd271e5fd48c58f95f0b8d2d45af6f48c335038e8', type: "chevron-double-right" })))), h("div", { key: 'cc2ac1c470e2034b242079c44ecf4435cb42548e', class: "per-page", hidden: isFullViewHidden || !((_a = this.perPageIncrements) === null || _a === void 0 ? void 0 : _a.length) }, showPerPageSelect && this.renderPerPage())));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-pill.js CHANGED Viewed

@@ -377,7 +377,7 @@ const Q2Pill$1 = /*@__PURE__*/ proxyCustomElement(class Q2Pill extends HTMLEleme
             wrapperClassNames.push('has-icon');
         if (optionCount)
             wrapperClassNames.push('has-options');
-        return (h("click-elsewhere", { key: '33f8d76b96617663d26ec896e9d389fcaa18e6e1', onChange: this.onClickElsewhere }, h("div", { key: '96e54e580f5f313a5f50049fe4a795fc444c1de5', class: wrapperClassNames.join(' ') }, h("div", { key: 'a5482940be97c882b54e4674f96f88344553e274', class: "btn-height-wrapper", ref: el => (this.primaryBtnWrapper = el), onClick: this.handleWrapperClick, tabIndex: -1 }, h("button", { key: 'd19714c018c3ba17433614432fc6225f84c2dbba', class: "btn-primary", "test-id": "btn-control", type: "button", role: (optionCount && 'combobox') || undefined, ref: el => (this.primaryBtn = el), onClick: this.handleClick, onKeyDown: this.handleKeydown, onFocusout: this.handleFocusOut, disabled: this.disabled, "aria-roledescription": !optionCount && 'filter', "aria-controls": (optionCount && 'option-list') || undefined, "aria-expanded": (optionCount && `${!!open}`) || undefined, "aria-label": `${this.buttonContent}${!optionCount && active ? ` ${loc('tecton.element.pill.active')}` : ''}`, "aria-describedby": (optionCount && 'option-description') || undefined }, this.truncatedButtonContent)), this.renderIcon(), !!optionCount && this.renderHiddenElement()), this.optionCount > 0 && (h("q2-popover", { key: 'a321b1db273a1d401e932f35f05245e3d3199b88', ref: el => (this.popoverElement = el), controlElement: this.primaryBtn, open: this.open, "max-height": this.popoverMaxHeight, minHeight: this.popoverMinHeight, direction: this.popoverDirection, align: this.popoverAlignment, onFocusout: this.handleFocusOut }, h("div", { key: 'e9fc516f6855ae2c9cc67dd46c041e736c4d552e', class: "popover-content" }, h("div", { key: '9cc43dbc66b7eb40f05d89278684a24f7f2b061f', ref: el => (this.popoverTopContainer = el), class: "popover-top-container", tabindex: "-1", hidden: !this.hasPopoverTop, onKeyDown: this.handleKeydown }, h("slot", { key: 'b3d2ff22c4fc3293ebfa70db9f42c2940e149825', name: "popover-top" })), h("q2-option-list", { key: 'ebb64d5e7086c49c84b8da96669b5ad9eaa9b631', type: "listbox", ref: el => (this.optionList = el), id: "option-list", onChange: this.handleChange, multiple: this.multiple, selectedOptions: this.selectedOptions, onReady: () => this.updateSelectedOptionElements(), onPopoverState: this.onPopoverState, label: loc('tecton.element.optionList.label', [this.optionListLabel]) }, h("slot", { key: 'a09461650fc5b4cd38cdc316eb546f877c0ee9d6' })), h("div", { key: 'f146e3181d0b35dbe28f46b9ab4d0aaf9691f9ef', ref: el => (this.popoverBottomContainer = el), class: "popover-bottom-container", tabindex: "-1", hidden: !this.hasPopoverBottom, onKeyDown: this.handleKeydown }, h("slot", { key: '515c40d83c6de0758426ca430fcfbc35c5266cc3', name: "popover-bottom" })))))));
+        return (h("click-elsewhere", { key: 'e967de8b2086ebf86f51cc927c3430c07ad37636', onChange: this.onClickElsewhere }, h("div", { key: '38c871229f1f80d49b003d5c6f7895c335a9eed8', class: wrapperClassNames.join(' ') }, h("div", { key: '8dd9a60999c49de096f8f8f67adccffba0f9a80a', class: "btn-height-wrapper", ref: el => (this.primaryBtnWrapper = el), onClick: this.handleWrapperClick, tabIndex: -1 }, h("button", { key: '1d485d62c6acfaee927e1fa1aa0bc9401c7f2c98', class: "btn-primary", "test-id": "btn-control", type: "button", role: (optionCount && 'combobox') || undefined, ref: el => (this.primaryBtn = el), onClick: this.handleClick, onKeyDown: this.handleKeydown, onFocusout: this.handleFocusOut, disabled: this.disabled, "aria-roledescription": !optionCount && 'filter', "aria-controls": (optionCount && 'option-list') || undefined, "aria-expanded": (optionCount && `${!!open}`) || undefined, "aria-label": `${this.buttonContent}${!optionCount && active ? ` ${loc('tecton.element.pill.active')}` : ''}`, "aria-describedby": (optionCount && 'option-description') || undefined }, this.truncatedButtonContent)), this.renderIcon(), !!optionCount && this.renderHiddenElement()), this.optionCount > 0 && (h("q2-popover", { key: '05ca8c8195186b220364ee67198d6210bbe34455', ref: el => (this.popoverElement = el), controlElement: this.primaryBtn, open: this.open, "max-height": this.popoverMaxHeight, minHeight: this.popoverMinHeight, direction: this.popoverDirection, align: this.popoverAlignment, onFocusout: this.handleFocusOut }, h("div", { key: 'e1eb81bfc0489fd9450975eee632fb59830cce54', class: "popover-content" }, h("div", { key: 'a101a2d7f88fdb18f2a859737f1bca96742bad7e', ref: el => (this.popoverTopContainer = el), class: "popover-top-container", tabindex: "-1", hidden: !this.hasPopoverTop, onKeyDown: this.handleKeydown }, h("slot", { key: '752c27b869d1dd91f5d369e7f1675554e48a4554', name: "popover-top" })), h("q2-option-list", { key: '2f70d1533c8733721326b02a47531a7feb47ab7e', type: "listbox", ref: el => (this.optionList = el), id: "option-list", onChange: this.handleChange, multiple: this.multiple, selectedOptions: this.selectedOptions, onReady: () => this.updateSelectedOptionElements(), onPopoverState: this.onPopoverState, label: loc('tecton.element.optionList.label', [this.optionListLabel]) }, h("slot", { key: '5ffddd45ce88c535a5bb4481f34a74690cb8d46f' })), h("div", { key: '1c5ae3722ea7caace731239ac0d91d4fcbe7eb8b', ref: el => (this.popoverBottomContainer = el), class: "popover-bottom-container", tabindex: "-1", hidden: !this.hasPopoverBottom, onKeyDown: this.handleKeydown }, h("slot", { key: 'afa0d457a65303d7a4e50fa9e633e9fa609922e8', name: "popover-bottom" })))))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-popover2.js CHANGED Viewed

@@ -16,6 +16,7 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
          */
         this.displayBuffer = 10;
         this.orientationChanged = false;
+        this.pendingAnimationResolve = null;
         // #endregion
         // #region State Properties
         this.animationState = 'idle';
@@ -43,6 +44,8 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         };
         this.setAbsoluteCSSProperties = async () => {
             const { controlElement, containerElement, currentDirection, align } = this;
+            if (!containerElement)
+                return;
             if (align === 'right') {
                 containerElement.style.setProperty('--comp-pop-right', '0');
                 containerElement.style.setProperty('--comp-pop-left', 'unset');
@@ -63,11 +66,14 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
             }
             // Wait for one paint to prevent layout thrashing
             await waitForNextPaint();
-            containerElement.style.setProperty('--comp-pop-opacity', '1');
+            if (this.containerElement)
+                containerElement.style.setProperty('--comp-pop-opacity', '1');
         };
         this.setPopoverAPICSSProperties = async () => {
             var _a, _b, _c;
             const { controlElement, containerElement, currentDirection, isModule, align } = this;
+            if (!containerElement)
+                return;
             const { top: controlTop, bottom: controlBottom, left: controlLeft, right: controlRight, } = (_b = (_a = controlElement === null || controlElement === void 0 ? void 0 : controlElement.getBoundingClientRect) === null || _a === void 0 ? void 0 : _a.call(controlElement)) !== null && _b !== void 0 ? _b : {
                 top: 0,
                 bottom: 0,
@@ -105,7 +111,8 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
             }
             // Wait for one paint to prevent layout thrashing
             await waitForNextPaint();
-            containerElement.style.setProperty('--comp-pop-opacity', '1');
+            if (this.containerElement)
+                containerElement.style.setProperty('--comp-pop-opacity', '1');
         };
         this.viewPortChanged = () => {
             if (!this.open)
@@ -120,8 +127,13 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
     // #endregion
     // #region Component Lifecycle Events
     disconnectedCallback() {
+        var _a;
         this.removeViewportListeners();
-        this.containerElement.removeEventListener('toggle', this.handlePopoverToggleEvent);
+        if (this.pendingAnimationResolve) {
+            this.pendingAnimationResolve();
+            this.pendingAnimationResolve = null;
+        }
+        (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.removeEventListener('toggle', this.handlePopoverToggleEvent);
         this.containerElement = null;
         this.contentElement = null;
         this.controlElement = null;
@@ -133,9 +145,10 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         }
     }
     componentDidLoad() {
+        var _a;
         this.handleMinHeight();
         if (this.supportsPopoverAPI)
-            this.containerElement.addEventListener('toggle', this.handlePopoverToggleEvent);
+            (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.addEventListener('toggle', this.handlePopoverToggleEvent);
         if (this.open)
             this.determinePopDirection();
     }
@@ -151,7 +164,8 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
     // #endregion
     // #region Public Methods API
     async scrollContainerTo(options) {
-        this.containerElement.scrollTo(options);
+        var _a;
+        (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.scrollTo(options);
     }
     async toggle() {
         this.open = !this.open;
@@ -174,17 +188,25 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
             // Wait for close animation to complete
             if (this.animated) {
                 await new Promise(resolve => {
+                    var _a;
                     const handleAnimationEnd = () => {
-                        this.containerElement.removeEventListener('animationend', handleAnimationEnd);
+                        var _a;
+                        this.pendingAnimationResolve = null;
+                        (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.removeEventListener('animationend', handleAnimationEnd);
                         resolve();
                     };
-                    this.containerElement.addEventListener('animationend', handleAnimationEnd);
+                    this.pendingAnimationResolve = handleAnimationEnd;
+                    (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.addEventListener('animationend', handleAnimationEnd);
+                    if (!this.containerElement)
+                        resolve();
                 });
             }
             else {
                 // No animation, proceed immediately
                 await waitForNextPaint();
             }
+            if (!this.containerElement)
+                return;
             this.currentDirection = undefined;
             this.animationState = 'idle';
             if (this.mode === 'legacy' || !this.supportsPopoverAPI) {
@@ -233,6 +255,8 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         window.addEventListener('orientationchange', this.viewPortOrientationChanged);
     }
     clearCSSProperties() {
+        if (!this.containerElement)
+            return;
         this.containerElement.style.removeProperty('--comp-pop-max-height');
         this.containerElement.style.removeProperty('--comp-pop-top');
         this.containerElement.style.removeProperty('--comp-pop-bottom');
@@ -247,6 +271,8 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         if (containerElement)
             containerElement.style.maxHeight = null;
         await waitForNextPaint();
+        if (!this.containerElement)
+            return;
         const { isModule } = this;
         const { top: controlTop, bottom: controlBottom } = (_b = (_a = controlElement === null || controlElement === void 0 ? void 0 : controlElement.getBoundingClientRect) === null || _a === void 0 ? void 0 : _a.call(controlElement)) !== null && _b !== void 0 ? _b : {
             top: 0,
@@ -279,13 +305,13 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         }
         const directionWithMostSpace = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';
         // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)
-        const shouldUpdateMaxHeight = !containerElement.style.getPropertyValue('--comp-pop-max-height') || this.orientationChanged;
+        const shouldUpdateMaxHeight = !(containerElement === null || containerElement === void 0 ? void 0 : containerElement.style.getPropertyValue('--comp-pop-max-height')) || this.orientationChanged;
         // we do not want to constantly update the max-height after an orientation change, so we switch this back to false
         this.orientationChanged = false;
         const currentOrDetermineDirection = this.currentDirection || providedDirection || directionWithMostSpace;
         switch (currentOrDetermineDirection) {
             case 'up':
-                if (shouldUpdateMaxHeight) {
+                if (shouldUpdateMaxHeight && containerElement) {
                     const priorityMaxHeight = this.validatedMaxHeight || maxSpaceAbove;
                     const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);
                     containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);
@@ -293,7 +319,7 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
                 this.setDirectionAndShow('up');
                 break;
             case 'down':
-                if (shouldUpdateMaxHeight) {
+                if (shouldUpdateMaxHeight && containerElement) {
                     const priorityMaxHeight = this.validatedMaxHeight || maxSpaceBelow;
                     const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);
                     containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);
@@ -311,10 +337,11 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         window.removeEventListener('orientationchange', this.viewPortOrientationChanged);
     }
     setDirectionAndShow(direction) {
+        var _a;
         // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the
         // popover can be closed between the time the popover is opened and the time the direction is determined
         const isOpen = this.open;
-        if (!isOpen)
+        if (!isOpen || !this.containerElement)
             return;
         this.currentDirection = direction;
         if (this.mode === 'legacy' || !this.supportsPopoverAPI) {
@@ -323,7 +350,7 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         }
         else {
             this.setPopoverAPICSSProperties();
-            this.containerElement.showPopover();
+            (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.showPopover();
         }
     }
     // #endregion
@@ -342,7 +369,7 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
             containerClasses.push('animating-open');
         if (this.animated && this.animationState === 'closing')
             containerClasses.push('animating-close');
-        return (h("div", { key: 'b5166478bf50c313679ce71b381e6fe305e03446', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, h("div", { key: '9e939ece2775d98418f726066c9e7b1e7dcb7fde', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: 'dc16dc214cf71f050e49057f6f35271bb141b692' }))));
+        return (h("div", { key: '779d18b2765abec3eff0f19ca297b01356a06a7d', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, h("div", { key: '47eb4c1420bbc63f821333c03804c1843363f946', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: '8554a334fd61f07cf712e2bdbe797f7835878469' }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-popover2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"q2-popover2.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/q2-popover/q2-popover.scss?tag=q2-popover&encapsulation=shadow","src/components/q2-popover/q2-popover.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n.legacy {\n &.container {\n display: none;\n }\n\n &.show {\n display: block;\n z-index: var-list(--tct-popover-z-index, 50);\n }\n}\n\n@keyframes popoverOpen {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes popoverClose {\n from {\n opacity: 1;\n transform: scale(1);\n }\n to {\n opacity: 0;\n transform: scale(0.95);\n }\n}\n\n:popover-open,\n.show {\n position: absolute;\n margin: 0;\n padding: var-list(--tct-popover-padding, 0);\n overflow: auto;\n background: var-list(--tct-popover-background, --app-white, #ffffff);\n backdrop-filter: var-list(--tct-popover-backdrop-filter, none);\n color: var-list(--tct-popover-font-color, --t-text, #4d4d4d);\n min-width: var-list(--tct-popover-min-width, 135px);\n margin-block: var-list(--tct-popover-margin-block, 0);\n box-shadow: var-list(\n --tct-popover-box-shadow,\n --app-shadow-3,\n unquote('0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)')\n );\n border-width: var-list(--tct-popover-border-width, 0);\n border-style: solid;\n border-color: var-list(--tct-popover-border-color, transparent);\n border-radius: var-list(--tct-popover-border-radius, 0);\n // the --comp variables are set via JS\n max-height: var(--comp-pop-max-height);\n left: var(--comp-pop-left);\n opacity: var(--comp-pop-opacity, 0);\n\n &.animating-open {\n animation-name: popoverOpen;\n animation-duration: var-list(--tct-popover-open-animation-duration, --t-tween-time-in-1, 150ms);\n animation-timing-function: var-list(--tct-popover-open-animation-timing-function, ease-out);\n animation-fill-mode: var-list(--tct-popover-open-animation-fill-mode, forwards);\n }\n\n &.animating-close {\n animation-name: popoverClose;\n animation-duration: var-list(--tct-popover-close-animation-duration, --t-tween-time-out-1, 100ms);\n animation-timing-function: var-list(--tct-popover-close-animation-timing-function, ease-in);\n animation-fill-mode: var-list(--tct-popover-close-animation-fill-mode, forwards);\n }\n\n // Respect user's motion preferences\n @media (prefers-reduced-motion: reduce) {\n &.animating-open,\n &.animating-close {\n animation: none;\n }\n }\n\n &.block {\n right: unset;\n width: var(--comp-pop-width);\n min-width: var-list(--tct-popover-min-width, unset);\n }\n\n &.left {\n left: var(--comp-pop-left);\n right: unset;\n }\n\n &.right {\n right: var(--comp-pop-right);\n left: unset;\n }\n\n &.down {\n top: var-list(--tct-popover-top, --comp-pop-top);\n bottom: unset;\n }\n\n &.up {\n top: unset;\n bottom: var(--comp-pop-bottom);\n }\n\n // Desktop: corner-based transform origin\n &.down.left:not(.mobile) {\n transform-origin: top left;\n }\n\n &.down.right:not(.mobile) {\n transform-origin: top right;\n }\n\n &.up.left:not(.mobile) {\n transform-origin: bottom left;\n }\n\n &.up.right:not(.mobile) {\n transform-origin: bottom right;\n }\n\n // Mobile: center-based transform origin\n &.mobile.down {\n transform-origin: center top;\n }\n\n &.mobile.up {\n transform-origin: center bottom;\n }\n\n @include tiny-scrollbar();\n}\n\nclick-elsewhere {\n position: relative;\n display: block;\n}\n","import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Watch,\n Method,\n Listen,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint, isMobile, isInScrollableContainer } from '../../utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n/*\n **********\n * WARNING \n **********\n Touching this file obligates you to manually test thoroughly, because Puppeteer can't capture every edgecase.\n \n Each of the following Scenarios must be tested on each Device, in each Environment.\n \n Scenarios:\n * - Q2 Select searchable\n * - Q2 Select non-searchable\n \n Orientations:\n * - Portrait\n * - Landscape\n \n Devices:\n * - iOS Safari\n * - Android Chrome\n * - MacOS Safari\n * - Chrome\n * - Firefox\n \n Environments:\n * - Standard (Outside of Iframe)\n * - SDK Extension (Inside of Iframe)\n /\n\n/\n @name Popover\n * @category Display\n * @summary Use for positioning floating content relative to a trigger element.\n /\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n // #region Own Properties\n\n containerElement: HTMLDivElement;\n contentElement: HTMLDivElement;\n /\n The number of pixels to leave between the popover and the edge of the viewport\n /\n displayBuffer = 10;\n orientationChanged: boolean = false;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n animationState: 'idle' \| 'opening' \| 'closing' = 'idle';\n\n @State()\n currentDirection: 'down' \| 'up' = undefined;\n\n // remove `show` when we transitiong fully to Popover API and get rid of 'legacy' mode\n @State()\n show: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /* Aligns the popover to the left or right side of the control element. /\n @Prop({ reflect: true })\n align: 'left' \| 'right' = 'left';\n\n /\n Controls whether the popover is animated when opening/closing.\n * Default is true (animated). Set to false to disable animations.\n * Animation is also disabled if the user has enabled prefers-reduced-motion.\n /\n @Prop({ reflect: true })\n animated: boolean = true;\n\n /* Indicates the popover will match the width of its parent element. /\n @Prop({ reflect: true })\n block: boolean;\n\n /* The element that controls the popover's behavior. /\n @Prop()\n controlElement: HTMLElement;\n\n /\n Force the direction of the popover when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n /\n @Prop({ reflect: true })\n direction: 'up' \| 'down';\n\n /\n Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n /\n @Prop()\n maxHeight: number;\n\n /* @deprecated /\n @Prop()\n minHeight: number;\n\n @Prop()\n mode: 'legacy' = null;\n\n /* Controls whether the popover is open or closed. /\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n // #endregion\n // #region Events\n\n /\n Emitted when the popover is opened or closed.\n * @deprecated Use 'tctPopoverStateChanged' instead\n /\n @Event()\n popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n /\n Emitted when the popover is opened or closed.\n */\n @Event()\n tctPopoverStateChanged: EventEmitter<{ open: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.removeViewportListeners();\n this.containerElement.removeEventListener('toggle', this.handlePopoverToggleEvent);\n this.containerElement = null;\n this.contentElement = null;\n this.controlElement = null;\n }\n\n componentWillLoad() {\n if (!this.supportsPopoverAPI) {\n console.warn(\n 'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n );\n this.mode = 'legacy';\n }\n }\n\n componentDidLoad() {\n this.handleMinHeight();\n if (this.supportsPopoverAPI) this.containerElement.addEventListener('toggle', this.handlePopoverToggleEvent);\n if (this.open) this.determinePopDirection();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('popoverState')\n popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n const {\n detail: { open },\n } = event;\n if (open === this.open) return;\n\n this.open = open;\n event.stopPropagation();\n }\n\n // #endregion\n // #region Public Methods API\n\n @Method()\n async scrollContainerTo(options: ScrollToOptions) {\n this.containerElement.scrollTo(options);\n }\n\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('minHeight')\n minHeightProvided() {\n this.handleMinHeight();\n }\n\n @Watch('open')\n async openChanged(open: boolean) {\n mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open });\n\n if (open) {\n this.animationState = 'opening';\n this.addViewportListeners();\n this.determinePopDirection();\n } else {\n this.animationState = 'closing';\n this.removeViewportListeners();\n\n // Wait for close animation to complete\n if (this.animated) {\n await new Promise<void>(resolve => {\n const handleAnimationEnd = () => {\n this.containerElement.removeEventListener('animationend', handleAnimationEnd);\n resolve();\n };\n this.containerElement.addEventListener('animationend', handleAnimationEnd);\n });\n } else {\n // No animation, proceed immediately\n await waitForNextPaint();\n }\n\n this.currentDirection = undefined;\n this.animationState = 'idle';\n if (this.mode === 'legacy' \|\| !this.supportsPopoverAPI) {\n this.show = false;\n } else {\n this.containerElement.hidePopover();\n }\n\n await waitForNextPaint();\n this.clearCSSProperties();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get isModule(): boolean {\n const isIframe = window !== window.top;\n const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n return isIframe && hasPlatformDimensions;\n }\n\n get providedDirection(): 'up' \| 'down' \| undefined {\n const { direction } = this;\n switch (direction) {\n case 'up':\n case 'down':\n return direction;\n default:\n return undefined;\n }\n }\n\n get supportsPopoverAPI(): boolean {\n return Object.hasOwn(HTMLElement.prototype, 'popover');\n }\n\n get validatedMaxHeight(): number \| undefined {\n const { maxHeight } = this;\n return isNaN(maxHeight) ? undefined : maxHeight;\n }\n\n addViewportListeners() {\n window.addEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.addEventListener('resize', this.viewPortChanged);\n if (isInScrollableContainer(this.hostElement) && !isMobile()) {\n window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n }\n screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n clearCSSProperties() {\n this.containerElement.style.removeProperty('--comp-pop-max-height');\n this.containerElement.style.removeProperty('--comp-pop-top');\n this.containerElement.style.removeProperty('--comp-pop-bottom');\n this.containerElement.style.removeProperty('--comp-pop-left');\n this.containerElement.style.removeProperty('--comp-pop-right');\n this.containerElement.style.removeProperty('--comp-pop-width');\n this.containerElement.style.removeProperty('--comp-pop-opacity');\n }\n\n async determinePopDirection() {\n const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n if (containerElement) containerElement.style.maxHeight = null;\n await waitForNextPaint();\n\n const { isModule } = this;\n const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n };\n\n let windowHeight: number;\n let maxSpaceAbove: number;\n let maxSpaceBelow: number;\n const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n if (isModule && !isScrollableIframe) {\n const {\n outletOffset = 0,\n innerHeight = window.innerHeight,\n top: topBarHeight = 0,\n bottom: bottomBarHeight = 0,\n } = window.Tecton?.platformDimensions \|\| {};\n\n const distanceToIframeBottom = window.innerHeight - controlBottom;\n\n // controlElement position visually on the page\n const visualControlTop = outletOffset > 0 ? controlTop : controlTop + outletOffset - topBarHeight;\n const visualControlBottom = outletOffset + controlBottom - topBarHeight;\n\n // visual space around the controlElement\n const viewableSpaceAbove = visualControlTop;\n const viewableSpaceBelow = innerHeight - bottomBarHeight - visualControlBottom;\n\n // calculate space above and below controlElement\n const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n maxSpaceAbove = viewableSpaceAbove - displayBuffer;\n maxSpaceBelow = isIframeShorterThanWindow\n ? distanceToIframeBottom - displayBuffer\n : viewableSpaceBelow - displayBuffer;\n } else {\n windowHeight = window.innerHeight;\n maxSpaceAbove = controlTop - displayBuffer;\n maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n }\n\n const directionWithMostSpace: 'up' \| 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n const shouldUpdateMaxHeight =\n !containerElement.style.getPropertyValue('--comp-pop-max-height') \|\| this.orientationChanged;\n // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n this.orientationChanged = false;\n const currentOrDetermineDirection = this.currentDirection \|\| providedDirection \|\| directionWithMostSpace;\n\n switch (currentOrDetermineDirection) {\n case 'up':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight \|\| maxSpaceAbove;\n const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('up');\n break;\n case 'down':\n if (shouldUpdateMaxHeight) {\n const priorityMaxHeight = this.validatedMaxHeight \|\| maxSpaceBelow;\n const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('down');\n break;\n default:\n break;\n }\n }\n\n handleMinHeight = () => {\n if (this.minHeight) {\n handleDeprecationWarning(this, 'minHeight', 'prop');\n }\n };\n\n handlePopoverToggleEvent = (event: ToggleEvent) => {\n mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open: event.newState === 'open' });\n };\n\n removeViewportListeners() {\n window.removeEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.removeEventListener('resize', this.viewPortChanged);\n window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n setAbsoluteCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, align } = this;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', '0');\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', '0');\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) {\n containerElement.style.setProperty('--comp-pop-width', '100%');\n }\n\n if (currentDirection === 'up') {\n const controlStyle = getComputedStyle(controlElement);\n const controlSize =\n parseInt(controlStyle.height \|\| '0') +\n parseInt(controlStyle.borderTopWidth \|\| '0') +\n parseInt(controlStyle.borderBottomWidth \|\| '0');\n\n containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setDirectionAndShow(direction: 'up' \| 'down') {\n // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n // popover can be closed between the time the popover is opened and the time the direction is determined\n const isOpen = this.open;\n if (!isOpen) return;\n\n this.currentDirection = direction;\n if (this.mode === 'legacy' \|\| !this.supportsPopoverAPI) {\n this.show = true;\n this.setAbsoluteCSSProperties();\n } else {\n this.setPopoverAPICSSProperties();\n this.containerElement.showPopover();\n }\n }\n\n setPopoverAPICSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, isModule, align } = this;\n const {\n top: controlTop,\n bottom: controlBottom,\n left: controlLeft,\n right: controlRight,\n } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n };\n\n const popoverLeft: number = controlLeft;\n const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth \|\| 0}px`);\n\n const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n\n if (currentDirection === 'up') {\n if (isModule && !isScrollableIframe) {\n containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-bottom',\n `${window.innerHeight - controlTop - window.scrollY}px`\n );\n }\n }\n\n if (currentDirection === 'down') {\n if (isModule && !isScrollableIframe) {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n } else {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom + window.scrollY}px`);\n }\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n viewPortChanged = () => {\n if (!this.open) return;\n this.determinePopDirection();\n };\n\n viewPortOrientationChanged = () => {\n this.orientationChanged = true;\n this.viewPortChanged();\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const containerClasses = ['container', this.currentDirection, this.align];\n if (isMobile()) containerClasses.push('mobile');\n if (this.show) containerClasses.push('show');\n if (this.block) containerClasses.push('block');\n if (this.mode === 'legacy') containerClasses.push('legacy');\n if (this.animated && this.animationState === 'opening') containerClasses.push('animating-open');\n if (this.animated && this.animationState === 'closing') containerClasses.push('animating-close');\n\n return (\n <div\n ref={el => (this.containerElement = el)}\n class={containerClasses.join(' ')}\n test-id=\"outerContainer\"\n tabIndex={-1}\n popover=\"manual\"\n >\n <div\n ref={el => (this.contentElement = el)}\n class=\"content\"\n >\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"version":3}
1	+ {"file":"q2-popover2.js","mappings":"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","names":["__stencil_proxyCustomElement"],"sources":["src/components/q2-popover/q2-popover.scss?tag=q2-popover&encapsulation=shadow","src/components/q2-popover/q2-popover.tsx"],"sourcesContent":["@import '../../styles/host.scss';\n@import '../../styles/functions';\n\n.legacy {\n &.container {\n display: none;\n }\n\n &.show {\n display: block;\n z-index: var-list(--tct-popover-z-index, 50);\n }\n}\n\n@keyframes popoverOpen {\n from {\n opacity: 0;\n transform: scale(0.95);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes popoverClose {\n from {\n opacity: 1;\n transform: scale(1);\n }\n to {\n opacity: 0;\n transform: scale(0.95);\n }\n}\n\n:popover-open,\n.show {\n position: absolute;\n margin: 0;\n padding: var-list(--tct-popover-padding, 0);\n overflow: auto;\n background: var-list(--tct-popover-background, --app-white, #ffffff);\n backdrop-filter: var-list(--tct-popover-backdrop-filter, none);\n color: var-list(--tct-popover-font-color, --t-text, #4d4d4d);\n min-width: var-list(--tct-popover-min-width, 135px);\n margin-block: var-list(--tct-popover-margin-block, 0);\n box-shadow: var-list(\n --tct-popover-box-shadow,\n --app-shadow-3,\n unquote('0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)')\n );\n border-width: var-list(--tct-popover-border-width, 0);\n border-style: solid;\n border-color: var-list(--tct-popover-border-color, transparent);\n border-radius: var-list(--tct-popover-border-radius, 0);\n // the --comp variables are set via JS\n max-height: var(--comp-pop-max-height);\n left: var(--comp-pop-left);\n opacity: var(--comp-pop-opacity, 0);\n\n &.animating-open {\n animation-name: popoverOpen;\n animation-duration: var-list(--tct-popover-open-animation-duration, --t-tween-time-in-1, 150ms);\n animation-timing-function: var-list(--tct-popover-open-animation-timing-function, ease-out);\n animation-fill-mode: var-list(--tct-popover-open-animation-fill-mode, forwards);\n }\n\n &.animating-close {\n animation-name: popoverClose;\n animation-duration: var-list(--tct-popover-close-animation-duration, --t-tween-time-out-1, 100ms);\n animation-timing-function: var-list(--tct-popover-close-animation-timing-function, ease-in);\n animation-fill-mode: var-list(--tct-popover-close-animation-fill-mode, forwards);\n }\n\n // Respect user's motion preferences\n @media (prefers-reduced-motion: reduce) {\n &.animating-open,\n &.animating-close {\n animation: none;\n }\n }\n\n &.block {\n right: unset;\n width: var(--comp-pop-width);\n min-width: var-list(--tct-popover-min-width, unset);\n }\n\n &.left {\n left: var(--comp-pop-left);\n right: unset;\n }\n\n &.right {\n right: var(--comp-pop-right);\n left: unset;\n }\n\n &.down {\n top: var-list(--tct-popover-top, --comp-pop-top);\n bottom: unset;\n }\n\n &.up {\n top: unset;\n bottom: var(--comp-pop-bottom);\n }\n\n // Desktop: corner-based transform origin\n &.down.left:not(.mobile) {\n transform-origin: top left;\n }\n\n &.down.right:not(.mobile) {\n transform-origin: top right;\n }\n\n &.up.left:not(.mobile) {\n transform-origin: bottom left;\n }\n\n &.up.right:not(.mobile) {\n transform-origin: bottom right;\n }\n\n // Mobile: center-based transform origin\n &.mobile.down {\n transform-origin: center top;\n }\n\n &.mobile.up {\n transform-origin: center bottom;\n }\n\n @include tiny-scrollbar();\n}\n\nclick-elsewhere {\n position: relative;\n display: block;\n}\n","import {\n Component,\n Prop,\n h,\n ComponentInterface,\n Element,\n Watch,\n Method,\n Listen,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\nimport { handleDeprecationWarning, waitForNextPaint, isMobile, isInScrollableContainer } from '../../utils';\nimport mirrorEmit from '@/utils/mirror-emit';\n\n/*\n **********\n * WARNING \n **********\n Touching this file obligates you to manually test thoroughly, because Puppeteer can't capture every edgecase.\n \n Each of the following Scenarios must be tested on each Device, in each Environment.\n \n Scenarios:\n * - Q2 Select searchable\n * - Q2 Select non-searchable\n \n Orientations:\n * - Portrait\n * - Landscape\n \n Devices:\n * - iOS Safari\n * - Android Chrome\n * - MacOS Safari\n * - Chrome\n * - Firefox\n \n Environments:\n * - Standard (Outside of Iframe)\n * - SDK Extension (Inside of Iframe)\n /\n\n/\n @name Popover\n * @category Display\n * @summary Use for positioning floating content relative to a trigger element.\n /\n@Component({ tag: 'q2-popover', shadow: true, styleUrl: 'q2-popover.scss' })\nexport class Q2Popover implements ComponentInterface {\n // #region Own Properties\n\n containerElement: HTMLDivElement;\n contentElement: HTMLDivElement;\n /\n The number of pixels to leave between the popover and the edge of the viewport\n /\n displayBuffer = 10;\n orientationChanged: boolean = false;\n pendingAnimationResolve: (() => void) \| null = null;\n\n // #endregion\n // #region Host HTML Element\n\n @Element()\n hostElement: HTMLElement;\n\n // #endregion\n // #region State Properties\n\n @State()\n animationState: 'idle' \| 'opening' \| 'closing' = 'idle';\n\n @State()\n currentDirection: 'down' \| 'up' = undefined;\n\n // remove `show` when we transitiong fully to Popover API and get rid of 'legacy' mode\n @State()\n show: boolean = false;\n\n // #endregion\n // #region Public Property API\n\n /* Aligns the popover to the left or right side of the control element. /\n @Prop({ reflect: true })\n align: 'left' \| 'right' = 'left';\n\n /\n Controls whether the popover is animated when opening/closing.\n * Default is true (animated). Set to false to disable animations.\n * Animation is also disabled if the user has enabled prefers-reduced-motion.\n /\n @Prop({ reflect: true })\n animated: boolean = true;\n\n /* Indicates the popover will match the width of its parent element. /\n @Prop({ reflect: true })\n block: boolean;\n\n /* The element that controls the popover's behavior. /\n @Prop()\n controlElement: HTMLElement;\n\n /\n Force the direction of the popover when it opens.\n * If no value is passed, the component will auto-detect the direction based on available space.\n /\n @Prop({ reflect: true })\n direction: 'up' \| 'down';\n\n /\n Force the maximum height of the popover. This value will be interpreted as pixels.\n * If no value is passed, or the value exceeds available space, the component will auto-detect the maximum height based on available space.\n /\n @Prop()\n maxHeight: number;\n\n /* @deprecated /\n @Prop()\n minHeight: number;\n\n @Prop()\n mode: 'legacy' = null;\n\n /* Controls whether the popover is open or closed. /\n @Prop({ reflect: true, mutable: true })\n open: boolean;\n\n // #endregion\n // #region Events\n\n /\n Emitted when the popover is opened or closed.\n * @deprecated Use 'tctPopoverStateChanged' instead\n /\n @Event()\n popoverStateChanged: EventEmitter<{ open: boolean }>;\n\n /\n Emitted when the popover is opened or closed.\n */\n @Event()\n tctPopoverStateChanged: EventEmitter<{ open: boolean }>;\n\n // #endregion\n // #region Component Lifecycle Events\n\n disconnectedCallback() {\n this.removeViewportListeners();\n if (this.pendingAnimationResolve) {\n this.pendingAnimationResolve();\n this.pendingAnimationResolve = null;\n }\n this.containerElement?.removeEventListener('toggle', this.handlePopoverToggleEvent);\n this.containerElement = null;\n this.contentElement = null;\n this.controlElement = null;\n }\n\n componentWillLoad() {\n if (!this.supportsPopoverAPI) {\n console.warn(\n 'The Popover API is not supported in this browser. Please update your browser to the latest version. The component will use legacy mode.'\n );\n this.mode = 'legacy';\n }\n }\n\n componentDidLoad() {\n this.handleMinHeight();\n if (this.supportsPopoverAPI) this.containerElement?.addEventListener('toggle', this.handlePopoverToggleEvent);\n if (this.open) this.determinePopDirection();\n }\n\n // #endregion\n // #region Listeners\n\n @Listen('popoverState')\n popoverStateHandler(event: CustomEvent<{ open: boolean }>) {\n const {\n detail: { open },\n } = event;\n if (open === this.open) return;\n\n this.open = open;\n event.stopPropagation();\n }\n\n // #endregion\n // #region Public Methods API\n\n @Method()\n async scrollContainerTo(options: ScrollToOptions) {\n this.containerElement?.scrollTo(options);\n }\n\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n // #endregion\n // #region Watchers\n\n @Watch('minHeight')\n minHeightProvided() {\n this.handleMinHeight();\n }\n\n @Watch('open')\n async openChanged(open: boolean) {\n mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open });\n\n if (open) {\n this.animationState = 'opening';\n this.addViewportListeners();\n this.determinePopDirection();\n } else {\n this.animationState = 'closing';\n this.removeViewportListeners();\n\n // Wait for close animation to complete\n if (this.animated) {\n await new Promise<void>(resolve => {\n const handleAnimationEnd = () => {\n this.pendingAnimationResolve = null;\n this.containerElement?.removeEventListener('animationend', handleAnimationEnd);\n resolve();\n };\n this.pendingAnimationResolve = handleAnimationEnd;\n this.containerElement?.addEventListener('animationend', handleAnimationEnd);\n if (!this.containerElement) resolve();\n });\n } else {\n // No animation, proceed immediately\n await waitForNextPaint();\n }\n\n if (!this.containerElement) return;\n\n this.currentDirection = undefined;\n this.animationState = 'idle';\n if (this.mode === 'legacy' \|\| !this.supportsPopoverAPI) {\n this.show = false;\n } else {\n this.containerElement.hidePopover();\n }\n\n await waitForNextPaint();\n this.clearCSSProperties();\n }\n }\n\n // #endregion\n // #region Local Methods\n\n get isModule(): boolean {\n const isIframe = window !== window.top;\n const hasPlatformDimensions = Object.keys(window.Tecton?.platformDimensions ?? {}).length > 0;\n return isIframe && hasPlatformDimensions;\n }\n\n get providedDirection(): 'up' \| 'down' \| undefined {\n const { direction } = this;\n switch (direction) {\n case 'up':\n case 'down':\n return direction;\n default:\n return undefined;\n }\n }\n\n get supportsPopoverAPI(): boolean {\n return Object.hasOwn(HTMLElement.prototype, 'popover');\n }\n\n get validatedMaxHeight(): number \| undefined {\n const { maxHeight } = this;\n return isNaN(maxHeight) ? undefined : maxHeight;\n }\n\n addViewportListeners() {\n window.addEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.addEventListener('resize', this.viewPortChanged);\n if (isInScrollableContainer(this.hostElement) && !isMobile()) {\n window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });\n }\n screen?.orientation?.addEventListener('orientationchange', this.viewPortOrientationChanged);\n window.addEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n clearCSSProperties() {\n if (!this.containerElement) return;\n this.containerElement.style.removeProperty('--comp-pop-max-height');\n this.containerElement.style.removeProperty('--comp-pop-top');\n this.containerElement.style.removeProperty('--comp-pop-bottom');\n this.containerElement.style.removeProperty('--comp-pop-left');\n this.containerElement.style.removeProperty('--comp-pop-right');\n this.containerElement.style.removeProperty('--comp-pop-width');\n this.containerElement.style.removeProperty('--comp-pop-opacity');\n }\n\n async determinePopDirection() {\n const { containerElement, controlElement, providedDirection, displayBuffer } = this;\n if (containerElement) containerElement.style.maxHeight = null;\n await waitForNextPaint();\n if (!this.containerElement) return;\n\n const { isModule } = this;\n const { top: controlTop, bottom: controlBottom } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n };\n\n let windowHeight: number;\n let maxSpaceAbove: number;\n let maxSpaceBelow: number;\n const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n if (isModule && !isScrollableIframe) {\n const {\n outletOffset = 0,\n innerHeight = window.innerHeight,\n top: topBarHeight = 0,\n bottom: bottomBarHeight = 0,\n } = window.Tecton?.platformDimensions \|\| {};\n\n const distanceToIframeBottom = window.innerHeight - controlBottom;\n\n // controlElement position visually on the page\n const visualControlTop = outletOffset > 0 ? controlTop : controlTop + outletOffset - topBarHeight;\n const visualControlBottom = outletOffset + controlBottom - topBarHeight;\n\n // visual space around the controlElement\n const viewableSpaceAbove = visualControlTop;\n const viewableSpaceBelow = innerHeight - bottomBarHeight - visualControlBottom;\n\n // calculate space above and below controlElement\n const isIframeShorterThanWindow = distanceToIframeBottom < viewableSpaceBelow;\n maxSpaceAbove = viewableSpaceAbove - displayBuffer;\n maxSpaceBelow = isIframeShorterThanWindow\n ? distanceToIframeBottom - displayBuffer\n : viewableSpaceBelow - displayBuffer;\n } else {\n windowHeight = window.innerHeight;\n maxSpaceAbove = controlTop - displayBuffer;\n maxSpaceBelow = windowHeight - controlBottom - displayBuffer;\n }\n\n const directionWithMostSpace: 'up' \| 'down' = maxSpaceAbove > maxSpaceBelow ? 'up' : 'down';\n\n // We do not want to update the max height once the popover is open unless the page orientation shifts (resize or mobile use cases)\n const shouldUpdateMaxHeight =\n !containerElement?.style.getPropertyValue('--comp-pop-max-height') \|\| this.orientationChanged;\n // we do not want to constantly update the max-height after an orientation change, so we switch this back to false\n this.orientationChanged = false;\n const currentOrDetermineDirection = this.currentDirection \|\| providedDirection \|\| directionWithMostSpace;\n\n switch (currentOrDetermineDirection) {\n case 'up':\n if (shouldUpdateMaxHeight && containerElement) {\n const priorityMaxHeight = this.validatedMaxHeight \|\| maxSpaceAbove;\n const maxHeight = Math.min(maxSpaceAbove, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('up');\n break;\n case 'down':\n if (shouldUpdateMaxHeight && containerElement) {\n const priorityMaxHeight = this.validatedMaxHeight \|\| maxSpaceBelow;\n const maxHeight = Math.min(maxSpaceBelow, priorityMaxHeight);\n containerElement.style.setProperty('--comp-pop-max-height', `${maxHeight}px`);\n }\n this.setDirectionAndShow('down');\n break;\n default:\n break;\n }\n }\n\n handleMinHeight = () => {\n if (this.minHeight) {\n handleDeprecationWarning(this, 'minHeight', 'prop');\n }\n };\n\n handlePopoverToggleEvent = (event: ToggleEvent) => {\n mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open: event.newState === 'open' });\n };\n\n removeViewportListeners() {\n window.removeEventListener('resize', this.viewPortOrientationChanged);\n visualViewport?.removeEventListener('resize', this.viewPortChanged);\n window.removeEventListener('scroll', this.viewPortChanged, { capture: true });\n screen?.orientation?.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n window.removeEventListener('orientationchange', this.viewPortOrientationChanged);\n }\n\n setAbsoluteCSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, align } = this;\n if (!containerElement) return;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', '0');\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', '0');\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) {\n containerElement.style.setProperty('--comp-pop-width', '100%');\n }\n\n if (currentDirection === 'up') {\n const controlStyle = getComputedStyle(controlElement);\n const controlSize =\n parseInt(controlStyle.height \|\| '0') +\n parseInt(controlStyle.borderTopWidth \|\| '0') +\n parseInt(controlStyle.borderBottomWidth \|\| '0');\n\n containerElement.style.setProperty('--comp-pop-bottom', `${controlSize}px`);\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n if (this.containerElement) containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n setDirectionAndShow(direction: 'up' \| 'down') {\n // Due to some runtime inconsistency across devices/browsers we need to add one more check here because the\n // popover can be closed between the time the popover is opened and the time the direction is determined\n const isOpen = this.open;\n if (!isOpen \|\| !this.containerElement) return;\n\n this.currentDirection = direction;\n if (this.mode === 'legacy' \|\| !this.supportsPopoverAPI) {\n this.show = true;\n this.setAbsoluteCSSProperties();\n } else {\n this.setPopoverAPICSSProperties();\n this.containerElement?.showPopover();\n }\n }\n\n setPopoverAPICSSProperties = async () => {\n const { controlElement, containerElement, currentDirection, isModule, align } = this;\n if (!containerElement) return;\n const {\n top: controlTop,\n bottom: controlBottom,\n left: controlLeft,\n right: controlRight,\n } = controlElement?.getBoundingClientRect?.() ?? {\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n };\n\n const popoverLeft: number = controlLeft;\n const popoverRight: number = window?.visualViewport?.width - controlRight;\n\n if (align === 'right') {\n containerElement.style.setProperty('--comp-pop-right', `${popoverRight - window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-left', 'unset');\n } else {\n containerElement.style.setProperty('--comp-pop-left', `${popoverLeft + window.scrollX}px`);\n containerElement.style.setProperty('--comp-pop-right', 'unset');\n }\n\n if (this.block) containerElement.style.setProperty('--comp-pop-width', `${controlElement?.offsetWidth \|\| 0}px`);\n\n const isScrollableIframe = isModule && isInScrollableContainer(this.hostElement);\n\n if (currentDirection === 'up') {\n if (isModule && !isScrollableIframe) {\n containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);\n } else {\n containerElement.style.setProperty(\n '--comp-pop-bottom',\n `${window.innerHeight - controlTop - window.scrollY}px`\n );\n }\n }\n\n if (currentDirection === 'down') {\n if (isModule && !isScrollableIframe) {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom}px`);\n } else {\n containerElement.style.setProperty('--comp-pop-top', `${controlBottom + window.scrollY}px`);\n }\n }\n\n // Wait for one paint to prevent layout thrashing\n await waitForNextPaint();\n if (this.containerElement) containerElement.style.setProperty('--comp-pop-opacity', '1');\n };\n\n viewPortChanged = () => {\n if (!this.open) return;\n this.determinePopDirection();\n };\n\n viewPortOrientationChanged = () => {\n this.orientationChanged = true;\n this.viewPortChanged();\n };\n\n // #endregion\n // #region Render Methods\n\n render() {\n const containerClasses = ['container', this.currentDirection, this.align];\n if (isMobile()) containerClasses.push('mobile');\n if (this.show) containerClasses.push('show');\n if (this.block) containerClasses.push('block');\n if (this.mode === 'legacy') containerClasses.push('legacy');\n if (this.animated && this.animationState === 'opening') containerClasses.push('animating-open');\n if (this.animated && this.animationState === 'closing') containerClasses.push('animating-close');\n\n return (\n <div\n ref={el => (this.containerElement = el)}\n class={containerClasses.join(' ')}\n test-id=\"outerContainer\"\n tabIndex={-1}\n popover=\"manual\"\n >\n <div\n ref={el => (this.contentElement = el)}\n class=\"content\"\n >\n <slot />\n </div>\n </div>\n );\n }\n\n // #endregion\n}\n"],"version":3}

package/dist/components/q2-radio-group.js CHANGED Viewed

@@ -181,7 +181,7 @@ const Q2RadioGroup$1 = /*@__PURE__*/ proxyCustomElement(class Q2RadioGroup exten
         const showLabel = this.label || this.optional || this.readonly;
         const { hasError } = this;
         const showLabelRow = (showLabel && !this.hideLabel) || hasError;
-        return (h(Fragment, { key: 'ccf42e615a57f7a10d1dbf83477abe2f3a09c318' }, showLabelRow && (h("div", { key: 'e1dc942fcf0fd1736b3527471507f952d0823705', class: "label-row" }, showLabel && !this.hideLabel && h("div", { key: '5c9f17f222c2b9724b774e2d1963f4a83288b320', class: "group-legend" }, renderLabel(this)), hasError && (h("q2-icon", { key: 'a78ce480598193b64922b11d37b62a29452dd08c', type: "error", "test-id": "iconError" })))), h("fieldset", { key: 'c90583a3df7d565c92b8a39089f38d2a70487389', onChange: this.onInnerRadioChange, "aria-invalid": hasError ? `${hasError}` : undefined }, showLabel && h("legend", { key: '1f4a2f89ade2bb185ba10dc4edd64fbcfc689c05', class: "sr-only" }, renderLabel(this)), this.inputDom())));
+        return (h(Fragment, { key: '3fa5b7ba14cd74a3544ad38d40c74127126f0fc6' }, showLabelRow && (h("div", { key: '254b8a8ec9f21fccf2227966f56e366682957da8', class: "label-row" }, showLabel && !this.hideLabel && h("div", { key: 'f1176458f14bfc50adaab4a0d5342a7fcf58c6a4', class: "group-legend" }, renderLabel(this)), hasError && (h("q2-icon", { key: '7b829af0555cd13090459c5dc83ba22ce4cbe92c', type: "error", "test-id": "iconError" })))), h("fieldset", { key: '1eb9e6e18c1a5442d4582f23649b06d3864412b7', onChange: this.onInnerRadioChange, "aria-invalid": hasError ? `${hasError}` : undefined }, showLabel && h("legend", { key: '2ee4c9b44c86077fbda3f9eef02da24546cb6ec6', class: "sr-only" }, renderLabel(this)), this.inputDom())));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-radio.js CHANGED Viewed

@@ -93,7 +93,7 @@ const Q2Radio$1 = /*@__PURE__*/ proxyCustomElement(class Q2Radio extends HTMLEle
     // #endregion
     // #region Render Methods
     render() {
-        return (h("div", { key: '1819bf1b409bdb257c590c95fd059f48e9ec2ebb', class: this.groupTileLayout ? 'radio-tile' : 'radio-container' }, h("input", { key: 'a6ef43c7dbb5da2e42dc24bad503ce48dc537080', ref: el => (this.inputField = el), class: "sr", id: this._id, type: "radio", name: this.name, value: this.value, disabled: this.disabled || this.groupDisabled, checked: this.checked, "aria-label": this.label && this.hideLabel ? loc(this.label) : undefined, onChange: this.inputChange, "test-id": "q2RadioInnerRadioBox" }), h("label", { key: '1da75f9e58a0b461d9bbab4bc09ed839a0364b11', htmlFor: this._id, class: this.hideLabel ? 'label-hidden' : undefined, "test-id": "radioButton" }, !this.groupTileLayout && (h("svg", { key: 'a85fa6abe0998cf6f1e377f1242788c41aae034d', viewBox: "0 0 18 18" }, h("circle", { key: '3c0ce4521a486e2f4d8890b844ca960a3f732b66', class: "big-circle", stroke: "none", fill: "none", cx: "9", cy: "9", r: "8" }), h("circle", { key: '95d480099459712896b5941542fef02002f1bd64', class: "small-circle", stroke: "none", fill: "none", cx: "9", cy: "9", r: "4" }))), !this.hideLabel && (h("div", { key: '3d217b5973322972a84dfafafb30055665840544', class: "label-content" }, (this.label && loc(this.label)) || '', h("slot", { key: '1ae3f23813fe800de5e7fa75e6ebfa33205c3961' }))))));
+        return (h("div", { key: '1c740c79651798b5aa532b48a8d35fbfb44e47a9', class: this.groupTileLayout ? 'radio-tile' : 'radio-container' }, h("input", { key: '1e8f5b6100d8ad8c43a60afba569184f5ccd8530', ref: el => (this.inputField = el), class: "sr", id: this._id, type: "radio", name: this.name, value: this.value, disabled: this.disabled || this.groupDisabled, checked: this.checked, "aria-label": this.label && this.hideLabel ? loc(this.label) : undefined, onChange: this.inputChange, "test-id": "q2RadioInnerRadioBox" }), h("label", { key: 'd86c5a574f853b570491bc9842996d9300b3a72c', htmlFor: this._id, class: this.hideLabel ? 'label-hidden' : undefined, "test-id": "radioButton" }, !this.groupTileLayout && (h("svg", { key: '473eb06c9c4a1b7ebd8014642da157b2aa4a5d08', viewBox: "0 0 18 18" }, h("circle", { key: '0035db29b3d96bb1e322fd8aa7233554098be30a', class: "big-circle", stroke: "none", fill: "none", cx: "9", cy: "9", r: "8" }), h("circle", { key: '6efda15f869a255325c8f09e9cf250a50627bd6d', class: "small-circle", stroke: "none", fill: "none", cx: "9", cy: "9", r: "4" }))), !this.hideLabel && (h("div", { key: '5def4a33beb0e6bd0e4327cdfb07d3fdabb4a72e', class: "label-content" }, (this.label && loc(this.label)) || '', h("slot", { key: 'f8ca1eac5a03d93e7019b5e5bd25456acf5a1230' }))))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-relative-time.js CHANGED Viewed

@@ -154,7 +154,7 @@ const Q2RelativeTime$1 = /*@__PURE__*/ proxyCustomElement(class Q2RelativeTime e
     // #region Render Methods
     render() {
         const { shouldShow, displayedMessage } = this;
-        return h(Fragment, { key: 'e2c0439b5b2ef14d719309202959a650e1a8e7d5' }, shouldShow ? h("time", { dateTime: displayedMessage }, displayedMessage) : null);
+        return h(Fragment, { key: '3a518920ff969cb0b60ca20ac780e11022803bef' }, shouldShow ? h("time", { dateTime: displayedMessage }, displayedMessage) : null);
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-resize-observer2.js CHANGED Viewed

@@ -78,7 +78,7 @@ const Q2ResizeObserver = /*@__PURE__*/ proxyCustomElement(class Q2ResizeObserver
     // #endregion
     // #region Render Methods
     render() {
-        return h("slot", { key: '2cf512a7e20957cca3fa7339875f2015effe829e', onSlotchange: this.handleSlotChange });
+        return h("slot", { key: 'f415d8b1adcb2cdfd6e76d09e9865fbfbeb2371e', onSlotchange: this.handleSlotChange });
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-section.js CHANGED Viewed

@@ -191,9 +191,9 @@ const Q2Section$1 = /*@__PURE__*/ proxyCustomElement(class Q2Section extends HTM
                 wrapperClasses.push('is-transitioning');
         }
         const showDefaultHeader = !this.hasYieldedHeader && !!this.label;
-        return (h("section", { key: '05ee53a9a05e1037c893f08ac5cf918c25b7f877', class: "wrapper" }, h("header", { key: '52678d55334407ef19cfae457e0e9fe277fb0bdd', class: hasHeader ? 'has-header' : '' }, h("div", { key: '76a3ade1875c6e64866ed5b50d005885c9108c61', class: "header-content", id: this.titleId, onClick: this.collapsible && this.onHeaderClick }, showDefaultHeader && h("h2", { key: '144199b22c9eb4d2b6c16c8890554f80939ac3f3', class: "title" }, loc(this.label)), h("div", { key: 'ce508b60dced7965b3e5a2c79999f8720176827e', ref: el => (this.headerSlotWrapper = el), class: "header-slot-wrapper" }, h("slot", { key: '73e9cfcfc13fe1eb9ae4b12593ca620f103fd3dd', ref: (el) => (this.headerSlot = el), name: "q2-section-header" }))), this.collapsible && !this.noCollapseIcon && (h("q2-btn", { key: 'd3d53f2d0740600a5178d93107db9ba684f29a44', label: loc(this.label || 'tecton.element.section.defaultToggleLabel'), ariaExpanded: `${!!this.expanded}`, ariaControls: this.contentId, "test-id": "toggleButton", "hide-label": true, onClick: this.onHeaderClick }, h("q2-icon", { key: '5c79651503d2222d92bdc8cc9b7811f75306a436', type: "chevron-up" })))), h("div", { key: '55fc425e4aea009b8102eb495069d9e191660045', class: wrapperClasses.join(' '), id: this.contentId, "aria-labelledby": this.titleId, role: "region", onTransitionEnd: this.onTransitionEnd, style: this.collapsible && {
+        return (h("section", { key: '3128e3974825bcd873c7713c20e1b4f004d02a30', class: "wrapper" }, h("header", { key: '1eb1fb74a992c76989a2a8baaa3bee68afa57138', class: hasHeader ? 'has-header' : '' }, h("div", { key: '9621ce7f0ccbfb97f522b5640d986371e0ed2d08', class: "header-content", id: this.titleId, onClick: this.collapsible && this.onHeaderClick }, showDefaultHeader && h("h2", { key: '9b4819672218286c3b0d11417933b6661a97c2af', class: "title" }, loc(this.label)), h("div", { key: '3ad3f55b3a554575b5b361ea565883860ce843b3', ref: el => (this.headerSlotWrapper = el), class: "header-slot-wrapper" }, h("slot", { key: 'ada9ab542b0f37d627fd1086c92289ebb6ec9049', ref: (el) => (this.headerSlot = el), name: "q2-section-header" }))), this.collapsible && !this.noCollapseIcon && (h("q2-btn", { key: 'dfd4ba0293689a3d603a1c1168e2f140c5307d60', label: loc(this.label || 'tecton.element.section.defaultToggleLabel'), ariaExpanded: `${!!this.expanded}`, ariaControls: this.contentId, "test-id": "toggleButton", "hide-label": true, onClick: this.onHeaderClick }, h("q2-icon", { key: '6c72dd59ead1dad5a54def864afa4d5d6ff7ce14', type: "chevron-up" })))), h("div", { key: '96434da7e59bf12b908a95aa4aa46fe59655da32', class: wrapperClasses.join(' '), id: this.contentId, "aria-labelledby": this.titleId, role: "region", onTransitionEnd: this.onTransitionEnd, style: this.collapsible && {
                 height: this.contentHeight,
-            } }, h("div", { key: 'cd773f58a51c95785062f37c7542d0742acf9ab9', ref: el => (this.contentContainer = el), class: "content", tabindex: "-1" }, h("slot", { key: 'e614cef7ec9036998dc509454c79439e3369b660', ref: (el) => (this.contentSlot = el) })))));
+            } }, h("div", { key: 'b6ef59a27be6c6b3c0cdc8b23eef7d7a80a0937e', ref: el => (this.contentContainer = el), class: "content", tabindex: "-1" }, h("slot", { key: 'bca7946799bfd50e1be14b24e4106df2a583b43b', ref: (el) => (this.contentSlot = el) })))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-select2.js CHANGED Viewed

@@ -800,7 +800,7 @@ const Q2Select = /*@__PURE__*/ proxyCustomElement(class Q2Select extends HTMLEle
             ]), checked: showSelected, "test-id": "selectedOptionsButton", onClick: this.showSelectedOptions, onKeyDown: this.visibilityToggleKeyDown }), h("label", { htmlFor: "selected" }, loc('tecton.element.select.multiHeader.selected', [selectedOptionsCount]))))));
     }
     render() {
-        return (h("click-elsewhere", { key: '3e4e224801ab3110490f94c49d6b1ff1e1f8f227', class: this.wrapperClasses, role: "presentation", onChange: this.clickedElsewhere }, this.renderSelectField()));
+        return (h("click-elsewhere", { key: 'c0da37dd6495f81c0e9fa7303ed3059f60521d96', class: this.wrapperClasses, role: "presentation", onChange: this.clickedElsewhere }, this.renderSelectField()));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-stepper-pane.js CHANGED Viewed

@@ -75,7 +75,7 @@ const Q2StepperPane$1 = /*@__PURE__*/ proxyCustomElement(class Q2StepperPane ext
     // #region Render Methods
     render() {
         const { label, isActive } = this;
-        return (h(Host, { key: '69b27313eda3276e7041c2813b2a56a53efc104b', role: "listitem" }, h(Fragment, { key: 'c7c5d0fd3ad3dc8650832d6e2f32ff59ee28b1a6' }, h("div", { key: 'a07608df6dc48453a00b72e501d23f28b72ab5cb', "aria-label": label && loc(label), tabindex: "0", hidden: !isActive && !(this.isChildActive && this.showWithChildren) }, h("slot", { key: '68cef0c9131cf432fa9d48500f62fc88ebba198b' })), h("div", { key: '0b9f7a3e34565490acd91747b047f9802bf9ac49', hidden: true }, h("slot", { key: 'ca7f10c02501ba44b75640d6f6a67d1f4d5dcf92', name: "label", onSlotchange: () => this.contentChange.emit() }), h("slot", { key: 'f1cd0547c27b3f869fc245d6eba144cf85c3e17f', name: "description", onSlotchange: () => this.contentChange.emit() })), h("slot", { key: 'bf21a7e7f578f58649edfa9ebf34849385b712a4', name: "children" }))));
+        return (h(Host, { key: '3522e747efa7fceace61bfcbc8ebe875a122b68d', role: "listitem" }, h(Fragment, { key: '986e434647215ff29c168609a2154156fdbb69a1' }, h("div", { key: 'ed2fef05b366c5fd3d8f0b64db2ce4dceb3b6735', "aria-label": label && loc(label), tabindex: "0", hidden: !isActive && !(this.isChildActive && this.showWithChildren) }, h("slot", { key: '5b5333b64c2114e5fd7caada8818eb2ce793900f' })), h("div", { key: '6aeb4f8ebc8700ac3c363bd72023743eba58f841', hidden: true }, h("slot", { key: '7d3eaf00c409f597efbb934a8d356195fa239265', name: "label", onSlotchange: () => this.contentChange.emit() }), h("slot", { key: '258bf88e3a2c98734501a3d3e7b66e1735011f50', name: "description", onSlotchange: () => this.contentChange.emit() })), h("slot", { key: '4013f30dde148392690cdef431959a056af98873', name: "children" }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-stepper.js CHANGED Viewed

@@ -284,7 +284,7 @@ const Q2Stepper$1 = /*@__PURE__*/ proxyCustomElement(class Q2Stepper extends HTM
         const containerClasses = ['step-container'];
         if (scrollEnabled)
             containerClasses.push('has-scroll');
-        return (h(Fragment, { key: 'b9bbe49ba3b47a4bcf32a8dc15e8731288f4eebd' }, h("div", { key: '1573c647f547aadef0b6cf393acfe61e431cf0da', class: containerClasses.join(' ') }, scrollEnabled && (h(Fragment, { key: '9d3a985448dd7e4439485fb3b8408871d67df6fc' }, h("div", { key: 'b8ed037c41fa19dcfeb2d30e0690c9838bf9f61a', class: "gradient-left", hidden: !showScrollLeft }), h("div", { key: 'ef91d66fd50ce2377c96999aea029da78cef8438', class: "gradient-right", hidden: !showScrollRight }), h("q2-btn", { key: 'd041a6e7aedabbb47de657cc690d3488cd408d2f', class: "btn-left", hideLabel: true, hidden: !this.showScrollLeft, label: loc('tecton.element.stepper.scrollLeft'), onTctClick: () => this.onScrollBtnClick('left') }, h("q2-icon", { key: '0a4b6a0b982f270dca51fbd61829708daf03ea79', type: "chevron-left" })), h("q2-btn", { key: 'a690d70cc826f0236d2501680850453d3160b636', class: "btn-right", hideLabel: true, hidden: !this.showScrollRight, label: loc('tecton.element.stepper.scrollRight'), onTctClick: () => this.onScrollBtnClick('right') }, h("q2-icon", { key: '0678d7423d4f3fc7529649b23f074fc1b17f6379', type: "chevron-right" })))), h("ul", { key: '623c1491f459cf7e1313d486f3a547d9c31f0bf6', onScroll: this.checkScrollState, ref: el => (this.listElement = el), role: "tablist" }, stepCount > 0 && [...Array(stepCount).keys()].map(stepIndex => this.renderStepBtn(stepIndex)))), h("div", { key: 'cce9355d3553bbefef2eb5cf303463777693ff76', role: "list" }, h("slot", { key: '7de13d3600c9b8093d77b55101f27bb2d7bb19a8', onSlotchange: () => this.onSlotChange() }))));
+        return (h(Fragment, { key: '921748b0e20ada57cac4f0b66ac9ed97d2355d26' }, h("div", { key: '3d5099613b5a5e825ade9a246dbec2068e04a7d8', class: containerClasses.join(' ') }, scrollEnabled && (h(Fragment, { key: '3842e7310fa0788566192e34fee1d1df20f48b52' }, h("div", { key: 'ad9d8ba937cc012dca25b8844e2ecea36be1e4c8', class: "gradient-left", hidden: !showScrollLeft }), h("div", { key: '4a17dcc015ac03d2b6c41d2493c7ae81196d850f', class: "gradient-right", hidden: !showScrollRight }), h("q2-btn", { key: 'b38a23630a4c0f330aa52d8b2cfc7643b3fa134c', class: "btn-left", hideLabel: true, hidden: !this.showScrollLeft, label: loc('tecton.element.stepper.scrollLeft'), onTctClick: () => this.onScrollBtnClick('left') }, h("q2-icon", { key: '043873f95eae37851127d03c61fd73c93abae581', type: "chevron-left" })), h("q2-btn", { key: 'b86849ccce00f6ddbdd25a64f345f98e6070dd19', class: "btn-right", hideLabel: true, hidden: !this.showScrollRight, label: loc('tecton.element.stepper.scrollRight'), onTctClick: () => this.onScrollBtnClick('right') }, h("q2-icon", { key: 'de9ea9fc186474cb0f3a57f6314aa1e78539a2cd', type: "chevron-right" })))), h("ul", { key: '10078d2a1382c4abee65f52c88ef3006cfdd0c19', onScroll: this.checkScrollState, ref: el => (this.listElement = el), role: "tablist" }, stepCount > 0 && [...Array(stepCount).keys()].map(stepIndex => this.renderStepBtn(stepIndex)))), h("div", { key: '96efdd3370c5fc3ed7f91d372a645063b9b6ad61', role: "list" }, h("slot", { key: '26bfea7637cd71eb704d626cd93c74c3df13c4ba', onSlotchange: () => this.onSlotChange() }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {