@madgex/design-system 13.3.2 → 13.5.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.
@@ -0,0 +1,58 @@
1
+ function _(s=0,t=0,e){return s>=t*e?{width:t*e,height:t}:{width:s,height:s/e}}function x(s,t,e,i){return{x:y(s.x,t.width,e.width,i),y:y(s.y,t.height,e.height,i)}}function y(s,t,e,i){let o=t*i/2-e/2;return i<1&&(o=e/2-t*i/2),Math.min(o,Math.max(s,-o))}function L({crop:s,imageSize:t,cropSize:e,aspect:i,zoom:o,restrictPosition:a=!0}){if(!e?.width)return;const r=a?M:(g,p)=>p,n={x:r(100,((t.width-e.width/o)/2-s.x/o)/t.width*100),y:r(100,((t.height-e.height/o)/2-s.y/o)/t.height*100),width:r(100,e.width/t.width*100/o),height:r(100,e.height/t.height*100/o)},c=r(t.naturalWidth,n.width*t.naturalWidth/100,!0),h=r(t.naturalHeight,n.height*t.naturalHeight/100,!0),u=t.naturalWidth>=t.naturalHeight*i?{width:Math.round(h*i),height:h}:{width:c,height:Math.round(c/i)},m={...u,x:r(t.naturalWidth-u.width,n.x*t.naturalWidth/100,!0),y:r(t.naturalHeight-u.height,n.y*t.naturalHeight/100,!0)};return{percent:n,pixels:m}}function M(s,t,e=!1){const i=e?Math.round(t):t;return Math.min(s,Math.max(0,i))}const C=s=>new Promise((t,e)=>{const i=new Image;i.addEventListener("load",()=>t(i)),i.addEventListener("error",o=>e(o)),i.setAttribute("crossOrigin","anonymous"),i.src=s}),P=Math.PI/180;async function k({imageEl:s,crop:t,rotateDeg:e=0,format:i="png",backgroundFill:o,width:a,height:r}){if(!s||!t)return null;const n=await C(s.src),c=document.createElement("canvas"),h=c.getContext("2d");if(!h)return null;const l=a?a/t.width:1,u=r?r/t.height:1;c.width=Math.floor(t.width*l),c.height=Math.floor(t.height*u),h.imageSmoothingQuality="high";const m=t.x*l,g=t.y*u,p=e*P,v=n.naturalWidth/2*l,b=n.naturalHeight/2*u;return h.save(),h.fillStyle=o,h.fillRect(0,0,c.width,c.height),h.translate(-m,-g),h.translate(v,b),h.rotate(p),h.translate(-v,-b),h.drawImage(n,0,0,n.naturalWidth,n.naturalHeight,0,0,n.naturalWidth*l,n.naturalHeight*u),new Promise((f,w)=>{c.toBlob(A=>{try{f(A)}catch(E){w(E)}},`image/${i}`,.9)})}function d(s){return s&&(new DOMParser().parseFromString(s,"text/html").body.textContent||"")}class D extends HTMLElement{#d={x:0,y:0};#l={x:0,y:0};#f=0;#v=null;#n=null;#P=1;constructor(){super()}get rootNode(){return this}get#e(){return this.getRootNode({composed:!0})}connectedCallback(){this.create(),this.setAttribute("tabindex","0")}disconnectedCallback(){this.destroy()}#i(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}create(){this.addEventListener("gesturestart",this.#g),this.addEventListener("gesturechange",this.#g),this.addEventListener("touchstart",this.#r),this.addEventListener("mousedown",this.#h),this.addEventListener("wheel",this.#c,{passive:!1}),this.addEventListener("keydown",this.#y)}destroy(){this.removeEventListener("gesturestart",this.#g),this.removeEventListener("gesturechange",this.#g),this.removeEventListener("touchstart",this.#r),this.removeEventListener("mousedown",this.#h),this.removeEventListener("wheel",this.#c),this.removeEventListener("keydown",this.#y),this.#k()}get#t(){const t=this.getAttribute("position-x"),e=this.getAttribute("position-y");return{x:t?parseFloat(t):0,y:e?parseFloat(e):0}}set#t({x:t,y:e}){this.#i("position",{x:t,y:e})}get#o(){return parseFloat(this.getAttribute("zoom")||"1")}set#o(t){this.#i("zoom",t)}get#b(){return parseFloat(this.getAttribute("min-zoom")||"1")}get#x(){return parseFloat(this.getAttribute("max-zoom")||"3")}#w(t,e){return{x:(e.x+t.x)/2,y:(e.y+t.y)/2}}#A(t,e){return Math.sqrt(Math.pow(t.y-e.y,2)+Math.pow(t.x-e.x,2))}#g=t=>{t.preventDefault()};#h=t=>{t.preventDefault(),this.#e.addEventListener("mousemove",this.#s),this.#e.addEventListener("mouseup",this.#m),this.#a({x:t.clientX,y:t.clientY})};#s=t=>{this.#E({x:t.clientX,y:t.clientY})};#r=t=>{t.preventDefault(),this.#e.addEventListener("touchmove",this.#u,{passive:!1}),this.#e.addEventListener("touchend",this.#m),t.touches.length===2?this.#_(t):t.touches.length===1&&this.#a({x:t.touches[0].clientX,y:t.touches[0].clientY})};#u=t=>{t.preventDefault(),t.touches.length===2?this.#L(t):t.touches.length===1&&this.#E({x:t.touches[0].clientX,y:t.touches[0].clientY})};#a({x:t,y:e}){this.#d={x:t,y:e},this.#l={x:this.#t.x,y:this.#t.y}}#E({x:t,y:e}){this.#v&&window.cancelAnimationFrame(this.#v),this.#v=window.requestAnimationFrame(()=>{if(t===void 0||e===void 0)return;const i=t-this.#d.x,o=e-this.#d.y,a={x:this.#l.x+i,y:this.#l.y+o};this.#t=a})}#m=()=>{this.#k(),this.#i("dragstopped")};#_=t=>{const e={x:t.touches[0].clientX,y:t.touches[0].clientY},i={x:t.touches[1].clientX,y:t.touches[1].clientY};this.#f=this.#A(e,i),this.#a(this.#w(e,i))};#L=t=>{const e={x:t.touches[0].clientX,y:t.touches[0].clientY},i={x:t.touches[1].clientX,y:t.touches[1].clientY},o=this.#w(e,i);this.#E(o),this.#n&&window.cancelAnimationFrame(this.#n),this.#n=window.requestAnimationFrame(()=>{const a=this.#A(e,i),r=this.#o*(a/this.#f);this.#M(r,o),this.#f=a})};#c=t=>{t.preventDefault();const e={x:t.clientX,y:t.clientY},i=this.#o-t.deltaY*this.#P/200;this.#M(i,e)};#y=t=>{switch(t.key){case"ArrowDown":t.preventDefault(),this.#t={x:this.#t.x,y:this.#t.y+10};break;case"ArrowUp":t.preventDefault(),this.#t={x:this.#t.x,y:this.#t.y-10};break;case"ArrowLeft":t.preventDefault(),this.#t={x:this.#t.x-10,y:this.#t.y};break;case"ArrowRight":t.preventDefault(),this.#t={x:this.#t.x+10,y:this.#t.y};break;case"PageUp":t.preventDefault(),this.#o=Math.min(this.#x,Math.max(this.#o+.1,this.#b));break;case"PageDown":t.preventDefault(),this.#o=Math.min(this.#x,Math.max(this.#o-.1,this.#b));break;default:return}};#k(){this.#e.removeEventListener("mousemove",this.#s),this.#e.removeEventListener("mouseup",this.#m),this.#e.removeEventListener("touchmove",this.#u),this.#e.removeEventListener("touchend",this.#m)}#p({x:t,y:e}){const i=this.getBoundingClientRect();if(!i)throw new Error("The element is not mounted");return{x:i.width/2-(t-i.left),y:i.height/2-(e-i.top)}}#D({x:t,y:e}){return{x:(t+this.#t.x)/this.#o,y:(e+this.#t.y)/this.#o}}#M(t,e){const i=this.#p(e),o=this.#D(i);this.#o=Math.min(this.#x,Math.max(t,this.#b));const a={x:o.x*this.#o-i.x,y:o.y*this.#o-i.y};this.#t=a}}window.customElements.get("mds-image-cropper-touch-area")||window.customElements.define("mds-image-cropper-touch-area",D);class T extends HTMLElement{static get observedAttributes(){return["src","aspect-ratio","output-width","output-height","zoom","min-zoom","max-zoom","crop-x","crop-y","no-grid","restrict-position"]}#d=null;#l=window.crypto.randomUUID();constructor(){super()}get rootNode(){return this}get#f(){return this.getRootNode({composed:!0})}attributeChangedCallback(t,e=null,i=null){if(!this.isConnected||e===i)return;t==="zoom"&&this.#z(),["zoom","min-zoom","max-zoom","crop-x","crop-y"].includes(t)&&this.#T(),t==="src"&&this.#B(i),["src","aspect-ratio","output-width","output-height","zoom","min-zoom","max-zoom","crop-x","crop-y","no-grid","restrict-position"].includes(t)&&this.#H()}connectedCallback(){this.create()}disconnectedCallback(){this.destroy()}create(){this.rootNode.setHTML?this.rootNode.setHTML(this.#v.innerHTML,{sanitizer:{}}):this.rootNode.replaceChildren(this.#v.content.cloneNode(!0)),this.#T(),this.#e.addEventListener("zoom",this.#F),this.#e.addEventListener("position",this.#$),this.#e.addEventListener("dragstopped",this.#R),this.#d=new ResizeObserver(()=>this.#X()),this.#d.observe(this.#e),this.#i.addEventListener("load",this.#q),this.#B(this.#k),this.#n.addEventListener("input",this.#D),this.#A.addEventListener("click",this.#M),this.#g.addEventListener("click",this.#I),this.#x.addEventListener("click",this.#Z),this.#w.addEventListener("click",this.#W)}destroy(){this.#d?.disconnect(),this.#d=null,this.#i?.removeEventListener("load",this.#q),this.#e?.removeEventListener("zoom",this.#F),this.#e?.removeEventListener("position",this.#$),this.#e?.removeEventListener("dragstopped",this.#R),this.#n?.removeEventListener("input",this.#D),this.#A?.removeEventListener("click",this.#M),this.#g?.removeEventListener("click",this.#I),this.#x?.removeEventListener("click",this.#Z),this.#w?.removeEventListener("click",this.#W),this.rootNode?.replaceChildren()}get#v(){const t=this.#f.createElement("template");return t.innerHTML=`
2
+ <div class="mds-image-cropper__wrapper">
3
+ <mds-image-cropper-touch-area
4
+ class="mds-image-cropper__container"
5
+ aria-describedby="${this.#l}-touch-area-controls"
6
+ >
7
+ <div class="mds-image-cropper__background"></div>
8
+ <img class="mds-image-cropper__image" alt="" />
9
+ <div class="mds-image-cropper__area"></div>
10
+ </mds-image-cropper-touch-area>
11
+ <div class="mds-visually-hidden" id="${this.#l}-touch-area-controls">
12
+ ${this.#h["touch-area-controls"]}
13
+ </div>
14
+ <div class="mds-image-cropper__aria-live mds-visually-hidden" aria-live="polite"></div>
15
+ </div>
16
+
17
+ <label class="mds-form-label mds-image-cropper__control-label" for="${this.#l}-zoom">
18
+ ${this.#h["zoom-label"]}
19
+ </label>
20
+ <div class="mds-image-cropper__control mds-margin-bottom-b8">
21
+ <button
22
+ type="button"
23
+ class="mds-image-cropper__control-button mds-image-cropper__control-button-out"
24
+ aria-label="${this.#h["btn-zoom-out-aria"]}"
25
+ >
26
+ <svg aria-hidden viewBox="0 0 32 32" fill="currentColor">
27
+ <path
28
+ d="M4 16c0-1.14.846-2.08 1.945-2.23l.305-.02h19.5a2.25 2.25 0 0 1 .305 4.48l-.305.02H6.25A2.25 2.25 0 0 1 4 16Z"
29
+ ></path>
30
+ </svg>
31
+ </button>
32
+ <input id="${this.#l}-zoom" type="range" class="mds-image-cropper__control-zoom" step="0.1" />
33
+ <button
34
+ type="button"
35
+ class="mds-image-cropper__control-button mds-image-cropper__control-button-in"
36
+ aria-label="${this.#h["btn-zoom-in-aria"]}"
37
+ >
38
+ <svg aria-hidden viewBox="0 0 32 32" fill="currentColor">
39
+ <path
40
+ d="M16 4c1.14 0 2.08.846 2.23 1.945l.02.305v7.5h7.5a2.25 2.25 0 0 1 .305 4.48l-.305.02h-7.5v7.5a2.25 2.25 0 0 1-4.48.305l-.02-.305v-7.5h-7.5a2.25 2.25 0 0 1-.305-4.48l.305-.02h7.5v-7.5A2.25 2.25 0 0 1 16 4Z"
41
+ ></path>
42
+ </svg>
43
+ </button>
44
+ </div>
45
+
46
+ <div class="mds-grid-row mds-grid-end">
47
+ <div class="mds-grid-col mds-grid-fit-content">
48
+ <button type="button" class="mds-button mds-button--neutral mds-image-cropper__button-reset">
49
+ ${this.#h["btn-reset"]}
50
+ </button>
51
+ </div>
52
+ <div class="mds-grid-col mds-grid-fit-content">
53
+ <button type="button" class="mds-button mds-image-cropper__button-commit">
54
+ ${this.#h["btn-commit"]}
55
+ </button>
56
+ </div>
57
+ </div>
58
+ `,t}get#n(){return this.rootNode.querySelector(".mds-image-cropper__control-zoom")}get#P(){return this.rootNode.querySelector(".mds-image-cropper__wrapper")}get#e(){return this.rootNode.querySelector(".mds-image-cropper__container")}get#i(){return this.rootNode.querySelector(".mds-image-cropper__image")}get#t(){return this.rootNode.querySelector(".mds-image-cropper__area")}get#o(){return this.rootNode.querySelector(".mds-image-cropper__background")}get#b(){return this.rootNode.querySelector(".mds-image-cropper__aria-live")}get#x(){return this.rootNode.querySelector(".mds-image-cropper__button-reset")}get#w(){return this.rootNode.querySelector(".mds-image-cropper__button-commit")}get#A(){return this.rootNode.querySelector(".mds-image-cropper__control-button-out")}get#g(){return this.rootNode.querySelector(".mds-image-cropper__control-button-in")}get#h(){return{"zoom-label":d(this.getAttribute("t-zoom-label"))||"Zoom","btn-reset":d(this.getAttribute("t-btn-reset"))||"Reset","btn-commit":d(this.getAttribute("t-btn-commit"))||"Save and crop","btn-zoom-out-aria":d(this.getAttribute("t-btn-zoom-out-aria"))||"Minus button - Zoom out","btn-zoom-in-aria":d(this.getAttribute("t-btn-zoom-in-aria"))||"Plus button - Zoom in","touch-area-controls":d(this.getAttribute("t-touch-area-controls"))||"On this element you can use arrow keys to pan the image around the crop area, and Page Up / Page Down to zoom in and out.","aria-live":d(this.getAttribute("t-aria-live"))||"Crop Top Position: {y} pixels, Crop Left Position: {x} pixels, Crop Width {width} pixels, Crop Height: {height} pixels. Image Width: {imageWidth} pixels, Image Height: {imageHeight} pixels."}}get#s(){return parseFloat(this.getAttribute("zoom")||"1")}set#s(t){this.setAttribute("zoom",t)}get#r(){const t=this.getAttribute("crop-x"),e=this.getAttribute("crop-y"),i={x:t?parseFloat(t):0,y:e?parseFloat(e):0};return this.#y?x(i,this.#p,this.#c,this.#s):i}set#r(t){const{x:e,y:i}=this.#y?x(t,this.#p,this.#c,this.#s):t;this.setAttribute("crop-x",e),this.setAttribute("crop-y",i)}get#u(){return parseFloat(this.getAttribute("min-zoom")||"1")}get#a(){return parseFloat(this.getAttribute("max-zoom")||"3")}get#E(){const t=this.getAttribute("no-grid");return t!==null&&t!=="false"}get#m(){const t=parseInt(this.getAttribute("output-width"),10);return Number.isNaN(t)?null:t}get#_(){const t=parseInt(this.getAttribute("output-height"),10);return Number.isNaN(t)?null:t}get#L(){return this.#_&&this.#m?this.#m/this.#_:parseFloat(this.getAttribute("aspect-ratio")||"1.77777")}get#c(){return _(this.#i?.width,this.#i?.height,this.#L)}get#y(){return this.getAttribute("restrict-position")!=="false"}get#k(){return this.getAttribute("src")}get#p(){return{width:this.#i?.width||0,height:this.#i?.height||0,naturalWidth:this.#i?.naturalWidth||0,naturalHeight:this.#i?.naturalHeight||0}}#D=t=>{this.#s=Math.min(this.#a,Math.max(t.target.value,this.#u))};#M=()=>{this.#s=Math.min(this.#a,Math.max(this.#s-.1,this.#u))};#I=()=>{this.#s=Math.min(this.#a,Math.max(this.#s+.1,this.#u))};#Z=()=>{this.#Y(),this.#C("reset")};#W=async()=>{const{pixels:t}=this.#N||{};if(!t){const e=new Error("Can't perform image crop, pixel crop data missing");this.#C("error",e);return}try{const e=await k({imageEl:this.#i,crop:t,backgroundFill:"#fff",width:this.#m,height:this.#_});this.#C("commit",e)}catch(e){this.#C("error",e)}};#F=t=>{t.detail&&(this.#s=t.detail),this.#T()};#$=t=>{t.detail&&(this.#r=t.detail),this.#T()};#R=()=>{this.#z()};#q=()=>{this.#z(),this.#H()};#X(){this.#H()}#C(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}#B(t){if(this.#i){if(!t){this.#i.removeAttribute("src");return}this.#i.src=t,this.#Y()}}#Y(){this.#s=Math.min(this.#a,Math.max(1,this.#u)),this.#r={x:0,y:0}}#T(){this.#e?.setAttribute("zoom",this.#s),this.#e?.setAttribute("position-x",this.#r.x),this.#e?.setAttribute("position-y",this.#r.y),this.#e?.setAttribute("min-zoom",this.#u),this.#e?.setAttribute("max-zoom",this.#a)}get#N(){return L({crop:this.#r,imageSize:this.#p,cropSize:this.#c,aspect:this.#L,zoom:this.#s,restrictPosition:this.#y})||{}}async#z(){const{percent:t,pixels:e}=this.#N;try{this.#C("cropchange",{percent:t,pixels:e})}catch(i){console.error(i)}}#H(){this.#i&&(this.#i.style.transform=`translate(${this.#r.x}px, ${this.#r.y}px) scale(${this.#s})`),this.#t&&(this.#t.style.width=`${this.#c?.width||0}px`,this.#t.style.height=`${this.#c?.height||0}px`,this.#t.classList[this.#E?"remove":"add"]("mds-image-cropper-grid")),this.#o&&(this.#o.style.width=`${this.#c?.width||0}px`,this.#o.style.height=`${this.#c?.height||0}px`),this.#P&&(this.#P.style.aspectRatio=this.#L),this.#n&&(this.#n.setAttribute("min",this.#u),this.#n.setAttribute("max",this.#a),this.#n.value=this.#s),this.#O()}#O(){const{pixels:t}=this.#N||{};!this.#b||!this.#p?.naturalWidth||!t?.width||(this.#b.textContent=this.#h["aria-live"].replace("{imageWidth}",this.#p.naturalWidth).replace("{imageHeight}",this.#p.naturalHeight).replace("{x}",t.x).replace("{y}",t.y).replace("{width}",t.width).replace("{height}",t.height))}}export{T as M};
@@ -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-plrFUmdZ.js"])))=>i.map(i=>d[i]);
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]))});
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","js/components/mds-image-cropper-standalone.js","js/image-cropper-BlqRRHAU.js"])))=>i.map(i=>d[i]);
2
+ const L="modulepreload",T=function(e){return"/"+e},p={},v=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=T(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":L,l||(c.as="script"),c.crossOrigin="",c.href=o,i&&c.setAttribute("nonce",i),document.head.appendChild(c),l)return new Promise((E,y)=>{c.addEventListener("load",E),c.addEventListener("error",()=>y(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))})})}},w="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(w,"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(`.${w}`)).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 v(()=>import("./components/mds-timeout-dialog-standalone.js"),__vite__mapDeps([0,1])),await v(()=>import("./components/mds-image-cropper-standalone.js"),__vite__mapDeps([2,3]))});
package/dist/js/index.js CHANGED
@@ -1 +1 @@
1
- import{M as xt}from"./dropdown-nav-DGGzV21D.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",Ct="mds-tabs__list",Lt="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} .${Ct}`)),o=Array.from(document.querySelectorAll(`${t} .${Lt}`)),n=Array.from(document.querySelectorAll(`${t} .${Ue}`));r.forEach(a=>{a.setAttribute("role","tablist")}),o.forEach(a=>{a.setAttribute("role","presentation")}),e.forEach(a=>{a.setAttribute("role","tab"),a.setAttribute("aria-controls",a.attributes.href.value.substring(1)),a.classList.contains(ve)?a.setAttribute("tabindex","0"):a.setAttribute("tabindex","-1")}),n.forEach(a=>{a.setAttribute("role","tabpanel"),a.setAttribute("aria-labelledby",`label-${a.attributes.id.value}`)});const i=document.querySelectorAll(`${t} .${Ot}`);Array.from(i).forEach(a=>{const l=window.location.hash.trim(),d=a.attributes.href.value,c=a.closest(`.${Ve}`),p=E.getAllPanels(c),u=E.getAllTabs(c),v=E.getTargetPanel(a,c);a.addEventListener("click",m=>{m.preventDefault(),E.updateTabs(u,p,a,v,d)}),d===l&&E.updateTabs(u,p,a,v,d)}),r.forEach(a=>{const l=a.closest(`.${Ve}`),d=E.getAllPanels(l),c=E.getAllTabs(l);a.addEventListener("keydown",p=>{switch(p.keyCode){case me.left:case me.up:p.preventDefault(),E.moveTab(a,l,c,d,!1);break;case me.right:case me.down:p.preventDefault(),E.moveTab(a,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,o,n)=>{const i=E.getSelectedTab(t),s=n?E.getNextTab(i):E.getPrevTab(i);if(s){const a=s.attributes.href.value,l=E.getTargetPanel(s,e);E.updateTabs(r,o,s,l,a,!1)}},updateTabs:(t,e,r,o,n)=>{E.clearAllTabs(t),E.setActiveTab(r),E.clearAllPanels(e),E.setActivePanel(o,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)}},$t="mds-accordion--breakpoint",Pt="mds-accordion__label",ct={init:()=>{const t=document.querySelectorAll(`.${$t}`),e=window.innerWidth;t.forEach(o=>{ct.checkBreakpoint(o,e)||(o.open=!0,o.querySelector("summary").style.display="none")}),document.querySelectorAll(`.${Pt}`).forEach(o=>{o.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 o=t.dataset.bp.replace(/\D/g,""),n=t.dataset.bp.replace(/[0-9]/g,"");let i,s;switch(n){case"px":r=o;break;case"em":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=o*parseFloat(i),r=s;break;case"rem":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=o*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),a=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"),u=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",h=>{d.contains(h.relatedTarget)||c.setAttribute("aria-expanded","false")});const g=()=>i.clientHeight>a.offsetHeight;e.push(()=>{c.setAttribute("aria-expanded","false"),window.getComputedStyle(l).getPropertyValue("display")==="none"?(s.forEach(b=>{i.append(b)}),d.style.display="none",g()&&(d.style.display="list-item",s.slice().reverse().forEach(b=>{if(g()&&b!==d){u.prepend(b);const y=Array.from(u.children).length,A=y>1?m:v;p.innerText=A.replace("{count}",y)}else i.prepend(b)}),u.style.width=`${i.offsetWidth-d.offsetLeft}px`)):(s.forEach(b=>{b!==d&&b!==l&&u.append(b)}),u.style.width="initial",d.style.display="block")})});const o=()=>{e.forEach(n=>{n()})};o(),window.onresize=()=>{clearTimeout(r),r=setTimeout(o,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",P="bottom",D="right",$="left",Pe="auto",se=[T,P,D,$],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,[Pe]).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 ft(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 o=e.styles[r]||{},n=e.attributes[r]||{},i=e.elements[r];!q(i)||!W(i)||(Object.assign(i.style,o),Object.keys(n).forEach(function(s){var a=n[s];a===!1?i.removeAttribute(s):i.setAttribute(s,a===!0?"":a)}))})}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(o){var n=e.elements[o],i=e.attributes[o]||{},s=Object.keys(e.styles.hasOwnProperty(o)?e.styles[o]:r[o]),a=s.reduce(function(l,d){return l[d]="",l},{});!q(n)||!W(n)||(Object.assign(n.style,a),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,o=t.offsetHeight;return Math.abs(e.width-r)<=1&&(r=e.width),Math.abs(e.height-o)<=1&&(o=e.height),{x:t.offsetLeft,y:t.offsetTop,width:r,height:o}}function ut(t,e){var r=e.getRootNode&&e.getRootNode();if(t.contains(e))return!0;if(r&&ft(r)){var o=e;do{if(o&&t.isSameNode(o))return!0;o=o.parentNode||o.host}while(o)}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||(ft(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 o=_(t);if(o.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,oe=Math.min,he=Math.round;function we(t,e,r){return H(t,oe(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,o){return r[o]=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,o=t.name,n=t.options,i=r.elements.arrow,s=r.modifiersData.popperOffsets,a=R(r.placement),l=Be(a),d=[$,D].indexOf(a)>=0,c=d?"height":"width";if(!(!i||!s)){var p=Zt(n.padding,r),u=qe(i),v=l==="y"?T:$,m=l==="y"?P:D,g=r.rects.reference[c]+r.rects.reference[l]-s[l]-r.rects.popper[c],h=s[l]-r.rects.reference[l],b=ce(i),y=b?l==="y"?b.clientHeight||0:b.clientWidth||0:0,A=g/2-h/2,f=p[v],C=y-u[c]-p[m],w=y/2-u[c]/2+A,O=we(f,w,C),x=l;r.modifiersData[o]=(e={},e[x]=O,e.centerOffset=O-w,e)}}function tr(t){var e=t.state,r=t.options,o=r.element,n=o===void 0?"[data-popper-arrow]":o;n!=null&&(typeof n=="string"&&(n=e.elements.popper.querySelector(n),!n)||ut(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 or(t){var e=t.x,r=t.y,o=window,n=o.devicePixelRatio||1;return{x:he(he(e*n)/n)||0,y:he(he(r*n)/n)||0}}function Ke(t){var e,r=t.popper,o=t.popperRect,n=t.placement,i=t.offsets,s=t.position,a=t.gpuAcceleration,l=t.adaptive,d=t.roundOffsets,c=d===!0?or(i):typeof d=="function"?d(i):i,p=c.x,u=p===void 0?0:p,v=c.y,m=v===void 0?0:v,g=i.hasOwnProperty("x"),h=i.hasOwnProperty("y"),b=$,y=T,A=window;if(l){var f=ce(r),C="clientHeight",w="clientWidth";f===B(r)&&(f=N(r),_(f).position!=="static"&&(C="scrollHeight",w="scrollWidth")),f=f,n===T&&(y=P,m-=f[C]-o.height,m*=a?1:-1),n===$&&(b=D,u-=f[w]-o.width,u*=a?1:-1)}var O=Object.assign({position:s},l&&nr);if(a){var x;return Object.assign({},O,(x={},x[y]=h?"0":"",x[b]=g?"0":"",x.transform=(A.devicePixelRatio||1)<2?"translate("+u+"px, "+m+"px)":"translate3d("+u+"px, "+m+"px, 0)",x))}return Object.assign({},O,(e={},e[y]=h?m+"px":"",e[b]=g?u+"px":"",e.transform="",e))}function ar(t){var e=t.state,r=t.options,o=r.gpuAcceleration,n=o===void 0?!0:o,i=r.adaptive,s=i===void 0?!0:i,a=r.roundOffsets,l=a===void 0?!0:a,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:ar,data:{}};var be={passive:!0};function sr(t){var e=t.state,r=t.instance,o=t.options,n=o.scroll,i=n===void 0?!0:n,s=o.resize,a=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,be)}),a&&l.addEventListener("resize",r.update,be),function(){i&&d.forEach(function(c){c.removeEventListener("scroll",r.update,be)}),a&&l.removeEventListener("resize",r.update,be)}}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,o=e.pageYOffset;return{scrollLeft:r,scrollTop:o}}function Me(t){return Q(N(t)).left+je(t).scrollLeft}function fr(t){var e=B(t),r=N(t),o=e.visualViewport,n=r.clientWidth,i=r.clientHeight,s=0,a=0;return o&&(n=o.width,i=o.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(s=o.offsetLeft,a=o.offsetTop)),{width:n,height:i,x:s+Me(t),y:a}}function ur(t){var e,r=N(t),o=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),a=-o.scrollLeft+Me(t),l=-o.scrollTop;return _(n||r).direction==="rtl"&&(a+=H(r.clientWidth,n?n.clientWidth:0)-i),{width:i,height:s,x:a,y:l}}function Re(t){var e=_(t),r=e.overflow,o=e.overflowX,n=e.overflowY;return/auto|scroll|overlay|hidden/.test(r+n+o)}function ht(t){return["html","body","#document"].indexOf(W(t))>=0?t.ownerDocument.body:q(t)&&Re(t)?t:ht(xe(t))}function re(t,e){var r;e===void 0&&(e=[]);var o=ht(t),n=o===((r=t.ownerDocument)==null?void 0:r.body),i=B(o),s=n?[i].concat(i.visualViewport||[],Re(o)?o:[]):o,a=e.concat(s);return n?a:a.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(fr(t)):q(e)?pr(e):Se(ur(N(t)))}function vr(t){var e=re(xe(t)),r=["absolute","fixed"].indexOf(_(t).position)>=0,o=r&&q(t)?ce(t):t;return ne(o)?e.filter(function(n){return ne(n)&&ut(n,o)&&W(n)!=="body"}):[]}function mr(t,e,r){var o=e==="clippingParents"?vr(t):[].concat(e),n=[].concat(o,[r]),i=n[0],s=n.reduce(function(a,l){var d=Qe(t,l);return a.top=H(d.top,a.top),a.right=oe(d.right,a.right),a.bottom=oe(d.bottom,a.bottom),a.left=H(d.left,a.left),a},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 ae(t){return t.split("-")[1]}function bt(t){var e=t.reference,r=t.element,o=t.placement,n=o?R(o):null,i=o?ae(o):null,s=e.x+e.width/2-r.width/2,a=e.y+e.height/2-r.height/2,l;switch(n){case T:l={x:s,y:e.y-r.height};break;case P:l={x:s,y:e.y+e.height};break;case D:l={x:e.x+e.width,y:a};break;case $:l={x:e.x-r.width,y:a};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,o=r.placement,n=o===void 0?t.placement:o,i=r.boundary,s=i===void 0?Mt:i,a=r.rootBoundary,l=a===void 0?lt:a,d=r.elementContext,c=d===void 0?ee:d,p=r.altBoundary,u=p===void 0?!1:p,v=r.padding,m=v===void 0?0:v,g=vt(typeof m!="number"?m:mt(m,se)),h=c===ee?Rt:ee,b=t.elements.reference,y=t.rects.popper,A=t.elements[u?h:c],f=mr(ne(A)?A:A.contextElement||N(t.elements.popper),s,l),C=Q(b),w=bt({reference:C,element:y,placement:n}),O=Se(Object.assign({},y,w)),x=c===ee?O:C,L={top:f.top-x.top+g.top,bottom:x.bottom-f.bottom+g.bottom,left:f.left-x.left+g.left,right:x.right-f.right+g.right},S=t.modifiersData.offset;if(c===ee&&S){var j=S[n];Object.keys(L).forEach(function(I){var k=[D,P].indexOf(I)>=0?1:-1,F=[T,P].indexOf(I)>=0?"y":"x";L[I]+=j[F]*k})}return L}function hr(t,e){e===void 0&&(e={});var r=e,o=r.placement,n=r.boundary,i=r.rootBoundary,s=r.padding,a=r.flipVariations,l=r.allowedAutoPlacements,d=l===void 0?dt:l,c=ae(o),p=c?a?Ye:Ye.filter(function(m){return ae(m)===c}):se,u=p.filter(function(m){return d.indexOf(m)>=0});u.length===0&&(u=p);var v=u.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 br(t){if(R(t)===Pe)return[];var e=Ae(t);return[Ge(t),e,Ge(e)]}function gr(t){var e=t.state,r=t.options,o=t.name;if(!e.modifiersData[o]._skip){for(var n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,a=s===void 0?!0:s,l=r.fallbackPlacements,d=r.padding,c=r.boundary,p=r.rootBoundary,u=r.altBoundary,v=r.flipVariations,m=v===void 0?!0:v,g=r.allowedAutoPlacements,h=e.options.placement,b=R(h),y=b===h,A=l||(y||!m?[Ae(h)]:br(h)),f=[h].concat(A).reduce(function(V,M){return V.concat(R(M)===Pe?hr(e,{placement:M,boundary:c,rootBoundary:p,padding:d,flipVariations:m,allowedAutoPlacements:g}):M)},[]),C=e.rects.reference,w=e.rects.popper,O=new Map,x=!0,L=f[0],S=0;S<f.length;S++){var j=f[S],I=R(j),k=ae(j)===G,F=[T,P].indexOf(I)>=0,Z=F?"width":"height",U=ie(e,{placement:j,boundary:c,rootBoundary:p,altBoundary:u,padding:d}),z=F?k?D:$:k?P:T;C[Z]>w[Z]&&(z=Ae(z));var Ee=Ae(z),X=[];if(i&&X.push(U[I]<=0),a&&X.push(U[z]<=0,U[Ee]<=0),X.every(function(V){return V})){L=j,x=!1;break}O.set(j,X)}if(x)for(var le=m?3:1,Oe=function(M){var fe=f.find(function(Ce){var J=O.get(Ce);if(J)return J.slice(0,M).every(function(Le){return Le})});if(fe)return L=fe,"break"},Y=le;Y>0;Y--){var de=Oe(Y);if(de==="break")break}e.placement!==L&&(e.modifiersData[o]._skip=!0,e.placement=L,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,o=e.rects.reference,n=e.rects.popper,i=e.modifiersData.preventOverflow,s=ie(e,{elementContext:"reference"}),a=ie(e,{altBoundary:!0}),l=Ze(s,o),d=Ze(a,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 o=R(t),n=[$,T].indexOf(o)>=0?-1:1,i=typeof r=="function"?r(Object.assign({},e,{placement:t})):r,s=i[0],a=i[1];return s=s||0,a=(a||0)*n,[$,D].indexOf(o)>=0?{x:a,y:s}:{x:s,y:a}}function Er(t){var e=t.state,r=t.options,o=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},{}),a=s[e.placement],l=a.x,d=a.y;e.modifiersData.popperOffsets!=null&&(e.modifiersData.popperOffsets.x+=l,e.modifiersData.popperOffsets.y+=d),e.modifiersData[o]=s}const Or={name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:Er};function Cr(t){var e=t.state,r=t.name;e.modifiersData[r]=bt({reference:e.rects.reference,element:e.rects.popper,placement:e.placement})}const Lr={name:"popperOffsets",enabled:!0,phase:"read",fn:Cr,data:{}};function kr(t){return t==="x"?"y":"x"}function Sr(t){var e=t.state,r=t.options,o=t.name,n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,a=s===void 0?!1:s,l=r.boundary,d=r.rootBoundary,c=r.altBoundary,p=r.padding,u=r.tether,v=u===void 0?!0:u,m=r.tetherOffset,g=m===void 0?0:m,h=ie(e,{boundary:l,rootBoundary:d,padding:p,altBoundary:c}),b=R(e.placement),y=ae(e.placement),A=!y,f=Be(b),C=kr(f),w=e.modifiersData.popperOffsets,O=e.rects.reference,x=e.rects.popper,L=typeof g=="function"?g(Object.assign({},e.rects,{placement:e.placement})):g,S={x:0,y:0};if(w){if(i||a){var j=f==="y"?T:$,I=f==="y"?P:D,k=f==="y"?"height":"width",F=w[f],Z=w[f]+h[j],U=w[f]-h[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]),fe=A?O[k]/2-z-M-de-L:Ee-M-de-L,Ce=A?-O[k]/2+z+M+V+L:X+M+V+L,J=e.elements.arrow&&ce(e.elements.arrow),Le=J?f==="y"?J.clientTop||0:J.clientLeft||0:0,We=e.modifiersData.offset?e.modifiersData.offset[e.placement][f]:0,Ie=w[f]+fe-We-Le,_e=w[f]+Ce-We;if(i){var He=we(v?oe(Z,Ie):Z,F,v?H(U,_e):U);w[f]=He,S[f]=He-F}if(a){var wt=f==="x"?T:$,At=f==="x"?P:D,ue=w[C],Ne=ue+h[wt],Fe=ue-h[At],ze=we(v?oe(Ne,Ie):Ne,ue,v?H(Fe,_e):Fe);w[C]=ze,S[C]=ze-ue}}e.modifiersData[o]=S}}const Tr={name:"preventOverflow",enabled:!0,phase:"main",fn:Sr,requiresIfExists:["offset"]};function $r(t){return{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}}function Pr(t){return t===B(t)||!q(t)?je(t):$r(t)}function Dr(t,e,r){r===void 0&&(r=!1);var o=N(e),n=Q(t),i=q(e),s={scrollLeft:0,scrollTop:0},a={x:0,y:0};return(i||!i&&!r)&&((W(e)!=="body"||Re(o))&&(s=Pr(e)),q(e)?(a=Q(e),a.x+=e.clientLeft,a.y+=e.clientTop):o&&(a.x=Me(o))),{x:n.left+s.scrollLeft-a.x,y:n.top+s.scrollTop-a.y,width:n.width,height:n.height}}function qr(t){var e=new Map,r=new Set,o=[];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(a){if(!r.has(a)){var l=e.get(a);l&&n(l)}}),o.push(i)}return t.forEach(function(i){r.has(i.name)||n(i)}),o}function Br(t){var e=qr(t);return Xt.reduce(function(r,o){return r.concat(e.filter(function(n){return n.phase===o}))},[])}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,o){var n=r[o.name];return r[o.name]=n?Object.assign({},n,o,{options:Object.assign({},n.options,o.options),data:Object.assign({},n.data,o.data)}):o,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(o){return!(o&&typeof o.getBoundingClientRect=="function")})}function Rr(t){t===void 0&&(t={});var e=t,r=e.defaultModifiers,o=r===void 0?[]:r,n=e.defaultOptions,i=n===void 0?tt:n;return function(a,l,d){d===void 0&&(d=i);var c={placement:"bottom",orderedModifiers:[],options:Object.assign({},tt,i),modifiersData:{},elements:{reference:a,popper:l},attributes:{},styles:{}},p=[],u=!1,v={state:c,setOptions:function(b){g(),c.options=Object.assign({},i,c.options,b),c.scrollParents={reference:ne(a)?re(a):a.contextElement?re(a.contextElement):[],popper:re(l)};var y=Br(Mr([].concat(o,c.options.modifiers)));return c.orderedModifiers=y.filter(function(A){return A.enabled}),m(),v.update()},forceUpdate:function(){if(!u){var b=c.elements,y=b.reference,A=b.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 f=0;f<c.orderedModifiers.length;f++){if(c.reset===!0){c.reset=!1,f=-1;continue}var C=c.orderedModifiers[f],w=C.fn,O=C.options,x=O===void 0?{}:O,L=C.name;typeof w=="function"&&(c=w({state:c,options:x,name:L,instance:v})||c)}}}},update:jr(function(){return new Promise(function(h){v.forceUpdate(),h(c)})}),destroy:function(){g(),u=!0}};if(!rt(a,l))return v;v.setOptions(d).then(function(h){!u&&d.onFirstUpdate&&d.onFirstUpdate(h)});function m(){c.orderedModifiers.forEach(function(h){var b=h.name,y=h.options,A=y===void 0?{}:y,f=h.effect;if(typeof f=="function"){var C=f({state:c,name:b,instance:v,options:A}),w=function(){};p.push(C||w)}})}function g(){p.forEach(function(h){return h()}),p=[]}return v}}var Wr=[cr,Lr,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 o=`${e.getAttribute("id")}-content`,n=document.getElementById(o),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",a=>{a.preventDefault(),s.update(),n.classList.toggle(ge),te.setAriaAttr(e,n,ge)}),document.addEventListener("mousedown",a=>{te.hide(e,n,s,ge,a)}),document.addEventListener("keydown",a=>{te.hide(e,n,s,ge,a)})})},hide:(t,e,r,o,n)=>{!t.contains(n.target)&&!r.state.elements.popper.contains(n.target)&&e.classList.contains(o)&&(e.classList.remove(o),te.setAriaAttr(t,e,o))},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",ot="mds-modal--active",Fr="js-mds-modal-close";let ye;const K={init:()=>{window.innerWidth>Nr&&Array.from(document.querySelectorAll(`[${nt}]`)).forEach(r=>{const o=r.getAttribute(nt),n=document.getElementById(o),i=Array.from(n.querySelectorAll(`.${Fr}`)),s=n.getAttribute("data-site-container"),a=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",u=>{u.preventDefault(),K.open(n,c,a)}),n.addEventListener("click",u=>{u.target===n&&K.close(n,ye,a)}),n.addEventListener("keydown",u=>{K.trapFocus(u,c,p),(u.key==="Escape"||u.key==="Esc")&&K.close(n,ye,a)}),i.forEach(u=>{u.addEventListener("click",()=>{K.close(n,ye,a)})})})},open:(t,e,r)=>{ye=document.activeElement,t.classList.add(ot),e.focus(),r.setAttribute("aria-hidden","true")},close:(t,e,r)=>{r.removeAttribute("aria-hidden"),t.classList.remove(ot),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",at="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),o=e.querySelector("input[type=file]"),n=e.querySelector(Ur);document.addEventListener("readystatechange",()=>{o.files&&o.files.length&&(r.textContent=o.files[0].name,e.classList.add(ke))}),o.addEventListener("change",()=>{o.files&&o.files.length&&(r.textContent=o.files[0].name,e.classList.add(ke),n.focus())}),n.addEventListener("click",i=>{i.preventDefault(),o.value="",r.textContent="",e.classList.remove(ke),o.focus()}),["dragover","dragenter"].forEach(i=>{o.addEventListener(i,s=>{s.stopPropagation(),e.classList.add(at)})}),["dragleave","dragend","drop"].forEach(i=>{o.addEventListener(i,s=>{s.stopPropagation(),e.classList.remove(at)})})})},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),o=r.getAttribute("maxlength"),n=e.querySelector(Jr),i=e.querySelector(Kr);r.removeAttribute("maxlength"),Te.updateCounter(r,o,i,n),r.addEventListener("keyup",s=>{s.stopPropagation(),Te.updateCounter(r,o,i,n)})})},updateCounter:(t,e,r,o)=>{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?o.classList.add("mds-form-message--error"):o.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 o;this.onmousedown=()=>{o=+new Date},this.onmouseup=()=>{+new Date-o<200&&r.click(),o=void 0}}disconnectedCallback(){this.onmousedown=this.onmouseup=null}}class tn extends HTMLElement{static observedAttributes=["form","field-name","show-when"];showHide=()=>{const{field:e}=this,r=this.getAttribute("show-when");(e.type==="checkbox"?e.checked.toString():e.value.toString())===r?this.hidden=!1:this.hidden=!0};setup=()=>{this.cleanup();const e=this.getAttribute("form"),r=this.getAttribute("field-name");if(this.formElement=e?document.querySelector(e):this.closest("form"),!this.formElement)throw new Error(`<mds-conditional-section> for ${r} could not find the associated form`);if(this.field=this.formElement.elements[r],!this.field)throw new Error(`<mds-conditional-section> for ${r} could not find the associated field`);this.showHide(),this.formElement.addEventListener("input",this.showHide)};connectedCallback(){this.setup()}cleanup=()=>{this.formElement?.removeEventListener("input",this.showHide)};disconnectedCallback(){this.cleanup()}attributeChangedCallback(e,r,o){const{showHide:n,setup:i}=this;this.isConnected&&r!==o&&(e==="show-when"?n():(e==="field-name"||e==="form")&&i())}}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);window.customElements.get("mds-conditional-section")||window.customElements.define("mds-conditional-section",tn);const $e=()=>{E.init(),ct.init(),Dt.init(),jt.init(),K.init(),gt.init(),Te.init(),te.init(),yt.init(),Zr.setFluidVideos()};window.mdgxInitAll=$e;document.readyState==="loading"?document.addEventListener("DOMContentLoaded",$e):$e();
1
+ import{M as xt}from"./dropdown-nav-DGGzV21D.js";import{M as Et}from"./timeout-dialog-plrFUmdZ.js";import{M as Ot}from"./image-cropper-BlqRRHAU.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},Ct="js-tabs-item",Ve="mds-tabs",Lt="mds-tabs__list",kt="mds-tabs__list-item",Ue="mds-tabs__panel",pe="mds-tabs__tab",me="mds-tabs__tab--selected",Xe="mds-tabs__panel--hidden",ve={left:37,right:39,up:38,down:40},St=".js-desktop-tabbed",Tt=".js-full-tabbed",$t=parseInt(st.size.breakpoint.lg.$value,10),E={init:()=>{E.setTabs(Tt),window.innerWidth>$t&&E.setTabs(St)},setTabs:t=>{const e=Array.from(document.querySelectorAll(`${t} .${pe}`)),r=Array.from(document.querySelectorAll(`${t} .${Lt}`)),o=Array.from(document.querySelectorAll(`${t} .${kt}`)),n=Array.from(document.querySelectorAll(`${t} .${Ue}`));r.forEach(a=>{a.setAttribute("role","tablist")}),o.forEach(a=>{a.setAttribute("role","presentation")}),e.forEach(a=>{a.setAttribute("role","tab"),a.setAttribute("aria-controls",a.attributes.href.value.substring(1)),a.classList.contains(me)?a.setAttribute("tabindex","0"):a.setAttribute("tabindex","-1")}),n.forEach(a=>{a.setAttribute("role","tabpanel"),a.setAttribute("aria-labelledby",`label-${a.attributes.id.value}`)});const i=document.querySelectorAll(`${t} .${Ct}`);Array.from(i).forEach(a=>{const l=window.location.hash.trim(),d=a.attributes.href.value,c=a.closest(`.${Ve}`),p=E.getAllPanels(c),u=E.getAllTabs(c),m=E.getTargetPanel(a,c);a.addEventListener("click",v=>{v.preventDefault(),E.updateTabs(u,p,a,m,d)}),d===l&&E.updateTabs(u,p,a,m,d)}),r.forEach(a=>{const l=a.closest(`.${Ve}`),d=E.getAllPanels(l),c=E.getAllTabs(l);a.addEventListener("keydown",p=>{switch(p.keyCode){case ve.left:case ve.up:p.preventDefault(),E.moveTab(a,l,c,d,!1);break;case ve.right:case ve.down:p.preventDefault(),E.moveTab(a,l,c,d,!0);break}})})},getSelectedTab:t=>t.querySelector(`.${me}`),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,o,n)=>{const i=E.getSelectedTab(t),s=n?E.getNextTab(i):E.getPrevTab(i);if(s){const a=s.attributes.href.value,l=E.getTargetPanel(s,e);E.updateTabs(r,o,s,l,a,!1)}},updateTabs:(t,e,r,o,n)=>{E.clearAllTabs(t),E.setActiveTab(r),E.clearAllPanels(e),E.setActivePanel(o,n)},clearAllTabs:t=>{t.forEach(e=>{e.classList.remove(me),e.setAttribute("aria-selected","false"),e.setAttribute("tabindex","-1")})},clearAllPanels:t=>{t.forEach(e=>{e.classList.add(Xe)})},setActiveTab:t=>{t.classList.add(me),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",Dt="mds-accordion__label",ct={init:()=>{const t=document.querySelectorAll(`.${Pt}`),e=window.innerWidth;t.forEach(o=>{ct.checkBreakpoint(o,e)||(o.open=!0,o.querySelector("summary").style.display="none")}),document.querySelectorAll(`.${Dt}`).forEach(o=>{o.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 o=t.dataset.bp.replace(/\D/g,""),n=t.dataset.bp.replace(/[0-9]/g,"");let i,s;switch(n){case"px":r=o;break;case"em":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=o*parseFloat(i),r=s;break;case"rem":i=window.getComputedStyle(document.querySelector("body"))["font-size"],s=o*parseFloat(i),r=s;break;default:return!0}return!(e>r)}return!0}},qt={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),a=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"),u=n.querySelector(".mds-subnavigation__drawer-content"),m=d.dataset.label,v=d.dataset.labelPlural;c.addEventListener("click",()=>{c.getAttribute("aria-expanded")==="true"?c.setAttribute("aria-expanded","false"):c.setAttribute("aria-expanded","true")}),d.addEventListener("focusout",h=>{d.contains(h.relatedTarget)||c.setAttribute("aria-expanded","false")});const g=()=>i.clientHeight>a.offsetHeight;e.push(()=>{c.setAttribute("aria-expanded","false"),window.getComputedStyle(l).getPropertyValue("display")==="none"?(s.forEach(b=>{i.append(b)}),d.style.display="none",g()&&(d.style.display="list-item",s.slice().reverse().forEach(b=>{if(g()&&b!==d){u.prepend(b);const y=Array.from(u.children).length,A=y>1?v:m;p.innerText=A.replace("{count}",y)}else i.prepend(b)}),u.style.width=`${i.offsetWidth-d.offsetLeft}px`)):(s.forEach(b=>{b!==d&&b!==l&&u.append(b)}),u.style.width="initial",d.style.display="block")})});const o=()=>{e.forEach(n=>{n()})};o(),window.onresize=()=>{clearTimeout(r),r=setTimeout(o,100)}}},Bt="mds-checkbox-accordion__button",jt="mds-checkbox-accordion__button--open",Mt={init:()=>{document.querySelectorAll(`.${Bt}`).forEach(e=>{e.classList.contains(jt)?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",P="bottom",D="right",$="left",Pe="auto",se=[T,P,D,$],G="start",De="end",Rt="clippingParents",lt="viewport",ee="popper",Wt="reference",Ye=se.reduce(function(t,e){return t.concat([e+"-"+G,e+"-"+De])},[]),dt=[].concat(se,[Pe]).reduce(function(t,e){return t.concat([e,e+"-"+G,e+"-"+De])},[]),It="beforeRead",_t="read",Ht="afterRead",Nt="beforeMain",Ft="main",zt="afterMain",Vt="beforeWrite",Ut="write",Xt="afterWrite",Yt=[It,_t,Ht,Nt,Ft,zt,Vt,Ut,Xt];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 ft(t){if(typeof ShadowRoot>"u")return!1;var e=B(t).ShadowRoot;return t instanceof e||t instanceof ShadowRoot}function Jt(t){var e=t.state;Object.keys(e.elements).forEach(function(r){var o=e.styles[r]||{},n=e.attributes[r]||{},i=e.elements[r];!q(i)||!W(i)||(Object.assign(i.style,o),Object.keys(n).forEach(function(s){var a=n[s];a===!1?i.removeAttribute(s):i.setAttribute(s,a===!0?"":a)}))})}function Kt(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(o){var n=e.elements[o],i=e.attributes[o]||{},s=Object.keys(e.styles.hasOwnProperty(o)?e.styles[o]:r[o]),a=s.reduce(function(l,d){return l[d]="",l},{});!q(n)||!W(n)||(Object.assign(n.style,a),Object.keys(i).forEach(function(l){n.removeAttribute(l)}))})}}const Gt={name:"applyStyles",enabled:!0,phase:"write",fn:Jt,effect:Kt,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,o=t.offsetHeight;return Math.abs(e.width-r)<=1&&(r=e.width),Math.abs(e.height-o)<=1&&(o=e.height),{x:t.offsetLeft,y:t.offsetTop,width:r,height:o}}function ut(t,e){var r=e.getRootNode&&e.getRootNode();if(t.contains(e))return!0;if(r&&ft(r)){var o=e;do{if(o&&t.isSameNode(o))return!0;o=o.parentNode||o.host}while(o)}return!1}function _(t){return B(t).getComputedStyle(t)}function Qt(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||(ft(t)?t.host:null)||N(t)}function Je(t){return!q(t)||_(t).position==="fixed"?null:t.offsetParent}function Zt(t){var e=navigator.userAgent.toLowerCase().indexOf("firefox")!==-1,r=navigator.userAgent.indexOf("Trident")!==-1;if(r&&q(t)){var o=_(t);if(o.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&&Qt(r)&&_(r).position==="static";)r=Je(r);return r&&(W(r)==="html"||W(r)==="body"&&_(r).position==="static")?e:r||Zt(t)||e}function Be(t){return["top","bottom"].indexOf(t)>=0?"x":"y"}var H=Math.max,oe=Math.min,he=Math.round;function we(t,e,r){return H(t,oe(e,r))}function pt(){return{top:0,right:0,bottom:0,left:0}}function mt(t){return Object.assign({},pt(),t)}function vt(t,e){return e.reduce(function(r,o){return r[o]=t,r},{})}var er=function(e,r){return e=typeof e=="function"?e(Object.assign({},r.rects,{placement:r.placement})):e,mt(typeof e!="number"?e:vt(e,se))};function tr(t){var e,r=t.state,o=t.name,n=t.options,i=r.elements.arrow,s=r.modifiersData.popperOffsets,a=R(r.placement),l=Be(a),d=[$,D].indexOf(a)>=0,c=d?"height":"width";if(!(!i||!s)){var p=er(n.padding,r),u=qe(i),m=l==="y"?T:$,v=l==="y"?P:D,g=r.rects.reference[c]+r.rects.reference[l]-s[l]-r.rects.popper[c],h=s[l]-r.rects.reference[l],b=ce(i),y=b?l==="y"?b.clientHeight||0:b.clientWidth||0:0,A=g/2-h/2,f=p[m],C=y-u[c]-p[v],w=y/2-u[c]/2+A,O=we(f,w,C),x=l;r.modifiersData[o]=(e={},e[x]=O,e.centerOffset=O-w,e)}}function rr(t){var e=t.state,r=t.options,o=r.element,n=o===void 0?"[data-popper-arrow]":o;n!=null&&(typeof n=="string"&&(n=e.elements.popper.querySelector(n),!n)||ut(e.elements.popper,n)&&(e.elements.arrow=n))}const nr={name:"arrow",enabled:!0,phase:"main",fn:tr,effect:rr,requires:["popperOffsets"],requiresIfExists:["preventOverflow"]};var or={top:"auto",right:"auto",bottom:"auto",left:"auto"};function ar(t){var e=t.x,r=t.y,o=window,n=o.devicePixelRatio||1;return{x:he(he(e*n)/n)||0,y:he(he(r*n)/n)||0}}function Ke(t){var e,r=t.popper,o=t.popperRect,n=t.placement,i=t.offsets,s=t.position,a=t.gpuAcceleration,l=t.adaptive,d=t.roundOffsets,c=d===!0?ar(i):typeof d=="function"?d(i):i,p=c.x,u=p===void 0?0:p,m=c.y,v=m===void 0?0:m,g=i.hasOwnProperty("x"),h=i.hasOwnProperty("y"),b=$,y=T,A=window;if(l){var f=ce(r),C="clientHeight",w="clientWidth";f===B(r)&&(f=N(r),_(f).position!=="static"&&(C="scrollHeight",w="scrollWidth")),f=f,n===T&&(y=P,v-=f[C]-o.height,v*=a?1:-1),n===$&&(b=D,u-=f[w]-o.width,u*=a?1:-1)}var O=Object.assign({position:s},l&&or);if(a){var x;return Object.assign({},O,(x={},x[y]=h?"0":"",x[b]=g?"0":"",x.transform=(A.devicePixelRatio||1)<2?"translate("+u+"px, "+v+"px)":"translate3d("+u+"px, "+v+"px, 0)",x))}return Object.assign({},O,(e={},e[y]=h?v+"px":"",e[b]=g?u+"px":"",e.transform="",e))}function ir(t){var e=t.state,r=t.options,o=r.gpuAcceleration,n=o===void 0?!0:o,i=r.adaptive,s=i===void 0?!0:i,a=r.roundOffsets,l=a===void 0?!0:a,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 sr={name:"computeStyles",enabled:!0,phase:"beforeWrite",fn:ir,data:{}};var be={passive:!0};function cr(t){var e=t.state,r=t.instance,o=t.options,n=o.scroll,i=n===void 0?!0:n,s=o.resize,a=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,be)}),a&&l.addEventListener("resize",r.update,be),function(){i&&d.forEach(function(c){c.removeEventListener("scroll",r.update,be)}),a&&l.removeEventListener("resize",r.update,be)}}const lr={name:"eventListeners",enabled:!0,phase:"write",fn:function(){},effect:cr,data:{}};var dr={left:"right",right:"left",bottom:"top",top:"bottom"};function Ae(t){return t.replace(/left|right|bottom|top/g,function(e){return dr[e]})}var fr={start:"end",end:"start"};function Ge(t){return t.replace(/start|end/g,function(e){return fr[e]})}function je(t){var e=B(t),r=e.pageXOffset,o=e.pageYOffset;return{scrollLeft:r,scrollTop:o}}function Me(t){return Q(N(t)).left+je(t).scrollLeft}function ur(t){var e=B(t),r=N(t),o=e.visualViewport,n=r.clientWidth,i=r.clientHeight,s=0,a=0;return o&&(n=o.width,i=o.height,/^((?!chrome|android).)*safari/i.test(navigator.userAgent)||(s=o.offsetLeft,a=o.offsetTop)),{width:n,height:i,x:s+Me(t),y:a}}function pr(t){var e,r=N(t),o=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),a=-o.scrollLeft+Me(t),l=-o.scrollTop;return _(n||r).direction==="rtl"&&(a+=H(r.clientWidth,n?n.clientWidth:0)-i),{width:i,height:s,x:a,y:l}}function Re(t){var e=_(t),r=e.overflow,o=e.overflowX,n=e.overflowY;return/auto|scroll|overlay|hidden/.test(r+n+o)}function ht(t){return["html","body","#document"].indexOf(W(t))>=0?t.ownerDocument.body:q(t)&&Re(t)?t:ht(xe(t))}function re(t,e){var r;e===void 0&&(e=[]);var o=ht(t),n=o===((r=t.ownerDocument)==null?void 0:r.body),i=B(o),s=n?[i].concat(i.visualViewport||[],Re(o)?o:[]):o,a=e.concat(s);return n?a:a.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 mr(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)?mr(e):Se(pr(N(t)))}function vr(t){var e=re(xe(t)),r=["absolute","fixed"].indexOf(_(t).position)>=0,o=r&&q(t)?ce(t):t;return ne(o)?e.filter(function(n){return ne(n)&&ut(n,o)&&W(n)!=="body"}):[]}function hr(t,e,r){var o=e==="clippingParents"?vr(t):[].concat(e),n=[].concat(o,[r]),i=n[0],s=n.reduce(function(a,l){var d=Qe(t,l);return a.top=H(d.top,a.top),a.right=oe(d.right,a.right),a.bottom=oe(d.bottom,a.bottom),a.left=H(d.left,a.left),a},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 ae(t){return t.split("-")[1]}function bt(t){var e=t.reference,r=t.element,o=t.placement,n=o?R(o):null,i=o?ae(o):null,s=e.x+e.width/2-r.width/2,a=e.y+e.height/2-r.height/2,l;switch(n){case T:l={x:s,y:e.y-r.height};break;case P:l={x:s,y:e.y+e.height};break;case D:l={x:e.x+e.width,y:a};break;case $:l={x:e.x-r.width,y:a};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,o=r.placement,n=o===void 0?t.placement:o,i=r.boundary,s=i===void 0?Rt:i,a=r.rootBoundary,l=a===void 0?lt:a,d=r.elementContext,c=d===void 0?ee:d,p=r.altBoundary,u=p===void 0?!1:p,m=r.padding,v=m===void 0?0:m,g=mt(typeof v!="number"?v:vt(v,se)),h=c===ee?Wt:ee,b=t.elements.reference,y=t.rects.popper,A=t.elements[u?h:c],f=hr(ne(A)?A:A.contextElement||N(t.elements.popper),s,l),C=Q(b),w=bt({reference:C,element:y,placement:n}),O=Se(Object.assign({},y,w)),x=c===ee?O:C,L={top:f.top-x.top+g.top,bottom:x.bottom-f.bottom+g.bottom,left:f.left-x.left+g.left,right:x.right-f.right+g.right},S=t.modifiersData.offset;if(c===ee&&S){var j=S[n];Object.keys(L).forEach(function(I){var k=[D,P].indexOf(I)>=0?1:-1,F=[T,P].indexOf(I)>=0?"y":"x";L[I]+=j[F]*k})}return L}function br(t,e){e===void 0&&(e={});var r=e,o=r.placement,n=r.boundary,i=r.rootBoundary,s=r.padding,a=r.flipVariations,l=r.allowedAutoPlacements,d=l===void 0?dt:l,c=ae(o),p=c?a?Ye:Ye.filter(function(v){return ae(v)===c}):se,u=p.filter(function(v){return d.indexOf(v)>=0});u.length===0&&(u=p);var m=u.reduce(function(v,g){return v[g]=ie(t,{placement:g,boundary:n,rootBoundary:i,padding:s})[R(g)],v},{});return Object.keys(m).sort(function(v,g){return m[v]-m[g]})}function gr(t){if(R(t)===Pe)return[];var e=Ae(t);return[Ge(t),e,Ge(e)]}function yr(t){var e=t.state,r=t.options,o=t.name;if(!e.modifiersData[o]._skip){for(var n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,a=s===void 0?!0:s,l=r.fallbackPlacements,d=r.padding,c=r.boundary,p=r.rootBoundary,u=r.altBoundary,m=r.flipVariations,v=m===void 0?!0:m,g=r.allowedAutoPlacements,h=e.options.placement,b=R(h),y=b===h,A=l||(y||!v?[Ae(h)]:gr(h)),f=[h].concat(A).reduce(function(V,M){return V.concat(R(M)===Pe?br(e,{placement:M,boundary:c,rootBoundary:p,padding:d,flipVariations:v,allowedAutoPlacements:g}):M)},[]),C=e.rects.reference,w=e.rects.popper,O=new Map,x=!0,L=f[0],S=0;S<f.length;S++){var j=f[S],I=R(j),k=ae(j)===G,F=[T,P].indexOf(I)>=0,Z=F?"width":"height",U=ie(e,{placement:j,boundary:c,rootBoundary:p,altBoundary:u,padding:d}),z=F?k?D:$:k?P:T;C[Z]>w[Z]&&(z=Ae(z));var Ee=Ae(z),X=[];if(i&&X.push(U[I]<=0),a&&X.push(U[z]<=0,U[Ee]<=0),X.every(function(V){return V})){L=j,x=!1;break}O.set(j,X)}if(x)for(var le=v?3:1,Oe=function(M){var fe=f.find(function(Ce){var J=O.get(Ce);if(J)return J.slice(0,M).every(function(Le){return Le})});if(fe)return L=fe,"break"},Y=le;Y>0;Y--){var de=Oe(Y);if(de==="break")break}e.placement!==L&&(e.modifiersData[o]._skip=!0,e.placement=L,e.reset=!0)}}const wr={name:"flip",enabled:!0,phase:"main",fn:yr,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 Ar(t){var e=t.state,r=t.name,o=e.rects.reference,n=e.rects.popper,i=e.modifiersData.preventOverflow,s=ie(e,{elementContext:"reference"}),a=ie(e,{altBoundary:!0}),l=Ze(s,o),d=Ze(a,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 xr={name:"hide",enabled:!0,phase:"main",requiresIfExists:["preventOverflow"],fn:Ar};function Er(t,e,r){var o=R(t),n=[$,T].indexOf(o)>=0?-1:1,i=typeof r=="function"?r(Object.assign({},e,{placement:t})):r,s=i[0],a=i[1];return s=s||0,a=(a||0)*n,[$,D].indexOf(o)>=0?{x:a,y:s}:{x:s,y:a}}function Or(t){var e=t.state,r=t.options,o=t.name,n=r.offset,i=n===void 0?[0,0]:n,s=dt.reduce(function(c,p){return c[p]=Er(p,e.rects,i),c},{}),a=s[e.placement],l=a.x,d=a.y;e.modifiersData.popperOffsets!=null&&(e.modifiersData.popperOffsets.x+=l,e.modifiersData.popperOffsets.y+=d),e.modifiersData[o]=s}const Cr={name:"offset",enabled:!0,phase:"main",requires:["popperOffsets"],fn:Or};function Lr(t){var e=t.state,r=t.name;e.modifiersData[r]=bt({reference:e.rects.reference,element:e.rects.popper,placement:e.placement})}const kr={name:"popperOffsets",enabled:!0,phase:"read",fn:Lr,data:{}};function Sr(t){return t==="x"?"y":"x"}function Tr(t){var e=t.state,r=t.options,o=t.name,n=r.mainAxis,i=n===void 0?!0:n,s=r.altAxis,a=s===void 0?!1:s,l=r.boundary,d=r.rootBoundary,c=r.altBoundary,p=r.padding,u=r.tether,m=u===void 0?!0:u,v=r.tetherOffset,g=v===void 0?0:v,h=ie(e,{boundary:l,rootBoundary:d,padding:p,altBoundary:c}),b=R(e.placement),y=ae(e.placement),A=!y,f=Be(b),C=Sr(f),w=e.modifiersData.popperOffsets,O=e.rects.reference,x=e.rects.popper,L=typeof g=="function"?g(Object.assign({},e.rects,{placement:e.placement})):g,S={x:0,y:0};if(w){if(i||a){var j=f==="y"?T:$,I=f==="y"?P:D,k=f==="y"?"height":"width",F=w[f],Z=w[f]+h[j],U=w[f]-h[I],z=m?-x[k]/2:0,Ee=y===G?O[k]:x[k],X=y===G?-x[k]:-O[k],le=e.elements.arrow,Oe=m&&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]),fe=A?O[k]/2-z-M-de-L:Ee-M-de-L,Ce=A?-O[k]/2+z+M+V+L:X+M+V+L,J=e.elements.arrow&&ce(e.elements.arrow),Le=J?f==="y"?J.clientTop||0:J.clientLeft||0:0,We=e.modifiersData.offset?e.modifiersData.offset[e.placement][f]:0,Ie=w[f]+fe-We-Le,_e=w[f]+Ce-We;if(i){var He=we(m?oe(Z,Ie):Z,F,m?H(U,_e):U);w[f]=He,S[f]=He-F}if(a){var wt=f==="x"?T:$,At=f==="x"?P:D,ue=w[C],Ne=ue+h[wt],Fe=ue-h[At],ze=we(m?oe(Ne,Ie):Ne,ue,m?H(Fe,_e):Fe);w[C]=ze,S[C]=ze-ue}}e.modifiersData[o]=S}}const $r={name:"preventOverflow",enabled:!0,phase:"main",fn:Tr,requiresIfExists:["offset"]};function Pr(t){return{scrollLeft:t.scrollLeft,scrollTop:t.scrollTop}}function Dr(t){return t===B(t)||!q(t)?je(t):Pr(t)}function qr(t,e,r){r===void 0&&(r=!1);var o=N(e),n=Q(t),i=q(e),s={scrollLeft:0,scrollTop:0},a={x:0,y:0};return(i||!i&&!r)&&((W(e)!=="body"||Re(o))&&(s=Dr(e)),q(e)?(a=Q(e),a.x+=e.clientLeft,a.y+=e.clientTop):o&&(a.x=Me(o))),{x:n.left+s.scrollLeft-a.x,y:n.top+s.scrollTop-a.y,width:n.width,height:n.height}}function Br(t){var e=new Map,r=new Set,o=[];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(a){if(!r.has(a)){var l=e.get(a);l&&n(l)}}),o.push(i)}return t.forEach(function(i){r.has(i.name)||n(i)}),o}function jr(t){var e=Br(t);return Yt.reduce(function(r,o){return r.concat(e.filter(function(n){return n.phase===o}))},[])}function Mr(t){var e;return function(){return e||(e=new Promise(function(r){Promise.resolve().then(function(){e=void 0,r(t())})})),e}}function Rr(t){var e=t.reduce(function(r,o){var n=r[o.name];return r[o.name]=n?Object.assign({},n,o,{options:Object.assign({},n.options,o.options),data:Object.assign({},n.data,o.data)}):o,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(o){return!(o&&typeof o.getBoundingClientRect=="function")})}function Wr(t){t===void 0&&(t={});var e=t,r=e.defaultModifiers,o=r===void 0?[]:r,n=e.defaultOptions,i=n===void 0?tt:n;return function(a,l,d){d===void 0&&(d=i);var c={placement:"bottom",orderedModifiers:[],options:Object.assign({},tt,i),modifiersData:{},elements:{reference:a,popper:l},attributes:{},styles:{}},p=[],u=!1,m={state:c,setOptions:function(b){g(),c.options=Object.assign({},i,c.options,b),c.scrollParents={reference:ne(a)?re(a):a.contextElement?re(a.contextElement):[],popper:re(l)};var y=jr(Rr([].concat(o,c.options.modifiers)));return c.orderedModifiers=y.filter(function(A){return A.enabled}),v(),m.update()},forceUpdate:function(){if(!u){var b=c.elements,y=b.reference,A=b.popper;if(rt(y,A)){c.rects={reference:qr(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 f=0;f<c.orderedModifiers.length;f++){if(c.reset===!0){c.reset=!1,f=-1;continue}var C=c.orderedModifiers[f],w=C.fn,O=C.options,x=O===void 0?{}:O,L=C.name;typeof w=="function"&&(c=w({state:c,options:x,name:L,instance:m})||c)}}}},update:Mr(function(){return new Promise(function(h){m.forceUpdate(),h(c)})}),destroy:function(){g(),u=!0}};if(!rt(a,l))return m;m.setOptions(d).then(function(h){!u&&d.onFirstUpdate&&d.onFirstUpdate(h)});function v(){c.orderedModifiers.forEach(function(h){var b=h.name,y=h.options,A=y===void 0?{}:y,f=h.effect;if(typeof f=="function"){var C=f({state:c,name:b,instance:m,options:A}),w=function(){};p.push(C||w)}})}function g(){p.forEach(function(h){return h()}),p=[]}return m}}var Ir=[lr,kr,sr,Gt,Cr,wr,$r,nr,xr],_r=Wr({defaultModifiers:Ir});const Hr=parseInt(it.baseline.$value,10),Nr="js-mds-popover-trigger",ge="mds-popover--active",te={init:()=>{Array.from(document.querySelectorAll(`.${Nr}`)).forEach(e=>{const o=`${e.getAttribute("id")}-content`,n=document.getElementById(o),i=n.dataset?n.dataset.placement:null,s=_r(e,n,{placement:i||"top-end",strategy:"fixed",modifiers:[{name:"offset",options:{offset:[0,Hr*3]}},{name:"arrow",options:{padding:5}}]});e.setAttribute("aria-expanded","false"),n.setAttribute("aria-hidden","true"),e.addEventListener("click",a=>{a.preventDefault(),s.update(),n.classList.toggle(ge),te.setAriaAttr(e,n,ge)}),document.addEventListener("mousedown",a=>{te.hide(e,n,s,ge,a)}),document.addEventListener("keydown",a=>{te.hide(e,n,s,ge,a)})})},hide:(t,e,r,o,n)=>{!t.contains(n.target)&&!r.state.elements.popper.contains(n.target)&&e.classList.contains(o)&&(e.classList.remove(o),te.setAriaAttr(t,e,o))},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"))}},Fr=parseInt(st.size.breakpoint.md.$value,10),nt="data-modal-id",ot="mds-modal--active",zr="js-mds-modal-close";let ye;const K={init:()=>{window.innerWidth>Fr&&Array.from(document.querySelectorAll(`[${nt}]`)).forEach(r=>{const o=r.getAttribute(nt),n=document.getElementById(o),i=Array.from(n.querySelectorAll(`.${zr}`)),s=n.getAttribute("data-site-container"),a=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",u=>{u.preventDefault(),K.open(n,c,a)}),n.addEventListener("click",u=>{u.target===n&&K.close(n,ye,a)}),n.addEventListener("keydown",u=>{K.trapFocus(u,c,p),(u.key==="Escape"||u.key==="Esc")&&K.close(n,ye,a)}),i.forEach(u=>{u.addEventListener("click",()=>{K.close(n,ye,a)})})})},open:(t,e,r)=>{ye=document.activeElement,t.classList.add(ot),e.focus(),r.setAttribute("aria-hidden","true")},close:(t,e,r)=>{r.removeAttribute("aria-hidden"),t.classList.remove(ot),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()))}},Vr=".mds-form-element--file",ke="mds-form-element--selected-file",at="mds-form-element--dragover",Ur=".mds-file-upload__file-name",Xr=".mds-file-upload__remove-button",Yr="mds-form-element--file-supported",gt={init:()=>{gt.isBrowserIE()||Array.from(document.querySelectorAll(Vr)).forEach(e=>{e.classList.add(Yr);const r=e.querySelector(Ur),o=e.querySelector("input[type=file]"),n=e.querySelector(Xr);document.addEventListener("readystatechange",()=>{o.files&&o.files.length&&(r.textContent=o.files[0].name,e.classList.add(ke))}),o.addEventListener("change",()=>{o.files&&o.files.length&&(r.textContent=o.files[0].name,e.classList.add(ke),n.focus())}),n.addEventListener("click",i=>{i.preventDefault(),o.value="",r.textContent="",e.classList.remove(ke),o.focus()}),["dragover","dragenter"].forEach(i=>{o.addEventListener(i,s=>{s.stopPropagation(),e.classList.add(at)})}),["dragleave","dragend","drop"].forEach(i=>{o.addEventListener(i,s=>{s.stopPropagation(),e.classList.remove(at)})})})},isBrowserIE:()=>!!window.document.documentMode},Jr=".mds-form-element--character-count",Kr=".mds-form-message--character-count",Gr=".js-character-count-number",Qr=".mds-form-control",Te={init:()=>{Array.from(document.querySelectorAll(Jr)).forEach(e=>{const r=e.querySelector(Qr),o=r.getAttribute("maxlength"),n=e.querySelector(Kr),i=e.querySelector(Gr);r.removeAttribute("maxlength"),Te.updateCounter(r,o,i,n),r.addEventListener("keyup",s=>{s.stopPropagation(),Te.updateCounter(r,o,i,n)})})},updateCounter:(t,e,r,o)=>{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?o.classList.add("mds-form-message--error"):o.classList.remove("mds-form-message--error")}},Zr="js-mds-button-double-submit",yt={init:()=>{Array.from(document.querySelectorAll(`.${Zr}`)).forEach(e=>{e.addEventListener("click",()=>{yt.toggleDisable(e)})})},toggleDisable:t=>{setTimeout(()=>{t.setAttribute("disabled","")},1),setTimeout(()=>{t.removeAttribute("disabled")},1e3)}},en={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 tn extends HTMLElement{connectedCallback(){const r=this.querySelector(".mds-card-link__link");let o;this.onmousedown=()=>{o=+new Date},this.onmouseup=()=>{+new Date-o<200&&r.click(),o=void 0}}disconnectedCallback(){this.onmousedown=this.onmouseup=null}}class rn extends HTMLElement{static observedAttributes=["form","field-name","show-when"];showHide=()=>{const{field:e}=this,r=this.getAttribute("show-when");(e.type==="checkbox"?e.checked.toString():e.value.toString())===r?this.hidden=!1:this.hidden=!0};setup=()=>{this.cleanup();const e=this.getAttribute("form"),r=this.getAttribute("field-name");if(this.formElement=e?document.querySelector(e):this.closest("form"),!this.formElement)throw new Error(`<mds-conditional-section> for ${r} could not find the associated form`);if(this.field=this.formElement.elements[r],!this.field)throw new Error(`<mds-conditional-section> for ${r} could not find the associated field`);this.showHide(),this.formElement.addEventListener("input",this.showHide)};connectedCallback(){this.setup()}cleanup=()=>{this.formElement?.removeEventListener("input",this.showHide)};disconnectedCallback(){this.cleanup()}attributeChangedCallback(e,r,o){const{showHide:n,setup:i}=this;this.isConnected&&r!==o&&(e==="show-when"?n():(e==="field-name"||e==="form")&&i())}}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",tn);window.customElements.get("mds-conditional-section")||window.customElements.define("mds-conditional-section",rn);window.customElements.get("mds-image-cropper")||window.customElements.define("mds-image-cropper",Ot);const $e=()=>{E.init(),ct.init(),qt.init(),Mt.init(),K.init(),gt.init(),Te.init(),te.init(),yt.init(),en.setFluidVideos()};window.mdgxInitAll=$e;document.readyState==="loading"?document.addEventListener("DOMContentLoaded",$e):$e();
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@madgex/design-system",
3
3
  "author": "Madgex",
4
4
  "license": "UNLICENSED",
5
- "version": "13.3.2",
5
+ "version": "13.5.0",
6
6
  "main": "dist/js/index.js",
7
7
  "exports": {
8
8
  ".": "./dist/js/index.js",
@@ -29,6 +29,8 @@
29
29
  "build:icons": "svgo -f src/icons ./dist/assets/icons",
30
30
  "build:fractal": "fractal build",
31
31
  "build:vite": "vite build --config=./vite.config.js",
32
+ "test": "vitest run",
33
+ "test:watch": "vitest",
32
34
  "prepublishOnly": "npm run build",
33
35
  "semantic-release": "semantic-release -e semantic-release-monorepo"
34
36
  },
@@ -51,7 +53,7 @@
51
53
  "del": "^6.0.0",
52
54
  "globby": "^11.0.4",
53
55
  "gulp": "^4.0.2",
54
- "jsdom": "^27.1.0",
56
+ "jsdom": "^28.1.0",
55
57
  "nunjucks": "^3.2.4",
56
58
  "postcss": "^8.5.6",
57
59
  "postcss-combine-media-query": "^1.0.1",
@@ -60,8 +62,8 @@
60
62
  "sass": "^1.93.3",
61
63
  "svgo": "^2.8.0",
62
64
  "svgstore": "^3.0.0-2",
63
- "vite": "^7.2.0",
64
- "vitest": "^4.0.7"
65
+ "vite": "^7.3.1",
66
+ "vitest": "^4.0.18"
65
67
  },
66
68
  "engines": {
67
69
  "node": ">=22"
@@ -0,0 +1,80 @@
1
+ # mds-image-cropper
2
+
3
+ ## Usage
4
+
5
+ There are 2 flavours of this component: regular `<mds-image-cropper/>` bundled with Design System JS, and Standalone ShadowDOM version `<mds-image-cropper-standalone />`.
6
+
7
+ ### Example
8
+
9
+ ```html
10
+ <mds-image-cropper id="my-cropper" aspect-ratio="1" src="/assets/images/image-cropper-example.jpg"></mds-image-cropper>
11
+
12
+ <script type="module">
13
+ const myCropper = document.querySelector('#my-cropper');
14
+ myCropper.setAttribute('src', URL.createObjectURL(myFile)); // if getting image from file input or mds-image-cropper is already on the page
15
+ let previousUrlCreatedFromBlob;
16
+ myCropper.addEventListener('commit', (e) => {
17
+ if (e.detail) {
18
+ try {
19
+ // optionally cleanup any previous createObjectURL usage to clear memory
20
+ URL.revokeObjectURL(previousUrlCreatedFromBlob);
21
+ } catch (e) {}
22
+ const croppedFile = new File([e.detail], 'my-file-name', { type: e.detail.type });
23
+ const dataTransfer = new DataTransfer();
24
+ dataTransfer.items.add(croppedFile);
25
+ myFileInput.files = dataTransfer.files;
26
+ // close modal here
27
+ }
28
+ });
29
+ myCropper.addEventListener('reset', (e) => {
30
+ // close modal here
31
+ });
32
+ myCropper.addEventListener('error', (e) => {
33
+ // cropping failed?
34
+ });
35
+ </script>
36
+ ```
37
+
38
+ ## Attributes
39
+
40
+ - `aspect-ratio` : optional, default `1.77777`. Should be a int/float Number e.g. `1` for square aspect-ratio, `1.77777` for an aspect ratio of `16/9`.
41
+ - If `output-width` and `output-height` attributes are set then aspect will be automatically calculated from those values, and this attribute will be ignored.
42
+ - `output-width` : optional, Int representing exact pixels for output image, and also used to calculate `aspect-ratio` of crop. You should also set `output-height` attribute.
43
+ - `output-height` : optional, Int representing exact pixels for output image, and also used to calculate `aspect-ratio` of crop. You should also set `output-width` attribute.
44
+ - `src` : required, image source
45
+ - `zoom`: optional, default `1`
46
+ - `min-zoom`: optional, default `1`. Set to a value between `0` and `1` to allow "zooming out", combined with `restrict-position="false"`
47
+ - `max-zoom`: optional, default `3`
48
+ - `crop-x`: optional, default `0`. `0` is center of image on `x axis`
49
+ - `crop-y`: optional, default `0`. `0` is center of image on `y axis`
50
+ - `no-grid`: optional, default `false`. set empty attribute or to `true` to hide grid
51
+ - `restrict-position`: optional, default `true`. set to `false` to allow moving the image outside of the crop area
52
+
53
+ ### translations
54
+
55
+ - `t-zoom-label` : optional, default : `Zoom`
56
+ - `t-btn-reset` : optional, default : `Reset`
57
+ - `t-btn-commit` : optional, default : `Save and crop`
58
+ - `t-btn-zoom-out-aria`: optional, default : `Minus button - Zoom out`
59
+ - `t-btn-zoom-in-aria`: optional, default : `Plus button - Zoom in`
60
+ - `t-touch-area-controls` : optional, default : `On this element you can use arrow keys to pan the image around the crop area, and Page Up / Page Down to zoom in and out.`
61
+ - `t-aria-live` : optional, default : `Crop Top Position: {y} pixels, Crop Left Position: {x} pixels, Crop Width {width} pixels, Crop Height: {height} pixels. Image Width: {imageWidth} pixels, Image Height: {imageHeight} pixels.`
62
+
63
+ ## Events
64
+
65
+ - `cropchange` `e.detail = { percent, pixels }` : This event is fired when the crop data has changed. emits crop area of image as pixels and percentage
66
+ - `reset`: Reset button was clicked - zoom & crop has been reset. Useful to listen to if you want to close a dialog or reset something outside of this component
67
+ - `commit` `e.detail = Blob`: "Save" button was clicked, emits a `Blob` of the cropped image data
68
+ - `error`: usually failure to crop image
69
+
70
+ ## Accessibility
71
+
72
+ ### Keyboard controls
73
+
74
+ - `image container` element : `Arrow keys` to pan, `PageUp` and `PageDown` to zoom.
75
+ - `zoom buttons` and `zoom range input`: control zoom with natural controls
76
+
77
+ ### Mouse controls
78
+
79
+ - `mouse`, `touch` on image container for panning
80
+ - `pinch to zoom` and `mouse wheel` on image container for zoom
@@ -0,0 +1,229 @@
1
+ /**
2
+ * Compute the dimension of the crop area based on image size and aspect ratio
3
+ * @param imgWidth width of the src image in pixels
4
+ * @param imgHeight height of the src image in pixels
5
+ * @param aspect aspect ratio of the crop
6
+ */
7
+ export function getCropSize(imgWidth = 0, imgHeight = 0, aspect) {
8
+ if (imgWidth >= imgHeight * aspect) {
9
+ return {
10
+ width: imgHeight * aspect,
11
+ height: imgHeight,
12
+ };
13
+ }
14
+ return {
15
+ width: imgWidth,
16
+ height: imgWidth / aspect,
17
+ };
18
+ }
19
+
20
+ /**
21
+ * Ensure a new image position stays in the crop area.
22
+ * @param position new x/y position requested for the image
23
+ * @param imageSize width/height of the src image
24
+ * @param cropSize width/height of the crop area
25
+ * @param zoom zoom value
26
+ * @returns
27
+ */
28
+ export function restrictPosition(position, imageSize, cropSize, zoom) {
29
+ return {
30
+ x: restrictPositionCoord(position.x, imageSize.width, cropSize.width, zoom),
31
+ y: restrictPositionCoord(position.y, imageSize.height, cropSize.height, zoom),
32
+ };
33
+ }
34
+
35
+ function restrictPositionCoord(position, imageSize, cropSize, zoom) {
36
+ // Default max position calculation
37
+ let maxPosition = (imageSize * zoom) / 2 - cropSize / 2;
38
+ // Allow free movement of the image inside the crop area if zoom is less than 1
39
+ // But limit the image's position to inside the cropBox
40
+ if (zoom < 1) {
41
+ maxPosition = cropSize / 2 - (imageSize * zoom) / 2;
42
+ }
43
+ return Math.min(maxPosition, Math.max(position, -maxPosition));
44
+ }
45
+
46
+ /**
47
+ * Compute the output cropped area of the image in percentages and pixels.
48
+ * x/y are the top-left coordinates on the src image
49
+ * @param crop x/y position of the current center of the image
50
+ * @param imageSize width/height of the src image (default is size on the screen, natural is the original size)
51
+ * @param cropSize width/height of the crop area
52
+ * @param aspect aspect value
53
+ * @param zoom zoom value
54
+ * @param restrictPosition whether we should limit or not the cropped area
55
+ */
56
+ export function computeCroppedArea({ crop, imageSize, cropSize, aspect, zoom, restrictPosition = true }) {
57
+ if (!cropSize?.width) return;
58
+ const limitAreaFn = restrictPosition ? limitArea : (_, value) => value;
59
+ const croppedAreaPercentages = {
60
+ x: limitAreaFn(100, (((imageSize.width - cropSize.width / zoom) / 2 - crop.x / zoom) / imageSize.width) * 100),
61
+ y: limitAreaFn(100, (((imageSize.height - cropSize.height / zoom) / 2 - crop.y / zoom) / imageSize.height) * 100),
62
+ width: limitAreaFn(100, ((cropSize.width / imageSize.width) * 100) / zoom),
63
+ height: limitAreaFn(100, ((cropSize.height / imageSize.height) * 100) / zoom),
64
+ };
65
+
66
+ // we compute the pixels size naively
67
+ const widthInPixels = limitAreaFn(
68
+ imageSize.naturalWidth,
69
+ (croppedAreaPercentages.width * imageSize.naturalWidth) / 100,
70
+ true,
71
+ );
72
+ const heightInPixels = limitAreaFn(
73
+ imageSize.naturalHeight,
74
+ (croppedAreaPercentages.height * imageSize.naturalHeight) / 100,
75
+ true,
76
+ );
77
+ const isImgWiderThanHigh = imageSize.naturalWidth >= imageSize.naturalHeight * aspect;
78
+
79
+ // then we ensure the width and height exactly match the aspect (to avoid rounding approximations)
80
+ // if the image is wider than high, when zoom is 0, the crop height will be equals to image height
81
+ // thus we want to compute the width from the height and aspect for accuracy.
82
+ // Otherwise, we compute the height from width and aspect.
83
+ const sizePixels = isImgWiderThanHigh
84
+ ? {
85
+ width: Math.round(heightInPixels * aspect),
86
+ height: heightInPixels,
87
+ }
88
+ : {
89
+ width: widthInPixels,
90
+ height: Math.round(widthInPixels / aspect),
91
+ };
92
+ const croppedAreaPixels = {
93
+ ...sizePixels,
94
+ x: limitAreaFn(
95
+ imageSize.naturalWidth - sizePixels.width,
96
+ (croppedAreaPercentages.x * imageSize.naturalWidth) / 100,
97
+ true,
98
+ ),
99
+ y: limitAreaFn(
100
+ imageSize.naturalHeight - sizePixels.height,
101
+ (croppedAreaPercentages.y * imageSize.naturalHeight) / 100,
102
+ true,
103
+ ),
104
+ };
105
+ return { percent: croppedAreaPercentages, pixels: croppedAreaPixels };
106
+ }
107
+
108
+ /**
109
+ * Ensure the returned value is between 0 and max
110
+ * @param max
111
+ * @param value
112
+ * @param shouldRound
113
+ */
114
+ function limitArea(max, value, shouldRound = false) {
115
+ const v = shouldRound ? Math.round(value) : value;
116
+ return Math.min(max, Math.max(0, v));
117
+ }
118
+
119
+ const createImage = (url) =>
120
+ new Promise((resolve, reject) => {
121
+ const image = new Image();
122
+ image.addEventListener('load', () => resolve(image));
123
+ image.addEventListener('error', (error) => reject(error));
124
+ image.setAttribute('crossOrigin', 'anonymous'); // needed to avoid cross-origin issues
125
+ image.src = url;
126
+ });
127
+ const RAD_TO_DEG = Math.PI / 180;
128
+
129
+ /**
130
+ *
131
+ * @param {object} options
132
+ * @param {HTMLImageElement} options.imageEl
133
+ * @param {{x:number, y:number, width: number, height: number}} options.crop realsize in pixels vs original image dimensions, crop bounding box, origin 0 is center
134
+ * @param {number} options.rotateDeg degrees
135
+ * @param {string} options.format optional, default `png`
136
+ * @param {string} options.backgroundFill, optional, e.g. `#fff`
137
+ * @param {number} options.width, optional, fixed output width
138
+ * @param {number} options.height, optional, fixed output height
139
+ * @returns
140
+ */
141
+ export async function getCroppedImage({
142
+ imageEl: origImageEl,
143
+ crop,
144
+ rotateDeg = 0,
145
+ format = 'png',
146
+ backgroundFill,
147
+ width,
148
+ height,
149
+ }) {
150
+ if (!origImageEl || !crop) return null;
151
+
152
+ const imageEl = await createImage(origImageEl.src);
153
+ const canvas = document.createElement('canvas');
154
+ const ctx = canvas.getContext('2d');
155
+ if (!ctx) return null;
156
+
157
+ const scaleX = width ? width / crop.width : 1;
158
+ const scaleY = height ? height / crop.height : 1;
159
+
160
+ // const scaleX = imageEl.naturalWidth / imageEl.width;
161
+ // const scaleY = imageEl.naturalHeight / imageEl.height;
162
+
163
+ canvas.width = Math.floor(crop.width * scaleX);
164
+ canvas.height = Math.floor(crop.height * scaleY);
165
+
166
+ ctx.imageSmoothingQuality = 'high';
167
+
168
+ const cropX = crop.x * scaleX;
169
+ const cropY = crop.y * scaleY;
170
+
171
+ const rotateRads = rotateDeg * RAD_TO_DEG;
172
+ const centerX = (imageEl.naturalWidth / 2) * scaleX;
173
+ const centerY = (imageEl.naturalHeight / 2) * scaleY;
174
+
175
+ ctx.save();
176
+ // background fill color
177
+ if (backgroundFill) {
178
+ ctx.fillStyle = backgroundFill;
179
+ ctx.fillRect(0, 0, canvas.width, canvas.height);
180
+ }
181
+
182
+ // Move the crop origin to the canvas origin (0,0)
183
+ ctx.translate(-cropX, -cropY);
184
+ // Move the origin to the center of the original image
185
+ ctx.translate(centerX, centerY);
186
+ // Rotate around the origin
187
+ ctx.rotate(rotateRads);
188
+ // Move the center of the image to the origin (0,0)
189
+ ctx.translate(-centerX, -centerY);
190
+
191
+ ctx.drawImage(
192
+ imageEl,
193
+ 0, // canvas is translated, origin is "0"
194
+ 0, // canvas is translated, origin is "0"
195
+ imageEl.naturalWidth, // source image size
196
+ imageEl.naturalHeight, // source image size
197
+ 0, // canvas is translated, origin is "0"
198
+ 0, // canvas is translated, origin is "0"
199
+ imageEl.naturalWidth * scaleX, // destination image size
200
+ imageEl.naturalHeight * scaleY, // destination image size
201
+ );
202
+
203
+ // As Base64 string
204
+ // return canvas.toDataURL('image/jpeg');
205
+ // As a blob
206
+ return new Promise((resolve, reject) => {
207
+ canvas.toBlob(
208
+ (blob) => {
209
+ try {
210
+ resolve(blob);
211
+ } catch (error) {
212
+ reject(error);
213
+ }
214
+ },
215
+ `image/${format}`,
216
+ 0.9,
217
+ );
218
+ });
219
+ }
220
+ /**
221
+ * Strip all HTML from a string. Useful as Safari does not support `setHTML`, a safe XSS function
222
+ * @param {string} htmlString
223
+ * @returns {string} clean text string
224
+ */
225
+ export function stripHTML(htmlString) {
226
+ if (!htmlString) return htmlString;
227
+ let doc = new DOMParser().parseFromString(htmlString, 'text/html');
228
+ return doc.body.textContent || '';
229
+ }