feat(Table): add support for pagination & initialState

[MuhammadM1998]

🔗 Linked issue

Part of #2441

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

This adds Pagination support for the table component. I've been waiting on #2654 but it's been a draft for some time. I've also added support for initialState to allow users to pass default options to the table, such as page size.

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[benjamincanac]

Does this not break all existing examples? I already tried this when I made the component but this enables the pagination just by passing getPaginationRowModel.

[MuhammadM1998]

I've tested the examples locally and they're working as expected. Can you elaborate more on how they break?

[pkg-pr-new]

npm i https://pkg.pr.new/@nuxt/ui@3065

commit: 98df452

[MuhammadM1998]

One thing to note is that this works for Client Side Pagination; for Server-Side pagination, one would need to pass pagination as instructed in the docs.

This made me think that we should let the table component accept all of useVueTable possible options and use defu to merge the defaults. This gives the end-user full control and allows extending the component with any features that's not built in yet.

What do you think? @benjamincanac

[benjamincanac]

Yes that would be better indeed, initially I was planning to add props one by one to document each feature.

[MuhammadM1998]

Would you like me to do it in this PR?

[MuhammadM1998]

Sorry for the delay I just noticed the reaction on the comment today @benjamincanac.

I've tried implementing this but faced an error when extending the props which led me to use workarounds to make it work. I opened #3177 to discuss it.

[benjamincanac]

@MuhammadM1998 Maybe we can merge this first? 🤔

[MuhammadM1998]

I've force-pushed the v3 to this branch so all changes are lost 👀. I could reimplement them easily but note that pagination with Tanstack can involve one or more of these options used together state, initialState, manualPagination, rowCount, and autoResetPageIndex as stated in the Pagination Docs.

This PR only adds support for initialState so it allows only one option of the above. If that's okay with you I'm happy to push the changes