app

hub

Overview

UI Storybook

Foundations

Building Blocks

Interaction Patterns

Overlay

Side Panel

Feedback

Multi-step

MUI Advanced

Expert Libraries

AG Grid

Advanced

Plotly

Monaco Editor

React Inspector

Engineering

Integrations

Excel & CSV

v0.0.0

Dashboard

Full-Screen Dialog

A full-screen dialog with an AppBar toolbar — the standard mobile-first pattern for complex content editing flows.

Mobile-default pattern: The fullScreen prop on MUI Dialog makes the dialog take up the entire viewport. On desktop you can combine this with a breakpoint: fullScreen={useMediaQuery(theme.breakpoints.down('md'))}. This demo always shows full-screen for clarity.