shadcn-svelte
shadcn-svelte copied to clipboard
huntabyte
feature: Data Table
Describe the feature in detail (code, mocks, or screenshots encouraged)
~~The original project uses Tanstack Table, which also has a Svelte version, so the intent is to integrate that with the existing Table component to create a DataTable.~~
After looking into the TanStack table docs and really putting thought into this, I don't want to build on a project where Svelte is not a top priority, but rather an afterthought.
There are a few solid data table libraries out there right now, and I'll list them here once I confirm whether they are a true candidate or not.
If you have any that come to mind, we're completely open at the moment, so let's discuss.
Could you please checkout https://github.com/Kage0x3B/svelte-advanced-datatable. We use this in production and could imagine to use this in shadcn-svelte. What is your opinion @huntabyte ?
Could you please checkout https://github.com/Kage0x3B/svelte-advanced-datatable. We use this in production and could imagine to use this in shadcn-svelte. What is your opinion @huntabyte ?
Wow, this looks really good! I will play around with it a bit this week but it certainly seems like a good candidate.
@Kage0x3B maybe we can do a pr? Checkout this video: https://www.youtube.com/watch?v=bfbam0Zf4p0&ab_channel=Huntabyte
This might also fit, i guess: https://github.com/bryanmylee/svelte-headless-table
I'm finally back from a work trip and have some time on my hands this weekend to work through the Data Table implementation.
Similar to the original, the goal is to create a step-by-step / walk-through implementation guide of a datatable using the existing Table components. It's rare that two datatables are the same, and trying to create some universal component that makes sense to everyone isn't practical. If you want to create a component from the implementation guide yourself, you're more than welcome to, but it won't be distributed via the CLI (beyond maybe just the example implementation).
I'm going to start with an implementation of bryanmylee/svelte-headless-table, and if time permits, I'll also try to build the same with vincjo/datables. Both of which have solid TypeScript support (which is non-negotiable).
While we'll have a step-by-step implementation guide which will be great for getting people started, it can't possibly cover all use-cases, so rock solid documentation of the datatables library itself is a must.
@flowluap - if/when the documentation for Kage0x3B/svelte-advanced-datatable is more complete we can look at a guide for that as well.
Of course, developers are free to choose whatever datatable library they wish, which is a great benefit of handling it in this way.
I'm finally back from a work trip and have some time on my hands this weekend to work through the Data Table implementation.
Similar to the original, the goal is to create a step-by-step / walk-through implementation guide of a datatable using the existing
Tablecomponents. It's rare that two datatables are the same, and trying to create some universal component that makes sense to everyone isn't practical. If you want to create a component from the implementation guide yourself, you're more than welcome to, but it won't be distributed via the CLI (beyond maybe just the example implementation).I'm going to start with an implementation of bryanmylee/svelte-headless-table, and if time permits, I'll also try to build the same with vincjo/datables. Both of which have solid TypeScript support (which is non-negotiable).
While we'll have a step-by-step implementation guide which will be great for getting people started, it can't possibly cover all use-cases, so rock solid documentation of the datatables library itself is a must.
@flowluap - if/when the documentation for Kage0x3B/svelte-advanced-datatable is more complete we can look at a guide for that as well.
Of course, developers are free to choose whatever datatable library they wish, which is a great benefit of handling it in this way.
Thank you for the extensive feedback!
Little update: So far bryanmylee/svelte-headless-table has been a joy to work with and I'm nearing completion with an initial implementation.
If you want to see where I'm at right now, here's a demo/preview link.
The data table preview is up and functional! Will be working through the guide in the coming days to get this closed out.
@huntabyte it's working great i'm using it one of my project. As you mentioned you are working on docs that's all we need. Thank you
@huntabyte I'm curious why tanstack table wasn't used considering it's typescript and used in the original shadcn project. https://ui.shadcn.com/docs/components/data-table Would be nice to have a component with a layout much like the table component so it feels more idiomatic.
