fix: add support for changing the surface mode in the menu

[lenzi-erickson]

Motivation

I prefer the "flat" design approach on my components, and would like to be able to use the Menu component in flat mode.

Related issue

You cannot currently change the mode on the Surface that is used in the Menu component.

Test plan

Pull up the menu example and pass mode="flat" to one of the menus to test.

[callstack-bot]

Hey @lenzi-erickson, thank you for your pull request 🤗. The documentation from this branch can be viewed here.

[seb-zabielski]

Hey,
Modal component has an “elevation” property. If you set elevation={0} it should look like a flat component. Does your change have a better/different effect than the elevation prop?
https://callstack.github.io/react-native-paper/docs/components/Menu/#elevation

[lenzi-erickson]

Hey, Modal component has an “elevation” property. If you set elevation={0} it should look like a flat component. Does your change have a better/different effect than the elevation prop? https://callstack.github.io/react-native-paper/docs/components/Menu/#elevation

elevation={0} does not do what I was wanting. In my opinion, it makes the menu look broken. If you run the example in this branch, you can see the differences.

Default

elevation={0}

mode="flat"

[seb-zabielski]

Now I see your point. Change looks good to me. Can you add a test to this case?

[lenzi-erickson]

Now I see your point. Change looks good to me. Can you add a test to this case?

What are you wanting me to test, exactly? Since I'm just passing a prop through, and did not add any logic, I'm not sure what you are wanting me to test.

[lenzi-erickson]

I attempted to add some tests. If it's not what you are hoping for, I need some help getting it here, please.

[seb-zabielski]

This is exactly what I was expecting. Thanks!