diff --git a/packages/fuselage-ui-kit/src/blocks/ActionsBlock.Action.tsx b/packages/fuselage-ui-kit/src/blocks/ActionsBlock.Action.tsx
index b6ace8354d8f2..bed6735e42953 100644
--- a/packages/fuselage-ui-kit/src/blocks/ActionsBlock.Action.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/ActionsBlock.Action.tsx
@@ -4,11 +4,11 @@ import type { ReactElement } from 'react';
 
 type ActionProps = {
 	element: UiKit.ActionsBlock['elements'][number];
-	parser: UiKit.SurfaceRenderer<ReactElement>;
+	parser: UiKit.SurfaceRenderer<ReactElement<any>>;
 	index: number;
 };
 
-const Action = ({ element, parser, index }: ActionProps): ReactElement | null => {
+const Action = ({ element, parser, index }: ActionProps) => {
 	const renderedElement = parser.renderActionsBlockElement(element, index);
 
 	if (!renderedElement) {
diff --git a/packages/fuselage-ui-kit/src/blocks/ActionsBlock.tsx b/packages/fuselage-ui-kit/src/blocks/ActionsBlock.tsx
index 2126973be8c34..d3d9b5652289d 100644
--- a/packages/fuselage-ui-kit/src/blocks/ActionsBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/ActionsBlock.tsx
@@ -1,6 +1,5 @@
 import { Box, Button } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useCallback, useMemo, useState } from 'react';
 
 import Action from './ActionsBlock.Action';
@@ -9,7 +8,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type ActionsBlockProps = BlockProps<UiKit.ActionsBlock>;
 
-const ActionsBlock = ({ className, block, surfaceRenderer }: ActionsBlockProps): ReactElement => {
+const ActionsBlock = ({ className, block, surfaceRenderer }: ActionsBlockProps) => {
 	const surfaceType = useSurfaceType();
 
 	const [showMoreVisible, setShowMoreVisible] = useState(() => block.elements.length > 5 && surfaceType !== 'banner');
diff --git a/packages/fuselage-ui-kit/src/blocks/CalloutBlock.tsx b/packages/fuselage-ui-kit/src/blocks/CalloutBlock.tsx
index 61c2d92eb0fdf..0a4ec52b7a722 100644
--- a/packages/fuselage-ui-kit/src/blocks/CalloutBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/CalloutBlock.tsx
@@ -1,12 +1,11 @@
 import { Callout } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import type { BlockProps } from '../utils/BlockProps';
 
 type CalloutBlockProps = BlockProps<UiKit.CalloutBlock>;
 
-const CalloutBlock = ({ block, surfaceRenderer }: CalloutBlockProps): ReactElement => (
+const CalloutBlock = ({ block, surfaceRenderer }: CalloutBlockProps) => (
 	<Callout
 		type={block.variant}
 		title={block.title?.text}
diff --git a/packages/fuselage-ui-kit/src/blocks/ContextBlock.Item.tsx b/packages/fuselage-ui-kit/src/blocks/ContextBlock.Item.tsx
index ba3d232dc3b28..b38c4392d18a8 100644
--- a/packages/fuselage-ui-kit/src/blocks/ContextBlock.Item.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/ContextBlock.Item.tsx
@@ -4,11 +4,11 @@ import type { ReactElement } from 'react';
 
 type ItemProps = {
 	block: UiKit.ContextBlock['elements'][number];
-	surfaceRenderer: UiKit.SurfaceRenderer<ReactElement>;
+	surfaceRenderer: UiKit.SurfaceRenderer<ReactElement<any>>;
 	index: number;
 };
 
-const Item = ({ block: element, surfaceRenderer: parser, index }: ItemProps): ReactElement | null => {
+const Item = ({ block: element, surfaceRenderer: parser, index }: ItemProps) => {
 	const renderedElement = parser.renderContextBlockElement(element, index);
 
 	if (!renderedElement) {
diff --git a/packages/fuselage-ui-kit/src/blocks/ContextBlock.tsx b/packages/fuselage-ui-kit/src/blocks/ContextBlock.tsx
index 16b96c7bc7427..8d39ba657b095 100644
--- a/packages/fuselage-ui-kit/src/blocks/ContextBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/ContextBlock.tsx
@@ -1,6 +1,5 @@
 import { Box } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useMemo } from 'react';
 
 import Item from './ContextBlock.Item';
@@ -8,7 +7,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type ContextBlockProps = BlockProps<UiKit.ContextBlock>;
 
-const ContextBlock = ({ className, block, surfaceRenderer }: ContextBlockProps): ReactElement => {
+const ContextBlock = ({ className, block, surfaceRenderer }: ContextBlockProps) => {
 	const itemElements = useMemo(
 		() =>
 			block.elements.map((element) => ({
diff --git a/packages/fuselage-ui-kit/src/blocks/DividerBlock.tsx b/packages/fuselage-ui-kit/src/blocks/DividerBlock.tsx
index 6f685daaeddd8..41df69cbc0400 100644
--- a/packages/fuselage-ui-kit/src/blocks/DividerBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/DividerBlock.tsx
@@ -1,12 +1,11 @@
 import { Divider } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo } from 'react';
 
 import type { BlockProps } from '../utils/BlockProps';
 
 type DividerBlockProps = BlockProps<UiKit.DividerBlock>;
 
-const DividerBlock = ({ className }: DividerBlockProps): ReactElement => <Divider className={className} marginBlock={24} />;
+const DividerBlock = ({ className }: DividerBlockProps) => <Divider className={className} marginBlock={24} />;
 
 export default memo(DividerBlock);
diff --git a/packages/fuselage-ui-kit/src/blocks/ImageBlock.tsx b/packages/fuselage-ui-kit/src/blocks/ImageBlock.tsx
index 3bd88eecf582f..32ff51b622475 100644
--- a/packages/fuselage-ui-kit/src/blocks/ImageBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/ImageBlock.tsx
@@ -1,6 +1,5 @@
 import { Box, Skeleton } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useEffect, useState } from 'react';
 
 import { Image } from './ImageBlock.styles';
@@ -32,7 +31,7 @@ const fetchImageState = (img: HTMLImageElement) => {
 
 type ImageBlockProps = BlockProps<UiKit.ImageBlock>;
 
-const ImageBlock = ({ className, block, surfaceRenderer }: ImageBlockProps): ReactElement => {
+const ImageBlock = ({ className, block, surfaceRenderer }: ImageBlockProps) => {
 	const surface = useSurfaceType();
 
 	const alignment = surface === 'banner' || surface === 'message' ? 'flex-start' : 'center';
diff --git a/packages/fuselage-ui-kit/src/blocks/InfoCard.tsx b/packages/fuselage-ui-kit/src/blocks/InfoCard.tsx
index ecf75a75dc240..4263f06d7aaef 100644
--- a/packages/fuselage-ui-kit/src/blocks/InfoCard.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/InfoCard.tsx
@@ -1,13 +1,12 @@
 import { Box } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import IconElement from '../elements/IconElement';
 import type { BlockProps } from '../utils/BlockProps';
 
 type InfoCardProps = BlockProps<UiKit.InfoCardBlock>;
 
-const InfoCard = ({ block, surfaceRenderer, context }: InfoCardProps): ReactElement => {
+const InfoCard = ({ block, surfaceRenderer, context }: InfoCardProps) => {
 	const { rows, blockId } = block;
 	return (
 		<Box
diff --git a/packages/fuselage-ui-kit/src/blocks/InputBlock.tsx b/packages/fuselage-ui-kit/src/blocks/InputBlock.tsx
index 72a34133e4c83..6dbc8563d4e2f 100644
--- a/packages/fuselage-ui-kit/src/blocks/InputBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/InputBlock.tsx
@@ -1,6 +1,5 @@
 import { Field, FieldLabel, FieldRow, FieldError, FieldHint } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useMemo } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
@@ -8,7 +7,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type InputBlockProps = BlockProps<UiKit.InputBlock>;
 
-const InputBlock = ({ className, block, surfaceRenderer, context }: InputBlockProps): ReactElement => {
+const InputBlock = ({ className, block, surfaceRenderer, context }: InputBlockProps) => {
 	const inputElement = useMemo(
 		() => ({
 			...block.element,
diff --git a/packages/fuselage-ui-kit/src/blocks/PreviewBlock.tsx b/packages/fuselage-ui-kit/src/blocks/PreviewBlock.tsx
index 77c6872cdf04d..6ec7847bc6ed7 100644
--- a/packages/fuselage-ui-kit/src/blocks/PreviewBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/PreviewBlock.tsx
@@ -10,7 +10,6 @@ import {
 } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
 import { isPreviewBlockWithThumb, isPreviewBlockWithPreview } from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo } from 'react';
 
 import ContextBlock from './ContextBlock';
@@ -18,7 +17,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type PreviewBlockProps = BlockProps<UiKit.PreviewBlock>;
 
-const PreviewBlock = ({ block, surfaceRenderer }: PreviewBlockProps): ReactElement => (
+const PreviewBlock = ({ block, surfaceRenderer }: PreviewBlockProps) => (
 	<Box>
 		<MessageGenericPreview>
 			{isPreviewBlockWithPreview(block) && block.preview?.dimensions && (
diff --git a/packages/fuselage-ui-kit/src/blocks/SectionBlock.Fields.tsx b/packages/fuselage-ui-kit/src/blocks/SectionBlock.Fields.tsx
index 0a75f45b2e448..6c9fa5171e3c8 100644
--- a/packages/fuselage-ui-kit/src/blocks/SectionBlock.Fields.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/SectionBlock.Fields.tsx
@@ -12,10 +12,10 @@ const breakpoints = {
 
 type FieldsProps = {
 	fields: readonly UiKit.TextObject[];
-	surfaceRenderer: UiKit.SurfaceRenderer<ReactElement>;
+	surfaceRenderer: UiKit.SurfaceRenderer<ReactElement<any>>;
 };
 
-const Fields = ({ fields, surfaceRenderer }: FieldsProps): ReactElement => (
+const Fields = ({ fields, surfaceRenderer }: FieldsProps) => (
 	<Grid>
 		{fields.map((field, i) => (
 			<GridItem key={i} {...breakpoints}>
diff --git a/packages/fuselage-ui-kit/src/blocks/SectionBlock.tsx b/packages/fuselage-ui-kit/src/blocks/SectionBlock.tsx
index be43eb7d937b2..a8f1001110019 100644
--- a/packages/fuselage-ui-kit/src/blocks/SectionBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/SectionBlock.tsx
@@ -1,6 +1,5 @@
 import { Box, Flex, Grid, GridItem } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useMemo } from 'react';
 
 import Fields from './SectionBlock.Fields';
@@ -8,7 +7,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type SectionBlockProps = BlockProps<UiKit.SectionBlock>;
 
-const SectionBlock = ({ className, block, surfaceRenderer }: SectionBlockProps): ReactElement => {
+const SectionBlock = ({ className, block, surfaceRenderer }: SectionBlockProps) => {
 	const { text, fields } = block;
 
 	const accessoryElement = useMemo(
diff --git a/packages/fuselage-ui-kit/src/blocks/TabNavigationBlock.tsx b/packages/fuselage-ui-kit/src/blocks/TabNavigationBlock.tsx
index 2c47b64ab9d3e..795a26223b107 100644
--- a/packages/fuselage-ui-kit/src/blocks/TabNavigationBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/TabNavigationBlock.tsx
@@ -1,6 +1,5 @@
 import { Tabs } from '@rocket.chat/fuselage';
 import type { ExperimentalTabNavigationBlock } from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useState } from 'react';
 
 import { TabElement } from '../elements/TabElement';
@@ -8,7 +7,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type TabNavigationBlockProps = BlockProps<ExperimentalTabNavigationBlock>;
 
-const TabNavigationBlock = (blockProps: TabNavigationBlockProps): ReactElement => {
+const TabNavigationBlock = (blockProps: TabNavigationBlockProps) => {
 	const {
 		block: { tabs },
 		context,
diff --git a/packages/fuselage-ui-kit/src/blocks/VideoConferenceBlock/VideoConferenceBlock.tsx b/packages/fuselage-ui-kit/src/blocks/VideoConferenceBlock/VideoConferenceBlock.tsx
index 94f877ae1d1eb..9a339c44eb44f 100644
--- a/packages/fuselage-ui-kit/src/blocks/VideoConferenceBlock/VideoConferenceBlock.tsx
+++ b/packages/fuselage-ui-kit/src/blocks/VideoConferenceBlock/VideoConferenceBlock.tsx
@@ -15,7 +15,7 @@ import {
 	VideoConfMessageActions,
 	VideoConfMessageAction,
 } from '@rocket.chat/ui-video-conf';
-import type { MouseEventHandler, ReactElement } from 'react';
+import type { MouseEventHandler } from 'react';
 import { useContext, memo, useMemo } from 'react';
 
 import { UiKitContext } from '../..';
@@ -27,7 +27,7 @@ type VideoConferenceBlockProps = BlockProps<UiKit.VideoConferenceBlock>;
 
 const MAX_USERS = 3;
 
-const VideoConferenceBlock = ({ block }: VideoConferenceBlockProps): ReactElement => {
+const VideoConferenceBlock = ({ block }: VideoConferenceBlockProps) => {
 	const t = useTranslation();
 	const { callId, appId = 'videoconf-core' } = block;
 	const surfaceType = useSurfaceType();
diff --git a/packages/fuselage-ui-kit/src/elements/ButtonElement.tsx b/packages/fuselage-ui-kit/src/elements/ButtonElement.tsx
index cd8f0af1e84de..240cb589fda02 100644
--- a/packages/fuselage-ui-kit/src/elements/ButtonElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/ButtonElement.tsx
@@ -1,13 +1,13 @@
 import { Button, Throbber } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { MouseEventHandler, ReactElement } from 'react';
+import type { MouseEventHandler } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
 import type { BlockProps } from '../utils/BlockProps';
 
 type ButtonElementProps = BlockProps<UiKit.ButtonElement>;
 
-const ButtonElement = ({ block, context, surfaceRenderer }: ButtonElementProps): ReactElement => {
+const ButtonElement = ({ block, context, surfaceRenderer }: ButtonElementProps) => {
 	const [{ loading }, action] = useUiKitState(block, context);
 	const { style, url, text, value, secondary } = block;
 
diff --git a/packages/fuselage-ui-kit/src/elements/CheckboxElement.tsx b/packages/fuselage-ui-kit/src/elements/CheckboxElement.tsx
index 3a38f1a4eac41..2a8dafda1e02e 100644
--- a/packages/fuselage-ui-kit/src/elements/CheckboxElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/CheckboxElement.tsx
@@ -1,13 +1,12 @@
 import { CheckBox, Box } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
 import type { BlockProps } from '../utils/BlockProps';
 
 type CheckboxElementProps = BlockProps<UiKit.CheckboxElement>;
 
-const CheckboxElement = ({ block, context, surfaceRenderer }: CheckboxElementProps): ReactElement => {
+const CheckboxElement = ({ block, context, surfaceRenderer }: CheckboxElementProps) => {
 	const [{ loading, value }, action] = useUiKitState(block, context);
 	const { options } = block;
 
diff --git a/packages/fuselage-ui-kit/src/elements/DatePickerElement.tsx b/packages/fuselage-ui-kit/src/elements/DatePickerElement.tsx
index ac487b00683d7..0b93aae925a5d 100644
--- a/packages/fuselage-ui-kit/src/elements/DatePickerElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/DatePickerElement.tsx
@@ -1,6 +1,5 @@
 import { InputBox } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import { useStringFromTextObject } from '../hooks/useStringFromTextObject';
 import { useUiKitState } from '../hooks/useUiKitState';
@@ -8,7 +7,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type DatePickerElementProps = BlockProps<UiKit.DatePickerElement>;
 
-const DatePickerElement = ({ block, context }: DatePickerElementProps): ReactElement => {
+const DatePickerElement = ({ block, context }: DatePickerElementProps) => {
 	const [{ loading, value, error }, action] = useUiKitState(block, context);
 	const { actionId, placeholder } = block;
 	const fromTextObjectToString = useStringFromTextObject();
diff --git a/packages/fuselage-ui-kit/src/elements/IconButtonElement.tsx b/packages/fuselage-ui-kit/src/elements/IconButtonElement.tsx
index 9a8abe3bed631..d5c62cd2714ad 100644
--- a/packages/fuselage-ui-kit/src/elements/IconButtonElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/IconButtonElement.tsx
@@ -1,13 +1,13 @@
 import { IconButton } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { MouseEventHandler, ReactElement } from 'react';
+import type { MouseEventHandler } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
 import type { BlockProps } from '../utils/BlockProps';
 
 type IconButtonElementProps = BlockProps<UiKit.IconButtonElement>;
 
-const IconButtonElement = ({ block, context }: IconButtonElementProps): ReactElement => {
+const IconButtonElement = ({ block, context }: IconButtonElementProps) => {
 	const [{ loading }, action] = useUiKitState(block, context);
 
 	const { url, value, label, icon } = block;
diff --git a/packages/fuselage-ui-kit/src/elements/IconElement.tsx b/packages/fuselage-ui-kit/src/elements/IconElement.tsx
index b43a4c87adab7..d47b4519f7dba 100644
--- a/packages/fuselage-ui-kit/src/elements/IconElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/IconElement.tsx
@@ -1,6 +1,6 @@
 import { Icon, FramedIcon } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ComponentProps, ReactElement } from 'react';
+import type { ComponentProps } from 'react';
 
 import type { BlockProps } from '../utils/BlockProps';
 
@@ -35,7 +35,7 @@ const getFramedIconProps = (
 	}
 };
 
-const IconElement = ({ block }: IconElementProps): ReactElement => {
+const IconElement = ({ block }: IconElementProps) => {
 	const { icon, variant, framed } = block;
 	if (framed) {
 		return <FramedIcon size={20} icon={icon} {...getFramedIconProps(variant)} />;
diff --git a/packages/fuselage-ui-kit/src/elements/ImageElement.tsx b/packages/fuselage-ui-kit/src/elements/ImageElement.tsx
index f0a4a2a0e9dbe..546c79bfe6aab 100644
--- a/packages/fuselage-ui-kit/src/elements/ImageElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/ImageElement.tsx
@@ -1,12 +1,11 @@
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import { Element } from './ImageElement.styles';
 import type { BlockProps } from '../utils/BlockProps';
 
 type ImageElementProps = BlockProps<UiKit.ImageElement>;
 
-const ImageElement = ({ block, context }: ImageElementProps): ReactElement | null => {
+const ImageElement = ({ block, context }: ImageElementProps) => {
 	const size = (context === UiKit.BlockContext.SECTION && 88) || (context === UiKit.BlockContext.CONTEXT && 20) || undefined;
 
 	if (!size) {
diff --git a/packages/fuselage-ui-kit/src/elements/LinearScaleElement.tsx b/packages/fuselage-ui-kit/src/elements/LinearScaleElement.tsx
index 0192401a12090..50d23728c8030 100644
--- a/packages/fuselage-ui-kit/src/elements/LinearScaleElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/LinearScaleElement.tsx
@@ -1,6 +1,5 @@
 import { Box, Button, ButtonGroup } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useMemo } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
@@ -8,7 +7,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type LinearScaleElementProps = BlockProps<UiKit.LinearScaleElement>;
 
-const LinearScaleElement = ({ className, block, context, surfaceRenderer }: LinearScaleElementProps): ReactElement => {
+const LinearScaleElement = ({ className, block, context, surfaceRenderer }: LinearScaleElementProps) => {
 	const { minValue = 0, maxValue = 10, initialValue, preLabel, postLabel } = block;
 
 	const [{ loading, value = initialValue, error }, action] = useUiKitState(block, context);
diff --git a/packages/fuselage-ui-kit/src/elements/MultiStaticSelectElement.tsx b/packages/fuselage-ui-kit/src/elements/MultiStaticSelectElement.tsx
index 0fc5dc20b614e..f76e7989756a3 100644
--- a/packages/fuselage-ui-kit/src/elements/MultiStaticSelectElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/MultiStaticSelectElement.tsx
@@ -1,7 +1,6 @@
 import type { SelectOption } from '@rocket.chat/fuselage';
 import { MultiSelectFiltered } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useCallback, useMemo } from 'react';
 
 import { useStringFromTextObject } from '../hooks/useStringFromTextObject';
@@ -10,7 +9,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type MultiStaticSelectElementProps = BlockProps<UiKit.MultiStaticSelectElement>;
 
-const MultiStaticSelectElement = ({ block, context }: MultiStaticSelectElementProps): ReactElement => {
+const MultiStaticSelectElement = ({ block, context }: MultiStaticSelectElementProps) => {
 	const [{ loading, value, error }, action] = useUiKitState(block, context);
 	const fromTextObjectToString = useStringFromTextObject();
 
diff --git a/packages/fuselage-ui-kit/src/elements/OverflowElement.tsx b/packages/fuselage-ui-kit/src/elements/OverflowElement.tsx
index 82f6fb9b785b4..8f79ecebb2b97 100644
--- a/packages/fuselage-ui-kit/src/elements/OverflowElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/OverflowElement.tsx
@@ -1,7 +1,6 @@
 import type { OptionType } from '@rocket.chat/fuselage';
 import { IconButton, PositionAnimated, Options, useCursor } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { useRef, useCallback, useMemo } from 'react';
 
 import { useStringFromTextObject } from '../hooks/useStringFromTextObject';
@@ -10,7 +9,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type OverflowElementProps = BlockProps<UiKit.OverflowElement>;
 
-const OverflowElement = ({ block, context }: OverflowElementProps): ReactElement => {
+const OverflowElement = ({ block, context }: OverflowElementProps) => {
 	const [{ loading }, action] = useUiKitState(block, context);
 	const fromTextObjectToString = useStringFromTextObject();
 
diff --git a/packages/fuselage-ui-kit/src/elements/PlainTextInputElement.tsx b/packages/fuselage-ui-kit/src/elements/PlainTextInputElement.tsx
index 0b7e9105b776b..69d2762f6d444 100644
--- a/packages/fuselage-ui-kit/src/elements/PlainTextInputElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/PlainTextInputElement.tsx
@@ -1,6 +1,5 @@
 import { TextAreaInput, TextInput } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo } from 'react';
 
 import { useStringFromTextObject } from '../hooks/useStringFromTextObject';
@@ -9,7 +8,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type PlainTextInputElementProps = BlockProps<UiKit.PlainTextInputElement>;
 
-const PlainTextInputElement = ({ block, context }: PlainTextInputElementProps): ReactElement => {
+const PlainTextInputElement = ({ block, context }: PlainTextInputElementProps) => {
 	const [{ loading, value, error }, action] = useUiKitState(block, context);
 	const fromTextObjectToString = useStringFromTextObject();
 
diff --git a/packages/fuselage-ui-kit/src/elements/RadioButtonElement.tsx b/packages/fuselage-ui-kit/src/elements/RadioButtonElement.tsx
index a4bb114de0b9f..d467f74bf9d66 100644
--- a/packages/fuselage-ui-kit/src/elements/RadioButtonElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/RadioButtonElement.tsx
@@ -1,13 +1,12 @@
 import { Box, RadioButton } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
 import type { BlockProps } from '../utils/BlockProps';
 
 type RadioButtonElementProps = BlockProps<UiKit.RadioButtonElement>;
 
-const RadioButtonElement = ({ block, context, surfaceRenderer }: RadioButtonElementProps): ReactElement => {
+const RadioButtonElement = ({ block, context, surfaceRenderer }: RadioButtonElementProps) => {
 	const [{ loading, value }, action] = useUiKitState(block, context);
 	const { options } = block;
 
diff --git a/packages/fuselage-ui-kit/src/elements/StaticSelectElement.tsx b/packages/fuselage-ui-kit/src/elements/StaticSelectElement.tsx
index 2d5c9762a845e..53e2955383d34 100644
--- a/packages/fuselage-ui-kit/src/elements/StaticSelectElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/StaticSelectElement.tsx
@@ -1,6 +1,5 @@
 import { SelectFiltered } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useCallback, useMemo } from 'react';
 
 import { useStringFromTextObject } from '../hooks/useStringFromTextObject';
@@ -9,7 +8,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type StaticSelectElementProps = BlockProps<UiKit.StaticSelectElement>;
 
-const StaticSelectElement = ({ block, context }: StaticSelectElementProps): ReactElement => {
+const StaticSelectElement = ({ block, context }: StaticSelectElementProps) => {
 	const [{ loading, value, error }, action] = useUiKitState(block, context);
 	const fromTextObjectToString = useStringFromTextObject();
 
diff --git a/packages/fuselage-ui-kit/src/elements/TabElement.tsx b/packages/fuselage-ui-kit/src/elements/TabElement.tsx
index 35071e53e17e9..380e3a24508d9 100644
--- a/packages/fuselage-ui-kit/src/elements/TabElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/TabElement.tsx
@@ -1,6 +1,6 @@
 import { TabsItem } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { Dispatch, ReactElement } from 'react';
+import type { Dispatch } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
 import type { BlockProps } from '../utils/BlockProps';
@@ -13,7 +13,7 @@ export const TabElement = ({
 	select,
 }: BlockProps<UiKit.ExperimentalTabElement> & {
 	select: Dispatch<number>;
-}): ReactElement => {
+}) => {
 	const [{ loading }, action] = useUiKitState(block, context);
 
 	const { title, selected, disabled } = block;
@@ -23,8 +23,9 @@ export const TabElement = ({
 			selected={selected}
 			disabled={loading ? true : disabled}
 			onClick={(e) => {
-				!disabled && select(index);
-				!disabled && void action(e);
+				if (disabled) return;
+				select(index);
+				void action(e);
 			}}
 		>
 			{surfaceRenderer.renderTextObject(title, 0, UiKit.BlockContext.NONE)}
diff --git a/packages/fuselage-ui-kit/src/elements/TimePickerElement.tsx b/packages/fuselage-ui-kit/src/elements/TimePickerElement.tsx
index 76a3dd57a256e..21ff9826c7c8a 100644
--- a/packages/fuselage-ui-kit/src/elements/TimePickerElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/TimePickerElement.tsx
@@ -1,6 +1,5 @@
 import { InputBox } from '@rocket.chat/fuselage';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import { useStringFromTextObject } from '../hooks/useStringFromTextObject';
 import { useUiKitState } from '../hooks/useUiKitState';
@@ -8,7 +7,7 @@ import type { BlockProps } from '../utils/BlockProps';
 
 type TimePickerElementProps = BlockProps<UiKit.TimePickerElement>;
 
-const TimePickerElement = ({ block, context }: TimePickerElementProps): ReactElement => {
+const TimePickerElement = ({ block, context }: TimePickerElementProps) => {
 	const [{ loading, value, error }, action] = useUiKitState(block, context);
 	const { actionId, placeholder } = block;
 	const fromTextObjectToString = useStringFromTextObject();
diff --git a/packages/fuselage-ui-kit/src/elements/ToggleSwitchElement.tsx b/packages/fuselage-ui-kit/src/elements/ToggleSwitchElement.tsx
index 7fd8abd5e6039..c38d72e39c9e2 100644
--- a/packages/fuselage-ui-kit/src/elements/ToggleSwitchElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/ToggleSwitchElement.tsx
@@ -1,13 +1,12 @@
 import { Box, ToggleSwitch } from '@rocket.chat/fuselage';
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import { useUiKitState } from '../hooks/useUiKitState';
 import type { BlockProps } from '../utils/BlockProps';
 
 type ToggleSwitchElementProps = BlockProps<UiKit.ToggleSwitchElement>;
 
-const ToggleSwitchElement = ({ block, context, surfaceRenderer }: ToggleSwitchElementProps): ReactElement => {
+const ToggleSwitchElement = ({ block, context, surfaceRenderer }: ToggleSwitchElementProps) => {
 	const [{ value, loading }, action] = useUiKitState(block, context);
 	const { options } = block;
 
diff --git a/packages/fuselage-ui-kit/src/elements/UsersSelectElement/MultiUsersSelectElement.tsx b/packages/fuselage-ui-kit/src/elements/UsersSelectElement/MultiUsersSelectElement.tsx
index a01533fd6dfdf..3aab56a4beb34 100644
--- a/packages/fuselage-ui-kit/src/elements/UsersSelectElement/MultiUsersSelectElement.tsx
+++ b/packages/fuselage-ui-kit/src/elements/UsersSelectElement/MultiUsersSelectElement.tsx
@@ -2,7 +2,6 @@ import { Box, Chip, AutoComplete, Option, OptionAvatar, OptionContent, OptionDes
 import { useDebouncedValue } from '@rocket.chat/fuselage-hooks';
 import { UserAvatar } from '@rocket.chat/ui-avatar';
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 import { memo, useCallback, useState } from 'react';
 
 import { useUsersData } from './hooks/useUsersData';
@@ -11,7 +10,7 @@ import type { BlockProps } from '../../utils/BlockProps';
 
 type MultiUsersSelectElementProps = BlockProps<UiKit.MultiUsersSelectElement>;
 
-const MultiUsersSelectElement = ({ block, context }: MultiUsersSelectElementProps): ReactElement => {
+const MultiUsersSelectElement = ({ block, context }: MultiUsersSelectElementProps) => {
 	const [{ loading, value }, action] = useUiKitState(block, context);
 	const [filter, setFilter] = useState('');
 
@@ -36,7 +35,7 @@ const MultiUsersSelectElement = ({ block, context }: MultiUsersSelectElementProp
 			setFilter={setFilter}
 			onChange={handleChange}
 			multiple
-			renderSelected={({ selected: { value, label }, onRemove, ...props }): ReactElement => (
+			renderSelected={({ selected: { value, label }, onRemove, ...props }) => (
 				<Chip {...props} height='x20' value={value} onClick={onRemove} mie={4}>
 					<UserAvatar size='x20' username={value} />
 					<Box is='span' margin='none' mis={4}>
@@ -44,7 +43,7 @@ const MultiUsersSelectElement = ({ block, context }: MultiUsersSelectElementProp
 					</Box>
 				</Chip>
 			)}
-			renderItem={({ value, label, ...props }): ReactElement => (
+			renderItem={({ value, label, ...props }) => (
 				<Option key={value} {...props}>
 					<OptionAvatar>
 						<UserAvatar username={value} size='x20' />
diff --git a/packages/fuselage-ui-kit/src/surfaces/BannerSurface.tsx b/packages/fuselage-ui-kit/src/surfaces/BannerSurface.tsx
index 119b97ab9e026..272404de16d55 100644
--- a/packages/fuselage-ui-kit/src/surfaces/BannerSurface.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/BannerSurface.tsx
@@ -1,5 +1,5 @@
 import { Margins } from '@rocket.chat/fuselage';
-import type { ReactElement, ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 import { Surface } from './Surface';
 
@@ -7,7 +7,7 @@ type BannerSurfaceProps = {
 	children?: ReactNode;
 };
 
-const BannerSurface = ({ children }: BannerSurfaceProps): ReactElement => (
+const BannerSurface = ({ children }: BannerSurfaceProps) => (
 	<Surface type='banner'>
 		<Margins block={8}>{children}</Margins>
 	</Surface>
diff --git a/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurface.tsx b/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurface.tsx
index 7510ccd507836..fd00b0e5c5dd7 100644
--- a/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurface.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurface.tsx
@@ -1,5 +1,5 @@
 import { Margins } from '@rocket.chat/fuselage';
-import type { ReactElement, ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 import { Surface } from './Surface';
 
@@ -7,7 +7,7 @@ type ContextualBarSurfaceProps = {
 	children?: ReactNode;
 };
 
-const ContextualBarSurface = ({ children }: ContextualBarSurfaceProps): ReactElement => (
+const ContextualBarSurface = ({ children }: ContextualBarSurfaceProps) => (
 	<Surface type='contextualBar'>
 		<Margins blockEnd={16}>{children}</Margins>
 	</Surface>
diff --git a/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurfaceRenderer.tsx b/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurfaceRenderer.tsx
index faffa17b1785a..16afeb7274075 100644
--- a/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurfaceRenderer.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/ContextualBarSurfaceRenderer.tsx
@@ -1,5 +1,5 @@
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
+import type { ReactNode } from 'react';
 
 import { FuselageSurfaceRenderer, renderTextObject } from './FuselageSurfaceRenderer';
 import TabNavigationBlock from '../blocks/TabNavigationBlock';
@@ -14,7 +14,7 @@ export class ContextualBarSurfaceRenderer extends FuselageSurfaceRenderer {
 
 	override mrkdwn = renderTextObject;
 
-	tab_navigation(block: UiKit.ExperimentalTabNavigationBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	tab_navigation(block: UiKit.ExperimentalTabNavigationBlock, context: UiKit.BlockContext, index: number): ReactNode {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
diff --git a/packages/fuselage-ui-kit/src/surfaces/FuselageMessageSurfaceRenderer.tsx b/packages/fuselage-ui-kit/src/surfaces/FuselageMessageSurfaceRenderer.tsx
index 94d4db0553e41..9bab7689c8871 100644
--- a/packages/fuselage-ui-kit/src/surfaces/FuselageMessageSurfaceRenderer.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/FuselageMessageSurfaceRenderer.tsx
@@ -1,5 +1,5 @@
 import * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
+import type { ReactNode } from 'react';
 
 import { FuselageSurfaceRenderer, renderTextObject } from './FuselageSurfaceRenderer';
 import VideoConferenceBlock from '../blocks/VideoConferenceBlock';
@@ -14,7 +14,7 @@ export class FuselageMessageSurfaceRenderer extends FuselageSurfaceRenderer {
 
 	override mrkdwn = renderTextObject;
 
-	video_conf(block: UiKit.VideoConferenceBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	video_conf(block: UiKit.VideoConferenceBlock, context: UiKit.BlockContext, index: number): ReactNode {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
diff --git a/packages/fuselage-ui-kit/src/surfaces/FuselageSurfaceRenderer.tsx b/packages/fuselage-ui-kit/src/surfaces/FuselageSurfaceRenderer.tsx
index 90cd686f16932..e3916b6b3cbad 100644
--- a/packages/fuselage-ui-kit/src/surfaces/FuselageSurfaceRenderer.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/FuselageSurfaceRenderer.tsx
@@ -33,7 +33,7 @@ import MultiUsersSelectElement from '../elements/UsersSelectElement/MultiUsersSe
 import UsersSelectElement from '../elements/UsersSelectElement/UsersSelectElement';
 
 type TextObjectRenderers = {
-	[TTextObject in UiKit.TextObject as TTextObject['type']]: (textObject: TTextObject, index: number) => ReactElement | null;
+	[TTextObject in UiKit.TextObject as TTextObject['type']]: (textObject: TTextObject, index: number) => ReactElement<any> | null;
 };
 
 const textObjectRenderers: TextObjectRenderers = {
@@ -62,12 +62,12 @@ const isImageBlock = (
 
 type FuselageSurfaceRendererProps = ConstructorParameters<typeof UiKit.SurfaceRenderer>[0];
 
-export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<ReactElement> {
+export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<ReactElement<any>> {
 	public constructor(allowedBlocks?: FuselageSurfaceRendererProps) {
 		super(allowedBlocks || ['actions', 'context', 'divider', 'image', 'input', 'section', 'preview', 'info_card']);
 	}
 
-	public plain_text(textObject: UiKit.PlainText, context: UiKit.BlockContext, index: number): ReactElement | null {
+	public plain_text(textObject: UiKit.PlainText, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -75,7 +75,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return textObjectRenderers.plain_text(textObject, index);
 	}
 
-	public mrkdwn(textObject: UiKit.TextObject, context: UiKit.BlockContext, index: number): ReactElement | null {
+	public mrkdwn(textObject: UiKit.TextObject, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -83,7 +83,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return <MarkdownTextElement key={index} textObject={textObject} />;
 	}
 
-	actions(block: UiKit.ActionsBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	actions(block: UiKit.ActionsBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
@@ -95,14 +95,14 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	preview(block: UiKit.PreviewBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	preview(block: UiKit.PreviewBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context !== UiKit.BlockContext.BLOCK) {
 			return null;
 		}
 		return <PreviewBlock key={index} block={block} context={context} index={index} surfaceRenderer={this} />;
 	}
 
-	context(block: UiKit.ContextBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	context(block: UiKit.ContextBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
@@ -114,7 +114,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	divider(block: UiKit.DividerBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	divider(block: UiKit.DividerBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
@@ -126,7 +126,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	image(block: UiKit.ImageBlock | UiKit.ImageElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	image(block: UiKit.ImageBlock | UiKit.ImageElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (isImageBlock(block, context)) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
@@ -138,7 +138,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return <ImageElement key={index} block={block} context={context} index={index} surfaceRenderer={this} />;
 	}
 
-	input(block: UiKit.InputBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	input(block: UiKit.InputBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={block.element.actionId || index} appId={block.appId}>
@@ -150,7 +150,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	section(block: UiKit.SectionBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	section(block: UiKit.SectionBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
@@ -162,7 +162,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	button(block: UiKit.ButtonElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	button(block: UiKit.ButtonElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -174,7 +174,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	datepicker(block: UiKit.DatePickerElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	datepicker(block: UiKit.DatePickerElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -186,7 +186,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	static_select(block: UiKit.StaticSelectElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	static_select(block: UiKit.StaticSelectElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -198,7 +198,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	multi_static_select(block: UiKit.MultiStaticSelectElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	multi_static_select(block: UiKit.MultiStaticSelectElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -210,7 +210,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	overflow(block: UiKit.OverflowElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	overflow(block: UiKit.OverflowElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -222,7 +222,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	plain_text_input(block: UiKit.PlainTextInputElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	plain_text_input(block: UiKit.PlainTextInputElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -234,7 +234,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	linear_scale(block: UiKit.LinearScaleElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	linear_scale(block: UiKit.LinearScaleElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -246,7 +246,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	toggle_switch(block: UiKit.ToggleSwitchElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	toggle_switch(block: UiKit.ToggleSwitchElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -258,7 +258,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	radio_button(block: UiKit.RadioButtonElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	radio_button(block: UiKit.RadioButtonElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -270,7 +270,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	checkbox(block: UiKit.CheckboxElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	checkbox(block: UiKit.CheckboxElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -282,7 +282,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	callout(block: UiKit.CalloutBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	callout(block: UiKit.CalloutBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return (
 				<AppIdProvider key={index} appId={block.appId}>
@@ -294,7 +294,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	time_picker(block: UiKit.TimePickerElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	time_picker(block: UiKit.TimePickerElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -306,7 +306,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	users_select(block: UiKit.UsersSelectElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	users_select(block: UiKit.UsersSelectElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.FORM) {
 			return <UsersSelectElement block={block} context={context} index={index} surfaceRenderer={this} />;
 		}
@@ -314,7 +314,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	channels_select(block: UiKit.ChannelsSelectElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	channels_select(block: UiKit.ChannelsSelectElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.FORM) {
 			return <ChannelsSelectElement block={block} context={context} index={index} surfaceRenderer={this} />;
 		}
@@ -322,7 +322,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	multi_users_select(block: UiKit.MultiUsersSelectElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	multi_users_select(block: UiKit.MultiUsersSelectElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.FORM) {
 			return <MultiUsersSelectElement block={block} context={context} index={index} surfaceRenderer={this} />;
 		}
@@ -330,7 +330,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	multi_channels_select(block: UiKit.MultiChannelsSelectElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	multi_channels_select(block: UiKit.MultiChannelsSelectElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.FORM) {
 			return <MultiChannelsSelectElement block={block} context={context} index={index} surfaceRenderer={this} />;
 		}
@@ -338,7 +338,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return null;
 	}
 
-	info_card(block: UiKit.InfoCardBlock, context: UiKit.BlockContext, index: number): ReactElement | null {
+	info_card(block: UiKit.InfoCardBlock, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context !== UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -350,7 +350,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		);
 	}
 
-	icon(block: UiKit.IconElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	icon(block: UiKit.IconElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
@@ -358,7 +358,7 @@ export abstract class FuselageSurfaceRenderer extends UiKit.SurfaceRenderer<Reac
 		return <IconElement block={block} context={context} index={index} surfaceRenderer={this} />;
 	}
 
-	icon_button(block: UiKit.IconButtonElement, context: UiKit.BlockContext, index: number): ReactElement | null {
+	icon_button(block: UiKit.IconButtonElement, context: UiKit.BlockContext, index: number): ReactElement<any> | null {
 		if (context === UiKit.BlockContext.BLOCK) {
 			return null;
 		}
diff --git a/packages/fuselage-ui-kit/src/surfaces/MessageSurface.tsx b/packages/fuselage-ui-kit/src/surfaces/MessageSurface.tsx
index 9704b8ab91f50..c99c3385682b3 100644
--- a/packages/fuselage-ui-kit/src/surfaces/MessageSurface.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/MessageSurface.tsx
@@ -1,5 +1,5 @@
 import { Margins } from '@rocket.chat/fuselage';
-import type { ReactElement, ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 import { Surface } from './Surface';
 
@@ -7,7 +7,7 @@ type MessageSurfaceProps = {
 	children?: ReactNode;
 };
 
-const MessageSurface = ({ children }: MessageSurfaceProps): ReactElement => (
+const MessageSurface = ({ children }: MessageSurfaceProps) => (
 	<Surface type='message'>
 		<Margins blockEnd={16}>{children}</Margins>
 	</Surface>
diff --git a/packages/fuselage-ui-kit/src/surfaces/ModalSurface.tsx b/packages/fuselage-ui-kit/src/surfaces/ModalSurface.tsx
index c05049f3f9295..925888ceb8b25 100644
--- a/packages/fuselage-ui-kit/src/surfaces/ModalSurface.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/ModalSurface.tsx
@@ -1,5 +1,5 @@
 import { Margins } from '@rocket.chat/fuselage';
-import type { ReactElement, ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 import { Surface } from './Surface';
 
@@ -7,7 +7,7 @@ type ModalSurfaceProps = {
 	children?: ReactNode;
 };
 
-const ModalSurface = ({ children }: ModalSurfaceProps): ReactElement => (
+const ModalSurface = ({ children }: ModalSurfaceProps) => (
 	<Surface type='modal'>
 		<Margins blockEnd={16}>{children}</Margins>
 	</Surface>
diff --git a/packages/fuselage-ui-kit/src/surfaces/Surface.tsx b/packages/fuselage-ui-kit/src/surfaces/Surface.tsx
index f29b1e161c1b7..e21aae515cae3 100644
--- a/packages/fuselage-ui-kit/src/surfaces/Surface.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/Surface.tsx
@@ -1,4 +1,4 @@
-import type { ContextType, ReactElement, ReactNode } from 'react';
+import type { ContextType, ReactNode } from 'react';
 
 import { SurfaceContext } from '../contexts/SurfaceContext';
 
@@ -7,6 +7,4 @@ type SurfaceProps = {
 	type: ContextType<typeof SurfaceContext>;
 };
 
-export const Surface = ({ children, type }: SurfaceProps): ReactElement => (
-	<SurfaceContext.Provider value={type}>{children}</SurfaceContext.Provider>
-);
+export const Surface = ({ children, type }: SurfaceProps) => <SurfaceContext.Provider value={type}>{children}</SurfaceContext.Provider>;
diff --git a/packages/fuselage-ui-kit/src/surfaces/createSurfaceRenderer.tsx b/packages/fuselage-ui-kit/src/surfaces/createSurfaceRenderer.tsx
index d073b0f1ff035..2311657c44395 100644
--- a/packages/fuselage-ui-kit/src/surfaces/createSurfaceRenderer.tsx
+++ b/packages/fuselage-ui-kit/src/surfaces/createSurfaceRenderer.tsx
@@ -1,12 +1,11 @@
 import type * as UiKit from '@rocket.chat/ui-kit';
 import type { ComponentType, ReactElement, ReactNode } from 'react';
 
-export const createSurfaceRenderer = <S extends UiKit.SurfaceRenderer<ReactElement>>(
-	// eslint-disable-next-line @typescript-eslint/naming-convention
+export const createSurfaceRenderer = <S extends UiKit.SurfaceRenderer<ReactElement<any>>>(
 	SurfaceComponent: ComponentType<{ children: ReactNode }>,
 	surfaceRenderer: S,
 ) =>
-	function Surface(blocks: readonly UiKit.LayoutBlock[], conditions: UiKit.Conditions = {}): ReactElement {
+	function Surface(blocks: readonly UiKit.LayoutBlock[], conditions: UiKit.Conditions = {}) {
 		return (
 			<SurfaceComponent>
 				{surfaceRenderer.render(blocks, {
diff --git a/packages/fuselage-ui-kit/src/utils/BlockProps.ts b/packages/fuselage-ui-kit/src/utils/BlockProps.ts
index d2fd2d4da55f3..48be2a421ec65 100644
--- a/packages/fuselage-ui-kit/src/utils/BlockProps.ts
+++ b/packages/fuselage-ui-kit/src/utils/BlockProps.ts
@@ -7,5 +7,5 @@ export type BlockProps<B extends UiKit.Block> = {
 	block: B;
 	context: UiKit.BlockContext;
 	index: number;
-	surfaceRenderer: UiKit.SurfaceRenderer<ReactElement>;
+	surfaceRenderer: UiKit.SurfaceRenderer<ReactElement<any>>;
 };
diff --git a/packages/fuselage-ui-kit/src/utils/UiKitComponent.tsx b/packages/fuselage-ui-kit/src/utils/UiKitComponent.tsx
index f5bbb5febc456..ae1573971193e 100644
--- a/packages/fuselage-ui-kit/src/utils/UiKitComponent.tsx
+++ b/packages/fuselage-ui-kit/src/utils/UiKitComponent.tsx
@@ -1,5 +1,4 @@
 import type * as UiKit from '@rocket.chat/ui-kit';
-import type { ReactElement } from 'react';
 
 import type { UiKitBanner, UiKitContextualBar, UiKitMessage, UiKitModal } from '../surfaces';
 
@@ -8,4 +7,4 @@ type UiKitComponentProps = {
 	blocks: UiKit.LayoutBlock[];
 };
 
-export const UiKitComponent = ({ render, blocks }: UiKitComponentProps): ReactElement | null => render(blocks);
+export const UiKitComponent = ({ render, blocks }: UiKitComponentProps) => render(blocks);
diff --git a/packages/ui-kit/src/blocks/elements/ButtonElement.ts b/packages/ui-kit/src/blocks/elements/ButtonElement.ts
index c4cea69370368..3d1552921b0c7 100644
--- a/packages/ui-kit/src/blocks/elements/ButtonElement.ts
+++ b/packages/ui-kit/src/blocks/elements/ButtonElement.ts
@@ -4,7 +4,7 @@ import type { PlainText } from '../text/PlainText';
 export type ButtonElement = Actionable<{
 	type: 'button';
 	text: PlainText;
-	url?: string;
+	url?: string; // TODO: The url in ButtonElement should not be an arbitrary string, it lacks validation and can lead to security issues
 	value?: string;
 	style?: 'primary' | 'secondary' | 'danger' | 'warning' | 'success';
 	secondary?: boolean;
diff --git a/packages/ui-kit/src/blocks/elements/LinearScaleElement.ts b/packages/ui-kit/src/blocks/elements/LinearScaleElement.ts
index cbbaebb61e31a..6312f5a4ccdf4 100644
--- a/packages/ui-kit/src/blocks/elements/LinearScaleElement.ts
+++ b/packages/ui-kit/src/blocks/elements/LinearScaleElement.ts
@@ -4,7 +4,7 @@ import type { PlainText } from '../text/PlainText';
 export type LinearScaleElement = Actionable<{
 	type: 'linear_scale';
 	minValue?: number;
-	maxValue?: number;
+	maxValue?: number; // TODO: The maximum length of the LinearScaleElement is not specified in the specification. We should set a reasonable value for it to prevent potential issues with very large numbers.
 	initialValue?: number;
 	preLabel?: PlainText;
 	postLabel?: PlainText;