Heads up! These docs are still a work in progress.

FlexiAdd

A component that allows you to drag in new widgets into a board.

FlexiAdd (component)

Props

NameTypeDescription
childrenSnippet<[{ adder: FlexiAddController; props: FlexiAddChildrenProps }]>The child content of the adder, containing some button-like element. In order to use the `FlexiAdd` component, your children must be button-like and spread the `props` passed.
addWidget() => AdderWidgetConfigurationWhen the user interacts with the adder, this function allows you to specify the configuration of the widget that is created and grabbed.
controllerFlexiAddController (bindable)The controller for the adder.
onfirstcreate(controller: FlexiAddController) => voidA callback that fires when the adder's controller is first created.

FlexiAddController

FlexiAdd uses a controller to manage its state and behaviour. You can access the controller via binding to the controller prop or using the onfirstcreate callback.

The FlexiAddController allows you to manage the board directly and carry out actions.

Properties

NameTypeDescription
newWidgetFlexiWidgetController | undefinedThe widget that is currently being dragged in.

AdderWidgetConfiguration

AdderWidgetConfiguration allows you to specify the configuration of the widget that is created and grabbed, as well as the initial width and height that the grabbed widget will have.

Properties

NameTypeDescription
widgetFlexiWidgetConfigurationThe configuration of the widget that is created and grabbed.
widthPxnumberThe initial width of the grabbed widget in pixels.
heightPxnumberThe initial height of the grabbed widget in pixels.