@madgex/design-system 7.0.4 → 8.0.0
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/_tokens/css/_tokens.css +1 -1
- package/dist/_tokens/js/_tokens-module.js +1 -1
- package/dist/assets/icons-inline.svg +1 -1
- package/dist/assets/icons.json +1 -1
- package/dist/assets/icons.svg +1 -1
- package/dist/css/index.css +1 -1
- package/dist/js/index.js +1 -1
- package/package.json +2 -2
- package/src/components/accordion/README.md +14 -23
- package/src/components/accordion/_template.njk +32 -66
- package/src/components/accordion/accordion.config.js +19 -49
- package/src/components/accordion/accordion.js +74 -241
- package/src/components/accordion/accordion.njk +17 -20
- package/src/components/accordion/accordion.scss +70 -32
- package/src/components/inputs/_form-elements.scss +18 -9
- package/src/components/inputs/checkbox-list/_template.njk +21 -24
- package/src/components/inputs/checkbox-list/checkbox-list.js +28 -0
- package/src/components/inputs/file-upload/file-upload.js +7 -0
- package/src/icons/triangle-down.svg +3 -0
- package/src/icons/triangle-right.svg +3 -0
- package/src/icons/triangle-up.svg +3 -0
- package/src/js/index.js +2 -0
- package/src/scss/constants/_sd-tokens.scss +1 -1
package/dist/js/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
/*! For license information please see index.js.LICENSE.txt */
|
|
2
|
-
(()=>{var e={818:()=>{window.addEventListener("hashchange",(()=>{const e=window.location.hash.trim();Array.from(document.querySelectorAll(`a[href='${e}']`)).forEach((e=>{e.click()}))}),!1)},333:()=>{Array.prototype.find||Object.defineProperty(Array.prototype,"find",{value(e){if(null==this)throw TypeError('"this" is null or not defined');const t=Object(this),r=t.length>>>0;if("function"!=typeof e)throw TypeError("predicate must be a function");const n=arguments[1];let o=0;for(;o<r;){const r=t[o];if(e.call(n,r,o,t))return r;o++}},configurable:!0,writable:!0})},616:()=>{Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector),Element.prototype.closest||(Element.prototype.closest=function(e){let t=this;do{if(t.matches(e))return t;t=t.parentElement||t.parentNode}while(null!==t&&1===t.nodeType);return null})},626:()=>{"function"!=typeof Object.assign&&Object.defineProperty(Object,"assign",{value:function(e){if(null==e)throw new TypeError("Cannot convert undefined or null to object");const t=Object(e);for(let e=1;e<arguments.length;e++){const r=arguments[e];if(null!=r)for(const e in r)Object.prototype.hasOwnProperty.call(r,e)&&(t[e]=r[e])}return t},writable:!0,configurable:!0})},516:()=>{"remove"in Element.prototype||(Element.prototype.remove=function(){this.parentNode&&this.parentNode.removeChild(this)})},702:(e,t,r)=>{r.p=window.mdgx&&window.mdgx.baseUrl?window.mdgx.baseUrl:"/"},807:()=>{!function(){"use strict";if("undefined"!=typeof window&&window.addEventListener){var e,t,r,n=Object.create(null),o=function(){clearTimeout(t),t=setTimeout(e,100)},a=function(){},i=function(e){function t(e){var t;return void 0!==e.protocol?t=e:(t=document.createElement("a")).href=e,t.protocol.replace(/:/g,"")+t.host}var r,n,o;return window.XMLHttpRequest&&(r=new XMLHttpRequest,n=t(location),o=t(e),r=void 0===r.withCredentials&&""!==o&&o!==n?XDomainRequest||void 0:XMLHttpRequest),r},s="http://www.w3.org/1999/xlink";e=function(){var e,t,r,l,c,d,u,f,p,m,b=0;function v(){var e;0==(b-=1)&&(a(),window.addEventListener("resize",o,!1),window.addEventListener("orientationchange",o,!1),window.MutationObserver?((e=new MutationObserver(o)).observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0}),a=function(){try{e.disconnect(),window.removeEventListener("resize",o,!1),window.removeEventListener("orientationchange",o,!1)}catch(e){}}):(document.documentElement.addEventListener("DOMSubtreeModified",o,!1),a=function(){document.documentElement.removeEventListener("DOMSubtreeModified",o,!1),window.removeEventListener("resize",o,!1),window.removeEventListener("orientationchange",o,!1)}))}function h(e){return function(){!0!==n[e.base]&&(e.useEl.setAttributeNS(s,"xlink:href","#"+e.hash),e.useEl.hasAttribute("href")&&e.useEl.setAttribute("href","#"+e.hash))}}function g(e){return function(){var t,r=document.body,n=document.createElement("x");e.onload=null,n.innerHTML=e.responseText,(t=n.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",r.insertBefore(t,r.firstChild)),v()}}function y(e){return function(){e.onerror=null,e.ontimeout=null,v()}}for(a(),p=document.getElementsByTagName("use"),c=0;c<p.length;c+=1){try{t=p[c].getBoundingClientRect()}catch(e){t=!1}e=(f=(l=p[c].getAttribute("href")||p[c].getAttributeNS(s,"href")||p[c].getAttribute("xlink:href"))&&l.split?l.split("#"):["",""])[0],r=f[1],d=t&&0===t.left&&0===t.right&&0===t.top&&0===t.bottom,t&&0===t.width&&0===t.height&&!d?(p[c].hasAttribute("href")&&p[c].setAttributeNS(s,"xlink:href",l),e.length&&(!0!==(m=n[e])&&setTimeout(h({useEl:p[c],base:e,hash:r}),0),void 0===m&&void 0!==(u=i(e))&&(m=new u,n[e]=m,m.onload=g(m),m.onerror=y(m),m.ontimeout=y(m),m.open("GET",e),m.send(),b+=1))):d?e.length&&n[e]&&setTimeout(h({useEl:p[c],base:e,hash:r}),0):void 0===n[e]?n[e]=!0:n[e].onload&&(n[e].abort(),delete n[e].onload,n[e]=!0)}p="",b+=1,v()},r=function(){window.removeEventListener("load",r,!1),t=setTimeout(e,0)},"complete"!==document.readyState?window.addEventListener("load",r,!1):r()}}()},435:e=>{"use strict";e.exports=JSON.parse('{"color":{"neutral":{"base":{"value":"#707070","private":true},"light":{"value":"#949494","private":true},"lighter":{"value":"#DDDDDD","private":true},"lightest":{"value":"#F8F8F8","private":true},"darker":{"value":"#333333","private":true}},"status":{"error":{"light":{"value":"#fd0826","private":true},"lightest":{"value":"#ffe3e6","private":true},"dark":{"value":"#d0021b","private":true},"darkest":{"value":"#ae0216","private":true},"base":{"value":"#e1021d","private":true}},"success":{"light":{"value":"#6ac52d","private":true},"lightest":{"value":"#f0faea","private":true},"dark":{"value":"#549b24","private":true},"darkest":{"value":"#40791B","private":true},"base":{"value":"#5ba927","private":true}},"info":{"light":{"value":"#ffc442","private":true},"lightest":{"value":"#fff7e5","private":true},"dark":{"value":"#f4aa08","private":true},"darkest":{"value":"#946500","private":true},"base":{"value":"#ffb411","private":true}}}},"size":{"baseline":{"value":"4px","private":true},"breakpoint":{"sm":{"value":"400px","private":true},"md":{"value":"600px","private":true},"lg":{"value":"1008px","private":true},"xl":{"value":"1280px","private":true}},"gutter-width":{"value":"20px","private":true}}}')}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var a=t[n]={exports:{}};return e[n](a,a.exports,r),a.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.p="",(()=>{"use strict";r(702),r(818);const e=r(435),t="mds-tabs",n="mds-tabs__panel",o="mds-tabs__tab",a="mds-tabs__tab--selected",i="mds-tabs__panel--hidden",s=parseInt(e.size.breakpoint.lg.value,10),l={init:()=>{l.setTabs(".js-full-tabbed"),window.innerWidth>s&&l.setTabs(".js-desktop-tabbed")},setTabs:e=>{const r=Array.from(document.querySelectorAll(`${e} .${o}`)),i=Array.from(document.querySelectorAll(`${e} .mds-tabs__list`)),s=Array.from(document.querySelectorAll(`${e} .mds-tabs__list-item`)),c=Array.from(document.querySelectorAll(`${e} .${n}`));i.forEach((e=>{e.setAttribute("role","tablist")})),s.forEach((e=>{e.setAttribute("role","presentation")})),r.forEach((e=>{e.setAttribute("role","tab"),e.setAttribute("aria-controls",e.attributes.href.value.substring(1)),e.classList.contains(a)?e.setAttribute("tabindex","0"):e.setAttribute("tabindex","-1")})),c.forEach((e=>{e.setAttribute("role","tabpanel"),e.setAttribute("aria-labelledby",`label-${e.attributes.id.value}`)}));const d=document.querySelectorAll(`${e} .js-tabs-item`);Array.from(d).forEach((e=>{const r=window.location.hash.trim(),n=e.attributes.href.value,o=e.closest(`.${t}`),a=l.getAllPanels(o),i=l.getAllTabs(o),s=l.getTargetPanel(e,o);e.addEventListener("click",(t=>{t.preventDefault(),l.updateTabs(i,a,e,s,n)})),n===r&&l.updateTabs(i,a,e,s,n)})),i.forEach((e=>{const r=e.closest(`.${t}`),n=l.getAllPanels(r),o=l.getAllTabs(r);e.addEventListener("keydown",(t=>{switch(t.keyCode){case 37:case 38:t.preventDefault(),l.moveTab(e,r,o,n,!1);break;case 39:case 40:t.preventDefault(),l.moveTab(e,r,o,n,!0)}}))}))},getSelectedTab:e=>e.querySelector(`.${a}`),getPrevTab:e=>!!e.parentElement.previousSibling&&e.parentElement.previousSibling.querySelector(`.${o}`),getNextTab:e=>!!e.parentElement.nextSibling&&e.parentElement.nextSibling.querySelector(`.${o}`),getTargetPanel:(e,t)=>{const r=e.attributes.href.value;return t.querySelector(r)},getAllPanels:e=>Array.from(e.querySelectorAll(`.${n}`)),getAllTabs:e=>Array.from(e.querySelectorAll(`.${o}`)),moveTab:(e,t,r,n,o)=>{const a=l.getSelectedTab(e),i=o?l.getNextTab(a):l.getPrevTab(a);if(i){const e=i.attributes.href.value,o=l.getTargetPanel(i,t);l.updateTabs(r,n,i,o,e,!1)}},updateTabs:(e,t,r,n,o)=>{l.clearAllTabs(e),l.setActiveTab(r),l.clearAllPanels(t),l.setActivePanel(n,o)},clearAllTabs:e=>{e.forEach((e=>{e.classList.remove(a),e.setAttribute("aria-selected","false"),e.setAttribute("tabindex","-1")}))},clearAllPanels:e=>{e.forEach((e=>{e.classList.add(i)}))},setActiveTab:e=>{e.classList.add(a),e.setAttribute("aria-selected","true"),e.setAttribute("tabindex","0"),e.focus()},setActivePanel:(e,t)=>{e.classList.remove(i),window.history.replaceState({},"",t)}},c=l,d="mds-accordion-trigger",u="mds-accordion-trigger__button",f="mds-accordion-trigger__label",p="mds-accordion-trigger--expanded",m="mds-accordion-content--expanded",b={init:()=>{const e=Array.from(document.querySelectorAll(`.${d}`)),t=window.innerWidth;e.forEach((e=>{const r=e.nextElementSibling;b.checkBreakpoint(e,t)?b.setAccordion(e,r):(e.classList.add(p),r.classList.add(m))}))},checkBreakpoint:(e,t)=>{let r=0;if(e.dataset.bp){const n=e.dataset.bp.replace(/\D/g,"");let o,a;switch(e.dataset.bp.replace(/[0-9]/g,"")){case"px":r=n;break;case"em":case"rem":o=window.getComputedStyle(document.querySelector("body"))["font-size"],a=n*parseFloat(o),r=a;break;default:return!0}return!(t>r)}return!0},setAccordion:(e,t)=>{const r=e,n=b.createButton(r),o=n.querySelector(`.${f}`).innerText,a=n.getAttribute("aria-label"),i=e.classList.contains("mds-accordion-trigger--non-closing"),s=e.classList.contains("mds-accordion-trigger--content-first")&&!i;r.classList.remove("mds-display-none"),"fieldset"!==t.nodeName.toLowerCase()&&(a?t.setAttribute("aria-label",a):t.setAttribute("aria-label",o)),r.innerHTML="",r.appendChild(n);const l={triggerContainer:r,accordionContent:t,isNonClosing:i,isContentFirst:s},c=e=>{e.preventDefault(),b.toggleExpand(l,c,e)};n.addEventListener("click",c),r.dataset.expanded&&b.toggleExpand(l,c)},createButton:e=>{const t=e.querySelector(`.${d} > span`),r=document.createElement("button");return r.className=u,r.classList.add("mds-button"),r.classList.add("mds-button--plain"),r.classList.add("mds-padding-x-b0"),r.setAttribute("aria-expanded",!1),r.setAttribute("type","button"),e.dataset.arialabel&&r.setAttribute("aria-label",e.dataset.arialabel),t&&r.appendChild(t),r},cloneUnderButton:(e,t,r,n)=>{const o=e.cloneNode(!0),a=o.querySelector(`.${f}`);t.dataset.arialabeactive&&o.setAttribute("aria-label",t.dataset.arialabeactive),o.setAttribute("aria-expanded",!0),o.addEventListener("click",n),b.switchAriaLabel(o,t),b.switchLabel(a),r.after(o)},switchLabel:e=>{if(e.dataset.labelinverse){const t=e.textContent;e.textContent=e.dataset.labelinverse,e.setAttribute("data-labelinverse",t)}},switchAriaLabel:(e,t)=>{t.dataset.arialabelactive&&(e.getAttribute("aria-label")===t.dataset.arialabel?e.setAttribute("aria-label",t.dataset.arialabelactive):e.setAttribute("aria-label",t.dataset.arialabel))},toggleExpand:(e,t,r)=>{let n,{triggerContainer:o,accordionContent:a,isNonClosing:i,isContentFirst:s}=e;n=r?r.target.closest(`.${u}`):o.querySelector(`.${u}`);const l=n.querySelector(`.${f}`);if("false"===n.getAttribute("aria-expanded"))n.setAttribute("aria-expanded",!0),o.classList.add(p),a.classList.add(m),s&&b.cloneUnderButton(n,o,a,t),i||s?b.hideButton(n,t):(b.switchLabel(l),b.switchAriaLabel(n,o));else if(!i&&(n.setAttribute("aria-expanded",!1),o.classList.remove(p),a.classList.remove(m),b.switchLabel(l),b.switchAriaLabel(n,o),s)){const e=a.previousElementSibling.querySelector(`.${u}`);n.setAttribute("aria-expanded",!1),n.removeAttribute("aria-disabled"),n.setAttribute("tabIndex","0"),e.replaceWith(n),o.classList.remove("mds-visually-hidden"),n.focus()}},hideButton:(e,t)=>{e.setAttribute("aria-disabled",!0),e.parentElement.classList.add("mds-visually-hidden"),e.setAttribute("tabIndex","-1"),e.removeEventListener("click",t)}},v=b;function h(e){var t=e.getBoundingClientRect();return{width:t.width,height:t.height,top:t.top,right:t.right,bottom:t.bottom,left:t.left,x:t.left,y:t.top}}function g(e){if(null==e)return window;if("[object Window]"!==e.toString()){var t=e.ownerDocument;return t&&t.defaultView||window}return e}function y(e){var t=g(e);return{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function w(e){return e instanceof g(e).Element||e instanceof Element}function x(e){return e instanceof g(e).HTMLElement||e instanceof HTMLElement}function A(e){return"undefined"!=typeof ShadowRoot&&(e instanceof g(e).ShadowRoot||e instanceof ShadowRoot)}function E(e){return e?(e.nodeName||"").toLowerCase():null}function L(e){return((w(e)?e.ownerDocument:e.document)||window.document).documentElement}function O(e){return h(L(e)).left+y(e).scrollLeft}function S(e){return g(e).getComputedStyle(e)}function k(e){var t=S(e),r=t.overflow,n=t.overflowX,o=t.overflowY;return/auto|scroll|overlay|hidden/.test(r+o+n)}function T(e,t,r){void 0===r&&(r=!1);var n,o,a=L(t),i=h(e),s=x(t),l={scrollLeft:0,scrollTop:0},c={x:0,y:0};return(s||!s&&!r)&&(("body"!==E(t)||k(a))&&(l=(n=t)!==g(n)&&x(n)?{scrollLeft:(o=n).scrollLeft,scrollTop:o.scrollTop}:y(n)),x(t)?((c=h(t)).x+=t.clientLeft,c.y+=t.clientTop):a&&(c.x=O(a))),{x:i.left+l.scrollLeft-c.x,y:i.top+l.scrollTop-c.y,width:i.width,height:i.height}}function j(e){var t=h(e),r=e.offsetWidth,n=e.offsetHeight;return Math.abs(t.width-r)<=1&&(r=t.width),Math.abs(t.height-n)<=1&&(n=t.height),{x:e.offsetLeft,y:e.offsetTop,width:r,height:n}}function D(e){return"html"===E(e)?e:e.assignedSlot||e.parentNode||(A(e)?e.host:null)||L(e)}function q(e){return["html","body","#document"].indexOf(E(e))>=0?e.ownerDocument.body:x(e)&&k(e)?e:q(D(e))}function P(e,t){var r;void 0===t&&(t=[]);var n=q(e),o=n===(null==(r=e.ownerDocument)?void 0:r.body),a=g(n),i=o?[a].concat(a.visualViewport||[],k(n)?n:[]):n,s=t.concat(i);return o?s:s.concat(P(D(i)))}function C(e){return["table","td","th"].indexOf(E(e))>=0}function M(e){return x(e)&&"fixed"!==S(e).position?e.offsetParent:null}function B(e){for(var t=g(e),r=M(e);r&&C(r)&&"static"===S(r).position;)r=M(r);return r&&("html"===E(r)||"body"===E(r)&&"static"===S(r).position)?t:r||function(e){var t=-1!==navigator.userAgent.toLowerCase().indexOf("firefox");if(-1!==navigator.userAgent.indexOf("Trident")&&x(e)&&"fixed"===S(e).position)return null;for(var r=D(e);x(r)&&["html","body"].indexOf(E(r))<0;){var n=S(r);if("none"!==n.transform||"none"!==n.perspective||"paint"===n.contain||-1!==["transform","perspective"].indexOf(n.willChange)||t&&"filter"===n.willChange||t&&n.filter&&"none"!==n.filter)return r;r=r.parentNode}return null}(e)||t}var $="top",_="bottom",N="right",W="left",H="auto",R=[$,_,N,W],I="start",z="end",F="viewport",U="popper",V=R.reduce((function(e,t){return e.concat([t+"-"+I,t+"-"+z])}),[]),X=[].concat(R,[H]).reduce((function(e,t){return e.concat([t,t+"-"+I,t+"-"+z])}),[]),Y=["beforeRead","read","afterRead","beforeMain","main","afterMain","beforeWrite","write","afterWrite"];function G(e){var t=new Map,r=new Set,n=[];function o(e){r.add(e.name),[].concat(e.requires||[],e.requiresIfExists||[]).forEach((function(e){if(!r.has(e)){var n=t.get(e);n&&o(n)}})),n.push(e)}return e.forEach((function(e){t.set(e.name,e)})),e.forEach((function(e){r.has(e.name)||o(e)})),n}var J={placement:"bottom",modifiers:[],strategy:"absolute"};function K(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return!t.some((function(e){return!(e&&"function"==typeof e.getBoundingClientRect)}))}function Q(e){void 0===e&&(e={});var t=e,r=t.defaultModifiers,n=void 0===r?[]:r,o=t.defaultOptions,a=void 0===o?J:o;return function(e,t,r){void 0===r&&(r=a);var o,i,s={placement:"bottom",orderedModifiers:[],options:Object.assign({},J,a),modifiersData:{},elements:{reference:e,popper:t},attributes:{},styles:{}},l=[],c=!1,d={state:s,setOptions:function(r){u(),s.options=Object.assign({},a,s.options,r),s.scrollParents={reference:w(e)?P(e):e.contextElement?P(e.contextElement):[],popper:P(t)};var o,i,c=function(e){var t=G(e);return Y.reduce((function(e,r){return e.concat(t.filter((function(e){return e.phase===r})))}),[])}((o=[].concat(n,s.options.modifiers),i=o.reduce((function(e,t){var r=e[t.name];return e[t.name]=r?Object.assign({},r,t,{options:Object.assign({},r.options,t.options),data:Object.assign({},r.data,t.data)}):t,e}),{}),Object.keys(i).map((function(e){return i[e]}))));return s.orderedModifiers=c.filter((function(e){return e.enabled})),s.orderedModifiers.forEach((function(e){var t=e.name,r=e.options,n=void 0===r?{}:r,o=e.effect;if("function"==typeof o){var a=o({state:s,name:t,instance:d,options:n});l.push(a||function(){})}})),d.update()},forceUpdate:function(){if(!c){var e=s.elements,t=e.reference,r=e.popper;if(K(t,r)){s.rects={reference:T(t,B(r),"fixed"===s.options.strategy),popper:j(r)},s.reset=!1,s.placement=s.options.placement,s.orderedModifiers.forEach((function(e){return s.modifiersData[e.name]=Object.assign({},e.data)}));for(var n=0;n<s.orderedModifiers.length;n++)if(!0!==s.reset){var o=s.orderedModifiers[n],a=o.fn,i=o.options,l=void 0===i?{}:i,u=o.name;"function"==typeof a&&(s=a({state:s,options:l,name:u,instance:d})||s)}else s.reset=!1,n=-1}}},update:(o=function(){return new Promise((function(e){d.forceUpdate(),e(s)}))},function(){return i||(i=new Promise((function(e){Promise.resolve().then((function(){i=void 0,e(o())}))}))),i}),destroy:function(){u(),c=!0}};if(!K(e,t))return d;function u(){l.forEach((function(e){return e()})),l=[]}return d.setOptions(r).then((function(e){!c&&r.onFirstUpdate&&r.onFirstUpdate(e)})),d}}var Z={passive:!0};const ee={name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:function(e){var t=e.state,r=e.instance,n=e.options,o=n.scroll,a=void 0===o||o,i=n.resize,s=void 0===i||i,l=g(t.elements.popper),c=[].concat(t.scrollParents.reference,t.scrollParents.popper);return a&&c.forEach((function(e){e.addEventListener("scroll",r.update,Z)})),s&&l.addEventListener("resize",r.update,Z),function(){a&&c.forEach((function(e){e.removeEventListener("scroll",r.update,Z)})),s&&l.removeEventListener("resize",r.update,Z)}},data:{}};function te(e){return e.split("-")[0]}function re(e){return e.split("-")[1]}function ne(e){return["top","bottom"].indexOf(e)>=0?"x":"y"}function oe(e){var t,r=e.reference,n=e.element,o=e.placement,a=o?te(o):null,i=o?re(o):null,s=r.x+r.width/2-n.width/2,l=r.y+r.height/2-n.height/2;switch(a){case $:t={x:s,y:r.y-n.height};break;case _:t={x:s,y:r.y+r.height};break;case N:t={x:r.x+r.width,y:l};break;case W:t={x:r.x-n.width,y:l};break;default:t={x:r.x,y:r.y}}var c=a?ne(a):null;if(null!=c){var d="y"===c?"height":"width";switch(i){case I:t[c]=t[c]-(r[d]/2-n[d]/2);break;case z:t[c]=t[c]+(r[d]/2-n[d]/2)}}return t}const ae={name:"popperOffsets",enabled:!0,phase:"read",fn:function(e){var t=e.state,r=e.name;t.modifiersData[r]=oe({reference:t.rects.reference,element:t.rects.popper,strategy:"absolute",placement:t.placement})},data:{}};var ie=Math.max,se=Math.min,le=Math.round,ce={top:"auto",right:"auto",bottom:"auto",left:"auto"};function de(e){var t,r=e.popper,n=e.popperRect,o=e.placement,a=e.offsets,i=e.position,s=e.gpuAcceleration,l=e.adaptive,c=e.roundOffsets,d=!0===c?function(e){var t=e.x,r=e.y,n=window.devicePixelRatio||1;return{x:le(le(t*n)/n)||0,y:le(le(r*n)/n)||0}}(a):"function"==typeof c?c(a):a,u=d.x,f=void 0===u?0:u,p=d.y,m=void 0===p?0:p,b=a.hasOwnProperty("x"),v=a.hasOwnProperty("y"),h=W,y=$,w=window;if(l){var x=B(r),A="clientHeight",E="clientWidth";x===g(r)&&"static"!==S(x=L(r)).position&&(A="scrollHeight",E="scrollWidth"),o===$&&(y=_,m-=x[A]-n.height,m*=s?1:-1),o===W&&(h=N,f-=x[E]-n.width,f*=s?1:-1)}var O,k=Object.assign({position:i},l&&ce);return s?Object.assign({},k,((O={})[y]=v?"0":"",O[h]=b?"0":"",O.transform=(w.devicePixelRatio||1)<2?"translate("+f+"px, "+m+"px)":"translate3d("+f+"px, "+m+"px, 0)",O)):Object.assign({},k,((t={})[y]=v?m+"px":"",t[h]=b?f+"px":"",t.transform="",t))}var ue={left:"right",right:"left",bottom:"top",top:"bottom"};function fe(e){return e.replace(/left|right|bottom|top/g,(function(e){return ue[e]}))}var pe={start:"end",end:"start"};function me(e){return e.replace(/start|end/g,(function(e){return pe[e]}))}function be(e,t){var r=t.getRootNode&&t.getRootNode();if(e.contains(t))return!0;if(r&&A(r)){var n=t;do{if(n&&e.isSameNode(n))return!0;n=n.parentNode||n.host}while(n)}return!1}function ve(e){return Object.assign({},e,{left:e.x,top:e.y,right:e.x+e.width,bottom:e.y+e.height})}function he(e,t){return t===F?ve(function(e){var t=g(e),r=L(e),n=t.visualViewport,o=r.clientWidth,a=r.clientHeight,i=0,s=0;return n&&(o=n.width,a=n.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(i=n.offsetLeft,s=n.offsetTop)),{width:o,height:a,x:i+O(e),y:s}}(e)):x(t)?function(e){var t=h(e);return t.top=t.top+e.clientTop,t.left=t.left+e.clientLeft,t.bottom=t.top+e.clientHeight,t.right=t.left+e.clientWidth,t.width=e.clientWidth,t.height=e.clientHeight,t.x=t.left,t.y=t.top,t}(t):ve(function(e){var t,r=L(e),n=y(e),o=null==(t=e.ownerDocument)?void 0:t.body,a=ie(r.scrollWidth,r.clientWidth,o?o.scrollWidth:0,o?o.clientWidth:0),i=ie(r.scrollHeight,r.clientHeight,o?o.scrollHeight:0,o?o.clientHeight:0),s=-n.scrollLeft+O(e),l=-n.scrollTop;return"rtl"===S(o||r).direction&&(s+=ie(r.clientWidth,o?o.clientWidth:0)-a),{width:a,height:i,x:s,y:l}}(L(e)))}function ge(e){return Object.assign({},{top:0,right:0,bottom:0,left:0},e)}function ye(e,t){return t.reduce((function(t,r){return t[r]=e,t}),{})}function we(e,t){void 0===t&&(t={});var r=t,n=r.placement,o=void 0===n?e.placement:n,a=r.boundary,i=void 0===a?"clippingParents":a,s=r.rootBoundary,l=void 0===s?F:s,c=r.elementContext,d=void 0===c?U:c,u=r.altBoundary,f=void 0!==u&&u,p=r.padding,m=void 0===p?0:p,b=ge("number"!=typeof m?m:ye(m,R)),v=d===U?"reference":U,g=e.elements.reference,y=e.rects.popper,A=e.elements[f?v:d],O=function(e,t,r){var n="clippingParents"===t?function(e){var t=P(D(e)),r=["absolute","fixed"].indexOf(S(e).position)>=0&&x(e)?B(e):e;return w(r)?t.filter((function(e){return w(e)&&be(e,r)&&"body"!==E(e)})):[]}(e):[].concat(t),o=[].concat(n,[r]),a=o[0],i=o.reduce((function(t,r){var n=he(e,r);return t.top=ie(n.top,t.top),t.right=se(n.right,t.right),t.bottom=se(n.bottom,t.bottom),t.left=ie(n.left,t.left),t}),he(e,a));return i.width=i.right-i.left,i.height=i.bottom-i.top,i.x=i.left,i.y=i.top,i}(w(A)?A:A.contextElement||L(e.elements.popper),i,l),k=h(g),T=oe({reference:k,element:y,strategy:"absolute",placement:o}),j=ve(Object.assign({},y,T)),q=d===U?j:k,C={top:O.top-q.top+b.top,bottom:q.bottom-O.bottom+b.bottom,left:O.left-q.left+b.left,right:q.right-O.right+b.right},M=e.modifiersData.offset;if(d===U&&M){var W=M[o];Object.keys(C).forEach((function(e){var t=[N,_].indexOf(e)>=0?1:-1,r=[$,_].indexOf(e)>=0?"y":"x";C[e]+=W[r]*t}))}return C}function xe(e,t,r){return ie(e,se(t,r))}function Ae(e,t,r){return void 0===r&&(r={x:0,y:0}),{top:e.top-t.height-r.y,right:e.right-t.width+r.x,bottom:e.bottom-t.height+r.y,left:e.left-t.width-r.x}}function Ee(e){return[$,N,_,W].some((function(t){return e[t]>=0}))}var Le=Q({defaultModifiers:[ee,ae,{name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:function(e){var t=e.state,r=e.options,n=r.gpuAcceleration,o=void 0===n||n,a=r.adaptive,i=void 0===a||a,s=r.roundOffsets,l=void 0===s||s,c={placement:te(t.placement),popper:t.elements.popper,popperRect:t.rects.popper,gpuAcceleration:o};null!=t.modifiersData.popperOffsets&&(t.styles.popper=Object.assign({},t.styles.popper,de(Object.assign({},c,{offsets:t.modifiersData.popperOffsets,position:t.options.strategy,adaptive:i,roundOffsets:l})))),null!=t.modifiersData.arrow&&(t.styles.arrow=Object.assign({},t.styles.arrow,de(Object.assign({},c,{offsets:t.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:l})))),t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-placement":t.placement})},data:{}},{name:"applyStyles",enabled:!0,phase:"write",fn:function(e){var t=e.state;Object.keys(t.elements).forEach((function(e){var r=t.styles[e]||{},n=t.attributes[e]||{},o=t.elements[e];x(o)&&E(o)&&(Object.assign(o.style,r),Object.keys(n).forEach((function(e){var t=n[e];!1===t?o.removeAttribute(e):o.setAttribute(e,!0===t?"":t)})))}))},effect:function(e){var t=e.state,r={popper:{position:t.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(t.elements.popper.style,r.popper),t.styles=r,t.elements.arrow&&Object.assign(t.elements.arrow.style,r.arrow),function(){Object.keys(t.elements).forEach((function(e){var n=t.elements[e],o=t.attributes[e]||{},a=Object.keys(t.styles.hasOwnProperty(e)?t.styles[e]:r[e]).reduce((function(e,t){return e[t]="",e}),{});x(n)&&E(n)&&(Object.assign(n.style,a),Object.keys(o).forEach((function(e){n.removeAttribute(e)})))}))}},requires:["computeStyles"]},{name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:function(e){var t=e.state,r=e.options,n=e.name,o=r.offset,a=void 0===o?[0,0]:o,i=X.reduce((function(e,r){return e[r]=function(e,t,r){var n=te(e),o=[W,$].indexOf(n)>=0?-1:1,a="function"==typeof r?r(Object.assign({},t,{placement:e})):r,i=a[0],s=a[1];return i=i||0,s=(s||0)*o,[W,N].indexOf(n)>=0?{x:s,y:i}:{x:i,y:s}}(r,t.rects,a),e}),{}),s=i[t.placement],l=s.x,c=s.y;null!=t.modifiersData.popperOffsets&&(t.modifiersData.popperOffsets.x+=l,t.modifiersData.popperOffsets.y+=c),t.modifiersData[n]=i}},{name:"flip",enabled:!0,phase:"main",fn:function(e){var t=e.state,r=e.options,n=e.name;if(!t.modifiersData[n]._skip){for(var o=r.mainAxis,a=void 0===o||o,i=r.altAxis,s=void 0===i||i,l=r.fallbackPlacements,c=r.padding,d=r.boundary,u=r.rootBoundary,f=r.altBoundary,p=r.flipVariations,m=void 0===p||p,b=r.allowedAutoPlacements,v=t.options.placement,h=te(v),g=l||(h!==v&&m?function(e){if(te(e)===H)return[];var t=fe(e);return[me(e),t,me(t)]}(v):[fe(v)]),y=[v].concat(g).reduce((function(e,r){return e.concat(te(r)===H?function(e,t){void 0===t&&(t={});var r=t,n=r.placement,o=r.boundary,a=r.rootBoundary,i=r.padding,s=r.flipVariations,l=r.allowedAutoPlacements,c=void 0===l?X:l,d=re(n),u=d?s?V:V.filter((function(e){return re(e)===d})):R,f=u.filter((function(e){return c.indexOf(e)>=0}));0===f.length&&(f=u);var p=f.reduce((function(t,r){return t[r]=we(e,{placement:r,boundary:o,rootBoundary:a,padding:i})[te(r)],t}),{});return Object.keys(p).sort((function(e,t){return p[e]-p[t]}))}(t,{placement:r,boundary:d,rootBoundary:u,padding:c,flipVariations:m,allowedAutoPlacements:b}):r)}),[]),w=t.rects.reference,x=t.rects.popper,A=new Map,E=!0,L=y[0],O=0;O<y.length;O++){var S=y[O],k=te(S),T=re(S)===I,j=[$,_].indexOf(k)>=0,D=j?"width":"height",q=we(t,{placement:S,boundary:d,rootBoundary:u,altBoundary:f,padding:c}),P=j?T?N:W:T?_:$;w[D]>x[D]&&(P=fe(P));var C=fe(P),M=[];if(a&&M.push(q[k]<=0),s&&M.push(q[P]<=0,q[C]<=0),M.every((function(e){return e}))){L=S,E=!1;break}A.set(S,M)}if(E)for(var B=function(e){var t=y.find((function(t){var r=A.get(t);if(r)return r.slice(0,e).every((function(e){return e}))}));if(t)return L=t,"break"},z=m?3:1;z>0&&"break"!==B(z);z--);t.placement!==L&&(t.modifiersData[n]._skip=!0,t.placement=L,t.reset=!0)}},requiresIfExists:["offset"],data:{_skip:!1}},{name:"preventOverflow",enabled:!0,phase:"main",fn:function(e){var t=e.state,r=e.options,n=e.name,o=r.mainAxis,a=void 0===o||o,i=r.altAxis,s=void 0!==i&&i,l=r.boundary,c=r.rootBoundary,d=r.altBoundary,u=r.padding,f=r.tether,p=void 0===f||f,m=r.tetherOffset,b=void 0===m?0:m,v=we(t,{boundary:l,rootBoundary:c,padding:u,altBoundary:d}),h=te(t.placement),g=re(t.placement),y=!g,w=ne(h),x="x"===w?"y":"x",A=t.modifiersData.popperOffsets,E=t.rects.reference,L=t.rects.popper,O="function"==typeof b?b(Object.assign({},t.rects,{placement:t.placement})):b,S={x:0,y:0};if(A){if(a||s){var k="y"===w?$:W,T="y"===w?_:N,D="y"===w?"height":"width",q=A[w],P=A[w]+v[k],C=A[w]-v[T],M=p?-L[D]/2:0,H=g===I?E[D]:L[D],R=g===I?-L[D]:-E[D],z=t.elements.arrow,F=p&&z?j(z):{width:0,height:0},U=t.modifiersData["arrow#persistent"]?t.modifiersData["arrow#persistent"].padding:{top:0,right:0,bottom:0,left:0},V=U[k],X=U[T],Y=xe(0,E[D],F[D]),G=y?E[D]/2-M-Y-V-O:H-Y-V-O,J=y?-E[D]/2+M+Y+X+O:R+Y+X+O,K=t.elements.arrow&&B(t.elements.arrow),Q=K?"y"===w?K.clientTop||0:K.clientLeft||0:0,Z=t.modifiersData.offset?t.modifiersData.offset[t.placement][w]:0,ee=A[w]+G-Z-Q,oe=A[w]+J-Z;if(a){var ae=xe(p?se(P,ee):P,q,p?ie(C,oe):C);A[w]=ae,S[w]=ae-q}if(s){var le="x"===w?$:W,ce="x"===w?_:N,de=A[x],ue=de+v[le],fe=de-v[ce],pe=xe(p?se(ue,ee):ue,de,p?ie(fe,oe):fe);A[x]=pe,S[x]=pe-de}}t.modifiersData[n]=S}},requiresIfExists:["offset"]},{name:"arrow",enabled:!0,phase:"main",fn:function(e){var t,r=e.state,n=e.name,o=e.options,a=r.elements.arrow,i=r.modifiersData.popperOffsets,s=te(r.placement),l=ne(s),c=[W,N].indexOf(s)>=0?"height":"width";if(a&&i){var d=function(e,t){return ge("number"!=typeof(e="function"==typeof e?e(Object.assign({},t.rects,{placement:t.placement})):e)?e:ye(e,R))}(o.padding,r),u=j(a),f="y"===l?$:W,p="y"===l?_:N,m=r.rects.reference[c]+r.rects.reference[l]-i[l]-r.rects.popper[c],b=i[l]-r.rects.reference[l],v=B(a),h=v?"y"===l?v.clientHeight||0:v.clientWidth||0:0,g=m/2-b/2,y=d[f],w=h-u[c]-d[p],x=h/2-u[c]/2+g,A=xe(y,x,w),E=l;r.modifiersData[n]=((t={})[E]=A,t.centerOffset=A-x,t)}},effect:function(e){var t=e.state,r=e.options.element,n=void 0===r?"[data-popper-arrow]":r;null!=n&&("string"!=typeof n||(n=t.elements.popper.querySelector(n)))&&be(t.elements.popper,n)&&(t.elements.arrow=n)},requires:["popperOffsets"],requiresIfExists:["preventOverflow"]},{name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:function(e){var t=e.state,r=e.name,n=t.rects.reference,o=t.rects.popper,a=t.modifiersData.preventOverflow,i=we(t,{elementContext:"reference"}),s=we(t,{altBoundary:!0}),l=Ae(i,n),c=Ae(s,o,a),d=Ee(l),u=Ee(c);t.modifiersData[r]={referenceClippingOffsets:l,popperEscapeOffsets:c,isReferenceHidden:d,hasPopperEscaped:u},t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-reference-hidden":d,"data-popper-escaped":u})}}]}),Oe=r(435);const Se=parseInt(Oe.size.baseline.value,10),ke="mds-popover--active",Te={init:()=>{Array.from(document.querySelectorAll(".js-mds-popover-trigger")).forEach((e=>{const t=`${e.getAttribute("id")}-content`,r=document.getElementById(t),n=r.dataset?r.dataset.placement:null,o=Le(e,r,{placement:n||"top-end",strategy:"fixed",modifiers:[{name:"offset",options:{offset:[0,3*Se]}},{name:"arrow",options:{padding:5}}]});e.setAttribute("aria-expanded","false"),r.setAttribute("aria-hidden","true"),e.addEventListener("click",(t=>{t.preventDefault(),o.update(),r.classList.toggle(ke),Te.setAriaAttr(e,r,ke)})),document.addEventListener("mousedown",(t=>{Te.hide(e,r,o,ke,t)})),document.addEventListener("keydown",(t=>{Te.hide(e,r,o,ke,t)}))}))},hide:(e,t,r,n,o)=>{e.contains(o.target)||r.state.elements.popper.contains(o.target)||!t.classList.contains(n)||(t.classList.remove(n),Te.setAriaAttr(e,t,n))},setAriaAttr:(e,t,r)=>{t.classList.contains(r)?(e.setAttribute("aria-expanded","true"),t.removeAttribute("aria-hidden")):(e.setAttribute("aria-expanded","false"),t.setAttribute("aria-hidden","true"))}},je=Te,De=r(435),qe=parseInt(De.size.breakpoint.md.value,10),Pe="data-modal-id",Ce="mds-modal--active";let Me;const Be={init:()=>{window.innerWidth>qe&&Array.from(document.querySelectorAll(`[${Pe}]`)).forEach((e=>{const t=e.getAttribute(Pe),r=document.getElementById(t),n=Array.from(r.querySelectorAll(".js-mds-modal-close")),o=r.getAttribute("data-site-container"),a=document.getElementById(o);let i=r.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]');i=Array.prototype.slice.call(i);const s=i[0],l=i[i.length-1];e.addEventListener("click",(e=>{e.preventDefault(),Be.open(r,s,a)})),r.addEventListener("click",(e=>{e.target===r&&Be.close(r,Me,a)})),r.addEventListener("keydown",(e=>{Be.trapFocus(e,s,l),"Escape"!==e.key&&"Esc"!==e.key||Be.close(r,Me,a)})),n.forEach((e=>{e.addEventListener("click",(()=>{Be.close(r,Me,a)}))}))}))},open:(e,t,r)=>{Me=document.activeElement,e.classList.add(Ce),t.focus(),r.setAttribute("aria-hidden","true")},close:(e,t,r)=>{r.removeAttribute("aria-hidden"),e.classList.remove(Ce),t.focus()},trapFocus:(e,t,r)=>{"Tab"===e.key&&(e.shiftKey?document.activeElement===t&&(e.preventDefault(),r.focus()):document.activeElement===r&&(e.preventDefault(),t.focus()))}},$e=Be,_e="mds-form-element--selected-file",Ne="mds-form-element--dragover",We={init:()=>{We.isBrowserIE()||Array.from(document.querySelectorAll(".mds-form-element--file")).forEach((e=>{e.classList.add("mds-form-element--file-supported");const t=e.querySelector(".mds-file-upload__file-name"),r=e.querySelector("input[type=file]"),n=e.querySelector(".mds-file-upload__remove-button");r.addEventListener("change",(()=>{r.files&&r.files.length&&(t.textContent=r.files[0].name,e.classList.add(_e),n.focus())})),n.addEventListener("click",(n=>{n.preventDefault(),r.value="",t.textContent="",e.classList.remove(_e),r.focus()})),["dragover","dragenter"].forEach((t=>{r.addEventListener(t,(t=>{t.stopPropagation(),e.classList.add(Ne)}))})),["dragleave","dragend","drop"].forEach((t=>{r.addEventListener(t,(t=>{t.stopPropagation(),e.classList.remove(Ne)}))}))}))},isBrowserIE:()=>!!window.document.documentMode},He=We,Re={init:()=>{Array.from(document.querySelectorAll(".mds-form-element--character-count")).forEach((e=>{const t=e.querySelector(".mds-form-control"),r=t.getAttribute("maxlength"),n=e.querySelector(".mds-form-message--character-count"),o=e.querySelector(".js-character-count-number");t.removeAttribute("maxlength"),Re.updateCounter(t,r,o,n),t.addEventListener("keyup",(e=>{e.stopPropagation(),Re.updateCounter(t,r,o,n)}))}))},updateCounter:(e,t,r,n)=>{const o=e.value.match(/(\r\n|\n|\r)/g),a=t-(e.value.length+(o?o.length:0));r.textContent=a,a<0?n.classList.add("mds-form-message--error"):n.classList.remove("mds-form-message--error")}},Ie=Re,ze={init:()=>{Array.from(document.querySelectorAll(".js-mds-button-double-submit")).forEach((e=>{e.addEventListener("click",(()=>{ze.toggleDisable(e)}))}))},toggleDisable:e=>{setTimeout((()=>{e.setAttribute("disabled","")}),1),setTimeout((()=>{e.removeAttribute("disabled")}),1e3)}},Fe=ze,Ue=()=>{Array.from(document.querySelectorAll(".mds-prose iframe, .mds-prose embed, .mds-prose object")).forEach((e=>{const t=document.createElement("div");t.classList.add("mds-fluid-video"),t.innerHTML=e.outerHTML,e.replaceWith(t)}))};document.addEventListener("DOMContentLoaded",(()=>{c.init(),v.init(),$e.init(),He.init(),Ie.init(),je.init(),Fe.init(),Ue()}))})(),(()=>{"use strict";r(807),r(616),r(516),r(626),r(333)})()})();
|
|
2
|
+
(()=>{var e={818:()=>{window.addEventListener("hashchange",(()=>{const e=window.location.hash.trim();Array.from(document.querySelectorAll(`a[href='${e}']`)).forEach((e=>{e.click()}))}),!1)},333:()=>{Array.prototype.find||Object.defineProperty(Array.prototype,"find",{value(e){if(null==this)throw TypeError('"this" is null or not defined');const t=Object(this),r=t.length>>>0;if("function"!=typeof e)throw TypeError("predicate must be a function");const n=arguments[1];let o=0;for(;o<r;){const r=t[o];if(e.call(n,r,o,t))return r;o++}},configurable:!0,writable:!0})},616:()=>{Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector),Element.prototype.closest||(Element.prototype.closest=function(e){let t=this;do{if(t.matches(e))return t;t=t.parentElement||t.parentNode}while(null!==t&&1===t.nodeType);return null})},626:()=>{"function"!=typeof Object.assign&&Object.defineProperty(Object,"assign",{value:function(e){if(null==e)throw new TypeError("Cannot convert undefined or null to object");const t=Object(e);for(let e=1;e<arguments.length;e++){const r=arguments[e];if(null!=r)for(const e in r)Object.prototype.hasOwnProperty.call(r,e)&&(t[e]=r[e])}return t},writable:!0,configurable:!0})},516:()=>{"remove"in Element.prototype||(Element.prototype.remove=function(){this.parentNode&&this.parentNode.removeChild(this)})},702:(e,t,r)=>{r.p=window.mdgx&&window.mdgx.baseUrl?window.mdgx.baseUrl:"/"},807:()=>{!function(){"use strict";if("undefined"!=typeof window&&window.addEventListener){var e,t,r,n=Object.create(null),o=function(){clearTimeout(t),t=setTimeout(e,100)},i=function(){},a=function(e){function t(e){var t;return void 0!==e.protocol?t=e:(t=document.createElement("a")).href=e,t.protocol.replace(/:/g,"")+t.host}var r,n,o;return window.XMLHttpRequest&&(r=new XMLHttpRequest,n=t(location),o=t(e),r=void 0===r.withCredentials&&""!==o&&o!==n?XDomainRequest||void 0:XMLHttpRequest),r},s="http://www.w3.org/1999/xlink";e=function(){var e,t,r,l,c,u,d,f,p,m,h=0;function v(){var e;0==(h-=1)&&(i(),window.addEventListener("resize",o,!1),window.addEventListener("orientationchange",o,!1),window.MutationObserver?((e=new MutationObserver(o)).observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0}),i=function(){try{e.disconnect(),window.removeEventListener("resize",o,!1),window.removeEventListener("orientationchange",o,!1)}catch(e){}}):(document.documentElement.addEventListener("DOMSubtreeModified",o,!1),i=function(){document.documentElement.removeEventListener("DOMSubtreeModified",o,!1),window.removeEventListener("resize",o,!1),window.removeEventListener("orientationchange",o,!1)}))}function b(e){return function(){!0!==n[e.base]&&(e.useEl.setAttributeNS(s,"xlink:href","#"+e.hash),e.useEl.hasAttribute("href")&&e.useEl.setAttribute("href","#"+e.hash))}}function g(e){return function(){var t,r=document.body,n=document.createElement("x");e.onload=null,n.innerHTML=e.responseText,(t=n.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",r.insertBefore(t,r.firstChild)),v()}}function y(e){return function(){e.onerror=null,e.ontimeout=null,v()}}for(i(),p=document.getElementsByTagName("use"),c=0;c<p.length;c+=1){try{t=p[c].getBoundingClientRect()}catch(e){t=!1}e=(f=(l=p[c].getAttribute("href")||p[c].getAttributeNS(s,"href")||p[c].getAttribute("xlink:href"))&&l.split?l.split("#"):["",""])[0],r=f[1],u=t&&0===t.left&&0===t.right&&0===t.top&&0===t.bottom,t&&0===t.width&&0===t.height&&!u?(p[c].hasAttribute("href")&&p[c].setAttributeNS(s,"xlink:href",l),e.length&&(!0!==(m=n[e])&&setTimeout(b({useEl:p[c],base:e,hash:r}),0),void 0===m&&void 0!==(d=a(e))&&(m=new d,n[e]=m,m.onload=g(m),m.onerror=y(m),m.ontimeout=y(m),m.open("GET",e),m.send(),h+=1))):u?e.length&&n[e]&&setTimeout(b({useEl:p[c],base:e,hash:r}),0):void 0===n[e]?n[e]=!0:n[e].onload&&(n[e].abort(),delete n[e].onload,n[e]=!0)}p="",h+=1,v()},r=function(){window.removeEventListener("load",r,!1),t=setTimeout(e,0)},"complete"!==document.readyState?window.addEventListener("load",r,!1):r()}}()},435:e=>{"use strict";e.exports=JSON.parse('{"color":{"neutral":{"base":{"value":"#707070","private":true},"light":{"value":"#949494","private":true},"lighter":{"value":"#DDDDDD","private":true},"lightest":{"value":"#F8F8F8","private":true},"darker":{"value":"#333333","private":true}},"status":{"error":{"light":{"value":"#fd0826","private":true},"lightest":{"value":"#ffe3e6","private":true},"dark":{"value":"#d0021b","private":true},"darkest":{"value":"#ae0216","private":true},"base":{"value":"#e1021d","private":true}},"success":{"light":{"value":"#6ac52d","private":true},"lightest":{"value":"#f0faea","private":true},"dark":{"value":"#549b24","private":true},"darkest":{"value":"#40791B","private":true},"base":{"value":"#5ba927","private":true}},"info":{"light":{"value":"#ffc442","private":true},"lightest":{"value":"#fff7e5","private":true},"dark":{"value":"#f4aa08","private":true},"darkest":{"value":"#946500","private":true},"base":{"value":"#ffb411","private":true}}}},"size":{"baseline":{"value":"4px","private":true},"breakpoint":{"sm":{"value":"400px","private":true},"md":{"value":"600px","private":true},"lg":{"value":"1008px","private":true},"xl":{"value":"1280px","private":true}},"gutter-width":{"value":"20px","private":true}}}')}},t={};function r(n){var o=t[n];if(void 0!==o)return o.exports;var i=t[n]={exports:{}};return e[n](i,i.exports,r),i.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.p="",(()=>{"use strict";r(702),r(818);const e=r(435),t="mds-tabs",n="mds-tabs__panel",o="mds-tabs__tab",i="mds-tabs__tab--selected",a="mds-tabs__panel--hidden",s=parseInt(e.size.breakpoint.lg.value,10),l={init:()=>{l.setTabs(".js-full-tabbed"),window.innerWidth>s&&l.setTabs(".js-desktop-tabbed")},setTabs:e=>{const r=Array.from(document.querySelectorAll(`${e} .${o}`)),a=Array.from(document.querySelectorAll(`${e} .mds-tabs__list`)),s=Array.from(document.querySelectorAll(`${e} .mds-tabs__list-item`)),c=Array.from(document.querySelectorAll(`${e} .${n}`));a.forEach((e=>{e.setAttribute("role","tablist")})),s.forEach((e=>{e.setAttribute("role","presentation")})),r.forEach((e=>{e.setAttribute("role","tab"),e.setAttribute("aria-controls",e.attributes.href.value.substring(1)),e.classList.contains(i)?e.setAttribute("tabindex","0"):e.setAttribute("tabindex","-1")})),c.forEach((e=>{e.setAttribute("role","tabpanel"),e.setAttribute("aria-labelledby",`label-${e.attributes.id.value}`)}));const u=document.querySelectorAll(`${e} .js-tabs-item`);Array.from(u).forEach((e=>{const r=window.location.hash.trim(),n=e.attributes.href.value,o=e.closest(`.${t}`),i=l.getAllPanels(o),a=l.getAllTabs(o),s=l.getTargetPanel(e,o);e.addEventListener("click",(t=>{t.preventDefault(),l.updateTabs(a,i,e,s,n)})),n===r&&l.updateTabs(a,i,e,s,n)})),a.forEach((e=>{const r=e.closest(`.${t}`),n=l.getAllPanels(r),o=l.getAllTabs(r);e.addEventListener("keydown",(t=>{switch(t.keyCode){case 37:case 38:t.preventDefault(),l.moveTab(e,r,o,n,!1);break;case 39:case 40:t.preventDefault(),l.moveTab(e,r,o,n,!0)}}))}))},getSelectedTab:e=>e.querySelector(`.${i}`),getPrevTab:e=>!!e.parentElement.previousSibling&&e.parentElement.previousSibling.querySelector(`.${o}`),getNextTab:e=>!!e.parentElement.nextSibling&&e.parentElement.nextSibling.querySelector(`.${o}`),getTargetPanel:(e,t)=>{const r=e.attributes.href.value;return t.querySelector(r)},getAllPanels:e=>Array.from(e.querySelectorAll(`.${n}`)),getAllTabs:e=>Array.from(e.querySelectorAll(`.${o}`)),moveTab:(e,t,r,n,o)=>{const i=l.getSelectedTab(e),a=o?l.getNextTab(i):l.getPrevTab(i);if(a){const e=a.attributes.href.value,o=l.getTargetPanel(a,t);l.updateTabs(r,n,a,o,e,!1)}},updateTabs:(e,t,r,n,o)=>{l.clearAllTabs(e),l.setActiveTab(r),l.clearAllPanels(t),l.setActivePanel(n,o)},clearAllTabs:e=>{e.forEach((e=>{e.classList.remove(i),e.setAttribute("aria-selected","false"),e.setAttribute("tabindex","-1")}))},clearAllPanels:e=>{e.forEach((e=>{e.classList.add(a)}))},setActiveTab:e=>{e.classList.add(i),e.setAttribute("aria-selected","true"),e.setAttribute("tabindex","0"),e.focus()},setActivePanel:(e,t)=>{e.classList.remove(a),window.history.replaceState({},"",t)}},c=l,u={init:()=>{const e=document.querySelectorAll(".mds-accordion--breakpoint"),t=window.innerWidth;e.forEach((e=>{u.checkBreakpoint(e,t)||(e.open=!0,e.querySelector("summary").style.display="none")})),document.querySelectorAll(".mds-accordion__label").forEach((e=>{e.addEventListener("click",(e=>{let{target:t}=e;const r=t.closest("details"),n=r.querySelector("summary");r.open=!1,n.focus()}))}))},checkBreakpoint:(e,t)=>{let r=0;if(e.dataset.bp){const n=e.dataset.bp.replace(/\D/g,"");let o,i;switch(e.dataset.bp.replace(/[0-9]/g,"")){case"px":r=n;break;case"em":case"rem":o=window.getComputedStyle(document.querySelector("body"))["font-size"],i=n*parseFloat(o),r=i;break;default:return!0}return!(t>r)}return!0}},d=u,f=()=>{document.querySelectorAll(".mds-checkbox-accordion__button").forEach((e=>{e.classList.contains("mds-checkbox-accordion__button--open")?e.setAttribute("aria-expanded","true"):e.setAttribute("aria-expanded","false"),e.addEventListener("click",(()=>{"true"===e.getAttribute("aria-expanded")?e.setAttribute("aria-expanded","false"):e.setAttribute("aria-expanded","true")}))}))};function p(e){var t=e.getBoundingClientRect();return{width:t.width,height:t.height,top:t.top,right:t.right,bottom:t.bottom,left:t.left,x:t.left,y:t.top}}function m(e){if(null==e)return window;if("[object Window]"!==e.toString()){var t=e.ownerDocument;return t&&t.defaultView||window}return e}function h(e){var t=m(e);return{scrollLeft:t.pageXOffset,scrollTop:t.pageYOffset}}function v(e){return e instanceof m(e).Element||e instanceof Element}function b(e){return e instanceof m(e).HTMLElement||e instanceof HTMLElement}function g(e){return"undefined"!=typeof ShadowRoot&&(e instanceof m(e).ShadowRoot||e instanceof ShadowRoot)}function y(e){return e?(e.nodeName||"").toLowerCase():null}function w(e){return((v(e)?e.ownerDocument:e.document)||window.document).documentElement}function x(e){return p(w(e)).left+h(e).scrollLeft}function E(e){return m(e).getComputedStyle(e)}function A(e){var t=E(e),r=t.overflow,n=t.overflowX,o=t.overflowY;return/auto|scroll|overlay|hidden/.test(r+o+n)}function O(e,t,r){void 0===r&&(r=!1);var n,o,i=w(t),a=p(e),s=b(t),l={scrollLeft:0,scrollTop:0},c={x:0,y:0};return(s||!s&&!r)&&(("body"!==y(t)||A(i))&&(l=(n=t)!==m(n)&&b(n)?{scrollLeft:(o=n).scrollLeft,scrollTop:o.scrollTop}:h(n)),b(t)?((c=p(t)).x+=t.clientLeft,c.y+=t.clientTop):i&&(c.x=x(i))),{x:a.left+l.scrollLeft-c.x,y:a.top+l.scrollTop-c.y,width:a.width,height:a.height}}function L(e){var t=p(e),r=e.offsetWidth,n=e.offsetHeight;return Math.abs(t.width-r)<=1&&(r=t.width),Math.abs(t.height-n)<=1&&(n=t.height),{x:e.offsetLeft,y:e.offsetTop,width:r,height:n}}function k(e){return"html"===y(e)?e:e.assignedSlot||e.parentNode||(g(e)?e.host:null)||w(e)}function S(e){return["html","body","#document"].indexOf(y(e))>=0?e.ownerDocument.body:b(e)&&A(e)?e:S(k(e))}function T(e,t){var r;void 0===t&&(t=[]);var n=S(e),o=n===(null==(r=e.ownerDocument)?void 0:r.body),i=m(n),a=o?[i].concat(i.visualViewport||[],A(n)?n:[]):n,s=t.concat(a);return o?s:s.concat(T(k(a)))}function j(e){return["table","td","th"].indexOf(y(e))>=0}function D(e){return b(e)&&"fixed"!==E(e).position?e.offsetParent:null}function q(e){for(var t=m(e),r=D(e);r&&j(r)&&"static"===E(r).position;)r=D(r);return r&&("html"===y(r)||"body"===y(r)&&"static"===E(r).position)?t:r||function(e){var t=-1!==navigator.userAgent.toLowerCase().indexOf("firefox");if(-1!==navigator.userAgent.indexOf("Trident")&&b(e)&&"fixed"===E(e).position)return null;for(var r=k(e);b(r)&&["html","body"].indexOf(y(r))<0;){var n=E(r);if("none"!==n.transform||"none"!==n.perspective||"paint"===n.contain||-1!==["transform","perspective"].indexOf(n.willChange)||t&&"filter"===n.willChange||t&&n.filter&&"none"!==n.filter)return r;r=r.parentNode}return null}(e)||t}var P="top",M="bottom",B="right",_="left",C="auto",W=[P,M,B,_],H="start",R="end",N="viewport",$="popper",I=W.reduce((function(e,t){return e.concat([t+"-"+H,t+"-"+R])}),[]),z=[].concat(W,[C]).reduce((function(e,t){return e.concat([t,t+"-"+H,t+"-"+R])}),[]),F=["beforeRead","read","afterRead","beforeMain","main","afterMain","beforeWrite","write","afterWrite"];function U(e){var t=new Map,r=new Set,n=[];function o(e){r.add(e.name),[].concat(e.requires||[],e.requiresIfExists||[]).forEach((function(e){if(!r.has(e)){var n=t.get(e);n&&o(n)}})),n.push(e)}return e.forEach((function(e){t.set(e.name,e)})),e.forEach((function(e){r.has(e.name)||o(e)})),n}var V={placement:"bottom",modifiers:[],strategy:"absolute"};function X(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];return!t.some((function(e){return!(e&&"function"==typeof e.getBoundingClientRect)}))}function Y(e){void 0===e&&(e={});var t=e,r=t.defaultModifiers,n=void 0===r?[]:r,o=t.defaultOptions,i=void 0===o?V:o;return function(e,t,r){void 0===r&&(r=i);var o,a,s={placement:"bottom",orderedModifiers:[],options:Object.assign({},V,i),modifiersData:{},elements:{reference:e,popper:t},attributes:{},styles:{}},l=[],c=!1,u={state:s,setOptions:function(r){d(),s.options=Object.assign({},i,s.options,r),s.scrollParents={reference:v(e)?T(e):e.contextElement?T(e.contextElement):[],popper:T(t)};var o,a,c=function(e){var t=U(e);return F.reduce((function(e,r){return e.concat(t.filter((function(e){return e.phase===r})))}),[])}((o=[].concat(n,s.options.modifiers),a=o.reduce((function(e,t){var r=e[t.name];return e[t.name]=r?Object.assign({},r,t,{options:Object.assign({},r.options,t.options),data:Object.assign({},r.data,t.data)}):t,e}),{}),Object.keys(a).map((function(e){return a[e]}))));return s.orderedModifiers=c.filter((function(e){return e.enabled})),s.orderedModifiers.forEach((function(e){var t=e.name,r=e.options,n=void 0===r?{}:r,o=e.effect;if("function"==typeof o){var i=o({state:s,name:t,instance:u,options:n});l.push(i||function(){})}})),u.update()},forceUpdate:function(){if(!c){var e=s.elements,t=e.reference,r=e.popper;if(X(t,r)){s.rects={reference:O(t,q(r),"fixed"===s.options.strategy),popper:L(r)},s.reset=!1,s.placement=s.options.placement,s.orderedModifiers.forEach((function(e){return s.modifiersData[e.name]=Object.assign({},e.data)}));for(var n=0;n<s.orderedModifiers.length;n++)if(!0!==s.reset){var o=s.orderedModifiers[n],i=o.fn,a=o.options,l=void 0===a?{}:a,d=o.name;"function"==typeof i&&(s=i({state:s,options:l,name:d,instance:u})||s)}else s.reset=!1,n=-1}}},update:(o=function(){return new Promise((function(e){u.forceUpdate(),e(s)}))},function(){return a||(a=new Promise((function(e){Promise.resolve().then((function(){a=void 0,e(o())}))}))),a}),destroy:function(){d(),c=!0}};if(!X(e,t))return u;function d(){l.forEach((function(e){return e()})),l=[]}return u.setOptions(r).then((function(e){!c&&r.onFirstUpdate&&r.onFirstUpdate(e)})),u}}var G={passive:!0};const J={name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:function(e){var t=e.state,r=e.instance,n=e.options,o=n.scroll,i=void 0===o||o,a=n.resize,s=void 0===a||a,l=m(t.elements.popper),c=[].concat(t.scrollParents.reference,t.scrollParents.popper);return i&&c.forEach((function(e){e.addEventListener("scroll",r.update,G)})),s&&l.addEventListener("resize",r.update,G),function(){i&&c.forEach((function(e){e.removeEventListener("scroll",r.update,G)})),s&&l.removeEventListener("resize",r.update,G)}},data:{}};function K(e){return e.split("-")[0]}function Q(e){return e.split("-")[1]}function Z(e){return["top","bottom"].indexOf(e)>=0?"x":"y"}function ee(e){var t,r=e.reference,n=e.element,o=e.placement,i=o?K(o):null,a=o?Q(o):null,s=r.x+r.width/2-n.width/2,l=r.y+r.height/2-n.height/2;switch(i){case P:t={x:s,y:r.y-n.height};break;case M:t={x:s,y:r.y+r.height};break;case B:t={x:r.x+r.width,y:l};break;case _:t={x:r.x-n.width,y:l};break;default:t={x:r.x,y:r.y}}var c=i?Z(i):null;if(null!=c){var u="y"===c?"height":"width";switch(a){case H:t[c]=t[c]-(r[u]/2-n[u]/2);break;case R:t[c]=t[c]+(r[u]/2-n[u]/2)}}return t}const te={name:"popperOffsets",enabled:!0,phase:"read",fn:function(e){var t=e.state,r=e.name;t.modifiersData[r]=ee({reference:t.rects.reference,element:t.rects.popper,strategy:"absolute",placement:t.placement})},data:{}};var re=Math.max,ne=Math.min,oe=Math.round,ie={top:"auto",right:"auto",bottom:"auto",left:"auto"};function ae(e){var t,r=e.popper,n=e.popperRect,o=e.placement,i=e.offsets,a=e.position,s=e.gpuAcceleration,l=e.adaptive,c=e.roundOffsets,u=!0===c?function(e){var t=e.x,r=e.y,n=window.devicePixelRatio||1;return{x:oe(oe(t*n)/n)||0,y:oe(oe(r*n)/n)||0}}(i):"function"==typeof c?c(i):i,d=u.x,f=void 0===d?0:d,p=u.y,h=void 0===p?0:p,v=i.hasOwnProperty("x"),b=i.hasOwnProperty("y"),g=_,y=P,x=window;if(l){var A=q(r),O="clientHeight",L="clientWidth";A===m(r)&&"static"!==E(A=w(r)).position&&(O="scrollHeight",L="scrollWidth"),o===P&&(y=M,h-=A[O]-n.height,h*=s?1:-1),o===_&&(g=B,f-=A[L]-n.width,f*=s?1:-1)}var k,S=Object.assign({position:a},l&&ie);return s?Object.assign({},S,((k={})[y]=b?"0":"",k[g]=v?"0":"",k.transform=(x.devicePixelRatio||1)<2?"translate("+f+"px, "+h+"px)":"translate3d("+f+"px, "+h+"px, 0)",k)):Object.assign({},S,((t={})[y]=b?h+"px":"",t[g]=v?f+"px":"",t.transform="",t))}var se={left:"right",right:"left",bottom:"top",top:"bottom"};function le(e){return e.replace(/left|right|bottom|top/g,(function(e){return se[e]}))}var ce={start:"end",end:"start"};function ue(e){return e.replace(/start|end/g,(function(e){return ce[e]}))}function de(e,t){var r=t.getRootNode&&t.getRootNode();if(e.contains(t))return!0;if(r&&g(r)){var n=t;do{if(n&&e.isSameNode(n))return!0;n=n.parentNode||n.host}while(n)}return!1}function fe(e){return Object.assign({},e,{left:e.x,top:e.y,right:e.x+e.width,bottom:e.y+e.height})}function pe(e,t){return t===N?fe(function(e){var t=m(e),r=w(e),n=t.visualViewport,o=r.clientWidth,i=r.clientHeight,a=0,s=0;return n&&(o=n.width,i=n.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(a=n.offsetLeft,s=n.offsetTop)),{width:o,height:i,x:a+x(e),y:s}}(e)):b(t)?function(e){var t=p(e);return t.top=t.top+e.clientTop,t.left=t.left+e.clientLeft,t.bottom=t.top+e.clientHeight,t.right=t.left+e.clientWidth,t.width=e.clientWidth,t.height=e.clientHeight,t.x=t.left,t.y=t.top,t}(t):fe(function(e){var t,r=w(e),n=h(e),o=null==(t=e.ownerDocument)?void 0:t.body,i=re(r.scrollWidth,r.clientWidth,o?o.scrollWidth:0,o?o.clientWidth:0),a=re(r.scrollHeight,r.clientHeight,o?o.scrollHeight:0,o?o.clientHeight:0),s=-n.scrollLeft+x(e),l=-n.scrollTop;return"rtl"===E(o||r).direction&&(s+=re(r.clientWidth,o?o.clientWidth:0)-i),{width:i,height:a,x:s,y:l}}(w(e)))}function me(e){return Object.assign({},{top:0,right:0,bottom:0,left:0},e)}function he(e,t){return t.reduce((function(t,r){return t[r]=e,t}),{})}function ve(e,t){void 0===t&&(t={});var r=t,n=r.placement,o=void 0===n?e.placement:n,i=r.boundary,a=void 0===i?"clippingParents":i,s=r.rootBoundary,l=void 0===s?N:s,c=r.elementContext,u=void 0===c?$:c,d=r.altBoundary,f=void 0!==d&&d,m=r.padding,h=void 0===m?0:m,g=me("number"!=typeof h?h:he(h,W)),x=u===$?"reference":$,A=e.elements.reference,O=e.rects.popper,L=e.elements[f?x:u],S=function(e,t,r){var n="clippingParents"===t?function(e){var t=T(k(e)),r=["absolute","fixed"].indexOf(E(e).position)>=0&&b(e)?q(e):e;return v(r)?t.filter((function(e){return v(e)&&de(e,r)&&"body"!==y(e)})):[]}(e):[].concat(t),o=[].concat(n,[r]),i=o[0],a=o.reduce((function(t,r){var n=pe(e,r);return t.top=re(n.top,t.top),t.right=ne(n.right,t.right),t.bottom=ne(n.bottom,t.bottom),t.left=re(n.left,t.left),t}),pe(e,i));return a.width=a.right-a.left,a.height=a.bottom-a.top,a.x=a.left,a.y=a.top,a}(v(L)?L:L.contextElement||w(e.elements.popper),a,l),j=p(A),D=ee({reference:j,element:O,strategy:"absolute",placement:o}),_=fe(Object.assign({},O,D)),C=u===$?_:j,H={top:S.top-C.top+g.top,bottom:C.bottom-S.bottom+g.bottom,left:S.left-C.left+g.left,right:C.right-S.right+g.right},R=e.modifiersData.offset;if(u===$&&R){var I=R[o];Object.keys(H).forEach((function(e){var t=[B,M].indexOf(e)>=0?1:-1,r=[P,M].indexOf(e)>=0?"y":"x";H[e]+=I[r]*t}))}return H}function be(e,t,r){return re(e,ne(t,r))}function ge(e,t,r){return void 0===r&&(r={x:0,y:0}),{top:e.top-t.height-r.y,right:e.right-t.width+r.x,bottom:e.bottom-t.height+r.y,left:e.left-t.width-r.x}}function ye(e){return[P,B,M,_].some((function(t){return e[t]>=0}))}var we=Y({defaultModifiers:[J,te,{name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:function(e){var t=e.state,r=e.options,n=r.gpuAcceleration,o=void 0===n||n,i=r.adaptive,a=void 0===i||i,s=r.roundOffsets,l=void 0===s||s,c={placement:K(t.placement),popper:t.elements.popper,popperRect:t.rects.popper,gpuAcceleration:o};null!=t.modifiersData.popperOffsets&&(t.styles.popper=Object.assign({},t.styles.popper,ae(Object.assign({},c,{offsets:t.modifiersData.popperOffsets,position:t.options.strategy,adaptive:a,roundOffsets:l})))),null!=t.modifiersData.arrow&&(t.styles.arrow=Object.assign({},t.styles.arrow,ae(Object.assign({},c,{offsets:t.modifiersData.arrow,position:"absolute",adaptive:!1,roundOffsets:l})))),t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-placement":t.placement})},data:{}},{name:"applyStyles",enabled:!0,phase:"write",fn:function(e){var t=e.state;Object.keys(t.elements).forEach((function(e){var r=t.styles[e]||{},n=t.attributes[e]||{},o=t.elements[e];b(o)&&y(o)&&(Object.assign(o.style,r),Object.keys(n).forEach((function(e){var t=n[e];!1===t?o.removeAttribute(e):o.setAttribute(e,!0===t?"":t)})))}))},effect:function(e){var t=e.state,r={popper:{position:t.options.strategy,left:"0",top:"0",margin:"0"},arrow:{position:"absolute"},reference:{}};return Object.assign(t.elements.popper.style,r.popper),t.styles=r,t.elements.arrow&&Object.assign(t.elements.arrow.style,r.arrow),function(){Object.keys(t.elements).forEach((function(e){var n=t.elements[e],o=t.attributes[e]||{},i=Object.keys(t.styles.hasOwnProperty(e)?t.styles[e]:r[e]).reduce((function(e,t){return e[t]="",e}),{});b(n)&&y(n)&&(Object.assign(n.style,i),Object.keys(o).forEach((function(e){n.removeAttribute(e)})))}))}},requires:["computeStyles"]},{name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:function(e){var t=e.state,r=e.options,n=e.name,o=r.offset,i=void 0===o?[0,0]:o,a=z.reduce((function(e,r){return e[r]=function(e,t,r){var n=K(e),o=[_,P].indexOf(n)>=0?-1:1,i="function"==typeof r?r(Object.assign({},t,{placement:e})):r,a=i[0],s=i[1];return a=a||0,s=(s||0)*o,[_,B].indexOf(n)>=0?{x:s,y:a}:{x:a,y:s}}(r,t.rects,i),e}),{}),s=a[t.placement],l=s.x,c=s.y;null!=t.modifiersData.popperOffsets&&(t.modifiersData.popperOffsets.x+=l,t.modifiersData.popperOffsets.y+=c),t.modifiersData[n]=a}},{name:"flip",enabled:!0,phase:"main",fn:function(e){var t=e.state,r=e.options,n=e.name;if(!t.modifiersData[n]._skip){for(var o=r.mainAxis,i=void 0===o||o,a=r.altAxis,s=void 0===a||a,l=r.fallbackPlacements,c=r.padding,u=r.boundary,d=r.rootBoundary,f=r.altBoundary,p=r.flipVariations,m=void 0===p||p,h=r.allowedAutoPlacements,v=t.options.placement,b=K(v),g=l||(b!==v&&m?function(e){if(K(e)===C)return[];var t=le(e);return[ue(e),t,ue(t)]}(v):[le(v)]),y=[v].concat(g).reduce((function(e,r){return e.concat(K(r)===C?function(e,t){void 0===t&&(t={});var r=t,n=r.placement,o=r.boundary,i=r.rootBoundary,a=r.padding,s=r.flipVariations,l=r.allowedAutoPlacements,c=void 0===l?z:l,u=Q(n),d=u?s?I:I.filter((function(e){return Q(e)===u})):W,f=d.filter((function(e){return c.indexOf(e)>=0}));0===f.length&&(f=d);var p=f.reduce((function(t,r){return t[r]=ve(e,{placement:r,boundary:o,rootBoundary:i,padding:a})[K(r)],t}),{});return Object.keys(p).sort((function(e,t){return p[e]-p[t]}))}(t,{placement:r,boundary:u,rootBoundary:d,padding:c,flipVariations:m,allowedAutoPlacements:h}):r)}),[]),w=t.rects.reference,x=t.rects.popper,E=new Map,A=!0,O=y[0],L=0;L<y.length;L++){var k=y[L],S=K(k),T=Q(k)===H,j=[P,M].indexOf(S)>=0,D=j?"width":"height",q=ve(t,{placement:k,boundary:u,rootBoundary:d,altBoundary:f,padding:c}),R=j?T?B:_:T?M:P;w[D]>x[D]&&(R=le(R));var N=le(R),$=[];if(i&&$.push(q[S]<=0),s&&$.push(q[R]<=0,q[N]<=0),$.every((function(e){return e}))){O=k,A=!1;break}E.set(k,$)}if(A)for(var F=function(e){var t=y.find((function(t){var r=E.get(t);if(r)return r.slice(0,e).every((function(e){return e}))}));if(t)return O=t,"break"},U=m?3:1;U>0&&"break"!==F(U);U--);t.placement!==O&&(t.modifiersData[n]._skip=!0,t.placement=O,t.reset=!0)}},requiresIfExists:["offset"],data:{_skip:!1}},{name:"preventOverflow",enabled:!0,phase:"main",fn:function(e){var t=e.state,r=e.options,n=e.name,o=r.mainAxis,i=void 0===o||o,a=r.altAxis,s=void 0!==a&&a,l=r.boundary,c=r.rootBoundary,u=r.altBoundary,d=r.padding,f=r.tether,p=void 0===f||f,m=r.tetherOffset,h=void 0===m?0:m,v=ve(t,{boundary:l,rootBoundary:c,padding:d,altBoundary:u}),b=K(t.placement),g=Q(t.placement),y=!g,w=Z(b),x="x"===w?"y":"x",E=t.modifiersData.popperOffsets,A=t.rects.reference,O=t.rects.popper,k="function"==typeof h?h(Object.assign({},t.rects,{placement:t.placement})):h,S={x:0,y:0};if(E){if(i||s){var T="y"===w?P:_,j="y"===w?M:B,D="y"===w?"height":"width",C=E[w],W=E[w]+v[T],R=E[w]-v[j],N=p?-O[D]/2:0,$=g===H?A[D]:O[D],I=g===H?-O[D]:-A[D],z=t.elements.arrow,F=p&&z?L(z):{width:0,height:0},U=t.modifiersData["arrow#persistent"]?t.modifiersData["arrow#persistent"].padding:{top:0,right:0,bottom:0,left:0},V=U[T],X=U[j],Y=be(0,A[D],F[D]),G=y?A[D]/2-N-Y-V-k:$-Y-V-k,J=y?-A[D]/2+N+Y+X+k:I+Y+X+k,ee=t.elements.arrow&&q(t.elements.arrow),te=ee?"y"===w?ee.clientTop||0:ee.clientLeft||0:0,oe=t.modifiersData.offset?t.modifiersData.offset[t.placement][w]:0,ie=E[w]+G-oe-te,ae=E[w]+J-oe;if(i){var se=be(p?ne(W,ie):W,C,p?re(R,ae):R);E[w]=se,S[w]=se-C}if(s){var le="x"===w?P:_,ce="x"===w?M:B,ue=E[x],de=ue+v[le],fe=ue-v[ce],pe=be(p?ne(de,ie):de,ue,p?re(fe,ae):fe);E[x]=pe,S[x]=pe-ue}}t.modifiersData[n]=S}},requiresIfExists:["offset"]},{name:"arrow",enabled:!0,phase:"main",fn:function(e){var t,r=e.state,n=e.name,o=e.options,i=r.elements.arrow,a=r.modifiersData.popperOffsets,s=K(r.placement),l=Z(s),c=[_,B].indexOf(s)>=0?"height":"width";if(i&&a){var u=function(e,t){return me("number"!=typeof(e="function"==typeof e?e(Object.assign({},t.rects,{placement:t.placement})):e)?e:he(e,W))}(o.padding,r),d=L(i),f="y"===l?P:_,p="y"===l?M:B,m=r.rects.reference[c]+r.rects.reference[l]-a[l]-r.rects.popper[c],h=a[l]-r.rects.reference[l],v=q(i),b=v?"y"===l?v.clientHeight||0:v.clientWidth||0:0,g=m/2-h/2,y=u[f],w=b-d[c]-u[p],x=b/2-d[c]/2+g,E=be(y,x,w),A=l;r.modifiersData[n]=((t={})[A]=E,t.centerOffset=E-x,t)}},effect:function(e){var t=e.state,r=e.options.element,n=void 0===r?"[data-popper-arrow]":r;null!=n&&("string"!=typeof n||(n=t.elements.popper.querySelector(n)))&&de(t.elements.popper,n)&&(t.elements.arrow=n)},requires:["popperOffsets"],requiresIfExists:["preventOverflow"]},{name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:function(e){var t=e.state,r=e.name,n=t.rects.reference,o=t.rects.popper,i=t.modifiersData.preventOverflow,a=ve(t,{elementContext:"reference"}),s=ve(t,{altBoundary:!0}),l=ge(a,n),c=ge(s,o,i),u=ye(l),d=ye(c);t.modifiersData[r]={referenceClippingOffsets:l,popperEscapeOffsets:c,isReferenceHidden:u,hasPopperEscaped:d},t.attributes.popper=Object.assign({},t.attributes.popper,{"data-popper-reference-hidden":u,"data-popper-escaped":d})}}]}),xe=r(435);const Ee=parseInt(xe.size.baseline.value,10),Ae="mds-popover--active",Oe={init:()=>{Array.from(document.querySelectorAll(".js-mds-popover-trigger")).forEach((e=>{const t=`${e.getAttribute("id")}-content`,r=document.getElementById(t),n=r.dataset?r.dataset.placement:null,o=we(e,r,{placement:n||"top-end",strategy:"fixed",modifiers:[{name:"offset",options:{offset:[0,3*Ee]}},{name:"arrow",options:{padding:5}}]});e.setAttribute("aria-expanded","false"),r.setAttribute("aria-hidden","true"),e.addEventListener("click",(t=>{t.preventDefault(),o.update(),r.classList.toggle(Ae),Oe.setAriaAttr(e,r,Ae)})),document.addEventListener("mousedown",(t=>{Oe.hide(e,r,o,Ae,t)})),document.addEventListener("keydown",(t=>{Oe.hide(e,r,o,Ae,t)}))}))},hide:(e,t,r,n,o)=>{e.contains(o.target)||r.state.elements.popper.contains(o.target)||!t.classList.contains(n)||(t.classList.remove(n),Oe.setAriaAttr(e,t,n))},setAriaAttr:(e,t,r)=>{t.classList.contains(r)?(e.setAttribute("aria-expanded","true"),t.removeAttribute("aria-hidden")):(e.setAttribute("aria-expanded","false"),t.setAttribute("aria-hidden","true"))}},Le=Oe,ke=r(435),Se=parseInt(ke.size.breakpoint.md.value,10),Te="data-modal-id",je="mds-modal--active";let De;const qe={init:()=>{window.innerWidth>Se&&Array.from(document.querySelectorAll(`[${Te}]`)).forEach((e=>{const t=e.getAttribute(Te),r=document.getElementById(t),n=Array.from(r.querySelectorAll(".js-mds-modal-close")),o=r.getAttribute("data-site-container"),i=document.getElementById(o);let a=r.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]');a=Array.prototype.slice.call(a);const s=a[0],l=a[a.length-1];e.addEventListener("click",(e=>{e.preventDefault(),qe.open(r,s,i)})),r.addEventListener("click",(e=>{e.target===r&&qe.close(r,De,i)})),r.addEventListener("keydown",(e=>{qe.trapFocus(e,s,l),"Escape"!==e.key&&"Esc"!==e.key||qe.close(r,De,i)})),n.forEach((e=>{e.addEventListener("click",(()=>{qe.close(r,De,i)}))}))}))},open:(e,t,r)=>{De=document.activeElement,e.classList.add(je),t.focus(),r.setAttribute("aria-hidden","true")},close:(e,t,r)=>{r.removeAttribute("aria-hidden"),e.classList.remove(je),t.focus()},trapFocus:(e,t,r)=>{"Tab"===e.key&&(e.shiftKey?document.activeElement===t&&(e.preventDefault(),r.focus()):document.activeElement===r&&(e.preventDefault(),t.focus()))}},Pe=qe,Me="mds-form-element--selected-file",Be="mds-form-element--dragover",_e={init:()=>{_e.isBrowserIE()||Array.from(document.querySelectorAll(".mds-form-element--file")).forEach((e=>{e.classList.add("mds-form-element--file-supported");const t=e.querySelector(".mds-file-upload__file-name"),r=e.querySelector("input[type=file]"),n=e.querySelector(".mds-file-upload__remove-button");document.addEventListener("readystatechange",(()=>{r.files&&r.files.length&&(t.textContent=r.files[0].name,e.classList.add(Me))})),r.addEventListener("change",(()=>{r.files&&r.files.length&&(t.textContent=r.files[0].name,e.classList.add(Me),n.focus())})),n.addEventListener("click",(n=>{n.preventDefault(),r.value="",t.textContent="",e.classList.remove(Me),r.focus()})),["dragover","dragenter"].forEach((t=>{r.addEventListener(t,(t=>{t.stopPropagation(),e.classList.add(Be)}))})),["dragleave","dragend","drop"].forEach((t=>{r.addEventListener(t,(t=>{t.stopPropagation(),e.classList.remove(Be)}))}))}))},isBrowserIE:()=>!!window.document.documentMode},Ce=_e,We={init:()=>{Array.from(document.querySelectorAll(".mds-form-element--character-count")).forEach((e=>{const t=e.querySelector(".mds-form-control"),r=t.getAttribute("maxlength"),n=e.querySelector(".mds-form-message--character-count"),o=e.querySelector(".js-character-count-number");t.removeAttribute("maxlength"),We.updateCounter(t,r,o,n),t.addEventListener("keyup",(e=>{e.stopPropagation(),We.updateCounter(t,r,o,n)}))}))},updateCounter:(e,t,r,n)=>{const o=e.value.match(/(\r\n|\n|\r)/g),i=t-(e.value.length+(o?o.length:0));r.textContent=i,i<0?n.classList.add("mds-form-message--error"):n.classList.remove("mds-form-message--error")}},He=We,Re={init:()=>{Array.from(document.querySelectorAll(".js-mds-button-double-submit")).forEach((e=>{e.addEventListener("click",(()=>{Re.toggleDisable(e)}))}))},toggleDisable:e=>{setTimeout((()=>{e.setAttribute("disabled","")}),1),setTimeout((()=>{e.removeAttribute("disabled")}),1e3)}},Ne=Re,$e=()=>{Array.from(document.querySelectorAll(".mds-prose iframe, .mds-prose embed, .mds-prose object")).forEach((e=>{const t=document.createElement("div");t.classList.add("mds-fluid-video"),t.innerHTML=e.outerHTML,e.replaceWith(t)}))};document.addEventListener("DOMContentLoaded",(()=>{c.init(),d.init(),f(),Pe.init(),Ce.init(),He.init(),Le.init(),Ne.init(),$e()}))})(),(()=>{"use strict";r(807),r(616),r(516),r(626),r(333)})()})();
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@madgex/design-system",
|
|
3
3
|
"author": "Madgex",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
|
-
"version": "
|
|
5
|
+
"version": "8.0.0",
|
|
6
6
|
"main": "dist/js/index.js",
|
|
7
7
|
"exports": {
|
|
8
8
|
".": "./dist/js/index.js",
|
|
@@ -98,5 +98,5 @@
|
|
|
98
98
|
"webpack-dev-server": "^3.11.2",
|
|
99
99
|
"webpack-stream": "^6.1.2"
|
|
100
100
|
},
|
|
101
|
-
"gitHead": "
|
|
101
|
+
"gitHead": "e53df09fd38d526d1e9417e3282bff252a9f6579"
|
|
102
102
|
}
|
|
@@ -1,33 +1,22 @@
|
|
|
1
1
|
## Parameters
|
|
2
2
|
|
|
3
|
-
- `
|
|
4
|
-
- `
|
|
5
|
-
- `triggerLabelActive`: label of the trigger button when accordion is expanded
|
|
6
|
-
- `ariaLabel`: Adds an aria label that overrides trigger button text for screen reader users. This should be used whenever the visual label will not provide enough context for screen reader users alone.
|
|
7
|
-
- `ariaLabelActive` : This replaces the aria label in the active accordion state.
|
|
8
|
-
- `triggerNoJsHidden`: trigger button to show/hide when js is disabled
|
|
9
|
-
- `triggerHtmlTag`: trigger is `p` tag by default, you can pass an html tag if needed (`h2`, `h3`, `div`)
|
|
10
|
-
Note: Don't use `span` as it creates a bug with VoiceOver where you can't access the expanded content when the trigger is within an inline, inline block or floated element.
|
|
3
|
+
- `trigger`: trigger of the trigger button. Be as descriptive as you can as it will help for a11y. **required**
|
|
4
|
+
- `triggerActive`: trigger of the trigger button when accordion is expanded
|
|
11
5
|
- `triggerClasses`: class will be added to the trigger (useful to change the font size)
|
|
12
|
-
- `
|
|
13
|
-
- `
|
|
14
|
-
- `content`: this can also be a custom component or html **required**
|
|
15
|
-
- `expandIcon`: This allows you to override the iconography for the expand icon (default: chevron-down) - See design usage guidelines
|
|
16
|
-
- `collapseIcon`: This allows you to override the iconography for the collapse icon (default: chevron-up) - See design usage guidelines
|
|
17
|
-
- `leftAligned`: This will determine if the icon should sit on the left or the right of the label (default: false) - See design usage guidelines
|
|
6
|
+
- `icon`: override the default icon for the closed state
|
|
7
|
+
- `iconActive`: override the default icon for the open state
|
|
18
8
|
- `noIcon`: Boolean, removes the icon from the accordion completely
|
|
19
|
-
- `
|
|
20
|
-
- `
|
|
21
|
-
- `
|
|
9
|
+
- `isActive`: if `true`, the accordion will be expanded by default
|
|
10
|
+
- `nonClosing`: boolean to visually hide (for accessibility) the trigger and keep the accordion expanded
|
|
11
|
+
- `breakpoint`: if a value (in px, em, rem) is passed, the accordion will be enabled only when screen size is smaller than the breakpoint
|
|
12
|
+
- `leftAligned`: This will determine if the icon should sit on the left or the right of the trigger (default: false) - See design usage guidelines
|
|
22
13
|
- `contentFirst`: Boolean, places the content above the trigger, pushing the trigger down below the content when open
|
|
23
14
|
|
|
15
|
+
- `content`: this can also be a custom component or html **required**
|
|
16
|
+
- NOTE: this should be entered using the call syntax and not as a paramater. An example can be seen in accordion.njk
|
|
24
17
|
|
|
25
18
|
## Accessibility
|
|
26
19
|
|
|
27
|
-
When javascript is enabled, accordion will contains `aria-label` and `aria-expanded` for screen readers.
|
|
28
|
-
`triggerIsNonClosing` will set `aria-disabled` and `aria-expanded` to true once the accordion has been triggered
|
|
29
|
-
Use a descriptive label for the trigger.
|
|
30
|
-
|
|
31
20
|
When using the non closing accordion, the trigger will be disabled and hidden from view so screenreaders can inform that the content has been expanded. The trigger is also removed from the navigation flow to make sure that it can't be tabbed into when using a keyboard.
|
|
32
21
|
|
|
33
22
|
## Design usage guidelines
|
|
@@ -35,12 +24,14 @@ When using the non closing accordion, the trigger will be disabled and hidden fr
|
|
|
35
24
|
Where possible, the defaults should remain as they are to ensure we remain consistent across the platform, though there are a few areas where you may need to step
|
|
36
25
|
outside these guidelines, this offers an insight into the design decisions to best ensure you understand context and usage.
|
|
37
26
|
|
|
38
|
-
- `
|
|
39
|
-
- `
|
|
27
|
+
- `icon`: Where possible, we should ensure that this remains unchanged as the triangles are a universal indicator of collapsable content. However, there are scenarios where this may not work for you. In these scenarios, it is suggested you use one of the following icons: `minus`
|
|
28
|
+
- `iconActive`: Where possible, we should ensure that this remains unchanged as the triangles are a universal indicator of expandable content. However, there are scenarios where this may not work for you. In these scenarios, it is suggested you use one of the following icons: `plus-small` (Plus is a little too big to align nicely with the content of the trigger)
|
|
40
29
|
- `leftAligned`: Usage for this parameter depends largely on the content surrounding it. There are some cases where we have a list where some items are expandable while others are not so to avoid a misalignment due to the presence of icons or not, we've decided that when in a list the accordions would have the icons on the right. When used as a single component on the page, the icon is on the left instead.
|
|
41
30
|
|
|
42
31
|
## Notes
|
|
43
32
|
|
|
33
|
+
- 15/08/24 - Move to `details` broswer native accordion type component.
|
|
34
|
+
|
|
44
35
|
- 09/12/20 - Non closing accordion - Moved `mds-visually-hidden` to trigger's parent. We noticed an issue on NVDA in Chrome, where the changes on the button like `aria-expanded` or `aria-disabled` were not announced when the button itself was visually hidden.
|
|
45
36
|
|
|
46
37
|
- 02/11/20 - `aria-controls` attribute has been removed from the accordion as it is poorly supported and doesn't work as expected.
|
|
@@ -1,72 +1,38 @@
|
|
|
1
|
-
{
|
|
1
|
+
{%- from "../icons/_macro.njk" import MdsIcon -%}
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
{%- if params.
|
|
6
|
-
|
|
7
|
-
{%-
|
|
8
|
-
|
|
9
|
-
{%- endif -%}
|
|
10
|
-
{% endset -%}
|
|
11
|
-
{%- set collapseIcon -%}
|
|
12
|
-
{%- if params.collapseIcon -%}
|
|
13
|
-
{{params.collapseIcon}}
|
|
14
|
-
{%- else -%}
|
|
15
|
-
chevron-up
|
|
16
|
-
{%- endif -%}
|
|
17
|
-
{% endset -%}
|
|
18
|
-
{%- set expandIcon %}
|
|
19
|
-
{%- if params.expandIcon -%}
|
|
20
|
-
{{params.expandIcon}}
|
|
21
|
-
{%- else -%}
|
|
22
|
-
chevron-down
|
|
23
|
-
{%- endif -%}
|
|
24
|
-
{%- endset -%}
|
|
3
|
+
<details
|
|
4
|
+
class="mds-accordion
|
|
5
|
+
{%- if params.nonClosing %} mds-accordion--non-closing{% endif -%}
|
|
6
|
+
{%- if params.leftAligned %} mds-accordion--left-aligned{% endif -%}
|
|
7
|
+
{%- if params.breakpoint %} mds-accordion--breakpoint{% endif -%}
|
|
8
|
+
{%- if params.contentFirst %} mds-accordion--content-first{% endif -%}"
|
|
25
9
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
{%- if params.leftAligned and not params.noIcon -%}
|
|
39
|
-
{{- MdsIcon({ iconName: collapseIcon, classes: 'mds-icon--before mds-accordion-trigger__icon-collapse'}) -}}
|
|
40
|
-
{{- MdsIcon({ iconName: expandIcon, classes: 'mds-icon--before mds-accordion-trigger__icon-expand'}) -}}
|
|
41
|
-
{%- endif -%}
|
|
42
|
-
|
|
43
|
-
<span class="mds-accordion-trigger__label
|
|
44
|
-
{%- if params.hideTriggerLabel %} mds-visually-hidden{% endif -%}"
|
|
45
|
-
{%- if params.triggerLabelActive %} data-labelinverse="{{params.triggerLabelActive}}"{% endif -%}>
|
|
46
|
-
{{- params.triggerLabel | safe }}
|
|
47
|
-
</span>
|
|
10
|
+
{%- if params.breakpoint %} data-bp="{{ params.breakpoint }}"{% endif -%}
|
|
11
|
+
{%- if params.startsOpen %} open{% endif -%}
|
|
12
|
+
>
|
|
13
|
+
<summary class="mds-button mds-button--plain mds-padding-x-b0 {{ params.labelClasses }}">
|
|
14
|
+
{%- if not params.noIcon -%}
|
|
15
|
+
{{- MdsIcon({ iconName: params.icon | default('triangle-right'), classes: "mds-accordion__icon" }) -}}
|
|
16
|
+
{{- MdsIcon({ iconName: params.iconOpen | default('triangle-down'), classes: "mds-accordion__icon--open" }) -}}
|
|
17
|
+
{%- endif -%}
|
|
18
|
+
<span class="mds-accordion__label">{{ params.label | safe }}</span>{#
|
|
19
|
+
#}<span class="mds-accordion__label--open">{{ params.labelOpen | default(params.label) | safe }}</span>
|
|
20
|
+
</summary>
|
|
48
21
|
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
{%- endif -%}
|
|
22
|
+
<div data-test="accordion-content">
|
|
23
|
+
{{- caller() -}}
|
|
24
|
+
</div>
|
|
53
25
|
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
<legend class="mds-visually-hidden">{% if params.ariaLabel %}{{ params.ariaLabel }}{% else %}{{ params.triggerLabel }}{% endif %}</legend>
|
|
62
|
-
{{params.content | safe}}
|
|
63
|
-
</fieldset>
|
|
64
|
-
{%- else -%}
|
|
65
|
-
{# using aria-label instead of aria-labelledby to avoid getting `triggerLabelActive` as label for the content #}
|
|
66
|
-
<div class="mds-accordion-content"
|
|
67
|
-
{%- if not params.triggerNoJsHidden %}
|
|
68
|
-
aria-label="{% if params.ariaLabel %}}{{ params.ariaLabel }}{% else %}{{ params.triggerLabel }}{% endif %}"
|
|
26
|
+
{%- if params.contentFirst -%}
|
|
27
|
+
<button
|
|
28
|
+
class="mds-accordion__label mds-button mds-button--plain mds-padding-x-b0 {{ params.labelClasses }}"
|
|
29
|
+
aria-expanded="true"
|
|
30
|
+
>
|
|
31
|
+
{%- if not params.noIcon -%}
|
|
32
|
+
{{- MdsIcon({ iconName: params.iconOpen | default('triangle-up'), classes: "mds-accordion__icon--open" }) -}}
|
|
69
33
|
{%- endif -%}
|
|
70
|
-
|
|
34
|
+
{{- params.labelOpen | default(params.label) -}}
|
|
35
|
+
</button>
|
|
71
36
|
{%- endif -%}
|
|
72
|
-
|
|
37
|
+
|
|
38
|
+
</details>
|
|
@@ -4,52 +4,43 @@ module.exports = {
|
|
|
4
4
|
status: 'ready',
|
|
5
5
|
context: {
|
|
6
6
|
name: 'Default',
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
triggerNoJsHidden: true,
|
|
7
|
+
label: 'View more categories',
|
|
8
|
+
labelOpen: 'View less categories',
|
|
10
9
|
content:
|
|
11
10
|
'<dl class="mds-list mds-list--definition mds-list--border"><dt class="mds-list__key">Hours</dt><dd class="mds-list__value">Full time</dd><dt class="mds-list__key">Contract</dt><dd class="mds-list__value">Permanent</dd><dt class="mds-list__key">Industry</dt><dd class="mds-list__value">Accountant, Manager</dd></dl>',
|
|
12
|
-
id: 'default',
|
|
13
11
|
},
|
|
14
12
|
variants: [
|
|
15
13
|
{
|
|
16
14
|
name: 'Alternative icons',
|
|
17
15
|
context: {
|
|
18
16
|
name: 'Alt Icons',
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
expandIcon: 'plus-small',
|
|
17
|
+
label: 'View more options',
|
|
18
|
+
labelOpen: 'View less options',
|
|
19
|
+
icon: 'plus-small',
|
|
20
|
+
iconOpen: 'minus',
|
|
24
21
|
leftAligned: true,
|
|
25
22
|
content:
|
|
26
23
|
'<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ligula erat, dignissim non sollicitudin ut, sagittis a sapien. Quisque eget arcu sed nulla tincidunt eleifend. Maecenas sit amet velit elit. Maecenas elementum venenatis sapien sit amet elementum. Pellentesque id mauris quis tortor suscipit posuere. Donec eu consectetur tortor. Mauris id scelerisque quam. Sed scelerisque ut est quis sollicitudin. Etiam semper tempor erat, sed rhoncus ex malesuada non. Donec eu pellentesque odio. Vestibulum et suscipit risus, luctus semper nunc. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam eu est ac libero blandit egestas ac id tellus. Suspendisse pulvinar viverra ex, a varius ligula commodo at. Vivamus dignissim neque vitae est ultrices lobortis. Cras vel pulvinar erat.</p>',
|
|
27
|
-
id: 'altIcons',
|
|
28
24
|
},
|
|
29
25
|
},
|
|
30
26
|
{
|
|
31
27
|
name: 'Trigger html tag',
|
|
32
28
|
context: {
|
|
33
29
|
name: 'Trigger html tag',
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
triggerIsHeader: 'h3',
|
|
37
|
-
triggerClasses: 'mds-font-s2',
|
|
30
|
+
label: 'Lorem ipsum',
|
|
31
|
+
labelClasses: 'mds-font-s2',
|
|
38
32
|
content:
|
|
39
33
|
'<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ligula erat, dignissim non sollicitudin ut, sagittis a sapien. Quisque eget arcu sed nulla tincidunt eleifend. Maecenas sit amet velit elit. Maecenas elementum venenatis sapien sit amet elementum. Pellentesque id mauris quis tortor suscipit posuere. Donec eu consectetur tortor. Mauris id scelerisque quam. Sed scelerisque ut est quis sollicitudin. Etiam semper tempor erat, sed rhoncus ex malesuada non. Donec eu pellentesque odio. Vestibulum et suscipit risus, luctus semper nunc. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam eu est ac libero blandit egestas ac id tellus. Suspendisse pulvinar viverra ex, a varius ligula commodo at. Vivamus dignissim neque vitae est ultrices lobortis. Cras vel pulvinar erat.</p>',
|
|
40
|
-
id: 'collapsed',
|
|
41
34
|
},
|
|
42
35
|
},
|
|
43
36
|
{
|
|
44
|
-
name: 'Content above closing
|
|
37
|
+
name: 'Content above closing label',
|
|
45
38
|
context: {
|
|
46
|
-
name: 'Content above closing
|
|
47
|
-
|
|
48
|
-
|
|
39
|
+
name: 'Content above closing label',
|
|
40
|
+
label: 'Read more...',
|
|
41
|
+
labelOpen: 'Read less',
|
|
49
42
|
noIcon: true,
|
|
50
43
|
contentFirst: true,
|
|
51
|
-
ariaLabel: 'Read more content',
|
|
52
|
-
ariaLabelActive: 'Read less content',
|
|
53
44
|
content: `<ul>
|
|
54
45
|
<li><a href="https://www.example.com">Link 1</a></li>
|
|
55
46
|
<li><a href="https://www.example.com">Link 2</a></li>
|
|
@@ -57,59 +48,38 @@ module.exports = {
|
|
|
57
48
|
<li><a href="https://www.example.com">Link 4</a></li>
|
|
58
49
|
</ul>
|
|
59
50
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ligula erat, dignissim non sollicitudin ut, sagittis a sapien. Quisque eget arcu sed nulla tincidunt eleifend. Maecenas sit amet velit elit. Maecenas elementum venenatis sapien sit amet elementum. Pellentesque id mauris quis tortor suscipit posuere. Donec eu consectetur tortor. Mauris id scelerisque quam. Sed scelerisque ut est quis sollicitudin. Etiam semper tempor erat, sed rhoncus ex malesuada non. Donec eu pellentesque odio. Vestibulum et suscipit risus, luctus semper nunc. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam eu est ac libero blandit egestas ac id tellus. Suspendisse pulvinar viverra ex, a varius ligula commodo at. Vivamus dignissim neque vitae est ultrices lobortis. Cras vel pulvinar erat.</p>`,
|
|
60
|
-
id: 'content-first',
|
|
61
|
-
},
|
|
62
|
-
},
|
|
63
|
-
{
|
|
64
|
-
name: 'Switching aria label',
|
|
65
|
-
context: {
|
|
66
|
-
name: 'Switching aria label',
|
|
67
|
-
triggerLabel: 'More...',
|
|
68
|
-
triggerLabelActive: 'Less...',
|
|
69
|
-
ariaLabel: 'Read more content',
|
|
70
|
-
ariaLabelActive: 'Read less content',
|
|
71
|
-
content:
|
|
72
|
-
'<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ligula erat, dignissim non sollicitudin ut, sagittis a sapien. Quisque eget arcu sed nulla tincidunt eleifend. Maecenas sit amet velit elit. Maecenas elementum venenatis sapien sit amet elementum. Pellentesque id mauris quis tortor suscipit posuere. Donec eu consectetur tortor. Mauris id scelerisque quam. Sed scelerisque ut est quis sollicitudin. Etiam semper tempor erat, sed rhoncus ex malesuada non. Donec eu pellentesque odio. Vestibulum et suscipit risus, luctus semper nunc. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam eu est ac libero blandit egestas ac id tellus. Suspendisse pulvinar viverra ex, a varius ligula commodo at. Vivamus dignissim neque vitae est ultrices lobortis. Cras vel pulvinar erat.</p>',
|
|
73
|
-
id: 'switching-aria',
|
|
74
51
|
},
|
|
75
52
|
},
|
|
76
53
|
{
|
|
77
54
|
name: 'Non Closing',
|
|
78
55
|
context: {
|
|
79
56
|
name: 'Non Closing',
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
triggerIsNonClosing: true,
|
|
83
|
-
expandIcon: 'plus-small',
|
|
57
|
+
label: 'View more options',
|
|
58
|
+
nonClosing: true,
|
|
84
59
|
content:
|
|
85
60
|
'<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ligula erat, dignissim non sollicitudin ut, sagittis a sapien. Quisque eget arcu sed nulla tincidunt eleifend. Maecenas sit amet velit elit. Maecenas elementum venenatis sapien sit amet elementum. Pellentesque id mauris quis tortor suscipit posuere. Donec eu consectetur tortor. Mauris id scelerisque quam. Sed scelerisque ut est quis sollicitudin. <a href="#">Etiam semper tempor erat</a>, sed rhoncus ex malesuada non. Donec eu pellentesque odio. Vestibulum et suscipit risus, luctus semper nunc. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam eu est ac libero blandit egestas ac id tellus. Suspendisse pulvinar viverra ex, a varius ligula commodo at. Vivamus dignissim neque vitae est ultrices lobortis. Cras vel pulvinar erat.</p>',
|
|
86
|
-
id: 'non-closing',
|
|
87
61
|
},
|
|
88
62
|
},
|
|
89
63
|
{
|
|
90
64
|
name: 'Mobile Only',
|
|
91
65
|
context: {
|
|
92
66
|
name: 'Mobile Only',
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
triggerNoJsHidden: true,
|
|
67
|
+
label: 'View more categories',
|
|
68
|
+
labelOpen: 'View less categories',
|
|
96
69
|
breakpoint: '600px',
|
|
97
70
|
content:
|
|
98
71
|
'<dl class="mds-list mds-list--definition mds-list--border"><dt class="mds-list__key">Hours</dt><dd class="mds-list__value">Full time</dd><dt class="mds-list__key">Contract</dt><dd class="mds-list__value">Permanent</dd><dt class="mds-list__key">Industry</dt><dd class="mds-list__value">Accountant, Manager</dd></dl>',
|
|
99
|
-
id: 'mobile',
|
|
100
72
|
},
|
|
101
73
|
},
|
|
102
74
|
{
|
|
103
75
|
name: 'Starts expanded',
|
|
104
76
|
context: {
|
|
105
77
|
name: 'Starts expanded',
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
isExpanded: true,
|
|
78
|
+
label: 'View more categories',
|
|
79
|
+
labelOpen: 'View less categories',
|
|
80
|
+
startsOpen: true,
|
|
110
81
|
content:
|
|
111
82
|
'<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ligula erat, dignissim non sollicitudin ut, sagittis a sapien. Quisque eget arcu sed nulla tincidunt eleifend. Maecenas sit amet velit elit. Maecenas elementum venenatis sapien sit amet elementum. Pellentesque id mauris quis tortor suscipit posuere. Donec eu consectetur tortor. Mauris id scelerisque quam. Sed scelerisque ut est quis sollicitudin. <a href="#">Etiam semper tempor erat</a>, sed rhoncus ex malesuada non. Donec eu pellentesque odio. Vestibulum et suscipit risus, luctus semper nunc. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam eu est ac libero blandit egestas ac id tellus. Suspendisse pulvinar viverra ex, a varius ligula commodo at. Vivamus dignissim neque vitae est ultrices lobortis. Cras vel pulvinar erat.</p>',
|
|
112
|
-
id: 'expanded',
|
|
113
83
|
},
|
|
114
84
|
},
|
|
115
85
|
],
|