Control

The smallest building block in a flow. Typically a Control is represented by some kind of visual component together with data from some data source.

Control types

Two categories of controls are available:

• Basic

• Advanced.

Basic controls are comparable to simple HTML inputs, such as checkboxes.

Advanced controls are more like mini-applications with specific goals. For example, they could display a list of Entra-ID users or groups as the first step in a Flow.

Both types are implemented on the front-end using react-jsonschema-form.

Structure of control configuration

All controls follow the same structure:

{
    "type": "<controlType>",
    "id": "<controlId>",
    "config": {
        "required": true,
        "read_only": false
    },
    "data": "<data>",
    "ui": {},
    "schema": {}
}

type: Defines what control to be used.

id: Unique identifier to the current flow. In subsequent pipe calls the id is sent to the pipe along with value(s) from the control and accessed in the piped using {{request.<id>}}

config: Block of control-specific configuration. Se each control for appropriate values.

data: Value to be injected in control.

ui: Any additional ui-related data sent to frontend, unfiltered. See https://rjsf-team.github.io/react-jsonschema-form/ UISchema for more information. Typically this is used for layout management.

schema: Any additional control-related data not available in current control implementation.

Binding data to a control

Data binding is typically done using "data" configuration for a control. Most likely date is set by using some template {{flow.givenName}}.

Not all controls rely on data. Read documentation for appropriate control.