@watermarkinsights/ripple 5.4.0 → 5.5.0-2

package/dist/collection/components/charts/wm-progress-monitor/wm-progress-indicator.css

@@ -171,8 +171,7 @@
 }
 :host .component-wrapper.doughnut1 label,
 :host .component-wrapper.doughnut1 .label-text, :host .component-wrapper.doughnut2 label,
-:host .component-wrapper.doughnut2 .label-text, :host .component-wrapper.doughnut2b label,
-:host .component-wrapper.doughnut2b .label-text, :host .component-wrapper.doughnut3 label,
+:host .component-wrapper.doughnut2 .label-text, :host .component-wrapper.doughnut3 label,
 :host .component-wrapper.doughnut3 .label-text {
   position: absolute !important;
   width: 1px !important;
@@ -250,14 +249,14 @@
     justify-content: center;
   }
 }
-:host .component-wrapper.bar2, :host .component-wrapper.bar2b, :host .component-wrapper.bar3, :host .component-wrapper.bar4, :host .component-wrapper.bar5 {
+:host .component-wrapper.bar2, :host .component-wrapper.bar3, :host .component-wrapper.bar4, :host .component-wrapper.bar5 {
   align-items: flex-start;
 }
-:host .component-wrapper.bar2b .inner-stacked-bar-wrapper, :host .component-wrapper.bar4 .inner-stacked-bar-wrapper, :host .component-wrapper.bar5 .inner-stacked-bar-wrapper {
+:host .component-wrapper.bar4 .inner-stacked-bar-wrapper, :host .component-wrapper.bar5 .inner-stacked-bar-wrapper {
   height: 30px;
   margin-bottom: 0;
 }
-:host .component-wrapper.bar2b .inner-stacked-bar-wrapper.show-values, :host .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values, :host .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values {
+:host .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values, :host .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values {
   height: 60px;
   margin-top: 0;
 }

package/dist/collection/components/datepickers/priv-calendar/priv-calendar.js

@@ -331,10 +331,7 @@ export class PrivCalendar {
                     //If the down arrow is pressed from the arrow buttons or the title box, focus should shift to the current month in focus
                     const activeEl = (document.activeElement.shadowRoot || document).activeElement;
                     if (activeEl.classList.contains("header-btn")) {
-                        const monthId = `#month-${this._focus.month.asInt()}`;
-                        const monthToFocus = this.el.querySelector(monthId);
-                        monthToFocus.tabIndex = 0;
-                        monthToFocus.focus();
+                        this.focusCell();
                         break;
                     }
                     this.monthButtonFocus.increase(3);
@@ -442,14 +439,21 @@ export class PrivCalendar {
             if (dayToFocus > maxDays) {
                 this._focus.day.set(maxDays);
             }
-            const cellToFocus = this.getCell(this.focusDate);
-            if (cellToFocus) {
-                cellToFocus.tabIndex = 0;
-                cellToFocus.focus();
-            }
             if (this.view == "day") {
+                const cellToFocus = this.getCell(this.focusDate);
+                if (cellToFocus) {
+                    cellToFocus.tabIndex = 0;
+                    cellToFocus.focus();
+                }
                 this.cellHovered.emit(this.focusDate);
             }
+            else {
+                const monthToFocus = this.el.querySelector(`#month-${this._focus.month.asInt()}`);
+                if (monthToFocus) {
+                    monthToFocus.tabIndex = 0;
+                    monthToFocus.focus();
+                }
+            }
         });
     }
     toggleBusyAttribute(state) {
@@ -802,6 +806,10 @@ export class PrivCalendar {
                         "Promise": {
                             "location": "global",
                             "id": "global::Promise"
+                        },
+                        "HTMLTableCellElement": {
+                            "location": "global",
+                            "id": "global::HTMLTableCellElement"
                         }
                     },
                     "return": "Promise<void>"

package/dist/collection/components/datepickers/wm-date-range.js

@@ -429,7 +429,11 @@ export class DateRange {
         }
     }
     render() {
-        return (h(Host, { "aria-busy": "false" }, h("div", { ref: (d) => (this.wrapperEl = d), class: "wrapper" }, h("div", { class: `range-wrapper ${this.calWidth <= this.availSpace ? "cal" : ""}` }, h("div", { class: "label-wrapper", id: "start-label-wrapper" }, h("label", { ref: (e) => (this.labelEl = e), id: "startlabel", htmlFor: "start-date-input", class: "label", title: `${this.labelStart} (${this.dateFormat})` }, this.labelStart, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("div", { class: "label-wrapper", id: "end-label-wrapper" }, h("label", { id: "endlabel", htmlFor: "end-date-input", class: "label", title: `${this.labelEnd} (${this.dateFormat})` }, this.labelEnd, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("input", { 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": "error", "aria-label": this.labelStart, "aria-required": this.requiredField ? "true" : null }), h("div", { id: "hyphen" }, "\u00A0-\u00A0"), h("input", { 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": "error", "aria-label": this.labelEnd, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "toggle-wrapper", id: "toggle-wrapper" }, this.calWidth <= this.availSpace && (h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { class: "calendar", title: intl.formatMessage({
+        return (h(Host, { "aria-busy": "false" }, h("div", { ref: (d) => (this.wrapperEl = d), class: "wrapper" }, h("div", { class: `range-wrapper ${this.calWidth <= this.availSpace ? "cal" : ""}` }, h("div", { class: "label-wrapper", id: "start-label-wrapper" }, h("label", { ref: (e) => (this.labelEl = e), id: "startlabel", htmlFor: "start-date-input", class: "label", title: `${this.labelStart} (${this.dateFormat})` }, this.labelStart, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("div", { class: "label-wrapper", id: "end-label-wrapper" }, h("label", { id: "endlabel", htmlFor: "end-date-input", class: "label", title: `${this.labelEnd} (${this.dateFormat})` }, this.labelEnd, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("input", { 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": "error", "aria-label": this.labelStart, "aria-required": this.requiredField ? "true" : null }), h("div", { id: "hyphen" }, "\u00A0-\u00A0"), h("input", { 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": "error", "aria-label": this.labelEnd, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "toggle-wrapper", id: "toggle-wrapper" }, this.calWidth <= this.availSpace && (h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "start-date-input end-date-input", "aria-label": 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" }, h("span", { class: "calendar", title: intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",

package/dist/collection/components/datepickers/wm-datepicker.js

@@ -214,7 +214,11 @@ export class DatePicker {
         this.liveRegionEl.textContent = message;
     }
     render() {
-        return (h(Host, { "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, h("div", { ref: (d) => (this.dpWrapperEl = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, h("div", { class: "label-wrapper", ref: (e) => (this.labelWrapperEl = e) }, this.labelPosition !== "none" && (h("label", { id: "datepickerLabel", htmlFor: "date-input", class: "label", title: `${this.label} (${this.dateFormat})` }, this.label, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*"))))), h("div", null, h("div", { class: "single-wrapper input" }, h("input", { 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": "error", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "container", id: "wm-container" }, h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { class: "calendar", title: intl.formatMessage({
+        return (h(Host, { "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, h("div", { ref: (d) => (this.dpWrapperEl = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, h("div", { class: "label-wrapper", ref: (e) => (this.labelWrapperEl = e) }, this.labelPosition !== "none" && (h("label", { id: "datepickerLabel", htmlFor: "date-input", class: "label", title: `${this.label} (${this.dateFormat})` }, this.label, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*"))))), h("div", null, h("div", { class: "single-wrapper input" }, h("input", { 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": "error", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "container", id: "wm-container" }, h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-label": 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" }, h("span", { class: "calendar", title: intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",

package/dist/collection/components/wm-navigator/priv-navigator-item/priv-navigator-item.css

@@ -42,10 +42,10 @@
   background: var(--wmcolor-navigator-item-background);
   font-size: 0.875rem;
 }
-:host .navoption.selected, :host .navoption:hover {
-  background: var(--wmcolor-navigator-item-background-hover);
+:host .navoption.selected {
+  background: var(--wmcolor-navigator-item-background-selected);
 }
-:host .navoption.focused:not(.selected) {
+:host .navoption.focused, :host .navoption:hover {
   background: var(--wmcolor-navigator-item-background-focus);
   opacity: 1;
 }

package/dist/collection/components/wm-navigator/wm-navigator.css

@@ -33,6 +33,7 @@
   --wmcolor-navigator-background: var(--wmcolor-background);
   --wmcolor-navigator-header-background: var(--wmcolor-brand-dark);
   --wmcolor-navigator-header-text: var(--wmcolor-text-ondark);
+  --wmcolor-navigator-item-background-selected: var(--wmcolor-interactive-background-selected);
   --wmcolor-navigator-item-background-focus: var(--wmcolor-interactive-background-focus);
   --wmcolor-navigator-item-background-hover: var(--wmcolor-interactive-background-hover);
   --wmcolor-navigator-item-background: var(--wmcolor-background);

package/dist/collection/components/wm-navigator/wm-navigator.js

@@ -1,6 +1,6 @@
-import { h, Host, } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 import { getWmMode } from "../../global/interfaces";
-import { intl, snakeCaseToCamelCase, getNewIndexToFocus, } from "../../global/functions";
+import { intl, snakeCaseToCamelCase, getNewIndexToFocus } from "../../global/functions";
 import { getRequest } from "../../global/services/http-service";
 export class Navigator {
     constructor() {
@@ -35,7 +35,7 @@ export class Navigator {
             "vialivetext\\.com",
             "watermarkinsights\\.com",
         ];
-        whitelist.forEach(tld => {
+        whitelist.forEach((tld) => {
             const knownTLD = `^https:\/\/(.*\.)?${tld}(\/.*)?$`;
             if (!!url && url.match(knownTLD)) {
                 isSafe = true;
@@ -58,12 +58,8 @@ export class Navigator {
                 this.email = response.email;
                 this.currentProductId = response.current_product_id;
                 this.parsedProducts = this.productKeysToCamelCase(response.products);
-                this.logoutUrl = this.logoutUrl
-                    ? this.logoutUrl
-                    : response.logout_url;
-                this.connectionName = this.connectionName
-                    ? this.connectionName
-                    : response.connection_name;
+                this.logoutUrl = this.logoutUrl ? this.logoutUrl : response.logout_url;
+                this.connectionName = this.connectionName ? this.connectionName : response.connection_name;
                 if (!!this.email && !!this.currentProductId) {
                     this.retrievedInfo = true;
                 }
@@ -158,8 +154,7 @@ export class Navigator {
         if (this.wrapperEl) {
             const wrapperWidth = this.wrapperEl.clientWidth;
             const spaceLeft = this.el.getBoundingClientRect().left;
-            const spaceRight = document.documentElement.clientWidth -
-                this.el.getBoundingClientRect().right;
+            const spaceRight = document.documentElement.clientWidth - this.el.getBoundingClientRect().right;
             this.openRight = wrapperWidth > spaceLeft && spaceRight > spaceLeft;
         }
         this.isOpen = true;
@@ -179,7 +174,8 @@ export class Navigator {
         const newSelection = this.navigatorItems[this.itemIndexToFocus];
         newSelection.tabIndex = 0;
         newSelection.focused = true;
-        window.requestAnimationFrame(() => newSelection.focus());
+        // wait for animation to complete before sending focus to option
+        window.setTimeout(() => newSelection.focus(), 250);
     }
     unfocusItem(index) {
         const oldSelection = this.navigatorItems[index];
@@ -236,7 +232,9 @@ export class Navigator {
             clickRedirect = this.setProductOnClick(product.id);
             if (!!name && !!icon) {
                 isSelected = this.currentProductId === product.id;
-                return (h("priv-navigator-item", { selected: isSelected, id: product.id, onClick: clickRedirect, role: "option", "aria-label": name }, h("img", { src: icon, alt: name })));
+                return (h("priv-navigator-item", { selected: isSelected, id: product.id, onClick: () => {
+                        isSelected ? this.closeMenu() : clickRedirect();
+                    }, role: "option", "aria-label": name, "aria-selected": isSelected ? "true" : "false" }, h("img", { src: icon, alt: name })));
             }
         });
     }
@@ -258,9 +256,7 @@ export class Navigator {
             }
             else if (this.authType === 3) {
                 // products passed as prop, saml
-                const connName = this.connectionName
-                    ? `/?connection_name=${this.connectionName}`
-                    : "";
+                const connName = this.connectionName ? `/?connection_name=${this.connectionName}` : "";
                 const url = product.samlLinkUrl;
                 if (this.isSafeUrl(url)) {
                     return () => (window.location.href = url + connName);
@@ -273,7 +269,7 @@ export class Navigator {
         }
     }
     renderLogoutOption() {
-        return (h("priv-navigator-item", { class: "logout", selected: !(this.parsedProducts.length > 1), id: "nav-logout", onClick: this.setLogoutOnclick(), role: "option" }, h("span", { class: "logout" }, intl.formatMessage({
+        return (h("priv-navigator-item", { class: "logout", selected: !(this.parsedProducts.length > 1), id: "nav-logout", onClick: this.setLogoutOnclick(), role: "option", "aria-selected": "false" }, h("span", { class: "logout" }, intl.formatMessage({
             id: "navigator.logout",
             defaultMessage: "Log Out",
         }))));

package/dist/esm/{chartFunctions-d3fd6e7c.js → chartFunctions-0ebf83f3.js}

@@ -29,16 +29,7 @@ const allChartsDetails = {
     },
     doughnut2: {
         size: 130,
-        colors: [colors.cyan, colors.salmon, colors.gray],
-        thickness: 0.5,
-        padding: 90,
-        category: "doughnut",
-    },
-    // an internal type only for use when doughnut 2 is populated with 4 slices
-    // in this case, the first slice is colored purple
-    doughnut2b: {
-        size: 130,
-        colors: [colors.periwinkle, colors.cyan, colors.salmon, colors.gray],
+        colors: [colors.periwinkle, colors.cyan, colors.midnight, colors.salmon, colors.gray],
         thickness: 0.5,
         padding: 90,
         category: "doughnut",
@@ -58,12 +49,6 @@ const allChartsDetails = {
         category: "stackedBar",
     },
     bar2: {
-        size: 400,
-        colors: [colors.gray, colors.periwinkle, colors.cyan, colors.salmon],
-        padding: 0,
-        category: "stackedBar",
-    },
-    bar2b: {
         size: 400,
         colors: [colors.gray, colors.periwinkle, colors.midnight, colors.cyan, colors.salmon],
         padding: 0,
@@ -319,19 +304,33 @@ async function getDetails(chartType) {
     let acc = 0;
     const children = Array.from(this.el.children);
     this.total = children.reduce((total, slice) => (total += parseInt(slice.getAttribute("amount") || "0")), 0);
-    let chartColors = allChartsDetails[chartType].colors;
+    let chartColors = [...allChartsDetails[chartType].colors];
+    if (this.chartType === "bar2" && this.el.children.length <= 4) {
+        // remove midnight
+        chartColors.splice(2, 1);
+    }
     // Set colors when bar3 has only 2 slices
     if (chartType === "bar3" && children.length === 2) {
         chartColors = [chartColors[1], chartColors[3]];
     }
+    // Set colors when doughnut2 has less than 5 slices
+    // (rm 2nd neutral color midnight)
+    if (chartType === "doughnut2" && children.length < 5) {
+        chartColors.splice(2, 1);
+        // with 3 slices or less, also remove first color
+        // (only pos, neg and unknown remain)
+        if (children.length < 4) {
+            chartColors.shift();
+        }
+    }
+    // for bar5, first color should be skipped unless notStartedColor is set to true
+    if (chartType === "bar5" && !this.notStartedColor) {
+        chartColors.shift();
+    }
     children.forEach((c, i) => {
         const amount = parseInt(c.getAttribute("amount") || "0");
         const perc = amountToPercent(amount, this.total, true);
         let colorIndex = i;
-        // for bar5, first color should be skipped unless notStartedColor is set to true
-        if (chartType === "bar5") {
-            colorIndex = this.notStartedColor ? i : i + 1;
-        }
         // bars in bar6 are all the same color
         if (chartType === "bar6") {
             colorIndex = 0;

package/dist/esm/{global-588c6343.js → global-ec8d6686.js}

@@ -1,4 +1,4 @@
-const version = "5.4.0";
+const version = "5.5.0-2";
 
 // PRINT RIPPLE VERSION IN CONSOLE
 // test envs return 0 for plugin.length

package/dist/esm/loader.js

@@ -1,6 +1,6 @@
 import { b as bootstrapLazy } from './index-558b5a82.js';
 export { s as setNonce } from './index-558b5a82.js';
-import './global-588c6343.js';
+import './global-ec8d6686.js';
 
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return undefined;

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

@@ -340,10 +340,7 @@ const PrivCalendar = class {
                     //If the down arrow is pressed from the arrow buttons or the title box, focus should shift to the current month in focus
                     const activeEl = (document.activeElement.shadowRoot || document).activeElement;
                     if (activeEl.classList.contains("header-btn")) {
-                        const monthId = `#month-${this._focus.month.asInt()}`;
-                        const monthToFocus = this.el.querySelector(monthId);
-                        monthToFocus.tabIndex = 0;
-                        monthToFocus.focus();
+                        this.focusCell();
                         break;
                     }
                     this.monthButtonFocus.increase(3);
@@ -451,14 +448,21 @@ const PrivCalendar = class {
             if (dayToFocus > maxDays) {
                 this._focus.day.set(maxDays);
             }
-            const cellToFocus = this.getCell(this.focusDate);
-            if (cellToFocus) {
-                cellToFocus.tabIndex = 0;
-                cellToFocus.focus();
-            }
             if (this.view == "day") {
+                const cellToFocus = this.getCell(this.focusDate);
+                if (cellToFocus) {
+                    cellToFocus.tabIndex = 0;
+                    cellToFocus.focus();
+                }
                 this.cellHovered.emit(this.focusDate);
             }
+            else {
+                const monthToFocus = this.el.querySelector(`#month-${this._focus.month.asInt()}`);
+                if (monthToFocus) {
+                    monthToFocus.tabIndex = 0;
+                    monthToFocus.focus();
+                }
+            }
         });
     }
     toggleBusyAttribute(state) {

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

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, g as getElement } from './index-558b5a82.js';
 
-const privNavigatorItemCss = ":host{list-style:none;border-bottom:1px solid var(--wmcolor-navigator-item-border);width:100%;display:block;cursor:pointer}:host .navoption{color:var(--wmcolor-navigator-item-text);padding:0.9375rem 1.25rem;background:var(--wmcolor-navigator-item-background);font-size:0.875rem}:host .navoption.selected,:host .navoption:hover{background:var(--wmcolor-navigator-item-background-hover)}:host .navoption.focused:not(.selected){background:var(--wmcolor-navigator-item-background-focus);opacity:1}";
+const privNavigatorItemCss = ":host{list-style:none;border-bottom:1px solid var(--wmcolor-navigator-item-border);width:100%;display:block;cursor:pointer}:host .navoption{color:var(--wmcolor-navigator-item-text);padding:0.9375rem 1.25rem;background:var(--wmcolor-navigator-item-background);font-size:0.875rem}:host .navoption.selected{background:var(--wmcolor-navigator-item-background-selected)}:host .navoption.focused,:host .navoption:hover{background:var(--wmcolor-navigator-item-background-focus);opacity:1}";
 
 const PrivNavigatorItem = class {
     constructor(hostRef) {

package/dist/esm/ripple.js

@@ -1,6 +1,6 @@
 import { p as promiseResolve, b as bootstrapLazy } from './index-558b5a82.js';
 export { s as setNonce } from './index-558b5a82.js';
-import './global-588c6343.js';
+import './global-ec8d6686.js';
 
 /*
  Stencil Client Patch Browser v4.8.2 | MIT Licensed | https://stenciljs.com

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

@@ -1,9 +1,9 @@
 import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-558b5a82.js';
 import { g as generateId, d as debounce } from './functions-46843ea0.js';
-import { a as allChartsDetails, h as handleChartKeydown, g as getDetails, r as removeSegmentInfoHighlight, b as renderSimpleBar, c as renderStackedBar, d as renderDoughnut, e as renderInstructionsText, f as renderLegend, i as renderHiddenValuesMessage, j as exitChart, k as amountToPercent } from './chartFunctions-d3fd6e7c.js';
+import { a as allChartsDetails, h as handleChartKeydown, g as getDetails, r as removeSegmentInfoHighlight, b as renderSimpleBar, c as renderStackedBar, d as renderDoughnut, e as renderInstructionsText, f as renderLegend, i as renderHiddenValuesMessage, j as exitChart, k as amountToPercent } from './chartFunctions-0ebf83f3.js';
 import { c as chartMessages } from './intl-8b8740b9.js';
 
-const wmChartCss = ":host{--wmcolor-chart-label-text-negative:var(--wmcolor-text-negative);--wmcolor-chart-label-text-positive:var(--wmcolor-text-positive);--wmcolor-chart-label-text:var(--wmcolor-text);--wmcolor-chart-subinfo-text:var(--wmcolor-text);--wmcolor-chart-value-text:var(--wmcolor-text);display:block}:host .component-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;font-size:0.875rem;position:relative;outline:none;}:host .component-wrapper:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px}:host .component-wrapper .label{display:block;margin:0;padding-bottom:0.25rem;font-weight:600;position:relative}:host .component-wrapper .label .subinfo{display:block;font-weight:normal;font-style:italic;bottom:0.25rem;width:100%;color:var(--wmcolor-chart-subinfo-text)}:host .component-wrapper .label.custom-width{width:var(--custom-label-width)}:host .component-wrapper .label.--none{display:none}:host .component-wrapper .doughnut-svg,:host .component-wrapper .inner-stacked-bar-wrapper{overflow:visible}:host .component-wrapper .bar-wrapper{-ms-flex-positive:1;flex-grow:1;width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper{width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .values{display:-ms-flexbox;display:flex;gap:2px;margin-bottom:8px}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper{display:-ms-flexbox;display:flex;gap:2px}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment{height:30px;cursor:pointer}:host .component-wrapper .segment{print-color-adjust:exact;-webkit-print-color-adjust:exact}:host .component-wrapper .segment.fixed-width{-ms-flex-negative:0;flex-shrink:0}:host .component-wrapper .doughnut-wrapper{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px}:host .component-wrapper .doughnut-wrapper .doughnut-segment{cursor:pointer}:host .component-wrapper .value-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .component-wrapper .value-wrapper .fixed-width{-ms-flex-negative:0;flex-shrink:0}:host .component-wrapper .value-wrapper .value.hidden{visibility:hidden}:host .component-wrapper .faded{opacity:0.3}:host .component-wrapper path:active,:host .component-wrapper path:hover,:host .component-wrapper path:focus,:host .component-wrapper .stacked-bar-segment:active,:host .component-wrapper .stacked-bar-segment:hover,:host .component-wrapper .stacked-bar-segment:focus{outline:none}:host .component-wrapper .stacked-bar-segment:active.stacked-bar-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:hover.stacked-bar-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:focus.stacked-bar-segment:not(:focus-visible){-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper path:active.doughnut-segment:not(:focus-visible),:host .component-wrapper path:hover.doughnut-segment:not(:focus-visible),:host .component-wrapper path:focus.doughnut-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:active.doughnut-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:hover.doughnut-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:focus.doughnut-segment:not(:focus-visible){-webkit-filter:url(#wmHoverDropShadow);filter:url(#wmHoverDropShadow)}:host .component-wrapper path::-moz-focus-inner,:host .component-wrapper .stacked-bar-segment::-moz-focus-inner{border:0;outline:none}:host .component-wrapper .stacked-bar-segment:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px;-webkit-box-shadow:0 0 0 7px white;box-shadow:0 0 0 7px white;z-index:1}:host .component-wrapper #kfbg1{stroke:white;stroke-width:10px}:host .component-wrapper #kfstroke{stroke:var(--wmcolor-interactive-focus);stroke-width:6px}:host .component-wrapper #kfbg2{stroke:white;stroke-width:2px}:host .component-wrapper.doughnut{width:300px}:host .component-wrapper.doughnut1 label,:host .component-wrapper.doughnut1 .label-text,:host .component-wrapper.doughnut2 label,:host .component-wrapper.doughnut2 .label-text,:host .component-wrapper.doughnut2b label,:host .component-wrapper.doughnut2b .label-text,:host .component-wrapper.doughnut3 label,:host .component-wrapper.doughnut3 .label-text{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper.doughnut{-ms-flex-align:center;align-items:center}:host .component-wrapper.doughnut label{text-align:center;width:100%;padding-bottom:1.5rem}:host .component-wrapper.doughnut label .subinfo{position:absolute}:host .component-wrapper.doughnut .completion-message{padding-top:0.625rem}:host .component-wrapper.bar{-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .component-wrapper.bar label .subinfo{position:initial}:host .component-wrapper.bar .chart-wrapper{display:-ms-flexbox;display:flex}:host .component-wrapper.bar .chart-wrapper .single-perc{width:4rem;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;height:30px;-ms-flex-align:center;align-items:center}:host .component-wrapper.bar .chart-wrapper .inner-stacked-bar-wrapper{-ms-flex:1;flex:1}:host .component-wrapper.bar .chart-wrapper .completion-message{width:100%;text-align:right;margin-top:0.25rem}@media screen and (min-width: 768px){:host .component-wrapper.bar{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;min-height:30px;width:12rem;text-align:left;padding-right:1.25rem;padding-bottom:0;-ms-flex:none;flex:none}:host .component-wrapper.bar .bar-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host .component-wrapper.bar .bar-wrapper .single-perc{text-align:center;padding-left:0.5rem;-ms-flex-pack:center;justify-content:center}}:host .component-wrapper.bar2,:host .component-wrapper.bar2b,:host .component-wrapper.bar3,:host .component-wrapper.bar4,:host .component-wrapper.bar5{-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar2b .inner-stacked-bar-wrapper,:host .component-wrapper.bar4 .inner-stacked-bar-wrapper,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper{height:30px;margin-bottom:0}:host .component-wrapper.bar2b .inner-stacked-bar-wrapper.show-values,:host .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values{height:60px;margin-top:0}:host .component-wrapper.bar3 .chart-wrapper{position:relative;height:100px}:host .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper{position:absolute;top:35px;left:0;right:0;bottom:0;height:30px}:host .component-wrapper.bar3 .chart-wrapper .axis{position:absolute;top:0;left:0;height:90px;width:100%;overflow:visible;-webkit-transform:translateY(90px);transform:translateY(90px)}:host .component-wrapper.bar3 .chart-wrapper .axis line{stroke:var(--wmcolor-chart-gridline);stroke-width:1px}:host .component-wrapper.bar3 .chart-wrapper .axis text{-webkit-transform:translate(4px, 24px);transform:translate(4px, 24px);text-anchor:middle}:host .component-wrapper.bar3 .hidden-values-warning{margin-top:1.25rem}:host .component-wrapper.bar6,:host .component-wrapper.bar7{--chartPadding:48px;-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar6 .chart-wrapper,:host .component-wrapper.bar7 .chart-wrapper{width:100%}:host .component-wrapper.bar6 .chart,:host .component-wrapper.bar7 .chart{position:relative;padding-right:var(--chartPadding)}:host .component-wrapper.bar6 .gridlines,:host .component-wrapper.bar7 .gridlines{position:absolute;left:var(--labelWidth);right:var(--chartPadding);top:0;bottom:0;background-image:linear-gradient(90deg, var(--wmcolor-chart-gridline) 1px, transparent 1px);background-position:-1px;border-left:1px solid var(--wmcolor-chart-gridline);border-bottom:1px solid var(--wmcolor-chart-gridline);background-size:var(--backgroundSize)}:host .component-wrapper.bar6 .rows,:host .component-wrapper.bar7 .rows{display:grid;grid-template-columns:var(--labelWidth) auto;grid-auto-rows:minmax(30px, 1fr);-ms-flex-align:center;align-items:center;position:relative;z-index:1}:host .component-wrapper.bar6 .rows .label,:host .component-wrapper.bar7 .rows .label{font-weight:400;padding:0 0.75rem 0 0;text-align:right;margin:0.75rem 0}:host .component-wrapper.bar6 .rows .label.hidden,:host .component-wrapper.bar7 .rows .label.hidden{visibility:hidden;white-space:nowrap}:host .component-wrapper.bar6 .bar,:host .component-wrapper.bar7 .bar{height:30px;position:relative}:host .component-wrapper.bar6 .bar .value,:host .component-wrapper.bar7 .bar .value{position:absolute;top:50%;right:-0.5rem;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host .component-wrapper.bar6 .x-axis,:host .component-wrapper.bar7 .x-axis{margin-left:var(--labelWidth);margin-right:var(--chartPadding);display:-ms-flexbox;display:flex;postion:relative}:host .component-wrapper.bar6 .tick,:host .component-wrapper.bar7 .tick{-ms-flex:1;flex:1;text-align:right}:host .component-wrapper.bar6 .tick span,:host .component-wrapper.bar7 .tick span{-webkit-transform:translateX(50%);transform:translateX(50%);display:inline-block}:host .component-wrapper.bar6 .zero,:host .component-wrapper.bar7 .zero{position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%)}:host .component-wrapper.bar6 .bar:active,:host .component-wrapper.bar6 .bar:hover,:host .component-wrapper.bar6 .bar:focus,:host .component-wrapper.bar7 .bar:active,:host .component-wrapper.bar7 .bar:hover,:host .component-wrapper.bar7 .bar:focus{outline:none}:host .component-wrapper.bar6 .bar:active.bar:not(:focus-visible),:host .component-wrapper.bar6 .bar:hover.bar:not(:focus-visible),:host .component-wrapper.bar6 .bar:focus.bar:not(:focus-visible),:host .component-wrapper.bar7 .bar:active.bar:not(:focus-visible),:host .component-wrapper.bar7 .bar:hover.bar:not(:focus-visible),:host .component-wrapper.bar7 .bar:focus.bar:not(:focus-visible){-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper.bar6 .bar:focus-visible,:host .component-wrapper.bar7 .bar:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px;-webkit-box-shadow:0 0 0 7px white;box-shadow:0 0 0 7px white;z-index:1}:host .component-wrapper.left-label{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.left-label .label{width:12rem;padding-right:1.25rem;-ms-flex:none;flex:none;-ms-flex-item-align:end;align-self:flex-end;min-height:30px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .component-wrapper .hidden-values-warning{font-size:0.75rem;font-style:italic;max-width:100%}:host .component-wrapper .hidden-values-warning.hidden{display:none}@media print{:host .component-wrapper .hidden-values-warning{display:none}}:host #chart-instructions{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper .legend-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-align:center}:host .component-wrapper .legend-wrapper .legend{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;text-align:center;padding-top:0.25rem;padding-bottom:0.75rem;-webkit-box-sizing:border-box;box-sizing:border-box}:host .component-wrapper .legend-wrapper .legend.bar6{display:none}:host .component-wrapper .legend-wrapper .legend.--top{margin-top:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-item{padding-top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-color{top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom{margin-bottom:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-item{padding-bottom:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-color{top:-0.75rem}:host .component-wrapper .legend-wrapper .legend .legend-item{position:relative}:host .component-wrapper .legend-wrapper .legend .legend-item.faded{opacity:0.3}:host .component-wrapper .legend-wrapper .legend .legend-item:not(:last-of-type){padding-right:1.25rem}:host .component-wrapper .legend-wrapper .legend .legend-text{font-size:0.875rem;padding-left:1rem;line-height:1}:host .component-wrapper .legend-wrapper .legend .legend-color{position:absolute;left:0;bottom:0;margin:auto;width:0.6875rem;height:0.6875rem;print-color-adjust:exact;-webkit-print-color-adjust:exact}:host .component-wrapper .legend-wrapper .legend .print-value{display:none}:host .component-wrapper .legend-wrapper .legend .print-value.force-visible{display:unset}@media print{:host .component-wrapper .legend-wrapper .legend .print-value{display:unset}}:host .component-wrapper .legend-wrapper .legend.bar3{padding-bottom:1.25rem}";
+const wmChartCss = ":host{--wmcolor-chart-label-text-negative:var(--wmcolor-text-negative);--wmcolor-chart-label-text-positive:var(--wmcolor-text-positive);--wmcolor-chart-label-text:var(--wmcolor-text);--wmcolor-chart-subinfo-text:var(--wmcolor-text);--wmcolor-chart-value-text:var(--wmcolor-text);display:block}:host .component-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;font-size:0.875rem;position:relative;outline:none;}:host .component-wrapper:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px}:host .component-wrapper .label{display:block;margin:0;padding-bottom:0.25rem;font-weight:600;position:relative}:host .component-wrapper .label .subinfo{display:block;font-weight:normal;font-style:italic;bottom:0.25rem;width:100%;color:var(--wmcolor-chart-subinfo-text)}:host .component-wrapper .label.custom-width{width:var(--custom-label-width)}:host .component-wrapper .label.--none{display:none}:host .component-wrapper .doughnut-svg,:host .component-wrapper .inner-stacked-bar-wrapper{overflow:visible}:host .component-wrapper .bar-wrapper{-ms-flex-positive:1;flex-grow:1;width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper{width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .values{display:-ms-flexbox;display:flex;gap:2px;margin-bottom:8px}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper{display:-ms-flexbox;display:flex;gap:2px}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment{height:30px;cursor:pointer}:host .component-wrapper .segment{print-color-adjust:exact;-webkit-print-color-adjust:exact}:host .component-wrapper .segment.fixed-width{-ms-flex-negative:0;flex-shrink:0}:host .component-wrapper .doughnut-wrapper{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px}:host .component-wrapper .doughnut-wrapper .doughnut-segment{cursor:pointer}:host .component-wrapper .value-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .component-wrapper .value-wrapper .fixed-width{-ms-flex-negative:0;flex-shrink:0}:host .component-wrapper .value-wrapper .value.hidden{visibility:hidden}:host .component-wrapper .faded{opacity:0.3}:host .component-wrapper path:active,:host .component-wrapper path:hover,:host .component-wrapper path:focus,:host .component-wrapper .stacked-bar-segment:active,:host .component-wrapper .stacked-bar-segment:hover,:host .component-wrapper .stacked-bar-segment:focus{outline:none}:host .component-wrapper .stacked-bar-segment:active.stacked-bar-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:hover.stacked-bar-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:focus.stacked-bar-segment:not(:focus-visible){-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper path:active.doughnut-segment:not(:focus-visible),:host .component-wrapper path:hover.doughnut-segment:not(:focus-visible),:host .component-wrapper path:focus.doughnut-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:active.doughnut-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:hover.doughnut-segment:not(:focus-visible),:host .component-wrapper .stacked-bar-segment:focus.doughnut-segment:not(:focus-visible){-webkit-filter:url(#wmHoverDropShadow);filter:url(#wmHoverDropShadow)}:host .component-wrapper path::-moz-focus-inner,:host .component-wrapper .stacked-bar-segment::-moz-focus-inner{border:0;outline:none}:host .component-wrapper .stacked-bar-segment:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px;-webkit-box-shadow:0 0 0 7px white;box-shadow:0 0 0 7px white;z-index:1}:host .component-wrapper #kfbg1{stroke:white;stroke-width:10px}:host .component-wrapper #kfstroke{stroke:var(--wmcolor-interactive-focus);stroke-width:6px}:host .component-wrapper #kfbg2{stroke:white;stroke-width:2px}:host .component-wrapper.doughnut{width:300px}:host .component-wrapper.doughnut1 label,:host .component-wrapper.doughnut1 .label-text,:host .component-wrapper.doughnut2 label,:host .component-wrapper.doughnut2 .label-text,:host .component-wrapper.doughnut3 label,:host .component-wrapper.doughnut3 .label-text{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper.doughnut{-ms-flex-align:center;align-items:center}:host .component-wrapper.doughnut label{text-align:center;width:100%;padding-bottom:1.5rem}:host .component-wrapper.doughnut label .subinfo{position:absolute}:host .component-wrapper.doughnut .completion-message{padding-top:0.625rem}:host .component-wrapper.bar{-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .component-wrapper.bar label .subinfo{position:initial}:host .component-wrapper.bar .chart-wrapper{display:-ms-flexbox;display:flex}:host .component-wrapper.bar .chart-wrapper .single-perc{width:4rem;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;height:30px;-ms-flex-align:center;align-items:center}:host .component-wrapper.bar .chart-wrapper .inner-stacked-bar-wrapper{-ms-flex:1;flex:1}:host .component-wrapper.bar .chart-wrapper .completion-message{width:100%;text-align:right;margin-top:0.25rem}@media screen and (min-width: 768px){:host .component-wrapper.bar{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;min-height:30px;width:12rem;text-align:left;padding-right:1.25rem;padding-bottom:0;-ms-flex:none;flex:none}:host .component-wrapper.bar .bar-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host .component-wrapper.bar .bar-wrapper .single-perc{text-align:center;padding-left:0.5rem;-ms-flex-pack:center;justify-content:center}}:host .component-wrapper.bar2,:host .component-wrapper.bar3,:host .component-wrapper.bar4,:host .component-wrapper.bar5{-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar4 .inner-stacked-bar-wrapper,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper{height:30px;margin-bottom:0}:host .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values{height:60px;margin-top:0}:host .component-wrapper.bar3 .chart-wrapper{position:relative;height:100px}:host .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper{position:absolute;top:35px;left:0;right:0;bottom:0;height:30px}:host .component-wrapper.bar3 .chart-wrapper .axis{position:absolute;top:0;left:0;height:90px;width:100%;overflow:visible;-webkit-transform:translateY(90px);transform:translateY(90px)}:host .component-wrapper.bar3 .chart-wrapper .axis line{stroke:var(--wmcolor-chart-gridline);stroke-width:1px}:host .component-wrapper.bar3 .chart-wrapper .axis text{-webkit-transform:translate(4px, 24px);transform:translate(4px, 24px);text-anchor:middle}:host .component-wrapper.bar3 .hidden-values-warning{margin-top:1.25rem}:host .component-wrapper.bar6,:host .component-wrapper.bar7{--chartPadding:48px;-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar6 .chart-wrapper,:host .component-wrapper.bar7 .chart-wrapper{width:100%}:host .component-wrapper.bar6 .chart,:host .component-wrapper.bar7 .chart{position:relative;padding-right:var(--chartPadding)}:host .component-wrapper.bar6 .gridlines,:host .component-wrapper.bar7 .gridlines{position:absolute;left:var(--labelWidth);right:var(--chartPadding);top:0;bottom:0;background-image:linear-gradient(90deg, var(--wmcolor-chart-gridline) 1px, transparent 1px);background-position:-1px;border-left:1px solid var(--wmcolor-chart-gridline);border-bottom:1px solid var(--wmcolor-chart-gridline);background-size:var(--backgroundSize)}:host .component-wrapper.bar6 .rows,:host .component-wrapper.bar7 .rows{display:grid;grid-template-columns:var(--labelWidth) auto;grid-auto-rows:minmax(30px, 1fr);-ms-flex-align:center;align-items:center;position:relative;z-index:1}:host .component-wrapper.bar6 .rows .label,:host .component-wrapper.bar7 .rows .label{font-weight:400;padding:0 0.75rem 0 0;text-align:right;margin:0.75rem 0}:host .component-wrapper.bar6 .rows .label.hidden,:host .component-wrapper.bar7 .rows .label.hidden{visibility:hidden;white-space:nowrap}:host .component-wrapper.bar6 .bar,:host .component-wrapper.bar7 .bar{height:30px;position:relative}:host .component-wrapper.bar6 .bar .value,:host .component-wrapper.bar7 .bar .value{position:absolute;top:50%;right:-0.5rem;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host .component-wrapper.bar6 .x-axis,:host .component-wrapper.bar7 .x-axis{margin-left:var(--labelWidth);margin-right:var(--chartPadding);display:-ms-flexbox;display:flex;postion:relative}:host .component-wrapper.bar6 .tick,:host .component-wrapper.bar7 .tick{-ms-flex:1;flex:1;text-align:right}:host .component-wrapper.bar6 .tick span,:host .component-wrapper.bar7 .tick span{-webkit-transform:translateX(50%);transform:translateX(50%);display:inline-block}:host .component-wrapper.bar6 .zero,:host .component-wrapper.bar7 .zero{position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%)}:host .component-wrapper.bar6 .bar:active,:host .component-wrapper.bar6 .bar:hover,:host .component-wrapper.bar6 .bar:focus,:host .component-wrapper.bar7 .bar:active,:host .component-wrapper.bar7 .bar:hover,:host .component-wrapper.bar7 .bar:focus{outline:none}:host .component-wrapper.bar6 .bar:active.bar:not(:focus-visible),:host .component-wrapper.bar6 .bar:hover.bar:not(:focus-visible),:host .component-wrapper.bar6 .bar:focus.bar:not(:focus-visible),:host .component-wrapper.bar7 .bar:active.bar:not(:focus-visible),:host .component-wrapper.bar7 .bar:hover.bar:not(:focus-visible),:host .component-wrapper.bar7 .bar:focus.bar:not(:focus-visible){-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper.bar6 .bar:focus-visible,:host .component-wrapper.bar7 .bar:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px;-webkit-box-shadow:0 0 0 7px white;box-shadow:0 0 0 7px white;z-index:1}:host .component-wrapper.left-label{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.left-label .label{width:12rem;padding-right:1.25rem;-ms-flex:none;flex:none;-ms-flex-item-align:end;align-self:flex-end;min-height:30px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .component-wrapper .hidden-values-warning{font-size:0.75rem;font-style:italic;max-width:100%}:host .component-wrapper .hidden-values-warning.hidden{display:none}@media print{:host .component-wrapper .hidden-values-warning{display:none}}:host #chart-instructions{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper .legend-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-align:center}:host .component-wrapper .legend-wrapper .legend{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;text-align:center;padding-top:0.25rem;padding-bottom:0.75rem;-webkit-box-sizing:border-box;box-sizing:border-box}:host .component-wrapper .legend-wrapper .legend.bar6{display:none}:host .component-wrapper .legend-wrapper .legend.--top{margin-top:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-item{padding-top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-color{top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom{margin-bottom:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-item{padding-bottom:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-color{top:-0.75rem}:host .component-wrapper .legend-wrapper .legend .legend-item{position:relative}:host .component-wrapper .legend-wrapper .legend .legend-item.faded{opacity:0.3}:host .component-wrapper .legend-wrapper .legend .legend-item:not(:last-of-type){padding-right:1.25rem}:host .component-wrapper .legend-wrapper .legend .legend-text{font-size:0.875rem;padding-left:1rem;line-height:1}:host .component-wrapper .legend-wrapper .legend .legend-color{position:absolute;left:0;bottom:0;margin:auto;width:0.6875rem;height:0.6875rem;print-color-adjust:exact;-webkit-print-color-adjust:exact}:host .component-wrapper .legend-wrapper .legend .print-value{display:none}:host .component-wrapper .legend-wrapper .legend .print-value.force-visible{display:unset}@media print{:host .component-wrapper .legend-wrapper .legend .print-value{display:unset}}:host .component-wrapper .legend-wrapper .legend.bar3{padding-bottom:1.25rem}";
 
 const Chart = class {
     constructor(hostRef) {
@@ -38,16 +38,7 @@ const Chart = class {
         return Array.from(this.el.shadowRoot.querySelectorAll(".segment"));
     }
     get currentChartType() {
-        let current = this.chartType;
-        if (this.chartType === "doughnut2" && this.el.children.length > 3) {
-            // render an internal type (that includes an additional color) if doughnut2 has more than 3 slices
-            current = "doughnut2b";
-        }
-        else if (this.chartType === "bar2" && this.el.children.length > 4) {
-            // render an internal type (that includes an additional color) if bar2 has more than 4 slices ("conditonally met" color)
-            current = "bar2b";
-        }
-        return current;
+        return this.chartType;
     }
     get chartDetails() {
         return allChartsDetails[this.currentChartType];

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

@@ -436,7 +436,11 @@ const DateRange = class {
         }
     }
     render() {
-        return (h(Host, { "aria-busy": "false" }, h("div", { ref: (d) => (this.wrapperEl = d), class: "wrapper" }, h("div", { class: `range-wrapper ${this.calWidth <= this.availSpace ? "cal" : ""}` }, h("div", { class: "label-wrapper", id: "start-label-wrapper" }, h("label", { ref: (e) => (this.labelEl = e), id: "startlabel", htmlFor: "start-date-input", class: "label", title: `${this.labelStart} (${this.dateFormat})` }, this.labelStart, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("div", { class: "label-wrapper", id: "end-label-wrapper" }, h("label", { id: "endlabel", htmlFor: "end-date-input", class: "label", title: `${this.labelEnd} (${this.dateFormat})` }, this.labelEnd, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("input", { 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": "error", "aria-label": this.labelStart, "aria-required": this.requiredField ? "true" : null }), h("div", { id: "hyphen" }, "\u00A0-\u00A0"), h("input", { 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": "error", "aria-label": this.labelEnd, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "toggle-wrapper", id: "toggle-wrapper" }, this.calWidth <= this.availSpace && (h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { class: "calendar", title: intl.formatMessage({
+        return (h(Host, { "aria-busy": "false" }, h("div", { ref: (d) => (this.wrapperEl = d), class: "wrapper" }, h("div", { class: `range-wrapper ${this.calWidth <= this.availSpace ? "cal" : ""}` }, h("div", { class: "label-wrapper", id: "start-label-wrapper" }, h("label", { ref: (e) => (this.labelEl = e), id: "startlabel", htmlFor: "start-date-input", class: "label", title: `${this.labelStart} (${this.dateFormat})` }, this.labelStart, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("div", { class: "label-wrapper", id: "end-label-wrapper" }, h("label", { id: "endlabel", htmlFor: "end-date-input", class: "label", title: `${this.labelEnd} (${this.dateFormat})` }, this.labelEnd, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*")))), h("input", { 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": "error", "aria-label": this.labelStart, "aria-required": this.requiredField ? "true" : null }), h("div", { id: "hyphen" }, "\u00A0-\u00A0"), h("input", { 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": "error", "aria-label": this.labelEnd, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "toggle-wrapper", id: "toggle-wrapper" }, this.calWidth <= this.availSpace && (h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "start-date-input end-date-input", "aria-label": 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" }, h("span", { class: "calendar", title: intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",

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

@@ -220,7 +220,11 @@ const DatePicker = class {
         this.liveRegionEl.textContent = message;
     }
     render() {
-        return (h(Host, { "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, h("div", { ref: (d) => (this.dpWrapperEl = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, h("div", { class: "label-wrapper", ref: (e) => (this.labelWrapperEl = e) }, this.labelPosition !== "none" && (h("label", { id: "datepickerLabel", htmlFor: "date-input", class: "label", title: `${this.label} (${this.dateFormat})` }, this.label, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*"))))), h("div", null, h("div", { class: "single-wrapper input" }, h("input", { 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": "error", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "container", id: "wm-container" }, h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { class: "calendar", title: intl.formatMessage({
+        return (h(Host, { "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, h("div", { ref: (d) => (this.dpWrapperEl = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, h("div", { class: "label-wrapper", ref: (e) => (this.labelWrapperEl = e) }, this.labelPosition !== "none" && (h("label", { id: "datepickerLabel", htmlFor: "date-input", class: "label", title: `${this.label} (${this.dateFormat})` }, this.label, this.requiredField && (h("span", { "aria-hidden": "true", class: "required" }, "*"))))), h("div", null, h("div", { class: "single-wrapper input" }, h("input", { 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": "error", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), h("div", { class: "container", id: "wm-container" }, h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-label": 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" }, h("span", { class: "calendar", title: intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",

package/dist/esm/wm-line-chart.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-558b5a82.js';
 import { d as debounce, E as transposeMatrix, x as csvToArray, F as wrapAround, G as getSmallestSkipInterval, H as calcPercentageInRange } from './functions-46843ea0.js';
-import { n as abbrNumber, o as getInterval } from './chartFunctions-d3fd6e7c.js';
+import { n as abbrNumber, o as getInterval } from './chartFunctions-0ebf83f3.js';
 import { l as lineChartMessages, c as chartMessages, g as globalMessages } from './intl-8b8740b9.js';
 
 const wmLineChartCss = ":host{--wmcolor-linechart-currentposition:var(--wmcolor-lavender);--wmcolor-linechart-delta-text-negative:var(--wmcolor-text-negative);--wmcolor-linechart-delta-text-positive:var(--wmcolor-text-positive);--wmcolor-linechart-gridline:var(--wmcolor-chart-gridline);--wmcolor-linechart-highlight-background:var(--wmcolor-interactive-background-highlight);--wmcolor-linechart-popover-background:var(--wmcolor-chart-popover-background);display:block;height:500px;width:100%;font-size:14px;overflow-y:visible;overflow-x:auto}:host .component-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:562px;width:100%;height:100%;outline:none}:host .icon{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;position:relative;color:var(--iconColor);-webkit-transform:var(--translation, unset);transform:var(--translation, unset)}:host .icon:before{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:var(--icon);padding:0 3px;z-index:1}:host .icon:after{color:white;position:absolute;left:3px;-webkit-transform:scale(180%);transform:scale(180%);display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:var(--icon);z-index:0}:host .legend{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:8px 16px;margin-top:4px;margin-bottom:16px}:host .legend .legend-label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;cursor:default;font-weight:600}:host .legend .legend-label.faded{opacity:0.3}:host .legend .legend-label .icon{margin-right:4px}:host .legend .visibility-toggle{margin-left:4px}:host .chart-wrapper{position:relative;-ms-flex-positive:1;flex-grow:1;display:grid;grid-template-columns:auto auto 1fr;grid-template-rows:1fr auto auto;margin-right:16px}:host .chart-label{font-size:14px;font-weight:600}:host .chart-label.--y-axis{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;width:var(--labelWidth);align-self:center;margin-right:16px;grid-area:1/1/2/2;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}:host .chart-label.--x-axis{margin-top:16px;text-align:center;grid-area:3/3/4/4}:host .y-intervals{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;grid-area:1/2/2/3;margin-right:4px}:host .y-intervals .y-interval{text-align:right}:host .x-intervals{display:grid;grid-template-columns:var(--columns);grid-area:2/3/3/4;line-height:1;margin-top:4px}:host .x-intervals .x-interval{text-align:center}:host .x-intervals .x-interval:first-child{text-align:left}:host .x-intervals .x-interval:last-child{text-align:right}:host .x-intervals .x-interval.hidden{visibility:hidden}:host .plot-area{position:relative;grid-area:1/3/2/4;background-image:linear-gradient(90deg, var(--wmcolor-linechart-gridline) 1px, transparent 1px);border-bottom:1px solid var(--wmcolor-linechart-gridline);background-size:var(--backgroundSize)}:host .plot-area.right-border{border-right:1px solid var(--wmcolor-linechart-gridline)}:host .line{position:absolute;width:100%;height:100%}:host .line .icon{position:absolute;-webkit-transform:var(--translation);transform:var(--translation);left:var(--xPosition);top:var(--yPosition);z-index:1}:host .line .icon:focus{z-index:2;outline:none}:host .line .icon:focus:before{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:0;border-radius:3px}:host .line .line-svg{height:100%;width:100%}:host .line.faded{opacity:0.3}:host .line.focused{z-index:1}:host .line.hidden{visibility:hidden}:host .hover-area-wrapper{position:absolute;width:100%;height:100%;top:0;left:0;display:grid;grid-template-rows:1fr;grid-template-columns:var(--columns)}:host .hover-indicator{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;height:100%;width:2px;border:1px solid var(--wmcolor-linechart-currentposition);-webkit-transform:translateX(-50%);transform:translateX(-50%);left:var(--xPosition);grid-column:3/4;grid-row:1/2;pointer-events:none}:host .popover{width:-webkit-max-content;width:-moz-max-content;width:max-content;max-width:400px;background-color:var(--wmcolor-linechart-popover-background);position:absolute;top:var(--topPosition, 0);left:var(--leftPosition, unset);right:var(--rightPosition, unset);padding:16px;border-radius:5px;-webkit-box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.09);box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.09);-webkit-transform:translateY(-50%);transform:translateY(-50%);line-height:1;z-index:3;grid-column:3/4;grid-row:1/2;pointer-events:none;-webkit-box-sizing:border-box;box-sizing:border-box}:host .popover .title{font-size:16px;font-weight:600}:host .popover .comparison-title{font-style:italic;margin-top:4px}:host .popover .unit{font-size:12px;font-weight:600}:host .popover .unit.--x{margin-left:4px}:host .popover .popover-table{margin-top:16px}:host .popover .popover-table .popover-row{line-height:1}:host .popover .popover-table .popover-row:not(:last-child) td{padding-bottom:8px}:host .popover .popover-table .popover-row .row-label{font-weight:600;padding-right:16px;overflow-wrap:anywhere}:host .popover .popover-table .popover-row .row-label .icon{margin-right:4px}:host .popover .popover-table .popover-row .row-value,:host .popover .popover-table .popover-row .delta{text-align:right;white-space:nowrap}:host .popover .popover-table .popover-row .delta{padding-left:12px;font-weight:600}:host .popover .popover-table .popover-row .delta.--positive{color:var(--wmcolor-linechart-delta-text-positive)}:host .popover .popover-table .popover-row .delta.--negative{color:var(--wmcolor-linechart-delta-text-negative)}:host .highlight{position:absolute;height:100%;background-color:color-mix(in srgb, var(--wmcolor-linechart-highlight-background) 60%, transparent);left:var(--startPercentage);right:var(--endPercentage)}:host .sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}";