NavLink

NavLink defines how EnterUI handles a calm navigation link with active, disabled, and badge states, including default structure, accessible states, and token-driven styling.

#Default usage

<div className="docs-preview-stack">
  <NavLink active href="/docs" badge={<Badge>New</Badge>}>Overview</NavLink>
  <NavLink href="/docs/components/button">Components</NavLink>
  <NavLink disabled href="/docs/disabled">Disabled</NavLink>
</div>

#Import

import { NavLink } from "@froggdesign/enter-ui-react";

#Accessibility

Active NavLink sets aria-current="page". Disabled links remove the href, set aria-disabled, and are skipped in tab order.

#API

• active marks the current page.
• disabled prevents navigation.
• badge renders trailing metadata.
• Includes native anchor props and className.

#Styling

Uses .eui-nav-link classes with restrained active state.