UNPKG

@notthatnathan/use-canvas-image

Version:

A React hook for automatically exporting a canvas to img.

3 lines (2 loc) 1.2 kB
var e=require("react"),t=require("usehooks-ts");module.exports=function(r){var n=r.canvas,u=r.imgClassname,a=void 0===u?"":u,i=r.canvasClassname,c=void 0===i?"":i,s=r.canvasAttributes,o=void 0===s?{}:s,l=r.fileType,f=void 0===l?"image/jpeg":l,v=r.quality,d=void 0===v?.7:v,p=r.interval,m=void 0===p?null:p,y=e.useRef(),b=e.useRef(),g=function(){requestAnimationFrame(function(){if(y.current&&b.current){var e=y.current.toDataURL(f,d);b.current.src=e}})};return e.useEffect(function(){var e;return function t(){var r,u;"string"==typeof n?y.current=document.querySelector(n):(null==n?void 0:n.current)instanceof HTMLCanvasElement?y.current=n.current:n instanceof HTMLCanvasElement&&(y.current=n),y.current?(Object.keys(o).forEach(function(e){y.current.setAttribute(e,o[e])}),c&&(r=y.current.classList).add.apply(r,c.split(" ")),y.current.style="position: absolute; top: 0; left: 0; z-index: 1;",b.current=new Image,a&&(u=b.current.classList).add.apply(u,a.split(" ")),b.current.style="position: absolute; top: 0; left: 0; z-index: 0;",y.current.after(b.current)):e=setTimeout(t,100)}(),function(){e&&clearTimeout(e)}},[]),t.useInterval(g,m),null===m||!1===m?g:null}; //# sourceMappingURL=index.js.map