@nuxt/ui 4.11.1 → 4.11.2

package/dist/unplugin.d.mts

@@ -123,7 +123,8 @@ interface NuxtUIOptions extends Omit<ModuleOptions, 'fonts' | 'colorMode' | 'con
     root?: string;
 }
 declare const runtimeDir: string;
+declare const runtimeUrl: string;
 declare const NuxtUIPlugin: unplugin.UnpluginInstance<NuxtUIOptions | undefined, boolean>;
 
-export { NuxtUIPlugin, runtimeDir };
+export { NuxtUIPlugin, runtimeDir, runtimeUrl };
 export type { NuxtUIOptions };

package/dist/unplugin.mjs

@@ -1,9 +1,9 @@
-import { fileURLToPath } from 'node:url';
+import { fileURLToPath, pathToFileURL } from 'node:url';
 import { join, normalize, relative } from 'pathe';
 import { createUnplugin } from 'unplugin';
 import { defu } from 'defu';
 import tailwind from '@tailwindcss/vite';
-import { e as getTemplates, h as resolveExtraScanDirs, b as detectUsedComponents, f as publicComposables, g as getClientBundleIcons, p as parseIconName, d as defaultOptions, r as resolveColors, c as getDefaultConfig } from './shared/ui.DCJ9twx8.mjs';
+import { e as getTemplates, h as resolveExtraScanDirs, b as detectUsedComponents, f as publicComposables, g as getClientBundleIcons, p as parseIconName, d as defaultOptions, r as resolveColors, c as getDefaultConfig } from './shared/ui.oNygBd3N.mjs';
 import fs from 'node:fs';
 import path from 'node:path';
 import { consola } from 'consola';
