@relation-graph/vue3 3.0.4

package/types/packages/platforms/vue2/src/types-vue2.d.ts

@@ -0,0 +1,3 @@
+export type RGVue2Props = {
+    testId?: string;
+};

package/types/packages/platforms/vue2/vite.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vite').UserConfigExport;
+export default _default;

package/types/packages/platforms/vue3/src/constants.d.ts

@@ -0,0 +1,3 @@
+export { version } from '../../../../package.json';
+export declare const INSTALLED_KEY: unique symbol;
+export declare const RelationGraphProvideKey = "RelationGraphProvideKey";

package/types/packages/platforms/vue3/src/index.d.ts

@@ -0,0 +1,188 @@
+/**
+* relation-graph
+* Website: http://www.relation-graph.com/
+* Github: https://github.com/seeksdream/relation-graph
+*
+*/
+import { default as BaseLayout } from '../../../relation-graph-models/layouts/RGBaseLayout';
+import { default as BidirectionalTreeLayout } from '../../../relation-graph-models/layouts/RGTreeLayout';
+import { default as CenterLayout } from '../../../relation-graph-models/layouts/RGCenterLayout';
+import { default as CircleLayout } from '../../../relation-graph-models/layouts/RGCircleLayout';
+import { default as FixedLayout } from '../../../relation-graph-models/layouts/RGFixedLayout';
+import { default as ForceLayout } from '../../../relation-graph-models/layouts/RGForceLayout';
+import { default as RGFolderLayout } from '../../../relation-graph-models/layouts/RGFolderLayout';
+import * as RGOptionsDataUtils from "../../../relation-graph-models/data/RGOptionsDataUtils";
+import * as RGLineDataUtils from "../../../relation-graph-models/data/RGLineDataUtils";
+import * as RGNodeDataUtils from "../../../relation-graph-models/data/RGNodeDataUtils";
+export { RelationGraphCore } from '../../../relation-graph-models/models/RelationGraphCore';
+export * from './types';
+export * from './types-vue3';
+export declare const version: string;
+export declare const RGLayouts: {
+    BaseLayout: typeof BaseLayout;
+    BidirectionalTreeLayout: typeof BidirectionalTreeLayout;
+    CenterLayout: typeof CenterLayout;
+    CircleLayout: typeof CircleLayout;
+    FixedLayout: typeof FixedLayout;
+    ForceLayout: typeof ForceLayout;
+    RGFolderLayout: typeof RGFolderLayout;
+};
+export declare const RGUtils: {
+    RGOptionsDataUtils: typeof RGOptionsDataUtils;
+    RGLineDataUtils: typeof RGLineDataUtils;
+    RGNodeDataUtils: typeof RGNodeDataUtils;
+    RGGraphMath: {
+        getRectPoint(from_x: number, from_y: number, to_x: number, to_y: number, f_W: number, f_H: number, t_W: number, t_H: number, isReverse?: boolean, totalLines?: number, currentIndex?: number, lineDistance?: number, isEndPoint?: boolean): {
+            x: number;
+            y: number;
+        };
+        getRectPointBasic(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
+            x: number;
+            y: number;
+            _case: string;
+        };
+        getRectJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getRectHJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getRectLeftJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getRectRightJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getRectTopJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getRectBottomJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getRectHorizontalLineJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            y: number;
+            x: number;
+        };
+        getRectVerticalLineLineJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getRectVJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            y: number;
+            x: number;
+        };
+        getBorderPoint(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, n1style: number): {
+            x: number;
+            y: number;
+        };
+        getBorderPoint4MultiLine(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
+            x: number;
+            y: number;
+        };
+        getCirclePoint(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
+            x: number;
+            y: number;
+        };
+        getCirclePoint4MultiLine(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, isReverse: boolean, totalLines: number, currentIndex: number, lineDistance: number, isEndPoint: boolean): {
+            x: number;
+            y: number;
+        };
+        getCirclePointBasic(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, radius: number): {
+            x: number;
+            y: number;
+        };
+        getCirclePointPlus(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
+            x: number;
+            y: number;
+        };
+        getOvalPoint(c_x: number, c_y: number, c_r: number, c_i: number, c_n: number, startAngle?: number): {
+            x: number;
+            y: number;
+        };
+        getRotatedPoint(x: number, y: number, c_x: number, c_y: number, rotateDeg: number): {
+            x: number;
+            y: number;
+        };
+        getFlippedX(x: number, c_x: number): number;
+        getFlippedY(y: number, c_y: number): number;
+        getAngleType(buffer_x: number, buffer_y: number): 1 | 2 | 3 | 4 | undefined;
+        getTextAngle(fx: number, fy: number, tx: number, ty: number): number;
+    };
+    RGNodesAnalyticUtils: {
+        getDescendantNodes(node: import('./types').RGNode, collectList?: import('./types').RGNode[]): import('./types').RGNode[];
+        isVisibleNode(thisNode: import('./types').RGNode, deep?: number): boolean;
+        isAllowShowNode(thisNode: import('./types').RGNode, deep?: number): boolean;
+        getNodeWidth(thisNode: import('./types').RGNode): number;
+        getNodeHeight(thisNode: import('./types').RGNode): number;
+        getNodeXByLotX(nodeAlignOption: {
+            alignItemsX: "start" | "center" | "end";
+        }, thisNode: import('./types').RGNode): number;
+        getNodeYByLotY(nodeAlignOption: {
+            alignItemsY: "start" | "center" | "end";
+        }, thisNode: import('./types').RGNode): number;
+        getNodeLotXY(nodeAlignOption: import('./types').RGLayoutOptions4Alignment, node: import('./types').RGNode): {
+            x: number;
+            y: number;
+        };
+        isRectangleOverlap(rectA: any, rectB: any): boolean;
+        isXOverlap(aX: number, bX: number, a_W: number, b_W: number): boolean;
+        isYOverlap(aY: number, bY: number, a_H: number, b_H: number): boolean;
+        shapesOverlap(nodeA: any, nodeB: any, shapeA?: number, shapeB?: number): boolean;
+        getNoOverlapLimitedPosition(rectA: any, newX: any, newY: any, rectB: any): {
+            x: any;
+            y: any;
+        };
+        flatNodeData(orignNodes: import('./types').JsonNode[], parentNode: import('./types').JsonNode | null, nodesCollect: import('./types').JsonNode[], linksCollect: import('./types').JsonLine[]): void;
+    };
+    RGEffectUtils: {
+        startDrag(e: MouseEvent | TouchEvent, startPositionOrModel: import('./types').RGCoordinate, onDragged: import('../../../relation-graph-models/utils/RGDragUtils').RGDraggedCallback, onDragging?: import('../../../relation-graph-models/utils/RGDragUtils').RGDraggingCallback | undefined): void;
+        onNodeMove(e: MouseEvent | TouchEvent): void;
+        onNodeDragend(e: MouseEvent | TouchEvent): void;
+    };
+};
+export declare const RGFakeNode: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGLinePath: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGLineText: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGDebugView: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGToolBar: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGNodeExpandHolder: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGMiniToolBar: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGMiniView: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGBackground: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGWatermark: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGEditingNodeController: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGEditingResize: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGEditingNearNodeWidget: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGEditingLineController: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGEditingConnectController: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGConnectSource: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGConnectTarget: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGEditingConnectPoints: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGEditingReferenceLine: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RGHooks: {
+    useGraphInstance: typeof import('./relation-graph/src/hooks/useGraphInstance').useGraphInstance;
+    useRelationGraph: typeof import('./relation-graph/src/hooks/useRelationGraph').useRelationGraph;
+    useGraphStore: typeof import('./relation-graph/src/hooks/useGraphStore').useGraphStore;
+    useGraphData: typeof import('./relation-graph/src/hooks/useGraphData').useGraphData;
+    useGraphOptions: typeof import('./relation-graph/src/hooks/useGraphStore').useGraphOptions;
+    useCreatingLine: typeof import('./relation-graph/src/hooks/useGraphStore').useCreatingLine;
+    useCreatingNode: typeof import('./relation-graph/src/hooks/useGraphStore').useCreatingNode;
+    useEditingNodes: typeof import('./relation-graph/src/hooks/useGraphStore').useEditingNodes;
+    useEditingLine: typeof import('./relation-graph/src/hooks/useGraphStore').useEditingLine;
+    useViewInformation: typeof import('./relation-graph/src/hooks/useGraphStore').useViewInformation;
+    useSelection: typeof import('./relation-graph/src/hooks/useGraphStore').useSelection;
+    useConnectingNode: typeof import('./relation-graph/src/hooks/useGraphStore').useConnectingNode;
+    useCheckedItem: typeof import('./relation-graph/src/hooks/useGraphStore').useCheckedItem;
+};
+export declare const useRelationGraph: typeof import('./relation-graph/src/hooks/useRelationGraph').useRelationGraph;
+export declare const RGProvider: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export declare const RelationLinker: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export * from './constants';
+export declare const RelationGraph: import('vue').DefineComponent<Record<string, unknown>, Record<string, unknown>, unknown, import('vue').ComputedOptions, import('vue').MethodOptions, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Record<string, unknown>>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default RelationGraph;

