fix: wrong dom attribute (#10602)

DimensionDev · Aug 24, 2023 · 8817ecc · 8817ecc
1 parent 4ad8788
commit 8817ecc
Showing 1 changed file with 35 additions and 34 deletions.
diff --git a/packages/mask/src/extension/popups/components/PasswordField/index.tsx b/packages/mask/src/extension/popups/components/PasswordField/index.tsx
@@ -4,39 +4,40 @@ import { StyledInput } from '../StyledInput/index.js'
 import { Icons } from '@masknet/icons'
 
 export const PasswordField = memo(
-    forwardRef<{}, TextFieldProps & { show?: boolean; onClear?: () => void }>((props, ref) => {
-        const theme = useTheme()
-        const [showPassword, setShowPassword] = useState(false)
-        const { show = true, error, onClear } = props
-        return (
-            <StyledInput
-                {...props}
-                type={showPassword ? 'text' : 'password'}
-                ref={ref}
-                InputProps={{
-                    endAdornment:
-                        error && onClear ? (
-                            <InputAdornment position="end" sx={{ paddingRight: 1.5 }}>
-                                <IconButton onClick={onClear} edge="end" size="small">
-                                    <Icons.Close size={24} color={theme.palette.maskColor.danger} />
-                                </IconButton>
-                            </InputAdornment>
-                        ) : (
-                            <InputAdornment position="end">
-                                {show ? (
-                                    <IconButton
-                                        aria-label="toggle password visibility"
-                                        onClick={() => setShowPassword(!showPassword)}
-                                        onMouseDown={(event) => event.preventDefault()}
-                                        edge="end"
-                                        size="small">
-                                        {showPassword ? <Icons.EyeOff /> : <Icons.Eye />}
+    forwardRef<{}, TextFieldProps & { show?: boolean; onClear?: () => void }>(
+        ({ show = true, onClear, ...rest }, ref) => {
+            const theme = useTheme()
+            const [showPassword, setShowPassword] = useState(false)
+            return (
+                <StyledInput
+                    {...rest}
+                    type={showPassword ? 'text' : 'password'}
+                    ref={ref}
+                    InputProps={{
+                        endAdornment:
+                            rest.error && onClear ? (
+                                <InputAdornment position="end" sx={{ paddingRight: 1.5 }}>
+                                    <IconButton onClick={onClear} edge="end" size="small">
+                                        <Icons.Close size={24} color={theme.palette.maskColor.danger} />
                                     </IconButton>
-                                ) : undefined}
-                            </InputAdornment>
-                        ),
-                }}
-            />
-        )
-    }),
+                                </InputAdornment>
+                            ) : (
+                                <InputAdornment position="end">
+                                    {show ? (
+                                        <IconButton
+                                            aria-label="toggle password visibility"
+                                            onClick={() => setShowPassword(!showPassword)}
+                                            onMouseDown={(event) => event.preventDefault()}
+                                            edge="end"
+                                            size="small">
+                                            {showPassword ? <Icons.EyeOff /> : <Icons.Eye />}
+                                        </IconButton>
+                                    ) : undefined}
+                                </InputAdornment>
+                            ),
+                    }}
+                />
+            )
+        },
+    ),
 )