Add default styles for Modal.Content

[krzysztofzuraw]

What I'm trying to achieve

Currently if developer wants to use Modal.Content component they need to add their own styling in order to use it.

Describe a proposed solution

Add default styling for Modal.Content that allow overriding defaults if needed.
Proposed properties to add to Modal.Content:

__left="50%"
__maxWidth="400px"
__top="50%"
__transform="translate(-50%, -50%)"
backgroundColor="surfaceNeutralPlain"
boxShadow="modal"
position="fixed"

After this change API for Modal.Content will change from:

<Modal.Content>
  <Box
    __left="50%"
    __maxWidth="400px"
    __top="50%"
    __transform="translate(-50%, -50%)"
    backgroundColor="surfaceNeutralPlain"
    boxShadow="modal"
    position="fixed"
  >
    Modal content!
  </Box>
</Modal.Content>

to

<Modal.Content __width="600px">Modal content!</Modal.Content>

[lkostrowski]

I think its fine. We should document in storybook sizing, we can also propose patterns (large = 800, medium = 600 etc). Later we can consider a variant API for sizing.

[github-actions]

This issue is stale because it has been open 14 days with no activity.