package/types/packages/platforms/vue3/src/relation-graph/src/hooks/RGHooks.d.ts

@@ -0,0 +1,32 @@
+import { useGraphInstance } from './useGraphInstance';
+import { useRelationGraph } from './useRelationGraph';
+import { useGraphOptions, useGraphStore, useCreatingLine, useCreatingNode, useEditingNodes, useEditingLine, useViewInformation, useSelection, useConnectingNode, useCheckedItem } from './useGraphStore';
+import { useGraphData } from './useGraphData';
+/**
+ *  By introducing graphStoreMixin through mixins here, you can get the following objects in the options component through this
+ * - this.graphInstance : Used to call various APIs provided by the graph
+ * The following are reactive state objects that allow you to interact with your UI
+ * - this.creatingLine : The line object currently being created
+ * - this.creatingNode : The node object currently being created
+ * - this.editingNodes : The list of node objects currently being edited
+ * - this.editingLine : The line object currently being edited
+ * - this.connectingNode : The node object currently being connected
+ * - this.viewInformation : The current view information object
+ * - this.selectionView : The current selected area view object
+ * - this.checkedItem : The currently selected graphic object
+ */
+export declare const RGHooks: {
+    useGraphInstance: typeof useGraphInstance;
+    useRelationGraph: typeof useRelationGraph;
+    useGraphStore: typeof useGraphStore;
+    useGraphData: typeof useGraphData;
+    useGraphOptions: typeof useGraphOptions;
+    useCreatingLine: typeof useCreatingLine;
+    useCreatingNode: typeof useCreatingNode;
+    useEditingNodes: typeof useEditingNodes;
+    useEditingLine: typeof useEditingLine;
+    useViewInformation: typeof useViewInformation;
+    useSelection: typeof useSelection;
+    useConnectingNode: typeof useConnectingNode;
+    useCheckedItem: typeof useCheckedItem;
+};

