Actions and navigation

Use Button, Link, navigation menus, breadcrumbs, and pagination with their exact rendering and state contracts.

Button rendering, loading, and defaults

Defaults are variant=solid, tone=primary, size=md, loading=false, disabled=false, iconOnly=false, and native type=button.
loading disables the action, renders a spinner, and exposes aria-busy=true.
iconOnly changes sizing but does not create an accessible name. Supply label or aria-label.
href is forwarded only when the root is an anchor or a custom component. It does not change the root by itself.
A disabled non-button loses href, receives aria-disabled=true, and is removed from sequential keyboard navigation.

TSX

tsximport { Button, Icon } from "@tavojs/ui";

<Button type="submit" loading={saving}>Save changes</Button>
<Button as="a" href="/settings" variant="soft">Settings</Button>
<Button iconOnly label="Add project"><Icon viewBox="0 0 24 24" /></Button>

Use href and to for different navigation paths

href behaves as a normal anchor destination.
to enables Tavo.js router navigation for same-origin destinations and localizes the path when an i18n service is active.
replace and scroll are passed to router navigation.
Modified clicks, downloads, external origins, non-_self targets, same-page hash changes, and prevented events retain native anchor behavior.
javascript:, data:, and vbscript: destinations are removed. A disabled Link also removes its destination and exposes aria-disabled=true.
Link computes aria-current=page for the current same-origin pathname unless the application supplies aria-current explicitly.

Navigation component contracts

Breadcrumbs renders hierarchy navigation from items and marks entries with current=true as the current page.
NavigationMenu accepts items or custom children, defaults orientation to horizontal, and sets aria-current=page on current items.
Menubar accepts items or compound Menubar.Item children. An item with href renders as a link; otherwise it renders as a button.
Pagination requires page and pageCount, defaults siblingCount to 1 and label to Pagination, and reports requested pages through onChange.
Application state owns the current navigation destination and pagination page; the components do not mutate those values internally.