primary-actionIntents
An intent names what a piece of UI is for: primary-action, selection,
modal. Every component and pattern declares the intents it serves, so a request can be matched to a
component by meaning before anything is said about how it looks. This is the map an agent reads from the prompt
fragment and the MCP server's find tool, as a page.
From intent to component
Mark up an element with data-aihio-intent to say which one it serves. The linter checks the
annotation against the component's schema, so a claim it cannot back is an error.
- The dominant action in a given context (e.g. submit, confirm).
secondary-action- A supporting action (e.g. cancel, reset).
destructive-action- An action with irreversible or data-losing consequences.
toggle-state- Toggles a binary state without navigating or submitting.
form-field- Collects a single value from the user as part of a form.
text-entry- A form field specifically for free-form text.
status- Displays current state (badges, pills, counts).
alert- Important message that requires attention.
error- Communicates a failure or invalid state.
- No component of its own: compose it.
surface- A raised or bordered region that frames content (card, panel).
layout- Arranges other components spatially (tab list, grid).
header- A titled heading region inside a surface.
- No component of its own: compose it.
overlay- Content that renders on top of the page (dialog, popover).
tabular-data- Records laid out in rows and columns, compared by scanning down a column (a data table).