Element Reference

Element Reference

Detailed reference documentation for each Workflow Element type and the contents of its opts object. Element-level properties that apply to every Element type are documented in the User Guide under “Common Element Properties” and are not repeated here.

Contents:

• Buttons

• DataTable

• ImageViewer

• Label

• Markdown

• MarkdownEditor

• NodeEditor

• NodeViewer

• PowerupConfig

• QueryBar

• QueryEditor

• Spinner

• StormConsole

• StormEditor

• StormForm

• StormTable

• TabsLayout

• TextArea

• Shared Types

Buttons: buttons

The buttons Element displays a row of buttons that execute Actions when clicked.

Each entry is either a button (clickable) or a toggle (boolean state). Both share the definitions used by the buttons opt of other Elements such as stormform. Button state can be updated at runtime via an updateopts Action followed by a refresh.

Element Opts

The opts object on a buttons Element accepts the following properties:

Property	Type	Required	Default	Description
buttons	Button[]	-		The buttons that will be displayed in the Element.
justify	center | left | right			How to justify the buttons inside the Element.
orientation	horizontal | vertical		horizontal	How to orient the buttons inside the Element.

Example:

type: buttons
opts:
  orientation: horizontal
  justify: left
  buttons:
    - text: Run
      icon: PLAY
      onclick:
        - type: eventfire
          opts:
            event: onvars
    - type: toggle
      label: Live
      name: live

DataTable: datatable

The datatable Element displays arbitrary record data as a sortable, optionally selectable table.

Rows are streamed in by a storm Action firing $lib.fire() messages with type optic:datatable:row. Each column declares a label (header text) and a key that derefs the corresponding field from the row record. Columns can be configured statically up-front, or replaced at runtime: a storm Action may fire an optic:datatable:init message whose opts dict patches the Element’s opts and triggers a refresh before any row messages are processed.

Element Opts

The opts object on a datatable Element accepts the following properties:

Property	Type	Required	Default	Description
columns	DataTableColumn[]			The columns to be displayed in the table in order.
csvexport	boolean		false	Enable a menu option to export the table as CSV for immediate download.
disableselect	boolean		false	Disable normal single selection.
emptymesg	string			Provide a message to be displayed when the table is empty.
menu	Menu			Table row menu configuration.
multiselect	boolean		false	Enable multiselect.
onselect	Action[]			Actions to be run when the node selection has changed.
selectionstyle	bg | fg		fg	If Row selection style should have a foreground or background highlight.

Static columns, rows streamed from a `storm` Action:

type: datatable
opts:
  columns:
    - iden: name
      key: name
      label: Name
    - iden: kind
      key: kind
      label: Kind
  multiselect: true
  csvexport: true
oninit:
  - type: storm
    opts:
      query: |
        for $row in $rows {
            $lib.fire('optic:datatable:row', row=$row)
        }

Columns reconfigured at runtime via `optic:datatable:init`:

type: datatable
opts:
  csvexport: true
oninit:
  - type: storm
    opts:
      query: |
        $cols = ([
            ({"iden": "name", "key": "name", "label": "Name"}),
            ({"iden": "score", "key": "score", "label": "Score"})
        ])
        $lib.fire('optic:datatable:init', opts=({"columns": $cols}))
        for $row in $rows {
            $lib.fire('optic:datatable:row', row=$row)
        }

DataTableColumn

Column configuration for a datatable Element.

Property	Type	Required	Default	Description
iden	string	-		The iden that the column can be referenced and identified by.
default	string			The default value to display if the row data has no value for key.
disableresize	boolean		false	Set true to disable column resizing for the column.
key	string			Key to lookup in OpticTableRow.data to find the valu that will be passed to repr().
label	string			The label to be used in the column header.
sortable	boolean		true	If the column should be sortable.
tooltip	boolean		true	Display a tooltip for when a cell’s content overflows the available width or height.
type	string			Optional Synapse type to repr the data as.
width	object | string			A string or object to configure a fixed width or min and/or max width for the column.

Menu Options

Table row menu configuration.

Property	Type	Required	Default	Description
items	DataTableMenuOption[]	-		Menu items to be be displayed for the Row.

DataTableMenuOption

Menu option for a datatable Element row context menu.

Property	Type	Required	Default	Description
classes	string[]			An optional array of classNames to add to the item.
disabled	string | boolean			If the menu item should be disabled or not.
extraSearchTerms	string[]			Additional strings to use for matching when the user is searching.
hidden	string | boolean			If the menu item should be hidden or not.
hint	string			An optional item hint that is displayed with a muted style, after the text.
icon	OpticIconName			An optional icon to display for the menu option.
iconRight	boolean			Display the icon to the right of the text.
id	string			An optional Element ID to be set on the item’s DOM element.
onclick	Action[]			Actions to execute when the menu option is clicked.
only	Only			Special conditions that can determine whether to hide/show the option.
options	MenuOption[]			Optional sub-menu options.
text	string			The text label for the option in the menu.
textvar	string			Optionally provide a var that will be resolved to a value that will used as the menu text.
tooltip	string			Text to use as a tooltip.
value	any			An Optional value of any type to catch in the onselect if desired.

DataTableMenuOption / only

Special conditions that can determine whether to hide/show the option.

Property	Type	Required	Default	Description
singleselect	boolean		false	Only display this option when there is a single row selected.

ImageViewer: imageviewer

The imageviewer Element renders a single image in the Workflow grid. The image source may be an HTTP URL or a Synapse file:bytes SHA-256 (loaded from the active Cortex axon). The runtime detects URLs by attempting to parse the value as one; anything else is fetched as a SHA-256 from the axon, with an optional sha256: prefix that is stripped before lookup.

URL-style images must be supplied through imgvar or a callstorm Action so the value passes through URL detection - the static img opt only resolves through the axon.

Element Opts

The opts object on a imageviewer Element accepts the following properties:

Property	Type	Required	Default	Description
img	string			A static image source.
imgvar	string			A $var to resolve as the image source.

Static SHA-256 (axon-resolved):

type: imageviewer
opts:
  img: 1d4f3a02a33c...d7

Var-driven URL or SHA-256:

type: imageviewer
opts:
  imgvar: imgsrc
oninit:
  - type: updatevars
    opts:
      operations:
        - type: set
          name: imgsrc
          value: https://example.com/logo.png
  - type: refresh

Populated from a `callstorm` Action (returns a SHA-256 or URL):

type: imageviewer
oninit:
  - type: callstorm
    opts:
      query: |
        ps:contact:photo
        return($node.props.photo)

Label: label

The label Element displays a single string of plain text, sourced statically or from a $var. A callstorm Action replaces the displayed text with the query’s return value.

Element Opts

The opts object on a label Element accepts the following properties:

Property	Type	Required	Default	Description
text	string			Optional static value to be displayed in the Element.
textvar	string			Optional var to resolve to a string to display in the Element.

Static text:

type: label
opts:
  text: Welcome to the workflow

Var-driven text:

type: label
opts:
  textvar: greeting
oninit:
  - type: updatevars
    opts:
      operations:
        - type: set
          name: greeting
          value: Hello, world!

