{"id":50765688,"url":"https://github.com/svar-widgets/vue-grid","last_synced_at":"2026-06-11T13:31:54.652Z","repository":{"id":362313198,"uuid":"1213342299","full_name":"svar-widgets/vue-grid","owner":"svar-widgets","description":"Feature-rich Vue data grid component with sorting, filtering, in-cell editing, and virtualization ","archived":false,"fork":false,"pushed_at":"2026-06-03T14:21:36.000Z","size":154,"stargazers_count":11,"open_issues_count":0,"forks_count":1,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-06-03T16:11:57.496Z","etag":null,"topics":["data-grid","data-table","datagrid","datagrid-component","vue","vue-data-grid","vue-data-table","vue-datagrid","vue-datatable","vue-grid","vue-gridview","vue3","vuejs","vuejs3"],"latest_commit_sha":null,"homepage":"https://svar.dev/vue/datagrid/","language":"Vue","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/svar-widgets.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"license.txt","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":"2026-04-17T09:26:09.000Z","updated_at":"2026-06-03T14:34:04.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/svar-widgets/vue-grid","commit_stats":null,"previous_names":["svar-widgets/vue-grid"],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/svar-widgets/vue-grid","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Fvue-grid","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Fvue-grid/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Fvue-grid/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Fvue-grid/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/svar-widgets","download_url":"https://codeload.github.com/svar-widgets/vue-grid/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Fvue-grid/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34201840,"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-06-11T02:00:06.485Z","response_time":57,"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":["data-grid","data-table","datagrid","datagrid-component","vue","vue-data-grid","vue-data-table","vue-datagrid","vue-datatable","vue-grid","vue-gridview","vue3","vuejs","vuejs3"],"created_at":"2026-06-11T13:31:53.708Z","updated_at":"2026-06-11T13:31:54.645Z","avatar_url":"https://github.com/svar-widgets.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\n# SVAR Vue DataGrid | Vue Data Table\n\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[Homepage](https://svar.dev/vue/datagrid/) • [Getting Started](https://docs.svar.dev/vue/grid/getting_started/) • [Demos](https://docs.svar.dev/vue/grid/samples/#/base/willow)\n\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[![npm](https://img.shields.io/npm/v/@svar-ui/vue-grid.svg)](https://www.npmjs.com/package/@svar-ui/vue-grid)\n[![License](https://img.shields.io/github/license/svar-widgets/vue-grid)](https://github.com/svar-widgets/vue-grid/blob/main/license.txt)\n[![npm downloads](https://img.shields.io/npm/dm/@svar-ui/vue-grid.svg)](https://www.npmjs.com/package/@svar-ui/vue-grid)\n[![Last Commit](https://img.shields.io/github/last-commit/svar-widgets/vue-grid)](https://github.com/svar-widgets/vue-grid)\n\n\u003c/div\u003e\n\n[SVAR Vue DataGrid](https://svar.dev/vue/datagrid/) is a high-performance Vue data grid component for building feature-rich, accessible data tables. It supports sorting, advanced filtering, paging, in-cell editing, and virtual scrolling out of the box. Comes with full TypeScript support and a flexible, developer-friendly API. \n\nThe data grid is fully compatible with Vue 3 and suitable for dashboards, admin panels, and data-heavy SaaS applications.\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://cdn.svar.dev/public/react-grid.png\" alt=\"SVAR Vue DataGrid - Screenshot\" width=\"700\"\u003e\n\u003c/div\u003e\n\n### :sparkles: Key Features\n\nHere is a quick overview of what SVAR Vue DataGrid offers:\n\n-   High performance (virtual scrolling and dynamic loading)\n-   Pagination\n-   Sorting by multiple columns\n-   Advanced filtering (including natural language)\n-   In-cell editing (datepicker, combo, select, rich select, or custom editor)\n-   External editor for grid data\n-   Undo/redo\n-   Frozen columns\n-   Expandable/collapsible columns\n-   Custom HTML for cells\n-   Customizable tooltips for grid cells\n-   Row reordering with drag-and-drop\n-   Built-in context menu \u0026 toolbar\n-   Tree data\n-   Print support, export to CSV\n-   Keyboard navigation\n-   Accessibility: compatibility with [WAI-ARIA](https://www.w3.org/WAI/standards-guidelines/aria/) standard\n-   RestDataProvider for easy backend data binding\n-   Light and dark themes\n\n[Check the demos](https://docs.svar.dev/vue/grid/samples/#/base/willow) to see how these features work.\n\n### :hammer_and_wrench: How to Use\n\nTo use SVAR Vue DataGrid, simply import the package and include the component in your Vue file:\n\n```vue\n\u003cscript setup\u003e\nimport { Grid } from \"@svar-ui/vue-grid\";\nimport \"@svar-ui/vue-grid/all.css\";\n\nconst data = [\n\t{\n\t\tid: 12,\n\t\tname: \"Alex Brown\",\n\t\tyear: 1974,\n\t},\n];\nconst columns = [\n\t{\n\t\tid: \"name\",\n\t\theader: \"Title\",\n\t\tflexgrow: 1,\n\t\tsort: true,\n\t\teditor: \"text\",\n\t},\n\t{\n\t\tid: \"year\",\n\t\theader: \"Year\",\n\t\twidth: 100,\n\t\tsort: true,\n\t\teditor: \"text\",\n\t},\n];\n\u003c/script\u003e\n\n\u003ctemplate\u003e\n  \u003cGrid :data=\"data\" :columns=\"columns\" /\u003e\n\u003c/template\u003e\n```\n\nFor further instructions, see the detailed [getting started guide](https://docs.svar.dev/vue/grid/getting_started).\n\n### How to Modify\n\nTypically, you don't need to modify the code. However, if you wish to do so, follow these steps:\n\n1. Run `yarn` to install dependencies. Note that this project is a monorepo using `yarn` workspaces, so npm will not work\n2. Start the project in development mode with `yarn start`\n\n### Run Tests\n\nTo run the test:\n\n1. Start the test examples with:\n    ```sh\n    yarn start:tests\n    ```\n2. In a separate console, run the end-to-end tests with:\n    ```sh\n    yarn test:cypress\n    ```\n\n### Need Help?\n\nJoin our [community forum](https://forum.svar.dev) to get help or post feature requests.\n\n### ⭐ Show Your Support\n\nIf SVAR Vue DataGrid helps your project, [give us a star on GitHub](https://github.com/svar-widgets/vue-grid)! It helps more developers discover this component and keeps our team motivated to ship new features.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvar-widgets%2Fvue-grid","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsvar-widgets%2Fvue-grid","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvar-widgets%2Fvue-grid/lists"}