[RAC] `Popover` style inside `Select` & `ComboBox` does not works properly

[6thpath]

Provide a general summary of the issue here

when using Select or ComboBox component, passing style as function to Popover component would make --trigger-width style property is unavailable

🤔 Expected Behavior?

Popover inside Select & ComboBox also receive --trigger-width even if style is specified as a function

😯 Current Behavior

--trigger-width is not passed to Popover when style is passed to component as a function

💁 Possible Solution

No response

🔦 Context

No response

🖥️ Steps to Reproduce

https://codesandbox.io/p/sandbox/racpopover-lfv6dt

try to comment the 33rd line and uncomment the 34th line. as you can see, whenever style prop is function then --trigger-width is not passed to the popover

Version

latest

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

MacOS

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

[sookmax]

I did some digging, and it looks like the root cause of this is the fact that useContextProps() will merge contextProps and props only when both of them are of type object: https://github.com/adobe/react-spectrum/blob/a597a0ce5f345a7c5968939d120eafbe6f02ac2a/packages/react-aria-components/src/utils.tsx#L193-L204

Since the above condition is not met when a user provides their style as a function, it resorts to the default merging strategy of mergeProps(contextProps, props), which is to select the value of the last argument (in our case, props over contextProps: https://github.com/adobe/react-spectrum/blob/a597a0ce5f345a7c5968939d120eafbe6f02ac2a/packages/%40react-aria/utils/src/mergeProps.ts#L68-L70

So that's why the contextProps passed by Combobox that contains style: {'--trigger-width': menuWidth} is overwritten by the user provided style={() => ({ background: "red" })}.