orcasvn-react-diagrams 0.1.15 → 0.1.16

package/dist/cjs/index.js

@@ -9648,9 +9648,12 @@ var Paper = function (props) {
     //Listen text is selected
     React$1.useEffect(function () {
         var textSelectedListener = paperEventEmitter.onTextSelected(function (text) {
+            var _a;
             setSelectedElement(undefined);
             setSelectedElementSVG(null);
             setSelectedLink(undefined);
+            //broadcast selected text to parent component
+            (_a = props.onTextSelected) === null || _a === void 0 ? void 0 : _a.call(props, text);
         });
         return function () {
             textSelectedListener.off();
@@ -9658,10 +9661,16 @@ var Paper = function (props) {
     }, []);
     //Listen port is selected
     React$1.useEffect(function () {
-        var portSelectedListener = paperEventEmitter.onPortSelected(function (port) {
+        var portSelectedListener = paperEventEmitter.onPortSelected(function (port, elementId) {
+            var _a;
             setSelectedElement(undefined);
             setSelectedElementSVG(null);
             setSelectedLink(undefined);
+            //broadcast selected port to parent component
+            var element = elements.find(function (e) { return e.id === elementId; });
+            if (element) {
+                (_a = props.onPortSelected) === null || _a === void 0 ? void 0 : _a.call(props, port, element);
+            }
         });
         return function () {
             portSelectedListener.off();
@@ -9709,6 +9718,7 @@ var Paper = function (props) {
     };
     //Listen command delete selected for element
     React$1.useEffect(function () {
+        var _a;
         var listener = paperEventEmitter.onCommandDeleteSelectedElement(function () {
             if (selectedElement) {
                 var deletedChildElements = getDeletedChildElements(selectedElement);
@@ -9719,30 +9729,44 @@ var Paper = function (props) {
                 setSelectedElementSVG(null);
             }
         });
+        //broadcast selected element to parent component
+        if (selectedElement) {
+            (_a = props.onElementSelected) === null || _a === void 0 ? void 0 : _a.call(props, selectedElement);
+        }
         return function () {
             listener.off();
         };
     }, [selectedElement]);
     //Listen command delete selected for link
     React$1.useEffect(function () {
+        var _a;
         var listener = paperEventEmitter.onCommandDeleteSelectedLink(function () {
             if (selectedLink) {
                 setLinks(function (prev) { return prev.filter(function (l) { return l.id !== selectedLink.id; }); });
                 setSelectedLink(undefined);
             }
         });
+        //broadcast selected link to parent component
+        if (selectedLink) {
+            (_a = props.onLinkSelected) === null || _a === void 0 ? void 0 : _a.call(props, selectedLink);
+        }
         return function () {
             listener.off();
         };
     }, [selectedLink]);
     //Listen command delete selected for Text
     React$1.useEffect(function () {
+        var _a;
         var listener = paperEventEmitter.onCommandDeleteSelectedText(function () {
             if (selectedText) {
                 setTexts(function (prev) { return prev.filter(function (t) { return t.id !== selectedText.id; }); });
                 setSelectedText(undefined);
             }
         });
+        //broadcast selected text to parent component
+        if (selectedText) {
+            (_a = props.onTextSelected) === null || _a === void 0 ? void 0 : _a.call(props, selectedText);
+        }
         return function () {
             listener.off();
         };
@@ -10202,7 +10226,7 @@ var Paper = function (props) {
 function Editor(_a) {
     var editorContext = _a.editorContext;
     return (React$1.createElement(React$1.Fragment, null,
-        React$1.createElement(Paper, { size: { width: 3000, height: 3000 }, elements: editorContext.elements, links: editorContext.links, texts: editorContext.texts, onPaperClicked: editorContext.onPaperClicked, onPortMoved: editorContext.onPortMoved, onElementContextMenu: editorContext.onElementContextMenu, onElementMoved: editorContext.onElementMoved, onElementResized: editorContext.onElementResized, onLinkValidation: editorContext.validateLink, onCreatingLink: editorContext.onCreatingLink, onCreatingPortByLinking: editorContext.onCreatingPortByLinking })));
+        React$1.createElement(Paper, { size: { width: 3000, height: 3000 }, elements: editorContext.elements, links: editorContext.links, texts: editorContext.texts, onPaperClicked: editorContext.onPaperClicked, onPortMoved: editorContext.onPortMoved, onPortSelected: editorContext.onPortSelected, onElementContextMenu: editorContext.onElementContextMenu, onElementMoved: editorContext.onElementMoved, onElementResized: editorContext.onElementResized, onElementSelected: editorContext.onElementSelected, onLinkValidation: editorContext.validateLink, onCreatingLink: editorContext.onCreatingLink, onCreatingPortByLinking: editorContext.onCreatingPortByLinking, onLinkSelected: editorContext.onLinkSelected, onTextSelected: editorContext.onTextSelected })));
 }
 
 exports.CircleRC = Circle;

package/dist/cjs/types/components/paper.d.ts

@@ -3,7 +3,7 @@ import IElement from '../models/IElement';
 import IElementLink from '../models/IElementLink';
 import IPosition from '../models/position';
 import IPort from '../models/IPort';
-import { IPaperText } from '../models/IText';
+import IText, { IPaperText } from '../models/IText';
 import ISize from '../models/size';
 interface PaperProps {
     size: {
@@ -15,10 +15,14 @@ interface PaperProps {
     texts: IPaperText[];
     onPaperClicked?: () => void;
     onPortMoved?: (position: IPosition, port: IPort, element: IElement) => void;
+    onPortSelected?: (port: IPort, element: IElement) => void;
     onElementContextMenu?: (element: IElement, mouseEvent: React.MouseEvent<SVGElement>) => void;
     onElementMoved?: (position: IPosition, element: IElement, index: number) => void;
     onElementResized?: (size: ISize, element: IElement, index: number) => void;
+    onElementSelected?: (element: IElement) => void;
     onLinkValidation?: (sourcePort: IPort, sourceElement: IElement, targetPort: IPort, targetElement: IElement) => boolean;
+    onLinkSelected?: (link: IElementLink) => void;
+    onTextSelected?: (text: IText) => void;
     onCreatingPortByLinking?: (sourceElement: IElement, sourcePort: IPort, targetElement: IElement, position: IPosition) => IPort | null;
     onCreatingLink?: (sourcePort: IPort, sourceElement: IElement, targetPort: IPort, targetElement: IElement) => IElementLink | null;
 }

package/dist/cjs/types/models/implementations/EditorContext.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import IElement from "../IElement";
 import IElementLink from "../IElementLink";
-import { IPaperText } from "../IText";
+import IText, { IPaperText } from "../IText";
 import IPosition from "../position";
 import IPort from "../IPort";
 import ISize from "../size";
@@ -11,12 +11,16 @@ export declare class EditorContext {
     private _texts;
     onPaperClicked?: () => void;
     onPortMoved?: (position: IPosition, port: IPort, element: IElement) => void;
+    onPortSelected?: (port: IPort, element: IElement) => void;
     onElementContextMenu?: (element: IElement, mouseEvent: React.MouseEvent<SVGElement>) => void;
     onElementMoved?: (position: IPosition, element: IElement, index: number) => void;
     onElementResized?: (size: ISize, element: IElement, index: number) => void;
+    onElementSelected?: (element: IElement) => void;
     validateLink?: (sourcePort: IPort, sourceElement: IElement, targetPort: IPort, targetElement: IElement) => boolean;
     onCreatingPortByLinking?: (sourceElement: IElement, sourcePort: IPort, targetElement: IElement, position: IPosition) => IPort | null;
     onCreatingLink?: (sourcePort: IPort, sourceElement: IElement, targetPort: IPort, targetElement: IElement) => IElementLink | null;
+    onLinkSelected?: (link: IElementLink) => void;
+    onTextSelected?: (text: IText) => void;
     constructor(elements: IElement[], links: IElementLink[], texts: IPaperText[]);
     get elements(): IElement[];
     get links(): IElementLink[];

package/dist/esm/index.js

@@ -9644,9 +9644,12 @@ var Paper = function (props) {
     //Listen text is selected
     useEffect(function () {
         var textSelectedListener = paperEventEmitter.onTextSelected(function (text) {
+            var _a;
             setSelectedElement(undefined);
             setSelectedElementSVG(null);
             setSelectedLink(undefined);
+            //broadcast selected text to parent component
+            (_a = props.onTextSelected) === null || _a === void 0 ? void 0 : _a.call(props, text);
         });
         return function () {
             textSelectedListener.off();
@@ -9654,10 +9657,16 @@ var Paper = function (props) {
     }, []);
     //Listen port is selected
     useEffect(function () {
-        var portSelectedListener = paperEventEmitter.onPortSelected(function (port) {
+        var portSelectedListener = paperEventEmitter.onPortSelected(function (port, elementId) {
+            var _a;
             setSelectedElement(undefined);
             setSelectedElementSVG(null);
             setSelectedLink(undefined);
+            //broadcast selected port to parent component
+            var element = elements.find(function (e) { return e.id === elementId; });
+            if (element) {
+                (_a = props.onPortSelected) === null || _a === void 0 ? void 0 : _a.call(props, port, element);
+            }
         });
         return function () {
             portSelectedListener.off();
@@ -9705,6 +9714,7 @@ var Paper = function (props) {
     };
     //Listen command delete selected for element
     useEffect(function () {
+        var _a;
         var listener = paperEventEmitter.onCommandDeleteSelectedElement(function () {
             if (selectedElement) {
                 var deletedChildElements = getDeletedChildElements(selectedElement);
@@ -9715,30 +9725,44 @@ var Paper = function (props) {
                 setSelectedElementSVG(null);
             }
         });
+        //broadcast selected element to parent component
+        if (selectedElement) {
+            (_a = props.onElementSelected) === null || _a === void 0 ? void 0 : _a.call(props, selectedElement);
+        }
         return function () {
             listener.off();
         };
     }, [selectedElement]);
     //Listen command delete selected for link
     useEffect(function () {
+        var _a;
         var listener = paperEventEmitter.onCommandDeleteSelectedLink(function () {
             if (selectedLink) {
                 setLinks(function (prev) { return prev.filter(function (l) { return l.id !== selectedLink.id; }); });
                 setSelectedLink(undefined);
             }
         });
+        //broadcast selected link to parent component
+        if (selectedLink) {
+            (_a = props.onLinkSelected) === null || _a === void 0 ? void 0 : _a.call(props, selectedLink);
+        }
         return function () {
             listener.off();
         };
     }, [selectedLink]);
     //Listen command delete selected for Text
     useEffect(function () {
+        var _a;
         var listener = paperEventEmitter.onCommandDeleteSelectedText(function () {
             if (selectedText) {
                 setTexts(function (prev) { return prev.filter(function (t) { return t.id !== selectedText.id; }); });
                 setSelectedText(undefined);
             }
         });
+        //broadcast selected text to parent component
+        if (selectedText) {
+            (_a = props.onTextSelected) === null || _a === void 0 ? void 0 : _a.call(props, selectedText);
+        }
         return function () {
             listener.off();
         };
@@ -10198,7 +10222,7 @@ var Paper = function (props) {
 function Editor(_a) {
     var editorContext = _a.editorContext;
     return (React$1.createElement(React$1.Fragment, null,
-        React$1.createElement(Paper, { size: { width: 3000, height: 3000 }, elements: editorContext.elements, links: editorContext.links, texts: editorContext.texts, onPaperClicked: editorContext.onPaperClicked, onPortMoved: editorContext.onPortMoved, onElementContextMenu: editorContext.onElementContextMenu, onElementMoved: editorContext.onElementMoved, onElementResized: editorContext.onElementResized, onLinkValidation: editorContext.validateLink, onCreatingLink: editorContext.onCreatingLink, onCreatingPortByLinking: editorContext.onCreatingPortByLinking })));
+        React$1.createElement(Paper, { size: { width: 3000, height: 3000 }, elements: editorContext.elements, links: editorContext.links, texts: editorContext.texts, onPaperClicked: editorContext.onPaperClicked, onPortMoved: editorContext.onPortMoved, onPortSelected: editorContext.onPortSelected, onElementContextMenu: editorContext.onElementContextMenu, onElementMoved: editorContext.onElementMoved, onElementResized: editorContext.onElementResized, onElementSelected: editorContext.onElementSelected, onLinkValidation: editorContext.validateLink, onCreatingLink: editorContext.onCreatingLink, onCreatingPortByLinking: editorContext.onCreatingPortByLinking, onLinkSelected: editorContext.onLinkSelected, onTextSelected: editorContext.onTextSelected })));
 }
 
 export { Circle as CircleRC, Crescent as CrescentRC, CustomPortFromJSXElement, CustomPortFromShape, CustomShape as CustomShapeRC, EditorContext, Element$1 as Element, ElementLink$1 as ElementLink, ElementLink as ElementLinkRC, Port$1 as Port, Port as PortRC, PositioningAnchor, Rectangle as RectangleRC, RectangularFrame as RectangularFrameRC, ResizingDirection, ShapeWrapper as ShapeWrapperRC, SubObjectDirection, Text$2 as Text, TextAlign, Text$1 as TextRC, Editor as default };