From 6d2eb140b5b4758dfe0a486aa8013ce04a30c426 Mon Sep 17 00:00:00 2001
From: BatLeDev <baptiste.guerny@koumoul.com>
Date: Fri, 27 Mar 2026 15:45:24 +0100
Subject: [PATCH] fix(vuetify): separate composable auto-imports from component
 resolution

Previously, autoImports in lib-vuetify mixed composables (from lib-vue) with
.vue component default exports. This was incorrect: unplugin-auto-import
handles script-level imports only, not template component resolution.
The .vue entries had no effect and caused "Cannot optimize dependency" warnings
from Vite since esbuild cannot pre-bundle .vue files.

autoImports now re-exports lib-vue composables only (backwards-compatible,
existing consumers using autoImports keep working unchanged).

A new componentsResolver is added for unplugin-vue-components, which properly
resolves Df-prefixed components (e.g. <DfPersonalMenu> or <df-personal-menu>)
to their @data-fair/lib-vuetify/*.vue modules.

Also adds TSDoc to autoImports, componentsResolver, and settingsPath.
---
 packages/vue/vite.ts     | 21 ++++++++++--
 packages/vuetify/vite.ts | 72 ++++++++++++++++++++++++++++------------
 2 files changed, 70 insertions(+), 23 deletions(-)

diff --git a/packages/vue/vite.ts b/packages/vue/vite.ts
index 244514e..5c71360 100644
--- a/packages/vue/vite.ts
+++ b/packages/vue/vite.ts
@@ -1,5 +1,22 @@
-// made for https://github.com/unplugin/unplugin-auto-import
-
+/**
+ * Preset for {@link https://github.com/unplugin/unplugin-auto-import unplugin-auto-import}.
+ *
+ * Auto-imports Vue, vue-router, vue-i18n built-ins and all data-fair composables
+ * so they can be used in `<script setup>` without explicit import statements.
+ *
+ * @example
+ * ```ts
+ * // vite.config.ts
+ * import { autoImports } from '@data-fair/lib-vue/vite.js'
+ * import AutoImport from 'unplugin-auto-import/vite'
+ *
+ * export default defineConfig({
+ *   plugins: [
+ *     AutoImport({ imports: [...autoImports] })
+ *   ]
+ * })
+ * ```
+ */
 export const autoImports = [
   'vue',
   'vue-i18n',
diff --git a/packages/vuetify/vite.ts b/packages/vuetify/vite.ts
index bba0fda..f7b8385 100644
--- a/packages/vuetify/vite.ts
+++ b/packages/vuetify/vite.ts
@@ -1,24 +1,54 @@
-// made for https://github.com/unplugin/unplugin-auto-import
-import { autoImports as vueAutoImports } from '@data-fair/lib-vue/vite.js'
+/**
+ * Re-export of {@link autoImports} from `@data-fair/lib-vue/vite.js`.
+ *
+ * Composables-only preset for {@link https://github.com/unplugin/unplugin-auto-import unplugin-auto-import}.
+ * Does not include components — use {@link componentsResolver} with
+ * {@link https://github.com/unplugin/unplugin-vue-components unplugin-vue-components} for that.
+ */
+export { autoImports } from '@data-fair/lib-vue/vite.js'
 
-export const autoImports = [
-  ...vueAutoImports,
-  {
-    '@data-fair/lib-vuetify/date-match-filter.vue': [['default', 'dfDateMatchFilter']],
-    '@data-fair/lib-vuetify/date-range-picker.vue': [['default', 'dfDateRangePicker']],
-    '@data-fair/lib-vuetify/lang-switcher.vue': [['default', 'dfLangSwitcher']],
-    '@data-fair/lib-vuetify/navigation-right.vue': [['default', 'dfNavigationRight']],
-    '@data-fair/lib-vuetify/owner-avatar.vue': [['default', 'dfOwnerAvatar']],
-    '@data-fair/lib-vuetify/owner-pick.vue': [['default', 'dfOwnerPick']],
-    '@data-fair/lib-vuetify/personal-menu.vue': [['default', 'dfPersonalMenu']],
-    // I don't understand why but search-address.vue breaks some typescript checks
-    // '@data-fair/lib-vuetify/search-address.vue': [['default', 'dfSearchAddress']],
-    '@data-fair/lib-vuetify/theme-switcher.vue': [['default', 'dfThemeSwitcher']],
-    '@data-fair/lib-vuetify/tutorial-alert.vue': [['default', 'dfTutorialAlert']],
-    '@data-fair/lib-vuetify/ui-notif-alert.vue': [['default', 'dfUiNotifAlert']],
-    '@data-fair/lib-vuetify/ui-notif.vue': [['default', 'dfUiNotif']],
-    '@data-fair/lib-vuetify/ui-user-avatar.vue': [['default', 'dfUserAvatar']]
-  }
-]
+/**
+ * Map of PascalCase component names to their module paths.
+ * Used internally by {@link componentsResolver}.
+ */
+const components: Record<string, string> = {
+  DfDateMatchFilter: '@data-fair/lib-vuetify/date-match-filter.vue',
+  DfDateRangePicker: '@data-fair/lib-vuetify/date-range-picker.vue',
+  DfLangSwitcher: '@data-fair/lib-vuetify/lang-switcher.vue',
+  DfNavigationRight: '@data-fair/lib-vuetify/navigation-right.vue',
+  DfOwnerAvatar: '@data-fair/lib-vuetify/owner-avatar.vue',
+  DfOwnerPick: '@data-fair/lib-vuetify/owner-pick.vue',
+  DfPersonalMenu: '@data-fair/lib-vuetify/personal-menu.vue',
+  DfSearchAddress: '@data-fair/lib-vuetify/search-address.vue',
+  DfSearchField: '@data-fair/lib-vuetify/search-field.vue',
+  DfThemeSwitcher: '@data-fair/lib-vuetify/theme-switcher.vue',
+  DfTutorialAlert: '@data-fair/lib-vuetify/tutorial-alert.vue',
+  DfUiNotifAlert: '@data-fair/lib-vuetify/ui-notif-alert.vue',
+  DfUiNotif: '@data-fair/lib-vuetify/ui-notif.vue',
+  DfUserAvatar: '@data-fair/lib-vuetify/user-avatar.vue'
+}
+
+/**
+ * Resolver for {@link https://github.com/unplugin/unplugin-vue-components unplugin-vue-components}.
+ *
+ * Resolves `Df`-prefixed component names (e.g. `<DfPersonalMenu>` or `<df-personal-menu>`)
+ * to their corresponding `@data-fair/lib-vuetify/*.vue` module.
+ *
+ * @example
+ * ```ts
+ * // vite.config.ts
+ * import { componentsResolver } from '@data-fair/lib-vuetify/vite.js'
+ * import Components from 'unplugin-vue-components/vite'
+ *
+ * export default defineConfig({
+ *   plugins: [
+ *     Components({ resolvers: [componentsResolver] })
+ *   ]
+ * })
+ * ```
+ */
+export const componentsResolver = (name: string) => {
+  if (components[name]) return components[name]
+}
 
 export const settingsPath = new URL(import.meta.resolve('@data-fair/lib-vuetify/style/settings.scss')).pathname