App Layout component

Expected Behavior 🤔

It should provide a configurable layout out of the box without so much additional coding required.
This is a really basic feature and e.g. Ant Design does it great and so simple.

Current Behavior 😯

Any layout has to be done with a lot of coding to handle RWD, different drawer variants etc.

Examples 🌈

Origen Studio Layout component which is using Material UI!: https://github.com/OrigenStudio/material-ui-layout.

Quasar Framework Layout (VueJS). Such a great implementation for VueJS. Easy, flexible, and reliable.
https://v1.quasar-framework.org/layout/layout

and also to show how simple it can/should be Ant Design Layout: https://ant.design/components/layout/

Context 🔦

It is time-consuming to set up the layout with Material UI and everyone has to do it on his/her own instead of the job being done once in the MUI repo and being reused across all projects.

Benchmark

• https://www.tremor.so/blocks/page-shells
• https://quasar.dev/layout/layout
• https://vuetifyjs.com/en/getting-started/wireframes/
• https://ant.design/components/layout/
• https://tailwindui.com/components/application-ui/application-shells/stacked
• https://ui.shadcn.com/blocks
• Jun Layout https://github.com/siriwatknp/mui-treasury/tree/8238811dad4eb6d0ff5275c76b6957d9bae43c6d/packages/mui-layout
• https://panjiachen.github.io/vue-element-admin/#/nested/menu1/menu1-1 (nested routes)

Advanced layout components: https://github.com/mui/mui-toolpad/issues/3280

The issue names no repository files, entry points, or tests; start by reviewing the referenced Ant Design, Quasar, and Origen Studio layouts alongside the linked Material UI layout discussion. Before implementation, agree on the supported configurable layout, responsive behavior, and drawer variants; done means that scope is implemented as a reusable Material UI component.