Markdown: markdown

The markdown Element renders markdown content sourced statically or from a $var. A callstorm Action whose query returns a string replaces the rendered markdown.

Element Opts

The opts object on a markdown Element accepts the following properties:

Property	Type	Required	Default	Description
markdown	string			Optional static markdown to be displayed in the Element.
markdownvar	string			Optional var to resolve to markdown to display in the Element.

Static markdown:

type: markdown
opts:
  markdown: |
    ## Hello

    This is a **markdown** Element.

Var-driven markdown:

type: markdown
opts:
  markdownvar: details

Markdown returned by a `callstorm` Action (replaces the rendered content):

type: markdown
oninit:
  - type: callstorm
    opts:
      query: |
        return($lib.str.format("## {n}\n{d}", n=$name, d=$desc))

MarkdownEditor: markdown-editor

The markdown-editor Element provides a WYSIWYG markdown editor. Edits flow back out via outvar; if outvar is set, edits also trigger any onchange Actions.

Element Opts

The opts object on a markdown-editor Element accepts the following properties:

Property	Type	Required	Default	Description
invar	string			The $var to resolve to a value to be loaded into the editor.
onchange	Action[]			Actions to take after the markdown text has been changed.
outvar	string			The $var to set the value into when the editor text is changed.
placeholder	string			Optional placeholder for when the editor is empty.
value	string			Optional static markdown to be loaded into the editor.

Static initial value:

type: markdown-editor
opts:
  value: |
    # Notes
    - Start writing here.
  outvar: notes

Round-trip with a var:

type: markdown-editor
opts:
  invar: notes
  outvar: notes
  placeholder: Enter notes...

NodeEditor: nodeeditor

The nodeeditor Element presents fields for creating or editing a Node.

Fields can be generated automatically from form (set autofields: true, optionally displayprimary: true to include primary properties) or declared explicitly via fields. Field values are gathered into the $fields var; submission is driven by entries in the top-level buttons opt whose onclick Actions invoke a Storm or callstorm query against $fields.

Element Opts

The opts object on a nodeeditor Element accepts the following properties:

Property	Type	Required	Default	Description
autofields	boolean		false	Automatically generate fields for the editor based on form.
buttons	Button[]			The buttons for the form, rendered at the bottom.
displayprimary	boolean		false	If fields for primary properties should be auto generated.
fields	NodeEditorContentField[]			Optionally provide fields to configure the fields to display, labels, placeholders, and initial values.
form	NodeForm			The node form that will be rendered in the editor.
submit	Submit			Configure a submit button with a Storm query and post-submit actions.

Example:

type: nodeeditor
opts:
  form: ou:org
  autofields: true
  displayprimary: true
  buttons:
    - text: Save
      onclick:
        - type: storm
          opts:
            query: |
              [ ou:org=$fields.name :type=$fields.type ]

NodeEditorContentField

Field configuration for a nodeeditor Element.

Property	Type	Required	Default	Description
name	string	-		The name of the field, used to identify the field and it’s value.
additemtext	string			The text to use in the add item button for arrayeditor fields.
arrayeditor	boolean		false	If the field should be an array editor suitable for array props.
arrayeditoritems	string[] | AutocompleteInputItem[]			Static autocomplete items for array editor fields.
arrayeditorvalues	Arrayeditorvalues			Configuration to dynamically fetch autocomplete items for array editor fields.
disabled	string | boolean			If the Field should be disabled.
hidden	string | boolean			If the Field should be hidden.
label	string			Optional label for the field.
lines	number			The number of lines to display by default in the textarea.
placeholder	string			Optional placeholder for the field input.
spellcheck	boolean			value of input’s spellcheck attribute
textarea	{ height: number, lines: number } | boolean			If the field should be a textarea for multiline text.
toggle	boolean		false	If the field should be a toggle suitable for boolean props.
tooltip	string			A tooltip to display instead of the form doc
type	ReprableType			Optional type for the value to be repr’d as into the field input.
value	array | string | boolean			Optional value to prepopulate the field with.
var	string			Optional var that will be used to populate the initial value for the field.

NodeEditorContentField / arrayeditorvalues

Configuration to dynamically fetch autocomplete items for array editor fields.

Property	Type	Required	Default	Description
opts	Opts	-		Options for the dynamic value provider.
type	callstorm	-		The type of dynamic value provider.

NodeEditorContentField / arrayeditorvalues / opts

Options for the dynamic value provider.

Property	Type	Required	Default	Description
query	string	-		The Storm query to execute.

Submit Options

Configure a submit button with a Storm query and post-submit actions.

Property	Type	Required	Default	Description
query	string	-		The Storm query to execute on submit.
actions	Action[]			Actions to execute after the submit query has completed.
btntext	string			The text to display on the submit button.

NodeViewer: nodeviewer

The nodeviewer Element displays the primary value, properties, embeds, tags, and tagprops of a single Node.

The Node is supplied by a loadnodes Action (using the first inbound Node) or by a storm Action whose first emitted Node is rendered. The items list controls which fields appear and in what order; valid item type values are valu, prop, tag, tagglob, tagprop, embed, and pathvar. The optional form opt is only required when embed items would otherwise have no form context to resolve against.

Element Opts

The opts object on a nodeviewer Element accepts the following properties:

Property	Type	Required	Default	Description
items	NodeViewerItem[]	-		The items configuring what will be displayed.
form	NodeForm			Only really required when setting up embed type items to be displayed from a node return by a storm action.
imgpos	bottom | left | right | top			If an image is displayed, control where it will appear.

Example:

type: nodeviewer
opts:
  form: ou:org
  items:
    - { type: prop, name: name }
    - { type: prop, name: type }
    - { type: tagglob, name: '#' }
  imgpos: left
subs:
  - src: my-stormtable
    events: [ onnodes ]
events:
  onnodes:
    - type: loadnodes

NodeViewerItem

An item configuring what is displayed from a node in the viewer.

Property	Type	Required	Default	Description
name	string	-		The name of the prop, tag, embed, or path var to display.
type	embed | pathvar | prop | tag | tagglob | tagprop | valu	-		The type of data to display from the node.
label	string			An optional display label for the item.

PowerupConfig: powerup-config

The powerup-config Element renders the configuration UI for the named Power-Up package, including any package-defined vault configurations and a permissions matrix for the listed permission paths.

Element Opts

The opts object on a powerup-config Element accepts the following properties:

Property	Type	Required	Default	Description
package	string	-		The name of the Power-Up package to configure.
permissions	Permission[]	-		Declare the permissions to be managed for the Power-Up.

Example:

type: powerup-config
opts:
  package: synapse-workflow-examples
  permissions:
    - name: User Access
      perm: [ synapse-workflow-examples, user ]
    - name: Admin Access
      perm: [ synapse-workflow-examples, admin ]

Permissions

Declare the permissions to be managed for the Power-Up.

Property	Type	Required	Default	Description
name	string	-		Friendly name for the permission to be managed.
perm	string[]	-		Permission rule path, expressed as the segments of a Synapse permission (e.g. [foo-powerup, user] for the rule foo-powerup.user).
desc	string			Optional human-readable description of the permission, displayed alongside name.

