diff --git a/packages/components/src/components/checkbox/checkbox.tsx b/packages/components/src/components/checkbox/checkbox.tsx
index 7e1400c895fb..82e17b35e496 100644
--- a/packages/components/src/components/checkbox/checkbox.tsx
+++ b/packages/components/src/components/checkbox/checkbox.tsx
@@ -3,14 +3,14 @@ import React from 'react';
 import Icon from '../icon';
 import Text from '../text';
 
-type TCheckBoxProps = Omit<React.HTMLProps<HTMLInputElement>, 'value'> & {
+type TCheckBoxProps = Omit<React.HTMLProps<HTMLInputElement>, 'value' | 'label'> & {
     className?: string;
     classNameLabel?: string;
     defaultChecked?: boolean;
     disabled?: boolean;
     greyDisabled?: boolean;
     id?: string;
-    label: string;
+    label: React.ReactElement;
     onChange: (e: React.ChangeEvent<HTMLInputElement> | React.KeyboardEvent<HTMLSpanElement>) => void;
     value?: boolean;
     withTabIndex?: number;
diff --git a/packages/components/src/components/popover-message-checkbox/index.js b/packages/components/src/components/popover-message-checkbox/index.js
deleted file mode 100644
index 902d40dd7515..000000000000
--- a/packages/components/src/components/popover-message-checkbox/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import PopoverMessageCheckbox from './popover-message-checkbox.jsx';
-
-export default PopoverMessageCheckbox;
diff --git a/packages/components/src/components/popover-message-checkbox/index.ts b/packages/components/src/components/popover-message-checkbox/index.ts
new file mode 100644
index 000000000000..e950aaa1e167
--- /dev/null
+++ b/packages/components/src/components/popover-message-checkbox/index.ts
@@ -0,0 +1,3 @@
+import PopoverMessageCheckbox from './popover-message-checkbox';
+
+export default PopoverMessageCheckbox;
diff --git a/packages/components/src/components/popover-message-checkbox/popover-message-checkbox.jsx b/packages/components/src/components/popover-message-checkbox/popover-message-checkbox.jsx
deleted file mode 100644
index 06e3d6b4f2a9..000000000000
--- a/packages/components/src/components/popover-message-checkbox/popover-message-checkbox.jsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-import Checkbox from '../checkbox';
-
-const PopoverMessageCheckbox = ({ checkboxLabel, defaultChecked, onChange, message, name }) => (
-    <React.Fragment>
-        {message}
-        <Checkbox defaultChecked={defaultChecked} onChange={onChange} name={name} label={checkboxLabel} />
-    </React.Fragment>
-);
-
-PopoverMessageCheckbox.propTypes = {
-    defaultChecked: PropTypes.bool,
-    message: PropTypes.string,
-    name: PropTypes.string,
-    onChange: PropTypes.func,
-    checkboxLabel: PropTypes.string,
-};
-
-export default PopoverMessageCheckbox;
diff --git a/packages/components/src/components/popover-message-checkbox/popover-message-checkbox.tsx b/packages/components/src/components/popover-message-checkbox/popover-message-checkbox.tsx
new file mode 100644
index 000000000000..5822e42f9517
--- /dev/null
+++ b/packages/components/src/components/popover-message-checkbox/popover-message-checkbox.tsx
@@ -0,0 +1,26 @@
+import React from 'react';
+import Checkbox from '../checkbox';
+
+type TPopoverMessageCheckbox = {
+    defaultChecked?: boolean;
+    message: string;
+    name?: string;
+    onChange: React.FormEventHandler<HTMLInputElement> &
+        ((e: React.ChangeEvent<HTMLInputElement> | React.KeyboardEvent<HTMLSpanElement>) => void);
+    checkboxLabel: React.ReactElement;
+};
+
+const PopoverMessageCheckbox = ({
+    checkboxLabel,
+    defaultChecked,
+    onChange,
+    message,
+    name,
+}: TPopoverMessageCheckbox) => (
+    <React.Fragment>
+        {message}
+        <Checkbox defaultChecked={defaultChecked} onChange={onChange} name={name} label={checkboxLabel} />
+    </React.Fragment>
+);
+
+export default PopoverMessageCheckbox;