@finos/legend-extension-dsl-diagram - npm Package Compare versions

Comparing version 8.0.182 to 8.0.183

lib/components/studio/ClassDiagramPreview.d.ts

@@ -19,5 +19,5 @@ /**
     _class: Class;
-}) => import("react/jsx-dev-runtime").JSX.Element) & {
+}) => import("react/jsx-runtime").JSX.Element) & {
     displayName: string;
 };
 //# sourceMappingURL=ClassDiagramPreview.d.ts.map

lib/components/studio/ClassDiagramPreview.js

@@ -1,3 +0,2 @@
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
-const _jsxFileName = "/home/runner/work/legend-studio/legend-studio/packages/legend-extension-dsl-diagram/src/components/studio/ClassDiagramPreview.tsx";
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
@@ -63,4 +62,4 @@ * Copyright (c) 2020-present, Goldman Sachs
     }, [_class, classHash, diagramRenderer]);
-    return (_jsxDEV("div", { ref: ref, className: "class-editor__diagram-preview", "data-testid": DSL_DIAGRAM_TEST_ID.CLASS_DIAGRAM_PREVIEW, children: _jsxDEV("div", { ref: canvas, className: "diagram-canvas", tabIndex: 0 }, void 0, false, { fileName: _jsxFileName, lineNumber: 80, columnNumber: 7 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 74, columnNumber: 11 }, this));
+    return (_jsx("div", { ref: ref, className: "class-editor__diagram-preview", "data-testid": DSL_DIAGRAM_TEST_ID.CLASS_DIAGRAM_PREVIEW, children: _jsx("div", { ref: canvas, className: "diagram-canvas", tabIndex: 0 }) }));
 });
 //# sourceMappingURL=ClassDiagramPreview.js.map

lib/components/studio/DiagramEditor.d.ts

@@ -16,5 +16,5 @@ /**
  */
