io.display.metadata

Represents a display.metadata component. The metadata component displays a grid of key value pairs to represent metadata details.

Usage

JavaScript/TypeScript

await io.display.metadata("Order Details",{
  layout: "card",
  data: [
    {
      label: "ID",
      value: "O1-49293420",
    },
    {
      label: "Email",
      value: "[email protected]",
    },
    {
      label: "Address",
      value: "123 Forge St",
    },
  ],
});

Python

await io.display.metadata("Order Details",
    layout = "card",
    data = [
        {"label": "ID", "value": "O1-49293420"},
        {"label": "Email", "value": "[email protected]"},
        {"label": "Address", "value": "123 Forge St"},
    ],
)

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