From 7dc06cef91426fde74411d60fdb3ad17d91dd28e Mon Sep 17 00:00:00 2001
From: Patryk Andrzejewski <vox3r69@gmail.com>
Date: Wed, 28 Sep 2022 15:14:31 +0200
Subject: [PATCH] firefox checkbox overlap workaround (#2329)

---
 src/components/Checkbox/Checkbox.tsx | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/components/Checkbox/Checkbox.tsx b/src/components/Checkbox/Checkbox.tsx
index a8dbc1379..eede62b49 100644
--- a/src/components/Checkbox/Checkbox.tsx
+++ b/src/components/Checkbox/Checkbox.tsx
@@ -23,6 +23,11 @@ export type CheckboxProps = Omit<
   error?: boolean;
 };
 
+const firefoxHandler = (event, onChange, checked) => {
+  event.preventDefault();
+  onChange(event, checked);
+};
+
 const Checkbox: React.FC<CheckboxProps> = ({ helperText, error, ...props }) => {
   const { disableClickPropagation, ...rest } = props;
   const classes = useStyles();
@@ -32,7 +37,17 @@ const Checkbox: React.FC<CheckboxProps> = ({ helperText, error, ...props }) => {
       <MuiCheckbox
         {...rest}
         onClick={
-          disableClickPropagation ? event => event.stopPropagation() : undefined
+          disableClickPropagation
+            ? event => {
+                event.stopPropagation();
+
+                /*
+              Workaround for firefox
+              ref: https://bugzilla.mozilla.org/show_bug.cgi?id=62151
+            */
+                firefoxHandler(event, rest.onChange, rest.checked);
+              }
+            : undefined
         }
       />
       {helperText && (