QueryBar: querybar

The querybar Element provides a single-line input bar with a query-running spinner. Pressing Enter executes the Actions defined in onrun. Use this for quick filter/search inputs; for multi-line authoring, prefer queryeditor or stormeditor.

Element Opts

The opts object on a querybar Element accepts the following properties:

Property	Type	Required	Default	Description
invar	string			A variable to use as the value for the querybar input on initial render / refresh.
menu	Menu			Optional menu options to present in the query bar’s menu.
onchange	Action[]			Actions to take after the value has been changed.
onrun	Action[]			Actions to take when the run button is pressed or the querybar receives Enter.
onstop	Action[]			Actions to take when a running query spinner is stopped.
outvar	string			A variable to update whenever the querybar input value changes.
placeholder	string			Optional placeholder for when the input is empty.

Example:

type: querybar
opts:
  placeholder: Enter a Storm query...
  outvar: query
  onrun:
    - type: storm
      opts:
        queryvar: query

Menu Options

Optional menu options to present in the query bar’s menu.

Property	Type	Required	Default	Description
items	MenuOption[]			The menu items to display.

QueryEditor: queryeditor

The queryeditor Element provides a multi-line syntax-highlighting query editor with an attached run button and query-running spinner. Pressing Shift+Enter executes the Actions defined in onrun. Unlike stormeditor, the syntax opt selects the highlighting language (e.g. storm, json, yaml) rather than always being Storm.

Element Opts

The opts object on a queryeditor Element accepts the following properties:

Property	Type	Required	Default	Description
invar	string			A variable to use as the value for the queryeditor input on initial render / refresh.
linenumbers	boolean		false	Whether to display line numbers in a left-side gutter or not.
linewrapping	boolean		true	Whether to wrap long lines or horizontally scroll.
menu	Menu			Optional menu options to present in the queryeditor’s menu.
onchange	Action[]			Actions to take after the value has been changed.
onrun	Action[]			Actions to take when the run button is pressed or the queryeditor receives shift + enter.
onstop	Action[]			Actions to take when a running query spinner is stopped.
outvar	string			A variable to update whenever the queryeditor input value changes.
placeholder	string			Optional placeholder for when the input is empty.
syntax	OpticCMLanguageName			The optional syntax highlighting mode to use.

Example:

type: queryeditor
opts:
  syntax: storm
  outvar: query
  linenumbers: true
  onrun:
    - type: storm
      opts:
        queryvar: query

Menu Options

Optional menu options to present in the queryeditor’s menu.

Property	Type	Required	Default	Description
items	MenuOption[]			The menu items to display.

Spinner: spinner

The spinner Element renders a standalone spinner that can be controlled by storm Actions in sibling Elements via the spinners opt. size accepts any valid CSS length (e.g. 48px, 25%). The default fills the Element layout cell with a 30px minimum.

Element Opts

The opts object on a spinner Element accepts the following properties:

Property	Type	Required	Default	Description
justify	center | left | right			How to justify the spinner inside the Element.
size	string			Controls width and height of the spinner icon itself.

Example:

type: spinner
opts:
  size: 48px
  justify: center

StormConsole: stormconsole

The stormconsole Element displays streaming print, warn, and err messages from storm Actions as a console-style log. The console is typically fed by another Element’s storm Action via the Action’s console: { iden: <stormconsole-iden> } opt; a storm Action targeted directly at the stormconsole is also routed through it.

Element Opts

The opts object on a stormconsole Element accepts the following properties:

Property	Type	Required	Default	Description
autoscroll	boolean		true	If the console should scroll automatically with output.

Standalone console:

type: stormconsole
opts:
  autoscroll: true

Fed by another Element’s `storm` Action:

type: queryeditor
opts:
  syntax: storm
  outvar: query
  onrun:
    - type: storm
      opts:
        queryvar: query
        console:
          iden: my-console
          clear: true
          mesgs: [ print, warn, err ]

StormEditor: stormeditor

The stormeditor Element provides a Storm-aware multi-line editor with full syntax highlighting, autocomplete, and linting. Pressing Shift+Enter runs the Actions in onrun. A storm Action targeted at the stormeditor always uses the editor’s current contents as the query, regardless of any query or queryvar opt on the Action.

Element Opts

The opts object on a stormeditor Element accepts the following properties:

Property	Type	Required	Default	Description
invar	string			A $var to resolve as the editor’s value on initial render or refresh.
onchange	Action[]			Actions to execute when the value changes.
onrun	Action[]			Actions to execute the when user presses shift + enter.
outvar	string			A $var to update whenever the editor’s value changes.
storm	string			A storm query to prepopulate into the editor.

Example:

type: stormeditor
spinner: true
opts:
  storm: |
    inet:fqdn | limit 10
  onrun:
    - type: storm
      opts:
        feed:
          results-table: true

StormForm: stormform

The stormform Element displays a defined set of fields in a form. Fields can be of different types, including input, dropdown, autocomplete, synforminput, toggle, datepicker, and more.

Each field is mapped to a var by name and is updated whenever the field’s value changes. onchange Actions on a field run after every edit, and can propagate vars to other Elements or trigger an internal refresh to update sibling fields. All current field values are also bundled into a $fields dict (keyed by field name) for convenience.

Buttons can be provided via the top-level buttons opt. Their definitions match the buttons Element. A callstorm Action that returns a dict updates the Element’s vars; if that dict contains fielderrs, it must map field name to an error message and each error is displayed just below the corresponding field for inline validation feedback.

Element Opts

The opts object on a stormform Element accepts the following properties:

Property	Type	Required	Default	Description
fields	Field[]	-		The fields of the form.
buttons	Button[]			The buttons for the form, rendered at the bottom.
layout	Layout			Control the layout of the form.

Basic form with a Submit button:

type: stormform
opts:
  layout:
    orientation: horizontal
    justifybuttons: right
  fields:
    - name: myinput
      type: input
      label: My Input
      opts:
        placeholder: Enter a value...
  buttons:
    - text: Submit
      onclick:
        - type: eventfire
          opts:
            event: onvars
            vars: [ fields ]

Validation via the `fielderrs` return dict:

type: stormform
opts:
  fields:
    - name: email
      type: input
      label: Email
  buttons:
    - text: Save
      onclick:
        - type: callstorm
          opts:
            query: |
              if (not $email or not $email.find("@")) {
                return(({"fielderrs": ({"email": "Enter a valid email."})}))
              }
              return(({"saved": (true)}))

Field Properties

Every field object has the following common properties:

Property	Type	Required	Default	Description
name	string	-		The name of the field, will be used to keep the var with this name in sync.
type	arrayeditor | autocomplete | datepicker | dropdown | input | multiselect | nodeautocomplete | password | synforminput | tagautocomplete | textarea | toggle	-		The type of form field.
append	boolean		false	If the Field should be appended to the previous row or column.
disabled	string | boolean		false	If the Field should be disabled.
hidden	string | boolean		false	If the Field should be hidden.
hint	string			An optional hint to display below the input
iden	string			Optional iden to be used for referencing the field e.g. sendfocus action.
label	string			A label for the field.
onchange	Action[]			Actions to execute when the field’s value changes.
onenter	Action[]			Actions to execute when the ‘Enter’ key is pressed inside the field.
opts	object			Opts for the field. See Field Types.
width	object | string | number			The desired width of the field

