@apollosproject/canvas-embeds 2.1.32 → 2.1.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/widget/index.js +1 -1
package/package.json
CHANGED
package/widget/index.js
CHANGED
|
@@ -1387,7 +1387,7 @@ See https://s-c.sh/2BAXzed for more info.`),window["__styled-components-init__"]
|
|
|
1387
1387
|
justify-content: center;
|
|
1388
1388
|
align-items: center;
|
|
1389
1389
|
gap: ${we("space.s")};
|
|
1390
|
-
`),bA={Profile:DK1,CloseIcon:xK1,UploadIcon:zK1,AppLinks:UK1,ProfileCard:RK1},HA={x:0,y:0,width:0,height:0,unit:"px"},e9=(a,e,r)=>Math.min(Math.max(a,e),r),BK1=(...a)=>a.filter(e=>e&&typeof e=="string").join(" "),iQ=(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 qK1(a,e,r,n){const l=$n(a,r,n);return a.width&&(l.height=l.width/e),a.height&&(l.width=l.height*e),l.y+l.height>n&&(l.height=n-l.y,l.width=l.height*e),l.x+l.width>r&&(l.width=r-l.x,l.height=l.width/e),a.unit==="%"?so(l,r,n):l}function WK1(a,e,r){const n=$n(a,e,r);return n.x=(e-n.width)/2,n.y=(r-n.height)/2,a.unit==="%"?so(n,e,r):n}function so(a,e,r){return a.unit==="%"?{...HA,...a,unit:"%"}:{unit:"%",x:a.x?a.x/e*100:0,y:a.y?a.y/r*100:0,width:a.width?a.width/e*100:0,height:a.height?a.height/r*100:0}}function $n(a,e,r){return a.unit?a.unit==="px"?{...HA,...a,unit:"px"}:{unit:"px",x:a.x?a.x*e/100:0,y:a.y?a.y*r/100:0,width:a.width?a.width*e/100:0,height:a.height?a.height*r/100:0}:{...HA,...a,unit:"px"}}function cQ(a,e,r,n,l,o=0,c=0,m=n,d=l){const h={...a};let g=Math.min(o,n),b=Math.min(c,l),y=Math.min(m,n),E=Math.min(d,l);e&&(e>1?(g=c?c*e:g,b=g/e,y=m*e):(b=o?o/e:b,g=b*e,E=d/e)),h.y<0&&(h.height=Math.max(h.height+h.y,b),h.y=0),h.x<0&&(h.width=Math.max(h.width+h.x,g),h.x=0);const M=n-(h.x+h.width);M<0&&(h.x=Math.min(h.x,n-g),h.width+=M);const O=l-(h.y+h.height);if(O<0&&(h.y=Math.min(h.y,l-b),h.height+=O),h.width<g&&((r==="sw"||r=="nw")&&(h.x-=g-h.width),h.width=g),h.height<b&&((r==="nw"||r=="ne")&&(h.y-=b-h.height),h.height=b),h.width>y&&((r==="sw"||r=="nw")&&(h.x-=y-h.width),h.width=y),h.height>E&&((r==="nw"||r=="ne")&&(h.y-=E-h.height),h.height=E),e){const w=h.width/h.height;if(w<e){const S=Math.max(h.width/e,b);(r==="nw"||r=="ne")&&(h.y-=S-h.height),h.height=S}else if(w>e){const S=Math.max(h.height*e,g);(r==="sw"||r=="nw")&&(h.x-=S-h.width),h.width=S}}return h}function GK1(a,e,r,n){const l={...a};return e==="ArrowLeft"?n==="nw"?(l.x-=r,l.y-=r,l.width+=r,l.height+=r):n==="w"?(l.x-=r,l.width+=r):n==="sw"?(l.x-=r,l.width+=r,l.height+=r):n==="ne"?(l.y+=r,l.width-=r,l.height-=r):n==="e"?l.width-=r:n==="se"&&(l.width-=r,l.height-=r):e==="ArrowRight"&&(n==="nw"?(l.x+=r,l.y+=r,l.width-=r,l.height-=r):n==="w"?(l.x+=r,l.width-=r):n==="sw"?(l.x+=r,l.width-=r,l.height-=r):n==="ne"?(l.y-=r,l.width+=r,l.height+=r):n==="e"?l.width+=r:n==="se"&&(l.width+=r,l.height+=r)),e==="ArrowUp"?n==="nw"?(l.x-=r,l.y-=r,l.width+=r,l.height+=r):n==="n"?(l.y-=r,l.height+=r):n==="ne"?(l.y-=r,l.width+=r,l.height+=r):n==="sw"?(l.x+=r,l.width-=r,l.height-=r):n==="s"?l.height-=r:n==="se"&&(l.width-=r,l.height-=r):e==="ArrowDown"&&(n==="nw"?(l.x+=r,l.y+=r,l.width-=r,l.height-=r):n==="n"?(l.y+=r,l.height-=r):n==="ne"?(l.y+=r,l.width-=r,l.height-=r):n==="sw"?(l.x-=r,l.width+=r,l.height+=r):n==="s"?l.height+=r:n==="se"&&(l.width+=r,l.height+=r)),l}const t9={capture:!0,passive:!1},mo=class ln extends p.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=p.createRef(),this.mediaRef=p.createRef(),this.initChangeCalled=!1,this.state={cropIsActive:!1,newCropIsBeingDrawn:!1},this.onCropPointerDown=e=>{const{crop:r,disabled:n}=this.props,l=this.getBox();if(!r)return;const o=$n(r,l.width,l.height);if(n)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const c=e.target.dataset.ord,m=!!c;let d=e.clientX,h=e.clientY,g=o.x,b=o.y;if(c){const y=e.clientX-l.x,E=e.clientY-l.y;let M=0,O=0;c==="ne"||c=="e"?(M=y-(o.x+o.width),O=E-o.y,g=o.x,b=o.y+o.height):c==="se"||c==="s"?(M=y-(o.x+o.width),O=E-(o.y+o.height),g=o.x,b=o.y):c==="sw"||c=="w"?(M=y-o.x,O=E-(o.y+o.height),g=o.x+o.width,b=o.y):(c==="nw"||c=="n")&&(M=y-o.x,O=E-o.y,g=o.x+o.width,b=o.y+o.height),d=g+l.x+M,h=b+l.y+O}this.evData={startClientX:d,startClientY:h,startCropX:g,startCropY:b,clientX:e.clientX,clientY:e.clientY,isResize:m,ord:c},this.mouseDownOnCrop=!0,this.setState({cropIsActive:!0})},this.onComponentPointerDown=e=>{const{crop:r,disabled:n,locked:l,keepSelection:o,onChange:c}=this.props,m=this.getBox();if(n||l||o&&r)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const d=e.clientX-m.x,h=e.clientY-m.y,g={unit:"px",x:d,y:h,width:0,height:0};this.evData={startClientX:e.clientX,startClientY:e.clientY,startCropX:d,startCropY:h,clientX:e.clientX,clientY:e.clientY,isResize:!0},this.mouseDownOnCrop=!0,c($n(g,m.width,m.height),so(g,m.width,m.height)),this.setState({cropIsActive:!0,newCropIsBeingDrawn:!0})},this.onDocPointerMove=e=>{const{crop:r,disabled:n,onChange:l,onDragStart:o}=this.props,c=this.getBox();if(n||!r||!this.mouseDownOnCrop)return;e.cancelable&&e.preventDefault(),this.dragStarted||(this.dragStarted=!0,o&&o(e));const{evData:m}=this;m.clientX=e.clientX,m.clientY=e.clientY;let d;m.isResize?d=this.resizeCrop():d=this.dragCrop(),iQ(r,d)||l($n(d,c.width,c.height),so(d,c.width,c.height))},this.onComponentKeyDown=e=>{const{crop:r,disabled:n,onChange:l,onComplete:o}=this.props;if(n)return;const c=e.key;let m=!1;if(!r)return;const d=this.getBox(),h=this.makePixelCrop(d),g=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?ln.nudgeStepLarge:e.shiftKey?ln.nudgeStepMedium:ln.nudgeStep;if(c==="ArrowLeft"?(h.x-=g,m=!0):c==="ArrowRight"?(h.x+=g,m=!0):c==="ArrowUp"?(h.y-=g,m=!0):c==="ArrowDown"&&(h.y+=g,m=!0),m){e.cancelable&&e.preventDefault(),h.x=e9(h.x,0,d.width-h.width),h.y=e9(h.y,0,d.height-h.height);const b=$n(h,d.width,d.height),y=so(h,d.width,d.height);l(b,y),o&&o(b,y)}},this.onHandlerKeyDown=(e,r)=>{const{aspect:n=0,crop:l,disabled:o,minWidth:c=0,minHeight:m=0,maxWidth:d,maxHeight:h,onChange:g,onComplete:b}=this.props,y=this.getBox();if(o||!l)return;if(e.key==="ArrowUp"||e.key==="ArrowDown"||e.key==="ArrowLeft"||e.key==="ArrowRight")e.stopPropagation(),e.preventDefault();else return;const E=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?ln.nudgeStepLarge:e.shiftKey?ln.nudgeStepMedium:ln.nudgeStep,M=$n(l,y.width,y.height),O=GK1(M,e.key,E,r),w=cQ(O,n,r,y.width,y.height,c,m,d,h);if(!iQ(l,w)){const S=so(w,y.width,y.height);g(w,S),b&&b(w,S)}},this.onDocPointerDone=e=>{const{crop:r,disabled:n,onComplete:l,onDragEnd:o}=this.props,c=this.getBox();this.unbindDocMove(),!(n||!r)&&this.mouseDownOnCrop&&(this.mouseDownOnCrop=!1,this.dragStarted=!1,o&&o(e),l&&l($n(r,c.width,c.height),so(r,c.width,c.height)),this.setState({cropIsActive:!1,newCropIsBeingDrawn:!1}))},this.onDragFocus=e=>{var r;(r=this.componentRef.current)==null||r.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:r,y:n,width:l,height:o}=e.getBoundingClientRect();return{x:r,y:n,width:l,height:o}}componentDidUpdate(e){const{crop:r,onComplete:n}=this.props;if(n&&!e.crop&&r){const{width:l,height:o}=this.getBox();l&&o&&n($n(r,l,o),so(r,l,o))}}componentWillUnmount(){this.resizeObserver&&this.resizeObserver.disconnect()}bindDocMove(){this.docMoveBound||(this.document.addEventListener("pointermove",this.onDocPointerMove,t9),this.document.addEventListener("pointerup",this.onDocPointerDone,t9),this.document.addEventListener("pointercancel",this.onDocPointerDone,t9),this.docMoveBound=!0)}unbindDocMove(){this.docMoveBound&&(this.document.removeEventListener("pointermove",this.onDocPointerMove,t9),this.document.removeEventListener("pointerup",this.onDocPointerDone,t9),this.document.removeEventListener("pointercancel",this.onDocPointerDone,t9),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,r=this.getBox(),n=this.makePixelCrop(r),l=e.clientX-e.startClientX,o=e.clientY-e.startClientY;return n.x=e9(e.startCropX+l,0,r.width-n.width),n.y=e9(e.startCropY+o,0,r.height-n.height),n}getPointRegion(e,r,n,l){const{evData:o}=this,c=o.clientX-e.x,m=o.clientY-e.y;let d;l&&r?d=r==="nw"||r==="n"||r==="ne":d=m<o.startCropY;let h;return n&&r?h=r==="nw"||r==="w"||r==="sw":h=c<o.startCropX,h?d?"nw":"sw":d?"ne":"se"}resolveMinDimensions(e,r,n=0,l=0){let o=Math.min(n,e.width),c=Math.min(l,e.height);return!r||!o&&!c?[o,c]:r>1?o?[o,o/r]:[c*r,c]:c?[c*r,c]:[o,o/r]}resizeCrop(){const{evData:e}=this,{aspect:r=0,maxWidth:n,maxHeight:l}=this.props,o=this.getBox(),[c,m]=this.resolveMinDimensions(o,r,this.props.minWidth,this.props.minHeight);let d=this.makePixelCrop(o),h=this.getPointRegion(o,e.ord,c,m);const g=e.ord||h;let b=e.clientX-e.startClientX,y=e.clientY-e.startClientY;(c&&g==="nw"||g==="w"||g==="sw")&&(b=Math.min(b,-c)),(m&&g==="nw"||g==="n"||g==="ne")&&(y=Math.min(y,-m));const E={unit:"px",x:0,y:0,width:0,height:0};h==="ne"?(E.x=e.startCropX,E.width=b,r?(E.height=E.width/r,E.y=e.startCropY-E.height):(E.height=Math.abs(y),E.y=e.startCropY-E.height)):h==="se"?(E.x=e.startCropX,E.y=e.startCropY,E.width=b,r?E.height=E.width/r:E.height=y):h==="sw"?(E.x=e.startCropX+b,E.y=e.startCropY,E.width=Math.abs(b),r?E.height=E.width/r:E.height=y):h==="nw"&&(E.x=e.startCropX+b,E.width=Math.abs(b),r?(E.height=E.width/r,E.y=e.startCropY-E.height):(E.height=Math.abs(y),E.y=e.startCropY+y));const M=cQ(E,r,h,o.width,o.height,c,m,n,l);return r||ln.xyOrds.indexOf(g)>-1?d=M:ln.xOrds.indexOf(g)>-1?(d.x=M.x,d.width=M.width):ln.yOrds.indexOf(g)>-1&&(d.y=M.y,d.height=M.height),d.x=e9(d.x,0,o.width-d.width),d.y=e9(d.y,0,o.height-d.height),d}createCropSelection(){const{ariaLabels:e=ln.defaultProps.ariaLabels,disabled:r,locked:n,renderSelectionAddon:l,ruleOfThirds:o,crop:c}=this.props,m=this.getCropStyle();if(c)return t.createElement("div",{style:m,className:"ReactCrop__crop-selection",onPointerDown:this.onCropPointerDown,"aria-label":e.cropArea,tabIndex:0,onKeyDown:this.onComponentKeyDown,role:"group"},!r&&!n&&t.createElement("div",{className:"ReactCrop__drag-elements",onFocus:this.onDragFocus},t.createElement("div",{className:"ReactCrop__drag-bar ord-n","data-ord":"n"}),t.createElement("div",{className:"ReactCrop__drag-bar ord-e","data-ord":"e"}),t.createElement("div",{className:"ReactCrop__drag-bar ord-s","data-ord":"s"}),t.createElement("div",{className:"ReactCrop__drag-bar ord-w","data-ord":"w"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-nw","data-ord":"nw",tabIndex:0,"aria-label":e.nwDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"nw"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-n","data-ord":"n",tabIndex:0,"aria-label":e.nDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"n"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-ne","data-ord":"ne",tabIndex:0,"aria-label":e.neDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"ne"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-e","data-ord":"e",tabIndex:0,"aria-label":e.eDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"e"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-se","data-ord":"se",tabIndex:0,"aria-label":e.seDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"se"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-s","data-ord":"s",tabIndex:0,"aria-label":e.sDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"s"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-sw","data-ord":"sw",tabIndex:0,"aria-label":e.swDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"sw"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-w","data-ord":"w",tabIndex:0,"aria-label":e.wDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"w"),role:"button"})),l&&t.createElement("div",{className:"ReactCrop__selection-addon",onMouseDown:d=>d.stopPropagation()},l(this.state)),o&&t.createElement(t.Fragment,null,t.createElement("div",{className:"ReactCrop__rule-of-thirds-hz"}),t.createElement("div",{className:"ReactCrop__rule-of-thirds-vt"})))}makePixelCrop(e){const r={...HA,...this.props.crop||{}};return $n(r,e.width,e.height)}render(){const{aspect:e,children:r,circularCrop:n,className:l,crop:o,disabled:c,locked:m,style:d,ruleOfThirds:h}=this.props,{cropIsActive:g,newCropIsBeingDrawn:b}=this.state,y=o?this.createCropSelection():null,E=BK1("ReactCrop",l,g&&"ReactCrop--active",c&&"ReactCrop--disabled",m&&"ReactCrop--locked",b&&"ReactCrop--new-crop",o&&e&&"ReactCrop--fixed-aspect",o&&n&&"ReactCrop--circular-crop",o&&h&&"ReactCrop--rule-of-thirds",!this.dragStarted&&o&&!o.width&&!o.height&&"ReactCrop--invisible-crop",n&&"ReactCrop--no-animate");return t.createElement("div",{ref:this.componentRef,className:E,style:d},t.createElement("div",{ref:this.mediaRef,className:"ReactCrop__child-wrapper",onPointerDown:this.onComponentPointerDown},r),y)}};mo.xOrds=["e","w"],mo.yOrds=["n","s"],mo.xyOrds=["nw","ne","se","sw"],mo.nudgeStep=1,mo.nudgeStepMedium=10,mo.nudgeStepLarge=100,mo.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 YK1=mo;const QK1=Math.PI/180;async function KK1(a,e,r,n=1,l=0){const o=e.getContext("2d");if(!o)throw new Error("No 2d context");const c=a.naturalWidth/a.width,m=a.naturalHeight/a.height,d=window.devicePixelRatio;e.width=Math.floor(r.width*c*d),e.height=Math.floor(r.height*m*d),o.scale(d,d),o.imageSmoothingQuality="high";const h=r.x*c,g=r.y*m,b=l*QK1,y=a.naturalWidth/2,E=a.naturalHeight/2;o.save(),o.translate(-h,-g),o.translate(y,E),o.rotate(b),o.scale(n,n),o.translate(-y,-E),o.drawImage(a,0,0,a.naturalWidth,a.naturalHeight,0,0,a.naturalWidth,a.naturalHeight),o.restore()}function XK1(a,e,r){p.useEffect(()=>{const n=setTimeout(()=>{a.apply(void 0,r)},e);return()=>{clearTimeout(n)}},[a,r,e])}function JK1(a,e,r){return WK1(qK1({unit:"%",width:90},r,a,e),a,e)}function eX1(a){const[e,r]=p.useState("IDLE"),n=p.useRef(null),l=p.useRef(null),o=p.useRef(""),[c]=NQ1(),[m,d]=p.useState(),[h,g]=p.useState(1);function b(O){if(h){const{width:w,height:S}=O.currentTarget;a.setCrop(JK1(w,S,h))}}function y(){if(!n.current)throw new Error("Crop canvas does not exist");n.current.toBlob(async O=>{if(!O)throw new Error("Failed to create blob");try{r("LOADING");const w=Math.round(O.size/1024),{data:S}=await c({variables:{file:O,size:w}}),j=S.uploadProfileImage.photo.uri;a.handleCloseImageUploader(),console.log("Uploaded photo URI:",j)}catch(w){console.error("Failed to upload profile image:",w)}finally{o.current&&URL.revokeObjectURL(o.current)}})}const E=O=>{O.preventDefault(),y()};XK1(async()=>{m!=null&&m.width&&(m!=null&&m.height)&&l.current&&n.current&&KK1(l.current,n.current,m)},100,[m]);const M=e==="LOADING";return P.jsxs("form",{onSubmit:E,className:"ImageUploader",children:[a.imgSrc?P.jsxs(oe,{mb:"base",children:[P.jsx(ad,{mb:"xs",children:"Crop your new profile picture"}),P.jsx(YK1,{crop:a.crop,onChange:(O,w)=>a.setCrop(w),onComplete:O=>d(O),aspect:h,children:P.jsx("img",{ref:l,alt:"Crop me",src:a.imgSrc,onLoad:b})})]}):null,m?P.jsxs(P.Fragment,{children:[P.jsx(oe,{display:"none",children:P.jsx("canvas",{ref:n,style:{border:"1px solid black",objectFit:"contain",width:m.width,height:m.height}})}),P.jsx(oe,{justifyContent:"center",display:"flex",children:P.jsx(E8,{type:"submit",surface:"solid",disabled:!m||M,children:M?"Saving...":"Set New Profile Image"})})]}):null]})}function tX1(a){return a.charAt(0).toUpperCase()+a.slice(1)}function sQ({setShowDetails:a,...e}){var M,O;const[r,n]=p.useState("IDLE"),[l,o]=p.useState(null),{currentUser:c}=Fc(),[m]=zY();p.useEffect(()=>{n("IDLE"),o(null)},[c]);const d=w=>{n("ERROR"),o(w)},{values:h,handleSubmit:g,setFieldValue:b}=$g(async()=>{n("LOADING");const w=Object.keys(h).map(S=>({field:tX1(S),value:h[S]}));try{await m({variables:{input:w}}),a(!1),n("SUCCESS")}catch(S){d(S),console.log(JSON.stringify(S))}}),y=r==="LOADING",E=w=>{w.preventDefault(),g()};return P.jsx(oe,{id:"profileDetails",children:P.jsx("form",{onSubmit:E,children:P.jsxs(oe,{mb:"l",display:"flex",flexDirection:"column",children:[P.jsx(oe,{mb:"base",children:P.jsx(rc,{id:"firstName",placeholder:"First Name",value:h.firstName||((M=c==null?void 0:c.profile)==null?void 0:M.firstName)||"",onChange:w=>{b("firstName",w.target.value)},required:!0,error:l==null?void 0:l.identity})}),P.jsx(oe,{mb:"xl",children:P.jsx(rc,{id:"lastName",placeholder:"Last Name",value:h.lastName||((O=c==null?void 0:c.profile)==null?void 0:O.lastName)||"",onChange:w=>{b("lastName",w.target.value)},required:!0,error:l==null?void 0:l.identity})}),P.jsx(E8,{type:"submit",surface:"solid",disabled:!c||!(h.firstName||h.lastName)||y,children:y?"Saving":"Save"})]})})})}sQ.propTypes={currentPerson:L1.oneOfType([L1.array,L1.object])};const mQ=({theme:a,handleCloseProfile:e,size:r,...n})=>{var J,G,u0,t0,n0,l0;const{currentUser:l}=Fc(),{currentChurch:o}=Og(),[c,m]=$l(),[d,h]=p.useState(!1),[g,b]=p.useState(!1),[y,E]=p.useState(""),[M,O]=p.useState(),[w,S]=p.useState(!1),[j,k]=p.useState(!1),T=p.useRef(null);p.useEffect(()=>{k(!0)},[]),p.useEffect(()=>{if(!d){const e0=B0=>{T.current&&!T.current.contains(B0.target)&&(B0.stopPropagation(),e())};return document.addEventListener("mousedown",e0),()=>{document.removeEventListener("mousedown",e0)}}});const C=()=>{h(!1),m(fW())};function I(e0){if(e0.target.files&&e0.target.files.length>0){O(void 0),S(!0);const B0=new FileReader;B0.addEventListener("load",()=>{var k0;return E(((k0=B0.result)==null?void 0:k0.toString())||"")}),B0.readAsDataURL(e0.target.files[0])}}const z=()=>{S(!1),O(void 0),E("")},{colors:B}=JSON.parse(o==null?void 0:o.theme)||{};return P.jsxs(P.Fragment,{children:[P.jsx(bA.Profile,{ref:T,...r?{right:"-15px;"}:{},style:{opacity:j?1:0,transform:j?"translateY(0)":"translateY(-10px)",transition:"opacity 0.3s ease, transform 0.3s ease"},children:P.jsxs(bA.ProfileCard,{className:"rounded-none sm:rounded-xxl",width:{_:"100%",sm:"350px",md:"520px"},children:[P.jsx(oe,{display:"flex",alignItems:"center",justifyContent:"end",children:P.jsx(E8,{title:"Close",circular:!0,surface:"tinted",onClick:e,children:P.jsx(Ym,{size:18,weight:"bold"})})}),P.jsxs(oe,{className:"flex items-center flex-col gap-1 pb-11",children:[y&&w?P.jsx(eX1,{crop:M,setCrop:O,imgSrc:y,handleCloseImageUploader:z}):null,y?null:P.jsxs(P.Fragment,{children:[P.jsxs(oe,{position:"relative",children:[(G=(J=l==null?void 0:l.profile)==null?void 0:J.photo)!=null&&G.uri?P.jsx(tc,{src:(t0=(u0=l==null?void 0:l.profile)==null?void 0:u0.photo)==null?void 0:t0.uri,alt:"avatar",className:"size-[72px]"}):P.jsx(oe,{color:"base.primary",position:"relative",children:P.jsx(kU,{size:90,weight:"fill",color:we("colors.base.primary")({theme:a})})}),l&&P.jsx(oe,{children:!y&&P.jsxs(bA.UploadIcon,{children:[P.jsx(yU,{size:12,weight:"fill",color:we("colors.base.white")({theme:a})}),P.jsx("input",{type:"file",accept:"image/*",onChange:I})]})})]}),(n0=l==null?void 0:l.profile)!=null&&n0.firstName?P.jsxs(ad,{mt:"xxs",children:["Hey ",(l0=l==null?void 0:l.profile)==null?void 0:l0.firstName]}):null,!c.token&&!y?P.jsxs(E8,{title:"Sign up or Login",surface:"tinted",pill:!0,onClick:()=>h(!0),children:["Sign up or Login",P.jsx(hU,{size:24})]}):null]})]}),c.token&&!g&&!y?P.jsxs(P.Fragment,{children:[P.jsx(ad,{color:"text.secondary",mb:"xs",children:"My Profile"}),P.jsx(oe,{children:P.jsx(qw,{onClick:()=>b(!0),leadingIcon:P.jsx(FV,{size:18,weight:"fill",color:we("colors.text.secondary")({theme:a})}),title:"Personal Details"})}),P.jsx(oe,{mt:"s",mb:"base",children:P.jsx(qw,{leadingIcon:P.jsx(gU,{size:18,weight:"fill",color:we("colors.text.secondary")({theme:a})}),onClick:C,title:"Logout"})})]}):null,g&&!y?P.jsx(sQ,{setShowDetails:b}):null,!g&&!y&&(o!=null&&o.mobileAppStoreUrl||o!=null&&o.mobilePlayStoreUrl)?P.jsx(P.Fragment,{children:P.jsxs(oe,{alignItems:"center",display:"flex",flexDirection:"column",backgroundSize:"55%",backgroundRepeat:"no-repeat",backgroundPosition:"center 0",backgroundImage:"linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0) 100%), url('https://res.cloudinary.com/hwwbvfvlv/image/upload/v1733759363/Apollos%20Admin/New%20Embeds%20Assets/iphone-frame_yydnl6.png')",className:"mt-7",children:[P.jsxs(oe,{backgroundColor:"base.primary",className:"mb-4 mt-16 overflow-hidden flex justify-center items-center rounded-xl",children:[" ",P.jsx(oK1,{source:o==null?void 0:o.logo,...B!=null&&B.iconBackground?{backgroundColor:B==null?void 0:B.iconBackground}:{}})]}),P.jsx(ad,{mb:"xxs",children:n.adTitle||"Stay Connected"}),P.jsx(I2,{fg:"primary",className:"text-sm text-center max-w-64 mb-8",children:n.adBody||"Explore your faith and build daily habits with our online community."}),P.jsxs(bA.AppLinks,{children:[o!=null&&o.mobileAppStoreUrl?P.jsx("a",{href:o==null?void 0:o.mobileAppStoreUrl,children:P.jsxs(E8,{pill:!0,surface:"system",className:"!text-sm !px-2.5 !py-1 text-fg-secondary dark:text-fg-secondary-dark",children:["Get it on iOS",P.jsx(cU,{weight:"fill",size:"24"})]})}):null,o!=null&&o.mobilePlayStoreUrl?P.jsx("a",{href:o==null?void 0:o.mobilePlayStoreUrl,children:P.jsxs(E8,{pill:!0,surface:"system",className:"!text-sm !px-2.5 !py-1 text-fg-secondary dark:text-fg-secondary-dark",children:["Get it on Android",P.jsx(lU,{weight:"fill",size:"24"})]})}):null]})]})}):null]})}),d&&c.step!==_8.Success?P.jsx(BY,{onClose:()=>h(!1)}):null]})};mQ.propTypes={...Rt};const aX1=De(mQ),rX1=({dropdown:a})=>a?rt`
|
|
1390
|
+
`),bA={Profile:DK1,CloseIcon:xK1,UploadIcon:zK1,AppLinks:UK1,ProfileCard:RK1},HA={x:0,y:0,width:0,height:0,unit:"px"},e9=(a,e,r)=>Math.min(Math.max(a,e),r),BK1=(...a)=>a.filter(e=>e&&typeof e=="string").join(" "),iQ=(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 qK1(a,e,r,n){const l=$n(a,r,n);return a.width&&(l.height=l.width/e),a.height&&(l.width=l.height*e),l.y+l.height>n&&(l.height=n-l.y,l.width=l.height*e),l.x+l.width>r&&(l.width=r-l.x,l.height=l.width/e),a.unit==="%"?so(l,r,n):l}function WK1(a,e,r){const n=$n(a,e,r);return n.x=(e-n.width)/2,n.y=(r-n.height)/2,a.unit==="%"?so(n,e,r):n}function so(a,e,r){return a.unit==="%"?{...HA,...a,unit:"%"}:{unit:"%",x:a.x?a.x/e*100:0,y:a.y?a.y/r*100:0,width:a.width?a.width/e*100:0,height:a.height?a.height/r*100:0}}function $n(a,e,r){return a.unit?a.unit==="px"?{...HA,...a,unit:"px"}:{unit:"px",x:a.x?a.x*e/100:0,y:a.y?a.y*r/100:0,width:a.width?a.width*e/100:0,height:a.height?a.height*r/100:0}:{...HA,...a,unit:"px"}}function cQ(a,e,r,n,l,o=0,c=0,m=n,d=l){const h={...a};let g=Math.min(o,n),b=Math.min(c,l),y=Math.min(m,n),E=Math.min(d,l);e&&(e>1?(g=c?c*e:g,b=g/e,y=m*e):(b=o?o/e:b,g=b*e,E=d/e)),h.y<0&&(h.height=Math.max(h.height+h.y,b),h.y=0),h.x<0&&(h.width=Math.max(h.width+h.x,g),h.x=0);const M=n-(h.x+h.width);M<0&&(h.x=Math.min(h.x,n-g),h.width+=M);const O=l-(h.y+h.height);if(O<0&&(h.y=Math.min(h.y,l-b),h.height+=O),h.width<g&&((r==="sw"||r=="nw")&&(h.x-=g-h.width),h.width=g),h.height<b&&((r==="nw"||r=="ne")&&(h.y-=b-h.height),h.height=b),h.width>y&&((r==="sw"||r=="nw")&&(h.x-=y-h.width),h.width=y),h.height>E&&((r==="nw"||r=="ne")&&(h.y-=E-h.height),h.height=E),e){const w=h.width/h.height;if(w<e){const S=Math.max(h.width/e,b);(r==="nw"||r=="ne")&&(h.y-=S-h.height),h.height=S}else if(w>e){const S=Math.max(h.height*e,g);(r==="sw"||r=="nw")&&(h.x-=S-h.width),h.width=S}}return h}function GK1(a,e,r,n){const l={...a};return e==="ArrowLeft"?n==="nw"?(l.x-=r,l.y-=r,l.width+=r,l.height+=r):n==="w"?(l.x-=r,l.width+=r):n==="sw"?(l.x-=r,l.width+=r,l.height+=r):n==="ne"?(l.y+=r,l.width-=r,l.height-=r):n==="e"?l.width-=r:n==="se"&&(l.width-=r,l.height-=r):e==="ArrowRight"&&(n==="nw"?(l.x+=r,l.y+=r,l.width-=r,l.height-=r):n==="w"?(l.x+=r,l.width-=r):n==="sw"?(l.x+=r,l.width-=r,l.height-=r):n==="ne"?(l.y-=r,l.width+=r,l.height+=r):n==="e"?l.width+=r:n==="se"&&(l.width+=r,l.height+=r)),e==="ArrowUp"?n==="nw"?(l.x-=r,l.y-=r,l.width+=r,l.height+=r):n==="n"?(l.y-=r,l.height+=r):n==="ne"?(l.y-=r,l.width+=r,l.height+=r):n==="sw"?(l.x+=r,l.width-=r,l.height-=r):n==="s"?l.height-=r:n==="se"&&(l.width-=r,l.height-=r):e==="ArrowDown"&&(n==="nw"?(l.x+=r,l.y+=r,l.width-=r,l.height-=r):n==="n"?(l.y+=r,l.height-=r):n==="ne"?(l.y+=r,l.width-=r,l.height-=r):n==="sw"?(l.x-=r,l.width+=r,l.height+=r):n==="s"?l.height+=r:n==="se"&&(l.width+=r,l.height+=r)),l}const t9={capture:!0,passive:!1},mo=class ln extends p.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=p.createRef(),this.mediaRef=p.createRef(),this.initChangeCalled=!1,this.state={cropIsActive:!1,newCropIsBeingDrawn:!1},this.onCropPointerDown=e=>{const{crop:r,disabled:n}=this.props,l=this.getBox();if(!r)return;const o=$n(r,l.width,l.height);if(n)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const c=e.target.dataset.ord,m=!!c;let d=e.clientX,h=e.clientY,g=o.x,b=o.y;if(c){const y=e.clientX-l.x,E=e.clientY-l.y;let M=0,O=0;c==="ne"||c=="e"?(M=y-(o.x+o.width),O=E-o.y,g=o.x,b=o.y+o.height):c==="se"||c==="s"?(M=y-(o.x+o.width),O=E-(o.y+o.height),g=o.x,b=o.y):c==="sw"||c=="w"?(M=y-o.x,O=E-(o.y+o.height),g=o.x+o.width,b=o.y):(c==="nw"||c=="n")&&(M=y-o.x,O=E-o.y,g=o.x+o.width,b=o.y+o.height),d=g+l.x+M,h=b+l.y+O}this.evData={startClientX:d,startClientY:h,startCropX:g,startCropY:b,clientX:e.clientX,clientY:e.clientY,isResize:m,ord:c},this.mouseDownOnCrop=!0,this.setState({cropIsActive:!0})},this.onComponentPointerDown=e=>{const{crop:r,disabled:n,locked:l,keepSelection:o,onChange:c}=this.props,m=this.getBox();if(n||l||o&&r)return;e.cancelable&&e.preventDefault(),this.bindDocMove(),this.componentRef.current.focus({preventScroll:!0});const d=e.clientX-m.x,h=e.clientY-m.y,g={unit:"px",x:d,y:h,width:0,height:0};this.evData={startClientX:e.clientX,startClientY:e.clientY,startCropX:d,startCropY:h,clientX:e.clientX,clientY:e.clientY,isResize:!0},this.mouseDownOnCrop=!0,c($n(g,m.width,m.height),so(g,m.width,m.height)),this.setState({cropIsActive:!0,newCropIsBeingDrawn:!0})},this.onDocPointerMove=e=>{const{crop:r,disabled:n,onChange:l,onDragStart:o}=this.props,c=this.getBox();if(n||!r||!this.mouseDownOnCrop)return;e.cancelable&&e.preventDefault(),this.dragStarted||(this.dragStarted=!0,o&&o(e));const{evData:m}=this;m.clientX=e.clientX,m.clientY=e.clientY;let d;m.isResize?d=this.resizeCrop():d=this.dragCrop(),iQ(r,d)||l($n(d,c.width,c.height),so(d,c.width,c.height))},this.onComponentKeyDown=e=>{const{crop:r,disabled:n,onChange:l,onComplete:o}=this.props;if(n)return;const c=e.key;let m=!1;if(!r)return;const d=this.getBox(),h=this.makePixelCrop(d),g=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?ln.nudgeStepLarge:e.shiftKey?ln.nudgeStepMedium:ln.nudgeStep;if(c==="ArrowLeft"?(h.x-=g,m=!0):c==="ArrowRight"?(h.x+=g,m=!0):c==="ArrowUp"?(h.y-=g,m=!0):c==="ArrowDown"&&(h.y+=g,m=!0),m){e.cancelable&&e.preventDefault(),h.x=e9(h.x,0,d.width-h.width),h.y=e9(h.y,0,d.height-h.height);const b=$n(h,d.width,d.height),y=so(h,d.width,d.height);l(b,y),o&&o(b,y)}},this.onHandlerKeyDown=(e,r)=>{const{aspect:n=0,crop:l,disabled:o,minWidth:c=0,minHeight:m=0,maxWidth:d,maxHeight:h,onChange:g,onComplete:b}=this.props,y=this.getBox();if(o||!l)return;if(e.key==="ArrowUp"||e.key==="ArrowDown"||e.key==="ArrowLeft"||e.key==="ArrowRight")e.stopPropagation(),e.preventDefault();else return;const E=(navigator.platform.match("Mac")?e.metaKey:e.ctrlKey)?ln.nudgeStepLarge:e.shiftKey?ln.nudgeStepMedium:ln.nudgeStep,M=$n(l,y.width,y.height),O=GK1(M,e.key,E,r),w=cQ(O,n,r,y.width,y.height,c,m,d,h);if(!iQ(l,w)){const S=so(w,y.width,y.height);g(w,S),b&&b(w,S)}},this.onDocPointerDone=e=>{const{crop:r,disabled:n,onComplete:l,onDragEnd:o}=this.props,c=this.getBox();this.unbindDocMove(),!(n||!r)&&this.mouseDownOnCrop&&(this.mouseDownOnCrop=!1,this.dragStarted=!1,o&&o(e),l&&l($n(r,c.width,c.height),so(r,c.width,c.height)),this.setState({cropIsActive:!1,newCropIsBeingDrawn:!1}))},this.onDragFocus=e=>{var r;(r=this.componentRef.current)==null||r.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:r,y:n,width:l,height:o}=e.getBoundingClientRect();return{x:r,y:n,width:l,height:o}}componentDidUpdate(e){const{crop:r,onComplete:n}=this.props;if(n&&!e.crop&&r){const{width:l,height:o}=this.getBox();l&&o&&n($n(r,l,o),so(r,l,o))}}componentWillUnmount(){this.resizeObserver&&this.resizeObserver.disconnect()}bindDocMove(){this.docMoveBound||(this.document.addEventListener("pointermove",this.onDocPointerMove,t9),this.document.addEventListener("pointerup",this.onDocPointerDone,t9),this.document.addEventListener("pointercancel",this.onDocPointerDone,t9),this.docMoveBound=!0)}unbindDocMove(){this.docMoveBound&&(this.document.removeEventListener("pointermove",this.onDocPointerMove,t9),this.document.removeEventListener("pointerup",this.onDocPointerDone,t9),this.document.removeEventListener("pointercancel",this.onDocPointerDone,t9),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,r=this.getBox(),n=this.makePixelCrop(r),l=e.clientX-e.startClientX,o=e.clientY-e.startClientY;return n.x=e9(e.startCropX+l,0,r.width-n.width),n.y=e9(e.startCropY+o,0,r.height-n.height),n}getPointRegion(e,r,n,l){const{evData:o}=this,c=o.clientX-e.x,m=o.clientY-e.y;let d;l&&r?d=r==="nw"||r==="n"||r==="ne":d=m<o.startCropY;let h;return n&&r?h=r==="nw"||r==="w"||r==="sw":h=c<o.startCropX,h?d?"nw":"sw":d?"ne":"se"}resolveMinDimensions(e,r,n=0,l=0){let o=Math.min(n,e.width),c=Math.min(l,e.height);return!r||!o&&!c?[o,c]:r>1?o?[o,o/r]:[c*r,c]:c?[c*r,c]:[o,o/r]}resizeCrop(){const{evData:e}=this,{aspect:r=0,maxWidth:n,maxHeight:l}=this.props,o=this.getBox(),[c,m]=this.resolveMinDimensions(o,r,this.props.minWidth,this.props.minHeight);let d=this.makePixelCrop(o),h=this.getPointRegion(o,e.ord,c,m);const g=e.ord||h;let b=e.clientX-e.startClientX,y=e.clientY-e.startClientY;(c&&g==="nw"||g==="w"||g==="sw")&&(b=Math.min(b,-c)),(m&&g==="nw"||g==="n"||g==="ne")&&(y=Math.min(y,-m));const E={unit:"px",x:0,y:0,width:0,height:0};h==="ne"?(E.x=e.startCropX,E.width=b,r?(E.height=E.width/r,E.y=e.startCropY-E.height):(E.height=Math.abs(y),E.y=e.startCropY-E.height)):h==="se"?(E.x=e.startCropX,E.y=e.startCropY,E.width=b,r?E.height=E.width/r:E.height=y):h==="sw"?(E.x=e.startCropX+b,E.y=e.startCropY,E.width=Math.abs(b),r?E.height=E.width/r:E.height=y):h==="nw"&&(E.x=e.startCropX+b,E.width=Math.abs(b),r?(E.height=E.width/r,E.y=e.startCropY-E.height):(E.height=Math.abs(y),E.y=e.startCropY+y));const M=cQ(E,r,h,o.width,o.height,c,m,n,l);return r||ln.xyOrds.indexOf(g)>-1?d=M:ln.xOrds.indexOf(g)>-1?(d.x=M.x,d.width=M.width):ln.yOrds.indexOf(g)>-1&&(d.y=M.y,d.height=M.height),d.x=e9(d.x,0,o.width-d.width),d.y=e9(d.y,0,o.height-d.height),d}createCropSelection(){const{ariaLabels:e=ln.defaultProps.ariaLabels,disabled:r,locked:n,renderSelectionAddon:l,ruleOfThirds:o,crop:c}=this.props,m=this.getCropStyle();if(c)return t.createElement("div",{style:m,className:"ReactCrop__crop-selection",onPointerDown:this.onCropPointerDown,"aria-label":e.cropArea,tabIndex:0,onKeyDown:this.onComponentKeyDown,role:"group"},!r&&!n&&t.createElement("div",{className:"ReactCrop__drag-elements",onFocus:this.onDragFocus},t.createElement("div",{className:"ReactCrop__drag-bar ord-n","data-ord":"n"}),t.createElement("div",{className:"ReactCrop__drag-bar ord-e","data-ord":"e"}),t.createElement("div",{className:"ReactCrop__drag-bar ord-s","data-ord":"s"}),t.createElement("div",{className:"ReactCrop__drag-bar ord-w","data-ord":"w"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-nw","data-ord":"nw",tabIndex:0,"aria-label":e.nwDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"nw"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-n","data-ord":"n",tabIndex:0,"aria-label":e.nDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"n"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-ne","data-ord":"ne",tabIndex:0,"aria-label":e.neDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"ne"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-e","data-ord":"e",tabIndex:0,"aria-label":e.eDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"e"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-se","data-ord":"se",tabIndex:0,"aria-label":e.seDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"se"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-s","data-ord":"s",tabIndex:0,"aria-label":e.sDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"s"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-sw","data-ord":"sw",tabIndex:0,"aria-label":e.swDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"sw"),role:"button"}),t.createElement("div",{className:"ReactCrop__drag-handle ord-w","data-ord":"w",tabIndex:0,"aria-label":e.wDragHandle,onKeyDown:d=>this.onHandlerKeyDown(d,"w"),role:"button"})),l&&t.createElement("div",{className:"ReactCrop__selection-addon",onMouseDown:d=>d.stopPropagation()},l(this.state)),o&&t.createElement(t.Fragment,null,t.createElement("div",{className:"ReactCrop__rule-of-thirds-hz"}),t.createElement("div",{className:"ReactCrop__rule-of-thirds-vt"})))}makePixelCrop(e){const r={...HA,...this.props.crop||{}};return $n(r,e.width,e.height)}render(){const{aspect:e,children:r,circularCrop:n,className:l,crop:o,disabled:c,locked:m,style:d,ruleOfThirds:h}=this.props,{cropIsActive:g,newCropIsBeingDrawn:b}=this.state,y=o?this.createCropSelection():null,E=BK1("ReactCrop",l,g&&"ReactCrop--active",c&&"ReactCrop--disabled",m&&"ReactCrop--locked",b&&"ReactCrop--new-crop",o&&e&&"ReactCrop--fixed-aspect",o&&n&&"ReactCrop--circular-crop",o&&h&&"ReactCrop--rule-of-thirds",!this.dragStarted&&o&&!o.width&&!o.height&&"ReactCrop--invisible-crop",n&&"ReactCrop--no-animate");return t.createElement("div",{ref:this.componentRef,className:E,style:d},t.createElement("div",{ref:this.mediaRef,className:"ReactCrop__child-wrapper",onPointerDown:this.onComponentPointerDown},r),y)}};mo.xOrds=["e","w"],mo.yOrds=["n","s"],mo.xyOrds=["nw","ne","se","sw"],mo.nudgeStep=1,mo.nudgeStepMedium=10,mo.nudgeStepLarge=100,mo.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 YK1=mo;const QK1=Math.PI/180;async function KK1(a,e,r,n=1,l=0){const o=e.getContext("2d");if(!o)throw new Error("No 2d context");const c=a.naturalWidth/a.width,m=a.naturalHeight/a.height,d=window.devicePixelRatio;e.width=Math.floor(r.width*c*d),e.height=Math.floor(r.height*m*d),o.scale(d,d),o.imageSmoothingQuality="high";const h=r.x*c,g=r.y*m,b=l*QK1,y=a.naturalWidth/2,E=a.naturalHeight/2;o.save(),o.translate(-h,-g),o.translate(y,E),o.rotate(b),o.scale(n,n),o.translate(-y,-E),o.drawImage(a,0,0,a.naturalWidth,a.naturalHeight,0,0,a.naturalWidth,a.naturalHeight),o.restore()}function XK1(a,e,r){p.useEffect(()=>{const n=setTimeout(()=>{a.apply(void 0,r)},e);return()=>{clearTimeout(n)}},[a,r,e])}function JK1(a,e,r){return WK1(qK1({unit:"%",width:90},r,a,e),a,e)}function eX1(a){const[e,r]=p.useState("IDLE"),n=p.useRef(null),l=p.useRef(null),o=p.useRef(""),[c]=NQ1(),[m,d]=p.useState(),[h,g]=p.useState(1);function b(O){if(h){const{width:w,height:S}=O.currentTarget;a.setCrop(JK1(w,S,h))}}function y(){if(!n.current)throw new Error("Crop canvas does not exist");n.current.toBlob(async O=>{if(!O)throw new Error("Failed to create blob");try{r("LOADING");const w=Math.round(O.size/1024),{data:S}=await c({variables:{file:O,size:w}}),j=S.uploadProfileImage.photo.uri;a.handleCloseImageUploader(),console.log("Uploaded photo URI:",j)}catch(w){console.error("Failed to upload profile image:",w)}finally{o.current&&URL.revokeObjectURL(o.current)}})}const E=O=>{O.preventDefault(),y()};XK1(async()=>{m!=null&&m.width&&(m!=null&&m.height)&&l.current&&n.current&&KK1(l.current,n.current,m)},100,[m]);const M=e==="LOADING";return P.jsxs("form",{onSubmit:E,className:"ImageUploader",children:[a.imgSrc?P.jsxs(oe,{mb:"base",children:[P.jsx(ad,{mb:"xs",children:"Crop your new profile picture"}),P.jsx(YK1,{crop:a.crop,onChange:(O,w)=>a.setCrop(w),onComplete:O=>d(O),aspect:h,children:P.jsx("img",{ref:l,alt:"Crop me",src:a.imgSrc,onLoad:b})})]}):null,m?P.jsxs(P.Fragment,{children:[P.jsx(oe,{display:"none",children:P.jsx("canvas",{ref:n,style:{border:"1px solid black",objectFit:"contain",width:m.width,height:m.height}})}),P.jsx(oe,{justifyContent:"center",display:"flex",children:P.jsx(E8,{type:"submit",surface:"solid",disabled:!m||M,children:M?"Saving...":"Set New Profile Image"})})]}):null]})}function tX1(a){return a.charAt(0).toUpperCase()+a.slice(1)}function sQ({setShowDetails:a,...e}){var M,O;const[r,n]=p.useState("IDLE"),[l,o]=p.useState(null),{currentUser:c}=Fc(),[m]=zY();p.useEffect(()=>{n("IDLE"),o(null)},[c]);const d=w=>{n("ERROR"),o(w)},{values:h,handleSubmit:g,setFieldValue:b}=$g(async()=>{n("LOADING");const w=Object.keys(h).map(S=>({field:tX1(S),value:h[S]}));try{await m({variables:{input:w}}),a(!1),n("SUCCESS")}catch(S){d(S),console.log(JSON.stringify(S))}}),y=r==="LOADING",E=w=>{w.preventDefault(),g()};return P.jsx(oe,{id:"profileDetails",children:P.jsx("form",{onSubmit:E,children:P.jsxs(oe,{mb:"l",display:"flex",flexDirection:"column",children:[P.jsx(oe,{mb:"base",children:P.jsx(rc,{id:"firstName",placeholder:"First Name",value:h.firstName||((M=c==null?void 0:c.profile)==null?void 0:M.firstName)||"",onChange:w=>{b("firstName",w.target.value)},required:!0,error:l==null?void 0:l.identity})}),P.jsx(oe,{mb:"xl",children:P.jsx(rc,{id:"lastName",placeholder:"Last Name",value:h.lastName||((O=c==null?void 0:c.profile)==null?void 0:O.lastName)||"",onChange:w=>{b("lastName",w.target.value)},required:!0,error:l==null?void 0:l.identity})}),P.jsx(E8,{type:"submit",surface:"solid",disabled:!c||!(h.firstName||h.lastName)||y,children:y?"Saving":"Save"})]})})})}sQ.propTypes={currentPerson:L1.oneOfType([L1.array,L1.object])};const mQ=({theme:a,handleCloseProfile:e,size:r,...n})=>{var J,G,u0,t0,n0,l0;const{currentUser:l}=Fc(),{currentChurch:o}=Og(),[c,m]=$l(),[d,h]=p.useState(!1),[g,b]=p.useState(!1),[y,E]=p.useState(""),[M,O]=p.useState(),[w,S]=p.useState(!1),[j,k]=p.useState(!1),T=p.useRef(null);p.useEffect(()=>{k(!0)},[]),p.useEffect(()=>{if(!d){const e0=B0=>{T.current&&!T.current.contains(B0.target)&&(B0.stopPropagation(),e())};return document.addEventListener("mousedown",e0),()=>{document.removeEventListener("mousedown",e0)}}});const C=()=>{h(!1),m(fW())};function I(e0){if(e0.target.files&&e0.target.files.length>0){O(void 0),S(!0);const B0=new FileReader;B0.addEventListener("load",()=>{var k0;return E(((k0=B0.result)==null?void 0:k0.toString())||"")}),B0.readAsDataURL(e0.target.files[0])}}const z=()=>{S(!1),O(void 0),E("")},{colors:B}=JSON.parse(o==null?void 0:o.theme)||{};return P.jsxs(P.Fragment,{children:[P.jsx(bA.Profile,{ref:T,...r?{right:"-15px;"}:{},style:{opacity:j?1:0,transform:j?"translateY(0)":"translateY(-10px)",transition:"opacity 0.3s ease, transform 0.3s ease"},children:P.jsxs(bA.ProfileCard,{className:"rounded-none sm:rounded-xxl",width:{_:"100%",sm:"350px",md:"520px"},children:[P.jsx(oe,{display:"flex",alignItems:"center",justifyContent:"end",children:P.jsx(E8,{title:"Close",circular:!0,surface:"tinted",onClick:e,children:P.jsx(Ym,{size:18,weight:"bold"})})}),P.jsxs(oe,{className:"flex items-center flex-col gap-1 pb-11",children:[y&&w?P.jsx(eX1,{crop:M,setCrop:O,imgSrc:y,handleCloseImageUploader:z}):null,y?null:P.jsxs(P.Fragment,{children:[P.jsxs(oe,{position:"relative",children:[(G=(J=l==null?void 0:l.profile)==null?void 0:J.photo)!=null&&G.uri?P.jsx(tc,{src:(t0=(u0=l==null?void 0:l.profile)==null?void 0:u0.photo)==null?void 0:t0.uri,alt:"avatar",className:"size-[72px]"}):P.jsx(oe,{color:"base.primary",position:"relative",children:P.jsx(kU,{size:90,weight:"fill",color:we("colors.base.primary")({theme:a})})}),l&&P.jsx(oe,{children:!y&&P.jsxs(bA.UploadIcon,{children:[P.jsx(yU,{size:12,weight:"fill",color:we("colors.base.white")({theme:a})}),P.jsx("input",{type:"file",accept:"image/*",onChange:I})]})})]}),(n0=l==null?void 0:l.profile)!=null&&n0.firstName?P.jsxs(ad,{mt:"xxs",children:["Hey ",(l0=l==null?void 0:l.profile)==null?void 0:l0.firstName]}):null,!c.token&&!y?P.jsxs(E8,{title:"Sign up or Login",surface:"tinted",pill:!0,onClick:()=>h(!0),children:["Sign up or Login",P.jsx(hU,{size:24})]}):null]})]}),c.token&&!g&&!y?P.jsxs(P.Fragment,{children:[P.jsx(ad,{color:"text.secondary",mb:"xs",children:"My Profile"}),P.jsx(oe,{children:P.jsx(qw,{onClick:()=>b(!0),leadingIcon:P.jsx(FV,{size:18,weight:"fill",color:we("colors.text.secondary")({theme:a})}),title:"Personal Details"})}),P.jsx(oe,{mt:"s",mb:"base",children:P.jsx(qw,{leadingIcon:P.jsx(gU,{size:18,weight:"fill",color:we("colors.text.secondary")({theme:a})}),onClick:C,title:"Logout"})})]}):null,g&&!y?P.jsx(sQ,{setShowDetails:b}):null,!g&&!y&&(o!=null&&o.mobileAppStoreUrl||o!=null&&o.mobilePlayStoreUrl)?P.jsx(P.Fragment,{children:P.jsxs(oe,{alignItems:"center",display:"flex",flexDirection:"column",backgroundSize:"55%",backgroundRepeat:"no-repeat",backgroundPosition:"center 0",backgroundImage:"linear-gradient(to top, white 0%, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0) 100%), url('https://apollos-production-images.s3.us-east-1.amazonaws.com/hwwbvfvlv/image/upload/v1733759363/Apollos%2520Admin/New%20Embeds%20Assets/iphone-frame_yydnl6.png')",className:"mt-7",children:[P.jsxs(oe,{backgroundColor:"base.primary",className:"mb-4 mt-16 overflow-hidden flex justify-center items-center rounded-xl",children:[" ",P.jsx(oK1,{source:o==null?void 0:o.logo,...B!=null&&B.iconBackground?{backgroundColor:B==null?void 0:B.iconBackground}:{}})]}),P.jsx(ad,{mb:"xxs",children:n.adTitle||"Stay Connected"}),P.jsx(I2,{fg:"primary",className:"text-sm text-center max-w-64 mb-8",children:n.adBody||"Explore your faith and build daily habits with our online community."}),P.jsxs(bA.AppLinks,{children:[o!=null&&o.mobileAppStoreUrl?P.jsx("a",{href:o==null?void 0:o.mobileAppStoreUrl,children:P.jsxs(E8,{pill:!0,surface:"system",className:"!text-sm !px-2.5 !py-1 text-fg-secondary dark:text-fg-secondary-dark",children:["Get it on iOS",P.jsx(cU,{weight:"fill",size:"24"})]})}):null,o!=null&&o.mobilePlayStoreUrl?P.jsx("a",{href:o==null?void 0:o.mobilePlayStoreUrl,children:P.jsxs(E8,{pill:!0,surface:"system",className:"!text-sm !px-2.5 !py-1 text-fg-secondary dark:text-fg-secondary-dark",children:["Get it on Android",P.jsx(lU,{weight:"fill",size:"24"})]})}):null]})]})}):null]})}),d&&c.step!==_8.Success?P.jsx(BY,{onClose:()=>h(!1)}):null]})};mQ.propTypes={...Rt};const aX1=De(mQ),rX1=({dropdown:a})=>a?rt`
|
|
1391
1391
|
border-radius: ${we("radii.xxl")} ${we("radii.xxl")} 0px 0px;
|
|
1392
1392
|
@media screen and (max-width: ${we("breakpoints.sm")}) {
|
|
1393
1393
|
border-radius: 0px;
|