Marc Mintel
5397309103
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 20s
Build & Deploy / 🧪 QA (push) Failing after 34s
Build & Deploy / 🏗️ Build (push) Has started running
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🧪 Smoke Test (push) Has been cancelled
Build & Deploy / ⚡ Lighthouse (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
2 lines
14 KiB
Plaintext
2 lines
14 KiB
Plaintext
(function(u,g){typeof exports=="object"&&typeof module<"u"?g(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],g):(u=typeof globalThis<"u"?globalThis:u||self,g(u.ReactCrop={},u.React))})(this,function(u,g){"use strict";const _={x:0,y:0,width:0,height:0,unit:"px"},b=(s,t,e)=>Math.min(Math.max(s,t),e),S=(...s)=>s.filter(t=>t&&typeof t=="string").join(" "),Y=(s,t)=>s===t||s.width===t.width&&s.height===t.height&&s.x===t.x&&s.y===t.y&&s.unit===t.unit;function k(s,t,e,o){const i=C(s,e,o);return s.width&&(i.height=i.width/t),s.height&&(i.width=i.height*t),i.y+i.height>o&&(i.height=o-i.y,i.width=i.height*t),i.x+i.width>e&&(i.width=e-i.x,i.height=i.width/t),s.unit==="%"?v(i,e,o):i}function H(s,t,e){const o=C(s,t,e);return o.x=(t-o.width)/2,o.y=(e-o.height)/2,s.unit==="%"?v(o,t,e):o}function v(s,t,e){return s.unit==="%"?{..._,...s,unit:"%"}:{unit:"%",x:s.x?s.x/t*100:0,y:s.y?s.y/e*100:0,width:s.width?s.width/t*100:0,height:s.height?s.height/e*100:0}}function C(s,t,e){return s.unit?s.unit==="px"?{..._,...s,unit:"px"}:{unit:"px",x:s.x?s.x*t/100:0,y:s.y?s.y*e/100:0,width:s.width?s.width*t/100:0,height:s.height?s.height*e/100:0}:{..._,...s,unit:"px"}}function R(s,t,e,o,i,n=0,a=0,w=o,h=i){const r={...s};let c=Math.min(n,o),d=Math.min(a,i),p=Math.min(w,o),l=Math.min(h,i);t&&(t>1?(c=a?a*t:c,d=c/t,p=w*t):(d=n?n/t:d,c=d*t,l=h/t)),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,c),r.x=0);const m=o-(r.x+r.width);m<0&&(r.x=Math.min(r.x,o-c),r.width+=m);const y=i-(r.y+r.height);if(y<0&&(r.y=Math.min(r.y,i-d),r.height+=y),r.width<c&&((e==="sw"||e=="nw")&&(r.x-=c-r.width),r.width=c),r.height<d&&((e==="nw"||e=="ne")&&(r.y-=d-r.height),r.height=d),r.width>p&&((e==="sw"||e=="nw")&&(r.x-=p-r.width),r.width=p),r.height>l&&((e==="nw"||e=="ne")&&(r.y-=l-r.height),r.height=l),t){const P=r.width/r.height;if(P<t){const D=Math.max(r.width/t,d);(e==="nw"||e=="ne")&&(r.y-=D-r.height),r.height=D}else if(P>t){const D=Math.max(r.height*t,c);(e==="sw"||e=="nw")&&(r.x-=D-r.width),r.width=D}}return r}function E(s,t,e,o){const i={...s};return t==="ArrowLeft"?o==="nw"?(i.x-=e,i.y-=e,i.width+=e,i.height+=e):o==="w"?(i.x-=e,i.width+=e):o==="sw"?(i.x-=e,i.width+=e,i.height+=e):o==="ne"?(i.y+=e,i.width-=e,i.height-=e):o==="e"?i.width-=e:o==="se"&&(i.width-=e,i.height-=e):t==="ArrowRight"&&(o==="nw"?(i.x+=e,i.y+=e,i.width-=e,i.height-=e):o==="w"?(i.x+=e,i.width-=e):o==="sw"?(i.x+=e,i.width-=e,i.height-=e):o==="ne"?(i.y-=e,i.width+=e,i.height+=e):o==="e"?i.width+=e:o==="se"&&(i.width+=e,i.height+=e)),t==="ArrowUp"?o==="nw"?(i.x-=e,i.y-=e,i.width+=e,i.height+=e):o==="n"?(i.y-=e,i.height+=e):o==="ne"?(i.y-=e,i.width+=e,i.height+=e):o==="sw"?(i.x+=e,i.width-=e,i.height-=e):o==="s"?i.height-=e:o==="se"&&(i.width-=e,i.height-=e):t==="ArrowDown"&&(o==="nw"?(i.x+=e,i.y+=e,i.width-=e,i.height-=e):o==="n"?(i.y+=e,i.height-=e):o==="ne"?(i.y+=e,i.width-=e,i.height-=e):o==="sw"?(i.x-=e,i.width+=e,i.height+=e):o==="s"?i.height+=e:o==="se"&&(i.width+=e,i.height+=e)),i}const N="",M={capture:!0,passive:!1},f=class x extends g.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=g.createRef(),this.mediaRef=g.createRef(),this.initChangeCalled=!1,this.state={cropIsActive:!1,newCropIsBeingDrawn:!1},this.onCropPointerDown=t=>{const{crop:e,disabled:o}=this.props,i=this.getBox();if(!e)return;const n=C(e,i.width,i.height);if(o)return;t.cancelable&&t.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const a=t.target.dataset.ord,w=!!a;let h=t.clientX,r=t.clientY,c=n.x,d=n.y;if(a){const p=t.clientX-i.x,l=t.clientY-i.y;let m=0,y=0;a==="ne"||a=="e"?(m=p-(n.x+n.width),y=l-n.y,c=n.x,d=n.y+n.height):a==="se"||a==="s"?(m=p-(n.x+n.width),y=l-(n.y+n.height),c=n.x,d=n.y):a==="sw"||a=="w"?(m=p-n.x,y=l-(n.y+n.height),c=n.x+n.width,d=n.y):(a==="nw"||a=="n")&&(m=p-n.x,y=l-n.y,c=n.x+n.width,d=n.y+n.height),h=c+i.x+m,r=d+i.y+y}this.evData={startClientX:h,startClientY:r,startCropX:c,startCropY:d,clientX:t.clientX,clientY:t.clientY,isResize:w,ord:a},this.mouseDownOnCrop=!0,this.setState({cropIsActive:!0})},this.onComponentPointerDown=t=>{const{crop:e,disabled:o,locked:i,keepSelection:n,onChange:a}=this.props,w=this.getBox();if(o||i||n&&e)return;t.cancelable&&t.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const h=t.clientX-w.x,r=t.clientY-w.y,c={unit:"px",x:h,y:r,width:0,height:0};this.evData={startClientX:t.clientX,startClientY:t.clientY,startCropX:h,startCropY:r,clientX:t.clientX,clientY:t.clientY,isResize:!0},this.mouseDownOnCrop=!0,a(C(c,w.width,w.height),v(c,w.width,w.height)),this.setState({cropIsActive:!0,newCropIsBeingDrawn:!0})},this.onDocPointerMove=t=>{const{crop:e,disabled:o,onChange:i,onDragStart:n}=this.props,a=this.getBox();if(o||!e||!this.mouseDownOnCrop)return;t.cancelable&&t.preventDefault(),this.dragStarted||(this.dragStarted=!0,n&&n(t));const{evData:w}=this;w.clientX=t.clientX,w.clientY=t.clientY;let h;w.isResize?h=this.resizeCrop():h=this.dragCrop(),Y(e,h)||i(C(h,a.width,a.height),v(h,a.width,a.height))},this.onComponentKeyDown=t=>{const{crop:e,disabled:o,onChange:i,onComplete:n}=this.props;if(o)return;const a=t.key;let w=!1;if(!e)return;const h=this.getBox(),r=this.makePixelCrop(h),d=(navigator.platform.match("Mac")?t.metaKey:t.ctrlKey)?x.nudgeStepLarge:t.shiftKey?x.nudgeStepMedium:x.nudgeStep;if(a==="ArrowLeft"?(r.x-=d,w=!0):a==="ArrowRight"?(r.x+=d,w=!0):a==="ArrowUp"?(r.y-=d,w=!0):a==="ArrowDown"&&(r.y+=d,w=!0),w){t.cancelable&&t.preventDefault(),r.x=b(r.x,0,h.width-r.width),r.y=b(r.y,0,h.height-r.height);const p=C(r,h.width,h.height),l=v(r,h.width,h.height);i(p,l),n&&n(p,l)}},this.onHandlerKeyDown=(t,e)=>{const{aspect:o=0,crop:i,disabled:n,minWidth:a=0,minHeight:w=0,maxWidth:h,maxHeight:r,onChange:c,onComplete:d}=this.props,p=this.getBox();if(n||!i)return;if(t.key==="ArrowUp"||t.key==="ArrowDown"||t.key==="ArrowLeft"||t.key==="ArrowRight")t.stopPropagation(),t.preventDefault();else return;const m=(navigator.platform.match("Mac")?t.metaKey:t.ctrlKey)?x.nudgeStepLarge:t.shiftKey?x.nudgeStepMedium:x.nudgeStep,y=C(i,p.width,p.height),P=E(y,t.key,m,e),D=R(P,o,e,p.width,p.height,a,w,h,r);if(!Y(i,D)){const K=v(D,p.width,p.height);c(D,K),d&&d(D,K)}},this.onDocPointerDone=t=>{const{crop:e,disabled:o,onComplete:i,onDragEnd:n}=this.props,a=this.getBox();this.unbindDocMove(),!(o||!e)&&this.mouseDownOnCrop&&(this.mouseDownOnCrop=!1,this.dragStarted=!1,n&&n(t),i&&i(C(e,a.width,a.height),v(e,a.width,a.height)),this.setState({cropIsActive:!1,newCropIsBeingDrawn:!1}))},this.onDragFocus=t=>{var e;(e=this.componentRef.current)==null||e.scrollTo(0,0)}}get document(){return document}getBox(){const t=this.mediaRef.current;if(!t)return{x:0,y:0,width:0,height:0};const{x:e,y:o,width:i,height:n}=t.getBoundingClientRect();return{x:e,y:o,width:i,height:n}}componentDidUpdate(t){const{crop:e,onComplete:o}=this.props;if(o&&!t.crop&&e){const{width:i,height:n}=this.getBox();i&&n&&o(C(e,i,n),v(e,i,n))}}componentWillUnmount(){this.resizeObserver&&this.resizeObserver.disconnect()}bindDocMove(){this.docMoveBound||(this.document.addEventListener("pointermove",this.onDocPointerMove,M),this.document.addEventListener("pointerup",this.onDocPointerDone,M),this.document.addEventListener("pointercancel",this.onDocPointerDone,M),this.docMoveBound=!0)}unbindDocMove(){this.docMoveBound&&(this.document.removeEventListener("pointermove",this.onDocPointerMove,M),this.document.removeEventListener("pointerup",this.onDocPointerDone,M),this.document.removeEventListener("pointercancel",this.onDocPointerDone,M),this.docMoveBound=!1)}getCropStyle(){const{crop:t}=this.props;if(t)return{top:`${t.y}${t.unit}`,left:`${t.x}${t.unit}`,width:`${t.width}${t.unit}`,height:`${t.height}${t.unit}`}}dragCrop(){const{evData:t}=this,e=this.getBox(),o=this.makePixelCrop(e),i=t.clientX-t.startClientX,n=t.clientY-t.startClientY;return o.x=b(t.startCropX+i,0,e.width-o.width),o.y=b(t.startCropY+n,0,e.height-o.height),o}getPointRegion(t,e,o,i){const{evData:n}=this,a=n.clientX-t.x,w=n.clientY-t.y;let h;i&&e?h=e==="nw"||e==="n"||e==="ne":h=w<n.startCropY;let r;return o&&e?r=e==="nw"||e==="w"||e==="sw":r=a<n.startCropX,r?h?"nw":"sw":h?"ne":"se"}resolveMinDimensions(t,e,o=0,i=0){let n=Math.min(o,t.width),a=Math.min(i,t.height);return!e||!n&&!a?[n,a]:e>1?n?[n,n/e]:[a*e,a]:a?[a*e,a]:[n,n/e]}resizeCrop(){const{evData:t}=this,{aspect:e=0,maxWidth:o,maxHeight:i}=this.props,n=this.getBox(),[a,w]=this.resolveMinDimensions(n,e,this.props.minWidth,this.props.minHeight);let h=this.makePixelCrop(n),r=this.getPointRegion(n,t.ord,a,w);const c=t.ord||r;let d=t.clientX-t.startClientX,p=t.clientY-t.startClientY;(a&&c==="nw"||c==="w"||c==="sw")&&(d=Math.min(d,-a)),(w&&c==="nw"||c==="n"||c==="ne")&&(p=Math.min(p,-w));const l={unit:"px",x:0,y:0,width:0,height:0};r==="ne"?(l.x=t.startCropX,l.width=d,e?(l.height=l.width/e,l.y=t.startCropY-l.height):(l.height=Math.abs(p),l.y=t.startCropY-l.height)):r==="se"?(l.x=t.startCropX,l.y=t.startCropY,l.width=d,e?l.height=l.width/e:l.height=p):r==="sw"?(l.x=t.startCropX+d,l.y=t.startCropY,l.width=Math.abs(d),e?l.height=l.width/e:l.height=p):r==="nw"&&(l.x=t.startCropX+d,l.width=Math.abs(d),e?(l.height=l.width/e,l.y=t.startCropY-l.height):(l.height=Math.abs(p),l.y=t.startCropY+p));const m=R(l,e,r,n.width,n.height,a,w,o,i);return e||x.xyOrds.indexOf(c)>-1?h=m:x.xOrds.indexOf(c)>-1?(h.x=m.x,h.width=m.width):x.yOrds.indexOf(c)>-1&&(h.y=m.y,h.height=m.height),h.x=b(h.x,0,n.width-h.width),h.y=b(h.y,0,n.height-h.height),h}createCropSelection(){const{ariaLabels:t=x.defaultProps.ariaLabels,disabled:e,locked:o,renderSelectionAddon:i,ruleOfThirds:n,crop:a}=this.props,w=this.getCropStyle();if(a)return g.createElement("div",{style:w,className:"ReactCrop__crop-selection",onPointerDown:this.onCropPointerDown,"aria-label":t.cropArea,tabIndex:0,onKeyDown:this.onComponentKeyDown,role:"group"},!e&&!o&&g.createElement("div",{className:"ReactCrop__drag-elements",onFocus:this.onDragFocus},g.createElement("div",{className:"ReactCrop__drag-bar ord-n","data-ord":"n"}),g.createElement("div",{className:"ReactCrop__drag-bar ord-e","data-ord":"e"}),g.createElement("div",{className:"ReactCrop__drag-bar ord-s","data-ord":"s"}),g.createElement("div",{className:"ReactCrop__drag-bar ord-w","data-ord":"w"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-nw","data-ord":"nw",tabIndex:0,"aria-label":t.nwDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"nw"),role:"button"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-n","data-ord":"n",tabIndex:0,"aria-label":t.nDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"n"),role:"button"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-ne","data-ord":"ne",tabIndex:0,"aria-label":t.neDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"ne"),role:"button"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-e","data-ord":"e",tabIndex:0,"aria-label":t.eDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"e"),role:"button"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-se","data-ord":"se",tabIndex:0,"aria-label":t.seDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"se"),role:"button"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-s","data-ord":"s",tabIndex:0,"aria-label":t.sDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"s"),role:"button"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-sw","data-ord":"sw",tabIndex:0,"aria-label":t.swDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"sw"),role:"button"}),g.createElement("div",{className:"ReactCrop__drag-handle ord-w","data-ord":"w",tabIndex:0,"aria-label":t.wDragHandle,onKeyDown:h=>this.onHandlerKeyDown(h,"w"),role:"button"})),i&&g.createElement("div",{className:"ReactCrop__selection-addon",onMouseDown:h=>h.stopPropagation()},i(this.state)),n&&g.createElement(g.Fragment,null,g.createElement("div",{className:"ReactCrop__rule-of-thirds-hz"}),g.createElement("div",{className:"ReactCrop__rule-of-thirds-vt"})))}makePixelCrop(t){const e={..._,...this.props.crop||{}};return C(e,t.width,t.height)}render(){const{aspect:t,children:e,circularCrop:o,className:i,crop:n,disabled:a,locked:w,style:h,ruleOfThirds:r}=this.props,{cropIsActive:c,newCropIsBeingDrawn:d}=this.state,p=n?this.createCropSelection():null,l=S("ReactCrop",i,c&&"ReactCrop--active",a&&"ReactCrop--disabled",w&&"ReactCrop--locked",d&&"ReactCrop--new-crop",n&&t&&"ReactCrop--fixed-aspect",n&&o&&"ReactCrop--circular-crop",n&&r&&"ReactCrop--rule-of-thirds",!this.dragStarted&&n&&!n.width&&!n.height&&"ReactCrop--invisible-crop",o&&"ReactCrop--no-animate");return g.createElement("div",{ref:this.componentRef,className:l,style:h},g.createElement("div",{ref:this.mediaRef,className:"ReactCrop__child-wrapper",onPointerDown:this.onComponentPointerDown},e),p)}};f.xOrds=["e","w"],f.yOrds=["n","s"],f.xyOrds=["nw","ne","se","sw"],f.nudgeStep=1,f.nudgeStepMedium=10,f.nudgeStepLarge=100,f.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 X=f;u.Component=X,u.ReactCrop=X,u.areCropsEqual=Y,u.centerCrop=H,u.clamp=b,u.cls=S,u.containCrop=R,u.convertToPercentCrop=v,u.convertToPixelCrop=C,u.default=X,u.defaultCrop=_,u.makeAspectCrop=k,u.nudgeCrop=E,Object.defineProperties(u,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|