Sanity UI
Docs
Arcade
  1. Docs
  2. Components
  3. Dialog

<Dialog />

The Dialog component.

Basic example  

The Dialog component is typically rendered conditionally. It also needs an onClose property to function as expected:
import {useCallback, useState} from 'react'

const [open, setOpen] = useState(false)
const onClose = useCallback(() => setOpen(false), [])
const onOpen = useCallback(() => setOpen(true), [])
With that in place, it’s straight-forward to build a basic open/close flow using the Dialog component:

Properties  

animate?: boolean
Whether the dialog should animate in on mount
cardRadius?: number | number[]
cardShadow?: number | number[]
footer?: React.ReactNode
header?: React.ReactNode
id: string
onClose?: () => void
scheme?: 'dark' | 'light'
width?: number | number[]
zOffset?: number
Made withby folks at