From cde8bc836135cc933659fdb0b624fb9548cbdacd Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Tue, 3 Jul 2018 15:46:12 +0800
Subject: [PATCH] Selected value in Cascader should be gray when focus search
 input

---
 components/cascader/index.tsx        | 3 ++-
 components/cascader/style/index.less | 5 +++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/components/cascader/index.tsx b/components/cascader/index.tsx
index 79c79423cd..290f11765b 100644
--- a/components/cascader/index.tsx
+++ b/components/cascader/index.tsx
@@ -341,7 +341,7 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
       prefixCls, inputPrefixCls, children, placeholder, size, disabled,
       className, style, allowClear, showSearch = false, ...otherProps
     } = props;
-    const value = state.value;
+    const { value, inputFocused } = state;
 
     const sizeCls = classNames({
       [`${inputPrefixCls}-lg`]: size === 'large',
@@ -364,6 +364,7 @@ export default class Cascader extends React.Component<CascaderProps, CascaderSta
       [`${prefixCls}-picker-disabled`]: disabled,
       [`${prefixCls}-picker-${size}`]: !!size,
       [`${prefixCls}-picker-show-search`]: !!showSearch,
+      [`${prefixCls}-picker-focused`]: inputFocused,
     });
 
     // Fix bug of https://github.com/facebook/react/pull/5004
diff --git a/components/cascader/style/index.less b/components/cascader/style/index.less
index a4c5258942..e2f74f808b 100644
--- a/components/cascader/style/index.less
+++ b/components/cascader/style/index.less
@@ -28,6 +28,7 @@
     background-color: @component-background;
     border-radius: @border-radius-base;
     outline: 0;
+    transition: color .3s;
 
     &-with-value &-label {
       color: transparent;
@@ -46,6 +47,10 @@
       .active;
     }
 
+    &-show-search&-focused {
+      color: @disabled-color;
+    }
+
     &-label {
       position: absolute;
       left: 0;