Patterns
Patterns
Approved compositions of components — recipes for recurring UI problems.
Patterns are sanctioned ways to combine components to solve a recurring problem (a filter popover, a confirm dialog, a wizard, …). They sit one level above component docs: a component page tells you what a component is; a pattern tells you how to compose components for a task — and when not to.
Use a pattern as the starting point instead of assembling one from scratch, so the same problem is solved the same way across the product (and so AI assistants reuse an approved recipe rather than reinventing one).
Each pattern has a machine-readable definition in
@acronis-platform/ui-spec (patterns/<name>/pattern.yaml) — the source of
truth — and is rendered + explained here.
Available patterns
- Filter popover — a trigger that opens a
popover of filter fields with Apply / Reset. Replaces the legacy
el-multi-search. - Data table bulk actions — row selection driving a contextual bulk-action bar (Export / Delete / Clear) over one shared table instance.
- Sheet detail panel — details of a selected
item in a side Sheet: title, property list, content states (loading / empty),
and footer actions. The React composition of the Vue
Details.