Skip to main content
Big news! Interval has been acquired by Meter. Learn more →

io.display.metadata

Displays a series of label/value pairs in a variety of layout options.

Usage

await io.display.metadata("User info", {
layout: "card",
data: [
{
label: "Name",
value: `${user.firstName} ${user.lastName}`,
},
{
label: "Email",
value: user.email,
url: `mailto:${user.email}`,
},
{
label: "Friends",
value: user.friends.length,
},
],
});
interval.com

Props

data

Required

MetaItem[]

Array of label/value objects, with optional markup data.
type MetaItem = {
// the item label
label: string;
// the item display text value
value?: string | number | boolean | Date;
// links the item to an external URL
url?: string;
// links the item to another action or page
route?: string;
// arbitrary key/value pairs to send to the linked route
props?: Record<string, any>;
// a visible image to be displayed in the cell
// must contain either `url` or `buffer`
image?: {
// a URL to the image
url?: string
// a buffer containing the image contents
buffer?: Buffer
// the image alt tag
alt?: string
// the size of the image
size?: "thumbnail" | "small" | "medium" | "large"
}
}[]

layout

Optional

'card' | 'list' | 'grid'

Layout to display the metadata items, defaults to "grid"

Returns

null

Examples

Asynchronous data

info

New in version 1.2.0 of the SDK.

If desired for performance, all of the properties in the data value objects aside from label can be awaitable Eventual versions of their respective types above:

Eventual definition
type Eventual = T | Promise<T> | () => T | () => Promise<T>;
Action code snippet
await io.display.metadata({
data: [
{
label: "Total users",
value: async () => await db.users.count(),
},
],
});
Did this section clearly explain what you wanted to learn?