feat: nuxt, vite components auto-import

package.json

@@ -8,7 +8,7 @@
     "lint:fix": "eslint . --fix",
     "test": "pnpm -r test",
     "release": "pnpm -r release && changeset publish",
-    "build:package": "pnpm --filter vaul-vue build-only",
+    "build:package": "pnpm --filter vaul-vue build-only && pnpm run --filter plugins build",
     "build:playground": "pnpm build:package && pnpm --filter playground build"
   },
   "devDependencies": {

packages/plugins/build.config.ts

@@ -0,0 +1,43 @@
+import { defineBuildConfig } from 'unbuild'
+
+export default defineBuildConfig([
+  {
+    name: 'Nuxt module',
+    entries: ['./src/nuxt/index'],
+    outDir: '../vaul-vue/dist',
+    clean: false,
+    declaration: true,
+    externals: [
+      '@nuxt/schema',
+    ],
+    rollup: {
+      emitCJS: true,
+    },
+  },
+  {
+    name: 'Unplugin-vue-component Resolver',
+    entries: ['./src/resolver/index'],
+    outDir: '../vaul-vue/dist',
+    clean: false,
+    declaration: true,
+    externals: [
+      'unplugin-vue-components',
+    ],
+    rollup: {
+      emitCJS: true,
+    },
+  },
+  {
+    name: 'Namespaced',
+    entries: ['./src/namespaced/index'],
+    outDir: '../vaul-vue/dist',
+    clean: false,
+    declaration: true,
+    externals: [
+      'radix-vue',
+    ],
+    rollup: {
+      emitCJS: true,
+    },
+  },
+])

packages/plugins/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "plugins",
+  "type": "module",
+  "version": "1.9.9",
+  "description": "Nuxt module for Vaul Vue",
+  "license": "MIT",
+  "keywords": [
+    "vaul",
+    "vaul-vue",
+    "nuxt-module",
+    "nuxt",
+    "nuxt3"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "build": "unbuild",
+    "stub": "unbuild --stub"
+  },
+  "dependencies": {
+    "@nuxt/kit": "^3.12.2",
+    "@nuxt/schema": "^3.12.2",
+    "unbuild": "^2.0.0",
+    "unplugin-vue-components": "^0.27.2",
+    "vaul-vue": "link:../vaul-vue"
+  }
+}

packages/plugins/src/namespaced/index.ts

@@ -0,0 +1,23 @@
+import { DrawerRoot, DrawerClose, DrawerContent, DrawerDescription, DrawerPortal, DrawerTitle, DrawerTrigger, DrawerOverlay, DrawerRootNested } from 'vaul-vue'
+
+export const Drawer = {
+  Root: DrawerRoot,
+  Content: DrawerContent,
+  Overlay: DrawerOverlay,
+  RootNested: DrawerRootNested,
+  Close: DrawerClose,
+  Portal: DrawerPortal,
+  Trigger: DrawerTrigger,
+  Title: DrawerTitle,
+  Description: DrawerDescription,
+} as {
+  Root: typeof DrawerRoot
+  Content: typeof DrawerContent
+  Overlay: typeof DrawerOverlay
+  RootNested: typeof DrawerRootNested
+  Close: typeof DrawerClose
+  Portal: typeof DrawerPortal
+  Trigger: typeof DrawerTrigger
+  Title: typeof DrawerTitle
+  Description: typeof DrawerDescription
+}

packages/plugins/src/nuxt/index.ts

@@ -0,0 +1,30 @@
+import { addComponent, defineNuxtModule } from '@nuxt/kit'
+import { components } from '../../../vaul-vue/constant'
+
+import type { } from '@nuxt/schema' // workaround for TS bug with "phantom" deps
+
+export interface ModuleOptions {
+  prefix: string
+}
+
+export default defineNuxtModule<ModuleOptions>({
+  meta: {
+    name: '@vaul-vue/nuxt',
+    configKey: 'vaul',
+    compatibility: {
+      nuxt: '>=3.0.0',
+    },
+  },
+  defaults: {
+    prefix: ''
+  },
+  setup(options) {
+    for (const component of components) {
+      addComponent({
+        name: `${options.prefix}${component}`,
+        export: component,
+        filePath: 'vaul-vue',
+      })
+    }
+  },
+})

packages/plugins/src/resolver/index.ts

@@ -0,0 +1,30 @@
+import type { ComponentResolver } from 'unplugin-vue-components'
+import { components } from '../../../vaul-vue/constant'
+
+export interface ResolverOptions {
+  /**
+   * prefix for components used in templates
+   *
+   * @defaultValue ""
+   */
+  prefix?: string
+}
+
+export default function (options: ResolverOptions = {}): ComponentResolver {
+  const { prefix = '' } = options
+
+  return {
+    type: 'component',
+    resolve: (name: string) => {
+      if (name.toLowerCase().startsWith(prefix.toLowerCase())) {
+        const componentName = name.substring(prefix.length)
+        if (components.includes(componentName)) {
+          return {
+            name: componentName,
+            from: 'vaul-vue',
+          }
+        }
+      }
+    },
+  }
+}

packages/plugins/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "module": "es2020",
+    "moduleResolution": "node"
+  },
+  "exclude": [
+    "node_modules",
+    "dist"
+  ]
+}

packages/vaul-vue/constant/index.ts

@@ -0,0 +1,11 @@
+export const components = [
+  'DrawerRoot',
+  'DrawerContent',
+  'DrawerOverlay',
+  'DrawerRootNested',
+  'DrawerClose',
+  'DrawerPortal',
+  'DrawerTrigger',
+  'DrawerTitle',
+  'DrawerDescription',
+]

packages/vaul-vue/package.json

@@ -15,6 +15,36 @@
     ".": {
       "import": "./dist/index.js",
       "require": "./dist/index.umd.cjs"
+    },
+    "./namespaced": {
+      "import": {
+        "types": "./dist/namespaced/index.d.mts",
+        "default": "./dist/namespaced/index.mjs"
+      },
+      "require": {
+        "types": "./dist/namespaced/index.d.cts",
+        "default": "./dist/namespaced/index.cjs"
+      }
+    },
+    "./nuxt": {
+      "import": {
+        "types": "./dist/nuxt/index.d.mts",
+        "default": "./dist/nuxt/index.mjs"
+      },
+      "require": {
+        "types": "./dist/nuxt/index.d.cts",
+        "default": "./dist/nuxt/index.cjs"
+      }
+    },
+    "./resolver": {
+      "import": {
+        "types": "./dist/resolver/index.d.mts",
+        "default": "./dist/resolver/index.mjs"
+      },
+      "require": {
+        "types": "./dist/resolver/index.d.cts",
+        "default": "./dist/resolver/index.cjs"
+      }
     }
   },
   "main": "./dist/index.umd.cjs",