Skip to content

Commit f42b6ab

Browse files
stipsanstipsan
authored
fix(typings): use React.JSX namespace (#1543)
1 parent 0c84a3e commit f42b6ab

File tree

24 files changed

+42
-65
lines changed

24 files changed

+42
-65
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@sanity/ui",
3-
"version": "2.10.16",
3+
"version": "2.10.17-canary.0",
44
"keywords": [
55
"sanity",
66
"ui",

‎src/core/components/menu/menuGroup.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {ChevronRightIcon} from '@sanity/icons'
2-
import {isValidElement, useCallback, useEffect, useState, type JSX} from 'react'
2+
import {isValidElement, useCallback, useEffect, useState} from 'react'
33
import {isValidElementType} from 'react-is'
44
import {useArrayProp} from '../../hooks'
55
import {Box, Flex, Popover, PopoverProps, Text} from '../../primitives'
@@ -13,7 +13,7 @@ import {useMenu} from './useMenu'
1313
* @public
1414
*/
1515
export interface MenuGroupProps {
16-
as?: React.ElementType | keyof JSX.IntrinsicElements
16+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
1717
fontSize?: number | number[]
1818
icon?: React.ElementType | React.ReactNode
1919
padding?: number | number[]

‎src/core/components/menu/menuItem.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import {
77
useMemo,
88
useRef,
99
useState,
10-
type JSX,
1110
} from 'react'
1211
import {isValidElementType} from 'react-is'
1312
import {useArrayProp} from '../../hooks'
@@ -23,7 +22,7 @@ import {useMenu} from './useMenu'
2322
* @public
2423
*/
2524
export interface MenuItemProps extends ResponsivePaddingProps, ResponsiveRadiusProps {
26-
as?: React.ElementType | keyof JSX.IntrinsicElements
25+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
2726
fontSize?: number | number[]
2827
hotkeys?: string[]
2928
icon?: React.ElementType | React.ReactNode

‎src/core/primitives/avatar/avatar.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {ThemeColorAvatarColorKey} from '@sanity/ui/theme'
2-
import {forwardRef, useCallback, useEffect, useId, useMemo, useState, type JSX} from 'react'
2+
import {forwardRef, useCallback, useEffect, useId, useMemo, useState} from 'react'
33
import ReactIs from 'react-is'
44
import {styled} from 'styled-components'
55
import {useArrayProp} from '../../hooks'
@@ -16,7 +16,7 @@ export interface AvatarProps {
1616
__unstable_hideInnerStroke?: boolean
1717
animateArrowFrom?: AvatarPosition
1818
arrowPosition?: AvatarPosition
19-
as?: React.ElementType | keyof JSX.IntrinsicElements
19+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
2020
color?: ThemeColorAvatarColorKey
2121
initials?: string
2222
onImageLoadError?: (event: Error) => void

‎src/core/primitives/badge/badge.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {forwardRef, type JSX} from 'react'
1+
import {forwardRef} from 'react'
22
import {styled} from 'styled-components'
33
import {useArrayProp} from '../../hooks'
44
import {responsiveRadiusStyle, ResponsiveRadiusStyleProps} from '../../styles/internal'
@@ -13,7 +13,7 @@ import {BadgeStyleProps} from './types'
1313
* @public
1414
*/
1515
export interface BadgeProps extends BoxProps, ResponsiveRadiusProps {
16-
as?: React.ElementType | keyof JSX.IntrinsicElements
16+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
1717
fontSize?: number | number[]
1818
/** @deprecated No longer used. */
1919
mode?: BadgeMode

‎src/core/primitives/box/box.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {forwardRef, type JSX} from 'react'
1+
import {forwardRef} from 'react'
22
import {styled} from 'styled-components'
33
import {useArrayProp} from '../../hooks'
44
import {
@@ -31,8 +31,8 @@ export interface BoxProps
3131
ResponsiveGridItemProps,
3232
ResponsiveMarginProps,
3333
ResponsivePaddingProps {
34-
as?: React.ElementType | keyof JSX.IntrinsicElements
35-
forwardedAs?: React.ElementType | keyof JSX.IntrinsicElements
34+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
35+
forwardedAs?: React.ElementType | keyof React.JSX.IntrinsicElements
3636
}
3737

3838
const Root = styled.div<

‎src/core/primitives/button/button.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {forwardRef, isValidElement, useMemo, type JSX} from 'react'
1+
import {forwardRef, isValidElement, useMemo} from 'react'
22
import {isValidElementType} from 'react-is'
33
import {styled} from 'styled-components'
44
import {useArrayProp} from '../../hooks'
@@ -17,7 +17,7 @@ import {buttonBaseStyles, buttonColorStyles} from './styles'
1717
* @public
1818
*/
1919
export interface ButtonProps extends ResponsivePaddingProps, ResponsiveRadiusProps {
20-
as?: React.ElementType | keyof JSX.IntrinsicElements
20+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
2121
fontSize?: number | number[]
2222
mode?: ButtonMode
2323
icon?: React.ElementType | React.ReactNode

‎src/core/primitives/code/code.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {forwardRef, type JSX} from 'react'
1+
import {forwardRef} from 'react'
22
import Refractor from 'react-refractor'
33
import {styled} from 'styled-components'
44
import {useArrayProp} from '../../hooks'
@@ -9,7 +9,7 @@ import {codeBaseStyle} from './styles'
99
* @public
1010
*/
1111
export interface CodeProps {
12-
as?: React.ElementType | keyof JSX.IntrinsicElements
12+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
1313
/** Define the language to use for syntax highlighting. */
1414
language?: string
1515
size?: number | number[]

‎src/core/primitives/heading/heading.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {ThemeFontWeightKey} from '@sanity/ui/theme'
2-
import {forwardRef, type JSX} from 'react'
2+
import {forwardRef} from 'react'
33
import {styled} from 'styled-components'
44
import {useArrayProp} from '../../hooks'
55
import {
@@ -18,7 +18,7 @@ import {HeadingStyleProps} from './types'
1818
export interface HeadingProps {
1919
accent?: boolean
2020
align?: TextAlign | TextAlign[]
21-
as?: React.ElementType | keyof JSX.IntrinsicElements
21+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
2222
muted?: boolean
2323
size?: number | number[]
2424
/**

‎src/core/primitives/kbd/kbd.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {forwardRef, type JSX} from 'react'
1+
import {forwardRef} from 'react'
22
import {styled, css} from 'styled-components'
33
import {useArrayProp} from '../../hooks'
44
import {responsiveRadiusStyle, ResponsiveRadiusStyleProps} from '../../styles/internal'
@@ -10,7 +10,7 @@ import {Text} from '../text'
1010
* @public
1111
*/
1212
export interface KBDProps {
13-
as?: React.ElementType | keyof JSX.IntrinsicElements
13+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
1414
fontSize?: number | number[]
1515
padding?: number | number[]
1616
radius?: Radius | Radius[]

‎src/core/primitives/label/label.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {ThemeFontWeightKey} from '@sanity/ui/theme'
2-
import {forwardRef, type JSX} from 'react'
2+
import {forwardRef} from 'react'
33
import {styled} from 'styled-components'
44
import {useArrayProp} from '../../hooks'
55
import {responsiveLabelFont, responsiveTextAlignStyle} from '../../styles/internal'
@@ -12,7 +12,7 @@ import {labelBaseStyle} from './styles'
1212
export interface LabelProps {
1313
accent?: boolean
1414
align?: TextAlign | TextAlign[]
15-
as?: React.ElementType | keyof JSX.IntrinsicElements
15+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
1616
muted?: boolean
1717
size?: number | number[]
1818
/**

‎src/core/primitives/stack/stack.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {forwardRef, type JSX} from 'react'
1+
import {forwardRef} from 'react'
22
import {styled} from 'styled-components'
33
import {useArrayProp} from '../../hooks'
44
import {Box, BoxProps} from '../box'
@@ -8,7 +8,7 @@ import {stackBaseStyle, responsiveStackSpaceStyle, ResponsiveStackSpaceStyleProp
88
* @public
99
*/
1010
export interface StackProps extends BoxProps {
11-
as?: React.ElementType | keyof JSX.IntrinsicElements
11+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
1212
space?: number | number[]
1313
}
1414

‎src/core/primitives/text/text.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import {ThemeFontWeightKey} from '@sanity/ui/theme'
2-
import {forwardRef, type JSX} from 'react'
2+
import {forwardRef} from 'react'
33
import {styled} from 'styled-components'
44
import {useArrayProp} from '../../hooks'
55
import {
@@ -16,7 +16,7 @@ import {textBaseStyle} from './styles'
1616
export interface TextProps {
1717
accent?: boolean
1818
align?: TextAlign | TextAlign[]
19-
as?: React.ElementType | keyof JSX.IntrinsicElements
19+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
2020
/** When `true` the text color will be muted. */
2121
muted?: boolean
2222
size?: number | number[]

‎src/core/utils/elementQuery/elementQuery.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {forwardRef, useImperativeHandle, useMemo, useState, type JSX} from 'react'
1+
import {forwardRef, useImperativeHandle, useMemo, useState} from 'react'
22
import {useElementSize} from '../../hooks'
33
import {useTheme_v2} from '../../theme'
44
import {findMaxBreakpoints, findMinBreakpoints} from './helpers'
@@ -8,7 +8,7 @@ import {findMaxBreakpoints, findMinBreakpoints} from './helpers'
88
* @beta
99
*/
1010
export interface MediaQueryProps {
11-
as?: React.ElementType | keyof JSX.IntrinsicElements
11+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
1212
media?: number[]
1313
}
1414

‎src/core/utils/layer/layer.tsx

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,4 @@
1-
import {
2-
FocusEvent,
3-
forwardRef,
4-
useCallback,
5-
useEffect,
6-
useImperativeHandle,
7-
useRef,
8-
type JSX,
9-
} from 'react'
1+
import {FocusEvent, forwardRef, useCallback, useEffect, useImperativeHandle, useRef} from 'react'
102
import {styled} from 'styled-components'
113
import {EMPTY_RECORD} from '../../constants'
124
import {containsOrEqualsElement, isHTMLElement} from '../../helpers'
@@ -17,14 +9,14 @@ import {useLayer} from './useLayer'
179
* @public
1810
*/
1911
export interface LayerProps {
20-
as?: React.ElementType | keyof JSX.IntrinsicElements
12+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
2113
/** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
2214
onActivate?: (props: {activeElement: HTMLElement | null}) => void
2315
zOffset?: number | number[]
2416
}
2517

2618
interface LayerChildrenProps {
27-
as?: React.ElementType | keyof JSX.IntrinsicElements
19+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
2820
onActivate?: LayerProps['onActivate']
2921
}
3022

‎src/core/utils/srOnly/srOnly.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import {forwardRef, type JSX} from 'react'
1+
import {forwardRef} from 'react'
22
import {styled} from 'styled-components'
33

44
/**
55
* @public
66
*/
77
export interface SrOnlyProps {
8-
as?: React.ElementType | keyof JSX.IntrinsicElements
8+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
99
children?: React.ReactNode
1010
}
1111

‎src/core/utils/virtualList/virtualList.tsx

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,4 @@
1-
import {
2-
forwardRef,
3-
useEffect,
4-
useImperativeHandle,
5-
useMemo,
6-
useRef,
7-
useState,
8-
type JSX,
9-
} from 'react'
1+
import {forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState} from 'react'
102
import {styled} from 'styled-components'
113
import {_isScrollable} from '../../helpers'
124
import {_ResizeObserver} from '../../observers'
@@ -29,7 +21,7 @@ export interface VirtualListChangeOpts {
2921
* @beta
3022
*/
3123
export interface VirtualListProps<Item = any> {
32-
as?: React.ElementType | keyof JSX.IntrinsicElements
24+
as?: React.ElementType | keyof React.JSX.IntrinsicElements
3325
gap?: number
3426
getItemKey?: (item: Item, itemIndex: number) => string
3527
items?: Item[]

‎stories/components/Autocomplete.stories.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import {SearchIcon} from '@sanity/icons'
22
import type {Meta, StoryFn, StoryObj} from '@storybook/react'
3-
import type {JSX} from 'react'
43
import {Autocomplete} from '../../src/core/components'
54
import {Card} from '../../src/core/primitives'
65
import {RADII} from '../constants'
@@ -14,7 +13,7 @@ const meta: Meta<typeof Autocomplete> = {
1413
},
1514
component: Autocomplete,
1615
decorators: [
17-
(Story: StoryFn): JSX.Element => (
16+
(Story: StoryFn): React.JSX.Element => (
1817
<Card paddingBottom={8} paddingTop={3}>
1918
{/* @ts-expect-error fix later */}
2019
<Story />

‎stories/components/Dialog.stories.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/* eslint-disable react-hooks/rules-of-hooks */
22
import {ArrowDownIcon, ArrowUpIcon} from '@sanity/icons'
33
import type {Meta, StoryFn, StoryObj} from '@storybook/react'
4-
import {useCallback, useState, type JSX} from 'react'
4+
import {useCallback, useState} from 'react'
55
import {Dialog} from '../../src/core/components'
66
import {Box, Button, Card, Flex, Inline, Stack, Text} from '../../src/core/primitives'
77
import {BoundaryElementProvider, PortalProvider} from '../../src/core/utils'
@@ -58,7 +58,7 @@ const meta: Meta<typeof Dialog> = {
5858
},
5959
component: Dialog,
6060
decorators: [
61-
(Story: StoryFn): JSX.Element => {
61+
(Story: StoryFn): React.JSX.Element => {
6262
const [boundaryElement, setBoundaryElement] = useState<HTMLDivElement | null>(null)
6363
const [portalElement, setPortalElement] = useState<HTMLDivElement | null>(null)
6464

‎stories/components/MenuItem.stories.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import type {Meta, StoryFn, StoryObj} from '@storybook/react'
2-
import type {JSX} from 'react'
32
import {Menu, MenuItem} from '../../src/core/components'
43
import {Card, Container} from '../../src/core/primitives'
54
import {LayerProvider} from '../../src/core/utils'
@@ -22,7 +21,7 @@ const meta: Meta<typeof MenuItem> = {
2221
},
2322
component: MenuItem,
2423
decorators: [
25-
(Story: StoryFn): JSX.Element => (
24+
(Story: StoryFn): React.JSX.Element => (
2625
<Container width={0}>
2726
<Card radius={3} shadow={2}>
2827
<LayerProvider>

‎stories/components/Toast.stories.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
/* eslint-disable react-hooks/rules-of-hooks */
22
import type {Meta, StoryFn, StoryObj} from '@storybook/react'
3-
import type {JSX} from 'react'
43
import {Toast, ToastProvider, useToast} from '../../src/core/components'
54
import {Button, Inline} from '../../src/core/primitives'
65

76
const meta: Meta<typeof Toast> = {
87
args: {title: 'Toast title', description: 'Toast description'},
98
component: Toast,
109
decorators: [
11-
(Story: StoryFn): JSX.Element => (
10+
(Story: StoryFn): React.JSX.Element => (
1211
<ToastProvider>
1312
{/* @ts-expect-error fix later */}
1413
<Story />

‎stories/helpers/matrixBuilder.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import type {JSX} from 'react'
21
import {Card, Flex, Grid, Text} from '../../src/core/primitives'
32
import {ThemeColorSchemeKey} from '../../src/theme'
43

@@ -96,7 +95,7 @@ export function matrixBuilder<Rows extends string[], Cols extends string[]>({
9695
title,
9796
renderItem,
9897
subHeader,
99-
}: MatrixBuilderProps<Rows, Cols>): JSX.Element {
98+
}: MatrixBuilderProps<Rows, Cols>): React.JSX.Element {
10099
return (
101100
<Table scheme={scheme} columns={columns} rows={rows} title={title} subHeader={subHeader}>
102101
{rows.map((row) => (

‎stories/primitives/AvatarCounter.stories.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import type {Meta, StoryFn, StoryObj} from '@storybook/react'
2-
import type {JSX} from 'react'
32
import {AvatarCounter, AvatarStack} from '../../src/core/primitives'
43
import {getAvatarSizeControls} from '../controls'
54

@@ -12,7 +11,7 @@ const meta: Meta<typeof AvatarCounter> = {
1211
},
1312
component: AvatarCounter,
1413
decorators: [
15-
(Story: StoryFn): JSX.Element => (
14+
(Story: StoryFn): React.JSX.Element => (
1615
<AvatarStack>
1716
{/* @ts-expect-error fix later */}
1817
<Story />

‎stories/primitives/Tooltip.stories.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import type {Meta, StoryFn, StoryObj} from '@storybook/react'
22
import {userEvent, within} from '@storybook/test'
3-
import type {JSX} from 'react'
43
import {Button, Card, Text, Tooltip, TooltipDelayGroupProvider} from '../../src/core/primitives'
54
import {PLACEMENT_OPTIONS} from '../constants'
65
import {getShadowControls, getSpaceControls} from '../controls'
@@ -16,7 +15,7 @@ const meta: Meta<typeof Tooltip> = {
1615
shadow: getShadowControls(),
1716
},
1817
decorators: [
19-
(Story: StoryFn): JSX.Element => (
18+
(Story: StoryFn): React.JSX.Element => (
2019
<Card padding={6}>
2120
{/* @ts-expect-error fix later */}
2221
<Story />

0 commit comments

Comments
 (0)