Currently, the header and footer of the dialog can be completely overridden with slots. If this is done, no layout styles will be provided for the header or footer, and the dev user can completely customize the styles.
However, this does not exist for the default slot, the body of the dialog. This is causing issues with the OnboardingDialog (T332767). Initially, we assumed that the image in this dialog could be part of the header, but this makes it difficult to change the image along with the rest of the content of the step when going to the next step, especially with regards to the transition animation. Instead, the growth team included the image in the default slot and had to override padding and gap styles ([[ https://doc.wikimedia.org/GrowthExperiments/master/js/frontend/demos/add-image-dialog.html | see demo ]]). (It's also worth noting that the image makes more sense semantically in the body.)
The padding and gap styles exist on the body to support basic use cases where no custom styling is needed, and the user just wants some space around their text. However, we should consider making it possible to remove these default styles when the user wants to fully customize the body layout. Perhaps we could add a boolean `removeBodySpacing` prop?
---
- [] Consider how to support customization of the body layout without requiring dev users to override Codex styles
- [] Implement any needed changes in the Codex Dialog