@madgex/design-system 13.2.0 → 13.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/icons.json +1 -1
- package/dist/css/index.css +1 -1
- package/dist/js/components/mds-timeout-dialog-standalone.js +1 -1
- package/dist/js/index-fractal.js +1 -1
- package/dist/js/index.js +1 -1
- package/dist/js/timeout-dialog-plrFUmdZ.js +28 -0
- package/package.json +1 -1
- package/src/components/timeout-dialog/README.md +69 -17
- package/src/components/timeout-dialog/timeout-dialog.js +191 -71
- package/src/components/timeout-dialog/timeout-dialog.njk +6 -0
- package/src/components/timeout-dialog/timeout-dialog.scss +21 -0
- package/dist/js/timeout-dialog-DuVVAWa3.js +0 -23
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{M as r}from"../timeout-dialog-
|
|
1
|
+
import{M as r}from"../timeout-dialog-plrFUmdZ.js";const e='@charset "UTF-8";a{background-color:transparent}button{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button{overflow:visible}button{text-transform:none}button,[type=button],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}template{display:none}div,h2,p,a,s,form,time{margin:0;padding:0;border:0;font:inherit}*,*:before,*:after{box-sizing:border-box;word-wrap:break-word}h2,p{margin-bottom:12px}a:hover,a:focus{--link-color: var(--mds-color-link-hover, #15598e);--text-decoration: var(--mds-text-decoration-link-hover, underline);--text-decoration-thickness: max(2px, .12em)}a{--link-color: var(--mds-color-link-base, #1b75bb);--link-font-weight: var(--mds-font-weight-link-base);--text-decoration: var(--mds-text-decoration-link-base, underline);--text-decoration-thickness: 1px;color:var(--link-color);font-weight:var(--link-font-weight);text-decoration:var(--text-decoration);text-decoration-thickness:var(--text-decoration-thickness);text-underline-offset:.15rem}h2 a{font-weight:inherit}h2{color:var(--mds-color-text-headers-base)}h2{font-family:var(--mds-font-family-heading-2);font-weight:var(--mds-font-weight-heading-2);color:var(--mds-color-text-headers-2);text-transform:var(--mds-text-transform-heading-2);letter-spacing:var(--mds-font-spacing-heading-2)}.mds-grid-row{box-sizing:border-box;display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:wrap;margin-right:-10px;margin-left:-10px}.mds-grid-center{justify-content:center;text-align:center}.mds-message{padding:12px;border-radius:var(--mds-size-border-radius-base, 4px);border:var(--mds-size-border-width-base, 1px) solid var(--mds-color-border, #DDDDDD)}.mds-message.mds-message--error{color:#ae0216;background-color:#ffe3e6;border-color:#e1021d}.mds-message *{color:inherit}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.mds-button{--button-background: var(--mds-color-button-bg-base);--button-border-color-top: var(--mds-color-button-border-top);--button-border-color-right: var(--mds-color-button-border-right);--button-border-color-bottom: var(--mds-color-button-border-bottom);--button-border-color-left: var(--mds-color-button-border-left);--button-border-color: var(--button-border-color-top) var(--button-border-color-right) var(--button-border-color-bottom) var(--button-border-color-left);--button-border-width: var(--mds-size-border-width-button);--button-border-radius: var(--mds-size-border-radius-button);--button-text-color: var(--mds-color-button-text-base);--button-font-family: var(--mds-font-family-button-base);--button-font-weight: var(--mds-font-weight-button-base);--button-text-transform: var(--mds-text-transform-button);--button-font-spacing: var(--mds-font-spacing-button);--text-decoration: none;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-appearance:none;width:auto;background:var(--button-background, #000);border-width:var(--button-border-width, 1px);border-color:var(--button-border-color, transparent);border-style:solid;border-radius:var(--button-border-radius, 4px);padding:12px 20px;display:inline-block;text-align:center;color:var(--button-text-color, #fff);font-family:var(--button-font-family);font-weight:var(--button-font-weight);text-transform:var(--button-text-transform);letter-spacing:var(--button-font-spacing);text-decoration:var(--text-decoration)}.mds-button:hover,.mds-button:focus{--button-background: var(--mds-color-button-bg-hover, #333333);--button-border-color-top: var(--mds-color-button-border-hover-top);--button-border-color-right: var(--mds-color-button-border-hover-right);--button-border-color-bottom: var(--mds-color-button-border-hover-bottom);--button-border-color-left: var(--mds-color-button-border-hover-left);--button-text-color: var(--mds-color-button-text-hover);--text-decoration: none}.mds-button--neutral{--button-background: #fff;--button-text-color: var(--mds-color-text-base, #000);--button-border-color: #DDDDDD;--button-border-width: 1px}.mds-button--neutral:hover,.mds-button--neutral:focus{--button-background: #DDDDDD;--button-text-color: var(--mds-color-text-base, #000);--button-border-color: #DDDDDD}@keyframes notification-fadeIn{0%{opacity:0;transform:translate(-50%) translateY(-75%)}to{opacity:1;transform:translate(-50%) translateY(-115%)}}.mds-button{font-size:var(--mds-font-type-s0-size);line-height:var(--mds-font-type-s0-line-height)}h2{font-size:var(--mds-font-type-s4-size);line-height:var(--mds-font-type-s4-line-height)}.mds-margin-right-b4{margin-right:16px}.mds-margin-bottom-b4{margin-bottom:16px}.mds-display-none{display:none}.mds-timeout-dialog{background-color:#fff;margin:40px auto;padding:32px 48px;border-radius:var(--mds-size-border-radius-base, 4px);border:0;max-width:800px;position:relative}.mds-timeout-dialog::backdrop{background-color:#000c}.mds-timeout-dialog__button-icon{display:none;width:1em;height:1em;animation:spin-timeout-dialog 1s infinite linear;color:inherit;margin-left:4px}.mds-timeout-dialog--refreshing .mds-timeout-dialog__button-icon{display:inline-block}@keyframes spin-timeout-dialog{0%{transform:rotate(0)}to{transform:rotate(360deg)}}';class n extends r{constructor(...o){super(...o),this.attachShadow({mode:"open"});const t=new CSSStyleSheet;t.replaceSync(`
|
|
2
2
|
* {border: 0;outline:0;padding: 0;margin:0;box-sizing:border-box;}
|
|
3
3
|
${e}`),this.rootNode.adoptedStyleSheets=[t]}get rootNode(){return this.shadowRoot}}window.customElements.get("mds-timeout-dialog-standalone")||window.customElements.define("mds-timeout-dialog-standalone",n);
|
package/dist/js/index-fractal.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["js/components/mds-timeout-dialog-standalone.js","js/timeout-dialog-
|
|
1
|
+
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["js/components/mds-timeout-dialog-standalone.js","js/timeout-dialog-plrFUmdZ.js"])))=>i.map(i=>d[i]);
|
|
2
2
|
const y="modulepreload",L=function(e){return"/"+e},p={},T=function(n,r,s){let t=Promise.resolve();if(r&&r.length>0){let g=function(o){return Promise.all(o.map(l=>Promise.resolve(l).then(d=>({status:"fulfilled",value:d}),d=>({status:"rejected",reason:d}))))};var h=g;document.getElementsByTagName("link");const a=document.querySelector("meta[property=csp-nonce]"),i=a?.nonce||a?.getAttribute("nonce");t=g(r.map(o=>{if(o=L(o),o in p)return;p[o]=!0;const l=o.endsWith(".css"),d=l?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${o}"]${d}`))return;const c=document.createElement("link");if(c.rel=l?"stylesheet":y,l||(c.as="script"),c.crossOrigin="",c.href=o,i&&c.setAttribute("nonce",i),document.head.appendChild(c),l)return new Promise((w,E)=>{c.addEventListener("load",w),c.addEventListener("error",()=>E(new Error(`Unable to preload CSS for ${o}`)))})}))}function m(a){const i=new Event("vite:preloadError",{cancelable:!0});if(i.payload=a,window.dispatchEvent(i),!i.defaultPrevented)throw a}return t.then(a=>{for(const i of a||[])i.status==="rejected"&&m(i.reason);return n().catch(m)})},f={switchToinverse:e=>{e.classList.remove("mds-switch-state--default"),e.classList.add("mds-switch-state--inverse")},switchTodefault:e=>{e.classList.remove("mds-switch-state--inverse"),e.classList.add("mds-switch-state--default")}},A={init:()=>{Array.from(document.querySelectorAll(".js-mds-switch-state")).forEach(n=>{n.addEventListener("click",s=>{s.preventDefault(),s.stopPropagation();const t=s.currentTarget;t.classList.contains("mds-switch-state--default")?f.switchToinverse(t):(t.classList.contains("mds-switch-state--inverse"),f.switchTodefault(t))})})}},v="mds-notification",u={init:(e,n,r=3e3)=>{const{body:s}=document;u.hide(s);const t=document.createElement("div");t.setAttribute("role","alert"),t.classList.add(v,"mds-message",`mds-message--${n}`),t.innerText=e,u.show(s,t),setTimeout(u.hide,r,s)},show:(e,n)=>{e.appendChild(n)},hide:e=>{Array.from(e.querySelectorAll(`.${v}`)).forEach(r=>{r.parentNode.removeChild(r)})}},S={init:()=>{Array.from(document.querySelectorAll(".js-notification-example")).forEach(n=>{n.addEventListener("click",s=>{s.preventDefault(),s.stopPropagation();const t=s.currentTarget,m=t.innerText,{messageType:h}=t.dataset;u.init(m,h)})})}};document.addEventListener("DOMContentLoaded",async()=>{A.init(),S.init(),await T(()=>import("./components/mds-timeout-dialog-standalone.js"),__vite__mapDeps([0,1]))});
|
package/dist/js/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{M as xt}from"./dropdown-nav-B37nBO1_.js";import{M as Et}from"./timeout-dialog-DuVVAWa3.js";window.addEventListener("hashchange",()=>{const t=window.location.hash.trim();Array.from(document.querySelectorAll(`a[href='${t}']`)).forEach(r=>{r.click()})},!1);const it={baseline:{$value:"4px"},breakpoint:{md:{$value:"600px"},lg:{$value:"1008px"}}},st={size:it},Ot="js-tabs-item",Ve="mds-tabs",Lt="mds-tabs__list",Ct="mds-tabs__list-item",Ue="mds-tabs__panel",pe="mds-tabs__tab",ve="mds-tabs__tab--selected",Xe="mds-tabs__panel--hidden",me={left:37,right:39,up:38,down:40},kt=".js-desktop-tabbed",St=".js-full-tabbed",Tt=parseInt(st.size.breakpoint.lg.$value,10),E={init:()=>{E.setTabs(St),window.innerWidth>Tt&&E.setTabs(kt)},setTabs:t=>{const e=Array.from(document.querySelectorAll(`${t} .${pe}`)),r=Array.from(document.querySelectorAll(`${t} .${Lt}`)),a=Array.from(document.querySelectorAll(`${t} .${Ct}`)),n=Array.from(document.querySelectorAll(`${t} .${Ue}`));r.forEach(o=>{o.setAttribute("role","tablist")}),a.forEach(o=>{o.setAttribute("role","presentation")}),e.forEach(o=>{o.setAttribute("role","tab"),o.setAttribute("aria-controls",o.attributes.href.value.substring(1)),o.classList.contains(ve)?o.setAttribute("tabindex","0"):o.setAttribute("tabindex","-1")}),n.forEach(o=>{o.setAttribute("role","tabpanel"),o.setAttribute("aria-labelledby",`label-${o.attributes.id.value}`)});const i=document.querySelectorAll(`${t} .${Ot}`);Array.from(i).forEach(o=>{const l=window.location.hash.trim(),d=o.attributes.href.value,c=o.closest(`.${Ve}`),p=E.getAllPanels(c),f=E.getAllTabs(c),v=E.getTargetPanel(o,c);o.addEventListener("click",m=>{m.preventDefault(),E.updateTabs(f,p,o,v,d)}),d===l&&E.updateTabs(f,p,o,v,d)}),r.forEach(o=>{const l=o.closest(`.${Ve}`),d=E.getAllPanels(l),c=E.getAllTabs(l);o.addEventListener("keydown",p=>{switch(p.keyCode){case me.left:case me.up:p.preventDefault(),E.moveTab(o,l,c,d,!1);break;case me.right:case me.down:p.preventDefault(),E.moveTab(o,l,c,d,!0);break}})})},getSelectedTab:t=>t.querySelector(`.${ve}`),getPrevTab:t=>t.parentElement.previousSibling?t.parentElement.previousSibling.querySelector(`.${pe}`):!1,getNextTab:t=>t.parentElement.nextSibling?t.parentElement.nextSibling.querySelector(`.${pe}`):!1,getTargetPanel:(t,e)=>{const r=t.attributes.href.value;return e.querySelector(r)},getAllPanels:t=>Array.from(t.querySelectorAll(`.${Ue}`)),getAllTabs:t=>Array.from(t.querySelectorAll(`.${pe}`)),moveTab:(t,e,r,a,n)=>{const i=E.getSelectedTab(t),s=n?E.getNextTab(i):E.getPrevTab(i);if(s){const o=s.attributes.href.value,l=E.getTargetPanel(s,e);E.updateTabs(r,a,s,l,o,!1)}},updateTabs:(t,e,r,a,n)=>{E.clearAllTabs(t),E.setActiveTab(r),E.clearAllPanels(e),E.setActivePanel(a,n)},clearAllTabs:t=>{t.forEach(e=>{e.classList.remove(ve),e.setAttribute("aria-selected","false"),e.setAttribute("tabindex","-1")})},clearAllPanels:t=>{t.forEach(e=>{e.classList.add(Xe)})},setActiveTab:t=>{t.classList.add(ve),t.setAttribute("aria-selected","true"),t.setAttribute("tabindex","0"),t.focus()},setActivePanel:(t,e)=>{t.classList.remove(Xe),window.history.replaceState({},"",e)}},Pt="mds-accordion--breakpoint",$t="mds-accordion__label",ct={init:()=>{const t=document.querySelectorAll(`.${Pt}`),e=window.innerWidth;t.forEach(a=>{ct.checkBreakpoint(a,e)||(a.open=!0,a.querySelector("summary").style.display="none")}),document.querySelectorAll(`.${$t}`).forEach(a=>{a.addEventListener("click",({target:n})=>{const i=n.closest("details"),s=i.querySelector("summary");i.open=!1,s.focus()})})},checkBreakpoint:(t,e)=>{let r=0;if(t.dataset.bp){const a=t.dataset.bp.replace(/\D/g,""),n=t.dataset.bp.replace(/[0-9]/g,"");let i,s;switch(n){case"px":r=a;break;case"em":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=a*parseFloat(i),r=s;break;case"rem":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=a*parseFloat(i),r=s;break;default:return!0}return!(e>r)}return!0}},Dt={init:()=>{const t=document.querySelectorAll(".mds-subnavigation"),e=[];let r;t.forEach(n=>{const i=n.querySelector(".mds-subnavigation__link-list"),s=Array.from(i.children),o=s[0],l=n.querySelector(".mds-subnavigation__mobile-title"),d=n.querySelector(".mds-subnavigation__drawer"),c=n.querySelector(".mds-subnavigation__drawer-label"),p=n.querySelector(".mds-subnavigation__drawer-label-text"),f=n.querySelector(".mds-subnavigation__drawer-content"),v=d.dataset.label,m=d.dataset.labelPlural;c.addEventListener("click",()=>{c.getAttribute("aria-expanded")==="true"?c.setAttribute("aria-expanded","false"):c.setAttribute("aria-expanded","true")}),d.addEventListener("focusout",b=>{d.contains(b.relatedTarget)||c.setAttribute("aria-expanded","false")});const g=()=>i.clientHeight>o.offsetHeight;e.push(()=>{c.setAttribute("aria-expanded","false"),window.getComputedStyle(l).getPropertyValue("display")==="none"?(s.forEach(h=>{i.append(h)}),d.style.display="none",g()&&(d.style.display="list-item",s.slice().reverse().forEach(h=>{if(g()&&h!==d){f.prepend(h);const y=Array.from(f.children).length,A=y>1?m:v;p.innerText=A.replace("{count}",y)}else i.prepend(h)}),f.style.width=`${i.offsetWidth-d.offsetLeft}px`)):(s.forEach(h=>{h!==d&&h!==l&&f.append(h)}),f.style.width="initial",d.style.display="block")})});const a=()=>{e.forEach(n=>{n()})};a(),window.onresize=()=>{clearTimeout(r),r=setTimeout(a,100)}}},qt="mds-checkbox-accordion__button",Bt="mds-checkbox-accordion__button--open",jt={init:()=>{document.querySelectorAll(`.${qt}`).forEach(e=>{e.classList.contains(Bt)?e.setAttribute("aria-expanded","true"):e.setAttribute("aria-expanded","false"),e.addEventListener("click",()=>{e.getAttribute("aria-expanded")==="true"?e.setAttribute("aria-expanded","false"):e.setAttribute("aria-expanded","true")})})}};var T="top",$="bottom",D="right",P="left",$e="auto",se=[T,$,D,P],G="start",De="end",Mt="clippingParents",lt="viewport",ee="popper",Rt="reference",Ye=se.reduce(function(t,e){return t.concat([e+"-"+G,e+"-"+De])},[]),dt=[].concat(se,[$e]).reduce(function(t,e){return t.concat([e,e+"-"+G,e+"-"+De])},[]),Wt="beforeRead",It="read",_t="afterRead",Ht="beforeMain",Nt="main",Ft="afterMain",zt="beforeWrite",Vt="write",Ut="afterWrite",Xt=[Wt,It,_t,Ht,Nt,Ft,zt,Vt,Ut];function W(t){return t?(t.nodeName||"").toLowerCase():null}function B(t){if(t==null)return window;if(t.toString()!=="[object Window]"){var e=t.ownerDocument;return e&&e.defaultView||window}return t}function ne(t){var e=B(t).Element;return t instanceof e||t instanceof Element}function q(t){var e=B(t).HTMLElement;return t instanceof e||t instanceof HTMLElement}function ut(t){if(typeof ShadowRoot>"u")return!1;var e=B(t).ShadowRoot;return t instanceof e||t instanceof ShadowRoot}function Yt(t){var e=t.state;Object.keys(e.elements).forEach(function(r){var a=e.styles[r]||{},n=e.attributes[r]||{},i=e.elements[r];!q(i)||!W(i)||(Object.assign(i.style,a),Object.keys(n).forEach(function(s){var o=n[s];o===!1?i.removeAttribute(s):i.setAttribute(s,o===!0?"":o)}))})}function Jt(t){var e=t.state,r={popper:{position:e.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(e.elements.popper.style,r.popper),e.styles=r,e.elements.arrow&&Object.assign(e.elements.arrow.style,r.arrow),function(){Object.keys(e.elements).forEach(function(a){var n=e.elements[a],i=e.attributes[a]||{},s=Object.keys(e.styles.hasOwnProperty(a)?e.styles[a]:r[a]),o=s.reduce(function(l,d){return l[d]="",l},{});!q(n)||!W(n)||(Object.assign(n.style,o),Object.keys(i).forEach(function(l){n.removeAttribute(l)}))})}}const Kt={name:"applyStyles",enabled:!0,phase:"write",fn:Yt,effect:Jt,requires:["computeStyles"]};function R(t){return t.split("-")[0]}function Q(t){var e=t.getBoundingClientRect();return{width:e.width,height:e.height,top:e.top,right:e.right,bottom:e.bottom,left:e.left,x:e.left,y:e.top}}function qe(t){var e=Q(t),r=t.offsetWidth,a=t.offsetHeight;return Math.abs(e.width-r)<=1&&(r=e.width),Math.abs(e.height-a)<=1&&(a=e.height),{x:t.offsetLeft,y:t.offsetTop,width:r,height:a}}function ft(t,e){var r=e.getRootNode&&e.getRootNode();if(t.contains(e))return!0;if(r&&ut(r)){var a=e;do{if(a&&t.isSameNode(a))return!0;a=a.parentNode||a.host}while(a)}return!1}function _(t){return B(t).getComputedStyle(t)}function Gt(t){return["table","td","th"].indexOf(W(t))>=0}function N(t){return((ne(t)?t.ownerDocument:t.document)||window.document).documentElement}function xe(t){return W(t)==="html"?t:t.assignedSlot||t.parentNode||(ut(t)?t.host:null)||N(t)}function Je(t){return!q(t)||_(t).position==="fixed"?null:t.offsetParent}function Qt(t){var e=navigator.userAgent.toLowerCase().indexOf("firefox")!==-1,r=navigator.userAgent.indexOf("Trident")!==-1;if(r&&q(t)){var a=_(t);if(a.position==="fixed")return null}for(var n=xe(t);q(n)&&["html","body"].indexOf(W(n))<0;){var i=_(n);if(i.transform!=="none"||i.perspective!=="none"||i.contain==="paint"||["transform","perspective"].indexOf(i.willChange)!==-1||e&&i.willChange==="filter"||e&&i.filter&&i.filter!=="none")return n;n=n.parentNode}return null}function ce(t){for(var e=B(t),r=Je(t);r&&Gt(r)&&_(r).position==="static";)r=Je(r);return r&&(W(r)==="html"||W(r)==="body"&&_(r).position==="static")?e:r||Qt(t)||e}function Be(t){return["top","bottom"].indexOf(t)>=0?"x":"y"}var H=Math.max,ae=Math.min,be=Math.round;function we(t,e,r){return H(t,ae(e,r))}function pt(){return{top:0,right:0,bottom:0,left:0}}function vt(t){return Object.assign({},pt(),t)}function mt(t,e){return e.reduce(function(r,a){return r[a]=t,r},{})}var Zt=function(e,r){return e=typeof e=="function"?e(Object.assign({},r.rects,{placement:r.placement})):e,vt(typeof e!="number"?e:mt(e,se))};function er(t){var e,r=t.state,a=t.name,n=t.options,i=r.elements.arrow,s=r.modifiersData.popperOffsets,o=R(r.placement),l=Be(o),d=[P,D].indexOf(o)>=0,c=d?"height":"width";if(!(!i||!s)){var p=Zt(n.padding,r),f=qe(i),v=l==="y"?T:P,m=l==="y"?$:D,g=r.rects.reference[c]+r.rects.reference[l]-s[l]-r.rects.popper[c],b=s[l]-r.rects.reference[l],h=ce(i),y=h?l==="y"?h.clientHeight||0:h.clientWidth||0:0,A=g/2-b/2,u=p[v],L=y-f[c]-p[m],w=y/2-f[c]/2+A,O=we(u,w,L),x=l;r.modifiersData[a]=(e={},e[x]=O,e.centerOffset=O-w,e)}}function tr(t){var e=t.state,r=t.options,a=r.element,n=a===void 0?"[data-popper-arrow]":a;n!=null&&(typeof n=="string"&&(n=e.elements.popper.querySelector(n),!n)||ft(e.elements.popper,n)&&(e.elements.arrow=n))}const rr={name:"arrow",enabled:!0,phase:"main",fn:er,effect:tr,requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};var nr={top:"auto",right:"auto",bottom:"auto",left:"auto"};function ar(t){var e=t.x,r=t.y,a=window,n=a.devicePixelRatio||1;return{x:be(be(e*n)/n)||0,y:be(be(r*n)/n)||0}}function Ke(t){var e,r=t.popper,a=t.popperRect,n=t.placement,i=t.offsets,s=t.position,o=t.gpuAcceleration,l=t.adaptive,d=t.roundOffsets,c=d===!0?ar(i):typeof d=="function"?d(i):i,p=c.x,f=p===void 0?0:p,v=c.y,m=v===void 0?0:v,g=i.hasOwnProperty("x"),b=i.hasOwnProperty("y"),h=P,y=T,A=window;if(l){var u=ce(r),L="clientHeight",w="clientWidth";u===B(r)&&(u=N(r),_(u).position!=="static"&&(L="scrollHeight",w="scrollWidth")),u=u,n===T&&(y=$,m-=u[L]-a.height,m*=o?1:-1),n===P&&(h=D,f-=u[w]-a.width,f*=o?1:-1)}var O=Object.assign({position:s},l&&nr);if(o){var x;return Object.assign({},O,(x={},x[y]=b?"0":"",x[h]=g?"0":"",x.transform=(A.devicePixelRatio||1)<2?"translate("+f+"px, "+m+"px)":"translate3d("+f+"px, "+m+"px, 0)",x))}return Object.assign({},O,(e={},e[y]=b?m+"px":"",e[h]=g?f+"px":"",e.transform="",e))}function or(t){var e=t.state,r=t.options,a=r.gpuAcceleration,n=a===void 0?!0:a,i=r.adaptive,s=i===void 0?!0:i,o=r.roundOffsets,l=o===void 0?!0:o,d={placement:R(e.placement),popper:e.elements.popper,popperRect:e.rects.popper,gpuAcceleration:n};e.modifiersData.popperOffsets!=null&&(e.styles.popper=Object.assign({},e.styles.popper,Ke(Object.assign({},d,{offsets:e.modifiersData.popperOffsets,position:e.options.strategy,adaptive:s,roundOffsets:l})))),e.modifiersData.arrow!=null&&(e.styles.arrow=Object.assign({},e.styles.arrow,Ke(Object.assign({},d,{offsets:e.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:l})))),e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-placement":e.placement})}const ir={name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:or,data:{}};var he={passive:!0};function sr(t){var e=t.state,r=t.instance,a=t.options,n=a.scroll,i=n===void 0?!0:n,s=a.resize,o=s===void 0?!0:s,l=B(e.elements.popper),d=[].concat(e.scrollParents.reference,e.scrollParents.popper);return i&&d.forEach(function(c){c.addEventListener("scroll",r.update,he)}),o&&l.addEventListener("resize",r.update,he),function(){i&&d.forEach(function(c){c.removeEventListener("scroll",r.update,he)}),o&&l.removeEventListener("resize",r.update,he)}}const cr={name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:sr,data:{}};var lr={left:"right",right:"left",bottom:"top",top:"bottom"};function Ae(t){return t.replace(/left|right|bottom|top/g,function(e){return lr[e]})}var dr={start:"end",end:"start"};function Ge(t){return t.replace(/start|end/g,function(e){return dr[e]})}function je(t){var e=B(t),r=e.pageXOffset,a=e.pageYOffset;return{scrollLeft:r,scrollTop:a}}function Me(t){return Q(N(t)).left+je(t).scrollLeft}function ur(t){var e=B(t),r=N(t),a=e.visualViewport,n=r.clientWidth,i=r.clientHeight,s=0,o=0;return a&&(n=a.width,i=a.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(s=a.offsetLeft,o=a.offsetTop)),{width:n,height:i,x:s+Me(t),y:o}}function fr(t){var e,r=N(t),a=je(t),n=(e=t.ownerDocument)==null?void 0:e.body,i=H(r.scrollWidth,r.clientWidth,n?n.scrollWidth:0,n?n.clientWidth:0),s=H(r.scrollHeight,r.clientHeight,n?n.scrollHeight:0,n?n.clientHeight:0),o=-a.scrollLeft+Me(t),l=-a.scrollTop;return _(n||r).direction==="rtl"&&(o+=H(r.clientWidth,n?n.clientWidth:0)-i),{width:i,height:s,x:o,y:l}}function Re(t){var e=_(t),r=e.overflow,a=e.overflowX,n=e.overflowY;return/auto|scroll|overlay|hidden/.test(r+n+a)}function bt(t){return["html","body","#document"].indexOf(W(t))>=0?t.ownerDocument.body:q(t)&&Re(t)?t:bt(xe(t))}function re(t,e){var r;e===void 0&&(e=[]);var a=bt(t),n=a===((r=t.ownerDocument)==null?void 0:r.body),i=B(a),s=n?[i].concat(i.visualViewport||[],Re(a)?a:[]):a,o=e.concat(s);return n?o:o.concat(re(xe(s)))}function Se(t){return Object.assign({},t,{left:t.x,top:t.y,right:t.x+t.width,bottom:t.y+t.height})}function pr(t){var e=Q(t);return e.top=e.top+t.clientTop,e.left=e.left+t.clientLeft,e.bottom=e.top+t.clientHeight,e.right=e.left+t.clientWidth,e.width=t.clientWidth,e.height=t.clientHeight,e.x=e.left,e.y=e.top,e}function Qe(t,e){return e===lt?Se(ur(t)):q(e)?pr(e):Se(fr(N(t)))}function vr(t){var e=re(xe(t)),r=["absolute","fixed"].indexOf(_(t).position)>=0,a=r&&q(t)?ce(t):t;return ne(a)?e.filter(function(n){return ne(n)&&ft(n,a)&&W(n)!=="body"}):[]}function mr(t,e,r){var a=e==="clippingParents"?vr(t):[].concat(e),n=[].concat(a,[r]),i=n[0],s=n.reduce(function(o,l){var d=Qe(t,l);return o.top=H(d.top,o.top),o.right=ae(d.right,o.right),o.bottom=ae(d.bottom,o.bottom),o.left=H(d.left,o.left),o},Qe(t,i));return s.width=s.right-s.left,s.height=s.bottom-s.top,s.x=s.left,s.y=s.top,s}function oe(t){return t.split("-")[1]}function ht(t){var e=t.reference,r=t.element,a=t.placement,n=a?R(a):null,i=a?oe(a):null,s=e.x+e.width/2-r.width/2,o=e.y+e.height/2-r.height/2,l;switch(n){case T:l={x:s,y:e.y-r.height};break;case $:l={x:s,y:e.y+e.height};break;case D:l={x:e.x+e.width,y:o};break;case P:l={x:e.x-r.width,y:o};break;default:l={x:e.x,y:e.y}}var d=n?Be(n):null;if(d!=null){var c=d==="y"?"height":"width";switch(i){case G:l[d]=l[d]-(e[c]/2-r[c]/2);break;case De:l[d]=l[d]+(e[c]/2-r[c]/2);break}}return l}function ie(t,e){e===void 0&&(e={});var r=e,a=r.placement,n=a===void 0?t.placement:a,i=r.boundary,s=i===void 0?Mt:i,o=r.rootBoundary,l=o===void 0?lt:o,d=r.elementContext,c=d===void 0?ee:d,p=r.altBoundary,f=p===void 0?!1:p,v=r.padding,m=v===void 0?0:v,g=vt(typeof m!="number"?m:mt(m,se)),b=c===ee?Rt:ee,h=t.elements.reference,y=t.rects.popper,A=t.elements[f?b:c],u=mr(ne(A)?A:A.contextElement||N(t.elements.popper),s,l),L=Q(h),w=ht({reference:L,element:y,placement:n}),O=Se(Object.assign({},y,w)),x=c===ee?O:L,C={top:u.top-x.top+g.top,bottom:x.bottom-u.bottom+g.bottom,left:u.left-x.left+g.left,right:x.right-u.right+g.right},S=t.modifiersData.offset;if(c===ee&&S){var j=S[n];Object.keys(C).forEach(function(I){var k=[D,$].indexOf(I)>=0?1:-1,F=[T,$].indexOf(I)>=0?"y":"x";C[I]+=j[F]*k})}return C}function br(t,e){e===void 0&&(e={});var r=e,a=r.placement,n=r.boundary,i=r.rootBoundary,s=r.padding,o=r.flipVariations,l=r.allowedAutoPlacements,d=l===void 0?dt:l,c=oe(a),p=c?o?Ye:Ye.filter(function(m){return oe(m)===c}):se,f=p.filter(function(m){return d.indexOf(m)>=0});f.length===0&&(f=p);var v=f.reduce(function(m,g){return m[g]=ie(t,{placement:g,boundary:n,rootBoundary:i,padding:s})[R(g)],m},{});return Object.keys(v).sort(function(m,g){return v[m]-v[g]})}function hr(t){if(R(t)===$e)return[];var e=Ae(t);return[Ge(t),e,Ge(e)]}function gr(t){var e=t.state,r=t.options,a=t.name;if(!e.modifiersData[a]._skip){for(var n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,o=s===void 0?!0:s,l=r.fallbackPlacements,d=r.padding,c=r.boundary,p=r.rootBoundary,f=r.altBoundary,v=r.flipVariations,m=v===void 0?!0:v,g=r.allowedAutoPlacements,b=e.options.placement,h=R(b),y=h===b,A=l||(y||!m?[Ae(b)]:hr(b)),u=[b].concat(A).reduce(function(V,M){return V.concat(R(M)===$e?br(e,{placement:M,boundary:c,rootBoundary:p,padding:d,flipVariations:m,allowedAutoPlacements:g}):M)},[]),L=e.rects.reference,w=e.rects.popper,O=new Map,x=!0,C=u[0],S=0;S<u.length;S++){var j=u[S],I=R(j),k=oe(j)===G,F=[T,$].indexOf(I)>=0,Z=F?"width":"height",U=ie(e,{placement:j,boundary:c,rootBoundary:p,altBoundary:f,padding:d}),z=F?k?D:P:k?$:T;L[Z]>w[Z]&&(z=Ae(z));var Ee=Ae(z),X=[];if(i&&X.push(U[I]<=0),o&&X.push(U[z]<=0,U[Ee]<=0),X.every(function(V){return V})){C=j,x=!1;break}O.set(j,X)}if(x)for(var le=m?3:1,Oe=function(M){var ue=u.find(function(Le){var J=O.get(Le);if(J)return J.slice(0,M).every(function(Ce){return Ce})});if(ue)return C=ue,"break"},Y=le;Y>0;Y--){var de=Oe(Y);if(de==="break")break}e.placement!==C&&(e.modifiersData[a]._skip=!0,e.placement=C,e.reset=!0)}}const yr={name:"flip",enabled:!0,phase:"main",fn:gr,requiresIfExists:["offset"],data:{_skip:!1}};function Ze(t,e,r){return r===void 0&&(r={x:0,y:0}),{top:t.top-e.height-r.y,right:t.right-e.width+r.x,bottom:t.bottom-e.height+r.y,left:t.left-e.width-r.x}}function et(t){return[T,D,$,P].some(function(e){return t[e]>=0})}function wr(t){var e=t.state,r=t.name,a=e.rects.reference,n=e.rects.popper,i=e.modifiersData.preventOverflow,s=ie(e,{elementContext:"reference"}),o=ie(e,{altBoundary:!0}),l=Ze(s,a),d=Ze(o,n,i),c=et(l),p=et(d);e.modifiersData[r]={referenceClippingOffsets:l,popperEscapeOffsets:d,isReferenceHidden:c,hasPopperEscaped:p},e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-reference-hidden":c,"data-popper-escaped":p})}const Ar={name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:wr};function xr(t,e,r){var a=R(t),n=[P,T].indexOf(a)>=0?-1:1,i=typeof r=="function"?r(Object.assign({},e,{placement:t})):r,s=i[0],o=i[1];return s=s||0,o=(o||0)*n,[P,D].indexOf(a)>=0?{x:o,y:s}:{x:s,y:o}}function Er(t){var e=t.state,r=t.options,a=t.name,n=r.offset,i=n===void 0?[0,0]:n,s=dt.reduce(function(c,p){return c[p]=xr(p,e.rects,i),c},{}),o=s[e.placement],l=o.x,d=o.y;e.modifiersData.popperOffsets!=null&&(e.modifiersData.popperOffsets.x+=l,e.modifiersData.popperOffsets.y+=d),e.modifiersData[a]=s}const Or={name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:Er};function Lr(t){var e=t.state,r=t.name;e.modifiersData[r]=ht({reference:e.rects.reference,element:e.rects.popper,placement:e.placement})}const Cr={name:"popperOffsets",enabled:!0,phase:"read",fn:Lr,data:{}};function kr(t){return t==="x"?"y":"x"}function Sr(t){var e=t.state,r=t.options,a=t.name,n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,o=s===void 0?!1:s,l=r.boundary,d=r.rootBoundary,c=r.altBoundary,p=r.padding,f=r.tether,v=f===void 0?!0:f,m=r.tetherOffset,g=m===void 0?0:m,b=ie(e,{boundary:l,rootBoundary:d,padding:p,altBoundary:c}),h=R(e.placement),y=oe(e.placement),A=!y,u=Be(h),L=kr(u),w=e.modifiersData.popperOffsets,O=e.rects.reference,x=e.rects.popper,C=typeof g=="function"?g(Object.assign({},e.rects,{placement:e.placement})):g,S={x:0,y:0};if(w){if(i||o){var j=u==="y"?T:P,I=u==="y"?$:D,k=u==="y"?"height":"width",F=w[u],Z=w[u]+b[j],U=w[u]-b[I],z=v?-x[k]/2:0,Ee=y===G?O[k]:x[k],X=y===G?-x[k]:-O[k],le=e.elements.arrow,Oe=v&&le?qe(le):{width:0,height:0},Y=e.modifiersData["arrow#persistent"]?e.modifiersData["arrow#persistent"].padding:pt(),de=Y[j],V=Y[I],M=we(0,O[k],Oe[k]),ue=A?O[k]/2-z-M-de-C:Ee-M-de-C,Le=A?-O[k]/2+z+M+V+C:X+M+V+C,J=e.elements.arrow&&ce(e.elements.arrow),Ce=J?u==="y"?J.clientTop||0:J.clientLeft||0:0,We=e.modifiersData.offset?e.modifiersData.offset[e.placement][u]:0,Ie=w[u]+ue-We-Ce,_e=w[u]+Le-We;if(i){var He=we(v?ae(Z,Ie):Z,F,v?H(U,_e):U);w[u]=He,S[u]=He-F}if(o){var wt=u==="x"?T:P,At=u==="x"?$:D,fe=w[L],Ne=fe+b[wt],Fe=fe-b[At],ze=we(v?ae(Ne,Ie):Ne,fe,v?H(Fe,_e):Fe);w[L]=ze,S[L]=ze-fe}}e.modifiersData[a]=S}}const Tr={name:"preventOverflow",enabled:!0,phase:"main",fn:Sr,requiresIfExists:["offset"]};function Pr(t){return{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}}function $r(t){return t===B(t)||!q(t)?je(t):Pr(t)}function Dr(t,e,r){r===void 0&&(r=!1);var a=N(e),n=Q(t),i=q(e),s={scrollLeft:0,scrollTop:0},o={x:0,y:0};return(i||!i&&!r)&&((W(e)!=="body"||Re(a))&&(s=$r(e)),q(e)?(o=Q(e),o.x+=e.clientLeft,o.y+=e.clientTop):a&&(o.x=Me(a))),{x:n.left+s.scrollLeft-o.x,y:n.top+s.scrollTop-o.y,width:n.width,height:n.height}}function qr(t){var e=new Map,r=new Set,a=[];t.forEach(function(i){e.set(i.name,i)});function n(i){r.add(i.name);var s=[].concat(i.requires||[],i.requiresIfExists||[]);s.forEach(function(o){if(!r.has(o)){var l=e.get(o);l&&n(l)}}),a.push(i)}return t.forEach(function(i){r.has(i.name)||n(i)}),a}function Br(t){var e=qr(t);return Xt.reduce(function(r,a){return r.concat(e.filter(function(n){return n.phase===a}))},[])}function jr(t){var e;return function(){return e||(e=new Promise(function(r){Promise.resolve().then(function(){e=void 0,r(t())})})),e}}function Mr(t){var e=t.reduce(function(r,a){var n=r[a.name];return r[a.name]=n?Object.assign({},n,a,{options:Object.assign({},n.options,a.options),data:Object.assign({},n.data,a.data)}):a,r},{});return Object.keys(e).map(function(r){return e[r]})}var tt={placement:"bottom",modifiers:[],strategy:"absolute"};function rt(){for(var t=arguments.length,e=new Array(t),r=0;r<t;r++)e[r]=arguments[r];return!e.some(function(a){return!(a&&typeof a.getBoundingClientRect=="function")})}function Rr(t){t===void 0&&(t={});var e=t,r=e.defaultModifiers,a=r===void 0?[]:r,n=e.defaultOptions,i=n===void 0?tt:n;return function(o,l,d){d===void 0&&(d=i);var c={placement:"bottom",orderedModifiers:[],options:Object.assign({},tt,i),modifiersData:{},elements:{reference:o,popper:l},attributes:{},styles:{}},p=[],f=!1,v={state:c,setOptions:function(h){g(),c.options=Object.assign({},i,c.options,h),c.scrollParents={reference:ne(o)?re(o):o.contextElement?re(o.contextElement):[],popper:re(l)};var y=Br(Mr([].concat(a,c.options.modifiers)));return c.orderedModifiers=y.filter(function(A){return A.enabled}),m(),v.update()},forceUpdate:function(){if(!f){var h=c.elements,y=h.reference,A=h.popper;if(rt(y,A)){c.rects={reference:Dr(y,ce(A),c.options.strategy==="fixed"),popper:qe(A)},c.reset=!1,c.placement=c.options.placement,c.orderedModifiers.forEach(function(S){return c.modifiersData[S.name]=Object.assign({},S.data)});for(var u=0;u<c.orderedModifiers.length;u++){if(c.reset===!0){c.reset=!1,u=-1;continue}var L=c.orderedModifiers[u],w=L.fn,O=L.options,x=O===void 0?{}:O,C=L.name;typeof w=="function"&&(c=w({state:c,options:x,name:C,instance:v})||c)}}}},update:jr(function(){return new Promise(function(b){v.forceUpdate(),b(c)})}),destroy:function(){g(),f=!0}};if(!rt(o,l))return v;v.setOptions(d).then(function(b){!f&&d.onFirstUpdate&&d.onFirstUpdate(b)});function m(){c.orderedModifiers.forEach(function(b){var h=b.name,y=b.options,A=y===void 0?{}:y,u=b.effect;if(typeof u=="function"){var L=u({state:c,name:h,instance:v,options:A}),w=function(){};p.push(L||w)}})}function g(){p.forEach(function(b){return b()}),p=[]}return v}}var Wr=[cr,Cr,ir,Kt,Or,yr,Tr,rr,Ar],Ir=Rr({defaultModifiers:Wr});const _r=parseInt(it.baseline.$value,10),Hr="js-mds-popover-trigger",ge="mds-popover--active",te={init:()=>{Array.from(document.querySelectorAll(`.${Hr}`)).forEach(e=>{const a=`${e.getAttribute("id")}-content`,n=document.getElementById(a),i=n.dataset?n.dataset.placement:null,s=Ir(e,n,{placement:i||"top-end",strategy:"fixed",modifiers:[{name:"offset",options:{offset:[0,_r*3]}},{name:"arrow",options:{padding:5}}]});e.setAttribute("aria-expanded","false"),n.setAttribute("aria-hidden","true"),e.addEventListener("click",o=>{o.preventDefault(),s.update(),n.classList.toggle(ge),te.setAriaAttr(e,n,ge)}),document.addEventListener("mousedown",o=>{te.hide(e,n,s,ge,o)}),document.addEventListener("keydown",o=>{te.hide(e,n,s,ge,o)})})},hide:(t,e,r,a,n)=>{!t.contains(n.target)&&!r.state.elements.popper.contains(n.target)&&e.classList.contains(a)&&(e.classList.remove(a),te.setAriaAttr(t,e,a))},setAriaAttr:(t,e,r)=>{e.classList.contains(r)?(t.setAttribute("aria-expanded","true"),e.removeAttribute("aria-hidden")):(t.setAttribute("aria-expanded","false"),e.setAttribute("aria-hidden","true"))}},Nr=parseInt(st.size.breakpoint.md.$value,10),nt="data-modal-id",at="mds-modal--active",Fr="js-mds-modal-close";let ye;const K={init:()=>{window.innerWidth>Nr&&Array.from(document.querySelectorAll(`[${nt}]`)).forEach(r=>{const a=r.getAttribute(nt),n=document.getElementById(a),i=Array.from(n.querySelectorAll(`.${Fr}`)),s=n.getAttribute("data-site-container"),o=document.getElementById(s);let d=n.querySelectorAll('a[href], area[href], input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex="0"], [contenteditable]');d=Array.prototype.slice.call(d);const c=d[0],p=d[d.length-1];r.addEventListener("click",f=>{f.preventDefault(),K.open(n,c,o)}),n.addEventListener("click",f=>{f.target===n&&K.close(n,ye,o)}),n.addEventListener("keydown",f=>{K.trapFocus(f,c,p),(f.key==="Escape"||f.key==="Esc")&&K.close(n,ye,o)}),i.forEach(f=>{f.addEventListener("click",()=>{K.close(n,ye,o)})})})},open:(t,e,r)=>{ye=document.activeElement,t.classList.add(at),e.focus(),r.setAttribute("aria-hidden","true")},close:(t,e,r)=>{r.removeAttribute("aria-hidden"),t.classList.remove(at),e.focus()},trapFocus:(t,e,r)=>{t.key==="Tab"&&(t.shiftKey?document.activeElement===e&&(t.preventDefault(),r.focus()):document.activeElement===r&&(t.preventDefault(),e.focus()))}},zr=".mds-form-element--file",ke="mds-form-element--selected-file",ot="mds-form-element--dragover",Vr=".mds-file-upload__file-name",Ur=".mds-file-upload__remove-button",Xr="mds-form-element--file-supported",gt={init:()=>{gt.isBrowserIE()||Array.from(document.querySelectorAll(zr)).forEach(e=>{e.classList.add(Xr);const r=e.querySelector(Vr),a=e.querySelector("input[type=file]"),n=e.querySelector(Ur);document.addEventListener("readystatechange",()=>{a.files&&a.files.length&&(r.textContent=a.files[0].name,e.classList.add(ke))}),a.addEventListener("change",()=>{a.files&&a.files.length&&(r.textContent=a.files[0].name,e.classList.add(ke),n.focus())}),n.addEventListener("click",i=>{i.preventDefault(),a.value="",r.textContent="",e.classList.remove(ke),a.focus()}),["dragover","dragenter"].forEach(i=>{a.addEventListener(i,s=>{s.stopPropagation(),e.classList.add(ot)})}),["dragleave","dragend","drop"].forEach(i=>{a.addEventListener(i,s=>{s.stopPropagation(),e.classList.remove(ot)})})})},isBrowserIE:()=>!!window.document.documentMode},Yr=".mds-form-element--character-count",Jr=".mds-form-message--character-count",Kr=".js-character-count-number",Gr=".mds-form-control",Te={init:()=>{Array.from(document.querySelectorAll(Yr)).forEach(e=>{const r=e.querySelector(Gr),a=r.getAttribute("maxlength"),n=e.querySelector(Jr),i=e.querySelector(Kr);r.removeAttribute("maxlength"),Te.updateCounter(r,a,i,n),r.addEventListener("keyup",s=>{s.stopPropagation(),Te.updateCounter(r,a,i,n)})})},updateCounter:(t,e,r,a)=>{const n=t.value.match(/(\r\n|\n|\r)/g),i=t.value.length+(n?n.length:0),s=e-i;r.textContent=s,s<0?a.classList.add("mds-form-message--error"):a.classList.remove("mds-form-message--error")}},Qr="js-mds-button-double-submit",yt={init:()=>{Array.from(document.querySelectorAll(`.${Qr}`)).forEach(e=>{e.addEventListener("click",()=>{yt.toggleDisable(e)})})},toggleDisable:t=>{setTimeout(()=>{t.setAttribute("disabled","")},1),setTimeout(()=>{t.removeAttribute("disabled")},1e3)}},Zr={setFluidVideos:()=>{Array.from(document.querySelectorAll(".mds-prose iframe, .mds-prose embed, .mds-prose object")).forEach(e=>{const r=document.createElement("div");r.classList.add("mds-fluid-video"),r.innerHTML=e.outerHTML,e.replaceWith(r)})}};class en extends HTMLElement{connectedCallback(){const r=this.querySelector(".mds-card-link__link");let a;this.onmousedown=()=>{a=+new Date},this.onmouseup=()=>{+new Date-a<200&&r.click(),a=void 0}}disconnectedCallback(){this.onmousedown=this.onmouseup=null}}window.customElements.get("mds-dropdown-nav")||window.customElements.define("mds-dropdown-nav",xt);window.customElements.get("mds-timeout-dialog")||window.customElements.define("mds-timeout-dialog",Et);window.customElements.get("mds-card-link")||window.customElements.define("mds-card-link",en);const Pe=()=>{E.init(),ct.init(),Dt.init(),jt.init(),K.init(),gt.init(),Te.init(),te.init(),yt.init(),Zr.setFluidVideos()};window.mdgxInitAll=Pe;document.readyState==="loading"?document.addEventListener("DOMContentLoaded",Pe):Pe();
|
|
1
|
+
import{M as xt}from"./dropdown-nav-B37nBO1_.js";import{M as Et}from"./timeout-dialog-plrFUmdZ.js";window.addEventListener("hashchange",()=>{const t=window.location.hash.trim();Array.from(document.querySelectorAll(`a[href='${t}']`)).forEach(r=>{r.click()})},!1);const it={baseline:{$value:"4px"},breakpoint:{md:{$value:"600px"},lg:{$value:"1008px"}}},st={size:it},Ot="js-tabs-item",Ve="mds-tabs",Lt="mds-tabs__list",Ct="mds-tabs__list-item",Ue="mds-tabs__panel",pe="mds-tabs__tab",ve="mds-tabs__tab--selected",Xe="mds-tabs__panel--hidden",me={left:37,right:39,up:38,down:40},kt=".js-desktop-tabbed",St=".js-full-tabbed",Tt=parseInt(st.size.breakpoint.lg.$value,10),E={init:()=>{E.setTabs(St),window.innerWidth>Tt&&E.setTabs(kt)},setTabs:t=>{const e=Array.from(document.querySelectorAll(`${t} .${pe}`)),r=Array.from(document.querySelectorAll(`${t} .${Lt}`)),a=Array.from(document.querySelectorAll(`${t} .${Ct}`)),n=Array.from(document.querySelectorAll(`${t} .${Ue}`));r.forEach(o=>{o.setAttribute("role","tablist")}),a.forEach(o=>{o.setAttribute("role","presentation")}),e.forEach(o=>{o.setAttribute("role","tab"),o.setAttribute("aria-controls",o.attributes.href.value.substring(1)),o.classList.contains(ve)?o.setAttribute("tabindex","0"):o.setAttribute("tabindex","-1")}),n.forEach(o=>{o.setAttribute("role","tabpanel"),o.setAttribute("aria-labelledby",`label-${o.attributes.id.value}`)});const i=document.querySelectorAll(`${t} .${Ot}`);Array.from(i).forEach(o=>{const l=window.location.hash.trim(),d=o.attributes.href.value,c=o.closest(`.${Ve}`),p=E.getAllPanels(c),f=E.getAllTabs(c),v=E.getTargetPanel(o,c);o.addEventListener("click",m=>{m.preventDefault(),E.updateTabs(f,p,o,v,d)}),d===l&&E.updateTabs(f,p,o,v,d)}),r.forEach(o=>{const l=o.closest(`.${Ve}`),d=E.getAllPanels(l),c=E.getAllTabs(l);o.addEventListener("keydown",p=>{switch(p.keyCode){case me.left:case me.up:p.preventDefault(),E.moveTab(o,l,c,d,!1);break;case me.right:case me.down:p.preventDefault(),E.moveTab(o,l,c,d,!0);break}})})},getSelectedTab:t=>t.querySelector(`.${ve}`),getPrevTab:t=>t.parentElement.previousSibling?t.parentElement.previousSibling.querySelector(`.${pe}`):!1,getNextTab:t=>t.parentElement.nextSibling?t.parentElement.nextSibling.querySelector(`.${pe}`):!1,getTargetPanel:(t,e)=>{const r=t.attributes.href.value;return e.querySelector(r)},getAllPanels:t=>Array.from(t.querySelectorAll(`.${Ue}`)),getAllTabs:t=>Array.from(t.querySelectorAll(`.${pe}`)),moveTab:(t,e,r,a,n)=>{const i=E.getSelectedTab(t),s=n?E.getNextTab(i):E.getPrevTab(i);if(s){const o=s.attributes.href.value,l=E.getTargetPanel(s,e);E.updateTabs(r,a,s,l,o,!1)}},updateTabs:(t,e,r,a,n)=>{E.clearAllTabs(t),E.setActiveTab(r),E.clearAllPanels(e),E.setActivePanel(a,n)},clearAllTabs:t=>{t.forEach(e=>{e.classList.remove(ve),e.setAttribute("aria-selected","false"),e.setAttribute("tabindex","-1")})},clearAllPanels:t=>{t.forEach(e=>{e.classList.add(Xe)})},setActiveTab:t=>{t.classList.add(ve),t.setAttribute("aria-selected","true"),t.setAttribute("tabindex","0"),t.focus()},setActivePanel:(t,e)=>{t.classList.remove(Xe),window.history.replaceState({},"",e)}},Pt="mds-accordion--breakpoint",$t="mds-accordion__label",ct={init:()=>{const t=document.querySelectorAll(`.${Pt}`),e=window.innerWidth;t.forEach(a=>{ct.checkBreakpoint(a,e)||(a.open=!0,a.querySelector("summary").style.display="none")}),document.querySelectorAll(`.${$t}`).forEach(a=>{a.addEventListener("click",({target:n})=>{const i=n.closest("details"),s=i.querySelector("summary");i.open=!1,s.focus()})})},checkBreakpoint:(t,e)=>{let r=0;if(t.dataset.bp){const a=t.dataset.bp.replace(/\D/g,""),n=t.dataset.bp.replace(/[0-9]/g,"");let i,s;switch(n){case"px":r=a;break;case"em":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=a*parseFloat(i),r=s;break;case"rem":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=a*parseFloat(i),r=s;break;default:return!0}return!(e>r)}return!0}},Dt={init:()=>{const t=document.querySelectorAll(".mds-subnavigation"),e=[];let r;t.forEach(n=>{const i=n.querySelector(".mds-subnavigation__link-list"),s=Array.from(i.children),o=s[0],l=n.querySelector(".mds-subnavigation__mobile-title"),d=n.querySelector(".mds-subnavigation__drawer"),c=n.querySelector(".mds-subnavigation__drawer-label"),p=n.querySelector(".mds-subnavigation__drawer-label-text"),f=n.querySelector(".mds-subnavigation__drawer-content"),v=d.dataset.label,m=d.dataset.labelPlural;c.addEventListener("click",()=>{c.getAttribute("aria-expanded")==="true"?c.setAttribute("aria-expanded","false"):c.setAttribute("aria-expanded","true")}),d.addEventListener("focusout",b=>{d.contains(b.relatedTarget)||c.setAttribute("aria-expanded","false")});const g=()=>i.clientHeight>o.offsetHeight;e.push(()=>{c.setAttribute("aria-expanded","false"),window.getComputedStyle(l).getPropertyValue("display")==="none"?(s.forEach(h=>{i.append(h)}),d.style.display="none",g()&&(d.style.display="list-item",s.slice().reverse().forEach(h=>{if(g()&&h!==d){f.prepend(h);const y=Array.from(f.children).length,A=y>1?m:v;p.innerText=A.replace("{count}",y)}else i.prepend(h)}),f.style.width=`${i.offsetWidth-d.offsetLeft}px`)):(s.forEach(h=>{h!==d&&h!==l&&f.append(h)}),f.style.width="initial",d.style.display="block")})});const a=()=>{e.forEach(n=>{n()})};a(),window.onresize=()=>{clearTimeout(r),r=setTimeout(a,100)}}},qt="mds-checkbox-accordion__button",Bt="mds-checkbox-accordion__button--open",jt={init:()=>{document.querySelectorAll(`.${qt}`).forEach(e=>{e.classList.contains(Bt)?e.setAttribute("aria-expanded","true"):e.setAttribute("aria-expanded","false"),e.addEventListener("click",()=>{e.getAttribute("aria-expanded")==="true"?e.setAttribute("aria-expanded","false"):e.setAttribute("aria-expanded","true")})})}};var T="top",$="bottom",D="right",P="left",$e="auto",se=[T,$,D,P],G="start",De="end",Mt="clippingParents",lt="viewport",ee="popper",Rt="reference",Ye=se.reduce(function(t,e){return t.concat([e+"-"+G,e+"-"+De])},[]),dt=[].concat(se,[$e]).reduce(function(t,e){return t.concat([e,e+"-"+G,e+"-"+De])},[]),Wt="beforeRead",It="read",_t="afterRead",Ht="beforeMain",Nt="main",Ft="afterMain",zt="beforeWrite",Vt="write",Ut="afterWrite",Xt=[Wt,It,_t,Ht,Nt,Ft,zt,Vt,Ut];function W(t){return t?(t.nodeName||"").toLowerCase():null}function B(t){if(t==null)return window;if(t.toString()!=="[object Window]"){var e=t.ownerDocument;return e&&e.defaultView||window}return t}function ne(t){var e=B(t).Element;return t instanceof e||t instanceof Element}function q(t){var e=B(t).HTMLElement;return t instanceof e||t instanceof HTMLElement}function ut(t){if(typeof ShadowRoot>"u")return!1;var e=B(t).ShadowRoot;return t instanceof e||t instanceof ShadowRoot}function Yt(t){var e=t.state;Object.keys(e.elements).forEach(function(r){var a=e.styles[r]||{},n=e.attributes[r]||{},i=e.elements[r];!q(i)||!W(i)||(Object.assign(i.style,a),Object.keys(n).forEach(function(s){var o=n[s];o===!1?i.removeAttribute(s):i.setAttribute(s,o===!0?"":o)}))})}function Jt(t){var e=t.state,r={popper:{position:e.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(e.elements.popper.style,r.popper),e.styles=r,e.elements.arrow&&Object.assign(e.elements.arrow.style,r.arrow),function(){Object.keys(e.elements).forEach(function(a){var n=e.elements[a],i=e.attributes[a]||{},s=Object.keys(e.styles.hasOwnProperty(a)?e.styles[a]:r[a]),o=s.reduce(function(l,d){return l[d]="",l},{});!q(n)||!W(n)||(Object.assign(n.style,o),Object.keys(i).forEach(function(l){n.removeAttribute(l)}))})}}const Kt={name:"applyStyles",enabled:!0,phase:"write",fn:Yt,effect:Jt,requires:["computeStyles"]};function R(t){return t.split("-")[0]}function Q(t){var e=t.getBoundingClientRect();return{width:e.width,height:e.height,top:e.top,right:e.right,bottom:e.bottom,left:e.left,x:e.left,y:e.top}}function qe(t){var e=Q(t),r=t.offsetWidth,a=t.offsetHeight;return Math.abs(e.width-r)<=1&&(r=e.width),Math.abs(e.height-a)<=1&&(a=e.height),{x:t.offsetLeft,y:t.offsetTop,width:r,height:a}}function ft(t,e){var r=e.getRootNode&&e.getRootNode();if(t.contains(e))return!0;if(r&&ut(r)){var a=e;do{if(a&&t.isSameNode(a))return!0;a=a.parentNode||a.host}while(a)}return!1}function _(t){return B(t).getComputedStyle(t)}function Gt(t){return["table","td","th"].indexOf(W(t))>=0}function N(t){return((ne(t)?t.ownerDocument:t.document)||window.document).documentElement}function xe(t){return W(t)==="html"?t:t.assignedSlot||t.parentNode||(ut(t)?t.host:null)||N(t)}function Je(t){return!q(t)||_(t).position==="fixed"?null:t.offsetParent}function Qt(t){var e=navigator.userAgent.toLowerCase().indexOf("firefox")!==-1,r=navigator.userAgent.indexOf("Trident")!==-1;if(r&&q(t)){var a=_(t);if(a.position==="fixed")return null}for(var n=xe(t);q(n)&&["html","body"].indexOf(W(n))<0;){var i=_(n);if(i.transform!=="none"||i.perspective!=="none"||i.contain==="paint"||["transform","perspective"].indexOf(i.willChange)!==-1||e&&i.willChange==="filter"||e&&i.filter&&i.filter!=="none")return n;n=n.parentNode}return null}function ce(t){for(var e=B(t),r=Je(t);r&&Gt(r)&&_(r).position==="static";)r=Je(r);return r&&(W(r)==="html"||W(r)==="body"&&_(r).position==="static")?e:r||Qt(t)||e}function Be(t){return["top","bottom"].indexOf(t)>=0?"x":"y"}var H=Math.max,ae=Math.min,be=Math.round;function we(t,e,r){return H(t,ae(e,r))}function pt(){return{top:0,right:0,bottom:0,left:0}}function vt(t){return Object.assign({},pt(),t)}function mt(t,e){return e.reduce(function(r,a){return r[a]=t,r},{})}var Zt=function(e,r){return e=typeof e=="function"?e(Object.assign({},r.rects,{placement:r.placement})):e,vt(typeof e!="number"?e:mt(e,se))};function er(t){var e,r=t.state,a=t.name,n=t.options,i=r.elements.arrow,s=r.modifiersData.popperOffsets,o=R(r.placement),l=Be(o),d=[P,D].indexOf(o)>=0,c=d?"height":"width";if(!(!i||!s)){var p=Zt(n.padding,r),f=qe(i),v=l==="y"?T:P,m=l==="y"?$:D,g=r.rects.reference[c]+r.rects.reference[l]-s[l]-r.rects.popper[c],b=s[l]-r.rects.reference[l],h=ce(i),y=h?l==="y"?h.clientHeight||0:h.clientWidth||0:0,A=g/2-b/2,u=p[v],L=y-f[c]-p[m],w=y/2-f[c]/2+A,O=we(u,w,L),x=l;r.modifiersData[a]=(e={},e[x]=O,e.centerOffset=O-w,e)}}function tr(t){var e=t.state,r=t.options,a=r.element,n=a===void 0?"[data-popper-arrow]":a;n!=null&&(typeof n=="string"&&(n=e.elements.popper.querySelector(n),!n)||ft(e.elements.popper,n)&&(e.elements.arrow=n))}const rr={name:"arrow",enabled:!0,phase:"main",fn:er,effect:tr,requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};var nr={top:"auto",right:"auto",bottom:"auto",left:"auto"};function ar(t){var e=t.x,r=t.y,a=window,n=a.devicePixelRatio||1;return{x:be(be(e*n)/n)||0,y:be(be(r*n)/n)||0}}function Ke(t){var e,r=t.popper,a=t.popperRect,n=t.placement,i=t.offsets,s=t.position,o=t.gpuAcceleration,l=t.adaptive,d=t.roundOffsets,c=d===!0?ar(i):typeof d=="function"?d(i):i,p=c.x,f=p===void 0?0:p,v=c.y,m=v===void 0?0:v,g=i.hasOwnProperty("x"),b=i.hasOwnProperty("y"),h=P,y=T,A=window;if(l){var u=ce(r),L="clientHeight",w="clientWidth";u===B(r)&&(u=N(r),_(u).position!=="static"&&(L="scrollHeight",w="scrollWidth")),u=u,n===T&&(y=$,m-=u[L]-a.height,m*=o?1:-1),n===P&&(h=D,f-=u[w]-a.width,f*=o?1:-1)}var O=Object.assign({position:s},l&&nr);if(o){var x;return Object.assign({},O,(x={},x[y]=b?"0":"",x[h]=g?"0":"",x.transform=(A.devicePixelRatio||1)<2?"translate("+f+"px, "+m+"px)":"translate3d("+f+"px, "+m+"px, 0)",x))}return Object.assign({},O,(e={},e[y]=b?m+"px":"",e[h]=g?f+"px":"",e.transform="",e))}function or(t){var e=t.state,r=t.options,a=r.gpuAcceleration,n=a===void 0?!0:a,i=r.adaptive,s=i===void 0?!0:i,o=r.roundOffsets,l=o===void 0?!0:o,d={placement:R(e.placement),popper:e.elements.popper,popperRect:e.rects.popper,gpuAcceleration:n};e.modifiersData.popperOffsets!=null&&(e.styles.popper=Object.assign({},e.styles.popper,Ke(Object.assign({},d,{offsets:e.modifiersData.popperOffsets,position:e.options.strategy,adaptive:s,roundOffsets:l})))),e.modifiersData.arrow!=null&&(e.styles.arrow=Object.assign({},e.styles.arrow,Ke(Object.assign({},d,{offsets:e.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:l})))),e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-placement":e.placement})}const ir={name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:or,data:{}};var he={passive:!0};function sr(t){var e=t.state,r=t.instance,a=t.options,n=a.scroll,i=n===void 0?!0:n,s=a.resize,o=s===void 0?!0:s,l=B(e.elements.popper),d=[].concat(e.scrollParents.reference,e.scrollParents.popper);return i&&d.forEach(function(c){c.addEventListener("scroll",r.update,he)}),o&&l.addEventListener("resize",r.update,he),function(){i&&d.forEach(function(c){c.removeEventListener("scroll",r.update,he)}),o&&l.removeEventListener("resize",r.update,he)}}const cr={name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:sr,data:{}};var lr={left:"right",right:"left",bottom:"top",top:"bottom"};function Ae(t){return t.replace(/left|right|bottom|top/g,function(e){return lr[e]})}var dr={start:"end",end:"start"};function Ge(t){return t.replace(/start|end/g,function(e){return dr[e]})}function je(t){var e=B(t),r=e.pageXOffset,a=e.pageYOffset;return{scrollLeft:r,scrollTop:a}}function Me(t){return Q(N(t)).left+je(t).scrollLeft}function ur(t){var e=B(t),r=N(t),a=e.visualViewport,n=r.clientWidth,i=r.clientHeight,s=0,o=0;return a&&(n=a.width,i=a.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(s=a.offsetLeft,o=a.offsetTop)),{width:n,height:i,x:s+Me(t),y:o}}function fr(t){var e,r=N(t),a=je(t),n=(e=t.ownerDocument)==null?void 0:e.body,i=H(r.scrollWidth,r.clientWidth,n?n.scrollWidth:0,n?n.clientWidth:0),s=H(r.scrollHeight,r.clientHeight,n?n.scrollHeight:0,n?n.clientHeight:0),o=-a.scrollLeft+Me(t),l=-a.scrollTop;return _(n||r).direction==="rtl"&&(o+=H(r.clientWidth,n?n.clientWidth:0)-i),{width:i,height:s,x:o,y:l}}function Re(t){var e=_(t),r=e.overflow,a=e.overflowX,n=e.overflowY;return/auto|scroll|overlay|hidden/.test(r+n+a)}function bt(t){return["html","body","#document"].indexOf(W(t))>=0?t.ownerDocument.body:q(t)&&Re(t)?t:bt(xe(t))}function re(t,e){var r;e===void 0&&(e=[]);var a=bt(t),n=a===((r=t.ownerDocument)==null?void 0:r.body),i=B(a),s=n?[i].concat(i.visualViewport||[],Re(a)?a:[]):a,o=e.concat(s);return n?o:o.concat(re(xe(s)))}function Se(t){return Object.assign({},t,{left:t.x,top:t.y,right:t.x+t.width,bottom:t.y+t.height})}function pr(t){var e=Q(t);return e.top=e.top+t.clientTop,e.left=e.left+t.clientLeft,e.bottom=e.top+t.clientHeight,e.right=e.left+t.clientWidth,e.width=t.clientWidth,e.height=t.clientHeight,e.x=e.left,e.y=e.top,e}function Qe(t,e){return e===lt?Se(ur(t)):q(e)?pr(e):Se(fr(N(t)))}function vr(t){var e=re(xe(t)),r=["absolute","fixed"].indexOf(_(t).position)>=0,a=r&&q(t)?ce(t):t;return ne(a)?e.filter(function(n){return ne(n)&&ft(n,a)&&W(n)!=="body"}):[]}function mr(t,e,r){var a=e==="clippingParents"?vr(t):[].concat(e),n=[].concat(a,[r]),i=n[0],s=n.reduce(function(o,l){var d=Qe(t,l);return o.top=H(d.top,o.top),o.right=ae(d.right,o.right),o.bottom=ae(d.bottom,o.bottom),o.left=H(d.left,o.left),o},Qe(t,i));return s.width=s.right-s.left,s.height=s.bottom-s.top,s.x=s.left,s.y=s.top,s}function oe(t){return t.split("-")[1]}function ht(t){var e=t.reference,r=t.element,a=t.placement,n=a?R(a):null,i=a?oe(a):null,s=e.x+e.width/2-r.width/2,o=e.y+e.height/2-r.height/2,l;switch(n){case T:l={x:s,y:e.y-r.height};break;case $:l={x:s,y:e.y+e.height};break;case D:l={x:e.x+e.width,y:o};break;case P:l={x:e.x-r.width,y:o};break;default:l={x:e.x,y:e.y}}var d=n?Be(n):null;if(d!=null){var c=d==="y"?"height":"width";switch(i){case G:l[d]=l[d]-(e[c]/2-r[c]/2);break;case De:l[d]=l[d]+(e[c]/2-r[c]/2);break}}return l}function ie(t,e){e===void 0&&(e={});var r=e,a=r.placement,n=a===void 0?t.placement:a,i=r.boundary,s=i===void 0?Mt:i,o=r.rootBoundary,l=o===void 0?lt:o,d=r.elementContext,c=d===void 0?ee:d,p=r.altBoundary,f=p===void 0?!1:p,v=r.padding,m=v===void 0?0:v,g=vt(typeof m!="number"?m:mt(m,se)),b=c===ee?Rt:ee,h=t.elements.reference,y=t.rects.popper,A=t.elements[f?b:c],u=mr(ne(A)?A:A.contextElement||N(t.elements.popper),s,l),L=Q(h),w=ht({reference:L,element:y,placement:n}),O=Se(Object.assign({},y,w)),x=c===ee?O:L,C={top:u.top-x.top+g.top,bottom:x.bottom-u.bottom+g.bottom,left:u.left-x.left+g.left,right:x.right-u.right+g.right},S=t.modifiersData.offset;if(c===ee&&S){var j=S[n];Object.keys(C).forEach(function(I){var k=[D,$].indexOf(I)>=0?1:-1,F=[T,$].indexOf(I)>=0?"y":"x";C[I]+=j[F]*k})}return C}function br(t,e){e===void 0&&(e={});var r=e,a=r.placement,n=r.boundary,i=r.rootBoundary,s=r.padding,o=r.flipVariations,l=r.allowedAutoPlacements,d=l===void 0?dt:l,c=oe(a),p=c?o?Ye:Ye.filter(function(m){return oe(m)===c}):se,f=p.filter(function(m){return d.indexOf(m)>=0});f.length===0&&(f=p);var v=f.reduce(function(m,g){return m[g]=ie(t,{placement:g,boundary:n,rootBoundary:i,padding:s})[R(g)],m},{});return Object.keys(v).sort(function(m,g){return v[m]-v[g]})}function hr(t){if(R(t)===$e)return[];var e=Ae(t);return[Ge(t),e,Ge(e)]}function gr(t){var e=t.state,r=t.options,a=t.name;if(!e.modifiersData[a]._skip){for(var n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,o=s===void 0?!0:s,l=r.fallbackPlacements,d=r.padding,c=r.boundary,p=r.rootBoundary,f=r.altBoundary,v=r.flipVariations,m=v===void 0?!0:v,g=r.allowedAutoPlacements,b=e.options.placement,h=R(b),y=h===b,A=l||(y||!m?[Ae(b)]:hr(b)),u=[b].concat(A).reduce(function(V,M){return V.concat(R(M)===$e?br(e,{placement:M,boundary:c,rootBoundary:p,padding:d,flipVariations:m,allowedAutoPlacements:g}):M)},[]),L=e.rects.reference,w=e.rects.popper,O=new Map,x=!0,C=u[0],S=0;S<u.length;S++){var j=u[S],I=R(j),k=oe(j)===G,F=[T,$].indexOf(I)>=0,Z=F?"width":"height",U=ie(e,{placement:j,boundary:c,rootBoundary:p,altBoundary:f,padding:d}),z=F?k?D:P:k?$:T;L[Z]>w[Z]&&(z=Ae(z));var Ee=Ae(z),X=[];if(i&&X.push(U[I]<=0),o&&X.push(U[z]<=0,U[Ee]<=0),X.every(function(V){return V})){C=j,x=!1;break}O.set(j,X)}if(x)for(var le=m?3:1,Oe=function(M){var ue=u.find(function(Le){var J=O.get(Le);if(J)return J.slice(0,M).every(function(Ce){return Ce})});if(ue)return C=ue,"break"},Y=le;Y>0;Y--){var de=Oe(Y);if(de==="break")break}e.placement!==C&&(e.modifiersData[a]._skip=!0,e.placement=C,e.reset=!0)}}const yr={name:"flip",enabled:!0,phase:"main",fn:gr,requiresIfExists:["offset"],data:{_skip:!1}};function Ze(t,e,r){return r===void 0&&(r={x:0,y:0}),{top:t.top-e.height-r.y,right:t.right-e.width+r.x,bottom:t.bottom-e.height+r.y,left:t.left-e.width-r.x}}function et(t){return[T,D,$,P].some(function(e){return t[e]>=0})}function wr(t){var e=t.state,r=t.name,a=e.rects.reference,n=e.rects.popper,i=e.modifiersData.preventOverflow,s=ie(e,{elementContext:"reference"}),o=ie(e,{altBoundary:!0}),l=Ze(s,a),d=Ze(o,n,i),c=et(l),p=et(d);e.modifiersData[r]={referenceClippingOffsets:l,popperEscapeOffsets:d,isReferenceHidden:c,hasPopperEscaped:p},e.attributes.popper=Object.assign({},e.attributes.popper,{"data-popper-reference-hidden":c,"data-popper-escaped":p})}const Ar={name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:wr};function xr(t,e,r){var a=R(t),n=[P,T].indexOf(a)>=0?-1:1,i=typeof r=="function"?r(Object.assign({},e,{placement:t})):r,s=i[0],o=i[1];return s=s||0,o=(o||0)*n,[P,D].indexOf(a)>=0?{x:o,y:s}:{x:s,y:o}}function Er(t){var e=t.state,r=t.options,a=t.name,n=r.offset,i=n===void 0?[0,0]:n,s=dt.reduce(function(c,p){return c[p]=xr(p,e.rects,i),c},{}),o=s[e.placement],l=o.x,d=o.y;e.modifiersData.popperOffsets!=null&&(e.modifiersData.popperOffsets.x+=l,e.modifiersData.popperOffsets.y+=d),e.modifiersData[a]=s}const Or={name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:Er};function Lr(t){var e=t.state,r=t.name;e.modifiersData[r]=ht({reference:e.rects.reference,element:e.rects.popper,placement:e.placement})}const Cr={name:"popperOffsets",enabled:!0,phase:"read",fn:Lr,data:{}};function kr(t){return t==="x"?"y":"x"}function Sr(t){var e=t.state,r=t.options,a=t.name,n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,o=s===void 0?!1:s,l=r.boundary,d=r.rootBoundary,c=r.altBoundary,p=r.padding,f=r.tether,v=f===void 0?!0:f,m=r.tetherOffset,g=m===void 0?0:m,b=ie(e,{boundary:l,rootBoundary:d,padding:p,altBoundary:c}),h=R(e.placement),y=oe(e.placement),A=!y,u=Be(h),L=kr(u),w=e.modifiersData.popperOffsets,O=e.rects.reference,x=e.rects.popper,C=typeof g=="function"?g(Object.assign({},e.rects,{placement:e.placement})):g,S={x:0,y:0};if(w){if(i||o){var j=u==="y"?T:P,I=u==="y"?$:D,k=u==="y"?"height":"width",F=w[u],Z=w[u]+b[j],U=w[u]-b[I],z=v?-x[k]/2:0,Ee=y===G?O[k]:x[k],X=y===G?-x[k]:-O[k],le=e.elements.arrow,Oe=v&&le?qe(le):{width:0,height:0},Y=e.modifiersData["arrow#persistent"]?e.modifiersData["arrow#persistent"].padding:pt(),de=Y[j],V=Y[I],M=we(0,O[k],Oe[k]),ue=A?O[k]/2-z-M-de-C:Ee-M-de-C,Le=A?-O[k]/2+z+M+V+C:X+M+V+C,J=e.elements.arrow&&ce(e.elements.arrow),Ce=J?u==="y"?J.clientTop||0:J.clientLeft||0:0,We=e.modifiersData.offset?e.modifiersData.offset[e.placement][u]:0,Ie=w[u]+ue-We-Ce,_e=w[u]+Le-We;if(i){var He=we(v?ae(Z,Ie):Z,F,v?H(U,_e):U);w[u]=He,S[u]=He-F}if(o){var wt=u==="x"?T:P,At=u==="x"?$:D,fe=w[L],Ne=fe+b[wt],Fe=fe-b[At],ze=we(v?ae(Ne,Ie):Ne,fe,v?H(Fe,_e):Fe);w[L]=ze,S[L]=ze-fe}}e.modifiersData[a]=S}}const Tr={name:"preventOverflow",enabled:!0,phase:"main",fn:Sr,requiresIfExists:["offset"]};function Pr(t){return{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}}function $r(t){return t===B(t)||!q(t)?je(t):Pr(t)}function Dr(t,e,r){r===void 0&&(r=!1);var a=N(e),n=Q(t),i=q(e),s={scrollLeft:0,scrollTop:0},o={x:0,y:0};return(i||!i&&!r)&&((W(e)!=="body"||Re(a))&&(s=$r(e)),q(e)?(o=Q(e),o.x+=e.clientLeft,o.y+=e.clientTop):a&&(o.x=Me(a))),{x:n.left+s.scrollLeft-o.x,y:n.top+s.scrollTop-o.y,width:n.width,height:n.height}}function qr(t){var e=new Map,r=new Set,a=[];t.forEach(function(i){e.set(i.name,i)});function n(i){r.add(i.name);var s=[].concat(i.requires||[],i.requiresIfExists||[]);s.forEach(function(o){if(!r.has(o)){var l=e.get(o);l&&n(l)}}),a.push(i)}return t.forEach(function(i){r.has(i.name)||n(i)}),a}function Br(t){var e=qr(t);return Xt.reduce(function(r,a){return r.concat(e.filter(function(n){return n.phase===a}))},[])}function jr(t){var e;return function(){return e||(e=new Promise(function(r){Promise.resolve().then(function(){e=void 0,r(t())})})),e}}function Mr(t){var e=t.reduce(function(r,a){var n=r[a.name];return r[a.name]=n?Object.assign({},n,a,{options:Object.assign({},n.options,a.options),data:Object.assign({},n.data,a.data)}):a,r},{});return Object.keys(e).map(function(r){return e[r]})}var tt={placement:"bottom",modifiers:[],strategy:"absolute"};function rt(){for(var t=arguments.length,e=new Array(t),r=0;r<t;r++)e[r]=arguments[r];return!e.some(function(a){return!(a&&typeof a.getBoundingClientRect=="function")})}function Rr(t){t===void 0&&(t={});var e=t,r=e.defaultModifiers,a=r===void 0?[]:r,n=e.defaultOptions,i=n===void 0?tt:n;return function(o,l,d){d===void 0&&(d=i);var c={placement:"bottom",orderedModifiers:[],options:Object.assign({},tt,i),modifiersData:{},elements:{reference:o,popper:l},attributes:{},styles:{}},p=[],f=!1,v={state:c,setOptions:function(h){g(),c.options=Object.assign({},i,c.options,h),c.scrollParents={reference:ne(o)?re(o):o.contextElement?re(o.contextElement):[],popper:re(l)};var y=Br(Mr([].concat(a,c.options.modifiers)));return c.orderedModifiers=y.filter(function(A){return A.enabled}),m(),v.update()},forceUpdate:function(){if(!f){var h=c.elements,y=h.reference,A=h.popper;if(rt(y,A)){c.rects={reference:Dr(y,ce(A),c.options.strategy==="fixed"),popper:qe(A)},c.reset=!1,c.placement=c.options.placement,c.orderedModifiers.forEach(function(S){return c.modifiersData[S.name]=Object.assign({},S.data)});for(var u=0;u<c.orderedModifiers.length;u++){if(c.reset===!0){c.reset=!1,u=-1;continue}var L=c.orderedModifiers[u],w=L.fn,O=L.options,x=O===void 0?{}:O,C=L.name;typeof w=="function"&&(c=w({state:c,options:x,name:C,instance:v})||c)}}}},update:jr(function(){return new Promise(function(b){v.forceUpdate(),b(c)})}),destroy:function(){g(),f=!0}};if(!rt(o,l))return v;v.setOptions(d).then(function(b){!f&&d.onFirstUpdate&&d.onFirstUpdate(b)});function m(){c.orderedModifiers.forEach(function(b){var h=b.name,y=b.options,A=y===void 0?{}:y,u=b.effect;if(typeof u=="function"){var L=u({state:c,name:h,instance:v,options:A}),w=function(){};p.push(L||w)}})}function g(){p.forEach(function(b){return b()}),p=[]}return v}}var Wr=[cr,Cr,ir,Kt,Or,yr,Tr,rr,Ar],Ir=Rr({defaultModifiers:Wr});const _r=parseInt(it.baseline.$value,10),Hr="js-mds-popover-trigger",ge="mds-popover--active",te={init:()=>{Array.from(document.querySelectorAll(`.${Hr}`)).forEach(e=>{const a=`${e.getAttribute("id")}-content`,n=document.getElementById(a),i=n.dataset?n.dataset.placement:null,s=Ir(e,n,{placement:i||"top-end",strategy:"fixed",modifiers:[{name:"offset",options:{offset:[0,_r*3]}},{name:"arrow",options:{padding:5}}]});e.setAttribute("aria-expanded","false"),n.setAttribute("aria-hidden","true"),e.addEventListener("click",o=>{o.preventDefault(),s.update(),n.classList.toggle(ge),te.setAriaAttr(e,n,ge)}),document.addEventListener("mousedown",o=>{te.hide(e,n,s,ge,o)}),document.addEventListener("keydown",o=>{te.hide(e,n,s,ge,o)})})},hide:(t,e,r,a,n)=>{!t.contains(n.target)&&!r.state.elements.popper.contains(n.target)&&e.classList.contains(a)&&(e.classList.remove(a),te.setAriaAttr(t,e,a))},setAriaAttr:(t,e,r)=>{e.classList.contains(r)?(t.setAttribute("aria-expanded","true"),e.removeAttribute("aria-hidden")):(t.setAttribute("aria-expanded","false"),e.setAttribute("aria-hidden","true"))}},Nr=parseInt(st.size.breakpoint.md.$value,10),nt="data-modal-id",at="mds-modal--active",Fr="js-mds-modal-close";let ye;const K={init:()=>{window.innerWidth>Nr&&Array.from(document.querySelectorAll(`[${nt}]`)).forEach(r=>{const a=r.getAttribute(nt),n=document.getElementById(a),i=Array.from(n.querySelectorAll(`.${Fr}`)),s=n.getAttribute("data-site-container"),o=document.getElementById(s);let d=n.querySelectorAll('a[href], area[href], input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex="0"], [contenteditable]');d=Array.prototype.slice.call(d);const c=d[0],p=d[d.length-1];r.addEventListener("click",f=>{f.preventDefault(),K.open(n,c,o)}),n.addEventListener("click",f=>{f.target===n&&K.close(n,ye,o)}),n.addEventListener("keydown",f=>{K.trapFocus(f,c,p),(f.key==="Escape"||f.key==="Esc")&&K.close(n,ye,o)}),i.forEach(f=>{f.addEventListener("click",()=>{K.close(n,ye,o)})})})},open:(t,e,r)=>{ye=document.activeElement,t.classList.add(at),e.focus(),r.setAttribute("aria-hidden","true")},close:(t,e,r)=>{r.removeAttribute("aria-hidden"),t.classList.remove(at),e.focus()},trapFocus:(t,e,r)=>{t.key==="Tab"&&(t.shiftKey?document.activeElement===e&&(t.preventDefault(),r.focus()):document.activeElement===r&&(t.preventDefault(),e.focus()))}},zr=".mds-form-element--file",ke="mds-form-element--selected-file",ot="mds-form-element--dragover",Vr=".mds-file-upload__file-name",Ur=".mds-file-upload__remove-button",Xr="mds-form-element--file-supported",gt={init:()=>{gt.isBrowserIE()||Array.from(document.querySelectorAll(zr)).forEach(e=>{e.classList.add(Xr);const r=e.querySelector(Vr),a=e.querySelector("input[type=file]"),n=e.querySelector(Ur);document.addEventListener("readystatechange",()=>{a.files&&a.files.length&&(r.textContent=a.files[0].name,e.classList.add(ke))}),a.addEventListener("change",()=>{a.files&&a.files.length&&(r.textContent=a.files[0].name,e.classList.add(ke),n.focus())}),n.addEventListener("click",i=>{i.preventDefault(),a.value="",r.textContent="",e.classList.remove(ke),a.focus()}),["dragover","dragenter"].forEach(i=>{a.addEventListener(i,s=>{s.stopPropagation(),e.classList.add(ot)})}),["dragleave","dragend","drop"].forEach(i=>{a.addEventListener(i,s=>{s.stopPropagation(),e.classList.remove(ot)})})})},isBrowserIE:()=>!!window.document.documentMode},Yr=".mds-form-element--character-count",Jr=".mds-form-message--character-count",Kr=".js-character-count-number",Gr=".mds-form-control",Te={init:()=>{Array.from(document.querySelectorAll(Yr)).forEach(e=>{const r=e.querySelector(Gr),a=r.getAttribute("maxlength"),n=e.querySelector(Jr),i=e.querySelector(Kr);r.removeAttribute("maxlength"),Te.updateCounter(r,a,i,n),r.addEventListener("keyup",s=>{s.stopPropagation(),Te.updateCounter(r,a,i,n)})})},updateCounter:(t,e,r,a)=>{const n=t.value.match(/(\r\n|\n|\r)/g),i=t.value.length+(n?n.length:0),s=e-i;r.textContent=s,s<0?a.classList.add("mds-form-message--error"):a.classList.remove("mds-form-message--error")}},Qr="js-mds-button-double-submit",yt={init:()=>{Array.from(document.querySelectorAll(`.${Qr}`)).forEach(e=>{e.addEventListener("click",()=>{yt.toggleDisable(e)})})},toggleDisable:t=>{setTimeout(()=>{t.setAttribute("disabled","")},1),setTimeout(()=>{t.removeAttribute("disabled")},1e3)}},Zr={setFluidVideos:()=>{Array.from(document.querySelectorAll(".mds-prose iframe, .mds-prose embed, .mds-prose object")).forEach(e=>{const r=document.createElement("div");r.classList.add("mds-fluid-video"),r.innerHTML=e.outerHTML,e.replaceWith(r)})}};class en extends HTMLElement{connectedCallback(){const r=this.querySelector(".mds-card-link__link");let a;this.onmousedown=()=>{a=+new Date},this.onmouseup=()=>{+new Date-a<200&&r.click(),a=void 0}}disconnectedCallback(){this.onmousedown=this.onmouseup=null}}window.customElements.get("mds-dropdown-nav")||window.customElements.define("mds-dropdown-nav",xt);window.customElements.get("mds-timeout-dialog")||window.customElements.define("mds-timeout-dialog",Et);window.customElements.get("mds-card-link")||window.customElements.define("mds-card-link",en);const Pe=()=>{E.init(),ct.init(),Dt.init(),jt.init(),K.init(),gt.init(),Te.init(),te.init(),yt.init(),Zr.setFluidVideos()};window.mdgxInitAll=Pe;document.readyState==="loading"?document.addEventListener("DOMContentLoaded",Pe):Pe();
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
const e={NONE:"NONE",WARNING:"WARNING",TIMED_OUT:"TIMED_OUT"};class r extends HTMLElement{#t=e.NONE;#i;#s;static get observedAttributes(){return["t-title","t-title-timed-out","t-message","t-message-error-failed-refresh","t-btn-stay-refresh","t-btn-sign-out","t-btn-close","keep-alive-url","login-url","logout-url","warning-in-milliseconds","timeout-in-milliseconds"]}constructor(){super(),this.onClickSignInButton=this.onClickSignInButton.bind(this),this.onSignedOutDialogClose=this.onSignedOutDialogClose.bind(this),this.dialogIdWarning=`mds-timeout-dialog-warning-${window.crypto.randomUUID()}`,this.dialogIdSignedOut=`mds-timeout-dialog-signed-out-${window.crypto.randomUUID()}`}connectedCallback(){this.render(),this.update(e.NONE),this.#n()}disconnectedCallback(){this.#e(),this.removeEventListeners(),this.update(e.NONE)}attributeChangedCallback(t,i=null,s=null){if(!this.isConnected||i===s)return;["warning-in-milliseconds","timeout-in-milliseconds"].includes(t)?console.warn(`${t} was changed which may affect timeout accuracy`):(this.render(),this.update())}get rootNode(){return this}get#o(){return this.getRootNode({composed:!0})}get template(){const t=this.#o.createElement("template");return t.innerHTML=`
|
|
2
|
+
<dialog class="mds-timeout-dialog" role="alertdialog" closedby="none" aria-labelledby="${this.dialogIdWarning}">
|
|
3
|
+
<h2 class="mds-margin-bottom-b4" id="${this.dialogIdWarning}">${this.translations.title}</h2>
|
|
4
|
+
<p>${this.translations.message}</p>
|
|
5
|
+
<p class="mds-message mds-message--error mds-display-none">${this.translations["message-error-sign-in"]}</p>
|
|
6
|
+
<div class="mds-grid-row mds-grid-center">
|
|
7
|
+
<button class="mds-button mds-margin-right-b4" stay-signed-in-trigger type="button">
|
|
8
|
+
${this.translations["btn-stay-signed-in"]}
|
|
9
|
+
<svg class="mds-timeout-dialog__button-icon" viewBox="0 0 100 100">
|
|
10
|
+
<path
|
|
11
|
+
fill="currentColor"
|
|
12
|
+
d="M100 50c0-27.6-22.4-50-50-50S0 22.4 0 50m8.5 0C8.5 27.2 27 8.5 50 8.5S91.5 27.2 91.5 50"
|
|
13
|
+
></path>
|
|
14
|
+
</svg>
|
|
15
|
+
</button>
|
|
16
|
+
<a class="mds-button mds-button--neutral" href="${this.logoutUrl}">${this.translations["btn-sign-out"]}</a>
|
|
17
|
+
</div>
|
|
18
|
+
</dialog>
|
|
19
|
+
<dialog role="alertdialog" class="mds-timeout-dialog" aria-labelledby="${this.dialogIdSignedOut}">
|
|
20
|
+
<h2 class="mds-margin-bottom-b4" id="${this.dialogIdSignedOut}">${this.translations["title-signed-out"]}</h2>
|
|
21
|
+
<div class="mds-grid-row mds-grid-center">
|
|
22
|
+
<!-- will "submit" the dialog, e.g. close it without JS -->
|
|
23
|
+
<form method="dialog">
|
|
24
|
+
<button class="mds-button">${this.translations["btn-close"]}</button>
|
|
25
|
+
</form>
|
|
26
|
+
</div>
|
|
27
|
+
</dialog>
|
|
28
|
+
`,t}get elDialogWarning(){return this.rootNode.querySelector(`dialog[aria-labelledby=${this.dialogIdWarning}]`)}get elDialogSignedOut(){return this.rootNode.querySelector(`dialog[aria-labelledby=${this.dialogIdSignedOut}]`)}get elSignInButton(){return this.rootNode.querySelector("[stay-signed-in-trigger]")}get elMessageError(){return this.rootNode.querySelector(".mds-message--error")}get translations(){return{title:this.getAttribute("t-title")||"You are about to be signed out","title-signed-out":this.getAttribute("t-title-timed-out")||"You have been signed out",message:this.getAttribute("t-message")||"For your security, we will log you out in 2 minutes.","message-error-sign-in":this.getAttribute("t-message-error-failed-refresh")||"Failed to sign in - try again","btn-stay-signed-in":this.getAttribute("t-btn-stay-refresh")||"Stay signed in","btn-sign-out":this.getAttribute("t-btn-sign-out")||"Sign out","btn-close":this.getAttribute("t-btn-close")||"close"}}get keepAliveUrl(){return this.getAttribute("keep-alive-url")}get loginUrl(){const t=this.getAttribute("login-url");if(!t)throw new Error("no attribute login-url supplied");return t}get logoutUrl(){const t=this.getAttribute("logout-url");if(!t)throw new Error("no attribute logout-url supplied");return t}get warningInMilliseconds(){const t=this.getAttribute("warning-in-milliseconds");return t?parseInt(t,10):6e4*2}get timeoutInMilliseconds(){const t=this.getAttribute("timeout-in-milliseconds");if(!t)throw new Error("no attribute timeout-in-milliseconds supplied");return parseInt(t,10)}update(t){switch(t&&(this.#t=t),this.#t){case e.NONE:this.elMessageError?.classList.add("mds-display-none"),this.elDialogWarning?.close(),this.elDialogSignedOut?.close();break;case e.WARNING:this.elDialogSignedOut?.close(),this.elDialogWarning?.showModal();break;case e.TIMED_OUT:this.elDialogWarning?.close(),this.elDialogSignedOut?.showModal();break}}render(){this.removeEventListeners(),this.rootNode.replaceChildren(this.template.content.cloneNode(!0)),this.elSignInButton?.addEventListener("click",this.onClickSignInButton),this.elDialogSignedOut?.addEventListener("close",this.onSignedOutDialogClose)}removeEventListeners(){this.elSignInButton?.removeEventListener("click",this.onClickSignInButton),this.elDialogSignedOut?.removeEventListener("close",this.onSignedOutDialogClose)}#e(){clearTimeout(this.#i),clearTimeout(this.#s)}#n(){this.#e(),this.#i=setTimeout(()=>{this.update(e.WARNING)},this.timeoutInMilliseconds-this.warningInMilliseconds),this.#s=setTimeout(()=>{this.update(e.TIMED_OUT)},this.timeoutInMilliseconds)}async onClickSignInButton(){if(this.dispatchEvent(new CustomEvent("refresh")),this.elDialogWarning?.classList.add("mds-timeout-dialog--refreshing"),!!this.keepAliveUrl)try{const t=await fetch(this.keepAliveUrl);if(!t.ok){const i=await t.text();throw new Error(`Could not stay signed in - ${t.statusText} - ${i}`)}this.onRefreshSuccess()}catch(t){this.onRefreshFailed(t)}}restart(){this.elDialogWarning?.classList.remove("mds-timeout-dialog--refreshing"),this.elMessageError?.classList.add("mds-display-none"),this.update(e.NONE),this.#n()}timedOut(){this.#e(),this.update(e.TIMED_OUT)}onRefreshSuccess(){this.restart()}onRefreshFailed(t){console.error(t),this.elDialogWarning?.classList.remove("mds-timeout-dialog--refreshing"),this.elMessageError?.classList.remove("mds-display-none")}onSignedOutDialogClose(){this.#t===e.TIMED_OUT&&(window.location.href=`${this.loginUrl}?PipelinedPage=${encodeURIComponent(window.location.href)}`)}}export{r as M};
|
package/package.json
CHANGED
|
@@ -2,28 +2,24 @@
|
|
|
2
2
|
|
|
3
3
|
This Web Component displays a **warning dialog** when `timeout-in-milliseconds` is close to expiring (`timeout-in-milliseconds` minus `warning-in-milliseconds`), and displays a **timed out dialog** when the timeout has been reached and the user has been signed out.
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
- `login-url` : required, URL on the login link of the **timed out dialog**, hopefully a URL that will redirect back to your current location when logged in again (e.g. uses `PipelinedPage`)
|
|
8
|
-
- `keep-alive-url`: required, a URL that will be fetched in the background if the user clicks "stay signed in" button on the **warning dialog**, and thus should refresh the auth session by contacting the server without navigating the user away from their current location
|
|
9
|
-
- `timeout-in-milliseconds` : required, milliseconds until **timed out dialog** is displayed - should be the same as auth session timeout.
|
|
10
|
-
- `warning-in-milliseconds` : default 2 minutes `120000`, milliseconds until **timed out dialog** is displayed - should be the same as auth session timeout.
|
|
11
|
-
- `t-title` : default `You are about to be signed out`
|
|
12
|
-
- `t-title-timed-out` : default `You have been signed out`
|
|
13
|
-
- `t-message` : default `For your security, we will log you out in 2 minutes.`
|
|
14
|
-
- `t-message-error-failed-refresh` : default `Failed to sign in - try again`
|
|
15
|
-
- `t-btn-stay-refresh` : default `Stay signed in`
|
|
16
|
-
- `t-btn-sign-out` : default `Sign out`
|
|
17
|
-
- `t-btn-close` : default `close`
|
|
5
|
+
> An internal timeout will begin on component connect (usually page load), be wary of attaching timeout component at a later time as this may affect the timeout being in sync with the real auth session expiry.
|
|
18
6
|
|
|
19
7
|
## Usage
|
|
20
8
|
|
|
9
|
+
There are 2 flavours of this component: `Regular` & `Standalone`.
|
|
10
|
+
|
|
11
|
+
- `Regular` is bundled in the main Design System javascript (`@madgex/design-system/dist/js/index.js`), this is registered with HTML tag `<mds-timeout-dialog/>`. This version requires the Design System CSS on the page, and is Light DOM.
|
|
12
|
+
- `Standalone` can be used independently of the Design System and is located `@madgex/design-system/dist/js/components/mds-timeout-dialog-standalone.js`. This is registered with the HTML tag `<mds-timeout-dialog-standalone />`. This version does not require Design System CSS and is Shadow DOM.
|
|
13
|
+
|
|
14
|
+
### Example
|
|
15
|
+
|
|
21
16
|
```html
|
|
22
17
|
{ if request.auth.isAuthenticated %}
|
|
23
18
|
<mds-timeout-dialog
|
|
24
19
|
login-url="getRoute('account.login', {}, { PipelinedPage: request.raw.url })"
|
|
25
20
|
keep-alive-url="/any-url-that-will-refresh-auth-cookie"
|
|
26
21
|
timeout-in-milliseconds="ONE_MIN_IN_MS * 30"
|
|
22
|
+
warning-in-milliseconds="ONE_MIN_IN_MS * 2"
|
|
27
23
|
t-title="t('You are about to be signed out')"
|
|
28
24
|
t-title-timed-out="t('You have been signed out')"
|
|
29
25
|
t-message="t('For your security, we will log you out in 2 minutes.')"
|
|
@@ -35,10 +31,66 @@ This Web Component displays a **warning dialog** when `timeout-in-milliseconds`
|
|
|
35
31
|
{ endif %}
|
|
36
32
|
```
|
|
37
33
|
|
|
38
|
-
|
|
34
|
+
There are also 2 ways to use this component : Using the built-in auth session refresh, or manually implementing the auth session refresh.
|
|
35
|
+
The example above shows using the built-in auth session refresh, where you must supply `keep-alive-url`.
|
|
36
|
+
|
|
37
|
+
### Manual auth session "refresh"
|
|
38
|
+
|
|
39
|
+
This component has a built-in mechanism of refreshing the auth session, by using `keep-alive-url`, and making a simple `GET` request in the background. A successful HTTP code is assumed to be successful refresh and the timeout is reset.
|
|
40
|
+
|
|
41
|
+
If you need to implement a custom refresh mechanism, do **not** supply `keep-alive-url`, you can **listen to the `refresh` event**, and call the methods `onRefreshSuccess` & `onRefreshFailed`.
|
|
42
|
+
|
|
43
|
+
```html
|
|
44
|
+
<mds-timeout-dialog
|
|
45
|
+
id="my-timeout"
|
|
46
|
+
login-url="getRoute('account.login', {}, { PipelinedPage: request.raw.url })"
|
|
47
|
+
timeout-in-milliseconds="ONE_MIN_IN_MS * 30"
|
|
48
|
+
t-title="t('You are about to be signed out')"
|
|
49
|
+
t-title-timed-out="t('You have been signed out')"
|
|
50
|
+
t-message="t('For your security, we will log you out in 2 minutes.')"
|
|
51
|
+
t-message-error-failed-refresh="t('Failed to sign in - try again')"
|
|
52
|
+
t-btn-stay-refresh="t('Stay signed in')"
|
|
53
|
+
t-btn-sign-out="t('Sign out')"
|
|
54
|
+
t-btn-close="t('close')"
|
|
55
|
+
></mds-timeout-dialog>
|
|
56
|
+
|
|
57
|
+
<script type="module">
|
|
58
|
+
const myTimeout = document.querySelector('#my-timeout');
|
|
59
|
+
document.querySelector('#my-timeout').addEventListener('refresh', () => {
|
|
60
|
+
try {
|
|
61
|
+
const res = await fetch('/my-refresh-url', { headers: { Authorization: 'Bearer my-jwt' } });
|
|
62
|
+
if (!res.ok) throw new Error('');
|
|
63
|
+
myTimeout.onRefreshSuccess();
|
|
64
|
+
} catch (e) {
|
|
65
|
+
myTimeout.onRefreshFailed();
|
|
66
|
+
}
|
|
67
|
+
});
|
|
68
|
+
</script>
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
## Attributes
|
|
72
|
+
|
|
73
|
+
- `login-url` : required, URL on the login link of the **timed out dialog**, hopefully a URL that will redirect back to your current location when logged in again (e.g. uses `PipelinedPage`)
|
|
74
|
+
- `logout-url` : required, URL on `Sign out` button of **warning dialog**.
|
|
75
|
+
- `keep-alive-url`: optional, recommended, a URL that will be fetched in the background if the user clicks "stay signed in" button on the **warning dialog**, and thus should refresh the auth session by contacting the server without navigating the user away from their current location.
|
|
76
|
+
> If you do not supply `keep-alive-url` you should listen for the `refresh` event
|
|
77
|
+
- `timeout-in-milliseconds` : required, milliseconds until **timed out dialog** is displayed - should be the same as auth session timeout.
|
|
78
|
+
- `warning-in-milliseconds` : default 2 minutes `120000`, milliseconds until **timed out dialog** is displayed - should be the same as auth session timeout.
|
|
79
|
+
- `t-title` : default `You are about to be signed out`
|
|
80
|
+
- `t-title-timed-out` : default `You have been signed out`
|
|
81
|
+
- `t-message` : default `For your security, we will log you out in 2 minutes.`
|
|
82
|
+
- `t-message-error-failed-refresh` : default `Failed to sign in - try again`
|
|
83
|
+
- `t-btn-stay-refresh` : default `Stay signed in`
|
|
84
|
+
- `t-btn-sign-out` : default `Sign out`
|
|
85
|
+
- `t-btn-close` : default `close`
|
|
86
|
+
|
|
87
|
+
## Events
|
|
39
88
|
|
|
40
|
-
|
|
89
|
+
- `refresh` : This event is fired when the `Stay Signed in` button of the **warning dialog** is pressed.
|
|
41
90
|
|
|
42
|
-
|
|
91
|
+
## Methods
|
|
43
92
|
|
|
44
|
-
|
|
93
|
+
- `onRefreshSuccess()` : Call this method after successfully refreshing the auth session. See `refresh` Event.
|
|
94
|
+
- `onRefreshFailed(error?)` : Call this method on failed refresh of the auth session. See `refresh` Event.
|
|
95
|
+
- `timedOut()` : Call this method to immediate show **timed out dialog** and clear timers. Useful something externally detected a logged out session
|
|
96
|
+
- `restart()` : Call this method to start from fresh, dialogs close, start timers again. Useful something externally needing to start a new auth session
|