@nuxt/ui 4.9.0 → 4.11.0

package/dist/runtime/components/Banner.vue

@@ -35,7 +35,7 @@ const props = useComponentProps("banner", _props);
 const { t } = useLocale();
 const appConfig = useAppConfig();
 const prefix = usePrefix();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.banner || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.banner || {} })({
   color: props.color,
   to: !!props.to
 }));
@@ -90,15 +90,16 @@ function onClose() {
   <Primitive
     v-show="isVisible"
     :as="props.as"
+    v-bind="!props.to ? $attrs : {}"
     class="banner"
     :data-banner-id="id"
-    data-slot="root"
+    :data-slot="$attrs['data-slot'] ?? 'root'"
     :class="ui.root({ class: [props.ui?.root, props.class] })"
   >
     <ULink
       v-if="props.to"
       :aria-label="props.title"
-      v-bind="{ to: props.to, target: props.target, ...$attrs }"
+      v-bind="{ 'to': props.to, 'target': props.target, ...$attrs, 'data-slot': void 0 }"
       :class="prefix('focus:outline-none')"
       raw
     >

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

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/banner';
-import type { ButtonProps, IconProps, LinkProps, LinkPropsKeys } from '../types';
+import type { ButtonProps } from './Button.vue';
+import type { IconProps } from './Icon.vue';
+import type { LinkProps, LinkPropsKeys } from './Link.vue';
 import type { ComponentConfig } from '../types/tv';
 type Banner = ComponentConfig<typeof theme, AppConfig, 'banner'>;
 export interface BannerProps {

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

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/blog-post';
-import type { BadgeProps, LinkProps, UserProps } from '../types';
+import type { BadgeProps } from './Badge.vue';
+import type { LinkProps } from './Link.vue';
+import type { UserProps } from './User.vue';
 import type { ImgHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type BlogPost = ComponentConfig<typeof theme, AppConfig, 'blogPost'>;
@@ -38,7 +40,7 @@ export interface BlogPostProps {
     variant?: BlogPost['variants']['variant'];
     to?: LinkProps['to'];
     target?: LinkProps['target'];
-    onClick?: (event: MouseEvent) => void | Promise<void>;
+    onClick?: (event: MouseEvent) => void;
     class?: any;
     ui?: BlogPost['slots'];
 }
@@ -59,8 +61,8 @@ export interface BlogPostSlots {
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<BlogPostProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BlogPostProps> & Readonly<{}>, {
-    as: any;
     orientation: BlogPost["variants"]["orientation"];
+    as: any;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, BlogPostSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/components/BlogPost.vue

@@ -40,7 +40,7 @@ const { locale } = useLocale();
 const appConfig = useAppConfig();
 const formatter = useDateFormatter(locale.value.code);
 const prefix = usePrefix();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.blogPost || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.blogPost || {} })({
   orientation: props.orientation,
   variant: props.variant,
   image: !!props.image,
@@ -51,7 +51,7 @@ const date = computed(() => {
     return;
   }
   try {
-    return formatter.custom(new Date(props.date), { dateStyle: "medium" });
+    return formatter.custom(new Date(props.date), { dateStyle: "medium", timeZone: "UTC" });
   } catch {
     return props.date;
   }
@@ -73,11 +73,18 @@ const ariaLabel = computed(() => {
 </script>
 
 <template>
-  <Primitive :as="props.as" :data-orientation="props.orientation" data-slot="root" :class="ui.root({ class: [props.ui?.root, props.class] })" @click="props.onClick">
+  <Primitive
+    :as="props.as"
+    v-bind="!props.to ? $attrs : {}"
+    :data-orientation="props.orientation"
+    :data-slot="$attrs['data-slot'] ?? 'root'"
+    :class="ui.root({ class: [props.ui?.root, props.class] })"
+    @click="props.onClick"
+  >
     <ULink
       v-if="props.to"
       :aria-label="ariaLabel"
-      v-bind="{ to: props.to, target: props.target, ...$attrs }"
+      v-bind="{ 'to': props.to, 'target': props.target, ...$attrs, 'data-slot': void 0 }"
       :class="prefix('focus:outline-none absolute inset-0')"
       raw
     />

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

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/blog-post';
-import type { BadgeProps, LinkProps, UserProps } from '../types';
+import type { BadgeProps } from './Badge.vue';
+import type { LinkProps } from './Link.vue';
+import type { UserProps } from './User.vue';
 import type { ImgHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type BlogPost = ComponentConfig<typeof theme, AppConfig, 'blogPost'>;
@@ -38,7 +40,7 @@ export interface BlogPostProps {
     variant?: BlogPost['variants']['variant'];
     to?: LinkProps['to'];
     target?: LinkProps['target'];
-    onClick?: (event: MouseEvent) => void | Promise<void>;
+    onClick?: (event: MouseEvent) => void;
     class?: any;
     ui?: BlogPost['slots'];
 }
@@ -59,8 +61,8 @@ export interface BlogPostSlots {
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<BlogPostProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BlogPostProps> & Readonly<{}>, {
-    as: any;
     orientation: BlogPost["variants"]["orientation"];
+    as: any;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, BlogPostSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/blog-posts';
-import type { BlogPostProps, BlogPostSlots } from '../types';
+import type { BlogPostProps, BlogPostSlots } from './BlogPost.vue';
 import type { ComponentConfig } from '../types/tv';
 type BlogPosts = ComponentConfig<typeof theme, AppConfig, 'blogPosts'>;
 export interface BlogPostsProps<T extends BlogPostProps = BlogPostProps> {
@@ -40,7 +40,7 @@ declare const __VLS_export: <T extends BlogPostProps>(__VLS_props: NonNullable<A
     slots: BlogPostsSlots<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/BlogPosts.vue

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

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

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/blog-posts';
-import type { BlogPostProps, BlogPostSlots } from '../types';
+import type { BlogPostProps, BlogPostSlots } from './BlogPost.vue';
 import type { ComponentConfig } from '../types/tv';
 type BlogPosts = ComponentConfig<typeof theme, AppConfig, 'blogPosts'>;
 export interface BlogPostsProps<T extends BlogPostProps = BlogPostProps> {
@@ -40,7 +40,7 @@ declare const __VLS_export: <T extends BlogPostProps>(__VLS_props: NonNullable<A
     slots: BlogPostsSlots<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/Breadcrumb.d.vue.ts

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/breadcrumb';
-import type { AvatarProps, IconProps, LinkProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { IconProps } from './Icon.vue';
+import type { LinkProps } from './Link.vue';
 import type { DynamicSlots, GetItemKeys } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Breadcrumb = ComponentConfig<typeof theme, AppConfig, 'breadcrumb'>;
@@ -83,7 +85,7 @@ declare const __VLS_export: <T extends BreadcrumbItem>(__VLS_props: NonNullable<
     slots: BreadcrumbSlots<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/Breadcrumb.vue

@@ -29,7 +29,7 @@ const props = useComponentProps("breadcrumb", _props);
 const { dir } = useLocale();
 const appConfig = useAppConfig();
 const separatorIcon = computed(() => props.separatorIcon || (dir.value === "rtl" ? appConfig.ui.icons.chevronLeft : appConfig.ui.icons.chevronRight));
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.breadcrumb || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.breadcrumb || {} })({
   color: props.color
 }));
 </script>

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

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/breadcrumb';
-import type { AvatarProps, IconProps, LinkProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { IconProps } from './Icon.vue';
+import type { LinkProps } from './Link.vue';
 import type { DynamicSlots, GetItemKeys } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Breadcrumb = ComponentConfig<typeof theme, AppConfig, 'breadcrumb'>;
@@ -83,7 +85,7 @@ declare const __VLS_export: <T extends BreadcrumbItem>(__VLS_props: NonNullable<
     slots: BreadcrumbSlots<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/Button.d.vue.ts

@@ -2,7 +2,7 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/button';
 import type { UseComponentIconsProps } from '../composables/useComponentIcons';
-import type { LinkProps } from '../types';
+import type { LinkProps } from './Link.vue';
 import type { ComponentConfig } from '../types/tv';
 type Button = ComponentConfig<typeof theme, AppConfig, 'button'>;
 export interface ButtonProps extends UseComponentIconsProps, Omit<LinkProps, 'raw' | 'custom'> {
@@ -27,7 +27,7 @@ export interface ButtonProps extends UseComponentIconsProps, Omit<LinkProps, 'ra
     block?: boolean;
     /** Set loading state automatically based on the `@click` promise state */
     loadingAuto?: boolean;
-    onClick?: ((event: MouseEvent) => void | Promise<void>) | Array<((event: MouseEvent) => void | Promise<void>)>;
+    onClick?: ((event: MouseEvent) => void) | Array<((event: MouseEvent) => void)>;
     class?: any;
     ui?: Button['slots'];
 }

package/dist/runtime/components/Button.vue

@@ -70,6 +70,7 @@ const props = useComponentProps("button", _props);
 const appConfig = useAppConfig();
 const { orientation, size: buttonSize } = useFieldGroup(_props);
 const linkProps = useForwardProps(pickLinkProps(props));
+const forwardedLinkProps = computed(() => omit(linkProps.value, ["type", "disabled", "onClick"]));
 const loadingAutoState = ref(false);
 const formLoading = inject(formLoadingInjectionKey, void 0);
 async function onClickWrapper(event) {
@@ -85,10 +86,18 @@ const isLoading = computed(() => {
   return props.loading || props.loadingAuto && (loadingAutoState.value || formLoading?.value && props.type === "submit");
 });
 const { isLeading, isTrailing, leadingIconName, trailingIconName } = useComponentIcons(
-  computed(() => ({ ...props, loading: isLoading.value }))
+  computed(() => ({
+    icon: props.icon,
+    leading: props.leading,
+    leadingIcon: props.leadingIcon,
+    trailing: props.trailing,
+    trailingIcon: props.trailingIcon,
+    loading: isLoading.value,
+    loadingIcon: props.loadingIcon
+  }))
 );
 const ui = computed(() => tv({
-  extend: tv(theme),
+  extend: theme,
   ...defu({
     variants: {
       active: {
@@ -119,12 +128,12 @@ const ui = computed(() => tv({
     v-slot="{ active, ...slotProps }"
     :type="props.type"
     :disabled="props.disabled || isLoading"
-    v-bind="omit(linkProps, ['type', 'disabled', 'onClick'])"
+    v-bind="forwardedLinkProps"
     custom
   >
     <ULinkBase
-      v-bind="slotProps"
       data-slot="base"
+      v-bind="slotProps"
       :class="ui.base({
   class: [props.ui?.base, props.class],
   active,

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

@@ -2,7 +2,7 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/button';
 import type { UseComponentIconsProps } from '../composables/useComponentIcons';
-import type { LinkProps } from '../types';
+import type { LinkProps } from './Link.vue';
 import type { ComponentConfig } from '../types/tv';
 type Button = ComponentConfig<typeof theme, AppConfig, 'button'>;
 export interface ButtonProps extends UseComponentIconsProps, Omit<LinkProps, 'raw' | 'custom'> {
@@ -27,7 +27,7 @@ export interface ButtonProps extends UseComponentIconsProps, Omit<LinkProps, 'ra
     block?: boolean;
     /** Set loading state automatically based on the `@click` promise state */
     loadingAuto?: boolean;
-    onClick?: ((event: MouseEvent) => void | Promise<void>) | Array<((event: MouseEvent) => void | Promise<void>)>;
+    onClick?: ((event: MouseEvent) => void) | Array<((event: MouseEvent) => void)>;
     class?: any;
     ui?: Button['slots'];
 }

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

@@ -3,7 +3,9 @@ import type { VNode } from 'vue';
 import type { DateValue } from '@internationalized/date';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/calendar';
-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 { ComponentConfig } from '../types/tv';
 type Calendar = ComponentConfig<typeof theme, AppConfig, 'calendar'>;
 export type CalendarType = 'date' | 'month' | 'year';
@@ -150,7 +152,7 @@ declare const __VLS_export: <R extends boolean, M extends boolean>(__VLS_props:
     slots: CalendarSlots;
     emit: ((evt: "update:modelValue", value: CalendarModelValue<R, M>) => void) & ((evt: "update:placeholder", date: DateValue) => void) & ((evt: "update:validModelValue", date: DateRange) => void) & ((evt: "update:startValue", date: DateValue | 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/Calendar.vue

@@ -166,7 +166,7 @@ const prevYearIcon = computed(() => props.prevYearIcon || (dir.value === "rtl" ?
 const prevMonthIcon = computed(() => props.prevMonthIcon || (dir.value === "rtl" ? appConfig.ui.icons.chevronRight : appConfig.ui.icons.chevronLeft));
 const prevLabel = computed(() => view.value === "day" ? t("calendar.prevMonth") : t("calendar.prevYear"));
 const nextLabel = computed(() => view.value === "day" ? t("calendar.nextMonth") : t("calendar.nextYear"));
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.calendar || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.calendar || {} })({
   color: props.color,
   size: props.size,
   variant: props.variant,

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

@@ -3,7 +3,9 @@ import type { VNode } from 'vue';
 import type { DateValue } from '@internationalized/date';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/calendar';
-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 { ComponentConfig } from '../types/tv';
 type Calendar = ComponentConfig<typeof theme, AppConfig, 'calendar'>;
 export type CalendarType = 'date' | 'month' | 'year';
@@ -150,7 +152,7 @@ declare const __VLS_export: <R extends boolean, M extends boolean>(__VLS_props:
     slots: CalendarSlots;
     emit: ((evt: "update:modelValue", value: CalendarModelValue<R, M>) => void) & ((evt: "update:placeholder", date: DateValue) => void) & ((evt: "update:validModelValue", date: DateRange) => void) & ((evt: "update:startValue", date: DateValue | 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/Card.vue

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

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

@@ -8,7 +8,9 @@ import type { ClassNamesOptionsType } from 'embla-carousel-class-names';
 import type { FadeOptionsType } from 'embla-carousel-fade';
 import type { WheelGesturesPluginOptions } from 'embla-carousel-wheel-gestures';
 import theme from '#build/ui/carousel';
-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 { AcceptableValue } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Carousel = ComponentConfig<typeof theme, AppConfig, 'carousel'>;
@@ -124,7 +126,7 @@ declare const __VLS_export: <T extends CarouselItem>(__VLS_props: NonNullable<Aw
     slots: CarouselSlots<T>;
     emit: (evt: "select", selectedIndex: number) => 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/Carousel.vue

@@ -68,7 +68,7 @@ const stopAutoScrollOnInteraction = computed(() => {
   }
   return props.autoScroll?.stopOnInteraction ?? true;
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.carousel || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.carousel || {} })({
   orientation: props.orientation
 }));
 const options = computed(() => ({
@@ -106,10 +106,7 @@ async function loadPlugins() {
   }
   plugins.value = emblaPlugins;
 }
-watch(() => [props.autoplay, props.autoScroll, props.autoHeight, props.classNames, props.fade, props.wheelGestures], async () => {
-  await loadPlugins();
-  emblaApi.value?.reInit(options.value, plugins.value);
-}, { immediate: true });
+watch(() => [props.autoplay, props.autoScroll, props.autoHeight, props.classNames, props.fade, props.wheelGestures], loadPlugins, { immediate: true });
 const [emblaRef, emblaApi] = useEmblaCarousel(options, plugins);
 watch(options, () => {
   emblaApi.value?.reInit(options.value, plugins.value);

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

@@ -8,7 +8,9 @@ import type { ClassNamesOptionsType } from 'embla-carousel-class-names';
 import type { FadeOptionsType } from 'embla-carousel-fade';
 import type { WheelGesturesPluginOptions } from 'embla-carousel-wheel-gestures';
 import theme from '#build/ui/carousel';
-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 { AcceptableValue } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Carousel = ComponentConfig<typeof theme, AppConfig, 'carousel'>;
@@ -124,7 +126,7 @@ declare const __VLS_export: <T extends CarouselItem>(__VLS_props: NonNullable<Aw
     slots: CarouselSlots<T>;
     emit: (evt: "select", selectedIndex: number) => 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/ChangelogVersion.d.vue.ts

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/changelog-version';
-import type { BadgeProps, LinkProps, UserProps } from '../types';
+import type { BadgeProps } from './Badge.vue';
+import type { LinkProps } from './Link.vue';
+import type { UserProps } from './User.vue';
 import type { ImgHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type ChangelogVersion = ComponentConfig<typeof theme, AppConfig, 'changelogVersion'>;
@@ -34,7 +36,7 @@ export interface ChangelogVersionProps {
     indicator?: boolean;
     to?: LinkProps['to'];
     target?: LinkProps['target'];
-    onClick?: (event: MouseEvent) => void | Promise<void>;
+    onClick?: (event: MouseEvent) => void;
     class?: any;
     ui?: ChangelogVersion['slots'];
 }

package/dist/runtime/components/ChangelogVersion.vue

@@ -47,7 +47,7 @@ const [DefineDateTemplate, ReuseDateTemplate] = createReusableTemplate({
     }
   }
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.changelogVersion || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.changelogVersion || {} })({
   to: !!props.to || !!props.onClick
 }));
 const date = computed(() => {
@@ -55,7 +55,7 @@ const date = computed(() => {
     return;
   }
   try {
-    return formatter.custom(new Date(props.date), { dateStyle: "medium" });
+    return formatter.custom(new Date(props.date), { dateStyle: "medium", timeZone: "UTC" });
   } catch {
     return props.date;
   }
@@ -81,7 +81,7 @@ const ariaLabel = computed(() => {
     <ULink
       v-if="props.to"
       :aria-label="ariaLabel"
-      v-bind="{ to: props.to, target: props.target, ...$attrs }"
+      v-bind="{ 'to': props.to, 'target': props.target, ...$attrs, 'data-slot': void 0 }"
       :class="prefix('focus:outline-none peer')"
       raw
     >
@@ -97,7 +97,7 @@ const ariaLabel = computed(() => {
     </time>
   </DefineDateTemplate>
 
-  <Primitive :as="props.as" data-slot="root" :class="ui.root({ class: [props.ui?.root, props.class] })" @click="props.onClick">
+  <Primitive :as="props.as" v-bind="!props.to ? $attrs : {}" :data-slot="$attrs['data-slot'] ?? 'root'" :class="ui.root({ class: [props.ui?.root, props.class] })" @click="props.onClick">
     <div v-if="!!props.indicator || !!slots.indicator" data-slot="indicator" :class="ui.indicator({ class: props.ui?.indicator })">
       <slot name="indicator" :ui="ui">
         <ReuseDateTemplate />

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

@@ -1,7 +1,9 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/changelog-version';
-import type { BadgeProps, LinkProps, UserProps } from '../types';
+import type { BadgeProps } from './Badge.vue';
+import type { LinkProps } from './Link.vue';
+import type { UserProps } from './User.vue';
 import type { ImgHTMLAttributes } from '../types/html';
 import type { ComponentConfig } from '../types/tv';
 type ChangelogVersion = ComponentConfig<typeof theme, AppConfig, 'changelogVersion'>;
@@ -34,7 +36,7 @@ export interface ChangelogVersionProps {
     indicator?: boolean;
     to?: LinkProps['to'];
     target?: LinkProps['target'];
-    onClick?: (event: MouseEvent) => void | Promise<void>;
+    onClick?: (event: MouseEvent) => void;
     class?: any;
     ui?: ChangelogVersion['slots'];
 }

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

@@ -2,7 +2,7 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import type { SpringOptions, UseScrollOptions } from 'motion-v';
 import theme from '#build/ui/changelog-versions';
-import type { ChangelogVersionProps, ChangelogVersionSlots } from '../types';
+import type { ChangelogVersionProps, ChangelogVersionSlots } from './ChangelogVersion.vue';
 import type { ComponentConfig } from '../types/tv';
 type ChangelogVersions = ComponentConfig<typeof theme, AppConfig, 'changelogVersions'>;
 export interface ChangelogVersionsProps<T extends ChangelogVersionProps = ChangelogVersionProps> {
@@ -49,7 +49,7 @@ declare const __VLS_export: <T extends ChangelogVersionProps>(__VLS_props: NonNu
     slots: ChangelogVersionsSlots<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/ChangelogVersions.vue

@@ -29,7 +29,7 @@ const scrollOptions = computed(() => typeof props.indicator === "object" ? props
 const { scrollYProgress } = useScroll(scrollOptions.value);
 const y = useSpring(scrollYProgress, springOptions);
 const height = useTransform(() => `${Number(y.get()) * 100}%`);
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.changelogVersions || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.changelogVersions || {} })());
 </script>
 
 <template>

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

@@ -2,7 +2,7 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import type { SpringOptions, UseScrollOptions } from 'motion-v';
 import theme from '#build/ui/changelog-versions';
-import type { ChangelogVersionProps, ChangelogVersionSlots } from '../types';
+import type { ChangelogVersionProps, ChangelogVersionSlots } from './ChangelogVersion.vue';
 import type { ComponentConfig } from '../types/tv';
 type ChangelogVersions = ComponentConfig<typeof theme, AppConfig, 'changelogVersions'>;
 export interface ChangelogVersionsProps<T extends ChangelogVersionProps = ChangelogVersionProps> {
@@ -49,7 +49,7 @@ declare const __VLS_export: <T extends ChangelogVersionProps>(__VLS_props: NonNu
     slots: ChangelogVersionsSlots<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/ChatMessage.d.vue.ts

@@ -2,7 +2,9 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import type { UIDataTypes, UIMessage, UITools, FileUIPart } from 'ai';
 import theme from '#build/ui/chat-message';
-import type { AvatarProps, ButtonProps, IconProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { ButtonProps } from './Button.vue';
+import type { IconProps } from './Icon.vue';
 import type { ComponentConfig } from '../types/tv';
 type ChatMessage = ComponentConfig<typeof theme, AppConfig, 'chatMessage'>;
 export interface ChatMessageProps<TMetadata = unknown, TDataParts extends UIDataTypes = UIDataTypes, TTools extends UITools = UITools> extends UIMessage<TMetadata, TDataParts, TTools> {
@@ -80,7 +82,7 @@ declare const __VLS_export: <TMetadata, TDataParts extends UIDataTypes, TTools e
     slots: ChatMessageSlots<TMetadata, TDataParts, TTools>;
     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/ChatMessage.vue

@@ -36,7 +36,7 @@ const appConfig = useAppConfig();
 const fileParts = computed(() => props.parts?.filter((part) => part.type === "file") ?? []);
 const textParts = computed(() => props.parts?.filter((part) => part.type === "text") ?? []);
 const messageProps = computed(() => omit(props, ["as", "icon", "avatar", "variant", "color", "side", "actions", "compact", "class", "ui", "content"]));
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.chatMessage || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.chatMessage || {} })({
   variant: props.variant,
   color: props.color,
   side: props.side,

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

@@ -2,7 +2,9 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import type { UIDataTypes, UIMessage, UITools, FileUIPart } from 'ai';
 import theme from '#build/ui/chat-message';
-import type { AvatarProps, ButtonProps, IconProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { ButtonProps } from './Button.vue';
+import type { IconProps } from './Icon.vue';
 import type { ComponentConfig } from '../types/tv';
 type ChatMessage = ComponentConfig<typeof theme, AppConfig, 'chatMessage'>;
 export interface ChatMessageProps<TMetadata = unknown, TDataParts extends UIDataTypes = UIDataTypes, TTools extends UITools = UITools> extends UIMessage<TMetadata, TDataParts, TTools> {
@@ -80,7 +82,7 @@ declare const __VLS_export: <TMetadata, TDataParts extends UIDataTypes, TTools e
     slots: ChatMessageSlots<TMetadata, TDataParts, TTools>;
     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];