io.display.link

One link, in the app or out of it.

io.display.link shows a link on a page or in a step of an action. It can open another action in the app or a page outside it. It only displays and returns nothing.

Read the docs All components

The simplest one

The whole action file, and roughly what your team sees when it runs.

src/actions/users/loginLinkAction.ts

import { app } from '../../app';

import { createLoginToken } from '../../auth';

export const loginLinkAction = app.defineAction({

name: 'Login link',

handler: async ({ io, ctx }) => {

const token = await createLoginToken(ctx.user);

await io.display.link('Login link', {

url: `https://app.example.com/login/${token}`,

});

The code. One call in an action, the whole file.

tools.example.com/actions/users/login_link

Continue

In the browser. Roughly what your team sees. Your theme decides the details.

What you can set

The settings you will reach for most, each with the line of code that turns it on.

url: 'https://status.example.com'

Out of the app. An address with a scheme, such as https://, opens in a new tab.

url: '/actions/users/change_role?id=2'

Into another action. A path without a scheme stays in the app. It opens that action, here with its id.

text: 'Open the invoice'

Your own words. Set text to say what the link opens. Without it, the link shows the URL.

url: 'mailto:ana@northwind.example'

Email addresses. A mailto: address works too. Like every address with a scheme, it opens in a new tab.

io.display.link(null, { url })

A heading, or none. The label is the heading above the link. Pass null for none.

await io.display.link('Map', { url })

On a page or in a step. Put it on a folder page next to a table. In an action it is a step with Continue, or sits in a group next to inputs.

More in the docs

This page shows the idea. The docs have every prop, the checks on the server and more examples.

docs.awaitio.com/io/display-linkDisplay LinkInstall, setup, the URL and the text, and which links open in a new tab.docs.awaitio.com/core/display-componentsDisplay componentsWhere a link can go: a page, a step of an action or a group next to inputs.docs.awaitio.com/core/routingRoutingThe URL every action gets from its path, the one a link into the app points at.

Next components

Three more calls on io. Each one shows a control and hands your code a typed value.

BillingPlan, invoices and refunds

io.display.headingMore →

A section title

io.display.imageMore →

A picture, such as a file preview

Refund policy

io.display.markdownMore →

Formatted text in a step

Write your first tool today.

An async function, a few await calls, and the form is in the browser.

Get started See the demo