Arrows Arrows2 Entities

Arrow Down

Preview

Usage

import { ArrowDown } from '@dinghy/diagrams/entitiesArrows2'

<ArrowDown/>

// or

import { extendStyle } from "@dinghy/base-components";
import { ARROW_DOWN } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0.6;dx=40;direction=south;notch=0;',
  },
  _width: 70,
  _height: 100,
}

Arrow Left

Preview

Usage

import { ArrowLeft } from '@dinghy/diagrams/entitiesArrows2'

<ArrowLeft/>

// or

import { extendStyle } from "@dinghy/base-components";
import { ARROW_LEFT } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0.6;dx=40;flipH=1;notch=0;',
  },
  _width: 100,
  _height: 70,
}

Arrow Right

Preview

Usage

import { ArrowRight } from '@dinghy/diagrams/entitiesArrows2'

<ArrowRight/>

// or

import { extendStyle } from "@dinghy/base-components";
import { ARROW_RIGHT } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0.6;dx=40;notch=0;',
  },
  _width: 100,
  _height: 70,
}

Arrow Up

Preview

Usage

import { ArrowUp } from '@dinghy/diagrams/entitiesArrows2'

<ArrowUp/>

// or

import { extendStyle } from "@dinghy/base-components";
import { ARROW_UP } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0.6;dx=40;direction=north;notch=0;',
  },
  _width: 70,
  _height: 100,
}

Bend Arrow

Preview

Usage

import { BendArrow } from '@dinghy/diagrams/entitiesArrows2'

<BendArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { BEND_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.bendArrow;dy=15;dx=38;notch=0;arrowHead=55;rounded=0;',
  },
  _original_width: 100,
  _original_height: 100,

}

Bend Arrow (rounded)

Preview

Usage

import { BendArrowRounded } from '@dinghy/diagrams/entitiesArrows2'

<BendArrowRounded/>

// or

import { extendStyle } from "@dinghy/base-components";
import { BEND_ARROW_ROUNDED } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.bendArrow;dy=15;dx=38;notch=0;arrowHead=55;rounded=1;',
  },
  _original_width: 100,
  _original_height: 100,

}

Bend Double Arrow

Preview

Usage

import { BendDoubleArrow } from '@dinghy/diagrams/entitiesArrows2'

<BendDoubleArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { BEND_DOUBLE_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.bendDoubleArrow;dy=15;dx=38;arrowHead=55;rounded=0;',
  },
  _original_width: 100,
  _original_height: 100,

}

Bend Double Arrow 2

Preview

Usage

import { BendDoubleArrow2 } from '@dinghy/diagrams/entitiesArrows2'

<BendDoubleArrow2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { BEND_DOUBLE_ARROW_2 } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.bendDoubleArrow;dy=15;dx=38;arrowHead=55;rounded=1;',
  },
  _original_width: 100,
  _original_height: 100,

}

Callout with Arrow

Preview

Usage

import { CalloutWithArrow } from '@dinghy/diagrams/entitiesArrows2'

<CalloutWithArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CALLOUT_WITH_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.calloutArrow;dy=10;dx=20;notch=60;arrowHead=10;',
  },
  _width: 100,
  _height: 60,
}

Callout with Double Arrow

Preview

Usage

import { CalloutWithDoubleArrow } from '@dinghy/diagrams/entitiesArrows2'

<CalloutWithDoubleArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CALLOUT_WITH_DOUBLE_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.calloutDoubleArrow;dy=10;dx=20;notch=24;arrowHead=10;',
  },
  _width: 100,
  _height: 50,
}

Callout with Double Arrow 90°

Preview

Usage

import { CalloutWithDoubleArrow90 } from '@dinghy/diagrams/entitiesArrows2'

<CalloutWithDoubleArrow90/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CALLOUT_WITH_DOUBLE_ARROW_90 } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.calloutDouble90Arrow;dy1=10;dx1=20;dx2=70;dy2=70;arrowHead=10;',
  },
  _original_width: 100,
  _original_height: 100,

}

Callout with Quad Arrow

Preview

Usage

import { CalloutWithQuadArrow } from '@dinghy/diagrams/entitiesArrows2'

<CalloutWithQuadArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CALLOUT_WITH_QUAD_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.calloutQuadArrow;dy=10;dx=20;notch=24;arrowHead=10;',
  },
  _original_width: 100,
  _original_height: 100,

}

Chevron Arrow

Preview

Usage

import { ChevronArrow } from '@dinghy/diagrams/entitiesArrows2'

<ChevronArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { CHEVRON_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0;dx=30;notch=30;',
  },
  _width: 100,
  _height: 60,
}

Jump-In Arrow

Preview

Usage

import { JumpInArrow } from '@dinghy/diagrams/entitiesArrows2'

<JumpInArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { JUMP_IN_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.jumpInArrow;dy=15;dx=38;arrowHead=55;',
  },
  _original_width: 100,
  _original_height: 100,

}

Notched Arrow

Preview

Usage