Field Types

input

A standard single-line text input. The password field type is a convenience alias that masks input and shares these opts.

Property	Type	Required	Default	Description
maxlength	number			Maximum length of the input string.
password	boolean		false	If the input should be treated as a password input.
placeholder	string			A placeholder to set on the input.
readonly	boolean		false	If the input should be readonly.
secret	boolean		false	If the input should be treated as a secret input.

Plain text input:

- name: username
  type: input
  label: Username
  opts:
    placeholder: Enter your username...
    maxlength: 64

password

A convenience alias for input. Accepts the same opts as input.

Masked password input (alias):

- name: secret
  type: password
  label: Password
  opts:
    placeholder: Enter your password...

textarea

A multi-line text input.

Property	Type	Required	Default	Description
height	number			Initial height to render with in pixels.
lines	number			Initial height to render with in lines.
maxlength	number			Maximum length of the input string.
password	boolean		false	If the input should be treated as a password input.
placeholder	string			A placeholder to set on the input.
readonly	boolean		false	If the input should be readonly.
secret	boolean		false	If the input should be treated as a secret input.

Example:

- name: description
  type: textarea
  label: Description
  opts:
    placeholder: Enter a description...
    lines: 4

dropdown

A dropdown select menu. Choices come from a static options list or are fetched dynamically through a values callstorm query.

Property	Type	Required	Default	Description
alignPosition	left | right		left	Alignment of the dropdown relative to the trigger element.
enableSearch	boolean		true	If the dropdown should display a search/filter input.
id	string			An optional ID to set on the dropdown element.
offset	Offset			Offset the dropdown position from the trigger element.
openOnClick	boolean		true	If the dropdown should open on left click.
openOnRClick	boolean		false	If the dropdown should open on right click.
options	DropdownOption[]			Static options for the dropdown.
placeholder	string			Placeholder text displayed when no option is selected.
startOpened	boolean		false	If the dropdown should be open immediately.
values	Values			Provide a config to dynamically fetch the options

DropdownOption

An option for a stormform dropdown field.

Property	Type	Required	Default	Description
text	string	-		The text label for the option in the menu.
extraSearchTerms	string[]			Additional strings to use for matching when the user is searching.
hint	string			An optional hint displayed with a muted style.
tooltip	string			Text to use as a tooltip for the option.
value	any			An Optional value of any type to catch in the onselect if desired.

Dropdown / offset

Offset the dropdown position from the trigger element.

Property	Type	Required	Default	Description
func	object			A function to calculate offset dynamically.
height	number			Override the dropdown height.
width	number			Override the dropdown width.
x	number			Horizontal offset in pixels.
y	number			Vertical offset in pixels.

Dropdown / values

Provide a config to dynamically fetch the options

Property	Type	Required	Default	Description
opts	Opts	-		Options for the dynamic value provider.
type	callstorm	-		The type of dynamic value provider.

Dropdown / values / opts

Options for the dynamic value provider.

Property	Type	Required	Default	Description
onopen	boolean		false	If the query should be executed every time the dropdown is opened.
query	string			When provided with type set to callstorm, the storm query must return a a list of ({'text': 'foo', 'value': 'value'}) items.
vars	object			$vars to be included in the query opts.

Static options:

- name: priority
  type: dropdown
  label: Priority
  opts:
    placeholder: Select a priority...
    enableSearch: true
    options:
      - text: Low
        value: low
      - text: Medium
        value: medium
      - text: High
        value: high

Dynamic options via callstorm (must return `({‘text’: ‘foo’, ‘value’: ‘val’})` items):

- name: priority
  type: dropdown
  label: Priority
  opts:
    placeholder: Select a priority...
    enableSearch: true
    values:
      type: callstorm
      opts:
        query: |
          return($priorities)

multiselect

A dropdown that allows selecting multiple options. Choices come from a static options list or are fetched dynamically through a values callstorm query.

Property	Type	Required	Default	Description
alignPosition	left | right		left	Alignment of the dropdown relative to the trigger element.
enableSearch	boolean		false	If the dropdown should display a search/filter input.
icon	OpticIconName			Optional icon to replace the chevron with.
id	string			An optional ID to set on the dropdown element.
offset	Offset			Offset the dropdown position from the trigger element.
openOnClick	boolean		true	If the dropdown should open on left click.
openOnRClick	boolean		false	If the dropdown should open on right click.
options	MultiSelectOption[]			Static options for the multi-select.
placeholder	string			Placeholder will always be visible if provided.
startOpened	boolean		false	If the dropdown should be open immediately.
values	Values			Provide a config to dynamically fetch the options

MultiSelectOption

An option for a stormform multi-select field.

Property	Type	Required	Default	Description
text	string	-		The text label for the option in the menu.
enabled	boolean		false	If the option is currently enabled/selected.
extraSearchTerms	string[]			Additional strings to use for matching when the user is searching.
hint	string			An optional hint displayed with a muted style.
tooltip	string			Text to use as a tooltip for the option.
value	any			An Optional value of any type to catch in the onselect if desired.

MultiSelect / offset

Offset the dropdown position from the trigger element.

Property	Type	Required	Default	Description
func	object			A function to calculate offset dynamically.
height	number			Override the dropdown height.
width	number			Override the dropdown width.
x	number			Horizontal offset in pixels.
y	number			Vertical offset in pixels.

MultiSelect / values

Provide a config to dynamically fetch the options

Property	Type	Required	Default	Description
opts	Opts	-		Options for the dynamic value provider.
type	callstorm	-		The type of dynamic value provider.

MultiSelect / values / opts

Options for the dynamic value provider.

Property	Type	Required	Default	Description
onopen	boolean		false	If the query should be executed every time the dropdown is opened.
query	string			When provided with type set to callstorm, the storm query must return a a list of ({'text': 'foo', 'value': 'value', 'enabled': true}) items.
vars	object			$vars to be included in the query opts.

Static options:

- name: tags
  type: multiselect
  label: Tags
  opts:
    placeholder: Select tags...
    enableSearch: true
    options:
      - text: Alpha
        value: alpha
      - text: Beta
        value: beta

Dynamic options via callstorm (must return `({‘text’: ‘foo’, ‘value’: ‘val’, ‘enabled’: true})` items):

- name: tags
  type: multiselect
  label: Tags
  opts:
    placeholder: Select tags...
    values:
      type: callstorm
      opts:
        query: |
          return($availabletags)

autocomplete

A text input with autocomplete suggestions. Suggestions come from a static items list or are fetched dynamically through a values callstorm query.

Dynamic items via callstorm (receives the user input as `$value`; must return strings or `({‘text’: ‘foo’, ‘value’: {…}})` items):

