Skip to content
This repository was archived by the owner on Jan 15, 2022. It is now read-only.

Commit 9adf60b

Browse files
wmertenswmertens
committed
Add built files
1 parent 0b06a68 commit 9adf60b

File tree

3 files changed

+325
-2
lines changed

3 files changed

+325
-2
lines changed

‎build/reactable.js‎

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1284,6 +1284,25 @@ window.ReactDOM["default"] = window.ReactDOM;
12841284
this.setState({ currentSort: currentSort });
12851285
this.sortByCurrentSort();
12861286
}
1287+
}, {
1288+
key: 'visibleItems',
1289+
value: function visibleItems() {
1290+
return this.currentChildren.map(function (item) {
1291+
var _item$props = item.props;
1292+
var i = _item$props.i;
1293+
var id = _item$props.id;
1294+
1295+
var iOrId = i != null ? i : id;
1296+
var idOrKey = iOrId != null ? iOrId : item.key;
1297+
var data = { id: idOrKey };
1298+
1299+
Object.keys(item.props.data).forEach(function (key) {
1300+
data[key] = item.props.data[key].value;
1301+
});
1302+
1303+
return data;
1304+
});
1305+
}
12871306
}, {
12881307
key: 'render',
12891308
value: function render() {
@@ -1391,6 +1410,18 @@ window.ReactDOM["default"] = window.ReactDOM;
13911410
// Manually transfer props
13921411
var props = (0, _libFilter_props_from.filterPropsFrom)(this.props);
13931412

1413+
var noDataText = this.props.noDataText ? _react['default'].createElement(
1414+
'tr',
1415+
{ className: 'reactable-no-data' },
1416+
_react['default'].createElement(
1417+
'td',
1418+
{ colSpan: columns.length },
1419+
this.props.noDataText
1420+
)
1421+
) : null;
1422+
1423+
this.currentChildren = currentChildren;
1424+
13941425
return _react['default'].createElement(
13951426
'table',
13961427
props,
@@ -1408,7 +1439,7 @@ window.ReactDOM["default"] = window.ReactDOM;
14081439
_react['default'].createElement(
14091440
'tbody',
14101441
{ className: 'reactable-data', key: 'tbody' },
1411-
currentChildren
1442+
currentChildren.length > 0 ? currentChildren : noDataText
14121443
),
14131444
pagination === true ? _react['default'].createElement(_paginator.Paginator, { colSpan: columns.length,
14141445
pageButtonLimit: pageButtonLimit,

‎build/tests/reactable_test.js‎

Lines changed: 261 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,16 @@
1313
})(this, function (exports) {
1414
'use strict';
1515

16+
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
17+
18+
var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
19+
20+
var _get = function get(_x2, _x3, _x4) { var _again = true; _function: while (_again) { var object = _x2, property = _x3, receiver = _x4; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x2 = parent; _x3 = property; _x4 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
21+
22+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } }
23+
24+
function _inherits(subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
25+
1626
var ReactTestUtils = React.addons.TestUtils;
1727
var expect = chai.expect;
1828

@@ -2151,5 +2161,256 @@
21512161
expect(this.clicked).to.eq(true);
21522162
});
21532163
});
2164+
2165+
describe('table with no data', function () {
2166+
context('when noDataText prop is null', function () {
2167+
before(function () {
2168+
this.component = ReactDOM.render(React.createElement(Reactable.Table, { data: [], columns: ['State', 'Description', 'Tag'] }), ReactableTestUtils.testNode());
2169+
});
2170+
2171+
after(ReactableTestUtils.resetTestEnvironment);
2172+
2173+
it('does not render the reactable-no-data element', function () {
2174+
expect($('.reactable-no-data').length).to.eq(0);
2175+
});
2176+
});
2177+
2178+
context('when initialized without <Tr>s', function () {
2179+
before(function () {
2180+
this.component = ReactDOM.render(React.createElement(Reactable.Table, { className: 'table', id: 'table', columns: ['State', 'Description', 'Tag'], noDataText: 'No matching records found.' }), ReactableTestUtils.testNode());
2181+
});
2182+
2183+
after(ReactableTestUtils.resetTestEnvironment);
2184+
2185+
it('shows the "no data" message', function () {
2186+
var $text = $('.reactable-no-data').text();
2187+
expect($text).to.eq('No matching records found.');
2188+
});
2189+
});
2190+
2191+
context('when filtered without any matches', function () {
2192+
before(function () {
2193+
this.component = ReactDOM.render(React.createElement(
2194+
Reactable.Table,
2195+
{ className: 'table', id: 'table',
2196+
filterable: ['State', 'Tag'],
2197+
filterPlaceholder: 'Filter Results',
2198+
filterBy: 'xxxxx',
2199+
noDataText: 'No matching records found.',
2200+
columns: ['State', 'Description', 'Tag'] },
2201+
React.createElement(
2202+
Reactable.Tr,
2203+
null,
2204+
React.createElement(
2205+
Reactable.Td,
2206+
{ column: 'State' },
2207+
'New York'
2208+
),
2209+
React.createElement(
2210+
Reactable.Td,
2211+
{ column: 'Description' },
2212+
'this is some text'
2213+
),
2214+
React.createElement(
2215+
Reactable.Td,
2216+
{ column: 'Tag' },
2217+
'new'
2218+
)
2219+
),
2220+
React.createElement(
2221+
Reactable.Tr,
2222+
null,
2223+
React.createElement(
2224+
Reactable.Td,
2225+
{ column: 'State' },
2226+
'New Mexico'
2227+
),
2228+
React.createElement(
2229+
Reactable.Td,
2230+
{ column: 'Description' },
2231+
'lorem ipsum'
2232+
),
2233+
React.createElement(
2234+
Reactable.Td,
2235+
{ column: 'Tag' },
2236+
'old'
2237+
)
2238+
),
2239+
React.createElement(
2240+
Reactable.Tr,
2241+
null,
2242+
React.createElement(
2243+
Reactable.Td,
2244+
{ column: 'State' },
2245+
'Colorado'
2246+
),
2247+
React.createElement(
2248+
Reactable.Td,
2249+
{ column: 'Description' },
2250+
'new description that shouldnt match filter'
2251+
),
2252+
React.createElement(
2253+
Reactable.Td,
2254+
{ column: 'Tag' },
2255+
'old'
2256+
)
2257+
),
2258+
React.createElement(
2259+
Reactable.Tr,
2260+
null,
2261+
React.createElement(
2262+
Reactable.Td,
2263+
{ column: 'State' },
2264+
'Alaska'
2265+
),
2266+
React.createElement(
2267+
Reactable.Td,
2268+
{ column: 'Description' },
2269+
'bacon'
2270+
),
2271+
React.createElement(
2272+
Reactable.Td,
2273+
{ column: 'Tag' },
2274+
'renewed'
2275+
)
2276+
)
2277+
), ReactableTestUtils.testNode());
2278+
});
2279+
2280+
after(ReactableTestUtils.resetTestEnvironment);
2281+
2282+
it('shows the "no data" message', function () {
2283+
var text = $('.reactable-no-data').text();
2284+
expect(text).to.eq('No matching records found.');
2285+
});
2286+
});
2287+
2288+
context('when initialized with an empty array for `data` prop', function () {
2289+
before(function () {
2290+
this.component = ReactDOM.render(React.createElement(Reactable.Table, { data: [], className: 'table', id: 'table', columns: ['State', 'Description', 'Tag'], noDataText: 'No matching records found.' }), ReactableTestUtils.testNode());
2291+
});
2292+
2293+
after(ReactableTestUtils.resetTestEnvironment);
2294+
2295+
it('shows the "no data" message', function () {
2296+
var $text = $('.reactable-no-data').text();
2297+
expect($text).to.eq('No matching records found.');
2298+
});
2299+
});
2300+
});
2301+
2302+
describe('visibleItems()', function () {
2303+
var _Reactable = Reactable;
2304+
var Table = _Reactable.Table;
2305+
var Thead = _Reactable.Thead;
2306+
var Tr = _Reactable.Tr;
2307+
var Th = _Reactable.Th;
2308+
var Td = _Reactable.Td;
2309+
2310+
var data = [{ name: "Lee SomeoneElse", age: 18 }, { name: "Lee Salminen", age: 23 }, { name: "No Age", age: null }];
2311+
2312+
var Tester = (function (_React$Component) {
2313+
_inherits(Tester, _React$Component);
2314+
2315+
function Tester() {
2316+
_classCallCheck(this, Tester);
2317+
2318+
_get(Object.getPrototypeOf(Tester.prototype), 'constructor', this).apply(this, arguments);
2319+
}
2320+
2321+
_createClass(Tester, [{
2322+
key: 'componentDidMount',
2323+
value: function componentDidMount() {
2324+
this.props.run && this.props.run(this);
2325+
}
2326+
}, {
2327+
key: 'render',
2328+
value: function render() {
2329+
return React.createElement(
2330+
Table,
2331+
_extends({ ref: 'table', className: 'table', id: 'table',
2332+
filterable: ['Name', 'Age'] }, this.props),
2333+
React.createElement(
2334+
Thead,
2335+
null,
2336+
React.createElement(
2337+
Th,
2338+
{ column: 'Name' },
2339+
'The Name'
2340+
),
2341+
React.createElement(
2342+
Th,
2343+
{ column: 'Age' },
2344+
'The Age'
2345+
)
2346+
),
2347+
data.map(function (item, i) {
2348+
return React.createElement(
2349+
Tr,
2350+
{ key: i, i: i < 2 ? i : null },
2351+
React.createElement(Td, { column: 'Name', data: item.name }),
2352+
React.createElement(Td, { column: 'Age', data: item.age })
2353+
);
2354+
}),
2355+
React.createElement(
2356+
Tr,
2357+
{ i: true },
2358+
React.createElement(Td, { column: 'Name', data: "hi" }),
2359+
React.createElement(Td, { column: 'Age', data: 5 })
2360+
),
2361+
React.createElement(
2362+
Tr,
2363+
{ id: "id" },
2364+
React.createElement(Td, { column: 'Name', data: "hi" }),
2365+
React.createElement(Td, { column: 'Age', data: 7 })
2366+
)
2367+
);
2368+
}
2369+
}]);
2370+
2371+
return Tester;
2372+
})(React.Component);
2373+
2374+
var doTest = function doTest(runMe) {
2375+
var options = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
2376+
return ReactDOM.render(React.createElement(Tester, _extends({ run: runMe }, options)), ReactableTestUtils.testNode());
2377+
};
2378+
2379+
after(ReactableTestUtils.resetTestEnvironment);
2380+
2381+
it('works', function () {
2382+
doTest(function (me) {
2383+
var items = me.refs.table.visibleItems();
2384+
expect(items.length).to.eql(5);
2385+
expect(items[0].Age).to.eql(18);
2386+
});
2387+
});
2388+
it('works when filtered', function () {
2389+
doTest(function (me) {
2390+
var items = me.refs.table.visibleItems();
2391+
expect(items.length).to.eql(2);
2392+
expect(items[1].Age).to.eql(23);
2393+
}, { filterBy: 'lee' });
2394+
});
2395+
it('works when paged', function () {
2396+
doTest(function (me) {
2397+
var items = me.refs.table.visibleItems();
2398+
expect(items.length).to.eql(1);
2399+
expect(items[0].Age).to.eql(18);
2400+
}, { itemsPerPage: 1 });
2401+
});
2402+
it('has keys', function () {
2403+
doTest(function (me) {
2404+
var items = me.refs.table.visibleItems();
2405+
expect(items[1].id).to.eql(1);
2406+
// id is not defined and key is a string
2407+
expect(items[2].id).to.eql("2");
2408+
// Falsy ids still count
2409+
expect(items[0].id).to.eql(0);
2410+
expect(items[3].id).to.eql(true);
2411+
expect(items[4].id).to.eql("id");
2412+
});
2413+
});
2414+
});
21542415
});
21552416
});

