fix(@anu-vue/nuxt): Auto Import and Enable Icons (#118)

jd-solanki · Jan 5, 2023 · 0ac1fbd · 0ac1fbd
1 parent 0462dac
commit 0ac1fbd
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 20 deletions.
diff --git a/packages/anu-nuxt/src/module.ts b/packages/anu-nuxt/src/module.ts
@@ -1,11 +1,12 @@
 import { presetThemeDefault } from '@anu-vue/preset-theme-default'
 import {
+  addImports,
   addPluginTemplate,
   defineNuxtModule,
 } from '@nuxt/kit'
 import presetIcons from '@unocss/preset-icons'
 import presetUno from '@unocss/preset-uno'
-import { presetAnu, presetIconExtraProperties } from 'anu-vue'
+import { composables as AnuComposables, presetAnu, presetIconExtraProperties } from 'anu-vue'
 
 import { name, version } from '../package.json'
 
@@ -21,7 +22,7 @@ interface PresetThemeOptions {
    *
    * @default 'css'
    */
-  style?: 'css' | 'sass'
+  style?: 'css' | 'scss'
 }
 
 export interface ModuleOptions {
@@ -54,7 +55,14 @@ export default defineNuxtModule<ModuleOptions>({
     if (enablePreset) {
       nuxt.options.unocss = nuxt.options.unocss || {}
 
-      const iconPreset = !!nuxt.options.unocss?.icons || true
+      // Enable unocss preset icon by default if it is not enabled.
+      const iconPreset = typeof nuxt.options.unocss?.icons === 'boolean'
+        ? {
+            scale: 1.2,
+            extraProperties: presetIconExtraProperties,
+          }
+        : nuxt.options.unocss.icons
+
       nuxt.options.unocss.preflight = false
 
       // Add default presets for Anu into the unocss options.
@@ -65,30 +73,17 @@ export default defineNuxtModule<ModuleOptions>({
         // @ts-expect-error - We know that is a valid preset
         presetAnu(),
 
+        // @ts-expect-error - We know that is a valid preset
+        presetIcons(iconPreset),
+
         // @ts-expect-error - We know that is a valid preset
         presetThemeDefault(),
         ...(nuxt.options.unocss.presets || []),
       ]
-
-      // If icon preset is enabled via `unocss.icons` option, add it to the presets.
-      // Default to `true` if `unocss.icons` is not defined.
-      if (iconPreset) {
-        // Icon Preset Anu by default
-        const presetIcon = presetIcons(typeof iconPreset === 'object'
-          ? iconPreset
-          : {
-              scale: 1.2,
-              extraProperties: presetIconExtraProperties,
-            },
-        )
-
-        // @ts-expect-error - We know that is a valid preset
-        nuxt.options.unocss.presets?.push(presetIcon)
-      }
     }
 
     // Add inline plugin template for Anu
-    // TODO: Look for reasons why import '#imports' doesn't work
+    // TODO: Look for reasons why import '#imports' doesn't work within a plugin template.
     addPluginTemplate({
       filename: 'anu-vue.mjs',
       getContents: () => {
@@ -110,6 +105,18 @@ export default defineNuxtModule<ModuleOptions>({
       },
     })
 
+    // Add Auto Completions for Anu Composables
+    const composablesToExclude = ['useProp']
+
+    Object.keys(AnuComposables)
+      .filter(key => key.includes('use') && !composablesToExclude.includes(key))
+      .forEach(name => {
+        addImports({
+          name,
+          from: 'anu-vue',
+        })
+      })
+
     nuxt.hook('prepare:types', ({ tsConfig, references }) => {
       tsConfig.compilerOptions!.types.push('anu-vue/volar')
       references.push({

diff --git a/packages/anu-vue/src/index.ts b/packages/anu-vue/src/index.ts
@@ -31,6 +31,7 @@ const plugin = {
 export { AnuComponentResolver } from './componentResolver'
 export * from './components'
 export * from './composables'
+export * as composables from './composables'
 export { presetAnu } from './preset'
 export * from './symbols'
 export { plugin as anu }