@finos/legend-vscode-extension-dependencies 3.0.3 → 4.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (44) hide show
  1. package/lib/bundles/bundle.cjs.js +103 -103
  2. package/lib/bundles/style/bundle.css +2 -2
  3. package/lib/index.d.ts +6 -2
  4. package/lib/index.d.ts.map +1 -1
  5. package/lib/index.js +4 -2
  6. package/lib/index.js.map +1 -1
  7. package/package.json +2 -8
  8. package/src/index.ts +46 -2
  9. package/tsconfig.json +1 -8
  10. package/lib/components/Diagram/DiagramEditor.d.ts +0 -9
  11. package/lib/components/Diagram/DiagramEditor.d.ts.map +0 -1
  12. package/lib/components/Diagram/DiagramEditor.js +0 -61
  13. package/lib/components/Diagram/DiagramEditor.js.map +0 -1
  14. package/lib/components/Diagram/DiagramEditorDiagramCanvas.d.ts +0 -5
  15. package/lib/components/Diagram/DiagramEditorDiagramCanvas.d.ts.map +0 -1
  16. package/lib/components/Diagram/DiagramEditorDiagramCanvas.js +0 -92
  17. package/lib/components/Diagram/DiagramEditorDiagramCanvas.js.map +0 -1
  18. package/lib/components/Diagram/DiagramEditorToolPanel.d.ts +0 -7
  19. package/lib/components/Diagram/DiagramEditorToolPanel.d.ts.map +0 -1
  20. package/lib/components/Diagram/DiagramEditorToolPanel.js +0 -37
  21. package/lib/components/Diagram/DiagramEditorToolPanel.js.map +0 -1
  22. package/lib/components/Diagram/DiagramHeader.d.ts +0 -7
  23. package/lib/components/Diagram/DiagramHeader.d.ts.map +0 -1
  24. package/lib/components/Diagram/DiagramHeader.js +0 -39
  25. package/lib/components/Diagram/DiagramHeader.js.map +0 -1
  26. package/lib/stores/DiagramEditorState.d.ts +0 -35
  27. package/lib/stores/DiagramEditorState.d.ts.map +0 -1
  28. package/lib/stores/DiagramEditorState.js +0 -102
  29. package/lib/stores/DiagramEditorState.js.map +0 -1
  30. package/lib/utils/Const.d.ts +0 -20
  31. package/lib/utils/Const.d.ts.map +0 -1
  32. package/lib/utils/Const.js +0 -21
  33. package/lib/utils/Const.js.map +0 -1
  34. package/lib/utils/VsCodeUtils.d.ts +0 -18
  35. package/lib/utils/VsCodeUtils.d.ts.map +0 -1
  36. package/lib/utils/VsCodeUtils.js +0 -19
  37. package/lib/utils/VsCodeUtils.js.map +0 -1
  38. package/src/components/Diagram/DiagramEditor.tsx +0 -113
  39. package/src/components/Diagram/DiagramEditorDiagramCanvas.tsx +0 -150
  40. package/src/components/Diagram/DiagramEditorToolPanel.tsx +0 -105
  41. package/src/components/Diagram/DiagramHeader.tsx +0 -230
  42. package/src/stores/DiagramEditorState.ts +0 -121
  43. package/src/utils/Const.ts +0 -21
  44. package/src/utils/VsCodeUtils.ts +0 -27