Property	Type	Required	Default	Description
alwaysOfferNoMatchWithValue	boolean		false	Set true to always use noMatchItemText/Func when the current input text does not have an exact match.
blurAfterSelect	boolean		true	If the input should be blurred after selection.
closeDropdownOnTab	boolean		true	If the input autocomplete dropdown should be closed on <Tab>.
disallowWhitespace	boolean		true	If the input should not allow the user to start with whitespace in the input.
items	string[] | AutocompleteInputItem[]			Static completion items.
maxlength	number			Maximum length of the input string.
neverOfferNoMatch	boolean		false	Set true to never display a no match item.
password	boolean		false	If the input should be treated as a password input.
placeholder	string			A placeholder to set on the input.
readonly	boolean		false	If the input should be readonly.
secret	boolean		false	If the input should be treated as a secret input.
selectAsEnter	boolean		false	Run any specified onenter actions when the user selects an autocomplete item from the list by keyboard or mouse.
selectOnExactMatch	boolean		true	Set to false to disable select+complete on exact match.
selectSingleMatch	boolean		false	Set true to automatically select a single matching autocomplete item regardless of input value or if it’s highlighted.
showAllOptionsOnInitialFocus	boolean		false	Set to true to show all options on initial focus regardless of current value in input.
showOptionsOnFocus	boolean		false	Set to true to show the options list when the <input> gets focused.
tabAsEnter	boolean		false	If the Tab key should be treated the same as ‘Enter’.
values	Values			Provide a config to dynamically fetch the autocomplete items.

AutocompleteOpts / values

Provide a config to dynamically fetch the autocomplete items.

Property	Type	Required	Default	Description
opts	Opts	-		Options for the dynamic value provider.
type	callstorm	-		The type of dynamic value provider.

AutocompleteOpts / values / opts

Options for the dynamic value provider.

Property	Type	Required	Default	Description
query	string			When provided with the type set to callstorm, the storm query will be provided the user input text in the $value variable, and should return a list of strings or ({'text': 'foo', 'value': {'foo': 'bar', 'any': 'value'}})

Static items:

- name: fruit
  type: autocomplete
  label: Fruit
  opts:
    placeholder: Search for a fruit...
    items:
      - text: Apple
        value: apple
      - text: Banana
        value: banana
    selectOnExactMatch: true

Example:

- name: fruit
  type: autocomplete
  label: Fruit
  opts:
    placeholder: Search for a fruit...
    values:
      type: callstorm
      opts:
        query: |
          return($lib.fruit.search($value))
    selectOnExactMatch: true

synforminput

A text input with autocomplete powered by Synapse form awareness. Provides type-aware autocompletion based on Synapse data model types.

Property	Type	Required	Default	Description
alwaysOfferNoMatchWithValue	boolean		false	Set true to always use noMatchItemText/Func when the current input text does not have an exact match.
blurAfterSelect	boolean		true	If the input should be blurred after selection.
closeDropdownOnTab	boolean		true	If the input autocomplete dropdown should be closed on <Tab>.
disallowWhitespace	boolean		true	If the input should not allow the user to start with whitespace in the input.
maxlength	number			Maximum length of the input string.
neverOfferNoMatch	boolean		false	Set true to never display a no match item.
placeholder	string			A placeholder to set on the input.
readonly	boolean		false	If the input should be readonly.
selectAsEnter	boolean		false	Run any specified onenter actions when the user selects an autocomplete item from the list by keyboard or mouse.
selectOnExactMatch	boolean		true	Set to false to disable select+complete on exact match.
selectSingleMatch	boolean		false	Set true to automatically select a single matching autocomplete item regardless of input value or if it’s highlighted.
showAllOptionsOnInitialFocus	boolean		false	Set to true to show all options on initial focus regardless of current value in input.
showOptionsOnFocus	boolean		false	Set to true to show the options list when the <input> gets focused.
tabAsEnter	boolean		false	If the Tab key should be treated the same as ‘Enter’.

Example:

- name: ipaddr
  type: synforminput
  label: IP Address
  opts:
    placeholder: Enter an IP address...

nodeautocomplete

A text input with autocomplete that searches for Nodes of a specific form in the active Cortex. Suggestions are produced by the form’s primary-property find logic and are capped at limit (default 20).

Property	Type	Required	Default	Description
form	NodeForm	-		The form of the node to search for.
alwaysOfferNoMatchWithValue	boolean		false	Set true to always use noMatchItemText/Func when the current input text does not have an exact match.
blurAfterSelect	boolean		true	If the input should be blurred after selection.
closeDropdownOnTab	boolean		true	If the input autocomplete dropdown should be closed on <Tab>.
disallowWhitespace	boolean		true	If the input should not allow the user to start with whitespace in the input.
limit	number		20	Limit the number of results returned.
maxlength	number			Maximum length of the input string.
neverOfferNoMatch	boolean		false	Set true to never display a no match item.
placeholder	string			A placeholder to set on the input.
readonly	boolean		false	If the input should be readonly.
selectOnExactMatch	boolean		true	Set to false to disable select+complete on exact match.
selectSingleMatch	boolean		false	Set true to automatically select a single matching autocomplete item regardless of input value or if it’s highlighted.
showAllOptionsOnInitialFocus	boolean		false	Set to true to show all options on initial focus regardless of current value in input.
showOptionsOnFocus	boolean		false	Set to true to show the options list when the <input> gets focused.
tabAsEnter	boolean		false	If the Tab key should be treated the same as ‘Enter’.

Example:

- name: orgnode
  type: nodeautocomplete
  label: Organization
  opts:
    form: ou:org
    placeholder: Search for an organization...
    limit: 10

tagautocomplete

A text input with autocomplete that searches for tags in the active Cortex.

Property	Type	Required	Default	Description
acceptGlobs	boolean		false	If this autocomplete input should accept (and indicate) tag globs.
maxlength	number			Maximum length of the input string.
multiple	boolean		false	If this autocomplete input should accept and autocomplete multiple tags.
placeholder	string			A placeholder to set on the input.
readonly	boolean		false	If the input should be readonly.

Tag autocomplete:

- name: mytag
  type: tagautocomplete
  label: Tag
  opts:
    placeholder: Pick a tag...

Allow tagglob patterns (e.g. `cno.threat.*`):

- name: tagglob
  type: tagautocomplete
  label: Tag pattern
  opts:
    acceptGlobs: true

arrayeditor

An editor for managing an array of values. New items are added through an inline autocomplete; suggestions can come from a static autocompleteitems list or be fetched dynamically through an autocompletevalues callstorm query.

Dynamic autocomplete via callstorm (receives the user input as `$value`; must return strings or `({‘text’: ‘foo’, ‘value’: {…}})` items):

Property	Type	Required	Default	Description
addItemText	string			Text for the button to add a new item to the array.
autocompleteitems	string[] | AutocompleteInputItem[]			Static completion items.
autocompletevalues	Autocompletevalues			Provide a config to dynamically fetch the autocomplete items for the array.
disableEditing	boolean		false	Disable editing the items’ values via double click.
neverOfferAutocompleteNoMatch	boolean		false	If true, never offer the no-match item in the autocomplete dropdown.
removeItemModalText	string		Remove item from array?	Text to display in the confirmation modal when the user clicks to remove an item from the array.
requireAutocompleteMatch	boolean		false	If true, require the user to select a value from the autocomplete options.
showAllOptionsOnInitialFocus	boolean		false	Set to true to show all autocompletion options when a pill is double clicked for editing regardless of the current value.
showOptionsOnFocus	boolean		false	Set to true to show the matching autocompletion options when a pill is double clicked for editing.
sorted	boolean		false	Optionally specify if the array should be sorted.
type	string			Optional Synapse type to validate each item as.
uniq	boolean		false	Optionally specify if the array should be only allowed to contain unique items.

