import { defu } from 'defu'
import { createResolver, defineNuxtModule, addComponentsDir, addImportsDir, addVitePlugin, addPlugin, installModule } from '@nuxt/kit'
import tailwindcss from '@tailwindcss/vite'
import addTemplates from './templates'
import icons from './theme/icons'

export interface ModuleOptions {
  prefix?: string
  colors?: string[]
}

export default defineNuxtModule<ModuleOptions>({
  meta: {
    name: 'ui',
    configKey: 'ui',
    compatibility: {
      nuxt: '^3.10.0'
    }
  },
  defaults: {
    prefix: 'U',
    colors: undefined
  },
  async setup (options, nuxt) {
    const { resolve } = createResolver(import.meta.url)

    options.colors = options.colors || ['primary', 'red', 'orange', 'amber', 'yellow', 'lime', 'green', 'emerald', 'teal', 'cyan', 'sky', 'blue', 'indigo', 'violet', 'purple', 'fuchia', 'pink', 'rose']

    nuxt.options.alias['#ui'] = resolve('./runtime')

    nuxt.options.appConfig.ui = defu(nuxt.options.appConfig.ui || {}, {
      primary: 'green',
      gray: 'cool',
      icons
    })

    // nuxt.options.postcss = nuxt.options.postcss || {}
    // nuxt.options.postcss.plugins = nuxt.options.postcss.plugins || {}
    // nuxt.options.postcss.plugins['@tailwindcss/postcss'] = {}

    addVitePlugin(tailwindcss)

    await installModule('nuxt-icon')
    // await installModule('@nuxtjs/color-mode', { classSuffix: '' })

    addPlugin({
      src: resolve('./runtime/plugins/index')
    })

    addComponentsDir({
      path: resolve('./runtime/components'),
      prefix: options.prefix,
      pathPrefix: false
    })

    addImportsDir(resolve('./runtime/composables'))

    addTemplates(options, nuxt)
  }
})