@logicflow/extension 1.2.27 → 2.0.0-beta.0

package/src/bpmn-elements/presets/Event/IntermediateThrowEvent.ts

@@ -0,0 +1,109 @@
+import {
+  h,
+  CircleNode,
+  CircleNodeModel,
+  GraphModel,
+  LogicFlow,
+} from '@logicflow/core'
+import { genBpmnId, groupRule } from '../../utils'
+
+import NodeConfig = LogicFlow.NodeConfig
+
+export function IntermediateThrowEventFactory(lf: any): {
+  type: string
+  model: any
+  view: any
+} {
+  const [definition] = lf.useDefinition()
+
+  class view extends CircleNode {
+    getAnchorStyle() {
+      return {
+        visibility: 'hidden',
+      }
+    }
+
+    getShape() {
+      // @ts-ignore
+      const { model } = this.props
+      const style = model.getNodeStyle()
+      const { x, y, r, width, height, properties } = model as CircleNodeModel
+      const { definitionType } = properties
+      const { icon } =
+        definition.intermediateThrowEvent?.get(definitionType) || {}
+
+      const i = Array.isArray(icon)
+        ? h(
+            'g',
+            {
+              transform: `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`,
+            },
+            ...icon,
+          )
+        : h('path', {
+            transform: `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`,
+            d: icon,
+            style: 'fill: black',
+          })
+      return h(
+        'g',
+        {},
+        h('circle', {
+          ...style,
+          cx: x,
+          cy: y,
+          r,
+          strokeWidth: 1.5,
+        }),
+        h('circle', {
+          ...style,
+          cx: x,
+          cy: y,
+          r: r - 3,
+          strokeWidth: 1.5,
+        }),
+        i,
+      )
+    }
+  }
+
+  class model extends CircleNodeModel {
+    constructor(data: NodeConfig, graphModel: GraphModel) {
+      if (!data.id) {
+        data.id = `Event_${genBpmnId()}`
+      }
+      if (!data.text) {
+        data.text = ''
+      }
+      if (data.text && typeof data.text === 'string') {
+        data.text = {
+          value: data.text,
+          x: data.x,
+          y: data.y + 40,
+        }
+      }
+      const { properties = {} } =
+        definition.intermediateThrowEvent?.get(
+          data.properties?.definitionType,
+        ) || {}
+      data.properties = {
+        ...properties,
+        ...data.properties,
+      }
+      data.properties?.definitionType &&
+        (data.properties!.definitionId = `Definition_${genBpmnId()}`)
+      super(data, graphModel)
+      groupRule.call(this)
+    }
+
+    setAttributes(): void {
+      this.r = 18
+    }
+  }
+
+  return {
+    type: 'bpmn:intermediateThrowEvent',
+    view,
+    model,
+  }
+}

package/src/bpmn-elements/presets/Event/StartEventFactory.ts

@@ -0,0 +1,114 @@
+/* eslint-disable @typescript-eslint/naming-convention */
+import {
+  h,
+  CircleNode,
+  CircleNodeModel,
+  GraphModel,
+  LogicFlow,
+} from '@logicflow/core'
+import { genBpmnId } from '../../utils'
+import NodeConfig = LogicFlow.NodeConfig
+
+export function StartEventFactory(lf: any): {
+  type: string
+  model: any
+  view: any
+} {
+  const [definition] = lf.useDefinition()
+
+  class view extends CircleNode {
+    getAnchorStyle() {
+      return {
+        visibility: 'hidden',
+      }
+    }
+
+    getShape() {
+      // @ts-ignore
+      const { model } = this.props
+      const style = model.getNodeStyle()
+      const { x, y, r, width, height, properties } = model as CircleNodeModel
+      const { definitionType, isInterrupting } = properties
+      const { icon } = definition.startEvent?.get(definitionType) || {}
+      const i = Array.isArray(icon)
+        ? h(
+            'g',
+            {
+              transform: `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`,
+            },
+            ...icon,
+          )
+        : h('path', {
+            transform: `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`,
+            d: icon,
+            style:
+              'fill: white; stroke-linecap: round; stroke-linejoin: round; stroke: rgb(34, 36, 42); stroke-width: 1px;',
+          })
+      return h(
+        'g',
+        {},
+        h('circle', {
+          ...style,
+          cx: x,
+          cy: y,
+          r,
+          strokeDasharray: isInterrupting ? '5,5' : '',
+          strokeWidth: 2,
+        }),
+        i,
+      )
+    }
+  }
+
+  class model extends CircleNodeModel {
+    constructor(data: NodeConfig, graphModel: GraphModel) {
+      if (!data.id) {
+        data.id = `Event_${genBpmnId()}`
+      }
+      if (!data.text) {
+        data.text = ''
+      }
+      if (data.text && typeof data.text === 'string') {
+        data.text = {
+          value: data.text,
+          x: data.x,
+          y: data.y + 40,
+        }
+      }
+      const { properties = {} } =
+        definition.startEvent?.get(data.properties?.definitionType) || {}
+      data.properties = {
+        ...properties,
+        ...data.properties,
+      }
+      data.properties?.definitionType &&
+        (data.properties!.definitionId = `Definition_${genBpmnId()}`)
+      super(data, graphModel)
+    }
+
+    setAttributes(): void {
+      this.r = 18
+    }
+
+    getConnectedTargetRules() {
+      const rules = super.getConnectedTargetRules()
+      const notAsSource = {
+        message: '起始节点不能作为边的终点',
+        validate: (_source: any, target: any) => {
+          if (target === this) {
+            return false
+          }
+          return true
+        },
+      }
+      rules.push(notAsSource)
+      return rules
+    }
+  }
+
+  return {
+    type: 'bpmn:startEvent',
+    view,
+    model,
+  }
+}

