eyedropper-polyfill/dist/eyedropper-polyfill.umd.cjs

EyeDropper API Polyfill

(function(r,o){typeof exports=="object"&&typeof module<"u"?o(require("html2canvas-pro")):typeof define=="function"&&define.amd?define(["html2canvas-pro"],o):o((typeof globalThis<"u"?globalThis:r||self).html2canvas)})(this,function(r){"use strict";var o="[EyeDropper]";const s={canvasError:o+" Error getting canvas",color:o+" Cannot get color"};function a(n){if(typeof n!="number"||Number.isNaN(n))throw new Error;return n+"px"}const c={value:!1};class l{colorSelectionResult;previousDocumentCursor;canvas;canvasCtx;resolve;lastPoint;magnification={size:4,scale:12};constructor(){this.onMouseMove=this.onMouseMove.bind(this),this.onClick=this.onClick.bind(this)}async open(t={}){return c.value?Promise.reject(new DOMException("Invalid state","InvalidStateError")):new Promise((i,e)=>{if(t.signal){if(t.signal.aborted)return this.stop(),e(t.signal.reason||new DOMException("Aborted","AbortError"));t.signal.addEventListener("abort",()=>{this.stop(),t.signal&&e(t.signal.reason||new DOMException("Aborted","AbortError"))})}this.resolve=i,this.start()})}async start(){document.body.style.overflow="hidden",this.setWaitingCursor(),await this.createScreenshot(),this.revertWaitingCursor(),this.bindEvents()}stop(){document.body.style.overflow="",this.unbindEvents(),this.removeScreenshot(),this.colorSelectionResult=void 0,this.lastPoint=void 0,c.value=!1}async createScreenshot(){this.canvas=await r(document.body,{allowTaint:!0,useCORS:!0,height:document.body.scrollHeight,width:document.body.scrollWidth}),this.addCanvasStyle(this.canvas),this.canvasCtx=this.canvas.getContext("2d",{willReadFrequently:!0}),document.body.appendChild(this.canvas)}removeScreenshot(){if(!this.canvas)throw new Error(s.canvasError);document.body.removeChild(this.canvas),this.canvas=void 0,this.canvasCtx=void 0}setWaitingCursor(){this.previousDocumentCursor=document.documentElement.style.cursor,document.documentElement.style.cursor="wait"}revertWaitingCursor(){this.previousDocumentCursor?document.documentElement.style.cursor=this.previousDocumentCursor:document.documentElement.style.cursor="",this.previousDocumentCursor=void 0}bindEvents(){window.addEventListener("mousemove",this.onMouseMove),window.addEventListener("click",this.onClick)}unbindEvents(){window.removeEventListener("mousemove",this.onMouseMove),window.removeEventListener("click",this.onClick)}onClick(){if(!this.lastPoint)throw new Error(s.color);this.detectColor(this.lastPoint);var t=this.colorSelectionResult;this.stop(),t&&this.resolve&&this.resolve(t)}onMouseMove(e){if(!this.canvas||!this.canvasCtx)throw new Error(s.canvasError);var i=window.devicePixelRatio,e=(this.lastPoint={x:(e.clientX+window.scrollX)*i,y:(e.clientY+window.scrollY)*i},[a(this.lastPoint.x/i),a(this.lastPoint.y/i)].join(" "));Object.assign(this.canvas.style,{opacity:1,transformOrigin:e,clipPath:`circle(${a(this.magnification.size)} at ${e})`})}detectColor(t){if(!this.canvasCtx)throw new Error(s.canvasError);t=this.canvasCtx.getImageData(t.x,t.y,1,1).data,t=((1<<24)+(t[0]<<16)+(t[1]<<8)+t[2]).toString(16).slice(1),this.colorSelectionResult={sRGBHex:"#"+t}}addCanvasStyle(t){Object.assign(t.style,{position:"fixed",top:"0px",marginTop:-window.scrollY+"px",left:"0px",zIndex:999999,opacity:0,transform:`scale(${this.magnification.scale})`,imageRendering:"pixelated"})}}if(!(typeof window>"u"||"EyeDropper"in window||Reflect.defineProperty(window,"EyeDropper",{value:l})))throw Error("Error attaching `EyeDropper` polyfill: couldn't attach `EyeDropper` to `window`")});