​
Example Usage

Call showDialog() from record actions. Hiding the dialog is automatically handled by Attio when the user closes it.

import React from "react"
import {RecordAction, showDialog} from "attio/client"
import {AuroraDialog} from "./aurora-dialog"

export const recordAction: RecordAction = {
    id: "aurora",
    label: "Aurora",
    onTrigger: async ({recordId}) => {
        showDialog({
            title: "Aurora",
            Dialog: () => {
                // This is a React component. It can use hooks and render other components.
                return <AuroraDialog recordId={recordId} />
            },
        })
    },
}

​
API

TypeScript
async function showDialog(options: DialogOptions): Promise<{
    hideDialog: () => Promise<void>
}>

​
Returns

A Promise that resolves to an object containing:

​
hideDialog: () => Promise<void>

By calling hideDialog() you can imperatively hide the dialog.

​
DialogOptions

​
title : string

The title of the dialog.

​
Dialog : React.FC<{ hideDialog: () => void }>

The contents of the dialog.