{
"componentDescription": "Dialogs are overlaid modal paper based components with a backdrop.",
"propDescriptions": {
"aria-describedby": { "description": "The id(s) of the element(s) that describe the dialog." },
"aria-labelledby": { "description": "The id(s) of the element(s) that label the dialog." },
"aria-modal": {
"description": "Informs assistive technologies that the element is modal. It's added on the element with role="dialog"."
},
"BackdropComponent": {
"description": "A backdrop component. This prop enables custom backdrop rendering."
},
"children": { "description": "Dialog children, usually the included sub-components." },
"classes": { "description": "Override or extend the styles applied to the component." },
"disableEscapeKeyDown": {
"description": "If true, hitting escape will not fire the onClose callback."
},
"fullScreen": { "description": "If true, the dialog is full-screen." },
"fullWidth": {
"description": "If true, the dialog stretches to maxWidth.
Notice that the dialog width grow is limited by the default margin."
},
"maxWidth": {
"description": "Determine the max-width of the dialog. The dialog width grows with the size of the screen. Set to false to disable maxWidth."
},
"onClose": {
"description": "Callback fired when the component requests to be closed.",
"typeDescriptions": {
"event": { "name": "event", "description": "The event source of the callback." },
"reason": {
"name": "reason",
"description": "Can be: "escapeKeyDown", "backdropClick"."
}
}
},
"open": { "description": "If true, the component is shown." },
"PaperComponent": { "description": "The component used to render the body of the dialog." },
"PaperProps": {
"description": "Props applied to the Paper element."
},
"scroll": { "description": "Determine the container for scrolling the dialog." },
"slotProps": { "description": "The props used for each slot inside." },
"slots": { "description": "The components used for each slot inside." },
"sx": {
"description": "The system prop that allows defining system overrides as well as additional CSS styles."
},
"TransitionComponent": {
"description": "The component used for the transition. Follow this guide to learn more about the requirements for this component."
},
"transitionDuration": {
"description": "The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object."
},
"TransitionProps": {
"description": "Props applied to the transition element. By default, the element is based on this Transition component."
}
},
"classDescriptions": {
"paperFullScreen": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "fullScreen={true}"
},
"paperFullWidth": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "fullWidth={true}"
},
"paperScrollBody": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "scroll=\"body\"",
"deprecationInfo": "Combine the .MuiDialog-paper and .MuiDialog-scrollBody classes instead. See Migrating from deprecated APIs for more details."
},
"paperScrollPaper": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "scroll=\"paper\"",
"deprecationInfo": "Combine the .MuiDialog-paper and .MuiDialog-scrollPaper classes instead. See Migrating from deprecated APIs for more details."
},
"paperWidthFalse": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "maxWidth=false"
},
"paperWidthLg": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "maxWidth=\"lg\""
},
"paperWidthMd": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "maxWidth=\"md\""
},
"paperWidthSm": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "maxWidth=\"sm\""
},
"paperWidthXl": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "maxWidth=\"xl\""
},
"paperWidthXs": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the Paper component",
"conditions": "maxWidth=\"xs\""
},
"scrollBody": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the container element",
"conditions": "scroll=\"body\""
},
"scrollPaper": {
"description": "Styles applied to {{nodeName}} if {{conditions}}.",
"nodeName": "the container element",
"conditions": "scroll=\"paper\""
}
},
"slotDescriptions": {
"backdrop": "The component that renders the backdrop.",
"container": "The component that renders the container.",
"paper": "The component that renders the paper.",
"root": "The component that renders the root.",
"transition": "The component that renders the transition. Follow this guide to learn more about the requirements for this component."
}
}