@tumaet/apollon 4.0.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/App.d.ts +6 -0
- package/dist/apollon-editor.d.ts +46 -0
- package/dist/components/CustomBackground.d.ts +1 -0
- package/dist/components/CustomControls.d.ts +1 -0
- package/dist/components/CustomMiniMap.d.ts +1 -0
- package/dist/components/DividerLine.d.ts +8 -0
- package/dist/components/Icon/CheckIcon.d.ts +2 -0
- package/dist/components/Icon/Cross.d.ts +4 -0
- package/dist/components/Icon/ExclamationIcon.d.ts +4 -0
- package/dist/components/Icon/Icon.d.ts +2 -0
- package/dist/components/Icon/TrashIcon.d.ts +4 -0
- package/dist/components/Icon/index.d.ts +4 -0
- package/dist/components/Sidebar.d.ts +1 -0
- package/dist/components/StereotypeButtonGroup.d.ts +8 -0
- package/dist/components/index.d.ts +10 -0
- package/dist/components/popovers/GenericPopover.d.ts +16 -0
- package/dist/components/popovers/GiveFeedbackAssessmentBox.d.ts +7 -0
- package/dist/components/popovers/PopoverManager.d.ts +8 -0
- package/dist/components/popovers/SeeFeedbackAssessmentBox.d.ts +5 -0
- package/dist/components/popovers/classDiagram/ClassEditPopover.d.ts +2 -0
- package/dist/components/popovers/classDiagram/ClassGiveFeedbackPopover.d.ts +2 -0
- package/dist/components/popovers/classDiagram/ClassSeeFeedbackPopover.d.ts +2 -0
- package/dist/components/popovers/classDiagram/EditableAttributesList.d.ts +6 -0
- package/dist/components/popovers/classDiagram/EditableMethodsList.d.ts +6 -0
- package/dist/components/popovers/classDiagram/PackageEditPopover.d.ts +2 -0
- package/dist/components/popovers/classDiagram/PackageGiveFeedbackPopover.d.ts +2 -0
- package/dist/components/popovers/classDiagram/PackageSeeFeedbackPopover.d.ts +2 -0
- package/dist/components/popovers/classDiagram/index.d.ts +4 -0
- package/dist/components/popovers/edgePopovers/EdgeEditPopover.d.ts +2 -0
- package/dist/components/popovers/edgePopovers/EdgeGiveFeedbackPopover.d.ts +2 -0
- package/dist/components/popovers/edgePopovers/EdgeSeeFeedbackPopover.d.ts +2 -0
- package/dist/components/popovers/edgePopovers/index.d.ts +3 -0
- package/dist/components/popovers/index.d.ts +3 -0
- package/dist/components/popovers/types.d.ts +3 -0
- package/dist/components/svgs/AssessmentIcon.d.ts +8 -0
- package/dist/components/svgs/edges/index.d.ts +1 -0
- package/dist/components/svgs/edges/markers/SvgMarkers.d.ts +1 -0
- package/dist/components/svgs/edges/markers/index.d.ts +1 -0
- package/dist/components/svgs/index.d.ts +2 -0
- package/dist/components/svgs/nodes/CustomText.d.ts +15 -0
- package/dist/components/svgs/nodes/HeaderSection.d.ts +12 -0
- package/dist/components/svgs/nodes/RowBlockSection.d.ts +15 -0
- package/dist/components/svgs/nodes/SeparationLine.d.ts +7 -0
- package/dist/components/svgs/nodes/classDiagram/ClassSVG.d.ts +22 -0
- package/dist/components/svgs/nodes/classDiagram/ColorDescriptionSVG.d.ts +9 -0
- package/dist/components/svgs/nodes/classDiagram/PackageSVG.d.ts +11 -0
- package/dist/components/svgs/nodes/classDiagram/TitleAndDescriptionSVG.d.ts +9 -0
- package/dist/components/svgs/nodes/classDiagram/index.d.ts +4 -0
- package/dist/components/svgs/nodes/index.d.ts +1 -0
- package/dist/components/toolbars/edgeToolBar/CustomEdgeToolBar.d.ts +9 -0
- package/dist/components/toolbars/edgeToolBar/index.d.ts +1 -0
- package/dist/components/toolbars/index.d.ts +1 -0
- package/dist/constants/canvasConstants.d.ts +5 -0
- package/dist/constants/dropElementConfig.d.ts +12 -0
- package/dist/constants/edgeConstants.d.ts +7 -0
- package/dist/constants/index.d.ts +4 -0
- package/dist/constants/layoutConstants.d.ts +8 -0
- package/dist/edges/Connection.d.ts +31 -0
- package/dist/edges/EdgeProps.d.ts +15 -0
- package/dist/edges/GenericEdge.d.ts +2 -0
- package/dist/edges/index.d.ts +2 -0
- package/dist/edges/types.d.ts +14 -0
- package/dist/enums/ExportFileFormat.d.ts +6 -0
- package/dist/enums/Quadrant.d.ts +6 -0
- package/dist/enums/index.d.ts +2 -0
- package/dist/hooks/index.d.ts +10 -0
- package/dist/hooks/useCanvasClickEvents.d.ts +7 -0
- package/dist/hooks/useConnect.d.ts +7 -0
- package/dist/hooks/useDiagramModifiable.d.ts +1 -0
- package/dist/hooks/useDragOver.d.ts +4 -0
- package/dist/hooks/useEdgeToolbar.d.ts +6 -0
- package/dist/hooks/useEdges.d.ts +8 -0
- package/dist/hooks/useElementInteractions.d.ts +6 -0
- package/dist/hooks/useGoToNextAssessment.d.ts +1 -0
- package/dist/hooks/useHandleDelete.d.ts +1 -0
- package/dist/hooks/useHandleOnResize.d.ts +4 -0
- package/dist/hooks/useNodeDragStop.d.ts +4 -0
- package/dist/hooks/useReconnect.d.ts +4 -0
- package/dist/hooks/useViewPointCenter.d.ts +2 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +32407 -0
- package/dist/initialElements.d.ts +3 -0
- package/dist/nodes/TitleAndDescriptionNode.d.ts +7 -0
- package/dist/nodes/classDiagram/Class.d.ts +3 -0
- package/dist/nodes/classDiagram/ColorDescription.d.ts +6 -0
- package/dist/nodes/classDiagram/Package.d.ts +3 -0
- package/dist/nodes/classDiagram/index.d.ts +3 -0
- package/dist/nodes/index.d.ts +3 -0
- package/dist/nodes/types.d.ts +10 -0
- package/dist/nodes/wrappers/DefaultNodeWrapper.d.ts +8 -0
- package/dist/nodes/wrappers/index.d.ts +1 -0
- package/dist/store/context.d.ts +10 -0
- package/dist/store/diagramStore.d.ts +32 -0
- package/dist/store/index.d.ts +4 -0
- package/dist/store/metadataStore.d.ts +20 -0
- package/dist/store/popoverStore.d.ts +7 -0
- package/dist/store/yjsSync.d.ts +19 -0
- package/dist/styles/theme.d.ts +51 -0
- package/dist/sync/index.d.ts +1 -0
- package/dist/sync/utils.d.ts +7 -0
- package/dist/sync/ydoc.d.ts +7 -0
- package/dist/types/DiagramType.d.ts +15 -0
- package/dist/types/index.d.ts +3 -0
- package/dist/types/locationPopover.d.ts +5 -0
- package/dist/types/nodes/DropNodeDate.d.ts +7 -0
- package/dist/types/nodes/NodeProps.d.ts +14 -0
- package/dist/types/nodes/enums/ClassType.d.ts +6 -0
- package/dist/types/nodes/enums/index.d.ts +1 -0
- package/dist/types/nodes/index.d.ts +3 -0
- package/dist/typings.d.ts +120 -0
- package/dist/utils/deepPartial.d.ts +3 -0
- package/dist/utils/diagramTypeUtils.d.ts +6 -0
- package/dist/utils/edgeUtils.d.ts +55 -0
- package/dist/utils/exportUtils.d.ts +3 -0
- package/dist/utils/index.d.ts +11 -0
- package/dist/utils/layoutUtils.d.ts +17 -0
- package/dist/utils/nodeUtils.d.ts +4 -0
- package/dist/utils/popoverUtils.d.ts +3 -0
- package/dist/utils/quadrantUtils.d.ts +3 -0
- package/dist/utils/storeUtils.d.ts +1 -0
- package/dist/utils/textUtils.d.ts +7 -0
- package/package.json +45 -0
package/dist/App.d.ts
ADDED
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { Node, Edge } from '@xyflow/react';
|
|
2
|
+
import { DeepPartial } from './utils';
|
|
3
|
+
import { UMLDiagramType } from './types';
|
|
4
|
+
import * as Apollon from "./typings";
|
|
5
|
+
export declare class ApollonEditor {
|
|
6
|
+
private root;
|
|
7
|
+
private reactFlowInstance;
|
|
8
|
+
private readonly syncManager;
|
|
9
|
+
private readonly ydoc;
|
|
10
|
+
private readonly diagramStore;
|
|
11
|
+
private readonly metadataStore;
|
|
12
|
+
private readonly popoverStore;
|
|
13
|
+
private subscribers;
|
|
14
|
+
constructor(element: HTMLElement, options?: Apollon.ApollonOptions);
|
|
15
|
+
private setReactFlowInstance;
|
|
16
|
+
getNodes(): Node[];
|
|
17
|
+
getEdges(): Edge[];
|
|
18
|
+
set diagramType(type: UMLDiagramType);
|
|
19
|
+
destroy(): void;
|
|
20
|
+
/**
|
|
21
|
+
* renders a model as a svg and returns it. Therefore the svg is temporarily added to the dom and removed after it has been rendered.
|
|
22
|
+
* @param model the apollon model to export as a svg
|
|
23
|
+
* @param options options to change the export behavior (add margin, exclude element ...)
|
|
24
|
+
* @param theme the theme which should be applied on the svg
|
|
25
|
+
*/
|
|
26
|
+
static exportModelAsSvg(model: Apollon.UMLModel, options?: Apollon.ExportOptions, theme?: DeepPartial<Apollon.Styles>): Promise<Apollon.SVG>;
|
|
27
|
+
/**
|
|
28
|
+
* exports current model as svg
|
|
29
|
+
* @param options options to change the export behavior (add margin, exclude element ...)
|
|
30
|
+
*/
|
|
31
|
+
exportAsSVG(options?: Apollon.ExportOptions): Promise<Apollon.SVG>;
|
|
32
|
+
private getNewSubscriptionId;
|
|
33
|
+
subscribeToModelChange(callback: (state: Apollon.UMLModel) => void): number;
|
|
34
|
+
subscribeToDiagramNameChange(callback: (diagramTitle: string) => void): () => void;
|
|
35
|
+
unsubscribeFromModelChange(subscriberId: number): void;
|
|
36
|
+
sendBroadcastMessage(sendFn: (data: Uint8Array) => void): void;
|
|
37
|
+
receiveBroadcastedMessage(update: Uint8Array): void;
|
|
38
|
+
updateDiagramTitle(name: string): void;
|
|
39
|
+
getDiagramMetadata(): {
|
|
40
|
+
diagramTitle: string;
|
|
41
|
+
diagramType: "ClassDiagram" | "ObjectDiagram" | "ActivityDiagram" | "UseCaseDiagram" | "CommunicationDiagram" | "ComponentDiagram" | "DeploymentDiagram" | "PetriNet" | "ReachabilityGraph" | "SyntaxTree" | "Flowchart" | "BPMN";
|
|
42
|
+
};
|
|
43
|
+
get model(): Apollon.UMLModel;
|
|
44
|
+
set model(model: Apollon.UMLModel);
|
|
45
|
+
addOrUpdateAssessment(assessment: Apollon.Assessment): void;
|
|
46
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const CustomBackground: () => JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const CustomControls: () => JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const CustomMiniMap: () => JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Sidebar: () => JSX.Element | null;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { ClassType } from '../types';
|
|
3
|
+
interface StereotypeButtonGroupProps {
|
|
4
|
+
nodeId: string;
|
|
5
|
+
selectedStereotype?: ClassType;
|
|
6
|
+
}
|
|
7
|
+
export declare const StereotypeButtonGroup: React.FC<StereotypeButtonGroupProps>;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export * from './svgs/nodes/CustomText';
|
|
2
|
+
export * from './Sidebar';
|
|
3
|
+
export * from './DividerLine';
|
|
4
|
+
export * from './popovers';
|
|
5
|
+
export * from './toolbars';
|
|
6
|
+
export * from './svgs';
|
|
7
|
+
export * from './StereotypeButtonGroup';
|
|
8
|
+
export * from './CustomMiniMap';
|
|
9
|
+
export * from './CustomControls';
|
|
10
|
+
export * from './CustomBackground';
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { default as React, ReactNode } from 'react';
|
|
2
|
+
import { PopoverOrigin } from '@mui/material';
|
|
3
|
+
interface GenericPopoverProps {
|
|
4
|
+
id: string;
|
|
5
|
+
anchorEl: HTMLElement | SVGSVGElement | null | SVGPathElement;
|
|
6
|
+
open: boolean;
|
|
7
|
+
onClose: () => void;
|
|
8
|
+
children: ReactNode;
|
|
9
|
+
anchorOrigin?: PopoverOrigin;
|
|
10
|
+
transformOrigin?: PopoverOrigin;
|
|
11
|
+
maxHeight?: number;
|
|
12
|
+
maxWidth?: number;
|
|
13
|
+
style?: React.CSSProperties;
|
|
14
|
+
}
|
|
15
|
+
export declare const GenericPopover: React.FC<GenericPopoverProps>;
|
|
16
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
type PopoverType = "class" | "package" | "edge";
|
|
2
|
+
interface PopoverManagerProps {
|
|
3
|
+
elementId: string;
|
|
4
|
+
anchorEl: HTMLElement | SVGSVGElement | null;
|
|
5
|
+
type: PopoverType;
|
|
6
|
+
}
|
|
7
|
+
export declare const PopoverManager: ({ elementId, anchorEl, type, }: PopoverManagerProps) => JSX.Element | null;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './markers';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function SvgMarkers(): JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './SvgMarkers';
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
type Props = {
|
|
3
|
+
children: React.ReactNode;
|
|
4
|
+
fill?: string;
|
|
5
|
+
x?: string | number;
|
|
6
|
+
y?: string | number;
|
|
7
|
+
dominantBaseline?: string;
|
|
8
|
+
textAnchor?: string;
|
|
9
|
+
fontWeight?: string;
|
|
10
|
+
pointerEvents?: string;
|
|
11
|
+
noX?: boolean;
|
|
12
|
+
noY?: boolean;
|
|
13
|
+
};
|
|
14
|
+
export declare const CustomText: FC<Props & Record<string, unknown>>;
|
|
15
|
+
export {};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { FC } from 'react';
|
|
2
|
+
import { ClassType } from '../../../types';
|
|
3
|
+
interface HeaderSectionProps {
|
|
4
|
+
showStereotype: boolean;
|
|
5
|
+
stereotype?: ClassType;
|
|
6
|
+
name: string;
|
|
7
|
+
width: number;
|
|
8
|
+
font: string;
|
|
9
|
+
headerHeight: number;
|
|
10
|
+
}
|
|
11
|
+
export declare const HeaderSection: FC<HeaderSectionProps>;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ClassNodeElement } from '../../../types';
|
|
2
|
+
import { FC } from 'react';
|
|
3
|
+
interface RowBlockSectionProps {
|
|
4
|
+
items: (ClassNodeElement & {
|
|
5
|
+
score?: number;
|
|
6
|
+
})[];
|
|
7
|
+
padding: number;
|
|
8
|
+
itemHeight: number;
|
|
9
|
+
width: number;
|
|
10
|
+
font: string;
|
|
11
|
+
offsetFromTop: number;
|
|
12
|
+
showAssessmentResults?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const RowBlockSection: FC<RowBlockSectionProps>;
|
|
15
|
+
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { ClassType, ClassNodeElement } from '../../../../types';
|
|
3
|
+
export interface MinSize {
|
|
4
|
+
minWidth: number;
|
|
5
|
+
minHeight: number;
|
|
6
|
+
}
|
|
7
|
+
export interface SVGComponentProps {
|
|
8
|
+
width: number;
|
|
9
|
+
height: number;
|
|
10
|
+
transformScale?: number;
|
|
11
|
+
svgAttributes?: React.SVGAttributes<SVGElement>;
|
|
12
|
+
setMinSize?: React.Dispatch<React.SetStateAction<MinSize>>;
|
|
13
|
+
id: string;
|
|
14
|
+
}
|
|
15
|
+
export type ClassSVGProps = SVGComponentProps & {
|
|
16
|
+
methods: ClassNodeElement[];
|
|
17
|
+
attributes: ClassNodeElement[];
|
|
18
|
+
stereotype?: ClassType;
|
|
19
|
+
name: string;
|
|
20
|
+
showAssessmentResults?: boolean;
|
|
21
|
+
};
|
|
22
|
+
export declare const ClassSVG: ({ id, width, height, methods, attributes, stereotype, name, transformScale, svgAttributes, showAssessmentResults, }: ClassSVGProps) => JSX.Element;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { SVGAttributes } from 'react';
|
|
2
|
+
export type ColorDescriptionSVGProps = {
|
|
3
|
+
width: number;
|
|
4
|
+
height: number;
|
|
5
|
+
description: string;
|
|
6
|
+
transformScale?: number;
|
|
7
|
+
svgAttributes?: SVGAttributes<SVGElement>;
|
|
8
|
+
};
|
|
9
|
+
export declare function ColorDescriptionSVG({ width, height, description, svgAttributes, transformScale, }: ColorDescriptionSVGProps): JSX.Element;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { SVGComponentProps } from '../../..';
|
|
2
|
+
import { SVGAttributes } from 'react';
|
|
3
|
+
export type PackageSVGProps = SVGComponentProps & {
|
|
4
|
+
width: number;
|
|
5
|
+
height: number;
|
|
6
|
+
name: string;
|
|
7
|
+
transformScale?: number;
|
|
8
|
+
svgAttributes?: SVGAttributes<SVGElement>;
|
|
9
|
+
showAssessmentResults?: boolean;
|
|
10
|
+
};
|
|
11
|
+
export declare const PackageSVG: React.FC<PackageSVGProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './classDiagram';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { IPoint } from '../../../edges';
|
|
2
|
+
interface CustomEdgeToolbarProps {
|
|
3
|
+
edgeId: string;
|
|
4
|
+
position: IPoint;
|
|
5
|
+
onEditClick: (event: React.MouseEvent<HTMLElement>) => void;
|
|
6
|
+
onDeleteClick: (event: React.MouseEvent<HTMLElement>) => void;
|
|
7
|
+
}
|
|
8
|
+
export declare const CustomEdgeToolbar: import('react').ForwardRefExoticComponent<CustomEdgeToolbarProps & import('react').RefAttributes<SVGForeignObjectElement>>;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './CustomEdgeToolBar';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './edgeToolBar';
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { UMLDiagramType } from '../types';
|
|
2
|
+
import { DiagramNodeType } from '../nodes';
|
|
3
|
+
export * from './layoutConstants';
|
|
4
|
+
export declare const transformScale = 0.8;
|
|
5
|
+
export type DropElementConfig = {
|
|
6
|
+
type: DiagramNodeType;
|
|
7
|
+
width: number;
|
|
8
|
+
height: number;
|
|
9
|
+
defaultData: Record<string, unknown>;
|
|
10
|
+
svg: React.FC<any>;
|
|
11
|
+
};
|
|
12
|
+
export declare const dropElementConfigs: Record<UMLDiagramType, DropElementConfig[]>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const ARROW_MARKER_PADDING = 6;
|
|
2
|
+
export declare const DOTTED_ARROW_MARKER_PADDING = 6;
|
|
3
|
+
export declare const TRIANGLE_MARKER_PADDING = 6;
|
|
4
|
+
export declare const RHOMBUS_MARKER_PADDING = 10;
|
|
5
|
+
export declare const MARKER_PADDING = -5;
|
|
6
|
+
export declare const SOURCE_CONNECTION_POINT_PADDING = 6;
|
|
7
|
+
export declare const STEP_BOARDER_RADIUS = 0;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare const DEFAULT_FONT = "400 16px Inter, system-ui, Avenir, Helvetica, Arial, sans-serif";
|
|
2
|
+
export declare const DEFAULT_HEADER_HEIGHT = 40;
|
|
3
|
+
export declare const DEFAULT_HEADER_HEIGHT_WITH_STREOTYPE = 50;
|
|
4
|
+
export declare const DEFAULT_ATTRIBUTE_HEIGHT = 30;
|
|
5
|
+
export declare const DEFAULT_METHOD_HEIGHT = 30;
|
|
6
|
+
export declare const DEFAULT_PADDING = 10;
|
|
7
|
+
export declare const LINE_WIDTH = 1;
|
|
8
|
+
export declare const LINE_WIDTH_ON_EDGE: number;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { Position } from '@xyflow/react';
|
|
2
|
+
export interface IPoint {
|
|
3
|
+
x: number;
|
|
4
|
+
y: number;
|
|
5
|
+
}
|
|
6
|
+
export interface NodeBounds {
|
|
7
|
+
x: number;
|
|
8
|
+
y: number;
|
|
9
|
+
width: number;
|
|
10
|
+
height: number;
|
|
11
|
+
}
|
|
12
|
+
export declare function getPortsForElement(bounds: NodeBounds): Record<Position, IPoint>;
|
|
13
|
+
export declare function computeOverlap(range1: [number, number], range2: [number, number]): [number, number] | null;
|
|
14
|
+
export declare function pointsToSvgPath(points: IPoint[]): string;
|
|
15
|
+
export declare function tryFindStraightPath(source: {
|
|
16
|
+
position: {
|
|
17
|
+
x: number;
|
|
18
|
+
y: number;
|
|
19
|
+
};
|
|
20
|
+
width: number;
|
|
21
|
+
height: number;
|
|
22
|
+
direction: Position;
|
|
23
|
+
}, target: {
|
|
24
|
+
position: {
|
|
25
|
+
x: number;
|
|
26
|
+
y: number;
|
|
27
|
+
};
|
|
28
|
+
width: number;
|
|
29
|
+
height: number;
|
|
30
|
+
direction: Position;
|
|
31
|
+
}, targetPadding: number): IPoint[] | null;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { Edge, EdgeProps } from '@xyflow/react';
|
|
2
|
+
import { IPoint } from './Connection';
|
|
3
|
+
export type CustomEdgeProps = {
|
|
4
|
+
sourceRole: string | null;
|
|
5
|
+
sourceMultiplicity: string | null;
|
|
6
|
+
targetRole: string | null;
|
|
7
|
+
targetMultiplicity: string | null;
|
|
8
|
+
points: IPoint[];
|
|
9
|
+
};
|
|
10
|
+
export type ExtendedEdgeProps = EdgeProps<Edge<CustomEdgeProps>> & {
|
|
11
|
+
markerEnd?: string;
|
|
12
|
+
markerPadding?: number;
|
|
13
|
+
strokeDashArray?: string;
|
|
14
|
+
type: string;
|
|
15
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export declare const diagramEdgeTypes: {
|
|
2
|
+
ClassBidirectional: ({ id, type, source, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, sourceHandleId, targetHandleId, data, }: import('./EdgeProps').ExtendedEdgeProps) => JSX.Element;
|
|
3
|
+
ClassUnidirectional: ({ id, type, source, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, sourceHandleId, targetHandleId, data, }: import('./EdgeProps').ExtendedEdgeProps) => JSX.Element;
|
|
4
|
+
ClassAggregation: ({ id, type, source, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, sourceHandleId, targetHandleId, data, }: import('./EdgeProps').ExtendedEdgeProps) => JSX.Element;
|
|
5
|
+
ClassComposition: ({ id, type, source, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, sourceHandleId, targetHandleId, data, }: import('./EdgeProps').ExtendedEdgeProps) => JSX.Element;
|
|
6
|
+
ClassInheritance: ({ id, type, source, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, sourceHandleId, targetHandleId, data, }: import('./EdgeProps').ExtendedEdgeProps) => JSX.Element;
|
|
7
|
+
ClassDependency: ({ id, type, source, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, sourceHandleId, targetHandleId, data, }: import('./EdgeProps').ExtendedEdgeProps) => JSX.Element;
|
|
8
|
+
ClassRealization: ({ id, type, source, target, sourceX, sourceY, targetX, targetY, sourcePosition, targetPosition, sourceHandleId, targetHandleId, data, }: import('./EdgeProps').ExtendedEdgeProps) => JSX.Element;
|
|
9
|
+
};
|
|
10
|
+
export type DiagramEdgeType = keyof typeof diagramEdgeTypes;
|
|
11
|
+
export interface IPoint {
|
|
12
|
+
x: number;
|
|
13
|
+
y: number;
|
|
14
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export * from './useViewPointCenter';
|
|
2
|
+
export * from './useReconnect';
|
|
3
|
+
export * from './useConnect';
|
|
4
|
+
export * from './useNodeDragStop';
|
|
5
|
+
export * from './useHandleOnResize';
|
|
6
|
+
export * from './useEdges';
|
|
7
|
+
export * from './useEdgeToolbar';
|
|
8
|
+
export * from './useCanvasClickEvents';
|
|
9
|
+
export * from './useElementInteractions';
|
|
10
|
+
export * from './useGoToNextAssessment';
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { MouseEvent } from 'react';
|
|
2
|
+
import { Node, Edge } from '@xyflow/react';
|
|
3
|
+
export declare const useCanvasClickEvents: () => {
|
|
4
|
+
onNodeClick: (_: MouseEvent, node: Node) => void;
|
|
5
|
+
onEdgeClick: (_: MouseEvent, edge: Edge) => void;
|
|
6
|
+
onPaneClick: () => void;
|
|
7
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Connection, OnConnectEnd, OnConnectStart, OnEdgesDelete } from '@xyflow/react';
|
|
2
|
+
export declare const useConnect: () => {
|
|
3
|
+
onConnect: (connection: Connection) => void;
|
|
4
|
+
onConnectEnd: OnConnectEnd;
|
|
5
|
+
onConnectStart: OnConnectStart;
|
|
6
|
+
onEdgesDelete: OnEdgesDelete;
|
|
7
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useDiagramModifiable: () => boolean;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare function useEdgePopOver(id: string): {
|
|
2
|
+
handleSourceRoleChange: (newRole: string) => void;
|
|
3
|
+
handleSourceMultiplicityChange: (newMultiplicity: string) => void;
|
|
4
|
+
handleTargetRoleChange: (newRole: string) => void;
|
|
5
|
+
handleTargetMultiplicityChange: (newMultiplicity: string) => void;
|
|
6
|
+
handleEdgeTypeChange: (newType: string) => void;
|
|
7
|
+
handleSwap: () => void;
|
|
8
|
+
};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { NodeMouseHandler, OnBeforeDelete, Node, Edge, EdgeMouseHandler } from '@xyflow/react';
|
|
2
|
+
export declare const useElementInteractions: () => {
|
|
3
|
+
onBeforeDelete: OnBeforeDelete;
|
|
4
|
+
onNodeDoubleClick: NodeMouseHandler<Node>;
|
|
5
|
+
onEdgeDoubleClick: EdgeMouseHandler<Edge>;
|
|
6
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useGoToNextAssessment: (elementId: string) => () => void;
|