ArrayEditor / autocompletevalues

Provide a config to dynamically fetch the autocomplete items for the array.

Property	Type	Required	Default	Description
opts	Opts	-		Options for the dynamic value provider.
type	callstorm	-		The type of dynamic value provider.

ArrayEditor / autocompletevalues / opts

Options for the dynamic value provider.

Property	Type	Required	Default	Description
query	string			When provided with the type set to callstorm, the storm query will be provided the user input text in the $value variable, and should return a list of strings or ({'text': 'foo', 'value': {'foo': 'bar', 'any': 'value'}})

Static autocomplete items:

- name: myarray
  type: arrayeditor
  label: Items
  opts:
    sorted: true
    uniq: true
    autocompleteitems:
      - alpha
      - beta
      - gamma

Example:

- name: tags
  type: arrayeditor
  label: Tags
  opts:
    uniq: true
    autocompletevalues:
      type: callstorm
      opts:
        query: |
          return($lib.lift.tagsByPref($value))

toggle

A toggle switch for boolean values. activeText and inActiveText label the on/off positions; both default to empty.

Property	Type	Required	Default	Description
activeText	string		'ON'	The text displayed inside the toggle when it is enabled.
disabled	boolean		false	If the toggle should be disabled from changing.
inActiveText	string		'OFF'	The text displayed inside the toggle when it is enabled.
negativeTheme	boolean		false	If the toggle should use the alternate theme that indicates toggling a ‘negative attribute’, e.g. locked, denied.
size	xs | sm | lg			The size of the toggle, to dictate styling.

Example:

- name: enabled
  type: toggle
  label: Enabled
  opts:
    activeText: 'Yes'
    inActiveText: 'No'

datepicker

A date picker input field. Inherits the common single-line input opts (placeholder, maxlength, readonly) from the input field type but renders a calendar widget for selection.

Property	Type	Required	Default	Description
maxlength	number			Maximum length of the input string.
placeholder	string			A placeholder to set on the input.
readonly	boolean		false	If the input should be readonly.

Example:

- name: startdate
  type: datepicker
  label: Start Date
  opts:
    placeholder: Pick a start date...

Layout Options

Control the layout of the form.

Property	Type	Required	Default	Description
alignbuttons	bottom | right			How to align the buttons inside the form when using the ‘horizontal’ orientation.
justifybuttons	center | left | right			How to justify the buttons inside the form.
orientation	horizontal | vertical			Orientation of the form.

StormTable: stormtable

The stormtable Element displays Nodes of a particular form. It behaves similarly to the Tabular display mode in the Research tool: nodes inbound from a storm Action populate rows, and each column is configured by type (prop, tag, tagglob, embed, pathvar) plus a column-type-specific opts block.

Element Opts

The opts object on a stormtable Element accepts the following properties:

Property	Type	Required	Default	Description
columns	Column[]	-		The columns to be displayed in the table in order.
form	NodeForm	-		The form of nodes that will be displayed in the table.
csvexport	boolean		false	Enable a menu option to export the table as CSV for immediate download.
disablemultiselect	boolean		false	Disable multi-select via shift/ctrl+click.
disableselect	boolean		false	Disable normal single selection.
displayglobalcols	boolean		false	If true, display columns from the global column configuration.
menu	Menu			Table row menu configuration.
onselect	Action[]			Actions to be run when the node selection has changed.
sort	StormTableSort			Control the initial column sort and direction.

Example:

type: stormtable
opts:
  form: ou:org
  columns:
    - type: prop
      opts:
        prop: name
        title: Name
    - type: prop
      opts:
        prop: type
        title: Type
    - type: tag
      opts:
        tag: rep.trust
        title: Trust
  sort:
    type: prop
    prop: name
    direction: asc
  csvexport: true
oninit:
  - type: storm
    opts:
      query: ou:org

Columns

The columns to be displayed in the table in order.

Property	Type	Required	Default	Description
opts	StormTableColumnOpts	-
type	embed | form | pathvar | prop | tag | tagglob	-

StormTableColumnOpts

Column configuration for a stormtable Element.

Property	Type	Required	Default	Description
disableresize	boolean		false	If the ability to resize the column should be removed.
embed	string			The embed path to be displayed in an embed column.
index	number			The index of the value to be displayed in an ival typed tag or prop column.
linewrap	boolean		false	If the column’s cells should linewrap their data.
onchange	Onchange			Customize editing of cells in the Table by overriding the query and executing additional flow actions.
pathvar	string			The path var to be displayed in a pathvar column.
pathvartype	ReprableType			The optional type for repring the path var.
prop	string			The name of the prop to be displayed in a prop column.
readonly	object | boolean			Set true to make the column’s cells readonly and not editable regardless of the datamodel.
rendermarkdown	boolean		false	If the column value should be rendered as markdown when appropriate.
tag	string			The name of the tag to be displayed in a tag column.
tagglob	string			The tagglob to be displayed in a tagglob column.
title	string			Optional title for the column.
width	string | number			The width of the column.

StormTableColumnOpts / onchange

Customize editing of cells in the Table by overriding the query and executing additional flow actions.

Property	Type	Required	Default	Description
query	string		'[:$prop=$valu]'	Override the default storm query used to update a node(s) prop.

Menu Options

Table row menu configuration.

Property	Type	Required	Default	Description
items	StormTableMenuOption[]	-		Menu items to be be displayed.

StormTableMenuOption

Menu option for a stormtable Element row context menu.

Property	Type	Required	Default	Description
classes	string[]			An optional array of classNames to add to the item.
disabled	string | boolean			If the menu item should be disabled or not.
extraSearchTerms	string[]			Additional strings to use for matching when the user is searching.
hidden	string | boolean			If the menu item should be hidden or not.
hint	string			An optional item hint that is displayed with a muted style, after the text.
icon	OpticIconName			An optional icon to display for the menu option.
iconRight	boolean			Display the icon to the right of the text.
id	string			An optional Element ID to be set on the item’s DOM element.
onclick	Action[]			Actions to execute when the menu option is clicked.
only	Only			Special conditions that can determine whether to hide/show the option.
options	MenuOption[]			Optional sub-menu options.
text	string			The text label for the option in the menu.
textvar	string			Optionally provide a var that will be resolved to a value that will used as the menu text.
tooltip	string			Text to use as a tooltip.
value	any			An Optional value of any type to catch in the onselect if desired.

StormTableMenuOption / only

Special conditions that can determine whether to hide/show the option.

Property	Type	Required	Default	Description
singleselect	boolean		false	Only display this option when there is a single node selected.

StormTableSort

Control the column being sorted on.