@@ -99,11 +99,11 @@ function TemplatePlugin(options, appConfig, componentDir) {
 
 function PluginsPlugin(options) {
   const plugins = globSync(["**/*", "!*.d.ts"], { cwd: join(runtimeDir, "plugins"), absolute: true });
-  plugins.unshift(resolvePathSync("../runtime/vue/plugins/router", { extensions: [".ts", ".mjs", ".js"], url: import.meta.url }));
-  plugins.unshift(resolvePathSync("../runtime/vue/plugins/head", { extensions: [".ts", ".mjs", ".js"], url: import.meta.url }));
-  plugins.unshift(resolvePathSync("../runtime/vue/plugins/icons", { extensions: [".ts", ".mjs", ".js"], url: import.meta.url }));
+  plugins.unshift(resolvePathSync("./vue/plugins/router", { extensions: [".ts", ".mjs", ".js"], url: runtimeUrl }));
+  plugins.unshift(resolvePathSync("./vue/plugins/head", { extensions: [".ts", ".mjs", ".js"], url: runtimeUrl }));
+  plugins.unshift(resolvePathSync("./vue/plugins/icons", { extensions: [".ts", ".mjs", ".js"], url: runtimeUrl }));
   if (options.colorMode) {
-    plugins.push(resolvePathSync("../runtime/vue/plugins/color-mode", { extensions: [".ts", ".mjs", ".js"], url: import.meta.url }));
+    plugins.push(resolvePathSync("./vue/plugins/color-mode", { extensions: [".ts", ".mjs", ".js"], url: runtimeUrl }));
   }
   const proseComponents = options.prose || options.mdc ? globSync(["**/*.vue"], { cwd: join(runtimeDir, "components/prose"), absolute: true }) : [];
   return {
@@ -222,7 +222,8 @@ function createComponentSource(cwd, prefix, ignore = []) {
       const relativePath = paths.get(componentName);
       if (!relativePath) return;
       return join(cwd, relativePath);
-    }
+    },
+    resolvePath: (relativePath) => files.includes(relativePath) ? join(cwd, relativePath) : void 0
   };
 }
 function ComponentImportPlugin(options, meta) {
@@ -239,6 +240,7 @@ function ComponentImportPlugin(options, meta) {
     colorModeIgnore
   );
   const overrideSources = [routerOverrides[routerMode], unpluginComponents].filter((s) => !!s);
+  const componentsDir = `${join(runtimeDir, "components")}/`;
   const internalResolverPlugin = {
     /**
      * This plugin aims to ensure we override certain components with Vue-compatible versions:
@@ -247,6 +249,15 @@ function ComponentImportPlugin(options, meta) {
     name: "nuxt:ui:components",
     enforce: "pre",
     resolveId(id, importer) {
+      const normalizedId = normalize(id);
+      const packagePath = normalizedId.match(PACKAGE_IMPORT_RE)?.[1] ?? (normalizedId.startsWith(componentsDir) && normalizedId.endsWith(".vue") ? normalizedId.slice(componentsDir.length) : void 0);
+      if (packagePath) {
+        for (const source of overrideSources) {
+          const resolved = source.resolvePath(packagePath);
+          if (resolved) return resolved;
+        }
+        return;
+      }
       if (!importer || !normalize(importer).includes(runtimeDir)) {
         return;
       }
@@ -303,11 +314,11 @@ function ComponentImportPlugin(options, meta) {
   ];
 }
 const RELATIVE_IMPORT_RE = /^\.{1,2}\//;
+const PACKAGE_IMPORT_RE = /(?:^|\/node_modules\/)@nuxt\/ui\/(?:dist\/)?(?:runtime\/)?components\/(.+\.vue)$/;
 
 function NuxtEnvironmentPlugin(options) {
   const routerMode = resolveRouterMode(options);
-  const stubsPath = `../runtime/vue/stubs/${routerMode}`;
-  const stubPath = resolvePathSync(stubsPath, { extensions: [".ts", ".mjs", ".js"], url: import.meta.url });
+  const stubPath = resolvePathSync(`./vue/stubs/${routerMode}`, { extensions: [".ts", ".mjs", ".js"], url: runtimeUrl });
   return {
     name: "nuxt:ui",
     enforce: "pre",
@@ -443,6 +454,7 @@ function IconsPlugin(options, appConfig) {
 }
 
 const runtimeDir = normalize(fileURLToPath(new URL("./runtime", import.meta.url)));
+const runtimeUrl = pathToFileURL(`${runtimeDir}/`).href;
 const NuxtUIPlugin = createUnplugin((_options = {}, meta) => {
   const options = defu(_options, { fonts: false }, defaultOptions);
   options.theme = options.theme || {};
@@ -475,4 +487,4 @@ const NuxtUIPlugin = createUnplugin((_options = {}, meta) => {
   ].flat(1);
 });
 
-export { NuxtUIPlugin, runtimeDir };
+export { NuxtUIPlugin, runtimeDir, runtimeUrl };

package/dist/vite.mjs

@@ -4,7 +4,7 @@ import 'pathe';
 import 'unplugin';
 import 'defu';
 import '@tailwindcss/vite';
-import './shared/ui.DCJ9twx8.mjs';
+import './shared/ui.oNygBd3N.mjs';
 import '../dist/runtime/utils/index.js';
 import 'scule';
 import 'knitwork';

package/package.json

@@ -1,8 +1,7 @@
 {
   "name": "@nuxt/ui",
   "description": "A UI Library for Modern Web Apps, powered by Vue & Tailwind CSS.",
-  "version": "4.11.1",
-  "packageManager": "pnpm@11.25.0",
+  "version": "4.11.2",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nuxt/ui.git"
@@ -93,9 +92,6 @@
   "imports": {
     "#build/ui.css": "./.nuxt/ui.static.css"
   },
-  "bin": {
-    "nuxt-ui": "./cli/index.mjs"
-  },
   "style": "./dist/runtime/index.css",
   "main": "./dist/module.mjs",
   "sideEffects": [
@@ -104,35 +100,11 @@
   "files": [
     ".nuxt/ui.static.css",
     "dist",
-    "cli",
     "vue-plugin.d.ts"
   ],
-  "scripts": {
-    "build": "nuxt-module-build build",
-    "prepack": "pnpm build",
-    "dev": "nuxt dev playgrounds/nuxt --uiDev",
-    "dev:build": "nuxt build playgrounds/nuxt",
-    "dev:vue": "pnpm --filter './playgrounds/vue' dev -- --uiDev",
-    "dev:vue:build": "pnpm --filter './playgrounds/vue' build",
-    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxt prepare playgrounds/nuxt && nuxt prepare docs && pnpm dev:vue:build",
-    "repl": "pnpm --filter './playgrounds/repl' dev",
-    "repl:bundle": "pnpm --filter './playgrounds/repl' bundle",
-    "repl:build": "pnpm --filter './playgrounds/repl' build",
-    "repl:prepare": "nuxt-module-build build --stub && mkdir -p .nuxt && echo '{\"compilerOptions\":{}}' > .nuxt/tsconfig.json",
-    "docs": "nuxt dev docs --uiDev",
-    "docs:build": "nuxt build docs",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "typecheck": "vue-tsc --noEmit && nuxt typecheck playgrounds/nuxt && nuxt typecheck docs && cd playgrounds/vue && vue-tsc --noEmit",
-    "test": "vitest",
-    "test:vue": "vitest --project vue",
-    "test:nuxt": "vitest --project nuxt",
-    "bench": "vitest bench --project vue",
-    "release": "release-it"
-  },
   "dependencies": {
     "@floating-ui/dom": "^1.8.0",
-    "@iconify/vue": "^5.0.1",
+    "@iconify/vue": "^5.0.2",
     "@internationalized/date": "^3.12.4",
     "@internationalized/number": "^3.6.8",
     "@nuxt/fonts": "^0.14.0",
@@ -144,7 +116,7 @@
     "@tailwindcss/postcss": "^4.3.3",
     "@tailwindcss/vite": "^4.3.3",
     "@tanstack/vue-table": "^8.21.3",
-    "@tanstack/vue-virtual": "^3.13.36",
+    "@tanstack/vue-virtual": "^3.13.39",
     "@tiptap/core": "^3.31.3",
     "@tiptap/extension-bubble-menu": "^3.31.3",
     "@tiptap/extension-code": "^3.31.3",
@@ -162,7 +134,7 @@
     "@tiptap/starter-kit": "^3.31.3",
     "@tiptap/suggestion": "^3.31.3",
     "@tiptap/vue-3": "^3.31.3",
-    "@unhead/vue": "^3.4.0",
+    "@unhead/vue": "^3.4.1",
     "@vueuse/core": "^14.4.0",
     "@vueuse/integrations": "^14.4.0",
     "@vueuse/shared": "^14.4.0",
@@ -177,21 +149,21 @@
     "embla-carousel-vue": "^8.6.0",
     "embla-carousel-wheel-gestures": "^8.1.0",
     "fuse.js": "^7.5.0",
-    "hookable": "^6.1.1",
+    "hookable": "^6.1.2",
     "knitwork": "^1.3.0",
-    "magic-string": "^1.2.3",
+    "magic-string": "^1.4.1",
     "mlly": "^1.8.2",
-    "motion-v": "^2.4.2",
+    "motion-v": "^2.4.4",
     "ohash": "^2.0.12",
     "pathe": "^2.0.3",
     "reka-ui": "2.10.4",
     "scule": "^1.3.0",
-    "tailwind-merge": "^3.6.0",
+    "tailwind-merge": "^3.7.0",
     "tailwind-variants": "^3.2.2",
     "tailwindcss": "^4.3.3",
     "tinyglobby": "^0.2.17",
     "ufo": "^1.6.4",
-    "unplugin": "^3.3.0",
+    "unplugin": "^3.4.0",
     "unplugin-auto-import": "^21.1.0",
     "unplugin-vue-components": "^32.1.0",
     "vaul-vue": "0.4.1",
@@ -201,29 +173,30 @@
     "@codspeed/vitest-plugin": "^5.7.1",
     "@nuxt/eslint-config": "^1.17.0",
     "@nuxt/module-builder": "^1.0.3",
-    "@nuxt/test-utils": "^4.2.0",
-    "@release-it/conventional-changelog": "^12.0.0",
+    "@nuxt/test-utils": "^4.3.2",
+    "@release-it/conventional-changelog": "^12.0.2",
     "@tanstack/table-core": "^8.21.3",
-    "@vitejs/plugin-vue": "^6.0.8",
-    "@vue/test-utils": "^2.5.0",
-    "ai": "^7.0.93",
+    "@vitejs/plugin-vue": "^6.0.9",
+    "@vue/test-utils": "^2.5.1",
+    "ai": "^7.0.107",
     "embla-carousel": "^8.6.0",
-    "eslint": "^10.10.0",
-    "happy-dom": "^20.14.0",
+    "eslint": "^10.11.0",
+    "eslint-plugin-better-tailwindcss": "^4.7.0",
+    "happy-dom": "^20.14.5",
     "nuxt": "^4.5.2",
-    "release-it": "^21.0.2",
+    "release-it": "^21.1.0",
     "unbuild": "^3.6.1",
     "vitest": "^4.1.11",
     "vitest-axe": "^0.1.0",
     "vitest-environment-nuxt": "^2.0.0",
-    "vue": "^3.5.42",
+    "vue": "^3.5.43",
     "vue-tsc": "^3.3.11"
   },
   "peerDependencies": {
-    "@inertiajs/vue3": "^2.0.7 || ^3.0.0",
-    "@internationalized/date": "^3.0.0",
-    "@internationalized/number": "^3.0.0",
-    "@nuxt/content": "^3.0.0",
+    "@inertiajs/vue3": "^2.0.7 || ^3",
+    "@internationalized/date": "^3",
+    "@internationalized/number": "^3",
+    "@nuxt/content": "^3",
     "@tiptap/core": "^3",
     "@tiptap/extension-bubble-menu": "^3",
     "@tiptap/extension-code": "^3",
@@ -242,14 +215,14 @@
     "@tiptap/suggestion": "^3",
     "@tiptap/vue-3": "^3",
     "ai": "^6 || ^7",
-    "joi": "^18.0.0",
-    "superstruct": "^2.0.0",
-    "tailwindcss": "^4.0.0",
-    "typescript": "^5.6.3 || ^6.0.0 || ^7.0.0",
-    "valibot": "^1.0.0",
-    "vue-router": "^4.5.0 || ^5.0.0",
+    "joi": "^18",
+    "superstruct": "^2",
+    "tailwindcss": "^4",
+    "typescript": "^5.6.3 || ^6 || ^7",
+    "valibot": "^1",
+    "vue-router": "^4.5.0 || ^5",
     "yup": "^1.7.0",
-    "zod": "^3.24.0 || ^4.0.0"
+    "zod": "^3.24.0 || ^4"
   },
   "peerDependenciesMeta": {
     "@inertiajs/vue3": {
@@ -301,5 +274,28 @@
     "tailwind",
     "framework",
     "ui-framework"
-  ]
-}
+  ],
+  "scripts": {
+    "build": "nuxt-module-build build",
+    "cli": "node ./cli/index.mjs",
+    "dev": "nuxt dev playgrounds/nuxt --uiDev",
+    "dev:build": "nuxt build playgrounds/nuxt",
+    "dev:vue": "pnpm --filter './playgrounds/vue' dev -- --uiDev",
+    "dev:vue:build": "pnpm --filter './playgrounds/vue' build",
+    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxt prepare playgrounds/nuxt && nuxt prepare docs && pnpm dev:vue:build",
+    "repl": "pnpm --filter './playgrounds/repl' dev",
+    "repl:bundle": "pnpm --filter './playgrounds/repl' bundle",
+    "repl:build": "pnpm --filter './playgrounds/repl' build",
+    "repl:prepare": "nuxt-module-build build --stub && mkdir -p .nuxt && echo '{\"compilerOptions\":{}}' > .nuxt/tsconfig.json",
+    "docs": "nuxt dev docs --uiDev",
+    "docs:build": "nuxt build docs",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "typecheck": "vue-tsc --noEmit && nuxt typecheck playgrounds/nuxt && nuxt typecheck docs && cd playgrounds/vue && vue-tsc --noEmit",
+    "test": "vitest",
+    "test:vue": "vitest --project vue",
+    "test:nuxt": "vitest --project nuxt",
+    "bench": "vitest bench --project vue",
+    "release": "release-it"
+  }
+}

package/cli/commands/make/component.mjs

@@ -1,86 +0,0 @@
-import { existsSync, promises as fsp } from 'node:fs'
-import { resolve } from 'pathe'
-import { defineCommand } from 'citty'
-import { consola } from 'consola'
-import { splitByCase, upperFirst, camelCase, kebabCase } from 'scule'
-import { appendFile, appendThemeDefault, sortFile } from '../../utils.mjs'
-import templates from '../../templates.mjs'
-
-export default defineCommand({
-  meta: {
-    name: 'component',
-    description: 'Make a new component.'
-  },
-  args: {
-    name: {
-      type: 'positional',
-      required: true,
-      description: 'Name of the component.'
-    },
-    primitive: {
-      type: 'boolean',
-      description: 'Create a primitive component.'
-    },
-    prose: {
-      type: 'boolean',
-      description: 'Create a prose component.'
-    },
-    content: {
-      type: 'boolean',
-      description: 'Create a content component.'
-    },
-    template: {
-      type: 'string',
-      description: 'Only generate template.'
-    }
-  },
-  async setup({ args }) {
-    const name = args.name
-    if (!name) {
-      consola.error('`name` argument is missing!')
-      process.exit(1)
-    }
-
-    const path = resolve('.')
-
-    for (const template of Object.keys(templates)) {
-      if (args.template && template !== args.template) {
-        continue
-      }
-
-      const { filename, contents } = templates[template](args)
-      if (!contents) {
-        continue
-      }
-
-      const filePath = resolve(path, filename)
-
-      if (existsSync(filePath)) {
-        consola.error(`🚨 ${filePath} already exists!`)
-        continue
-      }
-
-      await fsp.writeFile(filePath, contents.trim() + '\n')
-
-      consola.success(`🪄 Generated ${filePath}!`)
-    }
-
-    if (args.template) {
-      return
-    }
-
-    const themePath = resolve(path, `src/theme/${args.prose ? 'prose/' : ''}${args.content ? 'content/' : ''}index.ts`)
-    await appendFile(themePath, `export { default as ${camelCase(name)} } from './${kebabCase(name)}'`)
-    await sortFile(themePath)
-
-    if (!args.prose) {
-      const typesPath = resolve(path, 'src/runtime/types/index.ts')
-      const pascal = splitByCase(name).map(p => upperFirst(p)).join('')
-      await appendFile(typesPath, `export * from '../components/${args.content ? 'content/' : ''}${pascal}.vue'`)
-      await sortFile(typesPath)
-
-      const useComponentPropsPath = resolve(path, 'src/runtime/composables/useComponentProps.ts')
-      await appendThemeDefault(useComponentPropsPath, camelCase(name), `${pascal}Props`)
-    }
-  }
-})

package/cli/commands/make/index.mjs

@@ -1,14 +0,0 @@
-import { defineCommand } from 'citty'
-import component from './component.mjs'
-import locale from './locale.mjs'
-
-export default defineCommand({
-  meta: {
-    name: 'make',
-    description: 'Commands to create new Nuxt UI entities.'
-  },
-  subCommands: {
-    component,
-    locale
-  }
-})

package/cli/commands/make/locale.mjs

@@ -1,93 +0,0 @@
-import { existsSync, promises as fsp } from 'node:fs'
-import { resolve } from 'pathe'
-import { consola } from 'consola'
-import { appendFile, sortFile, normalizeLocale } from '../../utils.mjs'
-import { defineCommand } from 'citty'
-
-export default defineCommand({
-  meta: {
-    name: 'locale',
-    description: 'Make a new locale.'
-  },
-  args: {
-    code: {
-      description: 'Locale code to create. For example: en or en_gb.',
-      required: true
-    },
-    name: {
-      description: 'Locale name in its own language. Defaults to the CLDR name for the code.'
-    },
-    dir: {
-      description: 'Locale direction. Defaults to the CLDR direction for the code.'
-    }
-  },
-  async setup({ args }) {
-    const path = resolve('.')
-    const localePath = resolve(path, `src/runtime/locale`)
-
-    const originLocaleFilePath = resolve(localePath, 'en.ts')
-    const newLocaleFilePath = resolve(localePath, `${args.code}.ts`)
-
-    // Validate locale code
-    if (existsSync(newLocaleFilePath)) {
-      consola.error(`🚨 ${args.code} already exists!`)
-      process.exit(1)
-    }
-
-    if (!args.code.match(/^[a-z]{2,3}(?:_(?:[a-z]{2}|\d{3}))?$/)) {
-      consola.error(`🚨 ${args.code} is not a valid locale code!\nExample: en, en_gb or es_419`)
-      process.exit(1)
-    }
-
-    const code = normalizeLocale(args.code)
-    const language = code.split('-')[0]
-
-    // `Intl.DisplayNames` echoes the input back when the code is unknown to CLDR
-    if (new Intl.DisplayNames(['en'], { type: 'language' }).of(language) === language) {
-      consola.error(`🚨 ${language} is not a known ISO 639 language code!\nFor example, the code for Tajik is tg, not tj.`)
-      process.exit(1)
-    }
-
-    const region = code.split('-')[1]
-    if (region && new Intl.DisplayNames(['en'], { type: 'region' }).of(region) === region) {
-      consola.error(`🚨 ${region} is not a known region code!\nExample: en_gb or pt_br`)
-      process.exit(1)
-    }
-
-    let name = args.name
-    if (!name) {
-      const cldrName = new Intl.DisplayNames([code], { type: 'language', languageDisplay: 'standard' }).of(code)
-      name = cldrName.charAt(0).toLocaleUpperCase(code) + cldrName.slice(1)
-      consola.info(`🌍 Using CLDR name for ${code}: ${name}`)
-    }
-
-    let dir = args.dir
-    if (!dir) {
-      const intlLocale = new Intl.Locale(code)
-      dir = (intlLocale.getTextInfo?.() ?? intlLocale.textInfo)?.direction ?? 'ltr'
-      if (dir === 'rtl') {
-        consola.info(`🌍 Using CLDR direction for ${code}: ${dir}`)
-      }
-    }
-
-    if (!['ltr', 'rtl'].includes(dir)) {
-      consola.error(`🚨 Direction ${dir} not supported!`)
-      process.exit(1)
-    }
-
-    // Create new locale export
-    const localeExportFile = resolve(localePath, `index.ts`)
-    await appendFile(localeExportFile, `export { default as ${args.code} } from './${args.code}'`)
-    await sortFile(localeExportFile)
-
-    // Create new locale file
-    await fsp.copyFile(originLocaleFilePath, newLocaleFilePath)
-    const localeFile = await fsp.readFile(newLocaleFilePath, 'utf-8')
-    const rewrittenLocaleFile = localeFile
-      .replace(/name: '(.*)',/, `name: '${name}',`)
-      .replace(/code: '(.*)',/, `code: '${code}',${dir !== 'ltr' ? `\n  dir: '${dir}',` : ''}`)
-    await fsp.writeFile(newLocaleFilePath, rewrittenLocaleFile)
-
-    consola.success(`🪄 Generated ${newLocaleFilePath}`)
-  }
-})

package/cli/index.mjs

@@ -1,15 +0,0 @@
-#!/usr/bin/env node
-import { defineCommand, runMain } from 'citty'
-import make from './commands/make/index.mjs'
-
-const main = defineCommand({
-  meta: {
-    name: 'nuxt-ui',
-    description: 'Nuxt UI CLI'
-  },
-  subCommands: {
-    make
-  }
-})
-
-runMain(main)

package/cli/package.json

@@ -1,13 +0,0 @@
-{
-  "name": "@nuxt/ui-cli",
-  "type": "module",
-  "exports": {
-    ".": "./index.mjs"
-  },
-  "dependencies": {
-    "citty": "^0.2.2",
-    "consola": "^3.4.2",
-    "pathe": "^2.0.3",
-    "scule": "^1.3.0"
-  }
-}