feat: add unplugin-vuetify package

[userquin]

This PR on draft, we need to add readme.md files, add another playground and prepare docs at Vuetify:

• includes changes in this Vuetify PR: feat(package): add unimport presets and unplugin-vue-components resolvers vuetify#21129
• changed the vuetify styles plugin options: now it also allows to register SASS/SCSS api
• package is ESM-only
• webpack support droped: consumers still using webpack will need to use older packages (unimport presets and unplugin-vue-component resolvers can still be used registering the Vite/Webpack plugin disabling auto-import, I've only tested this using Vite)

This package is a modern refactor for existing codebase, doesn't replace/deprecate existing ones.

As summary (to prepare Vuetify docs later and the readme file here):

• don't use Vite plugin directly to auto-import Vuetify components (three-shaking), will use instead the unimport presets or the unplugin-vue-components resolvers
• exports unimport presets to allow (unimport-presets subpackage export):
  • use Vue Lazy Hydration with Nuxt: LazyVBtn for example when visible
  • using custom prefix for Vuetify components (VuetifyXXX instead VXXX), directives (v-vuetify-xxx instead v-xxxx) and composables (useVXXX or custom prefix) to avoid collisions (disabled by default)
  • exports utilities to change Vuetify transformAssetUrls when enabling custom Vuetify components prefix (check details below)
  • with the directives preset VSCode will suggest Vuetify directives: right now only JetBrains IDE suggesting directives via webtypes (I'm talking with Jan-Niklas at JetBrains (WebStorm) to drop support and use Volar instead, now directives names can use vuetify prefix => maybe we can also add the entries with the prefix)
• exports unplugin-vue-component resolvers to allow (unplugin-vue-component-resolvers subpackage export, we need to change the name, missing s in the component) for:
  • Vuetify components with prefix support similar to previous described at unimport presets
  • Vuetify directives with prefix support similar to previous described at unimport presets: won't work since unplugin-vue-components doesn't augment the vue module properly (iirc there is a PR to fix it)

Here some GH repos using Vuetify (dev) PR:

• chore: use local Vuetify dev tgz from Vuetify #21129 PR userquin/vuetify-nuxt-3.16-lazy-hydration#3
• https://github.com/userquin/check-vuetify-unplugin-vue-components-2
• https://github.com/userquin/vuetify-nuxt-unimport-component-prefix/tree/main (using prefix for components, directives and composables with some example using Nuxt Vue Lazy Hydration with VBtn and VCalendar in an SSR app with dark/light themes and http client hints)
• https://github.com/userquin/vuetify-nuxt-unimport-component-prefix/tree/use-unplugin-vuetify using this PR instead Vuetify, check chore: use unplugin-vuetify userquin/vuetify-nuxt-unimport-component-prefix#1 PR

We need to replace keys in the existing transformAssetUrls entries

current transformAssetUrls map, won't work when using Vuetify component prefix

[Copilot]

Copilot reviewed 7 out of 10 changed files in this pull request and generated 1 comment.

Files not reviewed (3)

• package.json: Language not supported
• packages/unplugin-vuetify/package.json: Language not supported
• packages/unplugin-vuetify/tsconfig.json: Language not supported

Comments suppressed due to low confidence (1)

packages/unplugin-vuetify/src/utils.ts:46

• Pushing new kebab-case attributes directly into the 'attrs' array while iterating over it may cause duplicate entries or an infinite loop; consider iterating over a shallow copy of the array or collecting new values before merging.

attrs.push(toKebabCase(attr))

[Copilot]

Copilot reviewed 7 out of 10 changed files in this pull request and generated 2 comments.

Files not reviewed (3)

• package.json: Language not supported
• packages/unplugin-vuetify/package.json: Language not supported
• packages/unplugin-vuetify/tsconfig.json: Language not supported

[Copilot]

[nitpick] The toKebabCase function directly replaces all non-alphabetic characters with '-', which may result in multiple consecutive dashes. Consider adding an additional replacement to collapse repeated dashes (e.g., using .replace(/-+/g, '-')).

Suggested change

	.replace(/[^a-z]/gi, '-')
	.replace(/\B([A-Z])/g, '-$1')
	.toLowerCase()
	.replace(/[^a-z]/gi, '-') // Replace non-alphabetic characters with dashes
	.replace(/-+/g, '-') // Collapse consecutive dashes into a single dash
	.replace(/\B([A-Z])/g, '-$1') // Add dashes before uppercase letters
	.toLowerCase() // Convert the string to lowercase