@watermarkinsights/ripple 3.25.0-2 → 3.25.0

package/dist/ripple/p-5cc287d2.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,f as o,h as i,H as n,g as r}from"./p-1c23de4a.js";import{g as s,v as a}from"./p-c6a0f7e5.js";import{u as l}from"./p-9b2dfb54.js";const d=':host .wm-button,wm-uploader .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:inherit;border:2px solid #575195;color:#575195;font-family:inherit;font-size:0.75rem;font-weight:700;height:2.75rem;padding:0 1.3333333333em;cursor:pointer;position:relative;background:#fff;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;word-wrap:break-word;word-break:break-word;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button,wm-uploader .wm-button{height:3.3333333333em}}:host .wm-button.nowrap,wm-uploader .wm-button.nowrap{display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .wm-button:focus,wm-uploader .wm-button:focus{outline:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button::-moz-focus-inner,wm-uploader .wm-button::-moz-focus-inner{border:0;outline:none}:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-uploader .wm-button.-textonly .button-text,wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-uploader .wm-button.-textonly .button-text{background:-webkit-gradient(linear, left top, right top, color-stop(66%, #3862e9), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled),wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark),wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark){-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner,wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner{border:0}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled),wm-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled){background:transparent;border:2px solid #fff;color:#fff}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover,wm-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark,wm-uploader .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;outline:none}:host .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption),wm-uploader .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,wm-uploader .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,wm-uploader .wm-button:not(.-icononly):not(.-navigational) .mdi{margin-right:0.3125rem}:host .wm-button[dir=RTL] :not(.-icononly) .mdi,wm-uploader .wm-button[dir=RTL] :not(.-icononly) .mdi{margin-left:0.3125rem;margin-right:0}:host .wm-button.-primary:not(.-textonly),wm-uploader .wm-button.-primary:not(.-textonly){background:#575195;color:#fff}:host .wm-button.-primary:not(.-textonly):not(:focus),wm-uploader .wm-button.-primary:not(.-textonly):not(:focus){-webkit-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2)}:host .wm-button.-primary:not(.-textonly):hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-primary:not(.-textonly):hover:not(:disabled):not(.disabled){background:#464177}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled),wm-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled){color:#575195;background:#fff;border:2px solid #fff}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover,wm-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.-secondary:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-secondary:hover:not(:disabled):not(.disabled),:host .wm-button.-selector:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-selector:hover:not(:disabled):not(.disabled),:host .wm-button.-icononly:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-icononly:hover:not(:disabled):not(.disabled){background:#464177;color:#fff}:host .wm-button.-textonly,wm-uploader .wm-button.-textonly{-webkit-box-shadow:none;-moz-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-left:0;padding-right:0;height:auto;border-radius:0;line-height:1}:host .wm-button.-textonly+.-textonly,wm-uploader .wm-button.-textonly+.-textonly{margin-left:0.3125rem}:host .wm-button.-textonly:focus,wm-uploader .wm-button.-textonly:focus{outline:none}:host .wm-button.-textonly::-moz-focus-inner,wm-uploader .wm-button.-textonly::-moz-focus-inner{border:0;outline:none}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text,wm-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text{background:-webkit-gradient(linear, left top, right top, color-stop(66%, #3862e9), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text,wm-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text{background:-webkit-gradient(linear, left top, right top, color-stop(66%, #fff), color-stop(0, transparent)) repeat-x;background:linear-gradient(90deg, #fff 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.small,wm-uploader .wm-button.-textonly.small{font-size:0.625rem}:host .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete),wm-uploader .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete){text-decoration:underline}:host .wm-button.-textonly.-permanentlydelete,wm-uploader .wm-button.-textonly.-permanentlydelete{color:#c0392b}:host .wm-button.-textonly.-permanentlydelete:hover:not(:disabled):not(.disabled):not(.dark),wm-uploader .wm-button.-textonly.-permanentlydelete:hover:not(:disabled):not(.disabled):not(.dark){text-decoration:underline;color:#c0392b !important}:host .wm-button.-textonly.dark,wm-uploader .wm-button.-textonly.dark{color:#fff}:host .wm-button.-textonly.dark:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-textonly.dark:hover:not(:disabled):not(.disabled){text-decoration:underline;color:#fff !important}:host .wm-button.-icononly,wm-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-uploader .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),wm-uploader .wm-button.-icononly:not(:focus),:host .wm-button.-navigational:not(:focus),wm-uploader .wm-button.-navigational:not(:focus){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button.-icononly,wm-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-uploader .wm-button.-navigational{min-width:2.5rem;min-height:2.5rem}}:host .wm-button.-icononly,wm-uploader .wm-button.-icononly{border-width:1px !important}:host .wm-button.-icononly:before,wm-uploader .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.-navigational,wm-uploader .wm-button.-navigational{border:none !important;background-color:transparent}:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled),wm-uploader .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled){color:#575195}:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled):hover,wm-uploader .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled):hover,:host .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled).selected,wm-uploader .wm-button.-navigational:not(.dark):not(:disabled):not(.disabled).selected{background-color:#d7d6d9}:host .wm-button.-navigational:before,wm-uploader .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.-permanentlydelete:not(.-textonly),wm-uploader .wm-button.-permanentlydelete:not(.-textonly){background:#c0392b;border-color:#c0392b;color:#fff}:host .wm-button.-permanentlydelete:not(.-textonly):hover:not(:disabled):not(.disabled):not(.dark),wm-uploader .wm-button.-permanentlydelete:not(.-textonly):hover:not(:disabled):not(.disabled):not(.dark){background:#9a2e22;border-color:#9a2e22}:host .wm-button.-pairnegative,wm-uploader .wm-button.-pairnegative{background:#cc4c3e;border-color:#cc4c3e;color:#fff}:host .wm-button.-pairnegative:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-pairnegative:hover:not(:disabled):not(.disabled){background:#a33d32;border-color:#a33d32}:host .wm-button.-pairpositive,wm-uploader .wm-button.-pairpositive{background:#15868d;border-color:#15868d;color:#fff}:host .wm-button.-pairpositive:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-pairpositive:hover:not(:disabled):not(.disabled){background:#116b71;border-color:#116b71}:host .wm-button.-selector,wm-uploader .wm-button.-selector,:host .wm-button.-selector-primary,wm-uploader .wm-button.-selector-primary{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;display:block;background:transparent;border:2px solid #575195;border-radius:3px;height:2.75rem;min-width:11.4375rem;padding:0 1.875rem 0 0.9375rem;line-height:normal;font-family:inherit;color:#575195;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,wm-uploader .wm-button.-selector,:host .wm-button.-selector-primary,wm-uploader .wm-button.-selector-primary{height:2.5rem}}:host .wm-button.-selector:before,wm-uploader .wm-button.-selector:before,:host .wm-button.-selector-primary:before,wm-uploader .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:0.875rem;font-weight:700;pointer-events:none}:host .wm-button.-selector:active,wm-uploader .wm-button.-selector:active,:host .wm-button.-selector-primary:active,wm-uploader .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,wm-uploader .wm-button.-selector::-moz-focus-inner,:host .wm-button.-selector-primary::-moz-focus-inner,wm-uploader .wm-button.-selector-primary::-moz-focus-inner{border:0}:host .wm-button.-selector .overflowcontrol,wm-uploader .wm-button.-selector .overflowcontrol,:host .wm-button.-selector-primary .overflowcontrol,wm-uploader .wm-button.-selector-primary .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:visible}:host .wm-button.-selector.dark:not(:disabled):not(.disabled):hover,wm-uploader .wm-button.-selector.dark:not(:disabled):not(.disabled):hover,:host .wm-button.-selector-primary.dark:not(:disabled):not(.disabled):hover,wm-uploader .wm-button.-selector-primary.dark:not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.-selector-primary,wm-uploader .wm-button.-selector-primary{background:#575195;color:#fff}:host .wm-button.-selector-primary:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-selector-primary:hover:not(:disabled):not(.disabled){background:#464177}:host .wm-button.-selector-primary.dark:not(:disabled):not(.disabled),wm-uploader .wm-button.-selector-primary.dark:not(:disabled):not(.disabled){color:#575195;background:#fff;border:2px solid #fff}:host .wm-button:disabled,wm-uploader .wm-button:disabled,:host .wm-button.disabled,wm-uploader .wm-button.disabled{background:inherit;border-color:#737373;color:#737373;cursor:default;pointer-events:none}:host .wm-button:disabled.-primary,wm-uploader .wm-button:disabled.-primary,:host .wm-button:disabled.-permanentlydelete,wm-uploader .wm-button:disabled.-permanentlydelete,:host .wm-button:disabled.-pairnegative,wm-uploader .wm-button:disabled.-pairnegative,:host .wm-button:disabled.-pairpositive,wm-uploader .wm-button:disabled.-pairpositive,:host .wm-button.disabled.-primary,wm-uploader .wm-button.disabled.-primary,:host .wm-button.disabled.-permanentlydelete,wm-uploader .wm-button.disabled.-permanentlydelete,:host .wm-button.disabled.-pairnegative,wm-uploader .wm-button.disabled.-pairnegative,:host .wm-button.disabled.-pairpositive,wm-uploader .wm-button.disabled.-pairpositive{background:#737373;color:#fff;border-color:#737373}:host .wm-button:disabled.-secondary,wm-uploader .wm-button:disabled.-secondary,:host .wm-button.disabled.-secondary,wm-uploader .wm-button.disabled.-secondary{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button:disabled.-selector,wm-uploader .wm-button:disabled.-selector,:host .wm-button.disabled.-selector,wm-uploader .wm-button.disabled.-selector{color:#737373}:host .wm-button:disabled.-selector-primary,wm-uploader .wm-button:disabled.-selector-primary,:host .wm-button.disabled.-selector-primary,wm-uploader .wm-button.disabled.-selector-primary{background:#737373;color:#fff;border-color:#737373}:host .wm-button:disabled.-textonly,wm-uploader .wm-button:disabled.-textonly,:host .wm-button.disabled.-textonly,wm-uploader .wm-button.disabled.-textonly{color:#6b6b6b;background:transparent}:host .wm-button:disabled.dark.-secondary:not(.-permanentlydelete),wm-uploader .wm-button:disabled.dark.-secondary:not(.-permanentlydelete),:host .wm-button:disabled.dark.-selector,wm-uploader .wm-button:disabled.dark.-selector,:host .wm-button:disabled.dark.-textonly,wm-uploader .wm-button:disabled.dark.-textonly,:host .wm-button:disabled.dark.-navigational,wm-uploader .wm-button:disabled.dark.-navigational,:host .wm-button:disabled.dark.-icononly,wm-uploader .wm-button:disabled.dark.-icononly,:host .wm-button.disabled.dark.-secondary:not(.-permanentlydelete),wm-uploader .wm-button.disabled.dark.-secondary:not(.-permanentlydelete),:host .wm-button.disabled.dark.-selector,wm-uploader .wm-button.disabled.dark.-selector,:host .wm-button.disabled.dark.-textonly,wm-uploader .wm-button.disabled.dark.-textonly,:host .wm-button.disabled.dark.-navigational,wm-uploader .wm-button.disabled.dark.-navigational,:host .wm-button.disabled.dark.-icononly,wm-uploader .wm-button.disabled.dark.-icononly{color:#b5b5b5;border-color:#b5b5b5}:host .wm-button:disabled.dark.-primary,wm-uploader .wm-button:disabled.dark.-primary,:host .wm-button:disabled.dark.-selector-primary,wm-uploader .wm-button:disabled.dark.-selector-primary,:host .wm-button:disabled.dark.-permanentlydelete:not(.-textonly),wm-uploader .wm-button:disabled.dark.-permanentlydelete:not(.-textonly),:host .wm-button.disabled.dark.-primary,wm-uploader .wm-button.disabled.dark.-primary,:host .wm-button.disabled.dark.-selector-primary,wm-uploader .wm-button.disabled.dark.-selector-primary,:host .wm-button.disabled.dark.-permanentlydelete:not(.-textonly),wm-uploader .wm-button.disabled.dark.-permanentlydelete:not(.-textonly){background:#a6a6a6;border-color:#a6a6a6;color:#353b48}:host a.wm-button,wm-uploader a.wm-button,:host label.wm-button,wm-uploader label.wm-button{height:auto;padding-top:0.75rem;padding-bottom:0.75rem}:host,wm-uploader{display:block;position:relative;max-width:1140px}:host[dir=RTL] .mdi,wm-uploader[dir=RTL] .mdi{margin-left:0.3125rem;margin-right:0}:host input:focus+.wm-button.user-is-tabbing,wm-uploader input:focus+.wm-button.user-is-tabbing{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important}:host *,wm-uploader *{-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:#c0392b}.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:#c0392b}.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}.header .info-wrapper{-ms-flex-align:center;align-items:center}.header .info-wrapper .info{font-size:0.875rem;margin-left:1rem}.header .accepted-types{font-size:0.875rem}.header .requirements{font-size:0.875rem;margin-left:1rem}.footer{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:end;align-items:flex-end;padding:0.9375rem 1.875rem}.footer .notif-wrapper{-ms-flex-align:end;align-items:flex-end}.footer .filecount-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.footer .filecount-wrapper .filecount{font-size:0.875rem;margin-right:1rem}.notif-wrapper{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;margin-bottom:0.75rem}.notif-wrapper .requirements{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.notif,#error{padding-top:0.25rem;font-size:0.875rem;font-style:italic}.notif#error,#error#error{display:block;font-style:italic;color:#c0392b;font-size:0.875rem;margin-top:0.25rem}.info-wrapper{position:relative;display:-ms-flexbox;display:flex}.list-container{overflow-y:unset}.list-container.checkmark-spacer{margin-right:2.75rem}.list-container:has(.error-list,.inprogress-list,.file-list){margin-top:2.5rem}.list-container ul{padding:0;width:100%;margin:0}.list-container ul wm-file{margin-bottom:0.5rem}.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}.empty-block{margin:5rem auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}.empty-block .upload-file{margin-bottom:1.875rem}.empty-block .empty-message{font-size:0.875rem;margin-bottom:0.4375rem}.empty-block .empty-message.large{font-size:1.5rem}.empty-block .info-wrapper{-ms-flex-pack:center;justify-content:center;width:100%}.empty-block .info-wrapper .wm-button{width:auto}.header.type1,.header.type2{margin-bottom:1rem}.header .slot-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:start;align-items:flex-start}.notif-wrapper.type1,.notif-wrapper.type2{-ms-flex-direction:column;flex-direction:column;margin-bottom:1rem}.list-container.type1,.list-container.type2{overflow-y:auto}.list-container.type1 ul,.list-container.type2 ul{margin:revert}.list-container.type1 .file-list li,.list-container.type1 .inprogress-list li,.list-container.type2 .file-list li,.list-container.type2 .inprogress-list li{margin-bottom:1.625rem}.list-container.type1 .error-list li,.list-container.type2 .error-list li{margin-bottom:1.25rem}.list-container.type1{padding:0 1.875rem;height:16.25rem}';const m=class{constructor(o){t(this,o);this.wmUploaderFilesSelected=e(this,"wmUploaderFilesSelected",7);this.wmFilesSelected=e(this,"wmFilesSelected",7);this.wmUploaderDeleteFile=e(this,"wmUploaderDeleteFile",7);this.wmDeleteFile=e(this,"wmDeleteFile",7);this.wmUploaderDownloadFile=e(this,"wmUploaderDownloadFile",7);this.wmDownloadFile=e(this,"wmDownloadFile",7);this.wmUploaderPreviewFile=e(this,"wmUploaderPreviewFile",7);this.wmFileDelete=e(this,"wmFileDelete",7);this.wmFileDownload=e(this,"wmFileDownload",7);this.wmFilePreview=e(this,"wmFilePreview",7);this.inputId=s();this.uploaderType=undefined;this.type=undefined;this.label=undefined;this.buttonText=undefined;this.info=undefined;this.emptyStateText=undefined;this.icon=undefined;this.fileTypes="pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv";this.maxSize=undefined;this.maxFiles=undefined;this.sortBy="date";this.showInfo="time";this.errorMessage=undefined;this.requiredField=undefined;this.files=undefined;this.fileList=[];this.filesToUpload=[];this.isTabbing=false;this.rejectedFiles=undefined;this.errorList=[];this.notif=undefined;this.internalErrorMessage=undefined;this.announcement="";this.numFilesInProgress=undefined;this.isCondensed=false}get uploadButtonEl(){return this.el.shadowRoot.querySelector(`#${this.inputId}`)}get tempUploaderType(){return this.type||this.uploaderType}get effectiveMaxSize(){const t=100;const e=100;return this.maxSize?Math.min(this.maxSize,e):t}get fileLimitReached(){return this.maxFiles&&this.fileList.length>=this.maxFiles}get displayedErrorMessage(){return this.errorMessage||this.internalErrorMessage||""}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleUploadProgress(t){this.fileList.map((e=>{if(e.id===t.detail.id){e.progress=t.detail.progress;o(this.el)}}));if(t.detail.progress===100){this.numFilesInProgress-=1}if(!this.srProgress&&this.numFilesInProgress){const t=this.numFilesInProgress;this.srProgress=setInterval((()=>{const e=this.fileList.reduce(((t,e)=>e.progress?t+e.progress:t),0);this.announce(l.getUploadProgress(Math.floor(e/t)))}),5e3)}}handleFileErrorCleared(t){const e=t.detail.name;this.errorList=this.errorList.filter((t=>t.name!=e));this.uploadButtonEl.focus()}handleFileDeleted(t){this.clearErrors();o(this.el);this.wmUploaderDeleteFile.emit(t.detail);this.wmFileDelete.emit(t.detail);this.wmDeleteFile.emit(t.detail)}handleFilePreviewed(t){this.clearErrors();this.wmUploaderPreviewFile.emit(t.detail);this.wmFilePreview.emit(t.detail)}handleFileDownloaded(t){this.clearErrors();this.wmUploaderDownloadFile.emit(t.detail);this.wmFileDownload.emit(t.detail);this.wmDownloadFile.emit(t.detail)}parseFiles(){if(!!this.files){if(typeof this.files==="string"){let t=JSON.parse(this.files);if(typeof t==="object"){t.forEach((t=>{if(t.size&&(typeof t.size==="number"||t.size.match(/^[0-9]+$/))){const e=this.convertBytes(t.size);t.size=`${e.size.toFixed(0)} ${e.unit}`}}));this.fileList=t}else{throw new Error("could not parse string passed to files attribute")}}else{throw new Error("Attribute 'files' should be a string")}}}focusAfterRemoval(t,e){if(this.isTabbing&&t.length<e.length){const o=t.map((t=>t.id));const i=e.map((t=>t.id));const n=i.filter((t=>!o.includes(t)))[0];if(i.indexOf(n)>0){const o=i[i.indexOf(n)-1];const r=this.el.shadowRoot.querySelector("#file-"+o);const s=r===null||r===void 0?void 0:r.shadowRoot.querySelectorAll("wm-button");if(s&&s.length>0){const t=s[s.length-1];t.focus()}else{this.focusAfterRemoval(t.filter((t=>t.id!==o)),e)}}else{this.uploadButtonEl.focus()}}}parseRejectedFiles(){if(!!this.rejectedFiles){if(typeof this.files==="string"){const t=JSON.parse(this.rejectedFiles);if(typeof t==="object"){this.errorList=t}else{throw new Error("could not parse string passed to errors attribute")}}else{throw new Error("Attribute 'rejected-files' should be a string")}}}uploadNotifications(t,e){if(e>0&&t===0){setTimeout((()=>{this.notif="";this.internalErrorMessage=""}),20*1e3);this.notif=l.finishedUploading;this.announce(l.finishedUploading);this.numFilesInProgress=null;clearInterval(this.srProgress);o(this.el)}else if(t>0&&t!=e){this.notif=l.getFilesUploading(t);this.announce(l.getFilesUploading(t));o(this.el)}}handleErrorMessageChange(){if(this.errorMessage){this.announce(this.errorMessage)}}isValidSize(t){return this.convertBytes(t,"MB").size<=this.effectiveMaxSize}convertBytes(t,e){const o=["bytes","KB","MB","GB","TB"];let i=0;let n=typeof t==="number"?t:parseInt(t);if(e){while(o.indexOf(e)>i){n/=1024;i++}}else{while(n>1e3){n/=1024;i++}}return{size:n,unit:o[i]}}isDuplicate(t){const e=this.filesToUpload.some((e=>e.name===t));const o=this.fileList.some((e=>{const o=e.type?e.name+"."+e.type:e.name;return o===t}));return e||o}isEmpty(){return!this.fileList.length&&!this.errorList.length}get isDisabled(){return this.fileLimitReached||this.numFilesInProgress>0}isItemUploading(t){return t.hasOwnProperty("progress")&&t.progress<100}announce(t){if(this.liveRegion.textContent===t){t+=" "}this.announcement=t}clearErrors(){this.errorList=[];this.notif="";this.internalErrorMessage=""}handleFiles(t){this.filesToUpload=[];const e=Array.from(t.target.files);const o=this.fileTypes.split(" ").join(", ");if(!!this.maxFiles&&this.fileList.length+e.length>this.maxFiles){this.internalErrorMessage=l.fileLimitExceeded;this.announce(l.fileLimitExceeded)}else{e&&e.map((t=>{if(!a(t,this.fileTypes)){const e={name:t.name,message:l.getInvalidFileType(o)};this.errorList.push(e)}else if(t.size===0){const e={name:t.name,message:l.zeroFileSize};this.errorList.push(e)}else if(!this.isValidSize(t.size)){const e={name:t.name,message:l.getFileTooLarge(this.effectiveMaxSize)};this.errorList.push(e)}else if(this.isDuplicate(t.name)){const e={name:t.name,message:l.duplicateName};this.errorList.push(e)}else{this.filesToUpload.push(t)}}));if(this.filesToUpload.length>0){this.numFilesInProgress=this.filesToUpload.length;this.wmUploaderFilesSelected.emit(this.filesToUpload);this.wmFilesSelected.emit(this.filesToUpload)}}t.target.value=""}componentWillLoad(){if(!this.buttonText){throw new Error("wm-uploader: button-text is a required prop")}if(this.type){console.warn("wm-uploader: type has been deprecated as of v3.1.0. Please use uploader-type instead.")}if(this.tempUploaderType==="1"&&!this.emptyStateText){throw new Error("wm-uploader: empty-state-text is a required prop")}this.parseFiles();this.clearErrors();this.parseRejectedFiles()}componentDidLoad(){if(document.body.classList.contains("wmcl-user-is-tabbing")){this.toggleTabbingOn()}}uploadButtonOnClick(t){if(this.isDisabled){t.preventDefault();if(this.numFilesInProgress>0){const t=l.waitToUpload;this.announce(t)}else if(this.fileLimitReached){this.internalErrorMessage=l.fileLimitReached;this.announce(l.fileLimitReached)}}else{this.clearErrors()}}renderUploadSvg(){return i("svg",{class:"upload-file",width:"91",height:"84",viewBox:"0 0 91 84"},i("path",{transform:"rotate(-180.000000) translate(-452, -255.5)",fill:"#eae8ec",d:"M361,249.681818 L361,197.318182 C361,194.118182 365.555061,191.5 371.122358,191.5 L391.316463,191.5 L391.286495,200.562515 L369.871211,200.600292 L369.885404,200.622146 L369.886423,246.655947 L443.657038,246.840767 L443.657038,200.622146 L421.683537,200.622146 L421.683537,191.5 L441.978865,191.5 C447.546162,191.5 452,194.118182 452,197.318182 L452,249.681818 C452,252.881818 447.546162,255.5 441.978865,255.5 L371.122358,255.5 C365.504449,255.5 361,252.881818 361,249.681818 Z M391.5,207 L406,221 L420.5,207 L409.625,207 L409.625,172 L402.375,172 L402.375,207 L391.5,207 Z"}))}renderIcon(){const t=this.icon&&this.icon==="f066";return this.icon&&i("span",{class:`mdi ${t?"rotate":""}`},String.fromCodePoint(parseInt(`0x${this.icon}`)))}renderInfo(){return this.info&&this.tempUploaderType==="2"?i("span",{class:"info"},this.info):""}renderNotif(){return i("div",{class:"notif"},this.notif)}renderError(){return i("div",{id:"error"},this.displayedErrorMessage)}renderUploadButton(t){let e=`${this.label&&this.label!==this.buttonText?`${this.label}, `:""}${this.buttonText}`;return i("div",{class:"info-wrapper"},i("input",{name:this.inputId,id:this.inputId,class:"sr-only","aria-label":e,"aria-required":this.requiredField?"true":null,"aria-describedby":`${this.displayedErrorMessage?"error ":""}file-count max-size accepted-types`,type:"file",multiple:true,onClick:t=>this.uploadButtonOnClick(t),onChange:t=>this.handleFiles(t)}),i("label",{htmlFor:this.inputId,class:`wm-button ${t}${this.isTabbing?" user-is-tabbing":""}`},this.renderIcon(),this.buttonText),this.renderInfo())}renderEmptyState(){return i("div",{class:"empty-block"},this.renderUploadSvg(),i("div",{class:`empty-message`},this.emptyStateText),this.renderUploadButton("-primary empty-button"),this.notif&&this.renderNotif(),this.displayedErrorMessage&&this.renderError())}renderErrorList(){let t=this.errorList.reduce((function(t,e){return t+`${e.name}: ${e.message} `}),"");this.announce(t);return i("ul",{class:"error-list"},this.errorList.map((t=>i("wm-file",{file:`{"name": "${t.name}"}`,"error-message":t.message}))))}formatTimestamp(t){const e=new Date(Date.parse(t));const o=e.getDate();const i=e.getMonth()+1;const n=e.getFullYear();const r=e.toLocaleTimeString("en-us",{hour:"numeric",minute:"2-digit"});const s=`${i}/${o}/${n} ${r}`;return s}renderInProgressFileList(){return i("ul",{class:"inprogress-list"},this.fileList.filter((t=>this.isItemUploading(t))).map((t=>i("wm-file",{file:JSON.stringify(t),"show-info":this.showInfo}))))}renderUploadedFileList(){return i("ul",{class:"file-list"},this.fileList.filter((t=>!this.isItemUploading(t))).map((t=>{t.lastUpdated=this.formatTimestamp(t.lastUpdated);return i("wm-file",{id:`file-${t.id}`,file:JSON.stringify(t),"show-info":this.showInfo})})))}renderFiles(){this.sortBy==="name"?this.fileList.sort(((t,e)=>t.name.localeCompare(e.name))):this.fileList.sort(((t,e)=>Date.parse(t.lastUpdated)-Date.parse(e.lastUpdated)));return i("div",null,this.renderInProgressFileList(),this.renderUploadedFileList())}legacyRenderHeader(){return i("div",{class:`header ${this.tempUploaderType?`type${this.tempUploaderType}`:""}`},i("div",{class:"slot-wrapper"},i("slot",null),i("div",{class:`notif-wrapper ${this.tempUploaderType?`type${this.tempUploaderType}`:""}`},this.renderUploadButton(`-secondary ${this.isDisabled?"disabled":""}`),this.notif&&this.renderNotif(),this.displayedErrorMessage&&this.renderError())))}renderHeader(){const t="."+this.fileTypes.split(" ").join(", .");return i("div",{class:`header ${this.tempUploaderType?`type${this.tempUploaderType}`:""}`},i("div",{class:`notif-wrapper ${this.tempUploaderType?`type${this.tempUploaderType}`:""}`},this.renderUploadButton(`-secondary ${this.isDisabled?"disabled":""}`),this.renderRequirements()),i("div",{id:"accepted-types",class:"accepted-types"},l.getAcceptedFileTypes(t,this.fileTypes.split(" ").length)),this.notif&&this.renderNotif(),this.displayedErrorMessage&&this.renderError())}renderRequirements(){return i("div",{class:"requirements"},this.maxFiles&&i("span",{id:"file-count"},l.getFileCount(this.fileList.length,this.maxFiles)),this.maxSize&&i("span",{id:"max-size"},l.getMaxSize(this.effectiveMaxSize)))}renderFooter(){return i("div",{class:"footer"},i("div",{class:`notif-wrapper ${this.tempUploaderType?`type${this.tempUploaderType}`:""}`},i("div",{class:"filecount-wrapper"},i("div",{class:"filecount"},l.getFilesAdded(this.fileList.length)),this.renderUploadButton(`-primary ${this.isDisabled?"disabled":""}`)),this.notif&&this.renderNotif(),this.displayedErrorMessage&&this.renderError()))}renderWithItems(){const t=this.fileList.filter((t=>t.progress===(typeof t.progress==="number"?100:"100"))).length>0;return i("div",null,!this.tempUploaderType&&this.renderHeader(),this.tempUploaderType==="2"&&this.legacyRenderHeader(),i("div",{class:`list-container type${this.tempUploaderType} ${!this.tempUploaderType&&t?"checkmark-spacer":""}`},this.errorList.length>0&&this.renderErrorList(),this.fileList.length>0&&this.renderFiles()),this.tempUploaderType==="1"&&this.renderFooter())}renderLabel(){return i("div",{class:`wrapper ${this.displayedErrorMessage?"invalid":""}`},i("div",{id:"label",class:`label`},this.label,this.requiredField&&i("span",{class:"required","aria-hidden":"true"},"*")))}render(){return i(n,null,this.label&&this.renderLabel(),this.isEmpty()&&this.tempUploaderType==="1"?this.renderEmptyState():this.renderWithItems(),i("div",{ref:t=>this.liveRegion=t,class:"live-region sr-only","aria-live":"assertive","aria-atomic":"true"},this.announcement))}static get delegatesFocus(){return true}get el(){return r(this)}static get watchers(){return{files:["parseFiles"],fileList:["focusAfterRemoval"],rejectedFiles:["parseRejectedFiles"],numFilesInProgress:["uploadNotifications"],errorMessage:["handleErrorMessageChange"]}}};m.style=d;export{m as wm_uploader};
+//# sourceMappingURL=p-5cc287d2.entry.js.map