-export declare const DiagramEditor: (() => import("react/jsx-dev-runtime").JSX.Element) & {
+export declare const DiagramEditor: (() => import("react/jsx-runtime").JSX.Element) & {
     displayName: string;
 };
 //# sourceMappingURL=DiagramEditor.d.ts.map

lib/components/studio/DiagramEditor.js

@@ -1,3 +0,2 @@
-import { jsxDEV as _jsxDEV, Fragment as _Fragment } from "react/jsx-dev-runtime";
-const _jsxFileName = "/home/runner/work/legend-studio/legend-studio/packages/legend-extension-dsl-diagram/src/components/studio/DiagramEditor.tsx";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 /**
@@ -43,3 +42,3 @@ * Copyright (c) 2020-present, Goldman Sachs
     });
-    return (_jsxDEV(MenuContent, { children: _jsxDEV(MenuContentItem, { onClick: buildQuery, children: "Query..." }, void 0, false, { fileName: _jsxFileName, lineNumber: 146, columnNumber: 9 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 144, columnNumber: 13 }, this));
+    return (_jsx(MenuContent, { children: _jsx(MenuContentItem, { onClick: buildQuery, children: "Query..." }) }));
 }));
@@ -49,7 +48,7 @@ const DiagramRendererHotkeyInfosModal = observer((props) => {
     const applicationStore = useApplicationStore();
-    return (_jsxDEV(Dialog, { open: open, onClose: onClose, classes: {
+    return (_jsx(Dialog, { open: open, onClose: onClose, classes: {
             root: 'editor-modal__root-container',
             container: 'editor-modal__container',
             paper: 'editor-modal__content--scrollable',
-        }, children: _jsxDEV(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, className: "modal--scrollable diagram-editor__hotkeys__dialog", children: [_jsxDEV(ModalHeader, { title: "Diagram Hotkeys" }, void 0, false, { fileName: _jsxFileName, lineNumber: 172, columnNumber: 11 }, this), _jsxDEV(ModalBody, { children: _jsxDEV("div", { className: "diagram-editor__hotkey__groups", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Use view tool" }, void 0, false, { fileName: _jsxFileName, lineNumber: 176, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "V" }, void 0, false, { fileName: _jsxFileName, lineNumber: 180, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 179, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 175, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Use pan tool" }, void 0, false, { fileName: _jsxFileName, lineNumber: 184, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "M" }, void 0, false, { fileName: _jsxFileName, lineNumber: 188, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 187, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 183, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Zoom" }, void 0, false, { fileName: _jsxFileName, lineNumber: 192, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "Z" }, void 0, false, { fileName: _jsxFileName, lineNumber: 194, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 193, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 191, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Recenter" }, void 0, false, { fileName: _jsxFileName, lineNumber: 198, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "R" }, void 0, false, { fileName: _jsxFileName, lineNumber: 202, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 201, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 197, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__groups__divider" }, void 0, false, { fileName: _jsxFileName, lineNumber: 206, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Remove selected element(s)" }, void 0, false, { fileName: _jsxFileName, lineNumber: 208, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "Remove" }, void 0, false, { fileName: _jsxFileName, lineNumber: 212, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 211, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 207, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Edit the selected element" }, void 0, false, { fileName: _jsxFileName, lineNumber: 216, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "E" }, void 0, false, { fileName: _jsxFileName, lineNumber: 220, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 219, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 215, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__groups__divider" }, void 0, false, { fileName: _jsxFileName, lineNumber: 224, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Use property tool" }, void 0, false, { fileName: _jsxFileName, lineNumber: 226, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "P" }, void 0, false, { fileName: _jsxFileName, lineNumber: 230, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 229, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 225, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Use inheritance tool" }, void 0, false, { fileName: _jsxFileName, lineNumber: 234, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "I" }, void 0, false, { fileName: _jsxFileName, lineNumber: 238, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 237, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 233, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Add class" }, void 0, false, { fileName: _jsxFileName, lineNumber: 242, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "C" }, void 0, false, { fileName: _jsxFileName, lineNumber: 246, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 245, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 241, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Add simple property to selected class" }, void 0, false, { fileName: _jsxFileName, lineNumber: 250, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsxDEV("div", { className: "hotkey__key", children: "Alt" }, void 0, false, { fileName: _jsxFileName, lineNumber: 254, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__plus", children: _jsxDEV(PlusIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 256, columnNumber: 21 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 255, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__key", children: "\u2193" }, void 0, false, { fileName: _jsxFileName, lineNumber: 258, columnNumber: 19 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 253, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 249, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__groups__divider" }, void 0, false, { fileName: _jsxFileName, lineNumber: 262, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Toggle display for properties of selected classes" }, void 0, false, { fileName: _jsxFileName, lineNumber: 264, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsxDEV("div", { className: "hotkey__key", children: "Alt" }, void 0, false, { fileName: _jsxFileName, lineNumber: 268, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__plus", children: _jsxDEV(PlusIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 270, columnNumber: 21 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 269, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__key", children: "P" }, void 0, false, { fileName: _jsxFileName, lineNumber: 272, columnNumber: 19 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 267, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 263, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Toggle display for tagged values of selected classes" }, void 0, false, { fileName: _jsxFileName, lineNumber: 276, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsxDEV("div", { className: "hotkey__key", children: "Alt" }, void 0, false, { fileName: _jsxFileName, lineNumber: 280, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__plus", children: _jsxDEV(PlusIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 282, columnNumber: 21 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 281, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__key", children: "T" }, void 0, false, { fileName: _jsxFileName, lineNumber: 284, columnNumber: 19 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 279, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 275, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Toggle display for stereotypes of selected classes" }, void 0, false, { fileName: _jsxFileName, lineNumber: 288, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsxDEV("div", { className: "hotkey__key", children: "Alt" }, void 0, false, { fileName: _jsxFileName, lineNumber: 292, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__plus", children: _jsxDEV(PlusIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 294, columnNumber: 21 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 293, columnNumber: 19 }, this), _jsxDEV("div", { className: "hotkey__key", children: "S" }, void 0, false, { fileName: _jsxFileName, lineNumber: 296, columnNumber: 19 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 291, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 287, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__groups__divider" }, void 0, false, { fileName: _jsxFileName, lineNumber: 300, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Eject the property" }, void 0, false, { fileName: _jsxFileName, lineNumber: 302, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "\u2192" }, void 0, false, { fileName: _jsxFileName, lineNumber: 306, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 305, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 301, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Add subtypes of the selected classes to the diagram" }, void 0, false, { fileName: _jsxFileName, lineNumber: 310, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "\u2193" }, void 0, false, { fileName: _jsxFileName, lineNumber: 314, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 313, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 309, columnNumber: 15 }, this), _jsxDEV("div", { className: "diagram-editor__hotkey__group", children: [_jsxDEV("div", { className: "diagram-editor__hotkey__annotation", children: "Add supertypes of the selected classes to the diagram" }, void 0, false, { fileName: _jsxFileName, lineNumber: 318, columnNumber: 17 }, this), _jsxDEV("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsxDEV("div", { className: "hotkey__key", children: "\u2191" }, void 0, false, { fileName: _jsxFileName, lineNumber: 322, columnNumber: 19 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 321, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 317, columnNumber: 15 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 174, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 173, columnNumber: 11 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 166, columnNumber: 9 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 156, columnNumber: 13 }, this));
+        }, children: _jsxs(Modal, { darkMode: !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled, className: "modal--scrollable diagram-editor__hotkeys__dialog", children: [_jsx(ModalHeader, { title: "Diagram Hotkeys" }), _jsx(ModalBody, { children: _jsxs("div", { className: "diagram-editor__hotkey__groups", children: [_jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Use view tool" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "V" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Use pan tool" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "M" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Zoom" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "Z" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Recenter" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "R" }) })] }), _jsx("div", { className: "diagram-editor__hotkey__groups__divider" }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Remove selected element(s)" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "Remove" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Edit the selected element" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "E" }) })] }), _jsx("div", { className: "diagram-editor__hotkey__groups__divider" }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Use property tool" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "P" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Use inheritance tool" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "I" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Add class" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "C" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Add simple property to selected class" }), _jsxs("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsx("div", { className: "hotkey__key", children: "Alt" }), _jsx("div", { className: "hotkey__plus", children: _jsx(PlusIcon, {}) }), _jsx("div", { className: "hotkey__key", children: "\u2193" })] })] }), _jsx("div", { className: "diagram-editor__hotkey__groups__divider" }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Toggle display for properties of selected classes" }), _jsxs("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsx("div", { className: "hotkey__key", children: "Alt" }), _jsx("div", { className: "hotkey__plus", children: _jsx(PlusIcon, {}) }), _jsx("div", { className: "hotkey__key", children: "P" })] })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Toggle display for tagged values of selected classes" }), _jsxs("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsx("div", { className: "hotkey__key", children: "Alt" }), _jsx("div", { className: "hotkey__plus", children: _jsx(PlusIcon, {}) }), _jsx("div", { className: "hotkey__key", children: "T" })] })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Toggle display for stereotypes of selected classes" }), _jsxs("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: [_jsx("div", { className: "hotkey__key", children: "Alt" }), _jsx("div", { className: "hotkey__plus", children: _jsx(PlusIcon, {}) }), _jsx("div", { className: "hotkey__key", children: "S" })] })] }), _jsx("div", { className: "diagram-editor__hotkey__groups__divider" }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Eject the property" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "\u2192" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Add subtypes of the selected classes to the diagram" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "\u2193" }) })] }), _jsxs("div", { className: "diagram-editor__hotkey__group", children: [_jsx("div", { className: "diagram-editor__hotkey__annotation", children: "Add supertypes of the selected classes to the diagram" }), _jsx("div", { className: "hotkey__combination diagram-editor__hotkey__keys", children: _jsx("div", { className: "hotkey__key", children: "\u2191" }) })] })] }) })] }) }));
 });
@@ -67,11 +66,11 @@ const DiagramEditorToolPanel = observer((props) => {
     };
-    return (_jsxDEV("div", { className: "diagram-editor__tools", children: [_jsxDEV("button", { className: clsx('diagram-editor__tool', {
+    return (_jsxs("div", { className: "diagram-editor__tools", children: [_jsx("button", { className: clsx('diagram-editor__tool', {
                     'diagram-editor__tool--active': renderer.interactionMode === DIAGRAM_INTERACTION_MODE.LAYOUT,
-                }), tabIndex: -1, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.LAYOUT, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), title: "View Tool (V)", children: _jsxDEV(MousePointerIcon, { className: "diagram-editor__icon--layout" }, void 0, false, { fileName: _jsxFileName, lineNumber: 367, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 355, columnNumber: 9 }, this), _jsxDEV("button", { className: clsx('diagram-editor__tool', {
+                }), tabIndex: -1, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.LAYOUT, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), title: "View Tool (V)", children: _jsx(MousePointerIcon, { className: "diagram-editor__icon--layout" }) }), _jsx("button", { className: clsx('diagram-editor__tool', {
                     'diagram-editor__tool--active': renderer.interactionMode === DIAGRAM_INTERACTION_MODE.PAN,
-                }), tabIndex: -1, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.PAN, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), title: "Pan Tool (M)", children: _jsxDEV(MoveIcon, { className: "diagram-editor__icon--pan" }, void 0, false, { fileName: _jsxFileName, lineNumber: 381, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 369, columnNumber: 9 }, this), _jsxDEV("button", { className: clsx('diagram-editor__tool', {
+                }), tabIndex: -1, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.PAN, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), title: "Pan Tool (M)", children: _jsx(MoveIcon, { className: "diagram-editor__icon--pan" }) }), _jsx("button", { className: clsx('diagram-editor__tool', {
                     'diagram-editor__tool--active': renderer.interactionMode === DIAGRAM_INTERACTION_MODE.ZOOM_IN,
-                }), tabIndex: -1, title: "Zoom In (Z)", onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ZOOM_IN, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), children: _jsxDEV(ZoomInIcon, { className: "diagram-editor__icon--zoom-in" }, void 0, false, { fileName: _jsxFileName, lineNumber: 395, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 383, columnNumber: 9 }, this), _jsxDEV("button", { className: clsx('diagram-editor__tool', {
+                }), tabIndex: -1, title: "Zoom In (Z)", onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ZOOM_IN, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), children: _jsx(ZoomInIcon, { className: "diagram-editor__icon--zoom-in" }) }), _jsx("button", { className: clsx('diagram-editor__tool', {
                     'diagram-editor__tool--active': renderer.interactionMode === DIAGRAM_INTERACTION_MODE.ZOOM_OUT,
-                }), tabIndex: -1, title: "Zoom Out (Z)", onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ZOOM_OUT, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), children: _jsxDEV(ZoomOutIcon, { className: "diagram-editor__icon--zoom-out" }, void 0, false, { fileName: _jsxFileName, lineNumber: 409, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 397, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__tools__divider" }, void 0, false, { fileName: _jsxFileName, lineNumber: 411, columnNumber: 9 }, this), _jsxDEV("button", { className: clsx('diagram-editor__tool', {
+                }), tabIndex: -1, title: "Zoom Out (Z)", onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ZOOM_OUT, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), children: _jsx(ZoomOutIcon, { className: "diagram-editor__icon--zoom-out" }) }), _jsx("div", { className: "diagram-editor__tools__divider" }), _jsx("button", { className: clsx('diagram-editor__tool', {
                     'diagram-editor__tool--active': renderer.interactionMode ===
@@ -81,3 +80,3 @@ DIAGRAM_INTERACTION_MODE.ADD_RELATIONSHIP &&
                             DIAGRAM_RELATIONSHIP_EDIT_MODE.PROPERTY,
-                }), tabIndex: -1, title: "Property Tool (P)", disabled: isReadOnly, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ADD_RELATIONSHIP, DIAGRAM_RELATIONSHIP_EDIT_MODE.PROPERTY), children: _jsxDEV(MinusIcon, { className: "diagram-editor__icon--property" }, void 0, false, { fileName: _jsxFileName, lineNumber: 428, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 412, columnNumber: 9 }, this), _jsxDEV("button", { className: clsx('diagram-editor__tool', {
+                }), tabIndex: -1, title: "Property Tool (P)", disabled: isReadOnly, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ADD_RELATIONSHIP, DIAGRAM_RELATIONSHIP_EDIT_MODE.PROPERTY), children: _jsx(MinusIcon, { className: "diagram-editor__icon--property" }) }), _jsx("button", { className: clsx('diagram-editor__tool', {
                     'diagram-editor__tool--active': renderer.interactionMode ===
@@ -87,3 +86,3 @@ DIAGRAM_INTERACTION_MODE.ADD_RELATIONSHIP &&
                             DIAGRAM_RELATIONSHIP_EDIT_MODE.INHERITANCE,
-                }), tabIndex: -1, title: "Inheritance Tool (I)", disabled: isReadOnly, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ADD_RELATIONSHIP, DIAGRAM_RELATIONSHIP_EDIT_MODE.INHERITANCE), children: _jsxDEV(TriangleIcon, { className: "diagram-editor__icon--inheritance" }, void 0, false, { fileName: _jsxFileName, lineNumber: 446, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 430, columnNumber: 9 }, this), _jsxDEV("button", { className: clsx('diagram-editor__tool', {
+                }), tabIndex: -1, title: "Inheritance Tool (I)", disabled: isReadOnly, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ADD_RELATIONSHIP, DIAGRAM_RELATIONSHIP_EDIT_MODE.INHERITANCE), children: _jsx(TriangleIcon, { className: "diagram-editor__icon--inheritance" }) }), _jsx("button", { className: clsx('diagram-editor__tool', {
                 // 'diagram-editor__tool--active':
@@ -93,5 +92,5 @@ //   diagramRenderer.editMode === DIAGRAM_EDIT_MODE.RELATIONSHIP &&
                 //     DIAGRAM_RELATIONSHIP_EDIT_MODE.ASSOCIATION,
-                }), tabIndex: -1, title: "Association Tool", disabled: true, children: _jsxDEV(ResizeIcon, { className: "diagram-editor__icon--association" }, void 0, false, { fileName: _jsxFileName, lineNumber: 463, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 448, columnNumber: 9 }, this), _jsxDEV("button", { className: clsx('diagram-editor__tool', {
+                }), tabIndex: -1, title: "Association Tool", disabled: true, children: _jsx(ResizeIcon, { className: "diagram-editor__icon--association" }) }), _jsx("button", { className: clsx('diagram-editor__tool', {
                     'diagram-editor__tool--active': renderer.interactionMode === DIAGRAM_INTERACTION_MODE.ADD_CLASS,
-                }), tabIndex: -1, title: "Add class tool (C)", disabled: isReadOnly, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ADD_CLASS, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), children: _jsxDEV(PlusCircleIcon, { className: "diagram-editor__icon--add-class" }, void 0, false, { fileName: _jsxFileName, lineNumber: 478, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 465, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__tools__divider" }, void 0, false, { fileName: _jsxFileName, lineNumber: 480, columnNumber: 9 }, this), _jsxDEV("button", { className: "diagram-editor__tool", tabIndex: -1, title: "Show Hotkeys", onClick: showDiagramRendererHokeysModal, children: _jsxDEV(KeyboardIcon, { className: "diagram-editor__icon--hotkey-info" }, void 0, false, { fileName: _jsxFileName, lineNumber: 487, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 481, columnNumber: 9 }, this), _jsxDEV(DiagramRendererHotkeyInfosModal, { open: diagramEditorState.showHotkeyInfosModal, onClose: hideDiagramRendererHokeysModal }, void 0, false, { fileName: _jsxFileName, lineNumber: 489, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 353, columnNumber: 13 }, this));
+                }), tabIndex: -1, title: "Add class tool (C)", disabled: isReadOnly, onClick: createModeSwitcher(DIAGRAM_INTERACTION_MODE.ADD_CLASS, DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE), children: _jsx(PlusCircleIcon, { className: "diagram-editor__icon--add-class" }) }), _jsx("div", { className: "diagram-editor__tools__divider" }), _jsx("button", { className: "diagram-editor__tool", tabIndex: -1, title: "Show Hotkeys", onClick: showDiagramRendererHokeysModal, children: _jsx(KeyboardIcon, { className: "diagram-editor__icon--hotkey-info" }) }), _jsx(DiagramRendererHotkeyInfosModal, { open: diagramEditorState.showHotkeyInfosModal, onClose: hideDiagramRendererHokeysModal })] }));
 });
@@ -138,11 +137,11 @@ const DiagramEditorClassViewEditor = observer((props) => {
     };
-    return (_jsxDEV("div", { className: "diagram-editor__class-view-editor", children: [_jsxDEV("div", { className: "diagram-editor__class-view-editor__header", children: _jsxDEV("div", { className: "diagram-editor__class-view-editor__header__tabs", children: tabs.map((tab) => (_jsxDEV("div", { onClick: changeTab(tab), className: clsx('diagram-editor__class-view-editor__header__tab', {
+    return (_jsxs("div", { className: "diagram-editor__class-view-editor", children: [_jsx("div", { className: "diagram-editor__class-view-editor__header", children: _jsx("div", { className: "diagram-editor__class-view-editor__header__tabs", children: tabs.map((tab) => (_jsx("div", { onClick: changeTab(tab), className: clsx('diagram-editor__class-view-editor__header__tab', {
                             'diagram-editor__class-view-editor__header__tab--active': tab === selectedTab,
-                        }), children: prettyCONSTName(tab) }, tab, false, { fileName: _jsxFileName, lineNumber: 554, columnNumber: 33 }, this))) }, void 0, false, { fileName: _jsxFileName, lineNumber: 553, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 552, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__class-view-editor__content", children: [DIAGRAM_EDITOR_SIDE_PANEL_TAB.ELEMENT === selectedTab && (_jsxDEV(ClassFormEditor, { _class: classViewEditorState.classEditorState.class, editorState: classViewEditorState.classEditorState, onHashChange: redrawOnClassChange }, void 0, false, { fileName: _jsxFileName, lineNumber: 572, columnNumber: 70 }, this)), DIAGRAM_EDITOR_SIDE_PANEL_TAB.VIEW === selectedTab && (_jsxDEV("div", { className: "panel__content__form diagram-editor__class-view-editor__content__form", children: _jsxDEV("div", { className: "panel__content__form__section", children: [_jsxDEV("div", { className: clsx('panel__content__form__section__toggler'), onClick: toggleHideProperties, children: [_jsxDEV("button", { className: clsx('panel__content__form__section__toggler__btn', {
+                        }), children: prettyCONSTName(tab) }, tab))) }) }), _jsxs("div", { className: "diagram-editor__class-view-editor__content", children: [DIAGRAM_EDITOR_SIDE_PANEL_TAB.ELEMENT === selectedTab && (_jsx(ClassFormEditor, { _class: classViewEditorState.classEditorState.class, editorState: classViewEditorState.classEditorState, onHashChange: redrawOnClassChange })), DIAGRAM_EDITOR_SIDE_PANEL_TAB.VIEW === selectedTab && (_jsx("div", { className: "panel__content__form diagram-editor__class-view-editor__content__form", children: _jsxs("div", { className: "panel__content__form__section", children: [_jsxs("div", { className: clsx('panel__content__form__section__toggler'), onClick: toggleHideProperties, children: [_jsx("button", { className: clsx('panel__content__form__section__toggler__btn', {
                                                 'panel__content__form__section__toggler__btn--toggled': classView.hideProperties,
-                                            }), disabled: isReadOnly, children: classView.hideProperties ? (_jsxDEV(CheckSquareIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 597, columnNumber: 50 }, this)) : (_jsxDEV(SquareIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 599, columnNumber: 26 }, this)) }, void 0, false, { fileName: _jsxFileName, lineNumber: 587, columnNumber: 19 }, this), _jsxDEV("div", { className: "panel__content__form__section__toggler__prompt", children: "Specifies if properties should be hidden" }, void 0, false, { fileName: _jsxFileName, lineNumber: 603, columnNumber: 19 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 583, columnNumber: 17 }, this), _jsxDEV("div", { className: clsx('panel__content__form__section__toggler'), onClick: toggleHideTaggedValues, children: [_jsxDEV("button", { className: clsx('panel__content__form__section__toggler__btn', {
+                                            }), disabled: isReadOnly, children: classView.hideProperties ? (_jsx(CheckSquareIcon, {})) : (_jsx(SquareIcon, {})) }), _jsx("div", { className: "panel__content__form__section__toggler__prompt", children: "Specifies if properties should be hidden" })] }), _jsxs("div", { className: clsx('panel__content__form__section__toggler'), onClick: toggleHideTaggedValues, children: [_jsx("button", { className: clsx('panel__content__form__section__toggler__btn', {
                                                 'panel__content__form__section__toggler__btn--toggled': classView.hideTaggedValues,
-                                            }), disabled: isReadOnly, children: classView.hideTaggedValues ? (_jsxDEV(CheckSquareIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 622, columnNumber: 52 }, this)) : (_jsxDEV(SquareIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 624, columnNumber: 26 }, this)) }, void 0, false, { fileName: _jsxFileName, lineNumber: 612, columnNumber: 19 }, this), _jsxDEV("div", { className: "panel__content__form__section__toggler__prompt", children: "Specifies if tagged values should be hidden" }, void 0, false, { fileName: _jsxFileName, lineNumber: 628, columnNumber: 19 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 608, columnNumber: 17 }, this), _jsxDEV("div", { className: clsx('panel__content__form__section__toggler'), onClick: toggleHideStereotypes, children: [_jsxDEV("button", { className: clsx('panel__content__form__section__toggler__btn', {
+                                            }), disabled: isReadOnly, children: classView.hideTaggedValues ? (_jsx(CheckSquareIcon, {})) : (_jsx(SquareIcon, {})) }), _jsx("div", { className: "panel__content__form__section__toggler__prompt", children: "Specifies if tagged values should be hidden" })] }), _jsxs("div", { className: clsx('panel__content__form__section__toggler'), onClick: toggleHideStereotypes, children: [_jsx("button", { className: clsx('panel__content__form__section__toggler__btn', {
                                                 'panel__content__form__section__toggler__btn--toggled': classView.hideStereotypes,
-                                            }), disabled: isReadOnly, children: classView.hideStereotypes ? (_jsxDEV(CheckSquareIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 647, columnNumber: 51 }, this)) : (_jsxDEV(SquareIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 649, columnNumber: 26 }, this)) }, void 0, false, { fileName: _jsxFileName, lineNumber: 637, columnNumber: 19 }, this), _jsxDEV("div", { className: "panel__content__form__section__toggler__prompt", children: "Specifies if stereotypes should be hidden" }, void 0, false, { fileName: _jsxFileName, lineNumber: 653, columnNumber: 19 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 633, columnNumber: 17 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 581, columnNumber: 15 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 579, columnNumber: 67 }, this))] }, void 0, true, { fileName: _jsxFileName, lineNumber: 571, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 550, columnNumber: 13 }, this));
+                                            }), disabled: isReadOnly, children: classView.hideStereotypes ? (_jsx(CheckSquareIcon, {})) : (_jsx(SquareIcon, {})) }), _jsx("div", { className: "panel__content__form__section__toggler__prompt", children: "Specifies if stereotypes should be hidden" })] })] }) }))] })] }));
 });
@@ -160,4 +159,4 @@ const DiagramEditorOverlay = observer((props) => {
     });
-    return (_jsxDEV(ResizablePanelGroup, { className: "diagram-editor__overlay", orientation: "vertical", children: [_jsxDEV(ResizablePanel, { ...sidePanelCollapsiblePanelGroupProps.remainingPanel, minSize: 300, children: _jsxDEV("div", { className: "diagram-editor__view-finder" }, void 0, false, { fileName: _jsxFileName, lineNumber: 696, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 692, columnNumber: 9 }, this), _jsxDEV(ResizablePanelSplitter, { className: "diagram-editor__overlay__panel-resizer" }, void 0, false, { fileName: _jsxFileName, lineNumber: 698, columnNumber: 9 }, this), _jsxDEV(ResizablePanel, { ...sidePanelCollapsiblePanelGroupProps.collapsiblePanel, direction: -1, children: _jsxDEV("div", { className: "panel diagram-editor__side-panel", children: [sidePanelState instanceof
-                            DiagramEditorClassViewEditorSidePanelState && (_jsxDEV(DiagramEditorClassViewEditor, { classViewEditorState: sidePanelState }, void 0, false, { fileName: _jsxFileName, lineNumber: 705, columnNumber: 62 }, this)), !sidePanelState && (_jsxDEV(BlankPanelContent, { children: "No element selected" }, void 0, false, { fileName: _jsxFileName, lineNumber: 710, columnNumber: 34 }, this))] }, void 0, true, { fileName: _jsxFileName, lineNumber: 703, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 699, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 687, columnNumber: 13 }, this));
+    return (_jsxs(ResizablePanelGroup, { className: "diagram-editor__overlay", orientation: "vertical", children: [_jsx(ResizablePanel, { ...sidePanelCollapsiblePanelGroupProps.remainingPanel, minSize: 300, children: _jsx("div", { className: "diagram-editor__view-finder" }) }), _jsx(ResizablePanelSplitter, { className: "diagram-editor__overlay__panel-resizer" }), _jsx(ResizablePanel, { ...sidePanelCollapsiblePanelGroupProps.collapsiblePanel, direction: -1, children: _jsxs("div", { className: "panel diagram-editor__side-panel", children: [sidePanelState instanceof
+                            DiagramEditorClassViewEditorSidePanelState && (_jsx(DiagramEditorClassViewEditor, { classViewEditorState: sidePanelState })), !sidePanelState && (_jsx(BlankPanelContent, { children: "No element selected" }))] }) })] }));
 });
@@ -199,3 +198,3 @@ const DiagramEditorInlineClassRenamerContent = observer((props) => {
     }, [inlineClassRenamerState]);
-    return (_jsxDEV("form", { className: "diagram-editor__inline-class-creator", children: [_jsxDEV("div", { className: "input-group", children: [_jsxDEV("input", { className: "diagram-editor__inline-class-creator__path input-group__input input--dark", ref: pathInputRef, disabled: isReadOnly, value: name, placeholder: "Enter class name", onChange: changePath }, void 0, false, { fileName: _jsxFileName, lineNumber: 770, columnNumber: 11 }, this), classCreationValidationErrorMessage && (_jsxDEV("div", { className: "input-group__error-message", children: classCreationValidationErrorMessage }, void 0, false, { fileName: _jsxFileName, lineNumber: 778, columnNumber: 52 }, this))] }, void 0, true, { fileName: _jsxFileName, lineNumber: 769, columnNumber: 9 }, this), _jsxDEV("button", { type: "submit", className: "diagram-editor__inline-class-creator__close-btn", onClick: close }, void 0, false, { fileName: _jsxFileName, lineNumber: 784, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 767, columnNumber: 13 }, this));
+    return (_jsxs("form", { className: "diagram-editor__inline-class-creator", children: [_jsxs("div", { className: "input-group", children: [_jsx("input", { className: "diagram-editor__inline-class-creator__path input-group__input input--dark", ref: pathInputRef, disabled: isReadOnly, value: name, placeholder: "Enter class name", onChange: changePath }), classCreationValidationErrorMessage && (_jsx("div", { className: "input-group__error-message", children: classCreationValidationErrorMessage }))] }), _jsx("button", { type: "submit", className: "diagram-editor__inline-class-creator__close-btn", onClick: close })] }));
 });
@@ -211,3 +210,3 @@ const DiagramEditorInlineClassRenamer = observer((props) => {
         : new Point(0, 0);
-    return (_jsxDEV(BasePopover, { onClose: closeEditor, anchorPosition: {
+    return (_jsx(BasePopover, { onClose: closeEditor, anchorPosition: {
             left: anchorPositionPoint.x,
@@ -217,3 +216,3 @@ top: anchorPositionPoint.y,
             invisible: true,
-        }, elevation: 0, marginThreshold: 0, disableRestoreFocus: true, children: _jsxDEV("div", { className: "diagram-editor__inline-class-creator__container", children: inlineClassRenamerState && (_jsxDEV(DiagramEditorInlineClassRenamerContent, { inlineClassRenamerState: inlineClassRenamerState }, void 0, false, { fileName: _jsxFileName, lineNumber: 826, columnNumber: 40 }, this)) }, void 0, false, { fileName: _jsxFileName, lineNumber: 825, columnNumber: 9 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 809, columnNumber: 13 }, this));
+        }, elevation: 0, marginThreshold: 0, disableRestoreFocus: true, children: _jsx("div", { className: "diagram-editor__inline-class-creator__container", children: inlineClassRenamerState && (_jsx(DiagramEditorInlineClassRenamerContent, { inlineClassRenamerState: inlineClassRenamerState })) }) }));
 });
@@ -261,3 +260,3 @@ const DiagramEditorInlineClassCreatorContent = observer((props) => {
     }, [inlineClassCreatorState]);
-    return (_jsxDEV("form", { className: "diagram-editor__inline-class-creator", children: [_jsxDEV("div", { className: "input-group", children: [_jsxDEV("input", { className: "diagram-editor__inline-class-creator__path input-group__input input--dark", ref: pathInputRef, disabled: isReadOnly, value: path, placeholder: "Enter class path", onChange: changePath }, void 0, false, { fileName: _jsxFileName, lineNumber: 902, columnNumber: 11 }, this), classCreationValidationErrorMessage && (_jsxDEV("div", { className: "input-group__error-message", children: classCreationValidationErrorMessage }, void 0, false, { fileName: _jsxFileName, lineNumber: 910, columnNumber: 52 }, this))] }, void 0, true, { fileName: _jsxFileName, lineNumber: 901, columnNumber: 9 }, this), _jsxDEV("button", { type: "submit", className: "diagram-editor__inline-class-creator__close-btn", onClick: close }, void 0, false, { fileName: _jsxFileName, lineNumber: 916, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 899, columnNumber: 13 }, this));
+    return (_jsxs("form", { className: "diagram-editor__inline-class-creator", children: [_jsxs("div", { className: "input-group", children: [_jsx("input", { className: "diagram-editor__inline-class-creator__path input-group__input input--dark", ref: pathInputRef, disabled: isReadOnly, value: path, placeholder: "Enter class path", onChange: changePath }), classCreationValidationErrorMessage && (_jsx("div", { className: "input-group__error-message", children: classCreationValidationErrorMessage }))] }), _jsx("button", { type: "submit", className: "diagram-editor__inline-class-creator__close-btn", onClick: close })] }));
 });
@@ -273,3 +272,3 @@ const DiagramEditorInlineClassCreator = observer((props) => {
         : new Point(0, 0);
-    return (_jsxDEV(BasePopover, { onClose: closeEditor, anchorPosition: {
+    return (_jsx(BasePopover, { onClose: closeEditor, anchorPosition: {
             left: anchorPositionPoint.x,
@@ -279,3 +278,3 @@ top: anchorPositionPoint.y,
             invisible: true,
-        }, elevation: 0, marginThreshold: 0, disableRestoreFocus: true, children: _jsxDEV("div", { className: "diagram-editor__inline-class-creator__container", children: inlineClassCreatorState && (_jsxDEV(DiagramEditorInlineClassCreatorContent, { inlineClassCreatorState: inlineClassCreatorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 958, columnNumber: 40 }, this)) }, void 0, false, { fileName: _jsxFileName, lineNumber: 957, columnNumber: 9 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 941, columnNumber: 13 }, this));
+        }, elevation: 0, marginThreshold: 0, disableRestoreFocus: true, children: _jsx("div", { className: "diagram-editor__inline-class-creator__container", children: inlineClassCreatorState && (_jsx(DiagramEditorInlineClassCreatorContent, { inlineClassCreatorState: inlineClassCreatorState })) }) }));
 });
@@ -306,3 +305,3 @@ const DiagramEditorInlinePropertyMultiplicityEditor = observer((props) => {
     };
-    return (_jsxDEV("div", { className: "diagram-editor__inline-property-editor__multiplicity-editor", children: [_jsxDEV("input", { className: "diagram-editor__inline-property-editor__multiplicity-editor__bound input--dark", disabled: isReadOnly, spellCheck: false, value: lowerBound, onChange: changeLowerBound }, void 0, false, { fileName: _jsxFileName, lineNumber: 1015, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__inline-property-editor__multiplicity-editor__range", children: ".." }, void 0, false, { fileName: _jsxFileName, lineNumber: 1022, columnNumber: 9 }, this), _jsxDEV("input", { className: "diagram-editor__inline-property-editor__multiplicity-editor__bound input--dark", disabled: isReadOnly, spellCheck: false, value: upperBound, onChange: changeUpperBound }, void 0, false, { fileName: _jsxFileName, lineNumber: 1025, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1013, columnNumber: 13 }, this));
+    return (_jsxs("div", { className: "diagram-editor__inline-property-editor__multiplicity-editor", children: [_jsx("input", { className: "diagram-editor__inline-property-editor__multiplicity-editor__bound input--dark", disabled: isReadOnly, spellCheck: false, value: lowerBound, onChange: changeLowerBound }), _jsx("div", { className: "diagram-editor__inline-property-editor__multiplicity-editor__range", children: ".." }), _jsx("input", { className: "diagram-editor__inline-property-editor__multiplicity-editor__bound input--dark", disabled: isReadOnly, spellCheck: false, value: upperBound, onChange: changeUpperBound })] }));
 });
@@ -353,6 +352,6 @@ const DiagramEditorInlinePropertyEditorContent = observer((props) => {
     }, [inlinePropertyEditorState]);
-    return (_jsxDEV("form", { className: clsx('diagram-editor__inline-property-editor', {
+    return (_jsxs("form", { className: clsx('diagram-editor__inline-property-editor', {
             'diagram-editor__inline-property-editor--with-type': !inlinePropertyEditorState.isEditingPropertyView,
-        }), children: [_jsxDEV("input", { className: "diagram-editor__inline-property-editor__name input--dark", ref: propertyNameInputRef, disabled: isReadOnly, value: property.name, onChange: changePropertyName }, void 0, false, { fileName: _jsxFileName, lineNumber: 1102, columnNumber: 9 }, this), !inlinePropertyEditorState.isEditingPropertyView && (_jsxDEV(CustomSelectorInput, { className: "diagram-editor__inline-property-editor__type", disabled: isReadOnly, options: propertyTypeOptions, onChange: changePropertyType, value: selectedPropertyType, placeholder: "Choose a type...", darkMode: !applicationStore.layoutService
-                    .TEMPORARY__isLightColorThemeEnabled, filterOption: propertyTypeFilterOption }, void 0, false, { fileName: _jsxFileName, lineNumber: 1109, columnNumber: 63 }, this)), _jsxDEV(DiagramEditorInlinePropertyMultiplicityEditor, { isReadOnly: isReadOnly, value: property.multiplicity, updateValue: changeMultiplicity }, void 0, false, { fileName: _jsxFileName, lineNumber: 1124, columnNumber: 9 }, this), _jsxDEV("button", { type: "submit", className: "diagram-editor__inline-property-editor__close-btn", onClick: close }, void 0, false, { fileName: _jsxFileName, lineNumber: 1129, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1095, columnNumber: 13 }, this));
+        }), children: [_jsx("input", { className: "diagram-editor__inline-property-editor__name input--dark", ref: propertyNameInputRef, disabled: isReadOnly, value: property.name, onChange: changePropertyName }), !inlinePropertyEditorState.isEditingPropertyView && (_jsx(CustomSelectorInput, { className: "diagram-editor__inline-property-editor__type", disabled: isReadOnly, options: propertyTypeOptions, onChange: changePropertyType, value: selectedPropertyType, placeholder: "Choose a type...", darkMode: !applicationStore.layoutService
+                    .TEMPORARY__isLightColorThemeEnabled, filterOption: propertyTypeFilterOption })), _jsx(DiagramEditorInlinePropertyMultiplicityEditor, { isReadOnly: isReadOnly, value: property.multiplicity, updateValue: changeMultiplicity }), _jsx("button", { type: "submit", className: "diagram-editor__inline-property-editor__close-btn", onClick: close })] }));
 });
@@ -368,3 +367,3 @@ const DiagramEditorInlinePropertyEditor = observer((props) => {
         : new Point(0, 0);
-    return (_jsxDEV(BasePopover, { onClose: closeEditor, anchorPosition: {
+    return (_jsx(BasePopover, { onClose: closeEditor, anchorPosition: {
             left: anchorPositionPoint.x,
@@ -374,3 +373,3 @@ top: anchorPositionPoint.y,
             invisible: true,
-        }, elevation: 0, marginThreshold: 0, disableRestoreFocus: true, children: _jsxDEV("div", { className: "diagram-editor__inline-property-editor__container", children: inlinePropertyEditorState && (_jsxDEV(DiagramEditorInlinePropertyEditorContent, { inlinePropertyEditorState: inlinePropertyEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1172, columnNumber: 42 }, this)) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1171, columnNumber: 9 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1155, columnNumber: 13 }, this));
+        }, elevation: 0, marginThreshold: 0, disableRestoreFocus: true, children: _jsx("div", { className: "diagram-editor__inline-property-editor__container", children: inlinePropertyEditorState && (_jsx(DiagramEditorInlinePropertyEditorContent, { inlinePropertyEditorState: inlinePropertyEditorState })) }) }));
 });
@@ -423,3 +422,3 @@ const DiagramEditorDiagramCanvas = observer(forwardRef(function DiagramEditorDiagramCanvas(props, ref) {
     dropConnector(diagramCanvasRef);
-    return (_jsxDEV("div", { ref: diagramCanvasRef, className: clsx('diagram-canvas diagram-editor__canvas', diagramEditorState.diagramCursorClass), "data-testid": DSL_DIAGRAM_TEST_ID.DIAGRAM_EDITOR, tabIndex: 0 }, void 0, false, { fileName: _jsxFileName, lineNumber: 1257, columnNumber: 13 }, this));
+    return (_jsx("div", { ref: diagramCanvasRef, className: clsx('diagram-canvas diagram-editor__canvas', diagramEditorState.diagramCursorClass), "data-testid": DSL_DIAGRAM_TEST_ID.DIAGRAM_EDITOR, tabIndex: 0 }));
 }));
@@ -439,9 +438,9 @@ const DiagramEditorHeader = observer((props) => {
     const isAlignerDisabled = diagramEditorState.renderer.selectedClasses.length < 2;
-    return (_jsxDEV(_Fragment, { children: [_jsxDEV("div", { className: "diagram-editor__header__group", children: [_jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align left", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_LEFT), children: _jsxDEV(AlignStartIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1304, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1293, columnNumber: 11 }, this), _jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align center", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_CENTER), children: _jsxDEV(AlignCenterIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1317, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1306, columnNumber: 11 }, this), _jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align right", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_RIGHT), children: _jsxDEV(AlignEndIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1330, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1319, columnNumber: 11 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1292, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__header__group__separator" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1333, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__header__group", children: [_jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align top", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_TOP), children: _jsxDEV(AlignTopIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1346, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1335, columnNumber: 11 }, this), _jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align middle", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_MIDDLE), children: _jsxDEV(AlignMiddleIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1359, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1348, columnNumber: 11 }, this), _jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align bottom", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_BOTTOM), children: _jsxDEV(AlignBottomIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1372, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1361, columnNumber: 11 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1334, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__header__group__separator" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1375, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__header__group", children: [_jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Space horizontally", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.SPACE_HORIZONTALLY), children: _jsxDEV(DistributeHorizontalIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1388, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1377, columnNumber: 11 }, this), _jsxDEV("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Space vertically", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.SPACE_VERTICALLY), children: _jsxDEV(DistributeVerticalIcon, { className: "diagram-editor__icon--aligner" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1401, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1390, columnNumber: 11 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1376, columnNumber: 9 }, this), _jsxDEV(DropdownMenu, { className: "diagram-editor__header__dropdown", title: "Zoom...", content: _jsxDEV(MenuContent, { children: [_jsxDEV(MenuContentItem, { className: "diagram-editor__header__zoomer__dropdown__menu__item", onClick: zoomToFit, children: "Fit" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1409, columnNumber: 15 }, this), _jsxDEV(MenuContentDivider, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 1415, columnNumber: 15 }, this), DIAGRAM_ZOOM_LEVELS.map((zoomLevel) => (_jsxDEV(MenuContentItem, { className: "diagram-editor__header__zoomer__dropdown__menu__item", onClick: createCenterZoomer(zoomLevel), children: [zoomLevel, "%"] }, zoomLevel, true, { fileName: _jsxFileName, lineNumber: 1416, columnNumber: 56 }, this)))] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1407, columnNumber: 20 }, this), menuProps: {
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "diagram-editor__header__group", children: [_jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align left", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_LEFT), children: _jsx(AlignStartIcon, { className: "diagram-editor__icon--aligner" }) }), _jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align center", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_CENTER), children: _jsx(AlignCenterIcon, { className: "diagram-editor__icon--aligner" }) }), _jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align right", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_RIGHT), children: _jsx(AlignEndIcon, { className: "diagram-editor__icon--aligner" }) })] }), _jsx("div", { className: "diagram-editor__header__group__separator" }), _jsxs("div", { className: "diagram-editor__header__group", children: [_jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align top", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_TOP), children: _jsx(AlignTopIcon, { className: "diagram-editor__icon--aligner" }) }), _jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align middle", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_MIDDLE), children: _jsx(AlignMiddleIcon, { className: "diagram-editor__icon--aligner" }) }), _jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Align bottom", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.ALIGN_BOTTOM), children: _jsx(AlignBottomIcon, { className: "diagram-editor__icon--aligner" }) })] }), _jsx("div", { className: "diagram-editor__header__group__separator" }), _jsxs("div", { className: "diagram-editor__header__group", children: [_jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Space horizontally", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.SPACE_HORIZONTALLY), children: _jsx(DistributeHorizontalIcon, { className: "diagram-editor__icon--aligner" }) }), _jsx("button", { className: "diagram-editor__header__action diagram-editor__header__group__action", title: "Space vertically", disabled: isAlignerDisabled, tabIndex: -1, onClick: () => diagramEditorState.renderer.align(DIAGRAM_ALIGNER_OPERATOR.SPACE_VERTICALLY), children: _jsx(DistributeVerticalIcon, { className: "diagram-editor__icon--aligner" }) })] }), _jsxs(DropdownMenu, { className: "diagram-editor__header__dropdown", title: "Zoom...", content: _jsxs(MenuContent, { children: [_jsx(MenuContentItem, { className: "diagram-editor__header__zoomer__dropdown__menu__item", onClick: zoomToFit, children: "Fit" }), _jsx(MenuContentDivider, {}), DIAGRAM_ZOOM_LEVELS.map((zoomLevel) => (_jsxs(MenuContentItem, { className: "diagram-editor__header__zoomer__dropdown__menu__item", onClick: createCenterZoomer(zoomLevel), children: [zoomLevel, "%"] }, zoomLevel)))] }), menuProps: {
                     anchorOrigin: { vertical: 'bottom', horizontal: 'right' },
                     transformOrigin: { vertical: 'top', horizontal: 'right' },
                     elevation: 7,
-                }, children: [_jsxDEV("div", { className: "diagram-editor__header__dropdown__label diagram-editor__header__zoomer__dropdown__label", children: [Math.round(diagramEditorState.renderer.zoom * 100), "%"] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1433, columnNumber: 11 }, this), _jsxDEV("div", { className: "diagram-editor__header__dropdown__trigger diagram-editor__header__zoomer__dropdown__trigger", children: _jsxDEV(CaretDownIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 1437, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1436, columnNumber: 11 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1404, columnNumber: 9 }, this), _jsxDEV("div", { className: "diagram-editor__header__actions", children: _jsxDEV("button", { className: clsx('diagram-editor__header__action', {
+                }, children: [_jsxs("div", { className: "diagram-editor__header__dropdown__label diagram-editor__header__zoomer__dropdown__label", children: [Math.round(diagramEditorState.renderer.zoom * 100), "%"] }), _jsx("div", { className: "diagram-editor__header__dropdown__trigger diagram-editor__header__zoomer__dropdown__trigger", children: _jsx(CaretDownIcon, {}) })] }), _jsx("div", { className: "diagram-editor__header__actions", children: _jsx("button", { className: clsx('diagram-editor__header__action', {
                         'diagram-editor__header__action--active': diagramEditorState.sidePanelDisplayState.isOpen,
-                    }), tabIndex: -1, onClick: toggleSidePanel, children: _jsxDEV(SidebarIcon, { className: "diagram-editor__icon--sidebar" }, void 0, false, { fileName: _jsxFileName, lineNumber: 1449, columnNumber: 13 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1441, columnNumber: 11 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1440, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1290, columnNumber: 13 }, this));
+                    }), tabIndex: -1, onClick: toggleSidePanel, children: _jsx(SidebarIcon, { className: "diagram-editor__icon--sidebar" }) }) })] }));
 });
@@ -455,4 +454,4 @@ export const DiagramEditor = observer(() => {
     useCommands(diagramEditorState);
-    return (_jsxDEV("div", { className: "diagram-editor", children: [_jsxDEV("div", { className: "diagram-editor__header", children: diagramEditorState.isDiagramRendererInitialized && (_jsxDEV(DiagramEditorHeader, { diagramEditorState: diagramEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1473, columnNumber: 62 }, this)) }, void 0, false, { fileName: _jsxFileName, lineNumber: 1472, columnNumber: 7 }, this), _jsxDEV("div", { className: "diagram-editor__content", children: [diagramEditorState.isDiagramRendererInitialized && (_jsxDEV(DiagramEditorOverlay, { diagramEditorState: diagramEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1478, columnNumber: 62 }, this)), _jsxDEV(ContextMenu, { className: "diagram-editor__stage", content: _jsxDEV(DiagramEditorContextMenu, { diagramEditorState: diagramEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1483, columnNumber: 20 }, this), disabled: !diagramEditorState.showContextMenu, menuProps: { elevation: 7 }, onClose: onContextMenuClose, children: [diagramEditorState.isDiagramRendererInitialized && (_jsxDEV(DiagramEditorToolPanel, { diagramEditorState: diagramEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1490, columnNumber: 64 }, this)), _jsxDEV(DiagramEditorDiagramCanvas, { diagramEditorState: diagramEditorState, ref: diagramCanvasRef }, void 0, false, { fileName: _jsxFileName, lineNumber: 1493, columnNumber: 11 }, this), diagramEditorState.isDiagramRendererInitialized && (_jsxDEV(_Fragment, { children: [_jsxDEV(DiagramEditorInlinePropertyEditor, { diagramEditorState: diagramEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1499, columnNumber: 15 }, this), _jsxDEV(DiagramEditorInlineClassCreator, { diagramEditorState: diagramEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1502, columnNumber: 15 }, this), _jsxDEV(DiagramEditorInlineClassRenamer, { diagramEditorState: diagramEditorState }, void 0, false, { fileName: _jsxFileName, lineNumber: 1505, columnNumber: 15 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1497, columnNumber: 64 }, this))] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1481, columnNumber: 9 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1477, columnNumber: 7 }, this)] }, void 0, true, { fileName: _jsxFileName, lineNumber: 1470, columnNumber: 11 }, this));
+    return (_jsxs("div", { className: "diagram-editor", children: [_jsx("div", { className: "diagram-editor__header", children: diagramEditorState.isDiagramRendererInitialized && (_jsx(DiagramEditorHeader, { diagramEditorState: diagramEditorState })) }), _jsxs("div", { className: "diagram-editor__content", children: [diagramEditorState.isDiagramRendererInitialized && (_jsx(DiagramEditorOverlay, { diagramEditorState: diagramEditorState })), _jsxs(ContextMenu, { className: "diagram-editor__stage", content: _jsx(DiagramEditorContextMenu, { diagramEditorState: diagramEditorState }), disabled: !diagramEditorState.showContextMenu, menuProps: { elevation: 7 }, onClose: onContextMenuClose, children: [diagramEditorState.isDiagramRendererInitialized && (_jsx(DiagramEditorToolPanel, { diagramEditorState: diagramEditorState })), _jsx(DiagramEditorDiagramCanvas, { diagramEditorState: diagramEditorState, ref: diagramCanvasRef }), diagramEditorState.isDiagramRendererInitialized && (_jsxs(_Fragment, { children: [_jsx(DiagramEditorInlinePropertyEditor, { diagramEditorState: diagramEditorState }), _jsx(DiagramEditorInlineClassCreator, { diagramEditorState: diagramEditorState }), _jsx(DiagramEditorInlineClassRenamer, { diagramEditorState: diagramEditorState })] }))] })] })] }));
 });
 //# sourceMappingURL=DiagramEditor.js.map

lib/components/studio/DSL_Diagram_LegendStudioApplicationPlugin.js

@@ -1,3 +0,2 @@
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
-const _jsxFileName = "/home/runner/work/legend-studio/legend-studio/packages/legend-extension-dsl-diagram/src/components/studio/DSL_Diagram_LegendStudioApplicationPlugin.tsx";
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
@@ -49,3 +48,3 @@ * Copyright (c) 2020-present, Goldman Sachs
         return [
-            (_class) => (_jsxDEV(ClassDiagramPreview, { _class: _class }, void 0, false, { fileName: _jsxFileName, lineNumber: 90, columnNumber: 44 }, this)),
+            (_class) => (_jsx(ClassDiagramPreview, { _class: _class })),
         ];
@@ -83,3 +82,3 @@ }
                 if (type === DIAGRAM_ELEMENT_TYPE) {
-                    return (_jsxDEV("div", { className: "icon color--diagram", children: _jsxDEV(ShapesIcon, {}, void 0, false, { fileName: _jsxFileName, lineNumber: 136, columnNumber: 15 }, this) }, void 0, false, { fileName: _jsxFileName, lineNumber: 134, columnNumber: 19 }, this));
+                    return (_jsx("div", { className: "icon color--diagram", children: _jsx(ShapesIcon, {}) }));
                 }
@@ -94,3 +93,3 @@ return undefined;
                 if (elementEditorState instanceof DiagramEditorState) {
-                    return _jsxDEV(DiagramEditor, {}, elementEditorState.uuid, false, { fileName: _jsxFileName, lineNumber: 149, columnNumber: 17 }, this);
+                    return _jsx(DiagramEditor, {}, elementEditorState.uuid);
                 }
@@ -97,0 +96,0 @@ return undefined;

lib/package.json

 {
     "name": "@finos/legend-extension-dsl-diagram",
-    "version": "8.0.182",
+    "version": "8.0.183",
     "description": "Legend extension for Diagram DSL",
@@ -24,3 +24,2 @@ "keywords": [
     "exports": {
-        ".": "./lib/index.js",
         "./graph": "./lib/graph-manager/index.js",
@@ -27,0 +26,0 @@ "./application": "./lib/components/index.js",

package.json

 {
   "name": "@finos/legend-extension-dsl-diagram",
-  "version": "8.0.182",
+  "version": "8.0.183",
   "description": "Legend extension for Diagram DSL",
@@ -24,3 +24,2 @@ "keywords": [
   "exports": {
-    ".": "./lib/index.js",
     "./graph": "./lib/graph-manager/index.js",
@@ -51,6 +50,6 @@ "./application": "./lib/components/index.js",
     "@finos/legend-application": "15.1.9",
-    "@finos/legend-application-studio": "28.17.10",
+    "@finos/legend-application-studio": "28.17.11",
     "@finos/legend-art": "7.1.37",
-    "@finos/legend-graph": "31.10.3",
-    "@finos/legend-lego": "1.2.39",
+    "@finos/legend-graph": "31.10.4",
+    "@finos/legend-lego": "1.2.40",
     "@finos/legend-shared": "10.0.39",
@@ -57,0 +56,0 @@ "@finos/legend-storage": "3.0.89",

tsconfig.json

@@ -51,3 +51,2 @@ {
   "files": [
-    "./src/index.ts",
     "./src/__lib__/studio/DSL_Diagram_LegendStudioApplicationNavigationContext.ts",
@@ -54,0 +53,0 @@ "./src/__lib__/studio/DSL_Diagram_LegendStudioCodeSnippet.ts",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Unpublished package

Supply chain risk

Package version was not found on the registry. It may exist on a different registry and need to be configured to pull from that registry.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Unpublished package

Supply chain risk

Package version was not found on the registry. It may exist on a different registry and need to be configured to pull from that registry.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

952188

decreased by-2.33%

Number of package files

248

decreased by-1.98%

Lines of code

15267

decreased by-0.79%

Dependency changes

• Updated@finos/legend-application-studio@28.17.11

• Updated@finos/legend-graph@31.10.4

• Updated@finos/legend-lego@1.2.40