Sysml Stereotypes Entities

Stereotype (Compartment)

Preview

Usage

import { StereotypeCompartment } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeCompartment/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_COMPARTMENT } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'shape=rect;html=1;overflow=fill;whiteSpace=wrap;align=center;',
  },
  _width: 400,
  _height: 100,
}

Stereotype (Compartment) 2

Preview

Usage

import { StereotypeCompartment2 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeCompartment2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_COMPARTMENT_2 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'fontStyle=1;align=center;verticalAlign=middle;childLayout=stackLayout;horizontal=1;horizontalStack=0;resizeParent=1;resizeParentMax=0;resizeLast=0;marginBottom=0;',
  },
  _width: 0,
  _height: 120,
}

Stereotype (Edge)

Preview

Usage

import { StereotypeEdge } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeEdge/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_EDGE } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'endArrow=none;html=1;edgeStyle=none;labelBackgroundColor=none;align=left;fontStyle=1;fontSize=10;',
  },
  _width: 2,
  _height: 180,
}

Stereotype (Node)

Preview

Usage

import { StereotypeNode } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeNode/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_NODE } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'shape=rect;html=1;whiteSpace=wrap;align=center;',
  },
  _width: 160,
  _height: 80,
}

Stereotype Note

Preview

Usage

import { StereotypeNote } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeNote/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_NOTE } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'shape=note;size=15;spacingLeft=5;html=1;overflow=fill;whiteSpace=wrap;',
  },
  _width: 320,
  _height: 150,
}

Stereotype Note 2

Preview

Usage

import { StereotypeNote2 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeNote2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_NOTE_2 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'shape=rect;fontStyle=1;html=1;whiteSpace=wrap;align=center;',
  },
  _width: 1,
  _height: 150,
}

Stereotype Note 3

Preview

Usage

import { StereotypeNote3 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeNote3/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_NOTE_3 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'rounded=0;labelBackgroundColor=none;verticalAlign=top;endArrow=none;fontStyle=1;html=1;',
  },
  _width: 3,
  _height: 150,
}

Stereotype Note 4

Preview

Usage

import { StereotypeNote4 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

<StereotypeNote4/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STEREOTYPE_NOTE_4 } from '@dinghy/diagrams/entitiesSysmlStereotypes'

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

Definition

{
  _style: {
    entity: 'rounded=0;endArrow=none;dashed=1;html=1;',
  },
  _width: 4,
  _height: 150,
}