feat(nuxt): module improved to accept preset anu & theme default options

jd-solanki · jd-solanki · commit 8810ab3e45ec · 2023-06-09T15:52:34.000+05:30
diff --git a/packages/anu-nuxt/package.json b/packages/anu-nuxt/package.json
@@ -1,12 +1,10 @@
 {
   "name": "@anu-vue/nuxt",
   "version": "0.14.0",
-  "description": "Nuxt 3 Anu UI library",
-  "author": "Mehmet - @productdevbook <hi@productdevbook.com>",
+  "description": "anu-vue - Nuxt 3 Module",
   "license": "MIT",
   "private": false,
-  "funding": "https://github.com/sponsors/productdevbook",
-  "homepage": "https://github.com/jd-solanki/anu/tree/main/packages/anu-nuxt#readme",
+  "homepage": "https://anu-vue.netlify.app",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/jd-solanki/anu.git",
@@ -55,4 +53,4 @@
     "@unocss/nuxt": "^0.51.13",
     "nuxt": "^3.5.0"
   }
-}
+}
diff --git a/packages/anu-nuxt/src/module.ts b/packages/anu-nuxt/src/module.ts
@@ -1,3 +1,4 @@
+import type { PresetOptions as PresetThemeDefaultOptions } from '@anu-vue/preset-theme-default'
 import { presetThemeDefault } from '@anu-vue/preset-theme-default'
 import { addCustomTab } from '@nuxt/devtools-kit'
 import {
@@ -10,7 +11,7 @@ import {
 } from '@nuxt/kit'
 import presetIcons from '@unocss/preset-icons'
 import presetUno from '@unocss/preset-uno'
-import type { PluginOptions } from 'anu-vue'
+import type { PluginOptions, PresetAnuOptions } from 'anu-vue'
 import { components as AnuComponents, composables as AnuComposables, presetAnu, presetIconExtraProperties } from 'anu-vue'
 import type { PartialDeep } from 'type-fest'
 
@@ -21,29 +22,21 @@ import { name, version } from '../package.json'
 const configKey = 'anu'
 
 /** Nuxt Module Options */
-interface PresetThemeOptions {
-
-  /**
-   * Import Anu Preset Theme with either CSS or SASS
-   * You can either import CSS which doesn't require any additional setup
-   * or SASS which requires you to install `sass` dependencies.
-   *
-   * @default 'css'
-   */
-  style?: 'css' | 'scss'
-}
-
 // TODO: (types) We don't get nested autocompletion for options
 export interface ModuleOptions {
 
   /**
-   * Import Anu Preset Theme Default | Source npm pkg: `@anu-vue/preset-theme-default`
-   * When enabled, it will automatically set up the default presets for Anu and Uno.
-   * We recommend to enable this option to get the best experience.
+   * Import Anu Preset Theme Default
+   * When enabled, it will automatically set up the default theme preset for Anu and Uno.
    *
    * @default true
    */
-  presetTheme?: PresetThemeOptions | boolean
+  presetThemeDefault?: PresetThemeDefaultOptions | boolean
+
+  /**
+   * Options for Anu Preset
+   */
+  presetAnuOptions?: PresetAnuOptions
 
   /**
    * Anu Vue Initial Theme | Source npm pkg: `anu-vue`
@@ -100,7 +93,7 @@ export interface ModuleOptions {
 
 export default defineNuxtModule<ModuleOptions>({
   defaults: {
-    presetTheme: true,
+    presetThemeDefault: true,
   },
   meta: {
     name,
@@ -112,6 +105,7 @@ export default defineNuxtModule<ModuleOptions>({
   },
   hooks: {
     'prepare:types': ({ tsConfig, references }) => {
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       tsConfig.compilerOptions!.types.push('anu-vue/volar')
       references.push({
         types: 'anu-vue/volar',
@@ -120,7 +114,6 @@ export default defineNuxtModule<ModuleOptions>({
   },
   setup(opts, nuxt) {
     const logger = useLogger('anu-vue')
-    const enableDefaultPreset = opts.presetTheme === true || typeof opts.presetTheme === 'object'
 
     // Disable module if '@unocss/nuxt' is not installed.
     if (nuxt.options.modules.includes('@unocss/nuxt') === false) {
@@ -139,19 +132,41 @@ export default defineNuxtModule<ModuleOptions>({
       ...(nuxt.options.unocss.presets || []), // Don't override existing presets.
       presetUno(),
 
-      // Icons Preset
-      // ℹ️ `nuxt.options.unocss.icons` can also be `undefined`
-      nuxt.options.unocss.icons !== false && presetIcons(
+      // Anu Preset
+      presetAnu(opts.presetAnuOptions),
+    ]
+
+    /*
+      👉 Preset Theme Default
+
+      Inject preset theme default into the unocss options if isn't disabled.
+    */
+    const isPresetThemeDefaultEnabled = opts.presetThemeDefault !== false
+    if (isPresetThemeDefaultEnabled) {
+      nuxt.options.unocss.presets.push(
+        presetThemeDefault(
+          typeof opts.presetThemeDefault === 'object'
+            ? opts.presetThemeDefault
+            : undefined,
+        ),
+      )
+    }
+
+    /*
+      👉 Preset Icons
+
+      Inject preset icons extra properties into icons preset unocss options if icons preset isn't disabled.
+    */
+    if (nuxt.options.unocss.icons !== false) {
+      presetIcons(
         typeof nuxt.options.unocss.icons === 'object'
           ? nuxt.options.unocss.icons
           : {
               scale: 1.2,
               extraProperties: presetIconExtraProperties,
             },
-      ),
-      presetAnu(),
-      enableDefaultPreset && presetThemeDefault(),
-    ] as any // Since unocss doesn't have runtime types for plugins yet.
+      )
+    }
 
     nuxt.options.unocss.include = [
       /.*\/anu-vue\.js(.*)?$/,
@@ -178,10 +193,8 @@ export default defineNuxtModule<ModuleOptions>({
           })`,
         ]
 
-        if (enableDefaultPreset) {
-          const styleExt = typeof opts.presetTheme === 'object' ? opts.presetTheme.style : 'css'
-          lines.unshift(`import '@anu-vue/preset-theme-default/dist/style.${styleExt}'`)
-        }
+        if (isPresetThemeDefaultEnabled)
+          lines.unshift('import \'@anu-vue/preset-theme-default/dist/style.css\'')
 
         lines.unshift('import \'anu-vue/dist/style.css\'')
 