package/types/packages/platforms/vue3/src/relation-graph/src/hooks/useGraphData.d.ts

@@ -0,0 +1,2 @@
+import { RGDataStore } from '../../../types-vue3';
+export declare function useGraphData(): RGDataStore;

package/types/packages/platforms/vue3/src/relation-graph/src/hooks/useGraphInstance.d.ts

@@ -0,0 +1,2 @@
+import { RelationGraphInstance } from '../../../../../../types';
+export declare function useGraphInstance<InstanceType extends RelationGraphInstance>(): InstanceType;

package/types/packages/platforms/vue3/src/relation-graph/src/hooks/useGraphStore.d.ts

@@ -0,0 +1,16 @@
+import { Ref } from 'vue';
+import { RGCheckedItem, RGConnectingNode, RGCreatingLine, RGCreatingNode, RGEditingLine, RGEditingNodes, RGOptionsFull, RGSelectionView, RGViewInformation } from '../../../../../../types';
+export declare function useGraphStore(): {
+    optionsRef: Ref<RGOptionsFull>;
+};
+export declare function useGraphOptions(): Ref<RGOptionsFull>;
+export declare function useCreatingLine(): Ref<RGCreatingLine>;
+export declare function useCreatingNode(): Ref<RGCreatingNode>;
+export declare function useEditingNodes(): Ref<RGEditingNodes>;
+export declare function useEditingLine(): Ref<RGEditingLine>;
+export declare function useConnectingNode(): Ref<RGConnectingNode>;
+export declare function useViewInformation(): Ref<RGViewInformation>;
+export declare function useSelection(): Ref<RGSelectionView & {
+    show: boolean;
+}>;
+export declare function useCheckedItem(): Ref<RGCheckedItem>;

