fix(ui): apply BulkFlyout bodySx to body container

src/ui/__tests__/bulk-flyout.test.tsx

@@ -36,6 +36,7 @@ interface HarnessProps {
   footer?: 'apply-cancel' | null
   applyDisabled?: boolean
   onApply?: () => void
+  bodySx?: Record<string, unknown>
   tabs?: BulkFlyoutTab[]
   panes?: BulkFlyoutPane[]
   rootPaneId?: string
@@ -68,6 +69,7 @@ function Harness(props: HarnessProps) {
             footer={props.footer}
             applyDisabled={props.applyDisabled}
             onApply={props.onApply}
+            bodySx={props.bodySx}
           >
             <div data-testid="rgp-test-body">simple body</div>
           </BulkFlyout>
@@ -172,6 +174,18 @@ describe('<BulkFlyout> simple mode', () => {
     expect(find('[role="dialog"]')).not.toBeNull()
   })
 
+  it('applies bodySx to the body container, not the shell', () => {
+    const { find } = render(
+      <Harness mode="simple" open={true} onClose={() => {}} bodySx={{ display: 'grid' }} />,
+    )
+    const shell = find('[data-testid="rgp-bulk-flyout"]') as HTMLElement
+    const body = find('[data-testid="rgp-bulk-flyout-body"]') as HTMLElement
+    expect(shell).not.toBeNull()
+    expect(body).not.toBeNull()
+    expect(getComputedStyle(body).display).toBe('grid')
+    expect(getComputedStyle(shell).display).toBe('flex')
+  })
+
   it('injects keyframes wrapped in prefers-reduced-motion: no-preference', () => {
     render(<Harness mode="simple" open={true} onClose={() => {}} />)
     const style = document.getElementById('rgp-flyout-keyframes')

src/ui/bulk-flyout.tsx

@@ -204,7 +204,6 @@ export function BulkFlyout(props: BulkFlyoutProps) {
           width,
           maxHeight,
           minWidth: width,
-          ...(bodySx ?? {}),
         }}
         data-testid="rgp-bulk-flyout"
       >
@@ -216,6 +215,7 @@ export function BulkFlyout(props: BulkFlyoutProps) {
             px: 3,
             py: 2,
             minHeight: 0,
+            ...(bodySx ?? {}),
           }}
           data-testid="rgp-bulk-flyout-body"
         >