8000 Merge pull request #260 from shinnyx/feature/filter-class-name · leetcode/reactable@7bef66d · GitHub
[go: up one dir, main page]
Skip to content

Commit 7bef66d

Browse files
glittersharkglittershark
committed
Merge pull request glittershark#260 from shinnyx/feature/filter-class-name
Add filterClassName
2 parents b64d433 + 8e3cf28 commit 7bef66d

File tree

11 files changed

+26
-10
lines changed

11 files changed

+26
-10
lines changed

‎build/reactable.js

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ window.ReactDOM["default"] = window.ReactDOM;
2121
columns: true,
2222
sortable: true,
2323
filterable: true,
24+
filterClassName: true,
2425
sortBy: true,
2526
defaultSort: true,
2627
itemsPerPage: true,
@@ -240,7 +241,7 @@ window.ReactDOM["default"] = window.ReactDOM;
240241
key: 'render',
241242
value: function render() {
242243
return _react['default'].createElement('input', { type: 'text',
243-
className: 'reactable-filter-input',
244+
className: this.props.className,
244245
pl 8000 aceholder: this.props.placeholder,
245246
value: this.props.value,
246247
onKeyUp: this.onChange.bind(this),
@@ -278,7 +279,8 @@ window.ReactDOM["default"] = window.ReactDOM;
278279
{ colSpan: this.props.colSpan },
279280
_react['default'].createElement(FiltererInput, { onFilter: this.props.onFilter,
280281
value: this.props.value,
281-
placeholder: this.props.placeholder })
282+
placeholder: this.props.placeholder,
283+
className: this.props.className ? 'reactable-filter-input ' + this.props.className : 'reactable-filter-input' })
282284
)
283285
);
284286
}
@@ -718,7 +720,8 @@ window.ReactDOM["default"] = window.ReactDOM;
718720
colSpan: this.props.columns.length,
719721
onFilter: this.props.onFilter,
720722
placeholder: this.props.filterPlaceholder,
721-
value: this.props.currentFilter
723+
value: this.props.currentFilter,
724+
className: this.props.filterClassName
722725
}) : null,
723726
_react['default'].createElement(
724727
'tr',
@@ -1486,6 +1489,7 @@ window.ReactDOM["default"] = window.ReactDOM;
14861489
}
14871490
},
14881491
filterPlaceholder: this.props.filterPlaceholder,
1492+
filterClassName: this.props.filterClassName,
14891493
currentFilter: this.state.filter,
14901494
sort: this.state.currentSort,
14911495
sortableColumns: this._sortable,

