@nuxt/ui 4.9.0 → 4.10.0

package/dist/runtime/components/Kbd.vue

@@ -22,7 +22,7 @@ defineSlots();
 const props = useComponentProps("kbd", _props);
 const { getKbdKey } = useKbd();
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.kbd || {} }));
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.kbd || {} }));
 </script>
 
 <template>

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

@@ -100,10 +100,10 @@ export interface LinkSlots {
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LinkProps> & Readonly<{}>, {
-    type: "reset" | "submit" | "button";
     as: any;
-    active: boolean;
+    type: "reset" | "submit" | "button";
     ariaCurrentValue: "page" | "step" | "location" | "date" | "time" | "true" | "false";
+    active: boolean;
     locale: boolean | string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, LinkSlots>;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/components/Link.vue

@@ -51,7 +51,7 @@ const appConfig = useAppConfig();
 const nuxtApp = useNuxtApp();
 const nuxtLinkProps = useForwardProps(reactiveOmit(props, "as", "type", "disabled", "active", "exact", "exactQuery", "exactHash", "activeClass", "inactiveClass", "to", "href", "raw", "custom", "locale", "class"));
 const ui = computed(() => tv({
-  extend: tv(theme),
+  extend: theme,
   ...defu({
     variants: {
       active: {
@@ -80,7 +80,8 @@ const to = computed(() => {
   if (codes?.length && new RegExp(`^/(${codes.join("|")})($|[/?#])`).test(path)) {
     return path;
   }
-  return localePath(path, typeof props.locale === "string" ? props.locale : void 0);
+  const localizedPath = localePath(path, typeof props.locale === "string" ? props.locale : void 0);
+  return localizedPath || path;
 });
 const isInternalLink = computed(() => {
   if (!to.value) return false;
@@ -90,10 +91,17 @@ const isInternalLink = computed(() => {
   if (props.target && props.target !== "_self") return false;
   return true;
 });
-const externalRel = computed(() => {
-  if (props.noRel) return null;
-  if (props.rel) return props.rel;
-  return "noopener noreferrer";
+const rel = computed(() => {
+  if (props.noRel) {
+    return null;
+  }
+  if (props.rel !== void 0) {
+    return props.rel || null;
+  }
+  if (!isInternalLink.value || props.target && props.target !== "_self") {
+    return "noopener noreferrer";
+  }
+  return null;
 });
 function isLinkActive({ route: linkRoute, isActive, isExactActive } = {}) {
   if (props.active !== void 0) {
@@ -139,7 +147,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   disabled,
   href,
   navigate,
-  rel: rest.rel,
+  rel,
   target: rest.target,
   isExternal: rest.isExternal,
   active: isLinkActive({ route: linkRoute, isActive, isExactActive })
@@ -156,7 +164,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   disabled,
   href,
   navigate,
-  rel: rest.rel,
+  rel,
   target: rest.target,
   isExternal: rest.isExternal
 }"
@@ -173,7 +181,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   as,
   type,
   disabled,
-  ...to ? { href: String(to), target: props.target, rel: externalRel, isExternal: true } : {},
+  ...to ? { href: String(to), target: props.target, rel, isExternal: true } : {},
   active: active ?? false
 }"
     />
@@ -185,7 +193,7 @@ function resolveLinkClass({ route: route2, isActive, isExactActive } = {}) {
   as,
   type,
   disabled,
-  ...to ? { href: String(to), target: props.target, rel: externalRel, isExternal: true } : {}
+  ...to ? { href: String(to), target: props.target, rel, isExternal: true } : {}
 }"
     :class="resolveLinkClass()"
   >

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

@@ -100,10 +100,10 @@ export interface LinkSlots {
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LinkProps> & Readonly<{}>, {
-    type: "reset" | "submit" | "button";
     as: any;
-    active: boolean;
+    type: "reset" | "submit" | "button";
     ariaCurrentValue: "page" | "step" | "location" | "date" | "time" | "true" | "false";
+    active: boolean;
     locale: boolean | string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, LinkSlots>;
 type __VLS_WithSlots<T, S> = T & {

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

@@ -1,9 +1,9 @@
-import type { LinkProps } from '../types';
+import type { LinkProps } from './Link.vue';
 export interface LinkBaseProps {
     as?: string;
     type?: string;
     disabled?: boolean;
-    onClick?: ((e: MouseEvent) => void | Promise<void>) | Array<((e: MouseEvent) => void | Promise<void>)>;
+    onClick?: ((e: MouseEvent) => void) | Array<((e: MouseEvent) => void)>;
     href?: string | null;
     navigate?: (e: MouseEvent) => void;
     target?: LinkProps['target'];
@@ -14,8 +14,8 @@ export interface LinkBaseProps {
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LinkBaseProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LinkBaseProps> & Readonly<{}>, {
-    type: string;
     as: string;
+    type: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
 }>;

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

@@ -1,9 +1,9 @@
-import type { LinkProps } from '../types';
+import type { LinkProps } from './Link.vue';
 export interface LinkBaseProps {
     as?: string;
     type?: string;
     disabled?: boolean;
-    onClick?: ((e: MouseEvent) => void | Promise<void>) | Array<((e: MouseEvent) => void | Promise<void>)>;
+    onClick?: ((e: MouseEvent) => void) | Array<((e: MouseEvent) => void)>;
     href?: string | null;
     navigate?: (e: MouseEvent) => void;
     target?: LinkProps['target'];
@@ -14,8 +14,8 @@ export interface LinkBaseProps {
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<LinkBaseProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<LinkBaseProps> & Readonly<{}>, {
-    type: string;
     as: string;
+    type: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
 }>;

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

@@ -2,7 +2,10 @@ import type { VNode } from 'vue';
 import type { ListboxRootEmits, ListboxRootProps } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/listbox';
-import type { AvatarProps, ChipProps, IconProps, InputProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { ChipProps } from './Chip.vue';
+import type { IconProps } from './Icon.vue';
+import type { InputProps } from './Input.vue';
 import type { ModelModifiers, ApplyModifiers } from '../types/input';
 import type { ArrayOrNested, GetItemKeys, GetModelValue, NestedItem } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
@@ -164,6 +167,11 @@ declare const __VLS_export: <T extends ArrayOrNested<ListboxItem>, VK extends Ge
         searchTerm?: string;
     }) & {
         onChange?: ((event: Event) => any) | undefined;
+        onLeave?: ((event: Event) => any) | undefined;
+        onHighlight?: ((payload: {
+            ref: HTMLElement;
+            value: import("reka-ui").AcceptableValue;
+        } | undefined) => any) | undefined;
         "onUpdate:modelValue"?: ((value: Mod extends {
             number: true;
         } ? (Mod extends {
@@ -185,20 +193,18 @@ declare const __VLS_export: <T extends ArrayOrNested<ListboxItem>, VK extends Ge
         } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) | undefined : Mod extends {
             nullable: true;
         } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) => any) | undefined;
-        onHighlight?: ((payload: {
-            ref: HTMLElement;
-            value: import("reka-ui").AcceptableValue;
-        } | undefined) => any) | undefined;
-        "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
         onEntryFocus?: ((event: CustomEvent<any>) => any) | undefined;
-        onLeave?: ((event: Event) => any) | undefined;
+        "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
     expose: (exposed: {}) => void;
     attrs: any;
     slots: ListboxSlots<T>;
-    emit: (((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: Mod extends {
+    emit: (((evt: "change", event: Event) => void) & ((evt: "leave", event: Event) => void) & ((evt: "highlight", payload: {
+        ref: HTMLElement;
+        value: import("reka-ui").AcceptableValue;
+    } | undefined) => void) & ((evt: "update:modelValue", value: Mod extends {
         number: true;
     } ? (Mod extends {
         optional: true;
@@ -218,12 +224,9 @@ declare const __VLS_export: <T extends ArrayOrNested<ListboxItem>, VK extends Ge
         nullable: true;
     } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) | undefined : Mod extends {
         nullable: true;
-    } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) => void) & ((evt: "highlight", payload: {
-        ref: HTMLElement;
-        value: import("reka-ui").AcceptableValue;
-    } | undefined) => void) & ((evt: "entryFocus", event: CustomEvent<any>) => void) & ((evt: "leave", event: Event) => void)) & ((event: "update:searchTerm", value: string) => void);
+    } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) => void) & ((evt: "entryFocus", event: CustomEvent<any>) => void)) & ((event: "update:searchTerm", value: string) => void);
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/runtime/components/Listbox.vue

@@ -82,7 +82,7 @@ const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate({
     }
   }
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.listbox || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.listbox || {} })({
   color: color.value ?? props.color,
   size: size.value ?? props.size,
   highlight: highlight.value ?? props.highlight,
@@ -194,10 +194,10 @@ const filteredItems = computed(() => filteredGroups.value.flatMap((group) => gro
 
   <ListboxRoot
     :id="id"
+    data-slot="root"
     v-bind="{ ...rootProps, ...$attrs, ...ariaAttrs }"
     :disabled="disabled"
     :name="name"
-    data-slot="root"
     :class="ui.root({ class: [props.ui?.root, props.class] })"
     @update:model-value="onUpdate"
   >

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

@@ -2,7 +2,10 @@ import type { VNode } from 'vue';
 import type { ListboxRootEmits, ListboxRootProps } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/listbox';
-import type { AvatarProps, ChipProps, IconProps, InputProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { ChipProps } from './Chip.vue';
+import type { IconProps } from './Icon.vue';
+import type { InputProps } from './Input.vue';
 import type { ModelModifiers, ApplyModifiers } from '../types/input';
 import type { ArrayOrNested, GetItemKeys, GetModelValue, NestedItem } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
@@ -164,6 +167,11 @@ declare const __VLS_export: <T extends ArrayOrNested<ListboxItem>, VK extends Ge
         searchTerm?: string;
     }) & {
         onChange?: ((event: Event) => any) | undefined;
+        onLeave?: ((event: Event) => any) | undefined;
+        onHighlight?: ((payload: {
+            ref: HTMLElement;
+            value: import("reka-ui").AcceptableValue;
+        } | undefined) => any) | undefined;
         "onUpdate:modelValue"?: ((value: Mod extends {
             number: true;
         } ? (Mod extends {
@@ -185,20 +193,18 @@ declare const __VLS_export: <T extends ArrayOrNested<ListboxItem>, VK extends Ge
         } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) | undefined : Mod extends {
             nullable: true;
         } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) => any) | undefined;
-        onHighlight?: ((payload: {
-            ref: HTMLElement;
-            value: import("reka-ui").AcceptableValue;
-        } | undefined) => any) | undefined;
-        "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
         onEntryFocus?: ((event: CustomEvent<any>) => any) | undefined;
-        onLeave?: ((event: Event) => any) | undefined;
+        "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
     expose: (exposed: {}) => void;
     attrs: any;
     slots: ListboxSlots<T>;
-    emit: (((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: Mod extends {
+    emit: (((evt: "change", event: Event) => void) & ((evt: "leave", event: Event) => void) & ((evt: "highlight", payload: {
+        ref: HTMLElement;
+        value: import("reka-ui").AcceptableValue;
+    } | undefined) => void) & ((evt: "update:modelValue", value: Mod extends {
         number: true;
     } ? (Mod extends {
         optional: true;
@@ -218,12 +224,9 @@ declare const __VLS_export: <T extends ArrayOrNested<ListboxItem>, VK extends Ge
         nullable: true;
     } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) | undefined : Mod extends {
         nullable: true;
-    } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) => void) & ((evt: "highlight", payload: {
-        ref: HTMLElement;
-        value: import("reka-ui").AcceptableValue;
-    } | undefined) => void) & ((evt: "entryFocus", event: CustomEvent<any>) => void) & ((evt: "leave", event: Event) => void)) & ((event: "update:searchTerm", value: string) => void);
+    } ? GetModelValue<T, VK, M, undefined> | null : GetModelValue<T, VK, M, undefined>) => void) & ((evt: "entryFocus", event: CustomEvent<any>) => void)) & ((event: "update:searchTerm", value: string) => void);
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/runtime/components/Main.vue

@@ -16,7 +16,7 @@ const _props = defineProps({
 defineSlots();
 const props = useComponentProps("main", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.main || {} }));
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.main || {} }));
 </script>
 
 <template>

package/dist/runtime/components/Marquee.vue

@@ -21,7 +21,7 @@ const _props = defineProps({
 defineSlots();
 const props = useComponentProps("marquee", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.marquee || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.marquee || {} })({
   pauseOnHover: props.pauseOnHover,
   orientation: props.orientation,
   reverse: props.reverse,

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

@@ -2,7 +2,9 @@ import type { DialogRootProps, DialogRootEmits, DialogContentProps, DialogConten
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/modal';
-import type { ButtonProps, IconProps, LinkPropsKeys } from '../types';
+import type { ButtonProps } from './Button.vue';
+import type { IconProps } from './Icon.vue';
+import type { LinkPropsKeys } from './Link.vue';
 import type { EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Modal = ComponentConfig<typeof theme, AppConfig, 'modal'>;
@@ -90,24 +92,24 @@ declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ModalProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     enter: () => any;
-    "update:open": (value: boolean) => any;
-    "after:leave": () => any;
     leave: () => any;
+    "after:leave": () => any;
     "after:enter": () => any;
     "close:prevent": () => any;
+    "update:open": (value: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<ModalProps> & Readonly<{
     onEnter?: (() => any) | undefined;
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    "onAfter:leave"?: (() => any) | undefined;
     onLeave?: (() => any) | undefined;
+    "onAfter:leave"?: (() => any) | undefined;
     "onAfter:enter"?: (() => any) | undefined;
     "onClose:prevent"?: (() => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
     close: boolean | Omit<ButtonProps, LinkPropsKeys>;
     modal: boolean;
     transition: boolean;
-    portal: boolean | string | HTMLElement;
     overlay: boolean;
+    portal: boolean | string | HTMLElement;
     dismissible: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ModalSlots>;
 type __VLS_WithSlots<T, S> = T & {

package/dist/runtime/components/Modal.vue

@@ -31,14 +31,15 @@ const _props = defineProps({
   ui: { type: Object, required: false },
   open: { type: Boolean, required: false },
   defaultOpen: { type: Boolean, required: false },
-  modal: { type: Boolean, required: false, default: true }
+  modal: { type: Boolean, required: false, default: true },
+  unmountOnHide: { type: Boolean, required: false }
 });
 const emits = defineEmits(["leave", "after:leave", "enter", "after:enter", "close:prevent", "update:open"]);
 const slots = defineSlots();
 const props = useComponentProps("modal", _props);
 const { t } = useLocale();
 const appConfig = useAppConfig();
-const rootProps = useForwardProps(reactivePick(props, "open", "defaultOpen", "modal"), emits);
+const rootProps = useForwardProps(reactivePick(props, "open", "defaultOpen", "modal", "unmountOnHide"), emits);
 const portalProps = usePortal(toRef(() => props.portal));
 const contentProps = toRef(() => props.content);
 const contentEvents = computed(() => {
@@ -57,7 +58,7 @@ const contentEvents = computed(() => {
   };
 });
 const [DefineContentTemplate, ReuseContentTemplate] = createReusableTemplate();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.modal || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.modal || {} })({
   transition: props.transition,
   fullscreen: props.fullscreen,
   overlay: props.overlay,
@@ -145,7 +146,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.modal || {} }
       <slot :open="open" />
     </DialogTrigger>
 
-    <DialogPortal v-bind="portalProps">
+    <DialogPortal v-bind="portalProps" :force-mount="portalProps.disabled && props.unmountOnHide === false || void 0">
       <FieldGroupReset>
         <template v-if="props.scrollable">
           <DialogOverlay data-slot="overlay" :class="ui.overlay({ class: props.ui?.overlay })">

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

@@ -2,7 +2,9 @@ import type { DialogRootProps, DialogRootEmits, DialogContentProps, DialogConten
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/modal';
-import type { ButtonProps, IconProps, LinkPropsKeys } from '../types';
+import type { ButtonProps } from './Button.vue';
+import type { IconProps } from './Icon.vue';
+import type { LinkPropsKeys } from './Link.vue';
 import type { EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Modal = ComponentConfig<typeof theme, AppConfig, 'modal'>;
@@ -90,24 +92,24 @@ declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ModalProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     enter: () => any;
-    "update:open": (value: boolean) => any;
-    "after:leave": () => any;
     leave: () => any;
+    "after:leave": () => any;
     "after:enter": () => any;
     "close:prevent": () => any;
+    "update:open": (value: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<ModalProps> & Readonly<{
     onEnter?: (() => any) | undefined;
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    "onAfter:leave"?: (() => any) | undefined;
     onLeave?: (() => any) | undefined;
+    "onAfter:leave"?: (() => any) | undefined;
     "onAfter:enter"?: (() => any) | undefined;
     "onClose:prevent"?: (() => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
     close: boolean | Omit<ButtonProps, LinkPropsKeys>;
     modal: boolean;
     transition: boolean;
-    portal: boolean | string | HTMLElement;
     overlay: boolean;
+    portal: boolean | string | HTMLElement;
     dismissible: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ModalSlots>;
 type __VLS_WithSlots<T, S> = T & {

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

@@ -2,7 +2,13 @@ import type { NavigationMenuRootProps, NavigationMenuContentProps, NavigationMen
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/navigation-menu';
-import type { AvatarProps, BadgeProps, ChipProps, IconProps, LinkProps, PopoverProps, TooltipProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { BadgeProps } from './Badge.vue';
+import type { ChipProps } from './Chip.vue';
+import type { IconProps } from './Icon.vue';
+import type { LinkProps } from './Link.vue';
+import type { PopoverProps } from './Popover.vue';
+import type { TooltipProps } from './Tooltip.vue';
 import type { ArrayOrNested, DynamicSlots, GetItemKeys, MergeTypes, NestedItem, EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type NavigationMenu = ComponentConfig<typeof theme, AppConfig, 'navigationMenu'>;
@@ -231,7 +237,7 @@ declare const __VLS_export: <T extends ArrayOrNested<NavigationMenuItem>, K exte
     slots: NavigationMenuSlots<T, NestedItem<T>>;
     emit: (evt: "update:modelValue", value: NavigationMenuModelValue<K, O> | undefined) => void;
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/runtime/components/NavigationMenu.vue

@@ -81,7 +81,7 @@ const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate({
     listIndex: Number
   }
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.navigationMenu || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.navigationMenu || {} })({
   orientation: props.orientation,
   contentOrientation: props.orientation === "vertical" ? void 0 : props.contentOrientation,
   collapsed: props.collapsed,
@@ -293,6 +293,7 @@ function onLinkTrailingClick(e, item) {
   </DefineItemTemplate>
 
   <NavigationMenuRoot
+    data-slot="root"
     v-bind="{
   ...rootProps,
   ...props.orientation === 'horizontal' ? {
@@ -302,7 +303,6 @@ function onLinkTrailingClick(e, item) {
   ...$attrs
 }"
     :data-collapsed="props.collapsed"
-    data-slot="root"
     :class="ui.root({ class: [props.ui?.root, props.class] })"
   >
     <slot name="list-leading" />

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

@@ -2,7 +2,13 @@ import type { NavigationMenuRootProps, NavigationMenuContentProps, NavigationMen
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/navigation-menu';
-import type { AvatarProps, BadgeProps, ChipProps, IconProps, LinkProps, PopoverProps, TooltipProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { BadgeProps } from './Badge.vue';
+import type { ChipProps } from './Chip.vue';
+import type { IconProps } from './Icon.vue';
+import type { LinkProps } from './Link.vue';
+import type { PopoverProps } from './Popover.vue';
+import type { TooltipProps } from './Tooltip.vue';
 import type { ArrayOrNested, DynamicSlots, GetItemKeys, MergeTypes, NestedItem, EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type NavigationMenu = ComponentConfig<typeof theme, AppConfig, 'navigationMenu'>;
@@ -231,7 +237,7 @@ declare const __VLS_export: <T extends ArrayOrNested<NavigationMenuItem>, K exte
     slots: NavigationMenuSlots<T, NestedItem<T>>;
     emit: (evt: "update:modelValue", value: NavigationMenuModelValue<K, O> | undefined) => void;
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/runtime/components/Page.vue

@@ -22,7 +22,7 @@ onBeforeUpdate(() => {
   hasLeft.value = !!slots.left;
   hasRight.value = !!slots.right;
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.page || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.page || {} })({
   left: hasLeft.value,
   right: hasRight.value
 }));

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

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/page-anchors';
-import type { IconProps, LinkProps } from '../types';
+import type { IconProps } from './Icon.vue';
+import type { LinkProps } from './Link.vue';
 import type { ComponentConfig } from '../types/tv';
 type PageAnchors = ComponentConfig<typeof theme, AppConfig, 'pageAnchors'>;
 export interface PageAnchor extends Omit<LinkProps, 'custom'> {
@@ -51,7 +52,7 @@ declare const __VLS_export: <T extends PageAnchor>(__VLS_props: NonNullable<Awai
     slots: PageAnchorsSlots<T>;
     emit: {};
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/runtime/components/PageAnchors.vue

@@ -21,7 +21,7 @@ const _props = defineProps({
 const slots = defineSlots();
 const props = useComponentProps("pageAnchors", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageAnchors || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.pageAnchors || {} })());
 </script>
 
 <template>

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

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/page-anchors';
-import type { IconProps, LinkProps } from '../types';
+import type { IconProps } from './Icon.vue';
+import type { LinkProps } from './Link.vue';
 import type { ComponentConfig } from '../types/tv';
 type PageAnchors = ComponentConfig<typeof theme, AppConfig, 'pageAnchors'>;
 export interface PageAnchor extends Omit<LinkProps, 'custom'> {
@@ -51,7 +52,7 @@ declare const __VLS_export: <T extends PageAnchor>(__VLS_props: NonNullable<Awai
     slots: PageAnchorsSlots<T>;
     emit: {};
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/runtime/components/PageAside.vue

@@ -16,7 +16,7 @@ const _props = defineProps({
 const slots = defineSlots();
 const props = useComponentProps("pageAside", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageAside || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.pageAside || {} })());
 </script>
 
 <template>

package/dist/runtime/components/PageBody.vue

@@ -16,7 +16,7 @@ const _props = defineProps({
 defineSlots();
 const props = useComponentProps("pageBody", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageBody || {} }));
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.pageBody || {} }));
 </script>
 
 <template>

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

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/page-cta';
-import type { ButtonProps } from '../types';
+import type { ButtonProps } from './Button.vue';
 import type { ComponentConfig } from '../types/tv';
 type PageCTA = ComponentConfig<typeof theme, AppConfig, 'pageCTA'>;
 export interface PageCTAProps {

package/dist/runtime/components/PageCTA.vue

@@ -26,7 +26,7 @@ const slots = defineSlots();
 const props = useComponentProps("pageCTA", _props);
 const appConfig = useAppConfig();
 const prefix = usePrefix();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageCTA || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.pageCTA || {} })({
   variant: props.variant,
   orientation: props.orientation,
   reverse: props.reverse,

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

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/page-cta';
-import type { ButtonProps } from '../types';
+import type { ButtonProps } from './Button.vue';
 import type { ComponentConfig } from '../types/tv';
 type PageCTA = ComponentConfig<typeof theme, AppConfig, 'pageCTA'>;
 export interface PageCTAProps {