Styling not applied to CardView wrapper when using an action bar

[jluyau]

Provide a general summary of the issue here

If providing styling to <CardView> configured with renderActionBar, the props (e.g. UNSAFE_style, UNSAFE_className, styles) do not get applied to the wrapper (

react-spectrum/packages/@react-spectrum/s2/src/CardView.tsx

Lines 619 to 622 in 101d077

	<div ref={domRef} className={style({position: 'relative', overflow: 'clip', size: 'fit'})}>
	{cardView}
	{actionBar}
	</div>

)

🤔 Expected Behavior?

should be able to style the wrapper (when using an action bar) as one would style CardView

😯 Current Behavior

because the styles are not applied to the outer wrapper, the cardview does not behavior as we would like (e.g. placing it within a grid area). placing a div with these styling props around cardview configured with an action bar also doesn't work as expected

💁 Possible Solution

No response

🔦 Context

unable to place cardview within a specific grid area

🖥️ Steps to Reproduce

configure <CardView> with renderActionBar and a styling prop (e.g. styles)

Version

s2: 0.6.0

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

macOS Sonoma 14.1.1

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response