From 05059eeb9ef73441d8ab3dd1bfa7029900d55aaa Mon Sep 17 00:00:00 2001
From: LouisMazel <me@loicmazuel.com>
Date: Wed, 31 Jul 2024 23:20:44 +0200
Subject: [PATCH] feat(maz-ui): add modules resolver for unplugin-auto-import

---
 packages/docs/docs/guide/getting-started.md   | 24 ++++++++--
 packages/lib/resolvers/index.ts               |  1 +
 .../resolvers/unplugin-modules-resolver.ts    | 47 +++++++++++++++++++
 3 files changed, 69 insertions(+), 3 deletions(-)
 create mode 100644 packages/lib/resolvers/unplugin-modules-resolver.ts

diff --git a/packages/docs/docs/guide/getting-started.md b/packages/docs/docs/guide/getting-started.md
index 6709ac4ec8..4feef8ada5 100644
--- a/packages/docs/docs/guide/getting-started.md
+++ b/packages/docs/docs/guide/getting-started.md
@@ -47,13 +47,13 @@ export default defineNuxtConfig({
 
 <NpmBadge package="unplugin-vue-components"></NpmBadge>
 
-Use [unplugin-vue-components](https://github.com/unplugin/unplugin-vue-components) and the dedicated maz-ui resolver to auto-import components and directives
+Use [unplugin-vue-components](https://github.com/unplugin/unplugin-vue-components) and the dedicated maz-ui resolver to auto-import components, directives and modules
 
 ```ts
 // vite.config.mts
 
 import Components from 'unplugin-vue-components/vite'
-import { UnpluginVueComponentsResolver, UnpluginDirectivesResolver } from 'maz-ui/resolvers'
+import { UnpluginVueComponentsResolver, UnpluginDirectivesResolver, UnpluginModulesResolver } from 'maz-ui/resolvers'
 
 export default defineConfig({
   plugins: [
@@ -62,6 +62,7 @@ export default defineConfig({
       resolvers: [
         UnpluginVueComponentsResolver(),
         UnpluginDirectivesResolver(),
+        UnpluginModulesResolver(),
       ],
     }),
   ]
@@ -75,12 +76,29 @@ export default defineConfig({
   ...
   "include": [
     "components.d.ts",
+    "auto-imports.d.ts",
   ],
   ...
 }
 ```
 
-Then, you don't need to import all maz-ui components into your components
+Then, you don't need to import maz-ui components, directives and modules in your files
+
+```vue
+<template>
+  <MazBtn v-click-outside="clikedOutside">Button</MazBtn>
+</template>
+
+<script lang="ts" setup>
+const toast = useToast()
+
+toast.message('Hello world!')
+
+function clikedOutside () {
+  console.log('clicked outside')
+}
+</script>
+```
 
 :::
 
diff --git a/packages/lib/resolvers/index.ts b/packages/lib/resolvers/index.ts
index 706aec8c01..d0316081ed 100644
--- a/packages/lib/resolvers/index.ts
+++ b/packages/lib/resolvers/index.ts
@@ -1,2 +1,3 @@
 export * from './unplugin-vue-components-resolver'
 export * from './unplugin-directives-resolver'
+export * from './unplugin-modules-resolver'
diff --git a/packages/lib/resolvers/unplugin-modules-resolver.ts b/packages/lib/resolvers/unplugin-modules-resolver.ts
new file mode 100644
index 0000000000..f49fd5c837
--- /dev/null
+++ b/packages/lib/resolvers/unplugin-modules-resolver.ts
@@ -0,0 +1,47 @@
+import type { ComponentResolverFunction } from 'unplugin-vue-components/types'
+
+export function UnpluginModulesResolver(): ComponentResolverFunction {
+  return (name) => {
+    type MazUiModules = keyof typeof import('maz-ui')
+
+    const modules = [
+      'capitalize',
+      'checkAvailability',
+      'countryCodeToUnicodeFlag',
+      'currency',
+      'date',
+      'debounce',
+      'injectStrict',
+      'isClient',
+      'normalizeString',
+      'number',
+      'sleep',
+      'throttle',
+      'truthyFilter',
+      'useAos',
+      'useBreakpoints',
+      'useFormField',
+      'useFormValidator',
+      'useIdleTimeout',
+      'useInstanceUniqId',
+      'useReadingTime',
+      'useStringMatching',
+      'useSwipe',
+      'useThemeHandler',
+      'useTimer',
+      'useToast',
+      'useUserVisibility',
+      'useWait',
+      'useWindowSize',
+    ] as MazUiModules[]
+
+    if (modules.includes(name as MazUiModules)) {
+      return {
+        from: 'maz-ui',
+        name,
+      }
+    }
+
+    return undefined
+  }
+}