Workflow Form

A structured form surface for collecting governed workflow inputs with predictable controls.

Show form grouping, field hierarchy, status context, and action placement.
Workflow Intake

Control Review Workspace

Draft
Complete the required fields and submit for review.
Submission Packet

Micro App Contract

This example is a contained UIF Micro App: route-scoped assets, browser-side state, visible controls, and a bounded root that can run inside the larger public shell.

Pattern Purpose

Use this pattern for intake, review, approval, and configuration workflows where inputs must stay legible and auditable.

Recommended Structure

Group related fields, keep status visible, use clear labels, reserve the primary action for the next workflow transition, and keep secondary actions nearby.

What Users Can Try

  • Validate required workflow fields on the client.
  • Track draft, review-ready, and submitted states.
  • Generate a review packet from entered values.
  • Download the workflow submission as JSON.
Sample Markup
<form class="uif-workflow-form">
  <label>Control Area <select>...</select></label>
  <label>Owner <input></label>
  <textarea>Reviewer notes</textarea>
  <button type="submit">Submit Review</button>
</form>