import { NotchedArrow } from '@dinghy/diagrams/entitiesArrows2'

<NotchedArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { NOTCHED_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0.6;dx=40;notch=15;',
  },
  _width: 100,
  _height: 70,
}

Notched Signal-In Arrow

Preview

Usage

import { NotchedSignalInArrow } from '@dinghy/diagrams/entitiesArrows2'

<NotchedSignalInArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { NOTCHED_SIGNAL_IN_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0;dx=10;notch=10;',
  },
  _width: 100,
  _height: 30,
}

Quad Arrow

Preview

Usage

import { QuadArrow } from '@dinghy/diagrams/entitiesArrows2'

<QuadArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { QUAD_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.quadArrow;dy=10;dx=20;notch=24;arrowHead=10;',
  },
  _original_width: 100,
  _original_height: 100,

}

Sharp Arrow

Preview

Usage

import { SharpArrow } from '@dinghy/diagrams/entitiesArrows2'

<SharpArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { SHARP_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.sharpArrow;dy1=0.67;dx1=18;dx2=18;notch=0;',
  },
  _width: 100,
  _height: 60,
}

Sharp Arrow 2

Preview

Usage

import { SharpArrow2 } from '@dinghy/diagrams/entitiesArrows2'

<SharpArrow2/>

// or

import { extendStyle } from "@dinghy/base-components";
import { SHARP_ARROW_2 } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.sharpArrow2;dy1=0.67;dx1=18;dx2=18;dy3=0.15;dx3=27;notch=0;',
  },
  _width: 100,
  _height: 60,
}

Signal-In Arrow

Preview

Usage

import { SignalInArrow } from '@dinghy/diagrams/entitiesArrows2'

<SignalInArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { SIGNAL_IN_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0;dx=10;notch=0;',
  },
  _width: 100,
  _height: 30,
}

Slender Arrow

Preview

Usage

import { SlenderArrow } from '@dinghy/diagrams/entitiesArrows2'

<SlenderArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { SLENDER_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.arrow;dy=0.67;dx=20;notch=0;',
  },
  _width: 100,
  _height: 60,
}

Slender Two Way Arrow

Preview

Usage

import { SlenderTwoWayArrow } from '@dinghy/diagrams/entitiesArrows2'

<SlenderTwoWayArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { SLENDER_TWO_WAY_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.twoWayArrow;dy=0.65;dx=22;',
  },
  _width: 100,
  _height: 60,
}

Striped Arrow

Preview

Usage

import { StripedArrow } from '@dinghy/diagrams/entitiesArrows2'

<StripedArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STRIPED_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.stripedArrow;dy=0.6;dx=40;notch=25;',
  },
  _width: 100,
  _height: 70,
}

Stylised Arrow

Preview

Usage

import { StylisedArrow } from '@dinghy/diagrams/entitiesArrows2'

<StylisedArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { STYLISED_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.stylisedArrow;dy=0.6;dx=40;notch=15;feather=0.4;',
  },
  _width: 100,
  _height: 60,
}

Tailed Arrow

Preview

Usage

import { TailedArrow } from '@dinghy/diagrams/entitiesArrows2'

<TailedArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { TAILED_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.tailedArrow;dy1=10;dx1=20;notch=0;arrowHead=20;dx2=25;dy2=30;',
  },
  _width: 100,
  _height: 60,
}

Tailed Arrow with Notch

Preview

Usage

import { TailedArrowWithNotch } from '@dinghy/diagrams/entitiesArrows2'

<TailedArrowWithNotch/>

// or

import { extendStyle } from "@dinghy/base-components";
import { TAILED_ARROW_WITH_NOTCH } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.tailedNotchedArrow;dy1=10;dx1=20;notch=20;arrowHead=20;dx2=25;dy2=30;',
  },
  _width: 100,
  _height: 60,
}

Triad Arrow

Preview

Usage

import { TriadArrow } from '@dinghy/diagrams/entitiesArrows2'

<TriadArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { TRIAD_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.triadArrow;dy=10;dx=20;arrowHead=40;',
  },
  _width: 100,
  _height: 70,
}

Two Way Arrow

Preview

Usage

import { TwoWayArrow } from '@dinghy/diagrams/entitiesArrows2'

<TwoWayArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { TWO_WAY_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.twoWayArrow;dy=0.6;dx=35;',
  },
  _width: 100,
  _height: 60,
}

U Turn Arrow

Preview

Usage

import { UTurnArrow } from '@dinghy/diagrams/entitiesArrows2'

<UTurnArrow/>

// or

import { extendStyle } from "@dinghy/base-components";
import { U_TURN_ARROW } from '@dinghy/diagrams/entitiesArrows2'

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

Definition

{
  _style: {
    entity: 'html=1;shadow=0;dashed=0;align=center;verticalAlign=middle;shape=mxgraph.arrows2.uTurnArrow;dy=11;arrowHead=43;dx2=25;',
  },
  _original_width: 100,
  _original_height: 100,

}