From 4b8a291684ec475ec4971c20e9be5b2df9025701 Mon Sep 17 00:00:00 2001
From: Benjy Cui <benjycui@users.noreply.github.com>
Date: Mon, 22 May 2017 10:09:17 +0800
Subject: [PATCH] fix: broken style of Cascader in Input.Group (#6208)

* fix: broken hover style of Cascader, close: #6202

* test: update snapshot
---
 .../__tests__/__snapshots__/demo.test.js.snap | 78 +++++++++----------
 components/cascader/index.tsx                 |  6 +-
 components/cascader/style/index.less          |  1 -
 .../__tests__/__snapshots__/demo.test.js.snap | 10 +--
 .../__tests__/__snapshots__/demo.test.js.snap |  6 +-
 5 files changed, 50 insertions(+), 51 deletions(-)

diff --git a/components/cascader/__tests__/__snapshots__/demo.test.js.snap b/components/cascader/__tests__/__snapshots__/demo.test.js.snap
index ed55e3080..2946a2c3e 100644
--- a/components/cascader/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/cascader/__tests__/__snapshots__/demo.test.js.snap
@@ -5,6 +5,9 @@ exports[`renders ./components/cascader/demo/basic.md correctly 1`] = `
   class="ant-cascader-picker"
   tabindex="0"
 >
+  <span
+    class="ant-cascader-picker-label"
+  />
   <input
     autocomplete="off"
     class="ant-input ant-cascader-input "
@@ -13,9 +16,6 @@ exports[`renders ./components/cascader/demo/basic.md correctly 1`] = `
     type="text"
     value=""
   />
-  <span
-    class="ant-cascader-picker-label"
-  />
   <i
     class="anticon anticon-down ant-cascader-picker-arrow"
   />
@@ -27,6 +27,9 @@ exports[`renders ./components/cascader/demo/change-on-select.md correctly 1`] =
   class="ant-cascader-picker"
   tabindex="0"
 >
+  <span
+    class="ant-cascader-picker-label"
+  />
   <input
     autocomplete="off"
     class="ant-input ant-cascader-input "
@@ -35,9 +38,6 @@ exports[`renders ./components/cascader/demo/change-on-select.md correctly 1`] =
     type="text"
     value=""
   />
-  <span
-    class="ant-cascader-picker-label"
-  />
   <i
     class="anticon anticon-down ant-cascader-picker-arrow"
   />
@@ -50,13 +50,6 @@ exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
   style="width:270px;"
   tabindex="0"
 >
-  <input
-    autocomplete="off"
-    class="ant-input ant-cascader-input "
-    readonly=""
-    type="text"
-    value=""
-  />
   <span
     class="ant-cascader-picker-label"
   >
@@ -74,6 +67,13 @@ exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
       )
     </span>
   </span>
+  <input
+    autocomplete="off"
+    class="ant-input ant-cascader-input "
+    readonly=""
+    type="text"
+    value=""
+  />
   <i
     class="anticon anticon-cross-circle ant-cascader-picker-clear"
   />
@@ -100,6 +100,11 @@ exports[`renders ./components/cascader/demo/default-value.md correctly 1`] = `
   class="ant-cascader-picker"
   tabindex="0"
 >
+  <span
+    class="ant-cascader-picker-label"
+  >
+    Zhejiang / Hangzhou / West Lake
+  </span>
   <input
     autocomplete="off"
     class="ant-input ant-cascader-input "
@@ -107,11 +112,6 @@ exports[`renders ./components/cascader/demo/default-value.md correctly 1`] = `
     type="text"
     value=""
   />
-  <span
-    class="ant-cascader-picker-label"
-  >
-    Zhejiang / Hangzhou / West Lake
-  </span>
   <i
     class="anticon anticon-cross-circle ant-cascader-picker-clear"
   />
@@ -126,6 +126,9 @@ exports[`renders ./components/cascader/demo/disabled-option.md correctly 1`] = `
   class="ant-cascader-picker"
   tabindex="0"
 >
+  <span
+    class="ant-cascader-picker-label"
+  />
   <input
     autocomplete="off"
     class="ant-input ant-cascader-input "
@@ -134,9 +137,6 @@ exports[`renders ./components/cascader/demo/disabled-option.md correctly 1`] = `
     type="text"
     value=""
   />
-  <span
-    class="ant-cascader-picker-label"
-  />
   <i
     class="anticon anticon-down ant-cascader-picker-arrow"
   />
@@ -148,6 +148,9 @@ exports[`renders ./components/cascader/demo/hover.md correctly 1`] = `
   class="ant-cascader-picker"
   tabindex="0"
 >
+  <span
+    class="ant-cascader-picker-label"
+  />
   <input
     autocomplete="off"
     class="ant-input ant-cascader-input "
@@ -156,9 +159,6 @@ exports[`renders ./components/cascader/demo/hover.md correctly 1`] = `
     type="text"
     value=""
   />
-  <span
-    class="ant-cascader-picker-label"
-  />
   <i
     class="anticon anticon-down ant-cascader-picker-arrow"
   />
@@ -170,6 +170,9 @@ exports[`renders ./components/cascader/demo/lazy.md correctly 1`] = `
   class="ant-cascader-picker"
   tabindex="0"
 >
+  <span
+    class="ant-cascader-picker-label"
+  />
   <input
     autocomplete="off"
     class="ant-input ant-cascader-input "
@@ -178,9 +181,6 @@ exports[`renders ./components/cascader/demo/lazy.md correctly 1`] = `
     type="text"
     value=""
   />
-  <span
-    class="ant-cascader-picker-label"
-  />
   <i
     class="anticon anticon-down ant-cascader-picker-arrow"
   />
