App Canvas Block Reference

The schema(s) for canvas UI blocks can be found in our reference documentation under the Create an App canvas endpoint schema tab. Descriptions of each type of canvas UI block, along with visuals of how they appear in Benchling, are included below:

ButtonUiBlock

A ButtonUiBlock creates a button that users can interact with. The text value sets the button text, and the type field currently only supports the BUTTON value. Button blocks can trigger user interaction webhooks.

Example JSON

{
    "id": "submit1",
    "type": "BUTTON",
    "text": "Submit"
}

ChipUiBlock

A ChipUiBlock creates a "chip" that represents a Benchling entity. "Chips" are dynamic elements that can be clicked to take a user to the entity. The value field contains the Benchling API ID of the entity; the chip will appear in the canvas with the entity's label.
Example JSON

{
    "id": "chip1",
    "type": "CHIP",
    "value": "seq_ay0tljLF"
}

MarkdownUiBlock

A MarkdownUiBlock creates a section where the value field is rendered as markdown. Basic options like bold, italics, and links are supported.
Example JSON

{
    "type": "MARKDOWN",
    "value": "### This is a markdown text section\n---\nBasic markdown options like **bold**, _italics_, and [links]() are supported"
}

SearchInputUiBlock

A SearchInputUiBlock creates an input that allows users to search for Benchling entities. value should be null for new blocks, and will contain the API ID of user-selected result. itemType must be one of dna_sequence, dna_oligo, aa_sequence, custom_entity, mixture, box, container, location, or plate. schemaId is required; can be the API ID of a specific schema to limit results, or null othewise.
Example JSON

{
    "id": "input_block_1",
    "type": "SEARCH_INPUT",
    "itemType": "dna_sequence",
    "schemaId": null,
    "value": null,
    "enabled": true
}

SectionUiBlock

A SectionUiBlock acts as a container to group other blocks. Elements in the same section will appear inline (i.e. side-by-side), while elements in separate sections (or otherwise independent) will appear as discrete blocks (i.e. one of top of the other)
Example JSON

{
    "type": "LABEL",
    "text": "This is an input label"
},
{
    "id": "input_block_2",
    "type": "TEXT_INPUT",
    "placeholder": "Placeholder",
    "value": null,
    "enabled": true
}

{
      "type": "SECTION",
      "children": [
         {
            "type": "LABEL",
            "text": "This is an input label"
         },
        {
           "id": "input_block_2",
            "type": "TEXT_INPUT",
            "placeholder": "Placeholder",
            "value": null,
            "enabled": true,
            "canvasEnabled": true
        }
    ]
}

TextInputUiBlock

A TextInputUiBlock creates a plain-text input that users can fill. placeholder sets placeholder text; value should be set to null for new blocks, and will contain user-provided string.
Example JSON

{
     "id": "input_block_2",
    "type": "TEXT_INPUT",
    "placeholder": "Placeholder",
    "value": null,
    "enabled": true
}