@logicflow/core 1.0.0-alpha.6 → 1.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logicflow/core",
-  "version": "1.0.0-alpha.6",
+  "version": "1.0.0",
   "description": "LogicFlow core, to quickly build flowchart editor",
   "main": "dist/logic-flow.js",
   "unpkg": "dist/logic-flow.js",

package/types/LogicFlow.d.ts

@@ -8,7 +8,7 @@ import { CallbackType } from './event/eventEmitter';
 import Keyboard from './keyboard';
 import { EdgeConfig, EdgeFilter, NodeConfig, Extension, ComponentRender, FocusOnArgs, EdgeData, GraphConfigData, RegisterElementFn, RegisterConfig, ZoomParam, PointTuple } from './type';
 import SnaplineModel from './model/SnaplineModel';
-import { EditConfigInterface } from './model/editConfigModel';
+import { EditConfigInterface } from './model/EditConfigModel';
 import { Theme } from './constant/DefaultTheme';
 declare type GraphConfigModel = {
     nodes: _Model.BaseNodeModel[];

package/types/constant/DefaultTheme.d.ts

@@ -147,19 +147,8 @@ export declare type EdgeTextTheme = {
     hover?: EdgeTextTheme;
 } & TextTheme;
 export declare type EdgeTheme = CommonTheme;
-export declare type EdgePolylineTheme = {
-    /**
-     * 为了避免折线贴着节点导致折线和节点边重合
-     * 设置折线与节点产生垂线的距离。
-     * 详情见http://logic-flow.org/article/article03.html#%E7%9B%B4%E8%A7%92%E6%8A%98%E7%BA%BF
-     */
-    offset?: number;
-} & EdgeTheme;
+export declare type EdgePolylineTheme = EdgeTheme;
 export declare type EdgeBezierTheme = {
-    /**
-     * 贝塞尔曲线控制点与锚点的距离
-     */
-    offset?: number;
     /**
      * 贝塞尔调整线主题
      */

package/types/model/BaseModel.d.ts

@@ -68,7 +68,6 @@ interface IBaseModel {
      * @returns string
      */
     createId(): string;
-    move(deltaX: number, deltaY: number): void;
     moveText(deltaX: number, deltaY: number): void;
     updateText(value: string): void;
     setSelected(flag: boolean): void;
@@ -81,5 +80,6 @@ interface IBaseModel {
     getProperties(): Object;
     setProperties(properties: Object): void;
     updateAttributes(attributes: Object): void;
+    getTextStyle(): Record<string, any>;
 }
 export { IBaseModel, };

package/types/model/GraphModel.d.ts

@@ -4,7 +4,7 @@ import EditConfigModel from './EditConfigModel';
 import TransfromModel from './TransformModel';
 import { IBaseModel } from './BaseModel';
 import { OverlapMode } from '../constant/constant';
-import { AdditionData, Point, NodeConfig, EdgeConfig, NodeMoveRule, GraphConfigData } from '../type';
+import { AdditionData, Point, NodeConfig, EdgeConfig, PointTuple, NodeMoveRule, GraphConfigData } from '../type';
 import EventEmitter from '../event/eventEmitter';
 import { Theme } from '../constant/DefaultTheme';
 import { Definition } from '../options';
@@ -124,11 +124,14 @@ declare class GraphModel {
      * 当前编辑的元素，低频操作，先循环找。
      */
     get textEditElement(): BaseNodeModel | BaseEdgeModel;
+    /**
+     * 当前画布所有被选中的元素
+     */
     get selectElements(): Map<any, any>;
     /**
      * 获取指定区域内的所有元素
      */
-    getAreaElement(leftTopPoint: any, rightBottomPoint: any): any[];
+    getAreaElement(leftTopPoint: PointTuple, rightBottomPoint: PointTuple): any[];
     /**
      * 获取指定类型元素对应的Model
      */
@@ -158,7 +161,7 @@ declare class GraphModel {
      * @param lt 左上角点
      * @param rb 右下角点
      */
-    isElementInArea(element: any, lt: any, rb: any, wholeEdge?: boolean): boolean;
+    isElementInArea(element: any, lt: PointTuple, rb: PointTuple, wholeEdge?: boolean): boolean;
     /**
      * 使用新的数据重新设置整个画布的元素
      * 注意：将会清除画布上所有已有的节点和边
@@ -169,6 +172,10 @@ declare class GraphModel {
      * 获取画布数据
      */
     modelToGraphData(): GraphConfigData;
+    modelToHistoryData(): false | {
+        nodes: any[];
+        edges: any[];
+    };
     /**
      * 获取边的model
      */
@@ -267,10 +274,10 @@ declare class GraphModel {
      * @param x X轴目标位置
      * @param y Y轴目标位置
      */
-    moveNode2Coordinate(nodeId: BaseNodeModelId, x: number, y: number): void;
+    moveNode2Coordinate(nodeId: BaseNodeModelId, x: number, y: number, isignoreRule?: boolean): void;
     /**
-     * 显示节点文本编辑框
-     * @param nodeId 节点id
+     * 显示节点、连线文本编辑框
+     * @param elementId 节点id
      */
     editText(id: ElementModeId): void;
     /**
@@ -283,7 +290,7 @@ declare class GraphModel {
      */
     moveEdge(nodeId: BaseNodeModelId, deltaX: number, deltaY: number): void;
     /**
-     * 删除两节点直接的边
+     * 删除两节点之间的边
      * @param sourceNodeId 边的起始节点
      * @param targetNodeId 边的目的节点
      */
@@ -334,21 +341,24 @@ declare class GraphModel {
      * 将所有选中的元素设置为非选中
      */
     clearSelectElements(): void;
-    /**
-     * 批量移动元素
-     */
-    moveElements(elements: {
-        nodes: NodeConfig[];
-    }, deltaX: number, deltaY: number): void;
     /**
      * 批量移动节点，节点移动的时候，会动态计算所有节点与未移动节点的边位置
-     * 移动的节点直接的边会保持相对位置
+     * 移动的节点之间的边会保持相对位置
      */
-    moveNodes(nodeIds: any, deltaX: any, deltaY: any, isignoreRule?: boolean): void;
+    moveNodes(nodeIds: string[], deltaX: number, deltaY: number, isignoreRule?: boolean): void;
     /**
      * 添加节点移动限制规则，在节点移动的时候触发。
      * 如果方法返回false, 则会阻止节点移动。
      * @param fn function
+     * @example
+     *
+     * graphModel.addNodeMoveRules((nodeModel, x, y) => {
+     *   if (nodeModel.properties.disabled) {
+     *     return false
+     *   }
+     *   return true
+     * })
+     *
      */
     addNodeMoveRules(fn: NodeMoveRule): void;
     /**
@@ -366,7 +376,7 @@ declare class GraphModel {
     /**
      * 切换边的类型
      * @param id 边Id
-     * @param type 期望切换的类型
+     * @param type 边类型
      */
     changeEdgeType(id: any, type: any): void;
     /**

package/types/model/edge/BaseEdgeModel.d.ts

@@ -5,16 +5,11 @@ import { ModelType, ElementType } from '../../constant/constant';
 import { OutlineTheme } from '../../constant/DefaultTheme';
 declare class BaseEdgeModel implements IBaseModel {
     id: string;
-    readonly BaseType = ElementType.EDGE;
-    state: number;
-    modelType: ModelType;
-    additionStateData: AdditionData;
-    [propName: string]: any;
-    graphModel: GraphModel;
-    menu?: MenuConfig[];
-    sourceAnchorId: string;
-    targetAnchorId: string;
-    customTextPosition: boolean;
+    type: string;
+    sourceNodeId: string;
+    targetNodeId: string;
+    startPoint: any;
+    endPoint: any;
     text: {
         value: string;
         x: number;
@@ -22,87 +17,116 @@ declare class BaseEdgeModel implements IBaseModel {
         draggable: boolean;
         editable: boolean;
     };
-    type: string;
     properties: Record<string, any>;
-    sourceNodeId: string;
-    targetNodeId: string;
-    startPoint: any;
-    endPoint: any;
-    strokeWidth: number;
-    stroke: string;
-    hideOutline: boolean;
-    strokeOpacity: number;
-    zIndex: number;
+    points: string;
+    pointsList: any[];
     isSelected: boolean;
     isHovered: boolean;
     isHitable: boolean;
-    points: string;
-    pointsList: any[];
     draggable: boolean;
-    constructor(data: EdgeConfig, graphModel: GraphModel, type: any);
+    graphModel: GraphModel;
+    zIndex: number;
+    readonly BaseType = ElementType.EDGE;
+    modelType: ModelType;
+    state: number;
+    additionStateData: AdditionData;
+    sourceAnchorId: string;
+    targetAnchorId: string;
+    menu?: MenuConfig[];
+    customTextPosition: boolean;
+    [propName: string]: any;
+    constructor(data: EdgeConfig, graphModel: GraphModel);
+    /**
+     * @overridable 支持重写
+     * 初始化边数据
+     * initNodeData和setAttributes的区别在于
+     * initNodeData只在节点初始化的时候调用，用于初始化节点的所有属性。
+     * setAttributes除了初始化调用外，还会在properties发生变化了调用。
+     */
     initEdgeData(data: any): void;
-    createId(): any;
+    /**
+     * 设置model属性，每次properties发生变化会触发
+     * @overridable 支持重写
+     */
     setAttributes(): void;
-    getEdgeStyle(): {
-        [x: string]: any;
-        fill?: string;
-        stroke?: string;
-        strokeWidth?: number;
-    };
-    getTextStyle(): {
-        [x: string]: any;
-        overflowMode?: string;
-        textWidth?: number;
-        background?: {
-            wrapPadding?: string;
-        } & {
-            width?: number;
-            height?: number;
-            radius?: number;
-        } & import("../../constant/DefaultTheme").CommonTheme;
-        hover?: import("../../constant/DefaultTheme").EdgeTextTheme;
-        color?: string;
-        fontSize?: number;
-        fill?: string;
-        stroke?: string;
-        strokeWidth?: number;
-    };
+    /**
+     * @overridable 支持重写，自定义此类型节点默认生成方式
+     * @returns string
+     */
+    createId(): any;
+    /**
+     * @overridable 支持重写
+     * 获取当前节点样式
+     * @returns 自定义边样式
+     */
+    getEdgeStyle(): import("../../constant/DefaultTheme").CommonTheme;
+    /**
+     * @overridable 支持重写
+     * 获取当前节点文本样式
+     */
+    getTextStyle(): import("../../constant/DefaultTheme").EdgeTextTheme;
+    /**
+     * @overridable 支持重写
+     * 获取outline样式，重写可以定义此类型边outline样式， 默认使用主题样式
+     * @returns 自定义outline样式
+     */
+    getOutlineStyle(): OutlineTheme;
+    /**
+     * @overridable 支持重新，重新自定义文本位置
+     * @returns 文本位置
+     */
+    getTextPosition(): Point;
     get sourceNode(): import("..").BaseNodeModel;
     get targetNode(): import("..").BaseNodeModel;
     get textPosition(): Point;
     /**
-     * @override 重新自定义文本位置
-     * @returns 文本位置
+     * 内部方法，计算两个节点相连是起点位置
      */
-    getTextPosition(): Point;
-    move(): void;
     getBeginAnchor(sourceNode: any, targetNode: any): Point;
+    /**
+     * 内部方法，计算两个节点相连是终点位置
+     */
     getEndAnchor(targetNode: any): Point;
+    /**
+     * 获取当前边的properties
+     */
     getProperties(): Record<string, any>;
+    /**
+     * 获取被保存时返回的数据
+     */
     getData(): EdgeData;
     setProperty(key: any, val: any): void;
     setProperties(properties: any): void;
     /**
-     * @overridable 支持重写
-     * 获取outline样式，重写可以定义此类型节点outline样式， 默认使用主题样式
-     * @returns 自定义outline样式
+     * 内部方法，处理初始化文本格式
      */
-    getOutlineStyle(): OutlineTheme;
     formatText(data: any): void;
+    /**
+     * 重置文本位置
+     */
     resetTextPosition(): void;
+    /**
+     * 移动边上的文本
+     */
     moveText(deltaX: number, deltaY: number): void;
+    /**
+     * 设置文本位置和值
+     */
     setText(textConfig: any): void;
+    /**
+     * 更新文本的值
+     */
     updateText(value: string): void;
+    /**
+     * 内部方法，计算边的起点和终点
+     */
     setAnchors(): void;
     setSelected(flag?: boolean): void;
     setHovered(flag?: boolean): void;
     setHitable(flag?: boolean): void;
     setElementState(state: number, additionStateData?: AdditionData): void;
-    updateStroke(color: any): void;
-    updateStrokeWidth(width: any): void;
     updateStartPoint(anchor: any): void;
     updateEndPoint(anchor: any): void;
-    setStyleFromTheme(type: any, graphModel: any): void;
     setZIndex(zindex?: number): void;
     initPoints(): void;
     updateAttributes(attributes: any): void;

package/types/model/edge/BezierEdgeModel.d.ts

@@ -4,12 +4,10 @@ import { ModelType } from '../../constant/constant';
 export { BezierEdgeModel };
 export default class BezierEdgeModel extends BaseEdgeModel {
     modelType: ModelType;
-    offset: number;
     path: string;
-    constructor(data: any, graphModel: any);
+    initEdgeData(data: any): void;
     getEdgeStyle(): {
         [x: string]: any;
-        offset?: number;
         adjustLine?: import("../../constant/DefaultTheme").CommonTheme;
         adjustAnchor?: import("../../constant/DefaultTheme").CircleTheme;
         fill?: string;

package/types/model/edge/LineEdgeModel.d.ts

@@ -4,7 +4,6 @@ import { ModelType } from '../../constant/constant';
 export { LineEdgeModel };
 export default class LineEdgeModel extends BaseEdgeModel {
     modelType: ModelType;
-    constructor(data: any, graphModel: any);
     getEdgeStyle(): {
         [x: string]: any;
         fill?: string;

package/types/model/edge/PolylineEdgeModel.d.ts

@@ -1,17 +1,14 @@
 import { ModelType } from '../../constant/constant';
 import { Point } from '../../type';
 import BaseEdgeModel from './BaseEdgeModel';
-import GraphModel from '../GraphModel';
 export { PolylineEdgeModel };
 export default class PolylineEdgeModel extends BaseEdgeModel {
     modelType: ModelType;
-    offset: number;
     draginngPointList: any;
     dbClickPosition: Point;
-    constructor(data: any, graphModel: GraphModel);
+    initEdgeData(data: any): void;
     getEdgeStyle(): {
         [x: string]: any;
-        offset?: number;
         fill?: string;
         stroke?: string;
         strokeWidth?: number;

package/types/model/node/BaseNodeModel.d.ts

@@ -5,7 +5,7 @@ import GraphModel from '../GraphModel';
 import { IBaseModel } from '../BaseModel';
 export declare type ConnectRule = {
     message: string;
-    validate: (source: BaseNodeModel, target: BaseNodeModel, sourceAnchor: AnchorConfig, targetAnchor: AnchorConfig) => boolean;
+    validate: (source?: BaseNodeModel, target?: BaseNodeModel, sourceAnchor?: AnchorConfig, targetAnchor?: AnchorConfig) => boolean;
 };
 export declare type ConnectRuleResult = {
     isAllPass: boolean;
@@ -20,59 +20,52 @@ interface IBaseNodeModel extends IBaseModel {
 export { BaseNodeModel };
 export default class BaseNodeModel implements IBaseNodeModel {
     id: string;
-    readonly BaseType = ElementType.NODE;
-    modelType: ModelType;
-    additionStateData: AdditionData;
-    [propName: string]: any;
-    targetRules: ConnectRule[];
-    sourceRules: ConnectRule[];
-    moveRules: NodeMoveRule[];
-    hasSetTargetRules: boolean;
-    hasSetSourceRules: boolean;
-    properties: Record<string, any>;
     type: string;
     x: number;
     y: number;
+    text: {
+        value: string;
+        x: number;
+        y: number;
+        draggable: boolean;
+        editable: boolean;
+    };
+    properties: Record<string, any>;
     private _width;
-    graphModel: GraphModel;
     get width(): number;
     set width(value: number);
     private _height;
     get height(): number;
     set height(value: number);
+    anchorsOffset: AnchorsOffsetItem[];
     isSelected: boolean;
     isHovered: boolean;
+    isDragging: boolean;
     isHitable: boolean;
+    draggable: boolean;
+    graphModel: GraphModel;
     zIndex: number;
-    anchorsOffset: AnchorsOffsetItem[];
     state: number;
-    text: {
-        value: string;
-        x: number;
-        y: number;
-        draggable: boolean;
-        editable: boolean;
-    };
-    draggable: boolean;
+    readonly BaseType = ElementType.NODE;
+    modelType: ModelType;
+    additionStateData: AdditionData;
+    targetRules: ConnectRule[];
+    sourceRules: ConnectRule[];
+    moveRules: NodeMoveRule[];
+    hasSetTargetRules: boolean;
+    hasSetSourceRules: boolean;
+    [propName: string]: any;
     constructor(data: NodeConfig, graphModel: GraphModel);
     /**
-     * 初始化节点数据，不建议重写
-     * 可以重写setAttributes来实现修改初始化功能
+     * @overridable 可以重写
+     * 初始化节点数据
      * initNodeData和setAttributes的区别在于
-     * initNodeData需要
+     * initNodeData只在节点初始化的时候调用，用于初始化节点的所有属性。
+     * setAttributes除了初始化调用外，还会在properties发生变化了调用。
      */
-    protected initNodeData(data: any): void;
+    initNodeData(data: any): void;
     /**
-     * @overridable 支持重新
-     * @returns string
-     */
-    createId(): string;
-    /**
-     * 初始化文本属性，对
-     */
-    private formatText;
-    /**
-     * 设置model初始化属性
+     * 设置model属性，每次properties发生变化会触发
      * 例如设置节点的宽度
      * @example
      *
@@ -84,12 +77,23 @@ export default class BaseNodeModel implements IBaseNodeModel {
      * @overridable 支持重写
      */
     setAttributes(): void;
+    /**
+     * @overridable 支持重写，自定义此类型节点默认生成方式
+     * @returns string
+     */
+    createId(): string;
+    /**
+     * 初始化文本属性
+     */
+    private formatText;
     /**
      * 获取被保存时返回的数据
      * @overridable 支持重写
-     * @returns NodeData
      */
     getData(): NodeData;
+    /**
+     * 获取当前节点的properties
+     */
     getProperties(): Record<string, any>;
     /**
      * @overridable 支持重写
@@ -97,27 +101,23 @@ export default class BaseNodeModel implements IBaseNodeModel {
      * @returns 自定义节点样式
      */
     getNodeStyle(): ShapeStyleAttribute;
-    getTextStyle(): {
-        [x: string]: any;
-        overflowMode?: string;
-        background?: import("../../constant/DefaultTheme").RectTheme;
-        color?: string;
-        fontSize?: number;
-        fill?: string;
-        stroke?: string;
-        strokeWidth?: number;
-    };
     /**
-     * 获取节点锚点样式
+     * @overridable 支持重写
+     * 获取当前节点文本样式
+     */
+    getTextStyle(): import("../../constant/DefaultTheme").NodeTextTheme;
+    /**
+     * @overridable 支持重写
+     * 获取当前节点锚点样式
      * @returns 自定义样式
      */
     getAnchorStyle(): Record<string, any>;
-    getAnchorLineStyle(): {
-        [x: string]: any;
-        fill?: string;
-        stroke?: string;
-        strokeWidth?: number;
-    };
+    /**
+     * @overridable 支持重写
+     * 获取当前节点锚点拖出连线样式
+     * @returns 自定义锚点拖出样式
+     */
+    getAnchorLineStyle(): import("../../constant/DefaultTheme").CommonTheme;
     /**
      * @overridable 支持重写
      * 获取outline样式，重写可以定义此类型节点outline样式， 默认使用主题样式
@@ -125,6 +125,7 @@ export default class BaseNodeModel implements IBaseNodeModel {
      */
     getOutlineStyle(): OutlineTheme;
     /**
+     * @over
      * 在边的时候，是否允许这个节点为source节点，边到target节点。
      */
     isAllowConnectedAsSource(target: BaseNodeModel, soureAnchor: AnchorConfig, targetAnchor: AnchorConfig): ConnectRuleResult | Boolean;
@@ -133,13 +134,17 @@ export default class BaseNodeModel implements IBaseNodeModel {
      */
     getConnectedSourceRules(): ConnectRule[];
     /**
-     * 在边的时候，是否允许这个节点未target节点
+     * 在连线的时候，是否允许这个节点为target节点
      */
     isAllowConnectedAsTarget(source: BaseNodeModel, soureAnchor: AnchorConfig, targetAnchor: AnchorConfig): ConnectRuleResult | Boolean;
     /**
+     * 内部方法
      * 是否允许移动节点到新的位置
      */
     isAllowMoveNode(deltaX: any, deltaY: any): boolean;
+    /**
+     * 获取作为连线终点时的所有规则。
+     */
     getConnectedTargetRules(): ConnectRule[];
     /**
      * @overridable 子类重写此方法设置锚点
@@ -164,7 +169,6 @@ export default class BaseNodeModel implements IBaseNodeModel {
     setHovered(flag?: boolean): void;
     setHitable(flag?: boolean): void;
     setElementState(state: number, additionStateData?: AdditionData): void;
-    updateStroke(color: any): void;
     setProperty(key: any, val: any): void;
     setProperties(properties: any): void;
     setZIndex(zindex?: number): void;

package/types/options.d.ts

@@ -2,7 +2,7 @@ import { GridOptions } from './view/overlay/Grid';
 import { BackgroundConfig } from './view/overlay/BackgroundOverlay';
 import { NodeData, EdgeData, GraphConfigData } from './type';
 import { KeyboardDef } from './keyboard';
-import { EditConfigInterface } from './model/editConfigModel';
+import { EditConfigInterface } from './model/EditConfigModel';
 import { Theme } from './constant/DefaultTheme';
 export declare type EdgeType = 'line' | 'polyline' | 'bezier' | any;
 declare type DefaultOverlapMode = 0;
@@ -68,10 +68,6 @@ export declare type Definition = {
      * todo: 目前不完善，仅支持同步
      */
     guards?: GuardsTypes;
-    /**
-     * 是否不启用outline显示选中和hover效果
-     */
-    hideOutline?: boolean;
     /**
      * 表示节点在上，边在下，点击元素时选择元素显示在最顶部。
      * 表示安装元素创建顺序排序，点击元素也不会将其置顶。要置顶需要调用置顶API。
@@ -156,10 +152,6 @@ export declare function get(options: Definition): {
      * todo: 目前不完善，仅支持同步
      */
     guards?: GuardsTypes;
-    /**
-     * 是否不启用outline显示选中和hover效果
-     */
-    hideOutline?: boolean;
     /**
      * 表示节点在上，边在下，点击元素时选择元素显示在最顶部。
      * 表示安装元素创建顺序排序，点击元素也不会将其置顶。要置顶需要调用置顶API。

package/types/view/node/BaseNode.d.ts

@@ -7,8 +7,8 @@ declare type IProps = {
     graphModel: GraphModel;
 };
 declare type Istate = {
-    isDraging: boolean;
     isHovered: boolean;
+    isDraging?: boolean;
 };
 export default abstract class BaseNode extends Component<IProps, Istate> {
     static getModel(defaultModel: any): any;

package/types/view/node/HtmlNode.d.ts

@@ -3,6 +3,7 @@ import BaseNode from './BaseNode';
 export default class HtmlNode extends BaseNode {
     ref: HTMLElement;
     currrentProperties: string;
+    preProperties: string;
     setRef: (dom: any) => void;
     get rootEl(): HTMLElement;
     /**

package/types/view/text/BaseText.d.ts

@@ -2,11 +2,9 @@ import { h, Component } from 'preact';
 import GraphModel from '../../model/GraphModel';
 import { StepDrag } from '../../util/drag';
 import { IBaseModel } from '../../model/BaseModel';
-import { EdgeTextStyle } from '../../type';
 declare type IProps = {
     model: IBaseModel;
     graphModel: GraphModel;
-    style: EdgeTextStyle;
     draggable: boolean;
     editable: boolean;
 };