@nuxt/ui 4.6.0 on Node.js NPM

✨ Highlights

📁 New Sidebar component

The Sidebar component provides a responsive application sidebar that stays fixed on desktop and transforms into a Modal, Slideover, or Drawer on mobile. It supports three visual variants (sidebar, floating, inset) and three collapsible modes (offcanvas, icon, none):

<template>
  <USidebar v-model:open="open" collapsible="icon">
    <template #header>
      <Logo />
    </template>

    <UNavigationMenu :items="items" />

    <template #footer>
      <UserMenu />
    </template>
  </USidebar>
</template>

🤖 New Chat components

We're introducing 3 new components to build richer AI chat interfaces:

ChatReasoning: A collapsible thinking/reasoning block that automatically tracks streaming duration.
ChatTool: A collapsible row for tool invocations with loading and streaming states.
ChatShimmer: An animated text primitive used internally by ChatReasoning and ChatTool during streaming.

These components integrate seamlessly with the AI SDK message parts:

<template>
  <UChatMessages :messages="messages" :status="status">
    <template #content="{ message }">
      <template v-for="(part, index) in message.parts" :key="index">
        <UChatReasoning
          v-if="isReasoningUIPart(part)"
          :text="part.reasoning"
          :streaming="isReasoningStreaming(message, index, chat)"
        />
        <UChatTool
          v-else-if="isToolInvocationUIPart(part)"
          :text="part.toolInvocation.toolName"
          :streaming="isToolStreaming(part)"
        />
        <MDC v-else-if="isTextUIPart(part)" :value="part.text" />
      </template>
    </template>
  </UChatMessages>
</template>

🚨 Breaking Changes

module: use moduleDependencies to manipulate options (#5384)

This release adopts Nuxt's new moduleDependencies API to declaratively manage sub-module dependencies (@nuxt/icon, @nuxt/fonts, @nuxtjs/color-mode, @nuxtjs/mdc) instead of manually installing them at runtime. This requires Nuxt >= 4.1.0.

🚀 Features

add standalone Vue REPL playground (#6209) (390c4bd)
ChatMessage: add files slot (12d6020)
ChatReasoning: new component (#6175) (6db594e)
ChatShimmer: new component (#6171) (8db9c54)
ChatTool: new component (#6176) (7849534)
Checkbox/Switch: add support for trueValue / falseValue props (#6150) (91c6356)
ContentToc: add highlight-variant prop (#5746) (df080ce)
DropdownMenu: add filter prop (#6153) (a529b43)
FileUpload: add fileImage prop (#5935) (40f9c2e)
Icon: add global options on Vue-only side (#5354) (566fbee)
InputMenu: add autocomplete prop (#6026) (ee8a248)
InputTime: add range prop (#6203) (c124f29)
module: use moduleDependencies to manipulate options (#5384) (dd3f5c5)
Sidebar: new component (#6038) (51a1f85)
Table: implement row pinning (#6115) (fbd60d9)
Tooltip: support global content configuration via App tooltip prop (#6152) (83afd9c)
unplugin: add support for prose components (#6198) (c58b9b2)

🐛 Bug Fixes

Avatar: use resolved size for image width/height (#6008) (6dd0fc4)
ContentNavigation: prevent toggling disabled parent items (#6122) (0f1074f)
ContentSurround: handle RTL mode (#6148) (6921f13)
ContentToc: reset start margin at lg breakpoint (8f24f79)
DashboardSearchButton: use valid HTML structure for trailing slot (#6194) (578a12f)
Editor: guard lift calls for unavailable list extensions (#6100) (065db6b)
Error: support status and statusText properties (1350d62), closes #6134
FileUpload: make multiple, accept and reset options reactive (#6204) (ae093df)
Modal/Slideover/Popover/Drawer: prevent double close:prevent emit (#6226) (9a0d501)
module: only auto-import public composables and allow Vite opt-out (#6197) (886f5fb)
NavigationMenu: improve RTL support for viewport and indicator (#6164) (755867b)
NavigationMenu: propagate disabled state to item in vertical orientation (6d4d651)
ProsePre: move shiki line highlight styles to theme (d663950)

🌐 Locales

locale: add Icelandic language (#6149) (f3ddc60)

👋 New Contributors

@leonardocustodio made their first contribution in #6125
@SveinnB made their first contribution in #6149
@caiotarifa made their first contribution in #6194
@0xA1337 made their first contribution in #6115
@adamgreenhall made their first contribution in #6199
@dropdead619 made their first contribution in #6100
@SusithD made their first contribution in #6122
@howwohmm made their first contribution in #6226

Full Changelog: v4.5.1...v4.6.0

@nuxt/ui 4.6.0 v4.6.0 on Node.js NPM