@nuxt/ui 4.5.0 → 4.6.0

package/dist/unplugin.d.mts

@@ -2,6 +2,7 @@ import * as unplugin from 'unplugin';
 import { Options } from 'unplugin-auto-import/types';
 import { Options as Options$1 } from 'unplugin-vue-components/types';
 import colors from 'tailwindcss/colors';
+import { RuntimeOptions } from '@nuxt/icon';
 import * as ui from '#build/ui';
 import { ModuleOptions } from './module.mjs';
 import { TVConfig } from '../dist/runtime/types/tv.js';
@@ -62,29 +63,37 @@ type AppConfigUI = {
     icons?: Partial<typeof _default>;
     prefix?: string;
 } & TVConfig<typeof ui>;
-interface NuxtUIOptions extends Omit<ModuleOptions, 'fonts' | 'colorMode'> {
+interface NuxtUIOptions extends Omit<ModuleOptions, 'fonts' | 'colorMode' | 'content' | 'experimental'> {
     /** Whether to generate declaration files for auto-imported components. */
     dts?: boolean;
     ui?: AppConfigUI;
+    /**
+     * Default props for the `Icon` component
+     */
+    icon?: Pick<RuntimeOptions, 'customize' | 'size' | 'mode'>;
     /**
      * Enable or disable `@vueuse/core` color-mode integration
      * @defaultValue `true`
+     * @see https://ui.nuxt.com/docs/getting-started/installation/vue#colormode
      */
     colorMode?: boolean;
     /**
-     * Override options for `unplugin-auto-import`
+     * Override options for `unplugin-auto-import`, or `false` to disable composable auto-imports
+     * @see https://ui.nuxt.com/docs/getting-started/installation/vue#autoimport
      */
-    autoImport?: Partial<Options>;
+    autoImport?: false | Partial<Options>;
     /**
-     * Override options for `unplugin-vue-components`
+     * Override options for `unplugin-vue-components`, or `false` to disable component auto-imports
+     * @see https://ui.nuxt.com/docs/getting-started/installation/vue#components
      */
-    components?: Partial<Options$1>;
+    components?: false | Partial<Options$1>;
     /**
      * Router integration mode
      * - `true` (default): Use vue-router integration
      * - `false`: Disable routing, use anchor tags
      * - `'inertia'`: Use Inertia.js compatibility layer
      * @defaultValue `true`
+     * @see https://ui.nuxt.com/docs/getting-started/installation/vue#router
      */
     router?: boolean | 'inertia';
     /**
@@ -94,6 +103,7 @@ interface NuxtUIOptions extends Omit<ModuleOptions, 'fonts' | 'colorMode'> {
     inertia?: boolean;
     /**
      * Additional packages to scan for components using Nuxt UI
+     * @see https://ui.nuxt.com/docs/getting-started/installation/vue#scanpackages
      */
     scanPackages?: string[];
 }

package/dist/unplugin.mjs

@@ -3,7 +3,7 @@ import { join, normalize } from 'pathe';
 import { createUnplugin } from 'unplugin';
 import { defu } from 'defu';
 import tailwind from '@tailwindcss/vite';
-import { g as getTemplates, d as defaultOptions, r as resolveColors, a as getDefaultConfig } from './shared/ui.BrgdrRzy.mjs';
+import { g as getTemplates, p as publicComposables, d as defaultOptions, r as resolveColors, a as getDefaultConfig } from './shared/ui.DJUbBpE2.mjs';
 import fs from 'node:fs';
 import path from 'node:path';
 import MagicString from 'magic-string';
@@ -70,6 +70,7 @@ function PluginsPlugin(options) {
   if (options.colorMode) {
     plugins.push(resolvePathSync("../runtime/vue/plugins/color-mode", { extensions: [".ts", ".mjs", ".js"], url: import.meta.url }));
   }
+  const proseComponents = options.prose || options.mdc ? globSync(["**/*.vue"], { cwd: join(runtimeDir, "components/prose"), absolute: true }) : [];
   return {
     name: "nuxt:ui:plugins",
     enforce: "pre",
@@ -92,12 +93,18 @@ function PluginsPlugin(options) {
     },
     loadInclude: (id) => id === "virtual:nuxt-ui-plugins",
     load() {
+      const proseImports = proseComponents.map((p) => {
+        const name = `Prose${p.split("/").pop()?.replace(/\.vue$/, "")}`;
+        return { name, path: p };
+      });
       return `
         ${plugins.map((p) => `import ${genSafeVariableName(p)} from "${p}"`).join("\n")}
+        ${proseImports.map((c) => `import ${c.name} from "${c.path}"`).join("\n")}
 
 export default {
   install (app, pluginOptions = {}) {
 ${plugins.map((p) => `    app.use(${genSafeVariableName(p)}, pluginOptions)`).join("\n")}
+${proseImports.map((c) => `    app.component('${c.name}', ${c.name})`).join("\n")}
   }
 }
         `;
@@ -196,12 +203,41 @@ function ComponentImportPlugin(options, meta) {
     options.prefix,
     colorModeIgnore
   );
+  const overrideSources = [routerOverrides[routerMode], unpluginComponents].filter((s) => !!s);
+  const internalResolverPlugin = {
+    /**
+     * This plugin aims to ensure we override certain components with Vue-compatible versions:
+     * <UIcon> and <ULink> currently.
+     */
+    name: "nuxt:ui:components",
+    enforce: "pre",
+    resolveId(id, importer) {
+      if (!importer || !normalize(importer).includes(runtimeDir)) {
+        return;
+      }
+      if (!RELATIVE_IMPORT_RE.test(id)) {
+        return;
+      }
+      const filename = id.match(/([^/]+)\.vue$/)?.[1];
+      if (filename) {
+        for (const source of overrideSources) {
+          const resolved = source.resolveFile(filename);
+          if (resolved) return resolved;
+        }
+      }
+    }
+  };
+  if (options.components === false) {
+    return [internalResolverPlugin];
+  }
   const defaultComponents = createComponentSource(
     join(runtimeDir, "components"),
     options.prefix,
     [...colorModeIgnore, "content/*.vue", "prose/**/*.vue"]
   );
-  const sources = [routerOverrides[routerMode], unpluginComponents, defaultComponents].filter((s) => !!s);
+  const proseComponents = options.prose || options.mdc ? createComponentSource(join(runtimeDir, "components/prose"), "Prose") : void 0;
+  const allSources = [routerOverrides[routerMode], unpluginComponents, defaultComponents, proseComponents];
+  const filteredSources = allSources.filter((s) => !!s);
   const packagesToScan = [
     "@nuxt/ui",
     "@compodium/examples",
@@ -219,7 +255,7 @@ function ComponentImportPlugin(options, meta) {
     ],
     resolvers: [
       (componentName) => {
-        for (const source of sources) {
+        for (const source of filteredSources) {
           const resolved = source.resolve(componentName);
           if (resolved) return resolved;
         }
@@ -227,29 +263,7 @@ function ComponentImportPlugin(options, meta) {
     ]
   });
   return [
-    /**
-     * This plugin aims to ensure we override certain components with Vue-compatible versions:
-     * <UIcon> and <ULink> currently.
-     */
-    {
-      name: "nuxt:ui:components",
-      enforce: "pre",
-      resolveId(id, importer) {
-        if (!importer || !normalize(importer).includes(runtimeDir)) {
-          return;
-        }
-        if (!RELATIVE_IMPORT_RE.test(id)) {
-          return;
-        }
-        const filename = id.match(/([^/]+)\.vue$/)?.[1];
-        if (filename) {
-          for (const source of sources) {
-            const resolved = source.resolveFile(filename);
-            if (resolved) return resolved;
-          }
-        }
-      }
-    },
+    internalResolverPlugin,
     AutoImportComponents.raw(pluginOptions, meta)
   ];
 }
@@ -286,9 +300,18 @@ function NuxtEnvironmentPlugin(options) {
 }
 
 function AutoImportPlugin(options, meta) {
+  if (options.autoImport === false) {
+    return { name: "nuxt:ui:auto-import" };
+  }
   const pluginOptions = defu(options.autoImport, {
     dts: options.dts ?? true,
-    dirs: [join(runtimeDir, "composables"), join(runtimeDir, "vue/composables")]
+    imports: [
+      ...Object.entries(publicComposables).map(([file, names]) => ({
+        from: join(runtimeDir, "composables", file),
+        imports: names
+      }))
+    ],
+    dirs: [join(runtimeDir, "vue/composables")]
   });
   return AutoImport.raw(pluginOptions, meta);
 }
@@ -298,7 +321,7 @@ const NuxtUIPlugin = createUnplugin((_options = {}, meta) => {
   const options = defu(_options, { fonts: false }, defaultOptions);
   options.theme = options.theme || {};
   options.theme.colors = resolveColors(options.theme.colors);
-  const appConfig = defu({ ui: options.ui, colorMode: options.colorMode }, { ui: getDefaultConfig(options.theme) });
+  const appConfig = defu({ ui: options.ui, colorMode: options.colorMode, icon: options.icon }, { ui: getDefaultConfig(options.theme) });
   return [
     NuxtEnvironmentPlugin(options),
     ComponentImportPlugin(options, meta),
@@ -312,10 +335,10 @@ const NuxtUIPlugin = createUnplugin((_options = {}, meta) => {
       vite: {
         configResolved(config) {
           const plugins = config.plugins || [];
-          if (plugins.filter((i) => i.name === "unplugin-auto-import").length > 1) {
+          if (options.autoImport !== false && plugins.filter((i) => i.name === "unplugin-auto-import").length > 1) {
             throw new Error("[Nuxt UI] Multiple instances of `unplugin-auto-import` detected. Nuxt UI includes `unplugin-auto-import` already, and you can configure it using `autoImport` option in Nuxt UI module options.");
           }
-          if (plugins.filter((i) => i.name === "unplugin-vue-components").length > 1) {
+          if (options.components !== false && plugins.filter((i) => i.name === "unplugin-vue-components").length > 1) {
             throw new Error("[Nuxt UI] Multiple instances of `unplugin-vue-components` detected. Nuxt UI includes `unplugin-vue-components` already, and you can configure it using `components` option in Nuxt UI module options.");
           }
         }

package/dist/vite.d.mts

@@ -3,6 +3,7 @@ import { NuxtUIOptions } from './unplugin.mjs';
 import 'unplugin-auto-import/types';
 import 'unplugin-vue-components/types';
 import 'tailwindcss/colors';
+import '@nuxt/icon';
 import '#build/ui';
 import './module.mjs';
 import '@nuxt/schema';

package/dist/vite.mjs

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

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@nuxt/ui",
   "description": "A UI Library for Modern Web Apps, powered by Vue & Tailwind CSS.",
-  "version": "4.5.0",
-  "packageManager": "pnpm@10.30.1",
+  "version": "4.6.0",
+  "packageManager": "pnpm@10.32.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nuxt/ui.git"
@@ -112,6 +112,9 @@
     "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",
     "docs": "nuxt dev docs --uiDev",
     "docs:build": "nuxt build docs",
     "lint": "eslint .",
@@ -123,38 +126,38 @@
     "release": "release-it"
   },
   "dependencies": {
-    "@floating-ui/dom": "^1.7.5",
+    "@floating-ui/dom": "^1.7.6",
     "@iconify/vue": "^5.0.0",
-    "@internationalized/date": "^3.11.0",
+    "@internationalized/date": "^3.12.0",
     "@internationalized/number": "^3.6.5",
     "@nuxt/fonts": "^0.14.0",
     "@nuxt/icon": "^2.2.1",
-    "@nuxt/kit": "^4.3.1",
-    "@nuxt/schema": "^4.3.1",
+    "@nuxt/kit": "^4.4.2",
+    "@nuxt/schema": "^4.4.2",
     "@nuxtjs/color-mode": "^3.5.2",
     "@standard-schema/spec": "^1.1.0",
-    "@tailwindcss/postcss": "^4.2.1",
-    "@tailwindcss/vite": "^4.2.1",
+    "@tailwindcss/postcss": "^4.2.2",
+    "@tailwindcss/vite": "^4.2.2",
     "@tanstack/vue-table": "^8.21.3",
-    "@tanstack/vue-virtual": "^3.13.18",
-    "@tiptap/core": "^3.20.0",
-    "@tiptap/extension-bubble-menu": "^3.20.0",
-    "@tiptap/extension-code": "^3.20.0",
-    "@tiptap/extension-collaboration": "^3.20.0",
-    "@tiptap/extension-drag-handle": "^3.20.0",
-    "@tiptap/extension-drag-handle-vue-3": "^3.20.0",
-    "@tiptap/extension-floating-menu": "^3.20.0",
-    "@tiptap/extension-horizontal-rule": "^3.20.0",
-    "@tiptap/extension-image": "^3.20.0",
-    "@tiptap/extension-mention": "^3.20.0",
-    "@tiptap/extension-node-range": "^3.20.0",
-    "@tiptap/extension-placeholder": "^3.20.0",
-    "@tiptap/markdown": "^3.20.0",
-    "@tiptap/pm": "^3.20.0",
-    "@tiptap/starter-kit": "^3.20.0",
-    "@tiptap/suggestion": "^3.20.0",
-    "@tiptap/vue-3": "^3.20.0",
-    "@unhead/vue": "^2.1.4",
+    "@tanstack/vue-virtual": "^3.13.23",
+    "@tiptap/core": "^3.20.4",
+    "@tiptap/extension-bubble-menu": "^3.20.4",
+    "@tiptap/extension-code": "^3.20.4",
+    "@tiptap/extension-collaboration": "^3.20.4",
+    "@tiptap/extension-drag-handle": "^3.20.4",
+    "@tiptap/extension-drag-handle-vue-3": "^3.20.4",
+    "@tiptap/extension-floating-menu": "^3.20.4",
+    "@tiptap/extension-horizontal-rule": "^3.20.4",
+    "@tiptap/extension-image": "^3.20.4",
+    "@tiptap/extension-mention": "^3.20.4",
+    "@tiptap/extension-node-range": "^3.20.4",
+    "@tiptap/extension-placeholder": "^3.20.4",
+    "@tiptap/markdown": "^3.20.4",
+    "@tiptap/pm": "^3.20.4",
+    "@tiptap/starter-kit": "^3.20.4",
+    "@tiptap/suggestion": "^3.20.4",
+    "@tiptap/vue-3": "^3.20.4",
+    "@unhead/vue": "^2.1.12",
     "@vueuse/core": "^14.2.1",
     "@vueuse/integrations": "^14.2.1",
     "@vueuse/shared": "^14.2.1",
@@ -169,46 +172,46 @@
     "embla-carousel-vue": "^8.6.0",
     "embla-carousel-wheel-gestures": "^8.1.0",
     "fuse.js": "^7.1.0",
-    "hookable": "^5.5.3",
+    "hookable": "^6.1.0",
     "knitwork": "^1.3.0",
     "magic-string": "^0.30.21",
-    "mlly": "^1.8.0",
-    "motion-v": "^1.10.3",
+    "mlly": "^1.8.2",
+    "motion-v": "^2.2.0",
     "ohash": "^2.0.11",
     "pathe": "^2.0.3",
-    "reka-ui": "2.8.2",
+    "reka-ui": "2.9.2",
     "scule": "^1.3.0",
     "tailwind-merge": "^3.5.0",
     "tailwind-variants": "^3.2.2",
-    "tailwindcss": "^4.2.1",
+    "tailwindcss": "^4.2.2",
     "tinyglobby": "^0.2.15",
     "ufo": "^1.6.3",
     "unplugin": "^3.0.0",
     "unplugin-auto-import": "^21.0.0",
-    "unplugin-vue-components": "^31.0.0",
+    "unplugin-vue-components": "^31.1.0",
     "vaul-vue": "0.4.1",
-    "vue-component-type-helpers": "^3.2.5"
+    "vue-component-type-helpers": "^3.2.6"
   },
   "devDependencies": {
-    "@nuxt/eslint-config": "^1.15.1",
+    "@nuxt/eslint-config": "^1.15.2",
     "@nuxt/module-builder": "^1.0.2",
     "@nuxt/test-utils": "^4.0.0",
-    "@release-it/conventional-changelog": "^10.0.5",
+    "@release-it/conventional-changelog": "^10.0.6",
     "@tanstack/table-core": "^8.21.3",
-    "@vitejs/plugin-vue": "^6.0.4",
+    "@vitejs/plugin-vue": "^6.0.5",
     "@vue/test-utils": "^2.4.6",
-    "ai": "^6.0.97",
+    "ai": "^6.0.134",
     "embla-carousel": "^8.6.0",
-    "eslint": "^10.0.1",
-    "happy-dom": "^20.7.0",
-    "nuxt": "^4.3.1",
+    "eslint": "^10.1.0",
+    "happy-dom": "^20.8.4",
+    "nuxt": "^4.4.2",
     "release-it": "^19.2.4",
     "unbuild": "^3.6.1",
-    "vitest": "^4.0.18",
+    "vitest": "^4.1.0",
     "vitest-axe": "^0.1.0",
     "vitest-environment-nuxt": "^1.0.1",
-    "vue": "^3.5.28",
-    "vue-tsc": "^3.2.5"
+    "vue": "^3.5.30",
+    "vue-tsc": "^3.2.6"
   },
   "peerDependencies": {
     "@inertiajs/vue3": "^2.0.7",
@@ -216,9 +219,9 @@
     "joi": "^18.0.0",
     "superstruct": "^2.0.0",
     "tailwindcss": "^4.0.0",
-    "typescript": "^5.9.3",
+    "typescript": "^5.6.3",
     "valibot": "^1.0.0",
-    "vue-router": "^4.5.0",
+    "vue-router": "^4.5.0 || ^5.0.0",
     "yup": "^1.7.0",
     "zod": "^3.24.0 || ^4.0.0"
   },
@@ -249,7 +252,7 @@
     }
   },
   "resolutions": {
-    "@nuxt/kit": "^4.3.1",
+    "@nuxt/kit": "^4.4.2",
     "@nuxt/ui": "workspace:*",
     "nitropack": "^2.13.0",
     "unplugin": "^3.0.0",