> ## Documentation Index
> Fetch the complete documentation index at: https://docs.awaitio.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Display Link

> Shows a link to a page in the app or outside it.

`io.display.link()` shows a link in a folder's page or in a step of an action. It only displays and returns nothing. Provided by the `@awaitio/display-link` package.

<Frame>
  <img src="https://mintcdn.com/awaitio/MjbT5AW66vMXbVck/images/io-display-link.png?fit=max&auto=format&n=MjbT5AW66vMXbVck&q=85&s=953e5eba7b5ccbf043ef13ce9873e0fd" alt="A Login link heading with https://example.com/login/7f3a9c under it as a blue link" width="1404" height="168" data-path="images/io-display-link.png" />
</Frame>

## Install

```bash theme={null}
npm install @awaitio/display-link
```

## Setup

Register it under the key you want in `io`:

```ts app.ts {5} theme={null}
import { displayLink } from '@awaitio/display-link';

export const app = new AwaitIO({
  // name, actionsDirectory, theme, secret, users…
  components: { display: { link: displayLink } },
});
```

## Usage

```ts theme={null}
const token = await createLoginToken(user);

await io.display.link('Login link', { url: `https://app.example.com/login/${token}` });
```

The label is the heading above the link; pass `null` for none.

## Props

| Prop | Type | Required | Description |
| - | - | - | - |
| `url` | `string` | Required | Where the link goes. An address with a scheme, such as `https://` or `mailto:`, opens in a new tab; a path such as `/actions/users/change_role?id=2` stays in the app. |
| `text` | `string` | Optional | What the link says. Defaults to the URL. |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.