@nuxt/ui 4.11.0 → 4.11.1

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuxt/ui",
-  "version": "4.11.0",
+  "version": "4.11.1",
   "docs": "https://ui.nuxt.com/docs/getting-started/installation/nuxt",
   "configKey": "ui",
   "compatibility": {

package/dist/module.mjs

@@ -1,6 +1,6 @@
 import { defu } from 'defu';
 import { defineNuxtModule, createResolver, addPlugin, hasNuxtModule, addComponentsDir, addImportsDir, addImports } from '@nuxt/kit';
-import { d as defaultOptions, r as resolveColors, c as getDefaultConfig, g as getClientBundleIcons, f as publicComposables, a as addTemplates } from './shared/ui.DNq7CNkE.mjs';
+import { d as defaultOptions, r as resolveColors, c as getDefaultConfig, g as getClientBundleIcons, f as publicComposables, a as addTemplates } from './shared/ui.DCJ9twx8.mjs';
 import '../dist/runtime/utils/index.js';
 import 'node:url';
 import 'scule';
@@ -14,7 +14,7 @@ import 'tinyglobby';
 import 'mlly';
 
 const name = "@nuxt/ui";
-const version = "4.11.0";
+const version = "4.11.1";
 
 const module$1 = defineNuxtModule({
   meta: {

package/dist/runtime/components/Carousel.d.vue.ts

@@ -66,32 +66,32 @@ export interface CarouselProps<T extends CarouselItem = CarouselItem> extends Om
     items?: T[];
     /**
      * Enable Autoplay plugin
-     * @see https://www.embla-carousel.com/plugins/autoplay/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/autoplay
      */
     autoplay?: boolean | AutoplayOptionsType;
     /**
      * Enable Auto Scroll plugin
-     * @see https://www.embla-carousel.com/plugins/auto-scroll/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/auto-scroll
      */
     autoScroll?: boolean | AutoScrollOptionsType;
     /**
      * Enable Auto Height plugin
-     * @see https://www.embla-carousel.com/plugins/auto-height/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/auto-height
      */
     autoHeight?: boolean | AutoHeightOptionsType;
     /**
      * Enable Class Names plugin
-     * @see https://www.embla-carousel.com/plugins/class-names/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/class-names
      */
     classNames?: boolean | ClassNamesOptionsType;
     /**
      * Enable Fade plugin
-     * @see https://www.embla-carousel.com/plugins/fade/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/fade
      */
     fade?: boolean | FadeOptionsType;
     /**
      * Enable Wheel Gestures plugin
-     * @see https://www.embla-carousel.com/plugins/wheel-gestures/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/wheel-gestures
      */
     wheelGestures?: boolean | WheelGesturesPluginOptions;
     class?: any;

package/dist/runtime/components/Carousel.vue.d.ts

@@ -66,32 +66,32 @@ export interface CarouselProps<T extends CarouselItem = CarouselItem> extends Om
     items?: T[];
     /**
      * Enable Autoplay plugin
-     * @see https://www.embla-carousel.com/plugins/autoplay/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/autoplay
      */
     autoplay?: boolean | AutoplayOptionsType;
     /**
      * Enable Auto Scroll plugin
-     * @see https://www.embla-carousel.com/plugins/auto-scroll/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/auto-scroll
      */
     autoScroll?: boolean | AutoScrollOptionsType;
     /**
      * Enable Auto Height plugin
-     * @see https://www.embla-carousel.com/plugins/auto-height/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/auto-height
      */
     autoHeight?: boolean | AutoHeightOptionsType;
     /**
      * Enable Class Names plugin
-     * @see https://www.embla-carousel.com/plugins/class-names/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/class-names
      */
     classNames?: boolean | ClassNamesOptionsType;
     /**
      * Enable Fade plugin
-     * @see https://www.embla-carousel.com/plugins/fade/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/fade
      */
     fade?: boolean | FadeOptionsType;
     /**
      * Enable Wheel Gestures plugin
-     * @see https://www.embla-carousel.com/plugins/wheel-gestures/
+     * @see https://www.embla-carousel.com/docs/v8/plugins/wheel-gestures
      */
     wheelGestures?: boolean | WheelGesturesPluginOptions;
     class?: any;

package/dist/runtime/components/ChatMessages.d.vue.ts

@@ -39,12 +39,12 @@ export interface ChatMessagesProps<T extends UIMessage[] = UIMessage[]> {
      * The `user` messages props.
      * `{ side: 'right', variant: 'soft' }`{lang="ts-type"}
      */
-    user?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui'>;
+    user?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui' | 'color'>;
     /**
      * The `assistant` messages props.
      * `{ side: 'left', variant: 'naked' }`{lang="ts-type"}
      */
-    assistant?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui'>;
+    assistant?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui' | 'color'>;
     /**
      * Render the messages in a compact style.
      * This is done automatically when used inside a `UChatPalette`{lang="ts-type"}.

package/dist/runtime/components/ChatMessages.vue.d.ts

@@ -39,12 +39,12 @@ export interface ChatMessagesProps<T extends UIMessage[] = UIMessage[]> {
      * The `user` messages props.
      * `{ side: 'right', variant: 'soft' }`{lang="ts-type"}
      */
-    user?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui'>;
+    user?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui' | 'color'>;
     /**
      * The `assistant` messages props.
      * `{ side: 'left', variant: 'naked' }`{lang="ts-type"}
      */
-    assistant?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui'>;
+    assistant?: Pick<PropsBase<T>, 'icon' | 'avatar' | 'variant' | 'side' | 'actions' | 'ui' | 'color'>;
     /**
      * Render the messages in a compact style.
      * This is done automatically when used inside a `UChatPalette`{lang="ts-type"}.

package/dist/runtime/components/Form.vue

@@ -294,7 +294,7 @@ defineExpose(api);
     :id="formId"
     ref="formRef"
     :name="parentBus ? void 0 : props.name"
-    method="post"
+    :method="parentBus ? void 0 : 'post'"
     :class="ui({ class: [props.ui?.base, props.class] })"
     @submit.prevent="onSubmitWrapper"
   >

package/dist/runtime/components/InputNumber.vue

@@ -6,7 +6,7 @@ import theme from "#build/ui/input-number";
 import { onMounted, onScopeDispose, computed, useTemplateRef, toRef } from "vue";
 import { NumberFieldRoot, NumberFieldInput, NumberFieldDecrement, NumberFieldIncrement } from "reka-ui";
 import { useForwardProps } from "../composables/useForwardProps";
-import { reactivePick, useVModel } from "@vueuse/core";
+import { reactivePick } from "@vueuse/core";
 import { useAppConfig } from "#imports";
 import { useComponentProps } from "../composables/useComponentProps";
 import { useFieldGroup } from "../composables/useFieldGroup";
@@ -55,10 +55,9 @@ const _props = defineProps({
 const emits = defineEmits(["update:modelValue", "blur", "change"]);
 defineSlots();
 const props = useComponentProps("inputNumber", _props);
-const modelValue = useVModel(props, "modelValue", emits, { defaultValue: props.defaultValue });
 const { t } = useLocale();
 const appConfig = useAppConfig();
-const rootProps = useForwardProps(reactivePick(props, "as", "stepSnapping", "formatOptions", "disableWheelChange", "invertWheelChange", "required", "readonly", "focusOnChange", "locale"), emits);
+const rootProps = useForwardProps(reactivePick(props, "as", "stepSnapping", "formatOptions", "disableWheelChange", "invertWheelChange", "required", "readonly", "focusOnChange", "locale"));
 const { emitFormBlur, emitFormFocus, emitFormChange, emitFormInput, id, color: formFieldColor, size: formFieldSize, name, highlight: formFieldHighlight, disabled: formFieldDisabled, ariaAttrs } = useFormField(_props);
 const { orientation, size: fieldGroupSize } = useFieldGroup(_props);
 const color = computed(() => formFieldColor.value ?? props.color);
@@ -81,8 +80,12 @@ const decrementIcon = computed(() => props.decrementIcon || (props.orientation =
 const inputRef = useTemplateRef("inputRef");
 function onUpdate(value) {
   if (props.modelModifiers?.optional) {
-    modelValue.value = value = value ?? void 0;
+    value = value ?? void 0;
   }
+  if (value === props.modelValue || value == null && props.modelValue == null) {
+    return;
+  }
+  emits("update:modelValue", value);
   const event = new Event("change", { target: { value } });
   emits("change", event);
   emitFormChange();
@@ -114,7 +117,7 @@ defineExpose({
     v-bind="rootProps"
     :id="id"
     :default-value="props.defaultValue"
-    :model-value="modelValue"
+    :model-value="props.modelValue"
     :min="props.min"
     :max="props.max"
     :step="props.step"

package/dist/runtime/components/Link.vue

@@ -3,16 +3,17 @@ import theme from "#build/ui/link";
 </script>
 
 <script setup>
-import { computed } from "vue";
+import { computed, getCurrentInstance, mergeProps, onMounted, onBeforeUnmount } from "vue";
 import { isEqual } from "ohash/utils";
 import { useForwardProps, Slot } from "reka-ui";
 import { defu } from "defu";
 import { hasProtocol } from "ufo";
 import { reactiveOmit } from "@vueuse/core";
-import { useRoute, useAppConfig, useNuxtApp } from "#imports";
+import { useRoute, useAppConfig, useNuxtApp, onNuxtReady } from "#imports";
 import { mergeClasses } from "../utils";
 import { tv } from "../utils/tv";
 import { isPartiallyEqual } from "../utils/link";
+import { requestIdleCallback, cancelIdleCallback, observeIntersection } from "../utils/prefetch";
 import ULinkBase from "./LinkBase.vue";
 defineOptions({ inheritAttrs: false });
 const props = defineProps({
@@ -126,13 +127,63 @@ function isLinkActive({ route: linkRoute, isActive, isExactActive } = {}) {
   }
   return false;
 }
-function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
+function resolveLinkClass({ route: route2, isActive, isExactActive, prefetched } = {}) {
   const active = isLinkActive({ route: route2, isActive, isExactActive });
+  const prefetchedClass = prefetched ? props.prefetchedClass : void 0;
   if (props.raw) {
-    return [props.class, active ? props.activeClass : props.inactiveClass];
+    return [props.class, active ? props.activeClass : props.inactiveClass, prefetchedClass];
   }
-  return ui.value({ class: props.class, active, disabled: props.disabled });
+  return ui.value({ class: prefetchedClass ? [props.class, prefetchedClass] : props.class, active, disabled: props.disabled });
 }
+const instance = getCurrentInstance();
+let prefetchApi;
+function onPrefetch() {
+  prefetchApi?.prefetch?.(nuxtApp);
+}
+function getPrefetchListeners({ prefetch, shouldPrefetch }, attrs) {
+  if (!prefetch || !shouldPrefetch) {
+    return void 0;
+  }
+  prefetchApi = { prefetch, shouldPrefetch };
+  if (!shouldPrefetch("interaction")) {
+    return void 0;
+  }
+  return mergeProps(
+    { onPointerenter: attrs.onPointerenter, onFocus: attrs.onFocus },
+    { onPointerenter: onPrefetch, onFocus: onPrefetch }
+  );
+}
+let idleId;
+let unobserve = null;
+let unmounted = false;
+onMounted(() => {
+  if (!prefetchApi?.shouldPrefetch?.("visibility")) {
+    return;
+  }
+  const root = instance?.proxy?.$el;
+  const el = root instanceof Element ? root : root?.nextElementSibling;
+  if (!el) {
+    return;
+  }
+  onNuxtReady(() => {
+    if (unmounted) {
+      return;
+    }
+    idleId = requestIdleCallback(() => {
+      unobserve = observeIntersection(el, () => {
+        unobserve?.();
+        unobserve = null;
+        onPrefetch();
+      });
+    });
+  });
+});
+onBeforeUnmount(() => {
+  unmounted = true;
+  cancelIdleCallback(idleId);
+  unobserve?.();
+  unobserve = null;
+});
 </script>
 
 <template>
@@ -142,6 +193,8 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
         v-bind="{
   ...$attrs,
   ...exact && isExactActive ? { 'aria-current': props.ariaCurrentValue } : {},
+  ...rest.prefetched && prefetchedClass ? { class: prefetchedClass } : {},
+  ...getPrefetchListeners(rest, $attrs),
   as,
   type,
   disabled,
@@ -166,9 +219,10 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   navigate,
   rel,
   target: rest.target,
-  isExternal: rest.isExternal
+  isExternal: rest.isExternal,
+  ...getPrefetchListeners(rest, $attrs)
 }"
-      :class="resolveLinkClass({ route: linkRoute, isActive, isExactActive })"
+      :class="resolveLinkClass({ route: linkRoute, isActive, isExactActive, prefetched: rest.prefetched })"
     >
       <slot :active="isLinkActive({ route: linkRoute, isActive, isExactActive })" />
     </ULinkBase>

package/dist/runtime/components/NavigationMenu.vue

@@ -106,13 +106,13 @@ function getAccordionDefaultValue(list, level = 0, listIndex = 0) {
   }, []);
   return props.type === "single" ? indexes[0] : indexes;
 }
-function onLinkTrailingClick(e, item) {
+function onLinkTrailingClick(e, item, trailingTrigger) {
   if (!item.children?.length) {
     return;
   }
   if (props.orientation === "horizontal") {
     e.preventDefault();
-  } else if (props.orientation === "vertical" && !props.collapsed) {
+  } else if (props.orientation === "vertical" && !props.collapsed && trailingTrigger) {
     e.preventDefault();
     e.stopPropagation();
   }
@@ -120,7 +120,7 @@ function onLinkTrailingClick(e, item) {
 </script>
 
 <template>
-  <DefineLinkTemplate v-slot="{ item, active, index }">
+  <DefineLinkTemplate v-slot="{ item, active, index, trailingTrigger }">
     <slot :name="item.slot || 'item'" :item="item" :index="index" :active="active" :ui="ui">
       <slot :name="item.slot ? `${item.slot}-leading` : 'item-leading'" :item="item" :active="active" :index="index" :ui="ui">
         <UAvatar v-if="item.avatar" :size="item.ui?.linkLeadingAvatarSize || props.ui?.linkLeadingAvatarSize || ui.linkLeadingAvatarSize()" v-bind="item.avatar" data-slot="linkLeadingAvatar" :class="ui.linkLeadingAvatar({ class: [props.ui?.linkLeadingAvatar, item.ui?.linkLeadingAvatar], active, disabled: !!item.disabled })" />
@@ -149,12 +149,12 @@ function onLinkTrailingClick(e, item) {
       </span>
 
       <component
-        :is="props.orientation === 'vertical' && item.children?.length && !props.collapsed ? AccordionTrigger : 'span'"
+        :is="props.orientation === 'vertical' && item.children?.length && !props.collapsed && trailingTrigger ? AccordionTrigger : 'span'"
         v-if="item.badge || item.badge === 0 || props.orientation === 'horizontal' && (item.children?.length || !!slots[item.slot ? `${item.slot}-content` : 'item-content']) || props.orientation === 'vertical' && item.children?.length || item.trailingIcon || !!slots[item.slot ? `${item.slot}-trailing` : 'item-trailing']"
-        :as="props.orientation === 'vertical' && item.children?.length && !props.collapsed ? 'span' : void 0"
+        :as="props.orientation === 'vertical' && item.children?.length && !props.collapsed && trailingTrigger ? 'span' : void 0"
         data-slot="linkTrailing"
         :class="ui.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] })"
-        @click="(e) => onLinkTrailingClick(e, item)"
+        @click="(e) => onLinkTrailingClick(e, item, trailingTrigger)"
       >
         <slot :name="item.slot ? `${item.slot}-trailing` : 'item-trailing'" :item="item" :active="active" :index="index" :ui="ui">
           <UBadge
@@ -182,7 +182,7 @@ function onLinkTrailingClick(e, item) {
       :value="getItemValue(item, index, level, listIndex)"
     >
       <div v-if="props.orientation === 'vertical' && item.type === 'label' && !props.collapsed" data-slot="label" :class="ui.label({ class: [props.ui?.label, item.ui?.label, item.class] })">
-        <ReuseLinkTemplate :item="item" :index="index" />
+        <ReuseLinkTemplate :item="item" :index="index" :trailing-trigger="true" />
       </div>
       <ULink v-else-if="item.type !== 'label'" v-slot="{ active, ...slotProps }" v-bind="props.orientation === 'vertical' && item.children?.length && !props.collapsed && item.type === 'trigger' ? {} : pickLinkProps(item)" custom>
         <component
@@ -194,7 +194,7 @@ function onLinkTrailingClick(e, item) {
         >
           <UPopover v-if="props.orientation === 'vertical' && props.collapsed && item.children?.length && (!!props.popover || !!item.popover)" v-bind="{ ...popoverProps, ...typeof item.popover === 'boolean' ? {} : item.popover || {} }" :ui="{ content: ui.content({ class: [props.ui?.content, item.ui?.content] }) }">
             <ULinkBase v-bind="slotProps" data-slot="link" :class="ui.link({ class: [props.ui?.link, item.ui?.link, item.class], active: active || item.active, disabled: !!item.disabled, level: level > 0 })">
-              <ReuseLinkTemplate :item="item" :active="active || item.active" :index="index" />
+              <ReuseLinkTemplate :item="item" :active="active || item.active" :index="index" :trailing-trigger="!!slotProps.href" />
             </ULinkBase>
 
             <template #content="{ close }">
@@ -231,11 +231,11 @@ function onLinkTrailingClick(e, item) {
           </UPopover>
           <UTooltip v-else-if="props.orientation === 'vertical' && props.collapsed && (!!props.tooltip || !!item.tooltip) || props.orientation === 'horizontal' && !!item.tooltip" :text="get(item, props.labelKey)" v-bind="{ ...tooltipProps, ...typeof item.tooltip === 'boolean' ? {} : item.tooltip || {} }">
             <ULinkBase v-bind="slotProps" data-slot="link" :class="ui.link({ class: [props.ui?.link, item.ui?.link, item.class], active: active || item.active, disabled: !!item.disabled, level: level > 0 })">
-              <ReuseLinkTemplate :item="item" :active="active || item.active" :index="index" />
+              <ReuseLinkTemplate :item="item" :active="active || item.active" :index="index" :trailing-trigger="!!slotProps.href" />
             </ULinkBase>
           </UTooltip>
           <ULinkBase v-else v-bind="slotProps" data-slot="link" :class="ui.link({ class: [props.ui?.link, item.ui?.link, item.class], active: active || item.active, disabled: !!item.disabled, level: props.orientation === 'horizontal' || level > 0 })">
-            <ReuseLinkTemplate :item="item" :active="active || item.active" :index="index" />
+            <ReuseLinkTemplate :item="item" :active="active || item.active" :index="index" :trailing-trigger="!!slotProps.href" />
           </ULinkBase>
         </component>
 

package/dist/runtime/components/Select.d.vue.ts

@@ -105,6 +105,8 @@ export interface SelectProps<T extends ArrayOrNested<SelectItem> = ArrayOrNested
     multiple?: M & boolean;
     /** Highlight the ring color like a focus state. */
     highlight?: boolean;
+    /** Keep the mobile text size on all breakpoints. */
+    fixed?: boolean;
     autofocus?: boolean;
     autofocusDelay?: number;
     class?: any;

package/dist/runtime/components/Select.vue

@@ -40,6 +40,7 @@ const _props = defineProps({
   modelModifiers: { type: null, required: false },
   multiple: { type: Boolean, required: false },
   highlight: { type: Boolean, required: false },
+  fixed: { type: Boolean, required: false },
   autofocus: { type: Boolean, required: false },
   autofocusDelay: { type: Number, required: false, default: 0 },
   class: { type: null, required: false },
@@ -90,6 +91,7 @@ const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.select || {} })({
   size: size.value,
   loading: props.loading,
   highlight: highlight.value,
+  fixed: props.fixed,
   leading: isLeading.value || !!props.avatar || !!slots.leading,
   trailing: isTrailing.value || !!slots.trailing,
   fieldGroup: orientation.value,

package/dist/runtime/components/Select.vue.d.ts

@@ -105,6 +105,8 @@ export interface SelectProps<T extends ArrayOrNested<SelectItem> = ArrayOrNested
     multiple?: M & boolean;
     /** Highlight the ring color like a focus state. */
     highlight?: boolean;
+    /** Keep the mobile text size on all breakpoints. */
+    fixed?: boolean;
     autofocus?: boolean;
     autofocusDelay?: number;
     class?: any;

package/dist/runtime/components/SelectMenu.d.vue.ts

@@ -47,6 +47,7 @@ export interface SelectMenuProps<T extends ArrayOrNested<SelectMenuItem> = Array
      * Whether to display the search input or not.
      * Can be an object to pass additional props to the input.
      * `{ placeholder: 'Search...', variant: 'none' }`{lang="ts-type"}
+     * Set `autofocus: false` to prevent the search input from being focused when the menu opens (e.g. to avoid opening the virtual keyboard on touch devices).
      * @defaultValue true
      */
     searchInput?: boolean | Omit<InputProps, 'modelValue' | 'defaultValue'>;
@@ -145,6 +146,8 @@ export interface SelectMenuProps<T extends ArrayOrNested<SelectMenuItem> = Array
     multiple?: M & boolean;
     /** Highlight the ring color like a focus state. */
     highlight?: boolean;
+    /** Keep the mobile text size on all breakpoints. */
+    fixed?: boolean;
     /**
      * Determines if custom user input that does not exist in options can be added.
      * @defaultValue false

package/dist/runtime/components/SelectMenu.vue

@@ -50,6 +50,7 @@ const _props = defineProps({
   modelModifiers: { type: null, required: false },
   multiple: { type: Boolean, required: false },
   highlight: { type: Boolean, required: false },
+  fixed: { type: Boolean, required: false },
   createItem: { type: [Boolean, String, Object], required: false },
   filterFields: { type: Array, required: false },
   ignoreFilter: { type: Boolean, required: false },
@@ -92,7 +93,7 @@ const virtualizerProps = toRef(() => {
     estimateSize: getEstimateSize(filteredItems.value, size.value ?? "md", props.descriptionKey, !!slots["item-description"])
   });
 });
-const searchInputProps = toRef(() => defu(props.searchInput, { placeholder: t("selectMenu.search"), variant: "none" }));
+const searchInputProps = toRef(() => defu(props.searchInput, { placeholder: t("selectMenu.search"), variant: "none", fixed: props.fixed }));
 const { emitFormBlur, emitFormFocus, emitFormInput, emitFormChange, size: formFieldSize, color: formFieldColor, id, name, highlight: formFieldHighlight, disabled: formFieldDisabled, ariaAttrs } = useFormField(_props);
 const { orientation, size: fieldGroupSize } = useFieldGroup(_props);
 const { isLeading, isTrailing, leadingIconName, trailingIconName } = useComponentIcons(computed(() => ({
@@ -127,6 +128,7 @@ const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.selectMenu || {}
   size: size.value,
   loading: props.loading,
   highlight: highlight.value,
+  fixed: props.fixed,
   leading: isLeading.value || !!props.avatar || !!slots.leading,
   trailing: isTrailing.value || !!slots.trailing,
   fieldGroup: orientation.value,
@@ -262,6 +264,11 @@ function isModelValueEmpty(modelValue) {
 function onClear() {
   emits("clear");
 }
+function onMountAutoFocus(event) {
+  if (searchInputProps.value.autofocus === false) {
+    event.preventDefault();
+  }
+}
 const viewportRef = useTemplateRef("viewportRef");
 const comboboxRootRef = useTemplateRef("comboboxRootRef");
 watch(() => props.items, async () => {
@@ -412,7 +419,7 @@ defineExpose({
     <ComboboxPortal v-bind="portalProps">
       <FieldGroupReset>
         <ComboboxContent data-slot="content" :class="ui.content({ class: props.ui?.content })" v-bind="contentProps">
-          <FocusScope trapped data-slot="focusScope" :class="ui.focusScope({ class: props.ui?.focusScope })">
+          <FocusScope trapped data-slot="focusScope" :class="ui.focusScope({ class: props.ui?.focusScope })" @mount-auto-focus="onMountAutoFocus">
             <slot name="content-top" />
 
             <ComboboxInput v-if="!!props.searchInput" v-model="searchTerm" :display-value="() => searchTerm" as-child>

package/dist/runtime/components/SelectMenu.vue.d.ts

@@ -47,6 +47,7 @@ export interface SelectMenuProps<T extends ArrayOrNested<SelectMenuItem> = Array
      * Whether to display the search input or not.
      * Can be an object to pass additional props to the input.
      * `{ placeholder: 'Search...', variant: 'none' }`{lang="ts-type"}
+     * Set `autofocus: false` to prevent the search input from being focused when the menu opens (e.g. to avoid opening the virtual keyboard on touch devices).
      * @defaultValue true
      */
     searchInput?: boolean | Omit<InputProps, 'modelValue' | 'defaultValue'>;
@@ -145,6 +146,8 @@ export interface SelectMenuProps<T extends ArrayOrNested<SelectMenuItem> = Array
     multiple?: M & boolean;
     /** Highlight the ring color like a focus state. */
     highlight?: boolean;
+    /** Keep the mobile text size on all breakpoints. */
+    fixed?: boolean;
     /**
      * Determines if custom user input that does not exist in options can be added.
      * @defaultValue false

package/dist/runtime/components/Slider.vue

@@ -35,7 +35,7 @@ defineOptions({ inheritAttrs: false });
 const props = useComponentProps("slider", _props);
 const modelValue = defineModel({ type: null });
 const appConfig = useAppConfig();
-const rootProps = useForwardProps(reactivePick(props, "as", "orientation", "min", "max", "step", "minStepsBetweenThumbs", "inverted"), emits);
+const rootProps = useForwardProps(reactivePick(props, "as", "orientation", "min", "max", "step", "minStepsBetweenThumbs", "inverted"));
 const { id, emitFormChange, emitFormInput, size: formFieldSize, color: formFieldColor, name, disabled: formFieldDisabled, ariaAttrs } = useFormField(_props);
 const color = computed(() => formFieldColor.value ?? props.color);
 const size = computed(() => formFieldSize.value ?? props.size);

package/dist/runtime/components/Table.vue

@@ -359,7 +359,7 @@ defineExpose({
     </tr>
 
     <tr v-if="row.getIsExpanded()" data-slot="tr" :class="ui.tr({ class: [props.ui?.tr] })">
-      <td :colspan="row.getAllCells().length" data-slot="td" :class="ui.td({ class: [props.ui?.td] })">
+      <td :colspan="row.getVisibleCells().length" data-slot="td" :class="ui.td({ class: [props.ui?.td] })">
         <slot name="expanded" :row="row" />
       </td>
     </tr>
@@ -412,7 +412,7 @@ defineExpose({
 
           <template v-if="virtualizer">
             <tr v-if="virtualPaddingTop > 0" :style="{ height: `${virtualPaddingTop}px` }" aria-hidden="true">
-              <td :colspan="tableApi.getAllLeafColumns().length" />
+              <td :colspan="tableApi.getVisibleLeafColumns().length" />
             </tr>
             <template v-for="virtualRow in virtualItems" :key="centerRows[virtualRow.index]?.id ?? `virtual-${virtualRow.index}`">
               <ReuseRowTemplate
@@ -422,7 +422,7 @@ defineExpose({
               />
             </template>
             <tr v-if="virtualPaddingBottom > 0" :style="{ height: `${virtualPaddingBottom}px` }" aria-hidden="true">
-              <td :colspan="tableApi.getAllLeafColumns().length" />
+              <td :colspan="tableApi.getVisibleLeafColumns().length" />
             </tr>
           </template>
 
@@ -434,13 +434,13 @@ defineExpose({
         </template>
 
         <tr v-else-if="props.loading && !!slots['loading']">
-          <td :colspan="tableApi.getAllLeafColumns().length" data-slot="loading" :class="ui.loading({ class: props.ui?.loading })">
+          <td :colspan="tableApi.getVisibleLeafColumns().length" data-slot="loading" :class="ui.loading({ class: props.ui?.loading })">
             <slot name="loading" />
           </td>
         </tr>
 
         <tr v-else>
-          <td :colspan="tableApi.getAllLeafColumns().length" data-slot="empty" :class="ui.empty({ class: props.ui?.empty })">
+          <td :colspan="tableApi.getVisibleLeafColumns().length" data-slot="empty" :class="ui.empty({ class: props.ui?.empty })">
             <slot name="empty">
               {{ props.empty || t("table.noData") }}
             </slot>

package/dist/runtime/components/color-mode/ColorModeSelect.vue

@@ -32,6 +32,7 @@ const props = defineProps({
   modelModifiers: { type: null, required: false },
   multiple: { type: Boolean, required: false },
   highlight: { type: Boolean, required: false },
+  fixed: { type: Boolean, required: false },
   createItem: { type: [Boolean, String, Object], required: false },
   filterFields: { type: Array, required: false },
   ignoreFilter: { type: Boolean, required: false },

package/dist/runtime/components/locale/LocaleSelect.vue

@@ -31,6 +31,7 @@ const props = defineProps({
   modelModifiers: { type: null, required: false },
   multiple: { type: Boolean, required: false },
   highlight: { type: Boolean, required: false },
+  fixed: { type: Boolean, required: false },
   createItem: { type: [Boolean, String, Object], required: false },
   filterFields: { type: Array, required: false },
   ignoreFilter: { type: Boolean, required: false },

package/dist/runtime/components/prose/CodeTree.vue

@@ -3,7 +3,7 @@ import theme from "#build/ui/prose/code-tree";
 </script>
 
 <script setup>
-import { computed, watch, onBeforeUpdate, ref } from "vue";
+import { computed, watch, onBeforeUpdate, onMounted, ref } from "vue";
 import { TreeRoot, TreeItem } from "reka-ui";
 import { createReusableTemplate } from "@vueuse/core";
 import { useAppConfig } from "#imports";
@@ -28,7 +28,6 @@ const [DefineTreeTemplate, ReuseTreeTemplate] = createReusableTemplate();
 const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.codeTree || {} })());
 const initialPath = props.modelValue ?? props.defaultValue;
 const model = ref(initialPath ? { path: initialPath } : void 0);
-const lastSelectedItem = ref();
 watch(model, (value) => {
   if (value?.path !== props.modelValue) {
     emits("update:modelValue", value?.path);
@@ -37,12 +36,13 @@ watch(model, (value) => {
 watch(() => props.modelValue, (value) => {
   if (value === model.value?.path) return;
   model.value = value ? { path: value } : void 0;
-  const pathsToExpand = getExpandedPaths(value);
-  for (const path of pathsToExpand) {
-    if (!expanded.value.includes(path)) {
-      expanded.value.push(path);
+  const next = [...expanded.value];
+  for (const path of getExpandedPaths(value)) {
+    if (!next.includes(path)) {
+      next.push(path);
     }
   }
+  expanded.value = next;
 });
 const rerenderCount = ref(1);
 const flatItems = computed(() => {
@@ -101,21 +101,34 @@ function getExpandedPaths(path) {
   const parts = path.split("/");
   return parts.slice(0, -1).map((_, index) => parts.slice(0, index + 1).join("/"));
 }
-const expanded = ref(getExpandedPaths(model.value?.path));
-watch(flatItems, (newItems, oldItems) => {
-  if (!props.expandAll) return;
-  const newLabels = newItems.map((i) => i.label).join("\n");
-  const oldLabels = oldItems?.map((i) => i.label).join("\n") ?? "";
-  if (newLabels !== oldLabels) {
-    expanded.value = getExpandedPaths();
+const expandedOverride = ref(props.expandAll ? null : getExpandedPaths(model.value?.path));
+const expanded = computed({
+  get: () => expandedOverride.value ?? getExpandedPaths(),
+  set: (value) => {
+    expandedOverride.value = value;
   }
 });
-watch(model, (value) => {
-  const item = flatItems.value.find((item2) => value?.path === item2.label);
+watch(() => props.expandAll, (value) => {
+  expandedOverride.value = value ? null : getExpandedPaths(model.value?.path);
+});
+onMounted(() => {
+  watch(flatItems, (newItems, oldItems) => {
+    if (!props.expandAll) return;
+    const newLabels = newItems.map((i) => i.label).join("\n");
+    const oldLabels = oldItems?.map((i) => i.label).join("\n") ?? "";
+    if (newLabels !== oldLabels) {
+      expandedOverride.value = null;
+    }
+  });
+});
+let lastFile;
+const currentFile = computed(() => {
+  const item = flatItems.value.find((item2) => model.value?.path === item2.label);
   if (item?.component) {
-    lastSelectedItem.value = item;
+    lastFile = item;
   }
-}, { immediate: true });
+  return lastFile;
+});
 onBeforeUpdate(() => rerenderCount.value++);
 </script>
 
@@ -183,7 +196,7 @@ onBeforeUpdate(() => rerenderCount.value++);
     </TreeRoot>
 
     <div :class="ui.content({ class: props.ui?.content })">
-      <component :is="lastSelectedItem?.component" />
+      <component :is="currentFile?.component" />
     </div>
   </div>
 </template>

package/dist/runtime/utils/form.d.ts

@@ -4,6 +4,6 @@ import type { FormSchema, ValidateReturnSchema } from '../types/form';
 export declare function isSuperStructSchema(schema: any): schema is Struct<any, any>;
 export declare function isStandardSchema(schema: any): schema is StandardSchemaV1;
 export declare function validateStandardSchema(state: any, schema: StandardSchemaV1): Promise<ValidateReturnSchema<typeof state>>;
-export declare function validateSchema<T extends object>(state: T, schema: FormSchema<T>): Promise<ValidateReturnSchema<typeof state>>;
+export declare function validateSchema<T extends object>(state: T, _schema: FormSchema<T>): Promise<ValidateReturnSchema<typeof state>>;
 export declare function getAtPath<T extends object>(data: T, path?: string): any;
 export declare function setAtPath<T extends object>(data: T, path: string, value: any): T;

package/dist/runtime/utils/form.js

@@ -1,3 +1,4 @@
+import { toRaw } from "vue";
 export function isSuperStructSchema(schema) {
   return "schema" in schema && typeof schema.coercer === "function" && typeof schema.validator === "function" && typeof schema.refiner === "function";
 }
@@ -37,7 +38,8 @@ async function validateSuperstructSchema(state, schema) {
     result
   };
 }
-export function validateSchema(state, schema) {
+export function validateSchema(state, _schema) {
+  const schema = toRaw(_schema);
   if (isStandardSchema(schema)) {
     return validateStandardSchema(state, schema);
   } else if (isSuperStructSchema(schema)) {

package/dist/runtime/utils/prefetch.d.ts

@@ -0,0 +1,5 @@
+type IdleCallbackHandle = ReturnType<typeof setTimeout> | number;
+export declare function requestIdleCallback(callback: () => void): IdleCallbackHandle | undefined;
+export declare function cancelIdleCallback(handle: IdleCallbackHandle | undefined): void;
+export declare function observeIntersection(element: Element, callback: () => void): () => void;
+export {};

package/dist/runtime/utils/prefetch.js

@@ -0,0 +1,45 @@
+export function requestIdleCallback(callback) {
+  if (typeof window === "undefined") {
+    return;
+  }
+  if (typeof window.requestIdleCallback === "function") {
+    return window.requestIdleCallback(callback);
+  }
+  return setTimeout(callback, 1);
+}
+export function cancelIdleCallback(handle) {
+  if (typeof window === "undefined" || handle === void 0) {
+    return;
+  }
+  if (typeof window.cancelIdleCallback === "function") {
+    window.cancelIdleCallback(handle);
+    return;
+  }
+  clearTimeout(handle);
+}
+let observer = null;
+const callbacks = /* @__PURE__ */ new Map();
+export function observeIntersection(element, callback) {
+  if (typeof IntersectionObserver === "undefined") {
+    return () => {
+    };
+  }
+  observer ||= new IntersectionObserver((entries) => {
+    for (const entry of entries) {
+      const callback2 = callbacks.get(entry.target);
+      if ((entry.isIntersecting || entry.intersectionRatio > 0) && callback2) {
+        callback2();
+      }
+    }
+  });
+  callbacks.set(element, callback);
+  observer.observe(element);
+  return () => {
+    callbacks.delete(element);
+    observer?.unobserve(element);
+    if (callbacks.size === 0) {
+      observer?.disconnect();
+      observer = null;
+    }
+  };
+}

package/dist/runtime/utils/search.js

@@ -12,19 +12,21 @@ function truncateHTMLFromStart(html, maxLength) {
   let truncated = "";
   let totalLength = 0;
   let insideTag = false;
-  for (let i = html.length - 1; i >= 0; i--) {
-    if (html[i] === ">") {
+  const chars = Array.from(html);
+  for (let i = chars.length - 1; i >= 0; i--) {
+    const char = chars[i];
+    if (char === ">") {
       insideTag = true;
-    } else if (html[i] === "<") {
+    } else if (char === "<") {
       insideTag = false;
-      truncated = html[i] + truncated;
+      truncated = char + truncated;
       continue;
     }
     if (!insideTag) {
       totalLength++;
     }
     if (totalLength <= maxLength) {
-      truncated = html[i] + truncated;
+      truncated = char + truncated;
     } else {
       truncated = "..." + truncated;
       break;
@@ -63,7 +65,7 @@ export function highlight(item, searchTerm, forceKey, omitKeys, useTokenSearch)
     content += escapeHTML(value.substring(nextUnhighlightedRegionStartingIndex));
     const markIndex = content.indexOf("<mark>");
     if (markIndex !== -1) {
-      content = truncateHTMLFromStart(content, content.length - markIndex);
+      content = truncateHTMLFromStart(content, Array.from(content.slice(markIndex)).length);
     }
     return content;
   }

package/dist/runtime/vue/components/color-mode/ColorModeSelect.vue

@@ -32,6 +32,7 @@ const props = defineProps({
   modelModifiers: { type: null, required: false },
   multiple: { type: Boolean, required: false },
   highlight: { type: Boolean, required: false },
+  fixed: { type: Boolean, required: false },
   createItem: { type: [Boolean, String, Object], required: false },
   filterFields: { type: Array, required: false },
   ignoreFilter: { type: Boolean, required: false },

package/dist/shared/{ui.DNq7CNkE.mjs → ui.DCJ9twx8.mjs}

@@ -1753,7 +1753,7 @@ const checkbox = (options) => ({
         root: ""
       },
       card: {
-        root: [`border border-muted rounded-lg ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
+        root: [`border border-default rounded-lg ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
       }
     },
     indicator: {
@@ -1952,10 +1952,14 @@ const checkboxGroup = (options) => ({
       neutral: {}
     },
     variant: {
-      list: {},
-      card: {},
+      list: {
+        fieldset: "flex-wrap"
+      },
+      card: {
+        fieldset: "flex-wrap"
+      },
       table: {
-        item: [`border border-muted ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
+        item: [`border border-default ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
       }
     },
     size: {
@@ -5794,13 +5798,15 @@ const radioGroup = (options) => ({
     },
     variant: {
       list: {
+        fieldset: "flex-wrap",
         item: ""
       },
       card: {
-        item: [`border border-muted rounded-lg ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
+        fieldset: "flex-wrap",
+        item: [`border border-default rounded-lg ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
       },
       table: {
-        item: [`border border-muted ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
+        item: [`border border-default ${hover}bg-elevated/50`, options.theme.transitions && "transition-colors"]
       }
     },
     orientation: {
@@ -6085,7 +6091,6 @@ const select = (options) => {
       }),
       size: {
         xs: {
-          base: "px-2 py-1 text-xs gap-1",
           label: "p-1 text-[10px]/3 gap-1",
           item: "p-1 text-xs gap-1",
           itemLeadingIcon: "size-4",
@@ -6096,7 +6101,6 @@ const select = (options) => {
           empty: "p-2 text-xs"
         },
         sm: {
-          base: "px-2.5 py-1.5 text-xs gap-1.5",
           label: "p-1.5 text-[10px]/3 gap-1.5",
           item: "p-1.5 text-xs gap-1.5",
           itemLeadingIcon: "size-4",
@@ -6107,7 +6111,6 @@ const select = (options) => {
           empty: "p-2.5 text-xs"
         },
         md: {
-          base: "px-2.5 py-1.5 text-sm gap-1.5",
           label: "p-1.5 text-xs gap-1.5",
           item: "p-1.5 text-sm gap-1.5",
           itemLeadingIcon: "size-5",
@@ -6118,7 +6121,6 @@ const select = (options) => {
           empty: "p-2.5 text-sm"
         },
         lg: {
-          base: "px-3 py-2 text-sm gap-2",
           label: "p-2 text-xs gap-2",
           item: "p-2 text-sm gap-2",
           itemLeadingIcon: "size-5",
@@ -6129,7 +6131,6 @@ const select = (options) => {
           empty: "p-3 text-sm"
         },
         xl: {
-          base: "px-3 py-2 text-base gap-2",
           label: "p-2 text-sm gap-2",
           item: "p-2 text-base gap-2",
           itemLeadingIcon: "size-6",

package/dist/unplugin.mjs

@@ -3,7 +3,7 @@ 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.DNq7CNkE.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.DCJ9twx8.mjs';
 import fs from 'node:fs';
 import path from 'node:path';
 import { consola } from 'consola';

package/dist/vite.mjs

@@ -4,7 +4,7 @@ import 'pathe';
 import 'unplugin';
 import 'defu';
 import '@tailwindcss/vite';
-import './shared/ui.DNq7CNkE.mjs';
+import './shared/ui.DCJ9twx8.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.11.0",
-  "packageManager": "pnpm@11.22.0",
+  "version": "4.11.1",
+  "packageManager": "pnpm@11.25.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nuxt/ui.git"
@@ -133,10 +133,10 @@
   "dependencies": {
     "@floating-ui/dom": "^1.8.0",
     "@iconify/vue": "^5.0.1",
-    "@internationalized/date": "^3.12.3",
-    "@internationalized/number": "^3.6.7",
+    "@internationalized/date": "^3.12.4",
+    "@internationalized/number": "^3.6.8",
     "@nuxt/fonts": "^0.14.0",
-    "@nuxt/icon": "^2.5.0",
+    "@nuxt/icon": "^2.5.1",
     "@nuxt/kit": "^4.5.2",
     "@nuxt/schema": "^4.5.2",
     "@nuxtjs/color-mode": "^4.0.1",
@@ -144,25 +144,25 @@
     "@tailwindcss/postcss": "^4.3.3",
     "@tailwindcss/vite": "^4.3.3",
     "@tanstack/vue-table": "^8.21.3",
-    "@tanstack/vue-virtual": "^3.13.35",
-    "@tiptap/core": "^3.29.2",
-    "@tiptap/extension-bubble-menu": "^3.29.2",
-    "@tiptap/extension-code": "^3.29.2",
-    "@tiptap/extension-collaboration": "^3.29.2",
-    "@tiptap/extension-drag-handle": "^3.29.2",
-    "@tiptap/extension-drag-handle-vue-3": "^3.29.2",
-    "@tiptap/extension-floating-menu": "^3.29.2",
-    "@tiptap/extension-horizontal-rule": "^3.29.2",
-    "@tiptap/extension-image": "^3.29.2",
-    "@tiptap/extension-mention": "^3.29.2",
-    "@tiptap/extension-node-range": "^3.29.2",
-    "@tiptap/extension-placeholder": "^3.29.2",
-    "@tiptap/markdown": "^3.29.2",
-    "@tiptap/pm": "^3.29.2",
-    "@tiptap/starter-kit": "^3.29.2",
-    "@tiptap/suggestion": "^3.29.2",
-    "@tiptap/vue-3": "^3.29.2",
-    "@unhead/vue": "^3.3.2",
+    "@tanstack/vue-virtual": "^3.13.36",
+    "@tiptap/core": "^3.31.3",
+    "@tiptap/extension-bubble-menu": "^3.31.3",
+    "@tiptap/extension-code": "^3.31.3",
+    "@tiptap/extension-collaboration": "^3.31.3",
+    "@tiptap/extension-drag-handle": "^3.31.3",
+    "@tiptap/extension-drag-handle-vue-3": "^3.31.3",
+    "@tiptap/extension-floating-menu": "^3.31.3",
+    "@tiptap/extension-horizontal-rule": "^3.31.3",
+    "@tiptap/extension-image": "^3.31.3",
+    "@tiptap/extension-mention": "^3.31.3",
+    "@tiptap/extension-node-range": "^3.31.3",
+    "@tiptap/extension-placeholder": "^3.31.3",
+    "@tiptap/markdown": "^3.31.3",
+    "@tiptap/pm": "^3.31.3",
+    "@tiptap/starter-kit": "^3.31.3",
+    "@tiptap/suggestion": "^3.31.3",
+    "@tiptap/vue-3": "^3.31.3",
+    "@unhead/vue": "^3.4.0",
     "@vueuse/core": "^14.4.0",
     "@vueuse/integrations": "^14.4.0",
     "@vueuse/shared": "^14.4.0",
@@ -179,12 +179,12 @@
     "fuse.js": "^7.5.0",
     "hookable": "^6.1.1",
     "knitwork": "^1.3.0",
-    "magic-string": "^1.2.0",
+    "magic-string": "^1.2.3",
     "mlly": "^1.8.2",
-    "motion-v": "^2.4.0",
+    "motion-v": "^2.4.2",
     "ohash": "^2.0.12",
     "pathe": "^2.0.3",
-    "reka-ui": "2.10.3",
+    "reka-ui": "2.10.4",
     "scule": "^1.3.0",
     "tailwind-merge": "^3.6.0",
     "tailwind-variants": "^3.2.2",
@@ -195,29 +195,29 @@
     "unplugin-auto-import": "^21.1.0",
     "unplugin-vue-components": "^32.1.0",
     "vaul-vue": "0.4.1",
-    "vue-component-type-helpers": "^3.3.10"
+    "vue-component-type-helpers": "^3.3.11"
   },
   "devDependencies": {
     "@codspeed/vitest-plugin": "^5.7.1",
     "@nuxt/eslint-config": "^1.17.0",
     "@nuxt/module-builder": "^1.0.3",
-    "@nuxt/test-utils": "^4.1.0",
+    "@nuxt/test-utils": "^4.2.0",
     "@release-it/conventional-changelog": "^12.0.0",
     "@tanstack/table-core": "^8.21.3",
     "@vitejs/plugin-vue": "^6.0.8",
-    "@vue/test-utils": "^2.4.11",
-    "ai": "^7.0.66",
+    "@vue/test-utils": "^2.5.0",
+    "ai": "^7.0.93",
     "embla-carousel": "^8.6.0",
-    "eslint": "^10.8.1",
-    "happy-dom": "^20.11.2",
+    "eslint": "^10.10.0",
+    "happy-dom": "^20.14.0",
     "nuxt": "^4.5.2",
     "release-it": "^21.0.2",
     "unbuild": "^3.6.1",
-    "vitest": "^4.1.10",
+    "vitest": "^4.1.11",
     "vitest-axe": "^0.1.0",
     "vitest-environment-nuxt": "^2.0.0",
-    "vue": "^3.5.41",
-    "vue-tsc": "^3.3.10"
+    "vue": "^3.5.42",
+    "vue-tsc": "^3.3.11"
   },
   "peerDependencies": {
     "@inertiajs/vue3": "^2.0.7 || ^3.0.0",