UNPKG

@lucidcms/core

Version:

The core of the Lucid CMS. It's responsible for spinning up the API and serving the CMS.

1 lines 39.4 kB
var e=typeof window<`u`&&window.document!==void 0,t=e?window:{},n=e?`ontouchstart`in t.document.documentElement:!1,r=e?`PointerEvent`in t:!1,i=`cropper`,a=`${i}-canvas`,o=`${i}-crosshair`,s=`${i}-grid`,c=`${i}-handle`,l=`${i}-image`,u=`${i}-selection`,d=`${i}-shade`,f=`${i}-viewer`,p=`select`,m=`move`,h=`scale`,g=`rotate`,_=`transform`,v=`none`,y=`n-resize`,b=`e-resize`,x=`s-resize`,S=`w-resize`,C=`ne-resize`,w=`nw-resize`,T=`se-resize`,E=`sw-resize`,ee=n?`touchend touchcancel`:`mouseup`,te=n?`touchmove`:`mousemove`,ne=r?`pointerdown`:n?`touchstart`:`mousedown`,re=r?`pointermove`:te,ie=r?`pointerup pointercancel`:ee,ae=`error`,oe=`keydown`,D=`load`,se=`resize`,ce=`wheel`,O=`action`,k=`actionend`,A=`actionstart`,j=`change`,le=`transform`;function M(e){return typeof e==`string`}var ue=Number.isNaN||t.isNaN;function N(e){return typeof e==`number`&&!ue(e)}function P(e){return N(e)&&e>0&&e<1/0}function de(e){return e===void 0}function fe(e){return typeof e==`object`&&!!e}var{hasOwnProperty:pe}=Object.prototype;function F(e){if(!fe(e))return!1;try{let{constructor:t}=e,{prototype:n}=t;return t&&n&&pe.call(n,`isPrototypeOf`)}catch{return!1}}function I(e){return typeof e==`function`}function L(e){return typeof e==`object`&&!!e&&e.nodeType===1}var me=/([a-z\d])([A-Z])/g;function he(e){return String(e).replace(me,`$1-$2`).toLowerCase()}var ge=/-[A-z\d]/g;function _e(e){return e.replace(ge,e=>e.slice(1).toUpperCase())}var ve=/\s\s*/;function R(e,t,n,r){t.trim().split(ve).forEach(t=>{e.removeEventListener(t,n,r)})}function z(e,t,n,r){t.trim().split(ve).forEach(t=>{e.addEventListener(t,n,r)})}function ye(e,t,n,r){z(e,t,n,Object.assign(Object.assign({},r),{once:!0}))}var be={bubbles:!0,cancelable:!0,composed:!0};function xe(e,t,n,r){return e.dispatchEvent(new CustomEvent(t,Object.assign(Object.assign(Object.assign({},be),{detail:n}),r)))}function Se(e){return typeof e.composedPath==`function`&&e.composedPath().find(L)||e.target}var Ce=Promise.resolve();function we(e,t){return t?Ce.then(e?t.bind(e):t):Ce}function Te(e){let t=e.getRootNode();switch(t.nodeType){case 1:return t.ownerDocument;case 9:return t;case 11:return t}return null}function Ee(e){let{documentElement:n}=e.ownerDocument,r=e.getBoundingClientRect();return{left:r.left+(t.pageXOffset-n.clientLeft),top:r.top+(t.pageYOffset-n.clientTop)}}var De=/deg|g?rad|turn$/i;function B(e){let t=parseFloat(e)||0;if(t!==0){let[n=`rad`]=String(e).match(De)||[];switch(n.toLowerCase()){case`deg`:return t/360*(Math.PI*2);case`grad`:return t/400*(Math.PI*2);case`turn`:return Math.PI*2*t}}return t}var Oe=`contain`,ke=`cover`;function V(e,t=Oe){let{aspectRatio:n}=e,{width:r,height:i}=e,a=P(r),o=P(i);if(a&&o){let e=i*n;t===Oe&&e>r||t===ke&&e<r?i=r/n:r=i*n}else a?i=r/n:o&&(r=i*n);return{width:r,height:i}}function Ae(e,...t){if(t.length===0)return e;let[n,r,i,a,o,s]=e,[c,l,u,d,f,p]=t[0];return e=[n*c+i*l,r*c+a*l,n*u+i*d,r*u+a*d,n*f+i*p+o,r*f+a*p+s],Ae(e,...t.slice(1))}var je=`:host([hidden]){display:none!important}`,Me=/left|top|width|height/i,Ne=`open`,H=new WeakMap,U=new WeakMap,Pe=new Map,Fe=t.document&&Array.isArray(t.document.adoptedStyleSheets)&&`replaceSync`in t.CSSStyleSheet.prototype,W=class extends HTMLElement{get $sharedStyle(){return`${this.themeColor?`:host{--theme-color: ${this.themeColor};}`:``}${je}`}constructor(){super(),this.shadowRootMode=Ne,this.slottable=!0;let e=Object.getPrototypeOf(this)?.constructor?.$name;e&&Pe.set(e,this.tagName.toLowerCase())}static get observedAttributes(){return[`shadow-root-mode`,`slottable`,`theme-color`]}attributeChangedCallback(e,t,n){if(Object.is(n,t))return;let r=_e(e),i=this[r],a=n;switch(typeof i){case`boolean`:a=n!==null&&n!==`false`;break;case`number`:a=Number(n);break}switch(this[r]=a,e){case`theme-color`:{let e=U.get(this),t=this.$sharedStyle;e&&t&&(Fe?e.replaceSync(t):e.textContent=t);break}}}$propertyChangedCallback(e,t,n){if(!Object.is(n,t))switch(e=he(e),typeof n){case`boolean`:n===!0?this.hasAttribute(e)||this.setAttribute(e,``):this.removeAttribute(e);break;case`number`:n=ue(n)?``:String(n);default:n?this.getAttribute(e)!==n&&this.setAttribute(e,n):this.removeAttribute(e)}}connectedCallback(){Object.getPrototypeOf(this).constructor.observedAttributes.forEach(e=>{let t=_e(e),n=this[t];de(n)||this.$propertyChangedCallback(t,void 0,n),Object.defineProperty(this,t,{enumerable:!0,configurable:!0,get(){return n},set(e){let r=n;n=e,this.$propertyChangedCallback(t,r,e)}})});let e=this.shadowRoot||this.attachShadow({mode:this.shadowRootMode||Ne});if(H.set(this,e),U.set(this,this.$addStyles(this.$sharedStyle)),this.$style&&this.$addStyles(this.$style),this.$template){let t=document.createElement(`template`);t.innerHTML=this.$template,e.appendChild(t.content)}if(this.slottable){let t=document.createElement(`slot`);e.appendChild(t)}}disconnectedCallback(){U.has(this)&&U.delete(this),H.has(this)&&H.delete(this)}$getTagNameOf(e){return Pe.get(e)??e}$setStyles(e){return Object.keys(e).forEach(t=>{let n=e[t];N(n)&&(n=n!==0&&Me.test(t)?`${n}px`:String(n)),this.style[t]=n}),this}$getShadowRoot(){return this.shadowRoot||H.get(this)}$addStyles(e){let t,n=this.$getShadowRoot();return Fe?(t=new CSSStyleSheet,t.replaceSync(e),n.adoptedStyleSheets=n.adoptedStyleSheets.concat(t)):(t=document.createElement(`style`),t.textContent=e,n.appendChild(t)),t}$emit(e,t,n){return xe(this,e,t,n)}$nextTick(e){return we(this,e)}static $define(n,r){fe(n)&&(r=n,n=``),n||=this.$name||this.name,n=he(n),e&&t.customElements&&!t.customElements.get(n)&&customElements.define(n,this,r)}};W.$version=`2.1.1`;var Ie=`:host{display:block;min-height:100px;min-width:200px;overflow:hidden;position:relative;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([background]){background-color:#fff;background-image:repeating-linear-gradient(45deg,#ccc 25%,transparent 0,transparent 75%,#ccc 0,#ccc),repeating-linear-gradient(45deg,#ccc 25%,transparent 0,transparent 75%,#ccc 0,#ccc);background-image:repeating-conic-gradient(#ccc 0 25%,#fff 0 50%);background-position:0 0,.5rem .5rem;background-size:1rem 1rem}:host([disabled]){pointer-events:none}:host([disabled]):after{bottom:0;content:"";cursor:not-allowed;display:block;left:0;pointer-events:none;position:absolute;right:0;top:0}`,G=class extends W{constructor(){super(...arguments),this.$onPointerDown=null,this.$onPointerMove=null,this.$onPointerUp=null,this.$onWheel=null,this.$wheeling=!1,this.$pointers=new Map,this.$style=Ie,this.$action=v,this.background=!1,this.disabled=!1,this.scaleStep=.1,this.themeColor=`#39f`}static get observedAttributes(){return super.observedAttributes.concat([`background`,`disabled`,`scale-step`])}connectedCallback(){super.connectedCallback(),this.disabled||this.$bind()}disconnectedCallback(){this.disabled||this.$unbind(),super.disconnectedCallback()}$propertyChangedCallback(e,t,n){if(!Object.is(n,t))switch(super.$propertyChangedCallback(e,t,n),e){case`disabled`:n?this.$unbind():this.$bind();break}}$bind(){this.$onPointerDown||(this.$onPointerDown=this.$handlePointerDown.bind(this),z(this,ne,this.$onPointerDown)),this.$onPointerMove||(this.$onPointerMove=this.$handlePointerMove.bind(this),z(this.ownerDocument,re,this.$onPointerMove)),this.$onPointerUp||(this.$onPointerUp=this.$handlePointerUp.bind(this),z(this.ownerDocument,ie,this.$onPointerUp)),this.$onWheel||(this.$onWheel=this.$handleWheel.bind(this),z(this,ce,this.$onWheel,{passive:!1,capture:!0}))}$unbind(){this.$onPointerDown&&=(R(this,ne,this.$onPointerDown),null),this.$onPointerMove&&=(R(this.ownerDocument,re,this.$onPointerMove),null),this.$onPointerUp&&=(R(this.ownerDocument,ie,this.$onPointerUp),null),this.$onWheel&&=(R(this,ce,this.$onWheel,{capture:!0}),null)}$handlePointerDown(e){let{buttons:t,button:n,type:r}=e;if(this.disabled||(r===`pointerdown`&&e.pointerType===`mouse`||r===`mousedown`)&&(N(t)&&t!==1||N(n)&&n!==0||e.ctrlKey))return;let{$pointers:i}=this,a=``;if(e.changedTouches)Array.from(e.changedTouches).forEach(({identifier:e,pageX:t,pageY:n})=>{i.set(e,{startX:t,startY:n,endX:t,endY:n})});else{let{pointerId:t=0,pageX:n,pageY:r}=e;i.set(t,{startX:n,startY:r,endX:n,endY:r})}i.size>1?a=_:L(e.target)&&(a=e.target.action||e.target.getAttribute(`action`)||``),this.$emit(`actionstart`,{action:a,relatedEvent:e})!==!1&&(e.preventDefault(),this.$action=a,this.style.willChange=`transform`)}$handlePointerMove(e){let{$action:t,$pointers:n}=this;if(this.disabled||t===`none`||n.size===0||this.$emit(`actionmove`,{action:t,relatedEvent:e})===!1)return;if(e.preventDefault(),e.changedTouches)Array.from(e.changedTouches).forEach(({identifier:e,pageX:t,pageY:r})=>{let i=n.get(e);i&&Object.assign(i,{endX:t,endY:r})});else{let{pointerId:t=0,pageX:r,pageY:i}=e,a=n.get(t);a&&Object.assign(a,{endX:r,endY:i})}let r={action:t,relatedEvent:e};if(t===`transform`){let t=new Map(n),i=0,a=0,o=0,s=0,c=e.pageX,l=e.pageY;n.forEach((e,n)=>{t.delete(n),t.forEach(t=>{let n=t.startX-e.startX,r=t.startY-e.startY,u=t.endX-e.endX,d=t.endY-e.endY,f=0,p=0,m=0,h=0;if(n===0?r<0?m=Math.PI*2:r>0&&(m=Math.PI):n>0?m=Math.PI/2+Math.atan(r/n):n<0&&(m=Math.PI*1.5+Math.atan(r/n)),u===0?d<0?h=Math.PI*2:d>0&&(h=Math.PI):u>0?h=Math.PI/2+Math.atan(d/u):u<0&&(h=Math.PI*1.5+Math.atan(d/u)),h>0||m>0){let n=h-m,r=Math.abs(n);r>i&&(i=r,o=n,c=(e.startX+t.startX)/2,l=(e.startY+t.startY)/2)}if(n=Math.abs(n),r=Math.abs(r),u=Math.abs(u),d=Math.abs(d),n>0&&r>0?f=Math.sqrt(n*n+r*r):n>0?f=n:r>0&&(f=r),u>0&&d>0?p=Math.sqrt(u*u+d*d):u>0?p=u:d>0&&(p=d),f>0&&p>0){let n=(p-f)/f,r=Math.abs(n);r>a&&(a=r,s=n,c=(e.startX+t.startX)/2,l=(e.startY+t.startY)/2)}})});let u=i>0,d=a>0;u&&d?(r.rotate=o,r.scale=s,r.centerX=c,r.centerY=l):u?(r.action=g,r.rotate=o,r.centerX=c,r.centerY=l):d?(r.action=h,r.scale=s,r.centerX=c,r.centerY=l):r.action=v}else{let[e]=Array.from(n.values());Object.assign(r,e)}n.forEach(e=>{e.startX=e.endX,e.startY=e.endY}),r.action!==`none`&&this.$emit(O,r,{cancelable:!1})}$handlePointerUp(e){let{$action:t,$pointers:n}=this;if(!(this.disabled||t===`none`)&&this.$emit(`actionend`,{action:t,relatedEvent:e})!==!1){if(e.preventDefault(),e.changedTouches)Array.from(e.changedTouches).forEach(({identifier:e})=>{n.delete(e)});else{let{pointerId:t=0}=e;n.delete(t)}n.size===0&&(this.style.willChange=``,this.$action=v)}}$handleWheel(e){if(this.disabled||(e.preventDefault(),this.$wheeling))return;this.$wheeling=!0,setTimeout(()=>{this.$wheeling=!1},50);let t=(e.deltaY>0?-1:1)*this.scaleStep;this.$emit(O,{action:h,scale:t,relatedEvent:e},{cancelable:!1})}$setAction(e){return M(e)&&(this.$action=e),this}$toCanvas(e){return new Promise((t,n)=>{if(!this.isConnected){n(Error(`The current element is not connected to the DOM.`));return}let r=document.createElement(`canvas`),i=this.offsetWidth,a=this.offsetHeight,o=1;F(e)&&(P(e.width)||P(e.height))&&({width:i,height:a}=V({aspectRatio:i/a,width:e.width,height:e.height}),o=i/this.offsetWidth),r.width=i,r.height=a;let s=this.querySelector(this.$getTagNameOf(l));if(!s){t(r);return}s.$ready().then(n=>{let c=r.getContext(`2d`);if(c){let[t,l,u,d,f,p]=s.$getTransform(),m=f,h=p,g=n.naturalWidth,_=n.naturalHeight;o!==1&&(m*=o,h*=o,g*=o,_*=o);let v=g/2,y=_/2;c.fillStyle=`transparent`,c.fillRect(0,0,i,a),F(e)&&I(e.beforeDraw)&&e.beforeDraw.call(this,c,r),c.save(),c.translate(v,y),c.transform(t,l,u,d,m,h),c.translate(-v,-y),c.drawImage(n,0,0,g,_),c.restore()}t(r)}).catch(n)})}};G.$name=a,G.$version=`2.1.1`;var Le=`:host{display:inline-block}img{display:block;height:100%;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}`,Re=new WeakMap,ze=[`alt`,`crossorigin`,`decoding`,`elementtiming`,`fetchpriority`,`loading`,`referrerpolicy`,`sizes`,`src`,`srcset`],K=class extends W{constructor(){super(...arguments),this.$isReady=!1,this.$matrix=[1,0,0,1,0,0],this.$onLoad=null,this.$onCanvasAction=null,this.$onCanvasActionEnd=null,this.$onCanvasActionStart=null,this.$actionStartTarget=null,this.$style=Le,this.$image=new Image,this.initialCenterSize=`contain`,this.rotatable=!1,this.scalable=!1,this.skewable=!1,this.slottable=!1,this.translatable=!1,this.alt=``,this.crossorigin=``,this.decoding=``,this.elementtiming=``,this.fetchpriority=``,this.loading=``,this.referrerpolicy=``,this.sizes=``,this.src=``,this.srcset=``}set $canvas(e){Re.set(this,e)}get $canvas(){return Re.get(this)}static get observedAttributes(){return super.observedAttributes.concat(ze,[`initial-center-size`,`rotatable`,`scalable`,`skewable`,`translatable`])}attributeChangedCallback(e,t,n){Object.is(n,t)||(super.attributeChangedCallback(e,t,n),ze.includes(e)&&this.$image.setAttribute(e,n))}$propertyChangedCallback(e,t,n){if(!Object.is(n,t))switch(super.$propertyChangedCallback(e,t,n),e){case`initialCenterSize`:this.$nextTick(()=>{this.$center(n)});break;case`src`:this.$isReady=!1;break}}connectedCallback(){super.connectedCallback();let{$image:e}=this,t=this.closest(this.$getTagNameOf(a));t&&(this.$canvas=t,this.$setStyles({display:`block`,position:`absolute`}),this.$onCanvasActionStart=e=>{this.$actionStartTarget=e.detail?.relatedEvent?.target},this.$onCanvasActionEnd=()=>{this.$actionStartTarget=null},this.$onCanvasAction=this.$handleAction.bind(this),z(t,A,this.$onCanvasActionStart),z(t,k,this.$onCanvasActionEnd),z(t,O,this.$onCanvasAction)),this.$onLoad=this.$handleLoad.bind(this),z(e,D,this.$onLoad),this.$getShadowRoot().appendChild(e)}disconnectedCallback(){let{$image:e,$canvas:t}=this;t&&(this.$onCanvasActionStart&&=(R(t,A,this.$onCanvasActionStart),null),this.$onCanvasActionEnd&&=(R(t,k,this.$onCanvasActionEnd),null),this.$onCanvasAction&&=(R(t,O,this.$onCanvasAction),null)),e&&this.$onLoad&&(R(e,D,this.$onLoad),this.$onLoad=null),this.$getShadowRoot().removeChild(e),super.disconnectedCallback()}$handleLoad(){let{$image:e}=this;this.$setStyles({width:e.naturalWidth,height:e.naturalHeight}),this.$canvas&&this.$center(this.initialCenterSize),this.$isReady=!0}$handleAction(e){if(this.hidden||!(this.rotatable||this.scalable||this.translatable))return;let{$canvas:t}=this,{detail:n}=e;if(n){let{relatedEvent:e}=n,{action:r}=n;switch(r===`transform`&&(!this.rotatable||!this.scalable)&&(r=this.rotatable?g:this.scalable?h:v),r){case m:if(this.translatable){let r=null;e&&(r=e.target.closest(this.$getTagNameOf(u))),r||=t.querySelector(this.$getTagNameOf(u)),r&&r.multiple&&!r.active&&(r=t.querySelector(`${this.$getTagNameOf(u)}[active]`)),(!r||r.hidden||!r.movable||r.dynamic||!(this.$actionStartTarget&&r.contains(this.$actionStartTarget)))&&this.$move(n.endX-n.startX,n.endY-n.startY)}break;case g:if(this.rotatable)if(e){let{x:t,y:r}=this.getBoundingClientRect();this.$rotate(n.rotate,e.clientX-t,e.clientY-r)}else this.$rotate(n.rotate);break;case h:if(this.scalable)if(e){let t=e.target.closest(this.$getTagNameOf(u));if(!t||!t.zoomable||t.zoomable&&t.dynamic){let{x:t,y:r}=this.getBoundingClientRect();this.$zoom(n.scale,e.clientX-t,e.clientY-r)}}else this.$zoom(n.scale);break;case _:if(this.rotatable&&this.scalable){let{rotate:t}=n,{scale:r}=n;r<0?r=1/(1-r):r+=1;let i=Math.cos(t),a=Math.sin(t),[o,s,c,l]=[i*r,a*r,-a*r,i*r];if(e){let t=this.getBoundingClientRect(),n=e.clientX-t.x,r=e.clientY-t.y,[i,a,u,d]=this.$matrix,f=t.width/2,p=t.height/2,m=n-f,h=r-p,g=(m*d-u*h)/(i*d-u*a),_=(h*i-a*m)/(i*d-u*a);this.$transform(o,s,c,l,g*(1-o)+_*c,_*(1-l)+g*s)}else this.$transform(o,s,c,l,0,0)}break}}}$ready(e){let{$image:t}=this,n=new Promise((e,n)=>{let r=Error(`Failed to load the image source`);if(t.complete)t.naturalWidth>0&&t.naturalHeight>0?e(t):n(r);else{let i=()=>{R(t,ae,a),setTimeout(()=>{e(t)})},a=()=>{R(t,D,i),n(r)};ye(t,D,i),ye(t,ae,a)}});return I(e)&&n.then(t=>(e(t),t)),n}$center(e){let{parentElement:t}=this;if(!t)return this;let n=t.getBoundingClientRect(),r=n.width,i=n.height,{x:a,y:o,width:s,height:c}=this.getBoundingClientRect(),l=a+s/2,u=o+c/2,d=n.x+r/2,f=n.y+i/2,{translatable:p}=this;if(!p&&!this.$isReady&&(this.translatable=!0,this.$nextTick(()=>{this.translatable=p})),this.$move(d-l,f-u),e&&(s!==r||c!==i)){let t=r/s,n=i/c,{scalable:a}=this;switch(e&&!a&&!this.$isReady&&(this.scalable=!0,this.$nextTick(()=>{this.scalable=a})),e){case`cover`:this.$scale(Math.max(t,n));break;case`contain`:this.$scale(Math.min(t,n));break}}return this}$move(e,t=e){if(this.translatable&&N(e)&&N(t)){let[n,r,i,a]=this.$matrix,o=(e*a-i*t)/(n*a-i*r),s=(t*n-r*e)/(n*a-i*r);this.$translate(o,s)}return this}$moveTo(e,t=e){if(this.translatable&&N(e)&&N(t)){let[n,r,i,a]=this.$matrix,o=(e*a-i*t)/(n*a-i*r),s=(t*n-r*e)/(n*a-i*r);this.$setTransform(n,r,i,a,o,s)}return this}$rotate(e,t,n){if(this.rotatable){let r=B(e),i=Math.cos(r),a=Math.sin(r),[o,s,c,l]=[i,a,-a,i];if(N(t)&&N(n)){let[e,r,i,a]=this.$matrix,{width:u,height:d}=this.getBoundingClientRect(),f=u/2,p=d/2,m=t-f,h=n-p,g=(m*a-i*h)/(e*a-i*r),_=(h*e-r*m)/(e*a-i*r);this.$transform(o,s,c,l,g*(1-o)-_*c,_*(1-l)-g*s)}else this.$transform(o,s,c,l,0,0)}return this}$zoom(e,t,n){if(!this.scalable||e===0)return this;if(e<0?e=1/(1-e):e+=1,N(t)&&N(n)){let[r,i,a,o]=this.$matrix,{width:s,height:c}=this.getBoundingClientRect(),l=s/2,u=c/2,d=t-l,f=n-u,p=(d*o-a*f)/(r*o-a*i),m=(f*r-i*d)/(r*o-a*i);this.$transform(e,0,0,e,p*(1-e),m*(1-e))}else this.$scale(e);return this}$scale(e,t=e){return this.scalable&&this.$transform(e,0,0,t,0,0),this}$skew(e,t=0){if(this.skewable){let n=B(e),r=B(t);this.$transform(1,Math.tan(r),Math.tan(n),1,0,0)}return this}$translate(e,t=e){return this.translatable&&N(e)&&N(t)&&this.$transform(1,0,0,1,e,t),this}$transform(e,t,n,r,i,a){return N(e)&&N(t)&&N(n)&&N(r)&&N(i)&&N(a)?this.$setTransform(Ae(this.$matrix,[e,t,n,r,i,a])):this}$setTransform(e,t,n,r,i,a){if((this.rotatable||this.scalable||this.skewable||this.translatable)&&(Array.isArray(e)&&([e,t,n,r,i,a]=e),N(e)&&N(t)&&N(n)&&N(r)&&N(i)&&N(a))){let o=[...this.$matrix],s=[e,t,n,r,i,a];if(this.$emit(`transform`,{matrix:s,oldMatrix:o})===!1)return this;this.$matrix=s,this.style.transform=`matrix(${s.join(`, `)})`}return this}$getTransform(){return this.$matrix.slice()}$resetTransform(){return this.$setTransform([1,0,0,1,0,0])}};K.$name=l,K.$version=`2.1.1`;var Be=`:host{display:block;height:0;left:0;outline:var(--theme-color) solid 1px;position:relative;top:0;width:0}:host([transparent]){outline-color:transparent}`,Ve=new WeakMap,q=class extends W{constructor(){super(...arguments),this.$onWindowResize=null,this.$onCanvasActionEnd=null,this.$onCanvasActionStart=null,this.$onSelectionChange=null,this.$style=Be,this.x=0,this.y=0,this.width=0,this.height=0,this.slottable=!1,this.themeColor=`rgba(0, 0, 0, 0.65)`}set $canvas(e){Ve.set(this,e)}get $canvas(){return Ve.get(this)}static get observedAttributes(){return super.observedAttributes.concat([`height`,`width`,`x`,`y`])}connectedCallback(){super.connectedCallback();let e=this.closest(this.$getTagNameOf(a));if(e){this.$canvas=e,this.style.position=`absolute`;let t=e.querySelector(this.$getTagNameOf(u));t&&(this.$onWindowResize=this.$render.bind(this),this.$onCanvasActionStart=e=>{t.hidden&&e.detail.action===`select`&&(this.hidden=!1)},this.$onCanvasActionEnd=e=>{t.hidden&&e.detail.action===`select`&&(this.hidden=!0)},this.$onSelectionChange=e=>{let{x:n,y:r,width:i,height:a}=e.defaultPrevented?t:e.detail;this.$change(n,r,i,a),(t.hidden||n===0&&r===0&&i===0&&a===0)&&(this.hidden=!0)},z(window,se,this.$onWindowResize),z(e,A,this.$onCanvasActionStart),z(e,k,this.$onCanvasActionEnd),z(e,j,this.$onSelectionChange))}this.$render()}disconnectedCallback(){let{$canvas:e}=this;e&&(this.$onWindowResize&&=(R(window,se,this.$onWindowResize),null),this.$onCanvasActionStart&&=(R(e,A,this.$onCanvasActionStart),null),this.$onCanvasActionEnd&&=(R(e,k,this.$onCanvasActionEnd),null),this.$onSelectionChange&&=(R(e,j,this.$onSelectionChange),null)),super.disconnectedCallback()}$change(e,t,n=this.width,r=this.height){return!N(e)||!N(t)||!N(n)||!N(r)||e===this.x&&t===this.y&&n===this.width&&r===this.height?this:(this.hidden&&=!1,this.x=e,this.y=t,this.width=n,this.height=r,this.$render())}$reset(){return this.$change(0,0,0,0)}$render(){return this.$setStyles({transform:`translate(${this.x}px, ${this.y}px)`,width:this.width,height:this.height,outlineWidth:t.innerWidth*t.devicePixelRatio})}};q.$name=d,q.$version=`2.1.1`;var He=`:host{background-color:var(--theme-color);display:block}:host([action=move]),:host([action=select]){height:100%;left:0;position:absolute;top:0;width:100%}:host([action=move]){cursor:move}:host([action=select]){cursor:crosshair}:host([action$=-resize]){background-color:transparent;height:15px;position:absolute;width:15px}:host([action$=-resize]):after{background-color:var(--theme-color);content:"";display:block;height:5px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:5px}:host([action=n-resize]),:host([action=s-resize]){cursor:ns-resize;left:50%;transform:translateX(-50%);width:100%}:host([action=n-resize]){top:-8px}:host([action=s-resize]){bottom:-8px}:host([action=e-resize]),:host([action=w-resize]){cursor:ew-resize;height:100%;top:50%;transform:translateY(-50%)}:host([action=e-resize]){right:-8px}:host([action=w-resize]){left:-8px}:host([action=ne-resize]){cursor:nesw-resize;right:-8px;top:-8px}:host([action=nw-resize]){cursor:nwse-resize;left:-8px;top:-8px}:host([action=se-resize]){bottom:-8px;cursor:nwse-resize;right:-8px}:host([action=se-resize]):after{height:15px;width:15px}@media (pointer:coarse){:host([action=se-resize]):after{height:10px;width:10px}}@media (pointer:fine){:host([action=se-resize]):after{height:5px;width:5px}}:host([action=sw-resize]){bottom:-8px;cursor:nesw-resize;left:-8px}:host([plain]){background-color:transparent}`,J=class extends W{constructor(){super(...arguments),this.$onCanvasCropEnd=null,this.$onCanvasCropStart=null,this.$style=He,this.action=v,this.plain=!1,this.slottable=!1,this.themeColor=`rgba(51, 153, 255, 0.5)`}static get observedAttributes(){return super.observedAttributes.concat([`action`,`plain`])}};J.$name=c,J.$version=`2.1.1`;var Ue=`:host{display:block;left:0;position:relative;right:0}:host([outlined]){outline:1px solid var(--theme-color)}:host([multiple]){outline:1px dashed hsla(0,0%,100%,.5)}:host([multiple]):after{bottom:0;content:"";cursor:pointer;display:block;left:0;position:absolute;right:0;top:0}:host([multiple][active]){outline-color:var(--theme-color);z-index:1}:host([multiple])>*{visibility:hidden}:host([multiple][active])>*{visibility:visible}:host([multiple][active]):after{display:none}`,We=new WeakMap,Y=class extends W{constructor(){super(...arguments),this.$onCanvasAction=null,this.$onCanvasActionStart=null,this.$onCanvasActionEnd=null,this.$onDocumentKeyDown=null,this.$action=``,this.$actionStartTarget=null,this.$changing=!1,this.$style=Ue,this.$initialSelection={x:0,y:0,width:0,height:0},this.x=0,this.y=0,this.width=0,this.height=0,this.aspectRatio=NaN,this.initialAspectRatio=NaN,this.initialCoverage=NaN,this.active=!1,this.linked=!1,this.dynamic=!1,this.movable=!1,this.resizable=!1,this.zoomable=!1,this.multiple=!1,this.keyboard=!1,this.outlined=!1,this.precise=!1}set $canvas(e){We.set(this,e)}get $canvas(){return We.get(this)}static get observedAttributes(){return super.observedAttributes.concat([`active`,`aspect-ratio`,`dynamic`,`height`,`initial-aspect-ratio`,`initial-coverage`,`keyboard`,`linked`,`movable`,`multiple`,`outlined`,`precise`,`resizable`,`width`,`x`,`y`,`zoomable`])}$propertyChangedCallback(e,t,n){if(!Object.is(n,t))switch(super.$propertyChangedCallback(e,t,n),e){case`x`:case`y`:case`width`:case`height`:this.$changing||this.$nextTick(()=>{this.$change(this.x,this.y,this.width,this.height,this.aspectRatio,!0)});break;case`aspectRatio`:case`initialAspectRatio`:this.$nextTick(()=>{this.$initSelection()});break;case`initialCoverage`:this.$nextTick(()=>{P(n)&&n<=1&&this.$initSelection(!0,!0)});break;case`keyboard`:this.$nextTick(()=>{this.$canvas&&(n?this.$onDocumentKeyDown||(this.$onDocumentKeyDown=this.$handleKeyDown.bind(this),z(this.ownerDocument,oe,this.$onDocumentKeyDown)):this.$onDocumentKeyDown&&=(R(this.ownerDocument,oe,this.$onDocumentKeyDown),null))});break;case`multiple`:this.$nextTick(()=>{if(this.$canvas){let e=this.$getSelections();n?(e.forEach(e=>{e.active=!1}),this.active=!0,this.$emit(j,{x:this.x,y:this.y,width:this.width,height:this.height})):(this.active=!1,e.slice(1).forEach(e=>{this.$removeSelection(e)}))}});break;case`precise`:this.$nextTick(()=>{this.$change(this.x,this.y)});break;case`linked`:n&&(this.dynamic=!0);break}}connectedCallback(){super.connectedCallback();let e=this.closest(this.$getTagNameOf(a));e?(this.$canvas=e,this.$setStyles({position:`absolute`,transform:`translate(${this.x}px, ${this.y}px)`}),this.hidden||this.$render(),this.$initSelection(!0),this.$onCanvasActionStart=this.$handleActionStart.bind(this),this.$onCanvasActionEnd=this.$handleActionEnd.bind(this),this.$onCanvasAction=this.$handleAction.bind(this),z(e,A,this.$onCanvasActionStart),z(e,k,this.$onCanvasActionEnd),z(e,O,this.$onCanvasAction)):this.$render()}disconnectedCallback(){let{$canvas:e}=this;e&&(this.$onCanvasActionStart&&=(R(e,A,this.$onCanvasActionStart),null),this.$onCanvasActionEnd&&=(R(e,k,this.$onCanvasActionEnd),null),this.$onCanvasAction&&=(R(e,O,this.$onCanvasAction),null)),super.disconnectedCallback()}$getSelections(){let e=[];return this.parentElement&&(e=Array.from(this.parentElement.querySelectorAll(this.$getTagNameOf(u)))),e}$initSelection(e=!1,t=!1){let{initialCoverage:n,parentElement:r}=this;if(P(n)&&r){let i=this.aspectRatio||this.initialAspectRatio,a=(t?0:this.width)||r.offsetWidth*n,o=(t?0:this.height)||r.offsetHeight*n;P(i)&&({width:a,height:o}=V({aspectRatio:i,width:a,height:o})),this.$change(this.x,this.y,a,o),e&&this.$center(),this.$initialSelection={x:this.x,y:this.y,width:this.width,height:this.height}}}$createSelection(){let e=this.cloneNode(!0);return this.hasAttribute(`id`)&&e.removeAttribute(`id`),e.initialCoverage=NaN,this.active=!1,this.parentElement&&this.parentElement.insertBefore(e,this.nextSibling),e}$removeSelection(e=this){if(this.parentElement){let t=this.$getSelections();if(t.length>1){let n=t.indexOf(e),r=t[n+1]||t[n-1];r&&(e.active=!1,this.parentElement.removeChild(e),r.active=!0,r.$emit(j,{x:r.x,y:r.y,width:r.width,height:r.height}))}else this.$clear()}}$handleActionStart(e){let t=e.detail?.relatedEvent?.target;this.$action=``,this.$actionStartTarget=t,!this.hidden&&this.multiple&&!this.active&&t===this&&this.parentElement&&(this.$getSelections().forEach(e=>{e.active=!1}),this.active=!0,this.$emit(j,{x:this.x,y:this.y,width:this.width,height:this.height}))}$handleAction(e){let{currentTarget:t,detail:n}=e;if(!t||!n)return;let{relatedEvent:r}=n,{action:i}=n,a=r?Se(r):null;if(!i&&this.multiple&&(i=this.$action||a?.action,this.$action=i),!i||this.hidden&&i!==`select`||this.multiple&&!this.active&&i!==`scale`)return;let{width:o,height:s}=this,c=n.endX-n.startX,l=n.endY-n.startY,{aspectRatio:u}=this;switch(!P(u)&&r.shiftKey&&(u=P(o)&&P(s)?o/s:1),i){case p:if(c!==0||l!==0){c===0?c=l:l===0&&(l=c);let{$canvas:e}=this,r=Ee(t);(this.multiple&&!this.hidden?this.$createSelection():this).$change(n.startX-r.left,n.startY-r.top,Math.abs(c),Math.abs(l),u),c<0?l<0?i=w:l>0&&(i=E):c>0&&(l<0?i=C:l>0&&(i=T)),e&&(e.$action=i)}break;case m:this.movable&&(this.dynamic||this.$actionStartTarget&&this.contains(this.$actionStartTarget))&&this.$move(c,l);break;case h:if(r&&this.zoomable&&(this.dynamic||this.contains(r.target))){let e=Ee(t);this.$zoom(n.scale,r.pageX-e.left,r.pageY-e.top)}break;default:this.$resize(i,c,l,u)}}$handleActionEnd(){this.$action=``,this.$actionStartTarget=null}$handleKeyDown(e){if(this.hidden||!this.keyboard||this.multiple&&!this.active||e.defaultPrevented)return;let{activeElement:t}=document;if(!(t&&([`INPUT`,`TEXTAREA`].includes(t.tagName)||[`true`,`plaintext-only`].includes(t.contentEditable))))switch(e.key){case`Backspace`:e.metaKey&&(e.preventDefault(),this.$removeSelection());break;case`Delete`:e.preventDefault(),this.$removeSelection();break;case`ArrowLeft`:e.preventDefault(),this.$move(-1,0);break;case`ArrowRight`:e.preventDefault(),this.$move(1,0);break;case`ArrowUp`:e.preventDefault(),this.$move(0,-1);break;case`ArrowDown`:e.preventDefault(),this.$move(0,1);break;case`+`:e.preventDefault(),this.$zoom(.1);break;case`-`:e.preventDefault(),this.$zoom(-.1);break}}$center(){let{parentElement:e}=this;if(!e)return this;let t=(e.offsetWidth-this.width)/2,n=(e.offsetHeight-this.height)/2;return this.$change(t,n)}$move(e,t=e){return this.$moveTo(this.x+e,this.y+t)}$moveTo(e,t=e){return this.movable?this.$change(e,t):this}$resize(e,t=0,n=0,r=this.aspectRatio){if(!this.resizable)return this;let i=P(r),{$canvas:a}=this,{x:o,y:s,width:c,height:l}=this;switch(e){case y:s+=n,l-=n,l<0&&(e=x,l=-l,s-=l),i&&(t=n*r,o+=t/2,c-=t,c<0&&(c=-c,o-=c));break;case b:c+=t,c<0&&(e=S,c=-c,o-=c),i&&(n=t/r,s-=n/2,l+=n,l<0&&(l=-l,s-=l));break;case x:l+=n,l<0&&(e=y,l=-l,s-=l),i&&(t=n*r,o-=t/2,c+=t,c<0&&(c=-c,o-=c));break;case S:o+=t,c-=t,c<0&&(e=b,c=-c,o-=c),i&&(n=t/r,s+=n/2,l-=n,l<0&&(l=-l,s-=l));break;case C:i&&(n=-t/r),s+=n,l-=n,c+=t,c<0&&l<0?(e=E,c=-c,l=-l,o-=c,s-=l):c<0?(e=w,c=-c,o-=c):l<0&&(e=T,l=-l,s-=l);break;case w:i&&(n=t/r),o+=t,s+=n,c-=t,l-=n,c<0&&l<0?(e=T,c=-c,l=-l,o-=c,s-=l):c<0?(e=C,c=-c,o-=c):l<0&&(e=E,l=-l,s-=l);break;case T:i&&(n=t/r),c+=t,l+=n,c<0&&l<0?(e=w,c=-c,l=-l,o-=c,s-=l):c<0?(e=E,c=-c,o-=c):l<0&&(e=C,l=-l,s-=l);break;case E:i&&(n=-t/r),o+=t,c-=t,l+=n,c<0&&l<0?(e=C,c=-c,l=-l,o-=c,s-=l):c<0?(e=T,c=-c,o-=c):l<0&&(e=w,l=-l,s-=l);break}return a&&a.$setAction(e),this.$change(o,s,c,l)}$zoom(e,t,n){if(!this.zoomable||e===0)return this;e<0?e=1/(1-e):e+=1;let{width:r,height:i}=this,a=r*e,o=i*e,s=this.x,c=this.y;return N(t)&&N(n)?(s-=(a-r)*((t-this.x)/r),c-=(o-i)*((n-this.y)/i)):(s-=(a-r)/2,c-=(o-i)/2),this.$change(s,c,a,o)}$change(e,t,n=this.width,r=this.height,i=this.aspectRatio,a=!1){return this.$changing||!N(e)||!N(t)||!N(n)||!N(r)||n<0||r<0||(P(i)&&({width:n,height:r}=V({aspectRatio:i,width:n,height:r},`cover`)),this.precise||(e=Math.round(e),t=Math.round(t),n=Math.round(n),r=Math.round(r)),e===this.x&&t===this.y&&n===this.width&&r===this.height&&Object.is(i,this.aspectRatio)&&!a)||(this.hidden&&=!1,this.$emit(`change`,{x:e,y:t,width:n,height:r})===!1)?this:(this.$changing=!0,this.x=e,this.y=t,this.width=n,this.height=r,this.$changing=!1,this.$render())}$reset(){let{x:e,y:t,width:n,height:r}=this.$initialSelection;return this.$change(e,t,n,r)}$clear(){return this.$change(0,0,0,0,NaN,!0),this.hidden=!0,this}$render(){return this.$setStyles({transform:`translate(${this.x}px, ${this.y}px)`,width:this.width,height:this.height})}$toCanvas(e){return new Promise((t,n)=>{if(!this.isConnected){n(Error(`The current element is not connected to the DOM.`));return}let r=document.createElement(`canvas`),{width:i,height:a}=this,o=1;if(F(e)&&(P(e.width)||P(e.height))&&({width:i,height:a}=V({aspectRatio:i/a,width:e.width,height:e.height}),o=i/this.width),r.width=i,r.height=a,!this.$canvas){t(r);return}let s=this.$canvas.querySelector(this.$getTagNameOf(l));if(!s){t(r);return}s.$ready().then(n=>{let c=r.getContext(`2d`);if(c){let[t,l,u,d,f,p]=s.$getTransform(),m=-this.x,h=-this.y,g=(m*d-u*h)/(t*d-u*l),_=(h*t-l*m)/(t*d-u*l),v=t*g+u*_+f,y=l*g+d*_+p,b=n.naturalWidth,x=n.naturalHeight;o!==1&&(v*=o,y*=o,b*=o,x*=o);let S=b/2,C=x/2;c.fillStyle=`transparent`,c.fillRect(0,0,i,a),F(e)&&I(e.beforeDraw)&&e.beforeDraw.call(this,c,r),c.save(),c.translate(S,C),c.transform(t,l,u,d,v,y),c.translate(-S,-C),c.drawImage(n,0,0,b,x),c.restore()}t(r)}).catch(n)})}};Y.$name=u,Y.$version=`2.1.1`;var Ge=`:host{display:flex;flex-direction:column;position:relative;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([bordered]){border:1px dashed var(--theme-color)}:host([covered]){bottom:0;left:0;position:absolute;right:0;top:0}:host>span{display:flex;flex:1}:host>span+span{border-top:1px dashed var(--theme-color)}:host>span>span{flex:1}:host>span>span+span{border-left:1px dashed var(--theme-color)}`,X=class extends W{constructor(){super(...arguments),this.$style=Ge,this.bordered=!1,this.columns=3,this.covered=!1,this.rows=3,this.slottable=!1,this.themeColor=`rgba(238, 238, 238, 0.5)`}static get observedAttributes(){return super.observedAttributes.concat([`bordered`,`columns`,`covered`,`rows`])}$propertyChangedCallback(e,t,n){Object.is(n,t)||(super.$propertyChangedCallback(e,t,n),(e===`rows`||e===`columns`)&&this.$nextTick(()=>{this.$render()}))}connectedCallback(){super.connectedCallback(),this.$render()}$render(){let e=this.$getShadowRoot(),t=document.createDocumentFragment();for(let e=0;e<this.rows;e+=1){let e=document.createElement(`span`);e.setAttribute(`role`,`row`);for(let t=0;t<this.columns;t+=1){let t=document.createElement(`span`);t.setAttribute(`role`,`gridcell`),e.appendChild(t)}t.appendChild(e)}e&&(e.innerHTML=``,e.appendChild(t))}};X.$name=s,X.$version=`2.1.1`;var Ke=`:host{display:inline-block;height:1em;position:relative;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:1em}:host:after,:host:before{background-color:var(--theme-color);content:"";display:block;position:absolute}:host:before{height:1px;left:0;top:50%;transform:translateY(-50%);width:100%}:host:after{height:100%;left:50%;top:0;transform:translateX(-50%);width:1px}:host([centered]){left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}`,Z=class extends W{constructor(){super(...arguments),this.$style=Ke,this.centered=!1,this.slottable=!1,this.themeColor=`rgba(238, 238, 238, 0.5)`}static get observedAttributes(){return super.observedAttributes.concat([`centered`])}};Z.$name=o,Z.$version=`2.1.1`;var qe=`:host{display:block;height:100%;overflow:hidden;position:relative;width:100%}`,Je=new WeakMap,Ye=new WeakMap,Q=new WeakMap,Xe=new WeakMap,Ze=`both`,Qe=`horizontal`,$e=`vertical`,et=`none`,$=class extends W{constructor(){super(...arguments),this.$onSelectionChange=null,this.$onSourceImageLoad=null,this.$onSourceImageTransform=null,this.$scale=1,this.$style=qe,this.resize=$e,this.selection=``,this.slottable=!1}set $image(e){Ye.set(this,e)}get $image(){return Ye.get(this)}set $sourceImage(e){Xe.set(this,e)}get $sourceImage(){return Xe.get(this)}set $canvas(e){Je.set(this,e)}get $canvas(){return Je.get(this)}set $selection(e){Q.set(this,e)}get $selection(){return Q.get(this)}static get observedAttributes(){return super.observedAttributes.concat([`resize`,`selection`])}connectedCallback(){super.connectedCallback();let e=null;if(e=this.selection?Te(this)?.querySelector(this.selection)??null:this.closest(this.$getTagNameOf(u)),L(e)){this.$selection=e,this.$onSelectionChange=this.$handleSelectionChange.bind(this),z(e,j,this.$onSelectionChange);let t=e.closest(this.$getTagNameOf(a));if(t){this.$canvas=t;let e=t.querySelector(this.$getTagNameOf(l));e&&(this.$sourceImage=e,this.$image=e.cloneNode(!0),this.$getShadowRoot().appendChild(this.$image),this.$onSourceImageLoad=this.$handleSourceImageLoad.bind(this),this.$onSourceImageTransform=this.$handleSourceImageTransform.bind(this),z(e.$image,D,this.$onSourceImageLoad),z(e,le,this.$onSourceImageTransform))}this.$render()}}disconnectedCallback(){let{$selection:e,$sourceImage:t}=this;e&&this.$onSelectionChange&&(R(e,j,this.$onSelectionChange),this.$onSelectionChange=null),t&&this.$onSourceImageLoad&&(R(t.$image,D,this.$onSourceImageLoad),this.$onSourceImageLoad=null),t&&this.$onSourceImageTransform&&(R(t,le,this.$onSourceImageTransform),this.$onSourceImageTransform=null),super.disconnectedCallback()}$handleSelectionChange(e){this.$render(e.defaultPrevented?this.$selection:e.detail)}$handleSourceImageLoad(){let{$image:e,$sourceImage:t}=this,n=e.getAttribute(`src`),r=t.getAttribute(`src`);r&&r!==n&&(e.setAttribute(`src`,r),e.$ready(()=>{this.$render()}))}$handleSourceImageTransform(e){this.$render(void 0,e.detail.matrix)}$render(e,t){let{$canvas:n,$selection:r}=this;!e&&!r.hidden&&(e=r),(!e||e.x===0&&e.y===0&&e.width===0&&e.height===0)&&(e={x:0,y:0,width:n.offsetWidth,height:n.offsetHeight});let{x:i,y:a,width:o,height:s}=e,c={},{clientWidth:l,clientHeight:u}=this,d=l,f=u,p=NaN;switch(this.resize){case Ze:p=1,d=o,f=s,c.width=o,c.height=s;break;case Qe:p=s>0?u/s:0,d=o*p,c.width=d;break;case $e:p=o>0?l/o:0,f=s*p,c.height=f;break;case et:default:l>0?p=o>0?l/o:0:u>0&&(p=s>0?u/s:0)}this.$scale=p,this.$setStyles(c),this.$sourceImage&&setTimeout(()=>{this.$transformImageByOffset(t??this.$sourceImage.$getTransform(),-i,-a)})}$transformImageByOffset(e,t,n){let{$image:r,$scale:i,$sourceImage:a}=this;if(a&&r&&i>=0){let[o,s,c,l,u,d]=e,f=(t*l-c*n)/(o*l-c*s),p=(n*o-s*t)/(o*l-c*s),m=o*f+c*p+u,h=s*f+l*p+d;a.$ready(e=>{this.$setStyles.call(r,{width:e.naturalWidth*i,height:e.naturalHeight*i})}),r.$setTransform(o,s,c,l,m*i,h*i)}}};$.$name=f,$.$version=`2.1.1`;var tt=`<cropper-canvas background><cropper-image rotatable scalable skewable translatable></cropper-image><cropper-shade hidden></cropper-shade><cropper-handle action="select" plain></cropper-handle><cropper-selection initial-coverage="0.5" movable resizable><cropper-grid role="grid" bordered covered></cropper-grid><cropper-crosshair centered></cropper-crosshair><cropper-handle action="move" theme-color="rgba(255, 255, 255, 0.35)"></cropper-handle><cropper-handle action="n-resize"></cropper-handle><cropper-handle action="e-resize"></cropper-handle><cropper-handle action="s-resize"></cropper-handle><cropper-handle action="w-resize"></cropper-handle><cropper-handle action="ne-resize"></cropper-handle><cropper-handle action="nw-resize"></cropper-handle><cropper-handle action="se-resize"></cropper-handle><cropper-handle action="sw-resize"></cropper-handle></cropper-selection></cropper-canvas>`,nt=/^img|canvas$/,rt=/<(\/?(?:script|style)[^>]*)>/gi,it={template:tt};G.$define(),Z.$define(),X.$define(),J.$define(),K.$define(),Y.$define(),q.$define(),$.$define();var at=class{constructor(e,t){if(this.options=it,M(e)&&(e=document.querySelector(e)),!L(e)||!nt.test(e.localName))throw Error(`The first argument is required and must be an <img> or <canvas> element.`);this.element=e,t=Object.assign(Object.assign({},it),t),this.options=t;let{container:n}=t;if(n&&(M(n)&&(n=Te(e)?.querySelector(n)),!L(n)))throw Error("The `container` option must be an element or a valid selector.");L(n)||(n=e.parentElement?e.parentElement:e.ownerDocument.body),this.container=n;let r=e.localName,i=``;r===`img`?{src:i}=e:r===`canvas`&&window.HTMLCanvasElement&&(i=e.toDataURL());let{template:a}=t;if(a&&M(a)){let t=document.createElement(`template`),o=document.createDocumentFragment();t.innerHTML=a.replace(rt,`&lt;$1&gt;`),o.appendChild(t.content),Array.from(o.querySelectorAll(l)).forEach(t=>{t.setAttribute(`src`,i),t.setAttribute(`alt`,e.alt||`The image to crop`),r===`img`&&[`crossorigin`,`decoding`,`elementtiming`,`fetchpriority`,`loading`,`referrerpolicy`,`sizes`,`srcset`].forEach(n=>{e.hasAttribute(n)&&t.setAttribute(n,e.getAttribute(n)||``)})}),e.parentElement?(e.style.display=`none`,n.insertBefore(o,e.nextSibling)):n.appendChild(o)}}getCropperCanvas(){return this.container.querySelector(a)}getCropperImage(){return this.container.querySelector(l)}getCropperSelection(){return this.container.querySelector(u)}getCropperSelections(){return this.container.querySelectorAll(u)}destroy(){var e;let t=this.getCropperCanvas();t&&((e=t.parentElement)==null||e.removeChild(t)),this.element&&(this.element.style.display=``)}};at.version=`2.1.1`;export{at as default};