@zergo0/react-filerobot-image-editor/lib/components/Layers/DesignLayer/AnnotationNodes/ImageNode.js

React component version of filerobot image editor (FIE).

import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["id","name","image","x","y","width","height","scaleX","scaleY","rotation","annotationEvents","stroke","strokeWidth","shadowOffsetX","shadowOffsetY","shadowBlur","shadowColor","shadowOpacity","opacity"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{useEffect,useState}from"react";import{Image}from"react-konva";import loadImage from"../../../../utils/loadImage";import nodesCommonPropTypes from"../nodesCommonPropTypes";import{jsx as _jsx}from"react/jsx-runtime";var ImageNode=function(a){var b=a.id,c=a.name,d=a.image,e=a.x,f=a.y,g=a.width,h=a.height,i=a.scaleX,j=a.scaleY,k=a.rotation,l=a.annotationEvents,m=a.stroke,n=a.strokeWidth,o=a.shadowOffsetX,p=a.shadowOffsetY,q=a.shadowBlur,r=a.shadowColor,s=a.shadowOpacity,t=a.opacity,u=_objectWithoutProperties(a,_excluded),v=useState(null),w=_slicedToArray(v,2),x=w[0],y=w[1];useEffect(function(){"string"==typeof d&&loadImage(d).then(y)},[d]);var z=d instanceof HTMLImageElement;if(!z&&!x)return null;var A=z?d:x;return _jsx(Image,_objectSpread(_objectSpread(_objectSpread({id:b,name:c,rotation:k,scaleX:i,scaleY:j,stroke:m,strokeWidth:n,shadowOffsetX:o,shadowOffsetY:p,shadowBlur:q,shadowColor:r,shadowOpacity:s,image:A,x:e,y:f,width:g,height:h,opacity:t},u),l),u))};ImageNode.defaultProps=_objectSpread(_objectSpread({},nodesCommonPropTypes.defaults),{},{width:0,height:0});export default ImageNode;