flex改用auto

react-widget · Mar 9, 2019 · 7dbf6a6 · 7dbf6a6
1 parent e9bc49d
commit 7dbf6a6
Show file tree

Hide file tree

Showing 10 changed files with 83 additions and 75 deletions.
diff --git a/docs/index.html b/docs/index.html
@@ -15,11 +15,11 @@
             overflow: auto;
         }
     </style>
-<link href="static\css\index.c57af803.css" rel="stylesheet"></head>
+<link href="static\css\index.a1890453.css" rel="stylesheet"></head>
 
 <body style="background:#F5F5F5">
     <div class="demo" id="demo">
     </div>
-<script src="static\js\vendors.e94b1935.chunk.js"></script><script src="static\js\index.ff6e5f2a.js"></script></body>
+<script src="static\js\vendors.e94b1935.chunk.js"></script><script src="static\js\index.46b94f42.js"></script></body>
 
 </html>
diff --git a/docs/static/css/index.c57af803.css → docs/static/css/index.a1890453.css b/docs/static/css/index.c57af803.css → docs/static/css/index.a1890453.css
diff --git a/docs/static/css/index.c57af803.css.map → docs/static/css/index.a1890453.css.map b/docs/static/css/index.c57af803.css.map → docs/static/css/index.a1890453.css.map
diff --git a/docs/static/js/index.ff6e5f2a.js → docs/static/js/index.46b94f42.js b/docs/static/js/index.ff6e5f2a.js → docs/static/js/index.46b94f42.js
diff --git a/docs/static/js/index.46b94f42.js.map b/docs/static/js/index.46b94f42.js.map
diff --git a/docs/static/js/index.ff6e5f2a.js.map b/docs/static/js/index.ff6e5f2a.js.map
diff --git a/lib/ListBox.js b/lib/ListBox.js
@@ -8,6 +8,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _isArray = _interopRequireDefault(require("@babel/runtime-corejs2/core-js/array/is-array"));
+
 var _assign = _interopRequireDefault(require("@babel/runtime-corejs2/core-js/object/assign"));
 
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/toConsumableArray"));
@@ -457,7 +459,7 @@ function (_React$Component) {
         return emptyLabel;
       }
 
-      var childs = items.length ? this.renderListItems(items, selectedMap) : this.renderListChild(children, selectedMap);
+      var childs = (0, _isArray.default)(items) ? this.renderListItems(items, selectedMap) : this.renderListChild(children, selectedMap);
       return _react.default.Children.count(childs) ? childs : emptyLabel;
     }
   }, {
@@ -584,6 +586,9 @@ exports.default = ListBox;
   labelField: _propTypes.default.string,
   childrenField: _propTypes.default.string,
   items: _propTypes.default.array,
+  //itemsMap: PropTypes.object,
+  defaultValue: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.array]),
+  value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.array]),
   emptyLabel: _propTypes.default.any,
   multiple: _propTypes.default.bool,
   disabled: _propTypes.default.bool,
@@ -616,9 +621,9 @@ exports.default = ListBox;
   childrenField: 'children',
   labelInValue: false,
   tabIndex: 0,
-  items: [],
   emptyLabel: 'Not Found',
   enableDownUpSelect: true,
+  //items: [],
   onFocus: noop,
   onBlur: noop,
   onKeyDown: noop,

