@watermarkinsights/ripple 5.2.0 → 5.2.1-0

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

@@ -1,9 +1,10 @@
-import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-f164fbca.js';
-import { g as generateId, d as debounce } from './functions-58918a32.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-d2d8f1b2.js';
-import { c as chartMessages } from './intl-f9d79dff.js';
+import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-7923308f.js';
+import { g as generateId, d as debounce } from './functions-f317d2d6.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-8098e455.js';
+import { c as chartMessages } from './intl-00a637cf.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 WmChartStyle0 = wmChartCss;
 
 const Chart = class {
     constructor(hostRef) {
@@ -152,11 +153,11 @@ const Chart = class {
         }
     }
     render() {
-        return (h(Host, { onBlur: () => exitChart.call(this) }, h("div", { 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": chartMessages.interactiveChart, "aria-describedby": "chart-instructions" }, h("label", { id: `label-${this.uid}`, class: `label --${this.labelPosition}`, htmlFor: `graphic-${this.uid}` }, h("span", { class: "label-text" }, this.label), this.subinfo ? h("span", { class: "subinfo" }, this.subinfo) : ""), this.isBar && renderLegend.call(this, this.currentChartType), this.renderChart(), this.isDoughnut && renderLegend.call(this, this.currentChartType), h("priv-chart-popover", { class: this.isTabbing ? "user-is-tabbing" : "", onIntChartPopoverOpenChanged: (ev) => this.handlePopoverOpenChanged(ev) }), this.isBar && !this.printMode && renderHiddenValuesMessage()), renderInstructionsText()));
+        return (h(Host, { key: '5658836a6dc6d82e1ad8a4b50b9a138d51610a80', onBlur: () => exitChart.call(this) }, h("div", { key: '2105ff07fcad69e0175a2bde4f8fdfe08001174d', 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": chartMessages.interactiveChart, "aria-describedby": "chart-instructions" }, h("label", { key: 'e74a5954793ec614b54330fe630d3b27abfd269a', id: `label-${this.uid}`, class: `label --${this.labelPosition}`, htmlFor: `graphic-${this.uid}` }, h("span", { key: 'a93567158427b56fbdc1bf23142bda5805739a4c', class: "label-text" }, this.label), this.subinfo ? h("span", { class: "subinfo" }, this.subinfo) : ""), this.isBar && renderLegend.call(this, this.currentChartType), this.renderChart(), this.isDoughnut && renderLegend.call(this, this.currentChartType), h("priv-chart-popover", { key: 'fb213ab70496d4c9655bb51211ab4f8df7d4ab68', class: this.isTabbing ? "user-is-tabbing" : "", onIntChartPopoverOpenChanged: (ev) => this.handlePopoverOpenChanged(ev) }), this.isBar && !this.printMode && renderHiddenValuesMessage()), renderInstructionsText()));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
 };
-Chart.style = wmChartCss;
+Chart.style = WmChartStyle0;
 
 export { Chart as wm_chart };

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

@@ -1,7 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-f164fbca.js';
-import { t as toBool, a as handleDisabledAttribute } from './functions-58918a32.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-7923308f.js';
+import { t as toBool, a as handleDisabledAttribute } from './functions-f317d2d6.js';
 
 const wmDatepickerCss = ":host{--wmcolor-datepicker-background:var(--wmcolor-background);--wmcolor-datepicker-day-background-hover:var(--wmcolor-interactive-background-hover);--wmcolor-datepicker-day-background-selected:var(--wmcolor-interactive);--wmcolor-datepicker-day-text-outside:var(--wmcolor-interactive-disabled);--wmcolor-datepicker-day-text-selected:var(--wmcolor-interactive-text-selected);--wmcolor-datepicker-day-text:var(--wmcolor-text);--wmcolor-datepicker-input-background-disabled:var(--wmcolor-input-background-disabled);--wmcolor-datepicker-input-background:var(--wmcolor-input-background);--wmcolor-datepicker-input-border:var(--wmcolor-input-border);--wmcolor-datepicker-input-text-disabled:var(--wmcolor-input-text-disabled);--wmcolor-datepicker-input-text:var(--wmcolor-input-text);--wmcolor-datepicker-month-background-hover:var(--wmcolor-interactive-background-hover);--wmcolor-datepicker-month-background-selected:var(--wmcolor-interactive);--wmcolor-datepicker-month-background:var(--wmcolor-text);--wmcolor-datepicker-month-border:var(--wmcolor-border-light);--wmcolor-datepicker-month-text-selected:var(--wmcolor-text-ondark);--wmcolor-datepicker-month-text:var(--wmcolor-interactive);--wmcolor-datepicker-navigation-background-hover:var(--wmcolor-button-background-navigational-hover);--wmcolor-datepicker-navigation-background:var(--wmcolor-button-background-navigational);--wmcolor-datepicker-navigation-text:var(--wmcolor-button-icon-navigational);--wmcolor-datepicker-selector-background:var(--wmcolor-button-background-secondary);--wmcolor-datepicker-selector-border:var(--wmcolor-button-border-secondary);--wmcolor-datepicker-selector-text:var(--wmcolor-button-text-secondary);--wmcolor-datepicker-toggle-background-disabled:var(--wmcolor-input-background-disabled);--wmcolor-datepicker-toggle-background-hover:var(--wmcolor-interactive-background-hover);--wmcolor-datepicker-toggle-background:var(--wmcolor-input-background);--wmcolor-datepicker-toggle-icon-disabled:var(--wmcolor-interactive-disabled);--wmcolor-datepicker-toggle-icon:var(--wmcolor-interactive);--wmcolor-datepicker-weekdays-background:var(--wmcolor-table-header-background);--wmcolor-datepicker-weekdays-text:var(--wmcolor-text);font-family:inherit}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}:host .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required{color:var(--wmcolor-text-required)}:host .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}:host .wrapper.label-none label{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 .wrapper.invalid .label{color:var(--wmcolor-text-error)}:host .wrapper.invalid .label:after{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:\"\\f026\";margin-left:0.3125rem}[dir=RTL] :host .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper{position:relative}:host .wrapper .inner-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.5rem;border:1px solid;border-color:var(--wmcolor-datepicker-input-border);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;max-width:236px;-ms-flex-pack:justify;justify-content:space-between;position:relative}:host .wrapper .inner-wrapper .date-input{-moz-border-top-left-radius:3px;-webkit-border-top-left-radius:3px;border-top-left-radius:3px;-moz-border-bottom-left-radius:3px;-webkit-border-bottom-left-radius:3px;border-bottom-left-radius:3px;border:none;color:var(--wmcolor-datepicker-input-text);font-size:0.875rem;padding:0.625rem 0.9375rem 0.5rem;min-width:0;height:100%;-ms-flex:1;flex:1;margin:0;background-color:var(--wmcolor-datepicker-input-background)}:host .wrapper .inner-wrapper .date-input:disabled{background-color:var(--wmcolor-datepicker-input-background-disabled);color:var(--wmcolor-datepicker-input-text-disabled)}:host .wrapper .inner-wrapper .date-input:focus{outline:none}:host .wrapper.invalid .inner-wrapper{-webkit-box-shadow:0 0 0 1px var(--wmcolor-input-border-error);-moz-box-shadow:0 0 0 1px var(--wmcolor-input-border-error);box-shadow:0 0 0 1px var(--wmcolor-input-border-error);border-color:var(--wmcolor-input-border-error)}:host .wrapper.invalid .error{display:block;font-style:italic;color:var(--wmcolor-text-error);font-size:0.875rem;margin-bottom:4px;top:100%;left:0}:host .wrapper.invalid .error:not(:empty){margin-top:0.25rem}:host .wrapper.focus .inner-wrapper{outline:2px solid var(--wmcolor-input-border-focus);border-color:var(--wmcolor-input-border-focus)}:host .toggle:focus-visible:not(:active){border:none;z-index:11}";
+const WmDatepickerStyle0 = wmDatepickerCss;
 
 const DatePicker = class {
     constructor(hostRef) {
@@ -160,7 +161,7 @@ const DatePicker = class {
         this.liveRegionEl.textContent = message;
     }
     render() {
-        return (h(Host, { "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, h("div", { ref: (d) => (this.dpWrapper = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, h("div", { class: "label-wrapper" }, 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: "inner-wrapper" }, h("input", { disabled: this.isDisabled, type: "text", id: "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-controls": "popup", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), h("priv-datepicker", { disabled: this.isDisabled, date: new Date(this.calendarDate) })), h("div", { id: "error", class: "error" }, this.errorMessage), h("div", { ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" })))));
+        return (h(Host, { key: '2357d2acce1516da9ef581299941b18e9a8656a0', "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, h("div", { key: '4b37444e90cfdace3710e757a92ead581fa9b2d4', ref: (d) => (this.dpWrapper = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, h("div", { key: 'f359a059a43f4b851224a2673b2de619b3b18896', class: "label-wrapper" }, this.labelPosition !== "none" && (h("label", { key: '75bcc41d162c2dc9f835f191281ab042e16cc13a', id: "datepickerLabel", htmlFor: "date-input", class: "label", title: `${this.label} (${this.dateFormat})` }, this.label, this.requiredField && (h("span", { key: 'ab3561792397546abea112fa4e71ae5fe2ba681e', "aria-hidden": "true", class: "required" }, "*"))))), h("div", { key: '8215fc4e40c6e12fa3e9d4aece423a708b3485f8' }, h("div", { key: 'a6cbf33a1f9d7d782522527b996861da68dd9bfe', class: "inner-wrapper" }, h("input", { key: 'f261261c18c783703d6b8464123fd3ce2502dc04', disabled: this.isDisabled, type: "text", id: "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-controls": "popup", "aria-label": this.label, "aria-required": this.requiredField ? "true" : null }), h("priv-datepicker", { key: 'da694558929d694fb143986a2308b5e42a8379c9', disabled: this.isDisabled, date: new Date(this.calendarDate) })), h("div", { key: '4a7aaf7fd5f90668ad93670cfed1296d94a71411', id: "error", class: "error" }, this.errorMessage), h("div", { key: 'c3bc386d98cda6026c2aaeb5cbc840347f0b1128', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" })))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
@@ -170,6 +171,6 @@ const DatePicker = class {
         "errorMessage": ["announceError"]
     }; }
 };
-DatePicker.style = wmDatepickerCss;
+DatePicker.style = WmDatepickerStyle0;
 
 export { DatePicker as wm_datepicker };

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

@@ -1,18 +1,19 @@
-import { r as registerInstance, h, g as getElement } from './index-f164fbca.js';
+import { r as registerInstance, h, g as getElement } from './index-7923308f.js';
 
 const wmFileListCss = ":host{display:block}.list-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:0.5rem}";
+const WmFileListStyle0 = wmFileListCss;
 
 const FileList = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.showInfo = "time";
+        this.showInfo = "last-updated";
     }
     render() {
-        return (h("div", { role: "list", class: "list-wrapper" }, h("slot", null)));
+        return (h("div", { key: '30abafa7fee70c670e4d8ccb96e4f732dad2608b', role: "list", class: "list-wrapper" }, h("slot", { key: 'c04f52d9eeba9b297fd7250c2e72de47b441ba9c' })));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
 };
-FileList.style = wmFileListCss;
+FileList.style = WmFileListStyle0;
 
 export { FileList as wm_file_list };

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

@@ -1,7 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-f164fbca.js';
-import { i as intl, j as truncateText, s as showTooltip, h as hideTooltip } from './functions-58918a32.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-7923308f.js';
+import { i as intl, j as truncateText, s as showTooltip, h as hideTooltip } from './functions-f317d2d6.js';
 
 const wmFileCss = ":host{--wmcolor-file-background-error:var(--wmcolor-background-error);--wmcolor-file-background:var(--wmcolor-background-readonly);--wmcolor-file-border-error:var(--wmcolor-border-error);--wmcolor-file-border:var(--wmcolor-border);--wmcolor-file-checkmark-icon:var(--wmcolor-positive);--wmcolor-file-progress:var(--wmcolor-progress);display:block;width:100%}.file-wrapper{font-size:0.875rem;position:relative;list-style:none}.file-wrapper .file{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;min-height:3.5rem;padding:0.5rem 1.25rem;position:relative;background:var(--wmcolor-file-background);border:1px solid var(--wmcolor-file-border);display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center}.file-wrapper .file .filename{display:inline-block;white-space:nowrap}.file-wrapper .file .left-group{overflow:hidden;min-width:5.3125rem;-ms-flex-positive:1;flex-grow:1}.file-wrapper .file .right-group{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:end;-ms-flex-align:center;align-items:center;gap:1rem;min-width:0;padding-left:5rem}.file-wrapper .file .right-group.condensed{padding-left:2.5rem}.file-wrapper .file .right-group .file-controls{display:-ms-flexbox;display:flex;gap:1rem}.file-wrapper .file .right-group .file-info{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:end;align-items:end;gap:0.25rem;text-align:right;min-width:8.5rem;max-width:450px;-ms-flex:1;flex:1}.file-wrapper .file .right-group .file-info .uploader-name{max-width:100%;overflow-wrap:break-word}.file-wrapper .file.--error{border:1px solid var(--wmcolor-file-border-error);background-color:var(--wmcolor-file-background-error);height:3.75rem}.file-wrapper.checked .file:after{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:\"\\f133\";position:absolute;right:-44px;color:var(--wmcolor-file-checkmark-icon);font-size:28px;line-height:1}.name-wrapper{overflow:hidden}.progress{position:absolute;left:0;top:0;right:0;height:8px}.error-message{display:block;font-style:italic;color:var(--wmcolor-text-error);font-size:0.875rem}.error-message:not(:empty){margin-top:0.25rem}.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}";
+const WmFileStyle0 = wmFileCss;
 
 const File = class {
     constructor(hostRef) {
@@ -176,11 +177,11 @@ const File = class {
         return (h("div", { class: `file-wrapper ${this.progress === 100 ? "checked" : ""}` }, h("div", { class: `file ${this.errorMessage ? "--error" : ""}` }, this.renderFileName(), !this.errorMessage && (h("div", { class: `right-group ${this.isCondensed ? "condensed" : ""}` }, this.renderFileInfo(), this.fileActions !== "" && this.renderFileControls())), this.errorMessage && (h("wm-button", { "permanently-delete": true, "button-type": "textonly", "label-for-identical-buttons": this.generateClearButtonLabel(this.name), onClick: () => this.wmFileErrorCleared.emit() }, this.clearButtonText))), this.errorMessage && h("div", { class: "error-message" }, this.errorMessage)));
     }
     render() {
-        return h(Host, { role: "listitem" }, this.isUploading ? this.renderFileInProgress() : this.renderFile());
+        return h(Host, { key: '862c068de56db3f8f96604ca087053c6cdab9395', role: "listitem" }, this.isUploading ? this.renderFileInProgress() : this.renderFile());
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
 };
-File.style = wmFileCss;
+File.style = WmFileStyle0;
 
 export { File as wm_file };

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

@@ -1,8 +1,9 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-f164fbca.js';
-import { t as toBool, a as handleDisabledAttribute, b as triggerFormSubmit } from './functions-58918a32.js';
-import { g as globalMessages } from './intl-f9d79dff.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-7923308f.js';
+import { t as toBool, a as handleDisabledAttribute, b as triggerFormSubmit } from './functions-f317d2d6.js';
+import { g as globalMessages } from './intl-00a637cf.js';
 
 const wmInputCss = ":host{font-family:inherit;width:100%}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}:host .wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}:host .wrapper .label .required{color:var(--wmcolor-text-required)}:host .wrapper.label-left{-ms-flex-direction:row;flex-direction:row}:host .wrapper.label-left .label-wrapper{line-height:2.5rem}:host .wrapper.label-left .label-wrapper .label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:2.5rem;white-space:normal;margin-bottom:0;margin-right:0.75rem}:host .wrapper.label-none label{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 .wrapper.invalid .label{color:var(--wmcolor-text-error)}:host .wrapper.invalid .label:after{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:\"\\f026\";margin-left:0.3125rem}[dir=RTL] :host .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}:host .wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}:host .wrapper .inner-wrapper{width:100%}:host .wrapper .text-after-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:8px}:host .wrapper .text-after{-ms-flex:0 1 fit-content;flex:0 1 fit-content}:host .wrapper .inputfield-wrapper{height:2.5rem;min-width:6.25rem;border:1px solid var(--wmcolor-input-border);-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;display:-ms-flexbox;display:flex}:host .wrapper .inputfield-wrapper.disabled{background-color:var(--wmcolor-input-background-disabled);color:var(--wmcolor-input-text-disabled)}:host .wrapper .inputfield-wrapper.disabled .symbol{background:none}:host .wrapper .symbol{display:-ms-flexbox;display:flex;background-color:var(--wmcolor-input-unit-background);-ms-flex:0 0 44px;flex:0 0 44px;padding-inline:8px;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host .wrapper .character-count{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:5rem;background-color:var(--wmcolor-input-charcount-background);font-size:0.875rem;font-weight:500;-ms-flex-item-align:stretch;align-self:stretch}:host .wrapper input{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;border:none;font-family:inherit;font-size:0.875rem;height:100%;-ms-flex:1;flex:1;padding:0.75rem 1rem;width:100%}:host .wrapper input:focus{outline:none}:host .wrapper input[type=number]{padding-right:0}:host .wrapper .info{font-style:italic;line-height:100%;margin:4px 0}:host .wrapper.invalid .inputfield-wrapper{-webkit-box-shadow:0 0 0 1px var(--wmcolor-input-border-error);-moz-box-shadow:0 0 0 1px var(--wmcolor-input-border-error);box-shadow:0 0 0 1px var(--wmcolor-input-border-error);border-color:var(--wmcolor-input-border-error)}:host .wrapper.invalid .error-message{display:block;font-style:italic;color:var(--wmcolor-text-error);font-size:0.875rem;line-height:100%}:host .wrapper.invalid .error-message:not(:empty){margin-top:0.25rem}:host .wrapper:focus .inputfield-wrapper,:host .wrapper.focus .inputfield-wrapper{outline:2px solid var(--wmcolor-input-border-focus);border-color:var(--wmcolor-input-border-focus)}: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}";
+const WmInputStyle0 = wmInputCss;
 
 const Input = class {
     constructor(hostRef) {
@@ -106,7 +107,7 @@ const Input = class {
             : `info error`;
     }
     render() {
-        return (h("div", { class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}`, ref: (el) => (this.inputWrapperEl = el) }, h("div", { class: "label-wrapper" }, h("label", { htmlFor: "inputfield", class: "label" }, this.label, this.characterLimit && (h("span", { class: "sr-only" }, " ", globalMessages.getCharacterLimit(this.characterLimit))), this.requiredField && (h("span", { class: "required", "aria-hidden": "true" }, "*")))), h("div", { class: "inner-wrapper" }, h("div", { class: "text-after-wrapper" }, h("div", { class: `inputfield-wrapper ${this.isDisabled ? "disabled" : ""}`, style: this.getInputWidth() }, this.symbolBefore && (h("span", { class: "symbol", id: "symbol-before" }, this.symbolBefore)), h("input", { ref: (el) => (this.inputEl = el), id: "inputfield", disabled: this.isDisabled, "aria-describedby": this.descriptors(), onInput: (ev) => this.handleInput(ev), onKeyDown: (ev) => this.handleKeyDown(ev), onBlur: () => this.handleBlur(), onFocus: () => this.handleFocus(), placeholder: this.placeholder, autocomplete: "off", "aria-required": this.requiredField ? "true" : null, maxLength: this.characterLimit || undefined, type: this.type, step: this.step, max: this.max, min: this.min, value: this.el.value }), this.symbolAfter && (h("span", { class: "symbol", id: "symbol-after" }, this.symbolAfter)), this.characterLimit && typeof this.characterLimit === "number" ? (h("div", { class: "character-count" }, this.charCount, "/", this.characterLimit)) : ("")), this.textAfter && (h("span", { class: "text-after", id: "text-after" }, this.textAfter))), this.info && (h("div", { id: "info", class: "info" }, this.info)), h("div", { id: "error", class: "error-message" }, this.errorMessage), h("div", { class: "sr-only", "aria-live": "polite", "aria-atomic": "true", ref: (el) => (this.liveRegionEl = el) }, this.announcement))));
+        return (h("div", { key: 'cc9ef75a589432036f7ee7b3e119c20ec47b5fc5', class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}`, ref: (el) => (this.inputWrapperEl = el) }, h("div", { key: '137525a3ad8cc325f7098c39064b328720a91526', class: "label-wrapper" }, h("label", { key: '6537f8baee40f449c012cfcbac48080725f0dbe0', htmlFor: "inputfield", class: "label" }, this.label, this.characterLimit && (h("span", { key: '98c8676853db57170780b05b46565694d7546ceb', class: "sr-only" }, " ", globalMessages.getCharacterLimit(this.characterLimit))), this.requiredField && (h("span", { key: 'db40b37dc99cf84bc5397bc6930f218ebe6e6b40', class: "required", "aria-hidden": "true" }, "*")))), h("div", { key: '436a665e6a783e0fe8acc16c88b738c9a6454c1e', class: "inner-wrapper" }, h("div", { key: 'ea67d345ef9d5160d4cb2686240dc7a5e0dd0dbf', class: "text-after-wrapper" }, h("div", { key: '884f3558720614c0b6c8e4a212c6140ae70d3a0e', class: `inputfield-wrapper ${this.isDisabled ? "disabled" : ""}`, style: this.getInputWidth() }, this.symbolBefore && (h("span", { key: '56544b73c75e02b614cb3a6ef0864964a5bb44d7', class: "symbol", id: "symbol-before" }, this.symbolBefore)), h("input", { key: '0641bf358bab28cc71e823ad8acad6f8b2dc32b7', ref: (el) => (this.inputEl = el), id: "inputfield", disabled: this.isDisabled, "aria-describedby": this.descriptors(), onInput: (ev) => this.handleInput(ev), onKeyDown: (ev) => this.handleKeyDown(ev), onBlur: () => this.handleBlur(), onFocus: () => this.handleFocus(), placeholder: this.placeholder, autocomplete: "off", "aria-required": this.requiredField ? "true" : null, maxLength: this.characterLimit || undefined, type: this.type, step: this.step, max: this.max, min: this.min, value: this.el.value }), this.symbolAfter && (h("span", { key: 'd1c2a217b9c432fe6804385be72a36ed1e85a0c8', class: "symbol", id: "symbol-after" }, this.symbolAfter)), this.characterLimit && typeof this.characterLimit === "number" ? (h("div", { class: "character-count" }, this.charCount, "/", this.characterLimit)) : ("")), this.textAfter && (h("span", { key: 'd62056ec181ba8001dbb32920d404b7beb9745bc', class: "text-after", id: "text-after" }, this.textAfter))), this.info && (h("div", { key: 'cb4cd47512a17b1acecb7e0bba962fd703fad954', id: "info", class: "info" }, this.info)), h("div", { key: 'bfb83ccbe20cdcf67228e270151078df673589e4', id: "error", class: "error-message" }, this.errorMessage), h("div", { key: 'a4b54a332b181cfe668a82e9b721cb974359928e', class: "sr-only", "aria-live": "polite", "aria-atomic": "true", ref: (el) => (this.liveRegionEl = el) }, this.announcement))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
@@ -115,6 +116,6 @@ const Input = class {
         "errorMessage": ["announceError"]
     }; }
 };
-Input.style = wmInputCss;
+Input.style = WmInputStyle0;
 
 export { Input as wm_input };

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

@@ -1,9 +1,10 @@
-import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-f164fbca.js';
-import { d as debounce, y as transposeMatrix, v as csvToArray, z as wrapAround, A as getSmallestSkipInterval, B as calcPercentageInRange } from './functions-58918a32.js';
-import { n as abbrNumber, o as getInterval } from './chartFunctions-d2d8f1b2.js';
-import { l as lineChartMessages, c as chartMessages, g as globalMessages } from './intl-f9d79dff.js';
+import { r as registerInstance, f as forceUpdate, h, H as Host, g as getElement } from './index-7923308f.js';
+import { d as debounce, y as transposeMatrix, v as csvToArray, z as wrapAround, A as getSmallestSkipInterval, B as calcPercentageInRange } from './functions-f317d2d6.js';
+import { n as abbrNumber, o as getInterval } from './chartFunctions-8098e455.js';
+import { l as lineChartMessages, c as chartMessages, g as globalMessages } from './intl-00a637cf.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-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}";
+const WmLineChartStyle0 = wmLineChartCss;
 
 const LineChart = class {
     constructor(hostRef) {
@@ -16,12 +17,12 @@ const LineChart = class {
         this.displayedXIntervals = [];
         this.yIntervals = [];
         this.lineStyles = [
-            { color: "#8b86ca", icon: "f536" },
-            { color: "#2e1b46", icon: "f12f" },
-            { color: "#0089e4", icon: "f763" },
-            { color: "#088000", icon: "f4ce" },
-            { color: "#ea8500", icon: "f70a" },
-            { color: "#d54f41", icon: "f536" },
+            { color: "#8b86ca", icon: "f536" }, // lavender, triangle
+            { color: "#2e1b46", icon: "f12f" }, // midnight, circle
+            { color: "#0089e4", icon: "f763" }, // blue, square
+            { color: "#088000", icon: "f4ce" }, // forest, star
+            { color: "#ea8500", icon: "f70a" }, // orange, rhombus
+            { color: "#d54f41", icon: "f536" }, // red, upside down triangle
             { color: "#146ca9", icon: "f6ff" }, // blue, upside down triangle
         ];
         this.debouncedResize = debounce(async () => {
@@ -417,7 +418,7 @@ const LineChart = class {
             popoverStyle = {
                 "--leftPosition": `0%`,
                 "--topPosition": "0%",
-                maxWidth: Math.min(this.el.clientWidth - 2, 400) + "px",
+                maxWidth: Math.min(this.el.clientWidth - 2, 400) + "px", // take up no more max-width than is visually available
                 transform: `translateX(calc(${displaceLeft}))`, // align with left edge of component
             };
         }
@@ -457,9 +458,9 @@ const LineChart = class {
         return h("div", { class: "highlight", style: highlightStyle });
     }
     render() {
-        return (h(Host, { onBlur: () => this.resetDataPointFocus(), onMouseLeave: () => (this.popoverIndex = -1) }, h("div", { class: "component-wrapper", role: "application", "aria-roledescription": chartMessages.interactiveChart, "aria-label": this.label, "aria-describedby": "chart-description" }, this.renderLegend(), h("div", { class: "chart-wrapper" }, h("div", { class: "chart-label --y-axis", style: { "--labelWidth": this.labelWidth } }, this.yAxisLabel, this.parsedUnits[1] && ` (${this.parsedUnits[1]})`), this.renderYIntervals(), h("div", { ref: (el) => (this.plotAreaEl = el), class: `plot-area ${this.hasPartialInterval ? "" : "right-border"}`, style: {
+        return (h(Host, { key: '9817eea8765cce513a0848cd222a6409c8f1f912', onBlur: () => this.resetDataPointFocus(), onMouseLeave: () => (this.popoverIndex = -1) }, h("div", { key: '60de41437bb425483be4b5a24fc2468c8e8f8d4e', class: "component-wrapper", role: "application", "aria-roledescription": chartMessages.interactiveChart, "aria-label": this.label, "aria-describedby": "chart-description" }, this.renderLegend(), h("div", { key: '2029ed03f09b8c133ee430f7b1d70c9dded326f3', class: "chart-wrapper" }, h("div", { key: '4e9123177b8c02cf1fef010d370b2b1a23b2015c', class: "chart-label --y-axis", style: { "--labelWidth": this.labelWidth } }, this.yAxisLabel, this.parsedUnits[1] && ` (${this.parsedUnits[1]})`), this.renderYIntervals(), h("div", { key: '3cbe51169818095cd830e7b8099d3a10980e3cf2', ref: (el) => (this.plotAreaEl = el), class: `plot-area ${this.hasPartialInterval ? "" : "right-border"}`, style: {
                 "--backgroundSize": `${this.dataPointMatrix[0][this.xIntervals.indexOf(this.displayedXIntervals[1])].xPositionPercent}%`,
-            } }, this.highlightStart && this.renderHighlight(), this.renderData(), this.renderHoverAreas()), this.popoverIndex !== -1 && this.renderHoverIndicator(), this.popoverIndex !== -1 && this.renderPopover(), this.renderXIntervals(), h("div", { class: "chart-label --x-axis" }, this.xAxisLabel, this.parsedUnits[0] && ` (${this.parsedUnits[0]})`)), h("div", { id: "chart-description", class: "sr-only" }, `${lineChartMessages.instructions} ${this.description}`), h("div", { ref: (el) => (this.liveRegionEl = el), "aria-live": "polite", class: "sr-only" }, this.announcement))));
+            } }, this.highlightStart && this.renderHighlight(), this.renderData(), this.renderHoverAreas()), this.popoverIndex !== -1 && this.renderHoverIndicator(), this.popoverIndex !== -1 && this.renderPopover(), this.renderXIntervals(), h("div", { key: 'dad130dfb9063769dd36316cb060c90a8f1c8cb8', class: "chart-label --x-axis" }, this.xAxisLabel, this.parsedUnits[0] && ` (${this.parsedUnits[0]})`)), h("div", { key: 'bb4ffc7fbae6ab63e6f3e16c1d7e8a98c382e243', id: "chart-description", class: "sr-only" }, `${lineChartMessages.instructions} ${this.description}`), h("div", { key: 'de40d0eecd0db387912b45fb2b4576b37e3876aa', ref: (el) => (this.liveRegionEl = el), "aria-live": "polite", class: "sr-only" }, this.announcement))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -467,6 +468,6 @@ const LineChart = class {
         "intervalSkip": ["handleIntervalSkip"]
     }; }
 };
-LineChart.style = wmLineChartCss;
+LineChart.style = WmLineChartStyle0;
 
 export { LineChart as wm_line_chart };

package/dist/esm/wm-modal-footer.entry.js

@@ -1,6 +1,7 @@
-import { r as registerInstance, h, g as getElement } from './index-f164fbca.js';
+import { r as registerInstance, h, g as getElement } from './index-7923308f.js';
 
 const wmModalFooterCss = "wm-modal-footer{display:block;-webkit-border-radius:0px 0px 5px 5px;-moz-border-radius:0px 0px 5px 5px;-ms-border-radius:0px 0px 5px 5px;border-radius:0px 0px 5px 5px}wm-modal-footer .wm-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}@media only screen and (max-width: 650px){wm-modal-footer .wm-wrapper.footer-text{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:flex-start}}wm-modal-footer .wm-wrapper wm-button+wm-button{margin-left:1rem}wm-modal-footer .wm-wrapper .wm-info{font-size:0.875rem;font-style:italic}@media only screen and (max-width: 650px){wm-modal-footer .wm-wrapper .wm-info{padding-bottom:0.625rem}}wm-modal-footer .wm-wrapper .wm-info:focus{outline:none}";
+const WmModalFooterStyle0 = wmModalFooterCss;
 
 const ModalFooter = class {
     constructor(hostRef) {
@@ -13,7 +14,6 @@ const ModalFooter = class {
     }
     componentWillLoad() {
         const parentModal = this.el.closest("wm-modal");
-        this.uid = parentModal.uid;
         // Trap focus when user shift+tabs past first element in modal
         // NB @Listen doesn't allow to listen on a specific element (the parent modal)
         // if we listen to the whole doc each modal on the page reacts to every event
@@ -34,10 +34,10 @@ const ModalFooter = class {
         }
     }
     render() {
-        return (h("div", { class: `wm-wrapper ${this.infoText ? " footer-text" : ""}` }, h("div", { class: "wm-info", "aria-live": "polite" }, this.infoText), h("div", { class: "wm-button-collection" }, this.secondaryText && (h("wm-button", { onClick: () => this.emitParentSecondaryEvent(), id: `wm-secondary-${this.uid}`, ref: (el) => (this.primaryActionDisabled ? (this.lastElement = el) : undefined) }, this.secondaryText)), h("wm-button", { "button-type": this.deleteStyle ? "secondary" : "primary", "permanently-delete": this.deleteStyle, onClick: () => this.emitParentPrimaryEvent(), disabled: this.primaryActionDisabled, id: `wm-primary-${this.uid}`, ref: (el) => (!this.primaryActionDisabled ? (this.lastElement = el) : undefined) }, this.primaryText))));
+        return (h("div", { key: '2de0f8f14008d0cba4d503ef88e046aa7027acb9', class: `wm-wrapper ${this.infoText ? " footer-text" : ""}` }, h("div", { key: '406a91ba3e5b0de65482f0b42564124f5859fc99', class: "wm-info", "aria-live": "polite" }, this.infoText), h("div", { key: 'a724a0d13b170b5f8996fd20461f26e15004202b', class: "wm-button-collection" }, this.secondaryText && (h("wm-button", { key: '58d3e76a74b9188fb65c7d089a42ad0736fcb505', onClick: () => this.emitParentSecondaryEvent(), id: "secondary-button", ref: (el) => (this.primaryActionDisabled ? (this.lastElement = el) : undefined) }, this.secondaryText)), h("wm-button", { key: '8050d33368057fa1119536557b38ec53148fd289', "button-type": this.deleteStyle ? "secondary" : "primary", "permanently-delete": this.deleteStyle, onClick: () => this.emitParentPrimaryEvent(), disabled: this.primaryActionDisabled, id: "primary-button", ref: (el) => (!this.primaryActionDisabled ? (this.lastElement = el) : undefined) }, this.primaryText))));
     }
     get el() { return getElement(this); }
 };
-ModalFooter.style = wmModalFooterCss;
+ModalFooter.style = WmModalFooterStyle0;
 
 export { ModalFooter as wm_modal_footer };

package/dist/esm/wm-modal-header.entry.js

@@ -1,8 +1,9 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-f164fbca.js';
-import { g as globalMessages } from './intl-f9d79dff.js';
-import './functions-58918a32.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-7923308f.js';
+import { g as globalMessages } from './intl-00a637cf.js';
+import './functions-f317d2d6.js';
 
 const wmModalHeaderCss = "wm-modal-header{display:block;-webkit-border-radius:5px 5px 0 0px;-moz-border-radius:5px 5px 0 0px;-ms-border-radius:5px 5px 0 0px;border-radius:5px 5px 0 0px}wm-modal-header .wm-wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}wm-modal-header .wm-wrapper .title{margin:0;font-weight:600;font-size:1.125rem;color:var(--wmcolor-modal-heading);line-height:normal}wm-modal-header .wm-wrapper .title .subtitle{display:block;font-size:0.875rem;font-weight:normal}wm-modal-header .wm-wrapper .title:focus{outline:none}";
+const WmModalHeaderStyle0 = wmModalHeaderCss;
 
 const ModalHeader = class {
     constructor(hostRef) {
@@ -12,7 +13,6 @@ const ModalHeader = class {
     }
     componentWillLoad() {
         const parentModal = this.el.closest("wm-modal");
-        this.uid = parentModal.uid;
         // Trap focus when user tabs past last element in modal
         // NB @Listen doesn't allow to listen on a specific element (the parent modal)
         // if we listen to the whole doc each modal on the page reacts to every event
@@ -26,10 +26,10 @@ const ModalHeader = class {
         parentModal.emitCloseEvent();
     }
     render() {
-        return (h(Host, null, h("div", { class: "wm-wrapper" }, h("div", null, h("h2", { class: "title", id: `wm-modal-heading-text-${this.uid}` }, this.heading, h("span", { class: "subtitle" }, this.subheading))), h("wm-button", { "button-type": "navigational", icon: "f156", tooltip: globalMessages.close, "tooltip-position": "left", id: `wm-modal-close-${this.uid}`, ref: (el) => (this.closeButtonEl = el), onClick: () => this.emitParentCloseEvent() }))));
+        return (h(Host, { key: '36778d94c837563f79a65dc40d7e8a0ad752c393' }, h("div", { key: '4fa19827a74fe261f5372ec032b94b42202fac59', class: "wm-wrapper" }, h("div", { key: '4bc1ed719a6ca6d0e91325caeeab01391533cf22' }, h("h2", { key: '05c974a3bd3d6d70140e06e185e0247cdc86b4f4', class: "title", id: "wm-modal-heading-text" }, this.heading, h("span", { key: '18e17eda7a387ad0a171588f93b63cca1c73e028', class: "subtitle" }, this.subheading))), h("wm-button", { key: '50a28b3efdbe2671527b1da84820871218108c77', "button-type": "navigational", icon: "f156", tooltip: globalMessages.close, "tooltip-position": "left", id: "wm-modal-close", ref: (el) => (this.closeButtonEl = el), onClick: () => this.emitParentCloseEvent() }))));
     }
     get el() { return getElement(this); }
 };
-ModalHeader.style = wmModalHeaderCss;
+ModalHeader.style = WmModalHeaderStyle0;
 
 export { ModalHeader as wm_modal_header };

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

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-f164fbca.js';
-import { g as generateId } from './functions-58918a32.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-7923308f.js';
 
 const wmModalCss = "wm-modal{--wmcolor-modal-background:var(--wmcolor-background);--wmcolor-modal-border:var(--wmcolor-border);--wmcolor-modal-heading:var(--wmcolor-text);--wmcolor-modal-overlay:var(--wmcolor-overlay)}wm-modal *{-webkit-box-sizing:border-box;box-sizing:border-box}wm-modal dialog{color:inherit;overflow:hidden;padding:0;width:80vw;max-width:750px;max-height:80vh;-webkit-border-radius:5px 5px 5px 5px;-moz-border-radius:5px 5px 5px 5px;-ms-border-radius:5px 5px 5px 5px;border-radius:5px 5px 5px 5px;border:none;background:var(--wmcolor-modal-background)}wm-modal dialog>:not(wm-modal-header):not(wm-modal-footer){max-height:calc(80vh - 166px)}wm-modal dialog::-webkit-backdrop{background:rgba(25, 25, 25, 0.4)}wm-modal dialog::-ms-backdrop{background:rgba(25, 25, 25, 0.4)}wm-modal dialog::backdrop{background:rgba(25, 25, 25, 0.4)}wm-modal dialog[open]{-webkit-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);-moz-box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14);box-shadow:0px 11px 15px 0px rgba(0, 0, 0, 0.2), 0px 9px 46px 8px rgba(0, 0, 0, 0.12), 0px 24px 38px 3px rgba(0, 0, 0, 0.14)}wm-modal dialog.wm-modal>wm-modal-header{border-bottom:1px solid var(--wmcolor-modal-border)}wm-modal dialog.wm-modal>wm-modal-footer{border-top:1px solid var(--wmcolor-modal-border)}@media only screen and (max-width: 768px){wm-modal dialog.wm-modal{height:100%;max-height:none;max-width:none;width:100vw}wm-modal dialog.wm-modal>*{max-width:none;width:100vw}wm-modal dialog.wm-modal>*:not(wm-modal-header):not(wm-modal-footer){max-height:none;height:calc(100vh - 166px)}}wm-modal dialog.wm-dialog>:not(wm-modal-header):not(wm-modal-footer):not(.wm-tooltip){padding:0 1.875rem 1.25rem 1.875rem;font-size:0.875rem;border:none}wm-modal wm-modal-header,wm-modal wm-modal-footer{padding:1.25rem 1.875rem;width:100%}wm-modal .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;top:0;left:0}";
+const WmModalStyle0 = wmModalCss;
 
 const Modal = class {
     constructor(hostRef) {
@@ -14,16 +14,15 @@ const Modal = class {
         this.open = false;
         this.elementToFocus = "";
         this.modalType = "modal";
-        this.uid = undefined;
         this.returnFocusEl = undefined;
     }
     get closeButtonEl() {
-        return this.el.querySelector(`#wm-modal-close-${this.uid}`);
+        return this.el.querySelector("#wm-modal-close");
     }
     get focusOnOpenEl() {
         let customElementToFocus = null;
         if (this.elementToFocus === "primary" || this.elementToFocus === "secondary") {
-            customElementToFocus = this.el.querySelector(`#wm-${this.elementToFocus}-${this.uid}`);
+            customElementToFocus = this.el.querySelector(`#wm-${this.elementToFocus}`);
         }
         else if (this.elementToFocus) {
             customElementToFocus = this.el.querySelector("#" + this.elementToFocus);
@@ -85,7 +84,6 @@ const Modal = class {
                 this.closeButtonEl.focus();
             }
         };
-        this.uid = this.el.id ? this.el.id : generateId();
     }
     componentDidLoad() {
         if (this.open) {
@@ -108,20 +106,20 @@ const Modal = class {
         }
     }
     setAriaDescribedbyOnModal() {
-        const modalBody = document.getElementById(`content-${this.uid}`);
+        const modalBody = document.getElementById("content");
         if (!modalBody) {
             console.warn("Ripple Component Library: The element containing the body of the modal must include an id in the format 'content-[id of modal]' for accessibility purposes.");
         }
         else {
-            this.el.setAttribute("aria-describedby", `wm-modal-heading-text-${this.uid} content-${this.uid}`);
+            this.el.setAttribute("aria-describedby", "wm-modal-heading-text content");
         }
     }
     render() {
-        return (h("dialog", { class: `${"wm-" + this.modalType}`, ref: (el) => (this.dialogEl = el), onKeyDown: (ev) => this.handleKeyDown(ev) }, h("div", { class: "tabtrap sr-only", tabindex: "0", onFocus: (ev) => {
+        return (h("dialog", { key: 'b15acfd6fbaba8718dc08083892d3986cbe8be88', class: `${"wm-" + this.modalType}`, ref: (el) => (this.dialogEl = el), onKeyDown: (ev) => this.handleKeyDown(ev) }, h("div", { key: 'a50590eb69dbfcccfda08726c9d07ba0f18115c3', class: "tabtrap sr-only", tabindex: "0", onFocus: (ev) => {
                 const focusedFromCloseButton = ev.relatedTarget && ev.relatedTarget == this.closeButtonEl;
                 // no related target means we're coming from outside the page (browser chrome), and first element should be focused instead
                 focusedFromCloseButton ? this.focusLastElement.emit() : this.focusFirstElement.emit();
-            } }), !this.hasBrowserPopoverSupport && h("div", { class: "wm-tooltip" }), h("slot", null), h("div", { class: "tabtrap sr-only", tabindex: "0", onFocus: () => {
+            } }), !this.hasBrowserPopoverSupport && h("div", { key: 'cc737295b9e263bd2896c8c495f78d2ed8775d62', class: "wm-tooltip" }), h("slot", { key: 'c8f32e6a730256ffb64f98a10b96fabd92a99cd4' }), h("div", { key: 'cdd95b8969ddd9343a3023dd8b35c23299d2ed7b', class: "tabtrap sr-only", tabindex: "0", onFocus: () => {
                 this.focusFirstElement.emit();
             } })));
     }
@@ -130,6 +128,6 @@ const Modal = class {
         "open": ["toggleModal"]
     }; }
 };
-Modal.style = wmModalCss;
+Modal.style = WmModalStyle0;
 
 export { Modal as wm_modal };

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

@@ -1,8 +1,9 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement, f as forceUpdate } from './index-f164fbca.js';
-import { i as intl, x as throttle, h as hideTooltip, s as showTooltip } from './functions-58918a32.js';
-import { g as globalMessages } from './intl-f9d79dff.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement, f as forceUpdate } from './index-7923308f.js';
+import { i as intl, x as throttle, h as hideTooltip, s as showTooltip } from './functions-f317d2d6.js';
+import { g as globalMessages } from './intl-00a637cf.js';
 
 const wmNavigationCss = ":host{--wmcolor-navigation-background-hover:var(--wmcolor-interactive-background-hover);--wmcolor-navigation-background-selected:var(--wmcolor-background-selected);--wmcolor-navigation-background:var(--wmcolor-background);--wmcolor-navigation-border-selected:var(--wmcolor-interactive);--wmcolor-navigation-focus:var(--wmcolor-interactive-focus);--wmcolor-navigation-icon-selected:var(--wmcolor-interactive);--wmcolor-navigation-icon:var(--wmcolor-icon);--wmcolor-navigation-text-selected:var(--wmcolor-interactive);z-index:10}:host([aria-expanded=true]){z-index:5000}.tray{-webkit-box-shadow:0 0 14px 0 rgba(0, 0, 0, 0.14);-moz-box-shadow:0 0 14px 0 rgba(0, 0, 0, 0.14);box-shadow:0 0 14px 0 rgba(0, 0, 0, 0.14);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:7.5625rem;background-color:var(--wmcolor-navigation-background);overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;font-size:0.875rem;height:100%}.navlist{margin:0;padding:0}.toggle-wrapper{display:none}@media screen and (max-width: 1023px){.tray{-ms-transition:transform 0.33s ease;-webkit-transition:transform 0.33s ease;-moz-transition:transform 0.33s ease;-webkit-transition:-webkit-transform 0.33s ease;transition:-webkit-transform 0.33s ease;transition:transform 0.33s ease;transition:transform 0.33s ease, -webkit-transform 0.33s ease;position:fixed;top:0;bottom:0;left:0;-webkit-transform:translateX(-100%);transform:translateX(-100%)}.tray ul{visibility:hidden}.tray .toggle-wrapper{display:inline-block;min-height:5rem;width:100%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}:host([aria-expanded=true]) .tray{-webkit-transform:translateX(0);transform:translateX(0)}:host([aria-expanded=true]) .tray ul{visibility:visible}.overlay{width:100vw;height:100vh;max-width:none;max-height:none;position:fixed !important;top:0;bottom:0;left:0;right:0;-webkit-transform:translate(0%, 0%);transform:translate(0%, 0%);background-color:rgba(25, 25, 25, 0.4);-ms-transition:opacity 0.5s ease-out;-webkit-transition:opacity 0.5s ease-out;-moz-transition:opacity 0.5s ease-out;transition:opacity 0.5s ease-out}}";
+const WmNavigationStyle0 = wmNavigationCss;
 
 const Navigation = class {
     constructor(hostRef) {
@@ -101,9 +102,9 @@ const Navigation = class {
             } }));
     }
     render() {
-        return (h(Host, { role: "navigation", "aria-expanded": this.ariaExpanded, "aria-label": this.mainNavigationMessage }, this.open ? this.renderOverlay() : "", this.isCollapsible && (h("div", { class: "trapfocus", tabindex: this.open ? 0 : undefined, onFocus: () => this.focusLastItem() })), h("div", { class: "tray" }, h("div", { class: "toggle-wrapper" }, h("wm-button", { ref: (el) => (this.toggleEl = el), class: "toggle", "button-type": "navigational", icon: this.open ? "f156" : "f35c", "icon-size": "2rem", tooltip: this.open ? globalMessages.close : globalMessages.open, "tooltip-position": "right", tabIndex: this.open ? undefined : -1, onClick: () => {
+        return (h(Host, { key: '438a0fb1164b8ce7ce05d3032a03cbc14b6dbbf9', role: "navigation", "aria-expanded": this.ariaExpanded, "aria-label": this.mainNavigationMessage }, this.open ? this.renderOverlay() : "", this.isCollapsible && (h("div", { key: '05214ccbadf96b315e0b35cd5c6fa5299582ac08', class: "trapfocus", tabindex: this.open ? 0 : undefined, onFocus: () => this.focusLastItem() })), h("div", { key: 'f9b8092df608206c64251abe889ead679fd91e8b', class: "tray" }, h("div", { key: '23ab4007600faafd5e159400c7950c6da27f6fc6', class: "toggle-wrapper" }, h("wm-button", { key: '08626268ecd50d66fca80f0081af427c9902742a', ref: (el) => (this.toggleEl = el), class: "toggle", "button-type": "navigational", icon: this.open ? "f156" : "f35c", "icon-size": "2rem", tooltip: this.open ? globalMessages.close : globalMessages.open, "tooltip-position": "right", tabIndex: this.open ? undefined : -1, onClick: () => {
                 this.open = !this.open;
-            } })), h("ul", { class: "navlist" }, h("slot", null))), this.isCollapsible && (h("div", { class: "trapfocus", tabindex: this.open ? 0 : undefined, onFocus: () => this.toggleEl.focus() }))));
+            } })), h("ul", { key: 'c50bb2f99877871b6ba28ded7e78f74f8c8c5d1f', class: "navlist" }, h("slot", { key: '50c4f79ab19f853abeb9ba8e41caf180d04a605c' }))), this.isCollapsible && (h("div", { key: '87b371694aab525291eb397521140087d2b0c9f3', class: "trapfocus", tabindex: this.open ? 0 : undefined, onFocus: () => this.toggleEl.focus() }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
@@ -111,9 +112,10 @@ const Navigation = class {
         "open": ["handleStateChange"]
     }; }
 };
-Navigation.style = wmNavigationCss;
+Navigation.style = WmNavigationStyle0;
 
 const wmNavigationHamburgerCss = "button{--wmcolor-navigation-hamburger-background-hover:var(--wmcolor-interactive-background-hover);--wmcolor-navigation-hamburger-icon:var(--wmcolor-interactive);display:none;width:100%;height:100%;border:none;-webkit-box-shadow:none;box-shadow:none;-webkit-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1);background-color:transparent;outline:none;padding:0}button:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:0}button:hover{background-color:var(--wmcolor-navigation-hamburger-background-hover)}.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:\"\\f35c\";font-size:1.5rem;color:var(--wmcolor-navigation-hamburger-icon)}@media screen and (max-width: 1023px){:host{width:3.75rem;height:3.75rem}button{display:initial}}";
+const WmNavigationHamburgerStyle0 = wmNavigationHamburgerCss;
 
 const NavigationHamburger = class {
     constructor(hostRef) {
@@ -151,14 +153,15 @@ const NavigationHamburger = class {
         this.wmNavigationHamburgerClicked.emit();
     }
     render() {
-        return (h(Host, { class: `hamburger ${this.open ? "nav-open" : "nav-closed"}` }, h("button", { "aria-expanded": this.open, "aria-label": this.showNavMessage, onMouseEnter: () => showTooltip("right", this.el, this.showNavMessage), onMouseLeave: () => hideTooltip(), onFocus: () => this.isTabbing && showTooltip("right", this.el, this.showNavMessage), onBlur: () => hideTooltip(), onClick: () => this.handleClick() }, h("span", { class: "icon" }))));
+        return (h(Host, { key: 'bb783acfebdfcf8ac95b2afc89f073896ea9b7e4', class: `hamburger ${this.open ? "nav-open" : "nav-closed"}` }, h("button", { key: '708812a3c933396c95185d6622f9d5d52b270ff0', "aria-expanded": this.open, "aria-label": this.showNavMessage, onMouseEnter: () => showTooltip("right", this.el, this.showNavMessage), onMouseLeave: () => hideTooltip(), onFocus: () => this.isTabbing && showTooltip("right", this.el, this.showNavMessage), onBlur: () => hideTooltip(), onClick: () => this.handleClick() }, h("span", { key: 'f1f34d7ed178f4f609e5adf2122399cffdd76a68', class: "icon" }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
 };
-NavigationHamburger.style = wmNavigationHamburgerCss;
+NavigationHamburger.style = WmNavigationHamburgerStyle0;
 
 const wmNavigationItemCss = ".link{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;color:inherit;text-decoration:none;min-height:4.5rem;text-align:center;padding:1.25rem 0.5rem;font-weight:500;outline:none;position:relative;background:var(--wmcolor-navigation-background)}.link:hover{background-color:var(--wmcolor-navigation-background-hover)}.link .icon{font-size:1.375rem;color:var(--wmcolor-navigation-icon)}.link .text{font-size:0.875rem}.link:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:-3px}.link.active{background-color:var(--wmcolor-navigation-background-selected)}.link.active:before{content:\"\";background-color:var(--wmcolor-navigation-border-selected);position:absolute;height:100%;width:5px;left:0}.link.active .text{color:var(--wmcolor-navigation-text-selected)}.link.active .icon{color:var(--wmcolor-navigation-icon-selected)}";
+const WmNavigationItemStyle0 = wmNavigationItemCss;
 
 const NavigationItem = class {
     constructor(hostRef) {
@@ -169,11 +172,11 @@ const NavigationItem = class {
         this.active = undefined;
     }
     render() {
-        return (h(Host, { role: "listitem" }, h("a", { class: `link ${this.active ? "active" : ""}`, href: this.href, onClick: () => this.wmNavigationItemClicked.emit() }, h("div", { class: "icon", "aria-hidden": "true" }, h("slot", null)), h("div", { class: "text" }, this.text))));
+        return (h(Host, { key: '33217bc2b481b331425cbc7ece6195cb436e7bf0', role: "listitem" }, h("a", { key: 'a7b6d4e959a2ca4773f70859cf10789f5d97a4a4', class: `link ${this.active ? "active" : ""}`, href: this.href, onClick: () => this.wmNavigationItemClicked.emit() }, h("div", { key: 'f0d37d22d32fb7659adc2a3a9911f9e68928fc93', class: "icon", "aria-hidden": "true" }, h("slot", { key: '8678da1761b5192c821a3fcb736c1ac96b2ce43c' })), h("div", { key: 'a21f01425d6adc2da148449b34733c9e6ed39be5', class: "text" }, this.text))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
 };
-NavigationItem.style = wmNavigationItemCss;
+NavigationItem.style = WmNavigationItemStyle0;
 
 export { Navigation as wm_navigation, NavigationHamburger as wm_navigation_hamburger, NavigationItem as wm_navigation_item };

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

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-f164fbca.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-7923308f.js';
 import { a as getWmMode } from './interfaces-9b75fb61.js';
-import { k as snakeCaseToCamelCase, l as getNewIndexToFocus, i as intl } from './functions-58918a32.js';
+import { k as snakeCaseToCamelCase, l as getNewIndexToFocus, i as intl } from './functions-f317d2d6.js';
 
 const getRequest = async (url) => {
     const response = await fetch(url);
@@ -13,6 +13,7 @@ const getRequest = async (url) => {
 };
 
 const wmNavigatorCss = ":host{--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-focus:var(--wmcolor-interactive-background-focus);--wmcolor-navigator-item-background-hover:var(--wmcolor-interactive-background-hover);--wmcolor-navigator-item-background:var(--wmcolor-background);--wmcolor-navigator-item-border:var(--wmcolor-border);--wmcolor-navigator-item-text:var(--wmcolor-text);--wmcolor-navigator-user-background:var(--wmcolor-background-readonly);min-width:0;position:relative;display:inline-block}:host .wrapper{overflow:auto;font-size:1.125rem;min-width:13.125rem;width:auto;max-height:80vh;text-align:left;position:absolute;z-index:50;top:100%;right:20px;left:auto;background:var(--wmcolor-navigator-background);letter-spacing:normal;-webkit-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.2);-ms-transition:transform 0.25s ease;-webkit-transition:transform 0.25s ease;-moz-transition:transform 0.25s ease;-webkit-transition:-webkit-transform 0.25s ease;transition:-webkit-transform 0.25s ease;transition:transform 0.25s ease;transition:transform 0.25s ease, -webkit-transform 0.25s ease;-ms-transform-origin:center top;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top;-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}:host .wrapper .user{background:var(--wmcolor-navigator-user-background);padding:0.625rem 1.25rem;font-size:0.875rem}:host .wrapper .user p{margin:0}:host .wrapper .user p:first-child{font-weight:700;text-transform:capitalize}:host .wrapper h2{background:var(--wmcolor-navigator-header-background);color:var(--wmcolor-navigator-header-text);font-weight:700;margin:0;padding:0.625rem 1.25rem;font-size:0.875rem}:host .wrapper [role=listbox]{list-style:none;margin:0;padding-left:0}:host .wrapper.hide{-ms-transform:scale(1, 0);-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);transform:scale(1, 0)}:host .wrapper.right{right:auto;left:20px}:host img{-webkit-transform:scale(0.8);transform:scale(0.8);-webkit-transform-origin:left center;transform-origin:left center;display:block}:host .logout{text-align:center;text-transform:capitalize}priv-navigator-item:focus{outline:none}";
+const WmNavigatorStyle0 = wmNavigatorCss;
 
 const Navigator = class {
     constructor(hostRef) {
@@ -321,6 +322,6 @@ const Navigator = class {
         "products": ["parseData"]
     }; }
 };
-Navigator.style = wmNavigatorCss;
+Navigator.style = WmNavigatorStyle0;
 
 export { Navigator as wm_navigator };