Example

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<void>

Returns

A Promise that resolves when the dialog is closed.

DialogOptions

title
string
required
The title of the dialog.
Dialog
React.FC<{ hideDialog: () => void }>
required
The contents of the dialog.