Set the type field on the sort opt to select one of the configurations below. Each configuration is a distinct shape; only the fields listed for the chosen type are accepted.

form

Property	Type	Required	Default	Description
type	form	-
direction	asc | desc	-

prop

Property	Type	Required	Default	Description
type	prop	-
direction	asc | desc	-
prop	string	-
index	number

tag

Property	Type	Required	Default	Description
type	tag	-
direction	asc | desc	-
tag	string	-
index	number

tagglob

Property	Type	Required	Default	Description
type	tagglob	-
direction	asc | desc	-
tagglob	string	-

embed

Property	Type	Required	Default	Description
type	embed	-
direction	asc | desc	-
embed	string	-

pathvar

Property	Type	Required	Default	Description
type	pathvar	-
direction	asc | desc	-
pathvar	string	-

TabsLayout: tabs

The tabs Element provides a tabs layout. Each tab contains its own Element grid that is rendered when the tab becomes selected. Element idens declared inside a tab are unique within the Workflow and can participate in cross-tab Events/Actions normally.

Element Opts

The opts object on a tabs Element accepts the following properties:

Property	Type	Required	Default	Description
tabs	TabsLayoutTab[]	-		Configure the columns to be displayed (in order) and the elements inside.
initialtab	string			An initial tab to be selected by iden.

Example:

type: tabs
opts:
  initialtab: overview
  tabs:
    - iden: overview
      text: Overview
      elements:
        ovr-label:
          type: label
          layout: { w: 8, h: 2, x: 0, y: 0 }
          opts:
            text: Welcome
    - iden: detail
      text: Detail
      elements:
        det-md:
          type: markdown
          layout: { w: 8, h: 8, x: 0, y: 0 }
          opts:
            markdown: |
              ## Details
              More info goes here.

TabsLayoutTab

A tab definition for a tabs Element.

Property	Type	Required	Default	Description
elements	DatasData	-		The Elements that should be displayed inside the tab.
iden	string	-		The name the tab should be identified by e.g. foo-data
buttons	Button[]			Optional buttons that will be positioned on the right edge of the tabs list.
layout	GridStackLayoutConf | CSSGridLayoutConf			Define the layout type and opts for this tab.
onselect	Onselect			Optional Actions to execute before and/or after the tab becomes selected.
text	string			The text that will be displayed on the tab label (in all uppercase) e.g. foo data will be displayed as FOO DATA.
tooltip	string			Optional tooltip to display when user hovers the tab.

TabsLayoutTab / onselect

Optional Actions to execute before and/or after the tab becomes selected.

Property	Type	Required	Default	Description
after	Action[]			Actions to execute/complete after the tab becomes visible.
before	Action[]			Actions to execute/complete before the tab becomes visible.

TextArea: textarea

The textarea Element provides a multi-line text editor powered by CodeMirror.

The displayed value can come from any of four sources, in priority order:

1. invar - resolves a $var on initial render.

2. value - a static literal baked into the Element definition.

3. A callstorm Action whose query returns the text or JSON to display.

4. A loadnodes Action paired with prop to deref a property from the inbound Node.

Edits flow back out via outvar (and trigger onchange Actions). readonly defaults to false when outvar is set, otherwise true. Set type: json to handle JSON (de)serialization automatically; syntax controls highlighting independently.

Element Opts

The opts object on a textarea Element accepts the following properties:

Property	Type	Required	Default	Description
invar	string			The $variable to resolve to a value to be loaded into the TextArea.
linenumbers	boolean		false	Whether to wrap display line numbers in a left-side gutter or not.
linewrapping	boolean		true	Whether to wrap long lines or horizontally scroll.
onchange	Action[]			Actions to take after the value has been changed.
outvar	string			The $variable to set the value into when the TextArea is edited.
placeholder	string			Optional placeholder for when the TextArea is empty.
prop	string			A prop to deref from the inbound node to be loaded into the TextArea.
readonly	boolean			Make the field readonly so it cannot be edited.
syntax	OpticCMLanguageName			Optional syntax highlighting.
type	json | str		'str'	Handle (de)serialization of structured data formats like JSON.
value	any			Optional static value to be loaded into the TextArea.

Static literal value:

type: textarea
opts:
  value: |
    # Notes
    - Pre-populated content
  syntax: markdown
  readonly: true

Round-trip with a var (input and output bound to the same name):

type: textarea
opts:
  syntax: yaml
  invar: yamltext
  outvar: yamltext
  linenumbers: true

Populated from a Node prop via `loadnodes`:

type: textarea
opts:
  prop: desc
  readonly: true
subs:
  - src: my-stormtable
    events: [ onnodes ]
events:
  onnodes:
    - type: loadnodes

Populated from a `callstorm` result:

type: textarea
opts:
  type: json
  syntax: json
  outvar: changedval
oninit:
  - type: callstorm
    opts:
      query: |
        inet:fqdn=$fqdn
        return($node.data.get(foo))

Shared Types

Types referenced by more than one Element. Per-Element opts tables link here for the full type reference rather than repeating the definition under every Element that uses it.

AutocompleteInputItem

An item for an autocomplete input.

Property	Type	Required	Default	Description
text	string	-		The text that will be displayed and substring matched on by default.
hint	string			Optional hint text that can be used for a hint or description.
value	any			Optional value to catch via onSelect.

OpticCMLanguageName

Allowed values: apl, asciiarmor, asn.1, asterisk, bash, brainfuck, c, c#, c++, cassandra, clojure, clojurescript, closure stylesheets (gss), cmake, cobol, coffee, coffee-script, coffeescript, common lisp, cpp, cql, crystal, cs, csharp, css, cypher, cython, d, dart, diff, dockerfile, dtd, dylan, ebnf, ecl, ecmascript, edn, eiffel, elm, erlang, esper, excel, f#, factor, fcl, formula, forth, fortran, fsharp, gas, gherkin, go, groovy, haskell, haxe, html, http, hxml, idl, ini, java, javascript, jinja2, jruby, js, json, json-ld, json5, jsonld, jsx, julia, kotlin, latex, less, lisp, livescript, ls, lua, macruby, mariadb sql, markdown, mathematica, mbox, mirc, modelica, ms sql, mscgen, msgenny, mumps, mysql, nginx, node, nsis, ntriples, objc, objc++, objective-c, objective-c++, ocaml, octave, oz, pascal, perl, pgp, php, pig, plsql, postgresql, powershell, properties, properties files, protobuf, puppet, python, q, r, rake, rb, rbx, rpm changes, rpm spec, rscript, rss, ruby, rust, sas, sass, scala, scheme, scss, sh, shell, sieve, smalltalk, sml, solr, sparql, sparul, spreadsheet, sql, sqlite, squirrel, stex, storm, stylus, swift, systemverilog, tcl, tex, textile, tiddlywiki, tiki wiki, toml, troff, ts, tsx, ttcn, ttcn_cfg, turtle, typescript, vb.net, vbscript, velocity, verilog, vhdl, web idl, webassembly, wsdl, xhtml, xml, xquery, xsd, yacas, yaml, yara, yml, z80, zsh

OpticIconName