package/types/packages/platforms/vue3/src/relation-graph/src/hooks/useRGDataProvider.d.ts

@@ -0,0 +1,17 @@
+import { RGOptions } from '../../../../../../types';
+import { RelationGraphCore } from '../../../../../../relation-graph-models/models/RelationGraphCore';
+export declare function generateNewRGInstance(relationGraphCore?: new (...args: any[]) => RelationGraphCore, forLinker?: boolean): import('vue').Raw<RelationGraphCore>;
+export declare function getOrGenerateRGInstance(relationGraphCore?: new (...args: any[]) => RelationGraphCore, forLinker?: boolean): RelationGraphCore;
+export declare function defineRGDataProviderComponent(graphInstance: RelationGraphCore): import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    options: {
+        required: false;
+        type: () => RGOptions;
+    };
+}>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}>[] | null, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    options: {
+        required: false;
+        type: () => RGOptions;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/types/packages/platforms/vue3/src/relation-graph/src/hooks/useRelationGraph.d.ts

@@ -0,0 +1,131 @@
+import { RGJsonData, RGOptions } from '../../../../../../types';
+import { RelationGraphCore } from '../../../../../../relation-graph-models/models/RelationGraphCore';
+/**
+ * This is a sophisticated and decoupled pattern:
+ *
+ * `useRGDataProvider`: Uses `provide`/`inject` (Vue's Context API) to "provide" a single, markRaw-marked `graphInstance` instance.
+ *
+ * `useRelationGraph`: A Hook that dynamically creates and returns a `graphInstance` instance and a `<RelationGraph>` component bound to that instance.
+ * @param emitProxy
+ * @param relationGraphCore
+ */
+export declare function useRelationGraph({ relationGraphCore }?: {
+    relationGraphCore?: new (...args: any[]) => RelationGraphCore;
+}): {
+    RelationGraph: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        options: {
+            required: false;
+            type: () => RGOptions;
+        };
+        initialData: {
+            required: false;
+            type: () => RGJsonData;
+        };
+        emitProxy: {
+            required: false;
+            type: () => (any | void);
+        };
+    }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+        onReady: (graphInstance: RelationGraphCore) => boolean;
+        onNodeClick: (node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onNodeExpand: (node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onNodeCollapse: (node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onLineClick: (line: import('../../../../../../types').RGLine, link: import('../../../../../../types').RGLink, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onNodeDragStart: (node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onNodeDragEnd: (node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent, x_buff: number, y_buff: number) => boolean;
+        onNodeDragging: (node: import('../../../../../../types').RGNode, newX: number, newY: number, buffX: number, buffY: number, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onCanvasDragEnd: (event: import('../../../../../../types').RGUserEvent) => boolean;
+        onCanvasDragging: (newX: number, newY: number, buffX: number, buffY: number) => boolean;
+        onContextmenu: (event: import('../../../../../../types').RGUserEvent, objectType: import('../../../../../../types').RGEventTargetType, object: import('../../../../../../types').RGNode | import('../../../../../../types').RGLine | undefined, eventPositionOnCanvas: import('../../../../../../types').RGCoordinate, eventPositionOnView: import('../../../../../../types').RGCoordinate) => boolean;
+        onFullscreen: (newValue: boolean, defaultFullscreen: () => Promise<void>) => boolean;
+        onCanvasClick: (event: import('../../../../../../types').RGUserEvent) => boolean;
+        onCanvasSelectionEnd: (selectionView: import('../../../../../../types').RGSelectionView, event: import('../../../../../../types').RGUserEvent) => boolean;
+        beforeZoomStart: () => boolean;
+        onZoomEnd: () => boolean;
+        onViewResize: () => boolean;
+        onResizeStart: (nodes: import('../../../../../../types').RGNode[], event: import('../../../../../../types').RGUserEvent) => boolean;
+        beforeNodeResize: (node: import('../../../../../../types').RGNode, newX: number, newY: number, newW: number, newH: number) => boolean;
+        onResizeEnd: (nodes: import('../../../../../../types').RGNode[], buffX: number, buffY: number, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onLineVertexDropped: (lineInfo: {
+            newLineTemplate: import('../../../../../../types').JsonLine;
+            fromNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+            toNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+        }) => boolean;
+        beforeCreateLine: (lineInfo: {
+            lineJson: import('../../../../../../types').JsonLine;
+            fromNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+            toNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+        }) => boolean;
+        onLineBeCreated: (lineInfo: {
+            lineJson: import('../../../../../../types').JsonLine;
+            fromNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+            toNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+        }) => boolean;
+        beforeAddNodes: (nodes: import('../../../../../../types').JsonNode[]) => boolean;
+        beforeAddLines: (lines: import('../../../../../../types').JsonLine[]) => boolean;
+        onKeyboardDown: (event: KeyboardEvent) => boolean;
+        onKeyboardUp: (event: KeyboardEvent) => boolean;
+        onCanvasDragStart: (canvasMoveStartPosition: import('../../../../../../types').RGCoordinate, eventClientStartPosition: import('../../../../../../types').RGCoordinate, event: import('../../../../../../types').RGUserEvent) => boolean;
+        onForceLayoutFinish: () => boolean;
+        beforeScrollStart: (buffX: number, buffY: number, event: Event) => boolean;
+    }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        options: {
+            required: false;
+            type: () => RGOptions;
+        };
+        initialData: {
+            required: false;
+            type: () => RGJsonData;
+        };
+        emitProxy: {
+            required: false;
+            type: () => (any | void);
+        };
+    }>> & Readonly<{
+        onOnReady?: ((graphInstance: RelationGraphCore) => any) | undefined;
+        onOnNodeClick?: ((node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnNodeExpand?: ((node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnNodeCollapse?: ((node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnLineClick?: ((line: import('../../../../../../types').RGLine, link: import('../../../../../../types').RGLink, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnNodeDragStart?: ((node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnNodeDragEnd?: ((node: import('../../../../../../types').RGNode, event: import('../../../../../../types').RGUserEvent, x_buff: number, y_buff: number) => any) | undefined;
+        onOnNodeDragging?: ((node: import('../../../../../../types').RGNode, newX: number, newY: number, buffX: number, buffY: number, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnCanvasDragEnd?: ((event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnCanvasDragging?: ((newX: number, newY: number, buffX: number, buffY: number) => any) | undefined;
+        onOnContextmenu?: ((event: import('../../../../../../types').RGUserEvent, objectType: import('../../../../../../types').RGEventTargetType, object: import('../../../../../../types').RGNode | import('../../../../../../types').RGLine | undefined, eventPositionOnCanvas: import('../../../../../../types').RGCoordinate, eventPositionOnView: import('../../../../../../types').RGCoordinate) => any) | undefined;
+        onOnFullscreen?: ((newValue: boolean, defaultFullscreen: () => Promise<void>) => any) | undefined;
+        onOnCanvasClick?: ((event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnCanvasSelectionEnd?: ((selectionView: import('../../../../../../types').RGSelectionView, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onBeforeZoomStart?: (() => any) | undefined;
+        onOnZoomEnd?: (() => any) | undefined;
+        onOnViewResize?: (() => any) | undefined;
+        onOnResizeStart?: ((nodes: import('../../../../../../types').RGNode[], event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onBeforeNodeResize?: ((node: import('../../../../../../types').RGNode, newX: number, newY: number, newW: number, newH: number) => any) | undefined;
+        onOnResizeEnd?: ((nodes: import('../../../../../../types').RGNode[], buffX: number, buffY: number, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnLineVertexDropped?: ((lineInfo: {
+            newLineTemplate: import('../../../../../../types').JsonLine;
+            fromNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+            toNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+        }) => any) | undefined;
+        onBeforeCreateLine?: ((lineInfo: {
+            lineJson: import('../../../../../../types').JsonLine;
+            fromNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+            toNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+        }) => any) | undefined;
+        onOnLineBeCreated?: ((lineInfo: {
+            lineJson: import('../../../../../../types').JsonLine;
+            fromNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+            toNode: import('../../../../../../types').RGNode | import('../../../../../../types').RGLineTarget;
+        }) => any) | undefined;
+        onBeforeAddNodes?: ((nodes: import('../../../../../../types').JsonNode[]) => any) | undefined;
+        onBeforeAddLines?: ((lines: import('../../../../../../types').JsonLine[]) => any) | undefined;
+        onOnKeyboardDown?: ((event: KeyboardEvent) => any) | undefined;
+        onOnKeyboardUp?: ((event: KeyboardEvent) => any) | undefined;
+        onOnCanvasDragStart?: ((canvasMoveStartPosition: import('../../../../../../types').RGCoordinate, eventClientStartPosition: import('../../../../../../types').RGCoordinate, event: import('../../../../../../types').RGUserEvent) => any) | undefined;
+        onOnForceLayoutFinish?: (() => any) | undefined;
+        onBeforeScrollStart?: ((buffX: number, buffY: number, event: Event) => any) | undefined;
+    }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    graphInstance: RelationGraphCore;
+};

package/types/packages/platforms/vue3/src/relation-graph/src/hooks/useRelationLinker.d.ts

@@ -0,0 +1,39 @@
+import { ShortEmitsToObject } from 'vue';
+import { RGLine, RGOptions } from '../../../../../../types';
+import { RelationGraphCore } from '../../../../../../relation-graph-models/models/RelationGraphCore';
+import { RGEventEmits } from '../../../types-vue3';
+export declare function useRelationLinker({ relationGraphCore, options, emitProxy }?: {
+    options?: RGOptions;
+    relationGraphCore?: new (...args: any[]) => RelationGraphCore;
+    emitProxy?: ShortEmitsToObject<RGEventEmits>;
+}): {
+    RGProvider: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+        options: {
+            required: false;
+            type: () => Partial<import('../../../../../../types').RGOptionsInited>;
+        };
+    }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }>[] | null, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+        options: {
+            required: false;
+            type: () => Partial<import('../../../../../../types').RGOptionsInited>;
+        };
+    }>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    RelationLinker: import('vue').DefineComponent<{
+        lines: RGLine[];
+    }, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
+        lines: RGLine[];
+    }> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    VueLinker: import('vue').DefineComponent<{
+        lines: RGLine[];
+    }, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+        [key: string]: any;
+    }>, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
+        lines: RGLine[];
+    }> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+    graphInstance: RelationGraphCore;
+};
+export declare const useVueLinker: typeof useRelationLinker;

package/types/packages/platforms/vue3/src/types-vue3.d.ts

@@ -0,0 +1,122 @@
+import { VNode, ShallowRef, VueElement } from 'vue';
+import { JsonLine, JsonNode, RelationGraphInstance, RelationGraphProps, RGCoordinate, RGEventTargetType, RGFakeLine, RGLine, RGLineTarget, RGLink, RGNode, RGOptionsFull, RGPosition, RGSelectionView, RGUserEvent } from './types';
+export declare class RelationGraphComponent extends VueElement {
+    getInstance(): RelationGraphInstance;
+    $props: RelationGraphProps;
+    $slots: {
+        default: VNode[];
+        canvasPlug: VNode[];
+        miniToolBar: VNode[];
+        miniViewPanel: VNode[];
+        nodeExpandHolder: VNode[];
+        graphPlug: VNode[];
+        node: VNode[];
+        line: VNode[];
+    };
+}
+export type RGProviderData = {
+    graphInstance: RelationGraphInstance;
+};
+export declare const version: string;
+export type RGDataStore = {
+    optionsRef: ShallowRef<RGOptionsFull>;
+    shouldRenderNodesRef: ShallowRef<RGNode[]>;
+    shouldRenderLinesRef: ShallowRef<RGLine[]>;
+    shouldRenderFakeLinesRef: ShallowRef<RGFakeLine[]>;
+};
+/**
+ * This is a type definition specifically for the emits option of vue3 defineComponent components. It describes all the events supported by the relation-graph component and their parameter types. The content expressed is exactly the same as RGListeners.
+ * @inner
+ */
+export declare const RGEventsDefine4Vue3: {
+    onReady: (graphInstance: RelationGraphInstance) => boolean;
+    onNodeClick: (node: RGNode, event: RGUserEvent) => boolean;
+    onNodeExpand: (node: RGNode, event: RGUserEvent) => boolean;
+    onNodeCollapse: (node: RGNode, event: RGUserEvent) => boolean;
+    onLineClick: (line: RGLine, link: RGLink, event: RGUserEvent) => boolean;
+    onNodeDragStart: (node: RGNode, event: RGUserEvent) => boolean;
+    onNodeDragEnd: (node: RGNode, event: RGUserEvent, x_buff: number, y_buff: number) => boolean;
+    onNodeDragging: (node: RGNode, newX: number, newY: number, buffX: number, buffY: number, event: RGUserEvent) => boolean;
+    onCanvasDragEnd: (event: RGUserEvent) => boolean;
+    onCanvasDragging: (newX: number, newY: number, buffX: number, buffY: number) => boolean;
+    onContextmenu: (event: RGUserEvent, objectType: RGEventTargetType, object: RGNode | RGLine | undefined, eventPositionOnCanvas: RGCoordinate, eventPositionOnView: RGCoordinate) => boolean;
+    onFullscreen: (newValue: boolean, defaultFullscreen: () => Promise<void>) => boolean;
+    onCanvasClick: (event: RGUserEvent) => boolean;
+    onCanvasSelectionEnd: (selectionView: RGSelectionView, event: RGUserEvent) => boolean;
+    beforeZoomStart: () => boolean;
+    onZoomEnd: () => boolean;
+    onViewResize: () => boolean;
+    onResizeStart: (nodes: RGNode[], event: RGUserEvent) => boolean;
+    beforeNodeResize: (node: RGNode, newX: number, newY: number, newW: number, newH: number) => boolean;
+    onResizeEnd: (nodes: RGNode[], buffX: number, buffY: number, event: RGUserEvent) => boolean;
+    onLineVertexDropped: (lineInfo: {
+        newLineTemplate: JsonLine;
+        fromNode: RGLineTarget | RGNode;
+        toNode: RGLineTarget | RGNode;
+    }) => boolean;
+    beforeCreateLine: (lineInfo: {
+        lineJson: JsonLine;
+        fromNode: RGLineTarget | RGNode;
+        toNode: RGLineTarget | RGNode;
+    }) => boolean;
+    onLineBeCreated: (lineInfo: {
+        lineJson: JsonLine;
+        fromNode: RGLineTarget | RGNode;
+        toNode: RGLineTarget | RGNode;
+    }) => boolean;
+    beforeAddNodes: (nodes: JsonNode[]) => boolean;
+    beforeAddLines: (lines: JsonLine[]) => boolean;
+    onKeyboardDown: (event: KeyboardEvent) => boolean;
+    onKeyboardUp: (event: KeyboardEvent) => boolean;
+    onCanvasDragStart: (canvasMoveStartPosition: RGPosition, eventClientStartPosition: RGPosition, event: RGUserEvent) => boolean;
+    onForceLayoutFinish: () => boolean;
+    beforeScrollStart: (buffX: number, buffY: number, event: Event) => boolean;
+};
+/**
+ * This is a type definition specifically for the emits option of vue3 setup components. It describes all the events supported by the relation-graph component and their parameter types. The content expressed is exactly the same as RGListeners.
+ * @inner
+ */
+export type RGEventEmits = {
+    (e: 'onReady', graphInstance: RelationGraphInstance): void;
+    (e: 'onNodeClick', node: RGNode, event: RGUserEvent): void;
+    (e: 'onNodeExpand', node: RGNode, event: RGUserEvent): void;
+    (e: 'onNodeCollapse', node: RGNode, event: RGUserEvent): void;
+    (e: 'onLineClick', line: RGLine, link: RGLink, event: RGUserEvent): void;
+    (e: 'onNodeDragStart', node: RGNode, event: RGUserEvent): void;
+    (e: 'onNodeDragEnd', node: RGNode, event: RGUserEvent, x_buff: number, y_buff: number): void;
+    (e: 'onNodeDragging', node: RGNode, newX: number, newY: number, buffX: number, buffY: number, event: RGUserEvent): void;
+    (e: 'onCanvasDragEnd', event: RGUserEvent): void;
+    (e: 'onCanvasDragging', newX: number, newY: number, buffX: number, buffY: number): void;
+    (e: 'onContextmenu', event: RGUserEvent, objectType: RGEventTargetType, object: RGNode | RGLine | undefined, eventPositionOnCanvas: RGCoordinate, eventPositionOnView: RGCoordinate): void;
+    (e: 'onFullscreen', newValue: boolean, defaultFullscreen: () => Promise<void>): void;
+    (e: 'onCanvasClick', event: RGUserEvent): void;
+    (e: 'onCanvasSelectionEnd', selectionView: RGSelectionView, event: RGUserEvent): void;
+    (e: 'beforeZoomStart'): void;
+    (e: 'onZoomEnd'): void;
+    (e: 'onViewResize'): void;
+    (e: 'onResizeStart', nodes: RGNode[], event: RGUserEvent): void;
+    (e: 'beforeNodeResize', node: RGNode, newX: number, newY: number, newW: number, newH: number): void;
+    (e: 'onResizeEnd', nodes: RGNode[], buffX: number, buffY: number, event: RGUserEvent): void;
+    (e: 'onLineVertexDropped', lineInfo: {
+        newLineTemplate: JsonLine;
+        fromNode: RGLineTarget | RGNode;
+        toNode: RGLineTarget | RGNode;
+    }): void;
+    (e: 'beforeCreateLine', lineInfo: {
+        lineJson: JsonLine;
+        fromNode: RGLineTarget | RGNode;
+        toNode: RGLineTarget | RGNode;
+    }): void;
+    (e: 'onLineBeCreated', lineInfo: {
+        lineJson: JsonLine;
+        fromNode: RGLineTarget | RGNode;
+        toNode: RGLineTarget | RGNode;
+    }): void;
+    (e: 'beforeAddNodes', nodes: JsonNode[]): void;
+    (e: 'beforeAddLines', lines: JsonLine[]): void;
+    (e: 'onKeyboardDown', event: KeyboardEvent): void;
+    (e: 'onKeyboardUp', event: KeyboardEvent): void;
+    (e: 'onCanvasDragStart', canvasMoveStartPosition: RGPosition, eventClientStartPosition: RGPosition, event: RGUserEvent): void;
+    (e: 'onForceLayoutFinish'): void;
+    (e: 'beforeScrollStart', buffX: number, buffY: number, event: Event): true | undefined | void;
+};

package/types/packages/platforms/vue3/src/types.d.ts

@@ -0,0 +1,3 @@
+export * from '../../../types';
+export { RGEventsDefine4Vue3 } from './types-vue3';
+export type { RGEventEmits } from './types-vue3';

package/types/packages/platforms/vue3/vite.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vite').UserConfigExport;
+export default _default;