Skip to main content

Interface: ElementTemplate

Defined in: diagram/customization.ts:53

Custom template to render a single diagram element.

Properties​

PropertyModifierTypeDescription

renderElement

readonly

(props) => ReactNode

Renders the element on the normal (non-SVG) canvas layer.

Note: this should be a pure function, not a React component by itself.

shape?

readonly

"ellipse" | "rect"

Assumed shape type for the rendered diagram element to correctly connect links and other geometry calculations.

Default

"rect"

supports?

readonly

Record<TemplateProperty, boolean>

Describes a set of template state properties supported by the template.

These capabilities are used by other components (e.g. selection actions, etc) while the template itself, however, can read and change any template property as needed.

Example: Element template which supports being expanded and resized by the user:

const MyTemplate: Reactodia.ElementTemplate = {
  renderElement: props => { ... },
  supports: {
    [Reactodia.TemplateProperties.Expanded]: true,
    [Reactodia.TemplateProperties.ElementSize]: true,
  }
}

Default

{}