@watermarkinsights/ripple 5.5.0 → 5.5.1

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

@@ -2,10 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-e86c28b6.js');
-const functions = require('./functions-3be85c6d.js');
+const index = require('./index-788526f5.js');
+const functions = require('./functions-05e7ad5a.js');
 
 const wmTimepickerCss = ":host{--wmcolor-timepicker-background:var(--wmcolor-background);--wmcolor-timepicker-input-background-disabled:var(--wmcolor-input-background-disabled);--wmcolor-timepicker-input-background:var(--wmcolor-input-background);--wmcolor-timepicker-input-border:var(--wmcolor-input-border);--wmcolor-timepicker-input-text-disabled:var(--wmcolor-input-text-disabled);--wmcolor-timepicker-input-text:var(--wmcolor-text);--wmcolor-timepicker-option-background-focus:var(--wmcolor-interactive-background-hover);--wmcolor-timepicker-option-background-hover:var(--wmcolor-option-background-hover);--wmcolor-timepicker-option-background:var(--wmcolor-option-background);--wmcolor-timepicker-option-border:var(--wmcolor-option-border);--wmcolor-timepicker-option-text:var(--wmcolor-option-text);--wmcolor-timepicker-toggle-background-disabled:var(--wmcolor-input-background-disabled);--wmcolor-timepicker-toggle-background-hover:var(--wmcolor-interactive-background-hover);--wmcolor-timepicker-toggle-background:var(--wmcolor-input-background);--wmcolor-timepicker-toggle-icon-disabled:var(--wmcolor-interactive-disabled);--wmcolor-timepicker-toggle-icon:var(--wmcolor-interactive);font-family:inherit}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}: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}: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{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-timepicker-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 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;font-size:0.875rem;padding:0.625rem 0.9375rem 0.5rem;min-width:0;height:100%;-ms-flex:1;flex:1;margin:0;font-family:inherit}:host .wrapper .inner-wrapper input:disabled{background-color:var(--wmcolor-timepicker-input-background-disabled);color:var(--wmcolor-timepicker-input-text-disabled)}:host .wrapper .inner-wrapper input:focus{outline:none}:host .wrapper .inner-wrapper button{all:unset;cursor:pointer;padding:0 0.375rem;height:2.375rem;background-color:var(--wmcolor-timepicker-toggle-background);border:none;-moz-border-top-right-radius:3px;-webkit-border-top-right-radius:3px;border-top-right-radius:3px;-moz-border-bottom-right-radius:3px;-webkit-border-bottom-right-radius:3px;border-bottom-right-radius:3px}:host .wrapper .inner-wrapper button .clock::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:\"\\f150\";color:var(--wmcolor-timepicker-toggle-icon);font-size:1.5rem;padding:0;line-height:2.5rem}:host .wrapper .inner-wrapper button:hover{background:var(--wmcolor-timepicker-toggle-background-hover);-webkit-box-shadow:none;box-shadow:none}:host .wrapper .inner-wrapper button:disabled{pointer-events:none;-webkit-box-shadow:none;box-shadow:none;background-color:var(--wmcolor-timepicker-toggle-background-disabled)}:host .wrapper .inner-wrapper button:disabled .clock::after{color:var(--wmcolor-timepicker-toggle-icon-disabled)}[dir=RTL] :host .wrapper .inner-wrapper button{right:auto;left:0}:host .wrapper .inner-wrapper button:focus{outline:none}:host .wrapper .inner-wrapper button:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:0}:host .wrapper .inner-wrapper button::-moz-focus-inner{border:0}:host .wrapper .inner-wrapper .options{margin:0;padding:0;-webkit-overflow-scrolling:touch;overflow:auto;max-height:19.0625rem;-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:scale(1, 0);-webkit-transform:scale(1, 0);-moz-transform:scale(1, 0);transform:scale(1, 0);-ms-transform-origin:center top;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top;-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:absolute;top:2.5rem;right:0;z-index:100;width:100%;font-size:0.875rem}:host .wrapper .inner-wrapper .options.upwards{top:unset;bottom:2.5rem;-ms-transform-origin:center bottom;-webkit-transform-origin:center bottom;-moz-transform-origin:center bottom;transform-origin:center bottom}:host .wrapper .inner-wrapper .options.hidden{visibility:hidden}:host .wrapper .inner-wrapper .options [role=option]{display:block;cursor:pointer;position:relative;padding:1.25rem;background:var(--wmcolor-timepicker-option-background);font-family:inherit;list-style:none;color:var(--wmcolor-timepicker-option-text)}:host .wrapper .inner-wrapper .options [role=option]:hover{background:var(--wmcolor-timepicker-option-background-hover);outline:none}:host .wrapper .inner-wrapper .options [role=option]:focus{outline:none;background:var(--wmcolor-timepicker-option-background-focus)}:host .wrapper .inner-wrapper .options [role=option]:not(:last-child){border-bottom:2px solid;border-color:var(--wmcolor-timepicker-option-border)}:host .wrapper .inner-wrapper .options.open{-ms-transform:scale(1, 1);-webkit-transform:scale(1, 1);-moz-transform:scale(1, 1);transform:scale(1, 1)}: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,:host .wrapper.focus .inner-wrapper{outline:2px solid var(--wmcolor-input-border-focus);border-color:var(--wmcolor-input-border-focus)}";
