{"id":50979835,"url":"https://davidguttman.github.io/react-pivot/","last_synced_at":"2026-07-07T11:00:29.687Z","repository":{"id":27952579,"uuid":"31445351","full_name":"davidguttman/react-pivot","owner":"davidguttman","description":"React-Pivot is a data-grid component with pivot-table-like functionality for data display, filtering, and exploration.","archived":false,"fork":false,"pushed_at":"2026-02-28T10:22:15.000Z","size":2108,"stargazers_count":1079,"open_issues_count":30,"forks_count":150,"subscribers_count":36,"default_branch":"master","last_synced_at":"2026-03-20T00:50:44.460Z","etag":null,"topics":["browserify","calculations","data-grid","javascript","react"],"latest_commit_sha":null,"homepage":"http://davidguttman.github.io/react-pivot/","language":"JavaScript","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/davidguttman.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2015-02-28T00:29:35.000Z","updated_at":"2026-02-20T11:22:19.000Z","dependencies_parsed_at":"2025-10-25T03:14:51.014Z","dependency_job_id":"d79abbcc-7013-482f-81bc-117593dbe8ba","html_url":"https://github.com/davidguttman/react-pivot","commit_stats":null,"previous_names":[],"tags_count":48,"template":false,"template_full_name":null,"purl":"pkg:github/davidguttman/react-pivot","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davidguttman%2Freact-pivot","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davidguttman%2Freact-pivot/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davidguttman%2Freact-pivot/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davidguttman%2Freact-pivot/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/davidguttman","download_url":"https://codeload.github.com/davidguttman/react-pivot/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/davidguttman%2Freact-pivot/sbom","scorecard":{"id":326769,"data":{"date":"2025-08-11","repo":{"name":"github.com/davidguttman/react-pivot","commit":"5e67d66717ab9d1fd2d2ef6272f794e238baaf5f"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":2.9,"checks":[{"name":"Maintained","score":4,"reason":"5 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 4","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Code-Review","score":3,"reason":"Found 11/29 approved changesets -- score normalized to 3","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"License","score":0,"reason":"license file not detected","details":["Warn: project does not have a license file"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 14 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":5,"reason":"5 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-r683-j2x4-v87g","Warn: Project is vulnerable to: GHSA-662x-fhqg-9p8v","Warn: Project is vulnerable to: GHSA-394c-5j6w-4xmx","Warn: Project is vulnerable to: GHSA-78cj-fxph-m83p","Warn: Project is vulnerable to: GHSA-fhg7-m89q-25r3"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-18T02:39:00.485Z","repository_id":27952579,"created_at":"2025-08-18T02:39:00.485Z","updated_at":"2025-08-18T02:39:00.485Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":35225029,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-07-07T02:00:07.222Z","response_time":90,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["browserify","calculations","data-grid","javascript","react"],"created_at":"2026-06-19T13:00:56.997Z","updated_at":"2026-07-07T11:00:29.679Z","avatar_url":"https://github.com/davidguttman.png","language":"JavaScript","funding_links":[],"categories":["Libraries"],"sub_categories":[],"readme":"# ReactPivot #\n\nReactPivot is a data-grid component with pivot-table-like functionality for data display, filtering, and exploration. \n\n**Now compatible with React 19+ and modern build tools!**\n\nDemo: [http://davidguttman.github.io/react-pivot/](http://davidguttman.github.io/react-pivot/)\n\n![Demo](http://i.imgur.com/BhPF2Cv.gif)\n\n## Installation \u0026 Usage ##\n\n```bash\nnpm install react-pivot\n```\n\n### Modern ES Modules (Recommended)\n\n```jsx\nimport React from 'react'\nimport { createRoot } from 'react-dom/client'\nimport ReactPivot from 'react-pivot'\n\nconst root = createRoot(document.getElementById('root'))\nroot.render(\n  \u003cReactPivot \n    rows={rows}\n    dimensions={dimensions}\n    reduce={reduce}\n    calculations={calculations}\n    nPaginateRows={25} \n  /\u003e\n)\n```\n\n### CommonJS (Legacy Support)\n\n```js\nconst React = require('react')\nconst { createRoot } = require('react-dom/client')\nconst ReactPivot = require('react-pivot')\n\nconst root = createRoot(document.getElementById('root'))\nroot.render(\n  React.createElement(ReactPivot, {\n    rows: rows,\n    dimensions: dimensions,\n    reduce: reduce,\n    calculations: calculations,\n    nPaginateRows: 25\n  })\n)\n```\n\n### UMD (Browser Global)\n\n```html\n\u003cscript src=\"https://unpkg.com/react-pivot/dist/react-pivot.umd.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  const root = ReactDOM.createRoot(document.getElementById('root'))\n  root.render(\n    React.createElement(ReactPivot, {\n      rows: rows,\n      dimensions: dimensions,\n      calculations: calculations,\n      reduce: reduce\n    })\n  )\n\u003c/script\u003e\n## Example ##\n\n```jsx\nimport React from 'react'\nimport { createRoot } from 'react-dom/client'\nimport ReactPivot from 'react-pivot'\n\nconst root = createRoot(document.getElementById('root'))\nroot.render(\n  \u003cReactPivot \n    rows={rows}\n    dimensions={dimensions}\n    reduce={reduce}\n    calculations={calculations} \n  /\u003e\n)\n```\n\n`ReactPivot` requires four arguments: `rows`, `dimensions`, `reduce` and `calculations`\n\n`rows` is your data, just an array of objects:\n```js\nvar rows = [\n  {\"firstName\":\"Francisco\",\"lastName\":\"Brekke\",\"state\":\"NY\",\"transaction\":{\"amount\":\"399.73\",\"date\":\"2012-02-02T08:00:00.000Z\",\"business\":\"Kozey-Moore\",\"name\":\"Checking Account 2297\",\"type\":\"deposit\",\"account\":\"82741327\"}},\n  {\"firstName\":\"Francisco\",\"lastName\":\"Brekke\",\"state\":\"NY\",\"transaction\":{\"amount\":\"768.84\",\"date\":\"2012-02-02T08:00:00.000Z\",\"business\":\"Herman-Langworth\",\"name\":\"Money Market Account 9344\",\"type\":\"deposit\",\"account\":\"95753704\"}}\n]\n```\n\n`dimensions` is how you want to group your data. Maybe you want to get the total $$ by `firstName` and have the column title be `First Name`:\n\n```js\nvar dimensions = [\n  {value: 'firstName', title: 'First Name'}\n]\n```\n\n`reduce` is how you calculate numbers for each group:\n\n```js\nvar reduce = function(row, memo) {\n  memo.amountTotal = (memo.amountTotal || 0) + parseFloat(row.transaction.amount)\n  return memo\n}\n```\n\n`calculations` is how you want to display the calculations done in `reduce`:\n\n```js\nvar calculations = [\n  {\n    title: 'Amount', value: 'amountTotal',\n    template: function(val, row) {\n      return '$' + val.toFixed(2)\n    },\n    sortBy: function(row) {\n      return isNaN(row.amountTotal) ? 0 : row.amountTotal\n    }\n  }\n]\n```\n\nPlug them in and you're good to go!\n\n```js\n\n// Optional: set a default grouping with \"activeDimensions\"\nReact.render(\n  \u003cReactPivot rows={rows}\n              dimensions={dimensions}\n              reduce={reduce}\n              calculations={calculations}\n              activeDimensions={['First Name']} /\u003e,\n  document.body\n)\n```\n\nSee it all together in [example/basic.jsx](https://github.com/davidguttman/react-pivot/blob/master/example/basic.jsx)\n\n### Solo Filters ###\n\nReactPivot supports \"solo\" filtering, which allows users to click on values in the table to filter the data to only show rows matching that value. When solo filters are active, you can optionally display a \"Clear Filters\" button to remove all filters at once.\n\n```jsx\n\u003cReactPivot \n  rows={rows}\n  dimensions={dimensions}\n  reduce={reduce}\n  calculations={calculations}\n  showClearFilters={true}\n  clearFiltersText=\"Reset Filters\"\n/\u003e\n```\n\nThe `clearFiltersText` prop is optional and defaults to `\"Clear Filters\"`. When `showClearFilters` is set to `true`, a Clear button appears in the same toolbar row as the solo filter dropdown and Pause Filters whenever filters are active, allowing users to clear all filters with a single click.\n\n### Optional Arguments ###\nparameter | type | description | default\n--------- | ---- | ----------- | -------\ncompact | boolean | compact rows | false\ncsvDownloadFileName | string | assign name of document created when user clicks to 'Export CSV' | 'table.csv'\ncsvTemplateFormat | boolean | apply template formatting to data before csv export | false\ndefaultStyles | boolean | apply default styles from style.css | true\nhiddenColumns | array | columns that should not display | []\nnPaginateRows | number | items per page setting | 25\nsolo | object | active solo filters by dimension | {}\nsortBy | string | name of column to use for record sort | null\nsortDir | string | sort direction, either 'asc' or 'desc' | 'asc'\ntableClassName | string | assign css class to table containing react-pivot elements | ''\nhideDimensionFilter | boolean | do not render the dimension filter | false\nhideRows | function | if provided, rows that are passed to the function will not render unless the return value is true | null\nshowClearFilters | boolean | display Clear Filters button when solo filters are active | false\nclearFiltersText | string | customizable text for the clear filters button | 'Clear Filters'\n\n### TODO ###\n\n* Better Pagination\n* Responsive Table\n\n## License ##\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/davidguttman.github.io%2Freact-pivot%2F","html_url":"https://awesome.ecosyste.ms/projects/davidguttman.github.io%2Freact-pivot%2F","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/davidguttman.github.io%2Freact-pivot%2F/lists"}