@@ -1,20 +0,0 @@
1
- /**
2
- * Copyright (c) 2020-present, Goldman Sachs
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- export declare const GET_PROJECT_ENTITIES = "getProjectEntities";
17
- export declare const GET_PROJECT_ENTITIES_RESPONSE = "getProjectEntitiesResponse";
18
- export declare const DIAGRAM_DROP_CLASS_ERROR = "diagramDropClassError";
19
- export declare const WRITE_ENTITY = "writeEntity";
20
- //# sourceMappingURL=Const.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Const.d.ts","sourceRoot":"","sources":["../../src/utils/Const.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAGH,eAAO,MAAM,oBAAoB,uBAAuB,CAAC;AACzD,eAAO,MAAM,6BAA6B,+BAA+B,CAAC;AAC1E,eAAO,MAAM,wBAAwB,0BAA0B,CAAC;AAChE,eAAO,MAAM,YAAY,gBAAgB,CAAC"}
@@ -1,21 +0,0 @@
1
- /**
2
- * Copyright (c) 2020-present, Goldman Sachs
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- // Event Types
17
- export const GET_PROJECT_ENTITIES = 'getProjectEntities';
18
- export const GET_PROJECT_ENTITIES_RESPONSE = 'getProjectEntitiesResponse';
19
- export const DIAGRAM_DROP_CLASS_ERROR = 'diagramDropClassError';
20
- export const WRITE_ENTITY = 'writeEntity';
21
- //# sourceMappingURL=Const.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Const.js","sourceRoot":"","sources":["../../src/utils/Const.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,cAAc;AACd,MAAM,CAAC,MAAM,oBAAoB,GAAG,oBAAoB,CAAC;AACzD,MAAM,CAAC,MAAM,6BAA6B,GAAG,4BAA4B,CAAC;AAC1E,MAAM,CAAC,MAAM,wBAAwB,GAAG,uBAAuB,CAAC;AAChE,MAAM,CAAC,MAAM,YAAY,GAAG,aAAa,CAAC"}
@@ -1,18 +0,0 @@
1
- /**
2
- * Copyright (c) 2020-present, Goldman Sachs
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import type { PlainObject } from '@finos/legend-shared';
17
- export declare const postMessage: (message: PlainObject) => void;
18
- //# sourceMappingURL=VsCodeUtils.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"VsCodeUtils.d.ts","sourceRoot":"","sources":["../../src/utils/VsCodeUtils.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAQxD,eAAO,MAAM,WAAW,YAAa,WAAW,KAAG,IAElD,CAAC"}
@@ -1,19 +0,0 @@
1
- /**
2
- * Copyright (c) 2020-present, Goldman Sachs
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- export const postMessage = (message) => {
17
- vscode.postMessage(message);
18
- };
19
- //# sourceMappingURL=VsCodeUtils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"VsCodeUtils.js","sourceRoot":"","sources":["../../src/utils/VsCodeUtils.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAUH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,OAAoB,EAAQ,EAAE;IACxD,MAAM,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;AAC9B,CAAC,CAAC"}
@@ -1,113 +0,0 @@
1
- /**
2
- * Copyright (c) 2020-present, Goldman Sachs
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import { getDiagram } from '@finos/legend-extension-dsl-diagram';
17
- import type { Entity } from '@finos/legend-storage';
18
- import { useRef, useEffect, useState } from 'react';
19
- import { observer } from 'mobx-react-lite';
20
- import '../../../style/index.scss';
21
- import { postMessage } from '../../utils/VsCodeUtils.js';
22
- import {
23
- GET_PROJECT_ENTITIES,
24
- GET_PROJECT_ENTITIES_RESPONSE,
25
- } from '../../utils/Const.js';
26
- import { getPureGraph } from '../../graph-manager/index.js';
27
- import type { DiagramEditorState } from '../../stores/DiagramEditorState.js';
28
- import { LegendStyleProvider } from '@finos/legend-art';
29
- import { DiagramEditorHeader } from './DiagramHeader.js';
30
- import { DiagramEditorDiagramCanvas } from './DiagramEditorDiagramCanvas.js';
31
- import { DiagramEditorToolPanel } from './DiagramEditorToolPanel.js';
32
-
33
- export const DiagramEditor = observer(
34
- (props: { diagramId: string; diagramEditorState: DiagramEditorState }) => {
35
- const diagramCanvasRef = useRef<HTMLDivElement>(null);
36
- const { diagramId, diagramEditorState } = props;
37
- const [entities, setEntities] = useState<Entity[]>([]);
38
- const [error, setError] = useState<string | null>();
39
-
40
- useEffect(() => {
41
- postMessage({
42
- command: GET_PROJECT_ENTITIES,
43
- });
44
- }, [diagramId]);
45
-
46
- window.addEventListener(
47
- 'message',
48
- (event: MessageEvent<{ result: Entity[]; command: string }>) => {
49
- const message = event.data;
50
- if (message.command === GET_PROJECT_ENTITIES_RESPONSE) {
51
- const es: Entity[] = message.result;
52
- setEntities(es);
53
- }
54
- },
55
- );
56
-
57
- useEffect(() => {
58
- if (entities.length && diagramId) {
59
- getPureGraph(entities, [])
60
- .then((pureModel) => {
61
- const diagram = getDiagram(diagramId, pureModel);
62
- diagramEditorState.setDiagram(diagram);
63
- diagramEditorState.setGraph(pureModel);
64
- setError(null);
65
- })
66
- .catch((e) => {
67
- setError(e.message);
68
- });
69
- }
70
- }, [entities, diagramId, diagramEditorState]);
71
-
72
- return (
73
- <LegendStyleProvider>
74
- <div className="diagram-editor">
75
- {error ? (
76
- <div className="diagram-editor__error">
77
- <span>Something went wrong. Diagram cannot be created.</span>
78
- <span
79
- className="diagram-editor__error__details"
80
- title={`${error}`}
81
- >
82
- Error Details.
83
- </span>
84
- </div>
85
- ) : (
86
- <>
87
- <div className="diagram-editor__header">
88
- {diagramEditorState.isDiagramRendererInitialized && (
89
- <DiagramEditorHeader
90
- diagramEditorState={diagramEditorState}
91
- />
92
- )}
93
- </div>
94
- <div className="diagram-editor__content">
95
- <div className="diagram-editor__stage">
96
- {diagramEditorState.isDiagramRendererInitialized && (
97
- <DiagramEditorToolPanel
98
- diagramEditorState={diagramEditorState}
99
- />
100
- )}
101
- <DiagramEditorDiagramCanvas
102
- diagramEditorState={diagramEditorState}
103
- ref={diagramCanvasRef}
104
- />
105
- </div>
106
- </div>
107
- </>
108
- )}
109
- </div>
110
- </LegendStyleProvider>
111
- );
112
- },
113
- );
@@ -1,150 +0,0 @@
1
- /**
2
- * Copyright (c) 2020-present, Goldman Sachs
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import { clsx, useResizeDetector } from '@finos/legend-art';
17
- import {
18
- type Diagram,
19
- DiagramRenderer,
20
- Point,
21
- V1_diagramModelSchema,
22
- V1_transformDiagram,
23
- } from '@finos/legend-extension-dsl-diagram';
24
- import { Class } from '@finos/legend-graph';
25
- import { observer } from 'mobx-react-lite';
26
- import { flowResult } from 'mobx';
27
- import {
28
- forwardRef,
29
- useEffect,
30
- type DragEvent,
31
- type KeyboardEvent,
32
- } from 'react';
33
- import { serialize } from 'serializr';
34
- import { DIAGRAM_DROP_CLASS_ERROR, WRITE_ENTITY } from '../../utils/Const.js';
35
- import type { DiagramEditorState } from '../../stores/DiagramEditorState.js';
36
- import { postMessage } from '../../utils/VsCodeUtils.js';
37
-
38
- export const DiagramEditorDiagramCanvas = observer(
39
- forwardRef<
40
- HTMLDivElement,
41
- {
42
- diagramEditorState: DiagramEditorState;
43
- }
44
- >(function DiagramEditorDiagramCanvas(props, ref) {
45
- const { diagramEditorState } = props;
46
- const diagram = diagramEditorState.diagram;
47
- const diagramCanvasRef = ref as React.MutableRefObject<HTMLDivElement>;
48
-
49
- const { width, height } = useResizeDetector<HTMLDivElement>({
50
- refreshMode: 'debounce',
51
- refreshRate: 50,
52
- targetRef: diagramCanvasRef,
53
- });
54
-
55
- useEffect(() => {
56
- if (diagram) {
57
- const renderer = new DiagramRenderer(diagramCanvasRef.current, diagram);
58
- diagramEditorState.setRenderer(renderer);
59
- diagramEditorState.setupRenderer();
60
- renderer.render({ initial: true });
61
- }
62
- }, [diagramCanvasRef, diagramEditorState, diagram]);
63
-
64
- useEffect(() => {
65
- // since after the diagram render is initialized, we start
66
- // showing the toolbar and the header, which causes the auto-zoom fit
67
- // to be off, we need to call this method again
68
- if (diagramEditorState.isDiagramRendererInitialized) {
69
- diagramEditorState.renderer.render({ initial: true });
70
- }
71
- }, [diagramEditorState, diagramEditorState.isDiagramRendererInitialized]);
72
-
73
- useEffect(() => {
74
- if (diagramEditorState.isDiagramRendererInitialized) {
75
- diagramEditorState.renderer.refresh();
76
- }
77
- }, [diagramEditorState, width, height]);
78
-
79
- const dropTarget = document.getElementById('root') ?? document.body;
80
-
81
- dropTarget.addEventListener('dragover', (event) => {
82
- // accept any DnD
83
- event.preventDefault();
84
- });
85
-
86
- const drop = (event: DragEvent) => {
87
- event.preventDefault();
88
- const droppedEntityIds: string[] = (
89
- JSON.parse(
90
- event.dataTransfer.getData(
91
- 'application/vnd.code.tree.legendConceptTree',
92
- ),
93
- ).itemHandles as string[]
94
- ).map((item) => item.split('/')[1] ?? '');
95
- const position =
96
- diagramEditorState.renderer.canvasCoordinateToModelCoordinate(
97
- diagramEditorState.renderer.eventCoordinateToCanvasCoordinate(
98
- new Point(event.clientX, event.clientY),
99
- ),
100
- );
101
-
102
- droppedEntityIds
103
- .filter((entityId) => {
104
- const isClassInstance =
105
- diagramEditorState.graph?.getElement(entityId) instanceof Class;
106
- if (!isClassInstance) {
107
- postMessage({
108
- command: DIAGRAM_DROP_CLASS_ERROR,
109
- });
110
- }
111
- return isClassInstance;
112
- })
113
- .forEach((entityId) => {
114
- flowResult(diagramEditorState.addClassView(entityId, position)).catch(
115
- // eslint-disable-next-line no-console
116
- (error: unknown) => console.error(error),
117
- );
118
- });
119
- };
120
-
121
- const handleKeyDown = (event: KeyboardEvent) => {
122
- if ((event.ctrlKey || event.metaKey) && event.key === 's') {
123
- event.preventDefault();
124
-
125
- postMessage({
126
- command: WRITE_ENTITY,
127
- msg: serialize(
128
- V1_diagramModelSchema,
129
- V1_transformDiagram(
130
- diagramEditorState._renderer?.diagram as Diagram,
131
- ),
132
- ),
133
- });
134
- }
135
- };
136
-
137
- return (
138
- <div
139
- onDrop={drop}
140
- onKeyDown={handleKeyDown}
141
- ref={diagramCanvasRef}
142
- className={clsx(
143
- 'diagram-canvas diagram-editor__canvas',
144
- diagramEditorState.diagramCursorClass,
145
- )}
146
- tabIndex={0}
147
- />
148
- );
149
- }),
150
- );
@@ -1,105 +0,0 @@
1
- /**
2
- * Copyright (c) 2020-present, Goldman Sachs
3
- *
4
- * Licensed under the Apache License, Version 2.0 (the "License");
5
- * you may not use this file except in compliance with the License.
6
- * You may obtain a copy of the License at
7
- *
8
- * http://www.apache.org/licenses/LICENSE-2.0
9
- *
10
- * Unless required by applicable law or agreed to in writing, software
11
- * distributed under the License is distributed on an "AS IS" BASIS,
12
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13
- * See the License for the specific language governing permissions and
14
- * limitations under the License.
15
- */
16
- import {
17
- clsx,
18
- MousePointerIcon,
19
- MoveIcon,
20
- ZoomInIcon,
21
- ZoomOutIcon,
22
- } from '@finos/legend-art';
23
- import {
24
- DIAGRAM_INTERACTION_MODE,
25
- DIAGRAM_RELATIONSHIP_EDIT_MODE,
26
- } from '@finos/legend-extension-dsl-diagram';
27
- import { observer } from 'mobx-react-lite';
28
- import type { DiagramEditorState } from '../../stores/DiagramEditorState.js';
29
-
30
- export const DiagramEditorToolPanel = observer(
31
- (props: { diagramEditorState: DiagramEditorState }) => {
32
- const { diagramEditorState } = props;
33
- const renderer = diagramEditorState.renderer;
34
- //const isReadOnly = diagramEditorState.isReadOnly;
35
- const createModeSwitcher =
36
- (
37
- editMode: DIAGRAM_INTERACTION_MODE,
38
- relationshipMode: DIAGRAM_RELATIONSHIP_EDIT_MODE,
39
- ): (() => void) =>
40
- (): void => {
41
- renderer.changeMode(editMode, relationshipMode);
42
- };
43
-
44
- return (
45
- <div className="diagram-editor__tools">
46
- <button
47
- className={clsx('diagram-editor__tool', {
48
- 'diagram-editor__tool--active':
49
- renderer.interactionMode === DIAGRAM_INTERACTION_MODE.LAYOUT,
50
- })}
51
- tabIndex={-1}
52
- onClick={createModeSwitcher(
53
- DIAGRAM_INTERACTION_MODE.LAYOUT,
54
- DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE,
55
- )}
56
- title="View Tool (V)"
57
- >
58
- <MousePointerIcon className="diagram-editor__icon--layout" />
59
- </button>
60
- <button
61
- className={clsx('diagram-editor__tool', {
62
- 'diagram-editor__tool--active':
63
- renderer.interactionMode === DIAGRAM_INTERACTION_MODE.PAN,
64
- })}
65
- tabIndex={-1}
66
- onClick={createModeSwitcher(
67
- DIAGRAM_INTERACTION_MODE.PAN,
68
- DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE,
69
- )}
70
- title="Pan Tool (M)"
71
- >
72
- <MoveIcon className="diagram-editor__icon--pan" />
73
- </button>
74
- <button
75
- className={clsx('diagram-editor__tool', {
76
- 'diagram-editor__tool--active':
77
- renderer.interactionMode === DIAGRAM_INTERACTION_MODE.ZOOM_IN,
78
- })}
79
- tabIndex={-1}
80
- title="Zoom In (Z)"
81
- onClick={createModeSwitcher(
82
- DIAGRAM_INTERACTION_MODE.ZOOM_IN,
83
- DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE,
84
- )}
85
- >
86
- <ZoomInIcon className="diagram-editor__icon--zoom-in" />
87
- </button>
88
- <button
89
- className={clsx('diagram-editor__tool', {
90
- 'diagram-editor__tool--active':
91
- renderer.interactionMode === DIAGRAM_INTERACTION_MODE.ZOOM_OUT,
92
- })}
93
- tabIndex={-1}
94
- title="Zoom Out (Z)"
95
- onClick={createModeSwitcher(
96
- DIAGRAM_INTERACTION_MODE.ZOOM_OUT,
97
- DIAGRAM_RELATIONSHIP_EDIT_MODE.NONE,
98
- )}
99
- >
100
- <ZoomOutIcon className="diagram-editor__icon--zoom-out" />
101
- </button>
102
- </div>
103
- );
104
- },
105
- );