package/src/bpmn-elements/presets/Event/boundaryEventFactory.ts

@@ -0,0 +1,117 @@
+/* eslint-disable max-len */
+/* eslint-disable @typescript-eslint/naming-convention */
+import {
+  CircleNode,
+  CircleNodeModel,
+  GraphModel,
+  h,
+  LogicFlow,
+} from '@logicflow/core'
+import { genBpmnId, groupRule } from '../../utils'
+import NodeConfig = LogicFlow.NodeConfig
+
+export function BoundaryEventFactory(lf: any): {
+  type: string
+  model: any
+  view: any
+} {
+  const [definition] = lf.useDefinition()
+
+  class view extends CircleNode {
+    getAnchorStyle() {
+      return {
+        visibility: 'hidden',
+      }
+    }
+
+    getShape() {
+      // @ts-ignore
+      const { model } = this.props
+      const style = model.getNodeStyle()
+      const { x, y, r, width, height, properties } = model as CircleNodeModel
+      const { definitionType, cancelActivity } = properties
+      const { icon } = definition.boundaryEvent?.get(definitionType) || {}
+      const i = Array.isArray(icon)
+        ? h(
+            'g',
+            {
+              transform: `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`,
+            },
+            ...icon,
+          )
+        : h('path', {
+            transform: `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`,
+            d: icon,
+          })
+      return h(
+        'g',
+        {},
+        h('circle', {
+          ...style,
+          cx: x,
+          cy: y,
+          r,
+          strokeDasharray: cancelActivity ? '' : '5,5',
+          strokeWidth: 1.5,
+        }),
+        h('circle', {
+          ...style,
+          cx: x,
+          cy: y,
+          r: r - 3,
+          strokeDasharray: cancelActivity ? '' : '5,5',
+          strokeWidth: 1.5,
+        }),
+        i,
+      )
+    }
+  }
+
+  class model extends CircleNodeModel {
+    constructor(data: NodeConfig, graphModel: GraphModel) {
+      if (!data.id) {
+        data.id = `Event_${genBpmnId()}`
+      }
+      if (!data.text) {
+        data.text = ''
+      }
+      if (data.text && typeof data.text === 'string') {
+        data.text = {
+          value: data.text,
+          x: data.x,
+          y: data.y + 40,
+        }
+      }
+      const { properties = {} } =
+        definition.boundaryEvent?.get(data.properties?.definitionType) || {}
+
+      data.properties = {
+        attachedToRef: '',
+        cancelActivity: true,
+        ...properties,
+        ...data.properties,
+      }
+      data.properties?.definitionType &&
+        (data.properties!.definitionId = `Definition_${genBpmnId()}`)
+      super(data, graphModel)
+      groupRule.call(this)
+    }
+
+    initNodeData(data: any) {
+      super.initNodeData(data)
+      this.r = 20
+      this.autoToFront = false // 不自动设置到最顶部，而是使用自己的zIndex
+      this.zIndex = 99999 // 保证边界事件节点用于在最上方
+    }
+
+    setAttributes(): void {
+      this.r = 18
+    }
+  }
+
+  return {
+    type: 'bpmn:boundaryEvent',
+    view,
+    model,
+  }
+}

package/src/bpmn-elements/presets/Event/index.ts

@@ -0,0 +1,14 @@
+import LogicFlow from '@logicflow/core'
+import { EndEventFactory } from './EndEventFactory'
+import { IntermediateCatchEventFactory } from './IntermediateCatchEvent'
+import { StartEventFactory } from './StartEventFactory'
+import { BoundaryEventFactory } from './boundaryEventFactory'
+import { IntermediateThrowEventFactory } from './IntermediateThrowEvent'
+
+export function registerEventNodes(lf: LogicFlow) {
+  lf.register(StartEventFactory(lf))
+  lf.register(EndEventFactory(lf))
+  lf.register(IntermediateCatchEventFactory(lf))
+  lf.register(IntermediateThrowEventFactory(lf))
+  lf.register(BoundaryEventFactory(lf))
+}

package/src/bpmn-elements/presets/Flow/flow.d.ts

@@ -0,0 +1,6 @@
+export type BBoxType = {
+    minX: number;
+    minY: number;
+    maxX: number;
+    maxY: number;
+}

package/src/bpmn-elements/presets/Flow/index.ts

@@ -0,0 +1,8 @@
+import LogicFlow from '@logicflow/core'
+import { sequenceFlowFactory } from './sequenceFlow'
+
+export const SequenceFlow = sequenceFlowFactory()
+
+export function registerFlows(lf: LogicFlow) {
+  lf.register(SequenceFlow)
+}