q2-tecton-elements 1.71.4 → 1.73.0

package/dist/cjs/{charting-ClN1ldqv.js → charting-CdNTrVBe.js}

@@ -1,5 +1,7 @@
 'use strict';
 
+var index = require('./index-BqyWHpNu.js');
+
 /*! *****************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -34226,6 +34228,82 @@ function install(registers) {
   registers.registerPainter('canvas', CanvasPainter);
 }
 
+/** Localized feedback shared by chart keyboard controls. */
+function chartPointDescription(name, value, index$1, count) {
+    return index.loc('tecton.element.chart.pointDescription', [index.loc(name) || '', value, `${index$1 + 1}`, `${count}`]);
+}
+/** Coordinates keyboard exploration with ECharts emphasis without changing chart data. */
+function createChartKeyboardNavigation(options) {
+    let index = null;
+    let focused = false;
+    const clear = () => {
+        var _a;
+        if (index !== null) {
+            (_a = options.getChart()) === null || _a === void 0 ? void 0 : _a.dispatchAction({ type: 'downplay', seriesIndex: 0, dataIndex: index });
+        }
+        index = null;
+        options.onChange(null);
+    };
+    const select = (next) => {
+        var _a;
+        if (!options.getData()[next] || next === index)
+            return;
+        clear();
+        index = next;
+        (_a = options.getChart()) === null || _a === void 0 ? void 0 : _a.dispatchAction({ type: 'highlight', seriesIndex: 0, dataIndex: index });
+        options.onChange(index);
+    };
+    const order = () => { var _a, _b; return (_b = (_a = options.getOrder) === null || _a === void 0 ? void 0 : _a.call(options)) !== null && _b !== void 0 ? _b : options.getData().map((_, i) => i); };
+    return {
+        onFocus: () => {
+            focused = true;
+            select(order()[0]);
+        },
+        onBlur: () => {
+            focused = false;
+            clear();
+        },
+        onKeyDown: (event) => {
+            if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey)
+                return;
+            const indices = order();
+            if (!indices.length)
+                return;
+            const position = index === null ? -1 : indices.indexOf(index);
+            let next;
+            switch (event.key) {
+                case 'ArrowRight':
+                case 'ArrowDown':
+                    next = Math.min(position + 1, indices.length - 1);
+                    break;
+                case 'ArrowLeft':
+                case 'ArrowUp':
+                    next = Math.max(position - 1, 0);
+                    break;
+                case 'Home':
+                    next = 0;
+                    break;
+                case 'End':
+                    next = indices.length - 1;
+                    break;
+                case 'Escape':
+                    event.preventDefault();
+                    clear();
+                    return;
+                default:
+                    return;
+            }
+            event.preventDefault();
+            select(indices[next]);
+        },
+        refresh: () => {
+            clear();
+            if (focused)
+                select(order()[0]);
+        },
+    };
+}
+
 var ValidColorNames;
 (function (ValidColorNames) {
     ValidColorNames[ValidColorNames["aliceblue"] = 0] = "aliceblue";
@@ -34449,10 +34527,12 @@ exports.bind = bind$1;
 exports.box = box;
 exports.buildTooltipMarkup = buildTooltipMarkup;
 exports.calculateTextPosition = calculateTextPosition;
+exports.chartPointDescription = chartPointDescription;
 exports.clear = clear;
 exports.clone = clone$2;
 exports.clonePath = clonePath;
 exports.convertToColorString = convertToColorString;
+exports.createChartKeyboardNavigation = createChartKeyboardNavigation;
 exports.createFloat32Array = createFloat32Array;
 exports.createHashMap = createHashMap;
 exports.createIcon = createIcon;

package/dist/cjs/click-elsewhere_3.cjs.entry.js

@@ -3,7 +3,7 @@
 var index = require('./index-DUaTw_1N.js');
 var mirrorEmit = require('./mirror-emit-kjeNv83f.js');
 var component = require('./component-iASoq6gx.js');
-var index$1 = require('./index-SpDCZABA.js');
+var index$1 = require('./index-BqyWHpNu.js');
 
 const ClickElsewhere = class {
     constructor(hostRef) {
@@ -517,6 +517,26 @@ const Q2OptionList = class {
             option.role = optionRole;
         });
     }
+    findScrollableAncestor(node) {
+        var _a, _b;
+        let current = node;
+        while (current) {
+            if (current instanceof HTMLElement && current !== node) {
+                const overflowY = getComputedStyle(current).overflowY;
+                // Skip html/body so page-level scroll isn't treated as our container.
+                if ((overflowY === 'auto' || overflowY === 'scroll') &&
+                    current !== document.documentElement &&
+                    current !== document.body) {
+                    return current;
+                }
+            }
+            const slot = current.assignedSlot;
+            const parent = current.parentNode;
+            const shadowHost = current.host;
+            current = (_b = (_a = slot !== null && slot !== void 0 ? slot : parent) !== null && _a !== void 0 ? _a : shadowHost) !== null && _b !== void 0 ? _b : null;
+        }
+        return null;
+    }
     focusSelectedSibling(option) {
         const { allVisibleOptions, allOptions } = this;
         const hasNoSiblings = allVisibleOptions.length < 2;
@@ -598,9 +618,18 @@ const Q2OptionList = class {
         const activeOption = this.allOptions[this.activeIndex];
         if (!activeOption)
             return;
-        const { scrollX, scrollY } = window;
-        activeOption.scrollIntoView({ block: 'center' });
-        window.scrollTo(scrollX, scrollY);
+        // Do our own scroll math so `scrollIntoView` doesn't cascade to the parent window in an SDK iframe.
+        const container = this.findScrollableAncestor(activeOption);
+        if (container) {
+            if (container.scrollHeight > container.clientHeight) {
+                const optionRect = activeOption.getBoundingClientRect();
+                const containerRect = container.getBoundingClientRect();
+                const optionCenter = optionRect.top - containerRect.top + optionRect.height / 2;
+                container.scrollTop += optionCenter - containerRect.height / 2;
+            }
+            return;
+        }
+        activeOption.scrollIntoView({ block: 'nearest' });
     }
     searchOptions(key, shouldSelect) {
         this.searchString = key;
@@ -684,7 +713,7 @@ const Q2OptionList = class {
     // #endregion
     // #region Render Methods
     render() {
-        return (index.h(index.Host, { key: '14f2a8ab97077ed7b93d746b75f89b98f416a55d' }, index.h("div", { key: '1184c5d8d4cf8af63a60bef1282d6442b8539cf6', class: "content", ref: el => (this.contentElement = el), onFocusout: this.focusoutHandler }, index.h("div", { key: '5dcb6a82f1759e46d5e742e72075bf3dfa3c6d70', class: "options", "aria-label": index$1.loc('tecton.element.optionList.label', [this.label]), "aria-multiselectable": this.type === 'menu' ? undefined : this.multiple ? 'true' : undefined, role: this.type || 'listbox', onKeyDown: this.internalKeydownHandler, onClick: this.clickHandler }, index.h("slot", { key: '39372ab91b081ba124ff4c4dc04fc0c84be7a4ad' })))));
+        return (index.h(index.Host, { key: '19cadb5668db33a912951df4ec0e81a74b2b78ce' }, index.h("div", { key: '1d5a8f310ee97bc2189b839ee3d87e08bf0fa269', class: "content", ref: el => (this.contentElement = el), onFocusout: this.focusoutHandler }, index.h("div", { key: '24b1616962a9b544fb6215acc1e6edb4f12a5a03', class: "options", "aria-label": index$1.loc('tecton.element.optionList.label', [this.label]), "aria-multiselectable": this.type === 'menu' ? undefined : this.multiple ? 'true' : undefined, role: this.type || 'listbox', onKeyDown: this.internalKeydownHandler, onClick: this.clickHandler }, index.h("slot", { key: 'eeb0342b7c319f5f5af95daa54dcaa732c3159d9' })))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {
@@ -698,7 +727,7 @@ const Q2OptionList = class {
 };
 Q2OptionList.style = q2OptionListCss();
 
-const q2PopoverCss = () => `*{box-sizing:border-box}*:active{outline:none}*:focus-visible{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}@container style(--t-prefers-motion: "reduced"){*,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important;animation-delay:0ms !important;transition-delay:0ms !important}}@container (not style(--t-prefers-motion: "normal")) and (not style(--t-prefers-motion: "reduced")){@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important;animation-delay:0ms !important;transition-delay:0ms !important}}}.legacy.container{display:none}.legacy.show{display:block;z-index:var(--tct-popover-z-index, 50)}@keyframes popoverOpen{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}@keyframes popoverClose{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.95)}}:popover-open,.show{position:var(--comp-pop-position, absolute);margin:0;padding:var(--tct-popover-padding, 0);overflow:auto;background:var(--tct-popover-background, var(--app-white, #ffffff));backdrop-filter:var(--tct-popover-backdrop-filter, none);color:var(--tct-popover-font-color, inherit);min-width:var(--tct-popover-min-width, 135px);width:var(--tct-popover-width, auto);margin-block:var(--tct-popover-margin-block, 0);box-shadow:var(--tct-popover-box-shadow, var(--app-shadow-3, 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.animating-open,.show.animating-open{animation-name:popoverOpen;animation-duration:var(--tct-popover-open-animation-duration, var(--t-tween-time-in-1, 150ms));animation-timing-function:var(--tct-popover-open-animation-timing-function, ease-out);animation-fill-mode:var(--tct-popover-open-animation-fill-mode, forwards)}:popover-open.animating-close,.show.animating-close{animation-name:popoverClose;animation-duration:var(--tct-popover-close-animation-duration, var(--t-tween-time-out-1, 100ms));animation-timing-function:var(--tct-popover-close-animation-timing-function, ease-in);animation-fill-mode:var(--tct-popover-close-animation-fill-mode, forwards)}: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.down.left:not(.mobile),.show.down.left:not(.mobile){transform-origin:top left}:popover-open.down.right:not(.mobile),.show.down.right:not(.mobile){transform-origin:top right}:popover-open.up.left:not(.mobile),.show.up.left:not(.mobile){transform-origin:bottom left}:popover-open.up.right:not(.mobile),.show.up.right:not(.mobile){transform-origin:bottom right}:popover-open.mobile.down,.show.mobile.down{transform-origin:center top}:popover-open.mobile.up,.show.mobile.up{transform-origin:center 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 q2PopoverCss = () => `*{box-sizing:border-box}*:active{outline:none}*:focus-visible{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}@container style(--t-prefers-motion: "reduced"){*,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important;animation-delay:0ms !important;transition-delay:0ms !important}}@container (not style(--t-prefers-motion: "normal")) and (not style(--t-prefers-motion: "reduced")){@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important;animation-delay:0ms !important;transition-delay:0ms !important}}}.legacy.container{display:none}.legacy.show{display:block;z-index:var(--tct-popover-z-index, 50)}@keyframes popoverOpen{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}@keyframes popoverClose{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0.95)}}:popover-open,.show{position:var(--comp-pop-position, absolute);margin:0;padding:var(--tct-popover-padding, 0);overflow:auto;overscroll-behavior:contain;background:var(--tct-popover-background, var(--app-white, #ffffff));backdrop-filter:var(--tct-popover-backdrop-filter, none);color:var(--tct-popover-font-color, inherit);min-width:var(--tct-popover-min-width, 135px);width:var(--tct-popover-width, auto);margin-block:var(--tct-popover-margin-block, 0);box-shadow:var(--tct-popover-box-shadow, var(--app-shadow-3, 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.animating-open,.show.animating-open{animation-name:popoverOpen;animation-duration:var(--tct-popover-open-animation-duration, var(--t-tween-time-in-1, 150ms));animation-timing-function:var(--tct-popover-open-animation-timing-function, ease-out);animation-fill-mode:var(--tct-popover-open-animation-fill-mode, forwards)}:popover-open.animating-close,.show.animating-close{animation-name:popoverClose;animation-duration:var(--tct-popover-close-animation-duration, var(--t-tween-time-out-1, 100ms));animation-timing-function:var(--tct-popover-close-animation-timing-function, ease-in);animation-fill-mode:var(--tct-popover-close-animation-fill-mode, forwards)}: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:var(--comp-pop-top);bottom:unset;translate:0 calc(-100% - var(--app-scale-2x, 10px))}:popover-open.down.left:not(.mobile),.show.down.left:not(.mobile){transform-origin:top left}:popover-open.down.right:not(.mobile),.show.down.right:not(.mobile){transform-origin:top right}:popover-open.up.left:not(.mobile),.show.up.left:not(.mobile){transform-origin:bottom left}:popover-open.up.right:not(.mobile),.show.up.right:not(.mobile){transform-origin:bottom right}:popover-open.mobile.down,.show.mobile.down{transform-origin:center top}:popover-open.mobile.up,.show.mobile.up{transform-origin:center 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 Q2Popover = class {
     constructor(hostRef) {
@@ -711,6 +740,7 @@ const Q2Popover = class {
         this.displayBuffer = 10;
         this.orientationChanged = false;
         this.pendingAnimationResolve = null;
+        this.platformScrollUnsubscribe = null;
         // #endregion
         // #region State Properties
         this.animationState = 'idle';
@@ -722,11 +752,30 @@ const Q2Popover = class {
         /** Aligns the popover to the left or right side of the control element. */
         this.align = 'left';
         this.mode = null;
+        this.handleInsideScroll = (event) => {
+            const { containerElement } = this;
+            if (!containerElement)
+                return;
+            if (containerElement.scrollHeight > containerElement.clientHeight)
+                return;
+            event.preventDefault();
+        };
         this.handleMinHeight = () => {
             if (this.minHeight) {
                 index$1.handleDeprecationWarning(this, 'minHeight', 'prop');
             }
         };
+        this.handleOutsideScroll = (event) => {
+            if (!this.open)
+                return;
+            if (event.composedPath().includes(this.hostElement))
+                return;
+            this.open = false;
+        };
+        this.handlePlatformScroll = () => {
+            if (this.open)
+                this.open = false;
+        };
         this.handlePopoverToggleEvent = (event) => {
             mirrorEmit.mirrorEmit(this, ['popoverStateChanged', 'tctPopoverStateChanged'], { open: event.newState === 'open' });
         };
@@ -787,10 +836,10 @@ const Q2Popover = class {
             const isScrollableIframe = isModule && index$1.isInScrollableContainer(this.hostElement);
             if (currentDirection === 'up') {
                 if (isModule && !isScrollableIframe) {
-                    containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop}px`);
+                    containerElement.style.setProperty('--comp-pop-top', `${controlTop}px`);
                 }
                 else {
-                    containerElement.style.setProperty('--comp-pop-bottom', `${window.innerHeight - controlTop - scrollY}px`);
+                    containerElement.style.setProperty('--comp-pop-top', `${controlTop + scrollY}px`);
                 }
             }
             if (currentDirection === 'down') {
@@ -841,8 +890,10 @@ const Q2Popover = class {
         this.handleMinHeight();
         if (this.supportsPopoverAPI)
             (_a = this.containerElement) === null || _a === void 0 ? void 0 : _a.addEventListener('toggle', this.handlePopoverToggleEvent);
-        if (this.open)
+        if (this.open) {
+            this.addViewportListeners();
             this.determinePopDirection();
+        }
     }
     // #endregion
     // #region Listeners
@@ -935,14 +986,22 @@ const Q2Popover = class {
         return isNaN(maxHeight) ? undefined : maxHeight;
     }
     addViewportListeners() {
-        var _a;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         window.addEventListener('resize', this.viewPortOrientationChanged);
-        visualViewport === null || visualViewport === void 0 ? void 0 : visualViewport.addEventListener('resize', this.viewPortChanged);
+        (_b = (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.addEventListener) === null || _b === void 0 ? void 0 : _b.call(_a, 'resize', this.viewPortChanged);
         if (index$1.isInScrollableContainer(this.hostElement) && !index$1.isMobile()) {
             window.addEventListener('scroll', this.viewPortChanged, { passive: true, capture: true });
         }
-        (_a = screen === null || screen === void 0 ? void 0 : screen.orientation) === null || _a === void 0 ? void 0 : _a.addEventListener('orientationchange', this.viewPortOrientationChanged);
+        (_e = (_d = (_c = window.screen) === null || _c === void 0 ? void 0 : _c.orientation) === null || _d === void 0 ? void 0 : _d.addEventListener) === null || _e === void 0 ? void 0 : _e.call(_d, 'orientationchange', this.viewPortOrientationChanged);
         window.addEventListener('orientationchange', this.viewPortOrientationChanged);
+        if (!index$1.isMobile()) {
+            window.addEventListener('scroll', this.handleOutsideScroll, { passive: true, capture: true });
+        }
+        (_f = this.containerElement) === null || _f === void 0 ? void 0 : _f.addEventListener('wheel', this.handleInsideScroll, { passive: false });
+        (_g = this.containerElement) === null || _g === void 0 ? void 0 : _g.addEventListener('touchmove', this.handleInsideScroll, { passive: false });
+        (_h = this.platformScrollUnsubscribe) === null || _h === void 0 ? void 0 : _h.call(this);
+        this.platformScrollUnsubscribe =
+            (_l = (_k = (_j = window.TectonElements) === null || _j === void 0 ? void 0 : _j.platformScrollChanged) === null || _k === void 0 ? void 0 : _k.call(_j, this.handlePlatformScroll)) !== null && _l !== void 0 ? _l : null;
     }
     clearCSSProperties() {
         if (!this.containerElement)
@@ -957,7 +1016,7 @@ const Q2Popover = class {
         this.containerElement.style.removeProperty('--comp-pop-position');
     }
     async determinePopDirection() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         const { containerElement, controlElement, providedDirection, displayBuffer } = this;
         if (containerElement)
             containerElement.style.maxHeight = null;
@@ -990,9 +1049,10 @@ const Q2Popover = class {
                 : viewableSpaceBelow - displayBuffer;
         }
         else {
-            windowHeight = window.innerHeight;
-            maxSpaceAbove = controlTop - displayBuffer;
-            maxSpaceBelow = windowHeight - controlBottom - displayBuffer;
+            const { height = window.innerHeight, offsetTop = 0 } = (_d = window.visualViewport) !== null && _d !== void 0 ? _d : {};
+            windowHeight = height;
+            maxSpaceAbove = controlTop - offsetTop - displayBuffer;
+            maxSpaceBelow = offsetTop + windowHeight - controlBottom - displayBuffer;
         }
         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)
@@ -1020,12 +1080,17 @@ const Q2Popover = class {
         }
     }
     removeViewportListeners() {
-        var _a;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         window.removeEventListener('resize', this.viewPortOrientationChanged);
-        visualViewport === null || visualViewport === void 0 ? void 0 : visualViewport.removeEventListener('resize', this.viewPortChanged);
+        (_b = (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.removeEventListener) === null || _b === void 0 ? void 0 : _b.call(_a, 'resize', this.viewPortChanged);
         window.removeEventListener('scroll', this.viewPortChanged, { capture: true });
-        (_a = screen === null || screen === void 0 ? void 0 : screen.orientation) === null || _a === void 0 ? void 0 : _a.removeEventListener('orientationchange', this.viewPortOrientationChanged);
+        (_e = (_d = (_c = window.screen) === null || _c === void 0 ? void 0 : _c.orientation) === null || _d === void 0 ? void 0 : _d.removeEventListener) === null || _e === void 0 ? void 0 : _e.call(_d, 'orientationchange', this.viewPortOrientationChanged);
         window.removeEventListener('orientationchange', this.viewPortOrientationChanged);
+        window.removeEventListener('scroll', this.handleOutsideScroll, { capture: true });
+        (_f = this.containerElement) === null || _f === void 0 ? void 0 : _f.removeEventListener('wheel', this.handleInsideScroll);
+        (_g = this.containerElement) === null || _g === void 0 ? void 0 : _g.removeEventListener('touchmove', this.handleInsideScroll);
+        (_h = this.platformScrollUnsubscribe) === null || _h === void 0 ? void 0 : _h.call(this);
+        this.platformScrollUnsubscribe = null;
     }
     setDirectionAndShow(direction) {
         var _a;
@@ -1060,7 +1125,7 @@ const Q2Popover = class {
             containerClasses.push('animating-open');
         if (this.animationState === 'closing')
             containerClasses.push('animating-close');
-        return (index.h("div", { key: '4fe0c06793144eb83fe53cfc568af81226f78345', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, index.h("div", { key: 'ed5d7c9f5efba8b129d580e68ab6692849332cf4', ref: el => (this.contentElement = el), class: "content" }, index.h("slot", { key: '4c5d5b9682014b2e94b153ca33a3e0c4dd58d6bb' }))));
+        return (index.h("div", { key: 'f608766723c6ae6737181318b5baf8b52ed7fc0f', ref: el => (this.containerElement = el), class: containerClasses.join(' '), "test-id": "outerContainer", tabIndex: -1, popover: "manual" }, index.h("div", { key: '477f1a209cf4abc984a82324d0c6fc07ede82160', ref: el => (this.contentElement = el), class: "content" }, index.h("slot", { key: '5b48ff13907b952a2cdcffc1b6e271e4982c78ad' }))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/{dataSample-BYR-wrOn.js → dataSample-B4blhlH4.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var charting = require('./charting-ClN1ldqv.js');
+var charting = require('./charting-CdNTrVBe.js');
 
 /**
  * @class

package/dist/cjs/date-picker-helpers-UYvPn98R.js

@@ -0,0 +1,257 @@
+'use strict';
+
+var index = require('./index-CgG3VNXc.js');
+var index$1 = require('./index-BqyWHpNu.js');
+
+const defaultDisplayFormat = 'MM/DD/YYYY';
+const supportedDisplayFormats = [
+    defaultDisplayFormat,
+    'DD/MM/YYYY',
+    'MM-DD-YYYY',
+    'DD-MM-YYYY',
+    'YYYY-MM-DD',
+];
+const defaultDatePickerStringKeys = {
+    'Choose a date': 'tecton.element.datePicker.calendarLabel',
+    'Dates are shown in your local time zone.': 'tecton.element.datePicker.disclaimer.localTimeZone',
+};
+const isoDatePattern = /^\d{4}-\d{2}-\d{2}$/;
+const isoLikeDatePattern = /^(\d{4})-(\d{1,2})-(\d{1,2})(?:T.*)?$/;
+const slashDatePattern = /^(\d{1,2})\/(\d{1,2})\/(\d{2}|\d{4})$/;
+/** Determines a year for a month and day when typeable input omits the year. */
+function buildInputDate(input, assume) {
+    const [month, day, year] = input.split('/');
+    if (!month)
+        return;
+    if (!day)
+        return new Date(new Date().getFullYear(), Number(month) - 1, 1);
+    if (Number(day) <= 0)
+        return;
+    const selectedYear = (year === null || year === void 0 ? void 0 : year.length) === 4 ? Number(year) : Number(assumeYear(month, day, assume));
+    const date = new Date(selectedYear, Number(month) - 1, Number(day));
+    return index.dateFnsExports.isValid(date) ? date : undefined;
+}
+/** Formats a valid date as an ISO calendar date. */
+function formatDateISO(value) {
+    if (!index.dateFnsExports.isValid(value))
+        return;
+    return index.dateFnsExports.formatISO(value, { representation: 'date' });
+}
+/** Formats a date for an accessible day label. */
+function formatDateFull(value) {
+    if (!index.dateFnsExports.isValid(value))
+        return;
+    return new Intl.DateTimeFormat('en-US', {
+        month: 'long',
+        day: 'numeric',
+        year: 'numeric',
+        weekday: 'long',
+        timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+    }).format(value);
+}
+/** Returns localized abbreviated day names beginning with Sunday. */
+function getDays() {
+    return [
+        index$1.loc('tecton.element.calendar.days.short.Sunday'),
+        index$1.loc('tecton.element.calendar.days.short.Monday'),
+        index$1.loc('tecton.element.calendar.days.short.Tuesday'),
+        index$1.loc('tecton.element.calendar.days.short.Wednesday'),
+        index$1.loc('tecton.element.calendar.days.short.Thursday'),
+        index$1.loc('tecton.element.calendar.days.short.Friday'),
+        index$1.loc('tecton.element.calendar.days.short.Saturday'),
+    ];
+}
+/** Returns localized full day names beginning with Sunday. */
+function getDaysOfWeek() {
+    return [
+        index$1.loc('tecton.element.calendar.days.Sunday'),
+        index$1.loc('tecton.element.calendar.days.Monday'),
+        index$1.loc('tecton.element.calendar.days.Tuesday'),
+        index$1.loc('tecton.element.calendar.days.Wednesday'),
+        index$1.loc('tecton.element.calendar.days.Thursday'),
+        index$1.loc('tecton.element.calendar.days.Friday'),
+        index$1.loc('tecton.element.calendar.days.Saturday'),
+    ];
+}
+/** Parses the date picker's public ISO-only value contract. */
+function parseDatePickerValue(value) {
+    if (!value || !isoDatePattern.test(value))
+        return;
+    const [year, month, day] = value.split('-').map(Number);
+    return dateFromParts(year, month, day);
+}
+/** Normalizes a legacy string or Moment-like value for the date picker's ISO-only calendar. */
+function normalizeDatePickerValue(value) {
+    if (!value)
+        return;
+    let date;
+    if (value instanceof Date) {
+        date = value;
+    }
+    else if (isMomentLike(value)) {
+        try {
+            date = value.toDate();
+        }
+        catch (_a) {
+            return;
+        }
+    }
+    else {
+        const input = value.trim();
+        if (!input)
+            return;
+        date = parseDatePickerValue(input);
+        if (!date) {
+            const isoLikeParts = input.match(isoLikeDatePattern);
+            const slashParts = input.match(slashDatePattern);
+            if (isoLikeParts) {
+                date = dateFromParts(Number(isoLikeParts[1]), Number(isoLikeParts[2]), Number(isoLikeParts[3]));
+            }
+            else if (slashParts) {
+                const parsedYear = Number(slashParts[3]);
+                const year = parsedYear < 100 ? (parsedYear >= 69 ? 1900 : 2000) + parsedYear : parsedYear;
+                date = dateFromParts(year, Number(slashParts[1]), Number(slashParts[2]));
+            }
+            else {
+                const parsedDate = new Date(input);
+                date = index.dateFnsExports.isValid(parsedDate)
+                    ? dateFromParts(parsedDate.getFullYear(), parsedDate.getMonth() + 1, parsedDate.getDate())
+                    : undefined;
+            }
+        }
+    }
+    return formatDateISO(date);
+}
+/** Returns the month and year used to initialize the date picker grid. */
+function setupMonthYear(value = new Date()) {
+    return {
+        monthIndex: value.getMonth(),
+        selectedYear: value.getFullYear(),
+    };
+}
+/** Returns the enabled day indexes represented by a calendar checksum. */
+function getValidDaysOfWeek(checksum = 127) {
+    const validDays = [];
+    for (let day = 0; day < 7; day++) {
+        if (checksum & (1 << day))
+            validDays.push(day);
+    }
+    return checksum > 0 ? validDays : [];
+}
+/** Determines whether a date satisfies the configured bounds and cutoff. */
+function baseValidation(dateValidators, now, newDate) {
+    const isNewDateBeforeStartDate = index.dateFnsExports.isAfter(dateValidators === null || dateValidators === void 0 ? void 0 : dateValidators.startDate, newDate);
+    const isNewDateAfterEndDate = index.dateFnsExports.isBefore(dateValidators === null || dateValidators === void 0 ? void 0 : dateValidators.endDate, newDate);
+    const isNowAfterCutoffTime = index.dateFnsExports.isSameDay(now, newDate) && index.dateFnsExports.isAfter(now, dateValidators === null || dateValidators === void 0 ? void 0 : dateValidators.cutOffTime);
+    return !(isNewDateBeforeStartDate || isNowAfterCutoffTime || isNewDateAfterEndDate);
+}
+/** Determines whether a date's weekday is enabled. */
+function validateAgainstChecksum(validDaysOfWeek, date) {
+    return validDaysOfWeek.includes(date.getDay());
+}
+/** Determines whether a date is absent from a blacklist. */
+function validateAgainstBlacklist(invalidDates, date) {
+    return !validateAgainstWhitelist(invalidDates, date);
+}
+/** Determines whether a date is present in a whitelist. */
+function validateAgainstWhitelist(validDates, date) {
+    return validDates.some(validDate => index.dateFnsExports.isSameDay(validDate, date));
+}
+function assumeYear(month, day, assume) {
+    const monthDay = `${month.padStart(2, '0')}/${day.padStart(2, '0')}`;
+    const now = new Date();
+    const currentMonthDay = `${now.getMonth() + 1}`.padStart(2, '0') + `/${now.getDate()}`.padStart(2, '0');
+    let year = now.getFullYear();
+    if (assume === 'future' && currentMonthDay > monthDay)
+        year++;
+    if (assume === 'past' && currentMonthDay < monthDay)
+        year--;
+    return `${year}`;
+}
+function parseDatePickerValues(values) {
+    return (values || []).map(parseDatePickerValue).filter((date) => !!date);
+}
+function dateFromParts(year, month, day) {
+    const date = new Date(0);
+    date.setFullYear(year, month - 1, day);
+    date.setHours(0, 0, 0, 0);
+    if (date.getFullYear() !== year || date.getMonth() !== month - 1 || date.getDate() !== day)
+        return;
+    return date;
+}
+function isMomentLike(value) {
+    return typeof value !== 'string' && typeof (value === null || value === void 0 ? void 0 : value.toDate) === 'function';
+}
+/** Formats a date using one of the date picker's supported numeric display formats. */
+function formatDisplayDate(date, displayFormat) {
+    const separator = displayFormat.includes('-') ? '-' : '/';
+    const month = `${date.getMonth() + 1}`.padStart(2, '0');
+    const day = `${date.getDate()}`.padStart(2, '0');
+    const year = `${date.getFullYear()}`;
+    const dateParts = displayFormat.startsWith('YYYY')
+        ? [year, month, day]
+        : displayFormat.startsWith('DD')
+            ? [day, month, year]
+            : [month, day, year];
+    return dateParts.join(separator);
+}
+/** Formats a date using the legacy Moment-style tokens accepted by q2-calendar. */
+function formatLegacyDisplayDate(date, displayFormat) {
+    const dateFnsFormat = displayFormat
+        .replace(/[d]/g, 'E')
+        .replace(/[D]/g, 'd')
+        .replace(/[Y]/g, 'y')
+        .replace(/[l]/g, 'P')
+        .replace(/[W]/g, 'I');
+    return index.dateFnsExports.format(date, dateFnsFormat);
+}
+/** Determines whether a date satisfies every configured selection constraint. */
+function isDateSelectable(date, constraints) {
+    const cutoffTime = new Date(constraints.cutoffTime || '');
+    const withinBounds = baseValidation({
+        startDate: parseDatePickerValue(constraints.startDate),
+        endDate: parseDatePickerValue(constraints.endDate),
+        cutOffTime: index.dateFnsExports.isValid(cutoffTime) ? cutoffTime : undefined,
+    }, new Date(), date);
+    const validDates = parseDatePickerValues(constraints.validDates);
+    const matchesAllowedDates = (validDates === null || validDates === void 0 ? void 0 : validDates.length)
+        ? validateAgainstWhitelist(validDates, date)
+        : validateAgainstChecksum(getValidDaysOfWeek(constraints.daysOfWeekChecksum), date);
+    return (withinBounds &&
+        matchesAllowedDates &&
+        validateAgainstBlacklist(parseDatePickerValues(constraints.invalidDates), date));
+}
+/** Determines whether every date in an inclusive range is selectable. */
+function isRangeSelectable(start, end, constraints) {
+    for (let date = start; date.getTime() <= end.getTime(); date = index.dateFnsExports.addDays(date, 1)) {
+        if (!isDateSelectable(date, constraints))
+            return false;
+    }
+    return true;
+}
+/** Resolves a date-picker localization key or mapped default string. */
+function localizeDatePickerString(value, substitutions = {}) {
+    if (!value)
+        return '';
+    return index$1.loc(defaultDatePickerStringKeys[value] || value, substitutions);
+}
+/** Returns a supported display format, falling back to the date-picker default. */
+function normalizeDisplayFormat(displayFormat) {
+    const normalizedFormat = displayFormat === null || displayFormat === void 0 ? void 0 : displayFormat.toUpperCase();
+    return supportedDisplayFormats.includes(normalizedFormat) ? normalizedFormat : defaultDisplayFormat;
+}
+
+exports.buildInputDate = buildInputDate;
+exports.formatDateFull = formatDateFull;
+exports.formatDateISO = formatDateISO;
+exports.formatDisplayDate = formatDisplayDate;
+exports.formatLegacyDisplayDate = formatLegacyDisplayDate;
+exports.getDays = getDays;
+exports.getDaysOfWeek = getDaysOfWeek;
+exports.isDateSelectable = isDateSelectable;
+exports.isRangeSelectable = isRangeSelectable;
+exports.localizeDatePickerString = localizeDatePickerString;
+exports.normalizeDatePickerValue = normalizeDatePickerValue;
+exports.normalizeDisplayFormat = normalizeDisplayFormat;
+exports.parseDatePickerValue = parseDatePickerValue;
+exports.setupMonthYear = setupMonthYear;

package/dist/cjs/{index-SpDCZABA.js → index-BqyWHpNu.js}

@@ -202,7 +202,7 @@ function renderLabel(target) {
     return (index.h("label", { htmlFor: target.inputId, class: labelClasses.join(' ') }, index.h("slot", { name: "label" }, label ? loc(label) : undefined, helpText)));
 }
 function hasSlotContent(target, slotName) {
-    return target.querySelector(`[slot="${slotName}"]`) !== null;
+    return Array.from(target.children).some(child => child.getAttribute('slot') === slotName);
 }
 function handleAriaLabel(target) {
     const { ariaLabel } = target;
@@ -291,7 +291,7 @@ const resizeIframe = () => {
 // Handling color attribute (deprecated)
 const handleColor = (target) => {
     if (!target.intent && ['primary', 'secondary'].includes(target.color)) {
-        target.intent = `workflow-${target.color}`;
+        target.intent = target.color;
         target.color = undefined;
     }
 };