package/dist/ripple/p-5cc287d2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmUploaderCss","Uploader","this","inputId","generateId","uploadButtonEl","el","shadowRoot","querySelector","tempUploaderType","type","uploaderType","effectiveMaxSize","defaultMaxSize","maxSizeLimit","maxSize","Math","min","fileLimitReached","maxFiles","fileList","length","displayedErrorMessage","errorMessage","internalErrorMessage","toggleTabbingOn","isTabbing","toggleTabbingOff","handleUploadProgress","ev","map","i","id","detail","progress","forceUpdate","numFilesInProgress","srProgress","total","setInterval","aggregate","reduce","avg","item","announce","uploaderMessages","getUploadProgress","floor","handleFileErrorCleared","filename","name","errorList","filter","error","focus","handleFileDeleted","clearErrors","wmUploaderDeleteFile","emit","wmFileDelete","wmDeleteFile","handleFilePreviewed","wmUploaderPreviewFile","wmFilePreview","handleFileDownloaded","wmUploaderDownloadFile","wmFileDownload","wmDownloadFile","parseFiles","files","list","JSON","parse","forEach","size","match","convertedSize","convertBytes","toFixed","unit","Error","focusAfterRemoval","newFiles","oldFiles","newFileIds","file","oldFileIds","removedFileId","includes","indexOf","fileIdPrecedingRemoved","fileElPrecedingRemoved","focusedElementsButtons","querySelectorAll","lastButtonInFile","parseRejectedFiles","rejectedFiles","uploadNotifications","newNum","oldNum","setTimeout","notif","finishedUploading","clearInterval","getFilesUploading","handleErrorMessageChange","isValidSize","bytes","unitOrder","unitIndex","result","parseInt","isDuplicate","hasDuplicateUploadingFile","filesToUpload","some","fileToUpload","hasDuplicateUploadedFile","f","isEmpty","isDisabled","isItemUploading","hasOwnProperty","message","liveRegion","textContent","announcement","handleFiles","Array","from","target","validTypes","fileTypes","split","join","fileLimitExceeded","hasValidType","getInvalidFileType","push","zeroFileSize","getFileTooLarge","duplicateName","wmUploaderFilesSelected","wmFilesSelected","value","componentWillLoad","buttonText","console","warn","emptyStateText","componentDidLoad","document","body","classList","contains","uploadButtonOnClick","preventDefault","srMsg","waitToUpload","renderUploadSvg","h","class","width","height","viewBox","transform","fill","d","renderIcon","rotate","icon","String","fromCodePoint","renderInfo","info","renderNotif","renderError","renderUploadButton","classes","accessibleLabel","label","requiredField","multiple","onClick","onChange","htmlFor","renderEmptyState","renderErrorList","srMessage","acc","err","formatTimestamp","timestamp","uploadDate","Date","day","getDate","month","getMonth","year","getFullYear","time","toLocaleTimeString","hour","minute","formattedDate","renderInProgressFileList","stringify","showInfo","renderUploadedFileList","lastUpdated","renderFiles","sortBy","sort","a","b","localeCompare","legacyRenderHeader","renderHeader","renderRequirements","getAcceptedFileTypes","getFileCount","getMaxSize","renderFooter","getFilesAdded","renderWithItems","hasNewlyUploadedFiles","renderLabel","render","Host","ref"],"sources":["./src/components/wm-uploader/wm-uploader.scss?tag=wm-uploader&encapsulation=shadow","./src/components/wm-uploader/wm-uploader.tsx"],"sourcesContent":[":host,\nwm-uploader {\n  display: block;\n  position: relative;\n  max-width: 1140px;\n\n  &[dir=\"RTL\"] {\n    .mdi {\n      margin-left: rem-calc(5);\n      margin-right: 0;\n    }\n  }\n  @extend %wm-button;\n\n  input:focus + .wm-button.user-is-tabbing {\n    -webkit-box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;\n    -moz-box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;\n    box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;\n  }\n}\n\n:host *,\nwm-uploader * {\n  box-sizing: border-box;\n}\n\n.wm-button.disabled {\n  // override the %wm-button rule\n  // we want a pointer event when disabled,\n  // to trigger a SR message\n  pointer-events: initial !important;\n}\n\n@include label;\n#label {\n  margin-bottom: rem-calc(8);\n}\n\n.header {\n  .info-wrapper {\n    align-items: center;\n    .info {\n      font-size: rem-calc(14);\n      margin-left: 1rem;\n    }\n  }\n\n  .accepted-types {\n    font-size: rem-calc(14);\n  }\n\n  .requirements {\n    font-size: rem-calc(14);\n    margin-left: rem-calc(16);\n  }\n}\n\n.footer {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  padding: rem-calc(15 30);\n\n  .notif-wrapper {\n    align-items: flex-end;\n  }\n\n  .filecount-wrapper {\n    display: flex;\n    align-items: center;\n    .filecount {\n      font-size: 0.875rem;\n      margin-right: 1rem;\n    }\n  }\n}\n\n.notif-wrapper {\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  margin-bottom: rem-calc(12);\n\n  .requirements {\n    display: flex;\n    flex-direction: column;\n  }\n}\n\n.notif,\n#error {\n  padding-top: rem-calc(4);\n  font-size: 0.875rem;\n  font-style: italic;\n\n  &#error {\n    @include errorMessage;\n  }\n}\n\n.info-wrapper {\n  position: relative; // for .info\n  display: flex;\n}\n\n.list-container {\n  overflow-y: unset;\n\n  &.checkmark-spacer {\n    margin-right: rem-calc(44);\n  }\n\n  &:has(.error-list, .inprogress-list, .file-list) {\n    margin-top: rem-calc(40);\n  }\n\n  ul {\n    padding: 0;\n    width: 100%;\n    margin: 0;\n\n    wm-file {\n      margin-bottom: rem-calc(8);\n    }\n  }\n}\n\n.sr-only {\n  @include srOnly;\n}\n\n/// FOR DEPRECATED TYPES ///////////////////////////////////////\n.empty-block {\n  margin: 5rem auto;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n\n  .upload-file {\n    margin-bottom: rem-calc(30);\n  }\n\n  .empty-message {\n    font-size: 0.875rem;\n    &.large {\n      font-size: 1.5rem;\n    }\n    margin-bottom: rem-calc(7);\n  }\n\n  .info-wrapper {\n    justify-content: center;\n    width: 100%; // for .notif\n\n    .wm-button {\n      // Removing the width inherit here to prevent a 100% width\n      // from the info-wrapper. Future proofing a day when\n      // we might want a long notif to wrap.\n      width: auto;\n    }\n  }\n}\n\n.header {\n  &.type1,\n  &.type2 {\n    margin-bottom: 1rem;\n  }\n  .slot-wrapper {\n    display: flex;\n    justify-content: flex-start;\n    align-items: flex-start;\n  }\n}\n\n.notif-wrapper {\n  &.type1,\n  &.type2 {\n    flex-direction: column;\n    margin-bottom: rem-calc(16);\n  }\n}\n\n.list-container {\n  &.type1,\n  &.type2 {\n    overflow-y: auto;\n    ul {\n      margin: revert;\n    }\n    .file-list li,\n    .inprogress-list li {\n      // margin-bottom also on the last element, otherwise tooltip on dl and delete btns triggers a scrollbar\n      margin-bottom: rem-calc(26);\n    }\n    .error-list li {\n      margin-bottom: rem-calc(20);\n    }\n  }\n\n  &.type1 {\n    padding: rem-calc(0 30);\n    height: rem-calc(260);\n  }\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Prop, State, Listen, Watch } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { generateId, hasValidType } from \"../../global/functions\";\nimport { UploadedFile } from \"../../global/interfaces\";\nimport { uploaderMessages } from \"../../global/intl\";\ninterface ErrorFile {\n  name: string;\n  message: string;\n}\n\n@Component({\n  tag: \"wm-uploader\",\n  styleUrl: \"wm-uploader.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class Uploader {\n  @Element() el!: HTMLWmUploaderElement;\n  private liveRegion!: HTMLDivElement;\n  get uploadButtonEl(): HTMLElement {\n    return this.el.shadowRoot!.querySelector(`#${this.inputId}`) as HTMLElement;\n  }\n\n  @Prop({ mutable: true }) uploaderType?: \"1\" | \"2\"; // only mutable for the deprecation transition\n  @Prop() type?: \"1\" | \"2\"; // DEPRECATED in favor of uploaderType\n  get tempUploaderType() {\n    // replace instances of this.tempUploaderType with this.uploaderType once type is fully phased out\n    return this.type || this.uploaderType;\n  }\n  @Prop() label?: string;\n  @Prop() buttonText!: string;\n  @Prop() info?: string;\n  @Prop() emptyStateText!: string;\n  @Prop() icon!: string;\n  @Prop() fileTypes: string = \"pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv\";\n  @Prop() maxSize?: number | null; // in Mb\n  @Prop() maxFiles?: number;\n  @Prop() sortBy: \"name\" | \"date\" = \"date\"; // name is descending (a -> z), date is ascending (earlier -> later)\n  @Prop() showInfo: \"time\" | \"size\" | \"none\" = \"time\";\n  @Prop() errorMessage?: string;\n  @Prop() requiredField?: boolean;\n\n  @Prop() files?: string; // String representation of an array of files (the files retrieved from the server)\n  @State() fileList: UploadedFile[] = []; // the string above transformed into the actual array\n  @Prop({ mutable: true }) filesToUpload: File[] = []; // input.files that passed validation\n\n  @State() isTabbing: boolean = false;\n\n  @Prop() rejectedFiles?: string; // String representation of an array of errors to add to errorList, allows devs to display server-side errors\n  @State() errorList: ErrorFile[] = []; // for errors on a particular file\n  @State() notif?: string | null; // for upload notifications\n  @State() internalErrorMessage?: string;\n  @State() announcement: string = \"\";\n  @State() numFilesInProgress?: number | null; // null when not uploading != 0 (when all files are done uploading) != undefined (original state)\n  @State() isCondensed: boolean = false;\n  private srProgress?: any; // setInterval for SR to announce the aggregate progress percentage when things take a long time. stored here so it can be stopped when upload is finished.\n  private inputId = generateId();\n\n  @Event() wmUploaderFilesSelected!: EventEmitter;\n  @Event() wmFilesSelected!: EventEmitter; // deprecated in favor of wmUploaderFilesSelected\n  @Event() wmUploaderDeleteFile!: EventEmitter;\n  @Event() wmDeleteFile!: EventEmitter; // deprecated in favor of wmUploaderDeleteFile\n  @Event() wmUploaderDownloadFile!: EventEmitter;\n  @Event() wmDownloadFile!: EventEmitter; // deprecated in favor of wmUploaderDownloadFile\n  @Event() wmUploaderPreviewFile!: EventEmitter;\n\n  @Event() wmFileDelete!: EventEmitter<string>;\n  @Event() wmFileDownload!: EventEmitter<string>;\n  @Event() wmFilePreview!: EventEmitter<string>;\n\n  get effectiveMaxSize() {\n    const defaultMaxSize = 100;\n    // maxsize cannot be set to over 100Mb\n    const maxSizeLimit = 100;\n\n    return this.maxSize ? Math.min(this.maxSize, maxSizeLimit) : defaultMaxSize;\n  }\n\n  get fileLimitReached() {\n    return this.maxFiles && this.fileList.length >= this.maxFiles;\n  }\n\n  get displayedErrorMessage(): string {\n    return this.errorMessage || this.internalErrorMessage || \"\";\n  }\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  @Listen(\"wmUploadProgress\")\n  handleUploadProgress(ev: CustomEvent) {\n    this.fileList.map((i) => {\n      if (i.id === ev.detail.id) {\n        i.progress = ev.detail.progress;\n        forceUpdate(this.el);\n      }\n    });\n\n    if (ev.detail.progress === 100) {\n      // inProgressList is not a perfect reflection of how many files are uploading\n      // because even after progress reached 100% the item should remain in the array\n      // (should only be removed once it appears in fileList)\n      this.numFilesInProgress! -= 1;\n    }\n\n    // aggregate the percentages for SR to announce progress\n    if (!this.srProgress && this.numFilesInProgress) {\n      const total = this.numFilesInProgress; // if we don't reassign this number changes when a file is done and the percentage becomes wrong\n      this.srProgress = setInterval(() => {\n        const aggregate = this.fileList.reduce((avg, item) => (item.progress ? avg + item.progress : avg), 0);\n        this.announce(uploaderMessages.getUploadProgress(Math.floor(aggregate / total)));\n      }, 5000);\n    }\n  }\n\n  @Listen(\"wmFileClearErrorClicked\")\n  handleFileErrorCleared(ev: CustomEvent) {\n    const filename = ev.detail.name;\n    this.errorList = this.errorList.filter((error) => error.name != filename);\n    this.uploadButtonEl.focus();\n  }\n\n  @Listen(\"wmIntFileDeleted\")\n  handleFileDeleted(ev: CustomEvent) {\n    this.clearErrors();\n    forceUpdate(this.el); // for the button to stop being disabled if num files become < max-files\n    this.wmUploaderDeleteFile.emit(ev.detail);\n    this.wmFileDelete.emit(ev.detail);\n    this.wmDeleteFile.emit(ev.detail); // deprecated\n  }\n\n  @Listen(\"wmIntFilePreviewed\")\n  handleFilePreviewed(ev: CustomEvent) {\n    this.clearErrors();\n    this.wmUploaderPreviewFile.emit(ev.detail);\n    this.wmFilePreview.emit(ev.detail);\n  }\n\n  @Listen(\"wmIntFileDownloaded\")\n  handleFileDownloaded(ev: CustomEvent) {\n    this.clearErrors();\n    this.wmUploaderDownloadFile.emit(ev.detail);\n    this.wmFileDownload.emit(ev.detail);\n    this.wmDownloadFile.emit(ev.detail); // deprecated\n  }\n\n  @Watch(\"files\")\n  parseFiles() {\n    if (!!this.files) {\n      if (typeof this.files === \"string\") {\n        let list = JSON.parse(this.files);\n        if (typeof list === \"object\") {\n          // if size is in byte format, convert to display format\n          list.forEach((item: any) => {\n            if (item.size && (typeof item.size === \"number\" || item.size.match(/^[0-9]+$/))) {\n              const convertedSize = this.convertBytes(item.size);\n              item.size = `${convertedSize.size.toFixed(0)} ${convertedSize.unit}`;\n            }\n          });\n          this.fileList = list;\n        } else {\n          throw new Error(\"could not parse string passed to files attribute\");\n        }\n      } else {\n        throw new Error(\"Attribute 'files' should be a string\");\n      }\n    }\n  }\n\n  @Watch(\"fileList\")\n  focusAfterRemoval(newFiles: UploadedFile[], oldFiles: UploadedFile[]) {\n    if (this.isTabbing && newFiles.length < oldFiles.length) {\n      const newFileIds = newFiles.map((file: UploadedFile) => file.id);\n      const oldFileIds = oldFiles.map((file: UploadedFile) => file.id);\n      // even in the case that multiple files have been removed at once, work off of the first in that group\n      const removedFileId = oldFileIds.filter((id: string) => !newFileIds.includes(id))[0];\n\n      if (oldFileIds.indexOf(removedFileId) > 0) {\n        const fileIdPrecedingRemoved = oldFileIds[oldFileIds.indexOf(removedFileId) - 1];\n        const fileElPrecedingRemoved = this.el.shadowRoot!.querySelector(\"#file-\" + fileIdPrecedingRemoved);\n        const focusedElementsButtons = fileElPrecedingRemoved?.shadowRoot!.querySelectorAll(\"wm-button\");\n\n        if (focusedElementsButtons && focusedElementsButtons.length > 0) {\n          const lastButtonInFile = focusedElementsButtons[focusedElementsButtons.length - 1];\n          lastButtonInFile.focus();\n        } else {\n          // if preceding file has no file action buttons, rerun function with adjusted params\n          // by removing the fileElPrecedingRemoved from the newFiles list, it is now considered the removedFile and looks to focus it's preceding file\n          // if it continues to cannot find an appropriate preceding file and becomes the first file in the list, it focuses the upload button\n          this.focusAfterRemoval(\n            newFiles.filter((file: UploadedFile) => file.id !== fileIdPrecedingRemoved),\n            oldFiles\n          );\n        }\n      } else {\n        this.uploadButtonEl.focus();\n      }\n    }\n  }\n\n  @Watch(\"rejectedFiles\")\n  parseRejectedFiles() {\n    if (!!this.rejectedFiles) {\n      if (typeof this.files === \"string\") {\n        const list = JSON.parse(this.rejectedFiles);\n        if (typeof list === \"object\") {\n          this.errorList = list;\n        } else {\n          throw new Error(\"could not parse string passed to errors attribute\");\n        }\n      } else {\n        throw new Error(\"Attribute 'rejected-files' should be a string\");\n      }\n    }\n  }\n\n  @Watch(\"numFilesInProgress\")\n  uploadNotifications(newNum: number, oldNum: number) {\n    if (oldNum > 0 && newNum === 0) {\n      setTimeout(() => {\n        this.notif = \"\";\n        this.internalErrorMessage = \"\";\n      }, 20 * 1000);\n      this.notif = uploaderMessages.finishedUploading;\n      this.announce(uploaderMessages.finishedUploading);\n      this.numFilesInProgress = null;\n      clearInterval(this.srProgress);\n      forceUpdate(this.el);\n    } else if (newNum > 0 && newNum != oldNum) {\n      this.notif = uploaderMessages.getFilesUploading(newNum);\n      this.announce(uploaderMessages.getFilesUploading(newNum));\n      forceUpdate(this.el);\n    }\n  }\n\n  @Watch(\"errorMessage\")\n  handleErrorMessageChange() {\n    if (this.errorMessage) {\n      this.announce(this.errorMessage);\n    }\n  }\n\n  isValidSize(size: number) {\n    return this.convertBytes(size, \"MB\").size <= this.effectiveMaxSize;\n  }\n\n  convertBytes(bytes: number, unit?: \"KB\" | \"MB\" | \"GB\" | \"TB\") {\n    // https://stackoverflow.com/questions/2365100/converting-bytes-to-megabytes\n    const unitOrder = [\"bytes\", \"KB\", \"MB\", \"GB\", \"TB\"];\n    let unitIndex = 0;\n    let result = typeof bytes === \"number\" ? bytes : parseInt(bytes);\n\n    if (unit) {\n      // convert until result matches desired unit\n      while (unitOrder.indexOf(unit) > unitIndex) {\n        result /= 1024;\n        unitIndex++;\n      }\n    } else {\n      // convert until result is appropriate unit (value is under 1000)\n      while (result > 1000) {\n        result /= 1024;\n        unitIndex++;\n      }\n    }\n    return { size: result, unit: unitOrder[unitIndex] };\n  }\n\n  isDuplicate(name: string) {\n    const hasDuplicateUploadingFile = this.filesToUpload.some((fileToUpload: File) => fileToUpload.name === name);\n    const hasDuplicateUploadedFile = this.fileList.some((f) => {\n      const filename: string = f.type ? f.name + \".\" + f.type : f.name;\n      return filename === name;\n    });\n\n    return hasDuplicateUploadingFile || hasDuplicateUploadedFile;\n  }\n\n  isEmpty() {\n    return !this.fileList.length && !this.errorList.length;\n  }\n\n  get isDisabled() {\n    // disable if is the uploader is maxed out or if something is uploading\n    return this.fileLimitReached || this.numFilesInProgress! > 0;\n  }\n\n  isItemUploading(item: UploadedFile) {\n    return item.hasOwnProperty(\"progress\") && item.progress! < 100;\n  }\n\n  announce(message: string) {\n    if (this.liveRegion.textContent === message) {\n      message += \"\\u00A0\";\n    }\n    this.announcement = message;\n  }\n\n  clearErrors() {\n    this.errorList = [];\n    this.notif = \"\";\n    this.internalErrorMessage = \"\";\n  }\n\n  handleFiles(ev: Event) {\n    this.filesToUpload = [];\n    const files = Array.from((ev.target! as HTMLInputElement).files!);\n    const validTypes = this.fileTypes.split(\" \").join(\", \");\n\n    if (!!this.maxFiles && this.fileList.length + files.length > this.maxFiles) {\n      this.internalErrorMessage = uploaderMessages.fileLimitExceeded;\n      this.announce(uploaderMessages.fileLimitExceeded);\n    } else {\n      files &&\n        files.map((file) => {\n          if (!hasValidType(file, this.fileTypes)) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.getInvalidFileType(validTypes),\n            };\n            this.errorList.push(error);\n          } else if (file.size === 0) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.zeroFileSize,\n            };\n            this.errorList.push(error);\n          } else if (!this.isValidSize(file.size)) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.getFileTooLarge(this.effectiveMaxSize),\n            };\n            this.errorList.push(error);\n          } else if (this.isDuplicate(file.name)) {\n            const error = {\n              name: file.name,\n              message: uploaderMessages.duplicateName,\n            };\n            this.errorList.push(error);\n          } else {\n            this.filesToUpload.push(file);\n          }\n        });\n\n      if (this.filesToUpload.length > 0) {\n        this.numFilesInProgress = this.filesToUpload.length;\n        this.wmUploaderFilesSelected.emit(this.filesToUpload);\n        this.wmFilesSelected.emit(this.filesToUpload); // deprecated\n      }\n    }\n    (ev.target! as HTMLInputElement).value = \"\"; // reset to ensure that onChange is triggered when the same file is selected a second time\n  }\n\n  componentWillLoad() {\n    if (!this.buttonText) {\n      throw new Error(\"wm-uploader: button-text is a required prop\");\n    }\n\n    if (this.type) {\n      console.warn(\"wm-uploader: type has been deprecated as of v3.1.0. Please use uploader-type instead.\");\n    }\n\n    if (this.tempUploaderType === \"1\" && !this.emptyStateText) {\n      throw new Error(\"wm-uploader: empty-state-text is a required prop\");\n    }\n\n    this.parseFiles();\n    this.clearErrors();\n    this.parseRejectedFiles();\n  }\n\n  componentDidLoad() {\n    if (document.body.classList.contains(\"wmcl-user-is-tabbing\")) {\n      this.toggleTabbingOn();\n    }\n  }\n\n  uploadButtonOnClick(ev: Event) {\n    if (this.isDisabled) {\n      // this is a temporary fix.\n      // we need the disabled button to be programmatically focusable\n      // to allow return focus after closing the browser file panel\n      // since it's focusable the button should respond when activated\n      // it looks disabled, and announces the reason why the action cannot\n      // be taken when activated.\n      ev.preventDefault();\n\n      if (this.numFilesInProgress! > 0) {\n        const srMsg = uploaderMessages.waitToUpload;\n        this.announce(srMsg);\n      } else if (this.fileLimitReached) {\n        this.internalErrorMessage = uploaderMessages.fileLimitReached;\n        this.announce(uploaderMessages.fileLimitReached);\n      }\n    } else {\n      this.clearErrors();\n    }\n  }\n\n  renderUploadSvg() {\n    return (\n      <svg class=\"upload-file\" width=\"91\" height=\"84\" viewBox=\"0 0 91 84\">\n        <path\n          transform=\"rotate(-180.000000) translate(-452, -255.5)\"\n          fill=\"#eae8ec\"\n          d=\"M361,249.681818 L361,197.318182 C361,194.118182 365.555061,191.5 371.122358,191.5 L391.316463,191.5 L391.286495,200.562515 L369.871211,200.600292 L369.885404,200.622146 L369.886423,246.655947 L443.657038,246.840767 L443.657038,200.622146 L421.683537,200.622146 L421.683537,191.5 L441.978865,191.5 C447.546162,191.5 452,194.118182 452,197.318182 L452,249.681818 C452,252.881818 447.546162,255.5 441.978865,255.5 L371.122358,255.5 C365.504449,255.5 361,252.881818 361,249.681818 Z M391.5,207 L406,221 L420.5,207 L409.625,207 L409.625,172 L402.375,172 L402.375,207 L391.5,207 Z\"\n        ></path>\n      </svg>\n    );\n  }\n\n  renderIcon() {\n    // mdi attachment icon (paper clip) is horizontal but we want it vertical\n    const rotate = this.icon && this.icon === \"f066\";\n    return (\n      this.icon && (\n        <span class={`mdi ${rotate ? \"rotate\" : \"\"}`}>{String.fromCodePoint(parseInt(`0x${this.icon}`))}</span>\n      )\n    );\n  }\n\n  renderInfo() {\n    return this.info && this.tempUploaderType === \"2\" ? <span class=\"info\">{this.info}</span> : \"\";\n  }\n\n  renderNotif() {\n    return <div class=\"notif\">{this.notif}</div>;\n  }\n\n  renderError() {\n    return <div id=\"error\">{this.displayedErrorMessage}</div>;\n  }\n\n  renderUploadButton(classes: string) {\n    let accessibleLabel = `${this.label && this.label !== this.buttonText ? `${this.label}, ` : \"\"}${this.buttonText}`;\n\n    return (\n      <div class=\"info-wrapper\">\n        <input\n          name={this.inputId}\n          id={this.inputId}\n          class=\"sr-only\"\n          aria-label={accessibleLabel}\n          aria-required={this.requiredField ? \"true\" : null}\n          aria-describedby={`${this.displayedErrorMessage ? \"error \" : \"\"}file-count max-size accepted-types`}\n          type=\"file\"\n          multiple\n          onClick={(ev) => this.uploadButtonOnClick(ev)}\n          onChange={(ev) => this.handleFiles(ev)}\n        />\n        <label htmlFor={this.inputId} class={`wm-button ${classes}${this.isTabbing ? \" user-is-tabbing\" : \"\"}`}>\n          {this.renderIcon()}\n          {this.buttonText}\n        </label>\n        {this.renderInfo()}\n      </div>\n    );\n  }\n\n  renderEmptyState() {\n    return (\n      <div class=\"empty-block\">\n        {this.renderUploadSvg()}\n        <div class={`empty-message`}>{this.emptyStateText}</div>\n        {this.renderUploadButton(\"-primary empty-button\")}\n        {this.notif && this.renderNotif()}\n        {this.displayedErrorMessage && this.renderError()}\n      </div>\n    );\n  }\n\n  renderErrorList() {\n    let srMessage = this.errorList.reduce(function (acc, err) {\n      return acc + `${err.name}: ${err.message} `;\n    }, \"\");\n    this.announce(srMessage);\n\n    return (\n      <ul class=\"error-list\">\n        {this.errorList.map((err) => (\n          <wm-file file={`{\"name\": \"${err.name}\"}`} error-message={err.message}></wm-file>\n        ))}\n      </ul>\n    );\n  }\n\n  formatTimestamp(timestamp: string): string {\n    const uploadDate = new Date(Date.parse(timestamp));\n    const day = uploadDate.getDate();\n    const month = uploadDate.getMonth() + 1;\n    const year = uploadDate.getFullYear();\n    const time = uploadDate.toLocaleTimeString(\"en-us\", { hour: \"numeric\", minute: \"2-digit\" });\n    const formattedDate = `${month}/${day}/${year} ${time}`;\n\n    return formattedDate;\n  }\n\n  renderInProgressFileList() {\n    return (\n      <ul class=\"inprogress-list\">\n        {this.fileList\n          .filter((item) => this.isItemUploading(item))\n          .map((item) => (\n            <wm-file file={JSON.stringify(item)} show-info={this.showInfo}></wm-file>\n          ))}\n      </ul>\n    );\n  }\n\n  renderUploadedFileList() {\n    return (\n      <ul class=\"file-list\">\n        {this.fileList\n          .filter((item) => !this.isItemUploading(item))\n          .map((item) => {\n            item.lastUpdated = this.formatTimestamp(item.lastUpdated);\n            return <wm-file id={`file-${item.id}`} file={JSON.stringify(item)} show-info={this.showInfo}></wm-file>;\n          })}\n      </ul>\n    );\n  }\n\n  renderFiles() {\n    // if we switch to accepting display format for the wm-uploader's file lastUpdateds, sorting by date will become impossible\n    this.sortBy === \"name\"\n      ? this.fileList.sort((a, b) => a.name.localeCompare(b.name))\n      : this.fileList.sort((a, b) => Date.parse(a.lastUpdated) - Date.parse(b.lastUpdated));\n    return (\n      <div>\n        {this.renderInProgressFileList()}\n        {this.renderUploadedFileList()}\n      </div>\n    );\n  }\n\n  legacyRenderHeader() {\n    return (\n      <div class={`header ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n        <div class=\"slot-wrapper\">\n          <slot />\n          <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n            {this.renderUploadButton(`-secondary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n            {this.notif && this.renderNotif()}\n            {this.displayedErrorMessage && this.renderError()}\n          </div>\n        </div>\n      </div>\n    );\n  }\n\n  renderHeader() {\n    const validTypes = \".\" + this.fileTypes.split(\" \").join(\", .\");\n\n    return (\n      <div class={`header ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n        <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n          {this.renderUploadButton(`-secondary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n          {this.renderRequirements()}\n        </div>\n        <div id=\"accepted-types\" class=\"accepted-types\">\n          {uploaderMessages.getAcceptedFileTypes(validTypes, this.fileTypes.split(\" \").length)}\n        </div>\n        {this.notif && this.renderNotif()}\n        {this.displayedErrorMessage && this.renderError()}\n      </div>\n    );\n  }\n\n  renderRequirements() {\n    return (\n      <div class=\"requirements\">\n        {this.maxFiles && (\n          <span id=\"file-count\">{uploaderMessages.getFileCount(this.fileList.length, this.maxFiles)}</span>\n        )}\n        {this.maxSize && <span id=\"max-size\">{uploaderMessages.getMaxSize(this.effectiveMaxSize)}</span>}\n      </div>\n    );\n  }\n\n  renderFooter() {\n    return (\n      <div class=\"footer\">\n        <div class={`notif-wrapper ${this.tempUploaderType ? `type${this.tempUploaderType}` : \"\"}`}>\n          <div class=\"filecount-wrapper\">\n            <div class=\"filecount\">{uploaderMessages.getFilesAdded(this.fileList.length)}</div>\n            {this.renderUploadButton(`-primary ${this.isDisabled ? \"disabled\" : \"\"}`)}\n          </div>\n          {this.notif && this.renderNotif()}\n          {this.displayedErrorMessage && this.renderError()}\n        </div>\n      </div>\n    );\n  }\n\n  renderWithItems() {\n    // it's possible progress is passed in as a string, so we need to check for \"100\" as well\n    const hasNewlyUploadedFiles =\n      this.fileList.filter((file) => file.progress === (typeof file.progress === \"number\" ? 100 : \"100\")).length > 0;\n    return (\n      <div>\n        {!this.tempUploaderType && this.renderHeader()}\n        {this.tempUploaderType === \"2\" && this.legacyRenderHeader()}\n        <div\n          class={`list-container type${this.tempUploaderType} ${\n            !this.tempUploaderType && hasNewlyUploadedFiles ? \"checkmark-spacer\" : \"\"\n          }`}\n        >\n          {this.errorList.length > 0 && this.renderErrorList()}\n          {this.fileList.length > 0 && this.renderFiles()}\n        </div>\n        {this.tempUploaderType === \"1\" && this.renderFooter()}\n      </div>\n    );\n  }\n\n  renderLabel() {\n    return (\n      <div class={`wrapper ${this.displayedErrorMessage ? \"invalid\" : \"\"}`}>\n        <div id=\"label\" class={`label`}>\n          {this.label}\n          {this.requiredField && (\n            <span class=\"required\" aria-hidden=\"true\">\n              *\n            </span>\n          )}\n        </div>\n      </div>\n    );\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.label && this.renderLabel()}\n        {this.isEmpty() && this.tempUploaderType === \"1\" ? this.renderEmptyState() : this.renderWithItems()}\n        <div\n          ref={(el) => (this.liveRegion = el as HTMLDivElement)}\n          class=\"live-region sr-only\"\n          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\n          aria-atomic=\"true\"\n        >\n          {this.announcement}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/{p-8eebf787.entry.js → p-7e0e6b00.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,f as r,h as t,H as a,g as p}from"./p-1c23de4a.js";import{g as o,d as n,i as s}from"./p-05e0f901.js";import{g as c,a as m,h as i,b as w,r as h,c as l,d as b,e as d,f as g,i as u,j as x,k as f}from"./p-1aa16d42.js";const k=":host,wm-chart{display:block}:host .component-wrapper,wm-chart .component-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;font-size:0.875rem;position:relative;outline:none;}:host .component-wrapper .label,wm-chart .component-wrapper .label{display:block;margin:0;padding-bottom:0.25rem;font-weight:500;position:relative}:host .component-wrapper .label .subinfo,wm-chart .component-wrapper .label .subinfo{display:block;font-weight:normal;font-style:italic;bottom:0.25rem;width:100%;color:#6b6b6b}:host .component-wrapper .label.custom-width,wm-chart .component-wrapper .label.custom-width{width:var(--custom-label-width)}:host .component-wrapper .doughnut-svg,wm-chart .component-wrapper .doughnut-svg,:host .component-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper .inner-stacked-bar-wrapper{overflow:visible}:host .component-wrapper .bar-wrapper,wm-chart .component-wrapper .bar-wrapper{-ms-flex-positive:1;flex-grow:1;width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper{width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .values,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .values{display:-ms-flexbox;display:flex}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper{display:-ms-flexbox;display:flex}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment{height:30px;cursor:pointer}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment:not(.zero):not(:last-of-type),wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment:not(.zero):not(:last-of-type){margin-right:2px}:host .component-wrapper .doughnut-wrapper,wm-chart .component-wrapper .doughnut-wrapper{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px}:host .component-wrapper .doughnut-wrapper .doughnut-segment,wm-chart .component-wrapper .doughnut-wrapper .doughnut-segment{cursor:pointer}:host .component-wrapper .value-wrapper,wm-chart .component-wrapper .value-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .component-wrapper .value-wrapper:not(:last-of-type),wm-chart .component-wrapper .value-wrapper:not(:last-of-type){margin-right:2px}:host .component-wrapper .value-wrapper .value.hidden,wm-chart .component-wrapper .value-wrapper .value.hidden{visibility:hidden}:host .component-wrapper path:active,wm-chart .component-wrapper path:active,:host .component-wrapper path:hover,wm-chart .component-wrapper path:hover,:host .component-wrapper path:focus,wm-chart .component-wrapper path:focus,:host .component-wrapper .stacked-bar-segment:active,wm-chart .component-wrapper .stacked-bar-segment:active,:host .component-wrapper .stacked-bar-segment:hover,wm-chart .component-wrapper .stacked-bar-segment:hover,:host .component-wrapper .stacked-bar-segment:focus,wm-chart .component-wrapper .stacked-bar-segment:focus{outline:none}:host .component-wrapper .stacked-bar-segment:active.stacked-bar-segment,wm-chart .component-wrapper .stacked-bar-segment:active.stacked-bar-segment,:host .component-wrapper .stacked-bar-segment:hover.stacked-bar-segment,wm-chart .component-wrapper .stacked-bar-segment:hover.stacked-bar-segment,:host .component-wrapper .stacked-bar-segment:focus.stacked-bar-segment,wm-chart .component-wrapper .stacked-bar-segment:focus.stacked-bar-segment{-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper path:active.doughnut-segment,wm-chart .component-wrapper path:active.doughnut-segment,:host .component-wrapper path:hover.doughnut-segment,wm-chart .component-wrapper path:hover.doughnut-segment,:host .component-wrapper path:focus.doughnut-segment,wm-chart .component-wrapper path:focus.doughnut-segment,:host .component-wrapper .stacked-bar-segment:active.doughnut-segment,wm-chart .component-wrapper .stacked-bar-segment:active.doughnut-segment,:host .component-wrapper .stacked-bar-segment:hover.doughnut-segment,wm-chart .component-wrapper .stacked-bar-segment:hover.doughnut-segment,:host .component-wrapper .stacked-bar-segment:focus.doughnut-segment,wm-chart .component-wrapper .stacked-bar-segment:focus.doughnut-segment{-webkit-filter:url(#wmHoverDropShadow);filter:url(#wmHoverDropShadow)}:host .component-wrapper path::-moz-focus-inner,wm-chart .component-wrapper path::-moz-focus-inner,:host .component-wrapper .stacked-bar-segment::-moz-focus-inner,wm-chart .component-wrapper .stacked-bar-segment::-moz-focus-inner{border:0;outline:none}:host .component-wrapper.doughnut,wm-chart .component-wrapper.doughnut{width:300px}:host .component-wrapper.doughnut1 label,wm-chart .component-wrapper.doughnut1 label,:host .component-wrapper.doughnut1 .label-text,wm-chart .component-wrapper.doughnut1 .label-text,:host .component-wrapper.doughnut2 label,wm-chart .component-wrapper.doughnut2 label,:host .component-wrapper.doughnut2 .label-text,wm-chart .component-wrapper.doughnut2 .label-text,:host .component-wrapper.doughnut2plus label,wm-chart .component-wrapper.doughnut2plus label,:host .component-wrapper.doughnut2plus .label-text,wm-chart .component-wrapper.doughnut2plus .label-text,:host .component-wrapper.doughnut3 label,wm-chart .component-wrapper.doughnut3 label,:host .component-wrapper.doughnut3 .label-text,wm-chart .component-wrapper.doughnut3 .label-text{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper.doughnut0,wm-chart .component-wrapper.doughnut0,:host .component-wrapper.doughnut,wm-chart .component-wrapper.doughnut{-ms-flex-align:center;align-items:center}:host .component-wrapper.doughnut0 label,wm-chart .component-wrapper.doughnut0 label,:host .component-wrapper.doughnut label,wm-chart .component-wrapper.doughnut label{text-align:center;width:100%;padding-bottom:1.5rem}:host .component-wrapper.doughnut0 label .subinfo,wm-chart .component-wrapper.doughnut0 label .subinfo,:host .component-wrapper.doughnut label .subinfo,wm-chart .component-wrapper.doughnut label .subinfo{position:absolute}:host .component-wrapper.doughnut0 .completion-message,wm-chart .component-wrapper.doughnut0 .completion-message,:host .component-wrapper.doughnut .completion-message,wm-chart .component-wrapper.doughnut .completion-message{padding-top:0.625rem}:host .component-wrapper.bar1,wm-chart .component-wrapper.bar1,:host .component-wrapper.bar,wm-chart .component-wrapper.bar{padding:1.25rem;-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar1 label,wm-chart .component-wrapper.bar1 label,:host .component-wrapper.bar label,wm-chart .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .component-wrapper.bar1 label .subinfo,wm-chart .component-wrapper.bar1 label .subinfo,:host .component-wrapper.bar label .subinfo,wm-chart .component-wrapper.bar label .subinfo{position:initial}:host .component-wrapper.bar1 .chart-wrapper,wm-chart .component-wrapper.bar1 .chart-wrapper,:host .component-wrapper.bar .chart-wrapper,wm-chart .component-wrapper.bar .chart-wrapper{display:-ms-flexbox;display:flex}:host .component-wrapper.bar1 .chart-wrapper .single-perc,wm-chart .component-wrapper.bar1 .chart-wrapper .single-perc,:host .component-wrapper.bar .chart-wrapper .single-perc,wm-chart .component-wrapper.bar .chart-wrapper .single-perc{width:4rem;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;height:30px;-ms-flex-align:center;align-items:center}:host .component-wrapper.bar1 .chart-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar1 .chart-wrapper .inner-stacked-bar-wrapper,:host .component-wrapper.bar .chart-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar .chart-wrapper .inner-stacked-bar-wrapper{-ms-flex:1;flex:1}:host .component-wrapper.bar1 .chart-wrapper .completion-message,wm-chart .component-wrapper.bar1 .chart-wrapper .completion-message,:host .component-wrapper.bar .chart-wrapper .completion-message,wm-chart .component-wrapper.bar .chart-wrapper .completion-message{width:100%;text-align:right;margin-top:0.25rem}@media screen and (min-width: 768px){:host .component-wrapper.bar1,wm-chart .component-wrapper.bar1,:host .component-wrapper.bar,wm-chart .component-wrapper.bar{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.bar1 label,wm-chart .component-wrapper.bar1 label,:host .component-wrapper.bar label,wm-chart .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;min-height:30px;width:12rem;text-align:left;padding-right:1.25rem;padding-bottom:0;-ms-flex:none;flex:none}:host .component-wrapper.bar1 .bar-wrapper,wm-chart .component-wrapper.bar1 .bar-wrapper,:host .component-wrapper.bar .bar-wrapper,wm-chart .component-wrapper.bar .bar-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host .component-wrapper.bar1 .bar-wrapper .single-perc,wm-chart .component-wrapper.bar1 .bar-wrapper .single-perc,:host .component-wrapper.bar .bar-wrapper .single-perc,wm-chart .component-wrapper.bar .bar-wrapper .single-perc{text-align:center;padding-left:0.5rem;-ms-flex-pack:center;justify-content:center}}:host .component-wrapper.bar2,wm-chart .component-wrapper.bar2,:host .component-wrapper.bar3,wm-chart .component-wrapper.bar3,:host .component-wrapper.bar4,wm-chart .component-wrapper.bar4,:host .component-wrapper.bar5,wm-chart .component-wrapper.bar5{-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar2 .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar2 .inner-stacked-bar-wrapper,:host .component-wrapper.bar4 .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar4 .inner-stacked-bar-wrapper,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar5 .inner-stacked-bar-wrapper{height:30px;margin-bottom:0}:host .component-wrapper.bar2 .inner-stacked-bar-wrapper.show-values,wm-chart .component-wrapper.bar2 .inner-stacked-bar-wrapper.show-values,:host .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values,wm-chart .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values,wm-chart .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values{height:60px;margin-top:0}:host .component-wrapper.bar3 .chart-wrapper,wm-chart .component-wrapper.bar3 .chart-wrapper{position:relative;height:100px}:host .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper{position:absolute;top:35px;left:0;right:0;bottom:0;height:30px}:host .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper text,wm-chart .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper text{fill:#4a4a4a}:host .component-wrapper.bar3 .chart-wrapper .axis,wm-chart .component-wrapper.bar3 .chart-wrapper .axis{position:absolute;top:0;left:0;height:90px;width:100%;overflow:visible;-webkit-transform:translateY(90px);transform:translateY(90px)}:host .component-wrapper.bar3 .chart-wrapper .axis line,wm-chart .component-wrapper.bar3 .chart-wrapper .axis line{stroke:#eeedf4;stroke-width:1px}:host .component-wrapper.bar3 .chart-wrapper .axis text,wm-chart .component-wrapper.bar3 .chart-wrapper .axis text{-webkit-transform:translate(4px, 24px);transform:translate(4px, 24px);text-anchor:middle}:host .component-wrapper.bar3 .hidden-values-warning,wm-chart .component-wrapper.bar3 .hidden-values-warning{margin-top:1.25rem}:host .component-wrapper.bar6,wm-chart .component-wrapper.bar6,:host .component-wrapper.bar7,wm-chart .component-wrapper.bar7{--chartPadding:48px;-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar6 .chart-wrapper,wm-chart .component-wrapper.bar6 .chart-wrapper,:host .component-wrapper.bar7 .chart-wrapper,wm-chart .component-wrapper.bar7 .chart-wrapper{width:100%}:host .component-wrapper.bar6 .chart,wm-chart .component-wrapper.bar6 .chart,:host .component-wrapper.bar7 .chart,wm-chart .component-wrapper.bar7 .chart{position:relative;padding-right:var(--chartPadding)}:host .component-wrapper.bar6 .gridlines,wm-chart .component-wrapper.bar6 .gridlines,:host .component-wrapper.bar7 .gridlines,wm-chart .component-wrapper.bar7 .gridlines{position:absolute;left:var(--labelWidth);right:var(--chartPadding);top:0;bottom:0;background-image:linear-gradient(90deg, #8f8f8f 1px, transparent 1px);background-position:-1px;border-left:1px solid #8f8f8f;border-bottom:1px solid #8f8f8f;background-size:var(--backgroundSize)}:host .component-wrapper.bar6 .rows,wm-chart .component-wrapper.bar6 .rows,:host .component-wrapper.bar7 .rows,wm-chart .component-wrapper.bar7 .rows{display:grid;grid-template-columns:var(--labelWidth) auto;grid-auto-rows:minmax(30px, 1fr);-ms-flex-align:center;align-items:center;position:relative;z-index:1}:host .component-wrapper.bar6 .rows .label,wm-chart .component-wrapper.bar6 .rows .label,:host .component-wrapper.bar7 .rows .label,wm-chart .component-wrapper.bar7 .rows .label{font-weight:400;padding:0 0.75rem 0 0;text-align:right;margin:0.75rem 0}:host .component-wrapper.bar6 .rows .label.hidden,wm-chart .component-wrapper.bar6 .rows .label.hidden,:host .component-wrapper.bar7 .rows .label.hidden,wm-chart .component-wrapper.bar7 .rows .label.hidden{visibility:hidden;white-space:nowrap}:host .component-wrapper.bar6 .bar,wm-chart .component-wrapper.bar6 .bar,:host .component-wrapper.bar7 .bar,wm-chart .component-wrapper.bar7 .bar{height:30px;position:relative}:host .component-wrapper.bar6 .bar .value,wm-chart .component-wrapper.bar6 .bar .value,:host .component-wrapper.bar7 .bar .value,wm-chart .component-wrapper.bar7 .bar .value{position:absolute;top:50%;right:-0.5rem;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host .component-wrapper.bar6 .x-axis,wm-chart .component-wrapper.bar6 .x-axis,:host .component-wrapper.bar7 .x-axis,wm-chart .component-wrapper.bar7 .x-axis{margin-left:var(--labelWidth);margin-right:var(--chartPadding);display:-ms-flexbox;display:flex;postion:relative}:host .component-wrapper.bar6 .tick,wm-chart .component-wrapper.bar6 .tick,:host .component-wrapper.bar7 .tick,wm-chart .component-wrapper.bar7 .tick{-ms-flex:1;flex:1;text-align:right}:host .component-wrapper.bar6 .tick span,wm-chart .component-wrapper.bar6 .tick span,:host .component-wrapper.bar7 .tick span,wm-chart .component-wrapper.bar7 .tick span{-webkit-transform:translateX(50%);transform:translateX(50%);display:inline-block}:host .component-wrapper.bar6 .zero,wm-chart .component-wrapper.bar6 .zero,:host .component-wrapper.bar7 .zero,wm-chart .component-wrapper.bar7 .zero{position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%)}:host .component-wrapper.bar6 .bar:active,wm-chart .component-wrapper.bar6 .bar:active,:host .component-wrapper.bar6 .bar:hover,wm-chart .component-wrapper.bar6 .bar:hover,:host .component-wrapper.bar6 .bar:focus,wm-chart .component-wrapper.bar6 .bar:focus,:host .component-wrapper.bar7 .bar:active,wm-chart .component-wrapper.bar7 .bar:active,:host .component-wrapper.bar7 .bar:hover,wm-chart .component-wrapper.bar7 .bar:hover,:host .component-wrapper.bar7 .bar:focus,wm-chart .component-wrapper.bar7 .bar:focus{outline:none}:host .component-wrapper.bar6 .bar:active.bar,wm-chart .component-wrapper.bar6 .bar:active.bar,:host .component-wrapper.bar6 .bar:hover.bar,wm-chart .component-wrapper.bar6 .bar:hover.bar,:host .component-wrapper.bar6 .bar:focus.bar,wm-chart .component-wrapper.bar6 .bar:focus.bar,:host .component-wrapper.bar7 .bar:active.bar,wm-chart .component-wrapper.bar7 .bar:active.bar,:host .component-wrapper.bar7 .bar:hover.bar,wm-chart .component-wrapper.bar7 .bar:hover.bar,:host .component-wrapper.bar7 .bar:focus.bar,wm-chart .component-wrapper.bar7 .bar:focus.bar{-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper.left-label,wm-chart .component-wrapper.left-label{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.left-label .label,wm-chart .component-wrapper.left-label .label{width:12rem;padding-right:1.25rem;-ms-flex:none;flex:none;-ms-flex-item-align:end;align-self:flex-end;min-height:30px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .component-wrapper .hidden-values-warning,wm-chart .component-wrapper .hidden-values-warning{font-size:0.75rem;font-style:italic;max-width:100%}:host #chart-instructions,wm-chart #chart-instructions{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper .legend-wrapper,wm-chart .component-wrapper .legend-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-align:center}:host .component-wrapper .legend-wrapper .legend,wm-chart .component-wrapper .legend-wrapper .legend{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;text-align:center;padding-top:0.25rem;padding-bottom:0.75rem;-webkit-box-sizing:border-box;box-sizing:border-box}:host .component-wrapper .legend-wrapper .legend.bar1,wm-chart .component-wrapper .legend-wrapper .legend.bar1,:host .component-wrapper .legend-wrapper .legend.bar6,wm-chart .component-wrapper .legend-wrapper .legend.bar6{display:none}:host .component-wrapper .legend-wrapper .legend.--top,wm-chart .component-wrapper .legend-wrapper .legend.--top{margin-top:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-item,wm-chart .component-wrapper .legend-wrapper .legend.--top .legend-item{padding-top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-color,wm-chart .component-wrapper .legend-wrapper .legend.--top .legend-color{top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom,wm-chart .component-wrapper .legend-wrapper .legend.--bottom{margin-bottom:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-item,wm-chart .component-wrapper .legend-wrapper .legend.--bottom .legend-item{padding-bottom:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-color,wm-chart .component-wrapper .legend-wrapper .legend.--bottom .legend-color{top:-0.75rem}:host .component-wrapper .legend-wrapper .legend .legend-item,wm-chart .component-wrapper .legend-wrapper .legend .legend-item{position:relative}:host .component-wrapper .legend-wrapper .legend .legend-item:not(:last-of-type),wm-chart .component-wrapper .legend-wrapper .legend .legend-item:not(:last-of-type){padding-right:1.25rem}:host .component-wrapper .legend-wrapper .legend .legend-text,wm-chart .component-wrapper .legend-wrapper .legend .legend-text{font-size:0.875rem;padding-left:1rem;line-height:1}:host .component-wrapper .legend-wrapper .legend .legend-color,wm-chart .component-wrapper .legend-wrapper .legend .legend-color{position:absolute;left:0;bottom:0;margin:auto;width:0.6875rem;height:0.6875rem}:host .component-wrapper .legend-wrapper .legend.bar3,wm-chart .component-wrapper .legend-wrapper .legend.bar3{padding-bottom:1.25rem}:host(:focus){outline:none}:host(:focus) .component-wrapper.user-is-tabbing .stacked-bar-segments-wrapper,:host(:focus) .component-wrapper.user-is-tabbing .simple-bar-wrapper,:host(:focus) .component-wrapper.user-is-tabbing .doughnut-wrapper{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host(:focus) .component-wrapper.user-is-tabbing .stacked-bar-segments-wrapper::-moz-focus-inner,:host(:focus) .component-wrapper.user-is-tabbing .simple-bar-wrapper::-moz-focus-inner,:host(:focus) .component-wrapper.user-is-tabbing .doughnut-wrapper::-moz-focus-inner{border:0}";const v=class{constructor(t){e(this,t);this.uid=o();this.slicesDetails=[];this.handleStackedBarResize=n((async()=>{let e=false;const r=this.el.shadowRoot.querySelectorAll(".value");if(r.length){let t=r.length?r[0].getBoundingClientRect().right:0;let a=4;r.forEach(((r,p)=>{if(p>0){const p=r.getBoundingClientRect();if(p.left-a<t){r.classList.add("hidden");e=true}else{r.classList.remove("hidden");t=p.right}}}))}this.hasHiddenBarValue=e}),100);this.debouncedUpdate=n((async()=>{r(this.el)}),10);this.debouncedSliceUpdate=n((async()=>{await c.call(this,this.currentChartType);r(this.el)}),100);this.chartType="doughnut1";this.label=undefined;this.labelWidth="150px";this.subinfo=undefined;this.completionMessage=undefined;this.valueFormat=undefined;this.showValues=undefined;this.showGrid=true;this.showLegend=true;this.showBarLegend=false;this.notStartedColor=false;this.labelPosition="top";this.isTabbing=false;this.userIsNavigating=false;this.hasHiddenBarValue=false}get tempValueFormat(){return this.valueFormat||this.showValues||"none"}get hybridType(){return window.innerWidth>1340?"doughnut0":"bar1"}get popoverEl(){return this.el.shadowRoot.querySelector("priv-chart-popover")}get sliceEls(){return Array.from(this.el.shadowRoot.querySelectorAll(".segment"))}get currentChartType(){let e=this.chartType;if(this.chartType==="hybrid"){e=this.hybridType}else if(this.chartType==="doughnut2"&&this.el.children.length>3){e="doughnut2plus"}return e}get chartDetails(){return m[this.currentChartType]}get ariaLabelText(){let e=`${this.label}`;if(this.subinfo){e+=` ${this.subinfo}`}return e}get isDoughnut(){return this.chartDetails.category==="doughnut"}get isStackedBar(){return this.chartDetails.category==="stackedBar"}get isSimpleBar(){return this.chartDetails.category==="simpleBar"}get isBar(){return this.isStackedBar||this.isSimpleBar}get chartRoleDescription(){return s.formatMessage({id:"chart.roleDescription",defaultMessage:"Interactive chart",description:"For screen readers only, a description clarifying the role of the chart widget"})}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleKeydown(e){i.call(this,e)}async componentWillLoad(){if(!this.label){throw new Error("For accessibility purposes, you must provide a label for the chart. See https://components.watermarkinsights.com/chart for more information.")}if(this.showValues){console.warn("wm-chart: show-values has been deprecated as of v3.1.0. Please use value-format instead.")}await c.call(this,this.currentChartType);if(this.chartType==="hybrid"||!this.isDoughnut){const e=new ResizeObserver((()=>{this.isStackedBar?this.handleStackedBarResize():this.debouncedUpdate()}));e.observe(this.el)}}handleSliceUpdate(){this.debouncedSliceUpdate()}renderBarText(e,r){let a;if(this.tempValueFormat==="percentage"){a=e.perc===0&&e.amount>0?"<1%":`${e.perc}%`}else if(this.tempValueFormat==="amount"){a=e.amount}return t("div",{class:"value-wrapper",style:{width:`calc(${w(e.amount,this.total,false)}%\n        ${r!==this.slicesDetails.length-1?" - 2px":""}`}},t("span",{class:"value"},e.amount>0&&a))}drawAxis(){if(this.currentChartType==="bar3"){return t("svg",{class:"axis"},t("line",{x1:"0",x2:"100%",y1:"0",y2:"0"}),t("line",{x1:"0",x2:"0",y1:"0",y2:"-85px"}),t("line",{class:"tick",x1:"0.5",x2:"0.5",y1:"0",y2:"6"}),t("text",{x:"0.5",y:"-6"},"0%"),t("line",{class:"tick",x1:"100%",x2:"100%",y1:"0",y2:"6"}),t("text",{x:"100%",y:"-6"},"100%"))}}renderChart(){if(this.total>0){if(this.isStackedBar){return h.call(this,this.currentChartType)}else if(this.isSimpleBar){return l.call(this,this.currentChartType)}else if(this.isDoughnut){return b.call(this,this.currentChartType)}}}render(){return t(a,{onBlur:()=>f.call(this)},t("div",{ref:e=>this.componentWrapperEl=e,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":this.chartRoleDescription,"aria-describedby":"chart-instructions"},t("label",{class:"label",id:`label-${this.uid}`,htmlFor:`graphic-${this.uid}`},t("span",{class:"label-text"},this.label),this.subinfo?t("span",{class:"subinfo"},this.subinfo):""),this.isBar&&g.call(this,this.currentChartType),this.renderChart(),this.isDoughnut&&g.call(this,this.currentChartType),t("priv-chart-popover",{class:this.isTabbing?"user-is-tabbing":""}),this.currentChartType==="doughnut0"?u.call(this):"",this.hasHiddenBarValue&&x()),d())}static get delegatesFocus(){return true}get el(){return p(this)}};v.style=k;export{v as wm_chart};
-//# sourceMappingURL=p-8eebf787.entry.js.map
+import{r as e,f as r,h as t,H as a,g as p}from"./p-1c23de4a.js";import{g as o,d as n,i as s}from"./p-c6a0f7e5.js";import{g as c,a as m,h as i,b as w,r as h,c as l,d as b,e as d,f as g,i as u,j as x,k as f}from"./p-994303f2.js";const k=":host,wm-chart{display:block}:host .component-wrapper,wm-chart .component-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;font-size:0.875rem;position:relative;outline:none;}:host .component-wrapper .label,wm-chart .component-wrapper .label{display:block;margin:0;padding-bottom:0.25rem;font-weight:500;position:relative}:host .component-wrapper .label .subinfo,wm-chart .component-wrapper .label .subinfo{display:block;font-weight:normal;font-style:italic;bottom:0.25rem;width:100%;color:#6b6b6b}:host .component-wrapper .label.custom-width,wm-chart .component-wrapper .label.custom-width{width:var(--custom-label-width)}:host .component-wrapper .doughnut-svg,wm-chart .component-wrapper .doughnut-svg,:host .component-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper .inner-stacked-bar-wrapper{overflow:visible}:host .component-wrapper .bar-wrapper,wm-chart .component-wrapper .bar-wrapper{-ms-flex-positive:1;flex-grow:1;width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper{width:100%}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .values,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .values{display:-ms-flexbox;display:flex}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper{display:-ms-flexbox;display:flex}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment,wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment{height:30px;cursor:pointer}:host .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment:not(.zero):not(:last-of-type),wm-chart .component-wrapper .bar-wrapper .inner-stacked-bar-wrapper .stacked-bar-segments-wrapper .stacked-bar-segment:not(.zero):not(:last-of-type){margin-right:2px}:host .component-wrapper .doughnut-wrapper,wm-chart .component-wrapper .doughnut-wrapper{-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px}:host .component-wrapper .doughnut-wrapper .doughnut-segment,wm-chart .component-wrapper .doughnut-wrapper .doughnut-segment{cursor:pointer}:host .component-wrapper .value-wrapper,wm-chart .component-wrapper .value-wrapper{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}:host .component-wrapper .value-wrapper:not(:last-of-type),wm-chart .component-wrapper .value-wrapper:not(:last-of-type){margin-right:2px}:host .component-wrapper .value-wrapper .value.hidden,wm-chart .component-wrapper .value-wrapper .value.hidden{visibility:hidden}:host .component-wrapper path:active,wm-chart .component-wrapper path:active,:host .component-wrapper path:hover,wm-chart .component-wrapper path:hover,:host .component-wrapper path:focus,wm-chart .component-wrapper path:focus,:host .component-wrapper .stacked-bar-segment:active,wm-chart .component-wrapper .stacked-bar-segment:active,:host .component-wrapper .stacked-bar-segment:hover,wm-chart .component-wrapper .stacked-bar-segment:hover,:host .component-wrapper .stacked-bar-segment:focus,wm-chart .component-wrapper .stacked-bar-segment:focus{outline:none}:host .component-wrapper .stacked-bar-segment:active.stacked-bar-segment,wm-chart .component-wrapper .stacked-bar-segment:active.stacked-bar-segment,:host .component-wrapper .stacked-bar-segment:hover.stacked-bar-segment,wm-chart .component-wrapper .stacked-bar-segment:hover.stacked-bar-segment,:host .component-wrapper .stacked-bar-segment:focus.stacked-bar-segment,wm-chart .component-wrapper .stacked-bar-segment:focus.stacked-bar-segment{-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper path:active.doughnut-segment,wm-chart .component-wrapper path:active.doughnut-segment,:host .component-wrapper path:hover.doughnut-segment,wm-chart .component-wrapper path:hover.doughnut-segment,:host .component-wrapper path:focus.doughnut-segment,wm-chart .component-wrapper path:focus.doughnut-segment,:host .component-wrapper .stacked-bar-segment:active.doughnut-segment,wm-chart .component-wrapper .stacked-bar-segment:active.doughnut-segment,:host .component-wrapper .stacked-bar-segment:hover.doughnut-segment,wm-chart .component-wrapper .stacked-bar-segment:hover.doughnut-segment,:host .component-wrapper .stacked-bar-segment:focus.doughnut-segment,wm-chart .component-wrapper .stacked-bar-segment:focus.doughnut-segment{-webkit-filter:url(#wmHoverDropShadow);filter:url(#wmHoverDropShadow)}:host .component-wrapper path::-moz-focus-inner,wm-chart .component-wrapper path::-moz-focus-inner,:host .component-wrapper .stacked-bar-segment::-moz-focus-inner,wm-chart .component-wrapper .stacked-bar-segment::-moz-focus-inner{border:0;outline:none}:host .component-wrapper.doughnut,wm-chart .component-wrapper.doughnut{width:300px}:host .component-wrapper.doughnut1 label,wm-chart .component-wrapper.doughnut1 label,:host .component-wrapper.doughnut1 .label-text,wm-chart .component-wrapper.doughnut1 .label-text,:host .component-wrapper.doughnut2 label,wm-chart .component-wrapper.doughnut2 label,:host .component-wrapper.doughnut2 .label-text,wm-chart .component-wrapper.doughnut2 .label-text,:host .component-wrapper.doughnut2plus label,wm-chart .component-wrapper.doughnut2plus label,:host .component-wrapper.doughnut2plus .label-text,wm-chart .component-wrapper.doughnut2plus .label-text,:host .component-wrapper.doughnut3 label,wm-chart .component-wrapper.doughnut3 label,:host .component-wrapper.doughnut3 .label-text,wm-chart .component-wrapper.doughnut3 .label-text{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper.doughnut0,wm-chart .component-wrapper.doughnut0,:host .component-wrapper.doughnut,wm-chart .component-wrapper.doughnut{-ms-flex-align:center;align-items:center}:host .component-wrapper.doughnut0 label,wm-chart .component-wrapper.doughnut0 label,:host .component-wrapper.doughnut label,wm-chart .component-wrapper.doughnut label{text-align:center;width:100%;padding-bottom:1.5rem}:host .component-wrapper.doughnut0 label .subinfo,wm-chart .component-wrapper.doughnut0 label .subinfo,:host .component-wrapper.doughnut label .subinfo,wm-chart .component-wrapper.doughnut label .subinfo{position:absolute}:host .component-wrapper.doughnut0 .completion-message,wm-chart .component-wrapper.doughnut0 .completion-message,:host .component-wrapper.doughnut .completion-message,wm-chart .component-wrapper.doughnut .completion-message{padding-top:0.625rem}:host .component-wrapper.bar1,wm-chart .component-wrapper.bar1,:host .component-wrapper.bar,wm-chart .component-wrapper.bar{padding:1.25rem;-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar1 label,wm-chart .component-wrapper.bar1 label,:host .component-wrapper.bar label,wm-chart .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .component-wrapper.bar1 label .subinfo,wm-chart .component-wrapper.bar1 label .subinfo,:host .component-wrapper.bar label .subinfo,wm-chart .component-wrapper.bar label .subinfo{position:initial}:host .component-wrapper.bar1 .chart-wrapper,wm-chart .component-wrapper.bar1 .chart-wrapper,:host .component-wrapper.bar .chart-wrapper,wm-chart .component-wrapper.bar .chart-wrapper{display:-ms-flexbox;display:flex}:host .component-wrapper.bar1 .chart-wrapper .single-perc,wm-chart .component-wrapper.bar1 .chart-wrapper .single-perc,:host .component-wrapper.bar .chart-wrapper .single-perc,wm-chart .component-wrapper.bar .chart-wrapper .single-perc{width:4rem;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;height:30px;-ms-flex-align:center;align-items:center}:host .component-wrapper.bar1 .chart-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar1 .chart-wrapper .inner-stacked-bar-wrapper,:host .component-wrapper.bar .chart-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar .chart-wrapper .inner-stacked-bar-wrapper{-ms-flex:1;flex:1}:host .component-wrapper.bar1 .chart-wrapper .completion-message,wm-chart .component-wrapper.bar1 .chart-wrapper .completion-message,:host .component-wrapper.bar .chart-wrapper .completion-message,wm-chart .component-wrapper.bar .chart-wrapper .completion-message{width:100%;text-align:right;margin-top:0.25rem}@media screen and (min-width: 768px){:host .component-wrapper.bar1,wm-chart .component-wrapper.bar1,:host .component-wrapper.bar,wm-chart .component-wrapper.bar{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.bar1 label,wm-chart .component-wrapper.bar1 label,:host .component-wrapper.bar label,wm-chart .component-wrapper.bar label{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;min-height:30px;width:12rem;text-align:left;padding-right:1.25rem;padding-bottom:0;-ms-flex:none;flex:none}:host .component-wrapper.bar1 .bar-wrapper,wm-chart .component-wrapper.bar1 .bar-wrapper,:host .component-wrapper.bar .bar-wrapper,wm-chart .component-wrapper.bar .bar-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host .component-wrapper.bar1 .bar-wrapper .single-perc,wm-chart .component-wrapper.bar1 .bar-wrapper .single-perc,:host .component-wrapper.bar .bar-wrapper .single-perc,wm-chart .component-wrapper.bar .bar-wrapper .single-perc{text-align:center;padding-left:0.5rem;-ms-flex-pack:center;justify-content:center}}:host .component-wrapper.bar2,wm-chart .component-wrapper.bar2,:host .component-wrapper.bar3,wm-chart .component-wrapper.bar3,:host .component-wrapper.bar4,wm-chart .component-wrapper.bar4,:host .component-wrapper.bar5,wm-chart .component-wrapper.bar5{-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar2 .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar2 .inner-stacked-bar-wrapper,:host .component-wrapper.bar4 .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar4 .inner-stacked-bar-wrapper,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar5 .inner-stacked-bar-wrapper{height:30px;margin-bottom:0}:host .component-wrapper.bar2 .inner-stacked-bar-wrapper.show-values,wm-chart .component-wrapper.bar2 .inner-stacked-bar-wrapper.show-values,:host .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values,wm-chart .component-wrapper.bar4 .inner-stacked-bar-wrapper.show-values,:host .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values,wm-chart .component-wrapper.bar5 .inner-stacked-bar-wrapper.show-values{height:60px;margin-top:0}:host .component-wrapper.bar3 .chart-wrapper,wm-chart .component-wrapper.bar3 .chart-wrapper{position:relative;height:100px}:host .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper,wm-chart .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper{position:absolute;top:35px;left:0;right:0;bottom:0;height:30px}:host .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper text,wm-chart .component-wrapper.bar3 .chart-wrapper .inner-stacked-bar-wrapper text{fill:#4a4a4a}:host .component-wrapper.bar3 .chart-wrapper .axis,wm-chart .component-wrapper.bar3 .chart-wrapper .axis{position:absolute;top:0;left:0;height:90px;width:100%;overflow:visible;-webkit-transform:translateY(90px);transform:translateY(90px)}:host .component-wrapper.bar3 .chart-wrapper .axis line,wm-chart .component-wrapper.bar3 .chart-wrapper .axis line{stroke:#eeedf4;stroke-width:1px}:host .component-wrapper.bar3 .chart-wrapper .axis text,wm-chart .component-wrapper.bar3 .chart-wrapper .axis text{-webkit-transform:translate(4px, 24px);transform:translate(4px, 24px);text-anchor:middle}:host .component-wrapper.bar3 .hidden-values-warning,wm-chart .component-wrapper.bar3 .hidden-values-warning{margin-top:1.25rem}:host .component-wrapper.bar6,wm-chart .component-wrapper.bar6,:host .component-wrapper.bar7,wm-chart .component-wrapper.bar7{--chartPadding:48px;-ms-flex-align:start;align-items:flex-start}:host .component-wrapper.bar6 .chart-wrapper,wm-chart .component-wrapper.bar6 .chart-wrapper,:host .component-wrapper.bar7 .chart-wrapper,wm-chart .component-wrapper.bar7 .chart-wrapper{width:100%}:host .component-wrapper.bar6 .chart,wm-chart .component-wrapper.bar6 .chart,:host .component-wrapper.bar7 .chart,wm-chart .component-wrapper.bar7 .chart{position:relative;padding-right:var(--chartPadding)}:host .component-wrapper.bar6 .gridlines,wm-chart .component-wrapper.bar6 .gridlines,:host .component-wrapper.bar7 .gridlines,wm-chart .component-wrapper.bar7 .gridlines{position:absolute;left:var(--labelWidth);right:var(--chartPadding);top:0;bottom:0;background-image:linear-gradient(90deg, #8f8f8f 1px, transparent 1px);background-position:-1px;border-left:1px solid #8f8f8f;border-bottom:1px solid #8f8f8f;background-size:var(--backgroundSize)}:host .component-wrapper.bar6 .rows,wm-chart .component-wrapper.bar6 .rows,:host .component-wrapper.bar7 .rows,wm-chart .component-wrapper.bar7 .rows{display:grid;grid-template-columns:var(--labelWidth) auto;grid-auto-rows:minmax(30px, 1fr);-ms-flex-align:center;align-items:center;position:relative;z-index:1}:host .component-wrapper.bar6 .rows .label,wm-chart .component-wrapper.bar6 .rows .label,:host .component-wrapper.bar7 .rows .label,wm-chart .component-wrapper.bar7 .rows .label{font-weight:400;padding:0 0.75rem 0 0;text-align:right;margin:0.75rem 0}:host .component-wrapper.bar6 .rows .label.hidden,wm-chart .component-wrapper.bar6 .rows .label.hidden,:host .component-wrapper.bar7 .rows .label.hidden,wm-chart .component-wrapper.bar7 .rows .label.hidden{visibility:hidden;white-space:nowrap}:host .component-wrapper.bar6 .bar,wm-chart .component-wrapper.bar6 .bar,:host .component-wrapper.bar7 .bar,wm-chart .component-wrapper.bar7 .bar{height:30px;position:relative}:host .component-wrapper.bar6 .bar .value,wm-chart .component-wrapper.bar6 .bar .value,:host .component-wrapper.bar7 .bar .value,wm-chart .component-wrapper.bar7 .bar .value{position:absolute;top:50%;right:-0.5rem;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host .component-wrapper.bar6 .x-axis,wm-chart .component-wrapper.bar6 .x-axis,:host .component-wrapper.bar7 .x-axis,wm-chart .component-wrapper.bar7 .x-axis{margin-left:var(--labelWidth);margin-right:var(--chartPadding);display:-ms-flexbox;display:flex;postion:relative}:host .component-wrapper.bar6 .tick,wm-chart .component-wrapper.bar6 .tick,:host .component-wrapper.bar7 .tick,wm-chart .component-wrapper.bar7 .tick{-ms-flex:1;flex:1;text-align:right}:host .component-wrapper.bar6 .tick span,wm-chart .component-wrapper.bar6 .tick span,:host .component-wrapper.bar7 .tick span,wm-chart .component-wrapper.bar7 .tick span{-webkit-transform:translateX(50%);transform:translateX(50%);display:inline-block}:host .component-wrapper.bar6 .zero,wm-chart .component-wrapper.bar6 .zero,:host .component-wrapper.bar7 .zero,wm-chart .component-wrapper.bar7 .zero{position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%)}:host .component-wrapper.bar6 .bar:active,wm-chart .component-wrapper.bar6 .bar:active,:host .component-wrapper.bar6 .bar:hover,wm-chart .component-wrapper.bar6 .bar:hover,:host .component-wrapper.bar6 .bar:focus,wm-chart .component-wrapper.bar6 .bar:focus,:host .component-wrapper.bar7 .bar:active,wm-chart .component-wrapper.bar7 .bar:active,:host .component-wrapper.bar7 .bar:hover,wm-chart .component-wrapper.bar7 .bar:hover,:host .component-wrapper.bar7 .bar:focus,wm-chart .component-wrapper.bar7 .bar:focus{outline:none}:host .component-wrapper.bar6 .bar:active.bar,wm-chart .component-wrapper.bar6 .bar:active.bar,:host .component-wrapper.bar6 .bar:hover.bar,wm-chart .component-wrapper.bar6 .bar:hover.bar,:host .component-wrapper.bar6 .bar:focus.bar,wm-chart .component-wrapper.bar6 .bar:focus.bar,:host .component-wrapper.bar7 .bar:active.bar,wm-chart .component-wrapper.bar7 .bar:active.bar,:host .component-wrapper.bar7 .bar:hover.bar,wm-chart .component-wrapper.bar7 .bar:hover.bar,:host .component-wrapper.bar7 .bar:focus.bar,wm-chart .component-wrapper.bar7 .bar:focus.bar{-webkit-box-shadow:0px 0px 6px #333;-moz-box-shadow:0px 0px 6px #333;box-shadow:0px 0px 6px #333}:host .component-wrapper.left-label,wm-chart .component-wrapper.left-label{-ms-flex-direction:row;flex-direction:row}:host .component-wrapper.left-label .label,wm-chart .component-wrapper.left-label .label{width:12rem;padding-right:1.25rem;-ms-flex:none;flex:none;-ms-flex-item-align:end;align-self:flex-end;min-height:30px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .component-wrapper .hidden-values-warning,wm-chart .component-wrapper .hidden-values-warning{font-size:0.75rem;font-style:italic;max-width:100%}:host #chart-instructions,wm-chart #chart-instructions{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}:host .component-wrapper .legend-wrapper,wm-chart .component-wrapper .legend-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;text-align:center}:host .component-wrapper .legend-wrapper .legend,wm-chart .component-wrapper .legend-wrapper .legend{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;text-align:center;padding-top:0.25rem;padding-bottom:0.75rem;-webkit-box-sizing:border-box;box-sizing:border-box}:host .component-wrapper .legend-wrapper .legend.bar1,wm-chart .component-wrapper .legend-wrapper .legend.bar1,:host .component-wrapper .legend-wrapper .legend.bar6,wm-chart .component-wrapper .legend-wrapper .legend.bar6{display:none}:host .component-wrapper .legend-wrapper .legend.--top,wm-chart .component-wrapper .legend-wrapper .legend.--top{margin-top:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-item,wm-chart .component-wrapper .legend-wrapper .legend.--top .legend-item{padding-top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--top .legend-color,wm-chart .component-wrapper .legend-wrapper .legend.--top .legend-color{top:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom,wm-chart .component-wrapper .legend-wrapper .legend.--bottom{margin-bottom:-0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-item,wm-chart .component-wrapper .legend-wrapper .legend.--bottom .legend-item{padding-bottom:0.75rem}:host .component-wrapper .legend-wrapper .legend.--bottom .legend-color,wm-chart .component-wrapper .legend-wrapper .legend.--bottom .legend-color{top:-0.75rem}:host .component-wrapper .legend-wrapper .legend .legend-item,wm-chart .component-wrapper .legend-wrapper .legend .legend-item{position:relative}:host .component-wrapper .legend-wrapper .legend .legend-item:not(:last-of-type),wm-chart .component-wrapper .legend-wrapper .legend .legend-item:not(:last-of-type){padding-right:1.25rem}:host .component-wrapper .legend-wrapper .legend .legend-text,wm-chart .component-wrapper .legend-wrapper .legend .legend-text{font-size:0.875rem;padding-left:1rem;line-height:1}:host .component-wrapper .legend-wrapper .legend .legend-color,wm-chart .component-wrapper .legend-wrapper .legend .legend-color{position:absolute;left:0;bottom:0;margin:auto;width:0.6875rem;height:0.6875rem}:host .component-wrapper .legend-wrapper .legend.bar3,wm-chart .component-wrapper .legend-wrapper .legend.bar3{padding-bottom:1.25rem}:host(:focus){outline:none}:host(:focus) .component-wrapper.user-is-tabbing .stacked-bar-segments-wrapper,:host(:focus) .component-wrapper.user-is-tabbing .simple-bar-wrapper,:host(:focus) .component-wrapper.user-is-tabbing .doughnut-wrapper{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host(:focus) .component-wrapper.user-is-tabbing .stacked-bar-segments-wrapper::-moz-focus-inner,:host(:focus) .component-wrapper.user-is-tabbing .simple-bar-wrapper::-moz-focus-inner,:host(:focus) .component-wrapper.user-is-tabbing .doughnut-wrapper::-moz-focus-inner{border:0}";const v=class{constructor(t){e(this,t);this.uid=o();this.slicesDetails=[];this.handleStackedBarResize=n((async()=>{let e=false;const r=this.el.shadowRoot.querySelectorAll(".value");if(r.length){let t=r.length?r[0].getBoundingClientRect().right:0;let a=4;r.forEach(((r,p)=>{if(p>0){const p=r.getBoundingClientRect();if(p.left-a<t){r.classList.add("hidden");e=true}else{r.classList.remove("hidden");t=p.right}}}))}this.hasHiddenBarValue=e}),100);this.debouncedUpdate=n((async()=>{r(this.el)}),10);this.debouncedSliceUpdate=n((async()=>{await c.call(this,this.currentChartType);r(this.el)}),100);this.chartType="doughnut1";this.label=undefined;this.labelWidth="150px";this.subinfo=undefined;this.completionMessage=undefined;this.valueFormat=undefined;this.showValues=undefined;this.showGrid=true;this.showLegend=true;this.showBarLegend=false;this.notStartedColor=false;this.labelPosition="top";this.isTabbing=false;this.userIsNavigating=false;this.hasHiddenBarValue=false}get tempValueFormat(){return this.valueFormat||this.showValues||"none"}get hybridType(){return window.innerWidth>1340?"doughnut0":"bar1"}get popoverEl(){return this.el.shadowRoot.querySelector("priv-chart-popover")}get sliceEls(){return Array.from(this.el.shadowRoot.querySelectorAll(".segment"))}get currentChartType(){let e=this.chartType;if(this.chartType==="hybrid"){e=this.hybridType}else if(this.chartType==="doughnut2"&&this.el.children.length>3){e="doughnut2plus"}return e}get chartDetails(){return m[this.currentChartType]}get ariaLabelText(){let e=`${this.label}`;if(this.subinfo){e+=` ${this.subinfo}`}return e}get isDoughnut(){return this.chartDetails.category==="doughnut"}get isStackedBar(){return this.chartDetails.category==="stackedBar"}get isSimpleBar(){return this.chartDetails.category==="simpleBar"}get isBar(){return this.isStackedBar||this.isSimpleBar}get chartRoleDescription(){return s.formatMessage({id:"chart.roleDescription",defaultMessage:"Interactive chart",description:"For screen readers only, a description clarifying the role of the chart widget"})}toggleTabbingOn(){this.isTabbing=true}toggleTabbingOff(){this.isTabbing=false}handleKeydown(e){i.call(this,e)}async componentWillLoad(){if(!this.label){throw new Error("For accessibility purposes, you must provide a label for the chart. See https://components.watermarkinsights.com/chart for more information.")}if(this.showValues){console.warn("wm-chart: show-values has been deprecated as of v3.1.0. Please use value-format instead.")}await c.call(this,this.currentChartType);if(this.chartType==="hybrid"||!this.isDoughnut){const e=new ResizeObserver((()=>{this.isStackedBar?this.handleStackedBarResize():this.debouncedUpdate()}));e.observe(this.el)}}handleSliceUpdate(){this.debouncedSliceUpdate()}renderBarText(e,r){let a;if(this.tempValueFormat==="percentage"){a=e.perc===0&&e.amount>0?"<1%":`${e.perc}%`}else if(this.tempValueFormat==="amount"){a=e.amount}return t("div",{class:"value-wrapper",style:{width:`calc(${w(e.amount,this.total,false)}%\n        ${r!==this.slicesDetails.length-1?" - 2px":""}`}},t("span",{class:"value"},e.amount>0&&a))}drawAxis(){if(this.currentChartType==="bar3"){return t("svg",{class:"axis"},t("line",{x1:"0",x2:"100%",y1:"0",y2:"0"}),t("line",{x1:"0",x2:"0",y1:"0",y2:"-85px"}),t("line",{class:"tick",x1:"0.5",x2:"0.5",y1:"0",y2:"6"}),t("text",{x:"0.5",y:"-6"},"0%"),t("line",{class:"tick",x1:"100%",x2:"100%",y1:"0",y2:"6"}),t("text",{x:"100%",y:"-6"},"100%"))}}renderChart(){if(this.total>0){if(this.isStackedBar){return h.call(this,this.currentChartType)}else if(this.isSimpleBar){return l.call(this,this.currentChartType)}else if(this.isDoughnut){return b.call(this,this.currentChartType)}}}render(){return t(a,{onBlur:()=>f.call(this)},t("div",{ref:e=>this.componentWrapperEl=e,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":this.chartRoleDescription,"aria-describedby":"chart-instructions"},t("label",{class:"label",id:`label-${this.uid}`,htmlFor:`graphic-${this.uid}`},t("span",{class:"label-text"},this.label),this.subinfo?t("span",{class:"subinfo"},this.subinfo):""),this.isBar&&g.call(this,this.currentChartType),this.renderChart(),this.isDoughnut&&g.call(this,this.currentChartType),t("priv-chart-popover",{class:this.isTabbing?"user-is-tabbing":""}),this.currentChartType==="doughnut0"?u.call(this):"",this.hasHiddenBarValue&&x()),d())}static get delegatesFocus(){return true}get el(){return p(this)}};v.style=k;export{v as wm_chart};
+//# sourceMappingURL=p-7e0e6b00.entry.js.map

package/dist/ripple/p-7e0e6b00.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmChartCss","Chart","this","uid","generateId","slicesDetails","handleStackedBarResize","debounce","async","hasHiddenBarValue","valueEls","el","shadowRoot","querySelectorAll","length","lastVisibleRightEdge","getBoundingClientRect","right","margin","forEach","valueEl","idx","bounds","left","classList","add","remove","debouncedUpdate","forceUpdate","debouncedSliceUpdate","getDetails","call","currentChartType","tempValueFormat","valueFormat","showValues","hybridType","window","innerWidth","popoverEl","querySelector","sliceEls","Array","from","current","chartType","children","chartDetails","allChartsDetails","ariaLabelText","text","label","subinfo","isDoughnut","category","isStackedBar","isSimpleBar","isBar","chartRoleDescription","intl","formatMessage","id","defaultMessage","description","toggleTabbingOn","isTabbing","toggleTabbingOff","handleKeydown","ev","handleChartKeydown","Error","console","warn","resizeObserver","ResizeObserver","observe","handleSliceUpdate","renderBarText","s","val","perc","amount","h","class","style","width","amountToPercent","total","drawAxis","x1","x2","y1","y2","x","y","renderChart","renderStackedBar","renderSimpleBar","renderDoughnut","render","Host","onBlur","exitChart","ref","componentWrapperEl","userIsNavigating","labelPosition","role","tabindex","htmlFor","renderLegend","renderCompletionMessage","renderHiddenValuesMessage","renderInstructionsText"],"sources":["./src/components/charts/wm-chart/wm-chart.scss?tag=wm-chart&encapsulation=shadow","./src/components/charts/wm-chart/wm-chart.tsx"],"sourcesContent":[":host,\nwm-chart {\n  @extend %chart-styles;\n}\n\n:host(:focus) {\n  @extend %chart-focus-styles;\n}\n","import { Component, Element, h, Host, Prop, State, Listen } from \"@stencil/core\";\nimport { forceUpdate } from \"@stencil/core\";\nimport { debounce, generateId, intl } from \"../../../global/functions\";\nimport {\n  amountToPercent,\n  exitChart,\n  getDetails,\n  handleChartKeydown,\n  renderStackedBar,\n  renderSimpleBar,\n  renderCompletionMessage,\n  renderDoughnut,\n  renderHiddenValuesMessage,\n  renderInstructionsText,\n  renderLegend,\n  allChartsDetails,\n} from \"../chartFunctions\";\nimport { ChartType, SliceDetails, SliceElement } from \"../../../global/interfaces\";\n\n@Component({\n  tag: \"wm-chart\",\n  shadow: { delegatesFocus: true },\n  styleUrl: \"wm-chart.scss\",\n})\nexport class Chart {\n  @Element() el!: HTMLWmChartElement;\n  // @ts-ignore-- TS warns this is unused, but its needed in chartFunctions\n  private componentWrapperEl!: HTMLDivElement;\n\n  @Prop() chartType: ChartType | \"hybrid\" = \"doughnut1\"; // hybrid is not a real ChartType, it gets converted to something else.\n  @Prop() label?: string;\n  @Prop() labelWidth: string = \"150px\";\n  @Prop() subinfo?: string;\n  @Prop() completionMessage?: string;\n  @Prop() valueFormat?: \"percentage\" | \"amount\";\n  @Prop() showValues?: \"percentage\" | \"amount\"; // DEPRECATED in favor of value-format\n  @Prop() showGrid?: boolean = true; \n  get tempValueFormat() {\n    // use of this getter should be replaced with dateFormat when showValues is fully phased out\n    return this.valueFormat || this.showValues || \"none\";\n  }\n  @Prop() showLegend: boolean = true;\n  @Prop() showBarLegend: boolean = false;\n  @Prop() notStartedColor: boolean = false;\n  // left labels are a temporary solution for the lack of a stacked bar chart and is undocumented\n  // it only works with bar4 and should be used without a legend\n  @Prop() labelPosition: \"left\" | \"top\" = \"top\";\n  @State() isTabbing: boolean = false;\n  @State() userIsNavigating: boolean = false;\n  @State() hasHiddenBarValue: boolean = false;\n\n  get hybridType(): \"doughnut0\" | \"bar1\" {\n    return window.innerWidth > 1340 ? \"doughnut0\" : \"bar1\";\n  }\n  private uid: string = generateId();\n  private total!: number;\n  private slicesDetails: SliceDetails[] = [];\n\n  get popoverEl() {\n    return this.el.shadowRoot!.querySelector(\"priv-chart-popover\");\n  }\n\n  get sliceEls(): SliceElement[] {\n    return Array.from(this.el.shadowRoot!.querySelectorAll(\".segment\"));\n  }\n\n  get currentChartType(): ChartType {\n    let current = this.chartType as ChartType;\n\n    if (this.chartType === \"hybrid\") {\n      current = this.hybridType;\n    } else if (this.chartType === \"doughnut2\" && this.el.children.length > 3) {\n      // render an internal type (that includes an additional color) if doughnut2 has more than 3 slices\n      current = \"doughnut2plus\";\n    }\n    return current; \n  }\n\n  get chartDetails() {\n    return allChartsDetails[this.currentChartType];\n  }\n\n  get ariaLabelText() {\n    let text = `${this.label}`;\n    if (this.subinfo) {\n      text += ` ${this.subinfo}`;\n    }\n    return text;\n  }\n\n  get isDoughnut() {\n    return this.chartDetails.category === \"doughnut\";\n  }\n\n  get isStackedBar() {\n    return this.chartDetails.category === \"stackedBar\";\n  }\n\n  get isSimpleBar() {\n    return this.chartDetails.category === \"simpleBar\";\n  }\n\n  get isBar() {\n    return this.isStackedBar || this.isSimpleBar;\n  }\n\n  get chartRoleDescription(): string {\n    return intl.formatMessage({\n      id: \"chart.roleDescription\",\n      defaultMessage: \"Interactive chart\",\n      description: \"For screen readers only, a description clarifying the role of the chart widget\",\n    });\n  }\n\n  @Listen(\"wmUserIsTabbing\", { target: \"window\" })\n  toggleTabbingOn() {\n    this.isTabbing = true;\n  }\n\n  @Listen(\"wmUserIsNotTabbing\", { target: \"window\" })\n  toggleTabbingOff() {\n    this.isTabbing = false;\n  }\n\n  @Listen(\"keydown\")\n  handleKeydown(ev: KeyboardEvent) {\n    handleChartKeydown.call(this, ev);\n  }\n\n  /* LIFECYCLE METHODS + EVENTS FROM THE CHILDREN */\n\n  async componentWillLoad() {\n    if (!this.label) {\n      throw new Error(\n        \"For accessibility purposes, you must provide a label for the chart. See https://components.watermarkinsights.com/chart for more information.\"\n      );\n    }\n    if (this.showValues) {\n      console.warn(\"wm-chart: show-values has been deprecated as of v3.1.0. Please use value-format instead.\");\n    }\n    await getDetails.call(this, this.currentChartType);\n\n    // rerender on resize\n    // unnecessary for doughnuts (except hybrid) as layout doesn't change\n    if (this.chartType === \"hybrid\" || !this.isDoughnut) {\n      const resizeObserver = new ResizeObserver(() => {\n        this.isStackedBar ? this.handleStackedBarResize() : this.debouncedUpdate();\n      });\n      resizeObserver.observe(this.el);\n    }\n  }\n\n  handleStackedBarResize = debounce(async () => {\n    let hasHiddenBarValue = false;\n\n    // if any value text overlaps with another, hide it and display warning\n    const valueEls = this.el.shadowRoot!.querySelectorAll(\".value\");\n\n    if (valueEls.length) {\n      let lastVisibleRightEdge = valueEls.length ? valueEls[0].getBoundingClientRect().right : 0;\n      let margin = 4;\n\n      valueEls.forEach((valueEl, idx) => {\n        // checks are to the left of each valueEl, so skip the first one\n        if (idx > 0) {\n          const bounds = valueEl.getBoundingClientRect();\n\n          if (bounds.left - margin < lastVisibleRightEdge) {\n            // left edge of current value is overlapping right edge of last visible value\n            valueEl.classList.add(\"hidden\");\n            hasHiddenBarValue = true;\n          } else {\n            valueEl.classList.remove(\"hidden\");\n            lastVisibleRightEdge = bounds.right;\n          }\n        }\n      });\n    }\n\n    this.hasHiddenBarValue = hasHiddenBarValue;\n  }, 100);\n\n  debouncedUpdate = debounce(async () => {\n    forceUpdate(this.el);\n  }, 10);\n\n  debouncedSliceUpdate = debounce(async () => {\n    await getDetails.call(this, this.currentChartType);\n    forceUpdate(this.el);\n  }, 100);\n\n  @Listen(\"wmChartSliceUpdated\")\n  handleSliceUpdate() {\n    this.debouncedSliceUpdate();\n  }\n\n  /* RENDERING */\n  renderBarText(s: SliceDetails, idx: number) {\n    let val;\n    if (this.tempValueFormat === \"percentage\") {\n      // if segment has an amount, but \"0\" percentage (it's below 0.5% and rounded down), still display it as <1%\n      val = s.perc === 0 && s.amount > 0 ? \"<1%\" : `${s.perc}%`;\n    } else if (this.tempValueFormat === \"amount\") {\n      val = s.amount;\n    }\n\n    // even though we do not display the value text if it has an amount of 0, we still want to render the value-wrapper\n    // in order to not disturb the positioning of the other value texts in the entire row\n    return (\n      <div\n        class=\"value-wrapper\"\n        style={{\n          width: `calc(${amountToPercent(s.amount, this.total, false)}%\n        ${idx !== this.slicesDetails.length - 1 ? \" - 2px\" : \"\"}`,\n        }}\n      >\n        <span class=\"value\">{s.amount > 0 && val}</span>\n      </div>\n    );\n  }\n\n  drawAxis() {\n    if (this.currentChartType === \"bar3\") {\n      return (\n        <svg class=\"axis\">\n          <line x1=\"0\" x2=\"100%\" y1=\"0\" y2=\"0\" />\n          <line x1=\"0\" x2=\"0\" y1=\"0\" y2=\"-85px\" />\n          <line class=\"tick\" x1=\"0.5\" x2=\"0.5\" y1=\"0\" y2=\"6\" />\n          <text x=\"0.5\" y=\"-6\">\n            0%\n          </text>\n          <line class=\"tick\" x1=\"100%\" x2=\"100%\" y1=\"0\" y2=\"6\" />\n          <text x=\"100%\" y=\"-6\">\n            100%\n          </text>\n        </svg>\n      );\n    }\n  }\n\n  renderChart() {\n    if (this.total > 0) {\n      if (this.isStackedBar) {\n        return renderStackedBar.call(this, this.currentChartType);\n      } else if (this.isSimpleBar) {\n        return renderSimpleBar.call(this, this.currentChartType);\n      } else if (this.isDoughnut) {\n        return renderDoughnut.call(this, this.currentChartType);\n      }\n    }\n  }\n\n  render() {\n    return (\n      <Host onBlur={() => exitChart.call(this)}>\n        <div\n          ref={(el) => (this.componentWrapperEl = el as HTMLDivElement)}\n          class={`component-wrapper ${this.currentChartType} ${\n            this.isTabbing && !this.userIsNavigating ? \"user-is-tabbing\" : \"\"\n          } ${this.labelPosition === \"left\" && this.currentChartType === \"bar4\" ? \"left-label\" : \"\"}`}\n          role=\"application\"\n          aria-label={this.ariaLabelText}\n          tabindex={0}\n          aria-roledescription={this.chartRoleDescription}\n          aria-describedby=\"chart-instructions\"\n        >\n          <label class=\"label\" id={`label-${this.uid}`} htmlFor={`graphic-${this.uid}`}>\n            <span class=\"label-text\">{this.label}</span>\n            {this.subinfo ? <span class=\"subinfo\">{this.subinfo}</span> : \"\"}\n          </label>\n          {this.isBar && renderLegend.call(this, this.currentChartType)}\n          {this.renderChart()}\n          {this.isDoughnut && renderLegend.call(this, this.currentChartType)}\n          <priv-chart-popover class={this.isTabbing ? \"user-is-tabbing\" : \"\"}></priv-chart-popover>\n          {this.currentChartType === \"doughnut0\" ? renderCompletionMessage.call(this) : \"\"}\n          {this.hasHiddenBarValue && renderHiddenValuesMessage()}\n        </div>\n        {renderInstructionsText()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/ripple/{p-0400599e.system.entry.js → p-833c622f.system.entry.js}

@@ -1,2 +1,2 @@
-System.register(["./p-7b2fc615.system.js","./p-bc28c815.system.js"],(function(t){"use strict";var e,i,n,a,o,r,s,l;return{setters:[function(t){e=t.r;i=t.c;n=t.h;a=t.H;o=t.g;r=t.f},function(t){s=t.d;l=t.g}],execute:function(){var b=":host{font-family:inherit;display:inline-block}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .tab-item{list-style-type:none;height:100%;display:inline-block}:host .tab-item .tab{-webkit-border-radius:0;-moz-border-radius:0;-ms-border-radius:0;border-radius:0;color:#575195;text-decoration:none;letter-spacing:0.7px;font-size:0.875rem;font-weight:500;opacity:1;position:relative;text-transform:uppercase;display:inline-block;height:3.3333333333em;line-height:3.3333333333em;padding-right:1.5rem;padding-left:1.5rem}:host .tab-item .tab[aria-selected=true]{font-weight:700;opacity:1;background:-webkit-gradient(linear, left top, left bottom, from(currentColor), to(currentColor)) bottom/0 0 no-repeat;background:linear-gradient(currentColor, currentColor) bottom/0 0 no-repeat;background-size:calc(100% - 50px) 3px}:host .tab-item .tab[aria-selected=true].dark{color:#fff}:host .tab-item .tab,:host .tab-item .tab:hover,:host .tab-item .tab:active{outline:none}:host .tab-item .tab:focus{outline:none}:host .tab-item .tab.dark:not([aria-selected=true]){opacity:0.8;color:#fff}:host .tab-item .tab.user-is-tabbing:focus:not(:active){outline:none;-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .tab-item .tab.user-is-tabbing:focus:not(:active)::-moz-focus-inner{border:0}:host .tab-item .tab.user-is-tabbing:focus:not(:active).dark{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;outline:none}:host.hide{display:none}";var c=t("wm_tab_item",function(){function t(t){var n=this;e(this,t);this.wmTabSelected=i(this,"wmTabSelected",7);this.tabSelected=i(this,"tabSelected",7);this.keydownOnTabItem=i(this,"keydownOnTabItem",7);this.tabItemLoaded=i(this,"tabItemLoaded",7);this.tabClicked=function(t){t.preventDefault();n.wmTabSelected.emit({tabId:n.tabId});n.tabSelected.emit({tabId:n.tabId})};this.tabPressed=function(t){var e=t.key;if(e==="Enter"||e===" "){t.preventDefault();n.wmTabSelected.emit({tabId:n.tabId});n.tabSelected.emit({tabId:n.tabId})}else if(e.includes("Arrow")){t.preventDefault();n.keydownOnTabItem.emit({tabItem:n.el,key:t.key})}};this.selected=false;this.show=true;this.tabId=""}Object.defineProperty(t.prototype,"parentTabList",{get:function(){return this.el.parentElement},enumerable:false,configurable:true});t.prototype.toggleTabbingOn=function(){this.linkEl&&this.linkEl.classList.add("user-is-tabbing")};t.prototype.toggleTabbingOff=function(){this.linkEl&&this.linkEl.classList.remove("user-is-tabbing")};t.prototype.componentDidLoad=function(){this.tabItemLoaded.emit()};t.prototype.render=function(){var t=this;var e=this.show?"":"hide ";e+=this.parentTabList&&this.parentTabList.customBackground=="dark"?"dark":"";var i={};var o=this.parentTabList&&this.parentTabList.customPadding;if(o){var r=parseInt(o,10)*2||0;var s=o.split(/([0-9]+)/).pop();i={"padding-left":this.parentTabList.customPadding,"padding-right":this.parentTabList.customPadding,"background-size":"calc(100% - ".concat(r).concat(s,") 3px")}}return n(a,{role:"presentation"},n("li",{class:"tab-item",role:"presentation"},n("a",{class:"tab ".concat(e),style:i,role:"tab",ref:function(e){return t.linkEl=e},onClick:this.tabClicked,id:"tab-link-".concat(this.tabId),onKeyDown:function(e){return t.tabPressed(e)},"aria-selected":this.selected?"true":"false",tabindex:this.selected?0:-1},n("slot",null))))};Object.defineProperty(t,"delegatesFocus",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});return t}());c.style=b;var u=":host,wm-tab-list{position:relative;white-space:nowrap;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;display:block}:host *,wm-tab-list *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .tabcontainer,wm-tab-list .tabcontainer{margin:0;margin-left:-24px;width:100%;height:4.0625rem;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;padding:0}:host .tabcontainer.dark,wm-tab-list .tabcontainer.dark{background:#353b48;margin:0}:host wm-select,wm-tab-list wm-select{padding:0.375rem 0}";var d=t("wm_tab_list",function(){function t(t){var n=this;e(this,t);this.wmTabSelected=i(this,"wmTabSelected",7);this.tabSelected=i(this,"tabSelected",7);this.debouncedSetLayout=s((function(){if(!n.listWidth){n.setListWidth()}r(n.el)}),250);this.customBackground=undefined;this.customPadding=undefined;this.selectedTab=undefined;this.controllerEnabled=false}Object.defineProperty(t.prototype,"menuLayout",{get:function(){if(this.listWidth){return this.el.offsetWidth<this.listWidth-24}else{return false}},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"tabItems",{get:function(){return Array.from(this.el.querySelectorAll("wm-tab-item"))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"selectedTabItem",{get:function(){return this.tabItems.filter((function(t){return t.selected}))[0]},enumerable:false,configurable:true});t.prototype.getLinkEl=function(t){return t.shadowRoot.querySelector("a")};Object.defineProperty(t.prototype,"panels",{get:function(){var t=Array.from(document.querySelectorAll("wm-tab-panel"));var e=this.tabItems.map((function(t){return t.tabId}));return t.filter((function(t){return e.includes(t.tabId)}))},enumerable:false,configurable:true});t.prototype.getPanel=function(t){return this.panels.find((function(e){return e.tabId===t}))};t.prototype.setListWidth=function(){var t=this.tabItems.reduce((function(t,e){return t+e.offsetWidth}),0);this.listWidth=t&&t>0?t:this.listWidth};t.prototype.setSelected=function(t){this.tabItems.map((function(e){return e.selected=e.tabId===t}));var e=this.panels.length===1&&this.tabItems.length>1;if(e){this.setAttributesOnPanel(this.panels[0],this.selectedTabItem);this.panels[0].active=true}else{this.panels.map((function(e){return e.active=e.tabId===t}))}};t.prototype.showItems=function(){this.tabItems.map((function(t){return t.show=true}))};t.prototype.hideItems=function(){this.tabItems.map((function(t){return t.show=false}))};t.prototype.componentWillLoad=function(){var t=this;this.el.focus=function(){t.selectedTabItem&&t.selectedTabItem.focus()}};t.prototype.componentDidLoad=function(){this.setLayout();var t=this.selectedTab||this.tabItems[0].tabId;this.setSelected(t)};t.prototype.tabItemLoaded=function(t){this.setAriaOnPanelAndTab(t.target)};t.prototype.setAriaOnPanelAndTab=function(t){var e=this.getPanel(t.tabId);if(!e){if(this.panels.length===1){this.setAttributesOnTab(t,this.panels[0])}}else{this.setAttributesOnPanel(e,t);this.setAttributesOnTab(t,e)}};t.prototype.setAttributesOnTab=function(t,e){var i=this.getLinkEl(t);if(i){i.setAttribute("aria-controls",e.id);i.setAttribute("href","#".concat(e.id))}};t.prototype.removeAttributesOnTab=function(t){var e=this.getLinkEl(t);if(e){e.removeAttribute("aria-controls");e.removeAttribute("href")}};t.prototype.setAttributesOnPanel=function(t,e){var i=this.getLinkEl(e);if(i){t.setAttribute("aria-labelledby",i.id);t.setAttribute("tab-id",e.tabId)}};t.prototype.handleTabSelected=function(t){if(this.controllerEnabled){this.setSelected(t.detail.tabId)}};t.prototype.handleKeydown=function(t){var e=t.detail.key;var i=this.tabItems.indexOf(t.detail.tabItem);if(e==="ArrowLeft"||e==="ArrowRight"){this.handleLeftRightArrow(i,e)}};t.prototype.handleLeftRightArrow=function(t,e){if(e){t=e==="ArrowLeft"?t-1:t+1}if(t<0){t=this.tabItems.length-1}else if(t===this.tabItems.length){t=0}var i=this.tabItems[t];this.getLinkEl(i).focus()};t.prototype.setLayout=function(){this.debouncedSetLayout()};t.prototype.renderMenuOrTabs=function(){if(this.menuLayout){this.hideItems();return n("wm-select",{label:"Tab Selection","label-position":"none"},this.renderOptions())}else{this.showItems();var t={};if(this.customPadding){t={"margin-left":"-"+this.customPadding}}return n("ul",{class:"tabcontainer ".concat(this.customBackground||""),style:t,role:"tablist"},n("slot",null))}};t.prototype.renderOptions=function(){var t=this;return this.tabItems.map((function(e){return n("wm-option",{id:"tab-link-".concat(e.tabId),selected:e.tabId===t.selectedTab,onClick:function(i){i.preventDefault();t.wmTabSelected.emit({tabId:e.tabId});t.tabSelected.emit({tabId:e.tabId})}},e.textContent)}))};t.prototype.render=function(){return n(a,{class:this.menuLayout?"menu":""},this.renderMenuOrTabs())};Object.defineProperty(t,"delegatesFocus",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{selectedTab:["setSelected"]}},enumerable:false,configurable:true});return t}());d.style=u;var p="wm-tab-panel{visibility:inherit}wm-tab-panel.tab-hidden{display:none}wm-tab-panel:active{outline:none}wm-tab-panel:focus{outline:none}wm-tab-panel.user-is-tabbing:focus{outline:-webkit-focus-ring-color auto 5px}";var h=t("wm_tab_panel",function(){function t(t){e(this,t);this.tabPanelLoaded=i(this,"tabPanelLoaded",7);this.active=false;this.tabId=""}t.prototype.componentWillLoad=function(){!this.el.id&&this.el.setAttribute("id",l())};t.prototype.componentDidLoad=function(){this.tabPanelLoaded.emit({tabId:this.tabId})};t.prototype.toggleTabbingOn=function(){this.el.classList.add("user-is-tabbing")};t.prototype.toggleTabbingOff=function(){this.el.classList.remove("user-is-tabbing")};t.prototype.render=function(){return n(a,{role:"tabpanel",class:{"tab-hidden":!this.active}})};Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});return t}());h.style=p}}}));
-//# sourceMappingURL=p-0400599e.system.entry.js.map
+System.register(["./p-7b2fc615.system.js","./p-f0fd8695.system.js"],(function(t){"use strict";var e,i,n,a,o,r,s,l;return{setters:[function(t){e=t.r;i=t.c;n=t.h;a=t.H;o=t.g;r=t.f},function(t){s=t.d;l=t.g}],execute:function(){var b=":host{font-family:inherit;display:inline-block}:host *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .tab-item{list-style-type:none;height:100%;display:inline-block}:host .tab-item .tab{-webkit-border-radius:0;-moz-border-radius:0;-ms-border-radius:0;border-radius:0;color:#575195;text-decoration:none;letter-spacing:0.7px;font-size:0.875rem;font-weight:500;opacity:1;position:relative;text-transform:uppercase;display:inline-block;height:3.3333333333em;line-height:3.3333333333em;padding-right:1.5rem;padding-left:1.5rem}:host .tab-item .tab[aria-selected=true]{font-weight:700;opacity:1;background:-webkit-gradient(linear, left top, left bottom, from(currentColor), to(currentColor)) bottom/0 0 no-repeat;background:linear-gradient(currentColor, currentColor) bottom/0 0 no-repeat;background-size:calc(100% - 50px) 3px}:host .tab-item .tab[aria-selected=true].dark{color:#fff}:host .tab-item .tab,:host .tab-item .tab:hover,:host .tab-item .tab:active{outline:none}:host .tab-item .tab:focus{outline:none}:host .tab-item .tab.dark:not([aria-selected=true]){opacity:0.8;color:#fff}:host .tab-item .tab.user-is-tabbing:focus:not(:active){outline:none;-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .tab-item .tab.user-is-tabbing:focus:not(:active)::-moz-focus-inner{border:0}:host .tab-item .tab.user-is-tabbing:focus:not(:active).dark{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;outline:none}:host.hide{display:none}";var c=t("wm_tab_item",function(){function t(t){var n=this;e(this,t);this.wmTabSelected=i(this,"wmTabSelected",7);this.tabSelected=i(this,"tabSelected",7);this.keydownOnTabItem=i(this,"keydownOnTabItem",7);this.tabItemLoaded=i(this,"tabItemLoaded",7);this.tabClicked=function(t){t.preventDefault();n.wmTabSelected.emit({tabId:n.tabId});n.tabSelected.emit({tabId:n.tabId})};this.tabPressed=function(t){var e=t.key;if(e==="Enter"||e===" "){t.preventDefault();n.wmTabSelected.emit({tabId:n.tabId});n.tabSelected.emit({tabId:n.tabId})}else if(e.includes("Arrow")){t.preventDefault();n.keydownOnTabItem.emit({tabItem:n.el,key:t.key})}};this.selected=false;this.show=true;this.tabId=""}Object.defineProperty(t.prototype,"parentTabList",{get:function(){return this.el.parentElement},enumerable:false,configurable:true});t.prototype.toggleTabbingOn=function(){this.linkEl&&this.linkEl.classList.add("user-is-tabbing")};t.prototype.toggleTabbingOff=function(){this.linkEl&&this.linkEl.classList.remove("user-is-tabbing")};t.prototype.componentDidLoad=function(){this.tabItemLoaded.emit()};t.prototype.render=function(){var t=this;var e=this.show?"":"hide ";e+=this.parentTabList&&this.parentTabList.customBackground=="dark"?"dark":"";var i={};var o=this.parentTabList&&this.parentTabList.customPadding;if(o){var r=parseInt(o,10)*2||0;var s=o.split(/([0-9]+)/).pop();i={"padding-left":this.parentTabList.customPadding,"padding-right":this.parentTabList.customPadding,"background-size":"calc(100% - ".concat(r).concat(s,") 3px")}}return n(a,{role:"presentation"},n("li",{class:"tab-item",role:"presentation"},n("a",{class:"tab ".concat(e),style:i,role:"tab",ref:function(e){return t.linkEl=e},onClick:this.tabClicked,id:"tab-link-".concat(this.tabId),onKeyDown:function(e){return t.tabPressed(e)},"aria-selected":this.selected?"true":"false",tabindex:this.selected?0:-1},n("slot",null))))};Object.defineProperty(t,"delegatesFocus",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});return t}());c.style=b;var d=":host,wm-tab-list{position:relative;white-space:nowrap;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;display:block}:host *,wm-tab-list *{-webkit-box-sizing:border-box;box-sizing:border-box}:host .tabcontainer,wm-tab-list .tabcontainer{margin:0;margin-left:-24px;width:100%;height:4.0625rem;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;padding:0}:host .tabcontainer.dark,wm-tab-list .tabcontainer.dark{background:#353b48;margin:0}:host wm-select,wm-tab-list wm-select{padding:0.375rem 0}";var u=t("wm_tab_list",function(){function t(t){var n=this;e(this,t);this.wmTabSelected=i(this,"wmTabSelected",7);this.tabSelected=i(this,"tabSelected",7);this.debouncedSetLayout=s((function(){if(!n.listWidth){n.setListWidth()}r(n.el)}),250);this.customBackground=undefined;this.customPadding=undefined;this.selectedTab=undefined;this.controllerEnabled=false}Object.defineProperty(t.prototype,"menuLayout",{get:function(){if(this.listWidth){return this.el.offsetWidth<this.listWidth-24}else{return false}},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"tabItems",{get:function(){return Array.from(this.el.querySelectorAll("wm-tab-item"))},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"selectedTabItem",{get:function(){return this.tabItems.filter((function(t){return t.selected}))[0]},enumerable:false,configurable:true});t.prototype.getLinkEl=function(t){return t.shadowRoot.querySelector("a")};Object.defineProperty(t.prototype,"panels",{get:function(){var t=Array.from(document.querySelectorAll("wm-tab-panel"));var e=this.tabItems.map((function(t){return t.tabId}));return t.filter((function(t){return e.includes(t.tabId)}))},enumerable:false,configurable:true});t.prototype.getPanel=function(t){return this.panels.find((function(e){return e.tabId===t}))};t.prototype.setListWidth=function(){var t=this.tabItems.reduce((function(t,e){return t+e.offsetWidth}),0);this.listWidth=t&&t>0?t:this.listWidth};t.prototype.setSelected=function(t){this.tabItems.map((function(e){return e.selected=e.tabId===t}));var e=this.panels.length===1&&this.tabItems.length>1;if(e){this.setAttributesOnPanel(this.panels[0],this.selectedTabItem);this.panels[0].active=true}else{this.panels.map((function(e){return e.active=e.tabId===t}))}};t.prototype.showItems=function(){this.tabItems.map((function(t){return t.show=true}))};t.prototype.hideItems=function(){this.tabItems.map((function(t){return t.show=false}))};t.prototype.componentWillLoad=function(){var t=this;this.el.focus=function(){t.selectedTabItem&&t.selectedTabItem.focus()}};t.prototype.componentDidLoad=function(){this.setLayout();var t=this.selectedTab||this.tabItems[0].tabId;this.setSelected(t)};t.prototype.tabItemLoaded=function(t){this.setAriaOnPanelAndTab(t.target)};t.prototype.setAriaOnPanelAndTab=function(t){var e=this.getPanel(t.tabId);if(!e){if(this.panels.length===1){this.setAttributesOnTab(t,this.panels[0])}}else{this.setAttributesOnPanel(e,t);this.setAttributesOnTab(t,e)}};t.prototype.setAttributesOnTab=function(t,e){var i=this.getLinkEl(t);if(i){i.setAttribute("aria-controls",e.id);i.setAttribute("href","#".concat(e.id))}};t.prototype.removeAttributesOnTab=function(t){var e=this.getLinkEl(t);if(e){e.removeAttribute("aria-controls");e.removeAttribute("href")}};t.prototype.setAttributesOnPanel=function(t,e){var i=this.getLinkEl(e);if(i){t.setAttribute("aria-labelledby",i.id);t.setAttribute("tab-id",e.tabId)}};t.prototype.handleTabSelected=function(t){if(this.controllerEnabled){this.setSelected(t.detail.tabId)}};t.prototype.handleKeydown=function(t){var e=t.detail.key;var i=this.tabItems.indexOf(t.detail.tabItem);if(e==="ArrowLeft"||e==="ArrowRight"){this.handleLeftRightArrow(i,e)}};t.prototype.handleLeftRightArrow=function(t,e){if(e){t=e==="ArrowLeft"?t-1:t+1}if(t<0){t=this.tabItems.length-1}else if(t===this.tabItems.length){t=0}var i=this.tabItems[t];this.getLinkEl(i).focus()};t.prototype.setLayout=function(){this.debouncedSetLayout()};t.prototype.renderMenuOrTabs=function(){if(this.menuLayout){this.hideItems();return n("wm-select",{label:"Tab Selection","label-position":"none"},this.renderOptions())}else{this.showItems();var t={};if(this.customPadding){t={"margin-left":"-"+this.customPadding}}return n("ul",{class:"tabcontainer ".concat(this.customBackground||""),style:t,role:"tablist"},n("slot",null))}};t.prototype.renderOptions=function(){var t=this;return this.tabItems.map((function(e){return n("wm-option",{id:"tab-link-".concat(e.tabId),selected:e.tabId===t.selectedTab,onClick:function(i){i.preventDefault();t.wmTabSelected.emit({tabId:e.tabId});t.tabSelected.emit({tabId:e.tabId})}},e.textContent)}))};t.prototype.render=function(){return n(a,{class:this.menuLayout?"menu":""},this.renderMenuOrTabs())};Object.defineProperty(t,"delegatesFocus",{get:function(){return true},enumerable:false,configurable:true});Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{selectedTab:["setSelected"]}},enumerable:false,configurable:true});return t}());u.style=d;var p="wm-tab-panel{visibility:inherit}wm-tab-panel.tab-hidden{display:none}wm-tab-panel:active{outline:none}wm-tab-panel:focus{outline:none}wm-tab-panel.user-is-tabbing:focus{outline:-webkit-focus-ring-color auto 5px}";var h=t("wm_tab_panel",function(){function t(t){e(this,t);this.tabPanelLoaded=i(this,"tabPanelLoaded",7);this.active=false;this.tabId=""}t.prototype.componentWillLoad=function(){!this.el.id&&this.el.setAttribute("id",l())};t.prototype.componentDidLoad=function(){this.tabPanelLoaded.emit({tabId:this.tabId})};t.prototype.toggleTabbingOn=function(){this.el.classList.add("user-is-tabbing")};t.prototype.toggleTabbingOff=function(){this.el.classList.remove("user-is-tabbing")};t.prototype.render=function(){return n(a,{role:"tabpanel",class:{"tab-hidden":!this.active}})};Object.defineProperty(t.prototype,"el",{get:function(){return o(this)},enumerable:false,configurable:true});return t}());h.style=p}}}));
+//# sourceMappingURL=p-833c622f.system.entry.js.map

package/dist/ripple/p-833c622f.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["wmTabItemCss","TabItem","exports","this","tabClicked","ev","preventDefault","_this","wmTabSelected","emit","tabId","tabSelected","tabPressed","key","includes","keydownOnTabItem","tabItem","el","Object","defineProperty","class_1","prototype","parentElement","toggleTabbingOn","linkEl","classList","add","toggleTabbingOff","remove","componentDidLoad","tabItemLoaded","render","classes","show","parentTabList","customBackground","styles","padding","customPadding","bkgSize","parseInt","units","split","pop","concat","h","Host","role","class","style","ref","onClick","id","onKeyDown","selected","tabindex","wmTabListCss","TabList","debouncedSetLayout","debounce","listWidth","setListWidth","forceUpdate","class_2","offsetWidth","Array","from","querySelectorAll","tabItems","filter","t","getLinkEl","tab","shadowRoot","querySelector","allPanels","document","tabIds","map","p","getPanel","panels","find","newCalc","reduce","sum","setSelected","singlePanel","length","setAttributesOnPanel","selectedTabItem","active","panel","showItems","hideItems","componentWillLoad","focus","setLayout","selectedTab","setAriaOnPanelAndTab","target","setAttributesOnTab","link","setAttribute","removeAttributesOnTab","removeAttribute","handleTabSelected","controllerEnabled","detail","handleKeydown","index","indexOf","handleLeftRightArrow","tabToFocus","renderMenuOrTabs","menuLayout","label","renderOptions","margins","textContent","wmTabPanelCss","TabPanel","class_3","generateId","tabPanelLoaded"],"sources":["src/components/wm-tabs/wm-tab-item/wm-tab-item.scss?tag=wm-tab-item&encapsulation=shadow","src/components/wm-tabs/wm-tab-item/wm-tab-item.tsx","src/components/wm-tabs/wm-tab-list/wm-tab-list.scss?tag=wm-tab-list&encapsulation=shadow","src/components/wm-tabs/wm-tab-list/wm-tab-list.tsx","src/components/wm-tabs/wm-tab-panel/wm-tab-panel.scss?tag=wm-tab-panel","src/components/wm-tabs/wm-tab-panel/wm-tab-panel.tsx"],"sourcesContent":[":host {\n  * {\n    box-sizing: border-box;\n  }\n  font-family: inherit;\n  display: inline-block;\n\n  .tab-item {\n    list-style-type: none;\n    height: 100%;\n    display: inline-block;\n\n    .tab {\n      @include border-radius(0);\n      color: $button-default-text;\n      text-decoration: none;\n      letter-spacing: 0.7px;\n      font-size: rem-calc(14);\n      font-weight: 500;\n      opacity: 1;\n      position: relative;\n      text-transform: uppercase;\n      display: inline-block;\n      height: calc(40 / 12 * 1em);\n      line-height: calc(40 / 12 * 1em);\n      padding-right: rem-calc(24);\n      padding-left: rem-calc(24);\n\n      &[aria-selected=\"true\"] {\n        font-weight: 700;\n        opacity: 1;\n        background: linear-gradient(currentColor, currentColor) bottom / 0 0 no-repeat;\n        background-size: calc(100% - 50px) 3px;\n\n        &.dark {\n          color: $button-primary-text;\n        }\n      }\n\n      &,\n      &:hover,\n      &:active {\n        outline: none;\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &.dark:not([aria-selected=\"true\"]) {\n        opacity: 0.8;\n        color: $button-primary-text;\n      }\n\n      &.user-is-tabbing:focus:not(:active) {\n        outline: none;\n        @include focus-style;\n        &.dark {\n          @include focus-on-dark;\n        }\n      }\n    }\n  }\n\n  &.hide {\n    display: none;\n  }\n}\n","import { Component, Element, h, Prop, Event, EventEmitter, Listen, Host } from \"@stencil/core\";\n\n@Component({\n  tag: \"wm-tab-item\",\n  styleUrl: \"wm-tab-item.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class TabItem {\n  @Element() el!: HTMLWmTabItemElement;\n\n  private get parentTabList(): HTMLWmTabListElement | null {\n    return this.el.parentElement as HTMLWmTabListElement;\n  }\n\n  /**\n   * Indicates whether the tab is currently active\n   */\n  @Prop() selected: boolean = false;\n\n  @Prop() show: boolean = true;\n\n  /**\n   * The id of the tab, linked to a tab panel.\n   */\n  @Prop() tabId: string = \"\";\n\n  /**\n   * Reference to focusable link element\n   */\n  linkEl?: HTMLAnchorElement;\n\n  @Event() wmTabSelected!: EventEmitter<{ tabId: string }>;\n  @Event() tabSelected!: EventEmitter<{ tabId: string }>; // deprecated in favor of wmTabSelected\n\n  @Event() keydownOnTabItem!: EventEmitter<{\n    tabItem: HTMLWmTabItemElement;\n    key: string;\n  }>;\n\n  @Event() tabItemLoaded!: EventEmitter<{ tab: HTMLWmTabItemElement }>;\n\n  private tabClicked = (ev: MouseEvent) => {\n    ev.preventDefault();\n    this.wmTabSelected.emit({ tabId: this.tabId });\n    this.tabSelected.emit({ tabId: this.tabId }); // deprecated\n  };\n\n  private tabPressed = (ev: KeyboardEvent) => {\n    const key = ev.key;\n\n    if (key === \"Enter\" || key === \" \") {\n      ev.preventDefault();\n      this.wmTabSelected.emit({ tabId: this.tabId });\n      this.tabSelected.emit({ tabId: this.tabId }); // deprecated\n    } else if (key.includes(\"Arrow\")) {\n      ev.preventDefault();\n      this.keydownOnTabItem.emit({ tabItem: this.el, key: ev.key });\n    }\n  };\n\n  @Listen(\"keydown\", { target: \"document\" })\n  toggleTabbingOn() {\n    this.linkEl && this.linkEl.classList.add(\"user-is-tabbing\");\n  }\n\n  @Listen(\"click\", { target: \"document\" })\n  toggleTabbingOff() {\n    this.linkEl && this.linkEl.classList.remove(\"user-is-tabbing\");\n  }\n\n  componentDidLoad() {\n    this.tabItemLoaded.emit();\n  }\n\n  render() {\n    let classes = this.show ? \"\" : \"hide \";\n    classes += this.parentTabList && this.parentTabList.customBackground == \"dark\" ? \"dark\" : \"\";\n\n    let styles = {};\n    const padding = this.parentTabList && this.parentTabList.customPadding;\n    if (padding) {\n      const bkgSize = parseInt(padding, 10) * 2 || 0;\n      const units = padding.split(/([0-9]+)/).pop();\n      styles = {\n        \"padding-left\": this.parentTabList!.customPadding,\n        \"padding-right\": this.parentTabList!.customPadding,\n        \"background-size\": `calc(100% - ${bkgSize}${units}) 3px`,\n      };\n    }\n\n    return (\n      <Host role=\"presentation\">\n        <li class=\"tab-item\" role=\"presentation\">\n          <a\n            class={`tab ${classes}`}\n            style={styles}\n            role=\"tab\"\n            ref={(el) => (this.linkEl = el as HTMLAnchorElement)}\n            onClick={this.tabClicked}\n            id={`tab-link-${this.tabId}`}\n            onKeyDown={(ev: KeyboardEvent) => this.tabPressed(ev)}\n            aria-selected={this.selected ? \"true\" : \"false\"}\n            tabindex={this.selected ? 0 : -1}\n          >\n            <slot></slot>\n          </a>\n        </li>\n      </Host>\n    );\n  }\n}\n",":host,\nwm-tab-list {\n  * {\n    box-sizing: border-box;\n  }\n\n  position: relative;\n  white-space: nowrap;\n  height: fit-content;\n  display: block;\n\n  .tabcontainer {\n    margin: 0;\n    margin-left: -24px;\n    width: 100%;\n    height: rem-calc(65);\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 0;\n\n    &.dark {\n      background: rgb(53, 59, 72);\n      margin: 0;\n    }\n  }\n\n  wm-select {\n    padding: rem-calc(6) 0;\n  }\n}\n","import { forceUpdate, Component, Prop, Element, h, Watch, Listen, Host, Event, EventEmitter } from \"@stencil/core\";\nimport { debounce } from \"../../../global/functions\";\n\n@Component({\n  tag: \"wm-tab-list\",\n  styleUrl: \"wm-tab-list.scss\",\n  shadow: { delegatesFocus: true },\n})\nexport class TabList {\n  @Element() el!: any;\n\n  @Prop() customBackground?: \"dark\" | \"\";\n  @Prop() customPadding?: string;\n  @Prop() selectedTab?: string;\n\n  /**\n   * Delegates control to the component, which will listen for the tabSelected event, update the display of the tab panels, and update the selected tab on display. When set to false, the app must listen for the event and update the selectedTab attribute. Offers more control for devs, who may want to control when data loads or run other functions when tabs are switched.\n   */\n  @Prop() controllerEnabled: boolean = false;\n\n  /**\n   * Set to true when the tab list exceeds the parent width. Component will render the menu layout.\n   */\n  private get menuLayout(): boolean {\n    if (this.listWidth) {\n      return this.el.offsetWidth < this.listWidth - 24; // to take into account the negative margin on the ul\n    } else {\n      return false; // in case listWidth couldn't get computed, we render regular tabs\n    }\n  }\n\n  /**\n   * Emitted by wm-select options when tabs have the menu format\n   */\n  @Event() wmTabSelected!: EventEmitter<{ tabId: string }>;\n  @Event() tabSelected!: EventEmitter<{ tabId: string }>; // deprecated in favor of wmTabSelected\n\n  private get tabItems(): Array<HTMLWmTabItemElement> {\n    return Array.from(this.el.querySelectorAll(\"wm-tab-item\"));\n  }\n\n  get selectedTabItem(): HTMLWmTabItemElement {\n    return this.tabItems.filter((t) => t.selected)[0];\n  }\n\n  private getLinkEl(tab: HTMLWmTabItemElement): HTMLAnchorElement {\n    return tab.shadowRoot!.querySelector(\"a\")!;\n  }\n\n  private get panels(): Array<HTMLWmTabPanelElement> {\n    const allPanels = Array.from(document.querySelectorAll(\"wm-tab-panel\"));\n    const tabIds = this.tabItems.map((t) => t.tabId);\n    return allPanels.filter((p) => tabIds.includes(p.tabId));\n  }\n\n  private getPanel(tabId: string) {\n    return this.panels.find((p) => p.tabId === tabId);\n  }\n\n  private listWidth?: number;\n\n  private setListWidth() {\n    let newCalc = this.tabItems.reduce((sum, tab) => sum + tab.offsetWidth, 0);\n    this.listWidth = newCalc && newCalc > 0 ? newCalc : this.listWidth; // the function may return 0. In this case keep the previous value\n  }\n\n  @Watch(\"selectedTab\")\n  setSelected(id: string) {\n    this.tabItems.map((tab: HTMLWmTabItemElement) => (tab.selected = tab.tabId === id));\n    const singlePanel = this.panels.length === 1 && this.tabItems.length > 1;\n    if (singlePanel) {\n      /**\n       * If the app conditionally renders content in one single tab panel rather than allocating the content to discrete panels, then the tab panels aria references needs to update whenever a new tab item is selected.\n       */\n      this.setAttributesOnPanel(this.panels[0], this.selectedTabItem);\n      this.panels[0].active = true;\n    } else {\n      this.panels.map((panel: HTMLWmTabPanelElement) => (panel.active = panel.tabId === id));\n    }\n  }\n\n  showItems() {\n    this.tabItems.map((t) => (t.show = true));\n  }\n\n  hideItems() {\n    this.tabItems.map((t) => (t.show = false));\n  }\n\n  componentWillLoad() {\n    this.el.focus = () => {\n      // in addition to delegatesFocus, we need to highjack the focus method to send focus to the selected tab-item\n      this.selectedTabItem && this.selectedTabItem.focus();\n    };\n  }\n\n  componentDidLoad() {\n    this.setLayout(); // this require measurements of DOM elements so can't be done before first paint\n    const selectedTab = this.selectedTab || this.tabItems[0].tabId;\n    this.setSelected(selectedTab);\n  }\n\n  @Listen(\"tabItemLoaded\")\n  tabItemLoaded(ev: CustomEvent) {\n    this.setAriaOnPanelAndTab(ev.target as HTMLWmTabItemElement);\n  }\n\n  setAriaOnPanelAndTab(tab: HTMLWmTabItemElement) {\n    const panel = this.getPanel(tab.tabId);\n\n    // If there's no panel, check for case where content is conditionally rendered in one panel, in which case attributes on all tabs should point to this single panel.\n    if (!panel) {\n      if (this.panels.length === 1) {\n        this.setAttributesOnTab(tab, this.panels[0]);\n      }\n    } else {\n      // Otherwise, set attributes on each tab item that loads and its associated panel\n      this.setAttributesOnPanel(panel, tab);\n      this.setAttributesOnTab(tab, panel);\n    }\n  }\n\n  setAttributesOnTab(tab: HTMLWmTabItemElement, panel: HTMLWmTabPanelElement) {\n    const link = this.getLinkEl(tab);\n\n    if (link) {\n      link.setAttribute(\"aria-controls\", panel.id);\n      link.setAttribute(\"href\", `#${panel.id}`);\n    }\n  }\n\n  removeAttributesOnTab(tab: HTMLWmTabItemElement) {\n    const link = this.getLinkEl(tab);\n\n    if (link) {\n      link.removeAttribute(\"aria-controls\");\n      link.removeAttribute(\"href\");\n    }\n  }\n\n  setAttributesOnPanel(panel: HTMLWmTabPanelElement, tab: HTMLWmTabItemElement) {\n    const link = this.getLinkEl(tab);\n\n    if (link) {\n      panel.setAttribute(\"aria-labelledby\", link.id);\n      panel.setAttribute(\"tab-id\", tab.tabId);\n    }\n  }\n\n  @Listen(\"wmTabSelected\")\n  handleTabSelected(ev: CustomEvent) {\n    if (this.controllerEnabled) {\n      this.setSelected(ev.detail.tabId);\n    }\n  }\n\n  @Listen(\"keydownOnTabItem\")\n  handleKeydown(ev: CustomEvent) {\n    const key = ev.detail.key;\n    const index = this.tabItems.indexOf(ev.detail.tabItem);\n\n    if (key === \"ArrowLeft\" || key === \"ArrowRight\") {\n      this.handleLeftRightArrow(index, key);\n    }\n  }\n\n  handleLeftRightArrow(index: number, key: string) {\n    if (key) {\n      index = key === \"ArrowLeft\" ? index - 1 : index + 1;\n    }\n\n    if (index < 0) {\n      index = this.tabItems.length - 1;\n    } else if (index === this.tabItems.length) {\n      index = 0;\n    }\n\n    const tabToFocus = this.tabItems[index];\n    this.getLinkEl(tabToFocus).focus();\n  }\n\n  /**\n   * Change layout if parent size drops below tab list width\n   */\n  @Listen(\"resize\", { target: \"window\" })\n  setLayout() {\n    this.debouncedSetLayout();\n  }\n\n  debouncedSetLayout = debounce(() => {\n    if (!this.listWidth) {\n      this.setListWidth();\n    }\n    forceUpdate(this.el);\n  }, 250);\n\n  renderMenuOrTabs() {\n    if (this.menuLayout) {\n      this.hideItems();\n      return (\n        <wm-select label=\"Tab Selection\" label-position=\"none\">\n          {this.renderOptions()}\n        </wm-select>\n      );\n    } else {\n      this.showItems();\n      let margins = {};\n      if (this.customPadding) {\n        margins = {\n          \"margin-left\": \"-\" + this.customPadding,\n        };\n      }\n      return (\n        <ul class={`tabcontainer ${this.customBackground || \"\"}`} style={margins} role=\"tablist\">\n          <slot></slot>\n        </ul>\n      );\n    }\n  }\n\n  renderOptions() {\n    return this.tabItems.map((t) => (\n      <wm-option\n        id={`tab-link-${t.tabId}`}\n        selected={t.tabId === this.selectedTab}\n        onClick={(ev) => {\n          ev.preventDefault();\n          this.wmTabSelected.emit({ tabId: t.tabId });\n          this.tabSelected.emit({ tabId: t.tabId }); // deprecated\n        }}\n      >\n        {t.textContent}\n      </wm-option>\n    ));\n  }\n\n  render() {\n    return <Host class={this.menuLayout ? \"menu\" : \"\"}>{this.renderMenuOrTabs()}</Host>;\n  }\n}\n","wm-tab-panel {\n  visibility: inherit;\n\n  &.tab-hidden {\n    display: none;\n  }\n\n  &:active {\n    outline: none;\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  &.user-is-tabbing:focus {\n    outline: -webkit-focus-ring-color auto 5px;\n  }\n}\n","import { Component, Element, Prop, Host, h, Event, Listen, EventEmitter } from \"@stencil/core\";\nimport { generateId } from \"../../../global/functions\";\n\n@Component({\n  tag: \"wm-tab-panel\",\n  styleUrl: \"wm-tab-panel.scss\",\n})\nexport class TabPanel {\n  @Element() el!: HTMLWmTabPanelElement;\n\n  /**\n   * Indicates whether the panel should be displayed or not.\n   */\n  @Prop({ mutable: true }) active: boolean = false;\n\n  /**\n   * The id of the panel, linked to a tabItem in the tablist.\n   */\n  @Prop({ mutable: true }) tabId: string = \"\";\n\n  @Event() tabPanelLoaded!: EventEmitter<{ tabId: string }>;\n\n  componentWillLoad() {\n    !this.el.id && this.el.setAttribute(\"id\", generateId());\n  }\n\n  componentDidLoad() {\n    this.tabPanelLoaded.emit({ tabId: this.tabId });\n  }\n\n  @Listen(\"keydown\", { target: \"document\" })\n  toggleTabbingOn() {\n    this.el.classList.add(\"user-is-tabbing\");\n  }\n\n  @Listen(\"click\", { target: \"document\" })\n  toggleTabbingOff() {\n    this.el.classList.remove(\"user-is-tabbing\");\n  }\n\n  render() {\n    return <Host role=\"tabpanel\" class={{ \"tab-hidden\": !this.active }}></Host>;\n  }\n}\n"],"mappings":"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"}