theme-ui
theme-ui copied to clipboard
`IntrinsicSxElements` does not include `span` property
Describe the bug
The IntrinsicSxElements
interface, defined in @theme-ui/core/src/types.ts
, appears to be the only public-facing way to access the types of props of Theme UI's JSX intrinsic elements. It does not include a span
property, despite including properties for seemingly every other major element type (like div
, h1
-h6
, img
, code
, etc).
To Reproduce Steps to reproduce the behavior:
- Attempt to make a component that looks something like this:
function CustomSpan(props: IntrinsicSxElements["span"] & { myProp: string }) {
return <span sx={{ ...props }} />;
}
- Observe that TypeScript gives an error on
"span"
:TS2339: Property 'span' does not exist on type 'IntrinsicSxElements'.
Expected behavior
This interface should include a span
property.
Additional context
The workaround I'm currently using is to use JSX.IntrinsicElements["span"] & SxProp
, which is what each IntrinsicSxElements
property eventually expands to.
I'd be happy to make a PR to fix this, just wanted to check that this wasn't intentional for some reason I didn't realize before spending time doing so.