# common-patterns

> Common UI patterns (forms, dialogs, notifications, and tables). Keywords: forms, dialogs, modals, notifications, tables, ui patterns.

- Author: willyu1007
- Repository: willyu1007/AI_First_Template
- Version: 20251224182030
- Stars: 0
- Forks: 0
- Last Updated: 2026-02-07
- Source: https://github.com/willyu1007/AI_First_Template
- Web: https://mule.run/skillshub/@@willyu1007/AI_First_Template~common-patterns:20251224182030

---

---
name: common-patterns
description: "Common UI patterns (forms, dialogs, notifications, and tables). Keywords: forms, dialogs, modals, notifications, tables, ui patterns."
---

# Common Patterns

This skill lists common UI patterns and recommended defaults.

---

## Forms

- Validate at the boundary (schema-first where possible).
- Display field-level errors and a single top-level error summary for submission failures.

---

## Dialogs / modals

- Trap focus inside the dialog.
- Ensure ESC closes the dialog (unless forbidden for safety reasons).
- Restore focus to the triggering element on close.

---

## Notifications

- Prefer a single notification mechanism (snackbar/toast).
- Use success messages sparingly; highlight failures and required actions.

---

## Tables / grids

- Prefer server-side pagination for large datasets.
- Keep sorting/filtering state in the URL for shareability (when appropriate).