From bbfb1f8c00155fa769b84cae24568e1559213e9e Mon Sep 17 00:00:00 2001
From: rickcole <rickcole21@outlook.com>
Date: Tue, 28 Apr 2020 19:25:19 +0800
Subject: [PATCH] fix style

---
 scss/components/form/_nested-select.scss | 18 +++++++++++++++++-
 src/renderers/Form/NestedSelect.tsx      | 18 +++++++-----------
 2 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/scss/components/form/_nested-select.scss b/scss/components/form/_nested-select.scss
index 339d8a64..af76ea4e 100644
--- a/scss/components/form/_nested-select.scss
+++ b/scss/components/form/_nested-select.scss
@@ -109,7 +109,7 @@
   }
 
   &-menu {
-    min-width: px2rem(160px);
+    min-width: px2rem(120px);
     max-height: px2rem(300px);
     background: $Form-select-menu-bg;
     color: $Form-select-menu-color;
@@ -161,3 +161,19 @@
     }
   }
 }
+
+// 需要能撑开
+@include media-breakpoint-up(sm) {
+  .#{$ns}Form-control--sizeXs > .#{$ns}NestedSelect,
+  .#{$ns}Form-control--sizeSm > .#{$ns}NestedSelect,
+  .#{$ns}Form-control--sizeMd > .#{$ns}NestedSelect,
+  .#{$ns}Form-control--sizeLg > .#{$ns}NestedSelect {
+    min-width: 100%;
+    max-width: 100%;
+    display: inline-flex !important;
+
+    .#{$ns}Select-valueWrap {
+      width: 0; // ! 没有这个会撑开。
+    }
+  }
+}
diff --git a/src/renderers/Form/NestedSelect.tsx b/src/renderers/Form/NestedSelect.tsx
index be6cd86e..5e543dad 100644
--- a/src/renderers/Form/NestedSelect.tsx
+++ b/src/renderers/Form/NestedSelect.tsx
@@ -521,7 +521,7 @@ export default class NestedSelectControl extends React.Component<
       >
         <div
           className={cx('NestedSelect-menuOuter')}
-          style={{width: this.target.offsetWidth}}
+          style={{minWidth: this.target.offsetWidth}}
         >
           {this.renderOptions()}
         </div>
@@ -548,17 +548,13 @@ export default class NestedSelectControl extends React.Component<
     const {className, disabled, classnames: cx, multiple} = this.props;
 
     return (
-      <div className={cx('NestedSelectControl')}>
+      <div className={cx('NestedSelectControl', className)}>
         <div
-          className={cx(
-            'NestedSelect',
-            {
-              [`NestedSelect--multi`]: multiple,
-              'is-opened': this.state.isOpened,
-              'is-disabled': disabled
-            },
-            className
-          )}
+          className={cx('NestedSelect', {
+            [`NestedSelect--multi`]: multiple,
+            'is-opened': this.state.isOpened,
+            'is-disabled': disabled
+          })}
           onClick={this.open}
           ref={this.domRef}
         >