Skip to main content

Links and Navigation

Corva frontend apps run in an isolated frame. Treat links as transitions out of the app unless the destination is part of the app's own interface.

Use TextLink from @corva/ui/componentsV2 and open external destinations in a new tab:

import { TextLink } from '@corva/ui/componentsV2';

<TextLink
  href="https://example.com/help"
  target="_blank"
  rel="noopener noreferrer"
>
  Open help
</TextLink>

This preserves the Corva dashboard and prevents the external page from replacing the app frame.

For a small app, prefer tabs, view state, or a lightweight internal router contained entirely inside the app. Do not try to control the parent Corva browser history directly.

If the app changes its own URL state, verify all of these cases:

  • Initial load at the default view.
  • Refresh while a nested view is selected.
  • Back and forward browser behavior.
  • Opening the app on a different dashboard or asset.
  • Local development and the deployed isolated frame.

Corva destinations​

Use a Corva UI navigation helper or documented platform route when one exists. Avoid constructing URLs from assumptions about the current hostname or dashboard path; platform routes can vary by environment.

Accessibility​

  • Use a link for navigation and a button for an action.
  • Give the link meaningful text instead of “click here.”
  • Indicate when a link opens a new tab when that is not obvious from the surrounding content.
  • Keep keyboard focus visible.

Browse the current TextLink examples in Corva UI Storybook before adding custom link styling.