Compare commits

..
Author SHA1 Message Date
tannerlinsley 3aef7d3379 v7.0.0-alpha.22 2019-08-15 14:20:40 -06:00
tannerlinsley d9a4b6bd85 refactor: improve renderer function ergonomics
The renderer function for headers, columns, cells, aggregates, filters, etc used to mix properties
from all of those contexts, including rows. Now thow contexts are located on their own reserved
properties, eg. `Cell: ({ cell: { value}, row, column, ...instance }) => value`

BREAKING CHANGE: The renderer function for headers, columns, cells, aggregates, filters, etc used
2019-08-15 14:16:52 -06:00
tannerlinsley d50ec588bc fix(use-pagination): fixed use pagination pageIndex bug
Use pagination will no longer synchronously reset the pageIndex to 0 on mount
2019-08-15 09:55:22 -06:00
tannerlinsley f9242f604d fix(usesortby): fix usesortby merge regression 2019-08-15 09:04:07 -06:00
Eugene KrevenetsandTanner Linsley 59f6a768a7 improve(use-table): use single instance of defaultColumn property (#1451)
in case of using construction like:
```
{
  defaultColumn = {}
}
```
`defaultColumn` will get new instance each time, so as result it force to recalculation each of `React.useMemo`.
2019-08-15 08:58:42 -06:00
Maximilian BrandauandTanner Linsley bcd0da7379 fix: update colSpan (#1447)
Only count visible columns for determining the colSpan

fix #1446
2019-08-15 08:57:22 -06:00
tannerlinsley 14ea0abf27 docs(readme): fix Zappi link 2019-08-15 08:39:03 -06:00
tannerlinsley 696edacd48 fix(use-flex-layout): fix flex layout hook to use new internal hooks 2019-08-15 08:36:33 -06:00
tannerlinsley f665972584 Merge branch 'master' of https://github.com/react-tools/react-table 2019-08-15 08:31:57 -06:00
tannerlinsley deb15c3908 docs(readme): updated readme 2019-08-15 08:28:37 -06:00
Eugene KrevenetsandTanner Linsley c77ffacdc9 improve(sort): don't sort subrows less than 2 characters (#1449)
it improves performance because cuts a lot of sorting manipulations
2019-08-15 08:11:12 -06:00
gargrohandTanner Linsley d4303a2468 [v7] useSort - Multisort functionality: Limit max cols and optional shift key (#1433)
* [v7] useSort - Multisort functionality: Limit `multiSort` number and configurable shift key

1. Provide configuration for multisort that pressing shift key is not compulsory

2. Configurable limit on max number of columns for multisort, like configuration has been provided that `maxMultiSortColCount` is 3, suppose currenlty table is sorted by `[A, B, C]` and then clicking `D` for sorting should result in table sorted by `[B, C , D]`

* update readme for new multisort options

* Use `isMultiSortEvent` function 

so as to make `shift` key optional or take decision based on other parameters for multisorting

* `isMultiSortEvent` updated readme
2019-08-14 10:47:02 -06:00
Marian LumbaandTanner Linsley dc629aedfa updating code sandbox links (#1437) 2019-08-08 14:11:32 -06:00
tannerlinsley 134f3dc064 v7.0.0-alpha.21 2019-08-06 22:34:17 -06:00
tannerlinsley a667b7cb13 fix(use-pagination): better controlled/manual use-pagination 2019-08-06 22:32:17 -06:00
tannerlinsley 4f01c32216 v7.0.0-alpha.20 2019-08-06 20:01:52 -06:00
tannerlinsley 5145a632c9 Merge branch 'master' of https://github.com/react-tools/react-table 2019-08-06 20:01:11 -06:00
tannerlinsley 8508a6567d feat(multiple): useRowState, fix useRowSelect/useSortBy/usePagination 2019-08-06 19:57:48 -06:00
PierreandTanner Linsley 1e80dd85d6 fix: disableSorting in column config level (#1434) 2019-08-06 08:03:17 -06:00
Tanner LinsleyandGitHub 3cbb49fc37 Update README.md 2019-08-05 14:52:56 -06:00
tannerlinsley 110e04bf61 v7.0.0-alpha.19 2019-08-05 09:00:16 -06:00
tannerlinsley 2b30c84abc fix(utils/example): fixed ensurePluginOrder utility, perf/debug updates 2019-08-05 08:59:35 -06:00
tannerlinsley fd0fe43ad9 Merge branch 'master' of https://github.com/react-tools/react-table 2019-08-05 08:45:18 -06:00
gargrohandTanner Linsley 5975e0c4cd [Minor] use actual param in ensurePluginOrder (#1429) 2019-08-05 08:45:01 -06:00
gargrohandTanner Linsley e7bbddbb0f [Minor] typo correction (#1431) 2019-08-05 08:44:16 -06:00
Tanner LinsleyandGitHub 49a1023467 Update README.md 2019-08-05 08:43:39 -06:00
Tanner LinsleyandGitHub 7167350921 Update README.md 2019-08-05 08:39:54 -06:00
Tanner LinsleyandGitHub 77cb0d97a8 Update README.md 2019-08-05 07:39:55 -06:00
Tanner LinsleyandGitHub 0672de486a Update README.md 2019-08-05 07:38:07 -06:00
Tanner LinsleyandGitHub e0f83d32fe Update README.md 2019-08-05 06:53:29 -06:00
Tanner LinsleyandGitHub 3aaa5b9b1e Update README.md 2019-08-05 06:52:46 -06:00
Tanner LinsleyandGitHub 352de348fe Update README.md 2019-08-05 06:48:00 -06:00
tannerlinsley 21d3853dba v7.0.0-alpha.18 2019-08-03 14:37:38 -06:00
tannerlinsley 095979b9db docs(readme): updated readme 2019-08-03 14:36:52 -06:00
tannerlinsley f52d5af115 docs(examples): updated example directory names 2019-08-03 14:31:13 -06:00
tannerlinsley 037c32345f feat(use-row-select): added useRowSelect plugin hook + related 2019-08-03 14:20:08 -06:00
tannerlinsley 6ad0d4e0c0 Merge branch 'master' of https://github.com/react-tools/react-table 2019-08-02 07:43:30 -06:00
tannerlinsley 512790bc1c fix(multiple): sub-components example, minor refactors
Fixes #1423
2019-08-02 07:42:42 -06:00
gargrohandTanner Linsley 118b873531 fix(useFilters): Honor column level disableFilters by setting canFilters correct value (#1427)
* correcting typos

* [minor ] Readme update

* Honor `columnDisableFilters` in useFilters by setting `canFilters` correct value
2019-08-02 07:28:38 -06:00
tannerlinsley 39c2b152f6 docs(readme): better docs on nested columns 2019-07-31 16:21:03 -06:00
tannerlinsley adfc82b472 v7.0.0-alpha.17 2019-07-31 12:27:58 -06:00
tannerlinsley 6030282428 Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-31 12:27:18 -06:00
tannerlinsley f6ee2a3d99 fix(npm/examples): added src back to npm package, fixed grouping example 2019-07-31 12:27:06 -06:00
AurimasandTanner Linsley 633cc27a99 fix(utils): default Cell renderer cleanup (#1421) 2019-07-31 08:47:21 -06:00
tannerlinsley 02b2671f5c v7.0.0-alpha.16 2019-07-30 17:01:59 -06:00
tannerlinsley 2c5610d885 test(usegroupby/useexpanded): improved tests for useGroupBy/useExpanded 2019-07-30 17:00:59 -06:00
tannerlinsley 12e7b3220d test: snapshots for useFilters, useGroupBy, useSortBy 2019-07-30 15:57:11 -06:00
tannerlinsley bcefe5d6e8 v7.0.0-alpha.15 2019-07-30 14:10:19 -06:00
tannerlinsley df827d76e2 test(usefilters): added useFilters test placeholder 2019-07-30 14:09:48 -06:00
tannerlinsley 0ae8693444 fix(global): fix npm dist, update docs 2019-07-30 14:07:31 -06:00
tannerlinsley 56f3dc9fe6 docs(example): removed page options from the pagination example state 2019-07-30 12:54:19 -06:00
tannerlinsley 5f58786e94 docs(examples): added pagination example 2019-07-30 12:51:14 -06:00
tannerlinsley 48f992fa0c v7.0.0-alpha.14 2019-07-30 11:44:21 -06:00
tannerlinsley 0b868fe8c4 chore(husky): added yarn test:ci 2019-07-30 11:43:22 -06:00
tannerlinsley a7a95b2ce6 fix(usepagination): pageOptions calculate correctly, added pagination ex 2019-07-30 11:41:11 -06:00
tannerlinsley 116f5cdeba docs(grouping example): better annotations and more data 2019-07-30 11:09:20 -06:00
tannerlinsley 0187fcfc2c fix(example): fixed css issues in codesandbox (no css prop) 2019-07-30 10:33:06 -06:00
tannerlinsley ab32339bfa v7.0.0-alpha.13 2019-07-30 10:23:42 -06:00
tannerlinsley 7fd8fa1dfc docs: adding grouping example 2019-07-30 10:21:05 -06:00
tannerlinsley bc89ae3027 Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-30 09:57:04 -06:00
tannerlinsley af739d91d0 fix(usegroupby): fix useGroupBy, add grouping example and fix some tests 2019-07-30 09:56:44 -06:00
Cyril SimanandTanner Linsley 35f78132f6 Avoid react error if the data source doesn't have the property. (#1420)
* Fix : Avoid react error if the data source doesn't have the property.

* Update fix with tannerlinsley's better solution
2019-07-30 09:51:17 -06:00
Larry BothaandTanner Linsley d7a4db0979 chore(commitlint): add deps, config, and git hook (#1419) 2019-07-29 23:45:46 -06:00
tannerlinsley 11167e5635 Refactor useTable, sorting, and filtering to use new hook layer 2019-07-29 14:51:07 -06:00
Larry BothaandTanner Linsley 14a43b1a68 Update test configs (#1417)
* chore(package.json): use latest babel core, remove bridge

* test(.babelrc): add test environment so that Jest can use ES6 imports

* test(usetable): fix import
2019-07-29 14:34:33 -06:00
tannerlinsley 0375a7e7d5 Set up some failing tests 2019-07-29 12:05:19 -06:00
tannerlinsley 6b70309f42 Add prettier format 2019-07-29 11:33:47 -06:00
tannerlinsley 9b262676be Fix hook defaults 2019-07-29 11:14:41 -06:00
tannerlinsley 1caad4cd8c Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-29 11:00:11 -06:00
tannerlinsley dc73347003 Relocate columns and row logic, fix columns and useGroupBy to be more pure
Since useColumns was relying on groupBy logic, this was code smell. I wanted useGroupBy to be able to add that logic all by itself and not have to have dependencies in the core of the table.

To fix that, I've moved the core column and row logic to the useTable hook and added a new hook 'columnsBeforeHeaderGroups' to allow useGroupBy to do what i needs in a more pure way.
2019-07-29 11:00:07 -06:00
gargrohandTanner Linsley 66bfec34a8 [minor] Readme update (#1415)
* correcting typos

* [minor ] Readme update
2019-07-29 09:37:48 -06:00
gargrohandTanner Linsley 6347157f80 correcting typos (#1413) 2019-07-29 08:46:56 -06:00
jaapjanfransandTanner Linsley b6db8775ad Small readme example update (#1412)
in commit ea79cd8388 the`getRowProps` member of the headerGroup object changed into `getHeaderGroupProps`
2019-07-29 07:51:01 -06:00
tannerlinsley cadd8bf62a Rename examples and their directories 2019-07-26 16:03:54 -06:00
tannerlinsley 9f4746a7ac Add sorting guide 2019-07-26 15:54:50 -06:00
tannerlinsley a0ca841287 Update App.js 2019-07-26 11:27:10 -06:00
tannerlinsley 52ee923675 Update package.json 2019-07-26 11:22:58 -06:00
tannerlinsley 24f6a2750d fix(usefilters): fix filter type fallback and autoRemove functionality AGAIN 2019-07-26 11:22:23 -06:00
tannerlinsley 8988660618 fix(usefilters): fixed filtering fallback logic and autoRemove bug 2019-07-26 10:58:35 -06:00
tannerlinsley a3e5cac298 fix(usefilters): fixed the default filter to be 'text' 2019-07-26 10:52:27 -06:00
tannerlinsley 47d2651b8d docs: updated contribution documentation 2019-07-26 10:45:33 -06:00
tannerlinsley 412f64cece chore: released version 7.0.0-alpha.9 2019-07-26 10:39:19 -06:00
tannerlinsley 933cc27e33 Update README.md 2019-07-26 10:30:59 -06:00
tannerlinsley 54be978268 Update App.js 2019-07-26 10:30:20 -06:00
tannerlinsley 90922f8637 Upgrade filter types to support configurable autoRemoval 2019-07-26 10:19:38 -06:00
tannerlinsley fd8a686b30 Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-26 07:14:06 -06:00
Larry BothaandTanner Linsley a361a372ee chore(packages): add husky and lint-staged (#1409) 2019-07-26 07:13:58 -06:00
Larry BothaandTanner Linsley 563e809d05 docs(package.json): add commitizen dep, config, and npm script (#1408)
use `npm run commit` to use commitizen for better commit messages

re #1383
2019-07-25 22:39:25 -06:00
tannerlinsley 7d267b3442 v7.0.0-alpha.8 2019-07-25 13:39:37 -06:00
tannerlinsley 388b3ec2b9 Update README.md 2019-07-25 13:39:13 -06:00
tannerlinsley b2abd82350 Use useEffect in dev, not layoutEffect 2019-07-25 13:39:10 -06:00
tannerlinsley 06a6d6fcc3 Rename getHeaderRowProps to getHeaderGroupProps 2019-07-25 13:38:52 -06:00
tannerlinsley d8599817ad Fix immutability issue with pagination and sortBy 2019-07-25 13:38:33 -06:00
tannerlinsley e1060db327 Satisfy exhuastive-deps in useTableState 2019-07-25 13:38:15 -06:00
tannerlinsley ea79cd8388 Fix renderer functions for blank headers 2019-07-25 13:37:58 -06:00
tannerlinsley b2ed18696f Add defaultColumn option 2019-07-25 13:37:31 -06:00
tannerlinsley 9f8eab5777 Update README.md 2019-07-25 10:27:49 -06:00
tannerlinsley 4f13f32023 Update rendering API and column/header model 2019-07-25 10:24:30 -06:00
tannerlinsley 5bb2e49764 Fix useTableState setState memoization 2019-07-25 07:04:52 -06:00
tannerlinsley d1f26fe7bc Fix action type detection 2019-07-24 07:21:26 -06:00
tannerlinsley c7d6562d04 Change actions and addActions to be simpler to use 2019-07-23 12:30:15 -06:00
tannerlinsley e82d2d4b36 Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-23 12:22:01 -06:00
tannerlinsley 0716e234a1 Add sortBy example 2019-07-23 12:21:57 -06:00
tannerlinsley 824ee34ba9 Refactor sortBy logic 2019-07-23 12:20:32 -06:00
tannerlinsley 514fbabb88 Fix type action forcing 2019-07-23 12:12:46 -06:00
Maksim HorbachevskyandTanner Linsley 2ecf40518e Export utils to create custom hooks (#1403) 2019-07-23 12:03:17 -06:00
tannerlinsley fd64486286 Fix usePagination to work during SSR 2019-07-23 10:55:49 -06:00
tannerlinsley 34909305af Force action types in state reducer 2019-07-23 10:41:27 -06:00
tannerlinsley 5043af5071 Move useColumns and useRows into useTable (but allow overrides) 2019-07-23 10:22:46 -06:00
tannerlinsley 2ca7f78d72 Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-21 15:41:28 -06:00
tannerlinsley 811cd015c2 Update README.md 2019-07-21 15:41:21 -06:00
AresMegaGlobalandTanner Linsley 9e37846a21 Update README.md (#1400) 2019-07-20 07:32:30 -06:00
tannerlinsley 723720c8b1 Update README.md 2019-07-18 15:07:41 -06:00
tannerlinsley 2a20ad3ba4 Update App.js 2019-07-18 15:06:10 -06:00
tannerlinsley c6d37e4834 Update basic example 2019-07-18 15:03:21 -06:00
tannerlinsley a1a192052d Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-18 14:56:06 -06:00
tannerlinsley 455e0730bf Bare bones basic example 2019-07-18 14:56:03 -06:00
Tanner LinsleyandGitHub 1d4867fa2f Update FUNDING.yml 2019-07-18 13:53:38 -06:00
Tanner LinsleyandGitHub c3da2a7c41 Update FUNDING.yml 2019-07-18 13:52:48 -06:00
Tanner LinsleyandGitHub c3a52c5845 Update FUNDING.yml 2019-07-18 13:51:26 -06:00
Tanner LinsleyandGitHub 6dea8103d3 Update FUNDING.yml 2019-07-18 13:51:09 -06:00
Tanner LinsleyandGitHub 3bab8372d1 Update FUNDING.yml 2019-07-18 13:50:29 -06:00
Tanner LinsleyandGitHub b85f457e62 Update FUNDING.yml 2019-07-18 13:41:35 -06:00
Tanner LinsleyandGitHub c6871084d6 Create FUNDING.yml 2019-07-18 13:40:43 -06:00
tannerlinsley 8946771563 Update README.md 2019-07-18 12:08:57 -06:00
tannerlinsley fbc8032d29 Fix disableMultiSort, change from sortByFn to sortTypes 2019-07-18 12:08:55 -06:00
tannerlinsley 6a3bc5559e Add pageCount to instance via usePagination hook 2019-07-18 12:08:04 -06:00
tannerlinsley 91e28b93bf Clean up useTokenPagination 2019-07-18 12:07:48 -06:00
tannerlinsley a6345dbe2b Add sortTypes 2019-07-18 12:07:39 -06:00
tannerlinsley 0b0de317ee Clean up useFlexLayout 2019-07-18 12:07:21 -06:00
tannerlinsley 0ed0c78286 Change expandedKey to manualExpandedKey, fix expanded index to use the original row index 2019-07-18 12:06:57 -06:00
tannerlinsley fad6ac4014 Update README.md 2019-07-17 12:40:54 -06:00
tannerlinsley 8f142b3788 Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-17 12:39:40 -06:00
tannerlinsley daff1f9ca3 Documentation Checkpoint 2019-07-17 12:39:35 -06:00
DomenuchandTanner Linsley 96900f645a returned row inside row hook subscription (#1393) 2019-07-16 13:22:13 -06:00
tannerlinsley 272a99fcd8 Update README.md 2019-07-15 11:36:30 -06:00
tannerlinsley 07fb9529e4 v7.0.0-alpha.7 2019-07-15 11:29:50 -06:00
DomenuchandTanner Linsley b5d399efd6 Fixed grouped column Header that were not adjusting based on hidden child columns (#1381)
* added assertion to check for show property inside column

* reverted previous change

* added a filter to weed out non-visible columns when calculating the size for grouped Headers

* added another case to the previous filter to factor in blank grouped Headers
2019-07-15 11:28:22 -06:00
DomenuchandTanner Linsley 14e931548a added undefined to the unspecific getRowProps fn to retain the param order (#1392) 2019-07-15 11:27:13 -06:00
Larry BothaandTanner Linsley bc3ea07c3e Feature/add jest configs ref: #1383 (#1385)
* add deps for testing

* feat(tests): add jest configs

* uncomment module directories path
2019-07-15 11:25:32 -06:00
tannerlinsley 4a3929cd50 Merge branch 'master' of https://github.com/react-tools/react-table 2019-07-15 09:33:04 -06:00
Larry BothaandTanner Linsley e2bb09d8b2 Feature/add prettier config, ref #1383 (#1384)
* add prettier config

* write files with prettier

* install and configure lint-staged and husky - ref 1.2 in #1383

* feat(style): add prettier configs, ref 1.1 & 1.2 in #1383
2019-07-01 21:03:57 -06:00
ggascoigneandTanner Linsley 18f2dea247 Fix lint errors from react-hooks/exhaustive-deps (#1371)
They all seemed like reasonable warnings, this squashes them.
2019-07-01 09:43:46 -06:00
ggascoigneandTanner Linsley ead3599378 Fix pagination resetting to page zero with manualPagination (#1369)
* Fix pagination resetting to page zero with manualPagination

To be honest I'm not sure what this useLayoutEffect is there to do.
It has no visible effect if you don't use manualPagination, and if you
do it, simply jumps you back to the first page, defeating the point of
you having control of the pagination.

* Conditionally reset page on data change

Rather disable the whole page reset when filters, groupBy or sortBy
change, just because I wanted to disable the page reset on data change,
make that bit be conditional.

With that in mind, usePagination now accepts a
disablePageResetOnDataChange parameter.
2019-07-01 09:36:42 -06:00
Adrien DenatandTanner Linsley addf28a011 Fix useExpanded wrongly flattening subRows (#1372)
* Fix useExpanded wrongly flattening subRows

* Add new paginateSubRows option defaulting to true
2019-06-21 10:00:59 -06:00
Adrien DenatandTanner Linsley e4429b7143 Add support for es module build (#1374) 2019-06-21 09:43:05 -06:00
tannerlinsley 4b2d0eb187 v7.0.0-alpha.6 2019-06-20 15:24:02 -06:00
ggascoigneandTanner Linsley 5369051b05 Provide option to toggle sort like V6 (#1370)
V7 adds the option to remove a sort option, so it goes from asc -> desc
-> unset, then repeats.  V6 just went from asc -> desc then repeated.

Personally I much preferred this, I think that there's a case to be made
that this is the more expected behavior.

I'm not sure if this is really the best way to fix this since it adds
yet another api option and I completely understand that that is less
than desirable, but I also would rather add an option than have to
duplicate the whole useSortBy hook.
2019-06-20 12:50:36 -06:00
DomenuchandTanner Linsley 58d38b668b changed applyHook to applyPropHooks inside getRowProps mergeProps fn (#1367) 2019-06-20 12:49:04 -06:00
tannerlinsley 9de149cf3c v7.0.0-alpha.5 2019-06-11 11:41:38 -06:00
tannerlinsley 289dca1caf Merge branch 'master' of https://github.com/react-tools/react-table 2019-06-11 11:41:07 -06:00
tannerlinsley f257a3496f v7.0.0-alpha.4 2019-06-11 11:41:03 -06:00
tannerlinsley 312a137f02 Add colspan prop support out of the box, fix useTableState to be immutable, fix sorting and pagination performance, 2019-06-11 11:40:39 -06:00
HellycatandTanner Linsley c6167566da Fix misspelled in propTypes (#1353) 2019-05-31 07:18:26 -06:00
Dmitrii GaidarjiandTanner Linsley 5b0e68aead Fix defaultSortDesc blocking toggle action (#1341)
* Fix defaultSortDesc blocking toggle action

* Revert "Fix defaultSortDesc blocking toggle action"

This reverts commit 15e05cefd820e3f63e80a8e9d31b9431f295b55a.

* Fix defaultSortDesc blocking toggle action
2019-05-31 07:17:58 -06:00
tannerlinsley 2f5ebe460f Move initial column visibility to useTable.
This change allows you to technically use React Table without a layout hook. Under that assumption, you would need to come up with your own styling mechanisms for display.

The useSimpleLayout merely adds a single `width` style to the prop getters for column headers and cells.

The useFlexLayout is much more robust. Personally though, I have moved away from both, and am just using raw `display: table-row/table-cell` styles to let my tables display naturally.
2019-05-16 10:52:16 -06:00
tannerlinsley 2ab4a65dcc Merge 2019-04-29 12:41:02 -06:00
tannerlinsley 94a6ee53f7 Update .gitignore 2019-04-29 12:39:48 -06:00
tannerlinsley ab32721453 Fix: usePagination now supplies both pageIndex and pageSize 2019-04-29 12:39:29 -06:00
Gary MenzelandTanner Linsley 98bee0a4a7 Feature/useSimpleLayout (#1322)
* Install useSimpleLayout and adjust useTable and useRows as required.

* useSimpleLayout integration

* Minor final fix - replace .filter with .forEach

* Used a spread on the path.
2019-04-28 09:53:34 -06:00
George MauerandTanner Linsley 882e5f6fcf Fix sandbox config to proper extension for codesandbox (#1323) 2019-04-28 09:52:16 -06:00
tannerlinsley 8c81a31aa6 Update README.md 2019-04-26 22:28:25 -06:00
tannerlinsley 8e4601fa83 Move row and cell generation to useTable. Add warnings for unprepared rows 2019-04-25 16:33:00 -06:00
tannerlinsley 7c6076908d Merge branch 'master' of https://github.com/react-tools/react-table 2019-04-23 15:47:26 -06:00
tannerlinsley ab3252bc32 Remove unnecessary flex layout inline styles 2019-04-23 15:47:22 -06:00
Jose Manuel Vergara FlorezandTanner Linsley 085957f3c4 Fix Example link on ReadMe (#1308) 2019-04-23 15:26:43 -06:00
Bojan BedracandTanner Linsley fd5d9ddecd Broken 100k rows aggregation (#1283)
* Broken codesandbox example

* Delete file in wrong location
2019-04-23 15:22:36 -06:00
Paul VogelandTanner Linsley 4e3fa751dc TravisCI: Cache yarn files (#1289)
Like it is recommended by https://docs.travis-ci.com/user/caching/#yarn-cache
2019-03-12 11:08:24 -06:00
Paul VogelandTanner Linsley 3453ac5a76 TravisCI: Use node version 10 (#1288)
Since it's the active LTS according to https://nodejs.org/en/about/releases/
2019-03-12 09:00:46 -06:00
Gary MenzelandTanner Linsley a9971e66af Fixes for useExtended in useTable plus small bug (#1279)
* undefined error in GroupBy
row specific hooks and correct pathing for nested rows

* Ensuring correct git user
2019-02-27 08:06:47 -08:00
Tanner LinsleyandGitHub 33f30c7b7f Update README.md 2019-02-18 10:13:41 -07:00
Tanner LinsleyandGitHub 91d758711d Update README.md 2019-02-14 15:06:47 -07:00
Tanner LinsleyandGitHub b2498b0430 Update README.md 2019-02-14 14:51:07 -07:00
Tanner LinsleyandGitHub d599952e89 Update README.md 2019-02-14 14:48:57 -07:00
Tanner Linsley 3ee410bd05 Create _redirects 2019-02-11 13:19:27 -07:00
Tanner Linsley 8b07b2c84e Unzip old react-table examples in archives 2019-02-11 13:14:36 -07:00
Tanner Linsley a0495f6858 Rename hook files 2019-02-11 09:33:34 -07:00
Tanner Linsley 2d31d3bac9 v7.0.0-alpha.2 2019-02-06 16:23:02 -07:00
Tanner Linsley 8d269b95c7 v7.0.0-alpha.1 2019-02-06 16:20:07 -07:00
Tanner Linsley b6bd5b25f5 v7.0.0-alpha.0 2019-02-04 18:56:10 -07:00
Tanner Linsley 4d59f163c0 Merge branch 'master' of https://github.com/react-tools/react-table 2019-02-01 09:36:17 -07:00
Tanner Linsley 1f877a9c4d Update README.md 2019-02-01 09:36:13 -07:00
Tanner LinsleyandGitHub 6c46ea8a07 Update bug_report.md 2019-02-01 09:01:33 -07:00
Tanner LinsleyandGitHub 796a3cbc48 Update questions--support---help.md 2019-02-01 08:56:40 -07:00
Tanner LinsleyandGitHub c0c78d5de7 Update feature_request.md 2019-02-01 08:55:36 -07:00
Tanner Linsley 2a6dfb6ebd Init v7 src 2019-01-31 12:54:56 -07:00
Tanner Linsley a99ecbd567 Update README.md 2019-01-31 12:51:24 -07:00
Tanner Linsley 1ed45d2635 Update README.md 2019-01-31 12:49:14 -07:00
Tanner Linsley 96ab761367 Update README.md 2019-01-31 12:48:12 -07:00
Tanner Linsley d2f1563cd5 Update README.md 2019-01-31 12:46:22 -07:00
Tanner Linsley 73b4869329 Update README.md 2019-01-31 12:33:23 -07:00
Tanner Linsley 3190047284 Update README.md 2019-01-31 12:18:45 -07:00
Tanner Linsley 00efc98779 Fix linting, update Readme 2019-01-31 12:13:34 -07:00
Tanner Linsley 379d9e11d5 v6.9.0 2019-01-31 10:18:22 -07:00
John MaguireandTanner Linsley 3fff682578 apply @twheys PR #1077 as patch and update Array.concat to [].concat (#1241) 2019-01-31 10:15:09 -07:00
Josh McCulloughandTanner Linsley 168a8e3f93 update fireFetchData to use current state for select value (#1231) 2019-01-31 10:09:28 -07:00
Josh McCulloughandTanner Linsley 221164484f cleanup all but one linting issue (#1232) 2019-01-31 10:08:31 -07:00
Andrej GajdosandTanner Linsley c7d2c36454 adding position prop into pagination component (#1205)
- adding isTop prop into pagination component, which allows
differentiate if pagination is on top or bottom of the table
2019-01-31 10:08:06 -07:00
Laurent PandTanner Linsley 26961d0994 [fix] filter data on all available columns not just visible one (#1148) 2019-01-31 10:07:06 -07:00
Devin ClarkandTanner Linsley de6389cafc Adding IDs for select table, fixing backwards compatibility on floating left checkbox (#1208)
* Adding IDs for select all and individual row checkboxes

* Using keyfield const
2019-01-31 10:06:47 -07:00
Rahul VermaandTanner Linsley e0f9d98819 Adds aria-label prop to checkboxes (#1191) 2019-01-31 10:05:15 -07:00
Grzegorz RozdzialikandTanner Linsley 0365057446 Extract pagination elements renderers to pagination props (#1176)
Pagination elements are now customizable without having
to create a new Pagination component, that would
mostly mimic the existing one in terms of functionality.
2019-01-31 10:03:27 -07:00
StevenandTanner Linsley ec25bfbb5a fixed the sanbox code issue (#1174)
* fixed the sabox code issue

* add --copy-files flag to copy ti svg files to lib folder
2019-01-31 10:02:41 -07:00
Evan BrodieandTanner Linsley 0a1c12faca Adds import instructions to the HOC README (#1168)
* Adds import instructions to the HOC README

Also fixes up some language and remove other import instructions. It's better to just have the import instructions in just one place.

* Better visualizes a list of functions
2019-01-31 10:02:12 -07:00
AndyandTanner Linsley 1fddb1b97d Example code fixed with missing return statement (#1154) 2019-01-31 10:01:58 -07:00
Tanner Linsley 1e04377de7 Update README.md 2019-01-28 14:55:32 -07:00
Tanner Linsley 555c4fae9d Update README.md 2019-01-28 14:35:05 -07:00
Tanner Linsley 0d8ca53b76 Update README.md 2019-01-28 14:34:04 -07:00
Tanner Linsley 64db8e09d4 Update .gitignore 2019-01-28 13:47:31 -07:00
Tanner LinsleyandGitHub c5233c4404 Update README.md 2019-01-16 08:56:50 -07:00
Tanner LinsleyandGitHub d0d862f1e8 Add files via upload 2019-01-16 08:55:42 -07:00
Tanner LinsleyandGitHub dd3f30b099 Update bug_report.md 2018-10-04 14:55:20 -06:00
Tanner LinsleyandGitHub d5fc894dd7 Delete ISSUE_TEMPLATE.md 2018-10-04 14:54:16 -06:00
Tanner Linsley dc771ff25f Update issue templates 2018-10-04 14:53:51 -06:00
simjohandTanner Linsley d38021d4b0 Updated ReadMe with some more Props (#1142)
I found the added Props by looking into the defaultProps.js when I could not find a way change the styling of the filter row.
Custom Props
Built-in Components
Every single built-in component's props can be dynamically extended using any one of these prop-callbacks:

<ReactTable
  getProps={fn}
  getTableProps={fn}
  getTheadGroupProps={fn}
  getTheadGroupTrProps={fn}
  getTheadGroupThProps={fn}
  getTheadProps={fn}
  getTheadTrProps={fn}
  getTheadThProps={fn}
  +getTheadFilterProps={fn}
  +getTheadFilterTrProps={fn}
  +getTheadFilterThProps={fn}
2018-10-04 14:51:28 -06:00
Jannik KeyeandTanner Linsley 06648b2577 feature: allow minResizeWidth to be set (#1135)
* feature: allow minResizeWidth to be set

* fix: add minResizeWidth propType
2018-10-04 14:49:11 -06:00
Leonardo MerzaandTanner Linsley 836f256031 added closeExpanded function to subComponent callback (#1121) 2018-10-04 14:48:18 -06:00
Colton ColcleasureandTanner Linsley 188fc51336 Fixed defaultProps.selectType. (#1129)
Changed defaultProps.selectType from "check" to "checkbox".
2018-10-04 14:47:49 -06:00
tragessereandTanner Linsley 474244ce41 Pagination accessibility (#1127)
* Add aria-label attributes to pagination jump and row count selector with a new prop to specify different text.

* Add new text props for labels to README
2018-10-04 14:47:30 -06:00
Jakub ŻurawskiandTanner Linsley b6074a9ab1 Accesibility improvement - add role to tr in treeTable (#1114) 2018-10-04 14:45:40 -06:00
Mohamed NimirandTanner Linsley 3278e1b05e Update README.md (#1086)
Fixed server-side data bad example link to point to https://react-table.js.org/#/story/server-side-data instead of 404 link https://github.com/react-tools/react-table/blob/master/stories/ServerSide.js

Fixes #929
2018-10-04 14:44:15 -06:00
Alec ReserandTanner Linsley 2352cac4b8 Added placeholder to filter input. (#1087)
* Added placeholder to filter input.

* Changed package.json version.
2018-10-04 14:42:59 -06:00
Robin PhamandTanner Linsley d94f59a5fa only update state if page prop changes (#1082) 2018-10-04 14:42:37 -06:00
Jeremy LibermanandTanner Linsley 7876a3876c Resolve "cannot call class as a function" error (#1050)
When rendering a class component using the `class extends React.Component {}` syntax, you would get an error `TypeError: Cannot call a class as a function` because the check to determine whether a component was a class component was insufficient. It seems pointless to even have a check, however, because the JSX syntax can render both class and functional components.
2018-10-04 14:42:16 -06:00
maxime romaandTanner Linsley 02e65b4388 fix linter , update selectTable hoc (#1073)
* fix lint on foldable file add options to choose postion of checkbox
column

* (update hoc): selecttable options parameters position
2018-10-04 14:41:24 -06:00
Shubham KanodiaandTanner Linsley d9d49fa3de Adds "prop-types" as a peerDependency (#1069)
* Adds "prop-types" as a peerDependency

* Removed trailling comma
2018-10-04 14:40:13 -06:00
Kyle HallemanandTanner Linsley 41784cd52d allow rest props from getTfootProps for TfootComponent (#1035) 2018-10-04 14:39:48 -06:00
Mayank JethvaandTanner Linsley 9048835bcc ReactTable HOC: advancedExpandTable (#1000)
* initial commit

* update readme

* update examples and src

* edit readme

* use single instance of advancedExpandTable

* add in hoc codesandbox to docs, run eslint on new source file
2018-10-04 14:39:07 -06:00
Bret IkeharaandTanner Linsley b12fc8fc88 remove space in Logo name (#1033) 2018-10-04 14:38:33 -06:00
Krzysztof KaczmarczykandTanner Linsley 76fde77b0f Add additional column's renderers in TreeTable HOC (#1029)
Pass Expander, PivotValue and Pivot renderers to to column constructor in TreeTable HOC
2018-10-04 14:37:44 -06:00
smoleniuchandTanner Linsley f50b0a47cf SelectTable - Make input component type defaults to checkbox (#1021) 2018-10-04 14:37:19 -06:00
Don PflasterandTanner Linsley ac8b497671 Tree uses accessor or ID and always shows pivot cells (#1011)
* Also check ID field when finding pivot col in treeTableHOC

* Pass the ID if you've got one on treeTableHOC

* An expandable cell should never be hidden
2018-10-04 14:36:46 -06:00
Rebekah Heacock JonesandTanner Linsley c79806090a Fix propTypes validation for getFooterProps (#1007)
This should be a function (like the other getXProps), not an object
2018-10-04 14:36:20 -06:00
Tanner Linsley f55ce62041 Merge branch 'master' of https://github.com/react-tools/react-table 2018-05-29 10:56:34 -06:00
Mario ViensandTanner Linsley 4c9b44ab48 documentation formatting fix (#986) 2018-05-28 01:11:35 -06:00
Tanner Linsley 48869a65e7 Better issue template 2018-05-24 17:00:17 -06:00
emyarodandTanner Linsley 3246336120 Add cross-env package (#873)
* Fix typo

* Edit link to working codesandbox

Fix '100k Rows w/ Pivoting & Sub Components' example

Closes #870

* Add cross-env to remove environment variable errors on Windows
2018-05-24 16:36:37 -06:00
Efim PasianidiandTanner Linsley b12238d535 Add defaultPage prop (#941)
* add defaultPage prop

* fix defaultPage in manual mode
2018-05-24 16:36:19 -06:00
Mark McDonaldandTanner Linsley 1f92ed8d4f Add more documentation for overriding props (#975)
I think this is the most common way of setting columns or expanderDefaults.

I had to find issue #565 and then follow it to issue #394 to see explanations on how to do this.
2018-05-24 16:35:22 -06:00
TerryLeeandTanner Linsley cf59c644b4 Just correct names of parameters for onFilteredChanged (#967) 2018-05-24 16:33:09 -06:00
Steve SharpandTanner Linsley a7e8e26c00 Update README.md (#973)
Fixes typo
2018-05-24 16:32:50 -06:00
StevenandTanner Linsley dd4c1e2df6 add FoldableTable (#937)
I have used this library to develop a big application for my company and had been required to make the columns are foldable. I saw that feature is useful and would like to share with everybody. Especially to all developers who developed this great component.

Let me know if any issues with My component. I will fix it accordingly.
2018-05-24 16:32:34 -06:00
Anthon FredrikssonandTanner Linsley 621c3bf092 Fixed text mismatch when doing SSR (#957)
* fixed a mismatch issue when doing ssr. made some windows-specific changes to ease contributing

* remove accidentally committed file
2018-05-24 16:27:57 -06:00
Bill FienbergandTanner Linsley 72afabbd03 Fix README: defaultSortMethod doesn't match code (#910)
Updating the `defaultSortMethod` in the README to match the [code](https://github.com/react-tools/react-table/blob/3a8a037ee68b11e329c581a8d61a37db276a0dbf/src/defaultProps.js#L46)
2018-05-24 16:25:57 -06:00
Stuart CasarottoandTanner Linsley 4aa07c33da Typo (#899)
arra -> array
2018-05-24 16:25:41 -06:00
Frank NguyenandTanner Linsley d430d51888 Added react-dom as a peer dependency (#889) 2018-05-24 16:25:28 -06:00
AndrewandTanner Linsley 4824b4c8cc Remove header focus outline. Fixes react-tools/react-table#685 (#881) 2018-05-24 16:24:54 -06:00
Richard AandTanner Linsley 60766cf261 Add prefix to key of pad rows (#828)
Add prefix to key of pad rows so it doesn't conflict with keys of page rows.
Duplicate keys are causing rendering issues with preact.
2018-05-24 16:23:53 -06:00
Tanner Linsley fcdc3d88bc v6.8.6 2018-05-24 10:24:29 -06:00
Tanner Linsley 24a9efd670 v6.8.5 2018-05-19 00:47:17 -06:00
Tanner Linsley bdb7d44438 v6.8.4 2018-05-18 17:34:41 -06:00
Tanner Linsley 7a6ed50b81 Make data prop required, but allow it to be anything. 2018-05-18 17:34:03 -06:00
Tanner Linsley 8f062550aa v6.8.3 2018-05-18 17:32:04 -06:00
Ben BermanandTanner Linsley 4e9eec3578 Remove ellipsis from default expander table header (#920) 2018-04-19 18:48:52 -06:00
Tanner Linsley 35b92567b5 v6.8.2 2018-04-17 15:14:45 -06:00
Tanner Linsley a1f5b462d5 Revert mistaken removal of rt-resizable-header-content div 2018-04-17 15:14:05 -06:00
Tanner Linsley 9e479e4d4c v6.8.1 2018-04-17 12:23:59 -06:00
Tanner Linsley 9fe806d8a7 Update Eslint and Code Formatting 2018-04-17 12:22:34 -06:00
Tanner Linsley 083534149c Version Update 2018-04-17 12:15:50 -06:00
Gary MenzelandTanner Linsley 8bd3daafcb Doco updates (#680)
* Merge fork from master (#6)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Fork Update (#7)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Update README.md (#584)

* Update README.md

Missing " on Features list,
Extra comma removed

* Update README.md

Added space for component uniformity.

* Update the devDependencies for the linter (#596)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix ThComponent classnames ordering (#673)

Allow for custom classname to overwrite base styles

* Add column to getResizerProps (#667)

* CHANGELOG update

* Doco updates

fixed a typo - ‘row’ to ‘original’
added minimal dock on ‘minRows’

* Merge from original (#9)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Update README.md (#584)

* Update README.md

Missing " on Features list,
Extra comma removed

* Update README.md

Added space for component uniformity.

* Update the devDependencies for the linter (#596)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix ThComponent classnames ordering (#673)

Allow for custom classname to overwrite base styles

* Add column to getResizerProps (#667)

* CHANGELOG update for 6.7.5 (#679)

* Merge fork from master (#6)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Fork Update (#7)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Update README.md (#584)

* Update README.md

Missing " on Features list,
Extra comma removed

* Update README.md

Added space for component uniformity.

* Update the devDependencies for the linter (#596)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix ThComponent classnames ordering (#673)

Allow for custom classname to overwrite base styles

* Add column to getResizerProps (#667)

* CHANGELOG update
2018-02-08 09:58:58 -07:00
Shaun SweetandTanner Linsley 6649b21abe docs: add select HOC docs to better document how to use the HOC (#733) 2018-02-08 09:58:24 -07:00
Jeremy WoodandTanner Linsley 3a8a037ee6 Implemented basic aria roles following grid pattern. (#758) 2018-02-08 09:57:33 -07:00
Catalin BertaandTanner Linsley 9e0361e511 Move hard coded select width to prop (#761) 2018-02-08 09:56:17 -07:00
Pavel GavlíkandTanner Linsley 0a62d86e5e Fix style prop not being properly used in ReactTablePagination component (#785) 2018-02-08 09:55:38 -07:00
Bertrand MarronandTanner Linsley 3ff988861e Improve build process (#792)
* Use preset-env instead of preset-es2015

Remove preset-stage-2 and use individual required plugins.

* Expose es module build

* Update scripts in package.json

* Use rollup for faster and lighter umd builds

Add non minified version of the build.
2018-02-08 09:55:16 -07:00
Tanner LinsleyandGitHub f4067b86dd Update README.md 2018-02-08 09:52:49 -07:00
Tanner Linsley f70d453caa v6.7.6 2017-12-21 15:15:32 -07:00
Gary MenzelandGitHub 54f3cc791c Focus bug (#686)
* Merge fork from master (#6)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Fork Update (#7)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Update README.md (#584)

* Update README.md

Missing " on Features list,
Extra comma removed

* Update README.md

Added space for component uniformity.

* Update the devDependencies for the linter (#596)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix ThComponent classnames ordering (#673)

Allow for custom classname to overwrite base styles

* Add column to getResizerProps (#667)

* CHANGELOG update

* Header focus bug fix

Fixes #685
2017-12-20 08:27:35 +11:00
Gary MenzelandTanner Linsley 05c56f0da4 CHANGELOG update for 6.7.5 (#679)
* Merge fork from master (#6)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Fork Update (#7)

* Examples Refactor + multiSort flag (#619)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Docs testing cleanup (#645)

* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Update README.md (#584)

* Update README.md

Missing " on Features list,
Extra comma removed

* Update README.md

Added space for component uniformity.

* Update the devDependencies for the linter (#596)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix ThComponent classnames ordering (#673)

Allow for custom classname to overwrite base styles

* Add column to getResizerProps (#667)

* CHANGELOG update
2017-12-12 16:44:17 -07:00
Simon AngellandTanner Linsley ddf877bcac Add column to getResizerProps (#667) 2017-12-12 15:09:23 -08:00
Edward BramantiandTanner Linsley 928ad11a07 Fix ThComponent classnames ordering (#673)
Allow for custom classname to overwrite base styles
2017-12-12 15:05:31 -08:00
Will OlsonandTanner Linsley 0783837786 Update the devDependencies for the linter (#596)
* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors
2017-12-12 14:56:51 -08:00
Amir ShresthaandTanner Linsley cf0f8bb729 Update README.md (#584)
* Update README.md

Missing " on Features list,
Extra comma removed

* Update README.md

Added space for component uniformity.
2017-12-12 14:54:23 -08:00
Gary MenzelandGitHub 1e849df999 Merge branch 'master' into master 2017-11-27 14:08:05 +11:00
Gary MenzelandGitHub 62da8880e6 Docs testing cleanup (#645)
* Examples Refactor + multiSort flag (#619) (#4)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update

* Examples Refactor + multiSort flag (#619) (#5)

* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update
2017-11-27 13:47:58 +11:00
Gary Menzel 656522eb71 Comment out 2017-11-27 12:33:58 +11:00
Gary MenzelandGitHub b0c50509ee Examples Refactor + multiSort flag (#619) (#5)
* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update
2017-11-27 12:32:18 +11:00
Gary MenzelandGitHub 01ca4518fc Examples Refactor + multiSort flag (#619) (#4)
* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update
2017-11-27 09:57:12 +11:00
Gary MenzelandGitHub cdf806b3f6 Merge branch 'master' into master 2017-11-27 09:56:49 +11:00
Gary Menzel 0443644ccd Fixes #643
Still requires some basic sanity test to ensure ReactTable does
not have any fundamental coding errors.
Modified some of the /docs code to help with manual testing.
2017-11-27 09:50:36 +11:00
Gary MenzelandGitHub f74ba3cc16 Examples Refactor + multiSort flag (#619)
* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid

* Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)

* Refactor complete
May need to remove some redundant code

* Text change for the HOC samples

* Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.

* refactor: Fix defaultProps.js linter errors

* refactor: Fix lifecycle.js linter errors

* refactor: Fix pagination.js linter errors

* refactor: Fix propTypes.js linter errors

* refactor: Fix utils.js linter errors

* refactor: Fix methods.js linter errors

* refactor: Fix index.js linter errors

* Fix for linter changes + CHANGELOG update
2017-11-23 15:30:07 +11:00
Gary Menzel 2e8596618a Fix for linter changes + CHANGELOG update 2017-11-23 13:53:00 +11:00
Gary MenzelandGitHub b2db31c9bd Merge pull request #3 from frankolson/linter_dependencies
Linter dependencies
2017-11-23 13:45:41 +11:00
Gary MenzelandGitHub 6a5400b247 Merge branch 'master' into linter_dependencies 2017-11-23 13:45:25 +11:00
Will Olson ed6dd5af4c refactor: Fix index.js linter errors 2017-11-22 10:04:26 -08:00
Will Olson 80aa2ea7f4 refactor: Fix methods.js linter errors 2017-11-22 09:48:13 -08:00
Will Olson b310a2ebc4 refactor: Fix utils.js linter errors 2017-11-22 09:33:10 -08:00
Will Olson bcfa658257 refactor: Fix propTypes.js linter errors 2017-11-22 09:19:36 -08:00
Will Olson ad151b5ff0 refactor: Fix pagination.js linter errors 2017-11-22 09:17:21 -08:00
Will Olson 3f1b0d36ed refactor: Fix lifecycle.js linter errors 2017-11-22 09:13:59 -08:00
Will Olson a6036004af refactor: Fix defaultProps.js linter errors 2017-11-22 09:07:26 -08:00
Will Olson 913d214e94 Merge branch 'master' into linter_dependencies 2017-11-22 08:59:08 -08:00
Gary MenzelandGitHub 2fbd0d49db Merge branch 'master' into master 2017-11-16 09:31:31 +11:00
Gary Menzel fc47d4f258 Introduced a 'multiSort' flag
Defaults to 'true'
A 'false' value will turn multi-sort off.
2017-11-16 03:05:44 +11:00
Gary Menzel 6df336215d Text change for the HOC samples 2017-11-15 20:54:29 +11:00
Gary Menzel feec96359b Refactor complete
May need to remove some redundant code
2017-11-15 20:43:29 +11:00
Gary Menzel 33252adfab Refactor HOCs to /src/hoc
Still have to write the HOCReadme.md (still just a placeholder for now)
2017-11-14 15:38:50 +11:00
Gary MenzelandTanner Linsley 1cf9e49952 Example HOCs for TreeTable and CheckboxTable (#609)
* chore: Update the devDependencies for the linter

* A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.

* Missing dependency - shortid
2017-11-12 15:13:05 -07:00
Gary Menzel b585c4b8db Missing dependency - shortid 2017-11-13 08:09:45 +11:00
Gary Menzel 710891f0c0 A few HOC examples for react-table.
Not really integrated with the whole codesandbox.io approach.
2017-11-12 16:32:29 +11:00
Gary MenzelandGitHub cb0000e588 Merge pull request #2 from frankolson/linter_dependencies
chore: Update the devDependencies for the linter
2017-11-03 22:11:22 +11:00
Gary MenzelandGitHub d0bd56729b Merge pull request #1 from react-tools/master
Update to 6.7.4 from original
2017-11-03 21:47:52 +11:00
Will Olson e4c819039f chore: Update the devDependencies for the linter 2017-11-02 11:54:53 -07:00
Tanner Linsley adc07de817 6.7.4 2017-10-27 14:55:17 -06:00
Tanner Linsley e94e88849a Fix Prop types for columns 2017-10-27 14:55:11 -06:00
Tanner Linsley 2dcfef884f 6.7.3 2017-10-27 14:27:24 -06:00
Tanner Linsley d798584208 Fix the rest of the proptypes 2017-10-27 14:27:20 -06:00
Tanner Linsley 5759885983 6.7.2 2017-10-27 14:23:07 -06:00
Tanner Linsley e59ddc1f8d Fix getPropTypes proptype check 2017-10-27 14:23:03 -06:00
Tanner Linsley 35e8636fd1 6.7.1
Fixes #582
2017-10-27 13:45:06 -06:00
Tanner Linsley bb2f969db9 Fix: eslint-config moved to dev deps 2017-10-27 13:44:38 -06:00
Tanner Linsley cd0222fcd2 6.7.0 2017-10-27 13:02:40 -06:00
Tanner Linsley 93ceffbf26 6.7.0-alpha-0 2017-10-27 13:00:57 -06:00
Tanner Linsley 879a6ac273 Deps, linting, and style upgrades 2017-10-27 13:00:54 -06:00
Tanner Linsley b285288849 Merge branch 'master' of https://github.com/react-tools/react-table 2017-10-27 12:14:50 -06:00
Aaron FreidusandTanner Linsley 05f4aaef2e Update README.md to include npm as option for installing. (#523)
* add npm as option for installing

* Update README.md
2017-10-27 12:12:54 -06:00
Abu ShamsutdinovandTanner Linsley 2b9c546132 Added a comma into an array (#524) 2017-10-27 12:12:02 -06:00
Jon TanseyandTanner Linsley 55ef8a9e7d Fix missing comma in Component Overrides docs (#525) 2017-10-27 12:11:46 -06:00
simon-bondandTanner Linsley 189ee436f9 Supply sort direction to custom sort methods (#476) (#533) 2017-10-27 12:11:34 -06:00
SudhanshuandTanner Linsley 225a74770b Update index.styl (#537) 2017-10-27 12:11:09 -06:00
Will OlsonandTanner Linsley fa425a162a Linter cleanup (#548)
* chore: Add local dependencies needed to run the test suite

* style: Fix eslint errors regarding multilines JSX
2017-10-27 12:10:41 -06:00
Will OlsonandTanner Linsley e42b7bbd7d Add the PropTypes node module (#550)
* feat: Add prop types to the library

* fix: Update typos in src/propTypes.js
2017-10-27 12:08:33 -06:00
Erkam UyanikandTanner Linsley 9efee144a8 Update README.md (#551)
Correct a typo
2017-10-27 12:07:47 -06:00
Mike DeVitaandTanner Linsley 56b721c185 fixes issue #564 - IE not displaying rows (#569) 2017-10-27 12:07:29 -06:00
Dylan MarkowandTanner Linsley e91bb91ea1 Expose page/pageSize to rows/cells (#581) 2017-10-27 12:06:46 -06:00
Tanner Linsley dadfcc121c 6.6.0 2017-09-29 12:06:18 -06:00
Eric BerryandTanner Linsley 8cec156d13 Re-position code sponsor (#504)
We have found that with longer documentation files, the position of the sponsor link is more effective in helping fund the project when it's higher in the readme.
2017-09-21 07:39:24 -06:00
Eric BerryandTanner Linsley 5c531095a9 Update Code Sponsor link position (#480)
When the link is found at the bottom of the README, it is more effective in helping funding this project.
2017-09-07 20:43:48 -06:00
Tanner LinsleyandGitHub 8d4deb3496 Update README.md
Fixes #475
2017-09-01 16:05:33 -06:00
Tanner LinsleyandGitHub 646b701f93 Update package.json
Fixes #464
2017-08-31 17:33:10 -06:00
Colwyn Fritze-MoorandTanner Linsley 3043cbe4b4 readme-updated: Fixed incorrect property names for expanded (was expandedRows) and resized (was resizing). (#432) 2017-08-31 17:30:28 -06:00
Peter BellandTanner Linsley fcb82694bb Fixed documentation: was referencing expandedRows props for ReactTable, but it was renamed to expanded (#440) 2017-08-31 17:29:53 -06:00
SudhanshuandTanner Linsley e8c557d70e Make the css for input and select more specific (#446)
The current css selectors, eg. `.ReactTable input` cause conflicts with `input` elements inside Cells. So changed it to `.ReactTable .-pagination input`.
2017-08-31 17:24:21 -06:00
Conrad PankoffandTanner Linsley ff95c21440 make rt-tfoot flex behaviour the same as rt-thead (#459)
This brings `rt-tfoot` into line with `rt-thead` in terms of flex behaviour.
Without this, it's possible for an `rt-tr` to be taller than its containing
`rt-tfoot` without causing it to expand, which causes the outer `rt-table` to
scroll vertically.
2017-08-31 17:23:44 -06:00
RimšelisandTanner Linsley 2630161222 fixed README's Fully Controlled Component filtered (#456) 2017-08-25 10:53:07 -06:00
Tanner LinsleyandGitHub e67072edae Update README.md 2017-08-23 11:43:51 -06:00
Tanner LinsleyandGitHub fb569ad592 Update README.md 2017-08-23 11:43:19 -06:00
Tanner LinsleyandGitHub b957503612 Update ISSUE_TEMPLATE.md 2017-08-09 16:18:29 -06:00
Tanner LinsleyandGitHub 3d9b7b1186 Update README.md 2017-08-09 16:11:11 -06:00
Jeffrey PriebeandTanner Linsley e3528fef38 Use isResizable value in ThComponent classname (#429)
Also in child div
2017-08-09 12:55:43 -06:00
Tanner Linsley 6b192bd363 More responsiveness on css examples 2017-08-03 19:55:22 -06:00
Tanner Linsley 0725f2159d Move Doc Examples to CodeSandbox.io 2017-08-03 19:53:42 -06:00
Tanner Linsley 5d2deda246 Transfer repo to react-tools 2017-08-02 16:05:17 -06:00
Tanner Linsley 2961eb8a18 Updated Logo 2017-08-02 16:05:17 -06:00
Tanner Linsley d170adb6a7 Create CNAME 2017-08-02 15:57:20 -06:00
Tanner Linsley d8aec06496 6.5.3 2017-08-02 13:39:42 -06:00
Tanner Linsley 8efeef3b8b Fix onClick proxying and eslint 2017-08-02 13:39:34 -06:00
Tanner Linsley 8004e7a85f 6.5.2 2017-08-02 13:25:44 -06:00
Tanner Linsley 84af88916a Fix Typo 2017-08-02 13:16:54 -06:00
Tanner Linsley 9846bf1905 Provide onClick handleOriginal function
Fixes #406
2017-08-02 13:15:16 -06:00
Tanner Linsley bf88dda5dc Revert to page 1 on filter change
Fixes #273
2017-08-02 12:36:49 -06:00
Tanner Linsley 7f5779a833 Some simple event propagation fixes (but not the 100% fix) 2017-08-02 12:10:46 -06:00
Tanner Linsley 8792bd95a0 Move onFetchData for better timing and reliability
Fixes #294
2017-08-02 08:59:54 -06:00
ldsteinandTanner Linsley 098b1fec51 Max width NaN fix (#415)
* Added button to reset table state in Controlled Component story

* Fix maxWidth style when value is NaN

* code formatting
2017-08-01 21:27:40 -06:00
Tanner Linsley 750cfe3ac4 Fix Linting 2017-07-31 10:37:12 -06:00
Tanner Linsley 370f443347 Fix pivot header groups
Fixes #376
2017-07-31 10:29:41 -06:00
Tanner Linsley 67f8c9adf1 Cleanup 2017-07-31 09:36:29 -06:00
Tanner Linsley 867cc25899 Fixed display of inputs and checkboxes
Fixes #398
2017-07-31 09:27:03 -06:00
Caroline ShawandTanner Linsley 639630946c Update README to reflect updates (#400) 2017-07-25 14:01:17 -06:00
qmorelandTanner Linsley 688afd2947 [refs #321]: correct makePathArray function in utils (#326) 2017-07-19 14:43:32 -06:00
Tanner LinsleyandGitHub bbebf02a55 Update README.md 2017-07-17 15:01:04 -06:00
Tanner LinsleyandGitHub f4d3c2d7bb Update README.md 2017-07-17 15:00:31 -06:00
Tanner LinsleyandGitHub f8634e771e Update README.md 2017-07-11 14:32:10 -06:00
emyarodandTanner Linsley ba74ab3ce8 Fix typo (#380) 2017-07-08 10:22:24 -06:00
Tanner Linsley 30ed0c82fc 6.5.1 2017-07-05 17:09:11 -06:00
Tanner Linsley 62f19aecf0 Fix: makeTemplateComponent now supports displayName
Fixes #289
2017-07-05 17:08:08 -06:00
Tanner Linsley 8dc4caff45 Fix: column.getProps().rest props are now applied correctly 2017-07-05 16:58:14 -06:00
Tanner Linsley c2e935d75b Fix: defaultExpanded now works correctly
Fixes #372
2017-07-05 16:58:00 -06:00
Tanner Linsley f9a1cfae1e 6.5.0 2017-07-05 10:31:56 -06:00
Tanner Linsley 5ac2c1779d Feature: column.filterAll + docs 2017-07-05 10:31:50 -06:00
Tanner Linsley 3b2432f535 Formatting with prettier + eslint 2017-07-03 09:48:24 -06:00
Jacob CofmanandTanner Linsley 7aa98887ef fix for issue #240 (#363) 2017-07-03 09:14:45 -06:00
Aaron SchwartzandTanner Linsley d26d82ecfb Fix source code in FixedHeader example (#369) 2017-07-03 09:13:15 -06:00
514 changed files with 180185 additions and 14542 deletions
+16
View File
@@ -0,0 +1,16 @@
{
"presets": [
[
"@babel/preset-env",
{
"modules": false
}
],
"@babel/react"
],
"env": {
"test": {
"presets": ["@babel/preset-env", "@babel/react"]
}
}
}
+3
View File
@@ -0,0 +1,3 @@
{
"extends": ["react-app", "prettier"]
}
-74
View File
@@ -1,74 +0,0 @@
module.exports = {
parserOptions: {
ecmaVersion: 8,
ecmaFeatures: {
experimentalObjectRestSpread: true,
jsx: true,
node: false
},
sourceType: 'module'
},
extends: ['standard'],
plugins: ['react'],
rules: {
// Nozzle
'jsx-quotes': [2, 'prefer-single'],
'comma-dangle': [2, 'always-multiline'],
// // React
'react/jsx-boolean-value': 2,
'react/jsx-curly-spacing': [2, 'never'],
'react/jsx-equals-spacing': [2, 'never'],
// 'react/jsx-indent': 2,
'react/jsx-indent-props': [2, 2],
'react/jsx-no-duplicate-props': 2,
'react/jsx-no-undef': 2,
'react/jsx-tag-spacing': [
2,
{
closingSlash: 'never',
beforeSelfClosing: 'always',
afterOpening: 'never'
}
],
'react/jsx-uses-react': 2,
'react/jsx-uses-vars': 2,
'react/self-closing-comp': 2,
'react/jsx-no-bind': [
2,
{
allowArrowFunctions: true,
allowBind: false,
ignoreRefs: true
}
],
'react/no-did-update-set-state': 2,
'react/no-unknown-property': 2,
'react/react-in-jsx-scope': 2,
'react/jsx-closing-bracket-location': [2, 'tag-aligned'],
'react/jsx-tag-spacing': [2, { beforeSelfClosing: 'always' }],
'react/jsx-wrap-multilines': 2,
'react/self-closing-comp': 2,
'react/jsx-key': 2,
'react/jsx-no-comment-textnodes': 2,
'react/jsx-no-duplicate-props': 2,
'react/jsx-no-target-blank': 2,
'react/jsx-no-undef': 2,
'react/jsx-uses-react': 2,
'react/jsx-uses-vars': 2,
'react/no-danger-with-children': 2,
'react/no-deprecated': 2,
'react/no-direct-mutation-state': 2,
'react/no-find-dom-node': 2,
'react/no-is-mounted': 2,
'react/no-render-return-value': 2,
'react/no-string-refs': 2,
'react/no-unknown-property': 2,
'react/react-in-jsx-scope': 2,
'react/require-render-return': 2
// 'react/jsx-max-props-per-line': [2, { maximum: 1 }]
}
}
+1
View File
@@ -0,0 +1 @@
* text=auto
+5
View File
@@ -0,0 +1,5 @@
# These are supported funding model platforms
github: tannerlinsley
patreon: tannerlinsley
custom: https://youtube.com/tannerlinsley
+46
View File
@@ -0,0 +1,46 @@
---
name: Bug report
about: Create a report to help us improve
---
# Using v6?
v6 is now considered feature complete to its current abilities and limitations. We are not actively working to fix any issues for v6 any more. We will, however, merge any non-breaking pull requests submitted to fix anything in v6.
# Using v7?
Thanks for using the alpha version of React Table v7! We're very excited about it.
**Describe the bug**
A clear and concise description of what the bug is.
**To Reproduce**
Steps to reproduce the behavior:
1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error
**Expected behavior**
A clear and concise description of what you expected to happen.
**Codesandbox!**
Use a new [react-table codesandbox](https://codesandbox.io/s/m5lxzzpz69) to reproduce the issue.
**Screenshots**
If applicable, add screenshots to help explain your problem.
**Desktop (please complete the following information):**
- OS: [e.g. iOS]
- Browser [e.g. chrome, safari]
- Version [e.g. 22]
**Smartphone (please complete the following information):**
- Device: [e.g. iPhone6]
- OS: [e.g. iOS8.1]
- Browser [e.g. stock browser, safari]
- Version [e.g. 22]
**Additional context**
Add any other context about the problem here.
@@ -0,0 +1,9 @@
---
name: Feature request
about: Suggest an idea for this project
---
# STOP
We do not track feature requests through Github. Please use the [Spectrum React Table Forum](https://spectrum.chat/react-table) to talk about new ideas and features.
@@ -0,0 +1,11 @@
---
name: Questions, Support & Help
about: Looking for help? Need a question answered?
---
# STOP
We do not use Github to track general support. Please use our public support forum at https://spectrum.chat/react-table.
NOTE: If a support/help/question issue is opened, it will be closed immediately and be redirected to the forum. Thanks for helping us keep our issues clean and productive!
+6 -2
View File
@@ -1,8 +1,12 @@
node_modules/
lib/
node_modules
lib
dist
es
docs/build
react-table.js
react-table.min.js
react-table.css
*.log
.idea
.DS_Store
.history
+6
View File
@@ -0,0 +1,6 @@
module.exports = {
hooks: {
'pre-commit': 'lint-staged && yarn test:ci',
'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS',
},
}
+4 -1
View File
@@ -1,4 +1,7 @@
language: node_js
node_js:
- "6"
- "10"
cache: yarn
script: npm test
+122 -2
View File
@@ -1,15 +1,135 @@
## 6.4.0
## 6.8.6
#### Fixes & Optimizations
- Since `resolveData` is now capable of materializing data on it's own, the `data` prop is no longer required as a prop-type.
## 6.8.4
#### Fixes & Optimizations
- Only run `resolveData` prop when `data` prop has changed, not any others.
## 6.8.3
#### Fixes & Optimizations
- Allow the `resolveData` prop to alter or materialize new data when the `data` prop changes.
## 6.8.1
#### Fixes & Optimizations
- Updated eslint and code formatting
## 6.7.5
#### Fixes & Optimizations
- Now passes `column` to `getResizerProps` (#667)
- NOTE: `getResizerProps` is now only called if the column is resizable
- Fixes the `className` ordering in defaultProps for ThComponent (#673)
- NOTE: user supplied classNames now come at the end so they can extend the defaults
## 6.7.4
#### Fixes & Optimizations
- Fix Prop types for columns
## 6.7.3
#### Fixes & Optimizations
- Fix the rest of the proptypes
## 6.7.2
#### Fixes & Optimizations
- `getPropTypes` proptype check
## 6.7.1
#### Fixes & Optimizations
- `eslint-config` moved to dev deps
## 6.7.0
## 6.7.0-alpha-0
#### New Features
- Expose page/pageSize to rows/cells
- Supply sort direction to custom sort methods
#### Fixes & Optimizations
- README updates
- Linter cleanup
- Added PropTypes node module
- Deps, linting and style upgrades
## 6.6.0
#### Fixes & Optimizations
- moved repo to react-tools
- Doc examples moved to codesandbox.io
- README updates
- CSS refacting for rt-tfoot to match rt-thead
- CSS more specific for input and select
## 6.5.3
#### Fixes & Optimizations
- `onClick` proxying and eslint
## 6.5.2
#### New Features
- Provide onClick handleOriginal function - #406
#### Fixes & Optimizations
- README updates
- `makePathArray` in utils - #326
- Various fixes: #294, #376, #398, #415,
## 6.5.1
#### Fixes & Optimizations
- `defaultExpanded` now works correctly - #372
- `column.getProps().rest` props are now applied correctly
- `makeTemplateComponent` now supports `displayName` - #289
## 6.5.0
##### New Features
- `column.filterAll` - defaults to `false`, but when set to `true` will provide the entire array of rows to `filterMethod` as opposed to one row at a time. This allows for more fine-grained filtering using any method you can dream up. See the [Custom Filtering example](https://react-table.js.org/#/story/custom-filtering) for more info.
## 6.4.0
##### New Features
- `PadRowComponent` - the content rendered inside of a padding row. Defaults to a react component that renders `&nbsp;`
## 6.3.0
##### New Features
- `defaultSortDesc` - allows you to set the default sorting direction for all columns to descending.
- `column.defaultSortDesc` - allows you to set the default sorting direction for a specific column. Falls back to the global `defaultSortDesc` when not set at all.
## 6.0.0
##### New Features
- New Renderers:
- `Aggregated` - Custom renderer for aggregated cells
- `Pivot` - Custom renderer for Pivoted Cells (utilizes `Expander` and `PivotValue`)
@@ -25,8 +145,8 @@
- Prevent transitions while column resizing for a smoother resize effect.
- Disable text selection while resizing columns.
##### Breaking API Changes
- New Renderers:
- `Cell` - deprecates and replaces `render`
- `Header` - deprecates and replaces `header`
-15
View File
@@ -1,15 +0,0 @@
## Problem Description
include a detailed explanation of the problem here...
## Code Snippet(s) or Codepen (http://codepen.io/tannerlinsley/pen/QpeZBa?editors=0010)
## Steps to Reproduce
1. list the steps
2. to reproduce the issue
## System Information
* **Browser & Browser Version:**
* **Node Version:**
* **OS Version:**
* **NPM Version:**
* **Yarn Version:**
+2172 -843
View File
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
+312 -72
View File
@@ -20,10 +20,11 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [Changing the Page `<title>`](#changing-the-page-title)
- [Installing a Dependency](#installing-a-dependency)
- [Importing a Component](#importing-a-component)
- [Code Splitting](#code-splitting)
- [Adding a Stylesheet](#adding-a-stylesheet)
- [Post-Processing CSS](#post-processing-css)
- [Adding a CSS Preprocessor (Sass, Less etc.)](#adding-a-css-preprocessor-sass-less-etc)
- [Adding Images and Fonts](#adding-images-and-fonts)
- [Adding Images, Fonts, and Files](#adding-images-fonts-and-files)
- [Using the `public` Folder](#using-the-public-folder)
- [Changing the HTML](#changing-the-html)
- [Adding Assets Outside of the Module System](#adding-assets-outside-of-the-module-system)
@@ -41,6 +42,7 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [Node](#node)
- [Ruby on Rails](#ruby-on-rails)
- [Proxying API Requests in Development](#proxying-api-requests-in-development)
- [Configuring the Proxy Manually](#configuring-the-proxy-manually)
- [Using HTTPS in Development](#using-https-in-development)
- [Generating Dynamic `<meta>` Tags on the Server](#generating-dynamic-meta-tags-on-the-server)
- [Pre-Rendering into Static HTML Files](#pre-rendering-into-static-html-files)
@@ -61,6 +63,8 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [Editor Integration](#editor-integration)
- [Developing Components in Isolation](#developing-components-in-isolation)
- [Making a Progressive Web App](#making-a-progressive-web-app)
- [Offline-First Considerations](#offline-first-considerations)
- [Progressive Web App Metadata](#progressive-web-app-metadata)
- [Deployment](#deployment)
- [Static Server](#static-server)
- [Other Solutions](#other-solutions)
@@ -81,6 +85,7 @@ You can find the most recent version of this guide [here](https://github.com/fac
- [`npm test` hangs on macOS Sierra](#npm-test-hangs-on-macos-sierra)
- [`npm run build` silently fails](#npm-run-build-silently-fails)
- [`npm run build` fails on Heroku](#npm-run-build-fails-on-heroku)
- [Moment.js locales are missing](#momentjs-locales-are-missing)
- [Something Missing?](#something-missing)
## Updating to New Releases
@@ -186,6 +191,7 @@ In addition to [ES6](https://github.com/lukehoban/es6features) syntax features,
* [Exponentiation Operator](https://github.com/rwaldron/exponentiation-operator) (ES2016).
* [Async/await](https://github.com/tc39/ecmascript-asyncawait) (ES2017).
* [Object Rest/Spread Properties](https://github.com/sebmarkbage/ecmascript-rest-spread) (stage 3 proposal).
* [Dynamic import()](https://github.com/tc39/proposal-dynamic-import) (stage 3 proposal)
* [Class Fields and Static Properties](https://github.com/tc39/proposal-class-public-fields) (stage 2 proposal).
* [JSX](https://facebook.github.io/react/docs/introducing-jsx.html) and [Flow](https://flowtype.org/) syntax.
@@ -207,56 +213,32 @@ To configure the syntax highlighting in your favorite text editor, head to the [
## Displaying Lint Output in the Editor
>Note: this feature is available with `react-scripts@0.2.0` and higher.
>Note: this feature is available with `react-scripts@0.2.0` and higher.<br>
>It also only works with npm 3 or higher.
Some editors, including Sublime Text, Atom, and Visual Studio Code, provide plugins for ESLint.
They are not required for linting. You should see the linter output right in your terminal as well as the browser console. However, if you prefer the lint results to appear right in your editor, there are some extra steps you can do.
You would need to install an ESLint plugin for your editor first.
You would need to install an ESLint plugin for your editor first. Then, add a file called `.eslintrc` to the project root:
>**A note for Atom `linter-eslint` users**
>If you are using the Atom `linter-eslint` plugin, make sure that **Use global ESLint installation** option is checked:
><img src="http://i.imgur.com/yVNNHJM.png" width="300">
>**For Visual Studio Code users**
>VS Code ESLint plugin automatically detects Create React App's configuration file. So you do not need to create `eslintrc.json` at the root directory, except when you want to add your own rules. In that case, you should include CRA's config by adding this line:
>```js
```js
{
// ...
"extends": "react-app"
}
```
Then add this block to the `package.json` file of your project:
Now your editor should report the linting warnings.
```js
{
// ...
"eslintConfig": {
"extends": "react-app"
}
}
```
Note that even if you edit your `.eslintrc` file further, these changes will **only affect the editor integration**. They wont affect the terminal and in-browser lint output. This is because Create React App intentionally provides a minimal set of rules that find common mistakes.
Finally, you will need to install some packages *globally*:
```sh
npm install -g eslint-config-react-app@0.3.0 eslint@3.8.1 babel-eslint@7.0.0 eslint-plugin-react@6.4.1 eslint-plugin-import@2.0.1 eslint-plugin-jsx-a11y@4.0.0 eslint-plugin-flowtype@2.21.0
```
We recognize that this is suboptimal, but it is currently required due to the way we hide the ESLint dependency. The ESLint team is already [working on a solution to this](https://github.com/eslint/eslint/issues/3458) so this may become unnecessary in a couple of months.
If you want to enforce a coding style for your project, consider using [Prettier](https://github.com/jlongster/prettier) instead of ESLint style rules.
## Debugging in the Editor
**This feature is currently only supported by [Visual Studio Code](https://code.visualstudio.com) editor.**
Visual Studio Code supports live-editing and debugging out of the box with Create React App. This enables you as a developer to write and debug your React code without leaving the editor, and most importantly it enables you to have a continuous development workflow, where context switching is minimal, as you dont have to switch between tools.
Visual Studio Code supports debugging out of the box with Create React App. This enables you as a developer to write and debug your React code without leaving the editor, and most importantly it enables you to have a continuous development workflow, where context switching is minimal, as you dont have to switch between tools.
You would need to have the latest version of [VS Code](https://code.visualstudio.com) and VS Code [Chrome Debugger Extension](https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome) installed.
@@ -348,9 +330,56 @@ Learn more about ES6 modules:
* [Exploring ES6: Modules](http://exploringjs.com/es6/ch_modules.html)
* [Understanding ES6: Modules](https://leanpub.com/understandinges6/read#leanpub-auto-encapsulating-code-with-modules)
## Code Splitting
Instead of downloading the entire app before users can use it, code splitting allows you to split your code into small chunks which you can then load on demand.
This project setup supports code splitting via [dynamic `import()`](http://2ality.com/2017/01/import-operator.html#loading-code-on-demand). Its [proposal](https://github.com/tc39/proposal-dynamic-import) is in stage 3. The `import()` function-like form takes the module name as an argument and returns a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) which always resolves to the namespace object of the module.
Here is an example:
### `moduleA.js`
```js
const moduleA = 'Hello';
export { moduleA };
```
### `App.js`
```js
import React, { Component } from 'react';
class App extends Component {
handleClick = () => {
import('./moduleA')
.then(({ moduleA }) => {
// Use moduleA
})
.catch(err => {
// Handle failure
});
};
render() {
return (
<div>
<button onClick={this.handleClick}>Load</button>
</div>
);
}
}
export default App;
```
This will make `moduleA.js` and all its unique dependencies as a separate chunk that only loads after the user clicks the 'Load' button.
You can also use it with `async` / `await` syntax if you prefer it.
## Adding a Stylesheet
This project setup uses [Webpack](https://webpack.github.io/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**:
This project setup uses [Webpack](https://webpack.js.org/) for handling all assets. Webpack offers a custom way of “extending” the concept of `import` beyond JavaScript. To express that a JavaScript file depends on a CSS file, you need to **import the CSS from the JavaScript file**:
### `Button.css`
@@ -422,15 +451,14 @@ Following this rule often makes CSS preprocessors less useful, as features like
First, lets install the command-line interface for Sass:
```
npm install node-sass --save-dev
npm install node-sass-chokidar --save-dev
```
Then in `package.json`, add the following lines to `scripts`:
```diff
"scripts": {
+ "build-css": "node-sass src/ -o src/",
+ "watch-css": "npm run build-css && node-sass src/ -o src/ --watch --recursive",
+ "build-css": "node-sass-chokidar src/ -o src/",
+ "watch-css": "npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive",
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
@@ -454,8 +482,8 @@ Then we can change `start` and `build` scripts to include the CSS preprocessor c
```diff
"scripts": {
"build-css": "node-sass src/ -o src/",
"watch-css": "npm run build-css && node-sass src/ -o src/ --watch --recursive",
"build-css": "node-sass-chokidar src/ -o src/",
"watch-css": "npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive",
- "start": "react-scripts start",
- "build": "react-scripts build",
+ "start-js": "react-scripts start",
@@ -466,13 +494,27 @@ Then we can change `start` and `build` scripts to include the CSS preprocessor c
}
```
Now running `npm start` and `npm run build` also builds Sass files. Note that `node-sass` seems to have an [issue recognizing newly created files on some systems](https://github.com/sass/node-sass/issues/1891) so you might need to restart the watcher when you create a file until its resolved.
Now running `npm start` and `npm run build` also builds Sass files.
## Adding Images and Fonts
**Why `node-sass-chokidar`?**
`node-sass` has been reported as having the following issues:
- `node-sass --watch` has been reported to have *performance issues* in certain conditions when used in a virtual machine or with docker.
- Infinite styles compiling [#1939](https://github.com/facebookincubator/create-react-app/issues/1939)
- `node-sass` has been reported as having issues with detecting new files in a directory [#1891](https://github.com/sass/node-sass/issues/1891)
`node-sass-chokidar` is used here as it addresses these issues.
## Adding Images, Fonts, and Files
With Webpack, using static assets like images and fonts works similarly to CSS.
You can **`import` an image right in a JavaScript module**. This tells Webpack to include that image in the bundle. Unlike CSS imports, importing an image or a font gives you a string value. This value is the final image path you can reference in your code.
You can **`import` a file right in a JavaScript module**. This tells Webpack to include that file in the bundle. Unlike CSS imports, importing a file gives you a string value. This value is the final path you can reference in your code, e.g. as the `src` attribute of an image or the `href` of a link to a PDF.
To reduce the number of requests to the server, importing images that are less than 10,000 bytes returns a [data URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) instead of a path. This applies to the following file extensions: bmp, gif, jpg, jpeg, and png. SVG files are excluded due to [#1153](https://github.com/facebookincubator/create-react-app/issues/1153).
Here is an example:
@@ -750,6 +792,23 @@ To define permanent environment variables, create a file called `.env` in the ro
REACT_APP_SECRET_CODE=abcdef
```
`.env` files **should be** checked into source control (with the exclusion of `.env*.local`).
What other `.env` files are can be used?
>Note: this feature is available with `react-scripts@1.0.0` and higher.
* `.env` - Default
* `.env.development`, `.env.test`, `.env.production` - Environment-specific settings.
* `.env.local` - Local overrides. This file is loaded for all environments except test.
* `.env.development.local`, `.env.test.local`, `.env.production.local` - Local overrides of environment-specific settings.
File priority, from left to right:
* npm test - `.env.test.local`, `env.test`, `.env.local`, `.env`
* npm run build - `.env.production.local`, `env.production`, `.env.local`, `.env`
* npm start - `.env.development.local`, `env.development`, `.env.local`, `.env`
These variables will act as the defaults if the machine does not explicitly set them.<br>
Please refer to the [dotenv documentation](https://github.com/motdotla/dotenv) for more details.
@@ -821,9 +880,68 @@ Keep in mind that `proxy` only has effect in development (with `npm start`), and
The `proxy` option supports HTTP, HTTPS and WebSocket connections.<br>
If the `proxy` option is **not** flexible enough for you, alternatively you can:
* [Configure the proxy yourself](#configuring-the-proxy-manually)
* Enable CORS on your server ([heres how to do it for Express](http://enable-cors.org/server_expressjs.html)).
* Use [environment variables](#adding-custom-environment-variables) to inject the right server host and port into your app.
### Configuring the Proxy Manually
>Note: this feature is available with `react-scripts@1.0.0` and higher.
If the `proxy` option is **not** flexible enough for you, you can specify an object in the following form (in `package.json`).<br>
You may also specify any configuration value [`http-proxy-middleware`](https://github.com/chimurai/http-proxy-middleware#options) or [`http-proxy`](https://github.com/nodejitsu/node-http-proxy#options) supports.
```js
{
// ...
"proxy": {
"/api": {
"target": "<url>",
"ws": true
// ...
}
}
// ...
}
```
All requests matching this path will be proxies, no exceptions. This includes requests for `text/html`, which the standard `proxy` option does not proxy.
If you need to specify multiple proxies, you may do so by specifying additional entries.
You may also narrow down matches using `*` and/or `**`, to match the path exactly or any subpath.
```js
{
// ...
"proxy": {
// Matches any request starting with /api
"/api": {
"target": "<url_1>",
"ws": true
// ...
},
// Matches any request starting with /foo
"/foo": {
"target": "<url_2>",
"ssl": true,
"pathRewrite": {
"^/foo": "/foo/beta"
}
// ...
},
// Matches /bar/abc.html but not /bar/sub/def.html
"/bar/*.html": {
"target": "<url_3>",
// ...
},
// Matches /bar/abc.html and /bar/sub/def.html
"/baz/**/*.html": {
"target": "<url_4>"
// ...
}
}
// ...
}
```
## Using HTTPS in Development
>Note: this feature is available with `react-scripts@0.4.0` and higher.
@@ -972,7 +1090,7 @@ When you encounter bugs caused by changing components, you will gain a deeper in
If youd like to test components in isolation from the child components they render, we recommend using [`shallow()` rendering API](http://airbnb.io/enzyme/docs/api/shallow.html) from [Enzyme](http://airbnb.io/enzyme/). You can write a smoke test with it too:
```sh
npm install --save-dev enzyme react-addons-test-utils
npm install --save-dev enzyme react-test-renderer
```
```js
@@ -1013,10 +1131,10 @@ Additionally, you might find [jest-enzyme](https://github.com/blainekasten/enzym
expect(wrapper).toContainReact(welcome)
```
To setup jest-enzyme with Create React App, follow the instructions for [initializing your test environment](#initializing-test-environment) to import `jest-enzyme`.
To setup jest-enzyme with Create React App, follow the instructions for [initializing your test environment](#initializing-test-environment) to import `jest-enzyme`. **Note that currently only version 2.x is compatible with Create React App.**
```sh
npm install --save-dev jest-enzyme
npm install --save-dev jest-enzyme@2.x
```
```js
@@ -1201,12 +1319,108 @@ Learn more about React Storybook:
* Screencast: [Getting Started with React Storybook](https://egghead.io/lessons/react-getting-started-with-react-storybook)
* [GitHub Repo](https://github.com/kadirahq/react-storybook)
* [Documentation](https://getstorybook.io/docs)
* [Documentation](https://storybooks.js.org/docs/react-storybook/basics/introduction/)
* [Snapshot Testing](https://github.com/kadirahq/storyshots) with React Storybook
## Making a Progressive Web App
You can turn your React app into a [Progressive Web App](https://developers.google.com/web/progressive-web-apps/) by following the steps in [this repository](https://github.com/jeffposnick/create-react-pwa).
By default, the production build is a fully functional, offline-first
[Progressive Web App](https://developers.google.com/web/progressive-web-apps/).
Progressive Web Apps are faster and more reliable than traditional web pages, and provide an engaging mobile experience:
* All static site assets are cached so that your page loads fast on subsequent visits, regardless of network connectivity (such as 2G or 3G). Updates are downloaded in the background.
* Your app will work regardless of network state, even if offline. This means your users will be able to use your app at 10,000 feet and on the Subway.
* On mobile devices, your app can be added directly to the user's home screen, app icon and all. You can also re-engage users using web **push notifications**. This eliminates the need for the app store.
The [`sw-precache-webpack-plugin`](https://github.com/goldhand/sw-precache-webpack-plugin)
is integrated into production configuration,
and it will take care of generating a service worker file that will automatically
precache all of your local assets and keep them up to date as you deploy updates.
The service worker will use a [cache-first strategy](https://developers.google.com/web/fundamentals/instant-and-offline/offline-cookbook/#cache-falling-back-to-network)
for handling all requests for local assets, including the initial HTML, ensuring
that you web app is reliably fast, even on a slow or unreliable network.
If you would prefer not to enable service workers prior to your initial
production deployment, then remove the call to `serviceWorkerRegistration.register()`
from [`src/index.js`](src/index.js).
If you had previously enabled service workers in your production deployment and
have decided that you would like to disable them for all your existing users,
you can swap out the call to `serviceWorkerRegistration.register()` in
[`src/index.js`](src/index.js) with a call to `serviceWorkerRegistration.unregister()`.
After the user visits a page that has `serviceWorkerRegistration.unregister()`,
the service worker will be uninstalled.
### Offline-First Considerations
1. Service workers [require HTTPS](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers#you_need_https),
although to facilitate local testing, that policy
[does not apply to `localhost`](http://stackoverflow.com/questions/34160509/options-for-testing-service-workers-via-http/34161385#34161385).
If your production web server does not support HTTPS, then the service worker
registration will fail, but the rest of your web app will remain functional.
1. Service workers are [not currently supported](https://jakearchibald.github.io/isserviceworkerready/)
in all web browsers. Service worker registration [won't be attempted](src/service-worker-registration.js)
on browsers that lack support.
1. The service worker is only enabled in the [production environment](#deployment),
e.g. the output of `npm run build`. It's recommended that you do not enable an
offline-first service worker in a development environment, as it can lead to
frustration when previously cached assets are used and do not include the latest
changes you've made locally.
1. If you *need* to test your offline-first service worker locally, build
the application (using `npm run build`) and run a simple http server from your
build directory. After running the build script, `create-react-app` will give
instructions for one way to test your production build locally and the [deployment instructions](#deployment) have
instructions for using other methods. *Be sure to always use an
incognito window to avoid complications with your browser cache.*
1. If possible,configure your production environment to serve the generated
`service-worker.js` [with HTTP caching disabled](http://stackoverflow.com/questions/38843970/service-worker-javascript-update-frequency-every-24-hours).
If that's not possible—[GitHub Pages](#github-pages), for instance, does not
allow you to change the default 10 minute HTTP cache lifetime—then be aware
that if you visit your production site, and then revisit again before
`service-worker.js` has expired from your HTTP cache, you'll continue to get
the previously cached assets from the service worker. If you have an immediate
need to view your updated production deployment, performing a shift-refresh
will temporarily disable the service worker and retrieve all assets from the
network.
1. Users aren't always familiar with offline-first web apps. It can be useful to
[let the user know](https://developers.google.com/web/fundamentals/instant-and-offline/offline-ux#inform_the_user_when_the_app_is_ready_for_offline_consumption)
when the service worker has finished populating your caches (showing a "This web
app works offline!" message) and also let them know when the service worker has
fetched the latest updates that will be available the next time they load the
page (showing a "New content is available; please refresh." message). Showing
this messages is currently left as an exercise to the developer, but as a
starting point, you can make use of the logic included in [`src/service-worker-registration.js`](src/service-worker-registration.js), which
demonstrates which service worker lifecycle events to listen for to detect each
scenario, and which as a default, just logs appropriate messages to the
JavaScript console.
1. By default, the generated service worker file will not intercept or cache any
cross-origin traffic, like HTTP [API requests](#integrating-with-an-api-backend),
images, or embeds loaded from a different domain. If you would like to use a
runtime caching strategy for those requests, you can [`eject`](#npm-run-eject)
and then configure the
[`runtimeCaching`](https://github.com/GoogleChrome/sw-precache#runtimecaching-arrayobject)
option in the `SWPrecacheWebpackPlugin` section of
[`webpack.config.prod.js`](../config/webpack.config.prod.js).
### Progressive Web App Metadata
The default configuration includes a web app manifest located at
[`public/manifest.json`](public/manifest.json), that you can customize with
details specific to your web application.
When a user adds a web app to their homescreen using Chrome or Firefox on
Android, the metadata in [`manifest.json`](public/manifest.json) determines what
icons, names, and branding colors to use when the web app is displayed.
[The Web App Manifest guide](https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/)
provides more context about what each field means, and how your customizations
will affect your users' experience.
## Deployment
@@ -1240,10 +1454,10 @@ const express = require('express');
const path = require('path');
const app = express();
app.use(express.static('./build'));
app.use(express.static(path.join(__dirname, 'build')));
app.get('/', function (req, res) {
res.sendFile(path.join(__dirname, './build', 'index.html'));
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(9000);
@@ -1262,11 +1476,11 @@ If you use routers that use the HTML5 [`pushState` history API](https://develope
This is because when there is a fresh page load for a `/todos/42`, the server looks for the file `build/todos/42` and does not find it. The server needs to be configured to respond to a request to `/todos/42` by serving `index.html`. For example, we can amend our Express example above to serve `index.html` for any unknown paths:
```diff
app.use(express.static('./build'));
app.use(express.static(path.join(__dirname, 'build')));
-app.get('/', function (req, res) {
+app.get('/*', function (req, res) {
res.sendFile(path.join(__dirname, './build', 'index.html'));
res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
```
@@ -1283,6 +1497,15 @@ It will get copied to the `build` folder when you run `npm run build`.
Now requests to `/todos/42` will be handled correctly both in development and in production.
On a production build, and in a browser that supports [service workers](https://developers.google.com/web/fundamentals/getting-started/primers/service-workers),
the service worker will automatically handle all navigation requests, like for
`/todos/42`, by serving the cached copy of your `index.html`. This
service worker navigation routing can be configured or disabled by
[`eject`ing](#npm-run-eject) and then modifying the
[`navigateFallback`](https://github.com/GoogleChrome/sw-precache#navigatefallback-string)
and [`navigateFallbackWhitelist`](https://github.com/GoogleChrome/sw-precache#navigatefallbackwhitelist-arrayregexp)
options of the `SWPreachePlugin` [configuration](../config/webpack.config.prod.js).
### Building for Relative Paths
By default, Create React App produces a build assuming your app is hosted at the server root.<br>
@@ -1478,7 +1701,7 @@ In this case, ensure that the file is there with the proper lettercase and that
See the [Modulus blog post](http://blog.modulus.io/deploying-react-apps-on-modulus) on how to deploy your react app to Modulus.
## Netlify
### Netlify
**To do a manual deploy to Netlifys CDN:**
@@ -1516,17 +1739,17 @@ When you build the project, Create React App will place the `public` folder cont
2. Install `serve` by running `npm install --save serve`.
3. Add this line to `scripts` in `package.json`:
```
"now-start": "serve build/",
"now-start": "serve -s build/",
```
4. Run `now` from your project directory. You will see a **now.sh** URL in your output like this:
```
> Ready! https://your-project-dirname-tpspyhtdtk.now.sh (copied to clipboard)
```
Paste that URL into your browser when the build is complete, and you will see your deployed app.
Details are available in [this article.](https://zeit.co/blog/now-static)
@@ -1537,21 +1760,12 @@ See this [blog post](https://medium.com/@omgwtfmarc/deploying-create-react-app-t
### Surge
Install the Surge CLI if you havent already by running `npm install -g surge`. Run the `surge` command and log in you or create a new account. You just need to specify the *build* folder and your custom domain, and you are done.
Install the Surge CLI if you havent already by running `npm install -g surge`. Run the `surge` command and log in you or create a new account.
When asked about the project path, make sure to specify the `build` folder, for example:
```sh
email: email@domain.com
password: ********
project path: /path/to/project/build
size: 7 files, 1.8 MB
domain: create-react-app.surge.sh
upload: [====================] 100%, eta: 0.0s
propagate on CDN: [====================] 100%
plan: Free
users: email@domain.com
IP Address: X.X.X.X
Success! Project is published and running at create-react-app.surge.sh
```
Note that in order to support routers that use HTML5 `pushState` API, you may want to rename the `index.html` in your build folder to `200.html` before deploying to Surge. This [ensures that every URL falls back to that file](https://surge.sh/help/adding-a-200-page-for-client-side-routing).
@@ -1562,7 +1776,7 @@ You can adjust various development and production settings by setting environmen
Variable | Development | Production | Usage
:--- | :---: | :---: | :---
BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a [browser](https://github.com/sindresorhus/opn#app) to override this behavior, or set it to `none` to disable it completely.
BROWSER | :white_check_mark: | :x: | By default, Create React App will open the default system browser, favoring Chrome on macOS. Specify a [browser](https://github.com/sindresorhus/opn#app) to override this behavior, or set it to `none` to disable it completely. If you need to customize the way the browser is launched, you can specify a node script instead. Any arguments passed to `npm start` will also be passed to this script, and the url where your app is served will be the last argument. Your script's file name must have the `.js` extension.
HOST | :white_check_mark: | :x: | By default, the development web server binds to `localhost`. You may use this variable to specify a different host.
PORT | :white_check_mark: | :x: | By default, the development web server will attempt to listen on port 3000 or prompt you to attempt the next available port. You may use this variable to specify a different port.
HTTPS | :white_check_mark: | :x: | When set to `true`, Create React App will run the development server in `https` mode.
@@ -1578,7 +1792,7 @@ If this doesnt happen, try one of the following workarounds:
* If your project is in a Dropbox folder, try moving it out.
* If the watcher doesnt see a file called `index.js` and youre referencing it by the folder name, you [need to restart the watcher](https://github.com/facebookincubator/create-react-app/issues/1164) due to a Webpack bug.
* Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [Working with editors supporting safe write”](https://webpack.github.io/docs/webpack-dev-server.html#working-with-editors-ides-supporting-safe-write).
* Some editors like Vim and IntelliJ have a “safe write” feature that currently breaks the watcher. You will need to disable it. Follow the instructions in [Adjusting Your Text Editor”](https://webpack.js.org/guides/development/#adjusting-your-text-editor).
* If your project path contains parentheses, try moving the project to a path without them. This is caused by a [Webpack watcher bug](https://github.com/webpack/watchpack/issues/42).
* On Linux and macOS, you might need to [tweak system settings](https://webpack.github.io/docs/troubleshooting.html#not-enough-watchers) to allow more watchers.
* If the project runs inside a virtual machine such as (a Vagrant provisioned) VirtualBox, create an `.env` file in your project directory if it doesnt exist, and add `CHOKIDAR_USEPOLLING=true` to it. This ensures that the next time you run `npm start`, the watcher uses the polling mode, as necessary inside a VM.
@@ -1618,6 +1832,32 @@ It is reported that `npm run build` can fail on machines with no swap space, whi
This may be a problem with case sensitive filenames.
Please refer to [this section](#resolving-heroku-deployment-errors).
### Moment.js locales are missing
If you use a [Moment.js](https://momentjs.com/), you might notice that only the English locale is available by default. This is because the locale files are large, and you probably only need a subset of [all the locales provided by Moment.js](https://momentjs.com/#multiple-locale-support).
To add a specific Moment.js locale to your bundle, you need to import it explicitly.<br>
For example:
```js
import moment from 'moment';
import 'moment/locale/fr';
```
If import multiple locales this way, you can later switch between them by calling `moment.locale()` with the locale name:
```js
import moment from 'moment';
import 'moment/locale/fr';
import 'moment/locale/es';
// ...
moment.locale('fr');
```
This will only work for locales that have been explicitly imported before.
## Something Missing?
If you have ideas for more “How To” recipes that should be on this page, [let us know](https://github.com/facebookincubator/create-react-app/issues) or [contribute some!](https://github.com/facebookincubator/create-react-app/edit/master/packages/react-scripts/template/README.md)
@@ -0,0 +1,23 @@
{
"name": "react-table-100k-rows-aggregation",
"version": "0.0.7",
"description": null,
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1",
"lodash": "4.17.4"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
@@ -0,0 +1,5 @@
{
"infiniteLoopProtection": false,
"hardReloadOnChange": false,
"view": "browser"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}
@@ -0,0 +1,5 @@
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 14px;
}
+85
View File
@@ -0,0 +1,85 @@
import React from "react";
import { render } from "react-dom";
import { makeData, Logo, Tips } from "./Utils";
import _ from "lodash";
// Import React Table
import ReactTable from "react-table";
import "react-table/react-table.css";
class App extends React.Component {
constructor() {
super();
this.state = {
data: makeData(100000)
};
}
render() {
const { data } = this.state;
return (
<div>
<br />
<strong>Note: Having the console open will slow performance</strong>
<br />
<br />
<ReactTable
data={data}
columns={[
{
Header: "Name",
columns: [
{
Header: "First Name",
accessor: "firstName"
},
{
Header: "Last Name",
id: "lastName",
accessor: d => d.lastName
}
]
},
{
Header: "Info",
columns: [
{
Header: "Age",
accessor: "age",
aggregate: vals => _.round(_.mean(vals)),
Aggregated: row => {
return (
<span>
{row.value} (avg)
</span>
);
}
},
{
Header: "Visits",
accessor: "visits",
aggregate: vals => _.sum(vals)
}
]
}
]}
pivotBy={["firstName", "lastName"]}
defaultPageSize={10}
className="-striped -highlight"
SubComponent={row => {
return (
<div style={{ padding: "20px" }}>
<em>Sub Component!</em>
</div>
);
}}
/>
<br />
<Tips />
<Logo />
</div>
);
}
}
render(<App />, document.getElementById("root"));
@@ -0,0 +1,14 @@
{
"name": "react-table-100k-rows-aggregation",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1",
"lodash": "4.17.4"
}
}
+21
View File
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,28 @@
{
"name": "react-table-cell-renderers",
"version": "0.0.12",
"description": null,
"keywords": [
"react",
"react-table",
"datagrid",
"grid",
"table"
],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}
@@ -0,0 +1,5 @@
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 14px;
}
@@ -1,25 +1,25 @@
/* eslint-disable import/no-webpack-loader-syntax */
import React from 'react'
import _ from 'lodash'
import namor from 'namor'
import React from "react";
import { render } from "react-dom";
import { makeData, Logo, Tips } from "./Utils";
import ReactTable from '../../../lib/index'
// Import React Table
import ReactTable from "react-table";
import "react-table/react-table.css";
class Story extends React.PureComponent {
render () {
const data = _.map(_.range(5553), d => {
const statusChance = Math.random()
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
progress: Math.floor(Math.random() * 100),
status: statusChance > 0.66 ? 'relationship'
: statusChance > 0.33 ? 'complicated'
: 'single'
}
})
const columns = [{
class App extends React.Component {
constructor() {
super();
this.state = {
data: makeData()
};
}
render() {
const { data } = this.state;
return (
<div>
<ReactTable
data={data}
columns={[{
Header: 'Name',
columns: [{
Header: 'First Name',
@@ -76,34 +76,16 @@ class Story extends React.PureComponent {
</span>
)
}]
}]
return (
<div>
<div className='table-wrap'>
<ReactTable
className='-striped -highlight'
data={data}
columns={columns}
defaultPageSize={10}
/>
</div>
<div style={{textAlign: 'center'}}>
<br />
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>
}]}
defaultPageSize={10}
className="-striped -highlight"
/>
<br />
<Tips />
<Logo />
</div>
)
);
}
}
// Source Code
const CodeHighlight = require('./components/codeHighlight').default
const source = require('!raw!./CellRenderers')
export default () => (
<div>
<Story />
<CodeHighlight>{() => source}</CodeHighlight>
</div>
)
render(<App />, document.getElementById("root"));
@@ -0,0 +1,19 @@
{
"name": "react-table-cell-renderers",
"version": "1.0.0",
"description": "",
"keywords": [
"react",
"react-table",
"datagrid",
"grid",
"table"
],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
}
}
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,22 @@
{
"name": "react-table-controlled-table",
"version": "0.0.2",
"description": null,
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}
@@ -0,0 +1,5 @@
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 14px;
}
+97
View File
@@ -0,0 +1,97 @@
import React from "react";
import { render } from "react-dom";
import { makeData, Logo, Tips } from "./Utils";
// Import React Table
import ReactTable from "react-table";
import "react-table/react-table.css";
const data = makeData()
const makeDefaultState = () => ({
sorted: [],
page: 0,
pageSize: 10,
expanded: {},
resized: [],
filtered: []
});
class App extends React.Component {
constructor() {
super();
this.state = makeDefaultState();
this.resetState = this.resetState.bind(this);
}
resetState() {
this.setState(makeDefaultState());
}
render() {
return (
<div>
<div>
<button onClick={this.resetState}>Reset State</button>
</div>
<pre>
<code>
<strong>this.state ===</strong>{" "}
{JSON.stringify(this.state, null, 2)}
</code>
</pre>
<ReactTable
data={data}
columns={[
{
Header: "Name",
columns: [
{
Header: "First Name",
accessor: "firstName"
},
{
Header: "Last Name",
id: "lastName",
accessor: d => d.lastName,
width: 170
}
]
},
{
Header: "Info",
columns: [
{
Header: "Age",
accessor: "age"
}
]
}
]}
pivotBy={["lastName"]}
filterable
defaultPageSize={10}
className="-striped -highlight"
// Controlled props
sorted={this.state.sorted}
page={this.state.page}
pageSize={this.state.pageSize}
expanded={this.state.expanded}
resized={this.state.resized}
filtered={this.state.filtered}
// Callbacks
onSortedChange={sorted => this.setState({ sorted })}
onPageChange={page => this.setState({ page })}
onPageSizeChange={(pageSize, page) =>
this.setState({ page, pageSize })}
onExpandedChange={expanded => this.setState({ expanded })}
onResizedChange={resized => this.setState({ resized })}
onFilteredChange={filtered => this.setState({ filtered })}
/>
<br />
<Tips />
<Logo />
</div>
);
}
}
render(<App />, document.getElementById("root"));
@@ -0,0 +1,13 @@
{
"name": "react-table-controlled-table",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
}
}
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,22 @@
{
"name": "react-table-custom-column-widths",
"version": "0.0.2",
"description": null,
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}
@@ -0,0 +1,5 @@
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 14px;
}
+61
View File
@@ -0,0 +1,61 @@
import React from "react";
import { render } from "react-dom";
import { makeData, Logo, Tips } from "./Utils";
// Import React Table
import ReactTable from "react-table";
import "react-table/react-table.css";
class App extends React.Component {
constructor() {
super();
this.state = {
data: makeData()
};
}
render() {
const { data } = this.state;
return (
<div>
<ReactTable
data={data}
columns={[
{
Header: "Name",
columns: [
{
Header: "First Name",
accessor: "firstName",
maxWidth: 200
},
{
Header: "Last Name",
id: "lastName",
accessor: d => d.lastName,
width: 300
}
]
},
{
Header: "Info",
columns: [
{
Header: "Age",
accessor: "age",
minWidth: 400
}
]
}
]}
defaultPageSize={10}
className="-striped -highlight"
/>
<br />
<Tips />
<Logo />
</div>
);
}
}
render(<App />, document.getElementById("root"));
@@ -0,0 +1,13 @@
{
"name": "react-table-custom-column-widths",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
}
}
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,22 @@
{
"name": "react-table-custom-component-props",
"version": "0.0.3",
"description": null,
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}
@@ -0,0 +1,5 @@
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 14px;
}
+87
View File
@@ -0,0 +1,87 @@
import React from "react";
import { render } from "react-dom";
import { makeData, Logo, Tips } from "./Utils";
// Import React Table
import ReactTable from "react-table";
import "react-table/react-table.css";
class App extends React.Component {
constructor() {
super();
this.state = {
data: makeData()
};
}
render() {
const { data } = this.state;
return (
<div>
<br />
<strong>Open your console and hover over some cells!</strong>
<br />
<br />
<ReactTable
data={data}
columns={[
{
Header: "Name",
columns: [
{
Header: "First Name",
accessor: "firstName"
},
{
Header: "Last Name",
id: "lastName",
accessor: d => d.lastName
}
]
},
{
Header: "Info",
columns: [
{
Header: "Age",
accessor: "age"
},
{
Header: "Status",
accessor: "status"
}
]
},
{
Header: "Stats",
columns: [
{
Header: "Visits",
accessor: "visits"
}
]
}
]}
getTdProps={(state, rowInfo, column, instance) => {
return {
onMouseEnter: e =>
console.log("Cell - onMouseEnter", {
state,
rowInfo,
column,
instance,
event: e
})
};
}}
defaultPageSize={10}
className="-striped -highlight"
/>
<br />
<Tips />
<Logo />
</div>
);
}
}
render(<App />, document.getElementById("root"));
@@ -0,0 +1,13 @@
{
"name": "react-table-custom-component-props",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
}
}
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,22 @@
{
"name": "react-table-custom-expander-position",
"version": "0.0.2",
"description": null,
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}
@@ -0,0 +1,5 @@
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 14px;
}
+87
View File
@@ -0,0 +1,87 @@
import React from "react";
import { render } from "react-dom";
import { makeData, Logo, Tips } from "./Utils";
// Import React Table
import ReactTable from "react-table";
import "react-table/react-table.css";
class App extends React.Component {
constructor() {
super();
this.state = {
data: makeData()
};
}
render() {
const { data } = this.state;
return (
<div>
<ReactTable
data={data}
columns={[
{
Header: "Name",
columns: [
{
Header: "First Name",
accessor: "firstName",
Footer: () =>
<div style={{ textAlign: "center" }}>First Name</div>
},
{
Header: "Last Name",
accessor: "lastName",
Footer: () =>
<div style={{ textAlign: "center" }}>Last Name</div>
}
]
},
{
Header: "Info",
columns: [
{
Header: "Age",
accessor: "age",
Footer: () => <div style={{ textAlign: "center" }}>Age</div>
}
]
},
{
Header: "Expand",
columns: [
{
expander: true,
Header: () => <strong>More</strong>,
width: 65,
Expander: ({ isExpanded, ...rest }) =>
<div>
{isExpanded
? <span>&#x2299;</span>
: <span>&#x2295;</span>}
</div>,
style: {
cursor: "pointer",
fontSize: 25,
padding: "0",
textAlign: "center",
userSelect: "none"
},
Footer: () => <span>&hearts;</span>
}
]
}
]}
defaultPageSize={10}
className="-striped -highlight"
SubComponent={() => <div style={{padding: '10px'}}>Hello</div>}
/>
<br />
<Tips />
<Logo />
</div>
);
}
}
render(<App />, document.getElementById("root"));
@@ -0,0 +1,13 @@
{
"name": "react-table-custom-expander-position",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
}
}
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,23 @@
{
"name": "react-table-custom-filtering",
"version": "0.0.7",
"description": null,
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1",
"match-sorter": "1.8.1"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}
@@ -0,0 +1,5 @@
body {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
font-size: 14px;
}
+93
View File
@@ -0,0 +1,93 @@
import React from "react";
import { render } from "react-dom";
import { makeData, Logo, Tips } from "./Utils";
import matchSorter from 'match-sorter'
// Import React Table
import ReactTable from "react-table";
import "react-table/react-table.css";
class App extends React.Component {
constructor() {
super();
this.state = {
data: makeData()
};
}
render() {
const { data } = this.state;
return (
<div>
<ReactTable
data={data}
filterable
defaultFilterMethod={(filter, row) =>
String(row[filter.id]) === filter.value}
columns={[
{
Header: "Name",
columns: [
{
Header: "First Name",
accessor: "firstName",
filterMethod: (filter, row) =>
row[filter.id].startsWith(filter.value) &&
row[filter.id].endsWith(filter.value)
},
{
Header: "Last Name",
id: "lastName",
accessor: d => d.lastName,
filterMethod: (filter, rows) =>
matchSorter(rows, filter.value, { keys: ["lastName"] }),
filterAll: true
}
]
},
{
Header: "Info",
columns: [
{
Header: "Age",
accessor: "age"
},
{
Header: "Over 21",
accessor: "age",
id: "over",
Cell: ({ value }) => (value >= 21 ? "Yes" : "No"),
filterMethod: (filter, row) => {
if (filter.value === "all") {
return true;
}
if (filter.value === "true") {
return row[filter.id] >= 21;
}
return row[filter.id] < 21;
},
Filter: ({ filter, onChange }) =>
<select
onChange={event => onChange(event.target.value)}
style={{ width: "100%" }}
value={filter ? filter.value : "all"}
>
<option value="all">Show All</option>
<option value="true">Can Drink</option>
<option value="false">Can't Drink</option>
</select>
}
]
}
]}
defaultPageSize={10}
className="-striped -highlight"
/>
<br />
<Tips />
<Logo />
</div>
);
}
}
render(<App />, document.getElementById("root"));
@@ -0,0 +1,14 @@
{
"name": "react-table-custom-filtering",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1",
"match-sorter": "1.8.1"
}
}
@@ -0,0 +1,21 @@
# See https://help.github.com/ignore-files/ for more about ignoring files.
# dependencies
/node_modules
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,22 @@
{
"name": "react-table-custom-no-data-text",
"version": "0.0.3",
"description": null,
"keywords": [],
"main": "index.js",
"dependencies": {
"react-table": "6.5.3",
"react-dom": "15.5.3",
"react": "15.5.3",
"namor": "1.0.1"
},
"devDependencies": {
"react-scripts": "1.0.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

@@ -0,0 +1,38 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
@@ -0,0 +1,15 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "192x192",
"type": "image/png"
}
],
"start_url": "./index.html",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
+52
View File
@@ -0,0 +1,52 @@
import React from "react";
import namor from "namor";
import "./index.css";
const range = len => {
const arr = [];
for (let i = 0; i < len; i++) {
arr.push(i);
}
return arr;
};
const newPerson = () => {
const statusChance = Math.random();
return {
firstName: namor.generate({ words: 1, numbers: 0 }),
lastName: namor.generate({ words: 1, numbers: 0 }),
age: Math.floor(Math.random() * 30),
visits: Math.floor(Math.random() * 100),
progress: Math.floor(Math.random() * 100),
status:
statusChance > 0.66
? "relationship"
: statusChance > 0.33 ? "complicated" : "single"
};
};
export function makeData(len = 5553) {
return range(len).map(d => {
return {
...newPerson(),
children: range(10).map(newPerson)
};
});
}
export const Logo = () =>
<div style={{ margin: '1rem auto', display: 'flex', flexWrap: 'wrap', alignItems: 'center', justifyContent: 'center'}}>
For more examples, visit {''}
<br />
<a href="https://github.com/react-tools/react-table" target="_blank">
<img
src="https://github.com/react-tools/media/raw/master/logo-react-table.png"
style={{ width: `150px`, margin: ".5em auto .3em" }}
/>
</a>
</div>;
export const Tips = () =>
<div style={{ textAlign: "center" }}>
<em>Tip: Hold shift when sorting to multi-sort!</em>
</div>;
@@ -0,0 +1,52 @@
// In production, we register a service worker to serve assets from local cache.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on the "N+1" visit to a page, since previously
// cached resources are updated in the background.
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
// This link also includes instructions on opting out of this behavior.
export default function register() {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker
.register(swUrl)
.then(registration => {
// eslint-disable-next-line no-param-reassign
registration.onupdatefound = () => {
const installingWorker = registration.installing;
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the old content will have been purged and
// the fresh content will have been added to the cache.
// It's the perfect time to display a "New content is
// available; please refresh." message in your web app.
console.log('New content is available; please refresh.'); // eslint-disable-line no-console
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.'); // eslint-disable-line no-console
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
});
}
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}

Some files were not shown because too many files have changed in this diff Show More