chore(react-components): resolve issues related to React 18 types

Author: mainframev

packages/react-components/react-aria/library/etc/react-aria.api.md

@@ -103,7 +103,7 @@ export type AriaLiveAnnouncerState = {
 };
 
 // @public (undocumented)
-export const renderAriaLiveAnnouncer_unstable: (state: AriaLiveAnnouncerState, contextValues: AriaLiveAnnouncerContextValues) => JSX.Element;
+export const renderAriaLiveAnnouncer_unstable: (state: AriaLiveAnnouncerState, contextValues: AriaLiveAnnouncerContextValues) => React_2.JSX.Element;
 
 // @public (undocumented)
 export function useActiveDescendant<TActiveParentElement extends HTMLElement, TListboxElement extends HTMLElement>(options: ActiveDescendantOptions): UseActiveDescendantReturn<TActiveParentElement, TListboxElement>;

packages/react-components/react-aria/library/src/AriaLiveAnnouncer/useAriaLiveAnnouncer.test.tsx

@@ -19,7 +19,7 @@ describe('useAriaLiveAnnouncer', () => {
       },
       defaultView: global,
     } as unknown as Document;
-    const ContextWrapper: React.FC = props => {
+    const ContextWrapper: React.FC<React.PropsWithChildren> = props => {
       return <Provider value={{ dir: 'ltr', targetDocument }}>{props.children}</Provider>;
     };
 

packages/react-components/react-aria/library/src/activedescendant/useActiveDescendant.cy.tsx

@@ -16,8 +16,8 @@ describe('onActiveOptionChange', () => {
       const [lastActive, setLastActive] = React.useState('');
 
       const onActiveDescendantChange = React.useCallback(
-        event => {
-          setLastActive(event ? event.detail.id : 'no event');
+        (event: CustomEventInit<{ id: string }>) => {
+          setLastActive(event && event.detail ? event.detail.id : 'no event');
         },
         [setLastActive],
       );

packages/react-components/react-button/library/src/utils/useToggleState.ts

@@ -20,7 +20,7 @@ export function useToggleState<
   const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';
 
   const onToggleClick = React.useCallback(
-    ev => {
+    (ev: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {
       if (!disabled && !disabledFocusable) {
         if (ev.defaultPrevented) {
           return;

packages/react-components/react-combobox/library/config/tests.js

@@ -1,5 +1,4 @@
 // @ts-check
-/* eslint-disable */
 
 const { readFileSync } = require('node:fs');
 const { join } = require('node:path');
@@ -29,6 +28,6 @@ module.exports = {
     '^.+\\.tsx?$': ['@swc/jest', swcJestConfig],
   },
   coverageDirectory: './coverage',
-  setupFilesAfterEnv: ['./config/tests.js'],
+  setupFilesAfterEnv: ['./config/tests.ts'],
   snapshotSerializers: ['@griffel/jest-serializer'],
 };

packages/react-components/react-combobox/library/jest.config.js

@@ -3,9 +3,10 @@
   "compilerOptions": {
     "module": "CommonJS",
     "outDir": "dist",
-    "types": ["jest", "node", "@testing-library/jest-dom"]
+    "types": ["jest", "node"]
   },
   "include": [
+    "./config/tests.ts",
     "**/*.spec.ts",
     "**/*.spec.tsx",
     "**/*.test.ts",

packages/react-components/react-combobox/library/tsconfig.spec.json

@@ -5,6 +5,7 @@ import { teamsLightTheme } from '@fluentui/react-theme';
 
 import { List } from './List';
 import { ListItem } from '../ListItem';
+import type { ListProps } from './List.types';
 import { SelectionItemId } from '@fluentui/react-utilities';
 
 const mount = (element: JSX.Element) => {
@@ -72,11 +73,11 @@ type SelectionTestListProps = {
 const SelectionTestList = ({ selectionMode, defaultSelectedItems, controlled }: SelectionTestListProps) => {
   const [selectedItems, setSelectedItems] = React.useState(defaultSelectedItems || []);
 
-  const onChange = React.useCallback((_, { selectedItems: selected }) => {
+  const onChange = React.useCallback<NonNullable<ListProps['onSelectionChange']>>((_, { selectedItems: selected }) => {
     setSelectedItems(selected);
   }, []);
 
-  const onSelectLastClick = React.useCallback(_ => {
+  const onSelectLastClick = React.useCallback(() => {
     setSelectedItems(['list-item-3']);
   }, []);
 

packages/react-components/react-list/library/src/components/List/List.cy.tsx

@@ -0,0 +1 @@
+/** Jest test setup file. */

packages/react-components/react-motion-components-preview/library/config/tests.ts

@@ -134,7 +134,7 @@ export class PresenceGroup extends React_2.Component<PresenceGroupProps, Presenc
         firstRender: boolean;
     };
     // (undocumented)
-    render(): JSX.Element;
+    render(): React_2.JSX.Element;
 }
 
 // @public (undocumented)