BPMN 2.0 General Entities

Annotation

Preview

Usage

import { Annotation } from '@dinghy/diagrams/entitiesBpmn2General'

<Annotation/>

// or

import { extendStyle } from "@dinghy/base-components";
import { ANNOTATION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, ANNOTATION)}
  />

Definition

{
  _style: {
    entity: 'html=1;shape=mxgraph.flowchart.annotation_2;align=left;labelPosition=right;',
  },
  _width: 50,
  _height: 100,
}

Call Conversation

Preview

Usage

import { CallConversation } from '@dinghy/diagrams/entitiesBpmn2General'

<CallConversation/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CALL_CONVERSATION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, CALL_CONVERSATION)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.conversation2;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;aspect=fixed;bpmnConversationType=call;',
  },
  _original_width: 70,
  _original_height: 60,

}

Call Sub-Conversation

Preview

Usage

import { CallSubConversation } from '@dinghy/diagrams/entitiesBpmn2General'

<CallSubConversation/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CALL_SUB_CONVERSATION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, CALL_SUB_CONVERSATION)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.conversation2;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;aspect=fixed;bpmnConversationType=call;isLoopSub=1;',
  },
  _original_width: 70,
  _original_height: 60,

}

Conversation

Preview

Usage

import { Conversation } from '@dinghy/diagrams/entitiesBpmn2General'

<Conversation/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CONVERSATION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, CONVERSATION)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.conversation2;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;aspect=fixed;bpmnConversationType=conv;',
  },
  _original_width: 70,
  _original_height: 60,

}

Cross-Functional Flowchart

Preview

Usage

import { CrossFunctionalFlowchart } from '@dinghy/diagrams/entitiesBpmn2General'

<CrossFunctionalFlowchart/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CROSS_FUNCTIONAL_FLOWCHART } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, CROSS_FUNCTIONAL_FLOWCHART)}
  />

Definition

{
  _style: {
    entity: 'shape=table;childLayout=tableLayout;startSize=40;collapsible=0;recursiveResize=0;expand=0;fontSize=16;fontStyle=1',
  },
  _original_width: 400,
  _original_height: 400,

}

Data Input

Preview

Usage

import { DataInput } from '@dinghy/diagrams/entitiesBpmn2General'

<DataInput/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_INPUT } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_INPUT)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.data2;labelPosition=center;verticalLabelPosition=bottom;align=center;verticalAlign=top;size=15;html=1;bpmnTransferType=input;',
  },
  _width: 40,
  _height: 60,
}

Data Input Collection

Preview

Usage

import { DataInputCollection } from '@dinghy/diagrams/entitiesBpmn2General'

<DataInputCollection/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_INPUT_COLLECTION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_INPUT_COLLECTION)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.data2;labelPosition=center;verticalLabelPosition=bottom;align=center;verticalAlign=top;size=15;html=1;bpmnTransferType=input;isCollection=1;',
  },
  _width: 40,
  _height: 60,
}

Data Object

Preview

Usage

import { DataObject } from '@dinghy/diagrams/entitiesBpmn2General'

<DataObject/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_OBJECT } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_OBJECT)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.data2;labelPosition=center;verticalLabelPosition=bottom;align=center;verticalAlign=top;size=15;html=1;',
  },
  _width: 40,
  _height: 60,
}

Data Object 2

Preview

Usage

import { DataObject2 } from '@dinghy/diagrams/entitiesBpmn2General'

<DataObject2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_OBJECT_2 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_OBJECT_2)}
  />

Definition

{
  _style: {
    entity: 'points=[[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0.25,0],[1,0.5,0],[1,0.75,0],[0.75,1,0],[0.5,1,0],[0.25,1,0],[0,0.75,0],[0,0.5,0],[0,0.25,0]];rounded=1;dashed=1;dashPattern=5 2 1 2;labelPosition=center;verticalLabelPosition=middle;align=center;verticalAlign=middle;fontSize=8;html=1;whiteSpace=wrap;',
  },
  _width: 140,
  _height: 80,
}

Data Object Collection

Preview

Usage

import { DataObjectCollection } from '@dinghy/diagrams/entitiesBpmn2General'

<DataObjectCollection/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_OBJECT_COLLECTION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_OBJECT_COLLECTION)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.data2;labelPosition=center;verticalLabelPosition=bottom;align=center;verticalAlign=top;size=15;html=1;bpmnTransferType=none;isCollection=1;',
  },
  _width: 40,
  _height: 60,
}

Data Output

Preview

Usage

import { DataOutput } from '@dinghy/diagrams/entitiesBpmn2General'

