From 42b8de7c12411c09d4876c7ded11127c99ba607d Mon Sep 17 00:00:00 2001
From: leejimqiu <leejimqiu@gmail.com>
Date: Mon, 28 Nov 2022 16:41:36 +0800
Subject: [PATCH] fix(checkbox): enable user to click content

---
 src/checkbox/Checkbox.tsx | 16 +++++++---------
 src/checkbox/type.ts      |  4 ++--
 2 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/src/checkbox/Checkbox.tsx b/src/checkbox/Checkbox.tsx
index 23f8c47f..7fe7eb1b 100644
--- a/src/checkbox/Checkbox.tsx
+++ b/src/checkbox/Checkbox.tsx
@@ -44,7 +44,7 @@ const Checkbox = forwardRef((_props: CheckBoxProps, ref: Ref<HTMLInputElement>)
     maxLabelRow = 3,
     maxContentRow = 5,
     icon,
-    contentDisabled,
+    contentDisabled = false,
     // borderless = false,
   } = props;
   const [internalChecked, setInternalChecked] = useDefault(checked, defaultChecked, onChange);
@@ -86,6 +86,8 @@ const Checkbox = forwardRef((_props: CheckBoxProps, ref: Ref<HTMLInputElement>)
     if (contentDisabled) {
       e.preventDefault();
     }
+
+    setInternalChecked(!internalChecked, { e })
   };
   return (
     <>
@@ -102,17 +104,15 @@ const Checkbox = forwardRef((_props: CheckBoxProps, ref: Ref<HTMLInputElement>)
               disabled={disabled}
               checked={internalChecked}
               onClick={(e) => e.stopPropagation()}
-              onChange={(e) => {
-                setInternalChecked(e.currentTarget.checked, { e });
-              }}
+              onChange={(e) => setInternalChecked(e.currentTarget.checked, { e })}
             />
             {renderIcon()}
           </span>}
-          <span className={ `${classPrefix}-checkbox__label ${classPrefix}-checkbox__label-left`} >
+          <span className={ `${classPrefix}-checkbox__label ${classPrefix}-checkbox__label-left`} onClick={handleClick}>
             <span style={labelStyle}>
               {label}
             </span>
-            <span className={`${classPrefix}-checkbox__description`} style={getLimitRowStyle(maxContentRow)} onClick={handleClick}>
+            <span className={`${classPrefix}-checkbox__description`} style={getLimitRowStyle(maxContentRow)}>
               {children || content}
             </span>
           </span>
@@ -128,9 +128,7 @@ const Checkbox = forwardRef((_props: CheckBoxProps, ref: Ref<HTMLInputElement>)
               disabled={disabled}
               checked={internalChecked}
               onClick={(e) => e.stopPropagation()}
-              onChange={(e) => {
-                setInternalChecked(e.currentTarget.checked, { e });
-              }}
+              onChange={(e) => setInternalChecked(e.currentTarget.checked, { e })}
             />
             {renderIcon()}
           </span>}
diff --git a/src/checkbox/type.ts b/src/checkbox/type.ts
index 60f54cf1..69a8dbe9 100644
--- a/src/checkbox/type.ts
+++ b/src/checkbox/type.ts
@@ -5,7 +5,7 @@
  * */
 
 import { TNode } from '../common';
-import { ChangeEvent } from 'react';
+import { ChangeEvent, MouseEvent } from 'react';
 
 export interface TdCheckboxProps {
   /**
@@ -84,7 +84,7 @@ export interface TdCheckboxProps {
   /**
    * 值变化时触发
    */
-  onChange?: (checked: boolean, context: { e: ChangeEvent<HTMLInputElement> }) => void;
+  onChange?: (checked: boolean, context: { e: ChangeEvent<HTMLDivElement> | MouseEvent<HTMLDivElement> }) => void;
 }
 
 export interface TdCheckboxGroupProps {