‎lib/reactable/table.js‎

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -337,6 +337,25 @@ var Table = (function (_React$Component) {
337337
this.setState({ currentSort: currentSort });
338338
this.sortByCurrentSort();
339339
}
340+
}, {
341+
key: 'visibleItems',
342+
value: function visibleItems() {
343+
return this.currentChildren.map(function (item) {
344+
var _item$props = item.props;
345+
var i = _item$props.i;
346+
var id = _item$props.id;
347+
348+
var iOrId = i != null ? i : id;
349+
var idOrKey = iOrId != null ? iOrId : item.key;
350+
var data = { id: idOrKey };
351+
352+
Object.keys(item.props.data).forEach(function (key) {
353+
data[key] = item.props.data[key].value;
354+
});
355+
356+
return data;
357+
});
358+
}
340359
}, {
341360
key: 'render',
342361
value: function render() {
@@ -444,6 +463,18 @@ var Table = (function (_React$Component) {
444463
// Manually transfer props
445464
var props = (0, _libFilter_props_from.filterPropsFrom)(this.props);
446465

466+
var noDataText = this.props.noDataText ? _react2['default'].createElement(
467+
'tr',
468+
{ className: 'reactable-no-data' },
469+
_react2['default'].createElement(
470+
'td',
471+
{ colSpan: columns.length },
472+
this.props.noDataText
473+
)
474+
) : null;
475+
476+
this.currentChildren = currentChildren;
477+
447478
return _react2['default'].createElement(
448479
'table',
449480
props,
@@ -461,7 +492,7 @@ var Table = (function (_React$Component) {
461492
_react2['default'].createElement(
462493
'tbody',
463494
{ className: 'reactable-data', key: 'tbody' },
464-
currentChildren
495+
currentChildren.length > 0 ? currentChildren : noDataText
465496
),
466497
pagination === true ? _react2['default'].createElement(_paginator.Paginator, { colSpan: columns.length,
467498
pageButtonLimit: pageButtonLimit,

0 commit comments

Comments
 (0)