npmpackage.info

Gathering detailed insights and metrics for @table-library/react-table-library

@table-library/react-table-library

🍱 React Table Library

4.1.7

747

MIT

JavaScript

6.90 kB

1,038,204 2.6

Installations

npm install @table-library/react-table-library

Pull Requests

Open

1

Total

30

Closed

5

Merged

24

Issues

Open

34

Total

72

Closed

38

Releases

v4.1.7

Published on 08 Aug 2023

v4.1.6

Published on 08 Aug 2023

v4.1.5

Published on 08 Aug 2023

v4.1.4

Published on 05 May 2023

v4.1.3

Published on 05 May 2023

v4.1.2

Published on 28 Apr 2023

View all 49 releases

Developer

table-library

Developer Guide

BETA

Module System

ESM

Min. Node Version

Typescript Support

Yes

Node Version

16.20.1

NPM Version

8.19.4 Statistics

747 Stars

551 Commits

47 Forks

8 Watching

17 Branches

8 Contributors

Updated on 22 Nov 2024

Bundle Size

23.87 kB

Minified

6.90 kB

Minified + Gzipped

Bundlephobia

Languages

JavaScript (81.58%)

TypeScript (14.91%)

MDX (3.14%)

HTML (0.21%)

Makefile (0.1%)

Dockerfile (0.04%)

Shell (0.01%)

Total Downloads

Cumulative downloads

Total Downloads

1,038,204

Last day

-8.7%

3,376

Compared to previous day

Last week

-7.3%

18,236

Compared to previous week

Last month

0.1%

81,190

Compared to previous month

Last year

167.9%

654,067

Compared to previous year

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Versions

Build better Tables with React 🍱

React Table Library

React Table Library -- an almost headless table library -- which prioritizes:

opt-in feature richness
built-in themes and custom theming
server-side operations as first-class citizens
small library size
pleasant developer experience
TypeScript support
SSR support

Showreel

Requirements

React Table Library requires the following libraries to be installed:

"react": ">=16.8.0"
"react-dom": ">=16.8.0"
"@emotion/react": ">= 11"

Installation

1npm install @table-library/react-table-library @emotion/react

1yarn add @table-library/react-table-library @emotion/react

Usage

Documentation

1import { CompactTable } from '@table-library/react-table-library/compact';
2
3const nodes = [
4  {
5    id: '0',
6    name: 'Shopping List',
7    deadline: new Date(2020, 1, 15),
8    type: 'TASK',
9    isComplete: true,
10    nodes: 3,
11  },
12];
13
14const COLUMNS = [
15  { label: 'Task', renderCell: (item) => item.name },
16  {
17    label: 'Deadline',
18    renderCell: (item) =>
19      item.deadline.toLocaleDateString('en-US', {
20        year: 'numeric',
21        month: '2-digit',
22        day: '2-digit',
23      }),
24  },
25  { label: 'Type', renderCell: (item) => item.type },
26  {
27    label: 'Complete',
28    renderCell: (item) => item.isComplete.toString(),
29  },
30  { label: 'Tasks', renderCell: (item) => item.nodes },
31];
32
33const Component = () => {
34  const data = { nodes };
35
36  return <CompactTable columns={COLUMNS} data={data} />;
37};

The Problem

You are looking for a suitable table component to solve your problem, but you cannot find any one solution which comes with all your desired features and is still customizable for a pleasant developer experience. I myself ran into this problem after working with many different React table components -- from UI libraries but also from standalone libraries -- and none of them felt right to me. After working on React tables for three different clients over the past year, I decided to create my own solution for my clients. I came to the conclusion that the React ecosystem needs yet another table library -- which does it better.

The Solution

In 2020, Robin Wieruch created React Table Library in collaboration with Big Ladder Software. After working with different table libraries to fit their needs, they decided to create their own solution with the following objectives in mind ...

composition over configuration
customization and extensibility
server-side operations (e.g. search, pagination) as first-class citizens
pleasant developer experience

How is this different from other React Table Libraries?

There are two kinds of table libraries for React: heavyweight and lightweight.

At one end of the spectrum, there are heavyweight table libraries which are often shipped by UI libraries such as MUI X. These tables have all the bells and whistles included, however, they often fail to use modern concepts such as composition over configuration, customization, extensibility, and server-side operations as first-class citizens. When you have to create one giant configuration object for one giant table component, then you know that you are working with a heavyweight table library.

At the other end of the spectrum, there are lightweight table libraries. The most popular one is React Table which is a great library and at the time was the go-to library in the React community. I very much like this library and used it myself, however, when creating complex tables (read: server-side operations, customizations, feature compositions) from scratch, I felt that I was re-inventing the wheel every time, because I did not receive enough support from the library.

With React Table Library I wanted to create something between heavyweight and lightweight. I wanted to give developers enough support for various built-in features to enable them to perform more complex server-side operations, while still giving them all the flexibility to create their own custom table with a composable approach by using components and hooks. I hope you like this library as well and try it out for your next project! It takes less than ten minutes to test the power of React Table Library.

No vulnerabilities found.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

License

Determines if the project has defined a license.

1

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Maintained

Determines if the project is "actively maintained".

0

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

Pinned-Dependencies

Determines if the project has declared and pinned the dependencies of its build process.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Reason

43 existing vulnerabilities detected

Details

Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
Warn: Project is vulnerable to: GHSA-wf5p-g6vw-rhxx
Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw
Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
Warn: Project is vulnerable to: GHSA-gx9m-whjm-85jf
Warn: Project is vulnerable to: GHSA-mmhx-hmjr-r674
Warn: Project is vulnerable to: GHSA-434g-2637-qmqr
Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m
Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw
Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p
Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747
Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc
Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc
Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp
Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97
Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22
Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
Warn: Project is vulnerable to: GHSA-rxrc-rgv4-jpvx
Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm
Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
Warn: Project is vulnerable to: GHSA-w5p7-h5w8-2hfq
Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
Warn: Project is vulnerable to: GHSA-353f-5xf4-qw67
Warn: Project is vulnerable to: GHSA-c24v-8rfc-w8vw
Warn: Project is vulnerable to: GHSA-8jhw-289h-jh2g
Warn: Project is vulnerable to: GHSA-4vvj-4cpr-p986 / GHSA-64vr-g452-qvp3
Warn: Project is vulnerable to: GHSA-9cwx-2883-4wfx
Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6
Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
Warn: Project is vulnerable to: GHSA-776f-qx25-q3cc

Score

2.6

/10

Last Scanned on 2024-11-18

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More

@table-library/react-table-library

Installations

Pull Requests

1

30

5

24

Issues

34

72

38

Releases

Developer

Developer Guide

ESM

Yes

16.20.1

8.19.4

Statistics

Bundle Size

23.87 kB

6.90 kB

Languages

Total Downloads

1,038,204

Daily Downloads

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

Peer Dependencies

Dev Dependencies

Build better Tables with React 🍱

React Table Library

Requirements

Installation

Usage

The Problem

The Solution

How is this different from other React Table Libraries?

10

10

10

1

0

0

0

0

0

0

0

0

0

2.6

/10