Skip to main content

System Feedback

System feedback components communicate the status of an operation, validation state, or system condition to the user. They help users understand what has happened, what went wrong, or what action is required next.

DUIL provides several components for different feedback contexts:

  • Alert — Persistent, inline messaging for system-level notifications such as warnings, errors, success states, or informational updates. Use when feedback must remain visible until the user acts or dismisses it.
  • GlobalValidation / GlobalIllustratedValidation — Page-level validation summaries, typically used at the top of a form to collect and surface all errors at once. The illustrated variant adds visual reinforcement for high-impact states.
  • ValidationFeedback — Inline, field-level feedback attached to individual form controls. Supports valid, invalid, warning and note types via the validation prop shared across all form components.
  • StatusBadge — Compact, label-based status indicators for displaying the state of an entity (e.g. a shipment, order, or record) within lists, tables, or cards.
  • Loader — Communicates that a process is in progress. Use to prevent user uncertainty during asynchronous operations.
  • Modal — Can serve as a feedback channel for confirmations, blocking errors, or actions that require a deliberate user response before proceeding.

Choosing the right component depends on scope and urgency: field-level feedback belongs with ValidationFeedback; page-level errors after form submission suit GlobalValidation; ambient system messages belong in Alert; and blocking or confirmation states belong in Modal.