‎build/tests/reactable_test.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎lib/reactable/filterer.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ var FiltererInput = (function (_React$Component) {
4040
key: 'render',
4141
value: function render() {
4242
return _react2['default'].createElement('input', { type: 'text',
43-
className: 'reactable-filter-input',
43+
className: this.props.className,
4444
placeholder: this.props.placeholder,
4545
value: this.props.value,
4646
onKeyUp: this.onChange.bind(this),
@@ -78,7 +78,8 @@ var Filterer = (function (_React$Component2) {
7878
{ colSpan: this.props.colSpan },
7979
_react2['default'].createElement(FiltererInput, { onFilter: this.props.onFilter,
8080
value: this.props.value,
81-
placeholder: this.props.placeholder })
81+
placeholder: this.props.placeholder,
82+
className: this.props.className ? 'reactable-filter-input ' + this.props.className : 'reactable-filter-input' })
8283
)
8384
);
8485
}

‎lib/reactable/lib/filter_props_from.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ var internalProps = {
99
columns: true,
1010
sortable: true,
1111
filterable: true,
12+
filterClassName: true,
1213
sortBy: true,
1314
defaultSort: true,
1415
itemsPerPage: true,

‎lib/reactable/table.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -518,6 +518,7 @@ var Table = (function (_React$Component) {
518518
}
519519
},
520520
filterPlaceholder: this.props.filterPlaceholder,
521+
filterClassName: this.props.filterClassName,
521522
currentFilter: this.state.filter,
522523
sort: this.state.currentSort,
523524
sortableColumns: this._sortable,

‎lib/reactable/thead.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,8 @@ var Thead = (function (_React$Component) {
101101
colSpan: this.props.columns.length,
102102
onFilter: this.props.onFilter,
103103
placeholder: this.props.filterPlaceholder,
104-
value: this.props.currentFilter
104+
value: this.props.currentFilter,
105+
className: this.props.filterClassName
105106
}) : null,
106107
_react2['default'].createElement(
107108
'tr',

‎src/reactable/filterer.jsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export class FiltererInput extends React.Component {
99
render() {
1010
return (
1111
<input type="text"
12-
className="reactable-filter-input"
12+
className={this.props.className}
1313
placeholder={this.props.placeholder}
1414
value={this.props.value}
1515
onKeyUp={this.onChange.bind(this)}
@@ -29,7 +29,8 @@ export class Filterer extends React.Component {
2929
<td colSpan={this.props.colSpan}>
3030
<FiltererInput onFilter={this.props.onFilter}
3131
value={this.props.value}
32-
placeholder={this.props.placeholder}/>
32+
placeholder={this.props.placeholder}
33+
className={this.props.className ? 'reactable-filter-input ' + this.props.className : 'reactable-filter-input'} />
3334
</td>
3435
</tr>
3536
);

‎src/reactable/lib/filter_props_from.jsx

Lines changed: 1 addition & 0 deletions
Or 10000 iginal file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ const internalProps = {
33
columns: true,
44
sortable: true,
55
filterable: true,
6+
filterClassName: true,
67
sortBy: true,
78
defaultSort: true,
89
itemsPerPage: true,

‎src/reactable/table.jsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -481,6 +481,7 @@ export class Table extends React.Component {
481481
}
482482
}}
483483
filterPlaceholder={this.props.filterPlaceholder}
484+
filterClassName={this.props.filterClassName}
484485
currentFilter={this.state.filter}
485486
sort={this.state.currentSort}
486487
sortableColumns={this._sortable}

‎src/reactable/thead.jsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,7 @@ export class Thead extends React.Component {
108108
onFilter={this.props.onFilter}
109109
placeholder={this.props.filterPlaceholder}
110110
value={this.props.currentFilter}
111+
className={this.props.filterClassName}
111112
/> : null}
112113
<tr className="reactable-column-header">{Ths}</tr>
113114
</thead>

‎tests/reactable_test.jsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -360,7 +360,7 @@ describe('Reactable', function() {
360360
describe('Adding a <Tfoot>', function() {
361361
before(function() {
362362
ReactDOM.render(
363-
<Reactable.Table className="table" id="table" sortable={['Name']} filterable={['Name', 'Age']}>
363+
<Reactable.Table className="table" id="table" sortable={['Name']} filterable={['Name', 'Age']} filterClassName="new-class" >
364364
<Reactable.Tr className="rowClass1" data={{ Name: 'Griffin Smith', Age: '18'}}/>
365365
<Reactable.Tr className="rowClass2" data={{ Age: '23', Name: 'Lee Salminen'}}/>
366366
<Reactable.Tr className="rowClass3" data={{ Age: '28', Position: 'Developer'}}/>
@@ -411,6 +411,10 @@ describe('Reactable', function() {
411411
ReactTestUtils.Simulate.keyUp($filter[0]);
412412
});
413413

414+
it('adds the filterClassName to the filterer', function() {
415+
expect($('.reactable-filter-input').hasClass('new-class')).to.eq(true)
416+
});
417+
414418
it('leaves the tfoot alone', function() {
415419
expect($('table :last-child')).to.match('tfoot');
416420
});

0 commit comments

Comments
 (0)
0