use-eye-dropper
Version:
Browser color picker hook for React
2 lines (1 loc) • 1.48 kB
JavaScript
!function(e,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o(require("react")):"function"==typeof define&&define.amd?define(["react"],o):(e||self).useEyeDropper=o(e.react)}(this,function(e){const o=()=>"undefined"!=typeof window&&"EyeDropper"in window,r=()=>{let e="Unsupported browser.";throw e="Unsupported browser: no EyeDropper in Window. Check https://developer.mozilla.org/en-US/docs/Web/API/EyeDropper_API.",new Error("Unsupported browser: no EyeDropper in Window. Check https://developer.mozilla.org/en-US/docs/Web/API/EyeDropper_API.")};return n=>{const t=e.useMemo(()=>{var e;return(e=o()&&new EyeDropper(n))?EyeDropper.prototype.open.bind(e):r},[n]),[i,p]=(()=>{const r=e.useRef(),[n,t]=e.useState(!1);e.useEffect(()=>(r.current=!0,t(o()),()=>{r.current=!1}),[]);const i=e.useCallback(()=>n,[n]);return[r,i]})(),s=e.useRef(),d=e.useCallback(()=>{void 0!==s.current&&s.current.abort()},[s]),c=e.useCallback(async function(e){void 0===e&&(e={}),d();const{signal:o,...r}=e,n=new AbortController;s.current=n;const p=void 0!==o?(e=>{if("any"in AbortSignal)return AbortSignal.any(e);const o=new AbortController,r=()=>{o.abort();for(const o of e)o.removeEventListener("abort",r)};for(const o of e){if(o.aborted){r();break}o.addEventListener("abort",r)}return o.signal})([o,n.signal]):n.signal;try{return await t({...r,signal:p})}catch(e){throw i.current||(e.canceled=!0),e}},[s,i,d,t]);return e.useEffect(()=>d,[d]),{open:c,close:d,isSupported:p}}});