{"id":28234593,"url":"https://github.com/zwingz/react-table","last_synced_at":"2026-04-28T23:34:41.016Z","repository":{"id":33153638,"uuid":"152855033","full_name":"zWingz/react-table","owner":"zWingz","description":"react-fixed-table component","archived":false,"fork":false,"pushed_at":"2023-04-29T15:12:14.000Z","size":3248,"stargazers_count":0,"open_issues_count":3,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-18T22:14:00.791Z","etag":null,"topics":["component","fixed-table","react","table"],"latest_commit_sha":null,"homepage":"https://zwing.site/react-table/#/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zWingz.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-10-13T09:13:52.000Z","updated_at":"2019-04-02T10:00:00.000Z","dependencies_parsed_at":"2022-08-07T20:01:21.159Z","dependency_job_id":null,"html_url":"https://github.com/zWingz/react-table","commit_stats":null,"previous_names":[],"tags_count":17,"template":false,"template_full_name":null,"purl":"pkg:github/zWingz/react-table","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zWingz%2Freact-table","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zWingz%2Freact-table/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zWingz%2Freact-table/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zWingz%2Freact-table/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zWingz","download_url":"https://codeload.github.com/zWingz/react-table/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zWingz%2Freact-table/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259533643,"owners_count":22872427,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["component","fixed-table","react","table"],"created_at":"2025-05-18T22:14:02.215Z","updated_at":"2026-04-28T23:34:40.963Z","avatar_url":"https://github.com/zWingz.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Fixed Table\n\n[![CircleCI](https://circleci.com/gh/zWingz/react-table/tree/master.svg?style=svg)](https://circleci.com/gh/zWingz/react-table/tree/master) [![codecov](https://codecov.io/gh/zWingz/react-table/branch/master/graph/badge.svg)](https://codecov.io/gh/zWingz/react-table)\n\n[![Edit n3ml9m0zz4](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/n3ml9m0zz4)\n\n## Document\n\n[Document](http://zwing.site/react-table/#/)\n\n## Install\n\n`$ npm install @zzwing/react-table`\n\n`import { Table, HorizontalScrollBar } from '@zzwing/react-table'`\n\n## Usage\n\n### Table\n\n| Props           | Type                            | Default | Desc                                  |\n| --------------- | ------------------------------- | ------- | ------------------------------------- |\n| dataSource      | Array                           | []      | dataSource                            |\n| colums          | [columnsProps](#columnsprops)[] | []      | columns props                         |\n| rowKey          | string                          | `none`  | row key, unique, eg: `id`/`a.b.c`     |\n| className       | string                          | ''      | table classname                       |\n| style           | object                          | `{}`    | table style                           |\n| multiLine       | boolean                         | false   | if row is multiline, need to set true |\n| offsetTop       | number                          | `0`     | thead fixed-top offset                |\n| scrollBarOffset | number                          | 5       | scrollbar fixed-bottom offset         |\n| onRow           | (record: T) =\u003e TableRowProp     | --      | a function return table row props     |\n\n```typescript\ntype PlainObject = {\n  [key: string]: any\n}\n\ninterface TableProp\u003cT extends PlainObject = PlainObject\u003e {\n  columns?: ColumnProps\u003cT\u003e[]\n  dataSource?: T[]\n  rowKey?: string\n  className?: string\n  style?: React.CSSProperties\n  offsetTop?: number\n  multiLine?: boolean\n  scrollBarOffset?: number\n  onRow?: (record: T) =\u003e TableRowProp\n}\n```\n\n#### ColumnsProps\n\n| Props     | Type                                  | Default  | Desc                                                   |\n| --------- | ------------------------------------- | -------- | ------------------------------------------------------ |\n| title     | any                                   | `none`   | column title                                           |\n| key       | string                                | `none`   | column key, default is `dataIndex`                     |\n| dataIndex | string                                | ''       | data field in each record, support chain eg: `a.b.c.d` |\n| render    | (text, record, index) =\u003e any          | () =\u003e {} | column render function                                 |\n| align     | `left` \u0026#124; `right` \u0026#124; `center` | `center` | text align                                             |\n| className | string                                | ''       | --                                                     |\n| fixed     | `left` \u0026#124; `right` \u0026#124; `right`  | `false`  | fixed flag                                             |\n\n```typescript\ninterface ColumnProps\u003cT\u003e {\n  title?: React.ReactNode\n  key?: React.Key\n  dataIndex?: keyof T | string\n  render?: (text: any, record: T, index: number) =\u003e React.ReactNode\n  align?: 'left' | 'right' | 'center'\n  className?: string\n  fixed?: boolean | ('left' | 'right')\n}\n```\n\n#### BaseTable\n\nlike `Table`, but not fixed `left` and `right\n\n```typescript\nexport interface BaseTableProp\u003cT extends PlainObject = PlainObject\u003e {\n  columns?: ColumnProps\u003cT\u003e[]\n  dataSource?: T[]\n  rowKey?: string\n  maxTop?: number\n  getRef?: React.RefObject\u003cHTMLTableElement\u003e\n  className?: string\n  multiLine?: boolean\n  style?: React.CSSProperties\n  offsetTop?: number\n  onRow?: (record: T) =\u003e TableRowProp\n}\n```\n\n### ScrollBar\n\n| Props        | Type                      | Default | Desc                    |\n| ------------ | ------------------------- | ------- | ----------------------- |\n| className    | string                    | ''      | scrollbar className     |\n| scrollTarget | string \u0026#124; HTMLElement | window  | native scroll container |\n| offsetBottom | number                    | 5       | scrollbar bottom offset |\n\n```typescript\ninterface HorizontalScrollBarProp {\n  className?: string\n  scrollTarget?: string | HTMLElement\n  offsetBottom?: number\n}\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzwingz%2Freact-table","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzwingz%2Freact-table","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzwingz%2Freact-table/lists"}