q2-tecton-elements 1.67.0 → 1.67.2

package/dist/components/q2-form.js

@@ -14,7 +14,7 @@ const Q2Form$1 = /*@__PURE__*/ proxyCustomElement(class Q2Form extends HTMLEleme
     // #endregion
     // #region Render Methods
     render() {
-        return (h("div", { key: '41d956df983865cc2a6c0fe1bd4ffffefa93486f', class: "container" }, h("slot", { key: '293087685e8a10b88a50eaa032dd2ab91bffd44b' })));
+        return (h("div", { key: '6720d1cf81a23420db41de84fce56398ff932018', class: "container" }, h("slot", { key: '48165fa24f2eb15d66fdfa63b6c122c0dc320714' })));
     }
     static get style() { return q2FormCss; }
 }, [1, "q2-form", {

package/dist/components/q2-formatted-text.js

@@ -72,7 +72,7 @@ const Q2FormattedText$1 = /*@__PURE__*/ proxyCustomElement(class Q2FormattedText
     // #region Render Methods
     render() {
         const { formattedTextClasses } = this;
-        return (h("div", { key: '21e3c3fd0c2087a24f1420c216cba11c27494057', class: formattedTextClasses, "aria-label": this.formattedValue }, h("span", { key: 'e1d25b8e88a28f2ec468de8afd6f56e85955f266' }, this.formattedValue)));
+        return (h("div", { key: '0e3cb56f89a3ab403b45b411a4cd38ec267ed58b', class: formattedTextClasses, "aria-label": this.formattedValue }, h("span", { key: 'a9bb42690d67bce14debcb99db50c63582c6ba63' }, this.formattedValue)));
     }
     static get watchers() { return {
         "value": ["propsUpdated"],

package/dist/components/q2-grid-area.js

@@ -109,7 +109,7 @@ const Q2GridArea$1 = /*@__PURE__*/ proxyCustomElement(class Q2GridArea extends H
             '--xl-align-self': this.xlAlign || this.lgAlign || this.mdAlign || this.smAlign || this.xsAlign || this.align,
             '--xl-z-index': `${this.computedXlZIndex}`,
         };
-        return (h(Host, { key: '7e2f7933ba52dd99f90350dfb3a2778d1c1a37d0', style: q2GridAreaStyles }, h("slot", { key: '39371e8a0fb1c1bd9c248ba5b8095f9bdd6022e7' })));
+        return (h(Host, { key: 'd26c984d2ad2022162a1e4bfcb17f3770c0a95d3', style: q2GridAreaStyles }, h("slot", { key: '7951a611fc9bdf5b0f4535f995317765323eca21' })));
     }
     get hostElement() { return this; }
     static get style() { return q2GridAreaCss; }

package/dist/components/q2-grid.js

@@ -91,7 +91,7 @@ const Q2Grid$1 = /*@__PURE__*/ proxyCustomElement(class Q2Grid extends HTMLEleme
             '--xl-justify-items': this.xlJustify || this.lgJustify || this.mdJustify || this.smJustify || this.xsJustify || this.justify,
             '--xl-align-items': this.xlAlign || this.lgAlign || this.mdAlign || this.smAlign || this.xsAlign || this.align,
         };
-        return (h(Fragment, { key: '3fb3de0d4c9b17b30e9b513669b7d12edc702914' }, h("div", { key: 'be68db8fe15dd325f553d5f838cc91f5709f251b', style: q2GridStyles, class: "q2-grid" }, h("slot", { key: '5b9819228a885661846862a619b9a30792bc8ac0' }))));
+        return (h(Fragment, { key: 'ab38b4849ec0cdf8ab49d536bb440df6f21b93d7' }, h("div", { key: '0fd537b2867d871be69269d983234f9f6e47edeb', style: q2GridStyles, class: "q2-grid" }, h("slot", { key: 'd9d7b5d7bbcde66f0bcef49c2c31906e12536e90' }))));
     }
     static get style() { return q2GridCss; }
 }, [1, "q2-grid", {

package/dist/components/q2-input2.js

@@ -3576,7 +3576,7 @@ const Q2Input = /*@__PURE__*/ proxyCustomElement(class Q2Input extends HTMLEleme
     }
     render() {
         const { ariaControls, ariaExpanded } = this.ariaAttributes;
-        return (h(Host, { key: 'fde8332c0098e6db906a3ae3aa6fb5bda3e5c183', role: this._role, "aria-controls": ariaControls, "aria-expanded": ariaExpanded }, h("div", { key: '258def8229372ba6486aeb04c59a3bbaa8a5b5f9', class: this.wrapperClasses }, h("div", { key: '37b18f4a5802f8fafaf234585fbf05270ab90778', class: "label-wrapper" }, renderLabel(this), this.renderCountDOM()), this.renderInputContainerDOM(), renderMessages(this))));
+        return (h(Host, { key: '5cd0ac01d09732c81c59519cd04a998ff99e4dea', role: this._role, "aria-controls": ariaControls, "aria-expanded": ariaExpanded }, h("div", { key: '3907d95e0564a7e5f53148f6bdd02f0d51dcc8b6', class: this.wrapperClasses }, h("div", { key: '73857901c65827a40b17a56e8a1ac4d1d9c4faf7', class: "label-wrapper" }, renderLabel(this), this.renderCountDOM()), this.renderInputContainerDOM(), renderMessages(this))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-item2.js

@@ -107,7 +107,7 @@ const Q2Item = /*@__PURE__*/ proxyCustomElement(class Q2Item extends HTMLElement
     // #region Render Methods
     render() {
         const { clickable } = this;
-        return (h("div", { key: 'ca6b1f858b9857c47204acc08f686727ee8beeeb', "test-id": "itemContainer", class: this.itemClasses, ref: el => (this.itemElement = el), role: clickable ? 'button' : undefined, tabIndex: clickable ? 0 : undefined }, this.hasDecoratorSlotContent && (h("div", { key: '230306123ce534b5d581d5d3c8ac43abc51e5b4e', class: this.decoratorClasses }, h("slot", { key: 'a4cf798e99caa5f158bcffcf88a7fa8655c26a83', name: "decorator" }, h("slot", { key: 'e2e97954c5d6b4eacbbd9a39c78296cb273daa06', name: "bullet" })))), h("div", { key: '482f65fea497fbca187cc77849584fd4f3a07aff', class: this.mainClasses }, this.hasHeaderSlotContent && (h("div", { key: '8863cc54ea1f757f0eafd879e15d9647b5a426e6', class: "header" }, h("slot", { key: '2977d0908edde16d5b3f2c0cddd3254cce20b68a', name: "header" }))), this.hasBodySlotContent && (h("div", { key: 'ba3e78a5001eb2fe8103b4320781dbc093d5e965', class: "body" }, h("slot", { key: '8c0d7c06c88ba2c3e338db99d99095552c40e787', name: "body" })))), this.hasActionSlotContent && (h("div", { key: '89ba277d280eb8b847252c9cecd556b6308d240d', class: this.actionClasses }, h("slot", { key: 'd690fc381d89367183832c70c48d0de1f263b5bc', name: "action" }))), this.hasFooterSlotContent && (h("div", { key: '5cda2ab77b732eb6449b6afe5944a4a68fb5ffb4', class: this.footerClasses }, h("slot", { key: 'ac4fbf27d7af6aa9b383096a415770c972efbade', name: "footer" })))));
+        return (h("div", { key: '3bd899fe8e37940635740451ebcf07407103e5e8', "test-id": "itemContainer", class: this.itemClasses, ref: el => (this.itemElement = el), role: clickable ? 'button' : undefined, tabIndex: clickable ? 0 : undefined }, this.hasDecoratorSlotContent && (h("div", { key: '57a84cb0e340658499cfc3283f65d425519fcfcb', class: this.decoratorClasses }, h("slot", { key: 'ef0b095c055d0ceed0fe18ecb4d1b2565f3bdb82', name: "decorator" }, h("slot", { key: 'ec695f3ab95be46331cec70b270a1f0434444fff', name: "bullet" })))), h("div", { key: '263e6a9ebe842c2430cb263fe8ea1e523f286a17', class: this.mainClasses }, this.hasHeaderSlotContent && (h("div", { key: '6340f074d8b489e37f21b57b89038f323e5a2533', class: "header" }, h("slot", { key: '2ec1a529cd639a520a4b873d2898b88470a2c16a', name: "header" }))), this.hasBodySlotContent && (h("div", { key: '1d38f6795a8ee607eb93e1ff31ddab54dcd41c79', class: "body" }, h("slot", { key: '73fe582085a453608301236160cd260474d338c5', name: "body" })))), this.hasActionSlotContent && (h("div", { key: '0fd2164d9ab710b54655e325aa328d4e236a7bd7', class: this.actionClasses }, h("slot", { key: 'ce2cb3c08a76f136858a1e8ce2db30b822e17b82', name: "action" }))), this.hasFooterSlotContent && (h("div", { key: '700c9f3faa4dc6f5c0e22d18470614c028c6c8d5', class: this.footerClasses }, h("slot", { key: 'b3fe3d2477936abcf950c8a7565372456023462f', name: "footer" })))));
     }
     get hostElement() { return this; }
     static get style() { return q2ItemCss; }

package/dist/components/q2-legend2.js

@@ -118,7 +118,7 @@ const Q2Legend = /*@__PURE__*/ proxyCustomElement(class Q2Legend extends HTMLEle
     // #endregion
     // #region Render Methods
     render() {
-        return (h("click-elsewhere", { key: '2edad285ad14be5cdee30e071d1e5e11337076f0', onChange: () => this.onClickElsewhere(this) }, h("ul", { key: '11104022e84eddd37155299b0833c71bc9a0582d' }, this.dataWithClasses.map(item => (h("li", { class: "item" }, h("button", { "test-id": "item", "aria-label": `${item.name} ${this.formatValue(item.value)}`, class: item.classes, onClick: event => this.onClick(event, item), onMouseEnter: event => this.onMouseEnter(event, item), onMouseLeave: event => this.onMouseLeave(event, item) }, h("span", { "test-id": "itemColor", class: "item-color-indicator", style: { backgroundColor: item.color }, "aria-hidden": "true" }), h("span", { "test-id": "itemName", class: "item-name" }, item.name), h("span", { id: `item-${item.id}`, "test-id": "itemValue", class: "item-value" }, this.formatValue(item.value)))))))));
+        return (h("click-elsewhere", { key: 'ab6f88f29a37f3b48c7bee9bc1263142d9376b3c', onChange: () => this.onClickElsewhere(this) }, h("ul", { key: 'aa6443ae74f0d89965963195c479aab4f95fa667' }, this.dataWithClasses.map(item => (h("li", { class: "item" }, h("button", { "test-id": "item", "aria-label": `${item.name} ${this.formatValue(item.value)}`, class: item.classes, onClick: event => this.onClick(event, item), onMouseEnter: event => this.onMouseEnter(event, item), onMouseLeave: event => this.onMouseLeave(event, item) }, h("span", { "test-id": "itemColor", class: "item-color-indicator", style: { backgroundColor: item.color }, "aria-hidden": "true" }), h("span", { "test-id": "itemName", class: "item-name" }, item.name), h("span", { id: `item-${item.id}`, "test-id": "itemValue", class: "item-value" }, this.formatValue(item.value)))))))));
     }
     static get watchers() { return {
         "hoveredItemId": ["watchHoveredItemId"],

package/dist/components/q2-list2.js

@@ -69,7 +69,7 @@ const Q2List = /*@__PURE__*/ proxyCustomElement(class Q2List extends HTMLElement
     // #endregion
     // #region Render Methods
     render() {
-        return (h("div", { key: '627d68ebcba5f0d9dea1ab60481c380916c76ae5', class: this.listClasses, ref: el => (this.listElement = el) }, (this.hasFilterSlot || this.hasLabelContent) && (h("div", { key: 'f5567987b84f12874e4a8c42b846f5785b99e2bb', class: this.headerClasses }, h("div", { key: '0664369f4d92be4486f8d672f62c0d3478c13c2a', class: "label" }, this.label), this.hasFilterSlot && h("slot", { key: 'faa8de8696790abc591632e5bc182228da532562', name: "filter" }))), h("div", { key: '60a4c2980ea5462df148e31251a59142e001b5f3', role: "list" }, h("slot", { key: '935730bc5de751dcd25111cdd4f9cb6b9d00f10b' }))));
+        return (h("div", { key: '5602927af6da7b334c38f7d2cc207633d6089f7c', class: this.listClasses, ref: el => (this.listElement = el) }, (this.hasFilterSlot || this.hasLabelContent) && (h("div", { key: '23ae73b5b842f17d45f9f82b06db79e8ea5c1796', class: this.headerClasses }, h("div", { key: '428117b7ffeadbfe4a53d39bf95d16cae1c26148', class: "label" }, this.label), this.hasFilterSlot && h("slot", { key: '3c5c29226478ba20fbe691b4265a2966b43f3fcb', name: "filter" }))), h("div", { key: '358b66a87ce56416c1dd42b8cc8a480996e2bdaf', role: "list" }, h("slot", { key: '8eabad8c7f15fac806588c651abf4ee400994d52' }))));
     }
     get hostElement() { return this; }
     static get style() { return q2ListCss; }

package/dist/components/q2-message2.js

@@ -68,7 +68,7 @@ const Q2Message = /*@__PURE__*/ proxyCustomElement(class Q2Message extends HTMLE
         const addDivForAriaLive = !isFirefox && this.presentToggle;
         const { description } = this;
         const messageLabel = loc(`tecton.element.message.type.${this.type ? this.type : 'info'}`);
-        return (h("div", { key: 'aff2483085e25648ba989847f10c91250df281a9', tabindex: "-1", class: "message", role: description ? undefined : 'alert', "aria-live": description ? undefined : 'assertive', "aria-atomic": description ? undefined : 'true', "aria-relevant": description && addAriaHiddenForAriaLive ? undefined : 'all', "test-id": "messageContainer" }, h("div", { key: '6f416c44047bfce1f0f788edf7545a1d0da4b55c', class: "bar", "test-id": "bar" }), this.appearance === 'standard' ? this.messageIcon(this.type) : '', addDivForAriaLive && h("div", { key: 'f144ac7da5821a8c7f5df44d2ed7b16ee35d025c', class: "sr" }), h("div", { key: 'ebff5b28951e94eaf1cb83d67b4376c3636f3143', class: "sr message-label" }, messageLabel), h("div", { key: '40f3902af3e4b79ee61c3f2dc0f63cd209694c83', class: "message-content", "aria-hidden": addAriaHiddenForAriaLive ? 'true' : undefined }, h("slot", { key: '6843ae94d50f20f2599a92d5e31122498cee53a5' }))));
+        return (h("div", { key: 'b65f9feaee320f96a3f745eb4231510eab67aba6', tabindex: "-1", class: "message", role: description ? undefined : 'alert', "aria-live": description ? undefined : 'assertive', "aria-atomic": description ? undefined : 'true', "aria-relevant": description && addAriaHiddenForAriaLive ? undefined : 'all', "test-id": "messageContainer" }, h("div", { key: '66b9440bf994341ff365766a1241f56556fffe57', class: "bar", "test-id": "bar" }), this.appearance === 'standard' ? this.messageIcon(this.type) : '', addDivForAriaLive && h("div", { key: '47269ca27bc9c952249f574ab98e45d026125228', class: "sr" }), h("div", { key: '63a91696622f38741d5d403fe81262e2d5458328', class: "sr message-label" }, messageLabel), h("div", { key: '544cecc85e943f0156b63489cc78a42bec02f7c9', class: "message-content", "aria-hidden": addAriaHiddenForAriaLive ? 'true' : undefined }, h("slot", { key: '36ff0e64df72018818fd8452e847c522ea4c4039' }))));
     }
     get hostElement() { return this; }
     static get style() { return q2MessageCss; }

package/dist/components/q2-meter.js

@@ -116,7 +116,7 @@ const Q2Meter$1 = /*@__PURE__*/ proxyCustomElement(class Q2Meter extends HTMLEle
     }
     render() {
         const [completed, suggested] = this.convertToPercentage(this.completedValue, this.suggestedValue, this.maxValue);
-        return (h("div", { key: '1fcdcdac6a15aa52ac302ec40bc5809ab39fdbe6', class: "meter-container", "aria-label": this.ariaLabel, role: "group" }, this.label && (h("div", { key: 'a4cf43a802e84c0ceaf44c697511c206d0611906', class: "label", "aria-label": loc(this.label) }, loc(this.label))), this.description && (h("div", { key: '8b8bdbcc35dbc2de60063cbf871a4a34bbe7548b', class: "description", "aria-label": loc(this.description) }, loc(this.description))), this.renderBar(completed, suggested), h("div", { key: '624342cfe8f534af2396fe6190e24bfcaecdb0c2', class: "legends" }, h("div", { key: '835efacea1cc4d03092cecbbd6914d54b498fa5f', class: "left" }, this.completedValue || this.completedLabel ? (h("div", { class: "completed" }, h("div", { class: "dot" }), h("div", { class: "legend-label" }, this.completedValue, " ", loc(this.completedLabel)))) : (''), this.suggestedValue || this.suggestedLabel ? (h("div", { class: "suggested" }, h("div", { class: "dot" }), h("div", { class: "legend-label" }, this.suggestedValue, " ", loc(this.suggestedLabel)))) : ('')), h("div", { key: '428535e8b751a3316bfb5b5ad19756d3fc09fcd0', class: "right" }, h("div", { key: 'f175ee347bcd84716c5e1971d657c4fbf7dcbbc1', class: "max" }, this.maxValue, " ", loc(this.maxLabel))))));
+        return (h("div", { key: '656e8a53bbaf26529db53e535efcad7a22b9ee01', class: "meter-container", "aria-label": this.ariaLabel, role: "group" }, this.label && (h("div", { key: '25d53f9a1d387d4b839507239454484d9678061f', class: "label", "aria-label": loc(this.label) }, loc(this.label))), this.description && (h("div", { key: 'd5786b4e65ab5b262b82f107bb310ca27b34c4ed', class: "description", "aria-label": loc(this.description) }, loc(this.description))), this.renderBar(completed, suggested), h("div", { key: '015cc474c3113ff248982d64656218a79744e09e', class: "legends" }, h("div", { key: '1af88cd2386058a8c20f3a82d0e40ffafffc4c38', class: "left" }, this.completedValue || this.completedLabel ? (h("div", { class: "completed" }, h("div", { class: "dot" }), h("div", { class: "legend-label" }, this.completedValue, " ", loc(this.completedLabel)))) : (''), this.suggestedValue || this.suggestedLabel ? (h("div", { class: "suggested" }, h("div", { class: "dot" }), h("div", { class: "legend-label" }, this.suggestedValue, " ", loc(this.suggestedLabel)))) : ('')), h("div", { key: '22eb4ec7a86114f3f109e4adfb0acbcea9509de8', class: "right" }, h("div", { key: 'b9384865d0ef8c81569243b40ccf320efcd208ec', class: "max" }, this.maxValue, " ", loc(this.maxLabel))))));
     }
     get hostElement() { return this; }
     static get style() { return q2MeterCss; }

package/dist/components/q2-modal.js

@@ -144,7 +144,7 @@ const Q2Modal$1 = /*@__PURE__*/ proxyCustomElement(class Q2Modal extends HTMLEle
     render() {
         const interiorClasses = `interior`;
         const renderStatus = `${this.renderStatus || ''}`;
-        return (h("dialog", { key: '2a1e01cc98af3b7dc4ec4492f3dbe2b61ff060ff', ref: el => (this.dialogElement = el), class: renderStatus, onClick: this.onClick }, h("div", { key: '6e0c488f59516d53c2e34c80c4fed32f2963e76e', class: interiorClasses }, this.title && (h("header", { key: 'd97209894acdc0c907516395ec4ccb2dea5c93d3' }, this.title && h("h2", { key: '56cd50bf63c72417bb7d640eb64421fa65ed4006', class: "title" }, this.title), !!this.closable && (h("q2-btn", { key: 'e9832d75490902ccac63009208dc805183fc6fed', class: "btn-close", "test-id": "btnClose", onClick: this.onCancel, label: "tecton.element.modal.close", "hide-label": true }, h("q2-icon", { key: '999e4cbad19c10f2938a00e105dc9655dadb4fa1', type: "close" }))))), h("div", { key: 'df57e3809860f06f08ccca9578612d5d204c4cde', class: "content", ref: el => (this.contentElement = el) }, this.icon && (h("div", { key: '56ea4df19dab180f4e8847e4b64e2a8784be2ee4', class: "icon" }, h("q2-icon", { key: '50cc9eb841424d1433a5afcac8416a604bc583d7', type: this.icon }))), this.imageSrc && (h("div", { key: '743af68df051cc939799d60ba061cdc0b5680212', class: "image" }, h("img", { key: 'ad69ea057cb66b80338a9d06601c39f1ae5aa3ac', src: this.imageSrc }))), hasSlotContent(this.hostElement, 'content') && h("slot", { key: 'ac45807fa0700265591bc194cf0b24cbc233d23b', name: "content" }), this.description && h("p", { key: 'adb8757efc3a2877ccf0eb4affd759158caa38d6', class: "description" }, this.description), this.customMarkup && (h("p", { key: '95f97089b1cf6c411f8e915808f6bf89fe396e0b', class: "customMarkup", innerHTML: sanitizeHTMLString(this.customMarkup) }))), h("footer", { key: 'd41618d7da89c69d604cf762831a26b1a56901b4' }, h("q2-action-group", { key: '6a4d8f77c8c5e2b86b439d76d05b2280786da704', "full-width": true }, h("slot", { key: '87e723189a4c60e2ad0cabe567e6603a368e7c58', name: "action" }))))));
+        return (h("dialog", { key: 'e7c16406478e632f39057feb8ab86029c2b6ddd7', ref: el => (this.dialogElement = el), class: renderStatus, onClick: this.onClick }, h("div", { key: 'b59510c6a97ac4f8e4820465919e364a924b82e1', class: interiorClasses }, this.title && (h("header", { key: '714904259d422f663d13aa27b715a2de9ab3b12b' }, this.title && h("h2", { key: '69e2f5f487b73fc84ff6e0ca1e9710d7c5f80938', class: "title" }, this.title), !!this.closable && (h("q2-btn", { key: 'e9258c375fd6f077f296a496a6a67903a39f3d8c', class: "btn-close", "test-id": "btnClose", onClick: this.onCancel, label: "tecton.element.modal.close", "hide-label": true }, h("q2-icon", { key: '4c07c70736c25e12d08d6f066507326bc333ad61', type: "close" }))))), h("div", { key: 'a40c63b069c6f8c03682d8626f9a359cb5f7f7fa', class: "content", ref: el => (this.contentElement = el) }, this.icon && (h("div", { key: '95bf4a48929080493ed1f375648aa8630931e3be', class: "icon" }, h("q2-icon", { key: '8e7d34940323c625e61eea7509d829d298af82a0', type: this.icon }))), this.imageSrc && (h("div", { key: '9f6fbbd59c14cc5ee93601db161dd7c748e3b5a6', class: "image" }, h("img", { key: 'd97eb1d2dae996c2bcacddf840b984f1ffe05847', src: this.imageSrc }))), hasSlotContent(this.hostElement, 'content') && h("slot", { key: 'b7b66ddb181aa333fb88496984a6f35a34077baf', name: "content" }), this.description && h("p", { key: '54dc54b11c8c351b760afc35c714d35277b3e463', class: "description" }, this.description), this.customMarkup && (h("p", { key: '11e8922a3e277f6bb21c8cbcaf1be19de07d3a54', class: "customMarkup", innerHTML: sanitizeHTMLString(this.customMarkup) }))), h("footer", { key: 'f90f8a5569be4c1660c25388a9082e2e40a3e11d' }, h("q2-action-group", { key: '34254d2e03a6093e53324c3d98b0eb2ede3b14f2', "full-width": true }, h("slot", { key: 'a34ad5fa37fc258bd2863f2fd191acdac05de9cb', name: "action" }))))));
     }
     get hostElement() { return this; }
     static get style() { return q2ModalCss; }

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

@@ -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: 'c80017d8e2998167716488b46dd52cecfc47dcc5', class: "month-container", onKeyDown: this.onMonthKeydown }, h("div", { key: '7f14b1eac6019175522e7c5fc4b5b5b0b2967723', class: "navigation" }, h("q2-btn", { key: '4cc17ededea2f273f45b27e4ddee49cd6ac5b412', 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: '8165df4a38cfe5793689cb45bca424aaf6bcbf64', class: "year" }, this.year), h("q2-icon", { key: '827073a13b6d003b328a0fd8f8525b9b2a013ff2', class: "year-icon off", type: "chevron-down" })), h("div", { key: '5b46832d6adc2f00e5a7db0f43446b9c6b89ecad', class: "month-controller" }, h("div", { key: '8d25fa53c29f394461217255b6feb0ccd35ff884', class: "cal-year-prev-next" }, h("q2-btn", { key: '7c9b873b8111b50fe82d138e9f826c3cf3bbfff7', 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: '5b1f1906753a8b759c0b620deb49869834193035', type: "arrow-left" })), h("q2-btn", { key: 'dac82b2f5d88ecdc6d7fb0566fd4847615269949', 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: 'db889911237e7655047f33e8e19b845de8203f57', type: "arrow-right" }))))), h("div", { key: '4a4740d1513e1f970ef2754a1a7ac24299e1683c', 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: '26ac01a5dc62b4c1f97701f19bd81e8d6569e9f1', 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

@@ -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: '63a71ae4a0e7d69ea2aaec1244ff89c6d47d6a81', onSlotchange: this.handleSlotChange });
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-optgroup2.js

@@ -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: '6f4564d3db59c64b76abc47ceee3663e277b6f55', class: "q2-optgroup-container", hidden: this.hidden, "aria-labelledby": this.headerId, role: "group" }, h("div", { key: 'bd28cae7d3893142c8154286d28fb79448e5ca39', class: "q2-optgroup-header", id: this.headerId }, (this.label && loc(this.label)) || ''), h("div", { key: '63eba11bbca923ca6c22281ba31476fb89a709ca', class: "q2-optgroup-options" }, h("slot", { key: '1c27562418e4075f2843e0ec080a138a14d5f191' }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

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

@@ -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

@@ -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: '0947c1d04f042cb5f096d74146cc700e7993f277', class: this.containerClasses.join(' '), ref: el => (this.containerElement = el), "aria-label": loc('tecton.element.pagination.title') }, h("div", { key: '6da46e6c76dffa66026057e53c7515bcf00576e0', 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: '35963f235d6b549eedb8c9a443ecde053ecd8682', class: "controls" }, h("div", { key: '7016ffd2c95a76d34fd7ca112472a2a1067d7012', class: "btn-group" }, h("q2-btn", { key: 'a2a826b5ed84cedf548eaaf8aa2a8f95ad5085e6', 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: '7ebc8f748c55786954292287b4f593841a367e28', type: "chevron-double-left" })), h("q2-btn", { key: 'dfd853b3bee34fe837dc9c621829fa59c44bc81c', 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: '519ef8ea441d04291b4393ba1ab03cd2198e88b3', type: "chevron-left" }))), h("div", { key: 'fd9d2f84689b857d134babd6d7d38de5f347488d', class: "input-display", hidden: isFullViewHidden }, h("span", { key: 'c8a48d708096badc6796a9caef840c807aa06db7', "aria-hidden": "true" }, loc('tecton.element.pagination.page')), h("div", { key: '1e9965fa782cdf724e261294ad22eb34305c1c69', class: "input-wrapper", onClick: () => this.inputField.dispatchEvent(new FocusEvent('focus')) }, h("q2-input", { key: 'e61dc0d32f806ffbee54736755f8c2c8fb3dc2a4', 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: 'ea7d626698765518e2e5dcd2118b20106413134d', "aria-hidden": "true" }, loc('tecton.element.pagination.ofPages', [totalPages.toLocaleString()]))), h("div", { key: 'eb93f6858f18c382d5ebe97007c7de6a3313e6cf', class: "btn-group" }, h("q2-btn", { key: '0ab9275fbfbc3514571f2fb308b1a15345816cf5', 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: '9968130c79eaaa564f1ca47ccc9e09a0d9ec564b', type: "chevron-right" })), h("q2-btn", { key: '08c3ebf15360ba2f1ccf56d2b12c458a2ebdb71e', 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: '83351e90f2645f9c2e8854ff46a684a9f43f339b', type: "chevron-double-right" })))), h("div", { key: 'dcdb653d221e0a92910a6ece5e234126e66c8410', 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

@@ -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: '1f6a917d21078d5007387acd85fb7c03736db6ae', onChange: this.onClickElsewhere }, h("div", { key: '346b5d9651e27827e304377f9009edd50a141102', class: wrapperClassNames.join(' ') }, h("div", { key: 'c261c06b88781ea9af6f2b0f0a335476c0c7e89a', class: "btn-height-wrapper", ref: el => (this.primaryBtnWrapper = el), onClick: this.handleWrapperClick, tabIndex: -1 }, h("button", { key: 'b717af900dc54f65de00aef3ee59dade83f6da21', 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: '4d415fbec7b43fe7f2b8abff0e3a02467028cdb4', 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: '75e71787bad82eb4a5682a2315d7f5dcbd3c3b82', class: "popover-content" }, h("div", { key: '5de5d4a2f606e4b936ee46fda3aded8b09e17854', ref: el => (this.popoverTopContainer = el), class: "popover-top-container", tabindex: "-1", hidden: !this.hasPopoverTop, onKeyDown: this.handleKeydown }, h("slot", { key: '6d971654eb266bd5a3c37e04cde81dd7d6876ca5', name: "popover-top" })), h("q2-option-list", { key: '670e99d6859d673e781eba1e6eee87ee8ac728b4', 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: 'fde147d6d4c6deca9952ebdd5f022f0d348bf75e' })), h("div", { key: 'f8704bee883058f635b936fe03e888eaa9b3ce35', ref: el => (this.popoverBottomContainer = el), class: "popover-bottom-container", tabindex: "-1", hidden: !this.hasPopoverBottom, onKeyDown: this.handleKeydown }, h("slot", { key: '6761a2e76fbba5410a974eb0a24110c0c135b84e', name: "popover-bottom" })))))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/q2-popover2.js

@@ -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';
@@ -26,12 +27,6 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
         // #region Public Property API
         /** Aligns the popover to the left or right side of the control element. */
         this.align = 'left';
-        /**
-         * Controls whether the popover is animated when opening/closing.
-         * Default is true (animated). Set to false to disable animations.
-         * Animation is also disabled if the user has enabled prefers-reduced-motion.
-         */
-        this.animated = true;
         this.mode = null;
         this.handleMinHeight = () => {
             if (this.minHeight) {
@@ -43,6 +38,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 +60,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 +105,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 +121,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 +139,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 +158,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;
@@ -172,19 +180,22 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
             this.animationState = 'closing';
             this.removeViewportListeners();
             // Wait for close animation to complete
-            if (this.animated) {
-                await new Promise(resolve => {
-                    const handleAnimationEnd = () => {
-                        this.containerElement.removeEventListener('animationend', handleAnimationEnd);
-                        resolve();
-                    };
-                    this.containerElement.addEventListener('animationend', handleAnimationEnd);
-                });
-            }
-            else {
-                // No animation, proceed immediately
-                await waitForNextPaint();
-            }
+            await new Promise(resolve => {
+                if (!this.containerElement) {
+                    resolve();
+                    return;
+                }
+                const handleAnimationEnd = () => {
+                    this.pendingAnimationResolve = null;
+                    resolve();
+                };
+                this.pendingAnimationResolve = handleAnimationEnd;
+                this.containerElement.addEventListener('animationend', handleAnimationEnd, { once: true });
+            });
+            if (!this.containerElement)
+                return;
+            if (this.open)
+                return;
             this.currentDirection = undefined;
             this.animationState = 'idle';
             if (this.mode === 'legacy' || !this.supportsPopoverAPI) {
@@ -233,6 +244,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 +260,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 +294,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 +308,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 +326,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 +339,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
@@ -338,11 +354,11 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
             containerClasses.push('block');
         if (this.mode === 'legacy')
             containerClasses.push('legacy');
-        if (this.animated && this.animationState === 'opening')
+        if (this.animationState === 'opening')
             containerClasses.push('animating-open');
-        if (this.animated && this.animationState === 'closing')
+        if (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: '32b8669d138922c8229232cbeffc24c12142a603', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, h("div", { key: 'c4a9582bcf7ed063aadd40a214606d32b406f05f', ref: el => (this.contentElement = el), class: "content" }, h("slot", { key: 'e64707b4b54de39c9d9a487e4bdc6d4d5ca8b16f' }))));
     }
     get hostElement() { return this; }
     static get watchers() { return {
@@ -352,7 +368,6 @@ const Q2Popover = /*@__PURE__*/ proxyCustomElement(class Q2Popover extends HTMLE
     static get style() { return q2PopoverCss; }
 }, [1, "q2-popover", {
         "align": [513],
-        "animated": [516],
         "block": [516],
         "controlElement": [16, "control-element"],
         "direction": [513],