{"id":29406425,"url":"https://github.com/gfazioli/mantine-list-view-table","last_synced_at":"2026-01-23T09:41:58.754Z","repository":{"id":303924964,"uuid":"1016110305","full_name":"gfazioli/mantine-list-view-table","owner":"gfazioli","description":"Brings Finder-style List View to Mantine Table, with column reordering and resizing.","archived":false,"fork":false,"pushed_at":"2025-12-18T11:27:17.000Z","size":7260,"stargazers_count":11,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-12-20T01:00:43.675Z","etag":null,"topics":["listview","mantine-ui","mantine-v8","nextjs","reactjs","reordering","resizing","table","typescript"],"latest_commit_sha":null,"homepage":"https://gfazioli.github.io/mantine-list-view-table/","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/gfazioli.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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},"funding":{"github":["gfazioli"]}},"created_at":"2025-07-08T13:58:44.000Z","updated_at":"2025-12-18T11:27:21.000Z","dependencies_parsed_at":"2025-07-10T14:58:55.749Z","dependency_job_id":"5fa9e767-914e-46b7-a222-d0c506fc8465","html_url":"https://github.com/gfazioli/mantine-list-view-table","commit_stats":null,"previous_names":["gfazioli/mantine-list-view-table"],"tags_count":19,"template":true,"template_full_name":"gfazioli/mantine-marquee","purl":"pkg:github/gfazioli/mantine-list-view-table","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gfazioli%2Fmantine-list-view-table","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gfazioli%2Fmantine-list-view-table/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gfazioli%2Fmantine-list-view-table/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gfazioli%2Fmantine-list-view-table/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gfazioli","download_url":"https://codeload.github.com/gfazioli/mantine-list-view-table/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gfazioli%2Fmantine-list-view-table/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28572556,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-19T14:39:55.009Z","status":"ssl_error","status_checked_at":"2026-01-19T14:39:01.217Z","response_time":67,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["listview","mantine-ui","mantine-v8","nextjs","reactjs","reordering","resizing","table","typescript"],"created_at":"2025-07-10T23:21:41.635Z","updated_at":"2026-01-19T15:00:58.227Z","avatar_url":"https://github.com/gfazioli.png","language":"TypeScript","funding_links":["https://github.com/sponsors/gfazioli","https://github.com/sponsors/gfazioli?o=esc"],"categories":[],"sub_categories":[],"readme":"# Mantine ListViewTable Component\n\n\u003cimg alt=\"mantine List View Table\" src=\"https://github.com/gfazioli/mantine-list-view-table/blob/master/logo.png\" /\u003e\n\n\u003cdiv align=\"center\"\u003e\n  \n  [![NPM version](https://img.shields.io/npm/v/%40gfazioli%2Fmantine-list-view-table?style=for-the-badge)](https://www.npmjs.com/package/@gfazioli/mantine-list-view-table)\n  [![NPM Downloads](https://img.shields.io/npm/dm/%40gfazioli%2Fmantine-list-view-table?style=for-the-badge)](https://www.npmjs.com/package/@gfazioli/mantine-list-view-table)\n  [![NPM Downloads](https://img.shields.io/npm/dy/%40gfazioli%2Fmantine-list-view-table?style=for-the-badge\u0026label=%20\u0026color=f90)](https://www.npmjs.com/package/@gfazioli/mantine-list-view-table)\n  ![NPM License](https://img.shields.io/npm/l/%40gfazioli%2Fmantine-list-view-table?style=for-the-badge)\n\n---\n\n[\u003ckbd\u003e \u003cbr/\u003e ❤️ If this component has been useful to you or your team, please consider becoming a sponsor \u003cbr/\u003e \u003c/kbd\u003e](https://github.com/sponsors/gfazioli?o=esc)\n\n\u003c/div\u003e\n\n## Overview\n\nThis component is created on top of the [Mantine](https://mantine.dev/) library.\n\n[Mantine ListViewTable](https://gfazioli.github.io/mantine-list-view-table/) is a robust React component that enhances Mantine’s Table to deliver a modern, macOS Finder–style list view with advanced interactivity and layout control. Users can reorder and resize columns, while developers can choose internal behaviors or fully manage state externally for sorting, column reordering, and resizing. \n\nThe component provides fine‑grained typography control—via ellipsis and noWrap—and allows distinct header vs. cell presentation using cellStyle. It supports wide datasets through Table.ScrollContainer for horizontal scrolling, with optional sticky identifier columns, and works seamlessly inside ScrollArea with sticky headers and adjustable offsets. \n\nFor UX polish, it ships with configurable loading overlays (including custom loaders) and rich empty states ranging from simple messages to fully styled components with actions. These features make ListViewTable ideal for applications that need a clear, scalable, and highly interactive tabular list experience.\n\n\u003e [!note]\n\u003e\n\u003e → [Demo and Documentation](https://gfazioli.github.io/mantine-list-view-table/) → [Youtube Video](https://www.youtube.com/playlist?list=PL85tTROKkZrWyqCcmNCdWajpx05-cTal4) → [More Mantine Components](https://mantine-extensions.vercel.app/)\n\n\n## Installation\n\n```sh\nnpm install @gfazioli/mantine-list-view-table\n```\nor \n\n```sh\nyarn add @gfazioli/mantine-list-view-table\n```\n\nAfter installation import package styles at the root of your application:\n\n```tsx\nimport '@gfazioli/mantine-list-view-table/styles.css';\n```\n\n## Usage\n\n```tsx\nimport { ListViewTable } from '@gfazioli/mantine-list-view-table';\nimport { Badge, Text } from '@mantine/core';\n\nfunction Demo() {\n  const data = [\n    { id: 1, name: 'Documents', type: 'folder', size: '--', modified: '2024-06-01', kind: 'Folder' },\n    { id: 2, name: 'README.md', type: 'file', size: '2.1 KB', modified: '2024-06-02', kind: 'Markdown' },\n    { id: 3, name: 'package.json', type: 'file', size: '1.8 KB', modified: '2024-06-03', kind: 'JSON' },\n    { id: 4, name: 'src', type: 'folder', size: '--', modified: '2024-06-04', kind: 'Folder' },\n  ];\n\n  const columns = [\n    {\n      key: 'name',\n      title: 'Name',\n      sortable: true,\n      renderCell: (record) =\u003e (\n        \u003cText fw={record.type === 'folder' ? 600 : 400}\u003e{record.name}\u003c/Text\u003e\n      ),\n    },\n    {\n      key: 'kind',\n      title: 'Kind',\n      sortable: true,\n      width: 120,\n      renderCell: (record) =\u003e (\n        \u003cBadge variant=\"light\" color={record.type === 'folder' ? 'blue' : 'gray'} size=\"sm\"\u003e\n          {record.kind}\n        \u003c/Badge\u003e\n      ),\n    },\n    {\n      key: 'size',\n      title: 'Size',\n      sortable: true,\n      textAlign: 'right',\n      width: 180,\n    },\n    {\n      key: 'modified',\n      title: 'Date Modified',\n      sortable: true,\n      width: 120,\n    },\n  ];\n\n  return (\n    \u003cListViewTable\n      columns={columns}\n      data={data}\n      rowKey=\"id\"\n      withTableBorder\n      highlightOnHover\n      onRowClick={(record) =\u003e {\n        console.log('Clicked:', record.name);\n      }}\n    /\u003e\n  );\n}\n```\n## Sponsor\n\n\u003cdiv align=\"center\"\u003e\n\n[\u003ckbd\u003e \u003cbr/\u003e ❤️ If this component has been useful to you or your team, please consider becoming a sponsor \u003cbr/\u003e \u003c/kbd\u003e](https://github.com/sponsors/gfazioli?o=esc)\n\n\u003c/div\u003e\n\nYour support helps me:\n\n- Keep the project actively maintained with timely bug fixes and security updates\t\n- Add new features, improve performance, and refine the developer experience\t\n- Expand test coverage and documentation for smoother adoption\t\n- Ensure long‑term sustainability without relying on ad hoc free time\t\n- Prioritize community requests and roadmap items that matter most\n\nOpen source thrives when those who benefit can give back—even a small monthly contribution makes a real difference. Sponsorships help cover maintenance time, infrastructure, and the countless invisible tasks that keep a project healthy.\n\nYour help truly matters.\n\n💚 [Become a sponsor](https://github.com/sponsors/gfazioli?o=esc) today and help me keep this project reliable, up‑to‑date, and growing for everyone.\n\n---\n  \nhttps://github.com/user-attachments/assets/f4b7281c-eea0-41f9-b168-80d0f8374929\n\nhttps://github.com/user-attachments/assets/a220d834-6787-429a-aab3-15e0c504f39c\n\n---\n[![Star History Chart](https://api.star-history.com/svg?repos=gfazioli/mantine-list-view-table\u0026type=Timeline)](https://www.star-history.com/#gfazioli/mantine-list-view-table\u0026Timeline)\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgfazioli%2Fmantine-list-view-table","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgfazioli%2Fmantine-list-view-table","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgfazioli%2Fmantine-list-view-table/lists"}