Merge pull request #5911 from ddcat1115/fix-5832

fix Input.Group style bug

components/input/__tests__/__snapshots__/demo.test.js.snap

@@ -573,6 +573,64 @@ exports[`renders ./components/input/demo/group.md correctly 1`] = `
       </div>
     </div>
   </span>
+  <br />
+  <span
+    class="ant-input-group ant-input-group-compact"
+  >
+    <div
+      class="ant-select ant-select-enabled"
+      style="width:30%;"
+    >
+      <div
+        aria-autocomplete="list"
+        aria-expanded="false"
+        aria-haspopup="true"
+        class="ant-select-selection
+                  ant-select-selection--single"
+        role="combobox"
+        tabindex="0"
+      >
+        <div
+          class="ant-select-selection__rendered"
+        >
+          <div
+            class="ant-select-selection-selected-value"
+            style="display:block;opacity:1;"
+            title="Home"
+          >
+            Home
+          </div>
+        </div>
+        <span
+          class="ant-select-arrow"
+          style="user-select:none;-webkit-user-select:none;"
+          unselectable="unselectable"
+        >
+          <b />
+        </span>
+      </div>
+    </div>
+    <span
+      class="ant-cascader-picker"
+      style="width:70%;"
+      tabindex="0"
+    >
+      <input
+        autocomplete="off"
+        class="ant-input ant-cascader-input "
+        placeholder="Select Address"
+        readonly=""
+        type="text"
+        value=""
+      />
+      <span
+        class="ant-cascader-picker-label"
+      />
+      <i
+        class="anticon anticon-down ant-cascader-picker-arrow"
+      />
+    </span>
+  </span>
 </div>
 `;
 

components/input/demo/group.md

@@ -18,10 +18,33 @@ Input.Group example
 Note: You don't need `Col` to control the width in the `compact` mode.
 
 ````jsx
-import { Input, Col, Select, InputNumber, DatePicker, AutoComplete } from 'antd';
+import { Input, Col, Select, InputNumber, DatePicker, AutoComplete, Cascader } from 'antd';
 const InputGroup = Input.Group;
 const Option = Select.Option;
 
+const options = [{
+  value: 'zhejiang',
+  label: 'Zhejiang',
+  children: [{
+    value: 'hangzhou',
+    label: 'Hangzhou',
+    children: [{
+      value: 'xihu',
+      label: 'West Lake',
+    }],
+  }],
+}, {
+  value: 'jiangsu',
+  label: 'Jiangsu',
+  children: [{
+    value: 'nanjing',
+    label: 'Nanjing',
+    children: [{
+      value: 'zhonghuamen',
+      label: 'Zhong Hua Men',
+    }],
+  }],
+}];
 
 class CompactDemo extends React.Component {
   state = {
@@ -108,6 +131,14 @@ class CompactDemo extends React.Component {
             placeholder="Email"
           />
         </InputGroup>
+        <br />
+        <InputGroup compact>
+          <Select style={{ width: '30%' }} defaultValue="Home">
+            <Option value="Home">Home</Option>
+            <Option value="Company">Company</Option>
+          </Select>
+          <Cascader style={{ width: '70%' }} options={options} placeholder="Select Address" />
+        </InputGroup>
       </div>
     );
   }

components/input/style/mixin.less

@@ -259,10 +259,13 @@
       z-index: auto;
     }
 
-    // reset border for Select, datePicker
+    // reset border for Select, DatePicker, AutoComplete, Cascader, Mention, TimePicker
     & > .@{ant-prefix}-select > .@{ant-prefix}-select-selection,
     & > .@{ant-prefix}-calendar-picker .@{ant-prefix}-input,
-    & > .@{ant-prefix}-select-auto-complete .@{ant-prefix}-input {
+    & > .@{ant-prefix}-select-auto-complete .@{ant-prefix}-input,
+    & > .@{ant-prefix}-cascader-picker .@{ant-prefix}-input,
+    & > .@{ant-prefix}-mention-wrapper .@{ant-prefix}-mention-editor,
+    & > .@{ant-prefix}-time-picker .@{ant-prefix}-time-picker-input {
       border-radius: 0;
       border-right-width: 0;
     }
@@ -270,7 +273,10 @@
     & > *:first-child,
     & > .@{ant-prefix}-select:first-child > .@{ant-prefix}-select-selection,
     & > .@{ant-prefix}-calendar-picker:first-child .@{ant-prefix}-input,
-    & > .@{ant-prefix}-select-auto-complete:first-child .@{ant-prefix}-input {
+    & > .@{ant-prefix}-select-auto-complete:first-child .@{ant-prefix}-input,
+    & > .@{ant-prefix}-cascader-picker:first-child .@{ant-prefix}-input,
+    & > .@{ant-prefix}-mention-wrapper:first-child .@{ant-prefix}-mention-editor,
+    & > .@{ant-prefix}-time-picker:first-child .@{ant-prefix}-time-picker-input {
       border-top-left-radius: @border-radius-base;
       border-bottom-left-radius: @border-radius-base;
     }
@@ -278,7 +284,10 @@
     & > *:last-child,
     & > .@{ant-prefix}-select:last-child > .@{ant-prefix}-select-selection,
     & > .@{ant-prefix}-calendar-picker:last-child .@{ant-prefix}-input,
-    & > .@{ant-prefix}-select-auto-complete:last-child .@{ant-prefix}-input {
+    & > .@{ant-prefix}-select-auto-complete:last-child .@{ant-prefix}-input,
+    & > .@{ant-prefix}-cascader-picker:last-child .@{ant-prefix}-input,
+    & > .@{ant-prefix}-mention-wrapper:last-child .@{ant-prefix}-mention-editor,
+    & > .@{ant-prefix}-time-picker:last-child .@{ant-prefix}-time-picker-input {
       border-top-right-radius: @border-radius-base;
       border-bottom-right-radius: @border-radius-base;
       border-right-width: 1px;