@relation-graph/vue3 3.0.12 → 3.0.13

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

@@ -1,7 +1,7 @@
 /**
 * relation-graph
 * Website: http://www.relation-graph.com/
-* Github: https://github.com/seeksdream/relation-graph
+* Github: https://github.com/relation-graph/relation-graph
 *
 */
 import { RelationGraphCore as _RelationGraphCore } from '../../../relation-graph-models/models/RelationGraphCore';
@@ -433,14 +433,26 @@ export declare const RGWatermark: import('vue').DefineComponent<{
         type: StringConstructor;
     };
 }>>, {
+    position: string;
     forImage: boolean;
     forDisplay: boolean;
-    position: string;
 }>;
-export declare const RGEditingNodeController: import('vue').DefineComponent<{}, unknown, {}, {
+export declare const RGEditingNodeController: import('vue').DefineComponent<{
+    hideBorderForSingleNode: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, {}, {}, {
     graphInstance(): any;
     options(): any;
-}, {}, import('vue/types/v3-component-options').ComponentOptionsMixin, import('vue/types/v3-component-options').ComponentOptionsMixin, {}, string, Readonly<import('vue').ExtractPropTypes<{}>>, {}>;
+}, {}, import('vue/types/v3-component-options').ComponentOptionsMixin, import('vue/types/v3-component-options').ComponentOptionsMixin, {}, string, Readonly<import('vue').ExtractPropTypes<{
+    hideBorderForSingleNode: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    hideBorderForSingleNode: boolean;
+}>;
 export declare const RGEditingResize: import('vue').DefineComponent<{
     disableResizeWidth: {
         type: BooleanConstructor;
@@ -605,12 +617,30 @@ export declare const RGConnectTarget: import('vue').DefineComponent<{
         mustUseProp: boolean;
         type: BooleanConstructor;
     };
+    domMode: {
+        mustUseProp: boolean;
+        type: () => import('../../../types').RGConnectTargetDomMode;
+    };
+    measureSelector: {
+        mustUseProp: boolean;
+        type: StringConstructor;
+    };
+    strictMeasureTarget: {
+        mustUseProp: boolean;
+        type: BooleanConstructor;
+    };
 }, {}, {}, {
     RGInnerConnectTargetType(): typeof import('../../../types').RGInnerConnectTargetType;
     RGJunctionPoint(): typeof import('../../../types').RGJunctionPoint;
     graphInstance(): any;
     options(): any;
+    actualJunctionPoint(): string;
+    normalizedDomMode(): import('../../../types').RGConnectTargetDomMode;
+    resolvedHostStyle(): string | (string | {
+        display: string;
+    })[];
 }, {
+    registerCurrentTarget(): void;
     onClick($event: any): void;
     onMouseDown($event: any): void;
     onMouseUp(type: any, $event: any): void;
@@ -648,11 +678,24 @@ export declare const RGConnectTarget: import('vue').DefineComponent<{
         mustUseProp: boolean;
         type: BooleanConstructor;
     };
+    domMode: {
+        mustUseProp: boolean;
+        type: () => import('../../../types').RGConnectTargetDomMode;
+    };
+    measureSelector: {
+        mustUseProp: boolean;
+        type: StringConstructor;
+    };
+    strictMeasureTarget: {
+        mustUseProp: boolean;
+        type: BooleanConstructor;
+    };
 }>>, {
     disableDrag: boolean;
     junctionPoint: string;
-    disableDrop: boolean;
+    strictMeasureTarget: boolean;
     forSvg: boolean;
+    disableDrop: boolean;
 }>;
 export declare const RGEditingConnectPoints: import('vue').DefineComponent<{
     mouseUpOnJunctionPoint: {
@@ -748,9 +791,9 @@ export declare const RelationLinker: import('vue').DefineComponent<{
         type: FunctionConstructor;
     };
 }>>, {
+    lines: unknown[];
     options: Record<string, any>;
     relationGraphCore: Function;
-    lines: unknown[];
 }>;
 export declare const RelationGraph: import('vue').DefineComponent<{
     options: {

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

@@ -1,7 +1,7 @@
 /**
 * relation-graph
 * Website: http://www.relation-graph.com/
-* Github: https://github.com/seeksdream/relation-graph
+* Github: https://github.com/relation-graph/relation-graph
 *
 */
 export * from './index.shared';

package/types/packages/relation-graph-models/data/RGLineDataUtils.d.ts

@@ -1,9 +1,145 @@
-import { JsonLine, RGLine, RGLink, RGOptions } from '../../types';
+import { JsonLine, RGFakeLine, RGJunctionPoint, RGLine, RGLink, RGOptions } from '../../types';
+export type RGTransLineToJsonOptions = {
+    mode?: 'compact' | 'effective';
+    graphOptions?: RGOptions;
+};
 export declare const json2Line: (originData: JsonLine, options: RGOptions) => RGLine;
-export declare const transLineToJson: (line: RGLine) => JsonLine | undefined;
-export declare const transLinkToJson: (link: RGLink) => JsonLine | undefined;
+export declare const transLineToJson: (line: RGLine | RGFakeLine, options?: RGTransLineToJsonOptions) => JsonLine | {
+    id: string;
+    from: string;
+    to: string;
+    text: string;
+    type: string;
+    isFakeLine: boolean;
+    fromType: string;
+    toType: string;
+    color: string | undefined;
+    lineWidth: number | undefined;
+    opacity: number;
+    lineShape: number;
+    showStartArrow: boolean;
+    showEndArrow: boolean;
+    startMarkerId: string;
+    endMarkerId: string;
+    useTextOnPath: boolean;
+    textOffsetX: number;
+    textOffsetY: number;
+    disablePointEvent: boolean | undefined;
+    data: Record<string, any>;
+    animation: number;
+    dashType: number;
+    lineRadius: number | undefined;
+    forDisplayOnly: boolean;
+    junctionOffset: number;
+    fromJunctionPoint: RGJunctionPoint;
+    toJunctionPoint: RGJunctionPoint;
+    fromJunctionPointOffsetX: number;
+    fromJunctionPointOffsetY: number;
+    toJunctionPointOffsetX: number;
+    toJunctionPointOffsetY: number;
+    hidden: boolean;
+    selected?: boolean | undefined;
+    fontColor?: string | undefined;
+    fontSize?: number | undefined;
+    className?: string | undefined;
+    placeText?: "start" | "center" | "end" | undefined;
+    textAnchor?: string | undefined;
+    lineDirection?: string | undefined;
+    polyLineStartDistance?: number | undefined;
+    cssVars?: Record<string, any> | undefined;
+    force_elastic?: number | undefined;
+} | undefined;
+export declare const transLinkToJson: (link: RGLink, options?: RGTransLineToJsonOptions) => JsonLine | {
+    id: string;
+    from: string;
+    to: string;
+    text: string;
+    type: string;
+    isFakeLine: boolean;
+    fromType: string;
+    toType: string;
+    color: string | undefined;
+    lineWidth: number | undefined;
+    opacity: number;
+    lineShape: number;
+    showStartArrow: boolean;
+    showEndArrow: boolean;
+    startMarkerId: string;
+    endMarkerId: string;
+    useTextOnPath: boolean;
+    textOffsetX: number;
+    textOffsetY: number;
+    disablePointEvent: boolean | undefined;
+    data: Record<string, any>;
+    animation: number;
+    dashType: number;
+    lineRadius: number | undefined;
+    forDisplayOnly: boolean;
+    junctionOffset: number;
+    fromJunctionPoint: RGJunctionPoint;
+    toJunctionPoint: RGJunctionPoint;
+    fromJunctionPointOffsetX: number;
+    fromJunctionPointOffsetY: number;
+    toJunctionPointOffsetX: number;
+    toJunctionPointOffsetY: number;
+    hidden: boolean;
+    selected?: boolean | undefined;
+    fontColor?: string | undefined;
+    fontSize?: number | undefined;
+    className?: string | undefined;
+    placeText?: "start" | "center" | "end" | undefined;
+    textAnchor?: string | undefined;
+    lineDirection?: string | undefined;
+    polyLineStartDistance?: number | undefined;
+    cssVars?: Record<string, any> | undefined;
+    force_elastic?: number | undefined;
+} | undefined;
 declare const _default: {
     json2Line: (originData: JsonLine, options: Partial<import('../../types').RGOptionsInited>) => RGLine;
-    transLinkToJson: (link: RGLink) => JsonLine | undefined;
+    transLinkToJson: (link: RGLink, options?: RGTransLineToJsonOptions) => JsonLine | {
+        id: string;
+        from: string;
+        to: string;
+        text: string;
+        type: string;
+        isFakeLine: boolean;
+        fromType: string;
+        toType: string;
+        color: string | undefined;
+        lineWidth: number | undefined;
+        opacity: number;
+        lineShape: number;
+        showStartArrow: boolean;
+        showEndArrow: boolean;
+        startMarkerId: string;
+        endMarkerId: string;
+        useTextOnPath: boolean;
+        textOffsetX: number;
+        textOffsetY: number;
+        disablePointEvent: boolean | undefined;
+        data: Record<string, any>;
+        animation: number;
+        dashType: number;
+        lineRadius: number | undefined;
+        forDisplayOnly: boolean;
+        junctionOffset: number;
+        fromJunctionPoint: RGJunctionPoint;
+        toJunctionPoint: RGJunctionPoint;
+        fromJunctionPointOffsetX: number;
+        fromJunctionPointOffsetY: number;
+        toJunctionPointOffsetX: number;
+        toJunctionPointOffsetY: number;
+        hidden: boolean;
+        selected?: boolean | undefined;
+        fontColor?: string | undefined;
+        fontSize?: number | undefined;
+        className?: string | undefined;
+        placeText?: "start" | "center" | "end" | undefined;
+        textAnchor?: string | undefined;
+        lineDirection?: string | undefined;
+        polyLineStartDistance?: number | undefined;
+        cssVars?: Record<string, any> | undefined;
+        force_elastic?: number | undefined;
+    } | undefined;
 };
 export default _default;

package/types/packages/relation-graph-models/data/RGNodeDataUtils.d.ts

@@ -1,4 +1,9 @@
 import { JsonNode, RGNode, RGOptions } from '../../types';
+export type RGTransNodeToJsonOptions = {
+    mode?: 'compact' | 'effective';
+    graphOptions?: RGOptions;
+    effectiveSizeMode?: 'resolved' | 'node';
+};
 export declare const newNodeTemplate: {
     id: string;
     x: number;
@@ -9,9 +14,9 @@ export declare const json2Node: (originData: JsonNode, graphOptions?: RGOptions,
     number,
     number
 ]>) => RGNode;
-export declare const transNodeToJson: (node: RGNode) => JsonNode | undefined;
+export declare const transNodeToJson: (node: RGNode, options?: RGTransNodeToJsonOptions) => JsonNode | undefined;
 declare const _default: {
     json2Node: (originData: JsonNode, graphOptions?: Partial<import('../../types').RGOptionsInited> | undefined, nodesSizeMap?: Map<string, [number, number]> | undefined) => RGNode;
-    transNodeToJson: (node: RGNode) => JsonNode | undefined;
+    transNodeToJson: (node: RGNode, options?: RGTransNodeToJsonOptions) => JsonNode | undefined;
 };
 export default _default;

package/types/packages/relation-graph-models/models/RelationGraphBase.d.ts

@@ -5,10 +5,11 @@ import { RGDataProvider } from '../data/RGDataProvider';
  */
 export declare class RelationGraphBase {
     listeners: RGListeners;
-    private useReactiveDataToAutoUpdateView;
+    protected useReactiveDataToAutoUpdateView: boolean;
     protected instanceId: string;
     dataProvider: RGDataProvider;
     options: RGOptionsFull;
+    protected _previousUpdateTime: number;
     constructor();
     /**
      * Generate a highly likely unique id, the probability of non-duplication depends on the parameter idLength (the length of the id)
@@ -26,6 +27,12 @@ export declare class RelationGraphBase {
      * @protected
      */
     protected _dataUpdated(): void;
+    protected _beforeViewDataUpdated(): void;
+    protected _updateEditingControllerView(): void;
+    protected _updateEditingConnectControllerView(): void;
+    protected updateShouldRenderGraphData(_force?: boolean): void;
+    protected updateEasyView(): void;
+    protected updateMiniView(): void;
     private _dataUpdatedRequested;
     /**
      * @inner

package/types/packages/relation-graph-models/models/RelationGraphWith1View.d.ts

@@ -1,4 +1,4 @@
-import { RGLine, RGUserEvent, RGCoordinate, RGNode, RGLink } from '../../types';
+import { RGLine, RGUserEvent, RGCoordinate, RGNode, RGLink, RGRectTarget } from '../../types';
 import { RelationGraphBase } from './RelationGraphBase';
 /**
  * Relation-graph component view related class
@@ -6,6 +6,7 @@ import { RelationGraphBase } from './RelationGraphBase';
 export declare class RelationGraphWith1View extends RelationGraphBase {
     $dom: HTMLDivElement;
     $canvasDom: HTMLDivElement;
+    protected dataStores: Record<string, any>;
     /**
      * @inner
      */
@@ -13,15 +14,15 @@ export declare class RelationGraphWith1View extends RelationGraphBase {
     /**
      * @inner
      */
-    private $lineTextContainer4NormalLine;
+    protected $lineTextContainer4NormalLine: HTMLDivElement;
     /**
      * @inner
      */
-    private $lineTextContainer4FakeLine;
+    protected $lineTextContainer4FakeLine: HTMLDivElement;
     /**
      * @inner
      */
-    getLineTextContainer(line: RGLine): HTMLDivElement | undefined;
+    getLineTextContainer(line?: Pick<RGLine, 'isFakeLine'> | null): HTMLDivElement | undefined;
     private viewBoundingClientRect;
     /**
      * Get the RelationGraph component DOM
@@ -32,6 +33,7 @@ export declare class RelationGraphWith1View extends RelationGraphBase {
      * @deprecated Please use getViewBoundingClientRect instead of getBoundingClientRect, this method is compatible with older api versions.
      */
     getBoundingClientRect(): DOMRect | null;
+    getCanvasSlotRectItems(): RGRectTarget[];
     /**
      * Compatible with older api versions
      * @param e
@@ -74,20 +76,21 @@ export declare class RelationGraphWith1View extends RelationGraphBase {
      * @param clientXY
      */
     getCanvasCoordinateByClientCoordinate(clientXY: RGCoordinate): RGCoordinate;
+    protected getEventTargetElement(e: RGUserEvent): Element | null;
     /**
      * Check if el is a node element, if so, return the corresponding node object
      * - You can use this method to determine if the element currently under the mouse is a node element, and get the corresponding node object
      * @param el
      * @return RGNode | undefined
      */
-    isNode(el: HTMLElement): RGNode | undefined;
+    isNode(el: Element | null): RGNode | undefined;
     /**
      * Check if el is a line element, if so, return the corresponding line object
      * - You can use this method to determine if the element currently under the mouse is a line element, and get the corresponding line object
      * @param el
      * @return RGLine | undefined
      */
-    isLine(el: HTMLElement): RGLine | undefined;
+    isLine(el: Element | null): RGLine | undefined;
     /**
      * @deprecated Please use isLine instead of isLink, this method is compatible with older api versions.
      * @param el

package/types/packages/relation-graph-models/models/RelationGraphWith2Data4ConnectTarget.d.ts

@@ -1,5 +1,20 @@
-import { RGConnectTargetData, RGJunctionPoint } from '../../types';
+import { RGConnectTargetData, RGConnectTargetDomMode, RGJunctionPoint, RGRegisterConnectTargetOptions } from '../../types';
 import { RelationGraphWith2Data3Update } from './RelationGraphWith2Data3Update';
+type RGRegisteredConnectTargetRuntime = {
+    targetId: string;
+    hostEl: Element;
+    measureEl: Element;
+    triggerEl: Element;
+    domMode: RGConnectTargetDomMode;
+    measureSelector?: string;
+    strictMeasureTarget?: boolean;
+};
+type RGRegisteredConnectTargetLookup = {
+    connectTargetEl: Element;
+    matchedEl: Element;
+    connectTarget: RGConnectTargetData;
+    runtime: RGRegisteredConnectTargetRuntime;
+};
 /**
  * The class related to connection point management in the relation-graph component, where the connection point refers to the connection point registered through the <RGConnectTarget> component
  */
@@ -7,7 +22,12 @@ export declare class RelationGraphWith2Data4ConnectTarget extends RelationGraphW
     constructor();
     private canvasConnectTargetsMap;
     private nodeConnectTargetsMap;
-    private connectTargetElementMap;
+    private connectTargetRuntimeMap;
+    private connectTargetIdByHostElement;
+    private connectTargetIdByMeasureElement;
+    private connectTargetIdByTriggerElement;
+    protected _observeConnectTargetElement(_targetId: string, _runtime: RGRegisteredConnectTargetRuntime): void;
+    protected _unobserveConnectTargetElement(_targetId: string, _runtime: RGRegisteredConnectTargetRuntime): void;
     /**
      * In general, relation-graph will automatically update the position of the connection points.
      * - This method is only used for manual calls in some special scenarios.
@@ -31,11 +51,28 @@ export declare class RelationGraphWith2Data4ConnectTarget extends RelationGraphW
     /**
      * @inner
      */
-    protected updateConnectTargetsOnNode(by: string, nodeId: string, nodeEl: HTMLDivElement): void;
+    protected getConnectTargetRuntimeById(targetId: string): RGRegisteredConnectTargetRuntime | undefined;
+    /**
+     * @inner
+     */
+    protected getConnectTargetElementById(targetId: string): Element | undefined;
+    /**
+     * @inner
+     */
+    protected getConnectTargetHostElementById(targetId: string): Element | undefined;
+    /**
+     * @inner
+     */
+    protected updateConnectTargetsOnNode(by: string, nodeId: string, nodeEl: Element): void;
     /**
      * @inner
      */
     protected updateConnectTargetList(by: string, relativeNodeEl: Element, connectTargetList: RGConnectTargetData[]): void;
+    protected getRegisteredConnectTargetByElement(connectTargetEl: Element): RGRegisteredConnectTargetLookup | undefined;
+    protected getConnectTargetByElement(connectTargetEl: Element): RGConnectTargetData | undefined;
+    protected refreshConnectTargetRuntimeById(by: string, targetId: string, explicitMeasureEl?: Element): void;
+    protected updateConnectTargetById(by: string, targetId: string, connectTargetEl?: Element): void;
+    private removeConnectTargetFromOwnerMaps;
     /**
      * @inner
      */
@@ -53,6 +90,30 @@ export declare class RelationGraphWith2Data4ConnectTarget extends RelationGraphW
      * @inner
      */
     private _updateConnectTargetOffset;
+    protected getConnectTargetRelativeElement(connectTarget: RGConnectTargetData, connectTargetEl?: Element): Element | null;
+    protected measureConnectTargetGeometry(connectTarget: RGConnectTargetData, connectTargetEl?: Element, relativeEl?: Element): {
+        offsetX: number;
+        offsetY: number;
+        width: number;
+        height: number;
+    } | undefined;
+    protected createLineTargetFromConnectTarget(connectTarget: RGConnectTargetData, geometry?: {
+        offsetX: number;
+        offsetY: number;
+        width: number;
+        height: number;
+    }): {
+        x: number;
+        y: number;
+        targetType: string;
+        targetData: Record<string, any>;
+        junctionPoint: RGJunctionPoint;
+        nodeShape: number;
+        id: string;
+        el_W: number;
+        el_H: number;
+        hidden: boolean;
+    } | undefined;
     /**
      * @inner
      */
@@ -60,11 +121,17 @@ export declare class RelationGraphWith2Data4ConnectTarget extends RelationGraphW
     /**
      * @inner
      */
-    private getNodeElByChildrenTarget;
+    protected getNodeElByChildrenTarget(connectTargetEl: Node | Element): HTMLDivElement | null;
+    protected normalizeConnectTargetDomMode(hostEl: Element, domMode?: RGConnectTargetDomMode): RGConnectTargetDomMode;
+    protected resolveConnectTargetMeasureElement(options: RGRegisterConnectTargetOptions): Element | undefined;
+    private removeRuntimeElementMappings;
+    private addRuntimeElementMappings;
+    private isSameRuntime;
+    private applyConnectTargetRuntime;
     /**
      * @inner
      */
-    registerConnectTarget(connectTargetEl: HTMLDivElement, targetId: string, targetType: string, junctionPoint: RGJunctionPoint, targetData?: Record<string, any>): RGConnectTargetData | undefined;
+    registerConnectTarget(connectTargetElOrOptions: Element | RGRegisterConnectTargetOptions, targetId?: string, targetType?: string, junctionPoint?: RGJunctionPoint, targetData?: Record<string, any>): RGConnectTargetData | undefined;
     /**
      * @inner
      */
@@ -83,3 +150,4 @@ export declare class RelationGraphWith2Data4ConnectTarget extends RelationGraphW
      */
     private reuseConnectTarget;
 }
+export {};

package/types/packages/relation-graph-models/models/RelationGraphWith2Data5LineConfig.d.ts

@@ -1,10 +1,26 @@
-import { RGFakeLine, RGFakeLineTargetRender, RGGenerateLineConfig, RGLine, RGLineTarget, RGOptionsFull } from '../../types';
+import { RGJunctionPoint, JsonLineLike, RGFakeLine, RGFakeLineTargetRender, RGGenerateLineConfig, RGLine, RGLineTarget, RGOptionsFull } from '../../types';
 import { RelationGraphWith2Data4ConnectTarget } from './RelationGraphWith2Data4ConnectTarget';
+type ResolveTargetRectOptions = {
+    preferLiveTarget?: boolean;
+    connectTargetEl?: Element;
+};
+type ResolvedConnectTargetDescriptor = {
+    targetId: string;
+    targetType: string;
+    junctionPoint: RGJunctionPoint;
+    connectTargetEl: Element;
+    hostEl: Element;
+    measureEl: Element;
+    triggerEl: Element;
+};
 /**
  * API class for generating line configuration and line connection point information in relation-graph component, providing data support for drawing lines
  */
 export declare class RelationGraphWith2Data5LineConfig extends RelationGraphWith2Data4ConnectTarget {
     constructor();
+    private resolvedTargetCache;
+    protected _beforeViewDataUpdated(): void;
+    protected resolveTargetDescriptorByElement(targetEl: Element): ResolvedConnectTargetDescriptor | undefined;
     /**
      * @inner
      */
@@ -31,5 +47,7 @@ export declare class RelationGraphWith2Data5LineConfig extends RelationGraphWith
      * @param targetId
      * @param fakeLine
      */
-    getFakeLineTarget(targetType: string, targetId: string, fakeLine: RGFakeLine): RGLineTarget | undefined;
+    protected resolveTargetRect(targetType: string, targetId: string, lineContext: JsonLineLike, options?: ResolveTargetRectOptions): RGLineTarget | undefined;
+    getFakeLineTarget(targetType: string, targetId: string, lineContext: JsonLineLike, options?: ResolveTargetRectOptions): RGLineTarget | undefined;
 }
+export {};

package/types/packages/relation-graph-models/models/RelationGraphWith6Layout.d.ts

@@ -16,11 +16,15 @@ export declare class RelationGraphWith6Layout extends RelationGraphWith6Effect {
     private _layoutTimer;
     private _layoutPromise;
     private _layoutResolve;
+    private _layoutReject;
     /**
-     * @inner
-     * @private
+     * Immediately assign positions to the nodes in the current graph based on the layout configuration set in the options
+     * - By default, the first node in the graph is used as the root node for layout. You can also specify a custom root node by passing a node object or node id as a parameter.
+     * - Unlike doLayout, this method directly performs the layout logic without the outer scheduling, merge, or delay handling.
+     * @param customRootNode Optional, specify a custom root node for layout, can be a node object or node id
+     * @return Promise<void>
      */
-    private _doLayout;
+    _doLayout(customRootNode?: RGNode | string): Promise<void>;
     /**
      * @inner
      * @protected

package/types/packages/relation-graph-models/models/RelationGraphWith7Event.d.ts

@@ -9,6 +9,7 @@ import { RelationGraphWith6Layout } from './RelationGraphWith6Layout';
  */
 export declare class RelationGraphWith7Event extends RelationGraphWith6Layout {
     constructor();
+    protected draggingSelectedNodes(_draggedNode: RGNode, _newX: number, _newY: number, _buff_x: number, _buff_y: number): void;
     private _prevClickNodeTime;
     /**
      * Triggered when the user clicks on a node
@@ -81,7 +82,7 @@ export declare class RelationGraphWith7Event extends RelationGraphWith6Layout {
      * @inner
      * @private
      */
-    private onCanvasDragEnd;
+    protected onCanvasDragEnd(e: RGUserEvent): void;
     /**
      * User clicks on the canvas
      * @param e
@@ -146,7 +147,7 @@ export declare class RelationGraphWith7Event extends RelationGraphWith6Layout {
      * @returns Return true to prevent the line from being created.
      * @protected
      */
-    protected onReadyToCreateLine(from: RGNode, to: RGNode | RGPosition): false | RGCoordinate | undefined;
+    protected onReadyToCreateLine(from: RGNode | RGLineTarget | RGPosition, to: RGNode | RGLineTarget | RGPosition): false | RGCoordinate | undefined;
     /**
      * User right-click context menu event
      * - Finally, you can get this event through the onContextmenu event, and you can get the position where the user right-clicked and the type of object clicked (canvas | line | node) and the object through this event.

package/types/packages/relation-graph-models/models/RelationGraphWith95Dom.d.ts

@@ -1,5 +1,5 @@
-import { RGRectTarget } from 'packages/platforms/vue2/dd/types/packages/types';
-import { RGNode } from '../../types';
+import { RGNode, RGRectTarget } from '../../types';
+import { RGAnalyzeRenderedGraphOptions, RGAnalyzeRenderedGraphResult } from '../utils/RGClassAndRender';
 import { RelationGraphWith93Image } from './RelationGraphWith93Image';
 /**
  * Enhancement class for relation-graph component to interact with DOM, monitor changes in the view and elements within the view, and respond accordingly
@@ -8,6 +8,7 @@ export declare class RelationGraphWith95Dom extends RelationGraphWith93Image {
     protected resizeObserver: ResizeObserver;
     protected resizeListenerMap: WeakMap<object, any>;
     protected domToNodeIdMap: WeakMap<Element, string>;
+    protected connectTargetHostMutationObserverMap: Map<Element, MutationObserver>;
     private _trackpadGestureActive;
     private _trackpadGestureStartZoom;
     private _trackpadGestureAnchorView;
@@ -28,6 +29,17 @@ export declare class RelationGraphWith95Dom extends RelationGraphWith93Image {
      * @param relationGraphDom:HTMLDivElement canvas DOM
      */
     setCanvasDom(canvasDom: HTMLDivElement): void;
+    /**
+     * Analyze the currently rendered graph DOM and classify node styles, node render methods, and line styles.
+     * - This method only relies on the final DOM/CSS result, so it can capture styles from both data-driven configuration and external CSS overrides.
+     * - The returned nodes/lines also include merged JsonNode/JsonLine effective values based on the current graph options.
+     * - It is only valid when the graph is rendered with real DOM nodes/lines. In performance mode or easy-view mode it will return a degraded result.
+     */
+    analyzeRenderedGraph(options?: RGAnalyzeRenderedGraphOptions): Promise<RGAnalyzeRenderedGraphResult>;
+    /**
+     * @deprecated Use analyzeRenderedGraph instead.
+     */
+    getClassAndRender(options?: RGAnalyzeRenderedGraphOptions): Promise<RGAnalyzeRenderedGraphResult>;
     /**
      * @inner
      * @private
@@ -75,7 +87,15 @@ export declare class RelationGraphWith95Dom extends RelationGraphWith93Image {
      * @param callback
      * @protected
      */
-    protected addResizeListener(dom: HTMLElement, callback: (width: number, height: number) => void): void;
+    protected addResizeListener(dom: Element, callback: (width: number, height: number) => void): void;
+    protected _observeConnectTargetElement(targetId: string, runtime: {
+        hostEl: Element;
+        measureEl: Element;
+    }): void;
+    protected _unobserveConnectTargetElement(_targetId: string, runtime: {
+        hostEl: Element;
+        measureEl: Element;
+    }): void;
     /**
      * Node DOM resize event handler
      * @inner
@@ -113,7 +133,7 @@ export declare class RelationGraphWith95Dom extends RelationGraphWith93Image {
      * @param dom
      * @protected
      */
-    protected removeResizeListener(dom: HTMLElement): void;
+    protected removeResizeListener(dom: Element): void;
     /**
      * @inner
      * @protected

package/types/packages/relation-graph-models/models/RelationGraphWith99API.d.ts

@@ -1,5 +1,7 @@
 import { JsonLine, JsonNode, RGJsonData, RGLine, RGLink, RGNode, RGOptions, RGRectTarget } from '../../types';
 import { RelationGraphWith95Dom } from './RelationGraphWith95Dom';
+import { RGTransNodeToJsonOptions } from '../data/RGNodeDataUtils';
+import { RGTransLineToJsonOptions } from '../data/RGLineDataUtils';
 /**
  * Additional API methods provided by the relation-graph component
  */
@@ -84,17 +86,17 @@ export declare class RelationGraphWith99API extends RelationGraphWith95Dom {
      * Convert an RGNode object to a JSON-serializable object
      * @param nodeJson: JsonNode
      */
-    transRGNodeToJsonObject(node: RGNode): JsonNode;
+    transRGNodeToJsonObject(node: RGNode, options?: RGTransNodeToJsonOptions): JsonNode;
     /**
      * Convert an RGLink object to a JSON-serializable object
      * @param lines: JsonLine
      */
-    transRGLinkToJsonObject(link: RGLink): JsonLine;
+    transRGLinkToJsonObject(link: RGLink, options?: RGTransLineToJsonOptions): JsonLine;
     /**
      * Convert an RGLine object to a JSON-serializable object
      * @param lineJson: JsonLine
      */
-    transRGLineToJsonObject(line: RGLine): JsonLine;
+    transRGLineToJsonObject(line: RGLine, options?: RGTransLineToJsonOptions): JsonLine;
     /**
      * Get the configuration information of the current graph
      */