# Workflow Viewer

## Description:

WF Viewer

The Wfviewer displays an annotated view of the process diagram for a particular instance of a workflow process, so that users can get a graphical depiction of their activity status.

### Allowed Parent Components:

1. Card Body
2. Horizontal Section
3. Page
4. Popover
5. Popup
6. Tab Item
7. Vertical Section

### Allowed Child Components:

1. Popover
2. Pulse
3. Trigger Before Render

### Properties

### ➤ Zoom To Fit

Check this to get zoom to fit view as default.

Allowed Values: Yes/No

### ➤ Editable

Check this to enable the edit options.

Allowed Values: Yes/No

### ➤ Workflow

Select a workflow name.

Allowed Values: Select a workflow name.

### ➤ Instance Id

The key which represents the instance of the workflow.

Allowed Values: An expression which should return string after evaluation

### ➤ Pretty Date

Allowed Values: Yes/No

### ➤ Date Format

Allowed Values: Free text field

### ➤ Margin

Select a value to add margin on all four sides of the component. It is a shorthand for margin-top, margin-right, margin-bottom, and margin-left.

Allowed Values: Any number value

### ➤ Margin Bottom

Select a value to add margin on the bottom of the component.

Allowed Values: Any number value

### ➤ Margin Left

Select a value to add margin on the left of the component.

Allowed Values: Any number value

### ➤ Margin Right

Select a value to add margin on the right of the component.

Allowed Values: Any number value

### ➤ Margin Top

Select a value to add margin on the top of the component.

Allowed Values: Any number value

### ➤ Padding

Select a value to add padding on all four sides of the component. It is a shorthand for padding-top, padding-right, padding-bottom, and padding-left.

Allowed Values: Any number value

### ➤ Padding Bottom

Select a value to add padding in the bottom of the component.

Allowed Values: Any number value

### ➤ Padding Left

Select a value to add padding in the left of the component.

Allowed Values: Any number value

### ➤ Padding Right

Select a value to add padding in right of the component.

Allowed Values: Any number value

### ➤ Padding Top

Select a value to add padding in top of the component.

Allowed Values: Any number value