Skip to main content

ShapePaletteComponentProps

Props for the ShapePaletteComponent

Properties​

allowClickToAdd?​

optional allowClickToAdd: boolean

When in tap mode, allow addition of new vertices simply by clicking, instead of requiring a shape be drawn. (When this is true, the drawing method also still works)

allowDropOnEdge?​

optional allowDropOnEdge: boolean

Whether or not to allow drop on edge. Defaults to false.

allowRotation?​

optional allowRotation: boolean

Whether or not to allow rotation of elements being dragged. Defaults to true.

autoEdgeConnect?​

optional autoEdgeConnect: boolean | AutoEdgeConnectOptions

If true, the palette will automatically connect a new vertex being dragged onto the canvas to existing vertices, if the shape definitions for the new vertex and/or the existing vertices have source/target elements.

dataGenerator?​

optional dataGenerator: DataGeneratorFunction

Optional function you can use to set some initial data for an element being dragged. Note that you cannot override the object's type with this function.

dragSize?​

optional dragSize: Size

Optional size to use for dragged elements.

fill?​

optional fill: string

Optional fill color to use for dragged elements. This should be in RGB format, not a color like 'white' or 'cyan' etc

iconSize?​

optional iconSize: Size

Optional size to use for icons

inspector?​

optional inspector: boolean

When true, selecting an element in the canvas will cause its related shape to be selected in the palette. Defaults to true.

mode?​

optional mode: "tap" | "drag"

Mode of operation, supported values are "tap" and "drag" - default is "drag".

onVertexAdded?​

optional onVertexAdded: OnVertexAddedCallback

Optional callback to invoke when a vertex has been dragged onto/dropped on the canvas

outline?​

optional outline: string

Optional color to use for outline of dragged elements. Should be in RGB format.

paletteStrokeWidth?​

optional paletteStrokeWidth: number

Stroke width to use for shapes in palette. Defaults to 1.

preparedShapes?​

optional preparedShapes: PreparedShape[]

Optional set of prepared shapes to show in the palette. When this is provided, the palette will only render these shapes, and not the contents of the shape library.

rotationSpeed?​

optional rotationSpeed: number

The number of milliseconds required to complete a full rotation of an element when the trigger key is held down. Defaults to 2000.

selectAfterDrop?​

optional selectAfterDrop: boolean

When true (which is the default), a newly dropped vertex will be set as the underlying model's selection.

showAllMessage?​

optional showAllMessage: string

Message to use for the 'show all' option in the shape set drop down when there is more than one set of shapes. Defaults to Show all.

showGroups?​

optional showGroups: boolean

Whether or not to show groups in the palette. Defaults to true.

surfaceId?​

optional surfaceId: string

ID of the surface to attach to. This is optional; Visually JS will use the default surface ID if you do not provide this. For apps where there's only one surface there is no need to provide this.

updateTypeOnPaletteTap?​

optional updateTypeOnPaletteTap: boolean

When true, clicking on an entry in the palette will change the type of any selected vertices to that type. Defaults to false. This is a potentially destructive operation if the properties of the new shape type are not compatible with the old one.