diff --git a/lib/style/index.css b/lib/style/index.css
@@ -1,6 +1,6 @@
 
 .rw-listbox {
-  background: #FFF;
+  background: #fff;
   overflow: hidden;
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
@@ -14,8 +14,8 @@
   .rw-listbox-disabled {
     border: 1px solid #b3b3b3; }
   .rw-listbox .rw-listbox-body {
-    -ms-flex: 1 1;
-        flex: 1 1;
+    -ms-flex: auto;
+        flex: auto;
     overflow: hidden;
     overflow-y: auto; }
     .rw-listbox .rw-listbox-body .rw-listbox-item-group-title,
@@ -32,7 +32,7 @@
     .rw-listbox .rw-listbox-body .rw-listbox-item-selected {
       background: #ebf9ff; }
     .rw-listbox .rw-listbox-body .rw-listbox-item-disabled {
-      opacity: .5;
+      opacity: 0.5;
       cursor: default; }
       .rw-listbox .rw-listbox-body .rw-listbox-item-disabled:not(.rw-listbox-item-selected):hover {
         background: none; }

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "react-widget-listbox",
-    "version": "1.0.5",
+    "version": "1.0.6",
     "description": "",
     "main": "index.js",
     "repository": {

diff --git a/src/style/index.scss b/src/style/index.scss
@@ -3,65 +3,63 @@ $listboxItemPadding: 8px 12px !default;
 $listboxItemHeight: auto !default;
 
 .#{$prefixCls} {
-	background:#FFF;
-	overflow: hidden;
-	box-sizing: border-box;
-    border:1px solid #e5e5ea;
+    background: #fff;
+    overflow: hidden;
+    box-sizing: border-box;
+    border: 1px solid #e5e5ea;
     display: flex;
     flex-direction: column;
-	&:focus{
-		outline:0;	
-	}
-	&-disabled {
-		border:1px solid #b3b3b3;
-	}
-	.#{$prefixCls}-body {
-        flex: 1;
+    &:focus {
+        outline: 0;
+    }
+    &-disabled {
+        border: 1px solid #b3b3b3;
+    }
+    .#{$prefixCls}-body {
+        flex: auto;
         overflow: hidden;
         overflow-y: auto;
 
-		.#{$prefixCls}-item-group-title,
-		.#{$prefixCls}-item {
-			//list-style:none;
-			position:relative;
-			padding:$listboxItemPadding;
-			cursor: pointer;
-			line-height:$listboxItemHeight;
-			height:$listboxItemHeight;
-			white-space: nowrap;
-			overflow:hidden;
-		}
-		
-		//hover
-		.#{$prefixCls}-item-active {
-            background: rgba(235,249,255,.5);
-         //   color: #575757;
-		}
-		
-		.#{$prefixCls}-item-selected {
+        .#{$prefixCls}-item-group-title,
+        .#{$prefixCls}-item {
+            //list-style:none;
+            position: relative;
+            padding: $listboxItemPadding;
+            cursor: pointer;
+            line-height: $listboxItemHeight;
+            height: $listboxItemHeight;
+            white-space: nowrap;
+            overflow: hidden;
+        }
+
+        //hover
+        .#{$prefixCls}-item-active {
+            background: rgba(235, 249, 255, 0.5);
+            //   color: #575757;
+        }
+
+        .#{$prefixCls}-item-selected {
             background: #ebf9ff;
-
-		}
-
-		.#{$prefixCls}-item-disabled {
-			opacity: .5;
-			cursor: default;
-			&:not(.#{$prefixCls}-item-selected):hover {
-				background: none;
-				//color: rgba(0,0,0,.25);
-			}	
-		}
-
-		.#{$prefixCls}-item-group-title {
-			padding:$listboxItemPadding;
-            cursor:default;
+        }
+
+        .#{$prefixCls}-item-disabled {
+            opacity: 0.5;
+            cursor: default;
+            &:not(.#{$prefixCls}-item-selected):hover {
+                background: none;
+                //color: rgba(0,0,0,.25);
+            }
+        }
+
+        .#{$prefixCls}-item-group-title {
+            padding: $listboxItemPadding;
+            cursor: default;
             font-weight: 700;
-			//color: #999;
-		}
-
-		.#{$prefixCls}-item-group-list .#{$prefixCls}-item {
-			padding-left:28px;	
-		}
-
-	}
-}	
+            //color: #999;
+        }
+
+        .#{$prefixCls}-item-group-list .#{$prefixCls}-item {
+            padding-left: 28px;
+        }
+    }
+}