react-archer
Version:
Draw arrows between DOM elements in React
1 lines • 29.8 kB
JavaScript
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.ReactArcher=t(require("react")):e.ReactArcher=t(e.react)}("undefined"!=typeof self?self:this,(function(e){return function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="lib/",r(r.s=5)}([function(t,r){t.exports=e},function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ArcherContainerContextProvider=t.ArcherContainerContext=void 0;var o=n(r(0));t.ArcherContainerContext=o.default.createContext(null),t.ArcherContainerContextProvider=t.ArcherContainerContext.Provider},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.encodeId=void 0;t.encodeId=function(e){return encodeURI(e).replace(/%/g,"_")}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.getMarkerId=t.createShapeObj=t.getSourceToTargets=t.getEndShapeFromStyle=void 0;var n=["arrow","circle"];t.getEndShapeFromStyle=function(e){return e.endShape&&Object.keys(e.endShape).filter((function(e){return n.includes(e)}))[0]||n[0]};t.getSourceToTargets=function(e){var t=Object.keys(e).map((function(t){return e[t]}));return[].concat.apply([],t).sort((function(e,t){return e.order-t.order}))};t.createShapeObj=function(e,r){return{arrow:function(){var t;return{arrow:Object.assign(Object.assign({},null==r?void 0:r.arrow),null===(t=e.endShape)||void 0===t?void 0:t.arrow)}},circle:function(){var t;return{circle:Object.assign(Object.assign({},null==r?void 0:r.circle),null===(t=e.endShape)||void 0===t?void 0:t.circle)}}}[(0,t.getEndShapeFromStyle)(e)]()};t.getMarkerId=function(e,t,r){return"".concat(e).concat(t.id).concat(r.id)}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.endShapeDefaultProp=void 0,t.endShapeDefaultProp={arrow:{arrowLength:10,arrowThickness:6},circle:{radius:2,fillColor:"#f00",strokeColor:"#0ff",strokeWidth:1}}},function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ArcherContainer=t.ArcherElement=void 0;var o=r(6);Object.defineProperty(t,"ArcherElement",{enumerable:!0,get:function(){return n(o).default}});var i=r(11);Object.defineProperty(t,"ArcherContainer",{enumerable:!0,get:function(){return n(i).default}})},function(e,t,r){"use strict";var n=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&("get"in o?t.__esModule:!o.writable&&!o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,o)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),i=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&n(t,e,r);return o(t,e),t};Object.defineProperty(t,"__esModule",{value:!0});var a=i(r(0)),u=r(7),s=r(1),c=r(2),l=r(8),f=r(10);t.default=function(e){var t=e.id,r=e.relations,n=void 0===r?[]:r,o=e.children,i=(0,a.useMemo)((function(){return(0,c.encodeId)(t)}),[t]),d=(0,a.useContext)(s.ArcherContainerContext),h=(0,a.useRef)(),v=(0,a.useCallback)((function(e){var t=(0,f.generateSourceToTarget)(i,e);(0,f.assertContextExists)(d),d.registerTransitions(i,t)}),[d,i]),p=(0,a.useCallback)((function(){(0,f.assertContextExists)(d),d.unregisterTransitions(i)}),[d,i]),b=(0,a.useCallback)((function(e){e&&((0,f.assertContextExists)(d),d.registerChild(i,e))}),[i,d]),y=(0,a.useCallback)((function(){(0,f.assertContextExists)(d),d.unregisterChild(i)}),[d,i]);(0,u.useIsomorphicLayoutEffect)((function(){return b(h.current),function(){return y()}}),[b,y]),(0,l.useDeepCompareEffect)((function(){return v(n),function(){return p()}}),[v,n,p]),a.default.Children.only(o);var m=o;return a.default.cloneElement(m,Object.assign(Object.assign({},m.props),{ref:h}))}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.useIsomorphicLayoutEffect=void 0;var n=r(0);t.useIsomorphicLayoutEffect="undefined"!=typeof window?n.useLayoutEffect:n.useEffect},function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.useDeepCompareEffect=void 0;var o=r(0),i=n(r(9));function a(e){var t=(0,o.useRef)();return(0,i.default)(e,t.current)||(t.current=e),t.current}t.useDeepCompareEffect=function(e,t){(0,o.useEffect)(e,t.map(a))}},function(e,t,r){"use strict";var n=Array.isArray,o=Object.keys,i=Object.prototype.hasOwnProperty,a="undefined"!=typeof Element;e.exports=function(e,t){try{return function e(t,r){if(t===r)return!0;if(t&&r&&"object"==typeof t&&"object"==typeof r){var u,s,c,l=n(t),f=n(r);if(l&&f){if((s=t.length)!=r.length)return!1;for(u=s;0!=u--;)if(!e(t[u],r[u]))return!1;return!0}if(l!=f)return!1;var d=t instanceof Date,h=r instanceof Date;if(d!=h)return!1;if(d&&h)return t.getTime()==r.getTime();var v=t instanceof RegExp,p=r instanceof RegExp;if(v!=p)return!1;if(v&&p)return t.toString()==r.toString();var b=o(t);if((s=b.length)!==o(r).length)return!1;for(u=s;0!=u--;)if(!i.call(r,b[u]))return!1;if(a&&t instanceof Element&&r instanceof Element)return t===r;for(u=s;0!=u--;)if(!("_owner"===(c=b[u])&&t.$$typeof||e(t[c],r[c])))return!1;return!0}return t!=t&&r!=r}(e,t)}catch(e){if(e.message&&e.message.match(/stack|recursion/i)||-2146828260===e.number)return console.warn("Warning: react-fast-compare does not handle circular references.",e.name,e.message),!1;throw e}}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.generateSourceToTarget=t.assertContextExists=void 0;var n=r(2);t.assertContextExists=function(e){if(!e)throw new Error("Could not find ArcherContainerContext in <ArcherElement>. Please wrap the component in a <ArcherContainer>.")};t.generateSourceToTarget=function(e,t){return t.map((function(t){var r=t.targetId,o=t.sourceAnchor,i=t.targetAnchor,a=t.label,u=t.className,s=t.style,c=t.order,l=void 0===c?0:c,f=t.domAttributes,d=t.cursor,h=t.hitSlop;return{source:{id:(0,n.encodeId)(e),anchor:o},target:{id:(0,n.encodeId)(r),anchor:i},className:u,label:a,style:s,order:l,domAttributes:f,cursor:d,hitSlop:h}}))}},function(e,t,r){"use strict";function n(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function o(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==r)return;var n,o,i=[],a=!0,u=!1;try{for(r=r.call(e);!(a=(n=r.next()).done)&&(i.push(n.value),!t||i.length!==t);a=!0);}catch(e){u=!0,o=e}finally{try{a||null==r.return||r.return()}finally{if(u)throw o}}return i}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return i(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);"Object"===r&&e.constructor&&(r=e.constructor.name);if("Map"===r||"Set"===r)return Array.from(e);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return i(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}var a=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&("get"in o?t.__esModule:!o.writable&&!o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,o)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),u=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),s=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&a(t,e,r);return u(t,e),t},c=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});var l=s(r(0)),f=c(r(12)),d=r(1),h=r(14),v=r(4),p=r(19),b=r(20),y={position:"absolute",width:"100%",height:"100%",top:0,left:0,pointerEvents:"none"},m=l.default.forwardRef((function(e,t){var r=e.endShape,i=void 0===r?v.endShapeDefaultProp:r,a=e.strokeColor,u=void 0===a?"#f00":a,s=e.strokeWidth,c=void 0===s?2:s,m=e.svgContainerStyle,g=void 0===m?{}:m,_=e.noCurves,w=e.children,O=e.className,k=e.endMarker,E=e.lineStyle,M=e.offset,A=e.startMarker,S=e.strokeDasharray,C=e.style,x=o((0,l.useState)({}),2),j=x[0],P=x[1],T=o((0,l.useState)({}),2),D=T[0],L=T[1],I=(0,l.useRef)(new f.default((function(){N()}))).current,R=(0,l.useRef)(null),W=o(l.default.useState(),2)[1],F=(0,l.useRef)("arrow".concat(Math.random().toString().slice(2))).current;(0,l.useImperativeHandle)(t,(function(){return{refreshScreen:N,arrowMarkerUniquePrefix:F}}));var z,N=l.default.useCallback((function(){return W({})}),[]),q=(0,l.useCallback)((function(e,t){L((function(r){return Object.assign(Object.assign({},r),n({},e,t))}))}),[]),H=(0,l.useCallback)((function(e){L((function(t){var r=Object.assign({},t);return delete r[e],r}))}),[]),X=(0,l.useCallback)((function(e,t){P((function(r){return r[e]===t?r:Object.assign(Object.assign({},r),n({},e,t))}))}),[]),Y=(0,l.useCallback)((function(e){P((function(t){var r=Object.assign({},t);return delete r[e],r}))}),[]),B=(0,l.useMemo)((function(){return Object.assign(Object.assign({},y),g)}),[g]);z="function"==typeof w?w(d.ArcherContainerContext):w,(0,b.useResizeListener)(N),(0,b.useObserveElements)(j,I);var V=(0,l.useMemo)((function(){return{registerTransitions:q,unregisterTransitions:H,registerChild:X,unregisterChild:Y}}),[q,H,X,Y]);return l.default.createElement(d.ArcherContainerContextProvider,{value:V},l.default.createElement("div",{style:Object.assign(Object.assign({},C),{position:"relative"}),className:O},l.default.createElement("svg",{style:B},l.default.createElement("defs",null,l.default.createElement(p.ArrowMarkers,{endShape:i,sourceToTargetsMap:D,strokeColor:u,uniqueId:F})),l.default.createElement(h.SvgArrows,{startMarker:A,endMarker:k,endShape:i,strokeColor:u,strokeWidth:c,strokeDasharray:S,noCurves:_,lineStyle:E,offset:M,parentCurrent:R.current,refs:j,uniqueId:F,sourceToTargetsMap:D})),l.default.createElement("div",{style:{height:"100%"},ref:R},z)))}));t.default=m},function(e,t,r){"use strict";r.r(t),function(e){var r=function(){if("undefined"!=typeof Map)return Map;function e(e,t){var r=-1;return e.some((function(e,n){return e[0]===t&&(r=n,!0)})),r}return function(){function t(){this.__entries__=[]}var r={size:{configurable:!0}};return r.size.get=function(){return this.__entries__.length},t.prototype.get=function(t){var r=e(this.__entries__,t),n=this.__entries__[r];return n&&n[1]},t.prototype.set=function(t,r){var n=e(this.__entries__,t);~n?this.__entries__[n][1]=r:this.__entries__.push([t,r])},t.prototype.delete=function(t){var r=this.__entries__,n=e(r,t);~n&&r.splice(n,1)},t.prototype.has=function(t){return!!~e(this.__entries__,t)},t.prototype.clear=function(){this.__entries__.splice(0)},t.prototype.forEach=function(e,t){void 0===t&&(t=null);for(var r=0,n=this.__entries__;r<n.length;r+=1){var o=n[r];e.call(t,o[1],o[0])}},Object.defineProperties(t.prototype,r),t}()}(),n="undefined"!=typeof window&&"undefined"!=typeof document&&window.document===document,o=function(){return void 0!==e&&e.Math===Math?e:"undefined"!=typeof self&&self.Math===Math?self:"undefined"!=typeof window&&window.Math===Math?window:Function("return this")()}(),i=function(){return"function"==typeof requestAnimationFrame?requestAnimationFrame.bind(o):function(e){return setTimeout((function(){return e(Date.now())}),1e3/60)}}(),a=2,u=["top","right","bottom","left","width","height","size","weight"],s="undefined"!=typeof MutationObserver,c=function(){this.connected_=!1,this.mutationEventsAdded_=!1,this.mutationsObserver_=null,this.observers_=[],this.onTransitionEnd_=this.onTransitionEnd_.bind(this),this.refresh=function(e,t){var r=!1,n=!1,o=0;function u(){r&&(r=!1,e()),n&&c()}function s(){i(u)}function c(){var e=Date.now();if(r){if(e-o<a)return;n=!0}else r=!0,n=!1,setTimeout(s,t);o=e}return c}(this.refresh.bind(this),20)};c.prototype.addObserver=function(e){~this.observers_.indexOf(e)||this.observers_.push(e),this.connected_||this.connect_()},c.prototype.removeObserver=function(e){var t=this.observers_,r=t.indexOf(e);~r&&t.splice(r,1),!t.length&&this.connected_&&this.disconnect_()},c.prototype.refresh=function(){this.updateObservers_()&&this.refresh()},c.prototype.updateObservers_=function(){var e=this.observers_.filter((function(e){return e.gatherActive(),e.hasActive()}));return e.forEach((function(e){return e.broadcastActive()})),e.length>0},c.prototype.connect_=function(){n&&!this.connected_&&(document.addEventListener("transitionend",this.onTransitionEnd_),window.addEventListener("resize",this.refresh),s?(this.mutationsObserver_=new MutationObserver(this.refresh),this.mutationsObserver_.observe(document,{attributes:!0,childList:!0,characterData:!0,subtree:!0})):(document.addEventListener("DOMSubtreeModified",this.refresh),this.mutationEventsAdded_=!0),this.connected_=!0)},c.prototype.disconnect_=function(){n&&this.connected_&&(document.removeEventListener("transitionend",this.onTransitionEnd_),window.removeEventListener("resize",this.refresh),this.mutationsObserver_&&this.mutationsObserver_.disconnect(),this.mutationEventsAdded_&&document.removeEventListener("DOMSubtreeModified",this.refresh),this.mutationsObserver_=null,this.mutationEventsAdded_=!1,this.connected_=!1)},c.prototype.onTransitionEnd_=function(e){var t=e.propertyName;void 0===t&&(t=""),u.some((function(e){return!!~t.indexOf(e)}))&&this.refresh()},c.getInstance=function(){return this.instance_||(this.instance_=new c),this.instance_},c.instance_=null;var l=function(e,t){for(var r=0,n=Object.keys(t);r<n.length;r+=1){var o=n[r];Object.defineProperty(e,o,{value:t[o],enumerable:!1,writable:!1,configurable:!0})}return e},f=function(e){return e&&e.ownerDocument&&e.ownerDocument.defaultView||o},d=m(0,0,0,0);function h(e){return parseFloat(e)||0}function v(e){for(var t=[],r=arguments.length-1;r-- >0;)t[r]=arguments[r+1];return t.reduce((function(t,r){return t+h(e["border-"+r+"-width"])}),0)}function p(e){var t=e.clientWidth,r=e.clientHeight;if(!t&&!r)return d;var n=f(e).getComputedStyle(e),o=function(e){for(var t={},r=0,n=["top","right","bottom","left"];r<n.length;r+=1){var o=n[r],i=e["padding-"+o];t[o]=h(i)}return t}(n),i=o.left+o.right,a=o.top+o.bottom,u=h(n.width),s=h(n.height);if("border-box"===n.boxSizing&&(Math.round(u+i)!==t&&(u-=v(n,"left","right")+i),Math.round(s+a)!==r&&(s-=v(n,"top","bottom")+a)),!function(e){return e===f(e).document.documentElement}(e)){var c=Math.round(u+i)-t,l=Math.round(s+a)-r;1!==Math.abs(c)&&(u-=c),1!==Math.abs(l)&&(s-=l)}return m(o.left,o.top,u,s)}var b=function(){return"undefined"!=typeof SVGGraphicsElement?function(e){return e instanceof f(e).SVGGraphicsElement}:function(e){return e instanceof f(e).SVGElement&&"function"==typeof e.getBBox}}();function y(e){return n?b(e)?function(e){var t=e.getBBox();return m(0,0,t.width,t.height)}(e):p(e):d}function m(e,t,r,n){return{x:e,y:t,width:r,height:n}}var g=function(e){this.broadcastWidth=0,this.broadcastHeight=0,this.contentRect_=m(0,0,0,0),this.target=e};g.prototype.isActive=function(){var e=y(this.target);return this.contentRect_=e,e.width!==this.broadcastWidth||e.height!==this.broadcastHeight},g.prototype.broadcastRect=function(){var e=this.contentRect_;return this.broadcastWidth=e.width,this.broadcastHeight=e.height,e};var _=function(e,t){var r=function(e){var t=e.x,r=e.y,n=e.width,o=e.height,i="undefined"!=typeof DOMRectReadOnly?DOMRectReadOnly:Object,a=Object.create(i.prototype);return l(a,{x:t,y:r,width:n,height:o,top:r,right:t+n,bottom:o+r,left:t}),a}(t);l(this,{target:e,contentRect:r})},w=function(e,t,n){if(this.activeObservations_=[],this.observations_=new r,"function"!=typeof e)throw new TypeError("The callback provided as parameter 1 is not a function.");this.callback_=e,this.controller_=t,this.callbackCtx_=n};w.prototype.observe=function(e){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(e instanceof f(e).Element))throw new TypeError('parameter 1 is not of type "Element".');var t=this.observations_;t.has(e)||(t.set(e,new g(e)),this.controller_.addObserver(this),this.controller_.refresh())}},w.prototype.unobserve=function(e){if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");if("undefined"!=typeof Element&&Element instanceof Object){if(!(e instanceof f(e).Element))throw new TypeError('parameter 1 is not of type "Element".');var t=this.observations_;t.has(e)&&(t.delete(e),t.size||this.controller_.removeObserver(this))}},w.prototype.disconnect=function(){this.clearActive(),this.observations_.clear(),this.controller_.removeObserver(this)},w.prototype.gatherActive=function(){var e=this;this.clearActive(),this.observations_.forEach((function(t){t.isActive()&&e.activeObservations_.push(t)}))},w.prototype.broadcastActive=function(){if(this.hasActive()){var e=this.callbackCtx_,t=this.activeObservations_.map((function(e){return new _(e.target,e.broadcastRect())}));this.callback_.call(e,t,e),this.clearActive()}},w.prototype.clearActive=function(){this.activeObservations_.splice(0)},w.prototype.hasActive=function(){return this.activeObservations_.length>0};var O="undefined"!=typeof WeakMap?new WeakMap:new r,k=function(e){if(!(this instanceof k))throw new TypeError("Cannot call a class as a function.");if(!arguments.length)throw new TypeError("1 argument required, but only 0 present.");var t=c.getInstance(),r=new w(e,t,this);O.set(this,r)};["observe","unobserve","disconnect"].forEach((function(e){k.prototype[e]=function(){return(t=O.get(this))[e].apply(t,arguments);var t}}));var E=function(){return void 0!==o.ResizeObserver?o.ResizeObserver:k}();t.default=E}.call(this,r(13))},function(e,t){var r;r=function(){return this}();try{r=r||new Function("return this")()}catch(e){"object"==typeof window&&(r=window)}e.exports=r},function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.SvgArrows=void 0;var o=n(r(0)),i=r(15),a=n(r(17)),u=r(3),s=function(e){var t,r,n=e.style||{},s=n.startMarker||e.startMarker,c=null===(r=null!==(t=n.endMarker)&&void 0!==t?t:e.endMarker)||void 0===r||r,l=(0,u.createShapeObj)(n,e.endShape),f=e.domAttributes,d=e.cursor,h=e.hitSlop,v=n.strokeColor||e.strokeColor,p=n.strokeWidth||e.strokeWidth,b=n.strokeDasharray||e.strokeDasharray,y=!(!n.noCurves&&!e.noCurves),m=n.lineStyle||e.lineStyle||(y?"angle":"curve"),g=e.offset||0,_=e.source.anchor,w=(0,i.getPointCoordinatesFromAnchorPosition)(e.source.anchor,e.source.id,e.parentCoordinates,e.refs),O=e.target.anchor,k=(0,i.getPointCoordinatesFromAnchorPosition)(e.target.anchor,e.target.id,e.parentCoordinates,e.refs);return w?k?o.default.createElement(a.default,{className:e.className,startingPoint:w,startingAnchorOrientation:_,endingPoint:k,endingAnchorOrientation:O,strokeColor:v,strokeWidth:p,strokeDasharray:b,arrowLabel:e.label,arrowMarkerId:(0,u.getMarkerId)(e.uniqueId,e.source,e.target),lineStyle:m,offset:g,enableStartMarker:!!s,disableEndMarker:!c,endShape:l,domAttributes:f,hitSlop:h,cursor:d}):(console.warn("[React Archer] Could not find target element! Not drawing the arrow."),null):(console.warn("[React Archer] Could not find starting point of element! Not drawing the arrow."),null)};t.SvgArrows=function(e){var t=(0,i.getPointFromElement)(e.parentCurrent);return t?o.default.createElement(o.default.Fragment,null,(0,u.getSourceToTargets)(e.sourceToTargetsMap).map((function(r){return o.default.createElement(s,{key:JSON.stringify({source:r.source,target:r.target}),source:r.source,target:r.target,className:r.className,label:r.label,style:r.style||{},domAttributes:r.domAttributes,hitSlop:r.hitSlop,cursor:r.cursor,startMarker:e.startMarker,endMarker:e.endMarker,endShape:e.endShape,strokeColor:e.strokeColor,strokeWidth:e.strokeWidth,strokeDasharray:e.strokeDasharray,noCurves:e.noCurves,lineStyle:e.lineStyle,offset:e.offset,parentCoordinates:t,refs:e.refs,uniqueId:e.uniqueId})}))):null}},function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.getPointCoordinatesFromAnchorPosition=t.getPointFromElement=void 0;var o=n(r(16));function i(e){return new o.default(e.left,e.top)}var a=function(e){return e?e.getBoundingClientRect():null};t.getPointFromElement=function(e){var t=a(e);return t?i(t):null};t.getPointCoordinatesFromAnchorPosition=function(e,t,r,n){var u=a(n[t]);if(!u)return null;var s=function(e,t){switch(e){case"top":return i(t).add(new o.default(t.width/2,0));case"bottom":return i(t).add(new o.default(t.width/2,t.height));case"left":return i(t).add(new o.default(0,t.height/2));case"right":return i(t).add(new o.default(t.width,t.height/2));case"middle":return i(t).add(new o.default(t.width/2,t.height/2));default:return console.error("[React Archer] Invalid anchor position was provided. Not drawing the arrow."),null}}(e,u);return s?s.substract(r):null}},function(e,t,r){"use strict";function n(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(t,r){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.x=t,this.y=r}return function(e,t,r){t&&n(e.prototype,t),r&&n(e,r),Object.defineProperty(e,"prototype",{writable:!1})}(e,[{key:"add",value:function(t){return new e(this.x+t.x,this.y+t.y)}},{key:"substract",value:function(t){return new e(this.x-t.x,this.y-t.y)}}]),e}();t.default=o},function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.computeLabelDimensions=t.computeEndingAnchorPosition=t.computeStartingAnchorPosition=t.computeArrowPointAccordingToArrowHead=void 0;var o=n(r(0)),i=r(18);function a(e,t,r,n,o,a,u,s){var c=(0,i.computeArrowDirectionVector)(o),l=c.arrowX,f=c.arrowY;if("straight"===a&&void 0!==u&&void 0!==s){var d=Math.atan2(s-t,u-e);l=Math.cos(d),f=Math.sin(d)}return{xPoint:e+l*r*n/2,yPoint:t+f*r*n/2}}function u(e,t,r,n,o){return"top"===o||"bottom"===o?{xAnchor1:e,yAnchor1:t+(n-t)/2}:"left"===o||"right"===o?{xAnchor1:e+(r-e)/2,yAnchor1:t}:{xAnchor1:e,yAnchor1:t}}function s(e,t,r,n,o){return"top"===o||"bottom"===o?{xAnchor2:r,yAnchor2:n-(n-t)/2}:"left"===o||"right"===o?{xAnchor2:r-(r-e)/2,yAnchor2:n}:{xAnchor2:r,yAnchor2:n}}function c(e,t,r,n){return{xLabel:r>e?e:r,yLabel:n>t?t:n,labelWidth:Math.max(Math.abs(r-e),1),labelHeight:Math.max(Math.abs(n-t),1)}}t.computeArrowPointAccordingToArrowHead=a,t.computeStartingAnchorPosition=u,t.computeEndingAnchorPosition=s,t.computeLabelDimensions=c;t.default=function(e){var t=e.className,r=e.startingPoint,n=e.startingAnchorOrientation,i=e.endingPoint,l=e.endingAnchorOrientation,f=e.strokeColor,d=e.strokeWidth,h=e.strokeDasharray,v=e.arrowLabel,p=e.arrowMarkerId,b=e.lineStyle,y=e.offset,m=e.enableStartMarker,g=e.disableEndMarker,_=e.endShape,w=e.domAttributes,O=e.hitSlop,k=void 0===O?10:O,E=e.cursor,M=void 0===E?"pointer":E,A=_.circle?2*_.circle.radius:2*_.arrow.arrowLength,S=a(r.x,r.y,m?A:0,d,n,b,i.x,i.y),C=S.xPoint,x=S.yPoint,j=a(i.x,i.y,g?0:A,d,l,b,r.x,r.y),P=j.xPoint,T=j.yPoint,D=u(C,x,P,T,n),L=D.xAnchor1,I=D.yAnchor1,R=s(C,x,P,T,l),W=function(e){var t=e.xStart,r=e.yStart,n=e.xAnchor1,o=e.yAnchor1,i=e.xAnchor2,a=e.yAnchor2,u=e.xEnd,s=e.yEnd,c=e.lineStyle,l=e.offset;if(l&&0!==l){var f="straight"===c?Math.atan2(s-r,u-t):Math.atan2(o-r,n-t),d=l*Math.cos(f),h=l*Math.sin(f);"straight"!==c&&(t+=d,r+=h),u-=d,s-=h}var v="M".concat(t,",").concat(r," ");return["curve","angle"].includes(c)&&(v+="".concat("curve"===c?"C":"").concat(n,",").concat(o," ").concat(i,",").concat(a," ")),v+="".concat(u,",").concat(s)}({xStart:C,yStart:x,xAnchor1:L,yAnchor1:I,xAnchor2:R.xAnchor2,yAnchor2:R.yAnchor2,xEnd:P,yEnd:T,lineStyle:b,offset:y}),F=c(C,x,P,T),z=F.xLabel,N=F.yLabel,q=F.labelWidth,H=F.labelHeight,X="url(#".concat(p,")");return o.default.createElement("g",{className:t},o.default.createElement("path",{d:W,style:{fill:"none",stroke:f,strokeWidth:d,strokeDasharray:h},markerStart:m?X:void 0,markerEnd:g?void 0:X}),w&&o.default.createElement("path",Object.assign({d:W,style:{fill:"none",stroke:"rgba(0, 0, 0, 0)",strokeWidth:k,cursor:w?M:"initial",pointerEvents:"all"}},w)),v&&o.default.createElement("foreignObject",{x:z,y:N,width:q,height:H,style:{overflow:"visible",pointerEvents:"none"}},o.default.createElement("div",{style:{position:"absolute",left:"50%",top:"50%",transform:"translateX(-50%) translateY(-50%)",pointerEvents:"all"}},o.default.createElement("div",null,v))))}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.computeArrowDirectionVector=void 0,t.computeArrowDirectionVector=function(e){switch(e){case"left":return{arrowX:-1,arrowY:0};case"right":return{arrowX:1,arrowY:0};case"top":return{arrowX:0,arrowY:-1};case"bottom":return{arrowX:0,arrowY:1};default:return{arrowX:0,arrowY:0}}}},function(e,t,r){"use strict";var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ArrowMarkers=void 0;var o=n(r(0)),i=r(4),a=r(3),u=function(e,t){return function(){var r,n,a,u,s,c,l,f,d,h,v,p,b=(null===(n=null===(r=e.endShape)||void 0===r?void 0:r.circle)||void 0===n?void 0:n.radius)||(null===(a=t.circle)||void 0===a?void 0:a.radius)||i.endShapeDefaultProp.circle.radius,y=(null===(s=null===(u=e.endShape)||void 0===u?void 0:u.circle)||void 0===s?void 0:s.strokeWidth)||(null===(c=t.circle)||void 0===c?void 0:c.strokeWidth)||i.endShapeDefaultProp.circle.strokeWidth,m=(null===(f=null===(l=e.endShape)||void 0===l?void 0:l.circle)||void 0===f?void 0:f.strokeColor)||(null===(d=t.circle)||void 0===d?void 0:d.strokeColor)||i.endShapeDefaultProp.circle.strokeColor,g=(null===(v=null===(h=e.endShape)||void 0===h?void 0:h.circle)||void 0===v?void 0:v.fillColor)||(null===(p=t.circle)||void 0===p?void 0:p.fillColor)||i.endShapeDefaultProp.circle.fillColor;return{markerWidth:4*b,markerHeight:4*b,refX:2*b+y,refY:2*b,path:o.default.createElement("circle",{cx:2*b,cy:2*b,r:b,fill:g,stroke:m,strokeWidth:y})}}},s=function(e,t,r){return function(){var n,a,u,s,c,l,f,d,h=e.strokeColor||r,v=null!==(c=null!==(u=null===(a=null===(n=e.endShape)||void 0===n?void 0:n.arrow)||void 0===a?void 0:a.arrowLength)&&void 0!==u?u:null===(s=null==t?void 0:t.arrow)||void 0===s?void 0:s.arrowLength)&&void 0!==c?c:i.endShapeDefaultProp.arrow.arrowLength,p=(null===(f=null===(l=e.endShape)||void 0===l?void 0:l.arrow)||void 0===f?void 0:f.arrowThickness)||(null===(d=null==t?void 0:t.arrow)||void 0===d?void 0:d.arrowThickness)||i.endShapeDefaultProp.arrow.arrowThickness,b="M0,0 L0,".concat(p," L").concat(v,",").concat(p/2," z");return{markerWidth:v,markerHeight:p,refX:0,refY:p/2,path:o.default.createElement("path",{d:b,fill:h})}}};t.ArrowMarkers=function(e){var t=e.sourceToTargetsMap,r=e.endShape,n=e.strokeColor,i=e.uniqueId;return o.default.createElement(o.default.Fragment,null,(0,a.getSourceToTargets)(t).map((function(e){var t=e.source,c=e.target,l=e.style,f=function(e){var t=e.style,r=e.strokeColor,n=e.endShape,o=(0,a.getEndShapeFromStyle)(t);return{circle:u(t,n),arrow:s(t,n,r)}[o]()}({style:void 0===l?{}:l,endShape:r,strokeColor:n}),d=f.markerHeight,h=f.markerWidth,v=f.path,p=f.refX,b=f.refY;return o.default.createElement("marker",{id:(0,a.getMarkerId)(i,t,c),key:(0,a.getMarkerId)(i,t,c),markerWidth:h,markerHeight:d,refX:p,refY:b,orient:"auto-start-reverse",markerUnits:"strokeWidth"},v)})))}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.useResizeListener=t.useObserveElements=void 0;var n=r(0);t.useObserveElements=function(e,t){(0,n.useEffect)((function(){return Object.keys(e).map((function(r){t.observe(e[r])})),function(){Object.keys(e).map((function(r){t.unobserve(e[r])}))}}),[e,t])},t.useResizeListener=function(e){(0,n.useEffect)((function(){return window&&window.addEventListener("resize",e),function(){window&&window.removeEventListener("resize",e)}}),[e])}}])}));