feat(table): add slot for empty state

[Haythamasalama]

This feature allows for customizable content, including custom text, images, or components, to create a meaningful and visually appealing message when the table is empty.

[vercel]

@Haythamasalama is attempting to deploy a commit to the Nuxt Labs Team on Vercel.

A member of the Team first needs to authorize it.

[nuxt-studio-dev]

✅ Live Preview ready!

Name	Edit	Preview	Latest Commit
ui	Edit on Studio ↗︎	View Live Preview	78b1b96

[nuxt-studio]

✅ Live Preview ready!

Name	Edit	Preview	Latest Commit
ui	Edit on Studio ↗︎	View Live Preview	1184cb1

[benjamincanac]

What would be the benefit of using the state when you can customize the icon and label through the :empty-state prop or globally in ui.table.default.emptyState and its styling through :ui prop or globally in ui.table.emptyState?

[Haythamasalama]

What would be the benefit of using the state when you can customize the icon and label through the :empty-state prop or globally in ui.table.default.emptyState and its styling through :ui prop or globally in ui.table.emptyState?

Ok, I know you can customize that label and icon, but in some cases of UI, you need to add a svg image with buttons! or when fetching data from the API when there is no data, I'd like to add a quick action button. which I did for a variety of projects.

For examples:

Here is an example form table in vuetifyjs.

I think the table component should be as flexible as possible to cover all scenarios in the UI, which is used a lot in every system.

[benjamincanac]

Wouldn't it be better to name slots like props? :empty-state="..." -> #empty-state

[Haythamasalama]

Wouldn't it be better to name slots like props? :empty-state="..." -> #empty-state

@benjamincanac done