@watermarkinsights/ripple 5.2.0 → 5.2.1-0

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

@@ -2,10 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-f8ef86de.js');
-const functions = require('./functions-48a748f0.js');
+const index = require('./index-4853a7b4.js');
+const functions = require('./functions-698530be.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: '643fbf2de6e3b8438f6899557532008c4c7a342b', class: `size-${this.targetSize}` }, index.h("button", { key: '8e7e0025c2dd12361a68c86e48e514e3c817ce3b', 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: '77bddadb74b49f5c46631c160a95597a1fe432d0', ref: (el) => (this.toggletipEl = el), class: `toggletip ${this.isOpen ? "" : "hidden"} ${this.tooltipPosition}` }, this.tooltip), index.h("div", { key: '5037247de94493cfe9ef7644fe18144f4e046327', 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-f8ef86de.js');
-const intl = require('./intl-29d2cc42.js');
-require('./functions-48a748f0.js');
+const index = require('./index-4853a7b4.js');
+const intl = require('./intl-6751b1c3.js');
+require('./functions-698530be.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: 'bd3db6cd234170ccd16da6868a672489a7ee207f' }, this.label && this.renderLabel(), this.renderHeader(), this.renderListContainer(), index.h("div", { key: 'aaf03bc1b068d79b1e9c9a8bae78ca560c25412c', 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: '1a0c1343c241c9e257b52b41973940cc75145b7a', 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-f8ef86de.js');
+const index = require('./index-4853a7b4.js');
 
 const Wrapper = class {
     constructor(hostRef) {

package/dist/collection/collection-manifest.json

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

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

@@ -83,7 +83,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

@@ -109,11 +109,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: '081d480be4745b75f2d493b18e4ca441b09c122c' }, !!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", ref: (el) => (this.btnEl = el), 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", ref: (el) => (this.btnEl = el), 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: '49fb8cc5426492f5dc4ea3788ae4025d09124b08', 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

@@ -149,7 +149,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: '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 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/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: 'b7837795e21f17c3dd39b07a7793fb6618ea4266', onBlur: () => this.close(false) }, h("div", { key: 'cf91d1c9c4d219f9a5a4e8515bd65a8e6be6f66e', class: getTextDir() }, h("wm-button", { key: 'e3a96d49020444b6e144f076b21d330c0b51f8a4', "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: 'bc01f9c3df76416f41be0dffbd4413ef462e1c26', 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: 'ab2d540947baccd6ed16fa6d1cc32bc61e8c847c' })))));
     }
     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: 'b0a1fc9ed2ba71f10e6829bd92552edf4cc61713', class: `${this.isDisabled ? "button-disabled" : ""} -${this.buttonType}` }, h("button", { key: '2d7f90caad6311d35fc61be079d5492c0da77b8e', 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: 'eebe3af5e1105a5adb3939a2fa9cc7cbb09ded38', class: "mdi", style: this.iconStyles, "aria-hidden": "true" }, String.fromCodePoint(parseInt(`0x${this.icon}`)))), h("span", { key: 'ea3115ae0ffa964e69e58f125bedf5e7dbd334c0', class: "button-text" }, h("slot", { key: '184b3d077d4bc2c5d37ae9fb119178783776672a' })))));
     }
     static get is() { return "wm-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -534,11 +534,11 @@ export class PrivDatepicker {
     }
     render() {
         const dates = this.getCalendarDates(this.monthInFocus, this.yearInFocus);
-        return (h("div", { class: "container", id: "wm-container" }, h("button", { disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "date-input", ref: (el) => (this.buttonEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { class: "calendar", title: intl.formatMessage({
+        return (h("div", { key: '63dd17051b10d920b9763c2b63c7118afa864893', class: "container", id: "wm-container" }, h("button", { key: 'a627ca7a362da89e6459e29d16c6a186a2abab16', disabled: this.disabled, onClick: this.togglePopup.bind(this), "aria-describedby": "date-input", ref: (el) => (this.buttonEl = el), "aria-expanded": `${this.isExpanded}`, class: "toggle", id: "toggle" }, h("span", { key: 'b8fe448b71923d162da3255122b9691d4079b69a', class: "calendar", title: intl.formatMessage({
                 id: "date.calendarView",
                 defaultMessage: "Calendar View",
                 description: "Calendar button",
-            }) })), h("div", { class: `popup ${this.view}-view ${this.openUp ? "expand-upwards" : ""}`, id: "popup", ref: (el) => (this.popupEl = el), onClick: () => (this.popupClicked = true), role: "application", "aria-describedby": "application" }, this.view === "day" ? (h("div", { class: "day-view" }, h("div", { class: "calendar-header" }, h("button", { onClick: () => {
+            }) })), h("div", { key: '7c63c85d3683903cd8557f2412acdccf2b349d09', class: `popup ${this.view}-view ${this.openUp ? "expand-upwards" : ""}`, id: "popup", ref: (el) => (this.popupEl = el), onClick: () => (this.popupClicked = true), role: "application", "aria-describedby": "application" }, this.view === "day" ? (h("div", { class: "day-view" }, h("div", { class: "calendar-header" }, h("button", { onClick: () => {
                 this.prevClicked = true;
                 this.popupClicked = true;
                 this.backOneMonth();
@@ -623,15 +623,15 @@ export class PrivDatepicker {
             .slice(6, 9)
             .map((month, index) => this.renderMonths(month, index + 6))), h("div", { role: "row", class: "month-row" }, this.calendar_months
             .slice(9)
-            .map((month, index) => this.renderMonths(month, index + 9))))))), this.isExpanded && h("div", { id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), h("div", { id: "month-title", class: "sr-only" }, intl.formatMessage({
+            .map((month, index) => this.renderMonths(month, index + 9))))))), this.isExpanded && h("div", { key: 'd6498e254f33356e698b38fc803e6c7dd8dc754b', id: "live-region", "aria-live": "polite", "aria-relevant": "text", class: "sr-only" }), h("div", { key: '023003cea63532f55a674d6e75aad6d2efca5d32', 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: '0c6358445c65906e90e3b97d560a8efa558849e0', id: "year-title", class: "sr-only" }, intl.formatMessage({
             id: "date.selectYear",
             defaultMessage: "Activate to select a year.",
             description: "Calendar button",
-        })), h("div", { id: "application", class: "sr-only" }, intl.formatMessage({
+        })), h("div", { key: '86ce610bb1f0b5ecf202ed7009aaf24d1d8fff90', id: "application", class: "sr-only" }, intl.formatMessage({
             id: "date.instructions",
             defaultMessage: "Use arrows to select a date in the table. Tab left or right to buttons for selecting previous month, next month, or the month selection table.",
         }))));

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

@@ -154,7 +154,7 @@ export class DatePicker {
         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 is() { return "wm-datepicker"; }
     static get encapsulation() { return "shadow"; }
@@ -354,14 +354,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": {
@@ -380,8 +383,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-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: '862c068de56db3f8f96604ca087053c6cdab9395', 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

@@ -1,10 +1,10 @@
 import { h } from "@stencil/core";
 export class FileList {
     constructor() {
-        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 is() { return "wm-file-list"; }
     static get encapsulation() { return "shadow"; }
@@ -25,8 +25,8 @@ export class FileList {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "\"size\" | \"time\" | \"none\"",
-                    "resolved": "\"none\" | \"size\" | \"time\"",
+                    "original": "\"size\" | \"last-updated\" | \"uploaded-by\" | \"all\" | \"none\"",
+                    "resolved": "\"all\" | \"last-updated\" | \"none\" | \"size\" | \"uploaded-by\"",
                     "references": {}
                 },
                 "required": false,
@@ -37,7 +37,7 @@ export class FileList {
                 },
                 "attribute": "show-info",
                 "reflect": false,
-                "defaultValue": "\"time\""
+                "defaultValue": "\"last-updated\""
             }
         };
     }

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

@@ -101,7 +101,7 @@ export class Input {
             : `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 is() { return "wm-input"; }
     static get encapsulation() { return "shadow"; }

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

@@ -88,7 +88,7 @@ export class Menuitem {
         }
     }
     render() {
-        return (h(Host, { tabindex: -1, role: "menuitem", "aria-disabled": this.disabled ? "true" : null }, h("div", { class: "wrapper", "aria-disabled": this.disabled ? "true" : null }, h("span", { ref: (el) => (this.iconEl = el) }), this.el.textContent, this.description ? h("div", { class: "description" }, this.description) : "")));
+        return (h(Host, { key: '54c51825cee5be3914ae3964f102a0d0ac6e0ece', tabindex: -1, role: "menuitem", "aria-disabled": this.disabled ? "true" : null }, h("div", { key: '51b922d08a60d6748de4fc431298593a45e48816', class: "wrapper", "aria-disabled": this.disabled ? "true" : null }, h("span", { key: '0e827221ade58bb3b1023e92a8e46f10fb59e43a', ref: (el) => (this.iconEl = el) }), this.el.textContent, this.description ? h("div", { class: "description" }, this.description) : "")));
     }
     static get is() { return "wm-menuitem"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/wm-modal/wm-modal-footer.js

@@ -9,7 +9,6 @@ export class ModalFooter {
     }
     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
@@ -30,7 +29,7 @@ export class ModalFooter {
         }
     }
     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))));
     }
     static get is() { return "wm-modal-footer"; }
     static get originalStyleUrls() {

package/dist/collection/components/wm-modal/wm-modal-header.js

@@ -7,7 +7,6 @@ export class ModalHeader {
     }
     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
@@ -21,7 +20,7 @@ export class ModalHeader {
         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() }))));
     }
     static get is() { return "wm-modal-header"; }
     static get originalStyleUrls() {

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

@@ -1,20 +1,18 @@
 import { h } from "@stencil/core";
-import { generateId } from "../../global/functions";
 export class Modal {
     constructor() {
         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);
@@ -76,7 +74,6 @@ export class Modal {
                 this.closeButtonEl.focus();
             }
         };
-        this.uid = this.el.id ? this.el.id : generateId();
     }
     componentDidLoad() {
         if (this.open) {
@@ -99,20 +96,20 @@ export class Modal {
         }
     }
     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();
             } })));
     }
@@ -144,7 +141,7 @@ export class Modal {
                     "text": ""
                 },
                 "attribute": "open",
-                "reflect": true,
+                "reflect": false,
                 "defaultValue": "false"
             },
             "elementToFocus": {
@@ -180,25 +177,8 @@ export class Modal {
                     "text": ""
                 },
                 "attribute": "modal-type",
-                "reflect": true,
+                "reflect": false,
                 "defaultValue": "\"modal\""
-            },
-            "uid": {
-                "type": "string",
-                "mutable": true,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "attribute": "uid",
-                "reflect": true
             }
         };
     }