From 577e283125483c3df9f772c9f0c5ed90c281d025 Mon Sep 17 00:00:00 2001
From: zkwolf <chenhao5866@gmail.com>
Date: Mon, 7 Dec 2020 10:54:15 +0800
Subject: [PATCH 1/2] feat: input.password add iconRender

---
 components/input/Password.tsx            | 13 +++++++------
 components/input/__tests__/index.test.js | 17 +++++++++++++++++
 2 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/components/input/Password.tsx b/components/input/Password.tsx
index 9556f1c8e7..c9274185d5 100644
--- a/components/input/Password.tsx
+++ b/components/input/Password.tsx
@@ -1,5 +1,6 @@
 import classNames from '../_util/classNames';
 import { getComponent, getOptionProps } from '../_util/props-util';
+import { cloneElement } from '../_util/vnode';
 import Input from './Input';
 import EyeOutlined from '@ant-design/icons-vue/EyeOutlined';
 import EyeInvisibleOutlined from '@ant-design/icons-vue/EyeInvisibleOutlined';
@@ -23,6 +24,9 @@ export default defineComponent({
     inputPrefixCls: PropTypes.string.def('ant-input'),
     action: PropTypes.string.def('click'),
     visibilityToggle: PropTypes.looseBool.def(true),
+    iconRender: PropTypes.func.def((visible: boolean) =>
+      visible ? <EyeOutlined /> : <EyeInvisibleOutlined />,
+    ),
   },
   setup() {
     return {
@@ -53,8 +57,9 @@ export default defineComponent({
       });
     },
     getIcon() {
-      const { prefixCls, action } = this.$props;
+      const { prefixCls, action, iconRender = () => null } = this.$props;
       const iconTrigger = ActionMap[action] || '';
+      const icon = iconRender(this.visible);
       const iconProps = {
         [iconTrigger]: this.onVisibleChange,
         onMousedown: (e: Event) => {
@@ -70,11 +75,7 @@ export default defineComponent({
         class: `${prefixCls}-icon`,
         key: 'passwordIcon',
       };
-      return this.visible ? (
-        <EyeOutlined {...iconProps} />
-      ) : (
-        <EyeInvisibleOutlined {...iconProps} />
-      );
+      return cloneElement(icon, iconProps);
     },
   },
   render() {
diff --git a/components/input/__tests__/index.test.js b/components/input/__tests__/index.test.js
index 684411905c..9f06114c86 100644
--- a/components/input/__tests__/index.test.js
+++ b/components/input/__tests__/index.test.js
@@ -3,6 +3,7 @@ import { asyncExpect } from '@/tests/utils';
 import Input from '..';
 // import Form from '../../form';
 import focusTest from '../../../tests/shared/focusTest';
+import { WifiOutlined, SyncOutlined } from '@ant-design/icons-vue';
 
 const { TextArea, Password } = Input;
 
@@ -131,3 +132,19 @@ describe('Input.Search', () => {
     }, 100);
   });
 });
+
+describe('Input.Password', () => {
+  it('should support iconRender', async () => {
+    const wrapper = mount(Input.Password, {
+      props: { iconRender: visible => (visible ? <SyncOutlined /> : <WifiOutlined />) },
+      sync: false,
+    });
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.anticon-wifi').length).toBe(1);
+      wrapper.find('.anticon-wifi').trigger('click');
+    }, 100);
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.anticon-sync').length).toBe(1);
+    }, 100);
+  });
+});

From f84fbef763b94e092eb5dcb99b171327771bc413 Mon Sep 17 00:00:00 2001
From: zkwolf <chenhao5866@gmail.com>
Date: Wed, 9 Dec 2020 11:23:33 +0800
Subject: [PATCH 2/2] feat: input.password support slot iconRender

---
 components/input/Password.tsx            |  3 ++-
 components/input/__tests__/index.test.js | 16 ++++++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/components/input/Password.tsx b/components/input/Password.tsx
index c9274185d5..d1a428a6b8 100644
--- a/components/input/Password.tsx
+++ b/components/input/Password.tsx
@@ -57,8 +57,9 @@ export default defineComponent({
       });
     },
     getIcon() {
-      const { prefixCls, action, iconRender = () => null } = this.$props;
+      const { prefixCls, action } = this.$props;
       const iconTrigger = ActionMap[action] || '';
+      const iconRender = this.$slots.iconRender || this.$props.iconRender;
       const icon = iconRender(this.visible);
       const iconProps = {
         [iconTrigger]: this.onVisibleChange,
diff --git a/components/input/__tests__/index.test.js b/components/input/__tests__/index.test.js
index 9f06114c86..944e86d748 100644
--- a/components/input/__tests__/index.test.js
+++ b/components/input/__tests__/index.test.js
@@ -147,4 +147,20 @@ describe('Input.Password', () => {
       expect(wrapper.findAll('.anticon-sync').length).toBe(1);
     }, 100);
   });
+
+  it('should support slot iconRender', async () => {
+    const wrapper = mount(Input.Password, {
+      slots: {
+        iconRender: visible => (visible ? <SyncOutlined /> : <WifiOutlined />),
+      },
+      sync: false,
+    });
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.anticon-wifi').length).toBe(1);
+      wrapper.find('.anticon-wifi').trigger('click');
+    }, 100);
+    await asyncExpect(() => {
+      expect(wrapper.findAll('.anticon-sync').length).toBe(1);
+    }, 100);
+  });
 });