@logicflow/core - npm Package Compare versions

2

package.json

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

8

types/constant/constant.d.ts

		@@ -59,3 +59,2 @@ export declare enum ElementState {
		EDGE_EXCHANGE_NODE = "edge:exchange-node",
		SELECTION_CONTEXTMENU = "selection:contextmenu",
		BLANK_MOUSEDOWN = "blank:mousedown",
		@@ -69,2 +68,9 @@ BLANK_DRAGSTART = "blank:dragstart",
		BLANK_CONTEXTMENU = "blank:contextmenu",
		SELECTION_MOUSEDOWN = "selection:mousedown",
		SELECTION_DRAGSTART = "selection:dragstart",
		SELECTION_DRAG = "selection:drag",
		SELECTION_DROP = "selection:drop",
		SELECTION_MOUSEMOVE = "selection:mousemove",
		SELECTION_MOUSEUP = "selection:mouseup",
		SELECTION_CONTEXTMENU = "selection:contextmenu",
		CONNECTION_NOT_ALLOWED = "connection:not-allowed",
		@@ -71,0 +77,0 @@ HISTORY_CHANGE = "history:change",

442

types/constant/DefaultTheme.d.ts

		@@ -1,173 +0,273 @@
		export declare const defaultTheme: {
		rect: {
		width: number;
		height: number;
		radius: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		circle: {
		/**
		* 颜色
		* CSS属性用颜色
		* 如#000000，reg(0,0,0,0)
		* 如果是透明，可以传'none'
		*/
		export declare type Color = string;
		/**
		* svg虚线
		* 格式为逗号分割字符串，如
		* @see https://developer.mozilla.org/zh-CN/docs/Web/SVG/Attribute/stroke-dasharray
		*/
		export declare type DashArray = string;
		export declare type CommonTheme = {
		/**
		* 填充颜色
		*/
		fill?: Color;
		/**
		* 边框颜色
		*/
		stroke?: Color;
		/**
		* 边框宽度
		*/
		strokeWidth?: number;
		/**
		* 其他属性
		* 我们会把你定义的所有属性最终传递到DOM上
		* 详情请参考svg属性规范
		* https://developer.mozilla.org/zh-CN/docs/Web/SVG/Attribute
		*/
		[key: string]: any;
		};
		/**
		* rect主题样式
		* svg基础图形-矩形
		* https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element/rect
		*/
		export declare type RectTheme = {
		/**
		* 矩形的默认宽度
		*/
		width?: number;
		/**
		* 矩形的默认高度
		*/
		height?: number;
		/**
		* 圆角
		* 注意，矩形圆角请使用radius
		* 不要使用rx和ry
		*/
		radius?: number;
		} & CommonTheme;
		/**
		* circle主题样式
		* svg基础图形-圆形
		* https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element/circle
		*/
		export declare type CircleTheme = {
		/**
		* 默认半径
		*/
		r?: number;
		} & CommonTheme;
		/**
		* polygon主题样式
		* svg基础图形-多边形
		* https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element/polygon
		*/
		export declare type PolygonTheme = CommonTheme;
		/**
		* ellipse主题样式
		* svg基础图形-椭圆
		* https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element/ellipse
		*/
		export declare type EllipseTheme = CommonTheme;
		/**
		* 锚点样式
		* svg基础图形-圆
		*/
		export declare type AnchorTheme = {
		r?: number;
		hover?: {
		r: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		diamond: {
		rx: number;
		ry: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		ellipse: {
		rx: number;
		ry: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		polygon: {
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		anchor: {
		stroke: string;
		strokeWidth: number;
		r: number;
		fill: string;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		text: {
		color: string;
		fontSize: number;
		fontWeight: string;
		fontFamily: string;
		};
		nodeText: {
		autoWrap: boolean;
		lineHeight: number;
		wrapPadding: string;
		color: string;
		fontSize: number;
		fontWeight: string;
		fontFamily: string;
		};
		edgeText: {
		color: string;
		fontSize: number;
		fontWeight: string;
		fontFamily: string;
		background: {
		fill: string;
		height: number;
		stroke: string;
		radius: number;
		};
		hoverBackground: any;
		autoWrap: boolean;
		lineHeight: number;
		wrapPadding: string;
		};
		line: {
		stroke: string;
		strokeWidth: number;
		hoverStroke: string;
		selectedStroke: string;
		strokeDashArray: string;
		outlineColor: string;
		outlineStrokeDashArray: string;
		};
		polyline: {
		offset: number;
		stroke: string;
		strokeWidth: number;
		hoverStroke: string;
		selectedStroke: string;
		strokeDashArray: string;
		outlineColor: string;
		outlineStrokeDashArray: string;
		};
		bezier: {
		offset: number;
		adjustLineColor: string;
		adjustAnchorStroke: string;
		adjustAnchorFill: string;
		adjustAnchorFillOpacity: number;
		stroke: string;
		strokeWidth: number;
		hoverStroke: string;
		selectedStroke: string;
		strokeDashArray: string;
		outlineColor: string;
		outlineStrokeDashArray: string;
		};
		arrow: {
		offset: number;
		verticalLength: number;
		};
		anchorLine: {
		stroke: string;
		strokeWidth: number;
		strokeDasharray: string;
		};
		anchorHover: {
		fill: string;
		fillOpacity: number;
		stroke: string;
		strokeWidth: number;
		r: number;
		};
		snapline: {
		stroke: string;
		strokeWidth: number;
		};
		edgeAdjust: {
		r: number;
		fill: string;
		stroke: string;
		strokeWidth: string;
		};
		} & CommonTheme;
		} & CommonTheme;
		/**
		* 文本样式
		* svg文本
		* https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element/text
		*/
		export declare type TextTheme = {
		/**
		* 文本颜色
		*/
		color?: Color;
		/**
		* 文本大小
		*/
		fontSize?: number;
		} & CommonTheme;
		/**
		* 文本节点样式
		*/
		export declare type TextNodeTheme = {
		background?: RectTheme;
		} & TextTheme;
		/**
		* 节点上文本样式
		*/
		export declare type NodeTextTheme = {
		/**
		* 文本超出指定宽度处理方式
		* default: 不特殊处理，允许超出
		* autoWrap: 超出自动换行
		* ellipsis: 超出省略
		*/
		overflowMode?: string;
		background?: RectTheme;
		} & TextTheme;
		/**
		* 边上文本样式
		*/
		export declare type EdgeTextTheme = {
		/**
		* 文本超出指定宽度处理方式
		* default: 不特殊处理，允许超出
		* autoWrap: 超出自动换行
		* ellipsis: 超出省略
		*/
		overflowMode?: string;
		/**
		* 文本一行最大宽度
		*/
		textWidth?: number;
		/**
		* 文本背景样式
		*/
		background?: {
		wrapPadding?: string;
		} & RectTheme;
		/**
		* hover状态下文本样式
		*/
		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 EdgeBezierTheme = {
		/**
		* 贝塞尔曲线控制点与锚点的距离
		*/
		offset?: number;
		/**
		* 贝塞尔调整线主题
		*/
		adjustLine?: EdgeTheme;
		/**
		* 贝塞尔调整锚点主题
		*/
		adjustAnchor?: CircleTheme;
		} & EdgeTheme;
		/**
		* 箭头主题
		*/
		export declare type ArrowTheme = {
		/**
		* 箭头长度.
		* 以符号"->"为例, offset表示箭头大于号的宽度。
		*/
		offset?: number;
		/**
		* 箭头垂直于边的距离
		* 以符号"->"为例, verticalLength表示箭头大于号的高度
		*/
		verticalLength?: number;
		} & CommonTheme;
		export declare type OutlineTheme = {
		/**
		* hover状态下样式
		*/
		hover?: CommonTheme;
		} & CommonTheme;
		export declare type Theme = {
		/**
		* 所有节点的通用主题设置
		*/
		baseNode?: CommonTheme;
		/**
		* 基础图形-矩形样式
		*/
		rect?: RectTheme;
		/**
		* 基础图形-圆形样式
		*/
		circle?: CircleTheme;
		/**
		* 基础图形-菱形样式
		*/
		diamond?: PolygonTheme;
		/**
		* 基础图形-椭圆样式
		*/
		ellipse?: EllipseTheme;
		/**
		* 基础图形-多边形样式
		*/
		polygon?: PolygonTheme;
		/**
		* 所有边的通用主题设置
		*/
		baseEdge?: EdgeTheme;
		/**
		* 基础图形-直线样式
		*/
		line?: EdgeTheme;
		/**
		* 基础图形-折现样式
		*/
		polyline?: EdgePolylineTheme;
		/**
		* 基础图形-贝塞尔曲线样式
		*/
		bezier?: EdgeBezierTheme;
		/**
		* 锚点样式
		*/
		anchor?: AnchorTheme;
		/**
		* 文本节点样式
		*/
		text?: TextTheme;
		/**
		* 节点文本样式
		*/
		nodeText?: NodeTextTheme;
		/**
		* 边文本样式
		*/
		edgeText?: EdgeTextTheme;
		/**
		* 边上箭头的样式
		*/
		arrow?: ArrowTheme;
		/**
		* 从锚点拉出的边的样式
		*/
		anchorLine?: EdgeTheme;
		/**
		* 对齐线样式
		*/
		snapline?: EdgeTheme;
		/**
		* 当开启了跳转边的起点和终点(adjustEdgeStartAndEnd:true)后
		* 边的两端会出现调整按钮
		* 边连段的调整点样式
		*/
		edgeAdjust?: CircleTheme;
		/**
		* 节点选择状态下外侧的选框样式
		*/
		outline?: OutlineTheme;
		};
		export declare const defaultTheme: Theme;

6

types/keyboard/index.d.ts

		@@ -11,7 +11,3 @@ import { MousetrapInstance } from 'mousetrap';
		action?: Action;
		}> \| {
		keys: string \| string[];
		callback: Handler;
		action?: Action;
		};
		}>;
		}
		@@ -18,0 +14,0 @@ export interface Options {

470

types/LogicFlow.d.ts

		@@ -7,7 +7,8 @@ import GraphModel from './model/GraphModel';
		import Tool from './tool';
		import EventEmitter, { CallbackType } from './event/eventEmitter';
		import { CallbackType } from './event/eventEmitter';
		import Keyboard from './keyboard';
		import { EdgeConfig, EdgeFilter, NodeConfig, NodeAttribute, Extension, ComponentRender, FocusOnArgs, EdgeAttribute, EdgeData, GraphConfigData, RegisterElementFn, RegisterConfig, ZoomParam, PointTuple } from './type';
		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 = {
		@@ -18,6 +19,21 @@ nodes: _Model.BaseNodeModel[];
		export default class LogicFlow {
		/**
		* 只读：logicflow实例挂载的容器。
		*/
		container: HTMLElement;
		/**
		* 只读：画布宽度
		*/
		width: number;
		/**
		* 只读：画布高度
		*/
		height: number;
		/**
		* 只读：控制整个logicflow画布的model
		*/
		graphModel: GraphModel;
		/**
		* 只读：控制上一步、下一步相关
		*/
		history: History;
		@@ -29,82 +45,83 @@ viewMap: Map<any, any>;
		options: Options.Definition;
		getSnapshot: () => void;
		eventCenter: EventEmitter;
		snaplineModel: SnaplineModel;
		components: ComponentRender[];
		static extensions: Map<string, Extension>;
		components: ComponentRender[];
		adapterIn: (data: unknown) => GraphConfigData;
		adapterOut: (data: GraphConfigData) => unknown;
		[propName: string]: any;
		constructor(options: Options.Definition);
		on(evt: string, callback: CallbackType): void;
		off(evt: string, callback: CallbackType): void;
		once(evt: string, callback: CallbackType): void;
		emit(evt: string, arg: any): void;
		/**
		* 添加扩展, 待讨论，这里是不是静态方法好一些？
		* 重复添加插件的时候，把上一次添加的插件的销毁。
		* @param plugin 插件
		* 自定义数据格式转换方法
		* 当接入系统格式和logicflow格式不一直的时候，可以自定义此方法来转换数据格式
		* 详情请参考adapter
		* @see todo
		*/
		static use(extension: Extension): void;
		installPlugins(disabledPlugins?: any[]): void;
		__installPlugin(extension: any): void;
		register(type: string \| RegisterConfig, fn?: RegisterElementFn, isObserverView?: boolean): void;
		_registerElement(config: any): void;
		defaultRegister(): void;
		undo(): void;
		redo(): void;
		adapterIn: (data: unknown) => GraphConfigData;
		/**
		* 放大缩小图形
		* @param zoomSize 放大缩小的值，支持传入0-n之间的数字。小于1表示缩小，大于1表示放大。也支持传入true和false按照内置的刻度放大缩小
		* @param point 缩放的原点
		* @returns {string} -放大缩小的比例
		* 自定义数据格式转换方法
		* 把logicflow输入的格式转换也接入系统需要的格式
		* 详情请参考adapter
		* @see todo
		*/
		zoom(zoomSize?: ZoomParam, point?: PointTuple): string;
		adapterOut: (data: GraphConfigData) => unknown;
		/**
		* 还原图形
		* 支持插件在logicflow实例上增加自定义方法
		*/
		resetZoom(): void;
		[propName: string]: any;
		constructor(options: Options.Definition);
		/**
		* 设置图形缩小时，能缩放到的最小倍数。参数为0-1自己。默认0.2
		* @param size 图形缩小的最小值
		* 注册自定义节点和边
		* 支持两种方式
		* 方式一（推荐）
		* 详情见 todo: docs link
		* @example
		* import { RectNode, RectModel } from '@logicflow/core'
		* class CustomView extends RectNode {
		* }
		* class CustomModel extends RectModel {
		* }
		* lf.register({
		* type: 'custom',
		* view: CustomView,
		* model: CustomModel
		* })
		* 方式二
		* 不推荐，极个别在自定义的时候需要用到lf的情况下可以用这种方式。
		* 大多数情况下，我们可以直接在view中从this.props中获取graphModel
		* 或者model中直接this.graphModel获取model的方法。
		* @example
		* lf.register('custom', ({ RectNode, RectModel }) => {
		* class CustomView extends RectNode {}
		* class CustomModel extends RectModel {}
		* return {
		* view: CustomView,
		* model: CustomModel
		* }
		* })
		*/
		setZoomMiniSize(size: number): void;
		register(type: string \| RegisterConfig, fn?: RegisterElementFn, isObserverView?: boolean): void;
		private registerElement;
		private defaultRegister;
		/**
		* 设置图形放大时，能放大到的最大倍数，默认16
		* @param size 图形放大的最大值
		* 将图形选中
		* @param id 选择元素ID
		* @param multiple 是否允许多选，如果为true，不会将上一个选中的元素重置
		*/
		setZoomMaxSize(size: number): void;
		selectElementById(id: string, multiple?: boolean): void;
		/**
		* 获取缩放的值和平移的值。
		* 定位到画布视口中心
		* 支持用户传入图形当前的坐标或id，可以通过type来区分是节点还是边的id，也可以不传（兜底）
		* @param focusOnArgs.id 如果传入的是id, 则画布视口中心移动到此id的元素中心点。
		* @param focusOnArgs.coordinate 如果传入的是坐标，则画布视口中心移动到此坐标。
		*/
		getTransform(): {
		SCALE_X: number;
		SCALE_Y: number;
		TRANSLATE_X: number;
		TRANSLATE_Y: number;
		};
		focusOn(focusOnArgs: FocusOnArgs): void;
		/**
		* 平移图形
		* @param x 向x轴移动距离
		* @param y 向y轴移动距离
		* 设置主题样式
		* @param { object } style 自定义主题样式
		* todo docs link
		*/
		translate(x: number, y: number): void;
		setTheme(style: Theme): void;
		/**
		* 还原图形为初始位置
		* 重新设置画布的宽高
		*/
		resetTranslate(): void;
		resize(width: number, height: number): void;
		/**
		* 将图形选中
		* @param id 选择元素ID
		* @param multiple 是否允许多选，如果为true，不会将上一个选中的元素重置
		*/
		select(id: string, multiple?: boolean): void;
		/**
		* 将图形定位到画布中心
		* @param focusOnArgs 支持用户传入图形当前的坐标或id，可以通过type来区分是节点还是连线的id，也可以不传（兜底）
		*/
		focusOn(focusOnArgs: FocusOnArgs): void;
		setTheme(style: any): void;
		/**
		* 设置默认的连线类型
		* 设置默认的边类型。
		* 也就是设置在节点直接有用户手动绘制的连线类型。
		* @param type Options.EdgeType
		@@ -114,4 +131,4 @@ */
		/**
		* 更新节点或连线文案
		* @param id 节点或者连线id
		* 更新节点或边的文案
		* @param id 节点或者边id
		* @param value 文案内容
		@@ -121,3 +138,3 @@ */
		/**
		* 删除元素，在不确定当前id是节点还是连线时使用
		* 删除元素，在不确定当前id是节点还是边时使用
		* @param id 元素id
		@@ -133,3 +150,3 @@ */
		/**
		* 获取节点所有连线的model
		* 获取节点连接的所有边的model
		* @param nodeId 节点ID
		@@ -150,7 +167,2 @@ * @returns model数组
		/**
		* 显示节点文本编辑框
		* @param nodeId 节点id
		*/
		editNodeText(nodeId: string): void;
		/**
		* 克隆节点
		@@ -160,4 +172,31 @@ * @param nodeId 节点Id
		cloneNode(nodeId: string): _Model.BaseNodeModel;
		createEdge(edgeConfig: EdgeConfig): void;
		/**
		* 修改节点的id，如果不传新的id，会内部自动创建一个。
		* @param { string } oldId 将要被修改的id
		* @param { string } newId 可选，修改后的id
		* @returns 修改后的节点id, 如果传入的oldId不存在，返回空字符串
		*/
		changeNodeId<T extends string>(oldId: string, newId?: T): T \| string;
		/**
		* 获取节点对象
		* @param nodeId 节点Id
		*/
		getNodeModelById(nodeId: string): _Model.BaseNodeModel;
		/**
		* 获取节点数据
		* @param nodeId 节点
		*/
		getNodeDataById(nodeId: string): NodeConfig;
		/**
		* 给两个节点之间添加一条边
		* @example
		* lf.addEdge({
		* type: 'polygon'
		* sourceNodeId: 'node_id_1',
		* targetNodeId: 'node_id_2',
		* })
		* @param {object} edgeConfig
		*/
		addEdge(edgeConfig: EdgeConfig): void;
		/**
		* 删除边
		@@ -168,50 +207,57 @@ * @param {string} edgeId 边Id
		/**
		* 删除指定类型的边
		* todo: API一致
		* 删除指定类型的边, 基于边起点和终点，可以只传其一。
		* @param config.sourceNodeId 边的起点节点ID
		* @param config.targetNodeId 边的终点节点ID
		*/
		removeEdge(config: {
		sourceNodeId: string;
		targetNodeId: string;
		deleteEdgeByNodeId(config: {
		sourceNodeId?: string;
		targetNodeId?: string;
		}): void;
		/**
		* 获取节点对象
		* @param nodeId 节点Id
		* 修改边的id，如果不传新的id，会内部自动创建一个。
		* @param { string } oldId 将要被修改的id
		* @param { string } newId 可选，修改后的id
		* @returns 修改后的节点id, 如果传入的oldId不存在，返回空字符串
		*/
		getNodeModel(nodeId: string): _Model.BaseNodeModel;
		getNodeData(nodeId: string): NodeAttribute;
		changeEdgeId<T extends string>(oldId: string, newId?: T): T \| string;
		/**
		* 设置节点数据
		* @deprecated 不建议直接设置节点数据，更新文本请用updateText, 修改数据请用setProperties
		*/
		setNodeData(nodeAttribute: NodeAttribute): void;
		getEdgeModel(config: EdgeFilter): _Model.BaseEdgeModel[];
		/**
		* 获取边的model
		* 基于边Id获取边的model
		* @param edgeId 边的Id
		* @return model
		*/
		getEdgeModelById(edgeId: string): _Model.BaseEdgeModel;
		/**
		* 获取边Model
		* @deprecated 不建议使用getEdge, 建议使用getEdgeModel
		* 获取满足条件边的model
		* @param edgeFilter 过滤条件
		* @example
		* 获取所有起点为节点A的边的model
		* lf.getEdgeModels({
		* sourceNodeId: 'nodeA_id'
		* })
		* 获取所有终点为节点B的边的model
		* lf.getEdgeModels({
		* targetNodeId: 'nodeB_id'
		* })
		* 获取起点为节点A，终点为节点B的边
		* lf.getEdgeModels({
		* sourceNodeId: 'nodeA_id',
		* targetNodeId: 'nodeB_id'
		* })
		* @return model数组
		*/
		getEdge(config: EdgeFilter): _Model.BaseEdgeModel[];
		getEdgeData(edgeId: string): EdgeData;
		getEdgeModels(edgeFilter: EdgeFilter): _Model.BaseEdgeModel[];
		/**
		* 设置边数据
		* @deprecated 不建议直接设置边数据，更新文本请用updateText, 修改数据请用setProperties
		* 基于id获取边数据
		* @param edgeId 边Id
		* @returns EdgeData
		*/
		setEdgeData(edgeAttribute: EdgeAttribute): void;
		getEdgeDataById(edgeId: string): EdgeData;
		/**
		* 获取流程绘图数据
		* 显示节点、连线文本编辑框
		* @param id 元素id
		*/
		getGraphData(): GraphConfigData \| any;
		editText(id: string): void;
		/**
		* 获取流程绘图原始数据
		* 在存在adapter时，可以使用getGraphRawData获取图原始数据
		*/
		getGraphRawData(): GraphConfigData;
		/**
		* 设置元素的自定义属性
		* @see todo docs link
		* @param id 元素的id
		@@ -228,21 +274,63 @@ * @param properties 自定义属性
		/**
		* 修改节点的id，如果不传新的id，会内部自动创建一个。
		* @param { string } oldId 将要被修改的id
		* @param { string } newId 可选，修改后的id
		* @returns 修改后的节点id
		* 将某个元素放置到顶部。
		* 如果堆叠模式为默认模式，则将原置顶元素重新恢复原有层级。
		* 如果堆叠模式为递增模式，则将需指定元素zIndex设置为当前最大zIndex + 1。
		* @see todo link 堆叠模式
		* @param id 元素Id
		*/
		changeNodeId<T extends string>(oldId: string, newId?: T): false \| T \| string;
		toFront(id: any): void;
		/**
		* 修改连线的id，如果不传新的id，会内部自动创建一个。
		* @param { string } oldId 将要被修改的id
		* @param { string } newId 可选，修改后的id
		* @returns 修改后的节点id
		* 设置元素的zIndex.
		* 注意：默认堆叠模式下，不建议使用此方法。
		* @see todo link 堆叠模式
		* @param id 元素id
		* @param zIndex zIndex的值，可以传数字，也支持传入'top' 和 'bottom'
		*/
		changeEdgeId<T extends string>(oldId: string, newId?: T): false \| T \| string;
		setElementZIndex(id: string, zIndex: number \| 'top' \| 'bottom'): void;
		/**
		* 添加多个元素, 包括边和节点。
		*/
		addElements({ nodes, edges }: GraphConfigData): GraphConfigModel;
		/**
		* 获取指定区域内的所有元素，此区域必须是DOM层。
		* 例如鼠标绘制选区后，获取选区内的所有元素。
		* @see todo 分层
		* @param leftTopPoint 区域左上角坐标, dom层坐标
		* @param rightBottomPoint 区域右下角坐标，dom层坐标
		*/
		getAreaElement(leftTopPoint: PointTuple, rightBottomPoint: PointTuple): any[];
		/**
		* 获取选中的元素数据
		* @param isIgnoreCheck 是否包括sourceNode和targetNode没有被选中的边,默认包括。
		* 注意：复制的时候不能包括此类边, 因为复制的时候不允许悬空的边。
		*/
		getSelectElements(isIgnoreCheck?: boolean): GraphConfigData;
		/**
		* 将所有选中的元素设置为非选中
		*/
		clearSelectElements(): void;
		/**
		* 获取流程绘图数据
		* 注意: getGraphData返回的数据受到adapter影响，所以其数据格式不一定是logicflow内部图数据格式。
		* 如果实现通用插件，请使用getGraphRawData
		*/
		getGraphData(): GraphConfigData \| any;
		/**
		* 获取流程绘图原始数据
		* 在存在adapter时，可以使用getGraphRawData获取图原始数据
		*/
		getGraphRawData(): GraphConfigData;
		/**
		* 清空画布
		*/
		clearData(): void;
		/**
		* 更新流程图编辑相关设置
		* @param {object} config 编辑配置
		* @see todo docs link
		*/
		updateEditConfig(config: EditConfigInterface): void;
		/**
		* 获取流程图编辑相关设置
		* 获取流程图当前编辑相关设置
		* @see todo docs link
		*/
		@@ -252,2 +340,4 @@ getEditConfig(): Partial<_Model.EditConfigModel>;
		* 获取事件位置相对于画布左上角的坐标
		* 画布所在的位置可以是页面任何地方，原生事件返回的坐标是相对于页面左上角的，该方法可以提供以画布左上角为原点的准确位置。
		* @see todo link
		* @param {number} x 事件x坐标
		@@ -270,9 +360,90 @@ * @param {number} y 事件y坐标
		/**
		* 获取选中的元素数据
		* @param isIgnoreCheck 是否包括sourceNode和targetNode没有被选中的连线,默认包括。
		* 复制的时候不能包括此类连线, 因为复制的时候不允许悬空的连线。
		* 历史记录操作
		* 返回上一步
		*/
		getSelectElements(isIgnoreCheck?: boolean): GraphConfigData;
		undo(): void;
		/**
		* 动态修改 id 对应元素 model 中的属性
		* 历史记录操作
		* 恢复下一步
		*/
		redo(): void;
		/**
		* 放大缩小图形
		* @param zoomSize 放大缩小的值，支持传入0-n之间的数字。小于1表示缩小，大于1表示放大。也支持传入true和false按照内置的刻度放大缩小
		* @param point 缩放的原点
		* @returns {string} -放大缩小的比例
		*/
		zoom(zoomSize?: ZoomParam, point?: PointTuple): string;
		/**
		* 重置图形的放大缩写比例为默认
		*/
		resetZoom(): void;
		/**
		* 设置图形缩小时，能缩放到的最小倍数。参数为0-1自己。默认0.2
		* @param size 图形缩小的最小值
		*/
		setZoomMiniSize(size: number): void;
		/**
		* 设置图形放大时，能放大到的最大倍数，默认16
		* @param size 图形放大的最大值
		*/
		setZoomMaxSize(size: number): void;
		/**
		* 获取缩放的值和平移的值。
		*/
		getTransform(): {
		SCALE_X: number;
		SCALE_Y: number;
		TRANSLATE_X: number;
		TRANSLATE_Y: number;
		};
		/**
		* 平移图
		* @param x 向x轴移动距离
		* @param y 向y轴移动距离
		*/
		translate(x: number, y: number): void;
		/**
		* 还原图形为初始位置
		*/
		resetTranslate(): void;
		/**
		* 监听事件
		* 事件详情见 @see todo
		* 支持同时监听多个事件
		* @example
		* lf.on('node:click,node:contextmenu', (data) => {
		* });
		*/
		on(evt: string, callback: CallbackType): void;
		/**
		* 撤销监听事件
		*/
		off(evt: string, callback: CallbackType): void;
		/**
		* 监听事件，只监听一次
		*/
		once(evt: string, callback: CallbackType): void;
		/**
		* 触发监听事件
		*/
		emit(evt: string, arg: any): void;
		/**
		* 添加扩展, 待讨论，这里是不是静态方法好一些？
		* 重复添加插件的时候，把上一次添加的插件的销毁。
		* @param plugin 插件
		*/
		static use(extension: Extension): void;
		private installPlugins;
		/**
		* 加载插件
		* 注意，不建议插件用这种方式加载，此方式只会出发render方法，
		* 可能不会实时出发cont
		*/
		private installPlugin;
		/**
		* 修改对应元素 model 中的属性
		* 注意：此方法慎用，除非您对logicflow内部有足够的了解。
		* 大多数情况下，请使用setProperties、updateText、changeNodeId等方法。
		* 例如直接使用此方法修改节点的id,那么就是会导致连接到此节点的边的sourceNodeId出现找不到的情况。
		* @param {string} id 元素id
		@@ -283,28 +454,61 @@ * @param {object} attributes 需要更新的属性
		/**
		* 清空画布
		* 内部保留方法
		* 创建一个fakerNode，用于dnd插件拖动节点进画布的时候使用。
		*/
		clearData(): void;
		createFakerNode(nodeConfig: any): any;
		/**
		* 设置元素的层级高度，在元素重叠的时候大的在前面
		* 内部保留方法
		* 移除fakerNode
		*/
		setElementZIndex(id: any, zIndex: number \| 'top' \| 'bottom'): void;
		removeFakerNode(): void;
		/**
		* 添加多个元素, 包括连线和节点。
		* 内部保留方法
		* 用于fakerNode显示对齐线
		*/
		addElements({ nodes, edges }: GraphConfigData): GraphConfigModel;
		clearSelectElements(): void;
		createFakerNode(nodeConfig: any): any;
		removeFakerNode(): void;
		setNodeSnapLine(data: any): void;
		/**
		* 获取指定区域坐标，此区域必须是DOM层，也就是可视区域。
		* @param leftTopPoint 区域左上角坐标, dom层坐标
		* @param rightBottomPoint 区域右下角坐标，dom层坐标
		* 内部保留方法
		* 用于fakerNode移除对齐线
		*/
		getAreaElement(leftTopPoint: PointTuple, rightBottomPoint: PointTuple): any[];
		removeNodeSnapLine(): void;
		/**
		* 内部保留方法
		* 用于fakerNode移除对齐线
		*/
		setView(type: string, component: any): void;
		/**
		* 内部保留方法
		* 获取指定类型的view
		*/
		getView: (type: string) => any;
		/**
		* 渲染图
		* @example
		* lf.render({
		* nodes: [
		* {
		* id: 'node_1',
		* type: 'rect',
		* x: 100,
		* y: 100
		* },
		* {
		* id: 'node_2',
		* type: 'circel',
		* x: 300,
		* y: 200
		* }
		* ],
		* edges: [
		* {
		* sourceNodeId: 'node_1',
		* targetNodeId: 'node_2',
		* type: 'polyline'
		* }
		* ]
		* })
		* @param graphData 图数据
		*/
		render(graphData?: {}): void;
		}
		export {};

59

types/model/BaseModel.d.ts

		import { ElementState } from '../constant/constant';
		import { TextConfig, AdditionData } from '../type';
		interface IBaseModel {
		/**
		* 节点或者边的id.
		* 默认情况下，使用uuidv4生成。
		* 如果想要自定义，可以重写createId生成。
		*/
		id: string;
		/**
		* 不可自定义
		* model对应的图形外观类型（eg: 圆形、矩形、多边形等）
		* 用于logicflow内部计算使用。
		*/
		modelType: string;
		/**
		* 请勿直接修改属性，如果想要将一个节点类型修改为另一个类型。请使用
		* `lf.graphModel.changeEdgeType`和`lf.graphModel.changeNodeType`
		*
		* 流程图元素类型，自定义元素时对应的标识。
		* 在logicflow/core中对应着rect、circle、polyline这种。
		* 在实际项目中，我们会基于业务类型进行自定义type.
		* 例如BPMN应用场景，我们会定义开始节点的类型为bpmn:start-event
		*
		* 和modelType的区别是，type更多的是业务上的类型，而modelType则是外观上的类型。
		* 例如bpmnjs的开始节点和结束节点type分别为'bpmn:start-event'和'bpmn:end-event'。
		* 但是他们的modelType都是circle-node, 因为他们外观都是基于圆形自定义而来。
		*/
		type: string;
		/**
		* 元素状态
		* 不同的状态对应着元素显示效果。
		* 请勿直接修改。
		* logicflow内部将元素状态分为5种：
		* DEFAULT = 1 默认显示
		* TEXT_EDIT = 2 此元素正在进行文本编辑
		* SHOW_MENU = 3, 显示菜单，废弃请使用菜单插件
		* ALLOW_CONNECT = 4, 此元素允许作为当前边的目标节点
		* NOT_ALLOW_CONNECT = 5, 此元素不允许作为当前边的目标节点
		*/
		state: ElementState;
		additionStateData: AdditionData;
		/**
		* 元素上的文本
		* logicflow中存在两种文本
		* 一种是脱离边和节点单独存在的文本
		* 一种是必须和边、节点关联的文本。
		* 此属性控制的是第二种。
		* 节点和边删除、调整的时候，其关联的文本也会对应删除、调整。
		*/
		text: TextConfig;
		/**
		* 元素是否被选中
		*/
		isSelected: boolean;
		/**
		* 元素堆叠是层级，默认情况下节点zIndex值为1，边zIndex为0。
		* todo：写完善
		*/
		zIndex: number;
		/**
		* 创建节点ID
		* 默认情况下，logicflow内部使用uuidv4生成id。
		* 在自定义节点的时候，可以重写此方法基于自己的规则生成id。
		* 注意，此方法必须是同步的。
		* 如果想要异步修改Id，建议删除此节点后再同一位置创建一个新的节点。
		* @overridable 可以重写
		* @returns string
		*/
		createId(): string;
		move(deltaX: number, deltaY: number): void;
		@@ -13,0 +72,0 @@ moveText(deltaX: number, deltaY: number): void;

48

types/model/edge/BaseEdgeModel.d.ts

		import { IBaseModel } from '../BaseModel';
		import GraphModel from '../GraphModel';
		import { Point, AdditionData, EdgeAttribute, EdgeData, MenuConfig, EdgeConfig } from '../../type/index';
		import { ElementState, ModelType, ElementType } from '../../constant/constant';
		import { Point, AdditionData, EdgeData, MenuConfig, EdgeConfig } from '../../type/index';
		import { ModelType, ElementType } from '../../constant/constant';
		import { OutlineTheme } from '../../constant/DefaultTheme';
		declare class BaseEdgeModel implements IBaseModel {
		@@ -25,3 +26,3 @@ id: string;
		type: string;
		properties: {};
		properties: Record<string, any>;
		sourceNodeId: string;
		@@ -33,6 +34,3 @@ targetNodeId: string;
		stroke: string;
		strokeDashArray: string;
		outlineColor: string;
		hideOutline: boolean;
		outlineStrokeDashArray: string;
		strokeOpacity: number;
		@@ -42,6 +40,3 @@ zIndex: number;
		isHovered: boolean;
		isDragging: boolean;
		isHitable: boolean;
		hoverStroke: string;
		selectedStroke: string;
		points: string;
		@@ -54,2 +49,26 @@ pointsList: any[];
		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;
		};
		get sourceNode(): import("..").BaseNodeModel;
		@@ -66,7 +85,12 @@ get targetNode(): import("..").BaseNodeModel;
		getEndAnchor(targetNode: any): Point;
		getProperties(): {};
		getProperties(): Record<string, any>;
		getData(): EdgeData;
		setProperty(key: any, val: any): void;
		setProperties(properties: any): void;
		updateData(edgeAttribute: EdgeAttribute): void;
		/**
		* @overridable 支持重写
		* 获取outline样式，重写可以定义此类型节点outline样式，默认使用主题样式
		* @returns 自定义outline样式
		*/
		getOutlineStyle(): OutlineTheme;
		formatText(data: any): void;
		@@ -81,3 +105,3 @@ resetTextPosition(): void;
		setHitable(flag?: boolean): void;
		setElementState(state: ElementState, additionStateData?: AdditionData): void;
		setElementState(state: number, additionStateData?: AdditionData): void;
		updateStroke(color: any): void;
		@@ -84,0 +108,0 @@ updateStrokeWidth(width: any): void;

9

types/model/edge/BezierEdgeModel.d.ts

		@@ -10,2 +10,11 @@ import BaseEdgeModel from './BaseEdgeModel';
		constructor(data: any, graphModel: any);
		getEdgeStyle(): {
		[x: string]: any;
		offset?: number;
		adjustLine?: import("../../constant/DefaultTheme").CommonTheme;
		adjustAnchor?: import("../../constant/DefaultTheme").CircleTheme;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		getTextPosition(): Point;
		@@ -12,0 +21,0 @@ getData(): {

6

types/model/edge/LineEdgeModel.d.ts

		@@ -8,3 +8,9 @@ import BaseEdgeModel from './BaseEdgeModel';
		constructor(data: any, graphModel: any);
		getEdgeStyle(): {
		[x: string]: any;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		getTextPosition(): Point;
		}

7

types/model/edge/PolylineEdgeModel.d.ts

		@@ -12,2 +12,9 @@ import { ModelType } from '../../constant/constant';
		constructor(data: any, graphModel: GraphModel);
		getEdgeStyle(): {
		[x: string]: any;
		offset?: number;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		getTextPosition(): {
		@@ -14,0 +21,0 @@ x: number;

22

types/model/EditConfigModel.d.ts

		@@ -19,7 +19,7 @@ export interface EditConfigInterface {
		/**
		* 允许调整连线
		* 允许调整边
		*/
		adjustEdge?: boolean;
		/**
		* 允许调整连线起点和终点
		* 允许调整边起点和终点
		*/
		@@ -44,3 +44,3 @@ adjustEdgeStartAndEnd?: boolean;
		/**
		* 连线被选中时是否显示outline
		* 边被选中时是否显示outline
		*/
		@@ -53,3 +53,3 @@ edgeSelectedOutline?: boolean;
		/**
		* 允许连线文本可以编辑
		* 允许边文本可以编辑
		*/
		@@ -66,18 +66,10 @@ edgeTextEdit?: boolean;
		/**
		* 允许连线文本可以拖拽
		* 允许边文本可以拖拽
		*/
		edgeTextDraggable?: boolean;
		/**
		* 允许meta多选元素
		*/
		metaKeyMultipleSelected?: boolean;
		/**
		* 多选按键, 支持meta(cmd)、shift、alt
		* 不支持ctrl，ctrl会出发contextmenu
		* 不支持ctrl，ctrl会触发contextmenu
		*/
		multipleSelectKey?: string;
		/**
		* 外部传入的额外配置, 待优化，这里不够易用。
		*/
		extraConf?: Record<string, string \| number \| object \| boolean>;
		}
		@@ -103,5 +95,3 @@ /**
		edgeTextDraggable: boolean;
		metaKeyMultipleSelected: boolean;
		multipleSelectKey: string;
		extraConf: {};
		defaultConfig: {};
		@@ -108,0 +98,0 @@ constructor(config: EditConfigInterface);

322

types/model/GraphModel.d.ts

		@@ -6,38 +6,102 @@ import BaseNodeModel from './node/BaseNodeModel';
		import { IBaseModel } from './BaseModel';
		import { ElementState, ModelType, ElementType } from '../constant/constant';
		import { AdditionData, Point, NodeConfig, EdgeConfig, Style, NodeMoveRule } from '../type';
		import { OverlapMode } from '../constant/constant';
		import { AdditionData, Point, NodeConfig, EdgeConfig, NodeMoveRule, GraphConfigData } from '../type';
		import EventEmitter from '../event/eventEmitter';
		import { Theme } from '../constant/DefaultTheme';
		import { Definition } from '../options';
		declare type BaseNodeModelId = string;
		declare type ElementModeId = string;
		declare class GraphModel {
		readonly BaseType = ElementType.GRAPH;
		modelType: ModelType;
		/**
		* LogicFlow画布挂载元素
		* 也就是初始化LogicFlow实例时传入的container
		*/
		rootEl: HTMLElement;
		theme: any;
		/**
		* LogicFlow画布宽度
		*/
		width: number;
		/**
		* LogicFlow画布高度
		*/
		height: number;
		/**
		* 主题配置
		* @see todo docs link
		*/
		theme: Theme;
		/**
		* 事件中心
		* @see todo docs link
		*/
		eventCenter: EventEmitter;
		/**
		* 维护所有节点和边类型对应的model
		*/
		modelMap: Map<any, any>;
		width: number;
		height: number;
		/**
		* 位于当前画布顶部的元素。
		* 此元素只在堆叠模式为默认模式下存在。
		* 用于在默认模式下将之前的顶部元素恢复初始高度。
		*/
		topElement: BaseNodeModel \| BaseEdgeModel;
		selectElement: BaseNodeModel \| BaseEdgeModel;
		idGenerator: (type?: string) => number \| string;
		/**
		* 自定义全局id生成器
		* @see todo docs link
		*/
		idGenerator: (type?: string) => string;
		/**
		* 节点移动规则判断
		* 在节点移动的时候，会出发此数组中的所有规则判断
		*/
		nodeMoveRules: NodeMoveRule[];
		/**
		* 在图上操作创建边时，默认使用的边类型.
		*/
		edgeType: string;
		/**
		* 当前图上所有节点的model
		*/
		nodes: BaseNodeModel[];
		activeElement: IBaseModel;
		activeElementState: ElementState;
		state: ElementState;
		additionStateData: AdditionData;
		/**
		* 当前图上所有边的model
		*/
		edges: BaseEdgeModel[];
		isSlient: boolean;
		overlapMode: number;
		plugins: any[];
		tools: any[];
		/**
		* 元素重合时堆叠模式
		* 默认模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。
		* 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会保持层级。
		* @see todo link
		*/
		overlapMode: OverlapMode;
		/**
		* 背景配置
		* @see todo link
		*/
		background: any;
		transformMatrix: TransfromModel;
		editConfig: EditConfigModel;
		/**
		* 控制画布的缩放、平移
		* @see todo link
		*/
		transformModel: TransfromModel;
		/**
		* 控制流程图编辑相关配置
		* @see todo link
		*/
		editConfigModel: EditConfigModel;
		/**
		* 网格大小
		* @see todo link
		*/
		gridSize: number;
		/**
		* 局部渲染
		* @see todo logicflow性能
		*/
		partial: boolean;
		/**
		* 外部拖动节点进入画布的过程中，用fakerNode来和画布上正是的节点区分开
		*/
		fakerNode: BaseNodeModel;
		constructor(config: any);
		constructor(options: Definition);
		get nodesMap(): {
		@@ -55,5 +119,9 @@ [key: string]: {
		};
		/**
		* 基于zIndex对元素进行排序。
		* todo: 性能优化
		*/
		get sortElements(): any[];
		/**
		* 当前编辑的元素，低频操作，先循环找吧。
		* 当前编辑的元素，低频操作，先循环找。
		*/
		@@ -66,5 +134,11 @@ get textEditElement(): BaseNodeModel \| BaseEdgeModel;
		getAreaElement(leftTopPoint: any, rightBottomPoint: any): any[];
		/**
		* 获取指定类型元素对应的Model
		*/
		getModel(type: string): any;
		getNodeModel(nodeId: BaseNodeModelId): BaseNodeModel;
		/**
		* 基于Id获取节点的model
		*/
		getNodeModelById(nodeId: BaseNodeModelId): BaseNodeModel;
		/**
		* 因为流程图所在的位置可以是页面任何地方
		@@ -86,3 +160,3 @@ * 当内部事件需要获取触发事件时，其相对于画布左上角的位置
		* 判断一个元素是否在指定矩形区域内。
		* @param element 节点或者连线
		* @param element 节点或者边
		* @param lt 左上角点
		@@ -92,36 +166,90 @@ * @param rb 右下角点
		isElementInArea(element: any, lt: any, rb: any, wholeEdge?: boolean): boolean;
		graphDataToModel(graphData: any): void;
		modelToGraphData(): {
		nodes: import("../type").NodeData[];
		edges: import("../type").EdgeData[];
		};
		modelToHistoryData(): false \| {
		nodes: any[];
		edges: any[];
		};
		getEdgeModel(edgeId: string): BaseEdgeModel;
		/**
		* 使用新的数据重新设置整个画布的元素
		* 注意：将会清除画布上所有已有的节点和边
		* @param { object } graphData 图数据
		*/
		graphDataToModel(graphData: GraphConfigData): void;
		/**
		* 获取画布数据
		*/
		modelToGraphData(): GraphConfigData;
		/**
		* 获取边的model
		*/
		getEdgeModelById(edgeId: string): BaseEdgeModel \| undefined;
		/**
		* 获取节点或者边的model
		*/
		getElement(id: string): IBaseModel \| undefined;
		/**
		* 所有节点上所有边的model
		*/
		getNodeEdges(nodeId: any): BaseEdgeModel[];
		/**
		* 获取选中的元素数据
		* @param isIgnoreCheck 是否包括sourceNode和targetNode没有被选中的连线,默认包括。
		* 复制的时候不能包括此类连线, 因为复制的时候不允许悬空的连线
		* @param isIgnoreCheck 是否包括sourceNode和targetNode没有被选中的边,默认包括。
		* 复制的时候不能包括此类边, 因为复制的时候不允许悬空的边
		*/
		getSelectElements(isIgnoreCheck?: boolean): {
		nodes: any[];
		edges: any[];
		};
		getSelectElements(isIgnoreCheck?: boolean): GraphConfigData;
		/**
		* 修改对应元素 model 中的属性
		* 注意：此方法慎用，除非您对logicflow内部有足够的了解。
		* 大多数情况下，请使用setProperties、updateText、changeNodeId等方法。
		* 例如直接使用此方法修改节点的id,那么就是会导致连接到此节点的边的sourceNodeId出现找不到的情况。
		* @param {string} id 元素id
		* @param {object} attributes 需要更新的属性
		*/
		updateAttributes(id: string, attributes: object): void;
		/**
		* 修改指定节点id
		* 修改节点的id，如果不传新的id，会内部自动创建一个。
		* @param { string } oldId 将要被修改的id
		* @param { string } newId 可选，修改后的id
		* @returns 修改后的节点id, 如果传入的oldId不存在，返回空字符串
		*/
		changeNodeId<T extends string>(oldId: any, newId?: T \| string): false \| T \| string;
		changeEdgeId<T extends string>(oldId: string, newId?: string): false \| T \| string;
		changeNodeId<T extends string>(oldId: any, newId?: T \| string): T \| string;
		/**
		* 修改边的id，如果不传新的id，会内部自动创建一个。
		* @param { string } oldId 将要被修改的id
		* @param { string } newId 可选，修改后的id
		* @returns 修改后的节点id, 如果传入的oldId不存在，返回空字符串
		*/
		changeEdgeId<T extends string>(oldId: string, newId?: string): T \| string;
		/**
		* 内部保留方法，请勿直接使用
		*/
		setFakerNode(nodeModel: BaseNodeModel): void;
		/**
		* 内部保留方法，请勿直接使用
		*/
		removeFakerNode(): void;
		/**
		* 设置指定类型的Model,请勿直接使用
		*/
		setModel(type: string, ModelClass: any): Map<any, any>;
		updateEdgeByIndex(index: any, data: any): void;
		/**
		* 将某个元素放置到顶部。
		* 如果堆叠模式为默认模式，则将原置顶元素重新恢复原有层级。
		* 如果堆叠模式为递增模式，则将需指定元素zIndex设置为当前最大zIndex + 1。
		* @see todo link 堆叠模式
		* @param id 元素Id
		*/
		toFront(id: any): void;
		setElementZIndex(id: any, zIndex: any): void;
		/**
		* 设置元素的zIndex.
		* 注意：默认堆叠模式下，不建议使用此方法。
		* @see todo link 堆叠模式
		* @param id 元素id
		* @param zIndex zIndex的值，可以传数字，也支持传入'top' 和 'bottom'
		*/
		setElementZIndex(id: string, zIndex: number \| 'top' \| 'bottom'): void;
		/**
		* 删除节点
		* @param {string} nodeId 节点Id
		*/
		deleteNode(id: any): void;
		/**
		* 添加节点
		* @param nodeConfig 节点配置
		*/
		addNode(nodeConfig: NodeConfig): any;
		@@ -148,16 +276,67 @@ /**
		moveNode2Coordinate(nodeId: BaseNodeModelId, x: number, y: number): void;
		setTextEditable(id: ElementModeId): void;
		createEdge(edgeConfig: EdgeConfig): EdgeConfig;
		/**
		* 显示节点文本编辑框
		* @param nodeId 节点id
		*/
		editText(id: ElementModeId): void;
		/**
		* 给两个节点之间添加一条边
		* @param {object} edgeConfig
		*/
		addEdge(edgeConfig: EdgeConfig): EdgeConfig;
		/**
		* 移动边，内部方法，请勿直接使用
		*/
		moveEdge(nodeId: BaseNodeModelId, deltaX: number, deltaY: number): void;
		removeEdge(sourceNodeId: any, targetNodeId: any): void;
		removeEdgeById(id: any): void;
		removeEdgeBySource(sourceNodeId: any): void;
		removeEdgeByTarget(targetNodeId: any): void;
		setElementState(state: ElementState, additionStateData?: AdditionData): void;
		setElementStateById(id: ElementModeId, state: ElementState, additionStateData?: AdditionData): void;
		setElementTextById(id: ElementModeId, value: string): void;
		resetElementState(): void;
		/**
		* 删除两节点直接的边
		* @param sourceNodeId 边的起始节点
		* @param targetNodeId 边的目的节点
		*/
		deleteEdgeBySourceAndTarget(sourceNodeId: any, targetNodeId: any): void;
		/**
		* 基于边Id删除边
		*/
		deleteEdgeById(id: any): void;
		/**
		* 删除以节点Id为起点的所有边
		*/
		deleteEdgeBySource(sourceNodeId: any): void;
		/**
		* 删除以节点Id为终点的所有边
		*/
		deleteEdgeByTarget(targetNodeId: any): void;
		/**
		* 设置元素的状态，在需要保证整个画布上所有的元素只有一个元素拥有此状态时可以调用此方法。
		* 例如文本编辑、菜单显示等。
		* additionStateData: 传递的额外值，如菜单显示的时候，需要传递期望菜单显示的位置。
		*/
		setElementStateById(id: ElementModeId, state: number, additionStateData?: AdditionData): void;
		/**
		* 更新节点或边的文案
		* @param id 节点或者边id
		* @param value 文案内容
		*/
		updateText(id: ElementModeId, value: string): void;
		/**
		* 选中节点
		* @param id 节点Id
		* @param multiple 是否为多选，如果为多选，则不去掉原有已选择节点的选中状态
		*/
		selectNodeById(id: string, multiple?: boolean): void;
		/**
		* 选中边
		* @param id 边Id
		* @param multiple 是否为多选，如果为多选，则不去掉原已选中边的状态
		*/
		selectEdgeById(id: string, multiple?: boolean): void;
		/**
		* 将图形选中
		* @param id 选择元素ID
		* @param multiple 是否允许多选，如果为true，不会将上一个选中的元素重置
		*/
		selectElementById(id: string, multiple?: boolean): void;
		/**
		* 将所有选中的元素设置为非选中
		*/
		clearSelectElements(): void;
		@@ -171,4 +350,4 @@ /**
		/**
		* 批量移动节点，节点移动的时候，会动态计算所有节点与未移动节点的连线位置
		* 移动的节点直接的连线会保持相对位置
		* 批量移动节点，节点移动的时候，会动态计算所有节点与未移动节点的边位置
		* 移动的节点直接的边会保持相对位置
		*/
		@@ -182,5 +361,32 @@ moveNodes(nodeIds: any, deltaX: any, deltaY: any, isignoreRule?: boolean): void;
		addNodeMoveRules(fn: NodeMoveRule): void;
		changeEdgeType(type: string): void;
		/**
		* 设置默认的边类型
		* 也就是设置在节点直接有用户手动绘制的连线类型。
		* @param type Options.EdgeType
		*/
		setDefaultEdgeType(type: string): void;
		/**
		* 修改指定节点类型
		* @param id 节点id
		* @param type 节点类型
		*/
		changeNodeType(id: any, type: string): void;
		setTheme(style: Style): void;
		/**
		* 切换边的类型
		* @param id 边Id
		* @param type 期望切换的类型
		*/
		changeEdgeType(id: any, type: any): void;
		/**
		* 设置主题
		* todo docs link
		*/
		setTheme(style: Theme): void;
		/**
		* 重新设置画布的宽高
		*/
		resize(width: number, height: number): void;
		/**
		* 清空画布
		*/
		clearData(): void;
		@@ -187,0 +393,0 @@ }

119

types/model/node/BaseNodeModel.d.ts

		@@ -1,3 +0,4 @@
		import { ElementState, ModelType, ElementType } from '../../constant/constant';
		import { AdditionData, NodeData, NodeAttribute, NodeConfig, NodeMoveRule, Bounds, Point, AnchorConfig } from '../../type';
		import { OutlineTheme } from '../../constant/DefaultTheme';
		import { ModelType, ElementType } from '../../constant/constant';
		import { AdditionData, NodeData, NodeConfig, NodeMoveRule, Bounds, AnchorConfig, PointAnchor, AnchorsOffsetItem, ShapeStyleAttribute } from '../../type';
		import GraphModel from '../GraphModel';
		@@ -13,4 +14,10 @@ import { IBaseModel } from '../BaseModel';
		};
		interface IBaseNodeModel extends IBaseModel {
		/**
		* model基础类型，固定为node
		*/
		readonly BaseType: ElementType.NODE;
		}
		export { BaseNodeModel };
		export default class BaseNodeModel implements IBaseModel {
		export default class BaseNodeModel implements IBaseNodeModel {
		id: string;
		@@ -37,19 +44,7 @@ readonly BaseType = ElementType.NODE;
		set height(value: number);
		fill: string;
		fillOpacity: number;
		strokeWidth: number;
		stroke: string;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		hideOutline: boolean;
		hoverOutlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineStrokeDashArray: string;
		isSelected: boolean;
		isHovered: boolean;
		isDragging: boolean;
		isHitable: boolean;
		zIndex: number;
		anchorsOffset: any[];
		anchorsOffset: AnchorsOffsetItem[];
		state: number;
		@@ -64,9 +59,36 @@ text: {
		draggable: boolean;
		constructor(data: NodeConfig, graphModel: GraphModel, type: any);
		initNodeData(data: any): void;
		createId(): any;
		formatText(data: any): void;
		constructor(data: NodeConfig, graphModel: GraphModel);
		/**
		* 初始化节点数据，不建议重写
		* 可以重写setAttributes来实现修改初始化功能
		* initNodeData和setAttributes的区别在于
		* initNodeData需要
		*/
		protected initNodeData(data: any): void;
		/**
		* @overridable 支持重新
		* @returns string
		*/
		createId(): string;
		/**
		* 初始化文本属性，对
		*/
		private formatText;
		/**
		* 设置model初始化属性
		* 例如设置节点的宽度
		* @example
		*
		* setAttributes () {
		* this.width = 300
		* this.height = 200
		* }
		*
		* @overridable 支持重写
		*/
		setAttributes(): void;
		/**
		* 保存时获取的数据
		* 获取被保存时返回的数据
		* @overridable 支持重写
		* @returns NodeData
		*/
		@@ -76,4 +98,37 @@ getData(): NodeData;
		/**
		* 在连线的时候，是否允许这个节点为source节点，连线到target节点。
		* @overridable 支持重写
		* 获取当前节点样式
		* @returns 自定义节点样式
		*/
		getNodeStyle(): ShapeStyleAttribute;
		getTextStyle(): {
		[x: string]: any;
		overflowMode?: string;
		background?: import("../../constant/DefaultTheme").RectTheme;
		color?: string;
		fontSize?: number;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		/**
		* 获取节点锚点样式
		* @returns 自定义样式
		*/
		getAnchorStyle(): Record<string, any>;
		getAnchorLineStyle(): {
		[x: string]: any;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		/**
		* @overridable 支持重写
		* 获取outline样式，重写可以定义此类型节点outline样式，默认使用主题样式
		* @returns 自定义outline样式
		*/
		getOutlineStyle(): OutlineTheme;
		/**
		* 在边的时候，是否允许这个节点为source节点，边到target节点。
		*/
		isAllowConnectedAsSource(target: BaseNodeModel, soureAnchor: AnchorConfig, targetAnchor: AnchorConfig): ConnectRuleResult \| Boolean;
		@@ -85,3 +140,3 @@ /**
		/**
		* 在连线的时候，是否允许这个节点未target节点
		* 在边的时候，是否允许这个节点未target节点
		*/
		@@ -94,8 +149,16 @@ isAllowConnectedAsTarget(source: BaseNodeModel, soureAnchor: AnchorConfig, targetAnchor: AnchorConfig): ConnectRuleResult \| Boolean;
		getConnectedTargetRules(): ConnectRule[];
		getAnchorsByOffset(): Point[];
		/**
		* 获取节点区域
		* @overridable 子类重写此方法设置锚点
		* @returns Point[] 锚点坐标构成的数组
		*/
		getAnchorsByOffset(): PointAnchor[];
		/**
		* 获取节点默认情况下的锚点
		*/
		getDetaultAnchor(): PointAnchor[];
		/**
		* 获取节点BBox
		*/
		getBounds(): Bounds;
		get anchors(): Point[];
		get anchors(): PointAnchor[];
		addNodeMoveRules(fn: NodeMoveRule): void;
		@@ -109,10 +172,8 @@ move(deltaX: any, deltaY: any, isignoreRule?: boolean): void;
		setHitable(flag?: boolean): void;
		setElementState(state: ElementState, additionStateData?: AdditionData): void;
		setElementState(state: number, additionStateData?: AdditionData): void;
		updateStroke(color: any): void;
		updateData(nodeAttribute: NodeAttribute): void;
		setProperty(key: any, val: any): void;
		setProperties(properties: any): void;
		setStyleFromTheme(type: any, graphModel: any): void;
		setZIndex(zindex?: number): void;
		updateAttributes(attributes: any): void;
		}

16

types/model/node/CircleNodeModel.d.ts

		@@ -1,14 +0,22 @@
		import { Point } from '../../type';
		import BaseNodeModel from './BaseNodeModel';
		import { ModelType } from '../../constant/constant';
		import GraphModel from '../GraphModel';
		declare class CircleNodeModel extends BaseNodeModel {
		modelType: ModelType;
		r: number;
		constructor(data: any, graphModel: GraphModel);
		get width(): number;
		get height(): number;
		get anchors(): Point[];
		getNodeStyle(): {
		[x: string]: any;
		r?: number;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		getDetaultAnchor(): {
		x: number;
		y: number;
		id: string;
		}[];
		}
		export { CircleNodeModel };
		export default CircleNodeModel;

11

types/model/node/DiamondNodeModel.d.ts

		@@ -1,5 +0,4 @@
		import { NodeData, Point, PointTuple } from '../../type';
		import { Point, PointTuple } from '../../type';
		import BaseNodeModel from './BaseNodeModel';
		import { ModelType } from '../../constant/constant';
		import GraphModel from '../GraphModel';
		declare class DiamondNodeModel extends BaseNodeModel {
		@@ -9,4 +8,8 @@ modelType: ModelType;
		ry: number;
		constructor(data: any, graphModel: GraphModel);
		getData(): NodeData;
		getNodeStyle(): {
		[x: string]: any;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		get points(): PointTuple[];
		@@ -13,0 +16,0 @@ get pointsPosition(): Point[];

8

types/model/node/EllipseNodeModel.d.ts

		import { Point } from '../../type';
		import BaseNodeModel from './BaseNodeModel';
		import { ModelType } from '../../constant/constant';
		import GraphModel from '../GraphModel';
		declare class EllipseNodeModel extends BaseNodeModel {
		@@ -9,3 +8,8 @@ modelType: ModelType;
		ry: number;
		constructor(data: any, graphModel: GraphModel);
		getNodeStyle(): {
		[x: string]: any;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		get width(): number;
		@@ -12,0 +16,0 @@ get height(): number;

2

types/model/node/HtmlNodeModel.d.ts

		import { Point } from '../../type';
		import BaseNodeModel from './BaseNodeModel';
		import { ModelType } from '../../constant/constant';
		import GraphModel from '../GraphModel';
		declare class HtmlNodeModel extends BaseNodeModel {
		modelType: ModelType;
		constructor(data: any, graphModel: GraphModel);
		get anchors(): Point[];
		@@ -9,0 +7,0 @@ }

13

types/model/node/PolygonNodeModel.d.ts

		import { Point, PointTuple } from '../../type';
		import BaseNodeModel from './BaseNodeModel';
		import { ModelType } from '../../constant/constant';
		import GraphModel from '../GraphModel';
		declare class PolygonNodeModel extends BaseNodeModel {
		modelType: ModelType;
		points: PointTuple[];
		constructor(data: any, graphModel: GraphModel);
		getNodeStyle(): {
		[x: string]: any;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		/**
		* 由于大多数情况下，我们初始化拿到的多边形坐标都是基于原点的（例如绘图工具到处的svg）。
		* 在logicflow中对多边形进行移动，我们不需要去更新points，
		* 而是去更新多边形中心点即可。
		*/
		get pointsPosition(): Point[];
		@@ -10,0 +19,0 @@ get width(): number;

11

types/model/node/RectNodeModel.d.ts

		import { Point } from '../../type';
		import BaseNodeModel from './BaseNodeModel';
		import { ModelType } from '../../constant/constant';
		import GraphModel from '../GraphModel';
		declare class RectNodeModel extends BaseNodeModel {
		modelType: ModelType;
		radius: number;
		constructor(data: any, graphModel: GraphModel);
		get anchors(): Point[];
		getNodeStyle(): {
		[x: string]: any;
		width?: number;
		height?: number;
		radius?: number;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		}
		export { RectNodeModel };
		export default RectNodeModel;

12

types/model/node/TextNodeModel.d.ts

		import BaseNodeModel from './BaseNodeModel';
		import { ModelType } from '../../constant/constant';
		import GraphModel from '../GraphModel';
		declare class TextNodeModel extends BaseNodeModel {
		modelType: ModelType;
		fontSize: number;
		fontFamily: string;
		fontWeight: string;
		constructor(data: any, graphModel: GraphModel);
		getNodeStyle(): {
		[x: string]: any;
		color?: string;
		fontSize?: number;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		get width(): number;
		@@ -11,0 +15,0 @@ get height(): number;

8

types/model/SnaplineModel.d.ts

		@@ -18,5 +18,9 @@ import GraphModel from './GraphModel';
		position: SnaplinePosition;
		get stroke(): string;
		get strokeWidth(): number;
		constructor(graphModel: any);
		getStyle(): {
		[x: string]: any;
		fill?: string;
		stroke?: string;
		strokeWidth?: number;
		};
		private getCenterSnapLine;
		@@ -23,0 +27,0 @@ private getHorizontalSnapline;

10

types/model/TransformModel.d.ts

		@@ -13,3 +13,3 @@ import EventEmitter from '../event/eventEmitter';
		MAX_SCALE_SIZE: number;
		zoom: (isZoomout: ZoomParam) => boolean;
		zoom: (isZoomout: ZoomParam) => string;
		HtmlPointToCanvasPoint: (point: PointTuple) => PointTuple;
		@@ -66,3 +66,9 @@ CanvasPointToHtmlPoint: (point: PointTuple) => PointTuple;
		};
		zoom(zoomSize?: ZoomParam, point?: PointTuple): boolean;
		/**
		* 放大缩小图形
		* @param zoomSize 放大缩小的值，支持传入0-n之间的数字。小于1表示缩小，大于1表示放大。也支持传入true和false按照内置的刻度放大缩小
		* @param point 缩放的原点
		* @returns {string} -放大缩小的比例
		*/
		zoom(zoomSize?: ZoomParam, point?: PointTuple): string;
		private emitGraphTransform;
		@@ -69,0 +75,0 @@ resetZoom(): void;

94

types/options.d.ts

		@@ -1,7 +0,7 @@
		import { DndOptions } from './view/behavior/DnD';
		import { GridOptions } from './view/overlay/Grid';
		import { BackgroundConfig } from './view/overlay/BackgroundOverlay';
		import { Style, NodeData, EdgeData, GraphConfigData } from './type';
		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;
		@@ -12,3 +12,3 @@ declare type DefaultOverlapMode = 0;
		* 元素重叠处理方式
		* 0：表示节点在上，连线在下，点击元素时选择元素显示在最顶部。
		* 0：表示节点在上，边在下，点击元素时选择元素显示在最顶部。
		* 1：表示安装元素创建顺序排序，点击元素也不会将其置顶。要置顶需要调用置顶API。
		@@ -20,2 +20,3 @@ */
		* 画布初始化容器
		* 注意，在不传入width和height的情况下，container元素本身应该存在高度和高度。
		*/
		@@ -39,15 +40,50 @@ container: HTMLElement;
		grid?: boolean \| GridOptions;
		/**
		* 键盘快捷操作
		*/
		keyboard?: KeyboardDef;
		style?: Style;
		dndOptions?: DndOptions;
		/**
		* 主题配置
		*/
		style?: Theme;
		/**
		* 禁止初始化的插件名称
		*/
		disabledPlugins?: string[];
		/**
		* 默认边类型
		*/
		edgeType?: EdgeType;
		/**
		* 是否开启对齐线，默认开启
		*/
		snapline?: boolean;
		/**
		* 是否开启历史记录功能，默认开启
		*/
		history?: boolean;
		/**
		* 是否开启局部渲染，默认不开启
		*/
		partial?: boolean;
		/**
		* 删除和克隆之前的判断函数
		* todo: 目前不完善，仅支持同步
		*/
		guards?: GuardsTypes;
		/**
		* 是否不启用outline显示选中和hover效果
		*/
		hideOutline?: boolean;
		/**
		* 表示节点在上，边在下，点击元素时选择元素显示在最顶部。
		* 表示安装元素创建顺序排序，点击元素也不会将其置顶。要置顶需要调用置顶API。
		*/
		overlapMode?: OverlapMode;
		idGenerator?: () => number \| string;
		/**
		* 自定义创建节点、连线时生成id规则。
		* @param type 节点、连线类型
		*/
		idGenerator?: (type?: string) => string;
		/**
		* 禁止启用的内置工具
		@@ -59,2 +95,3 @@ * 有些场景下，需要自定义多选效果或者文本编辑效果，则需要禁用这些内置的工具
		disabledTools?: string[];
		[key: string]: any;
		} & EditConfigInterface;
		@@ -71,4 +108,6 @@ export interface GuardsTypes {
		} & {
		[key: string]: any;
		/**
		* 画布初始化容器
		* 注意，在不传入width和height的情况下，container元素本身应该存在高度和高度。
		*/
		@@ -92,15 +131,50 @@ container: HTMLElement;
		grid?: boolean \| GridOptions;
		/**
		* 键盘快捷操作
		*/
		keyboard?: KeyboardDef;
		style?: Style;
		dndOptions?: DndOptions;
		/**
		* 主题配置
		*/
		style?: Theme;
		/**
		* 禁止初始化的插件名称
		*/
		disabledPlugins?: string[];
		/**
		* 默认边类型
		*/
		edgeType?: any;
		/**
		* 是否开启对齐线，默认开启
		*/
		snapline?: boolean;
		/**
		* 是否开启历史记录功能，默认开启
		*/
		history?: boolean;
		/**
		* 是否开启局部渲染，默认不开启
		*/
		partial?: boolean;
		/**
		* 删除和克隆之前的判断函数
		* todo: 目前不完善，仅支持同步
		*/
		guards?: GuardsTypes;
		/**
		* 是否不启用outline显示选中和hover效果
		*/
		hideOutline?: boolean;
		/**
		* 表示节点在上，边在下，点击元素时选择元素显示在最顶部。
		* 表示安装元素创建顺序排序，点击元素也不会将其置顶。要置顶需要调用置顶API。
		*/
		overlapMode?: OverlapMode;
		idGenerator?: () => string \| number;
		/**
		* 自定义创建节点、连线时生成id规则。
		* @param type 节点、连线类型
		*/
		idGenerator?: (type?: string) => string;
		/**
		* 禁止启用的内置工具
		@@ -107,0 +181,0 @@ * 有些场景下，需要自定义多选效果或者文本编辑效果，则需要禁用这些内置的工具

87

types/type/index.d.ts

		@@ -26,2 +26,3 @@ import { h } from 'preact';
		import * as Options from '../options';
		import { CommonTheme, EdgeTextTheme } from '../constant/DefaultTheme';
		export declare type PointTuple = [number, number];
		@@ -33,2 +34,23 @@ export declare type Point = {
		};
		/**
		* 锚点坐标
		* 为了方便计算
		* 锚点的位置都是相对于节点中心点的偏移量。
		*/
		export declare type PointAnchor = {
		/**
		* 锚点x轴相对于中心点的偏移量
		*/
		x: number;
		/**
		* 锚点y轴相对于中心点的偏移量
		*/
		y: number;
		/**
		* 锚点Id
		*/
		id?: string;
		[key: string]: unknown;
		};
		export declare type AnchorsOffsetItem = PointTuple \| PointAnchor;
		export declare type Size = {
		@@ -108,3 +130,7 @@ width: number;
		id?: string;
		type: string;
		/**
		* 边的类型，不传默认为lf.setDefaultEdgeType(type)传入的类型。
		* LogicFlow内部默认为polyline
		*/
		type?: string;
		sourceNodeId: string;
		@@ -149,5 +175,3 @@ sourceAnchorId?: string;
		outlineColor?: string;
		hoverOutlineColor?: string;
		outlineStrokeDashArray?: string;
		hoverOutlineStrokeDashArray?: string;
		};
		@@ -212,21 +236,6 @@ export declare type RectStyle = CommonStyle & {
		export declare type NodeTextStyle = TextStyle & {
		autoWrap?: boolean;
		lineHeight?: number;
		wrapPadding?: string;
		};
		export declare type EdgeTextStyle = TextStyle & {
		background?: {
		fill?: string;
		stroke?: string;
		radius?: number;
		};
		hoverBackground?: {
		fill?: string;
		stroke?: string;
		radius?: number;
		};
		autoWrap?: boolean;
		lineHeight?: number;
		wrapPadding?: string;
		};
		export declare type EdgeTextStyle = TextStyle & EdgeTextTheme;
		export declare type ArrowStyle = {
		@@ -241,20 +250,2 @@ offset?: number;
		};
		export declare type Style = {
		rect?: RectStyle;
		circle?: CircleStyle;
		ellipse?: EllipseStyle;
		diamond?: DiamondStyle;
		polygon?: PolygonStyle;
		anchor?: AnchorStyle;
		text?: TextStyle;
		nodeText?: NodeTextStyle;
		edgeText?: EdgeTextStyle;
		line?: LineStyle;
		polyline?: PolylineStyle;
		bezier?: BezierStyle;
		arrow?: ArrowStyle;
		anchorLine?: AnchorLineStyle;
		anchorHover?: AnchorHoverStyle;
		EdgeAdjustStyle?: EdgeAdjustStyle;
		};
		export declare type GraphTransform = {
		@@ -362,2 +353,24 @@ transform: string;
		export declare type ZoomParam = boolean \| number;
		export declare type NodeAttributes = {
		id: string;
		properties: Record<string, any>;
		type: string;
		x: number;
		y: number;
		isSelected: boolean;
		isHovered: boolean;
		width: number;
		height: number;
		text: {
		x: number;
		y: number;
		value: string;
		[key: string]: any;
		};
		[key: string]: any;
		};
		export declare type DiamondAttributes = {
		points: PointTuple[];
		} & NodeAttributes;
		export declare type ShapeStyleAttribute = CommonTheme;
		export {};

6

types/util/edge.d.ts

		@@ -91,5 +91,5 @@ import BaseNode from '../model/node/BaseNodeModel';
		/**
		* 获取移动连线后，文本位置距离连线上的最近的一点
		* @param point 连线上文本的位置
		* @param points 连线的各个拐点
		* 获取移动边后，文本位置距离边上的最近的一点
		* @param point 边上文本的位置
		* @param points 边的各个拐点
		*/
		@@ -96,0 +96,0 @@ export declare const getClosestPointOfPolyline: (point: Point, points: string) => Point;

2

types/util/graph.d.ts

		@@ -12,2 +12,2 @@ export declare const getById: (id: any, data: any) => any;
		*/
		export declare const isMultipleSelect: (e: MouseEvent, editConfig: any) => boolean;
		export declare const isMultipleSelect: (e: MouseEvent, editConfigModel: any) => boolean;

2

types/util/node.d.ts

		@@ -61,5 +61,5 @@ import BaseNode from '../model/node/BaseNodeModel';
		/**
		* @description 格式化连线校验信息
		* @description 格式化边校验信息
		*/
		export declare const formateAnchorConnectValidateData: (data: any) => any;
		export {};

175

types/util/theme.d.ts

		@@ -1,173 +0,2 @@
		export declare const updateTheme: (style: any) => {
		rect: {
		width: number;
		height: number;
		radius: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		circle: {
		r: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		diamond: {
		rx: number;
		ry: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		ellipse: {
		rx: number;
		ry: number;
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		polygon: {
		fill: string;
		stroke: string;
		strokeWidth: number;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		anchor: {
		stroke: string;
		strokeWidth: number;
		r: number;
		fill: string;
		fillOpacity: number;
		strokeOpacity: number;
		opacity: number;
		outlineColor: string;
		outlineStrokeDashArray: string;
		hoverOutlineColor: string;
		hoverOutlineStrokeDashArray: string;
		};
		text: {
		color: string;
		fontSize: number;
		fontWeight: string;
		fontFamily: string;
		};
		nodeText: {
		autoWrap: boolean;
		lineHeight: number;
		wrapPadding: string;
		color: string;
		fontSize: number;
		fontWeight: string;
		fontFamily: string;
		};
		edgeText: {
		color: string;
		fontSize: number;
		fontWeight: string;
		fontFamily: string;
		background: {
		fill: string;
		height: number;
		stroke: string;
		radius: number;
		};
		hoverBackground: any;
		autoWrap: boolean;
		lineHeight: number;
		wrapPadding: string;
		};
		line: {
		stroke: string;
		strokeWidth: number;
		hoverStroke: string;
		selectedStroke: string;
		strokeDashArray: string;
		outlineColor: string;
		outlineStrokeDashArray: string;
		};
		polyline: {
		offset: number;
		stroke: string;
		strokeWidth: number;
		hoverStroke: string;
		selectedStroke: string;
		strokeDashArray: string;
		outlineColor: string;
		outlineStrokeDashArray: string;
		};
		bezier: {
		offset: number;
		adjustLineColor: string;
		adjustAnchorStroke: string;
		adjustAnchorFill: string;
		adjustAnchorFillOpacity: number;
		stroke: string;
		strokeWidth: number;
		hoverStroke: string;
		selectedStroke: string;
		strokeDashArray: string;
		outlineColor: string;
		outlineStrokeDashArray: string;
		};
		arrow: {
		offset: number;
		verticalLength: number;
		};
		anchorLine: {
		stroke: string;
		strokeWidth: number;
		strokeDasharray: string;
		};
		anchorHover: {
		fill: string;
		fillOpacity: number;
		stroke: string;
		strokeWidth: number;
		r: number;
		};
		snapline: {
		stroke: string;
		strokeWidth: number;
		};
		edgeAdjust: {
		r: number;
		fill: string;
		stroke: string;
		strokeWidth: string;
		};
		};
		import { Theme } from '../constant/DefaultTheme';
		export declare const updateTheme: (style: Theme) => Theme;

2

types/view/Anchor.d.ts

		import { h, Component } from 'preact';
		import BaseNodeModel, { ConnectRuleResult } from '../model/node/BaseNodeModel';
		import GraphModel from '../model/GraphModel';
		import EventEmitter from '../event/eventEmitter';
		import { AnchorConfig } from '../type';
		@@ -16,3 +15,2 @@ declare type TargetNodeId = string;
		anchorIndex: number;
		eventCenter: EventEmitter;
		graphModel: GraphModel;
		@@ -19,0 +17,0 @@ nodeModel: BaseNodeModel;

10

types/view/basic-shape/Path.d.ts

		import { h } from 'preact';
		declare type IProps = {
		d: string;
		strokeWidth: number;
		stroke: string;
		fill: string;
		strokeDasharray?: string;
		[key: string]: any;
		};
		declare function Path(props: IProps): h.JSX.Element;
		declare namespace Path {
		var defaultProps: {
		strokeDasharray: string;
		};
		}
		export default Path;

6

types/view/basic-shape/Rect.d.ts

		@@ -6,4 +6,2 @@ import { h } from 'preact';
		radius?: number;
		stroke?: string;
		strokeDasharray?: string;
		} & type.Point & type.Size;
		@@ -13,8 +11,6 @@ declare function Rect(props: IProps): h.JSX.Element;
		var defaultProps: {
		radius: number;
		stroke: string;
		strokeDasharray: string;
		className: string;
		radius: string;
		};
		}
		export default Rect;

4

types/view/behavior/DnD.d.ts

		import LogicFlow from '../../LogicFlow';
		import { BaseNodeModel } from '../../model';
		import { TextConfig } from '../../type';
		export declare type DndOptions = {
		validate: () => boolean;
		};
		export declare type NewNodeConfig = {
		@@ -15,3 +12,2 @@ type: string;
		lf: LogicFlow;
		options: DndOptions;
		fakerNode: BaseNodeModel;
		@@ -18,0 +14,0 @@ constructor(params: any);

4

types/view/edge/AdjustPoint.d.ts

		import { h, Component } from 'preact';
		import EventEmitter from '../../event/eventEmitter';
		import { BaseEdgeModel } from '../../model/edge';
		@@ -11,3 +10,2 @@ import GraphModel from '../../model/GraphModel';
		id?: string;
		eventCenter: EventEmitter;
		graphModel: GraphModel;
		@@ -41,5 +39,5 @@ edgeModel: BaseEdgeModel;
		recoveryEdge: () => void;
		getAdjustPointStyle: () => any;
		getAdjustPointStyle: () => import("../../constant/DefaultTheme").CircleTheme;
		render(): h.JSX.Element;
		}
		export {};

6

types/view/edge/Arrow.d.ts

		import { h, Component } from 'preact';
		import { ArrowInfo } from '../../type/index';
		declare type ArrowStyle = {
		stroke: string;
		fill: string;
		export declare type ArrowStyle = {
		stroke?: string;
		fill?: string;
		strokeWidth?: number;
		@@ -7,0 +7,0 @@ offset: number;

22

types/view/edge/BaseEdge.d.ts

		import { h, Component } from 'preact';
		import { ArrowStyle } from './Arrow';
		import BaseEdgeModel from '../../model/edge/BaseEdgeModel';
		import GraphModel from '../../model/GraphModel';
		import EventEmitter from '../../event/eventEmitter';
		import { ArrowInfo } from '../../type/index';
		@@ -9,3 +9,2 @@ declare type IProps = {
		graphModel: GraphModel;
		eventCenter: EventEmitter;
		};
		@@ -16,13 +15,2 @@ export default class BaseEdge extends Component<IProps> {
		clickTimer: number;
		getAttributes(): {
		stroke: string;
		strokeWidth: number;
		strokeOpacity: number;
		strokeDashArray: string;
		isSelected: boolean;
		isHovered: boolean;
		hoverStroke: string;
		selectedStroke: string;
		properties: {};
		};
		getShape(): void;
		@@ -32,9 +20,3 @@ getTextStyle(): void;
		getArrowInfo(): ArrowInfo;
		getArrowStyle(): {
		stroke: string;
		strokeWidth: number;
		fill: string;
		offset: any;
		verticalLength: any;
		};
		getArrowStyle(): ArrowStyle;
		getArrow(): h.JSX.Element;
		@@ -41,0 +23,0 @@ getAdjustPoints(): h.JSX.Element;

12

types/view/edge/BezierEdge.d.ts

		@@ -5,14 +5,2 @@ import { h } from 'preact';
		export default class BezierEdge extends BaseEdge {
		getAttributes(): {
		path: string;
		stroke: string;
		strokeWidth: number;
		strokeOpacity: number;
		strokeDashArray: string;
		isSelected: boolean;
		isHovered: boolean;
		hoverStroke: string;
		selectedStroke: string;
		properties: {};
		};
		getEdge(): h.JSX.Element;
		@@ -19,0 +7,0 @@ getShape(): h.JSX.Element;

13

types/view/edge/LineEdge.d.ts

		import { h } from 'preact';
		import BaseEdge from './BaseEdge';
		export default class LineEdge extends BaseEdge {
		getAttributes(): {
		startPoint: any;
		endPoint: any;
		stroke: string;
		strokeWidth: number;
		strokeOpacity: number;
		strokeDashArray: string;
		isSelected: boolean;
		isHovered: boolean;
		hoverStroke: string;
		selectedStroke: string;
		properties: {};
		};
		getEdge(): h.JSX.Element;
		@@ -18,0 +5,0 @@ getShape(): h.JSX.Element;

12

types/view/edge/PolylineEdge.d.ts

		@@ -25,14 +25,2 @@ import { h } from 'preact';
		getIsDraging: () => boolean;
		getAttributes(): {
		points: string;
		stroke: string;
		strokeWidth: number;
		strokeOpacity: number;
		strokeDashArray: string;
		isSelected: boolean;
		isHovered: boolean;
		hoverStroke: string;
		selectedStroke: string;
		properties: {};
		};
		getEdge(): h.JSX.Element;
		@@ -39,0 +27,0 @@ getShape(): h.JSX.Element;

4

types/view/Graph.d.ts

		@@ -5,3 +5,2 @@ import { Component, h } from 'preact';
		import * as Options from '../options';
		import EventEmitter from '../event/eventEmitter';
		import DnD from './behavior/DnD';
		@@ -15,3 +14,2 @@ import BaseEdgeModel from '../model/edge/BaseEdgeModel';
		options: Options.Definition;
		eventCenter: EventEmitter;
		dnd: DnD;
		@@ -22,5 +20,5 @@ snaplineModel: SnaplineModel;
		declare class Graph extends Component<IProps> {
		getComponent(model: BaseEdgeModel \| BaseNodeModel, graphModel: GraphModel, eventCenter: EventEmitter, overlay?: string): h.JSX.Element;
		getComponent(model: BaseEdgeModel \| BaseNodeModel, graphModel: GraphModel, overlay?: string): h.JSX.Element;
		render(): h.JSX.Element;
		}
		export default Graph;

37

types/view/node/BaseNode.d.ts

		import { h, Component } from 'preact';
		import GraphModel from '../../model/GraphModel';
		import BaseNodeModel from '../../model/node/BaseNodeModel';
		import EventEmitter from '../../event/eventEmitter';
		import { StepDrag } from '../../util/drag';
		@@ -9,34 +8,7 @@ declare type IProps = {
		graphModel: GraphModel;
		eventCenter: EventEmitter;
		};
		declare type Istate = {
		isDraging: boolean;
		isHovered: boolean;
		};
		declare type StyleAttribute = {
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		[key: string]: any;
		};
		export declare type NodeAttributes = {
		id: string;
		properties: Record<string, any>;
		type: string;
		x: number;
		y: number;
		isSelected: boolean;
		isHovered: boolean;
		text: {
		x: number;
		y: number;
		value: string;
		[key: string]: any;
		};
		} & StyleAttribute;
		export default abstract class BaseNode extends Component<IProps, Istate> {
		@@ -50,10 +22,3 @@ static getModel(defaultModel: any): any;
		abstract getShape(): any;
		getShapeStyle(): StyleAttribute;
		getAttributes(): NodeAttributes;
		getProperties(): Record<string, any>;
		getAnchorStyle(): Record<string, any>;
		getAnchorHoverStyle(): Record<string, any>;
		getNewEdgeStyle(): Record<string, any>;
		getAnchors(): h.JSX.Element[];
		getTextStyle(): any;
		getText(): "" \| h.JSX.Element;
		@@ -60,0 +25,0 @@ getStateClassName(): string;

37

types/view/node/CircleNode.d.ts

		import { h } from 'preact';
		import BaseNode from './BaseNode';
		export default class CircleNode extends BaseNode {
		getShapeStyle(): {
		r: number;
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		};
		getAttributes(): {
		r: number;
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		id: string;
		properties: Record<string, any>;
		type: string;
		x: number;
		y: number;
		isSelected: boolean;
		isHovered: boolean;
		text: {
		[key: string]: any;
		x: number;
		y: number;
		value: string;
		};
		};
		getShape(): h.JSX.Element;
		}

37

types/view/node/DiamondNode.d.ts

		import { h } from 'preact';
		import BaseNode from './BaseNode';
		export default class DiamondNode extends BaseNode {
		getShapeStyle(): {
		points: import("../..").PointTuple[];
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		};
		getAttributes(): {
		points: import("../..").PointTuple[];
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		id: string;
		properties: Record<string, any>;
		type: string;
		x: number;
		y: number;
		isSelected: boolean;
		isHovered: boolean;
		text: {
		[key: string]: any;
		x: number;
		y: number;
		value: string;
		};
		};
		getShape(): h.JSX.Element;
		}

26

types/view/node/EllipseNode.d.ts

		import { h } from 'preact';
		import BaseNode from './BaseNode';
		export default class EllipseNode extends BaseNode {
		getAttributes(): {
		rx: number;
		ry: number;
		id: string;
		properties: Record<string, any>;
		type: string;
		x: number;
		y: number;
		isSelected: boolean;
		isHovered: boolean;
		text: {
		[key: string]: any;
		x: number;
		y: number;
		value: string;
		};
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		};
		getShape(): h.JSX.Element;
		}

20

types/view/node/HtmlNode.d.ts

		@@ -5,5 +5,25 @@ import { h } from 'preact';
		ref: HTMLElement;
		currrentProperties: string;
		setRef: (dom: any) => void;
		get rootEl(): HTMLElement;
		/**
		* @overridable 支持重写
		* 自定义HTML节点内容
		* @param {HTMLElement} rootEl 自定义HTML节点内容可以挂载的dom节点
		* @example
		* class CustomHtmlNode extends HtmlNode {
		* setHtml(rootEl) {
		* const input = document.createElement('input');
		* rootEl.appendChild(input)
		* }
		* }
		*/
		setHtml(rootEl: HTMLElement): void;
		/**
		* @overridable 支持重写
		* 和react的shouldComponentUpdate类似，都是为了避免出发不必要的render.
		* 但是这里不一样的地方在于，setHtml方法，我们只在properties发生变化了后再触发。
		* 而x,y等这些坐标相关的方法发生了变化，不会再重新触发setHtml.
		*/
		shouldUpdate(): boolean;
		componentDidMount(): void;
		@@ -10,0 +30,0 @@ componentDidUpdate(): void;

20

types/view/node/PolygonNode.d.ts

		import { h } from 'preact';
		import BaseNode, { NodeAttributes } from './BaseNode';
		import { PointTuple } from '../../type';
		declare type PolygonNodeAttributes = {
		points: PointTuple[];
		} & NodeAttributes;
		import BaseNode from './BaseNode';
		export default class PolygonNode extends BaseNode {
		getShapeStyle(): {
		points: PointTuple[];
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		};
		getAttributes(): PolygonNodeAttributes;
		getShape(): h.JSX.Element;
		}
		export {};

37

types/view/node/RectNode.d.ts

		import { h } from 'preact';
		import BaseNode from './BaseNode';
		export default class RectNode extends BaseNode {
		getShapeStyle(): {
		radius: number;
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		};
		getAttributes(): {
		radius: number;
		width: number;
		height: number;
		fill: string;
		fillOpacity?: number;
		strokeWidth?: number;
		stroke: string;
		strokeOpacity?: number;
		opacity?: number;
		outlineColor?: string;
		id: string;
		properties: Record<string, any>;
		type: string;
		x: number;
		y: number;
		isSelected: boolean;
		isHovered: boolean;
		text: {
		[key: string]: any;
		x: number;
		y: number;
		value: string;
		};
		};
		getShape(): h.JSX.Element;
		}

1

types/view/node/TextNode.d.ts

		@@ -5,3 +5,4 @@ import { h } from 'preact';
		getBackgroud(): h.JSX.Element;
		getText(): any;
		getShape(): h.JSX.Element;
		}

47

types/view/overlay/BackgroundOverlay.d.ts

		import { h, Component } from 'preact';
		/**
		* 背景配置, 支持css属性配置
		* https://developer.mozilla.org/zh-CN/docs/Web/CSS/background
		* @example
		* {
		* backgroundImage: "url('./img/grid.svg')",
		backgroundRepeat: 'repeat',
		* }
		*/
		export declare type BackgroundConfig = {
		image?: string;
		color?: string;
		repeat?: string;
		position?: string;
		size?: string;
		opacity?: number;
		/**
		* 背景图片地址
		*/
		backgroundImage?: string;
		/**
		* 是否重复
		*/
		backgroundRepeat?: string;
		[key: string]: any;
		};
		@@ -14,27 +26,4 @@ declare type IProps = {
		export default class BackgroundOverlay extends Component<IProps> {
		getAttributes(): {
		color: string;
		opacity: number;
		image: string;
		repeat?: undefined;
		position?: undefined;
		size?: undefined;
		} \| {
		image: string;
		repeat: string;
		position: string;
		size: string;
		opacity: number;
		color?: undefined;
		} \| {
		color?: undefined;
		opacity?: undefined;
		image?: undefined;
		repeat?: undefined;
		position?: undefined;
		size?: undefined;
		};
		getShape(): h.JSX.Element;
		render(): h.JSX.Element;
		}
		export {};

2

types/view/overlay/CanvasOverlay.d.ts

		import { h, Component } from 'preact';
		import GraphModel from '../../model/GraphModel';
		import { StepDrag } from '../../util/drag';
		import EventEmitter from '../../event/eventEmitter';
		import Dnd from '../behavior/DnD';
		declare type IProps = {
		graphModel: GraphModel;
		eventCenter: EventEmitter;
		dnd: Dnd;
		@@ -10,0 +8,0 @@ };

2

types/view/overlay/OutlineOverlay.d.ts

		@@ -10,3 +10,3 @@ import { Component, h } from 'preact';
		export default class OutlineOverlay extends Component<IProps> {
		getNodeOutline(): any[];
		getNodesOutline(): any[];
		getEdgeOutline(): any[];
		@@ -13,0 +13,0 @@ getLineOutline(line: LineEdgeModel): h.JSX.Element;

dist/logic-flow.js

Sorry, the diff of this file is too big to display

dist/style/index.css

Sorry, the diff of this file is not supported yet

@logicflow/core - npm Package Compare versions

Improved metrics