20180513 release

docs/README.md

@@ -17,6 +17,7 @@
 * [condensed](#condensed)
 * [id](#id)
 * [classes](#classes)
+* [wrapperClasses](#wrapperClasses)
 * [cellEdit](#cellEdit)
 * [selectRow](#selectRow)
 * [rowStyle](#rowStyle)
@@ -107,6 +108,9 @@ Same as bootstrap `.table-condensed` class for making a table more compact by cu
 Customize id on `table` element.
 ### <a name='classes'>classes - [String]</a>
 Customize class on `table` element.
+
+### <a name='wrapperClasses'>wrapperClasses - [String]</a>
+Customize class on the outer element which wrap up the `table` element. 
 ### <a name='cellEdit'>cellEdit - [Object]</a>
 Makes table cells editable, please see [cellEdit definition](./cell-edit.md) for more detail.
 

package.json

@@ -14,7 +14,8 @@
  "test:watch": "jest --watch",
  "storybook": "cd ./packages/react-bootstrap-table2-example && yarn storybook",
  "gh-pages:clean": "cd ./packages/react-bootstrap-table2-example && yarn gh-pages:clean",
- "gh-pages:build": "cd ./packages/react-bootstrap-table2-example && yarn gh-pages:build"
+ "gh-pages:build": "cd ./packages/react-bootstrap-table2-example && yarn gh-pages:build",
+ "release": "yarn install && yarn build && lerna publish"
  },
  "repository": {
  "type": "git",

packages/react-bootstrap-table2-example/examples/basic/customized-id-classes.js

@@ -33,6 +33,7 @@ const columns = [{
 
 <BootstrapTable id="bar" keyField='id' data={ products } columns={ columns } />
 <BootstrapTable classes="foo" keyField='id' data={ products } columns={ columns } />
+<BootstrapTable wrapperClasses="boo" keyField="id" data={ products } columns={ columns } />
 `;
 
 export default () => (
@@ -43,6 +44,9 @@ export default () => (
  <h4> Customized table className </h4>
  <BootstrapTable classes="foo" keyField="id" data={ products } columns={ columns } />
 
+ <h4> Customized wrapper className </h4>
+ <BootstrapTable wrapperClasses="boo" keyField="id" data={ products } columns={ columns } />
+
  <Code>{ sourceCode }</Code>
  </div>
 );

packages/react-bootstrap-table2-example/stories/stylesheet/base-table/_index.scss

@@ -5,3 +5,7 @@ table.foo {
 table#bar {
  background-color: $light-blue;
 }
+
+div.boo {
+ border: 2px solid salmon;
+}

packages/react-bootstrap-table2-filter/src/wrapper.js

@@ -30,13 +30,11 @@ export default (Base, {
  // I think this condition only isRemoteFilter is enough
  store.filteredData = store.getAllData();
  this.setState(() => ({ isDataChanged: true, currFilters: store.filters }));
- } else if (isDataChanged) {
- if (!isRemoteFilter && Object.keys(this.state.currFilters).length > 0) {
+ } else {
+ if (Object.keys(this.state.currFilters).length > 0) {
  store.filteredData = filters(store, columns, _)(this.state.currFilters);
  }
  this.setState(() => ({ isDataChanged }));
- } else {
- this.setState(() => ({ isDataChanged: false }));
  }
  }
 
@@ -50,7 +48,8 @@ export default (Base, {
  onFilter(column, filterType) {
  return (filterVal) => {
  const { store, columns } = this.props;
- const currFilters = Object.assign({}, this.state.currFilters);
+ // watch out here if migration to context API, #334
+ const currFilters = Object.assign({}, store.filters);
  const { dataField, filter } = column;
 
  if (!_.isDefined(filterVal) || filterVal === '') {

packages/react-bootstrap-table2/src/bootstrap-table.js

@@ -52,9 +52,12 @@ class BootstrapTable extends PropsBaseResolver(Component) {
  caption,
  rowStyle,
  rowClasses,
+ wrapperClasses,
  rowEvents
  } = this.props;
 
+ const tableWrapperClass = cs('react-bootstrap-table', wrapperClasses);
+
  const tableClass = cs('table', {
  'table-striped': striped,
  'table-hover': hover,
@@ -75,7 +78,7 @@ class BootstrapTable extends PropsBaseResolver(Component) {
  const tableCaption = (caption && <Caption>{ caption }</Caption>);
 
  return (
- <div className="react-bootstrap-table">
+ <div className={ tableWrapperClass }>
  <table id={ id } className={ tableClass }>
  { tableCaption }
  <Header
@@ -120,6 +123,7 @@ BootstrapTable.propTypes = {
  hover: PropTypes.bool,
  id: PropTypes.string,
  classes: PropTypes.string,
+ wrapperClasses: PropTypes.string,
  condensed: PropTypes.bool,
  caption: PropTypes.oneOfType([
  PropTypes.node,

packages/react-bootstrap-table2/test/bootstrap-table.test.js

@@ -74,6 +74,25 @@ describe('BootstrapTable', () => {
  });
  });
 
+ describe('when props.wrapperClasses was defined', () => {
+ const classes = 'foo';
+
+ beforeEach(() => {
+ wrapper = shallow(
+ <BootstrapTable
+ keyField="id"
+ columns={ columns }
+ data={ data }
+ store={ store }
+ wrapperClasses={ classes }
+ />);
+ });
+
+ it('should display customized classes correctly', () => {
+ expect(wrapper.find(`.${classes}`).length).toBe(1);
+ });
+ });
+
  describe('when props.id was defined', () => {
  const id = 'foo';