# @patternfly/react-table

> This library provides a set of React table components for use with the PatternFly 4

Latest version **6.6.1** (published 2026-08-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install @patternfly/react-table
pnpm add @patternfly/react-table
yarn add @patternfly/react-table
bun add @patternfly/react-table
```

## Health

**Score 65/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 6.6.1 |
| Published | 2026-08-03 |
| First published | 2018-11-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 6 |
| Unpacked size | 2.7 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 862 |
| Author | Red Hat |
| Maintainers | dgutride, dlabrecq, patternfly-build, jeff-phillips-18, mturley, bennyp, mwcz, kylebuch8, evwilkin, schulj12, nicolethoen, heymp, zhawkins, dlabaj, ausuliv, kmcfaul |
| Keywords | react, patternfly, table |

## Links

- npm: https://www.npmjs.com/package/@patternfly/react-table
- Repository: https://github.com/patternfly/patternfly-react
- Homepage: https://github.com/patternfly/patternfly-react/tree/main/packages/react-table#readme
- Issues: https://github.com/patternfly/patternfly-react/issues
- npm.io page: https://npm.io/package/@patternfly/react-table

## Dependencies (6)

- [tslib](https://npm.io/package/tslib.md) ^2.8.1
- [lodash](https://npm.io/package/lodash.md) ^4.18.1
- [@patternfly/react-core](https://npm.io/package/@patternfly/react-core.md) ^6.6.1
- [@patternfly/react-icons](https://npm.io/package/@patternfly/react-icons.md) ^6.6.1
- [@patternfly/react-styles](https://npm.io/package/@patternfly/react-styles.md) ^6.6.1
- [@patternfly/react-tokens](https://npm.io/package/@patternfly/react-tokens.md) ^6.6.1

## Alternatives

- [@lexical/table](https://npm.io/package/@lexical/table.md) — 3.0M weekly downloads
- [mantine-datatable](https://npm.io/package/mantine-datatable.md) — 98.2K weekly downloads
- [react-native-collapsible-tab-view](https://npm.io/package/react-native-collapsible-tab-view.md) — 70.6K weekly downloads
- [@handsontable/vue3](https://npm.io/package/@handsontable/vue3.md) — 16.1K weekly downloads
- [vuewordcloud](https://npm.io/package/vuewordcloud.md) — 7.2K weekly downloads

## Recent versions

- 6.6.1 (latest) — 2026-08-03
- 6.6.1-prerelease.13 (prerelease) — 2026-09-16
- 6.5.1 (prerelease-patch) — 2026-05-21
- 5.4.16 (prerelease-v5) — 2025-02-24
- 6.0.0-alpha.107 (alpha) — 2024-08-30
- 5.2.4 (prerelease-bugfix) — 2024-03-18
- 4.113.7 (prerelease-v4) — 2023-11-15
- 2.28.51 (v3) — 2020-09-15
- 6.6.1-prerelease.12 — 2026-09-15
- 6.6.1-prerelease.11 — 2026-09-11
- 6.6.1-prerelease.10 — 2026-09-11
- 6.6.1-prerelease.9 — 2026-09-09
- 6.6.1-prerelease.8 — 2026-09-03
- 6.6.1-prerelease.7 — 2026-08-31
- 6.6.2 — 2026-08-26
- … 2489 more at https://npm.io/package/@patternfly/react-table/versions

## README

# @patternfly/react-table

This package provides Table PatternFly components based on [PatternFly][patternfly]

### Installing

```sh
yarn add @patternfly/react-table
```

or

```sh
npm install @patternfly/react-table --save
```

## Usage

It's strongly advised to use the PatternFly base CSS in your whole project, or some components may diverge in appearance:

```js
import '@patternfly/react-core/dist/styles/base.css';
```

#### Example component usage

```ts
import { Table, Thead, Tr, Th, Td, Tbody } from '@patternfly/react-table';

export const ComposableTableBasic = () => {
  const repositories = [
    { name: 'one', branches: 'two', prs: 'three' },
    { name: 'one - 2', branches: null, prs: null },
    { name: 'one - 3', branches: 'two - 3', prs: 'three - 3' }
  ];

  const columnNames = {
    name: 'Repositories',
    branches: 'Branches',
    prs: 'Pull requests'
  };
  
  return (
    <Table>
      <Thead>
        <Tr>
          <Th>{columnNames.name}</Th>
          <Th>{columnNames.branches}</Th>
          <Th>{columnNames.prs}</Th>
        </Tr>
      </Thead>
      <Tbody>
        {repositories.map(repo => (
          <Tr key={repo.name}>
            <Td dataLabel={columnNames.name}>{repo.name}</Td>
            <Td dataLabel={columnNames.branches}>{repo.branches}</Td>
            <Td dataLabel={columnNames.prs}>{repo.prs}</Td>
          </Tr>
        ))}
      </Tbody>
    </Table>
  );
}
export default SimpleTable;
```

## Contribution

This library makes use of the babel plugin from [@patternfly/react-styles](../react-styles/README.md) to enable providing the CSS alongside the components. This removes the need for consumers to use (style|css|sass)-loaders. For an example of using CSS from core you can reference [Button.js](./src/components/Button/Button.js). For any CSS not provided by core please use the `StyleSheet.create` utility from [@patternfly/react-styles](../react-styles/README.md). This will prevent collisions with any consumers, and allow the CSS to be bundled with the component.

### Documentation

A comprehensive list of components and detailed usage of each can be found on the [PatternFly react docs][docs] website
You can also find how each component is meant to be used from a design perspective on the [PatternFly core][patternfly] website.

Note: All commands below assume you are on the root directory in this repository.

### Install & run locally

Run to install all the dependencies, build and run the site locally.

```sh
yarn install && yarn start
```

### Testing

Testing is done at the root of this repo. To only run the @patternfly/react-table tests:

```
yarn test packages/react-table
```

[patternfly]: https://github.com/patternfly/patternfly
[docs]: https://react-staging.patternfly.org/

---
_Source: https://npm.io/package/@patternfly/react-table · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._