Merge pull request #76 from memark/prepare-react-19

Prepare for React 19
i-like-robots · Nov 20, 2024 · 4c4760a · 4c4760a
2 parents 48c2150 + eb8616b
commit 4c4760a
Show file tree

Hide file tree

Showing 11 changed files with 41 additions and 18 deletions.
diff --git a/src/components/Announcements.tsx b/src/components/Announcements.tsx
@@ -16,7 +16,10 @@ export type AnnouncementsProps = {
   ariaDeletedText: string
 }
 
-export function Announcements({ ariaAddedText, ariaDeletedText }: AnnouncementsProps): JSX.Element {
+export function Announcements({
+  ariaAddedText,
+  ariaDeletedText,
+}: AnnouncementsProps): React.JSX.Element {
   const { managerRef } = useContext(GlobalContext)
 
   const logsRef = useRef<string[]>([])

diff --git a/src/components/ComboBox.tsx b/src/components/ComboBox.tsx
@@ -4,7 +4,7 @@ import { comboBoxId } from '../lib'
 
 export type ComboBoxProps = React.PropsWithChildren<Record<string, unknown>>
 
-export function ComboBox({ children }: ComboBoxProps): JSX.Element {
+export function ComboBox({ children }: ComboBoxProps): React.JSX.Element {
   const { classNames, comboBoxRef, id } = useContext(GlobalContext)
 
   return (

diff --git a/src/components/Highlight.tsx b/src/components/Highlight.tsx
@@ -21,7 +21,11 @@ export type HighlightProps = {
   render?: HighlightRenderer
 }
 
-function Highlight({ option, query, render = DefaultHighlight }: HighlightProps): JSX.Element {
+function Highlight({
+  option,
+  query,
+  render = DefaultHighlight,
+}: HighlightProps): React.JSX.Element {
   const { classNames } = useContext(GlobalContext)
 
   if (option.value === NewOptionValue || option.value === NoOptionsValue) {

diff --git a/src/components/Input.tsx b/src/components/Input.tsx
@@ -8,7 +8,7 @@ type InputRendererProps = React.ComponentPropsWithoutRef<'input'> & {
   inputWidth: number
 }
 
-export type InputRenderer = (props: InputRendererProps) => JSX.Element
+export type InputRenderer = (props: InputRendererProps) => React.JSX.Element
 
 const DefaultInput: InputRenderer = ({ classNames, inputWidth, ...inputProps }) => {
   return <input className={classNames.input} style={{ width: inputWidth }} {...inputProps} />
@@ -32,7 +32,7 @@ export function Input({
   delimiterKeys,
   placeholderText,
   render = DefaultInput,
-}: InputProps): JSX.Element {
+}: InputProps): React.JSX.Element {
   const { classNames } = useContext(GlobalContext)
   const { value, ...inputProps } = useInput({
     allowBackspace,

diff --git a/src/components/Label.tsx b/src/components/Label.tsx
@@ -9,7 +9,7 @@ type LabelRendererProps = {
   id: string
 }
 
-export type LabelRenderer = (props: LabelRendererProps) => JSX.Element
+export type LabelRenderer = (props: LabelRendererProps) => React.JSX.Element
 
 const DefaultLabel: LabelRenderer = ({ children, classNames, id }) => {
   return (
@@ -24,7 +24,7 @@ export type LabelProps = {
   render?: LabelRenderer
 }
 
-export function Label({ children, render = DefaultLabel }: LabelProps): JSX.Element {
+export function Label({ children, render = DefaultLabel }: LabelProps): React.JSX.Element {
   const { classNames, id } = useContext(GlobalContext)
   return render({ children, classNames, id: labelId(id) })
 }
diff --git a/src/components/ListBox.tsx b/src/components/ListBox.tsx
@@ -9,7 +9,7 @@ type ListBoxRendererProps = React.ComponentPropsWithRef<'div'> & {
   classNames: ClassNames
 }
 
-export type ListBoxRenderer = (props: ListBoxRendererProps) => JSX.Element
+export type ListBoxRenderer = (props: ListBoxRendererProps) => React.JSX.Element
 
 const DefaultListBox: ListBoxRenderer = ({ children, classNames, ...listBoxProps }) => {
   return (
@@ -24,7 +24,10 @@ export type ListBoxProps = {
   render?: ListBoxRenderer
 }
 
-export function ListBox({ children, render = DefaultListBox }: ListBoxProps): JSX.Element | null {
+export function ListBox({
+  children,
+  render = DefaultListBox,
+}: ListBoxProps): React.JSX.Element | null {
   const { classNames, managerRef } = useContext(GlobalContext)
   const listBoxProps = useListBox()
 

diff --git a/src/components/Option.tsx b/src/components/Option.tsx
@@ -9,7 +9,7 @@ type OptionRendererProps = React.ComponentPropsWithRef<'div'> & {
   option: TagOption
 }
 
-export type OptionRenderer = (props: OptionRendererProps) => JSX.Element
+export type OptionRenderer = (props: OptionRendererProps) => React.JSX.Element
 
 const DefaultOption: OptionRenderer = ({ children, classNames, option, ...optionProps }) => {
   const classes = [classNames.option]
@@ -28,7 +28,11 @@ export type OptionProps = React.PropsWithChildren & {
   render?: OptionRenderer
 }
 
-export function Option({ children, index, render = DefaultOption }: OptionProps): JSX.Element {
+export function Option({
+  children,
+  index,
+  render = DefaultOption,
+}: OptionProps): React.JSX.Element {
   const { classNames } = useContext(GlobalContext)
   const { option, optionProps } = useOption(index)
 

diff --git a/src/components/ReactTags.tsx b/src/components/ReactTags.tsx
@@ -152,7 +152,7 @@ function ReactTags(
     tagListLabelText = 'Selected tags',
   }: ReactTagsProps,
   ref?: React.ForwardedRef<PublicAPI>
-): JSX.Element {
+): React.JSX.Element {
   const comboBoxRef = useRef<HTMLDivElement>(null)
   const inputRef = useRef<HTMLInputElement>(null)
   const listBoxRef = useRef<HTMLDivElement>(null)

diff --git a/src/components/Root.tsx b/src/components/Root.tsx
@@ -11,7 +11,7 @@ type RootRendererProps = React.ComponentPropsWithRef<'div'> & {
   isInvalid: boolean
 }
 
-export type RootRenderer = (props: RootRendererProps) => JSX.Element
+export type RootRenderer = (props: RootRendererProps) => React.JSX.Element
 
 const DefaultRoot: RootRenderer = ({
   children,
@@ -41,7 +41,12 @@ export type RootProps = {
   render?: RootRenderer
 }
 
-export function Root({ children, onBlur, onFocus, render = DefaultRoot }: RootProps): JSX.Element {
+export function Root({
+  children,
+  onBlur,
+  onFocus,
+  render = DefaultRoot,
+}: RootProps): React.JSX.Element {
   const { classNames, isDisabled, isInvalid } = useContext(GlobalContext)
   const { isActive, rootProps } = useRoot({ onBlur, onFocus })
 

diff --git a/src/components/Tag.tsx b/src/components/Tag.tsx
@@ -8,7 +8,7 @@ type TagRendererProps = React.ComponentPropsWithoutRef<'button'> & {
   tag: TagSelected
 }
 
-export type TagRenderer = (props: TagRendererProps) => JSX.Element
+export type TagRenderer = (props: TagRendererProps) => React.JSX.Element
 
 const DefaultTag: TagRenderer = ({ classNames, tag, ...tagProps }) => {
   return (
@@ -24,7 +24,7 @@ export type TagProps = {
   title: string
 }
 
-export function Tag({ render = DefaultTag, index, title }: TagProps): JSX.Element {
+export function Tag({ render = DefaultTag, index, title }: TagProps): React.JSX.Element {
   const { classNames } = useContext(GlobalContext)
   const { tag, tagProps } = useSelectedTag(index, title)
 

diff --git a/src/components/TagList.tsx b/src/components/TagList.tsx
@@ -8,7 +8,7 @@ type TagListRendererProps = React.ComponentPropsWithRef<'ul'> & {
   classNames: ClassNames
 }
 
-export type TagListRenderer = (props: TagListRendererProps) => JSX.Element
+export type TagListRenderer = (props: TagListRendererProps) => React.JSX.Element
 
 const DefaultTagList: TagListRenderer = ({
   children,
@@ -36,7 +36,11 @@ export type TagListProps = {
   render?: TagListRenderer
 }
 
-export function TagList({ children, label, render = DefaultTagList }: TagListProps): JSX.Element {
+export function TagList({
+  children,
+  label,
+  render = DefaultTagList,
+}: TagListProps): React.JSX.Element {
   const { classNames } = useContext(GlobalContext)
   const tagListProps = useTagList({ label })