+const WmTimepickerStyle0 = wmTimepickerCss;
 
 const Timepicker = class {
     constructor(hostRef) {
@@ -285,13 +286,13 @@ const Timepicker = class {
         return this.times.map((time, index$1) => (index.h("li", { id: `option${index$1 + 1}`, "data-time": time, role: "option", onClick: () => this.handleOptionClick(time) }, this.reformatTimeInternal("12", time))));
     }
     render() {
-        return (index.h(index.Host, { onBlur: () => this.close(false) }, index.h("div", { class: `wrapper label-${this.labelPosition} ${!!this.errorMessage ? "invalid" : ""}`, ref: (t) => (this.tpWrapper = t) }, index.h("div", { class: "label-wrapper" }, this.labelPosition !== "none" && (index.h("label", { id: "label", class: "label", htmlFor: "time-input" }, this.label, this.requiredField && (index.h("span", { class: "required", "aria-hidden": "true" }, "*"))))), index.h("div", null, index.h("div", { class: "inner-wrapper" }, index.h("input", { id: "time-input", "aria-label": this.label, "aria-describedby": "error", ref: (el) => (this.inputEl = el), onBlur: () => this.handleInputBlur(), onInput: () => (this.value = this.inputEl.value), disabled: this.isDisabled, "aria-required": this.requiredField ? "true" : null, placeholder: this.timeFormat, autocomplete: "off", value: this.value, onFocus: () => this.tpWrapper.classList.add("focus") }), index.h("button", { id: "btn", ref: (el) => (this.buttonEl = el), disabled: this.isDisabled, "aria-controls": "list", "aria-expanded": this.isExpanded ? "true" : "false", "aria-label": this.buttonAriaLabel, "aria-describedby": "time-input", onClick: () => (this.isExpanded ? this.close() : this.open()),
+        return (index.h(index.Host, { key: '58694542ea396f6874a0889ac5fdd608477e01f4', onBlur: () => this.close(false) }, index.h("div", { key: '182422d05a01af98eb1fcf95817cec6ee95a81b9', class: `wrapper label-${this.labelPosition} ${!!this.errorMessage ? "invalid" : ""}`, ref: (t) => (this.tpWrapper = t) }, index.h("div", { key: 'ac2f32d2e2e35fb5014a5e8c44bdecc3e3963c0e', class: "label-wrapper" }, this.labelPosition !== "none" && (index.h("label", { key: '6cd54b3142c4ca0a88bf8e22a2074f67f72e1423', id: "label", class: "label", htmlFor: "time-input" }, this.label, this.requiredField && (index.h("span", { key: '41f2f167ccbfbd81c7d37396f25c22a5db4a5baf', class: "required", "aria-hidden": "true" }, "*"))))), index.h("div", { key: '9c9f880595e1de671d24b327a47e17e03a056ab6' }, index.h("div", { key: '7a58504c80378f052e7da86692f53630c15b6837', class: "inner-wrapper" }, index.h("input", { key: 'df44714cfb58a6ef9e49d548b732f1daa70dddfa', id: "time-input", "aria-label": this.label, "aria-describedby": "error", ref: (el) => (this.inputEl = el), onBlur: () => this.handleInputBlur(), onInput: () => (this.value = this.inputEl.value), disabled: this.isDisabled, "aria-required": this.requiredField ? "true" : null, placeholder: this.timeFormat, autocomplete: "off", value: this.value, onFocus: () => this.tpWrapper.classList.add("focus") }), index.h("button", { key: '40e964286b360d9c86c54065c2acf6f761ad6a03', id: "btn", ref: (el) => (this.buttonEl = el), disabled: this.isDisabled, "aria-controls": "list", "aria-expanded": this.isExpanded ? "true" : "false", "aria-label": this.buttonAriaLabel, "aria-describedby": "time-input", onClick: () => (this.isExpanded ? this.close() : this.open()),
             // This addresses an issue in Safari, where clicking buttons does not focus them
             // if the button does not receive focus when clicked, Timepicker incorrectly emits a blur event
             onMouseDown: (ev) => {
                 ev.preventDefault();
                 this.buttonEl.focus();
-            } }, index.h("span", { class: "clock" })), index.h("ul", { class: `options ${this.isExpanded ? "open" : ""}  ${this.openUp ? "upwards" : ""}`, id: "list", role: "listbox", "aria-labelledby": "label", "aria-describedby": this.isExpanded ? "collapsed" : null, tabindex: -1, ref: (el) => (this.optionsEl = el) }, this.renderOptions())), index.h("div", { id: "error", class: "error" }, this.errorMessage)), index.h("div", { id: "live-polite", class: "sr-only", "aria-live": "polite", "aria-atomic": "true", ref: (el) => (this.liveRegionEl = el) }))));
+            } }, index.h("span", { key: 'd6912b075f5ad8396b82b6d8f562e41698cfe62f', class: "clock" })), index.h("ul", { key: '458b1c42f853567c26a32f6538ed6c6ba629c38f', class: `options ${this.isExpanded ? "open" : ""}  ${this.openUp ? "upwards" : ""}`, id: "list", role: "listbox", "aria-labelledby": "label", "aria-describedby": this.isExpanded ? "collapsed" : null, tabindex: -1, ref: (el) => (this.optionsEl = el) }, this.renderOptions())), index.h("div", { key: '2c561ba815cf53ecb94e21864be52c72fc7b8c13', id: "error", class: "error" }, this.errorMessage)), index.h("div", { key: '6f216c9a6539cf1800dfe944d762e31dc9c3422e', id: "live-polite", class: "sr-only", "aria-live": "polite", "aria-atomic": "true", ref: (el) => (this.liveRegionEl = el) }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }
@@ -301,6 +302,6 @@ const Timepicker = class {
         "errorMessage": ["announceError"]
     }; }
 };
-Timepicker.style = wmTimepickerCss;
+Timepicker.style = WmTimepickerStyle0;
 
 exports.wm_timepicker = Timepicker;

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

@@ -2,10 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-e86c28b6.js');
-const functions = require('./functions-3be85c6d.js');
+const index = require('./index-788526f5.js');
+const functions = require('./functions-05e7ad5a.js');
 
 const wmToggletipCss = ":host{--button-size:16px}:host(.size-small){--button-size:16px}:host(.size-small) .button:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px}:host(.size-large){--button-size:40px}:host(.size-large) .button:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:-3px}:host{--wmcolor-toggletip-background:var(--wmcolor-background-dark);--wmcolor-toggletip-icon-background:var(--wmcolor-background-dark);--wmcolor-toggletip-icon-text:var(--wmcolor-icon-ondark);--wmcolor-toggletip-text:var(--wmcolor-text-ondark);display:inline-block;position:relative;height:var(--button-size);width:var(--button-size);text-transform:none;font-weight:normal}:host .button{display:-ms-flexbox;display:flex;background:none;border:none;padding:0;width:inherit;height:inherit;border-radius:50%;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;position:relative;cursor:pointer}:host .button: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:\"\\f2fc\";font-size:16px;color:var(--wmcolor-toggletip-icon-background);background:radial-gradient(var(--wmcolor-toggletip-icon-text) 40%, transparent 0%)}:host .button:focus-visible{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:-3px}:host .tooltip{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden;clip:rect(0, 0, 0, 0);pointer-events:none;font-family:inherit;font-size:0.875rem;text-transform:none;font-weight:normal;background:var(--wmcolor-tooltip-background);color:var(--wmcolor-tooltip-text);padding:0.375rem;line-height:normal;z-index:30;white-space:nowrap}:host .tooltip.hover{clip:auto;width:auto;height:auto;opacity:1;-webkit-transition:opacity 500ms 500ms;transition:opacity 500ms 500ms;padding:0.375rem;white-space:nowrap}:host .toggletip{position:absolute;max-width:13.75rem;width:-webkit-max-content;width:-moz-max-content;width:max-content;padding:0.5rem 0.75rem;border-radius:0.1875rem;background:var(--wmcolor-toggletip-background);color:var(--wmcolor-toggletip-text);font-size:14px;z-index:30}:host .toggletip.top:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;top:100%;border-top-color:var(--wmcolor-toggletip-background);border-top-width:0.25rem;border-left-width:0.375rem;border-right-width:0.375rem;margin-left:-0.375rem;left:50%}:host .toggletip.bottom:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;bottom:100%;border-bottom-color:var(--wmcolor-toggletip-background);border-bottom-width:0.25rem;border-left-width:0.375rem;border-right-width:0.375rem;margin-left:-0.375rem;left:50%}:host .toggletip.right:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;bottom:100%;border-right-color:var(--wmcolor-toggletip-background);border-right-width:0.25rem;border-top-width:0.375rem;border-bottom-width:0.375rem;border-left-width:0px;top:calc(50% - 6px);left:-0.1875rem}:host .toggletip.left:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;bottom:100%;border-left-color:var(--wmcolor-toggletip-background);border-left-width:0.25rem;border-top-width:0.375rem;border-bottom-width:0.375rem;border-right-width:0px;top:calc(50% - 6px);right:-0.1875rem}:host .toggletip.bottom-right:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;bottom:100%;border-bottom-color:var(--wmcolor-toggletip-background);border-bottom-width:0.25rem;border-left-width:0.375rem;border-right-width:0.375rem;margin-left:-0.375rem;left:50%;margin-left:unset;left:0.875rem}:host .toggletip.bottom-left:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;bottom:100%;border-bottom-color:var(--wmcolor-toggletip-background);border-bottom-width:0.25rem;border-left-width:0.375rem;border-right-width:0.375rem;margin-left:-0.375rem;left:50%;left:unset;margin-left:unset;right:0.875rem}:host .toggletip.top-right:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;top:100%;border-top-color:var(--wmcolor-toggletip-background);border-top-width:0.25rem;border-left-width:0.375rem;border-right-width:0.375rem;margin-left:-0.375rem;left:50%;margin-left:unset;left:0.875rem}:host .toggletip.top-left:before{content:\"\";position:absolute;border:solid transparent;height:0;width:0;pointer-events:none;top:100%;border-top-color:var(--wmcolor-toggletip-background);border-top-width:0.25rem;border-left-width:0.375rem;border-right-width:0.375rem;margin-left:-0.375rem;left:50%;left:unset;margin-left:unset;right:0.875rem}:host .toggletip.hidden{-webkit-transform:scale(0, 0) !important;transform:scale(0, 0) !important;visibility:hidden}:host .toggletip{top:calc(var(--button-size) / 2);left:calc(var(--button-size) / 2)}:host .toggletip.top{-webkit-transform:translate(-50%, calc(-100% - 18px));transform:translate(-50%, calc(-100% - 18px))}:host .toggletip.bottom{-webkit-transform:translate(-50%, 18px);transform:translate(-50%, 18px)}:host .toggletip.right{-webkit-transform:translate(18px, -50%);transform:translate(18px, -50%)}:host .toggletip.left{-webkit-transform:translate(calc(-100% - 18px), -50%);transform:translate(calc(-100% - 18px), -50%)}:host .toggletip.bottom-right{-webkit-transform:translate(-20px, 18px);transform:translate(-20px, 18px)}:host .toggletip.bottom-left{-webkit-transform:translate(calc(-100% + 20px), 18px);transform:translate(calc(-100% + 20px), 18px)}:host .toggletip.top-right{-webkit-transform:translate(-20px, calc(-100% - 18px));transform:translate(-20px, calc(-100% - 18px))}:host .toggletip.top-left{-webkit-transform:translate(calc(-100% + 20px), calc(-100% - 18px));transform:translate(calc(-100% + 20px), calc(-100% - 18px))}: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 WmToggletipStyle0 = wmToggletipCss;
 
 const Toggletip = class {
     constructor(hostRef) {
@@ -105,13 +106,13 @@ const Toggletip = class {
         }
     }
     render() {
-        return (index.h(index.Host, { class: `size-${this.targetSize}` }, index.h("button", { class: "button", type: "button", "aria-label": this.label, onClick: () => this.open(),
+        return (index.h(index.Host, { key: '8f5da43befa9de791cb44afba532182f6df0a81d', class: `size-${this.targetSize}` }, index.h("button", { key: '81c79d18ff76953fbf9dce6192011085ccb296ba', class: "button", type: "button", "aria-label": this.label, onClick: () => this.open(),
             // In order to position the tooltip identically to the toggletip, it's presence is determined by these four events
-            onMouseEnter: () => functions.showTooltip(this.tooltipPosition, this.el, this.tooltipMessage), onMouseLeave: () => functions.hideTooltip(), onFocus: () => functions.showTooltip(this.tooltipPosition, this.el, this.tooltipMessage), onBlur: () => this.handleBlur() }), index.h("div", { ref: (el) => (this.toggletipEl = el), class: `toggletip ${this.isOpen ? "" : "hidden"} ${this.tooltipPosition}` }, this.tooltip), index.h("div", { ref: (el) => (this.liveRegionEl = el), class: "live-region sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true" })));
+            onMouseEnter: () => functions.showTooltip(this.tooltipPosition, this.el, this.tooltipMessage), onMouseLeave: () => functions.hideTooltip(), onFocus: () => functions.showTooltip(this.tooltipPosition, this.el, this.tooltipMessage), onBlur: () => this.handleBlur() }), index.h("div", { key: '3b183d1c1624cbadb6b774c55c0debcb99785c6d', ref: (el) => (this.toggletipEl = el), class: `toggletip ${this.isOpen ? "" : "hidden"} ${this.tooltipPosition}` }, this.tooltip), index.h("div", { key: '45e77332889bdfc552906127f24452ee0c97fe27', ref: (el) => (this.liveRegionEl = el), class: "live-region sr-only", role: "status", "aria-live": "polite", "aria-atomic": "true" })));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }
 };
-Toggletip.style = wmToggletipCss;
+Toggletip.style = WmToggletipStyle0;
 
 exports.wm_toggletip = Toggletip;

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

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-e86c28b6.js');
-const intl = require('./intl-567eb9d8.js');
-require('./functions-3be85c6d.js');
+const index = require('./index-788526f5.js');
+const intl = require('./intl-2b550151.js');
+require('./functions-05e7ad5a.js');
 
 const wmUploaderCss = ":host .wm-button{-ms-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-moz-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;width:100%;border:2px solid transparent;font-family:inherit;font-size:0.75rem;font-weight:700;min-height:2.75rem;padding:12px 1.3333333333em;cursor:pointer;position:relative;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-decoration:none;text-transform:uppercase;letter-spacing:0.01875rem;overflow-wrap:break-word;-webkit-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button{min-height:3.3333333333em}}:host .wm-button.nowrap{display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .wm-button:focus,:host .wm-button:focus-visible{outline:none;-webkit-box-shadow:none;box-shadow:none}:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled){outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px}:host .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption){-ms-transform:scale(0.9, 0.9);-webkit-transform:scale(0.9, 0.9);-moz-transform:scale(0.9, 0.9);transform:scale(0.9, 0.9)}:host .wm-button .mdi{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}:host .wm-button:not(.-icononly):not(.-navigational) .mdi{margin-right:0.3125rem;font-size:0.875rem}:host .wm-button[dir=RTL] :not(.-icononly) .mdi{margin-left:0.3125rem;margin-right:0}:host .wm-button.-primary:not(.-textonly){background:var(--wmcolor-button-background-primary);color:var(--wmcolor-button-text-primary)}:host .wm-button.-primary:not(.-textonly):not(:focus){-webkit-box-shadow:0 0 4px 0 rgba(0, 0, 0, 0.14), 0 3px 4px 0 rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);box-shadow:0 0 4px 0 rgba(0, 0, 0, 0.14), 0 3px 4px 0 rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2)}:host .wm-button.-primary:not(.-textonly):hover:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-primary-hover)}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled){color:var(--wmcolor-button-text-primary-ondark);background:var(--wmcolor-button-background-primary-ondark)}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover{background:var(--wmcolor-button-background-primary-hover-ondark)}:host .wm-button.-secondary{color:var(--wmcolor-button-text-secondary);border:2px solid var(--wmcolor-button-border-secondary);background:var(--wmcolor-button-background-secondary)}:host .wm-button.-secondary:hover:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-secondary-hover);color:var(--wmcolor-button-text-secondary-hover);border-color:transparent}:host .wm-button.-secondary.dark:not(:disabled):not(.disabled){color:var(--wmcolor-button-text-secondary-ondark);background:var(--wmcolor-button-background-secondary-ondark);border-color:var(--wmcolor-button-border-secondary-ondark)}:host .wm-button.-secondary.dark:not(:disabled):not(.disabled):hover{color:var(--wmcolor-button-text-secondary-hover-ondark);background:var(--wmcolor-button-background-secondary-hover-ondark);border-color:transparent}:host .wm-button.-textonly{color:var(--wmcolor-button-text-textonly);-webkit-box-shadow:none;box-shadow:none;display:inline-block;letter-spacing:0;text-transform:none;text-align:initial;font-size:0.875rem;border:none;background:transparent;padding:0;height:auto;min-height:unset;border-radius:0;line-height:1;overflow-wrap:anywhere;border-radius:2px}:host .wm-button.-textonly+.-textonly{margin-left:0.3125rem}:host .wm-button.-textonly.small{font-size:0.625rem}:host .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete){text-decoration:underline}:host .wm-button.-textonly.dark{color:var(--wmcolor-button-text-textonly-ondark)}:host .wm-button.-textonly.dark:hover:not(:disabled):not(.disabled){text-decoration:underline}:host .wm-button.-textonly.-permanentlydelete{color:var(--wmcolor-button-background-delete)}:host .wm-button.-textonly.-permanentlydelete:hover:not(:disabled):not(.disabled):not(.dark){text-decoration:underline}:host .wm-button.-textonly.-permanentlydelete.dark:not(:disabled):not(.disabled){color:var(--wmcolor-button-text-textonly-ondark)}:host .wm-button.-icononly,:host .wm-button.-navigational{-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;font-size:1rem;padding:0;height:auto;line-height:1;min-width:2.75rem;min-height:2.75rem;text-align:center;letter-spacing:normal}:host .wm-button.-icononly:not(:focus),:host .wm-button.-navigational:not(:focus){-webkit-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button.-icononly,:host .wm-button.-navigational{min-width:2.5rem;min-height:2.5rem}}:host .wm-button.-icononly .mdi,:host .wm-button.-navigational .mdi{font-size:1.12rem}:host .wm-button.-icononly{border-width:1px !important;color:var(--wmcolor-button-icon-icononly);border-color:var(--wmcolor-button-border-icononly);background-color:var(--wmcolor-button-background-icononly)}:host .wm-button.-icononly: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}:host .wm-button.-icononly:hover:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-icononly-hover);color:var(--wmcolor-button-icon-icononly-hover);border-color:transparent}:host .wm-button.-icononly.dark:not(:disabled):not(.disabled){color:var(--wmcolor-button-icon-icononly-ondark);background:var(--wmcolor-button-background-icononly-ondark);border-color:var(--wmcolor-button-border-icononly-ondark)}:host .wm-button.-icononly.dark:not(:disabled):not(.disabled):hover{color:var(--wmcolor-button-icon-icononly-hover-ondark);background:var(--wmcolor-button-background-icononly-hover-ondark);border-color:transparent}:host .wm-button.-navigational{border:none !important;background-color:var(--wmcolor-button-background-navigational)}:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled){color:var(--wmcolor-button-icon-navigational)}:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled):hover,:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled).selected{background-color:var(--wmcolor-button-background-navigational-hover)}:host .wm-button.-navigational: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}:host .wm-button.-navigational.dark:not(:disabled):not(.disabled){color:var(--wmcolor-button-icon-navigational-ondark);background:var(--wmcolor-button-background-navigational-ondark)}:host .wm-button.-navigational.dark:not(:disabled):not(.disabled):hover{color:var(--wmcolor-button-icon-navigational-hover-ondark);background:var(--wmcolor-button-background-navigational-hover-ondark)}:host .wm-button.-permanentlydelete:not(.-textonly){background:var(--wmcolor-button-background-delete);border-color:var(--wmcolor-button-background-delete);color:var(--wmcolor-button-text-delete)}:host .wm-button.-permanentlydelete:not(.-textonly):hover:not(:disabled):not(.disabled):not(.dark){background:var(--wmcolor-button-background-delete-hover);border-color:var(--wmcolor-button-background-delete-hover)}:host .wm-button.-permanentlydelete:not(.-textonly).dark:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-delete);border-color:var(--wmcolor-button-background-delete);color:var(--wmcolor-button-text-delete)}:host .wm-button.-permanentlydelete:not(.-textonly).dark:not(:disabled):not(.disabled):hover{background:var(--wmcolor-button-background-delete-hover);border-color:var(--wmcolor-button-background-delete-hover)}:host .wm-button.-pairnegative{background:var(--wmcolor-button-background-negative);border-color:var(--wmcolor-button-background-negative);color:var(--wmcolor-button-text-negative)}:host .wm-button.-pairnegative:hover:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-negative-hover);border-color:var(--wmcolor-button-background-negative-hover)}:host .wm-button.-pairpositive{background:var(--wmcolor-button-background-positive);border-color:var(--wmcolor-button-background-positive);color:var(--wmcolor-button-text-positive)}:host .wm-button.-pairpositive:hover:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-positive-hover);border-color:var(--wmcolor-button-background-positive-hover)}:host .wm-button.-selector,:host .wm-button.-selector-primary{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;display:block;border-radius:3px;height:2.75rem;min-width:11.4375rem;padding:0 1.875rem 0 0.9375rem;line-height:normal;font-family:inherit;font-weight:700;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.01875rem;text-align:left}@media screen and (min-width: 48rem){:host .wm-button.-selector,:host .wm-button.-selector-primary{height:2.5rem}}:host .wm-button.-selector:before,:host .wm-button.-selector-primary: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:\"\\f140\";position:absolute;right:0.5625rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);font-size:1.12rem;font-weight:700;pointer-events:none}:host .wm-button.-selector:active,:host .wm-button.-selector-primary:active{-ms-transform:scale(1, 1) !important;-webkit-transform:scale(1, 1) !important;transform:scale(1, 1) !important}:host .wm-button.-selector::-moz-focus-inner,:host .wm-button.-selector-primary::-moz-focus-inner{border:0}:host .wm-button.-selector .overflowcontrol,:host .wm-button.-selector-primary .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:visible}:host .wm-button.-selector{background:var(--wmcolor-button-background-selector);color:var(--wmcolor-button-text-selector);border-color:var(--wmcolor-button-border-selector)}:host .wm-button.-selector:hover:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-selector-hover);color:var(--wmcolor-button-text-selector-hover);border-color:transparent}:host .wm-button.-selector.dark:not(:disabled):not(.disabled){color:var(--wmcolor-button-text-selector-ondark);border-color:var(--wmcolor-button-border-selector-ondark);background:var(--wmcolor-button-background-selector-ondark)}:host .wm-button.-selector.dark:not(:disabled):not(.disabled):hover{color:var(--wmcolor-button-text-selector-hover-ondark);background:var(--wmcolor-button-background-selector-hover-ondark);border-color:transparent}:host .wm-button.-selector-primary{background:var(--wmcolor-button-background-selectorprimary);color:var(--wmcolor-button-text-selectorprimary)}:host .wm-button.-selector-primary:hover:not(:disabled):not(.disabled){background:var(--wmcolor-button-background-selectorprimary-hover)}:host .wm-button.-selector-primary.dark:not(:disabled):not(.disabled){color:var(--wmcolor-button-text-selectorprimary-ondark);background:var(--wmcolor-button-background-selectorprimary-ondark)}:host .wm-button.-selector-primary.dark:not(:disabled):not(.disabled):hover{color:var(--wmcolor-button-text-selectorprimary-hover-ondark);background:var(--wmcolor-button-background-selectorprimary-hover-ondark)}:host .wm-button:disabled,:host .wm-button.disabled{cursor:default;pointer-events:none}:host .wm-button:disabled.-secondary:not(.-permanentlydelete),:host .wm-button.disabled.-secondary:not(.-permanentlydelete){-webkit-box-shadow:none;box-shadow:none;border-color:var(--wmcolor-button-border-secondary-disabled);color:var(--wmcolor-button-text-secondary-disabled)}:host .wm-button:disabled.-primary,:host .wm-button.disabled.-primary{background:var(--wmcolor-button-background-primary-disabled);color:var(--wmcolor-button-text-primary-disabled)}:host .wm-button:disabled.-permanentlydelete,:host .wm-button.disabled.-permanentlydelete{background:var(--wmcolor-button-background-delete-disabled);color:var(--wmcolor-button-text-delete-disabled);border-color:var(--wmcolor-button-background-delete-disabled)}:host .wm-button:disabled.-pairnegative,:host .wm-button.disabled.-pairnegative{background:var(--wmcolor-button-background-negative-disabled);border-color:var(--wmcolor-button-background-negative-disabled);color:var(--wmcolor-button-text-negative-disabled)}:host .wm-button:disabled.-pairpositive,:host .wm-button.disabled.-pairpositive{background:var(--wmcolor-button-background-positive-disabled);border-color:var(--wmcolor-button-background-positive-disabled);color:var(--wmcolor-button-text-positive-disabled)}:host .wm-button:disabled.-selector,:host .wm-button.disabled.-selector{color:var(--wmcolor-button-text-selector-disabled);border-color:var(--wmcolor-button-border-selector-disabled)}:host .wm-button:disabled.-selector-primary,:host .wm-button.disabled.-selector-primary{background:var(--wmcolor-button-background-selectorprimary-disabled);color:var(--wmcolor-button-text-selectorprimary-disabled)}:host .wm-button:disabled.-navigational,:host .wm-button.disabled.-navigational{color:var(--wmcolor-button-icon-navigational-disabled)}:host .wm-button:disabled.-icononly,:host .wm-button.disabled.-icononly{color:var(--wmcolor-button-icon-icononly-disabled);border-color:var(--wmcolor-button-border-icononly-disabled)}:host .wm-button:disabled.-textonly,:host .wm-button.disabled.-textonly{color:var(--wmcolor-button-text-textonly-disabled);background:transparent}:host .wm-button:disabled.dark.-icononly,:host .wm-button.disabled.dark.-icononly{background:transparent;color:var(--wmcolor-button-icon-icononly-disabled-ondark);border-color:var(--wmcolor-button-border-icononly-disabled-ondark)}:host .wm-button:disabled.dark.-navigational,:host .wm-button.disabled.dark.-navigational{color:var(--wmcolor-button-icon-navigational-disabled-ondark)}:host .wm-button:disabled.dark.-textonly,:host .wm-button.disabled.dark.-textonly{color:var(--wmcolor-button-text-textonly-disabled-ondark)}:host .wm-button:disabled.dark.-primary,:host .wm-button.disabled.dark.-primary{color:var(--wmcolor-button-text-primary-disabled-ondark);background:var(--wmcolor-button-background-primary-disabled-ondark)}:host .wm-button:disabled.dark.-secondary,:host .wm-button.disabled.dark.-secondary{background:transparent;color:var(--wmcolor-button-text-secondary-disabled-ondark);border-color:var(--wmcolor-button-border-secondary-disabled-ondark)}:host .wm-button:disabled.dark.-selector,:host .wm-button.disabled.dark.-selector{color:var(--wmcolor-button-text-selector-disabled-ondark);border-color:var(--wmcolor-button-border-selector-disabled-ondark);background:var(--wmcolor-button-background-selector-disabled-ondark)}:host .wm-button:disabled.dark.-selector-primary,:host .wm-button.disabled.dark.-selector-primary{color:var(--wmcolor-button-text-selectorprimary-disabled-ondark);background:var(--wmcolor-button-background-selectorprimary-disabled-ondark)}:host .wm-button:disabled.dark.-permanentlydelete:not(.-textonly),:host .wm-button.disabled.dark.-permanentlydelete:not(.-textonly){background:var(--wmcolor-button-background-delete-disabled-ondark);color:var(--wmcolor-button-text-delete-disabled-ondark)}:host a.wm-button,:host label.wm-button{height:auto;padding-top:0.75rem;padding-bottom:0.75rem}:host{display:block;position:relative;max-width:1140px}:host[dir=RTL] .mdi{margin-left:0.3125rem;margin-right:0}:host input:focus-visible+.wm-button{outline:3px solid var(--wmcolor-interactive-focus);outline-offset:2px}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}.wm-button.disabled{pointer-events:initial !important}.wrapper{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem}.wrapper .label{display:block;line-height:normal;font-weight:600;white-space:nowrap;margin-bottom:0.25rem}.wrapper .label .required{color:var(--wmcolor-text-required)}.wrapper.label-left{-ms-flex-direction:row;flex-direction:row}.wrapper.label-left .label-wrapper{line-height:2.5rem}.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}.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}.wrapper.invalid .label{color:var(--wmcolor-text-error)}.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] .wrapper.invalid .label:after{margin-left:0;margin-right:0.3125rem}.wrapper.rtl.label-left .label{margin-right:0;margin-left:0.75rem}#label{margin-bottom:0.5rem}.info-wrapper{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.info-wrapper .info{font-size:0.875rem;margin-left:1rem}.accepted-types{font-size:0.875rem}.notif-wrapper{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;margin-bottom:0.75rem}.requirements{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:0.875rem;margin-left:1rem}.notif,#error{font-size:0.875rem;font-style:italic}.notif#error,#error#error{display:block;font-style:italic;color:var(--wmcolor-text-error);font-size:0.875rem}.notif#error:not(:empty),#error#error:not(:empty){margin-top:0.25rem}.list-container{overflow-y:unset}.list-container.checkmark-spacer{margin-right:2.75rem}.list-container .file-list{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:0.5rem;padding:0;width:100%;margin:0}.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}::slotted(wm-file:nth-of-type(1)){margin-top:2.5rem}";
+const WmUploaderStyle0 = wmUploaderCss;
 
 const Uploader = class {
     constructor(hostRef) {
@@ -205,9 +206,9 @@ const Uploader = class {
         return (index.h("div", { class: `wrapper ${this.errorMessage ? "invalid" : ""}` }, index.h("div", { id: "label", class: `label` }, this.label, this.requiredField && (index.h("span", { class: "required", "aria-hidden": "true" }, "*")))));
     }
     render() {
-        return (index.h(index.Host, null, this.label && this.renderLabel(), this.renderHeader(), this.renderListContainer(), index.h("div", { ref: (el) => (this.assertiveLiveRegionEl = el), class: "live-region sr-only", "aria-live": "assertive" // since it's directly linked to the action the user took, it should be read in priority. With polite, some messages get dismissed in favor of the page title
+        return (index.h(index.Host, { key: '4f9a5f1221aa84bad9e734bfba6a87f89fcdfd84' }, this.label && this.renderLabel(), this.renderHeader(), this.renderListContainer(), index.h("div", { key: '59f21688992efe6da96d837efee78d65db18f8d4', ref: (el) => (this.assertiveLiveRegionEl = el), class: "live-region sr-only", "aria-live": "assertive" // since it's directly linked to the action the user took, it should be read in priority. With polite, some messages get dismissed in favor of the page title
             ,
-            "aria-atomic": "true" }), index.h("div", { ref: (el) => (this.politeLiveRegionEl = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" })));
+            "aria-atomic": "true" }), index.h("div", { key: '1e68b8375c3d41706c5b84af7485d75f99e35dd9', ref: (el) => (this.politeLiveRegionEl = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" })));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }
@@ -215,6 +216,6 @@ const Uploader = class {
         "errorMessage": ["announceError"]
     }; }
 };
-Uploader.style = wmUploaderCss;
+Uploader.style = WmUploaderStyle0;
 
 exports.wm_uploader = Uploader;

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-e86c28b6.js');
+const index = require('./index-788526f5.js');
 
 const Wrapper = class {
     constructor(hostRef) {

package/dist/collection/collection-manifest.json

@@ -43,8 +43,8 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.8.2",
-    "typescriptVersion": "5.2.2"
+    "version": "4.21.0",
+    "typescriptVersion": "5.5.3"
   },
   "collections": [],
   "bundles": [

package/dist/collection/components/charts/chartFunctions.js

@@ -68,7 +68,7 @@ export const allChartsDetails = {
     bar5: {
         size: 400,
         colors: [
-            colors.gray,
+            colors.gray, // this is only used if prop notStartedColor is set
             colors.lavender,
             colors.midnight,
             "#0089e4",

package/dist/collection/components/charts/priv-chart-popover/priv-chart-popover.js

@@ -111,11 +111,11 @@ export class ChartPopover {
         const titleAffordance = this.sliceDetails &&
             this.sliceDetails.title &&
             (this.sliceDetails.title[0] === "-" ? "negative" : this.sliceDetails.title[0] === "+" ? "positive" : "");
-        return (h(Host, null, !!this.open && this.sliceDetails ? (h("div", { "aria-hidden": "true", class: "popover" }, h("h1", { class: `title ${titleAffordance}` }, this.sliceDetails.title), h("p", { class: "text" }, this.sliceDetails.text), this.sliceDetails.buttonText ? (
+        return (h(Host, { key: 'cf297947c1ddcfb70f303a0b2dc7bf787c4eb3eb' }, !!this.open && this.sliceDetails ? (h("div", { "aria-hidden": "true", class: "popover" }, h("h1", { class: `title ${titleAffordance}` }, this.sliceDetails.title), h("p", { class: "text" }, this.sliceDetails.text), this.sliceDetails.buttonText ? (
         // @ts-ignore
         h("button", { tabindex: "-1",
             // @ts-ignore
-            focusable: "false", class: "popover-button", onClick: () => this.handleButtonClick() }, h("svg", { class: "btn-icon", height: "9", width: "9" }, h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), h("span", { class: "button-text" }, this.sliceDetails.buttonText))) : (""))) : (""), h("div", { ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
+            focusable: "false", class: "popover-button", onClick: () => this.handleButtonClick() }, h("svg", { class: "btn-icon", height: "9", width: "9" }, h("path", { fill: "#575195", d: "M0 3.38v2.25h9V3.38H0zM0 0v2.25h4.5V0H0zm6.19 6.75H0V9h6.19V6.75z" })), h("span", { class: "button-text" }, this.sliceDetails.buttonText))) : (""))) : (""), h("div", { key: 'a797c755a77ea252b20238735a4b10957897a897', ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "polite", "aria-atomic": "true" }, this.open && this.renderLiveRegion())));
     }
     static get is() { return "priv-chart-popover"; }
     static get originalStyleUrls() {

package/dist/collection/components/charts/wm-chart/wm-chart.js

@@ -140,7 +140,7 @@ export class Chart {
         }
     }
     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: 'fef09b99e871f75d1a4b8be37962173f5acd130f', onBlur: () => exitChart.call(this) }, h("div", { key: 'f85cd9ebbe7f81bcdbca160eb3ec1181e4cc15b7', 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: '3477c8164024c644ab1a6cd295b729152879c7bb', id: `label-${this.uid}`, class: `label --${this.labelPosition}`, htmlFor: `graphic-${this.uid}` }, h("span", { key: '2d5365644e753f148cde734149dfb252f05551c0', 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: '95fd6bf117636b12d117e03834e5b63d90e6fd7f', class: this.isTabbing ? "user-is-tabbing" : "", onIntChartPopoverOpenChanged: (ev) => this.handlePopoverOpenChanged(ev) }), this.isBar && !this.printMode && renderHiddenValuesMessage()), renderInstructionsText()));
     }
     static get is() { return "wm-chart"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/charts/wm-line-chart/wm-line-chart.js

@@ -12,12 +12,12 @@ export class LineChart {
         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 () => {
@@ -413,7 +413,7 @@ export class LineChart {
             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
             };
         }
@@ -453,9 +453,9 @@ export class LineChart {
         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))));
     }
     static get is() { return "wm-line-chart"; }
     static get encapsulation() { return "shadow"; }

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

@@ -90,7 +90,7 @@ export class ProgressIndicator {
         }
     }
     render() {
-        return (h(Host, { onBlur: () => exitChart.call(this) }, h("div", { ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${this.mode} ${this.isTabbing && !this.userIsNavigating ? "user-is-tabbing" : ""}`, role: "application", "aria-label": this.ariaLabelText, tabindex: "0", "aria-roledescription": this.chartRoleDescription, "aria-describedby": `chart-instructions` }, h("label", { id: `label-${this.uid}`, class: `label ${this.barLabelsWidth && this.mode === "bar" ? "custom-width" : ""}`, style: { "--custom-label-width": this.barLabelsWidth }, htmlFor: `graphic-${this.uid}` }, h("span", { class: "label-text" }, this.label), this.subinfo ? h("span", { class: "subinfo" }, this.subinfo) : ""), this.mode && this.renderBarOrDoughnut(), this.mode === "doughnut" ? renderLegend.call(this, this.mode) : "", h("priv-chart-popover", { class: this.isTabbing ? "user-is-tabbing" : "", onIntChartPopoverOpenChanged: (ev) => this.handlePopoverOpenChanged(ev) }), this.mode === "doughnut" ? renderCompletionMessage.call(this) : ""), renderInstructionsText()));
+        return (h(Host, { key: '16620db2087213bc753d2d757c7790a41670b1ab', onBlur: () => exitChart.call(this) }, h("div", { key: 'c676d6afdd78059bff7ae59f8ee275886e5bf22a', ref: (el) => (this.componentWrapperEl = el), class: `component-wrapper ${this.mode} ${this.isTabbing && !this.userIsNavigating ? "user-is-tabbing" : ""}`, role: "application", "aria-label": this.ariaLabelText, tabindex: "0", "aria-roledescription": this.chartRoleDescription, "aria-describedby": `chart-instructions` }, h("label", { key: '1b863341957baf0839d36be915d0aa632d03873f', id: `label-${this.uid}`, class: `label ${this.barLabelsWidth && this.mode === "bar" ? "custom-width" : ""}`, style: { "--custom-label-width": this.barLabelsWidth }, htmlFor: `graphic-${this.uid}` }, h("span", { key: 'be37ff1bc3863b7603944139fd78a0d7a6884e46', class: "label-text" }, this.label), this.subinfo ? h("span", { class: "subinfo" }, this.subinfo) : ""), this.mode && this.renderBarOrDoughnut(), this.mode === "doughnut" ? renderLegend.call(this, this.mode) : "", h("priv-chart-popover", { key: '8541969e643c69fd8e0090f69efd7c038ea1e2ea', class: this.isTabbing ? "user-is-tabbing" : "", onIntChartPopoverOpenChanged: (ev) => this.handlePopoverOpenChanged(ev) }), this.mode === "doughnut" ? renderCompletionMessage.call(this) : ""), renderInstructionsText()));
     }
     static get is() { return "wm-progress-indicator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/charts/wm-progress-monitor/wm-progress-monitor.js

@@ -59,7 +59,7 @@ export class ProgressMonitor {
         }))));
     }
     render() {
-        return (h(Host, { class: this.mode === "doughnut" ? "row" : "column" }, this.modeInitialized && this.groupLegend && this.mode === "bar" && this.renderLegend(), this.modeInitialized && h("slot", null)));
+        return (h(Host, { key: '6b654a2da62f9ca402ba16163e1d1497c5c99be8', class: this.mode === "doughnut" ? "row" : "column" }, this.modeInitialized && this.groupLegend && this.mode === "bar" && this.renderLegend(), this.modeInitialized && h("slot", { key: 'd3b70aa0e0c409bc0bcf2d6b20ad2b9c44c8eb11' })));
     }
     static get is() { return "wm-progress-monitor"; }
     static get encapsulation() { return "shadow"; }

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

@@ -544,11 +544,11 @@ export class PrivCalendar {
             }), class: "header-btn arw-btn" }, h("span", { class: "mdi" }, "\uF142"))), h("div", { "aria-labelledby": "popup-title-year", role: "grid", class: "months" }, h("div", { role: "row", class: "month-row" }, calendar_months.slice(0, 3).map((month, index) => this.renderMonth(month, index))), h("div", { role: "row", class: "month-row" }, calendar_months.slice(3, 6).map((month, index) => this.renderMonth(month, index + 3))), h("div", { role: "row", class: "month-row" }, calendar_months.slice(6, 9).map((month, index) => this.renderMonth(month, index + 6))), h("div", { role: "row", class: "month-row" }, calendar_months.slice(9).map((month, index) => this.renderMonth(month, index + 9))))));
     }
     render() {
-        return (h(Host, { onMouseOut: (ev) => {
+        return (h(Host, { key: 'bf3b27c085d62d04e59c469103af514a5652ca39', onMouseOut: (ev) => {
                 // @ts-ignore
                 if (!this.el.parentElement.contains(ev.toElement))
                     this.outOfCal.emit();
-            }, role: "application", "aria-describedby": "application" }, this.view === "day" ? this.renderDayView() : this.renderMonthView(), h("div", { id: "application", class: "sr-only" }, this.calName, this.calInstructions)));
+            }, role: "application", "aria-describedby": "application" }, this.view === "day" ? this.renderDayView() : this.renderMonthView(), h("div", { key: '3433d2109b066f3e3446cc6d8c486a5e303d6939', id: "application", class: "sr-only" }, this.calName, this.calInstructions)));
     }
     static get is() { return "priv-calendar"; }
     static get originalStyleUrls() {

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

@@ -429,23 +429,23 @@ 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": "start-date-input end-date-input", "aria-label": intl.formatMessage({
+        return (h(Host, { key: 'ffe68e278952d867cd9d1bf4945a91a9218aff41', "aria-busy": "false" }, h("div", { key: '256076b4ecb500f80bde6a0f4b74e0e090a8ebba', ref: (d) => (this.wrapperEl = d), class: "wrapper" }, h("div", { key: '1a16aee3f2c90b120fea6c3de7853a5f58f95c2b', class: `range-wrapper ${this.calWidth <= this.availSpace ? "cal" : ""}` }, h("div", { key: '2bf81bc7b7820b71820fa903f612247deb6b8592', class: "label-wrapper", id: "start-label-wrapper" }, h("label", { key: '09e8a0ee78eb5f19f6a3e94ce8c2bfefaff4a909', ref: (e) => (this.labelEl = e), id: "startlabel", htmlFor: "start-date-input", class: "label", title: `${this.labelStart} (${this.dateFormat})` }, this.labelStart, this.requiredField && (h("span", { key: '0deb9d862a52d6b044572a06645408805be1126e', "aria-hidden": "true", class: "required" }, "*")))), h("div", { key: 'ec5368e1736f8b83290238b483965aab0f9f3945', class: "label-wrapper", id: "end-label-wrapper" }, h("label", { key: '6cb070abde6ce9064a030c408894f29af6118984', id: "endlabel", htmlFor: "end-date-input", class: "label", title: `${this.labelEnd} (${this.dateFormat})` }, this.labelEnd, this.requiredField && (h("span", { key: 'e4def58969ee10495955c76ff6df4af0b721d98b', "aria-hidden": "true", class: "required" }, "*")))), h("input", { key: '141c909bdeae5c05fc5ca24bfe3f62c756c59bb1', 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", { key: '71e1f4d5bfac5687c6c0dc78b0c7bf0e23963932', id: "hyphen" }, "\u00A0-\u00A0"), h("input", { key: '66da2b524e10f19471dfe98e8088f29223fcf1e5', 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", { key: 'd13e35362381766550f1555db5bc86043f29ae55', class: "toggle-wrapper", id: "toggle-wrapper" }, this.calWidth <= this.availSpace && (h("button", { key: '083f289ad53ef80ebf5bcb04f28cb85f4bf1cce6', 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({
+            }), ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { key: 'c127dd1ac1f883218997250dc0455d2cd67b4e54', class: "calendar", title: intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",
-            }) })))), this.renderCalendars()), h("div", null, h("div", { id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), h("div", { id: "month-title", class: "sr-only" }, intl.formatMessage({
+            }) })))), this.renderCalendars()), h("div", { key: 'f73ab32bcf2cebc82a8afd9129a1d3fcf9e0bc2b' }, h("div", { key: '2d7f933a92f36483ecfd801c4ae17bf7baa92c71', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), h("div", { key: 'ca4fd9da247934ff4644b099c883fed0158d0c86', id: "month-title", class: "sr-only" }, intl.formatMessage({
             id: "date.selectMonth",
             defaultMessage: "Activate to select a month.",
             description: "Calendar button",
-        })), h("div", { id: "year-title", class: "sr-only" }, intl.formatMessage({
+        })), h("div", { key: '22d83e68a09a15072afcc3368fdf957838a5da1f', id: "year-title", class: "sr-only" }, intl.formatMessage({
             id: "date.selectYear",
             defaultMessage: "Activate to select a year.",
             description: "Calendar button",
-        }))), h("div", { id: "error", class: "error" }, this.errorMessage), h("div", { ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }))));
+        }))), h("div", { key: '6fbc73d0c1d280133b445c9fd4acd14a1be673e0', id: "error", class: "error" }, this.errorMessage), h("div", { key: '4dac5d364845b7a4c656db95e0aae877b902692b', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" }))));
     }
     static get is() { return "wm-date-range"; }
     static get encapsulation() { return "shadow"; }
@@ -720,14 +720,17 @@ export class DateRange {
                 "complexType": {
                     "signature": "(inputFormat: string, outputFormat: string, date?: string) => Promise<string>",
                     "parameters": [{
-                            "tags": [],
-                            "text": ""
+                            "name": "inputFormat",
+                            "type": "string",
+                            "docs": ""
                         }, {
-                            "tags": [],
-                            "text": ""
+                            "name": "outputFormat",
+                            "type": "string",
+                            "docs": ""
                         }, {
-                            "tags": [],
-                            "text": ""
+                            "name": "date",
+                            "type": "string | undefined",
+                            "docs": ""
                         }],
                     "references": {
                         "Promise": {
@@ -746,8 +749,9 @@ export class DateRange {
                 "complexType": {
                     "signature": "(input?: string) => Promise<boolean>",
                     "parameters": [{
-                            "tags": [],
-                            "text": ""
+                            "name": "input",
+                            "type": "string | undefined",
+                            "docs": ""
                         }],
                     "references": {
                         "Promise": {

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

@@ -98,12 +98,10 @@ export class DatePicker {
         this.el.dispatchEvent(event);
     }
     handleKey(ev) {
-        switch (ev.key) {
-            case "Escape":
-                ev.preventDefault();
-                ev.stopPropagation(); // prevents closing of parent modal
-                this.closePopup(true);
-                break;
+        if (ev.key === "Escape" && this.isExpanded) {
+            ev.preventDefault();
+            ev.stopPropagation(); // prevents closing of parent modal
+            this.closePopup(true);
         }
     }
     blurHandler() {
@@ -214,23 +212,23 @@ 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-label": intl.formatMessage({
+        return (h(Host, { key: 'daac54e642a4c00b37dff5167cf0fd3322b98874', "aria-busy": "false", class: `${this.errorMessage ? "invalid" : ""}` }, h("div", { key: '0633196770bcd3965a8fe60ecd1972653ed3e25c', ref: (d) => (this.dpWrapperEl = d), class: `wrapper label-${this.labelPosition} ${this.errorMessage ? "invalid" : ""}` }, h("div", { key: 'ba80e128d0345635d90c4641c508d05eb4d3794e', class: "label-wrapper", ref: (e) => (this.labelWrapperEl = e) }, this.labelPosition !== "none" && (h("label", { key: '4905e937c7e6249537c5ed43f77331883d006794', id: "datepickerLabel", htmlFor: "date-input", class: "label", title: `${this.label} (${this.dateFormat})` }, this.label, this.requiredField && (h("span", { key: '637e35c7f255629aa75cf177822154a1e6e6e7b3', "aria-hidden": "true", class: "required" }, "*"))))), h("div", { key: '8676b6e03022cd8787d0a77a0b3e6c4dd8419b59' }, h("div", { key: 'e9f24478e3beb32f38ef65aff197d7872e1f3d67', class: "single-wrapper input" }, h("input", { key: '4661fedeafd62c45e1aec2aad699faede4d750b6', 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", { key: '0a2afc12a5e44bcb8a9deb92c7171945c67289f4', class: "container", id: "wm-container" }, h("button", { key: 'b6b63ef23dee93ff470de4d5a5d2769086bcb808', 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({
+            }), "aria-describedby": "single-date-input", ref: (el) => (this.toggleEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { key: 'debb3ae89f32960a7a269b9f6c951f5bb7bfd874', class: "calendar", title: intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",
-            }) })), h("div", { class: `popup-wrapper ${this.calEl && this.calEl.view}-view ${this.openUp ? "expand-upwards" : ""}`, id: "popup-wrapper", ref: (el) => (this.popupEl = el), onClick: () => (this.popupClicked = true) }, h("div", { tabIndex: 0, onFocus: () => this.calEl.focusLastFocusable() }), h("priv-calendar", { ref: (el) => (this.calEl = el), startDate: this.calendarDate, focusDate: this.calendarDate, class: "inside" }), h("div", { tabIndex: 0, onFocus: () => this.calEl.focusFirstFocusable() })), h("div", { id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), h("div", { id: "month-title", class: "sr-only" }, intl.formatMessage({
+            }) })), h("div", { key: '87ff9723a2960d5725f5f731dcc0d30719a8bb09', class: `popup-wrapper ${this.calEl && this.calEl.view}-view ${this.openUp ? "expand-upwards" : ""}`, id: "popup-wrapper", ref: (el) => (this.popupEl = el), onClick: () => (this.popupClicked = true) }, h("div", { key: '989a9bc4bd537394bfb2fe1ecd83311bb57187d4', tabIndex: 0, onFocus: () => this.calEl.focusLastFocusable() }), h("priv-calendar", { key: '3253b7e256dc7137aae2c4c2a79099e0093ecc65', ref: (el) => (this.calEl = el), startDate: this.calendarDate, focusDate: this.calendarDate, class: "inside" }), h("div", { key: '9cacded01a3163bebd249d6ed4601ca9a6c3dfd0', tabIndex: 0, onFocus: () => this.calEl.focusFirstFocusable() })), h("div", { key: 'fe890d55779f0619bc6c144d1fd47cc2cb26fe04', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), h("div", { key: '71e28a0c1aaa2c1ddce511bfbf0d9cf6794382ab', id: "month-title", class: "sr-only" }, intl.formatMessage({
             id: "date.selectMonth",
             defaultMessage: "Activate to select a month.",
             description: "Calendar button",
-        })), h("div", { id: "year-title", class: "sr-only" }, intl.formatMessage({
+        })), h("div", { key: '2df13fae273fd2186e35d50ab58d888b45bf0b40', id: "year-title", class: "sr-only" }, intl.formatMessage({
             id: "date.selectYear",
             defaultMessage: "Activate to select a year.",
             description: "Calendar button",
-        })))), h("div", { id: "error", class: "error" }, this.errorMessage), h("div", { ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" })))));
+        })))), h("div", { key: '71ca47b61c3ffd7e19c273ae3e4c68a7f3ef1afd', id: "error", class: "error" }, this.errorMessage), h("div", { key: '5adc31a91d03cd34d01e48a88617481051905341', ref: (el) => (this.liveRegionEl = el), class: "sr-only", "aria-live": "polite", "aria-atomic": "true" })))));
     }
     static get is() { return "wm-datepicker"; }
     static get encapsulation() { return "shadow"; }
@@ -435,14 +433,17 @@ export class DatePicker {
                 "complexType": {
                     "signature": "(inputFormat: string, outputFormat: string, date?: string) => Promise<string>",
                     "parameters": [{
-                            "tags": [],
-                            "text": ""
+                            "name": "inputFormat",
+                            "type": "string",
+                            "docs": ""
                         }, {
-                            "tags": [],
-                            "text": ""
+                            "name": "outputFormat",
+                            "type": "string",
+                            "docs": ""
                         }, {
-                            "tags": [],
-                            "text": ""
+                            "name": "date",
+                            "type": "string | undefined",
+                            "docs": ""
                         }],
                     "references": {
                         "Promise": {
@@ -461,8 +462,9 @@ export class DatePicker {
                 "complexType": {
                     "signature": "(input?: string) => Promise<boolean>",
                     "parameters": [{
-                            "tags": [],
-                            "text": ""
+                            "name": "input",
+                            "type": "string | undefined",
+                            "docs": ""
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/components/wm-action-menu/wm-action-menu.js

@@ -190,7 +190,7 @@ export class ActionMenu {
         return null;
     }
     render() {
-        return (h(Host, { onBlur: () => this.close(false) }, h("div", { class: getTextDir() }, h("wm-button", { "button-type": this.internalButtonType, tooltip: this.tooltip, "custom-background": this.darkMode ? "dark" : undefined, "label-for-identical-buttons": this.labelForIdenticalButtons, icon: this.actionMenuType === "icon" ? "f1d9" : "", iconSize: this.actionMenuType === "icon" ? "24px" : undefined, id: "menubtn", onClick: () => (this.isExpanded ? this.close() : this.open()), onBlur: (ev) => this.handleButtonBlur(ev), disabled: this.disabled, ref: (el) => (this.wmButtonEl = el), "tooltip-position": this.tooltipPosition || this.horizontalPosition, "aria-haspopup": "true", "aria-expanded": this.isExpanded ? "true" : "false", "aria-controls": "menu" }, this.buttonText), h("div", { class: `dropdown ${this.openUp ? "open-up" : ""} ${this.horizontalPosition} ${this.isExpanded ? "open" : ""} hidden`, id: "menu", tabindex: -1, role: "menu", ref: (el) => (this.itemsEl = el) }, h("slot", null)))));
+        return (h(Host, { key: 'e6d63a25a3589c42657c7cf0825f9973861e92ae', onBlur: () => this.close(false) }, h("div", { key: '5744b207e0ebec31cb7a70b8c616700b9436d58b', class: getTextDir() }, h("wm-button", { key: '9509bafa8ac5acbb76aafc464d36e4b97b0a8d07', "button-type": this.internalButtonType, tooltip: this.tooltip, "custom-background": this.darkMode ? "dark" : undefined, "label-for-identical-buttons": this.labelForIdenticalButtons, icon: this.actionMenuType === "icon" ? "f1d9" : "", iconSize: this.actionMenuType === "icon" ? "24px" : undefined, id: "menubtn", onClick: () => (this.isExpanded ? this.close() : this.open()), onBlur: (ev) => this.handleButtonBlur(ev), disabled: this.disabled, ref: (el) => (this.wmButtonEl = el), "tooltip-position": this.tooltipPosition || this.horizontalPosition, "aria-haspopup": "true", "aria-expanded": this.isExpanded ? "true" : "false", "aria-controls": "menu" }, this.buttonText), h("div", { key: 'e7846dd17a5b343b506a8c60176bba8ef8e8c2e0', class: `dropdown ${this.openUp ? "open-up" : ""} ${this.horizontalPosition} ${this.isExpanded ? "open" : ""} hidden`, id: "menu", tabindex: -1, role: "menu", ref: (el) => (this.itemsEl = el) }, h("slot", { key: 'e227cd3ea8e2093e64c4b8c335ee098768139fd3' })))));
     }
     static get is() { return "wm-action-menu"; }
     static get encapsulation() { return "shadow"; }

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

@@ -166,7 +166,7 @@ export class Button {
         }
     }
     render() {
-        return (h(Host, { class: `${this.isDisabled ? "button-disabled" : ""} -${this.buttonType}` }, h("button", { id: this.id, class: `${this.buttonClasses}`, disabled: this.isDisabled, ref: (el) => (this.buttonEl = el), "aria-label": this.getAriaLabel(), "aria-hasPopup": this.ariaPopup ? "menu" : null, onMouseEnter: (ev) => this.handleMouseEnter(ev), onMouseLeave: () => hideTooltip(), onFocus: (ev) => this.handleFocus(ev), onBlur: () => hideTooltip(), onClick: () => hideTooltip() }, this.icon && (h("span", { class: "mdi", style: this.iconStyles, "aria-hidden": "true" }, String.fromCodePoint(parseInt(`0x${this.icon}`)))), h("span", { class: "button-text" }, h("slot", null)))));
+        return (h(Host, { key: 'c0a05cbcd26354a8ec8ce24fc560ec676dc3eedc', class: `${this.isDisabled ? "button-disabled" : ""} -${this.buttonType}` }, h("button", { key: 'f3808a14ca42ea578fe257e7818c2b5be798b61e', id: this.id, class: `${this.buttonClasses}`, disabled: this.isDisabled, ref: (el) => (this.buttonEl = el), "aria-label": this.getAriaLabel(), "aria-hasPopup": this.ariaPopup ? "menu" : null, onMouseEnter: (ev) => this.handleMouseEnter(ev), onMouseLeave: () => hideTooltip(), onFocus: (ev) => this.handleFocus(ev), onBlur: () => hideTooltip(), onClick: () => hideTooltip() }, this.icon && (h("span", { key: '7c247a1febac517d8521a451692536f612657de9', class: "mdi", style: this.iconStyles, "aria-hidden": "true" }, String.fromCodePoint(parseInt(`0x${this.icon}`)))), h("span", { key: 'f4410ed7907af38ab29eb69c90e2bbb3b2e51cb8', class: "button-text" }, h("slot", { key: '2b72eba1f3b0db9ec8a73e37044a3f371264de77' })))));
     }
     static get is() { return "wm-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -168,7 +168,7 @@ export class File {
         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: '0943b20ae9ce90cb1687ff3c092622d2169f9c47', role: "listitem" }, this.isUploading ? this.renderFileInProgress() : this.renderFile());
     }
     static get is() { return "wm-file"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/wm-file-list/wm-file-list.js

@@ -4,7 +4,7 @@ export class FileList {
         this.showInfo = "last-updated";
     }
     render() {
-        return (h("div", { role: "list", class: "list-wrapper" }, h("slot", null)));
+        return (h("div", { key: '7517d9199e320a918e7b87501e2a6841d17e70f5', role: "list", class: "list-wrapper" }, h("slot", { key: 'c90eaf77aa45b5b146ad71cfa3891cbc0a26ab9a' })));
     }
     static get is() { return "wm-file-list"; }
     static get encapsulation() { return "shadow"; }