[Collapse] Support anchoring content to the bottom/right

[Janpot]

Summary

Would like to be able to anchor the collapsed content to the bottom of to container. The effect can be achieved by adding following styles to the Collapse but it would be nice to have a prop that can handle this:

sx={{
  display: "flex",
  flexDirection: "column-reverse",
}}

Perhaps the direction prop can even be expanded to account for this use-case. If not accepted, perhaps this use-case could be added to the docs?

Examples

Here's a codesandbox that displays the desired behavior: https://codesandbox.io/p/sandbox/lucid-heyrovsky-wrjrnp?file=%2Fsrc%2FDemo.tsx%3A47%2C45

https://github.com/user-attachments/assets/9e8f89dc-5d60-4ee6-80f0-ddd286fe6a8a

Motivation

I struggled a bit with this when building Toolpad component catalog, which feels better when it looks like the drawer is pulled from under the left edge, rather than it being already in place and revealed gradually. Now I'm running into it again with another component.

https://github.com/user-attachments/assets/0398c9c8-7fb3-42df-a94f-ecd53b223b31

vs.

https://github.com/user-attachments/assets/5aa03937-8810-4541-b021-af2caea3d114

Search keywords: collapse reverse

[siriwatknp]

Perhaps the direction prop can even be expanded to account for this use-case. If not accepted, perhaps this use-case could be added to the docs?

That's a good start. I'll do it after the stable release.