react-widget
diff --git a/‎docs/index.html‎
Lines changed: 1 addition & 1 deletion b/‎docs/index.html‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎docs/static/js/index.1a730766.js.map‎
Lines changed: 0 additions & 1 deletion b/‎docs/static/js/index.1a730766.js.map‎
Lines changed: 0 additions & 1 deletion
diff --git a/‎docs/static/js/index.1a730766.js‎ ‎docs/static/js/index.2f40ff67.js‎docs/static/js/index.1a730766.js renamed to docs/static/js/index.2f40ff67.js
Lines changed: 24 additions & 4 deletions b/‎docs/static/js/index.1a730766.js‎ ‎docs/static/js/index.2f40ff67.js‎docs/static/js/index.1a730766.js renamed to docs/static/js/index.2f40ff67.js
Lines changed: 24 additions & 4 deletions
diff --git a/‎docs/static/js/index.2f40ff67.js.map‎
Lines changed: 1 addition & 0 deletions b/‎docs/static/js/index.2f40ff67.js.map‎
Lines changed: 1 addition & 0 deletions
diff --git a/‎examples/demos/demo1.js‎
Lines changed: 8 additions & 0 deletions b/‎examples/demos/demo1.js‎
Lines changed: 8 additions & 0 deletions
diff --git a/‎src/ListBox.js‎
Lines changed: 6 additions & 0 deletions b/‎src/ListBox.js‎
Lines changed: 6 additions & 0 deletions
@@ -20,6 +20,6 @@
 <body style="background:#F5F5F5">
     <div class="demo" id="demo">
     </div>
-<script src="static\js\vendors.54ed405d.chunk.js"></script><script src="static\js\index.1a730766.js"></script></body>
+<script src="static\js\vendors.54ed405d.chunk.js"></script><script src="static\js\index.2f40ff67.js"></script></body>
 
 </html>
@@ -59,6 +59,14 @@ export default class DEMO extends Component {
                         height: 400,
                     }}
                     autoFocus
+                    renderHeader={() => <h3>header</h3>}
+                    renderFooter={() => <h3>footer</h3>}
+                    headerStyle={{
+                        borderBottom: '1px solid #ccc'
+                    }}
+                    footerStyle={{
+                        borderTop: '1px solid #ccc'
+                    }}
                     value={this.state.value}
                     onChange={this.handleChange}
                     items={dataset.filter((item, i) => item.label.indexOf(this.filterMsg) >= 0)}
 
@@ -24,6 +24,8 @@ export default class ListBox extends React.Component {
     static propTypes = {
         className: PropTypes.string,
         style: PropTypes.object,
+        headerStyle: PropTypes.object,
+        footerStyle: PropTypes.object,
         scrollViewBodyStyle: PropTypes.object,
         prefixCls: PropTypes.string,
         valueField: PropTypes.string,
@@ -453,6 +455,8 @@ export default class ListBox extends React.Component {
             footerWrapperComponent: FooterWrapperComponent,
             renderHeader,
             renderFooter,
+            headerStyle = {},
+            footerStyle = {},
         } = this.props;
 
         if (width) {
@@ -485,6 +489,7 @@ export default class ListBox extends React.Component {
                     renderHeader ?
                         <HeaderWrapperComponent
                             className={`${prefixCls}-header`}
+                            style={headerStyle}
                         >
                             {renderHeader()}
                         </HeaderWrapperComponent> :
@@ -501,6 +506,7 @@ export default class ListBox extends React.Component {
                     renderFooter ?
                         <FooterWrapperComponent
                             className={`${prefixCls}-footer`}
+                            style={footerStyle}
                         >
                             {renderFooter()}
                         </FooterWrapperComponent> :