<DataOutput/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_OUTPUT } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_OUTPUT)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.data2;labelPosition=center;verticalLabelPosition=bottom;align=center;verticalAlign=top;size=15;html=1;bpmnTransferType=output;',
  },
  _width: 40,
  _height: 60,
}

Data Output Collection

Preview

Usage

import { DataOutputCollection } from '@dinghy/diagrams/entitiesBpmn2General'

<DataOutputCollection/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_OUTPUT_COLLECTION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_OUTPUT_COLLECTION)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.data2;labelPosition=center;verticalLabelPosition=bottom;align=center;verticalAlign=top;size=15;html=1;bpmnTransferType=output;isCollection=1;',
  },
  _width: 40,
  _height: 60,
}

Data Store

Preview

Usage

import { DataStore } from '@dinghy/diagrams/entitiesBpmn2General'

<DataStore/>

// or

import { extendStyle } from "@dinghy/base-components";
import { DATA_STORE } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, DATA_STORE)}
  />

Definition

{
  _style: {
    entity: 'shape=datastore;html=1;labelPosition=center;verticalLabelPosition=bottom;align=center;verticalAlign=top;',
  },
  _original_width: 100,
  _original_height: 100,

}

Group

Preview

Usage

import { Group } from '@dinghy/diagrams/entitiesBpmn2General'

<Group/>

// or

import { extendStyle } from "@dinghy/base-components";
import { GROUP } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, GROUP)}
  />

Definition

{
  _style: {
    entity: 'points=[[0.25,0,0],[0.5,0,0],[0.75,0,0],[1,0.25,0],[1,0.5,0],[1,0.75,0],[0.75,1,0],[0.5,1,0],[0.25,1,0],[0,0.75,0],[0,0.5,0],[0,0.25,0]];rounded=1;arcSize=10;dashed=1;fillColor=none;gradientColor=none;dashPattern=8 3 1 3;strokeWidth=2;whiteSpace=wrap;html=1;',
  },
  _original_width: 200,
  _original_height: 200,

}

Horizontal Lane

Preview

Usage

import { HorizontalLane } from '@dinghy/diagrams/entitiesBpmn2General'

<HorizontalLane/>

// or

import { extendStyle } from "@dinghy/base-components";
import { HORIZONTAL_LANE } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, HORIZONTAL_LANE)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;startSize=20;fontStyle=0;collapsible=0;horizontal=0;swimlaneLine=0;fillColor=none;whiteSpace=wrap;',
  },
  _width: 440,
  _height: 100,
}

Horizontal Lane 2

Preview

Usage

import { HorizontalLane2 } from '@dinghy/diagrams/entitiesBpmn2General'

<HorizontalLane2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { HORIZONTAL_LANE_2 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, HORIZONTAL_LANE_2)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;startSize=20;fontStyle=0;collapsible=0;horizontal=0;swimlaneLine=1;swimlaneFillColor=#ffffff;strokeWidth=2;whiteSpace=wrap;',
  },
  _width: 440,
  _height: 100,
}

Horizontal Lane 3

Preview

Usage

import { HorizontalLane3 } from '@dinghy/diagrams/entitiesBpmn2General'

<HorizontalLane3/>

// or

import { extendStyle } from "@dinghy/base-components";
import { HORIZONTAL_LANE_3 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, HORIZONTAL_LANE_3)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.swimlane;html=1;startSize=20;horizontal=0;swimlaneLine=1;collapsible=0;fontStyle=0;swimlaneFillColor=#ffffff;strokeWidth=2;isCollection=1;whiteSpace=wrap;',
  },
  _width: 440,
  _height: 100,
}

Horizontal Pool 1

Preview

Usage

import { HorizontalPool1 } from '@dinghy/diagrams/entitiesBpmn2General'

<HorizontalPool1/>

// or

import { extendStyle } from "@dinghy/base-components";
import { HORIZONTAL_POOL_1 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, HORIZONTAL_POOL_1)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;childLayout=stackLayout;resizeParent=1;resizeParentMax=0;horizontal=1;startSize=20;horizontalStack=0;whiteSpace=wrap;',
  },
  _width: 480,
  _height: 380,
}

Horizontal Pool 2

Preview

Usage

import { HorizontalPool2 } from '@dinghy/diagrams/entitiesBpmn2General'

<HorizontalPool2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { HORIZONTAL_POOL_2 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, HORIZONTAL_POOL_2)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;childLayout=stackLayout;resizeParent=1;resizeParentMax=0;horizontal=0;startSize=20;horizontalStack=0;whiteSpace=wrap;',
  },
  _width: 480,
  _height: 360,
}

Horizontal Swimlane

Preview

Usage

