`@stesura/automation-react`

The editor UI for @stesura/automation: node views, the field view and the Automation toolbar group. See Editor UI in the Automation guide.

UI extension

`createAutomationUIExtension`

Automation in the editor: node views for every automation node (chrome in template mode only), the field view, and the Automation group (Insert tab, or its own tab with placement: "tab"). The schema needs withAutomation and the editor automationPlugins (@stesura/automation). Call once at module scope.

Parameters:

Name	Type	Default
`options`	`AutomationUIOptions`

Returns:

StesuraUIExtension

`AutomationUIOptions`

Options of createAutomationUIExtension.

Name	Type	Default
`onEditNode`	`(target: AutomationNodeTarget) => void` The chrome’s edit button: open the consumer’s editor for this node’s logic. Hidden when absent.
`renderLabel`	`(target: AutomationLabelTarget) => ReactNode` Replaces the chrome label (e.g. a summary of the node’s condition).
`onModeChange`	`(mode: AutomationMode) => void` After the toolbar switched modes: re-apply visibility, items and values for `document`.
`placement`	`"insert" \| "tab"` Where the Automation group goes: the Insert tab (default), or a tab of its own (`value: "automation"`) that other extensions add to by `tabKey`.

`AutomationNodeTarget`

The automation node a UI callback is about.

Name	Type	Default
`kind`	`AutomationNodeKind`
`id`	`string \| null` The node’s id; null for a template or an id-less node.
`node`	`Node`
`pos`	`number`

`AutomationLabelTarget`

A node as a label sees it: no position, labels render before positions settle.

Name	Type	Default
`id`	`string \| null` The node’s id; null for a template or an id-less node.
`kind`	`AutomationNodeKind`
`node`	`Node`

`AutomationNodeKind`


type AutomationNodeKind = "conditional" | "repeat" | "template" | "item" | "component";

Which automation node a UI callback is about.

Hooks

For use inside node views.

`useAutomationMode`

The automation mode of the editor the node view belongs to.

Parameters:

This function does not accept any parameters.

Returns:

AutomationMode

`useNodeDiagnostics`

The diagnostics of node id, consumer’s and structural.

Parameters:

Name	Type	Default
`id`	`string`

Returns:

readonly Diagnostic[]

Custom toolbars and views

`AutomationGroup`

The Insert tab’s Automation group: insert wrappers, switch template/document mode.

Parameters:

Name	Type	Default
`props`	`{ onModeChange?: (mode: AutomationMode) => void; }`

Returns:

ReactNode

`automationProbes`

Enabled-state probes for the Automation group’s insert buttons, for a custom toolbar.

Name	Type	Default
`conditionalBlock`	`TbProbe`
`conditionalInline`	`TbProbe`
`repeatBlock`	`TbProbe`
`repeatInline`	`TbProbe`

`automationSelectors`

Toolbar selectors for the Automation group: the current template/document mode.

Name	Type	Default
`mode`	`TbSelector<AutomationMode>`

`FieldNodeView`

A template field: {{name}} in template mode; in document mode its value, else its fallback, else {{name}}. A shown value drops the field styling (core’s .pm-field[data-value]).

Parameters:

Name	Type	Default
`props`	`Omit<NodeViewComponentProps, "ref"> & RefAttributes<HTMLSpanElement>`

Returns:

ReactNode