Expose UNSTABLE container for RSP overlays #5723
Conversation
|
Build successful! 🎉 |
| expect(getByRole('menu').closest('[data-testid="custom-container"]')).toBe(getByTestId('custom-container')); | ||
| }); | ||
| it('should render the menu tray in the portal container', async () => { | ||
| windowSpy.mockImplementation(() => 700); |
There was a problem hiding this comment.
Seeing this test made me realize we didn't have a test for Menu loading as a tray on mobile. Submenu does have one. :)
| ...tooltipProps | ||
| }}> | ||
| <Overlay isOpen={state.isOpen} nodeRef={overlayRef}> | ||
| <Overlay isOpen={state.isOpen} nodeRef={overlayRef} container={UNSTABLE_portalContainer}> |
There was a problem hiding this comment.
Was this part of the request? It previously didn't support container. I'm trying to think of the case for this because Tooltip is usually the text label for an icon button.
There was a problem hiding this comment.
I don't understand the question
There was a problem hiding this comment.
The container prop here is on RSP Overlay which we don't expose so it should be fine (said container gets set as the portal container internally). Users can pass UNSTABLE_portalContainer to TooltipTrigger though which falls in line with the intended change
|
I need to add DialogContainer |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
## API Changes
unknown top level export { type: 'any' } @react-spectrum/dialogDialogContainer SpectrumDialogContainerProps {
+ UNSTABLE_portalContainer?: Element = document.body
children: ReactNode
isDismissable?: boolean
isKeyboardDismissDisabled?: boolean
onDismiss: () => void
}
useDialogContainer SpectrumDialogTriggerProps {
+ UNSTABLE_portalContainer?: Element = document.body
children: [ReactElement, SpectrumDialogClose | ReactElement]
hideArrow?: boolean
isDismissable?: boolean
isKeyboardDismissDisabled?: boolean
targetRef?: RefObject<HTMLElement>
type?: 'modal' | 'popover' | 'tray' | 'fullscreen' | 'fullscreenTakeover' = 'modal'
}
@react-spectrum/menuContextualHelpTrigger SpectrumActionMenuProps<T> {
+ UNSTABLE_portalContainer?: HTMLElement = document.body
align?: Alignment = 'start'
autoFocus?: boolean
closeOnSelect?: boolean = true
direction?: 'bottom' | 'top' | 'left' | 'right' | 'start' | 'end' = 'bottom'
isQuiet?: boolean
onAction?: (Key) => void
shouldFlip?: boolean = true
trigger?: MenuTriggerType = 'press'
}
Section SpectrumMenuTriggerProps {
+ UNSTABLE_portalContainer?: HTMLElement = document.body
align?: Alignment = 'start'
children: Array<ReactElement>
closeOnSelect?: boolean = true
direction?: 'bottom' | 'top' | 'left' | 'right' | 'start' | 'end' = 'bottom'
trigger?: MenuTriggerType = 'press'
}
@react-spectrum/overlaysModal Tray {
children: ReactNode
+ container?: Element
isFixedHeight?: boolean
state: OverlayTriggerState
}@react-spectrum/tooltipTooltipTrigger SpectrumTooltipTriggerProps {
+ UNSTABLE_portalContainer?: Element = document.body
children: [ReactElement, ReactElement]
delay?: number = 1500
isDisabled?: boolean
offset?: number = 7
}
|
This reverts commit 7c1da9f.
5 participants
Closes
✅ Pull Request Checklist:
📝 Test Instructions:
🧢 Your Project: