Archimate3 Application Entities

Application Collaboration

Preview
Usage
Definition

import { ApplicationCollaboration } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationCollaboration/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_COLLABORATION } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=collab;archiType=square;',
  },
  _width: 150,
  _height: 75,
}

Application Component

Preview
Usage
Definition

import { ApplicationComponent } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationComponent/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_COMPONENT } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=comp;archiType=square;',
  },
  _width: 150,
  _height: 75,
}

Application Event

Preview
Usage
Definition

import { ApplicationEvent } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationEvent/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_EVENT } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=event;archiType=rounded',
  },
  _width: 150,
  _height: 75,
}

Application Function

Preview
Usage
Definition

import { ApplicationFunction } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationFunction/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_FUNCTION } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=func;archiType=rounded;',
  },
  _width: 150,
  _height: 75,
}

Application Interaction

Preview
Usage
Definition

import { ApplicationInteraction } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationInteraction/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_INTERACTION } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=interaction;archiType=rounded;',
  },
  _width: 150,
  _height: 75,
}

Application Interface

Preview
Usage
Definition

import { ApplicationInterface } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationInterface/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_INTERFACE } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=interface;archiType=square;',
  },
  _width: 150,
  _height: 75,
}

Application Process

Preview
Usage
Definition

import { ApplicationProcess } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationProcess/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_PROCESS } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=proc;archiType=rounded;',
  },
  _width: 150,
  _height: 75,
}

Application Service

Preview
Usage
Definition

import { ApplicationService } from '@dinghy/diagrams/entitiesArchimate3Application'

<ApplicationService/>

// or

import { extendStyle } from "@dinghy/base-components";
import { APPLICATION_SERVICE } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=serv;archiType=rounded',
  },
  _width: 150,
  _height: 75,
}

Collaboration

Preview
Usage
Definition

import { Collaboration } from '@dinghy/diagrams/entitiesArchimate3Application'

<Collaboration/>

// or

import { extendStyle } from "@dinghy/base-components";
import { COLLABORATION } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.collaboration;',
  },
  _width: 60,
  _height: 35,
}

Component

Preview
Usage
Definition

import { Component } from '@dinghy/diagrams/entitiesArchimate3Application'

<Component/>

// or

import { extendStyle } from "@dinghy/base-components";
import { COMPONENT } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.component;',
  },
  _original_width: 48,
  _original_height: 40,

}

Data Object

Preview
Usage
Definition

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

<DataObject/>

// or

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

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.application;appType=passive;archiType=square;',
  },
  _width: 150,
  _height: 75,
}

Data Object 2

Preview
Usage
Definition

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

<DataObject2/>

// or

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

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.businessObject;overflow=fill;',
  },
  _width: 70,
  _height: 40,
}

Event

Preview
Usage
Definition

import { Event } from '@dinghy/diagrams/entitiesArchimate3Application'

<Event/>

// or

import { extendStyle } from "@dinghy/base-components";
import { EVENT } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.event;',
  },
  _width: 60,
  _height: 35,
}

Function

Preview
Usage
Definition

import { Function } from '@dinghy/diagrams/entitiesArchimate3Application'

<Function/>

// or

import { extendStyle } from "@dinghy/base-components";
import { FUNCTION } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.function;',
  },
  _width: 60,
  _height: 40,
}

Interaction

Preview
Usage
Definition

import { Interaction } from '@dinghy/diagrams/entitiesArchimate3Application'

<Interaction/>

// or

import { extendStyle } from "@dinghy/base-components";
import { INTERACTION } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.interaction;',
  },
  _original_width: 40,
  _original_height: 40,

}

Interface

Preview
Usage
Definition

import { Interface } from '@dinghy/diagrams/entitiesArchimate3Application'

<Interface/>

// or

import { extendStyle } from "@dinghy/base-components";
import { INTERFACE } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.interface;',
  },
  _width: 70,
  _height: 35,
}

Process

Preview
Usage
Definition

import { Process } from '@dinghy/diagrams/entitiesArchimate3Application'

<Process/>

// or

import { extendStyle } from "@dinghy/base-components";
import { PROCESS } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.process;',
  },
  _width: 60,
  _height: 30,
}

Service

Preview
Usage
Definition

import { Service } from '@dinghy/diagrams/entitiesArchimate3Application'

<Service/>

// or

import { extendStyle } from "@dinghy/base-components";
import { SERVICE } from '@dinghy/diagrams/entitiesArchimate3Application'

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

{
  _style: {
    entity: 'html=1;outlineConnect=0;whiteSpace=wrap;fillColor=#99ffff;shape=mxgraph.archimate3.service;',
  },
  _width: 60,
  _height: 35,
}

Application Collaboration​

Application Component​

Application Event​

Application Function​

Application Interaction​

Application Interface​

Application Process​

Application Service​

Collaboration​

Component​

Data Object​

Data Object 2​

Event​

Function​

Interaction​

Interface​

Process​

Service​

Application Collaboration

Application Component

Application Event

Application Function

Application Interaction

Application Interface

Application Process

Application Service

Collaboration

Component

Data Object

Data Object 2

Event

Function

Interaction

Interface

Process

Service