Jesus sucks
This commit is contained in:
73
backend/frontend/node_modules/@restart/hooks/cjs/useImage.js
generated
vendored
Normal file
73
backend/frontend/node_modules/@restart/hooks/cjs/useImage.js
generated
vendored
Normal file
@@ -0,0 +1,73 @@
|
||||
"use strict";
|
||||
|
||||
exports.__esModule = true;
|
||||
exports.default = useImage;
|
||||
var _react = require("react");
|
||||
/**
|
||||
* Fetch and load an image for programatic use such as in a `<canvas>` element.
|
||||
*
|
||||
* @param imageOrUrl The `HtmlImageElement` or image url to load
|
||||
* @param crossOrigin The `crossorigin` attribute to set
|
||||
*
|
||||
* ```ts
|
||||
* const { image, error } = useImage('/static/kittens.png')
|
||||
* const ref = useRef<HTMLCanvasElement>()
|
||||
*
|
||||
* useEffect(() => {
|
||||
* const ctx = ref.current.getContext('2d')
|
||||
*
|
||||
* if (image) {
|
||||
* ctx.drawImage(image, 0, 0)
|
||||
* }
|
||||
* }, [ref, image])
|
||||
*
|
||||
* return (
|
||||
* <>
|
||||
* {error && "there was a problem loading the image"}
|
||||
* <canvas ref={ref} />
|
||||
* </>
|
||||
* ```
|
||||
*/
|
||||
function useImage(imageOrUrl, crossOrigin) {
|
||||
const [state, setState] = (0, _react.useState)({
|
||||
image: null,
|
||||
error: null
|
||||
});
|
||||
(0, _react.useEffect)(() => {
|
||||
if (!imageOrUrl) return undefined;
|
||||
let image;
|
||||
if (typeof imageOrUrl === 'string') {
|
||||
image = new Image();
|
||||
if (crossOrigin) image.crossOrigin = crossOrigin;
|
||||
image.src = imageOrUrl;
|
||||
} else {
|
||||
image = imageOrUrl;
|
||||
if (image.complete && image.naturalHeight > 0) {
|
||||
setState({
|
||||
image,
|
||||
error: null
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
function onLoad() {
|
||||
setState({
|
||||
image,
|
||||
error: null
|
||||
});
|
||||
}
|
||||
function onError(error) {
|
||||
setState({
|
||||
image,
|
||||
error
|
||||
});
|
||||
}
|
||||
image.addEventListener('load', onLoad);
|
||||
image.addEventListener('error', onError);
|
||||
return () => {
|
||||
image.removeEventListener('load', onLoad);
|
||||
image.removeEventListener('error', onError);
|
||||
};
|
||||
}, [imageOrUrl, crossOrigin]);
|
||||
return state;
|
||||
}
|
||||
Reference in New Issue
Block a user