@nuxt/ui 4.11.2 → 4.11.3

package/dist/module.json

@@ -1,6 +1,6 @@
 {
   "name": "@nuxt/ui",
-  "version": "4.11.2",
+  "version": "4.11.3",
   "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.oNygBd3N.mjs';
+import { d as defaultOptions, r as resolveColors, c as getDefaultConfig, g as getClientBundleIcons, f as publicComposables, a as addTemplates } from './shared/ui.CNAeRcb0.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.2";
+const version = "4.11.3";
 
 const module$1 = defineNuxtModule({
   meta: {

package/dist/runtime/components/App.vue

@@ -12,6 +12,7 @@ import { localeContextInjectionKey } from "../composables/useLocale";
 import { portalTargetInjectionKey } from "../composables/usePortal";
 import UToaster from "./Toaster.vue";
 import UOverlayProvider from "./OverlayProvider.vue";
+import en from "../locale/en";
 const props = defineProps({
   tooltip: { type: Object, required: false },
   toaster: { type: [Object, null], required: false },
@@ -25,7 +26,7 @@ defineSlots();
 const configProviderProps = useForwardProps(reactivePick(props, "scrollBody"));
 const tooltipProps = toRef(() => props.tooltip);
 const toasterProps = toRef(() => props.toaster);
-const locale = toRef(() => props.locale);
+const locale = toRef(() => props.dir ? { ...props.locale || en, dir: props.dir } : props.locale);
 provide(localeContextInjectionKey, locale);
 const portal = toRef(() => props.portal);
 provide(portalTargetInjectionKey, portal);

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

@@ -119,12 +119,14 @@ declare const __VLS_export: <T extends FormSchema, F extends AuthFormField>(__VL
                     silent?: false | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<FormData<T, T_1>>;
                 <T_1 extends boolean>(opts: {
                     name?: keyof InferInput<T> | (keyof InferInput<T>)[] | undefined;
                     silent?: true | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<false | FormData<T, T_1>>;
             };
             errors: {
@@ -153,12 +155,14 @@ declare const __VLS_export: <T extends FormSchema, F extends AuthFormField>(__VL
                     silent?: false | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<FormData<T, T_1>>;
                 <T_1 extends boolean>(opts: {
                     name?: keyof InferInput<T> | (keyof InferInput<T>)[] | undefined;
                     silent?: true | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<false | FormData<T, T_1>>;
             };
             errors: {

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

@@ -119,12 +119,14 @@ declare const __VLS_export: <T extends FormSchema, F extends AuthFormField>(__VL
                     silent?: false | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<FormData<T, T_1>>;
                 <T_1 extends boolean>(opts: {
                     name?: keyof InferInput<T> | (keyof InferInput<T>)[] | undefined;
                     silent?: true | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<false | FormData<T, T_1>>;
             };
             errors: {
@@ -153,12 +155,14 @@ declare const __VLS_export: <T extends FormSchema, F extends AuthFormField>(__VL
                     silent?: false | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<FormData<T, T_1>>;
                 <T_1 extends boolean>(opts: {
                     name?: keyof InferInput<T> | (keyof InferInput<T>)[] | undefined;
                     silent?: true | undefined;
                     nested?: boolean;
                     transform?: T_1 | undefined;
+                    isCurrent?: (() => boolean) | undefined;
                 }): Promise<false | FormData<T, T_1>>;
             };
             errors: {

package/dist/runtime/components/ChatPrompt.vue

@@ -83,7 +83,7 @@ defineExpose({
 </script>
 
 <template>
-  <Primitive :as="props.as" :data-slot="$attrs['data-slot'] ?? 'root'" :class="ui.root({ class: [props.ui?.root, props.class] })" @submit.prevent="submit">
+  <Primitive :as="props.as" :method="props.as === 'form' ? 'post' : void 0" :data-slot="$attrs['data-slot'] ?? 'root'" :class="ui.root({ class: [props.ui?.root, props.class] })" @submit.prevent="submit">
     <div v-if="!!slots.header" data-slot="header" :class="ui.header({ class: props.ui?.header })">
       <slot name="header" />
     </div>

package/dist/runtime/components/DashboardSearch.vue

@@ -60,7 +60,7 @@ const searchTerm = defineModel("searchTerm", { type: String, ...{ default: "" }
 useRuntimeHook("dashboard:search:toggle", () => {
   open.value = !open.value;
 });
-const { t } = useLocale();
+const { t, locale } = useLocale();
 const colorMode = useColorMode();
 const appConfig = useAppConfig();
 const commandPaletteProps = useForwardProps(reactivePick(props, "size", "icon", "trailingIcon", "selectedIcon", "childrenIcon", "placeholder", "autofocus", "loading", "loadingIcon", "close", "closeIcon", "back", "backIcon", "disabled", "highlightOnHover", "labelKey", "descriptionKey", "preserveGroupOrder", "virtualize", "searchDelay"));
@@ -136,8 +136,8 @@ defineExpose({
 <template>
   <UModal
     v-model:open="open"
-    :title="props.title || t('dashboardSearch.title')"
-    :description="props.description || t('dashboardSearch.description')"
+    :title="props.title || locale.messages.dashboardSearch?.title || t('dashboardSearchButton.label')"
+    :description="props.description || locale.messages.dashboardSearch?.description"
     v-bind="modalProps"
     data-slot="modal"
     :class="ui.modal({ class: [props.ui?.modal, props.class] })"

package/dist/runtime/components/DashboardSidebar.vue

@@ -40,7 +40,7 @@ const props = useComponentProps("dashboardSidebar", _props);
 const open = defineModel("open", { type: Boolean, ...{ default: false } });
 const collapsed = defineModel("collapsed", { type: Boolean, ...{ default: false } });
 const route = useRoute();
-const { t } = useLocale();
+const { t, locale } = useLocale();
 const appConfig = useAppConfig();
 const dashboardContext = useDashboard({
   storageKey: "dashboard",
@@ -134,8 +134,8 @@ function toggleOpen() {
 
   <Menu
     v-model:open="open"
-    :title="t('dashboardSidebar.title')"
-    :description="t('dashboardSidebar.description')"
+    :title="locale.messages.dashboardSidebar?.title || t('dashboardSidebarToggle.open')"
+    :description="locale.messages.dashboardSidebar?.description"
     v-bind="menuProps"
     :ui="{
   overlay: ui.overlay({ class: props.ui?.overlay }),

package/dist/runtime/components/EditorToolbar.vue

@@ -138,11 +138,12 @@ function getButtonProps(item) {
     }
   }
   return defu(baseProps, {
-    color: props.color,
-    activeColor: props.activeColor,
-    activeVariant: props.activeVariant,
-    variant: props.variant,
-    size: props.size
+    "aria-label": baseProps.label ? void 0 : item.tooltip?.text,
+    "color": props.color,
+    "activeColor": props.activeColor,
+    "activeVariant": props.activeVariant,
+    "variant": props.variant,
+    "size": props.size
   });
 }
 function getDropdownProps(item) {

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

@@ -79,12 +79,14 @@ declare const __VLS_export: <S extends FormSchema, T extends boolean = true, N e
                 silent?: false | undefined;
                 nested?: boolean;
                 transform?: T_1 | undefined;
+                isCurrent?: () => boolean;
             }): Promise<FormData<S, T_1>>;
             <T_1 extends boolean>(opts: {
                 name?: keyof InferInput<S> | (keyof InferInput<S>)[] | undefined;
                 silent?: true | undefined;
                 nested?: boolean;
                 transform?: T_1 | undefined;
+                isCurrent?: () => boolean;
             }): Promise<FormData<S, T_1> | false>;
         };
         errors: import("vue").Ref<{

package/dist/runtime/components/Form.vue

@@ -3,7 +3,7 @@ import theme from "#build/ui/form";
 </script>
 
 <script setup>
-import { provide, inject, nextTick, ref, onUnmounted, onMounted, computed, useId, readonly, reactive, useTemplateRef } from "vue";
+import { provide, inject, nextTick, ref, onUnmounted, onMounted, computed, useId, readonly, reactive, useTemplateRef, unref, toRaw } from "vue";
 import { useEventBus } from "@vueuse/core";
 import { useAppConfig } from "#imports";
 import { formOptionsInjectionKey, formInputsInjectionKey, formBusInjectionKey, formLoadingInjectionKey, formErrorsInjectionKey, formStateInjectionKey } from "../composables/useFormField";
@@ -54,7 +54,7 @@ const nestedForms = ref(/* @__PURE__ */ new Map());
 onMounted(async () => {
   if (parentBus) {
     await nextTick();
-    parentBus.emit({ type: "attach", validate: _validate, formId, name: props.name, api });
+    parentBus.emit({ type: "attach", validate: _validate, clearDirty, formId, name: props.name, api });
   }
 });
 onUnmounted(() => {
@@ -66,25 +66,37 @@ onUnmounted(() => {
 onMounted(async () => {
   bus.on(async (event) => {
     if (event.type === "attach") {
-      nestedForms.value.set(event.formId, { validate: event.validate, name: event.name, api: event.api });
-    } else if (event.type === "detach") {
-      nestedForms.value.delete(event.formId);
-    } else if (props.validateOn?.includes(event.type) && !loading.value) {
-      if (event.type !== "input") {
-        await _validate({ name: event.name, silent: true, nested: false });
-      } else if (event.eager || blurredFields.has(event.name)) {
-        await _validate({ name: event.name, silent: true, nested: false });
-      }
+      nestedForms.value.set(event.formId, { validate: event.validate, clearDirty: event.clearDirty, name: event.name, api: event.api });
+      return;
     }
-    if (event.type === "blur") {
-      blurredFields.add(event.name);
+    if (event.type === "detach") {
+      nestedForms.value.delete(event.formId);
+      return;
     }
-    if (event.type === "change" || event.type === "input" || event.type === "blur" || event.type === "focus") {
+    if (event.track !== false) {
+      if (event.type === "blur") {
+        blurredFields.add(event.name);
+      }
+      if (event.type === "change" || event.type === "input") {
+        dirtyFields.add(event.name);
+        dirtyEpochs.set(event.name, epoch);
+      }
+      if (event.type === "input") {
+        inputEpochs.set(event.name, epoch);
+      }
       touchedFields.add(event.name);
     }
-    if (event.type === "change" || event.type === "input") {
-      dirtyFields.add(event.name);
-    }
+    if (event.validate === false || !props.validateOn?.includes(event.type) || loading.value) return;
+    if (event.type === "input" && (inputEpochs.get(event.name) !== epoch || !(event.eager || blurredFields.has(event.name)))) return;
+    const run = (validationRuns.get(event.name) ?? 0) + 1;
+    validationRuns.set(event.name, run);
+    const startEpoch = epoch;
+    await _validate({
+      name: event.name,
+      silent: true,
+      nested: false,
+      isCurrent: () => validationRuns.get(event.name) === run && epoch === startEpoch
+    });
   });
 });
 const errors = ref([]);
@@ -94,6 +106,18 @@ provide(formInputsInjectionKey, inputs);
 const dirtyFields = reactive(/* @__PURE__ */ new Set());
 const touchedFields = reactive(/* @__PURE__ */ new Set());
 const blurredFields = reactive(/* @__PURE__ */ new Set());
+let epoch = 0;
+const inputEpochs = /* @__PURE__ */ new Map();
+const validationRuns = /* @__PURE__ */ new Map();
+const dirtyEpochs = /* @__PURE__ */ new Map();
+function clearDirty() {
+  for (const field of dirtyFields) {
+    if (dirtyEpochs.get(field) !== epoch) dirtyFields.delete(field);
+  }
+  for (const form of nestedForms.value.values()) {
+    form.clearDirty();
+  }
+}
 function resolveErrorIds(errs) {
   return errs.map((err) => ({
     ...err,
@@ -115,6 +139,7 @@ async function getErrors() {
 }
 async function _validate(opts = { silent: false, nested: false, transform: false }) {
   const names = opts.name && !Array.isArray(opts.name) ? [opts.name] : opts.name;
+  if (!names) epoch++;
   let nestedResults = [];
   let nestedErrors = [];
   if (!names && opts.nested) {
@@ -126,25 +151,30 @@ async function _validate(opts = { silent: false, nested: false, transform: false
     nestedResults = results.filter((r) => r.output !== void 0);
   }
   const currentErrors = await getErrors();
+  if (opts.isCurrent?.() === false) return false;
   const allErrors = [...currentErrors, ...nestedErrors];
+  let failedErrors = allErrors;
   if (names) {
-    errors.value = filterErrorsByNames(allErrors, names);
+    const matchesNames = nameMatcher(names);
+    failedErrors = allErrors.filter(matchesNames);
+    errors.value = [...errors.value.filter((error) => !matchesNames(error)), ...failedErrors];
   } else {
     errors.value = allErrors;
   }
-  if (errors.value?.length) {
+  if (failedErrors.length) {
     if (opts.silent) return false;
-    throw new FormValidationException(formId, errors.value);
+    throw new FormValidationException(formId, failedErrors);
   }
   if (opts.transform) {
+    let output = transformedState.value;
     nestedResults.forEach((result) => {
       if (result.name) {
         setAtPath(transformedState.value, result.name, result.output);
       } else {
-        Object.assign(transformedState.value, result.output);
+        output = Object.assign(output ?? { ...toRaw(state.value) }, result.output);
       }
     });
-    return transformedState.value ?? state.value;
+    return output ?? state.value;
   }
   return state.value;
 }
@@ -156,7 +186,7 @@ async function onSubmitWrapper(payload) {
   try {
     event.data = await _validate({ nested: true, transform: props.transform });
     await props.onSubmit?.(event);
-    dirtyFields.clear();
+    clearDirty();
   } catch (error) {
     if (!(error instanceof FormValidationException)) {
       throw error;
@@ -215,17 +245,14 @@ function getNestedTarget(target, formPath) {
   }
   return target;
 }
-function filterErrorsByNames(allErrors, names) {
+function nameMatcher(names) {
   const nameSet = new Set(names);
   const patterns = names.map((name) => inputs.value?.[name]?.pattern).filter(Boolean);
-  const matchesNames = (error) => {
+  return (error) => {
     if (!error.name) return false;
     if (nameSet.has(error.name)) return true;
     return patterns.some((pattern) => pattern.test(error.name));
   };
-  const keepErrors = errors.value.filter((error) => !matchesNames(error));
-  const newErrors = allErrors.filter(matchesNames);
-  return [...keepErrors, ...newErrors];
 }
 function filterErrorsByTarget(currentErrors, target) {
   return currentErrors.filter(
@@ -280,7 +307,7 @@ const api = {
   },
   disabled,
   loading,
-  dirty: computed(() => !!dirtyFields.size),
+  dirty: computed(() => !!dirtyFields.size || Array.from(nestedForms.value.values()).some((form) => unref(form.api.dirty))),
   dirtyFields: readonly(dirtyFields),
   blurredFields: readonly(blurredFields),
   touchedFields: readonly(touchedFields)

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

@@ -79,12 +79,14 @@ declare const __VLS_export: <S extends FormSchema, T extends boolean = true, N e
                 silent?: false | undefined;
                 nested?: boolean;
                 transform?: T_1 | undefined;
+                isCurrent?: () => boolean;
             }): Promise<FormData<S, T_1>>;
             <T_1 extends boolean>(opts: {
                 name?: keyof InferInput<S> | (keyof InferInput<S>)[] | undefined;
                 silent?: true | undefined;
                 nested?: boolean;
                 transform?: T_1 | undefined;
+                isCurrent?: () => boolean;
             }): Promise<FormData<S, T_1> | false>;
         };
         errors: import("vue").Ref<{

package/dist/runtime/components/Header.vue

@@ -35,7 +35,7 @@ const slots = defineSlots();
 const props = useComponentProps("header", _props);
 const open = defineModel("open", { type: Boolean, ...{ default: false } });
 const route = useRoute();
-const { t } = useLocale();
+const { t, locale } = useLocale();
 const appConfig = useAppConfig();
 const [DefineLeftTemplate, ReuseLeftTemplate] = createReusableTemplate();
 const [DefineRightTemplate, ReuseRightTemplate] = createReusableTemplate();
@@ -117,8 +117,8 @@ function toggleOpen() {
 
   <Menu
     v-model:open="open"
-    :title="t('header.title')"
-    :description="t('header.description')"
+    :title="locale.messages.header?.title || t('header.open')"
+    :description="locale.messages.header?.description"
     v-bind="menuProps"
     :ui="{
   overlay: ui.overlay({ class: props.ui?.overlay }),

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

@@ -60,8 +60,8 @@ declare const __VLS_export: <T extends PinInputType>(__VLS_props: NonNullable<Aw
         onBlur?: ((event: Event) => any) | undefined;
         onChange?: ((event: Event) => any) | undefined;
         onFocus?: ((event: Event) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: [T] extends ["number"] ? number[] : string[]) => any) | undefined;
-        onComplete?: ((value: [T] extends ["number"] ? number[] : string[]) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: [T] extends ["number"] ? (number | undefined)[] : string[]) => any) | undefined;
+        onComplete?: ((value: [T] extends ["number"] ? (number | undefined)[] : string[]) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -70,7 +70,7 @@ declare const __VLS_export: <T extends PinInputType>(__VLS_props: NonNullable<Aw
     }>) => void;
     attrs: any;
     slots: PinInputSlots;
-    emit: ((evt: "blur", event: Event) => void) & ((evt: "change", event: Event) => void) & ((evt: "focus", event: Event) => void) & ((evt: "update:modelValue", value: [T] extends ["number"] ? number[] : string[]) => void) & ((evt: "complete", value: [T] extends ["number"] ? number[] : string[]) => void);
+    emit: ((evt: "blur", event: Event) => void) & ((evt: "change", event: Event) => void) & ((evt: "focus", event: Event) => void) & ((evt: "update:modelValue", value: [T] extends ["number"] ? (number | undefined)[] : string[]) => void) & ((evt: "complete", value: [T] extends ["number"] ? (number | undefined)[] : string[]) => void);
 }>) => import("vue").VNode & {
     __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };

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

@@ -60,8 +60,8 @@ declare const __VLS_export: <T extends PinInputType>(__VLS_props: NonNullable<Aw
         onBlur?: ((event: Event) => any) | undefined;
         onChange?: ((event: Event) => any) | undefined;
         onFocus?: ((event: Event) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: [T] extends ["number"] ? number[] : string[]) => any) | undefined;
-        onComplete?: ((value: [T] extends ["number"] ? number[] : string[]) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: [T] extends ["number"] ? (number | undefined)[] : string[]) => any) | undefined;
+        onComplete?: ((value: [T] extends ["number"] ? (number | undefined)[] : string[]) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -70,7 +70,7 @@ declare const __VLS_export: <T extends PinInputType>(__VLS_props: NonNullable<Aw
     }>) => void;
     attrs: any;
     slots: PinInputSlots;
-    emit: ((evt: "blur", event: Event) => void) & ((evt: "change", event: Event) => void) & ((evt: "focus", event: Event) => void) & ((evt: "update:modelValue", value: [T] extends ["number"] ? number[] : string[]) => void) & ((evt: "complete", value: [T] extends ["number"] ? number[] : string[]) => void);
+    emit: ((evt: "blur", event: Event) => void) & ((evt: "change", event: Event) => void) & ((evt: "focus", event: Event) => void) & ((evt: "update:modelValue", value: [T] extends ["number"] ? (number | undefined)[] : string[]) => void) & ((evt: "complete", value: [T] extends ["number"] ? (number | undefined)[] : string[]) => void);
 }>) => import("vue").VNode & {
     __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };

package/dist/runtime/components/Select.vue

@@ -167,6 +167,12 @@ function onTriggerClick(open) {
     triggerRef.value?.$el?.dispatchEvent(new PointerEvent("pointerdown", { bubbles: true, button: 0 }));
   }
 }
+function onCloseAutoFocus(event) {
+  const activeElement = document.activeElement;
+  if (activeElement && activeElement !== document.body && !event.target.contains(activeElement)) {
+    event.preventDefault();
+  }
+}
 const viewportRef = useTemplateRef("viewportRef");
 defineExpose({
   triggerRef: toRef(() => triggerRef.value?.$el),
@@ -224,7 +230,7 @@ defineExpose({
 
     <SelectPortal v-bind="portalProps">
       <FieldGroupReset>
-        <SelectContent data-slot="content" :class="ui.content({ class: props.ui?.content })" v-bind="contentProps">
+        <SelectContent data-slot="content" :class="ui.content({ class: props.ui?.content })" v-bind="contentProps" @close-auto-focus="onCloseAutoFocus">
           <slot name="content-top" />
 
           <component :is="isItemAligned ? SelectViewport : 'div'" ref="viewportRef" role="presentation" data-slot="viewport" :class="ui.viewport({ class: props.ui?.viewport })">

package/dist/runtime/components/SelectMenu.vue

@@ -280,6 +280,12 @@ function onMountAutoFocus(event) {
     event.preventDefault();
   }
 }
+function onUnmountAutoFocus(event) {
+  const activeElement = document.activeElement;
+  if (activeElement && activeElement !== document.body && !event.target.contains(activeElement)) {
+    event.preventDefault();
+  }
+}
 const viewportRef = useTemplateRef("viewportRef");
 const comboboxRootRef = useTemplateRef("comboboxRootRef");
 watch(() => props.items, async () => {
@@ -432,7 +438,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 })" @mount-auto-focus="onMountAutoFocus">
+          <FocusScope loop data-slot="focusScope" :class="ui.focusScope({ class: props.ui?.focusScope })" @mount-auto-focus="onMountAutoFocus" @unmount-auto-focus="onUnmountAutoFocus">
             <slot name="content-top" />
 
             <ComboboxInput v-if="!!props.searchInput" v-model="searchTerm" :display-value="() => searchTerm" as-child>

package/dist/runtime/components/content/ContentSearch.vue

@@ -62,7 +62,7 @@ const _props = defineProps({
 const slots = defineSlots();
 const props = useComponentProps("contentSearch", _props);
 const searchTerm = defineModel("searchTerm", { type: String, ...{ default: "" } });
-const { t } = useLocale();
+const { t, locale } = useLocale();
 const { open, mapNavigationItems, mapLinks, mapSearchResults, postFilter } = useContentSearch();
 const colorMode = useColorMode();
 const appConfig = useAppConfig();
@@ -214,8 +214,8 @@ defineExpose({
 <template>
   <UModal
     v-model:open="open"
-    :title="props.title || t('contentSearch.title')"
-    :description="props.description || t('contentSearch.description')"
+    :title="props.title || locale.messages.contentSearch?.title || t('contentSearchButton.label')"
+    :description="props.description || locale.messages.contentSearch?.description"
     v-bind="modalProps"
     data-slot="modal"
     :class="ui.modal({ class: [props.ui?.modal, props.class] })"

package/dist/runtime/composables/useFilter.js

@@ -52,7 +52,13 @@ export function useFilter() {
           result.push({ item, score: s });
         }
       }
-      result.sort((a, b) => a.score - b.score);
+      let start = 0;
+      for (let i = 0; i <= result.length; i++) {
+        if (i === result.length || result[i].score === -1) {
+          result.splice(start, i - start, ...result.slice(start, i).sort((a, b) => a.score - b.score));
+          start = i + 1;
+        }
+      }
       return result.map(({ item }) => item);
     }).filter((group) => group.some((item) => !options.isStructural?.(item)));
   }

package/dist/runtime/composables/useFormField.d.ts

@@ -59,7 +59,7 @@ export declare function useFormField<T>(props?: Props<T>, opts?: {
     highlight: ComputedRef<true | undefined>;
     disabled: ComputedRef<true | undefined>;
     emitFormBlur: () => void;
-    emitFormInput: import("@vueuse/shared").UseDebounceFnReturn<() => void>;
+    emitFormInput: () => import("@vueuse/shared").Promisify<void>;
     emitFormChange: () => void;
     emitFormFocus: () => void;
     ariaAttrs: ComputedRef<Record<string, any> | undefined>;

package/dist/runtime/composables/useFormField.js

@@ -21,9 +21,9 @@ export function useFormField(props, opts) {
       inputId.value = props?.id;
     }
   }
-  function emitFormEvent(type, name, eager) {
+  function emitFormEvent(type, name, flags) {
     if (formBus && formField && name) {
-      formBus.emit({ type, name, eager });
+      formBus.emit({ type, name, ...flags });
     }
   }
   function emitFormBlur() {
@@ -41,13 +41,17 @@ export function useFormField(props, opts) {
       disposed = true;
     });
   }
-  const emitFormInput = useDebounceFn(
+  const validateInput = useDebounceFn(
     () => {
       if (disposed) return;
-      emitFormEvent("input", formField?.value.name, !opts?.deferInputValidation || formField?.value.eagerValidation);
+      emitFormEvent("input", formField?.value.name, { eager: !opts?.deferInputValidation || formField?.value.eagerValidation, track: false });
     },
     formField?.value.validateOnInputDelay ?? formOptions?.value.validateOnInputDelay ?? 0
   );
+  function emitFormInput() {
+    emitFormEvent("input", formField?.value.name, { validate: false });
+    return validateInput();
+  }
   return {
     id: computed(() => props?.id ?? inputId?.value),
     name: computed(() => props?.name ?? formField?.value.name),

package/dist/runtime/composables/useOverlay.d.ts

@@ -41,7 +41,7 @@ interface ManagedOverlayOptionsPrivate<T extends Component> {
     isMounted: boolean;
     isOpen: boolean;
     originalProps?: ComponentProps<T>;
-    resolvePromise?: (value: any) => void;
+    resolvers: ((value: any) => void)[];
 }
 export type Overlay = OverlayOptions<Component> & ManagedOverlayOptionsPrivate<Component>;
 type OverlayInstance<T extends Component> = Omit<ManagedOverlayOptionsPrivate<T>, 'component'> & {
@@ -50,7 +50,7 @@ type OverlayInstance<T extends Component> = Omit<ManagedOverlayOptionsPrivate<T>
     close: (value?: any) => void;
     patch: (props: Partial<ComponentProps<T>>) => void;
 };
-type OpenedOverlay<T extends Component> = Omit<OverlayInstance<T>, 'open' | 'close' | 'patch' | 'modelValue' | 'resolvePromise'> & {
+type OpenedOverlay<T extends Component> = Omit<OverlayInstance<T>, 'open' | 'close' | 'patch' | 'modelValue' | 'resolvers'> & {
     result: Promise<CloseEventArgType<ComponentEmit<T>>>;
 } & Promise<CloseEventArgType<ComponentEmit<T>>>;
 declare function _useOverlay(): {

package/dist/runtime/composables/useOverlay.js

@@ -11,7 +11,8 @@ function _useOverlay() {
       isMounted: !!defaultOpen,
       destroyOnClose: !!destroyOnClose,
       originalProps: props || {},
-      props: { ...props }
+      props: { ...props },
+      resolvers: []
     });
     overlays.push(options);
     return {
@@ -30,7 +31,7 @@ function _useOverlay() {
     }
     overlay.isOpen = true;
     overlay.isMounted = true;
-    const result = new Promise((resolve) => overlay.resolvePromise = resolve);
+    const result = new Promise((resolve) => overlay.resolvers.push(resolve));
     return Object.assign(result, {
       id,
       isMounted: overlay.isMounted,
@@ -41,9 +42,8 @@ function _useOverlay() {
   const close = (id, value) => {
     const overlay = getOverlay(id);
     overlay.isOpen = false;
-    if (overlay.resolvePromise) {
-      overlay.resolvePromise(value);
-      overlay.resolvePromise = void 0;
+    for (const resolve of overlay.resolvers.splice(0)) {
+      resolve(value);
     }
   };
   const closeAll = () => {

package/dist/runtime/index.css

@@ -1 +1 @@
-@import "#build/ui.css";@import "./keyframes.css";@source "./components";@variant light (&:where(.light, .light *));@variant dark (&:where(.dark, .dark *));@layer base{a:focus-visible{outline-offset:0}}@layer theme{:host,:root{--ui-header-height:4rem;--ui-radius:0.25rem;--ui-container:80rem}.light,:host,:root{--ui-text-dimmed:var(--ui-color-neutral-400);--ui-text-muted:var(--ui-color-neutral-500);--ui-text-toned:var(--ui-color-neutral-600);--ui-text:var(--ui-color-neutral-700);--ui-text-highlighted:var(--ui-color-neutral-900);--ui-text-inverted:#fff;--ui-bg:#fff;--ui-bg-muted:var(--ui-color-neutral-50);--ui-bg-elevated:var(--ui-color-neutral-100);--ui-bg-accented:var(--ui-color-neutral-200);--ui-bg-inverted:var(--ui-color-neutral-900);--ui-border:var(--ui-color-neutral-200);--ui-border-muted:var(--ui-color-neutral-200);--ui-border-accented:var(--ui-color-neutral-300);--ui-border-inverted:var(--ui-color-neutral-900)}.dark{--ui-text-dimmed:var(--ui-color-neutral-500);--ui-text-muted:var(--ui-color-neutral-400);--ui-text-toned:var(--ui-color-neutral-300);--ui-text:var(--ui-color-neutral-200);--ui-text-highlighted:#fff;--ui-text-inverted:var(--ui-color-neutral-900);--ui-bg:var(--ui-color-neutral-900);--ui-bg-muted:var(--ui-color-neutral-800);--ui-bg-elevated:var(--ui-color-neutral-800);--ui-bg-accented:var(--ui-color-neutral-700);--ui-bg-inverted:#fff;--ui-border:var(--ui-color-neutral-800);--ui-border-muted:var(--ui-color-neutral-700);--ui-border-accented:var(--ui-color-neutral-700);--ui-border-inverted:#fff}}
+@import "#build/ui.css";@import "./keyframes.css";@source "./components";@custom-variant light (&:where(.light, .light *));@custom-variant dark (&:where(.dark, .dark *));@layer base{a:focus-visible{outline-offset:0}}@layer theme{:host,:root{--ui-header-height:4rem;--ui-radius:0.25rem;--ui-container:80rem}.light,:host,:root{--ui-text-dimmed:var(--ui-color-neutral-400);--ui-text-muted:var(--ui-color-neutral-500);--ui-text-toned:var(--ui-color-neutral-600);--ui-text:var(--ui-color-neutral-700);--ui-text-highlighted:var(--ui-color-neutral-900);--ui-text-inverted:#fff;--ui-bg:#fff;--ui-bg-muted:var(--ui-color-neutral-50);--ui-bg-elevated:var(--ui-color-neutral-100);--ui-bg-accented:var(--ui-color-neutral-200);--ui-bg-inverted:var(--ui-color-neutral-900);--ui-border:var(--ui-color-neutral-200);--ui-border-muted:var(--ui-color-neutral-200);--ui-border-accented:var(--ui-color-neutral-300);--ui-border-inverted:var(--ui-color-neutral-900)}.dark{--ui-text-dimmed:var(--ui-color-neutral-500);--ui-text-muted:var(--ui-color-neutral-400);--ui-text-toned:var(--ui-color-neutral-300);--ui-text:var(--ui-color-neutral-200);--ui-text-highlighted:#fff;--ui-text-inverted:var(--ui-color-neutral-900);--ui-bg:var(--ui-color-neutral-900);--ui-bg-muted:var(--ui-color-neutral-800);--ui-bg-elevated:var(--ui-color-neutral-800);--ui-bg-accented:var(--ui-color-neutral-700);--ui-bg-inverted:#fff;--ui-border:var(--ui-color-neutral-800);--ui-border-muted:var(--ui-color-neutral-700);--ui-border-accented:var(--ui-color-neutral-700);--ui-border-inverted:#fff}}

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

@@ -46,6 +46,7 @@ export type FormChildAttachEvent<S extends FormSchema> = {
     type: 'attach';
     formId: string | number;
     validate: Form<any>['validate'];
+    clearDirty: () => void;
     name?: string;
     api: Form<S>;
 };
@@ -57,6 +58,8 @@ export type FormInputEvent<T extends object> = {
     type: FormEventType;
     name: keyof T;
     eager?: boolean;
+    track?: boolean;
+    validate?: boolean;
 };
 export type FormEvent<T extends object> = FormInputEvent<T> | FormChildAttachEvent<any> | FormChildDetachEvent;
 export interface FormInjectedOptions {

package/dist/runtime/utils/form.js

@@ -1,4 +1,5 @@
 import { toRaw } from "vue";
+import { get, set } from "./index.js";
 export function isSuperStructSchema(schema) {
   return "schema" in schema && typeof schema.coercer === "function" && typeof schema.validator === "function" && typeof schema.refiner === "function";
 }
@@ -50,29 +51,11 @@ export function validateSchema(state, _schema) {
 }
 export function getAtPath(data, path) {
   if (!path) return data;
-  const value = path.split(".").reduce(
-    (value2, key) => value2?.[key],
-    data
-  );
-  return value;
+  return get(data, path);
 }
 export function setAtPath(data, path, value) {
   if (!path) return Object.assign(data, value);
   if (!data) return data;
-  const keys = path.split(".");
-  let current = data;
-  for (let i = 0; i < keys.length - 1; i++) {
-    const key = keys[i];
-    if (current[key] === void 0 || current[key] === null) {
-      if (i + 1 < keys.length && !Number.isNaN(Number(keys[i + 1]))) {
-        current[key] = [];
-      } else {
-        current[key] = {};
-      }
-    }
-    current = current[key];
-  }
-  const lastKey = keys[keys.length - 1];
-  current[lastKey] = value;
+  set(data, path, value);
   return data;
 }

package/dist/runtime/utils/index.js

@@ -15,14 +15,9 @@ export function omit(data, keys) {
   return result;
 }
 export function get(object, path, defaultValue) {
-  if (typeof path === "string") {
-    path = path.split(".").map((key) => {
-      const numKey = Number(key);
-      return Number.isNaN(numKey) ? key : numKey;
-    });
-  }
+  const keys = typeof path === "string" ? path.split(".") : path;
   let result = object;
-  for (const key of path) {
+  for (const key of keys) {
     if (result === void 0 || result === null) {
       return defaultValue;
     }
@@ -31,17 +26,26 @@ export function get(object, path, defaultValue) {
   return result !== void 0 ? result : defaultValue;
 }
 export function set(object, path, value) {
-  if (typeof path === "string") {
-    path = path.split(".").map((key) => {
-      const numKey = Number(key);
-      return Number.isNaN(numKey) ? key : numKey;
-    });
-  }
-  path.reduce((acc, key, i) => {
-    if (acc[key] === void 0) acc[key] = {};
-    if (i === path.length - 1) acc[key] = value;
-    return acc[key];
-  }, object);
+  const keys = [];
+  for (const segment of typeof path === "string" ? path.split(".") : path) {
+    const key = String(segment);
+    if (key === "__proto__" || key === "constructor" || key === "prototype") {
+      return;
+    }
+    keys.push(key);
+  }
+  let current = object;
+  for (let i = 0; i < keys.length; i++) {
+    const key = keys[i];
+    if (i === keys.length - 1) {
+      current[key] = value;
+      return;
+    }
+    if (current[key] === null || typeof current[key] !== "object" && typeof current[key] !== "function") {
+      current[key] = /^(?:0|[1-9]\d*)$/.test(keys[i + 1]) ? [] : {};
+    }
+    current = current[key];
+  }
 }
 export function looseToNumber(val) {
   const n = Number.parseFloat(val);

package/dist/shared/{ui.oNygBd3N.mjs → ui.CNAeRcb0.mjs}

@@ -180,7 +180,7 @@ function applyDefaultVariants(result, defaultVariants) {
 function createComponentPattern(prefix) {
   const escapedPrefix = prefix.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
   const kebabPrefix = kebabCase(prefix).replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-  return new RegExp(`<(?:Lazy)?${escapedPrefix}([A-Z][a-zA-Z]+)|<(?:lazy-)?${kebabPrefix}-([a-z][a-z0-9-]*)|\\b(?:Lazy)?${escapedPrefix}([A-Z][a-zA-Z]+)\\b`, "g");
+  return new RegExp(`<(?:Lazy)?${escapedPrefix}([A-Z][a-zA-Z]+)|(?:<|#\\[|^[ \\t]*|:[ \\t]+)(?:lazy-)?${kebabPrefix}-([a-z][a-z0-9-]*)|\\b(?:Lazy)?${escapedPrefix}([A-Z][a-zA-Z]+)\\b`, "gm");
 }
 function getMatchedComponent(match) {
   if (match[2]) {
@@ -2012,7 +2012,7 @@ const checkboxGroup = (options) => ({
       variant: "table",
       highlight: false,
       class: {
-        item: `${hover}border-accented`
+        item: `${hover}border-accented ${hover}z-[1]`
       }
     },
     { size: "xs", variant: "table", class: { item: "p-2.5" } },
@@ -2040,14 +2040,14 @@ const checkboxGroup = (options) => ({
       color,
       variant: "table",
       class: {
-        item: `has-data-[state=checked]:bg-${color}/10 has-data-[state=checked]:border-${color}/50 has-data-[state=checked]:z-[1]`
+        item: `has-data-[state=checked]:bg-${color}/10 has-data-[state=checked]:border-${color}/50 has-data-[state=checked]:z-[2]`
       }
     })),
     {
       color: "neutral",
       variant: "table",
       class: {
-        item: "has-data-[state=checked]:bg-elevated has-data-[state=checked]:border-inverted/50 has-data-[state=checked]:z-[1]"
+        item: "has-data-[state=checked]:bg-elevated has-data-[state=checked]:border-inverted/50 has-data-[state=checked]:z-[2]"
       }
     },
     {
@@ -3932,7 +3932,7 @@ const inputTags = (options) => {
     slots: {
       root: (prev) => [prev, "flex-wrap"],
       base: () => ["rounded-md", options.theme.transitions && "transition-colors"],
-      item: 'px-1.5 py-0.5 rounded-sm font-medium inline-flex items-center gap-0.5 ring ring-inset ring-accented bg-elevated text-default data-disabled:cursor-not-allowed data-disabled:opacity-75 wrap-anywhere data-[state="active"]:bg-accented',
+      item: "px-1.5 py-0.5 rounded-sm font-medium inline-flex items-center gap-0.5 ring ring-inset ring-accented bg-elevated text-default data-disabled:cursor-not-allowed data-disabled:opacity-75 wrap-anywhere data-[state=active]:bg-accented",
       itemText: "",
       itemDelete: ["inline-flex items-center rounded-xs text-dimmed hover:text-default hover:bg-accented/75 disabled:pointer-events-none", options.theme.transitions && "transition-colors"],
       itemDeleteIcon: "shrink-0",
@@ -4285,7 +4285,7 @@ const marquee = {
     },
     overlay: {
       true: {
-        root: 'before:absolute before:pointer-events-none before:content-[""] before:z-2 before:from-default before:to-transparent after:absolute after:pointer-events-none after:content-[""] after:z-2 after:from-default after:to-transparent'
+        root: "before:absolute before:pointer-events-none before:content-[''] before:z-2 before:from-default before:to-transparent after:absolute after:pointer-events-none after:content-[''] after:z-2 after:from-default after:to-transparent"
       }
     }
   },
@@ -5929,7 +5929,7 @@ const radioGroup = (options) => ({
       variant: ["card", "table"],
       highlight: false,
       class: {
-        item: `${hover}border-accented`
+        item: `${hover}border-accented ${hover}z-[1]`
       }
     },
     { size: "xs", indicator: "hidden", class: { icon: "size-3" } },
@@ -5999,14 +5999,14 @@ const radioGroup = (options) => ({
       color,
       variant: "table",
       class: {
-        item: `has-data-[state=checked]:bg-${color}/10 has-data-[state=checked]:border-${color}/50 has-data-[state=checked]:z-[1]`
+        item: `has-data-[state=checked]:bg-${color}/10 has-data-[state=checked]:border-${color}/50 has-data-[state=checked]:z-[2]`
       }
     })),
     {
       color: "neutral",
       variant: "table",
       class: {
-        item: "has-data-[state=checked]:bg-elevated has-data-[state=checked]:border-inverted/50 has-data-[state=checked]:z-[1]"
+        item: "has-data-[state=checked]:bg-elevated has-data-[state=checked]:border-inverted/50 has-data-[state=checked]:z-[2]"
       }
     },
     {
@@ -6091,7 +6091,7 @@ const select = (options) => {
       value: "truncate pointer-events-none",
       placeholder: "truncate text-dimmed",
       arrow: "fill-bg stroke-default",
-      content: "max-h-[min(15rem,var(--reka-select-content-available-height,15rem))] w-(--reka-select-trigger-width) bg-default shadow-lg rounded-md ring ring-default overflow-hidden origin-(--reka-select-content-transform-origin) pointer-events-auto flex flex-col",
+      content: "max-h-[min(15rem,var(--reka-select-content-available-height,15rem))] w-(--reka-select-trigger-width) bg-default shadow-lg rounded-md ring ring-default overflow-hidden origin-(--reka-select-content-transform-origin) pointer-events-auto data-[state=closed]:pointer-events-none! flex flex-col",
       viewport: "relative divide-y divide-default scroll-py-1 overflow-y-auto flex-1",
       group: "p-1 isolate",
       empty: "text-center text-muted",
@@ -7033,7 +7033,7 @@ const table$1 = (options) => ({
     caption: "sr-only",
     thead: "relative",
     tbody: "isolate [&>tr]:data-[selectable=true]:hover:bg-elevated/50 [&>tr]:data-[selectable=true]:outline-primary/25 [&>tr]:data-[selectable=true]:focus-visible:outline-3 [&>tr]:data-[selectable=true]:-outline-offset-3 divide-y divide-default",
-    tfoot: "relative",
+    tfoot: "relative [&>[data-slot=separator]]:z-2",
     tr: "data-[selected=true]:bg-elevated/50",
     th: "px-4 py-3.5 text-sm text-highlighted text-start font-semibold [&:has([role=checkbox])]:pe-0",
     td: "p-4 text-sm text-muted whitespace-nowrap [&:has([role=checkbox])]:pe-0",
@@ -7904,7 +7904,7 @@ const theme = {
 };
 
 const a = (options) => ({
-  base: ["text-primary border-b border-transparent hover:border-primary font-medium rounded-xs outline-primary/25 focus-visible:outline-3 focus-visible:has-[>code]:outline-0 [&>code]:border-dashed [&>code]:outline-primary/25 focus-visible:[&>code]:outline-3 hover:[&>code]:border-primary hover:[&>code]:text-primary focus-visible:[&>code]:border-primary focus-visible:[&>code]:text-primary", options.theme.transitions && "transition-colors [&>code]:transition-colors"]
+  base: ["text-primary border-b border-transparent hover:border-primary font-medium focus-visible:rounded-xs outline-primary/25 focus-visible:outline-3 focus-visible:has-[>code]:outline-0 [&>code]:border-dashed [&>code]:outline-primary/25 focus-visible:[&>code]:outline-3 hover:[&>code]:border-primary hover:[&>code]:text-primary focus-visible:[&>code]:border-primary focus-visible:[&>code]:text-primary", options.theme.transitions && "transition-colors [&>code]:transition-colors"]
 });
 
 const accordion = {
@@ -8752,6 +8752,7 @@ const themeContent = {
   contentToc: contentToc
 };
 
+const prefixedClasses = ["absolute", "dark:block", "dark:hidden", "dark:inline-block", "focus:outline-none", "hidden", "inset-0", "lg:block", "lg:flex", "lg:hidden", "peer", "sm:block"];
 function getTemplates(options, uiConfig, nuxt, resolve, vue) {
   const templates = [];
   let hasProse = false;
@@ -8828,6 +8829,10 @@ function getTemplates(options, uiConfig, nuxt, resolve, vue) {
         }
       }
     }
+    const prefix = options.theme?.prefix;
+    if (prefix) {
+      sources.push(`@source inline(${JSON.stringify(prefixedClasses.map((cls) => `${prefix}:${cls}`).join(" "))});`);
+    }
     const componentDir = resolve ? resolve("./runtime/components") : void 0;
     if (options.experimental?.componentDetection && nuxt && componentDir && layers.length) {
       const detectedComponents = await detectUsedComponents(

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.oNygBd3N.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.CNAeRcb0.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.oNygBd3N.mjs';
+import './shared/ui.CNAeRcb0.mjs';
 import '../dist/runtime/utils/index.js';
 import 'scule';
 import 'knitwork';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nuxt/ui",
   "description": "A UI Library for Modern Web Apps, powered by Vue & Tailwind CSS.",
-  "version": "4.11.2",
+  "version": "4.11.3",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nuxt/ui.git"
@@ -104,7 +104,7 @@
   ],
   "dependencies": {
     "@floating-ui/dom": "^1.8.0",
-    "@iconify/vue": "^5.0.2",
+    "@iconify/vue": "^5.0.3",
     "@internationalized/date": "^3.12.4",
     "@internationalized/number": "^3.6.8",
     "@nuxt/fonts": "^0.14.0",
@@ -151,12 +151,12 @@
     "fuse.js": "^7.5.0",
     "hookable": "^6.1.2",
     "knitwork": "^1.3.0",
-    "magic-string": "^1.4.1",
+    "magic-string": "^1.4.2",
     "mlly": "^1.8.2",
     "motion-v": "^2.4.4",
     "ohash": "^2.0.12",
     "pathe": "^2.0.3",
-    "reka-ui": "2.10.4",
+    "reka-ui": "2.10.5",
     "scule": "^1.3.0",
     "tailwind-merge": "^3.7.0",
     "tailwind-variants": "^3.2.2",
@@ -178,7 +178,7 @@
     "@tanstack/table-core": "^8.21.3",
     "@vitejs/plugin-vue": "^6.0.9",
     "@vue/test-utils": "^2.5.1",
-    "ai": "^7.0.107",
+    "ai": "^7.0.116",
     "embla-carousel": "^8.6.0",
     "eslint": "^10.11.0",
     "eslint-plugin-better-tailwindcss": "^4.7.0",
@@ -291,11 +291,12 @@
     "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",
+    "typecheck": "vue-tsc --noEmit && nuxt typecheck playgrounds/nuxt && nuxt typecheck docs",
     "test": "vitest",
     "test:vue": "vitest --project vue",
     "test:nuxt": "vitest --project nuxt",
     "bench": "vitest bench --project vue",
+    "size": "node test/bundle/size.mjs",
     "release": "release-it"
   }
 }