fix(Switch): fixed multiple color value errors (#687)

* fix(Switch): fixed multiple color value errors

* test: update snapshots

* chore: update _common

Author: anlyyao

src/_common

@@ -42,6 +42,7 @@ const Switch = forwardRef<HTMLDivElement, SwitchProps>((originalProps, ref) => {
   );
 
   const dotClasses = classNames(`${switchClass}__dot`, `${switchClass}__dot--${props.size}`, {
+    [`${switchClass}__dot--disabled`]: disabled || loading,
     [`${switchClass}__dot--checked`]: checked,
     [`${switchClass}__dot--plain`]: isArray(label) && label.length !== 2 && !loading,
   });
@@ -59,7 +60,7 @@ const Switch = forwardRef<HTMLDivElement, SwitchProps>((originalProps, ref) => {
   };
 
   const readerContent = React.useMemo<React.ReactNode>(() => {
-    if (loading) return <Loading inheritColor size="small" />;
+    if (loading) return <Loading className={`${switchClass}__loading`} size="16px" />;
 
     if (Array.isArray(label)) {
       const [activeContent = '', inactiveContent = ''] = label;
@@ -68,7 +69,7 @@ const Switch = forwardRef<HTMLDivElement, SwitchProps>((originalProps, ref) => {
     }
 
     return parseTNode(label, { value });
-  }, [loading, label, checked, value]);
+  }, [loading, label, checked, value, switchClass]);
 
   return (
     <div ref={ref} className={switchClasses} style={style} onClick={handleToggle}>

src/switch/Switch.tsx

@@ -25,7 +25,7 @@ Name | Default Value | Description
 -- | -- | --
 --td-switch-checked-color | @brand-color | - 
 --td-switch-checked-disabled-color | @brand-color-disabled | - 
---td-switch-dot-border-color | @bg-color-secondarycontainer | - 
+--td-switch-dot-disabled-color | @font-white-1 | - 
 --td-switch-dot-horizontal-margin | 3px | - 
 --td-switch-dot-large-size | 26px | - 
 --td-switch-dot-plain-horizontal-margin | 5px | - 
@@ -40,17 +40,18 @@ Name | Default Value | Description
 --td-switch-icon-size | 20px | - 
 --td-switch-icon-small-size | 16px | - 
 --td-switch-label-checked-color | @switch-checked-color | - 
---td-switch-label-color | @text-color-disabled | - 
---td-switch-label-font-size | 12px | - 
+--td-switch-label-color | @bg-color-secondarycontainer-active | - 
 --td-switch-label-font-size | 14px | - 
---td-switch-label-font-size | 16px | - 
+--td-switch-label-large-font-size | 16px | - 
+--td-switch-label-small-font-size | 12px | - 
 --td-switch-large-height | 32px | - 
 --td-switch-large-radius | calc(@switch-large-height / 2) | - 
 --td-switch-large-width | 52px | - 
+--td-switch-loading-color | @brand-color | - 
 --td-switch-radius | calc(@switch-height / 2) | - 
 --td-switch-small-height | 24px | - 
 --td-switch-small-radius | calc(@switch-small-height / 2) | - 
 --td-switch-small-width | 39px | - 
---td-switch-unchecked-color | @text-color-disabled | - 
+--td-switch-unchecked-color | @bg-color-secondarycontainer-active | - 
 --td-switch-unchecked-disabled-color | @bg-color-component-disabled | - 
 --td-switch-width | 45px | - 

src/switch/switch.en-US.md

@@ -25,7 +25,7 @@ onChange | Function |  | TS 类型：`(value: T, context: { e: MouseEvent }) =>
 -- | -- | --
 --td-switch-checked-color | @brand-color | - 
 --td-switch-checked-disabled-color | @brand-color-disabled | - 
---td-switch-dot-border-color | @bg-color-secondarycontainer | - 
+--td-switch-dot-disabled-color | @font-white-1 | - 
 --td-switch-dot-horizontal-margin | 3px | - 
 --td-switch-dot-large-size | 26px | - 
 --td-switch-dot-plain-horizontal-margin | 5px | - 
@@ -40,17 +40,18 @@ onChange | Function |  | TS 类型：`(value: T, context: { e: MouseEvent }) =>
 --td-switch-icon-size | 20px | - 
 --td-switch-icon-small-size | 16px | - 
 --td-switch-label-checked-color | @switch-checked-color | - 
---td-switch-label-color | @text-color-disabled | - 
---td-switch-label-font-size | 12px | - 
+--td-switch-label-color | @bg-color-secondarycontainer-active | - 
 --td-switch-label-font-size | 14px | - 
---td-switch-label-font-size | 16px | - 
+--td-switch-label-large-font-size | 16px | - 
+--td-switch-label-small-font-size | 12px | - 
 --td-switch-large-height | 32px | - 
 --td-switch-large-radius | calc(@switch-large-height / 2) | - 
 --td-switch-large-width | 52px | - 
+--td-switch-loading-color | @brand-color | - 
 --td-switch-radius | calc(@switch-height / 2) | - 
 --td-switch-small-height | 24px | - 
 --td-switch-small-radius | calc(@switch-small-height / 2) | - 
 --td-switch-small-width | 39px | - 
---td-switch-unchecked-color | @text-color-disabled | - 
+--td-switch-unchecked-color | @bg-color-secondarycontainer-active | - 
 --td-switch-unchecked-disabled-color | @bg-color-component-disabled | - 
 --td-switch-width | 45px | -