q2-tecton-elements 1.55.6 → 1.55.8

package/dist/q2-tecton-elements/q2-message.entry.js

@@ -1,14 +1,14 @@
-import { r as t, h as a, g as e } from "./index-7a5365e2.js";
+import { r as t, h as e, g as a } from "./index-7a5365e2.js";
 
-import { o as s, i as o, n as r, t as i, l as n } from "./index-f2a66217.js";
+import { o as s, i as o, n as r, u as i, l as n } from "./index-d801f175.js";
 
 const c = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}:host([hidden]){display:none}.message{border-left-width:var(--tct-message-bar-width, var(--t-message-bar-width, var(--app-scale-1x, 5px)));border-left-style:solid;--comp-line-height:var(--tct-message-line-height, var(--t-message-line-height, var(--app-line-height, 1.428571429em)));display:grid;gap:var(--tct-scale-1, var(--app-scale-1x, 5px));align-items:flex-start;background:var(--tct-message-background, var(--tct-message-bg, var(--t-message-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, #f2f2f2)))))));color:var(--tct-message-font-color, var(--t-message-font-color, inherit));box-shadow:var(--tct-message-box-shadow, var(--t-message-box-shadow, inherit));border-radius:var(--tct-message-border-radius, var(--t-message-border-radius, inherit))}.message:focus{box-shadow:var(--const-global-focus)}.message-icon{--comp-top-offset:calc(calc(var(--comp-line-height) - var(--comp-icon-size)) / 2);--tct-icon-size:var(--comp-icon-size);top:var(--comp-top-offset);margin-bottom:calc(var(--comp-top-offset) * -1)}.message-content{flex:1;line-height:var(--comp-line-height)}::slotted(ul){--comp-list-default-padding:0 0 0 var(--app-scale-3x, 15px);padding:var(--tct-message-list-padding, var(--comp-list-default-padding))}:host(:not([appearance])),:host([appearance=standard]){--comp-default-margin:var(--app-scale-3x, 5px) 0;margin:var(--tct-message-margin, var(--comp-default-margin))}:host(:not([appearance])) .message,:host([appearance=standard]) .message{--comp-icon-size:var(--tct-message-icon-size, var(--t-message-icon-size, 24px));--comp-padding:var(--tct-message-padding, var(--t-message-padding, var(--app-scale-3x, 15px)));grid-template-columns:var(--comp-icon-size) 1fr;padding:var(--comp-padding);padding-left:calc(var(--comp-padding) - var(--tct-scale-2, var(--app-scale-2x, 10px)));padding-bottom:calc(var(--comp-padding) - var(--tct-scale-1, var(--app-scale-1x, 5px)))}:host(:not([appearance])) ::slotted(ul),:host([appearance=standard]) ::slotted(ul){--comp-list-default-margin:var(--app-scale-3x, 15px) 0;margin:var(--tct-message-list-margin, var(--comp-list-default-margin))}:host([appearance=minimal]){margin:0}:host([appearance=minimal]) .message{padding:var(--tct-message-minimal-padding, var(--t-message-minimal-padding, var(--app-scale-2x, 10px)));grid-template-columns:1fr}:host([appearance=minimal]) ::slotted(ul){margin:var(--tct-scale-1, var(--app-scale-1x, 5px)) 0}:host(:not([type])) .message,:host([type=info]) .message{border-left-color:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))}:host(:not([type])) .message-icon,:host([type=info]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1));--tct-icon-stroke-secondary:var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))}:host([type=success]) .message{border-left-color:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00))}:host([type=success]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00));--tct-icon-stroke-secondary:var(--tct-stoplight-success, var(--const-stoplight-success, #0e8a00))}:host([type=warning]) .message{border-left-color:var(--tct-stoplight-warning, var(--const-stoplight-warning, #c35500))}:host([type=warning]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-warning, var(--const-stoplight-warning, #c35500));--tct-icon-stroke-secondary:var(--tct-stoplight-warning, var(--const-stoplight-warning, #c35500))}:host([type=error]) .message,:host([type=danger]) .message{border-left-color:var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a))}:host([type=error]) .message-icon,:host([type=danger]) .message-icon{--tct-icon-stroke-primary:var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a));--tct-icon-stroke-secondary:var(--tct-stoplight-error, var(--const-stoplight-alert, #d20a0a))}";
 
 const p = c;
 
 const d = class {
-  constructor(a) {
-    t(this, a);
+  constructor(e) {
+    t(this, e);
     this.presentToggle = undefined;
     this.appearance = "standard";
     this.description = false;
@@ -44,15 +44,15 @@ const d = class {
     return i();
   }
   messageIcon(t) {
-    const e = {
+    const a = {
       success: "success",
       warning: "warning",
       danger: "error",
       error: "error",
       info: "info"
     };
-    const s = e[t] || e.info;
-    return a("q2-icon", {
+    const s = a[t] || a.info;
+    return e("q2-icon", {
       type: s,
       class: "message-icon"
     });
@@ -61,35 +61,35 @@ const d = class {
   // #region Render Methods
   render() {
     const {isFirefox: t} = this;
-    const e = t && this.presentToggle;
+    const a = t && this.presentToggle;
     const s = !t && this.presentToggle;
     const {description: o} = this;
     const r = n(`tecton.element.message.type.${this.type ? this.type : "info"}`);
-    return a("div", {
+    return e("div", {
       key: "f4161e85adba8c023d8ad135c955a312e145ad9a",
       tabindex: "-1",
       class: "message",
       role: o ? undefined : "alert",
       "aria-live": o ? undefined : "assertive",
       "aria-atomic": o ? undefined : "true",
-      "aria-relevant": o && e ? undefined : "all",
+      "aria-relevant": o && a ? undefined : "all",
       "test-id": "messageContainer"
-    }, this.appearance === "standard" ? this.messageIcon(this.type) : "", s && a("div", {
+    }, this.appearance === "standard" ? this.messageIcon(this.type) : "", s && e("div", {
       key: "75a17b9f1d17e1c051e7ed986d1382f83da6747b",
       class: "sr"
-    }), a("div", {
+    }), e("div", {
       key: "4d1761c6d6391d2f6ed982add6effc441f7284f3",
       class: "sr message-label"
-    }, r), a("div", {
+    }, r), e("div", {
       key: "035a1040c019d8aa6eb6899e275469ab9edfc69d",
       class: "message-content",
-      "aria-hidden": e ? "true" : undefined
-    }, a("slot", {
+      "aria-hidden": a ? "true" : undefined
+    }, e("slot", {
       key: "59187a716f498e899c6c5bf6c81aca27dbfb32c2"
     })));
   }
   get hostElement() {
-    return e(this);
+    return a(this);
   }
 };
 

package/dist/q2-tecton-elements/q2-modal.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as i, h as o, g as a } from "./index-7a5365e2.js";
 
-import { p as e, w as r, e as s } from "./index-f2a66217.js";
+import { p as e, w as r, e as s } from "./index-d801f175.js";
 
 import { s as d } from "./sanitize-html-string-735c19f5.js";
 

package/dist/q2-tecton-elements/q2-month-picker.entry.js

@@ -1,6 +1,6 @@
 import { r as t, c as e, h as n, g as o } from "./index-7a5365e2.js";
 
-import { l as a, o as i } from "./index-f2a66217.js";
+import { l as i, o as a } from "./index-d801f175.js";
 
 const r = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.month-container{--comp-month-primary-background:var(--tct-btn-primary-background, var(--tct-btn-primary-bg, var(--t-btn-primary-bg, #2e2e2e)));--comp-month-primary-font-color:var(--tct-btn-primary-font-color, var(--t-btn-primary-font-color, var(--tct-white, var(--app-white, #ffffff))));--comp-month-primary-background:var(--tct-btn-secondary-background, var(--tct-btn-secondary-bg, var(--t-button-default-bg, #cccccc)));--comp-month-secondary-font-color:var(--tct-btn-secondary-font-color, var(--t-btn-secondary-font-color, var(--t-button-default-font-color, #2e2e2e)))}.month-container .navigation{display:flex;justify-content:space-between;flex-direction:row}.month-container .navigation .year-btn{padding:0 1rem;display:flex;align-items:center}.month-container .navigation .year-btn .year{margin-right:0.2rem}.month-container .navigation .year-btn .year-icon{--t-icon-stroke-width:2px;width:16px;height:16px;transition:all 0.3s ease-in-out}.month-container .navigation .year-btn .year-icon.on{transform:rotate(-180deg)}.month-container .navigation .month-controller{display:flex;align-items:center}.month-container .month-list{display:grid;grid-template-columns:auto auto auto}.month-container .month-list .month{display:flex;justify-content:center;align-items:center;padding:0.5rem 0}.month-container .month-list .month .month-button{border-radius:50%;aspect-ratio:1;width:50px;display:flex;justify-content:center;align-items:center}.month-container .month-list .month .month-button:hover{background:var(--comp-month-primary-background);color:var(--comp-month-secondary-font-color);cursor:pointer}.month-container .month-list .month .month-button:active,.month-container .month-list .month .month-button.active{background:var(--comp-month-primary-background);color:var(--comp-month-primary-font-color)}.month-container .today-label{padding:0.5rem 0;color:var(--tct-calendar-day-selected-outline-color, var(--t-calendar-day-selected-outline-color, var(--tct-stoplight-info, var(--const-stoplight-info, #0079c1))))}";
 
@@ -14,8 +14,8 @@ const s = class {
     // #region Own Properties
         this.monthGrid = [ [ 0, 1, 2 ], [ 3, 4, 5 ], [ 6, 7, 8 ], [ 9, 10, 11 ] ];
     this.months = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ].map((t => ({
-      label: a(`tecton.element.calendar.months.${t}`),
-      abbr: a(`tecton.element.calendar.months.abbr.${t}`)
+      label: i(`tecton.element.calendar.months.${t}`),
+      abbr: i(`tecton.element.calendar.months.abbr.${t}`)
     })));
     this.scheduledAfterRender = [];
     // #endregion
@@ -29,10 +29,10 @@ const s = class {
     };
     this.moveMonth = (t, e, n) => {
       const o = t.length;
-      const a = t[0].length;
-      const i = Math.floor(e / a);
-      const r = e % a;
-      const c = [ i, r ];
+      const i = t[0].length;
+      const a = Math.floor(e / i);
+      const r = e % i;
+      const c = [ a, r ];
       if (n.key === "ArrowUp") {
         n.stopPropagation();
         n.preventDefault();
@@ -82,11 +82,11 @@ const s = class {
       var e, n, o;
       this.selectedIndex = t;
       this.focusedIndex = t;
-      const a = this.hostElement.shadowRoot.querySelector(`.month-button[data-index="${t}"]`);
+      const i = this.hostElement.shadowRoot.querySelector(`.month-button[data-index="${t}"]`);
       (e = this.hostElement.shadowRoot.querySelectorAll(`.month-button`)) === null || e === void 0 ? void 0 : e.forEach((t => t.classList.remove("active")));
-      a === null || a === void 0 ? void 0 : a.classList.add("active");
-      a === null || a === void 0 ? void 0 : a.focus();
-      const i = {
+      i === null || i === void 0 ? void 0 : i.classList.add("active");
+      i === null || i === void 0 ? void 0 : i.focus();
+      const a = {
         view: "day",
         // change to day view
         monthIndex: t,
@@ -94,9 +94,9 @@ const s = class {
       };
       (o = (n = this.hostElement).onchange) === null || o === void 0 ? void 0 : o.call(n, new CustomEvent("click", {
         bubbles: true,
-        detail: i
+        detail: a
       }));
-      this.viewChange.emit(i);
+      this.viewChange.emit(a);
     };
     this.selectYear = t => {
       this.year = Math.max(1970, t);
@@ -113,7 +113,7 @@ const s = class {
   // #endregion
   // #region Component Lifecycle Events
   componentDidLoad() {
-    i(this.hostElement);
+    a(this.hostElement);
   }
   componentDidRender() {
     var t;
@@ -152,7 +152,7 @@ const s = class {
       class: "cal-year-prev-next"
     }, n("q2-btn", {
       key: "4d8b12fde9825bd5dca90012d42e73453f2cb777",
-      label: a("tecton.element.calendar.previousYear"),
+      label: i("tecton.element.calendar.previousYear"),
       "hide-label": true,
       class: "cal-nav-btn prev-year",
       "test-id": "previousYearButton",
@@ -162,7 +162,7 @@ const s = class {
       type: "arrow-left"
     })), n("q2-btn", {
       key: "2f7ef439402c9788ae002a199813387a370e0ed3",
-      label: a("tecton.element.calendar.nextYear"),
+      label: i("tecton.element.calendar.nextYear"),
       "hide-label": true,
       class: "cal-nav-btn next-year",
       "test-id": "nextYearButton",
@@ -185,7 +185,7 @@ const s = class {
     }, t.abbr))))), this.today && n("div", {
       key: "8dfee8bcf4ee9b4137c9c8644be7f38f5794bf4d",
       class: "today-label"
-    }, a("tecton.element.calendar.today"), ": ", this.today));
+    }, i("tecton.element.calendar.today"), ": ", this.today));
   }
   get hostElement() {
     return o(this);

package/dist/q2-tecton-elements/q2-optgroup.entry.js

@@ -1,12 +1,12 @@
 import { r as t, h as e, g as r } from "./index-7a5365e2.js";
 
-import { c as o, l as a } from "./index-f2a66217.js";
+import { c as o, l as a } from "./index-d801f175.js";
 
 const i = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}.q2-optgroup-header{--comp-header-padding:var(--tct-scale-1, var(--app-scale-1x, 5px)) var(--tct-scale-2, var(--app-scale-2x, 10px));background:var(--tct-optgroup-header-background, var(--tct-optgroup-header-bg, var(--t-optgroup-header-bg, var(--tct-gray-13, var(--t-gray-13, var(--tct-gray-l2, var(--app-gray-l2, #e6e6e6)))))));color:var(--tct-optgroup-header-color, inherit);padding:var(--tct-optgroup-header-padding, var(--t-optgroup-header-padding, var(--comp-header-padding)));font-weight:var(--tct-optgroup-header-font-weight, var(--t-optgroup-header-font-weight, 600));text-transform:var(--tct-optgroup-header-text-transform, var(--t-optgroup-header-text-transform, uppercase));position:sticky;top:calc(var(--comp-popover-top-container-height, 0px) + var(--tct-optgroup-top, var(--t-optgroup-top, 0px)));z-index:5}";
 
 const s = i;
 
-const p = class {
+const d = class {
   constructor(e) {
     t(this, e);
     // #region Own Properties
@@ -82,7 +82,7 @@ const p = class {
   }
 };
 
-p.style = s;
+d.style = s;
 
-export { p as q2_optgroup };
+export { d as q2_optgroup };
 //# sourceMappingURL=q2-optgroup.entry.js.map

package/dist/q2-tecton-elements/q2-option-list_2.entry.js

@@ -1,16 +1,16 @@
 import { r as t, c as e, h as i, H as o, g as s } from "./index-7a5365e2.js";
 
-import { n, l as r, o as a, i as h, w as c, v as l, h as p } from "./index-f2a66217.js";
+import { n, l as r, o as a, i as h, w as c, x as l, h as p, y as d, d as u } from "./index-d801f175.js";
 
 function sanitizeRegexString(t) {
   return t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 }
 
-const d = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{position:relative;width:100%;display:block;line-height:var(--tct-option-list-line-height, var(--t-option-list-line-height, var(--app-line-height, 1.428571429em)))}.content{text-align:start}:host([is-sizeable]) .content{display:block;height:auto}";
+const f = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{position:relative;width:100%;display:block;line-height:var(--tct-option-list-line-height, var(--t-option-list-line-height, var(--app-line-height, 1.428571429em)))}.content{text-align:start}:host([is-sizeable]) .content{display:block;height:auto}";
 
-const u = d;
+const b = f;
 
-const f = class {
+const v = class {
   constructor(i) {
     t(this, i);
     this.change = e(this, "change", 7);
@@ -595,13 +595,13 @@ const f = class {
   }
 };
 
-f.style = u;
+v.style = b;
 
-const b = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.legacy.container{display:none}.legacy.show{display:block;z-index:var(--tct-popover-z-index, 50)}:popover-open,.show{position:absolute;margin:0;padding:0;overflow:auto;background:var(--tct-popover-background, var(--app-white, #ffffff));color:var(--tct-popover-font-color, var(--t-text, #4d4d4d));min-width:var(--tct-popover-min-width, 135px);margin-block:var(--tct-popover-margin-block, 0);box-shadow:var(--tct-popover-box-shadow, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)));border-width:var(--tct-popover-border-width, 0);border-style:solid;border-color:var(--tct-popover-border-color, transparent);border-radius:var(--tct-popover-border-radius, 0);max-height:var(--comp-pop-max-height);left:var(--comp-pop-left);opacity:var(--comp-pop-opacity, 0);--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 4px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}:popover-open.block,.show.block{right:unset;width:var(--comp-pop-width);min-width:var(--tct-popover-min-width, unset)}:popover-open.left,.show.left{left:var(--comp-pop-left);right:unset}:popover-open.right,.show.right{right:var(--comp-pop-right);left:unset}:popover-open.down,.show.down{top:var(--tct-popover-top, var(--comp-pop-top));bottom:unset}:popover-open.up,.show.up{top:unset;bottom:var(--comp-pop-bottom)}:popover-open::-webkit-scrollbar,.show::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}:popover-open::-webkit-scrollbar-thumb,.show::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}:popover-open::-webkit-scrollbar-track,.show::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}click-elsewhere{position:relative;display:block}";
+const w = "*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-double-focus-ring, 0 0 0 2px #ffffff, 0 0 0 4px #0066cc)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit;font-stretch:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.legacy.container{display:none}.legacy.show{display:block;z-index:var(--tct-popover-z-index, 50)}:popover-open,.show{position:absolute;margin:0;padding:0;overflow:auto;background:var(--tct-popover-background, var(--app-white, #ffffff));color:var(--tct-popover-font-color, var(--t-text, #4d4d4d));min-width:var(--tct-popover-min-width, 135px);margin-block:var(--tct-popover-margin-block, 0);box-shadow:var(--tct-popover-box-shadow, var(--app-shadow-1, 0px 0px 2px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14)));border-width:var(--tct-popover-border-width, 0);border-style:solid;border-color:var(--tct-popover-border-color, transparent);border-radius:var(--tct-popover-border-radius, 0);max-height:var(--comp-pop-max-height);left:var(--comp-pop-left);opacity:var(--comp-pop-opacity, 0);--comp-scrollbar-size:var(--tct-scrollbar-size, var(--t-scrollbar-size, var(--app-scale-1x, 5px)));--comp-scrollbar-border-radius:var(--tct-scrollbar-border-radius, var(--t-scrollbar-border-radius, var(--app-border-radius-1, 4px)));--comp-scrollbar-color:var(--tct-scrollbar-color, var(--t-scrollbar-color, var(--t-a11y-gray-color, #747474)));scrollbar-width:thin;scrollbar-color:var(--comp-scrollbar-color) transparent}:popover-open.block,.show.block{right:unset;width:var(--comp-pop-width);min-width:var(--tct-popover-min-width, unset)}:popover-open.left,.show.left{left:var(--comp-pop-left);right:unset}:popover-open.right,.show.right{right:var(--comp-pop-right);left:unset}:popover-open.down,.show.down{top:var(--tct-popover-top, var(--comp-pop-top));bottom:unset}:popover-open.up,.show.up{top:unset;bottom:var(--comp-pop-bottom)}:popover-open::-webkit-scrollbar,.show::-webkit-scrollbar{width:var(--comp-scrollbar-size);height:var(--comp-scrollbar-size);margin:5px}:popover-open::-webkit-scrollbar-thumb,.show::-webkit-scrollbar-thumb{background:var(--comp-scrollbar-color);border-radius:var(--comp-scrollbar-border-radius)}:popover-open::-webkit-scrollbar-track,.show::-webkit-scrollbar-track{background:transparent;border-radius:var(--comp-scrollbar-border-radius)}click-elsewhere{position:relative;display:block}";
 
-const v = b;
+const m = w;
 
-const w = class {
+const g = class {
   constructor(i) {
     t(this, i);
     this.popoverStateChanged = e(this, "popoverStateChanged", 7);
@@ -641,41 +641,41 @@ const w = class {
       e.style.setProperty("--comp-pop-opacity", "1");
     };
     this.setPopoverAPICSSProperties = async () => {
-      var t, e, i, o, s, n;
-      const {controlElement: r, containerElement: a, currentDirection: h, isModule: l, align: p} = this;
-      const {top: d, bottom: u, left: f, right: b} = (e = (t = r === null || r === void 0 ? void 0 : r.getBoundingClientRect) === null || t === void 0 ? void 0 : t.call(r)) !== null && e !== void 0 ? e : {
+      var t, e, i;
+      const {controlElement: o, containerElement: s, currentDirection: n, isModule: r, align: a} = this;
+      const {top: h, bottom: l, left: p, right: d} = (e = (t = o === null || o === void 0 ? void 0 : o.getBoundingClientRect) === null || t === void 0 ? void 0 : t.call(o)) !== null && e !== void 0 ? e : {
         top: 0,
         bottom: 0,
         left: 0,
         right: 0
       };
-      const v = f;
-      const w = ((i = window === null || window === void 0 ? void 0 : window.visualViewport) === null || i === void 0 ? void 0 : i.width) - b;
-      if (p === "right") {
-        a.style.setProperty("--comp-pop-right", `${w - window.scrollX}px`);
-        a.style.setProperty("--comp-pop-left", "unset");
+      const u = p;
+      const f = ((i = window === null || window === void 0 ? void 0 : window.visualViewport) === null || i === void 0 ? void 0 : i.width) - d;
+      if (a === "right") {
+        s.style.setProperty("--comp-pop-right", `${f - window.scrollX}px`);
+        s.style.setProperty("--comp-pop-left", "unset");
       } else {
-        a.style.setProperty("--comp-pop-left", `${v + window.scrollX}px`);
-        a.style.setProperty("--comp-pop-right", "unset");
+        s.style.setProperty("--comp-pop-left", `${u + window.scrollX}px`);
+        s.style.setProperty("--comp-pop-right", "unset");
       }
-      if (this.block) a.style.setProperty("--comp-pop-width", `${(r === null || r === void 0 ? void 0 : r.offsetWidth) || 0}px`);
-      if (h === "up") {
-        if (l) {
-          a.style.setProperty("--comp-pop-bottom", `${window.innerHeight - d}px`);
+      if (this.block) s.style.setProperty("--comp-pop-width", `${(o === null || o === void 0 ? void 0 : o.offsetWidth) || 0}px`);
+      if (n === "up") {
+        if (r) {
+          s.style.setProperty("--comp-pop-bottom", `${window.innerHeight - h}px`);
         } else {
-          a.style.setProperty("--comp-pop-bottom", `${window.innerHeight - d - ((o = window === null || window === void 0 ? void 0 : window.visualViewport) === null || o === void 0 ? void 0 : o.offsetTop) - window.scrollY}px`);
+          s.style.setProperty("--comp-pop-bottom", `${window.innerHeight - h - window.scrollY}px`);
         }
       }
-      if (h === "down") {
-        if (l) {
-          a.style.setProperty("--comp-pop-top", `${u}px`);
+      if (n === "down") {
+        if (r) {
+          s.style.setProperty("--comp-pop-top", `${l}px`);
         } else {
-          a.style.setProperty("--comp-pop-top", `${u + ((n = (s = window === null || window === void 0 ? void 0 : window.visualViewport) === null || s === void 0 ? void 0 : s.offsetTop) !== null && n !== void 0 ? n : 0) + window.scrollY}px`);
+          s.style.setProperty("--comp-pop-top", `${l + window.scrollY}px`);
         }
       }
       // Wait for one paint to prevent layout thrashing
             await c();
-      a.style.setProperty("--comp-pop-opacity", "1");
+      s.style.setProperty("--comp-pop-opacity", "1");
     };
     this.viewPortChanged = () => {
       if (!this.open) return;
@@ -786,10 +786,12 @@ const w = class {
     var t;
     window.addEventListener("resize", this.viewPortOrientationChanged);
     visualViewport === null || visualViewport === void 0 ? void 0 : visualViewport.addEventListener("resize", this.viewPortChanged);
-    window.addEventListener("scroll", this.viewPortChanged, {
-      passive: true,
-      capture: true
-    });
+    if (d(this.hostElement) && !u()) {
+      window.addEventListener("scroll", this.viewPortChanged, {
+        passive: true,
+        capture: true
+      });
+    }
     (t = screen === null || screen === void 0 ? void 0 : screen.orientation) === null || t === void 0 ? void 0 : t.addEventListener("orientationchange", this.viewPortOrientationChanged);
     window.addEventListener("orientationchange", this.viewPortOrientationChanged);
   }
@@ -816,17 +818,20 @@ const w = class {
     let d;
     let u;
     if (a) {
-      const {outletOffset: t = 0, innerHeight: e = window.innerHeight} = ((i = window.Tecton) === null || i === void 0 ? void 0 : i.platformDimensions) || {};
-      const o = window.visualViewport.height - l;
-      const s = e - (t + l);
-      const n = o < s;
-      p = e;
-      // If the top of the module is below the top of the window we just use the controlTop
-      // Otherwise we need to add the outletOffset to the controlTop
-            d = (t > 0 ? h : h + t) - r;
-      u = n ? o - r : s - r;
+      const {outletOffset: t = 0, innerHeight: e = window.innerHeight, top: o = 0, bottom: s = 0} = ((i = window.Tecton) === null || i === void 0 ? void 0 : i.platformDimensions) || {};
+      const n = window.innerHeight - l;
+      // controlElement position visually on the page
+            const a = t > 0 ? h : h + t - o;
+      const c = t + l - o;
+      // visual space around the controlElement
+            const p = a;
+      const f = e - s - c;
+      // calculate space above and below controlElement
+            const b = n < f;
+      d = p - r;
+      u = b ? n - r : f - r;
     } else {
-      p = window.visualViewport.height;
+      p = window.innerHeight;
       d = h - r;
       u = p - l - r;
     }
@@ -888,18 +893,18 @@ const w = class {
     if (this.block) t.push("block");
     if (this.mode === "legacy") t.push("legacy");
     return i("div", {
-      key: "c9f03d67b77e8e5b62c0fc3ae0ed0d0da582c949",
+      key: "fedc22e67f0b6a687a9053973e53dc11f22a01f4",
       ref: t => this.containerElement = t,
       class: t.join(" "),
       "test-id": "outerContainer",
       tabIndex: -1,
-      popover: "auto"
+      popover: "manual"
     }, i("div", {
-      key: "e462cdf2172862ffde761ff7dea6d7f8eedd4484",
+      key: "563f4feede1e59a43968e9720d41d9ee1b41ab3c",
       ref: t => this.contentElement = t,
       class: "content"
     }, i("slot", {
-      key: "013c872ef67663360a27e357188fbc75a63b5ad8"
+      key: "cb74f4a2b315adcffbf2bbf6db9cae70c2ae8892"
     })));
   }
   get hostElement() {
@@ -913,7 +918,7 @@ const w = class {
   }
 };
 
-w.style = v;
+g.style = m;
 
-export { f as q2_option_list, w as q2_popover };
+export { v as q2_option_list, g as q2_popover };
 //# sourceMappingURL=q2-option-list_2.entry.js.map