@@ -192,6 +192,9 @@ exports[`renders ./components/cascader/demo/search.md correctly 1`] = `
   class="ant-cascader-picker"
   tabindex="0"
 >
+  <span
+    class="ant-cascader-picker-label"
+  />
   <input
     autocomplete="off"
     class="ant-input ant-cascader-input "
@@ -199,9 +202,6 @@ exports[`renders ./components/cascader/demo/search.md correctly 1`] = `
     type="text"
     value=""
   />
-  <span
-    class="ant-cascader-picker-label"
-  />
   <i
     class="anticon anticon-down ant-cascader-picker-arrow"
   />
@@ -214,6 +214,9 @@ exports[`renders ./components/cascader/demo/size.md correctly 1`] = `
     class="ant-cascader-picker"
     tabindex="0"
   >
+    <span
+      class="ant-cascader-picker-label"
+    />
     <input
       autocomplete="off"
       class="ant-input ant-cascader-input ant-input-lg"
@@ -222,9 +225,6 @@ exports[`renders ./components/cascader/demo/size.md correctly 1`] = `
       type="text"
       value=""
     />
-    <span
-      class="ant-cascader-picker-label"
-    />
     <i
       class="anticon anticon-down ant-cascader-picker-arrow"
     />
@@ -235,6 +235,9 @@ exports[`renders ./components/cascader/demo/size.md correctly 1`] = `
     class="ant-cascader-picker"
     tabindex="0"
   >
+    <span
+      class="ant-cascader-picker-label"
+    />
     <input
       autocomplete="off"
       class="ant-input ant-cascader-input "
@@ -243,9 +246,6 @@ exports[`renders ./components/cascader/demo/size.md correctly 1`] = `
       type="text"
       value=""
     />
-    <span
-      class="ant-cascader-picker-label"
-    />
     <i
       class="anticon anticon-down ant-cascader-picker-arrow"
     />
@@ -256,6 +256,9 @@ exports[`renders ./components/cascader/demo/size.md correctly 1`] = `
     class="ant-cascader-picker"
     tabindex="0"
   >
+    <span
+      class="ant-cascader-picker-label"
+    />
     <input
       autocomplete="off"
       class="ant-input ant-cascader-input ant-input-sm"
@@ -264,9 +267,6 @@ exports[`renders ./components/cascader/demo/size.md correctly 1`] = `
       type="text"
       value=""
     />
-    <span
-      class="ant-cascader-picker-label"
-    />
     <i
       class="anticon anticon-down ant-cascader-picker-arrow"
     />
diff --git a/components/cascader/index.tsx b/components/cascader/index.tsx
index ca037fa13..3b3c163ca 100644
--- a/components/cascader/index.tsx
+++ b/components/cascader/index.tsx
@@ -330,6 +330,9 @@ export default class Cascader extends React.Component<CascaderProps, any> {
         style={style}
         className={pickerCls}
       >
+        <span className={`${prefixCls}-picker-label`}>
+          {this.getLabel()}
+        </span>
         <Input
           {...inputProps}
           ref="input"
@@ -344,9 +347,6 @@ export default class Cascader extends React.Component<CascaderProps, any> {
           onKeyDown={this.handleKeyDown}
           onChange={showSearch ? this.handleInputChange : undefined}
         />
-        <span className={`${prefixCls}-picker-label`}>
-          {this.getLabel()}
-        </span>
         {clearIcon}
         <Icon type="down" className={arrowCls} />
       </span>
diff --git a/components/cascader/style/index.less b/components/cascader/style/index.less
index f7caba073..0e7b0cc58 100644
--- a/components/cascader/style/index.less
+++ b/components/cascader/style/index.less
@@ -13,7 +13,6 @@
     background-color: transparent!important;
     cursor: pointer;
     width: 100%;
-    z-index: 1;
     display: block;
   }
 
diff --git a/components/form/__tests__/__snapshots__/demo.test.js.snap b/components/form/__tests__/__snapshots__/demo.test.js.snap
index bc3e792ce..b04068689 100644
--- a/components/form/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/form/__tests__/__snapshots__/demo.test.js.snap
@@ -1232,6 +1232,11 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
           class="ant-cascader-picker"
           tabindex="0"
         >
+          <span
+            class="ant-cascader-picker-label"
+          >
+            Zhejiang / Hangzhou / West Lake
+          </span>
           <input
             autocomplete="off"
             class="ant-input ant-cascader-input ant-input-lg"
@@ -1241,11 +1246,6 @@ exports[`renders ./components/form/demo/register.md correctly 1`] = `
             type="text"
             value=""
           />
-          <span
-            class="ant-cascader-picker-label"
-          >
-            Zhejiang / Hangzhou / West Lake
-          </span>
           <i
             class="anticon anticon-cross-circle ant-cascader-picker-clear"
           />
diff --git a/components/input/__tests__/__snapshots__/demo.test.js.snap b/components/input/__tests__/__snapshots__/demo.test.js.snap
index 14a1e91ec..9a5bd824d 100644
--- a/components/input/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/input/__tests__/__snapshots__/demo.test.js.snap
@@ -615,6 +615,9 @@ exports[`renders ./components/input/demo/group.md correctly 1`] = `
       style="width:70%;"
       tabindex="0"
     >
+      <span
+        class="ant-cascader-picker-label"
+      />
       <input
         autocomplete="off"
         class="ant-input ant-cascader-input "
@@ -623,9 +626,6 @@ exports[`renders ./components/input/demo/group.md correctly 1`] = `
         type="text"
         value=""
       />
-      <span
-        class="ant-cascader-picker-label"
-      />
       <i
         class="anticon anticon-down ant-cascader-picker-arrow"
       />