(function(u,c){typeof exports=="object"&&typeof module<"u"?c(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],c):(u=typeof globalThis<"u"?globalThis:u||self,c(u.ReactCrop={},u.React))})(this,function(u,c){"use strict";const M={x:0,y:0,width:0,height:0,unit:"px"},f=(a,e,t)=>Math.min(Math.max(a,e),t),S=(...a)=>a.filter(e=>e&&typeof e=="string").join(" "),Y=(a,e)=>a===e||a.width===e.width&&a.height===e.height&&a.x===e.x&&a.y===e.y&&a.unit===e.unit;function $(a,e,t,h){const i=x(a,t,h);return a.width&&(i.height=i.width/e),a.height&&(i.width=i.height*e),i.y+i.height>h&&(i.height=h-i.y,i.width=i.height*e),i.x+i.width>t&&(i.width=t-i.x,i.height=i.width/e),a.unit==="%"?v(i,t,h):i}function K(a,e,t){const h=x(a,e,t);return h.x=(e-h.width)/2,h.y=(t-h.height)/2,a.unit==="%"?v(h,e,t):h}function v(a,e,t){return a.unit==="%"?{...M,...a,unit:"%"}:{unit:"%",x:a.x?a.x/e*100:0,y:a.y?a.y/t*100:0,width:a.width?a.width/e*100:0,height:a.height?a.height/t*100:0}}function x(a,e,t){return a.unit?a.unit==="px"?{...M,...a,unit:"px"}:{unit:"px",x:a.x?a.x*e/100:0,y:a.y?a.y*t/100:0,width:a.width?a.width*e/100:0,height:a.height?a.height*t/100:0}:{...M,...a,unit:"px"}}function X(a,e,t,h,i,n=0,s=0,g=h,o=i){const r={...a};let w=Math.min(n,h),d=Math.min(s,i),p=Math.min(g,h),l=Math.min(o,i);e&&(e>1?(w=s?s*e:w,d=w/e,p=g*e):(d=n?n/e:d,w=d*e,l=o/e)),r.y<0&&(r.height=Math.max(r.height+r.y,d),r.y=0),r.x<0&&(r.width=Math.max(r.width+r.x,w),r.x=0);const C=h-(r.x+r.width);C<0&&(r.x=Math.min(r.x,h-w),r.width+=C);const y=i-(r.y+r.height);if(y<0&&(r.y=Math.min(r.y,i-d),r.height+=y),r.width<w&&((t==="sw"||t=="nw")&&(r.x-=w-r.width),r.width=w),r.height<d&&((t==="nw"||t=="ne")&&(r.y-=d-r.height),r.height=d),r.width>p&&((t==="sw"||t=="nw")&&(r.x-=p-r.width),r.width=p),r.height>l&&((t==="nw"||t=="ne")&&(r.y-=l-r.height),r.height=l),e){const P=r.width/r.height;if(P<e){const D=Math.max(r.width/e,d);(t==="nw"||t=="ne")&&(r.y-=D-r.height),r.height=D}else if(P>e){const D=Math.max(r.height*e,w);(t==="sw"||t=="nw")&&(r.x-=D-r.width),r.width=D}}return r}function k(a,e,t,h){const i={...a};return e==="ArrowLeft"?h==="nw"?(i.x-=t,i.y-=t,i.width+=t,i.height+=t):h==="w"?(i.x-=t,i.width+=t):h==="sw"?(i.x-=t,i.width+=t,i.height+=t):h==="ne"?(i.y+=t,i.width-=t,i.height-=t):h==="e"?i.width-=t:h==="se"&&(i.width-=t,i.height-=t):e==="ArrowRight"&&(h==="nw"?(i.x+=t,i.y+=t,i.width-=t,i.height-=t):h==="w"?(i.x+=t,i.width-=t):h==="sw"?(i.x+=t,i.width-=t,i.height-=t):h==="ne"?(i.y-=t,i.width+=t,i.height+=t):h==="e"?i.width+=t:h==="se"&&(i.width+=t,i.height+=t)),e==="ArrowUp"?h==="nw"?(i.x-=t,i.y-=t,i.width+=t,i.height+=t):h==="n"?(i.y-=t,i.height+=t):h==="ne"?(i.y-=t,i.width+=t,i.height+=t):h==="sw"?(i.x+=t,i.width-=t,i.height-=t):h==="s"?i.height-=t:h==="se"&&(i.width-=t,i.height-=t):e==="ArrowDown"&&(h==="nw"?(i.x+=t,i.y+=t,i.width-=t,i.height-=t):h==="n"?(i.y+=t,i.height-=t):h==="ne"?(i.y+=t,i.width-=t,i.height-=t):h==="sw"?(i.x-=t,i.width+=t,i.height+=t):h==="s"?i.height+=t:h==="se"&&(i.width+=t,i.height+=t)),i}const b={capture:!0,passive:!1};let H=0;const m=class m extends c.PureComponent{constructor(){super(...arguments),this.docMoveBound=!1,this.mouseDownOnCrop=!1,this.dragStarted=!1,this.evData={startClientX:0,startClientY:0,startCropX:0,startCropY:0,clientX:0,clientY:0,isResize:!0},this.componentRef=c.createRef(),this.mediaRef=c.createRef(),this.initChangeCalled=!1,this.instanceId=`rc-${H++}`,this.state={cropIsActive:!1,newCropIsBeingDrawn:!1},this.onCropPointerDown=e=>{const{crop:t,disabled:h}=this.props,i=this.getBox();if(!t)return;const n=x(t,i.width,i.height);if(h)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const s=e.target.dataset.ord,g=!!s;let o=e.clientX,r=e.clientY,w=n.x,d=n.y;if(s){const p=e.clientX-i.x,l=e.clientY-i.y;let C=0,y=0;s==="ne"||s=="e"?(C=p-(n.x+n.width),y=l-n.y,w=n.x,d=n.y+n.height):s==="se"||s==="s"?(C=p-(n.x+n.width),y=l-(n.y+n.height),w=n.x,d=n.y):s==="sw"||s=="w"?(C=p-n.x,y=l-(n.y+n.height),w=n.x+n.width,d=n.y):(s==="nw"||s=="n")&&(C=p-n.x,y=l-n.y,w=n.x+n.width,d=n.y+n.height),o=w+i.x+C,r=d+i.y+y}this.evData={startClientX:o,startClientY:r,startCropX:w,startCropY:d,clientX:e.clientX,clientY:e.clientY,isResize:g,ord:s},this.mouseDownOnCrop=!0,this.setState({cropIsActive:!0})},this.onComponentPointerDown=e=>{const{crop:t,disabled:h,locked:i,keepSelection:n,onChange:s}=this.props,g=this.getBox();if(h||i||n&&t)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const o=e.clientX-g.x,r=e.clientY-g.y,w={unit:"px",x:o,y:r,width:0,height:0};this.evData={startClientX:e.clientX,startClientY:e.clientY,startCropX:o,startCropY:r,clientX:e.clientX,clientY:e.clientY,isResize:!0},this.mouseDownOnCrop=!0,s(x(w,g.width,g.height),v(w,g.width,g.height)),this.setState({cropIsActive:!0,newCropIsBeingDrawn:!0})},this.onDocPointerMove=e=>{const{crop:t,disabled:h,onChange:i,onDragStart:n}=this.props,s=this.getBox();if(h||!t||!this.mouseDownOnCrop)return;e.cancelable&&e.preventDefault(),this.dragStarted||(this.dragStarted=!0,n&&n(e));const{evData:g}=this;g.clientX=e.clientX,g.clientY=e.clientY;let o;g.isResize?o=this.resizeCrop():o=this.dragCrop(),Y(t,o)||i(x(o,s.width,s.height),v(o,s.width,s.height))},this.onComponentKeyDown=e=>{const{crop:t,disabled:h,onChange:i,onComplete:n}=this.props;if(h)return;const s=e.key;let g=!1;if(!t)return;const o=this.getBox(),r=this.makePixelCrop(o),d=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?m.nudgeStepLarge:e.shiftKey?m.nudgeStepMedium:m.nudgeStep;if(s==="ArrowLeft"?(r.x-=d,g=!0):s==="ArrowRight"?(r.x+=d,g=!0):s==="ArrowUp"?(r.y-=d,g=!0):s==="ArrowDown"&&(r.y+=d,g=!0),g){e.cancelable&&e.preventDefault(),r.x=f(r.x,0,o.width-r.width),r.y=f(r.y,0,o.height-r.height);const p=x(r,o.width,o.height),l=v(r,o.width,o.height);i(p,l),n&&n(p,l)}},this.onHandlerKeyDown=(e,t)=>{const{aspect:h=0,crop:i,disabled:n,minWidth:s=0,minHeight:g=0,maxWidth:o,maxHeight:r,onChange:w,onComplete:d}=this.props,p=this.getBox();if(n||!i)return;if(e.key==="ArrowUp"||e.key==="ArrowDown"||e.key==="ArrowLeft"||e.key==="ArrowRight")e.stopPropagation(),e.preventDefault();else return;const C=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?m.nudgeStepLarge:e.shiftKey?m.nudgeStepMedium:m.nudgeStep,y=x(i,p.width,p.height),P=k(y,e.key,C,t),D=X(P,h,t,p.width,p.height,s,g,o,r);if(!Y(i,D)){const _=v(D,p.width,p.height);w(D,_),d&&d(D,_)}},this.onDocPointerDone=e=>{const{crop:t,disabled:h,onComplete:i,onDragEnd:n}=this.props,s=this.getBox();this.unbindDocMove(),!(h||!t)&&this.mouseDownOnCrop&&(this.mouseDownOnCrop=!1,this.dragStarted=!1,n&&n(e),i&&i(x(t,s.width,s.height),v(t,s.width,s.height)),this.setState({cropIsActive:!1,newCropIsBeingDrawn:!1}))},this.onDragFocus=()=>{var e;(e=this.componentRef.current)==null||e.scrollTo(0,0)}}get document(){return document}getBox(){const e=this.mediaRef.current;if(!e)return{x:0,y:0,width:0,height:0};const{x:t,y:h,width:i,height:n}=e.getBoundingClientRect();return{x:t,y:h,width:i,height:n}}componentDidUpdate(e){const{crop:t,onComplete:h}=this.props;if(h&&!e.crop&&t){const{width:i,height:n}=this.getBox();i&&n&&h(x(t,i,n),v(t,i,n))}}componentWillUnmount(){this.resizeObserver&&this.resizeObserver.disconnect(),this.unbindDocMove()}bindDocMove(){this.docMoveBound||(this.document.addEventListener("pointermove",this.onDocPointerMove,b),this.document.addEventListener("pointerup",this.onDocPointerDone,b),this.document.addEventListener("pointercancel",this.onDocPointerDone,b),this.docMoveBound=!0)}unbindDocMove(){this.docMoveBound&&(this.document.removeEventListener("pointermove",this.onDocPointerMove,b),this.document.removeEventListener("pointerup",this.onDocPointerDone,b),this.document.removeEventListener("pointercancel",this.onDocPointerDone,b),this.docMoveBound=!1)}getCropStyle(){const{crop:e}=this.props;if(e)return{top:`${e.y}${e.unit}`,left:`${e.x}${e.unit}`,width:`${e.width}${e.unit}`,height:`${e.height}${e.unit}`}}dragCrop(){const{evData:e}=this,t=this.getBox(),h=this.makePixelCrop(t),i=e.clientX-e.startClientX,n=e.clientY-e.startClientY;return h.x=f(e.startCropX+i,0,t.width-h.width),h.y=f(e.startCropY+n,0,t.height-h.height),h}getPointRegion(e,t,h,i){const{evData:n}=this,s=n.clientX-e.x,g=n.clientY-e.y;let o;i&&t?o=t==="nw"||t==="n"||t==="ne":o=g<n.startCropY;let r;return h&&t?r=t==="nw"||t==="w"||t==="sw":r=s<n.startCropX,r?o?"nw":"sw":o?"ne":"se"}resolveMinDimensions(e,t,h=0,i=0){const n=Math.min(h,e.width),s=Math.min(i,e.height);return!t||!n&&!s?[n,s]:t>1?n?[n,n/t]:[s*t,s]:s?[s*t,s]:[n,n/t]}resizeCrop(){const{evData:e}=this,{aspect:t=0,maxWidth:h,maxHeight:i}=this.props,n=this.getBox(),[s,g]=this.resolveMinDimensions(n,t,this.props.minWidth,this.props.minHeight);let o=this.makePixelCrop(n);const r=this.getPointRegion(n,e.ord,s,g),w=e.ord||r;let d=e.clientX-e.startClientX,p=e.clientY-e.startClientY;(s&&w==="nw"||w==="w"||w==="sw")&&(d=Math.min(d,-s)),(g&&w==="nw"||w==="n"||w==="ne")&&(p=Math.min(p,-g));const l={unit:"px",x:0,y:0,width:0,height:0};r==="ne"?(l.x=e.startCropX,l.width=d,t?(l.height=l.width/t,l.y=e.startCropY-l.height):(l.height=Math.abs(p),l.y=e.startCropY-l.height)):r==="se"?(l.x=e.startCropX,l.y=e.startCropY,l.width=d,t?l.height=l.width/t:l.height=p):r==="sw"?(l.x=e.startCropX+d,l.y=e.startCropY,l.width=Math.abs(d),t?l.height=l.width/t:l.height=p):r==="nw"&&(l.x=e.startCropX+d,l.width=Math.abs(d),t?(l.height=l.width/t,l.y=e.startCropY-l.height):(l.height=Math.abs(p),l.y=e.startCropY+p));const C=X(l,t,r,n.width,n.height,s,g,h,i);return t||m.xyOrds.indexOf(w)>-1?o=C:m.xOrds.indexOf(w)>-1?(o.x=C.x,o.width=C.width):m.yOrds.indexOf(w)>-1&&(o.y=C.y,o.height=C.height),o.x=f(o.x,0,n.width-o.width),o.y=f(o.y,0,n.height-o.height),o}renderCropSelection(){const{ariaLabels:e=m.defaultProps.ariaLabels,disabled:t,locked:h,renderSelectionAddon:i,ruleOfThirds:n,crop:s}=this.props,g=this.getCropStyle();if(s)return c.createElement("div",{style:g,className:"ReactCrop__crop-selection",onPointerDown:this.onCropPointerDown,"aria-label":e.cropArea,tabIndex:0,onKeyDown:this.onComponentKeyDown,role:"group"},!t&&!h&&c.createElement("div",{className:"ReactCrop__drag-elements",onFocus:this.onDragFocus},c.createElement("div",{className:"ReactCrop__drag-bar ord-n","data-ord":"n"}),c.createElement("div",{className:"ReactCrop__drag-bar ord-e","data-ord":"e"}),c.createElement("div",{className:"ReactCrop__drag-bar ord-s","data-ord":"s"}),c.createElement("div",{className:"ReactCrop__drag-bar ord-w","data-ord":"w"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-nw","data-ord":"nw",tabIndex:0,"aria-label":e.nwDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"nw"),role:"button"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-n","data-ord":"n",tabIndex:0,"aria-label":e.nDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"n"),role:"button"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-ne","data-ord":"ne",tabIndex:0,"aria-label":e.neDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"ne"),role:"button"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-e","data-ord":"e",tabIndex:0,"aria-label":e.eDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"e"),role:"button"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-se","data-ord":"se",tabIndex:0,"aria-label":e.seDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"se"),role:"button"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-s","data-ord":"s",tabIndex:0,"aria-label":e.sDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"s"),role:"button"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-sw","data-ord":"sw",tabIndex:0,"aria-label":e.swDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"sw"),role:"button"}),c.createElement("div",{className:"ReactCrop__drag-handle ord-w","data-ord":"w",tabIndex:0,"aria-label":e.wDragHandle,onKeyDown:o=>this.onHandlerKeyDown(o,"w"),role:"button"})),i&&c.createElement("div",{className:"ReactCrop__selection-addon",onPointerDown:o=>o.stopPropagation()},i(this.state)),n&&c.createElement(c.Fragment,null,c.createElement("div",{className:"ReactCrop__rule-of-thirds-hz"}),c.createElement("div",{className:"ReactCrop__rule-of-thirds-vt"})))}makePixelCrop(e){const t={...M,...this.props.crop||{}};return x(t,e.width,e.height)}render(){const{aspect:e,children:t,circularCrop:h,className:i,crop:n,disabled:s,locked:g,style:o,ruleOfThirds:r}=this.props,{cropIsActive:w,newCropIsBeingDrawn:d}=this.state,p=n?this.renderCropSelection():null,l=S("ReactCrop",i,w&&"ReactCrop--active",s&&"ReactCrop--disabled",g&&"ReactCrop--locked",d&&"ReactCrop--new-crop",n&&e&&"ReactCrop--fixed-aspect",n&&h&&"ReactCrop--circular-crop",n&&r&&"ReactCrop--rule-of-thirds",!this.dragStarted&&n&&!n.width&&!n.height&&"ReactCrop--invisible-crop",h&&"ReactCrop--no-animate");return c.createElement("div",{ref:this.componentRef,className:l,style:o},c.createElement("div",{ref:this.mediaRef,className:"ReactCrop__child-wrapper",onPointerDown:this.onComponentPointerDown},t),n?c.createElement("svg",{className:"ReactCrop__crop-mask",width:"100%",height:"100%"},c.createElement("defs",null,c.createElement("mask",{id:`hole-${this.instanceId}`},c.createElement("rect",{width:"100%",height:"100%",fill:"white"}),h?c.createElement("ellipse",{cx:`${n.x+n.width/2}${n.unit}`,cy:`${n.y+n.height/2}${n.unit}`,rx:`${n.width/2}${n.unit}`,ry:`${n.height/2}${n.unit}`,fill:"black"}):c.createElement("rect",{x:`${n.x}${n.unit}`,y:`${n.y}${n.unit}`,width:`${n.width}${n.unit}`,height:`${n.height}${n.unit}`,fill:"black"}))),c.createElement("rect",{fill:"black",fillOpacity:.5,width:"100%",height:"100%",mask:`url(#hole-${this.instanceId})`})):void 0,p)}};m.xOrds=["e","w"],m.yOrds=["n","s"],m.xyOrds=["nw","ne","se","sw"],m.nudgeStep=1,m.nudgeStepMedium=10,m.nudgeStepLarge=100,m.defaultProps={ariaLabels:{cropArea:"Use the arrow keys to move the crop selection area",nwDragHandle:"Use the arrow keys to move the north west drag handle to change the crop selection area",nDragHandle:"Use the up and down arrow keys to move the north drag handle to change the crop selection area",neDragHandle:"Use the arrow keys to move the north east drag handle to change the crop selection area",eDragHandle:"Use the up and down arrow keys to move the east drag handle to change the crop selection area",seDragHandle:"Use the arrow keys to move the south east drag handle to change the crop selection area",sDragHandle:"Use the up and down arrow keys to move the south drag handle to change the crop selection area",swDragHandle:"Use the arrow keys to move the south west drag handle to change the crop selection area",wDragHandle:"Use the up and down arrow keys to move the west drag handle to change the crop selection area"}};let E=m;u.Component=E,u.ReactCrop=E,u.areCropsEqual=Y,u.centerCrop=K,u.clamp=f,u.cls=S,u.containCrop=X,u.convertToPercentCrop=v,u.convertToPixelCrop=x,u.default=E,u.defaultCrop=M,u.makeAspectCrop=$,u.nudgeCrop=k,Object.defineProperties(u,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});