@watermarkinsights/ripple 5.31.0-alpha.0 → 5.31.0-alpha.1

package/dist/cjs/{app-globals-3f8985a8.js → app-globals-df7ca137.js}

@@ -2,7 +2,7 @@
 
 require('./index-bb947bd5.js');
 
-const version = "5.31.0-alpha.0";
+const version = "5.31.0-alpha.1";
 
 // PRINT RIPPLE VERSION IN CONSOLE
 // test envs return 0 for plugin.length

package/dist/cjs/app-globals-f310dc82.js

@@ -0,0 +1,103 @@
+'use strict';
+
+require('./index-bb947bd5.js');
+
+const version = "5.30.0";
+
+// PRINT RIPPLE VERSION IN CONSOLE
+// test envs return 0 for plugin.length
+// do not print version number there as it causes issues
+if (window.navigator.plugins.length > 0) {
+    console.log("%cRipple component library %c%s", "color: #575195; font-weight: bold", "font-weight: bold", version);
+}
+// Dispatching events to track whether user is navigating with keyboard or mouse
+// no longer necessary for keyboard focus indicators (thanks to :focus-visible)
+// but still used in several components for other things (search for isTabbing)
+function wmComponentKeys(ev) {
+    if (ev.key == "Tab") {
+        var event = new Event("wmUserIsTabbing");
+        window.dispatchEvent(event);
+        document.querySelector("body").classList.add("wmcl-user-is-tabbing");
+    }
+    if (ev.key == "ArrowLeft" || ev.key == "ArrowUp" || ev.key == "ArrowRight" || ev.key == "ArrowDown") {
+        var event = new Event("wmUserIsKeying");
+        window.dispatchEvent(event);
+        document.querySelector("body").classList.add("wmcl-user-is-keying");
+    }
+}
+function wmComponentMouseDownOnce() {
+    var event = new Event("wmUserIsNotTabbing");
+    window.dispatchEvent(event);
+    document.querySelector("body").classList.remove("wmcl-user-is-tabbing");
+    document.querySelector("body").classList.remove("wmcl-user-is-keying");
+}
+window.addEventListener("keydown", wmComponentKeys);
+window.addEventListener("mousedown", wmComponentMouseDownOnce);
+// TOOLTIP
+// Add a tooltip element
+// This allows tooltips to be always at the highest stacking context (always on top)
+// Element is added withing a container to avoid performance impact
+const tooltipContainer = document.createElement("div");
+tooltipContainer.id = "wm-tooltip-container";
+const tooltipEl = document.createElement("div");
+tooltipEl.id = "wm-tooltip";
+tooltipEl.classList.add("wm-tooltip");
+tooltipEl.setAttribute("popover", "manual");
+tooltipEl.setAttribute("aria-hidden", "true");
+const tooltipStyles = document.createElement("style");
+tooltipStyles.textContent = `
+.wm-tooltip {
+  position: fixed;
+  overflow: hidden;
+  pointer-events: none;
+  line-height: normal;
+  font-family: inherit;
+  font-size: 0.875rem;
+  text-transform: none;
+  font-weight: normal;
+  background: var(--wmcolor-tooltip-background);
+  color: var(--wmcolor-tooltip-text);
+  z-index: 999999;
+  max-width: var(--wmTooltipMaxWidth, 13.75rem);
+  margin-right: 1.5rem;
+  padding: 0.375rem;
+  transition-property: opacity;
+  transition-delay: 0s;
+  opacity: 0;
+  inset: unset;
+  top: 0;
+  left: 0;
+  transform: translateZ(0);
+  will-change: transform;
+  transform: translate(var(--wmTooltipLeft), var(--wmTooltipTop));
+  border: none;
+}
+
+.wm-tooltip:popover-open {
+  opacity: 0;
+}
+
+.wm-tooltip.show {
+  transition-delay: 500ms;
+  opacity: 1;
+}
+`;
+const body = document.querySelector("body");
+if (body) {
+    document.head.appendChild(tooltipStyles);
+    tooltipContainer.appendChild(tooltipEl);
+    body.appendChild(tooltipContainer);
+}
+else {
+    document.addEventListener("DOMContentLoaded", () => {
+        const body = document.querySelector("body");
+        document.head.appendChild(tooltipStyles);
+        tooltipContainer.appendChild(tooltipEl);
+        body.appendChild(tooltipContainer);
+    });
+}
+const globalFn = () => { };
+
+const globalScripts = globalFn;
+
+exports.globalScripts = globalScripts;

package/dist/cjs/loader.cjs.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-bb947bd5.js');
-const appGlobals = require('./app-globals-3f8985a8.js');
+const appGlobals = require('./app-globals-df7ca137.js');
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;

package/dist/cjs/priv-calendar.cjs.entry.js

