Description
Provide a general summary of the issue here
I'm just upgrading to the latest version of react-aria now and I'm getting a number of type errors that appear to be related to this PR (I believe this commit is responsible).
🤔 Expected Behavior?
There should be no type errors when using DismissButton
or OverlayProvider
components as JSX elements.
😯 Current Behavior
There are type errors when using the DismissButton
or OverlayProvider
components as a JSX elements
💁 Possible Solution
The return types of at least some of the overlay components should probably be ReactElement
and not ReactNode
, since ReactNode
is broader than required and prevents components from being used as JSX elements.
I've highlighted DismissButton
and OverlayProvider
because they're the errors I've encountered so far. I suspect there are more components than that with this issue.
🔦 Context
No response
🖥️ Steps to Reproduce
- Using
@react-aria/overlays
version3.27.0
- Attempt to use the
DismissButton
component, like below - See the below type errors
import React from 'react'
import { DismissButton } from 'react-aria'
import type { DismissButtonProps } from 'react-aria'
type AriaDismissProps = DismissButtonProps
export const AriaDismiss = ({ onDismiss }: AriaDismissProps) => {
return (
<DismissButton
aria-label="Dismiss"
onDismiss={onDismiss}
/>
)
}
'DismissButton' cannot be used as a JSX component.
Its return type 'ReactNode' is not a valid JSX element.
Type 'undefined' is not assignable to type 'Element | null'.
We're in the process of moving away from react 17, so our @react-types @types/react version is currently 17.0.85
Version
[email protected], but the relevant transitive dependency seems to be react-aria/[email protected]
What browsers are you seeing the problem on?
Other
If other, please specify.
No response
What operating system are you using?
macOS Sequoia Version 15.4
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response