react-screenshots 0.5.10 → 0.5.16

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.
Files changed (64) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +145 -145
  3. package/package.json +2 -2
  4. package/electron/assets/index.95e77ee2.css +0 -1
  5. package/electron/assets/index.c68b977f.js +0 -14
  6. package/electron/assets/vendor.e3c417b2.js +0 -209
  7. package/electron/electron.html +0 -15
  8. package/lib/react-screenshots.cjs.js +0 -14
  9. package/lib/react-screenshots.es.js +0 -3168
  10. package/lib/style.css +0 -1
  11. package/lib/types/ScreenshotsBackground/getBoundsByPoints.d.ts +0 -2
  12. package/lib/types/ScreenshotsBackground/index.d.ts +0 -4
  13. package/lib/types/ScreenshotsButton/index.d.ts +0 -12
  14. package/lib/types/ScreenshotsCanvas/getBoundsByPoints.d.ts +0 -2
  15. package/lib/types/ScreenshotsCanvas/getPoints.d.ts +0 -2
  16. package/lib/types/ScreenshotsCanvas/index.d.ts +0 -15
  17. package/lib/types/ScreenshotsCanvas/isPointInDraw.d.ts +0 -2
  18. package/lib/types/ScreenshotsColor/index.d.ts +0 -8
  19. package/lib/types/ScreenshotsContext.d.ts +0 -29
  20. package/lib/types/ScreenshotsMagnifier/index.d.ts +0 -8
  21. package/lib/types/ScreenshotsOperations/index.d.ts +0 -6
  22. package/lib/types/ScreenshotsOption/index.d.ts +0 -15
  23. package/lib/types/ScreenshotsSize/index.d.ts +0 -8
  24. package/lib/types/ScreenshotsSizeColor/index.d.ts +0 -10
  25. package/lib/types/ScreenshotsTextarea/calculateNodeSize.d.ts +0 -17
  26. package/lib/types/ScreenshotsTextarea/index.d.ts +0 -15
  27. package/lib/types/composeImage.d.ts +0 -10
  28. package/lib/types/exports.d.ts +0 -3
  29. package/lib/types/hooks/useBounds.d.ts +0 -7
  30. package/lib/types/hooks/useCall.d.ts +0 -2
  31. package/lib/types/hooks/useCanvasContextRef.d.ts +0 -2
  32. package/lib/types/hooks/useCanvasMousedown.d.ts +0 -1
  33. package/lib/types/hooks/useCanvasMousemove.d.ts +0 -1
  34. package/lib/types/hooks/useCanvasMouseup.d.ts +0 -1
  35. package/lib/types/hooks/useCursor.d.ts +0 -6
  36. package/lib/types/hooks/useDispatcher.d.ts +0 -2
  37. package/lib/types/hooks/useDrawSelect.d.ts +0 -2
  38. package/lib/types/hooks/useEmiter.d.ts +0 -8
  39. package/lib/types/hooks/useHistory.d.ts +0 -16
  40. package/lib/types/hooks/useLang.d.ts +0 -2
  41. package/lib/types/hooks/useOperation.d.ts +0 -6
  42. package/lib/types/hooks/useReset.d.ts +0 -2
  43. package/lib/types/hooks/useStore.d.ts +0 -2
  44. package/lib/types/index.d.ts +0 -13
  45. package/lib/types/operations/Arrow/draw.d.ts +0 -11
  46. package/lib/types/operations/Arrow/index.d.ts +0 -22
  47. package/lib/types/operations/Brush/draw.d.ts +0 -3
  48. package/lib/types/operations/Brush/index.d.ts +0 -14
  49. package/lib/types/operations/Cancel/index.d.ts +0 -2
  50. package/lib/types/operations/Ellipse/draw.d.ts +0 -11
  51. package/lib/types/operations/Ellipse/index.d.ts +0 -28
  52. package/lib/types/operations/Mosaic/index.d.ts +0 -11
  53. package/lib/types/operations/Ok/index.d.ts +0 -2
  54. package/lib/types/operations/Rectangle/draw.d.ts +0 -11
  55. package/lib/types/operations/Rectangle/index.d.ts +0 -28
  56. package/lib/types/operations/Redo/index.d.ts +0 -2
  57. package/lib/types/operations/Save/index.d.ts +0 -2
  58. package/lib/types/operations/Text/index.d.ts +0 -22
  59. package/lib/types/operations/Undo/index.d.ts +0 -2
  60. package/lib/types/operations/index.d.ts +0 -3
  61. package/lib/types/operations/utils.d.ts +0 -4
  62. package/lib/types/types.d.ts +0 -39
  63. package/lib/types/useGetLoadedImage.d.ts +0 -1
  64. package/lib/types/zh_CN.d.ts +0 -16
@@ -1,15 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1" />
6
- <title>react-screenshots</title>
7
- <script type="module" crossorigin src="./assets/index.c68b977f.js"></script>
8
- <link rel="modulepreload" href="./assets/vendor.e3c417b2.js">
9
- <link rel="stylesheet" href="./assets/index.95e77ee2.css">
10
- </head>
11
- <body>
12
- <div id="app"></div>
13
-
14
- </body>
15
- </html>
@@ -1,14 +0,0 @@
1
- "use strict";var Oe=Object.defineProperty,Ve=Object.defineProperties;var qe=Object.getOwnPropertyDescriptors;var he=Object.getOwnPropertySymbols;var Ee=Object.prototype.hasOwnProperty,Be=Object.prototype.propertyIsEnumerable;var De=(e,t,n)=>t in e?Oe(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,G=(e,t)=>{for(var n in t||(t={}))Ee.call(t,n)&&De(e,n,t[n]);if(he)for(var n of he(t))Be.call(t,n)&&De(e,n,t[n]);return e},me=(e,t)=>Ve(e,qe(t));var Me=(e,t)=>{var n={};for(var c in e)Ee.call(e,c)&&t.indexOf(c)<0&&(n[c]=e[c]);if(e!=null&&he)for(var c of he(e))t.indexOf(c)<0&&Be.call(e,c)&&(n[c]=e[c]);return n};var i=require("react"),$e=require("react-dom");function Je(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var b=Je(i),B;(function(e){e[e.Edit=0]="Edit",e[e.Source=1]="Source"})(B||(B={}));function de({image:e,width:t,height:n,history:c,bounds:r}){return new Promise((o,s)=>{const a=document.createElement("canvas"),m=r.width*window.devicePixelRatio,d=r.height*window.devicePixelRatio;a.width=m,a.height=d;const l=a.getContext("2d");if(!l)return s(new Error("convert image to blob fail"));const u=e.naturalWidth/t,h=e.naturalHeight/n;l.imageSmoothingEnabled=!0,l.imageSmoothingQuality="low",l.setTransform(window.devicePixelRatio,0,0,window.devicePixelRatio,0,0),l.clearRect(0,0,r.width,r.height),l.drawImage(e,r.x*u,r.y*h,r.width*u,r.height*h,0,0,r.width,r.height),c.stack.slice(0,c.index+1).forEach(f=>{f.type===B.Source&&f.draw(l,f)}),a.toBlob(f=>{if(!f)return s(new Error("canvas toBlob fail"));o(f)},"image/png")})}const Le={magnifier_position_label:"\u5750\u6807",operation_ok_title:"\u786E\u5B9A",operation_cancel_title:"\u53D6\u6D88",operation_save_title:"\u4FDD\u5B58",operation_redo_title:"\u91CD\u505A",operation_undo_title:"\u64A4\u9500",operation_mosaic_title:"\u9A6C\u8D5B\u514B",operation_text_title:"\u6587\u672C",operation_brush_title:"\u753B\u7B14",operation_arrow_title:"\u7BAD\u5934",operation_ellipse_title:"\u692D\u5706",operation_rectangle_title:"\u77E9\u5F62"};var ve=b.default.createContext({store:{url:void 0,image:null,width:0,height:0,lang:Le,emiterRef:{current:{}},canvasContextRef:{current:null},history:{index:-1,stack:[]},bounds:null,cursor:"move",operation:void 0},dispatcher:{call:void 0,setHistory:void 0,setBounds:void 0,setCursor:void 0,setOperation:void 0}});function ce(){const{dispatcher:e}=i.useContext(ve);return e}function L(){const{store:e}=i.useContext(ve);return e}function J(){const{bounds:e}=L(),{setBounds:t}=ce(),n=i.useCallback(r=>{t==null||t(r)},[t]),c=i.useCallback(()=>{t==null||t(null)},[t]);return[e,{set:n,reset:c}]}function T(){const{lang:e}=L();return e}var Q="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsMagnifier/index.tsx";const K=100,Z=80;var Qe=i.memo(function({x:t,y:n}){const{width:c,height:r,image:o}=L(),s=T(),[a,m]=i.useState(null),d=i.useRef(null),l=i.useRef(null),u=i.useRef(null),[h,f]=i.useState("000000");return i.useLayoutEffect(()=>{if(!d.current)return;const g=d.current.getBoundingClientRect();let y=t+20,C=n+20;y+g.width>c&&(y=t-g.width-20),C+g.height>r&&(C=n-g.height-20),y<0&&(y=0),C<0&&(C=0),m({x:y,y:C})},[c,r,t,n]),i.useEffect(()=>{if(!o||!l.current){u.current=null;return}if(u.current||(u.current=l.current.getContext("2d")),!u.current)return;const g=u.current;g.clearRect(0,0,K,Z);const y=o.naturalWidth/c,C=o.naturalHeight/r;g.drawImage(o,t*y-K/2,n*C-Z/2,K,Z,0,0,K,Z);const{data:v}=g.getImageData(Math.floor(K/2),Math.floor(Z/2),1,1),R=Array.from(v.slice(0,3)).map(w=>w>=16?w.toString(16):`0${w.toString(16)}`).join("").toUpperCase();f(R)},[c,r,o,t,n]),b.default.createElement("div",{ref:d,className:"screenshots-magnifier",style:{transform:`translate(${a==null?void 0:a.x}px, ${a==null?void 0:a.y}px)`},__self:this,__source:{fileName:Q,lineNumber:89,columnNumber:5}},b.default.createElement("div",{className:"screenshots-magnifier-body",__self:this,__source:{fileName:Q,lineNumber:96,columnNumber:7}},b.default.createElement("canvas",{ref:l,className:"screenshots-magnifier-body-canvas",width:K,height:Z,__self:this,__source:{fileName:Q,lineNumber:97,columnNumber:9}})),b.default.createElement("div",{className:"screenshots-magnifier-footer",__self:this,__source:{fileName:Q,lineNumber:104,columnNumber:7}},b.default.createElement("div",{className:"screenshots-magnifier-footer-item",__self:this,__source:{fileName:Q,lineNumber:105,columnNumber:9}},s.magnifier_position_label,": (",t,",",n,")"),b.default.createElement("div",{className:"screenshots-magnifier-footer-item",__self:this,__source:{fileName:Q,lineNumber:108,columnNumber:9}},"RGB: #",h)))});function Ke({x:e,y:t},{x:n,y:c},r,o){return e>n&&([e,n]=[n,e]),t>c&&([t,c]=[c,t]),e<0&&(e=0),n>r&&(n=r),t<0&&(t=0),c>o&&(c=o),{x:e,y:t,width:n-e,height:c-t}}var pe="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsBackground/index.tsx",Ze=i.memo(function(){const{url:t,image:n,width:c,height:r}=L(),[o,s]=J(),a=i.useRef(null),m=i.useRef(null),d=i.useRef(!1),[l,u]=i.useState(null),h=i.useCallback((g,y)=>{if(!a.current)return;const{x:C,y:v}=a.current.getBoundingClientRect();s.set(Ke({x:g.x-C,y:g.y-v},{x:y.x-C,y:y.y-v},c,r))},[c,r,s]),f=i.useCallback(g=>{m.current||o||g.button!==0||(m.current={x:g.clientX,y:g.clientY},d.current=!1)},[o]);return i.useEffect(()=>{const g=C=>{if(a.current){const v=a.current.getBoundingClientRect();C.clientX<v.left||C.clientY<v.top||C.clientX>v.right||C.clientY>v.bottom?u(null):u({x:C.clientX-v.x,y:C.clientY-v.y})}!m.current||(h(m.current,{x:C.clientX,y:C.clientY}),d.current=!0)},y=C=>{!m.current||(d.current&&h(m.current,{x:C.clientX,y:C.clientY}),m.current=null,d.current=!1)};return window.addEventListener("mousemove",g),window.addEventListener("mouseup",y),()=>{window.removeEventListener("mousemove",g),window.removeEventListener("mouseup",y)}},[h]),i.useLayoutEffect(()=>{(!n||o)&&u(null)},[n,o]),!t||!n?null:b.default.createElement("div",{ref:a,className:"screenshots-background",onMouseDown:f,__self:this,__source:{fileName:pe,lineNumber:120,columnNumber:5}},b.default.createElement("img",{className:"screenshots-background-image",src:t,__self:this,__source:{fileName:pe,lineNumber:121,columnNumber:7}}),b.default.createElement("div",{className:"screenshots-background-mask",__self:this,__source:{fileName:pe,lineNumber:122,columnNumber:7}}),l&&!o&&b.default.createElement(Qe,{x:l==null?void 0:l.x,y:l==null?void 0:l.y,__self:this,__source:{fileName:pe,lineNumber:123,columnNumber:31}}))});function A(){const{cursor:e}=L(),{setCursor:t}=ce(),n=i.useCallback(r=>{t==null||t(r)},[t]),c=i.useCallback(()=>{t==null||t("move")},[t]);return[e,{set:n,reset:c}]}function ee(){const{emiterRef:e}=L(),t=i.useCallback((o,s)=>{const a=e.current;Array.isArray(a[o])?a[o].push(s):a[o]=[s]},[e]),n=i.useCallback((o,s)=>{const a=e.current;if(Array.isArray(a[o])){const m=a[o].findIndex(d=>d===s);m!==-1&&a[o].splice(m,1)}},[e]),c=i.useCallback((o,...s)=>{const a=e.current;Array.isArray(a[o])&&a[o].forEach(m=>m(...s))},[e]),r=i.useCallback(()=>{e.current={}},[e]);return{on:t,off:n,emit:c,reset:r}}function X(){const{history:e}=L(),{setHistory:t}=ce(),n=i.useCallback(l=>{const{index:u,stack:h}=e;h.forEach(f=>{f.type===B.Source&&(f.isSelected=!1)}),l.type===B.Source?l.isSelected=!0:l.type===B.Edit&&(l.source.isSelected=!0),h.splice(u+1),h.push(l),t==null||t({index:h.length-1,stack:h})},[e,t]),c=i.useCallback(()=>{const{stack:l}=e;l.pop(),t==null||t({index:l.length-1,stack:l})},[e,t]),r=i.useCallback(()=>{const{index:l,stack:u}=e,h=u[l];h&&(h.type===B.Source?h.isSelected=!1:h.type===B.Edit&&h.source.editHistory.pop()),t==null||t({index:l<=0?-1:l-1,stack:u})},[e,t]),o=i.useCallback(()=>{const{index:l,stack:u}=e,h=u[l+1];h&&(h.type===B.Source?h.isSelected=!1:h.type===B.Edit&&h.source.editHistory.push(h)),t==null||t({index:l>=u.length-1?u.length-1:l+1,stack:u})},[e,t]),s=i.useCallback(l=>{t==null||t(G({},l))},[t]),a=i.useCallback(l=>{e.stack.forEach(u=>{u.type===B.Source&&(u===l?u.isSelected=!0:u.isSelected=!1)}),t==null||t(G({},e))},[e,t]),m=i.useCallback(()=>{e.stack.forEach(l=>{l.type===B.Source&&(l.isSelected=!1)}),t==null||t(G({},e))},[e,t]),d=i.useCallback(()=>{t==null||t({index:-1,stack:[]})},[t]);return[{index:e.index,stack:e.stack,top:e.stack.slice(e.index,e.index+1)[0]},{push:n,pop:c,undo:r,redo:o,set:s,select:a,clearSelect:m,reset:d}]}function I(){const{operation:e}=L(),{setOperation:t}=ce(),n=i.useCallback(r=>{t==null||t(r)},[t]),c=i.useCallback(()=>{t==null||t(void 0)},[t]);return[e,{set:n,reset:c}]}function et({x:e,y:t},{x:n,y:c},r,o,s,a){return e>n&&([e,n]=[n,e]),t>c&&([t,c]=[c,t]),e<0&&(e=0,a==="move"&&(n=r.width)),n>o&&(n=o,a==="move"&&(e=n-r.width)),t<0&&(t=0,a==="move"&&(c=r.height)),c>s&&(c=s,a==="move"&&(t=c-r.height)),{x:e,y:t,width:Math.max(n-e,1),height:Math.max(c-t,1)}}function tt(e,t,n,c){const r=e.clientX-n.x,o=e.clientY-n.y;let s=c.x,a=c.y,m=c.x+c.width,d=c.y+c.height;switch(t){case"top":a+=o;break;case"top-right":m+=r,a+=o;break;case"right":m+=r;break;case"right-bottom":m+=r,d+=o;break;case"bottom":d+=o;break;case"bottom-left":s+=r,d+=o;break;case"left":s+=r;break;case"left-top":s+=r,a+=o;break;case"move":s+=r,a+=o,m+=r,d+=o;break}return[{x:s,y:a},{x:m,y:d}]}function nt(e,t,n,c){if(!t)return!1;const r=document.createElement("canvas");r.width=e.width,r.height=e.height;const o=r.getContext("2d");if(!o)return!1;const{left:s,top:a}=t.getBoundingClientRect(),m=c.clientX-s,d=c.clientY-a;return[...n.stack.slice(0,n.index+1)].reverse().find(u=>{var h;return u.type!==B.Source?!1:(o.clearRect(0,0,e.width,e.height),(h=u.isHit)==null?void 0:h.call(u,o,u,{x:m,y:d}))})}var V="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsCanvas/index.tsx";const st=["top","right","bottom","left"];var j;(function(e){e.ResizeTop="top",e.ResizetopRight="top-right",e.ResizeRight="right",e.ResizeRightBottom="right-bottom",e.ResizeBottom="bottom",e.ResizeBottomLeft="bottom-left",e.ResizeLeft="left",e.ResizeLeftTop="left-top",e.Move="move"})(j||(j={}));const rt=[j.ResizeTop,j.ResizetopRight,j.ResizeRight,j.ResizeRightBottom,j.ResizeBottom,j.ResizeBottomLeft,j.ResizeLeft,j.ResizeLeftTop];var ot=i.memo(i.forwardRef(function(t,n){const{url:c,image:r,width:o,height:s}=L(),a=ee(),[m]=X(),[d]=A(),[l,u]=J(),[h]=I(),f=i.useRef(),g=i.useRef(null),y=i.useRef(null),C=i.useRef(null),v=i.useRef(null),R=i.useCallback(()=>{if(!l||!v.current)return;const p=v.current;p.imageSmoothingEnabled=!0,p.imageSmoothingQuality="low",p.clearRect(0,0,l.width,l.height),m.stack.slice(0,m.index+1).forEach(x=>{x.type===B.Source&&x.draw(p,x)})},[l,v,m]),w=i.useCallback((p,x)=>{if(!(p.button!==0||!l))if(!h)f.current=x,g.current={x:p.clientX,y:p.clientY},y.current={x:l.x,y:l.y,width:l.width,height:l.height};else{const N=nt(l,C.current,m,p.nativeEvent);N?a.emit("drawselect",N,p.nativeEvent):a.emit("mousedown",p.nativeEvent)}},[l,h,a,m]),_=i.useCallback(p=>{if(!f.current||!g.current||!y.current||!l)return;const x=tt(p,f.current,g.current,y.current);u.set(et(x[0],x[1],l,o,s,f.current))},[o,s,l,u]);return i.useLayoutEffect(()=>{if(!r||!l||!C.current){v.current=null;return}v.current||(v.current=C.current.getContext("2d")),R()},[r,l,R]),i.useEffect(()=>{const p=N=>{if(h)a.emit("mousemove",N);else{if(!f.current||!g.current||!y.current)return;_(N)}},x=N=>{if(h)a.emit("mouseup",N);else{if(!f.current||!g.current||!y.current)return;_(N),f.current=void 0,g.current=null,y.current=null}};return window.addEventListener("mousemove",p),window.addEventListener("mouseup",x),()=>{window.removeEventListener("mousemove",p),window.removeEventListener("mouseup",x)}},[_,h,a]),i.useImperativeHandle(n,()=>v.current),b.default.createElement("div",{className:"screenshots-canvas",style:{width:(l==null?void 0:l.width)||0,height:(l==null?void 0:l.height)||0,transform:l?`translate(${l.x}px, ${l.y}px)`:"none"},__self:this,__source:{fileName:V,lineNumber:173,columnNumber:7}},b.default.createElement("div",{className:"screenshots-canvas-body",__self:this,__source:{fileName:V,lineNumber:181,columnNumber:9}},b.default.createElement("img",{className:"screenshots-canvas-image",src:c,style:{width:o,height:s,transform:l?`translate(${-l.x}px, ${-l.y}px)`:"none"},__self:this,__source:{fileName:V,lineNumber:183,columnNumber:11}}),b.default.createElement("canvas",{ref:C,className:"screenshots-canvas-panel",width:(l==null?void 0:l.width)||0,height:(l==null?void 0:l.height)||0,__self:this,__source:{fileName:V,lineNumber:192,columnNumber:11}})),b.default.createElement("div",{className:"screenshots-canvas-mask",style:{cursor:d},onMouseDown:p=>w(p,"move"),__self:this,__source:{fileName:V,lineNumber:199,columnNumber:9}}),st.map(p=>b.default.createElement("div",{key:p,className:`screenshots-canvas-border-${p}`,__self:this,__source:{fileName:V,lineNumber:207,columnNumber:18}})),rt.map(p=>b.default.createElement("div",{key:p,className:`screenshots-canvas-point-${p}`,onMouseDown:x=>w(x,p),__self:this,__source:{fileName:V,lineNumber:211,columnNumber:13}})))}));function ye(){const e=ce();return i.useCallback((n,...c)=>{var r;(r=e.call)==null||r.call(e,n,...c)},[e])}function W(){const{canvasContextRef:e}=L();return e}function Ne(){const e=ee(),[,t]=J(),[,n]=A(),[,c]=X(),[,r]=I();return i.useCallback(()=>{e.reset(),c.reset(),t.reset(),n.reset(),r.reset()},[e,c,t,n,r])}var Ce="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsOption/index.tsx",q;(function(e){e.Bottom="bottom",e.Top="top"})(q||(q={}));var ct=i.memo(function({open:t,content:n,children:c}){var y,C;const r=i.useRef(null),o=i.useRef(null),s=i.useRef(null),a=i.useContext(We),[m,d]=i.useState(q.Bottom),[l,u]=i.useState(null),[h,f]=i.useState(0),g=()=>(o.current||(o.current=document.createElement("div")),o.current);return i.useEffect(()=>{const v=g();return t&&document.body.appendChild(v),()=>{v.remove()}},[t]),i.useEffect(()=>{if(!t||!a||!r.current||!s.current)return;const v=r.current.getBoundingClientRect(),R=s.current.getBoundingClientRect();let w=m,_=v.left+v.width/2,p=v.top+v.height,x=h;if(_+R.width/2>a.x+a.width){const N=_;_=a.x+a.width-R.width/2,x=N-_}if(_<a.x+R.width/2){const N=_;_=a.x+R.width/2,x=N-_}p>window.innerHeight-R.height&&(w===q.Bottom&&(w=q.Top),p=v.top-R.height),p<0&&(w===q.Top&&(w=q.Bottom),p=v.top+v.height),w!==m&&d(w),((l==null?void 0:l.x)!==_||l.y!==p)&&u({x:_,y:p}),x!==h&&f(x)}),b.default.createElement(b.default.Fragment,null,i.cloneElement(c,{ref:r}),t&&n&&$e.createPortal(b.default.createElement("div",{ref:s,className:"screenshots-option",style:{visibility:l?"visible":"hidden",transform:`translate(${(y=l==null?void 0:l.x)!=null?y:0}px, ${(C=l==null?void 0:l.y)!=null?C:0}px)`},"data-placement":m,__self:this,__source:{fileName:Ce,lineNumber:111,columnNumber:11}},b.default.createElement("div",{className:"screenshots-option-container",__self:this,__source:{fileName:Ce,lineNumber:120,columnNumber:13}},n),b.default.createElement("div",{className:"screenshots-option-arrow",style:{marginLeft:h},__self:this,__source:{fileName:Ce,lineNumber:121,columnNumber:13}})),g()))});var Se="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsButton/index.tsx",P=i.memo(function({title:t,icon:n,checked:c,disabled:r,option:o,onClick:s}){const a=["screenshots-button"],m=i.useCallback(d=>{r||!s||s(d)},[r,s]);return c&&a.push("screenshots-button-checked"),r&&a.push("screenshots-button-disabled"),b.default.createElement(ct,{open:c,content:o,__self:this,__source:{fileName:Se,lineNumber:42,columnNumber:5}},b.default.createElement("div",{className:a.join(" "),title:t,onClick:m,__self:this,__source:{fileName:Se,lineNumber:43,columnNumber:7}},b.default.createElement("span",{className:n,__self:this,__source:{fileName:Se,lineNumber:44,columnNumber:9}})))}),it="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Ok/index.tsx";function at(){const{image:e,width:t,height:n,history:c,bounds:r,lang:o}=L(),s=W(),[,a]=X(),m=ye(),d=Ne(),l=i.useCallback(()=>{a.clearSelect(),setTimeout(()=>{!s.current||!e||!r||de({image:e,width:t,height:n,history:c,bounds:r}).then(u=>{m("onOk",u,r),d()})})},[s,a,e,t,n,c,r,m,d]);return b.default.createElement(P,{title:o.operation_ok_title,icon:"icon-ok",onClick:l,__self:this,__source:{fileName:it,lineNumber:36,columnNumber:10}})}var lt="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Cancel/index.tsx";function ut(){const e=ye(),t=Ne(),n=T(),c=i.useCallback(()=>{e("onCancel"),t()},[e,t]);return b.default.createElement(P,{title:n.operation_cancel_title,icon:"icon-cancel",onClick:c,__self:this,__source:{fileName:lt,lineNumber:17,columnNumber:10}})}var ft="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Save/index.tsx";function ht(){const{image:e,width:t,height:n,history:c,bounds:r,lang:o}=L(),s=W(),[,a]=X(),m=ye(),d=Ne(),l=i.useCallback(()=>{a.clearSelect(),setTimeout(()=>{!s.current||!e||!r||de({image:e,width:t,height:n,history:c,bounds:r}).then(u=>{m("onSave",u,r),d()})})},[s,a,e,t,n,c,r,m,d]);return b.default.createElement(P,{title:o.operation_save_title,icon:"icon-save",onClick:l,__self:this,__source:{fileName:ft,lineNumber:36,columnNumber:10}})}var mt="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Redo/index.tsx";function dt(){const e=T(),[t,n]=X(),c=i.useCallback(()=>{n.redo()},[n]);return b.default.createElement(P,{title:e.operation_redo_title,icon:"icon-redo",disabled:!t.stack.length||t.stack.length-1===t.index,onClick:c,__self:this,__source:{fileName:mt,lineNumber:15,columnNumber:5}})}var pt="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Undo/index.tsx";function gt(){const e=T(),[t,n]=X(),c=i.useCallback(()=>{n.undo()},[n]);return b.default.createElement(P,{title:e.operation_undo_title,icon:"icon-undo",disabled:t.index===-1,onClick:c,__self:this,__source:{fileName:pt,lineNumber:15,columnNumber:5}})}var Re="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsSize/index.tsx",He=i.memo(function({value:t,onChange:n}){const c=[3,6,9];return b.default.createElement("div",{className:"screenshots-size",__self:this,__source:{fileName:Re,lineNumber:12,columnNumber:5}},c.map(r=>{const o=["screenshots-size-item"];return r===t&&o.push("screenshots-size-active"),b.default.createElement("div",{key:r,className:o.join(" "),onClick:()=>n&&n(r),__self:this,__source:{fileName:Re,lineNumber:21,columnNumber:11}},b.default.createElement("div",{className:"screenshots-size-pointer",style:{width:r*1.8,height:r*1.8},__self:this,__source:{fileName:Re,lineNumber:22,columnNumber:13}}))}))});function te(e){const t=ee();i.useEffect(()=>(t.on("mousedown",e),()=>{t.off("mousedown",e)}),[e,t])}function ne(e){const t=ee();i.useEffect(()=>(t.on("mousemove",e),()=>{t.off("mousemove",e)}),[e,t])}function se(e){const t=ee();i.useEffect(()=>(t.on("mouseup",e),()=>{t.off("mouseup",e)}),[e,t])}var Xe="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Mosaic/index.tsx";function ge(e,t,n){if(!n)return[0,0,0,0];const{data:c,width:r}=n,o=t*r*4+e*4;return Array.from(c.slice(o,o+4))}function _t(e,t){const{tiles:n,size:c}=t.data;n.forEach(r=>{const o=Math.round(r.color[0]),s=Math.round(r.color[1]),a=Math.round(r.color[2]),m=r.color[3]/255;e.fillStyle=`rgba(${o}, ${s}, ${a}, ${m})`,e.fillRect(r.x-c/2,r.y-c/2,c,c)})}function bt(){const e=T(),{image:t,width:n,height:c}=L(),[r,o]=I(),s=W(),[a,m]=X(),[d]=J(),[,l]=A(),[u,h]=i.useState(3),f=i.useRef(null),g=i.useRef(null),y=r==="Mosaic",C=i.useCallback(()=>{o.set("Mosaic"),l.set("crosshair")},[o,l]),v=i.useCallback(()=>{y||(C(),m.clearSelect())},[y,C,m]),R=i.useCallback(p=>{if(!y||g.current||!f.current||!s.current)return;const x=s.current.canvas.getBoundingClientRect(),N=p.clientX-x.x,k=p.clientY-x.y,E=u*2;g.current={name:"Mosaic",type:B.Source,data:{size:E,tiles:[{x:N,y:k,color:ge(N,k,f.current)}]},editHistory:[],draw:_t}},[y,u,s]),w=i.useCallback(p=>{if(!y||!g.current||!s.current||!f.current)return;const x=s.current.canvas.getBoundingClientRect(),N=p.clientX-x.x,k=p.clientY-x.y,E=g.current.data.size,z=g.current.data.tiles;let S=z[z.length-1];if(!S)z.push({x:N,y:k,color:ge(N,k,f.current)});else{const U=S.x-N,D=S.y-k;let H=Math.sqrt(U**2+D**2);const be=-D/H,xe=-U/H;for(;H>E;){const re=Math.floor(S.x+E*xe),oe=Math.floor(S.y+E*be);S={x:re,y:oe,color:ge(re,oe,f.current)},z.push(S),H-=E}H>E/2&&z.push({x:N,y:k,color:ge(N,k,f.current)})}a.top!==g.current?m.push(g.current):m.set(a)},[y,s,a,m]),_=i.useCallback(()=>{!y||(g.current=null)},[y]);return te(R),ne(w),se(_),i.useEffect(()=>{if(!d||!t||!y)return;const p=document.createElement("canvas"),x=p.getContext("2d");if(!x)return;p.width=d.width,p.height=d.height;const N=t.naturalWidth/n,k=t.naturalHeight/c;x.drawImage(t,d.x*N,d.y*k,d.width*N,d.height*k,0,0,d.width,d.height),f.current=x.getImageData(0,0,d.width,d.height)},[n,c,d,t,y]),b.default.createElement(P,{title:e.operation_mosaic_title,icon:"icon-mosaic",checked:y,onClick:v,option:b.default.createElement(He,{value:u,onChange:h,__self:this,__source:{fileName:Xe,lineNumber:220,columnNumber:15}}),__self:this,__source:{fileName:Xe,lineNumber:215,columnNumber:5}})}var Pe="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsColor/index.tsx",xt=i.memo(function({value:t,onChange:n}){const c=["#ee5126","#fceb4d","#90e746","#51c0fa","#7a7a7a","#ffffff"];return b.default.createElement("div",{className:"screenshots-color",__self:this,__source:{fileName:Pe,lineNumber:12,columnNumber:5}},c.map(r=>{const o=["screenshots-color-item"];return r===t&&o.push("screenshots-color-active"),b.default.createElement("div",{key:r,className:o.join(" "),style:{backgroundColor:r},onClick:()=>n&&n(r),__self:this,__source:{fileName:Pe,lineNumber:19,columnNumber:11}})}))});var ke="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsSizeColor/index.tsx",ie=i.memo(function({size:t,color:n,onSizeChange:c,onColorChange:r}){return b.default.createElement("div",{className:"screenshots-sizecolor",__self:this,__source:{fileName:ke,lineNumber:20,columnNumber:5}},b.default.createElement(He,{value:t,onChange:c,__self:this,__source:{fileName:ke,lineNumber:21,columnNumber:7}}),b.default.createElement(xt,{value:n,onChange:r,__self:this,__source:{fileName:ke,lineNumber:22,columnNumber:7}}))});const vt=`
2
- min-width: 0 !important;
3
- width: 0 !important;
4
- min-height: 0 !important;
5
- height:0 !important;
6
- visibility: hidden !important;
7
- overflow: hidden !important;
8
- position: absolute !important;
9
- z-index: -1000 !important;
10
- top:0 !important;
11
- right:0 !important;
12
- `,yt=["letter-spacing","line-height","padding-top","padding-bottom","font-family","font-weight","font-size","font-variant","text-rendering","text-transform","text-indent","padding-left","padding-right","border-width","box-sizing","white-space","word-break"];let O;function Nt(e){const t=window.getComputedStyle(e),n=t.getPropertyValue("box-sizing")||t.getPropertyValue("-moz-box-sizing")||t.getPropertyValue("-webkit-box-sizing"),c=parseFloat(t.getPropertyValue("padding-bottom"))+parseFloat(t.getPropertyValue("padding-top")),r=parseFloat(t.getPropertyValue("border-bottom-width"))+parseFloat(t.getPropertyValue("border-top-width"));return{sizingStyle:yt.map(s=>`${s}:${t.getPropertyValue(s)}`).join(";"),paddingSize:c,borderSize:r,boxSizing:n}}function Ct(e,t,n,c){O||(O=document.createElement("textarea"),O.setAttribute("tab-index","-1"),document.body.appendChild(O));const{paddingSize:r,borderSize:o,boxSizing:s,sizingStyle:a}=Nt(e);O.setAttribute("style",`${a};${vt};max-width:${n}px;max-height:${c}px`),O.value=t||" ";let m=O.scrollWidth,d=O.scrollHeight;return s==="border-box"?(m+=o,d+=o):s==="content-box"&&(m-=r,d-=r),{width:Math.min(m,n),height:Math.min(d,c)}}var St="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsTextarea/index.tsx",Rt=i.memo(function({x:t,y:n,maxWidth:c,maxHeight:r,size:o,color:s,value:a,onChange:m,onBlur:d}){const l=i.useRef(null),u=i.useRef(null),[h,f]=i.useState(0),[g,y]=i.useState(0),C=()=>(l.current||(l.current=document.createElement("div")),l.current);return i.useLayoutEffect(()=>(l.current&&(document.body.appendChild(l.current),requestAnimationFrame(()=>{var v;(v=u.current)==null||v.focus()})),()=>{var v;(v=l.current)==null||v.remove()}),[]),i.useLayoutEffect(()=>{if(!u.current)return;const{width:v,height:R}=Ct(u.current,a,c,r);f(v),y(R)},[a,c,r]),$e.createPortal(b.default.createElement("textarea",{ref:u,className:"screenshots-textarea",style:{color:s,width:h,height:g,maxWidth:c,maxHeight:r,fontSize:o,lineHeight:`${o}px`,transform:`translate(${t}px, ${n}px)`},value:a,onChange:v=>m&&m(v.target.value),onBlur:v=>d&&d(v),__self:this,__source:{fileName:St,lineNumber:65,columnNumber:5}}),C())});function ae(e){const t=ee();i.useEffect(()=>(t.on("drawselect",e),()=>{t.off("drawselect",e)}),[e,t])}var we="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Text/index.tsx";const ze={3:18,6:32,9:46};function kt(e,t){const{size:n,color:c,fontFamily:r,x:o,y:s,text:a}=t.data;e.fillStyle=c,e.textAlign="left",e.textBaseline="top",e.font=`${n}px ${r}`;const m=t.editHistory.reduce((d,{data:l})=>({x:d.x+l.x2-l.x1,y:d.y+l.y2-l.y1}),{x:0,y:0});a.split(`
13
- `).forEach((d,l)=>{e.fillText(d,o+m.x,s+m.y+l*n)})}function wt(e,t,n){e.textAlign="left",e.textBaseline="top",e.font=`${t.data.size}px ${t.data.fontFamily}`;let c=0,r=0;t.data.text.split(`
14
- `).forEach(u=>{const h=e.measureText(u);c<h.width&&(c=h.width),r+=t.data.size});const{x:o,y:s}=t.editHistory.reduce((u,{data:h})=>({x:u.x+h.x2-h.x1,y:u.y+h.y2-h.y1}),{x:0,y:0}),a=t.data.x+o,m=t.data.y+s,d=a+c,l=m+r;return n.x>=a&&n.x<=d&&n.y>=m&&n.y<=l}function zt(){const e=T(),[t,n]=X(),[c]=J(),[r,o]=I(),[,s]=A(),a=W(),[m,d]=i.useState(3),[l,u]=i.useState("#ee5126"),h=i.useRef(null),f=i.useRef(null),[g,y]=i.useState(null),[C,v]=i.useState(""),R=r==="Text",w=i.useCallback(()=>{o.set("Text"),s.set("default")},[o,s]),_=i.useCallback(()=>{R||(w(),n.clearSelect())},[R,w,n]),p=i.useCallback(D=>{h.current&&(h.current.data.size=ze[D]),d(D)},[]),x=i.useCallback(D=>{h.current&&(h.current.data.color=D),u(D)},[]),N=i.useCallback(D=>{v(D),R&&h.current&&(h.current.data.text=D)},[R]),k=i.useCallback(()=>{h.current&&h.current.data.text&&n.push(h.current),h.current=null,v(""),y(null)},[n]),E=i.useCallback((D,H)=>{D.name==="Text"&&(w(),f.current={type:B.Edit,data:{x1:H.clientX,y1:H.clientY,x2:H.clientX,y2:H.clientY},source:D},n.select(D))},[w,n]),z=i.useCallback(D=>{if(!R||!a.current||h.current||!c)return;const{left:H,top:be}=a.current.canvas.getBoundingClientRect(),xe=window.getComputedStyle(a.current.canvas).fontFamily,re=D.clientX-H,oe=D.clientY-be;h.current={name:"Text",type:B.Source,data:{size:ze[m],color:l,fontFamily:xe,x:re,y:oe,text:""},editHistory:[],draw:kt,isHit:wt},y({x:D.clientX,y:D.clientY,maxWidth:c.width-re,maxHeight:c.height-oe})},[R,m,l,c,a]),S=i.useCallback(D=>{!R||f.current&&(f.current.data.x2=D.clientX,f.current.data.y2=D.clientY,t.top!==f.current?(f.current.source.editHistory.push(f.current),n.push(f.current)):n.set(t))},[R,t,n]),U=i.useCallback(()=>{!R||(f.current=null)},[R]);return ae(E),te(z),ne(S),se(U),b.default.createElement(b.default.Fragment,null,b.default.createElement(P,{title:e.operation_text_title,icon:"icon-text",checked:R,onClick:_,option:b.default.createElement(ie,{size:m,color:l,onSizeChange:p,onColorChange:x,__self:this,__source:{fileName:we,lineNumber:261,columnNumber:11}}),__self:this,__source:{fileName:we,lineNumber:255,columnNumber:7}}),R&&g&&b.default.createElement(Rt,{x:g.x,y:g.y,maxWidth:g.maxWidth,maxHeight:g.maxHeight,size:ze[m],color:l,value:C,onChange:N,onBlur:k,__self:this,__source:{fileName:we,lineNumber:265,columnNumber:9}}))}const Ye=4;function M(e,t,n){e.lineWidth=1,e.strokeStyle="#000000",e.fillStyle="#ffffff",e.beginPath(),e.arc(t,n,Ye,0,2*Math.PI),e.fill(),e.stroke()}function _e(e,t,n){t.draw(e,t);const{data:c}=e.getImageData(n.x,n.y,1,1);return c.some(r=>r!==0)}function $(e,t,n){if(!e)return!1;const{left:c,top:r}=e.getBoundingClientRect(),o=t.clientX-c,s=t.clientY-r;return(n.x-o)**2+(n.y-s)**2<Ye**2}function Et(e,t){const{size:n,color:c,points:r}=t.data;e.lineCap="round",e.lineJoin="round",e.lineWidth=n,e.strokeStyle=c;const o=t.editHistory.reduce((s,{data:a})=>({x:s.x+a.x2-a.x1,y:s.y+a.y2-a.y1}),{x:0,y:0});e.beginPath(),r.forEach((s,a)=>{a===0?e.moveTo(s.x+o.x,s.y+o.y):e.lineTo(s.x+o.x,s.y+o.y)}),e.stroke(),t.isSelected&&(e.lineWidth=1,e.strokeStyle="#000000",e.beginPath(),r.forEach((s,a)=>{a===0?e.moveTo(s.x+o.x,s.y+o.y):e.lineTo(s.x+o.x,s.y+o.y)}),e.stroke())}var Fe="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Brush/index.tsx";function Bt(){const e=T(),[,t]=A(),[n,c]=I(),r=W(),[o,s]=X(),[a,m]=i.useState(3),[d,l]=i.useState("#ee5126"),u=i.useRef(null),h=i.useRef(null),f=n==="Brush",g=i.useCallback(()=>{c.set("Brush"),t.set("default")},[c,t]),y=i.useCallback(()=>{f||(g(),s.clearSelect())},[f,g,s]),C=i.useCallback((_,p)=>{_.name==="Brush"&&(g(),h.current={type:B.Edit,data:{x1:p.clientX,y1:p.clientY,x2:p.clientX,y2:p.clientY},source:_},s.select(_))},[g,s]),v=i.useCallback(_=>{if(!f||u.current||!r.current)return;const{left:p,top:x}=r.current.canvas.getBoundingClientRect();u.current={name:"Brush",type:B.Source,data:{size:a,color:d,points:[{x:_.clientX-p,y:_.clientY-x}]},editHistory:[],draw:Et,isHit:_e}},[f,r,a,d]),R=i.useCallback(_=>{if(!(!f||!r.current)){if(h.current)h.current.data.x2=_.clientX,h.current.data.y2=_.clientY,o.top!==h.current?(h.current.source.editHistory.push(h.current),s.push(h.current)):s.set(o);else if(u.current){const{left:p,top:x}=r.current.canvas.getBoundingClientRect();u.current.data.points.push({x:_.clientX-p,y:_.clientY-x}),o.top!==u.current?s.push(u.current):s.set(o)}}},[f,o,r,s]),w=i.useCallback(()=>{!f||(u.current&&s.clearSelect(),u.current=null,h.current=null)},[f,s]);return ae(C),te(v),ne(R),se(w),b.default.createElement(P,{title:e.operation_brush_title,icon:"icon-brush",checked:f,onClick:y,option:b.default.createElement(ie,{size:a,color:d,onSizeChange:m,onColorChange:l,__self:this,__source:{fileName:Fe,lineNumber:166,columnNumber:15}}),__self:this,__source:{fileName:Fe,lineNumber:161,columnNumber:5}})}function Te(e){let{x1:t,y1:n,x2:c,y2:r}=e.data;return e.editHistory.forEach(({data:o})=>{const s=o.x2-o.x1,a=o.y2-o.y1;o.type===le.Move?(t+=s,n+=a,c+=s,r+=a):o.type===le.MoveStart?(t+=s,n+=a):o.type===le.MoveEnd&&(c+=s,r+=a)}),me(G({},e.data),{x1:t,x2:c,y1:n,y2:r})}function Dt(e,t){const{size:n,color:c,x1:r,x2:o,y1:s,y2:a}=Te(t);e.lineCap="round",e.lineJoin="bevel",e.lineWidth=n,e.strokeStyle=c;const m=o-r,d=a-s,l=n*3,u=Math.atan2(d,m);e.beginPath(),e.moveTo(r,s),e.lineTo(o,a),e.lineTo(o-l*Math.cos(u-Math.PI/6),a-l*Math.sin(u-Math.PI/6)),e.moveTo(o,a),e.lineTo(o-l*Math.cos(u+Math.PI/6),a-l*Math.sin(u+Math.PI/6)),e.stroke(),t.isSelected&&(M(e,r,s),M(e,o,a))}var je="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Arrow/index.tsx",le;(function(e){e[e.Move=0]="Move",e[e.MoveStart=1]="MoveStart",e[e.MoveEnd=2]="MoveEnd"})(le||(le={}));function Mt(){const e=T(),[,t]=A(),[n,c]=I(),[r,o]=X(),s=W(),[a,m]=i.useState(3),[d,l]=i.useState("#ee5126"),u=i.useRef(null),h=i.useRef(null),f=n==="Arrow",g=i.useCallback(()=>{c.set("Arrow"),t.set("default")},[c,t]),y=i.useCallback(()=>{f||(g(),o.clearSelect())},[f,g,o]),C=i.useCallback((_,p)=>{if(_.name!=="Arrow"||!s.current)return;const x=_;g();const{x1:N,y1:k,x2:E,y2:z}=Te(x);let S=0;$(s.current.canvas,p,{x:N,y:k})?S=1:$(s.current.canvas,p,{x:E,y:z})&&(S=2),h.current={type:B.Edit,data:{type:S,x1:p.clientX,y1:p.clientY,x2:p.clientX,y2:p.clientY},source:x},o.select(_)},[s,g,o]),v=i.useCallback(_=>{if(!f||u.current||!s.current)return;const{left:p,top:x}=s.current.canvas.getBoundingClientRect();u.current={name:"Arrow",type:B.Source,data:{size:a,color:d,x1:_.clientX-p,y1:_.clientY-x,x2:_.clientX-p,y2:_.clientY-x},editHistory:[],draw:Dt,isHit:_e}},[f,d,a,s]),R=i.useCallback(_=>{if(!(!f||!s.current)){if(h.current)h.current.data.x2=_.clientX,h.current.data.y2=_.clientY,r.top!==h.current?(h.current.source.editHistory.push(h.current),o.push(h.current)):o.set(r);else if(u.current){const{left:p,top:x}=s.current.canvas.getBoundingClientRect();u.current.data.x2=_.clientX-p,u.current.data.y2=_.clientY-x,r.top!==u.current?o.push(u.current):o.set(r)}}},[f,r,s,o]),w=i.useCallback(()=>{!f||(u.current&&o.clearSelect(),u.current=null,h.current=null)},[f,o]);return ae(C),te(v),ne(R),se(w),b.default.createElement(P,{title:e.operation_arrow_title,icon:"icon-arrow",checked:f,onClick:y,option:b.default.createElement(ie,{size:a,color:d,onSizeChange:m,onColorChange:l,__self:this,__source:{fileName:je,lineNumber:190,columnNumber:15}}),__self:this,__source:{fileName:je,lineNumber:185,columnNumber:5}})}function Ue(e){let{x1:t,y1:n,x2:c,y2:r}=e.data;return e.editHistory.forEach(({data:o})=>{const s=o.x2-o.x1,a=o.y2-o.y1;o.type===Y.Move?(t+=s,n+=a,c+=s,r+=a):o.type===Y.ResizeTop?n+=a:o.type===Y.ResizeRightTop?(c+=s,n+=a):o.type===Y.ResizeRight?c+=s:o.type===Y.ResizeRightBottom?(c+=s,r+=a):o.type===Y.ResizeBottom?r+=a:o.type===Y.ResizeLeftBottom?(t+=s,r+=a):o.type===Y.ResizeLeft?t+=s:o.type===Y.ResizeLeftTop&&(t+=s,n+=a)}),me(G({},e.data),{x1:t,x2:c,y1:n,y2:r})}function $t(e,t){const{size:n,color:c,x1:r,y1:o,x2:s,y2:a}=Ue(t);e.lineCap="butt",e.lineJoin="miter",e.lineWidth=n,e.strokeStyle=c;const m=(r+s)/2,d=(o+a)/2,l=Math.abs(s-r)/2,u=Math.abs(a-o)/2,h=.5522848,f=l*h,g=u*h;e.beginPath(),e.moveTo(m-l,d),e.bezierCurveTo(m-l,d-g,m-f,d-u,m,d-u),e.bezierCurveTo(m+f,d-u,m+l,d-g,m+l,d),e.bezierCurveTo(m+l,d+g,m+f,d+u,m,d+u),e.bezierCurveTo(m-f,d+u,m-l,d+g,m-l,d),e.closePath(),e.stroke(),t.isSelected&&(e.lineWidth=1,e.strokeStyle="#000000",e.fillStyle="#ffffff",e.beginPath(),e.moveTo(r,o),e.lineTo(s,o),e.lineTo(s,a),e.lineTo(r,a),e.closePath(),e.stroke(),M(e,(r+s)/2,o),M(e,s,o),M(e,s,(o+a)/2),M(e,s,a),M(e,(r+s)/2,a),M(e,r,a),M(e,r,(o+a)/2),M(e,r,o))}var Ge="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Ellipse/index.tsx",Y;(function(e){e[e.Move=0]="Move",e[e.ResizeTop=1]="ResizeTop",e[e.ResizeRightTop=2]="ResizeRightTop",e[e.ResizeRight=3]="ResizeRight",e[e.ResizeRightBottom=4]="ResizeRightBottom",e[e.ResizeBottom=5]="ResizeBottom",e[e.ResizeLeftBottom=6]="ResizeLeftBottom",e[e.ResizeLeft=7]="ResizeLeft",e[e.ResizeLeftTop=8]="ResizeLeftTop"})(Y||(Y={}));function Lt(){const e=T(),[t,n]=X(),[c,r]=I(),[,o]=A(),s=W(),[a,m]=i.useState(3),[d,l]=i.useState("#ee5126"),u=i.useRef(null),h=i.useRef(null),f=c==="Ellipse",g=i.useCallback(()=>{r.set("Ellipse"),o.set("crosshair")},[r,o]),y=i.useCallback(()=>{f||(g(),n.clearSelect())},[f,g,n]),C=i.useCallback((_,p)=>{if(_.name!=="Ellipse"||!s.current)return;const x=_;g();const{x1:N,y1:k,x2:E,y2:z}=Ue(x);let S=0;$(s.current.canvas,p,{x:(N+E)/2,y:k})?S=1:$(s.current.canvas,p,{x:E,y:k})?S=2:$(s.current.canvas,p,{x:E,y:(k+z)/2})?S=3:$(s.current.canvas,p,{x:E,y:z})?S=4:$(s.current.canvas,p,{x:(N+E)/2,y:z})?S=5:$(s.current.canvas,p,{x:N,y:z})?S=6:$(s.current.canvas,p,{x:N,y:(k+z)/2})?S=7:$(s.current.canvas,p,{x:N,y:k})&&(S=8),h.current={type:B.Edit,data:{type:S,x1:p.clientX,y1:p.clientY,x2:p.clientX,y2:p.clientY},source:x},n.select(_)},[s,g,n]),v=i.useCallback(_=>{if(!f||!s.current||u.current)return;const{left:p,top:x}=s.current.canvas.getBoundingClientRect(),N=_.clientX-p,k=_.clientY-x;u.current={name:"Ellipse",type:B.Source,data:{size:a,color:d,x1:N,y1:k,x2:N,y2:k},editHistory:[],draw:$t,isHit:_e}},[f,a,d,s]),R=i.useCallback(_=>{if(!(!f||!s.current)){if(h.current)h.current.data.x2=_.clientX,h.current.data.y2=_.clientY,t.top!==h.current?(h.current.source.editHistory.push(h.current),n.push(h.current)):n.set(t);else if(u.current){const{left:p,top:x}=s.current.canvas.getBoundingClientRect();u.current.data.x2=_.clientX-p,u.current.data.y2=_.clientY-x,t.top!==u.current?n.push(u.current):n.set(t)}}},[f,s,t,n]),w=i.useCallback(()=>{!f||(u.current&&n.clearSelect(),u.current=null,h.current=null)},[f,n]);return ae(C),te(v),ne(R),se(w),b.default.createElement(P,{title:e.operation_ellipse_title,icon:"icon-ellipse",checked:f,onClick:y,option:b.default.createElement(ie,{size:a,color:d,onSizeChange:m,onColorChange:l,__self:this,__source:{fileName:Ge,lineNumber:242,columnNumber:15}}),__self:this,__source:{fileName:Ge,lineNumber:237,columnNumber:5}})}function Ae(e){let{x1:t,y1:n,x2:c,y2:r}=e.data;return e.editHistory.forEach(({data:o})=>{const s=o.x2-o.x1,a=o.y2-o.y1;o.type===F.Move?(t+=s,n+=a,c+=s,r+=a):o.type===F.ResizeTop?n+=a:o.type===F.ResizeRightTop?(c+=s,n+=a):o.type===F.ResizeRight?c+=s:o.type===F.ResizeRightBottom?(c+=s,r+=a):o.type===F.ResizeBottom?r+=a:o.type===F.ResizeLeftBottom?(t+=s,r+=a):o.type===F.ResizeLeft?t+=s:o.type===F.ResizeLeftTop&&(t+=s,n+=a)}),me(G({},e.data),{x1:t,x2:c,y1:n,y2:r})}function Ht(e,t){const{size:n,color:c,x1:r,y1:o,x2:s,y2:a}=Ae(t);e.lineCap="butt",e.lineJoin="miter",e.lineWidth=n,e.strokeStyle=c,e.beginPath(),e.moveTo(r,o),e.lineTo(s,o),e.lineTo(s,a),e.lineTo(r,a),e.closePath(),e.stroke(),t.isSelected&&(e.lineWidth=1,e.strokeStyle="#000000",e.fillStyle="#ffffff",M(e,(r+s)/2,o),M(e,s,o),M(e,s,(o+a)/2),M(e,s,a),M(e,(r+s)/2,a),M(e,r,a),M(e,r,(o+a)/2),M(e,r,o))}var Ie="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/operations/Rectangle/index.tsx",F;(function(e){e[e.Move=0]="Move",e[e.ResizeTop=1]="ResizeTop",e[e.ResizeRightTop=2]="ResizeRightTop",e[e.ResizeRight=3]="ResizeRight",e[e.ResizeRightBottom=4]="ResizeRightBottom",e[e.ResizeBottom=5]="ResizeBottom",e[e.ResizeLeftBottom=6]="ResizeLeftBottom",e[e.ResizeLeft=7]="ResizeLeft",e[e.ResizeLeftTop=8]="ResizeLeftTop"})(F||(F={}));function Xt(){const e=T(),[t,n]=X(),[c,r]=I(),[,o]=A(),s=W(),[a,m]=i.useState(3),[d,l]=i.useState("#ee5126"),u=i.useRef(null),h=i.useRef(null),f=c==="Rectangle",g=i.useCallback(()=>{r.set("Rectangle"),o.set("crosshair")},[r,o]),y=i.useCallback(()=>{f||(g(),n.clearSelect())},[f,g,n]),C=i.useCallback((_,p)=>{if(_.name!=="Rectangle"||!s.current)return;const x=_;g();const{x1:N,y1:k,x2:E,y2:z}=Ae(x);let S=0;$(s.current.canvas,p,{x:(N+E)/2,y:k})?S=1:$(s.current.canvas,p,{x:E,y:k})?S=2:$(s.current.canvas,p,{x:E,y:(k+z)/2})?S=3:$(s.current.canvas,p,{x:E,y:z})?S=4:$(s.current.canvas,p,{x:(N+E)/2,y:z})?S=5:$(s.current.canvas,p,{x:N,y:z})?S=6:$(s.current.canvas,p,{x:N,y:(k+z)/2})?S=7:$(s.current.canvas,p,{x:N,y:k})&&(S=8),h.current={type:B.Edit,data:{type:S,x1:p.clientX,y1:p.clientY,x2:p.clientX,y2:p.clientY},source:_},n.select(_)},[s,g,n]),v=i.useCallback(_=>{if(!f||!s.current||u.current)return;const{left:p,top:x}=s.current.canvas.getBoundingClientRect(),N=_.clientX-p,k=_.clientY-x;u.current={name:"Rectangle",type:B.Source,data:{size:a,color:d,x1:N,y1:k,x2:N,y2:k},editHistory:[],draw:Ht,isHit:_e}},[f,a,d,s]),R=i.useCallback(_=>{if(!(!f||!s.current)){if(h.current)h.current.data.x2=_.clientX,h.current.data.y2=_.clientY,t.top!==h.current?(h.current.source.editHistory.push(h.current),n.push(h.current)):n.set(t);else if(u.current){const{left:p,top:x}=s.current.canvas.getBoundingClientRect(),N=u.current.data;N.x2=_.clientX-p,N.y2=_.clientY-x,t.top!==u.current?n.push(u.current):n.set(t)}}},[f,s,t,n]),w=i.useCallback(()=>{!f||(u.current&&n.clearSelect(),u.current=null,h.current=null)},[f,n]);return ae(C),te(v),ne(R),se(w),b.default.createElement(P,{title:e.operation_rectangle_title,icon:"icon-rectangle",checked:f,onClick:y,option:b.default.createElement(ie,{size:a,color:d,onSizeChange:m,onColorChange:l,__self:this,__source:{fileName:Ie,lineNumber:242,columnNumber:15}}),__self:this,__source:{fileName:Ie,lineNumber:237,columnNumber:5}})}var Pt=[Xt,Lt,Mt,Bt,zt,bt,"|",gt,dt,"|",ht,ut,at];var ue="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/ScreenshotsOperations/index.tsx";const We=b.default.createContext(null);var Yt=i.memo(function(){var u,h;const{width:t,height:n}=L(),[c]=J(),[r,o]=i.useState(null),[s,a]=i.useState(null),m=i.useRef(null),d=i.useCallback(f=>{f.stopPropagation()},[]),l=i.useCallback(f=>{f.preventDefault(),f.stopPropagation()},[]);return i.useEffect(()=>{if(!c||!m.current)return;const f=m.current.getBoundingClientRect();let g=c.x+c.width-f.width,y=c.y+c.height+10;g<0&&(g=0),g>t-f.width&&(g=t-f.width),y>n-f.height&&(y=n-f.height-10),((s==null?void 0:s.x)!==g||s.y!==y)&&a({x:g,y}),((r==null?void 0:r.x)!==f.x||r.y!==f.y||r.width!==f.width||r.height!==f.height)&&o({x:f.x,y:f.y,width:f.width,height:f.height})}),c?b.default.createElement(We.Provider,{value:r,__self:this,__source:{fileName:ue,lineNumber:76,columnNumber:5}},b.default.createElement("div",{ref:m,className:"screenshots-operations",style:{visibility:s?"visible":"hidden",transform:`translate(${(u=s==null?void 0:s.x)!=null?u:0}px, ${(h=s==null?void 0:s.y)!=null?h:0}px)`},onDoubleClick:d,onContextMenu:l,__self:this,__source:{fileName:ue,lineNumber:77,columnNumber:7}},b.default.createElement("div",{className:"screenshots-operations-buttons",__self:this,__source:{fileName:ue,lineNumber:87,columnNumber:9}},Pt.map((f,g)=>f==="|"?b.default.createElement("div",{key:g,className:"screenshots-operations-divider",__self:this,__source:{fileName:ue,lineNumber:90,columnNumber:22}}):b.default.createElement(f,{key:g,__self:this,__source:{fileName:ue,lineNumber:92,columnNumber:22}}))))):null});function Ft(e){const[t,n]=i.useState(null);return i.useEffect(()=>{if(n(null),e==null)return;const c=document.createElement("img"),r=()=>n(c),o=()=>n(null);return c.addEventListener("load",r),c.addEventListener("error",o),c.src=e,()=>{c.removeEventListener("load",r),c.removeEventListener("error",o)}},[e]),t}var fe="/Users/nashaofu/Documents/GitHub/screenshots/packages/react-screenshots/src/Screenshots/index.tsx";function Tt(s){var a=s,{url:e,width:t,height:n,lang:c,className:r}=a,o=Me(a,["url","width","height","lang","className"]);const m=Ft(e),d=i.useRef(null),l=i.useRef({}),[u,h]=i.useState({index:-1,stack:[]}),[f,g]=i.useState(null),[y,C]=i.useState("move"),[v,R]=i.useState(void 0),w={url:e,width:t,height:n,image:m,lang:G(G({},Le),c),emiterRef:l,canvasContextRef:d,history:u,bounds:f,cursor:y,operation:v},_=i.useCallback((z,...S)=>{const U=o[z];typeof U=="function"&&U(...S)},[o]),p={call:_,setHistory:h,setBounds:g,setCursor:C,setOperation:R},x=["screenshots"];r&&x.push(r);const N=()=>{l.current={},h({index:-1,stack:[]}),g(null),C("move"),R(void 0)},k=i.useCallback(async z=>{if(!(z.button!==0||!m))if(f&&d.current)de({image:m,width:t,height:n,history:u,bounds:f}).then(S=>{_("onOk",S,f),N()});else{const S={x:0,y:0,width:t,height:n};de({image:m,width:t,height:n,history:u,bounds:S}).then(U=>{_("onOk",U,S),N()})}},[m,u,f,t,n,_]),E=i.useCallback(z=>{z.button===2&&(z.preventDefault(),_("onCancel"),N())},[_]);return i.useLayoutEffect(()=>{N()},[e]),b.default.createElement(ve.Provider,{value:{store:w,dispatcher:p},__self:this,__source:{fileName:fe,lineNumber:142,columnNumber:5}},b.default.createElement("div",{className:x.join(" "),style:{width:t,height:n},onDoubleClick:k,onContextMenu:E,__self:this,__source:{fileName:fe,lineNumber:143,columnNumber:7}},b.default.createElement(Ze,{__self:this,__source:{fileName:fe,lineNumber:149,columnNumber:9}}),b.default.createElement(ot,{ref:d,__self:this,__source:{fileName:fe,lineNumber:150,columnNumber:9}}),b.default.createElement(Yt,{__self:this,__source:{fileName:fe,lineNumber:151,columnNumber:9}})))}module.exports=Tt;