Fix Compat for React 19 types (#6632)

* Fix install

* Fix Compat for React 19 types

* remove unneeded imports

---------

Co-authored-by: Daniel Lu <[email protected]>

Author: snowystinger

packages/@react-aria/accordion/src/useAccordion.ts

@@ -11,8 +11,8 @@
  */
 
 import {AriaAccordionProps} from '@react-types/accordion';
-import {ButtonHTMLAttributes, RefObject} from 'react';
-import {DOMAttributes, Node} from '@react-types/shared';
+import {ButtonHTMLAttributes} from 'react';
+import {DOMAttributes, Node, RefObject} from '@react-types/shared';
 import {mergeProps, useId} from '@react-aria/utils';
 import {TreeState} from '@react-stately/tree';
 import {useButton} from '@react-aria/button';

packages/@react-aria/actiongroup/src/useActionGroup.ts

@@ -12,11 +12,11 @@
 
 import {AriaActionGroupProps} from '@react-types/actiongroup';
 import {createFocusManager} from '@react-aria/focus';
-import {DOMAttributes, FocusableElement, Orientation} from '@react-types/shared';
+import {DOMAttributes, FocusableElement, Orientation, RefObject} from '@react-types/shared';
 import {filterDOMProps, useLayoutEffect} from '@react-aria/utils';
 import {ListState} from '@react-stately/list';
-import {RefObject, useState} from 'react';
 import {useLocale} from '@react-aria/i18n';
+import {useState} from 'react';
 
 const BUTTON_GROUP_ROLES = {
   'none': 'toolbar',

packages/@react-aria/actiongroup/src/useActionGroupItem.ts

@@ -10,11 +10,11 @@
  * governing permissions and limitations under the License.
  */
 
-import {DOMAttributes, FocusableElement, Key} from '@react-types/shared';
+import {DOMAttributes, FocusableElement, Key, RefObject} from '@react-types/shared';
 import {ListState} from '@react-stately/list';
 import {mergeProps, useEffectEvent} from '@react-aria/utils';
 import {PressProps} from '@react-aria/interactions';
-import {RefObject, useEffect} from 'react';
+import {useEffect} from 'react';
 
 export interface AriaActionGroupItemProps {
   key: Key

packages/@react-aria/autocomplete/src/useSearchAutocomplete.ts

@@ -14,8 +14,8 @@ import {AriaButtonProps} from '@react-types/button';
 import {AriaListBoxOptions} from '@react-aria/listbox';
 import {AriaSearchAutocompleteProps} from '@react-types/autocomplete';
 import {ComboBoxState} from '@react-stately/combobox';
-import {DOMAttributes, KeyboardDelegate, LayoutDelegate, ValidationResult} from '@react-types/shared';
-import {InputHTMLAttributes, RefObject} from 'react';
+import {DOMAttributes, KeyboardDelegate, LayoutDelegate, RefObject, ValidationResult} from '@react-types/shared';
+import {InputHTMLAttributes} from 'react';
 import {mergeProps} from '@react-aria/utils';
 import {useComboBox} from '@react-aria/combobox';
 import {useSearchField} from '@react-aria/searchfield';

packages/@react-aria/breadcrumbs/src/useBreadcrumbItem.ts

@@ -11,8 +11,7 @@
  */
 
 import {AriaBreadcrumbItemProps} from '@react-types/breadcrumbs';
-import {DOMAttributes, FocusableElement} from '@react-types/shared';
-import {RefObject} from 'react';
+import {DOMAttributes, FocusableElement, RefObject} from '@react-types/shared';
 import {useLink} from '@react-aria/link';
 
 export interface BreadcrumbItemAria {

packages/@react-aria/calendar/src/useCalendarCell.ts

@@ -12,14 +12,14 @@
 
 import {CalendarDate, isEqualDay, isSameDay, isToday} from '@internationalized/date';
 import {CalendarState, RangeCalendarState} from '@react-stately/calendar';
-import {DOMAttributes} from '@react-types/shared';
+import {DOMAttributes, RefObject} from '@react-types/shared';
 import {focusWithoutScrolling, getScrollParent, mergeProps, scrollIntoViewport, useDeepMemo, useDescription} from '@react-aria/utils';
 import {getEraFormat, hookData} from './utils';
 import {getInteractionModality, usePress} from '@react-aria/interactions';
 // @ts-ignore
 import intlMessages from '../intl/*.json';
-import {RefObject, useEffect, useMemo, useRef} from 'react';
 import {useDateFormatter, useLocalizedStringFormatter} from '@react-aria/i18n';
+import {useEffect, useMemo, useRef} from 'react';
 
 export interface AriaCalendarCellProps {
   /** The date that this cell represents. */

packages/@react-aria/calendar/src/useRangeCalendar.ts

@@ -12,10 +12,10 @@
 
 import {AriaRangeCalendarProps, DateValue} from '@react-types/calendar';
 import {CalendarAria, useCalendarBase} from './useCalendarBase';
-import {FocusableElement} from '@react-types/shared';
+import {FocusableElement, RefObject} from '@react-types/shared';
 import {RangeCalendarState} from '@react-stately/calendar';
-import {RefObject, useRef} from 'react';
 import {useEvent} from '@react-aria/utils';
+import {useRef} from 'react';
 
 /**
  * Provides the behavior and accessibility implementation for a range calendar component.

packages/@react-aria/checkbox/src/useCheckbox.ts

@@ -11,12 +11,12 @@
  */
 
 import {AriaCheckboxProps} from '@react-types/checkbox';
-import {InputHTMLAttributes, LabelHTMLAttributes, RefObject, useEffect} from 'react';
+import {InputHTMLAttributes, LabelHTMLAttributes, useEffect} from 'react';
+import {RefObject, ValidationResult} from '@react-types/shared';
 import {ToggleState} from '@react-stately/toggle';
 import {useFormValidation} from '@react-aria/form';
 import {useFormValidationState} from '@react-stately/form';
 import {useToggle} from '@react-aria/toggle';
-import {ValidationResult} from '@react-types/shared';
 
 export interface CheckboxAria extends ValidationResult {
   /** Props for the label wrapper element. */

packages/@react-aria/checkbox/src/useCheckboxGroupItem.ts

@@ -15,9 +15,9 @@ import {CheckboxAria, useCheckbox} from './useCheckbox';
 import {checkboxGroupData} from './utils';
 import {CheckboxGroupState} from '@react-stately/checkbox';
 import {DEFAULT_VALIDATION_RESULT, privateValidationStateProp, useFormValidationState} from '@react-stately/form';
-import {RefObject, useEffect, useRef} from 'react';
+import {RefObject, ValidationResult} from '@react-types/shared';
+import {useEffect, useRef} from 'react';
 import {useToggleState} from '@react-stately/toggle';
-import {ValidationResult} from '@react-types/shared';
 
 /**
  * Provides the behavior and accessibility implementation for a checkbox component contained within a checkbox group.

packages/@react-aria/color/src/useColorArea.ts

@@ -12,11 +12,11 @@
 
 import {AriaColorAreaProps, ColorChannel} from '@react-types/color';
 import {ColorAreaState} from '@react-stately/color';
-import {DOMAttributes} from '@react-types/shared';
+import {DOMAttributes, RefObject} from '@react-types/shared';
 import {focusWithoutScrolling, isAndroid, isIOS, mergeProps, useFormReset, useGlobalListeners, useLabels} from '@react-aria/utils';
 // @ts-ignore
 import intlMessages from '../intl/*.json';
-import React, {ChangeEvent, InputHTMLAttributes, RefObject, useCallback, useRef, useState} from 'react';
+import React, {ChangeEvent, InputHTMLAttributes, useCallback, useRef, useState} from 'react';
 import {useColorAreaGradient} from './useColorAreaGradient';
 import {useFocus, useFocusWithin, useKeyboard, useMove} from '@react-aria/interactions';
 import {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';