Allowed values: ACHIEVEMENT, ADD, ADD_SM, ADD_SM2, ADMIN, ARCHIVE, ARCHIVE_SM, ARROWMENU, ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, ASTERISK, AUDIO_SM, BELL, BOLT, BOOKMARK, CALENDAR, CHECK_1, CHECK_2, CHEVRONDOUBLE_LEFT, CHEVRONDOUBLE_RIGHT, CHEVRON_DOWN, CHEVRON_DOWN_SM, CHEVRON_DOWN_SM2, CHEVRON_LEFT, CHEVRON_RIGHT, CHEVRON_UP, CHEVRON_UP_SM, CHEVRON_UP_SM2, CORTEX, COURSE, DATAEXPORT, DATAIMPORT, DIFF, DOWNLOAD, DUPE, DUPE_SM, EDIT, ELLIPSIS, EVENT, EXPLORE, EYE_HIDE, EYE_SHOW, FILTER, FLOWS_0, FLOWS_1, FOCUS_1, FOCUS_2, FORK, FULLSCREEN_COLLAPSE, FULLSCREEN_EXPAND, HELP_SM, HISTORY, HISTORY_SM, IMAGE_SM, INFO, INFO_SM, JUMPTO, LESSON, LOADMORE, LOCATION, LOCKED, MENU, MERGE, MERGE_APPROVE, MERGE_VETO, MERGE_VIEW, MERGE_VOTE, MINUS, MINUS_SM, MINUS_SM2, MOVE_DRAG, MOVE_REARRANGE, MULTIPLY, MULTIPLY_SM, MULTIPLY_SM2, NAV_ACTIVITY, NAV_ADMIN, NAV_BULKACTION, NAV_CHANGES, NAV_CHANGES_1, NAV_COLLABORATE, NAV_CONSOLE, NAV_DATAIMPORT, NAV_DISCONNECTED, NAV_HELP, NAV_HISTORY, NAV_LEARNING, NAV_LOG, NAV_LOGO, NAV_MODULES, NAV_REPORTS, NAV_RESEARCH, NAV_STORIES, NAV_STORIES_1, NAV_SUGGESTIONS, NAV_TOOLS, NAV_WORKSPACES, OPTIC, OPTIC_LOGO_HORZ, PIVOT_1, PIVOT_2, PIVOT_3, PIVOT_4, PLAY, PREFIX_RE, QUERY_DONE, QUERY_ERROR, QUERY_READY, QUERY_SPINNER, QUERY_STOP, QUIZ, REFRESH, REFRESH_SM, REORDER, RESIZE, RESULTS_ACTIVITY, RESULTS_BARCHART, RESULTS_CONSOLE, RESULTS_FORCEGRAPH, RESULTS_PIECHART, RESULTS_SINGLE, RESULTS_TABLE, RESULTS_TIMELINE, REVIEW, RING, SEARCH, SEARCH_SM, SETTINGS_1, SETTINGS_2, SHARE, SHARE_SM, SHOWHIDE, SORT, SORT_ASCENDING, SORT_DESCENDING, SPLIT_1, SPLIT_2, STAR, STAR_FILL, STORM, SYNAPSE, SYNAPSE_LOGO_HORZ, TERMINAL, TERMINAL_SM, TEXT_SEARCH, TIME, TRASH, TRASH_SM, TREE_GRAPH, UNDO, UNDO_SM, UPLOAD, USER, VIDEO_SM, WAND, WARNING, WARNING_SM

Buttons

Each entry in buttons is one of the following types:

button

A clickable button. Used by Element-level buttons opts (e.g. buttons, stormform, nodeeditor) and by titlebar button slots.

onclick runs the listed Actions on click. disabled and hidden accept a static boolean or a $var for dynamic resolution. spinner: true swaps the button’s icon for an active-spinner indicator while a bound storm Action is running.

Property	Type	Required	Default	Description
altStyle	boolean		false	Apply the alternative button style.
disabled	string | boolean		false	Disable the button if true.
hidden	string | boolean		false	Hide the button if true.
icon	OpticIconName			Set an icon to be displayed on the button.
iden	string			Optional iden for referencing the button from a sendfocus Action’s button opt instead of by index.
noBorder	boolean		false	If true then the button will have no border.
onclick	Action[]			The actions to be executed when the user clicks the button or toggle.
size	xs | sm | lg			The size of the button.
spinner	boolean		false	Display a spinner in place of the button’s icon while a bound storm Action is running.
text	string			The text to be displayed inside the button.
tooltip	string			The tooltip text to be displayed when the user hovers the button.
type	button			The type of button, either ‘button’ (default) or ‘toggle’.
warnStyle	err | warn			Apply an extra warning button style.

Example:

- text: Run
  icon: PLAY
  tooltip: Run the query
  onclick:
    - type: storm
      opts:
        queryvar: query

toggle

A toggle button that maintains a boolean state. Selecting the toggle flips the bound var (when name is set) and runs onclick Actions.

activeText / inActiveText label the on/off positions (default ON / OFF). Set negativeTheme: true to use the alternate color scheme typically reserved for toggling a “negative” attribute (e.g. mute, hide).

Property	Type	Required	Default	Description
type	toggle	-		The type of button, either ‘button’ (default) or ‘toggle’.
activeText	string		'ON'	The text displayed inside the toggle when it is enabled.
disabled	string | boolean		false	Disable the button if true.
hidden	string | boolean		false	Hide the button if true.
iden	string			Optional iden for referencing the button from a sendfocus Action’s button opt instead of by index.
inActiveText	string		'OFF'	The text displayed inside the toggle when it is enabled.
label	string			An optional label rendered alongside the toggle.
name	string			The optional name of the var that the toggle’s state will be read from and written to.
negativeTheme	boolean		false	If the toggle should use the alternate theme that indicates toggling a ‘negative attribute’, e.g. locked, denied.
onclick	Action[]			The actions to be executed when the user clicks the button or toggle.
size	xs | sm | lg			The size of the toggle, to dictate styling.
tooltip	string			The tooltip text to be displayed when the user hovers the button.

Example:

- type: toggle
  label: Live
  name: live
  activeText: 'On'
  inActiveText: 'Off'

MenuOption

Common interface for menu options being defined in Workflow Elements.

Property	Type	Required	Default	Description
classes	string[]			An optional array of classNames to add to the item.
disabled	string | boolean			If the menu item should be disabled or not.
extraSearchTerms	string[]			Additional strings to use for matching when the user is searching.
hidden	string | boolean			If the menu item should be hidden or not.
hint	string			An optional item hint that is displayed with a muted style, after the text.
icon	OpticIconName			An optional icon to display for the menu option.
iconRight	boolean			Display the icon to the right of the text.
id	string			An optional Element ID to be set on the item’s DOM element.
onclick	Action[]			Actions to execute when the menu option is clicked.
options	MenuOption[]			Optional sub-menu options.
text	string			The text label for the option in the menu.
textvar	string			Optionally provide a var that will be resolved to a value that will used as the menu text.
tooltip	string			Text to use as a tooltip.
value	any			An Optional value of any type to catch in the onselect if desired.