refactor(uikit-playground): remove unnecessary ReactElement type annotations from components

apps/uikit-playground/src/Components/NavBar/BurgerIcon/BurgerIcon.tsx

@@ -1,12 +1,12 @@
 import { usePrefersReducedMotion } from '@rocket.chat/fuselage-hooks';
-import type { ReactElement, ReactNode } from 'react';
+import type { ReactNode } from 'react';
 import { useContext } from 'react';
 
 import Line from './Line';
 import Wrapper from './Wrapper';
 import { context } from '../../../Context';
 
-const BurgerIcon = ({ children }: { children?: ReactNode }): ReactElement => {
+const BurgerIcon = ({ children }: { children?: ReactNode }) => {
 	const isReducedMotionPreferred = usePrefersReducedMotion();
 	const {
 		state: { navMenuToggle },

apps/uikit-playground/src/Components/NavBar/BurgerIcon/Line.tsx

@@ -1,8 +1,7 @@
 import { css } from '@rocket.chat/css-in-js';
 import { Box } from '@rocket.chat/fuselage';
-import type { ReactElement } from 'react';
 
-const Line = ({ animated, moved }: { animated: boolean; moved?: boolean }): ReactElement => {
+const Line = ({ animated, moved }: { animated: boolean; moved?: boolean }) => {
 	const animatedStyle = animated
 		? css`
 				will-change: transform;

apps/uikit-playground/src/Components/NavBar/BurgerIcon/Wrapper.tsx

@@ -1,8 +1,8 @@
 import { css } from '@rocket.chat/css-in-js';
 import { Box } from '@rocket.chat/fuselage';
-import type { ReactElement, ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
-const Wrapper = ({ children }: { children: ReactNode }): ReactElement => (
+const Wrapper = ({ children }: { children: ReactNode }) => (
 	<Box
 		is='span'
 		display='inline-flex'

apps/uikit-playground/src/Components/Preview/Display/UiKitElementWrapper/UiKitElementWrapper.tsx

@@ -1,7 +1,7 @@
 import './UiKitElementWrapper.scss';
 import { Box } from '@rocket.chat/fuselage';
-import type { ComponentProps, ReactElement } from 'react';
+import type { ComponentProps } from 'react';
 
-const ElementWrapper = (props: ComponentProps<typeof Box>): ReactElement => <Box className='uikit-element-wrapper' {...props} />;
+const ElementWrapper = (props: ComponentProps<typeof Box>) => <Box className='uikit-element-wrapper' {...props} />;
 
 export default ElementWrapper;

apps/uikit-playground/src/Components/navMenu/Menu/Wrapper.tsx

@@ -1,7 +1,7 @@
 import { Box } from '@rocket.chat/fuselage';
-import type { ReactElement, ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
-const Wrapper = ({ children }: { children: ReactNode }): ReactElement => (
+const Wrapper = ({ children }: { children: ReactNode }) => (
 	<Box
 		pbs='80px'
 		pis='50px'

apps/uikit-playground/src/Context/createCtx.tsx

@@ -1,4 +1,4 @@
-import type { Dispatch, Reducer, ReactElement } from 'react';
+import type { Dispatch, Reducer, ReactNode } from 'react';
 import { createContext, useReducer } from 'react';
 
 import type { initialStateType } from './initialState';
@@ -9,7 +9,7 @@ export default function createCtx<ActionType>(reducer: Reducer<initialStateType,
 		state: initialState,
 		dispatch: defaultDispatch,
 	});
-	const Provider = (props: { children: ReactElement }) => {
+	const Provider = (props: { children: ReactNode }) => {
 		const [state, dispatch] = useReducer(reducer, initialState);
 		return <context.Provider value={{ state, dispatch }} {...props} />;
 	};