import { HorizontalSwimlane } from '@dinghy/diagrams/entitiesBpmn2General'

<HorizontalSwimlane/>

// or

import { extendStyle } from "@dinghy/base-components";
import { HORIZONTAL_SWIMLANE } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, HORIZONTAL_SWIMLANE)}
  />

Definition

{
  _style: {
    entity: 'swimlane;startSize=20;horizontal=0;html=1;whiteSpace=wrap;',
  },
  _width: 320,
  _height: 120,
}

Sub-Conversation

Preview

Usage

import { SubConversation } from '@dinghy/diagrams/entitiesBpmn2General'

<SubConversation/>

// or

import { extendStyle } from "@dinghy/base-components";
import { SUB_CONVERSATION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, SUB_CONVERSATION)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.conversation2;perimeter=hexagonPerimeter2;whiteSpace=wrap;html=1;aspect=fixed;bpmnConversationType=conv;isLoopSub=1;',
  },
  _original_width: 70,
  _original_height: 60,

}

Text Annotation

Preview

Usage

import { TextAnnotation } from '@dinghy/diagrams/entitiesBpmn2General'

<TextAnnotation/>

// or

import { extendStyle } from "@dinghy/base-components";
import { TEXT_ANNOTATION } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, TEXT_ANNOTATION)}
  />

Definition

{
  _style: {
    entity: 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;rounded=0;',
  },
  _width: 80,
  _height: 30,
}

Vertical Lane

Preview

Usage

import { VerticalLane } from '@dinghy/diagrams/entitiesBpmn2General'

<VerticalLane/>

// or

import { extendStyle } from "@dinghy/base-components";
import { VERTICAL_LANE } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, VERTICAL_LANE)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;startSize=20;fontStyle=0;collapsible=0;horizontal=1;swimlaneLine=0;fillColor=none;whiteSpace=wrap;',
  },
  _width: 440,
  _height: 100,
}

Vertical Lane 2

Preview

Usage

import { VerticalLane2 } from '@dinghy/diagrams/entitiesBpmn2General'

<VerticalLane2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { VERTICAL_LANE_2 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, VERTICAL_LANE_2)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;startSize=20;fontStyle=0;collapsible=0;horizontal=1;swimlaneLine=1;strokeWidth=2;swimlaneFillColor=#ffffff;whiteSpace=wrap;',
  },
  _width: 220,
  _height: 100,
}

Vertical Lane 3

Preview

Usage

import { VerticalLane3 } from '@dinghy/diagrams/entitiesBpmn2General'

<VerticalLane3/>

// or

import { extendStyle } from "@dinghy/base-components";
import { VERTICAL_LANE_3 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, VERTICAL_LANE_3)}
  />

Definition

{
  _style: {
    entity: 'shape=mxgraph.bpmn.swimlane;html=1;startSize=20;horizontal=1;swimlaneLine=1;collapsible=0;fontStyle=0;strokeWidth=2;swimlaneFillColor=#ffffff;isCollection=1;whiteSpace=wrap;',
  },
  _width: 220,
  _height: 100,
}

Vertical Pool 1

Preview

Usage

import { VerticalPool1 } from '@dinghy/diagrams/entitiesBpmn2General'

<VerticalPool1/>

// or

import { extendStyle } from "@dinghy/base-components";
import { VERTICAL_POOL_1 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, VERTICAL_POOL_1)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;childLayout=stackLayout;resizeParent=1;resizeParentMax=0;startSize=20;whiteSpace=wrap;',
  },
  _width: 360,
  _height: 480,
}

Vertical Pool 2

Preview

Usage

import { VerticalPool2 } from '@dinghy/diagrams/entitiesBpmn2General'

<VerticalPool2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { VERTICAL_POOL_2 } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, VERTICAL_POOL_2)}
  />

Definition

{
  _style: {
    entity: 'swimlane;html=1;childLayout=stackLayout;resizeParent=1;resizeParentMax=0;startSize=20;horizontal=0;horizontalStack=1;whiteSpace=wrap;',
  },
  _width: 380,
  _height: 480,
}

Vertical Swimlane

Preview

Usage

import { VerticalSwimlane } from '@dinghy/diagrams/entitiesBpmn2General'

<VerticalSwimlane/>

// or

import { extendStyle } from "@dinghy/base-components";
import { VERTICAL_SWIMLANE } from '@dinghy/diagrams/entitiesBpmn2General'

<Shape 
  {...props}
  _style={extendStyle(props, VERTICAL_SWIMLANE)}
  />

Definition

{
  _style: {
    entity: 'swimlane;startSize=20;whiteSpace=wrap;html=1;',
  },
  _width: 120,
  _height: 320,
}