{"id":13468288,"url":"https://github.com/coston/react-super-responsive-table","last_synced_at":"2025-05-15T15:05:36.457Z","repository":{"id":37046703,"uuid":"72468493","full_name":"coston/react-super-responsive-table","owner":"coston","description":"Turn the tables on unresponsive data!","archived":false,"fork":false,"pushed_at":"2025-03-17T13:27:46.000Z","size":11276,"stargazers_count":440,"open_issues_count":0,"forks_count":50,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-04-11T05:11:41.913Z","etag":null,"topics":["data-visualization","react","responsive-design","tables"],"latest_commit_sha":null,"homepage":"https://react-super-responsive-table.coston.io","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/coston.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-10-31T18:58:05.000Z","updated_at":"2025-03-20T02:27:41.000Z","dependencies_parsed_at":"2023-02-12T14:33:04.541Z","dependency_job_id":"232ad27d-4bd5-4af5-82a8-b9e2d084b2df","html_url":"https://github.com/coston/react-super-responsive-table","commit_stats":{"total_commits":588,"total_committers":25,"mean_commits":23.52,"dds":0.7244897959183674,"last_synced_commit":"5625c23e3ded05b6b7e6bfbb6b8896a50f149561"},"previous_names":[],"tags_count":45,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coston%2Freact-super-responsive-table","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coston%2Freact-super-responsive-table/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coston%2Freact-super-responsive-table/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coston%2Freact-super-responsive-table/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/coston","download_url":"https://codeload.github.com/coston/react-super-responsive-table/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248345267,"owners_count":21088244,"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":["data-visualization","react","responsive-design","tables"],"created_at":"2024-07-31T15:01:08.241Z","updated_at":"2025-04-11T05:11:48.146Z","avatar_url":"https://github.com/coston.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"# ⌗ react-super-responsive-table\n\n![GitHub last commit](https://img.shields.io/github/last-commit/Coston/react-super-responsive-table)\n[![NPM Downloads](https://img.shields.io/npm/dm/react-super-responsive-table?style=flat-square\u0026logo=npm)\n](https://www.npmjs.com/package/react-super-responsive-table)\n[![GitHub Repo stars](https://img.shields.io/github/stars/coston/react-super-responsive-table)\n](https://github.com/coston/react-super-responsive-table)\n\nreact-super-responsive-table converts your table data to a user-friendly list in mobile view.\n\n- [Demo](#demo)\n- [Installation](#installation)\n- [Usage](#usage)\n- [Using Dynamic Headers](#using-dynamic-headers)\n- [Contributors](#Contributors)\n- [Contributing](#contributing)\n- [License](#license)\n\n## Demo\n\n![Demo Gif md-only](https://user-images.githubusercontent.com/7424180/55982530-baab9900-5c5e-11e9-97c0-0336c5889504.gif)\n\nView the live code demo at [https://react-super-responsive-table.coston.io](https://react-super-responsive-table.coston.io).\n\n## Installation\n\n```\nnpm install react-super-responsive-table --save\n```\n\n## Usage\n\n1. `import { Table, Thead, Tbody, Tr, Th, Td } from 'react-super-responsive-table'`\n2. Copy or import `react-super-responsive-table/dist/SuperResponsiveTableStyle.css` into your project. Customize breakpoint in the css as needed.\n3. Write your html table with the imported components.\n4. Resize your browser window width to pivot this super responsive table!\n\n```jsx\n\u003cTable\u003e\n  \u003cThead\u003e\n    \u003cTr\u003e\n      \u003cTh\u003eEvent\u003c/Th\u003e\n      \u003cTh\u003eDate\u003c/Th\u003e\n      \u003cTh\u003eLocation\u003c/Th\u003e\n      \u003cTh\u003eOrganizer\u003c/Th\u003e\n      \u003cTh\u003eTheme\u003c/Th\u003e\n      \u003cTh\u003eAgent\u003c/Th\u003e\n    \u003c/Tr\u003e\n  \u003c/Thead\u003e\n  \u003cTbody\u003e\n    \u003cTr\u003e\n      \u003cTd\u003eTablescon\u003c/Td\u003e\n      \u003cTd\u003e9 April 2019\u003c/Td\u003e\n      \u003cTd\u003eEast Annex\u003c/Td\u003e\n      \u003cTd\u003eSuper Friends\u003c/Td\u003e\n      \u003cTd\u003eData Tables\u003c/Td\u003e\n      \u003cTd\u003eCoston Perkins\u003c/Td\u003e\n    \u003c/Tr\u003e\n    \u003cTr\u003e\n      \u003cTd\u003eCapstone Data\u003c/Td\u003e\n      \u003cTd\u003e19 May 2019\u003c/Td\u003e\n      \u003cTd\u003e205 Gorgas\u003c/Td\u003e\n      \u003cTd\u003eData Underground\u003c/Td\u003e\n      \u003cTd\u003eData Scence\u003c/Td\u003e\n      \u003cTd\u003eJason Phillips\u003c/Td\u003e\n    \u003c/Tr\u003e\n    \u003cTr\u003e\n      \u003cTd\u003eTuscaloosa D3\u003c/Td\u003e\n      \u003cTd\u003e29 June 2019\u003c/Td\u003e\n      \u003cTd\u003eGithub\u003c/Td\u003e\n      \u003cTd\u003eThe Contributors Consortium\u003c/Td\u003e\n      \u003cTd\u003eData Viz\u003c/Td\u003e\n      \u003cTd\u003eCoston Perkins\u003c/Td\u003e\n    \u003c/Tr\u003e\n  \u003c/Tbody\u003e\n\u003c/Table\u003e\n```\n\n## Using Dynamic Headers\n\nHeaders are statefully stored on first render of the table, since the library doesn't use props for them and just checks the children of the thead to build its internal list of headers upon construction. To use dynamic headers, use a key prop to ensure the components are all internally updated when you're making this kind of change.\n\n```jsx\n\u003cTable key={i}\u003e\n  \u003cThead\u003e\n    \u003cTr\u003e\n      \u003cTh\u003e{headers[0]}\u003c/Th\u003e\n      \u003cTh\u003e{headers[1]}\u003c/Th\u003e\n    \u003c/Tr\u003e\n  \u003c/Thead\u003e\n  \u003cTbody\u003e\n    \u003cTr\u003e\n      \u003cTd\u003eitem 1\u003c/Td\u003e\n      \u003cTd\u003eitem 2\u003c/Td\u003e\n    \u003c/Tr\u003e\n  \u003c/Tbody\u003e\n\u003c/Table\u003e\n```\n\n## Contributors\n\nSuper Responsive Tables are made possible by these great community members:\n\n- [coston](https://github.com/coston)\n- [jasonphillips](https://github.com/jasonphillips)\n- [jorrit](https://github.com/jorrit)\n- [Droow](https://github.com/droow)\n- [NShahri](https://github.com/NShahri)\n- [PicchiKevin](https://github.com/PicchiKevin)\n- [alexandra-c](https://github.com/alexandra-c)\n- [dragos-rosca](https://github.com/dragos-rosca)\n- [galacemiguel](https://github.com/galacemiguel)\n- [themichailov](https://github.com/themichailov)\n- [luizeboli](https://github.com/luizeboli)\n- [thiagotakehana](https://github.com/thiagotakehana)\n- [wedvich](https://github.com/wedvich)\n- [wafuwafu13](https://github.com/wafuwafu13)\n\n## Contributing\n\nPlease help turn the tables on unresponsive data! Submit an issue and/or make a pull request. Check the [projects board](https://github.com/coston/react-super-responsive-table/projects) for tasks to do.\n\n## License\n\nLicensed under the MIT license.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoston%2Freact-super-responsive-table","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcoston%2Freact-super-responsive-table","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoston%2Freact-super-responsive-table/lists"}