@@ -564,11 +564,11 @@ const PrivCalendar = class {
         return (index.h("div", { class: "year-view" }, index.h("div", { "aria-labelledby": "popup-title-year", role: "grid", class: "months" }, index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(0, 3).map((month, index) => this.renderMonth(month, index))), index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(3, 6).map((month, index) => this.renderMonth(month, index + 3))), index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(6, 9).map((month, index) => this.renderMonth(month, index + 6))), index.h("div", { role: "row", class: "month-row" }, functions.calendar_months.slice(9).map((month, index) => this.renderMonth(month, index + 9))))));
     }
     render() {
-        return (index.h(index.Host, { key: 'f0972636a9943cb1b3c6b39f6ba9022359570d88', onMouseOut: (ev) => {
+        return (index.h(index.Host, { key: '65ddc7ee3bf4a3b0c775911c9309b827ee6050a7', onMouseOut: (ev) => {
                 // @ts-ignore
                 if (!this.el.parentElement.contains(ev.toElement))
                     this.outOfCal.emit();
-            }, role: "application", "aria-describedby": `application-${this.uid}` }, index.h("div", { key: 'c4e1b4f973c7b6d3b70174f7086e337d9220716d', class: `popup ${this.view}-view` }, this.renderHeader(), this.view === "month" ? this.renderMonthView() : this.renderYearView()), index.h("div", { key: 'd6738a953df9cd2f713f25ed53b0103b080610bf', id: `application-${this.uid}`, class: "sr-only" }, this.calName, this.calInstructions), index.h("div", { key: 'cc9105d574a254bf2ef986b576bb6028b9e960cc', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "assertive", "aria-atomic": "true" }, this.announcement)));
+            }, role: "application", "aria-describedby": `application-${this.uid}` }, index.h("div", { key: 'fbf1f183f6aac61a8c31050a064742524a442f02', class: `popup ${this.view}-view` }, this.renderHeader(), this.view === "month" ? this.renderMonthView() : this.renderYearView()), index.h("div", { key: '2a4b817c5f2be65ef6667c52300740450590bb84', id: `application-${this.uid}`, class: "sr-only" }, this.calName, this.calInstructions), index.h("div", { key: '6737c54bae18f38eb7c1ded31783961d4f04f7ae', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "assertive", "aria-atomic": "true" }, this.announcement)));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/priv-chart-popover-old.cjs.entry.js

@@ -129,11 +129,11 @@ const ChartPopoverOld = class {
         const titleAffordance = this.sliceDetails &&
             this.sliceDetails.title &&
             (this.sliceDetails.title[0] === "-" ? "negative" : this.sliceDetails.title[0] === "+" ? "positive" : "");
-        return (index.h(index.Host, { key: 'c5c7427fd813574e1634fd1635f864eb641236ec', class: `${((_a = this.sliceDetails) === null || _a === void 0 ? void 0 : _a.buttonText) && this.open ? "has-interactive" : ""}` }, !!this.open && this.sliceDetails ? (index.h("div", { "aria-hidden": "true", class: "popover" }, index.h("h1", { class: `title ${titleAffordance}` }, this.sliceDetails.title), index.h("p", { class: "text" }, this.sliceDetails.text), this.sliceDetails.buttonText ? (
+        return (index.h(index.Host, { key: 'ffd6a3d344b02332b04e67a101b0c0aebc4bf829', class: `${((_a = this.sliceDetails) === null || _a === void 0 ? void 0 : _a.buttonText) && this.open ? "has-interactive" : ""}` }, !!this.open && this.sliceDetails ? (index.h("div", { "aria-hidden": "true", class: "popover" }, index.h("h1", { class: `title ${titleAffordance}` }, this.sliceDetails.title), index.h("p", { class: "text" }, this.sliceDetails.text), this.sliceDetails.buttonText ? (
         // @ts-ignore
         index.h("button", { tabindex: "-1",
             // @ts-ignore
-            focusable: "false", class: "popover-button", onClick: () => this.handleButtonClick() }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.sliceDetails.buttonText))) : (""))) : (""), index.h("div", { key: '194d04ee3cfcba53718a385abbce61b15836845c', ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
+            focusable: "false", class: "popover-button", onClick: () => this.handleButtonClick() }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.sliceDetails.buttonText))) : (""))) : (""), index.h("div", { key: '41246afef9c521d8db48d7d272835c6829d5a148', ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/priv-chart-popover_2.cjs.entry.js

@@ -118,9 +118,9 @@ const ChartPopover = class {
     }
     render() {
         const titleAffordance = this.header && (this.header[0] === "-" ? "negative" : this.header[0] === "+" ? "positive" : "");
-        return (index.h(index.Host, { key: 'ccf8d6d35d85b8c902d1350aa74d75b479c43b3c', class: this.isKeying ? "user-is-keying" : "" }, index.h("div", { key: '1340158d01632a92f6ef8c0a5637bc28e5ce7ea5', ref: (el) => (this.popoverEl = el), popover: "manual", "aria-hidden": "true", class: "popover" }, index.h("h1", { key: 'afb65849a7b7ff30b78f8e78f74bc57824f6acd5', class: `title ${titleAffordance}` }, this.header), index.h("p", { key: '2f523aae12190a62184136fec74b50fed7436f4a', class: "text" }, this.text), this.buttonText ? (index.h("button", { tabindex: "-1",
+        return (index.h(index.Host, { key: 'a863ab9a9d4b922fe67492a7139fa64d527f178c', class: this.isKeying ? "user-is-keying" : "" }, index.h("div", { key: '0679e51c1459d5456c0ac037c966a382c33bfd85', ref: (el) => (this.popoverEl = el), popover: "manual", "aria-hidden": "true", class: "popover" }, index.h("h1", { key: '69fb1bd19cb22af5a05dcd7ace7d846947d5f18b', class: `title ${titleAffordance}` }, this.header), index.h("p", { key: '235905a6ad8b3cf5c7114aeb75d326ff442b7dc2', class: "text" }, this.text), this.buttonText ? (index.h("button", { tabindex: "-1",
             // @ts-ignore
-            focusable: "false", class: "popover-button", onClick: () => this.handleButtonClick() }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.buttonText))) : ("")), index.h("div", { key: '15568d7b0bb0dbc6884bf9baaea4b9ae715d33cf', ref: (el) => (this.liveRegionEl = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.announcement)));
+            focusable: "false", class: "popover-button", onClick: () => this.handleButtonClick() }, index.h("svg", { class: "btn-icon", height: "9", width: "9" }, index.h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), index.h("span", { class: "button-text" }, this.buttonText))) : ("")), index.h("div", { key: '6c336c7d464df02267b4da0e3060d7f69cc12177', ref: (el) => (this.liveRegionEl = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.announcement)));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -193,7 +193,7 @@ const ChartLegend = class {
         return this.processedData.map((item, idx) => (index.h("div", { class: "legend-item", key: item.barLegend, onClick: () => this.handleLegendItemClick(idx), onMouseEnter: () => this.handleLegendItemMouseEnter(idx), onMouseLeave: () => this.handleLegendItemMouseLeave() }, index.h("div", { class: this.getSwatchClassMap(item), style: { "--color": `var(--${item.color})` } }), index.h("div", { class: "label" }, item.barLegend), item.printValue && index.h("span", { class: `print-value` }, "(", item.printValue, ")"))));
     }
     render() {
-        return (index.h(index.Host, { key: '1ba232432e51488144a4320c075db67690e5990b' }, index.h("div", { key: '088cd589e2cd04d168e59bc74b963326fd4fbeff', class: `legend-container --${this.orientation} ${this.printMode ? "print-mode" : ""}`, "aria-hidden": "true" }, this.renderLegendItems())));
+        return (index.h(index.Host, { key: '96690631fc06cb059813cf67adfb96a87a89ea03' }, index.h("div", { key: '68afe8f3ed1452d9e031ba8d0c2dbcbe6d57af78', class: `legend-container --${this.orientation} ${this.printMode ? "print-mode" : ""}`, "aria-hidden": "true" }, this.renderLegendItems())));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/priv-navigator-button.cjs.entry.js

@@ -19,7 +19,7 @@ const PrivNavigatorButton = class {
     }
     render() {
         const { handleClick, altText } = this;
-        return (index.h("button", { key: 'adfd184468176b7b9c025b5e4db3c86a1e857b4b', "aria-expanded": this.expanded.toString(), class: "navigator", onClick: handleClick.bind(this), "aria-label": altText }));
+        return (index.h("button", { key: '2f94dbb64a96096e852ec572f16264600c7fca8f', "aria-expanded": this.expanded.toString(), class: "navigator", onClick: handleClick.bind(this), "aria-label": altText }));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/priv-navigator-item.cjs.entry.js

@@ -26,7 +26,7 @@ const PrivNavigatorItem = class {
     render() {
         const selectedClass = this.selected ? "selected" : "";
         const focusedClass = this.focused ? "focused" : "";
-        return (index.h("div", { key: 'b79461e5967f3e75c8bb4d4c5e9e66d6b870c84b', class: `navoption ${selectedClass} ${focusedClass}` }, index.h("slot", { key: '35f83b67f08a1d8fdc3aeaeba1acdef45e85fca1' })));
+        return (index.h("div", { key: '427929b24dd60459f8269a3d3ee746ac876ff31f', class: `navoption ${selectedClass} ${focusedClass}` }, index.h("slot", { key: '9c67b8bd2282efc3ca77d8805dd3278d3e0b3c4a' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/priv-option-list.cjs.entry.js

@@ -382,7 +382,7 @@ const PrivOptionList = class {
         return (index.h("div", { class: "non-options-wrapper" }, this.isInNestedSelect && this.renderReturnBtn(), this.search && this.renderSearchField(), this.visibleSelectAllButton && this.renderSelectAllButton()));
     }
     render() {
-        return (index.h("div", { key: 'd1dc259bbc48591f82a0e44017349513b7e22f60', class: "list-wrapper" }, (this.isInNestedSelect || this.search || this.visibleSelectAllButton) && this.renderNonOptions(), index.h("div", { key: '5ef4cd1533f03e47175ed6112996ba73a138aacd', id: "list", class: "options-wrapper", tabindex: -1, role: "listbox", "aria-multiselectable": this.multiple ? "true" : null, "aria-label": this.optgroupLabel, ref: (el) => (this.listboxEl = el), style: { "--max-height": this.effectiveMaxHeight } }, this.searchTerm && this.filteredOptions.length === 0 && this.renderSearchFailedMessage(), this.multiple && this.renderCloneOptions(), index.h("slot", { key: '53014694e7dc51fbfc4fe6da9abbf0749764b4a1' })), index.h("div", { key: 'f3e1bb6596bd0e656eb045c5a62dad39ee266985', id: "optionlist-announcement", "aria-live": "polite", "aria-atomic": "true", class: "sr-only", ref: (el) => (this.liveRegionEl = el) }, this.announcement)));
+        return (index.h("div", { key: 'edfca7bcea21613113e9498ce7f9aa5fc7546ce2', class: "list-wrapper" }, (this.isInNestedSelect || this.search || this.visibleSelectAllButton) && this.renderNonOptions(), index.h("div", { key: '443fbc27fa3f25984f5eaada522a990b6941a5dd', id: "list", class: "options-wrapper", tabindex: -1, role: "listbox", "aria-multiselectable": this.multiple ? "true" : null, "aria-label": this.optgroupLabel, ref: (el) => (this.listboxEl = el), style: { "--max-height": this.effectiveMaxHeight } }, this.searchTerm && this.filteredOptions.length === 0 && this.renderSearchFailedMessage(), this.multiple && this.renderCloneOptions(), index.h("slot", { key: '7f6fb3e4667fcd951e98b7e5466416de817a8e55' })), index.h("div", { key: '8753468e7a2dd5bd17bd1cfdf72d7eac0b4faf6e', id: "optionlist-announcement", "aria-live": "polite", "aria-atomic": "true", class: "sr-only", ref: (el) => (this.liveRegionEl = el) }, this.announcement)));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ripple.cjs.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-bb947bd5.js');
-const appGlobals = require('./app-globals-3f8985a8.js');
+const appGlobals = require('./app-globals-df7ca137.js');
 
 /*
  Stencil Client Patch Browser v4.21.0 | MIT Licensed | https://stenciljs.com

package/dist/cjs/wm-action-menu_2.cjs.entry.js

@@ -347,7 +347,7 @@ const ActionMenu = class {
         return null;
     }
     render() {
-        return (index.h(index.Host, { key: '089e41398162bb653228788b4317049cde90677a', onBlur: () => this.close(false) }, index.h("div", { key: '8bf71c94ed904f5c4308b30aaba78910622918ec', class: functions.getTextDir() }, index.h("button", { key: 'e907d5dbb4c76d9c1dcc4099b3f79faec27f4bdd', ref: (el) => (this.menubtnEl = el), id: "menubtn", class: `wm-button -${this.internalButtonType}${this.darkMode ? " dark" : ""}${this.isTabbing ? " user-is-tabbing" : ""}`, disabled: this.disabled, "aria-label": this.internalButtonType === "icononly"
+        return (index.h(index.Host, { key: '19a7b9bbd017ed6100d605c56d497f99084bdadc', onBlur: () => this.close(false) }, index.h("div", { key: '02352c77a57c3811d5bc66be6eeed8ebdf413aa9', class: functions.getTextDir() }, index.h("button", { key: '070cea3ac5da73352e952b87d342d4b98716346b', ref: (el) => (this.menubtnEl = el), id: "menubtn", class: `wm-button -${this.internalButtonType}${this.darkMode ? " dark" : ""}${this.isTabbing ? " user-is-tabbing" : ""}`, disabled: this.disabled, "aria-label": this.internalButtonType === "icononly"
                 ? this.labelForIdenticalButtons || this.tooltip
                 : this.labelForIdenticalButtons || undefined, "aria-expanded": this.isExpanded ? "true" : "false", "aria-haspopup": "menu", popoverTarget: "menu", popoverTargetAction: "toggle", onMouseEnter: () => this.actionMenuType === "icon" &&
                 functions.showTooltip(this.tooltipPosition || this.horizontalPosition, this.menubtnEl, this.tooltip), onMouseLeave: () => functions.hideTooltip(), onFocus: () => this.isTabbing &&
@@ -355,9 +355,9 @@ const ActionMenu = class {
                 functions.showTooltip(this.tooltipPosition || this.horizontalPosition, this.menubtnEl, this.tooltip), onBlur: (ev) => {
                 functions.hideTooltip();
                 this.handleButtonBlur(ev);
-            } }, this.actionMenuType === "icon" && (index.h("span", { key: 'bd615c986c40863c73a2ec9f060fc5b596e7d64f', class: "svg-icon svg-more-options", style: { "--icon-size": "24px" } })), this.actionMenuType !== "icon" && index.h("span", { key: '27ad43a2bc951784d313f08b210c1092f2adda55', class: "button-text" }, this.buttonText), (this.actionMenuType === "selector" || this.actionMenuType === "selector-primary") && (index.h("div", { key: '54184d0f5faa1bd80eddc76127d4173f3dacb7ca', class: "selector-icon svg-icon svg-expand-more" }))), index.h("div", { key: '7f34d1d1527b5b65f512fe636aa243ef06c2ae61', class: `dropdown ${this.isExpanded ? "is-open" : ""} ${this.isHidden ? "hidden" : ""} ${this.openUp ? "open-up" : ""} ${this.horizontalPosition}`, id: "menu", popover: "auto", tabindex: -1, role: "menu", ref: (el) => (this.dropdownEl = el),
+            } }, this.actionMenuType === "icon" && (index.h("span", { key: '24f876ff7aba8a8f0628c768fd7a3cae4c6b13c1', class: "svg-icon svg-more-options", style: { "--icon-size": "24px" } })), this.actionMenuType !== "icon" && index.h("span", { key: 'dfe646329373fe5839fba003ec15f3345982097e', class: "button-text" }, this.buttonText), (this.actionMenuType === "selector" || this.actionMenuType === "selector-primary") && (index.h("div", { key: '8872e66a185503cd1f6fc298e3fb2e28e67d1ae6', class: "selector-icon svg-icon svg-expand-more" }))), index.h("div", { key: 'a6b8ecffdf3c9886e0b01d4783b22403b2d7c724', class: `dropdown ${this.isExpanded ? "is-open" : ""} ${this.isHidden ? "hidden" : ""} ${this.openUp ? "open-up" : ""} ${this.horizontalPosition}`, id: "menu", popover: "auto", tabindex: -1, role: "menu", ref: (el) => (this.dropdownEl = el),
             // @ts-ignore -- don't tell typescript but we're in the future
-            onToggle: (ev) => this.handleToggle(ev) }, index.h("slot", { key: 'de4af1e89a98621b4093089e70f7b0c02b759cb2' })))));
+            onToggle: (ev) => this.handleToggle(ev) }, index.h("slot", { key: '3d0b49daa3f5c2c62edb3582a0de2f53888ff2e8' })))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }
@@ -381,6 +381,7 @@ const Menuitem = class {
         this.wmTabKeyPressed = index.createEvent(this, "wmTabKeyPressed", 7);
         this.wmLetterPressed = index.createEvent(this, "wmLetterPressed", 7);
         this.wmMenuitemBlurred = index.createEvent(this, "wmMenuitemBlurred", 7);
+        this.onClickFunc = null;
         this.descriptionCharLimit = 100;
         this.disabled = false;
         this.icon = undefined;
@@ -474,7 +475,7 @@ const Menuitem = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '3576abf0e512b2088c08a13a9b0da7be22fc4604', tabindex: -1, role: "menuitem", "aria-disabled": this.disabled ? "true" : null }, index.h("div", { key: '5ee18f1dc5bc3ce1498db2038d6e21ed9abeb951', class: "wrapper", "aria-disabled": this.disabled ? "true" : null }, index.h("div", { key: '1eb8c3e8db9dee82803e458dce83ea26314d454f', class: "main-text" }, this.icon && this.renderIcon(), this.el.textContent), this.description ? index.h("div", { class: "description" }, this.description) : "")));
+        return (index.h(index.Host, { key: 'ae1d93489feffb5016582d3f1707ce6465b1dcc7', tabindex: -1, role: "menuitem", "aria-disabled": this.disabled ? "true" : null }, index.h("div", { key: '8e06a217bb068a4d612290badbe92e4971483e43', class: "wrapper", "aria-disabled": this.disabled ? "true" : null }, index.h("div", { key: '185d673501208073456b6e943c52fd9b14f91023', class: "main-text" }, this.icon && this.renderIcon(), this.el.textContent), this.description ? index.h("div", { class: "description" }, this.description) : "")));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/wm-button.cjs.entry.js

@@ -265,7 +265,7 @@ const Button = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'bfc5c1c1b69619258f1a15003de34a9884f5b09e', class: `${this.isDisabled ? "button-disabled" : ""} -${this.buttonType}` }, index.h("button", { key: '647328418473ec98db1fff54403a5915a8354668', id: this.id, class: `${this.buttonClasses}`, disabled: this.isDisabled, ref: (el) => (this.buttonEl = el), "aria-label": this.getAriaLabel(), "aria-expanded": this.isAriaExpanded !== undefined ? this.isAriaExpanded.toString() : undefined, "aria-hasPopup": this.ariaPopup ? "menu" : null, onMouseEnter: (ev) => this.handleMouseEnter(ev), onMouseLeave: () => functions.hideTooltip(), onFocus: (ev) => this.handleFocus(ev), onBlur: () => functions.hideTooltip(), onClick: () => functions.hideTooltip() }, this.icon && this.renderIcon(), !this.buttonType.startsWith("navigational") && !this.buttonType.startsWith("icononly") && (index.h("span", { key: '1f27aeed2c3e7f87d326c6da318f08be083c873e', class: "button-text" }, index.h("slot", { key: '6cce46f476c7d20aa3c48fa1e87edd495398d5c3' }))), (this.buttonType == "selector" || this.buttonType == "selector-primary") && (index.h("div", { key: '305255c0423d2971932f3f8ccc2170075aa4dd53', class: "selector-icon svg-icon svg-expand-more" })))));
+        return (index.h(index.Host, { key: '76a5421d00532673476644aae829a5e4c1705b1f', class: `${this.isDisabled ? "button-disabled" : ""} -${this.buttonType}` }, index.h("button", { key: '576012f5b0262fb6ca7dd435e869c4276cc0da06', id: this.id, class: `${this.buttonClasses}`, disabled: this.isDisabled, ref: (el) => (this.buttonEl = el), "aria-label": this.getAriaLabel(), "aria-expanded": this.isAriaExpanded !== undefined ? this.isAriaExpanded.toString() : undefined, "aria-hasPopup": this.ariaPopup ? "menu" : null, onMouseEnter: (ev) => this.handleMouseEnter(ev), onMouseLeave: () => functions.hideTooltip(), onFocus: (ev) => this.handleFocus(ev), onBlur: () => functions.hideTooltip(), onClick: () => functions.hideTooltip() }, this.icon && this.renderIcon(), !this.buttonType.startsWith("navigational") && !this.buttonType.startsWith("icononly") && (index.h("span", { key: '2c6548c3708dc18fec38d43dbf75583a0e254cf0', class: "button-text" }, index.h("slot", { key: '07f076ee9011eb1294315b29cdbb350e8e55270f' }))), (this.buttonType == "selector" || this.buttonType == "selector-primary") && (index.h("div", { key: '0332bc4f94a44c5b973cee95da7065a05803d0b7', class: "selector-icon svg-icon svg-expand-more" })))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-chart-bar.cjs.entry.js

@@ -435,7 +435,7 @@ const ChartBar = class {
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         const rowCount = (this.isGrouped ? this.processedData.size : (_a = this.processedData.get(null)) === null || _a === void 0 ? void 0 : _a.length) || 1; // processedData keys are the group names, ungrouped data belongs under a key of null
-        return (index.h(index.Host, { key: '6c4e5d5a990eb6b719cf6414bcb08961b265d6f7' }, index.h("div", { key: '348d77ac265b2ad0abac5aadaf117286b4c8b408', class: "popover-wrapper" }, index.h("priv-chart-popover", { key: 'bf6ecf7270d6a5862a65c2820c057946171bf380', ref: (el) => (this.popoverEl = el), onIntChartPopoverToggled: (ev) => this.handlePopoverToggled(ev) })), index.h("div", { key: 'eb2120d0c22302d55ce91c0242cc021586005e41', ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${((_b = this.printMode) !== null && _b !== void 0 ? _b : (_c = this.config) === null || _c === void 0 ? void 0 : _c.printMode) ? "print-mode" : ""}`, tabindex: "0", role: "application", onKeyDown: (ev) => this.handleChartKeyDown(ev), onBlur: (ev) => this.handleComponentBlur(ev), "aria-roledescription": intl.chartMessages.interactiveChart, "aria-describedby": "chart-instructions", "aria-label": (_d = this.config) === null || _d === void 0 ? void 0 : _d.label }, ((_f = (_e = this.config) === null || _e === void 0 ? void 0 : _e.showLabel) !== null && _f !== void 0 ? _f : true) && (index.h("label", { key: 'c3c5df95bbe6c59785e3812a3e4a41c1c2c30243', id: "label", class: "label" }, index.h("span", { key: '9c0cbdc44cf7e261b84a2cb466124b3b3f526bff', class: "label-text" }, (_g = this.config) === null || _g === void 0 ? void 0 : _g.label), this.subinfoText ? index.h("span", { class: "subinfo" }, this.subinfoText) : "")), this.showLegend === "top" && this.renderLegend("horizontal"), index.h("div", { key: '2054415ba5137a232b43acdc2776adeb038aa968', class: "chart-wrapper" }, index.h("div", { key: 'b0238719a9e7d271f1c04d1a22acb9784a9283e3', class: "chart-left-side" }, this.showLegend === "left" && this.renderLegend("vertical"), index.h("div", { key: 'fc31958261bd6901ec8a37b6d4327058fbc0cc08', class: "left-axis-label" }, index.h("span", { key: '9d1f9c6976084919bf9c3bc52e4fc05af9d70398', class: "axis-label-text" }, (_h = this.config) === null || _h === void 0 ? void 0 : _h.categoryAxisLabel))), index.h("div", { key: 'cd8f097b5350c41c0db3e0427cebf71b9f77da03', class: "chart-center" }, index.h("div", { key: 'cfb29fb64d81c566c97820a1da2a3988a4e3cea7', class: "chart-area", style: { "--row-count": rowCount.toString() } }, this.processedData && (this.isGrouped ? this.renderGroupLegends() : this.renderBarLegends()), index.h("div", { key: '073309f0b2b5218e0bc4e21c58a9272e40ac376f', class: `bar-area ${this.isKeying ? "user-is-keying" : ""} ${this.isGrouped ? "grouped" : ""}`, ref: (el) => (this.barAreaEl = el) }, this.gridVisible && this.renderGrid(), ((_j = this.config) === null || _j === void 0 ? void 0 : _j.gridMax) != undefined && (this.isGrouped ? this.renderGroupedBars() : this.renderBars()))), index.h("div", { key: '4e455f2332f393cb1ea2ccc75209434f90c3ef74', class: "bottom-axis-label" }, index.h("span", { key: 'db1ef4194c3d544c28270892a2c0b85524685e89', class: "axis-label-text" }, (_k = this.config) === null || _k === void 0 ? void 0 : _k.valueAxisLabel)), this.gridVisible && this.renderXAxis()), index.h("div", { key: '8451642ab2169b7255b82620b9751538c3ecbeda', class: "chart-right-side" }, this.showLegend === "right" && this.renderLegend("vertical"))), this.showLegend === "bottom" && this.renderLegend("horizontal"), chartFunctions.renderInstructionsText())));
+        return (index.h(index.Host, { key: 'fee905a779328fdabd70ead14d0be757809a20b7' }, index.h("div", { key: '259b8520be79541071c4e9d322d52253b1f31905', class: "popover-wrapper" }, index.h("priv-chart-popover", { key: '4e67366a3e3328621228faf7b7006cc28ea5d6c6', ref: (el) => (this.popoverEl = el), onIntChartPopoverToggled: (ev) => this.handlePopoverToggled(ev) })), index.h("div", { key: '040f5c7d13fa72d062fa82069f9da9f11aefa01c', ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${((_b = this.printMode) !== null && _b !== void 0 ? _b : (_c = this.config) === null || _c === void 0 ? void 0 : _c.printMode) ? "print-mode" : ""}`, tabindex: "0", role: "application", onKeyDown: (ev) => this.handleChartKeyDown(ev), onBlur: (ev) => this.handleComponentBlur(ev), "aria-roledescription": intl.chartMessages.interactiveChart, "aria-describedby": "chart-instructions", "aria-label": (_d = this.config) === null || _d === void 0 ? void 0 : _d.label }, ((_f = (_e = this.config) === null || _e === void 0 ? void 0 : _e.showLabel) !== null && _f !== void 0 ? _f : true) && (index.h("label", { key: '913ee009cdccb63eb97d7b089e47b3a95afbd033', id: "label", class: "label" }, index.h("span", { key: 'df61bc316cd501e9747b88705da29c4dff1e8409', class: "label-text" }, (_g = this.config) === null || _g === void 0 ? void 0 : _g.label), this.subinfoText ? index.h("span", { class: "subinfo" }, this.subinfoText) : "")), this.showLegend === "top" && this.renderLegend("horizontal"), index.h("div", { key: '7e62e9b642f8c9c82a85a0444718688b559df321', class: "chart-wrapper" }, index.h("div", { key: '253dec169ae191463f5bae1762927903e28865b9', class: "chart-left-side" }, this.showLegend === "left" && this.renderLegend("vertical"), index.h("div", { key: 'a334e424f2e6d84f2573958392d998918b108282', class: "left-axis-label" }, index.h("span", { key: '3e5ce3a0e0de6c6681e8128285f9cb68d380c455', class: "axis-label-text" }, (_h = this.config) === null || _h === void 0 ? void 0 : _h.categoryAxisLabel))), index.h("div", { key: '6a8569d3747e99acad477eeaa3d23a8e2cd9e86d', class: "chart-center" }, index.h("div", { key: '9fdd5de7923748a3ece1c878b67345c09ade7b16', class: "chart-area", style: { "--row-count": rowCount.toString() } }, this.processedData && (this.isGrouped ? this.renderGroupLegends() : this.renderBarLegends()), index.h("div", { key: '384233d4f76764d9e58d4512398b58c2e08da6fa', class: `bar-area ${this.isKeying ? "user-is-keying" : ""} ${this.isGrouped ? "grouped" : ""}`, ref: (el) => (this.barAreaEl = el) }, this.gridVisible && this.renderGrid(), ((_j = this.config) === null || _j === void 0 ? void 0 : _j.gridMax) != undefined && (this.isGrouped ? this.renderGroupedBars() : this.renderBars()))), index.h("div", { key: '029ce6b851112ba6f3a0bf02f52003fe33ce3236', class: "bottom-axis-label" }, index.h("span", { key: 'e8e23fbf1446d7e3c6639233ee1bdd95d39be38f', class: "axis-label-text" }, (_k = this.config) === null || _k === void 0 ? void 0 : _k.valueAxisLabel)), this.gridVisible && this.renderXAxis()), index.h("div", { key: '0019f06abd0b37f496960c499d10a12ca616a6bb', class: "chart-right-side" }, this.showLegend === "right" && this.renderLegend("vertical"))), this.showLegend === "bottom" && this.renderLegend("horizontal"), chartFunctions.renderInstructionsText())));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-chart-column.cjs.entry.js

@@ -614,7 +614,7 @@ const ChartColumn = class {
     // #endregion rendering
     render() {
         var _a, _b, _c, _d, _e, _f;
-        return (index.h(index.Host, { key: 'affae5b48baddd602d0b7a3e52dac3adbc935b4c' }, index.h("div", { key: 'ff850beabb9e006382b815679306826db3f7a72a', class: "popover-wrapper" }, index.h("priv-chart-popover", { key: 'cd5baae81ffc528fd522bcce99c3d77102dd77fd', ref: (el) => (this.popoverEl = el), onIntChartPopoverToggled: (ev) => this.handlePopoverToggled(ev) })), index.h("div", { key: '458977566490ece052ae601d6c567c0a55c194fe', ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${((_a = this.printMode) !== null && _a !== void 0 ? _a : (_b = this.config) === null || _b === void 0 ? void 0 : _b.printMode) ? "print-mode" : ""}`, style: this.isPlotWidthLimited ? { "--forced-width": `${this.printWidthPx}px` } : undefined, tabindex: "0", role: "application", onKeyDown: (ev) => this.handleChartKeyDown(ev), onBlur: (ev) => this.handleComponentBlur(ev), "aria-roledescription": intl.chartMessages.interactiveChart, "aria-describedby": "chart-instructions", "aria-label": (_c = this.config) === null || _c === void 0 ? void 0 : _c.label }, ((_e = (_d = this.config) === null || _d === void 0 ? void 0 : _d.showLabel) !== null && _e !== void 0 ? _e : true) && (index.h("label", { key: 'e29c77421f36511d78823c09c915025dd365db41', id: "label", class: "label" }, index.h("span", { key: 'f6ce8537edf910e0d88fbe97e24e38ae6b8f7f0e', class: "label-text" }, (_f = this.config) === null || _f === void 0 ? void 0 : _f.label), this.subinfoText ? index.h("span", { class: "subinfo" }, this.subinfoText) : "")), this.showLegend === "top" && this.renderLegend("horizontal"), index.h("div", { key: '2656655cdcae22b906c3129c1a9d6de52263015b', class: "chart-wrapper" }, index.h("div", { key: 'd141e1d15be6d548c065e7e1872f6b8482d63f19', class: "chart-left-side" }, this.showLegend === "left" && this.renderLegend("vertical")), this.data && this.renderPlotContainers(), index.h("div", { key: '6e28c0075fc0359dc29a2c275789f57ee7698da7', class: "chart-right-side" }, this.showLegend === "right" && this.renderLegend("vertical"))), this.showLegend === "bottom" && this.renderLegend("horizontal"), chartFunctions.renderInstructionsText())));
+        return (index.h(index.Host, { key: 'b51ad062997d2af1ef9aa4cc77e69b00417052cc' }, index.h("div", { key: 'e69ca509ec69daf49c384a013cb65929a468dc8b', class: "popover-wrapper" }, index.h("priv-chart-popover", { key: '335e7e4681ce4227e03a83ddd4dd2c1a599fd9b0', ref: (el) => (this.popoverEl = el), onIntChartPopoverToggled: (ev) => this.handlePopoverToggled(ev) })), index.h("div", { key: '2198b8cdb1b1293c4dfb8a18673ec1f941ab252d', ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${((_a = this.printMode) !== null && _a !== void 0 ? _a : (_b = this.config) === null || _b === void 0 ? void 0 : _b.printMode) ? "print-mode" : ""}`, style: this.isPlotWidthLimited ? { "--forced-width": `${this.printWidthPx}px` } : undefined, tabindex: "0", role: "application", onKeyDown: (ev) => this.handleChartKeyDown(ev), onBlur: (ev) => this.handleComponentBlur(ev), "aria-roledescription": intl.chartMessages.interactiveChart, "aria-describedby": "chart-instructions", "aria-label": (_c = this.config) === null || _c === void 0 ? void 0 : _c.label }, ((_e = (_d = this.config) === null || _d === void 0 ? void 0 : _d.showLabel) !== null && _e !== void 0 ? _e : true) && (index.h("label", { key: '6a31a705fc24b21eb74df46a440c4e5a70c9d4f4', id: "label", class: "label" }, index.h("span", { key: 'c4b0ab318e570dcc7dfeaab05e4f4e00329de72c', class: "label-text" }, (_f = this.config) === null || _f === void 0 ? void 0 : _f.label), this.subinfoText ? index.h("span", { class: "subinfo" }, this.subinfoText) : "")), this.showLegend === "top" && this.renderLegend("horizontal"), index.h("div", { key: 'e1542b6b9f1e157f1a6e0a02c01a9b66d3954952', class: "chart-wrapper" }, index.h("div", { key: 'dd07a9a03778b3d3665d553e4b581766efbb117d', class: "chart-left-side" }, this.showLegend === "left" && this.renderLegend("vertical")), this.data && this.renderPlotContainers(), index.h("div", { key: '959c73972b14fb2e31a0273364983a61d89405ed', class: "chart-right-side" }, this.showLegend === "right" && this.renderLegend("vertical"))), this.showLegend === "bottom" && this.renderLegend("horizontal"), chartFunctions.renderInstructionsText())));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-chart.cjs.entry.js

@@ -153,7 +153,7 @@ const Chart = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '64a6dc03c5a44de1cb06d0ddfa90cf88cf1c467c', onBlur: () => chartFunctions.exitChart.call(this) }, index.h("div", { key: '31b4a39ce530c5e3552b1896feaa081f2e368d1b', ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${this.currentChartType} ${this.isTabbing && !this.userIsNavigating ? "user-is-tabbing" : ""} ${this.labelPosition === "left" && this.currentChartType === "bar4" ? "left-label" : ""}`, role: "application", "aria-label": this.ariaLabelText, tabindex: 0, "aria-roledescription": intl.chartMessages.interactiveChart, "aria-describedby": "chart-instructions" }, index.h("label", { key: 'a62e78dd0eb3f50da81cc09137ea5bc7115b7cf4', id: `label-${this.uid}`, class: `label --${this.labelPosition}`, htmlFor: `graphic-${this.uid}` }, index.h("span", { key: '9a7219c06f7ef4a1a59f9b23a15574c65942e6c6', class: "label-text" }, this.label), this.subinfo ? index.h("span", { class: "subinfo" }, this.subinfo) : ""), this.isBar && chartFunctions.renderLegend.call(this, this.currentChartType), this.renderChart(), this.isDoughnut && chartFunctions.renderLegend.call(this, this.currentChartType), index.h("priv-chart-popover-old", { key: 'c561e46795723255b0919e321c4a60f5b58dc021', class: this.isTabbing ? "user-is-tabbing" : "", onIntChartPopoverOpenChanged: (ev) => this.handlePopoverOpenChanged(ev) }), this.isBar && !this.printMode && chartFunctions.renderHiddenValuesMessage()), chartFunctions.renderInstructionsText()));
+        return (index.h(index.Host, { key: 'e0a972bc5e47bead2080f995f6ac7622a9508f4e', onBlur: () => chartFunctions.exitChart.call(this) }, index.h("div", { key: 'a9d2e2b8309229208e9432e7756432f8c4ed0585', ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${this.currentChartType} ${this.isTabbing && !this.userIsNavigating ? "user-is-tabbing" : ""} ${this.labelPosition === "left" && this.currentChartType === "bar4" ? "left-label" : ""}`, role: "application", "aria-label": this.ariaLabelText, tabindex: 0, "aria-roledescription": intl.chartMessages.interactiveChart, "aria-describedby": "chart-instructions" }, index.h("label", { key: '5a2acae3749eed0ce29ce20a43eff4a1324790bb', id: `label-${this.uid}`, class: `label --${this.labelPosition}`, htmlFor: `graphic-${this.uid}` }, index.h("span", { key: '780eb58732f4ec691ca6623dc4e2e6fb05395faf', class: "label-text" }, this.label), this.subinfo ? index.h("span", { class: "subinfo" }, this.subinfo) : ""), this.isBar && chartFunctions.renderLegend.call(this, this.currentChartType), this.renderChart(), this.isDoughnut && chartFunctions.renderLegend.call(this, this.currentChartType), index.h("priv-chart-popover-old", { key: '266e79755e835272f69e3f6a9d057fe1dab46837', class: this.isTabbing ? "user-is-tabbing" : "", onIntChartPopoverOpenChanged: (ev) => this.handlePopoverOpenChanged(ev) }), this.isBar && !this.printMode && chartFunctions.renderHiddenValuesMessage()), chartFunctions.renderInstructionsText()));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-date-range.cjs.entry.js

@@ -455,6 +455,16 @@ const DateRange = class {
         this.startCalEl.hoverDate = this.startCalEl.startDate === ev.detail ? undefined : ev.detail;
         this.endCalEl.hoverDate = this.endCalEl.startDate === ev.detail ? undefined : ev.detail;
     }
+    /**
+     * @description Converts a date string between `"US"` (mm/dd/yyyy), `"INT"` (dd/mm/yyyy),
+     * and `"ISO"` (YYYY-MM-DD). Direct US ↔ INT conversion is not supported — route through
+     * ISO as an intermediate step.
+     * @param inputFormat - Format of the input date string (`"US"`, `"INT"`, or `"ISO"`).
+     * @param outputFormat - Desired output format (`"US"`, `"INT"`, or `"ISO"`).
+     * @param date - The date string to reformat.
+     * @returns The reformatted date string, an empty string if `date` is omitted, or the original
+     * string unchanged if it cannot be parsed.
+     */
     async reformatDate(inputFormat, outputFormat, date) {
         return this._reformatDate(inputFormat, outputFormat, date);
     }
@@ -492,6 +502,12 @@ const DateRange = class {
             }
         }
     }
+    /**
+     * @description Validates whether a string is a well-formed, calendar-correct ISO date
+     * (YYYY-MM-DD). Accounts for invalid day-of-month values and leap years.
+     * @param input - The string to validate.
+     * @returns `true` if the string is a valid ISO date, `false` otherwise.
+     */
     async isValidISO(input) {
         return this._isValidISO(input);
     }
@@ -541,25 +557,25 @@ const DateRange = class {
     }
     render() {
         var _a, _b, _c, _d;
-        return (index.h(index.Host, { key: 'd9425370610f8a2b7c45fe6f292c3956a84ff9bd', "aria-busy": "false" }, index.h("div", { key: 'db1104312e47a8c5f83d69a23c248ed4707abf36', ref: (d) => (this.wrapperEl = d), class: "wrapper" }, index.h("div", { key: '4e41eab3d58c2fca4545102e0f56b990af715a37', class: "range-wrapper cal", ref: (el) => (this.anchorEl = el) }, index.h("div", { key: '1a8367a94d56d6478304c17501835e02a83c8a89', class: "label-wrapper", id: "start-label-wrapper" }, index.h("label", { key: '95ca9b13badd5de4bf3256950e266c649ec96e81', id: "startlabel", htmlFor: "start-date-input", class: "label" }, this.labelStart, this.requiredField && (index.h("span", { key: '735e651558ca88cd0ef48da443de1141a3a3b2be', "aria-hidden": "true", class: "required" }, "*")))), index.h("div", { key: '88f0a8721ecff89466b5d4dcc44d35ad67f8f0cb', class: "label-wrapper", id: "end-label-wrapper" }, index.h("label", { key: 'f4bfa9b4e39cb75ca0af56ce75291dc838715964', id: "endlabel", htmlFor: "end-date-input", class: "label" }, this.labelEnd, this.requiredField && (index.h("span", { key: 'cbe940d9ed0b9ee6461b22017440a2640cef07ba', "aria-hidden": "true", class: "required" }, "*")))), index.h("input", { key: 'fdbc07ae0431e0c6205962c6ccfba9ebc65f1231', disabled: this._disabled, type: "text", id: "start-date-input", class: `date-input input ${this.invalidStart ? "invalid" : ""}`, name: "start-date", placeholder: this.dateFormat, value: this.valueStart, onFocus: () => this.handleFocus(), onInput: (ev) => this.handleStartInput(ev), onBlur: () => this.handleStartInputBlur(), ref: (input) => (this.startInputEl = input), "aria-describedby": "date-format-hint error", "aria-label": this.labelStart, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: 'd5bdc52b7caf0e25b012f0fed4472917e2c637df', id: "hyphen" }, "\u00A0-\u00A0"), index.h("input", { key: '99aa505aabd9950e8b8a9d855d2c4ea697f5c8af', disabled: this._disabled, type: "text", id: "end-date-input", class: `date-input input ${this.invalidEnd ? "invalid" : ""}`, name: "end-date", placeholder: this.dateFormat, value: this.valueEnd, onFocus: () => this.handleFocus(), onInput: (ev) => this.handleEndInput(ev), onBlur: () => this.handleEndInputBlur(), ref: (input) => (this.endInputEl = input), "aria-describedby": "date-format-hint error", "aria-label": this.labelEnd, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: 'a3434b13ad539bed778bc337ed04adc30e9acc77', class: "toggle-wrapper", id: "toggle-wrapper" }, this.canOpen && (index.h("button", { key: '7b7beb9c5460609fe9cf5922b23d826c64b9f053', disabled: this.disabled, "aria-describedby": "start-date-input end-date-input", "aria-label": functions.intl.formatMessage({
+        return (index.h(index.Host, { key: '576f553f284eef57b1b80d2770ebaaaa486b2a65', "aria-busy": "false" }, index.h("div", { key: 'd1b8749f84940f811277ea0d4cbdf6548f552a21', ref: (d) => (this.wrapperEl = d), class: "wrapper" }, index.h("div", { key: '4879d908500055bbcf9435445a3c3352e08c8239', class: "range-wrapper cal", ref: (el) => (this.anchorEl = el) }, index.h("div", { key: '7659bcc76e110904961a006f57148c8eaf8ad81e', class: "label-wrapper", id: "start-label-wrapper" }, index.h("label", { key: '824d8f9ec6bd3ea6ec29e2670f30b4c2d83955a3', id: "startlabel", htmlFor: "start-date-input", class: "label" }, this.labelStart, this.requiredField && (index.h("span", { key: '8553c682f6a1be43f6a76a97d22ba67447c90c6d', "aria-hidden": "true", class: "required" }, "*")))), index.h("div", { key: 'f8d28e4e6759cb11622d9386873d6419f4de3fdc', class: "label-wrapper", id: "end-label-wrapper" }, index.h("label", { key: '4c3d0bbf5a58a4a0c567041fe51002f897f29592', id: "endlabel", htmlFor: "end-date-input", class: "label" }, this.labelEnd, this.requiredField && (index.h("span", { key: 'aabf372102b5cb425108c3b95caeebe35a7e890d', "aria-hidden": "true", class: "required" }, "*")))), index.h("input", { key: 'e0f084896c043648d79cae89a1aa192395bf61de', disabled: this._disabled, type: "text", id: "start-date-input", class: `date-input input ${this.invalidStart ? "invalid" : ""}`, name: "start-date", placeholder: this.dateFormat, value: this.valueStart, onFocus: () => this.handleFocus(), onInput: (ev) => this.handleStartInput(ev), onBlur: () => this.handleStartInputBlur(), ref: (input) => (this.startInputEl = input), "aria-describedby": "date-format-hint error", "aria-label": this.labelStart, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: '8dc7e190cfe901e308d2a665f93d7d89f2fea731', id: "hyphen" }, "\u00A0-\u00A0"), index.h("input", { key: 'e354bfaa40907bd99b6d0e152869f170b5f90f4f', disabled: this._disabled, type: "text", id: "end-date-input", class: `date-input input ${this.invalidEnd ? "invalid" : ""}`, name: "end-date", placeholder: this.dateFormat, value: this.valueEnd, onFocus: () => this.handleFocus(), onInput: (ev) => this.handleEndInput(ev), onBlur: () => this.handleEndInputBlur(), ref: (input) => (this.endInputEl = input), "aria-describedby": "date-format-hint error", "aria-label": this.labelEnd, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: '75e537ec719c5aaabff86531fa5abf8b72a2d3ef', class: "toggle-wrapper", id: "toggle-wrapper" }, this.canOpen && (index.h("button", { key: '5b65696c08716602b4db77a21c329e5b1b53adf9', disabled: this.disabled, "aria-describedby": "start-date-input end-date-input", "aria-label": functions.intl.formatMessage({
                 id: "date.selectRange",
                 defaultMessage: "Select range",
                 description: "Button text for screen readers.",
-            }), ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle", popoverTarget: "popup-wrapper", popoverTargetAction: "toggle" }, index.h("span", { key: '7c04850bc3e4c29687f6875d1b77a6baa018fd50', class: "svg-icon svg-date" }), index.h("span", { key: '3abf1b41a3f3787c7e0f9573d092bbe5bbd55875', class: "calendar", title: functions.intl.formatMessage({
+            }), ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle", popoverTarget: "popup-wrapper", popoverTargetAction: "toggle" }, index.h("span", { key: '0cc4cbf6dfd6da128d9a33a72e3e89dab812c72a', class: "svg-icon svg-date" }), index.h("span", { key: '9fe596dc14752fa2f505aa6c1ab893ffa1f14b1b', class: "calendar", title: functions.intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",
-            }) })))), index.h("div", { key: '3f9fe602f2efc97f6cf42c32dab36b42562304b0', class: `popup-wrapper popup-range ${this.startCalEl && this.startCalEl.view}-view ${this.isExpanded ? "is-open" : ""} ${!this.hasAnchor && !this.isExpanded ? "hidden" : ""} ${(_b = (_a = this.fit) === null || _a === void 0 ? void 0 : _a.vertical) !== null && _b !== void 0 ? _b : ""} ${(_d = (_c = this.fit) === null || _c === void 0 ? void 0 : _c.horizontal) !== null && _d !== void 0 ? _d : ""}`, id: "popup-wrapper", ref: (el) => (this.popupEl = el), popover: "auto",
+            }) })))), index.h("div", { key: '1b7934722e2b0187ae6424141cc1e08cb5dda8d0', class: `popup-wrapper popup-range ${this.startCalEl && this.startCalEl.view}-view ${this.isExpanded ? "is-open" : ""} ${!this.hasAnchor && !this.isExpanded ? "hidden" : ""} ${(_b = (_a = this.fit) === null || _a === void 0 ? void 0 : _a.vertical) !== null && _b !== void 0 ? _b : ""} ${(_d = (_c = this.fit) === null || _c === void 0 ? void 0 : _c.horizontal) !== null && _d !== void 0 ? _d : ""}`, id: "popup-wrapper", ref: (el) => (this.popupEl = el), popover: "auto",
             // @ts-ignore -- onToggle is a valid ToggleEvent listener for popover elements
-            onToggle: (ev) => this.handleToggle(ev) }, index.h("div", { key: '41e4eae0f64600b15b3f56e5002a898f3d8ee571', class: "trapfocus", tabIndex: this.isExpanded ? 0 : undefined, onFocus: () => this.endCalEl.focusLastFocusable() }), index.h("priv-calendar", { key: '207a8f831fa0ff6a7068ac86ba467935ad8cbd5b', ref: (el) => (this.startCalEl = el), onDateFocus: (ev) => this.handleDateFocus(ev) }), index.h("priv-calendar", { key: '05ed5b637ddaaf31658f3db71218098b8b251ae0', ref: (el) => (this.endCalEl = el), onDateFocus: (ev) => this.handleDateFocus(ev) }), index.h("div", { key: 'e2ccb7d837231b42b5464dca90ccbaa09f4484e5', class: "trapfocus", tabIndex: this.isExpanded ? 0 : undefined, onFocus: () => this.startCalEl.focusFirstFocusable() }))), index.h("div", { key: '4b8a0c9b7fceeb552ef3264203f875ec85bc9310' }, index.h("div", { key: '457fd174e68e80c707914c417b9def8e5be39920', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), index.h("div", { key: 'c3d4cb97f2686296956975eb0ece2a8204584b8e', id: "month-title", class: "sr-only" }, functions.intl.formatMessage({
+            onToggle: (ev) => this.handleToggle(ev) }, index.h("div", { key: 'cde40c3cdaee6e1641f7062debb2c301850d8967', class: "trapfocus", tabIndex: this.isExpanded ? 0 : undefined, onFocus: () => this.endCalEl.focusLastFocusable() }), index.h("priv-calendar", { key: 'c2f18d3d19fd9fded7c3bda37a521843870aae91', ref: (el) => (this.startCalEl = el), onDateFocus: (ev) => this.handleDateFocus(ev) }), index.h("priv-calendar", { key: '2f99a6e4dadfe42b53fe207871af112bf2780c56', ref: (el) => (this.endCalEl = el), onDateFocus: (ev) => this.handleDateFocus(ev) }), index.h("div", { key: 'df0c41dd0779a7586e666f5b530d7f7d449a54bb', class: "trapfocus", tabIndex: this.isExpanded ? 0 : undefined, onFocus: () => this.startCalEl.focusFirstFocusable() }))), index.h("div", { key: '7f3971b1af72d54ccc07f52531c1d17fecb6d7ab' }, index.h("div", { key: '0bed6cb1cf5f5ada1c926623d8b6dacb5dc34287', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), index.h("div", { key: '237bf9699d0305031f0f0bd04c9d8027c84dc1ed', id: "month-title", class: "sr-only" }, functions.intl.formatMessage({
             id: "date.selectMonth",
             defaultMessage: "Activate to select a month.",
             description: "Calendar button",
-        })), index.h("div", { key: 'fd5074de67b599f2773080314d82a260b8447113', id: "year-title", class: "sr-only" }, functions.intl.formatMessage({
+        })), index.h("div", { key: 'ce586f8192676950d0221ce709b79dba29a956c8', id: "year-title", class: "sr-only" }, functions.intl.formatMessage({
             id: "date.selectYear",
             defaultMessage: "Activate to select a year.",
             description: "Calendar button",
-        }))), index.h("div", { key: 'efdcc22aa520edec0a59ad6e76c16031d8077d67', id: "error", class: "error" }, this.errorMessage), index.h("span", { key: 'b91c95c15affe4885b41ccf088bb66b00ba881eb', id: "date-format-hint", class: "sr-only" }, this.dateFormat), index.h("div", { key: 'c925b59da3ac2557e796c29ecb35c2218b221f7c', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }))));
+        }))), index.h("div", { key: '913aaac21cc36b8172a1b28b45d9d2c9432e623f', id: "error", class: "error" }, this.errorMessage), index.h("span", { key: '066481609119ee85db50856e30b7c2f188bab078', id: "date-format-hint", class: "sr-only" }, this.dateFormat), index.h("div", { key: '77f64053567c3c2a4e2038205a9787a1cfa846b8', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-datepicker.cjs.entry.js

@@ -110,12 +110,17 @@ const DatePicker = class {
     }
     get calendarDate() {
         let calendarDate = functions.dateToISO(new Date());
-        const dateFormatUnits = { "mm/dd/yyyy": "US", "dd/mm/yyyy": "INT", "yyyy/mm/dd": "ISO" };
+        const dateFormatUnits = {
+            "mm/dd/yyyy": "US",
+            "dd/mm/yyyy": "INT",
+            "yyyy/mm/dd": "ISO",
+        };
+        const inputFormat = dateFormatUnits[this.dateFormat];
         if (this.value &&
-            dateFormatUnits[this.dateFormat] &&
-            this.isValidIsoInternal(this.reformatDateInternal(dateFormatUnits[this.dateFormat], "ISO", this.value))) {
+            inputFormat &&
+            this.isValidIsoInternal(this.reformatDateInternal(inputFormat, "ISO", this.value))) {
             // if component has value, and value can be parsed to valid ISO
-            calendarDate = this.reformatDateInternal(dateFormatUnits[this.dateFormat], "ISO", this.value);
+            calendarDate = this.reformatDateInternal(inputFormat, "ISO", this.value);
         }
         else if (this.preselected) {
             calendarDate = this.preselected;
@@ -256,6 +261,18 @@ const DatePicker = class {
         this.el.dispatchEvent(changeEvent);
         this.closePopup(true);
     }
+    /**
+     * @description Converts a date string between the supported format tokens: `"US"` (mm/dd/yyyy),
+     * `"INT"` (dd/mm/yyyy), and `"ISO"` (YYYY-MM-DD). Direct US ↔ INT conversion is not supported —
+     * route through ISO as an intermediate step.
+     * @param inputFormat - Format of the input date string.
+     * @param outputFormat - Desired output format.
+     * @param date - The date string to reformat.
+     * @returns The reformatted date string, an empty string if `date` is omitted or falsy, or the
+     * original string unchanged if it cannot be parsed.
+     * @example reformatDate("US", "ISO", "06/20/1969") // → "1969-06-20"
+     * @example reformatDate("ISO", "US", "1969-06-20") // → "06/20/1969"
+     */
     async reformatDate(inputFormat, outputFormat, date) {
         return this.reformatDateInternal(inputFormat, outputFormat, date);
     }
@@ -291,6 +308,15 @@ const DatePicker = class {
             }
         }
     }
+    /**
+     * @description Validates whether a string is a well-formed, calendar-correct ISO date
+     * (YYYY-MM-DD). Accounts for invalid day-of-month values and leap years.
+     * @param input - The string to validate.
+     * @returns `true` if the string is a valid ISO date, `false` otherwise.
+     * @example isValidIso("1969-06-20") // → true
+     * @example isValidIso("1969-06-33") // → false (day 33 does not exist)
+     * @example isValidIso("2023-02-29") // → false (2023 is not a leap year)
+     */
     async isValidIso(input) {
         return this.isValidIsoInternal(input);
     }
@@ -340,25 +366,25 @@ const DatePicker = class {
     }
     render() {
         var _a, _b, _c, _d;
-        return (index.h(index.Host, { key: 'a6bd8346b4de553102719cd281b9dc9413581aae', "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, index.h("div", { key: 'eaaf09c6388ac561f612af41cf0b3502b04094b0', ref: (d) => (this.dpWrapperEl = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, index.h("div", { key: '4202ea43a96fb7c3b67d4454a3637bf616e332cd', class: "label-wrapper" }, this.labelPosition !== "none" && (index.h("label", { key: '42f8526f8fdb0028e24c514d42091c3fbf15ab60', id: "datepickerLabel", htmlFor: "date-input", class: "label", onMouseEnter: (ev) => this.handleLabelMouseEnter(ev), onMouseLeave: () => functions.hideTooltip() }, this.label)), this.labelPosition !== "none" && this.requiredField && (index.h("div", { key: '88c138a04cc78bac4171fc6458ad9b00778bf490', "aria-hidden": "true", class: "required" }, "*"))), index.h("div", { key: 'de2d78696965e3a10ac3facbeca4a8b473245523' }, index.h("div", { key: '9039a74286b4aa7f1491c02eaab23b321a2aaa45', class: "single-wrapper input", ref: (el) => (this.anchorEl = el) }, index.h("input", { key: '944723e15f67dff099ac5c1f6f03263594300435', disabled: this.isDisabled, type: "text", id: "single-date-input", class: "date-input", name: "date", placeholder: this.dateFormat, value: this.value, onFocus: () => this.handleInputFocus(), onInput: (ev) => this.handleInput(ev), onBlur: () => this.handleInputBlur(), onChange: () => this.handleInputChange(), ref: (input) => (this.inputEl = input), "aria-describedby": "date-format-hint error", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: '80ef67580f83dea80bcfc0d57391663e2727d33a', class: "container", id: "wm-container" }, this.canOpen && (index.h("button", { key: '730d2b56439354ce6232dc18d12c38bbc6790ed2', disabled: this.disabled, "aria-label": functions.intl.formatMessage({
+        return (index.h(index.Host, { key: 'ec737a3904688317e61939e4ed997c0e4d6fa49d', "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, index.h("div", { key: 'ba2baa4d174b1fdb229169cd80ee8f60c308254e', ref: (d) => (this.dpWrapperEl = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, index.h("div", { key: '4e196f3d7e9dc1ebc0fdd8d63cd4f9bb2888c3ed', class: "label-wrapper" }, this.labelPosition !== "none" && (index.h("label", { key: 'ad751fc53a81f7ea7edc88ded9a632cab9fabac1', id: "datepickerLabel", htmlFor: "date-input", class: "label", onMouseEnter: (ev) => this.handleLabelMouseEnter(ev), onMouseLeave: () => functions.hideTooltip() }, this.label)), this.labelPosition !== "none" && this.requiredField && (index.h("div", { key: '4226a64b138aa35272fffce46265f82503afc25d', "aria-hidden": "true", class: "required" }, "*"))), index.h("div", { key: '175045b72db00588c9b8031cfbf22a2f77759e77' }, index.h("div", { key: '126b7c096ec657766deedb6bab0107f067c8cdd9', class: "single-wrapper input", ref: (el) => (this.anchorEl = el) }, index.h("input", { key: '36560f575003ffc14e2e363c24e682f8e5805f41', disabled: this.isDisabled, type: "text", id: "single-date-input", class: "date-input", name: "date", placeholder: this.dateFormat, value: this.value, onFocus: () => this.handleInputFocus(), onInput: (ev) => this.handleInput(ev), onBlur: () => this.handleInputBlur(), onChange: () => this.handleInputChange(), ref: (input) => (this.inputEl = input), "aria-describedby": "date-format-hint error", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), index.h("div", { key: '097142daa1f08d9a135d2ed25c1161434448e3d7', class: "container", id: "wm-container" }, this.canOpen && (index.h("button", { key: 'ad64f7af5d81e3035b791808e9c9c35a537a86a9', disabled: this.disabled, "aria-label": functions.intl.formatMessage({
                 id: "date.selectDate",
                 defaultMessage: "Select date",
                 description: "Button text for screen readers.",
-            }), "aria-describedby": "single-date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle", popoverTarget: "popup-wrapper", popoverTargetAction: "toggle" }, index.h("span", { key: 'd9f4782bbaeea7dbb64c0215e835611f0eecd54a', class: "svg-icon svg-date" }), index.h("span", { key: '2c960fb463c77b71d213c864423869010996ccca', class: "calendar", title: functions.intl.formatMessage({
+            }), "aria-describedby": "single-date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle", popoverTarget: "popup-wrapper", popoverTargetAction: "toggle" }, index.h("span", { key: 'f4860dc16c96322e45dd6f425c1b132bec93edd8', class: "svg-icon svg-date" }), index.h("span", { key: 'b771ffa73b5995cfb5a5a2d15902e8e57a1e9ad6', class: "calendar", title: functions.intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",
-            }) }))), index.h("div", { key: 'b8d9fc86ac97acc442ffd6f371470b883a75f6ea', class: `popup-wrapper ${this.calEl && this.calEl.view}-view ${this.isExpanded ? "is-open" : ""} ${!this.hasAnchor && !this.isExpanded ? "hidden" : ""} ${(_b = (_a = this.fit) === null || _a === void 0 ? void 0 : _a.vertical) !== null && _b !== void 0 ? _b : ""} ${(_d = (_c = this.fit) === null || _c === void 0 ? void 0 : _c.horizontal) !== null && _d !== void 0 ? _d : ""}`, id: "popup-wrapper", ref: (el) => (this.popupEl = el), popover: "auto",
+            }) }))), index.h("div", { key: '27823fcfcb377eea7adf0f725031b67407b8886c', class: `popup-wrapper ${this.calEl && this.calEl.view}-view ${this.isExpanded ? "is-open" : ""} ${!this.hasAnchor && !this.isExpanded ? "hidden" : ""} ${(_b = (_a = this.fit) === null || _a === void 0 ? void 0 : _a.vertical) !== null && _b !== void 0 ? _b : ""} ${(_d = (_c = this.fit) === null || _c === void 0 ? void 0 : _c.horizontal) !== null && _d !== void 0 ? _d : ""}`, id: "popup-wrapper", ref: (el) => (this.popupEl = el), popover: "auto",
             // @ts-ignore -- onToggle is a valid ToggleEvent listener for popover elements
-            onToggle: (ev) => this.handleToggle(ev) }, index.h("div", { key: '9e18fa2cd6a00924d714f2fa943047d5f5c50d51', tabIndex: 0, onFocus: () => this.calEl.focusLastFocusable() }), index.h("priv-calendar", { key: 'c7b713840961ab36cb158a28230278c92364efa1', ref: (el) => (this.calEl = el), startDate: this.calendarDate, focusDate: this.calendarDate, class: "inside" }), index.h("div", { key: '64a58c7332b878d4b693a3eec5d07369b9fe43a3', tabIndex: 0, onFocus: () => this.calEl.focusFirstFocusable() })), index.h("div", { key: '1a6e1fc2010106fc59e8827df71a47f894d1fe0a', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), index.h("div", { key: '24b950499b627de0aa82893672a00596cca8362f', id: "month-title", class: "sr-only" }, functions.intl.formatMessage({
+            onToggle: (ev) => this.handleToggle(ev) }, index.h("div", { key: '42fb801ee8861ee9d69fd634b01961ca1e751d3b', tabIndex: 0, onFocus: () => this.calEl.focusLastFocusable() }), index.h("priv-calendar", { key: 'f6d60feb67ceb253069e3d81f1bc348a58a7c9e0', ref: (el) => (this.calEl = el), startDate: this.calendarDate, focusDate: this.calendarDate, class: "inside" }), index.h("div", { key: 'a8931fe7482dc487dc19cefd0eac43a6bcb5d2d4', tabIndex: 0, onFocus: () => this.calEl.focusFirstFocusable() })), index.h("div", { key: '7f934d9c1260c7660f9dd819c5a8c235c703e6cd', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), index.h("div", { key: '0db580e9920000ee2438d0a1a3d55c670dca029f', id: "month-title", class: "sr-only" }, functions.intl.formatMessage({
             id: "date.selectMonth",
             defaultMessage: "Activate to select a month.",
             description: "Calendar button",
-        })), index.h("div", { key: '59ab8ea5db5b823b74dfea8ed6fbcf6cf5665ae4', id: "year-title", class: "sr-only" }, functions.intl.formatMessage({
+        })), index.h("div", { key: 'aedeb3b51f4d5178022beb80feb69350019a94e6', id: "year-title", class: "sr-only" }, functions.intl.formatMessage({
             id: "date.selectYear",
             defaultMessage: "Activate to select a year.",
             description: "Calendar button",
-        })))), index.h("div", { key: '2b1cae481b68914f2b728080b3ca9efd44c7acde', id: "error", class: "error" }, this.errorMessage), index.h("span", { key: 'e9d5b6752fcff1f9352df2a7886ab1dbb14a3e5b', id: "date-format-hint", class: "sr-only" }, this.dateFormat), index.h("div", { key: '59c04dc077de5e9ac8da0ec7f03593778802260f', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" })))));
+        })))), index.h("div", { key: 'd9b334efcd6a1a8732996af354ebb3732984a9da', id: "error", class: "error" }, this.errorMessage), index.h("span", { key: 'ef309d1f21a4e414bb6230bb29a6e2477faf092b', id: "date-format-hint", class: "sr-only" }, this.dateFormat), index.h("div", { key: 'f5487f9e59eb400483ef96362a549dc52e512404', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" })))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-file-list.cjs.entry.js

@@ -13,7 +13,7 @@ const FileList = class {
         this.showInfo = "last-updated";
     }
     render() {
-        return (index.h("div", { key: '85c0c57f99ff0d6b1a3bee24b63724853f37f2b2', role: "list", class: "list-wrapper" }, index.h("slot", { key: 'a05f7e5ebb27e57a23713a7e029c0bdb18d89286' })));
+        return (index.h("div", { key: 'c071d6aff339fe632763b226dc5d91b8df4bba25', role: "list", class: "list-wrapper" }, index.h("slot", { key: '46ea0a9a4461767f65a186b8e929bf11daeeef40' })));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-file.cjs.entry.js

@@ -200,7 +200,7 @@ const File = class {
         return (index.h("div", { class: `file-wrapper` }, index.h("div", { class: `file ${this.errorMessage ? "--error" : ""}  ${this.isCondensed ? "condensed" : ""} ${this.isExtraCondensed ? "extra-condensed" : ""}` }, this.renderFileName(), showRightGroup && (index.h("div", { class: "right-group" }, !this.isExtraCondensed && this.renderFileInfo(), this.fileActions !== "" && this.renderFileControls())), this.errorMessage && (index.h("div", { class: "right-group" }, index.h("wm-button", { "permanently-delete": true, "button-type": "textonly", "label-for-identical-buttons": this.generateClearButtonLabel(this.name), onClick: () => this.wmFileErrorCleared.emit() }, this.clearButtonText))), this.progress == 100 && index.h("span", { class: "svg-icon svg-success" })), this.errorMessage && index.h("div", { class: "error-message" }, this.errorMessage)));
     }
     render() {
-        return index.h(index.Host, { key: 'e825957afa878743760074bf8a75afc943432249', role: "listitem" }, this.isUploading ? this.renderFileInProgress() : this.renderFile());
+        return index.h(index.Host, { key: 'ab1ef1bbd89e7b604f627fd11db96917cef07821', role: "listitem" }, this.isUploading ? this.renderFileInProgress() : this.renderFile());
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/wm-flyout.cjs.entry.js

@@ -94,6 +94,11 @@ const Flyout = class {
     setFlyoutWidth() {
         this.el.style.setProperty("--flyout-width", this.flyoutWidth);
     }
+    /**
+     * @description Moves focus to the flyout's heading element. Call this after updating flyout
+     * content in a multi-step workflow so screen readers announce the new heading to the user.
+     * @returns A promise that resolves once focus has been applied.
+     */
     async focusHeading() {
         this.headingEl.focus();
     }
@@ -168,7 +173,7 @@ const Flyout = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'edef60d2bbbed2d457e1cc1b85aa3f6381084d5b' }, index.h("dialog", { key: 'be1c6a36c8bd59cdf45590402d24ba94271ada78', ref: (el) => (this.dialogEl = el), class: "flyout", "aria-labelledby": "heading", onClose: () => this.wmFlyoutCloseTriggered.emit(), onKeyDown: (ev) => this.handleKeyDown(ev) }, index.h("div", { key: '115b32676ca1215698eeaccac059a1730a65e16b', tabindex: "0", class: "focus-trap", onFocus: () => this.lastFocusableEl.focus(), "aria-hidden": "true" }), this.renderHeader(), index.h("div", { key: '45a0bc9e0c3366d2e35409712cc4f02566659373', class: "flyout-content" }, index.h("slot", { key: '4613ce4d6cac4126bb70ab6b0301b68294f0244f' })), this.renderFooter(), index.h("div", { key: '3646f8d1604cfdbdeb0ce3872431473943978ecb', tabindex: "0", class: "focus-trap", onFocus: () => this.handleEndBookendFocus(), "aria-hidden": "true" }))));
+        return (index.h(index.Host, { key: 'eb123498c8c9452cae1d4c204842e45fb99a2aeb' }, index.h("dialog", { key: '17a8b8eea564bee116204049747e0e363e77007e', ref: (el) => (this.dialogEl = el), class: "flyout", "aria-labelledby": "heading", onClose: () => this.wmFlyoutCloseTriggered.emit(), onKeyDown: (ev) => this.handleKeyDown(ev) }, index.h("div", { key: '805423bf1ff579a534f05d10c7cc530f89d69c5f', tabindex: "0", class: "focus-trap", onFocus: () => this.lastFocusableEl.focus(), "aria-hidden": "true" }), this.renderHeader(), index.h("div", { key: 'cf31d451909506f531e753bc30c60bc2d0379870', class: "flyout-content" }, index.h("slot", { key: 'e9717213c3a2b075bb67296f5bff9793ec7c1eb2' })), this.renderFooter(), index.h("div", { key: 'ba7cf122b72c12e960bc606b463a045f38f2c1f6', tabindex: "0", class: "focus-trap", onFocus: () => this.handleEndBookendFocus(), "aria-hidden": "true" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {