Estoy tratando de crear un cuadro de diálogo ( https://mui.com/components/dialogs/ ), he intentado configurar el valor sx minHeight, height, etc. pero cuando el cuadro de diálogo muestra, cambia la altura según lo que haya dentro.

¿Cómo puedo fijar la altura al 80% de la ventana y asegurarme de que no se encoja cuando hay menos contenido para llenar el espacio?

 <Dialog onClose={handleClose} open={open} fullWidth={true} maxWidth="lg" sx={{ height: '80%' }}> <DialogTitle sx={{ m: 0, p: 2 }}> Search drft <IconButton aria-label="close" onClick={handleClose} sx={{ position: 'absolute', right: 8, top: 8, color: (theme) => theme.palette.grey[500], }} > <CloseIcon /> </IconButton> </DialogTitle> <DialogContent dividers> {/* <DialogTitle>Search drft</DialogTitle> */} <GlobalSearch /> </DialogContent> </Dialog>

Actualización: siguiendo algunos consejos de una pregunta diferente, realicé la siguiente actualización y el cuadro de diálogo ahora está fijo al 80% de altura, ¡sin importar qué tan alto sea el contenido!

 <Dialog PaperProps={{ sx: { minHeight: '80%', maxHeight: '80%' } }} {...other} >