@nuxt/ui 4.0.1 → 4.2.0

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

@@ -1,16 +1,20 @@
 import type { SelectMenuProps } from '../../types';
 import type { Locale } from '../../types/locale';
-export interface LocaleSelectProps extends /** @vue-ignore */ Pick<SelectMenuProps<any>, 'color' | 'variant' | 'size' | 'trailingIcon' | 'selectedIcon' | 'content' | 'arrow' | 'portal' | 'disabled' | 'ui'> {
+export interface LocaleSelectProps extends Omit<SelectMenuProps<Locale<any>[], 'code', false>, 'items' | 'modelValue'> {
     locales?: Locale<any>[];
 }
 declare const __VLS_export: import("vue").DefineComponent<LocaleSelectProps & {
-    modelValue?: string;
+    modelValue: string;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: string | undefined) => any;
+    "update:modelValue": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<LocaleSelectProps & {
-    modelValue?: string;
+    modelValue: string;
 }> & Readonly<{
-    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    valueKey: "code";
+    labelKey: string;
+    searchInput: boolean | import("../Input.vue").InputProps;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/prose/Accordion.d.vue.ts

@@ -1,6 +1,12 @@
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/prose/accordion';
+import type { AccordionProps } from '../../types';
+import type { ComponentConfig } from '../../types/tv';
+type ProseAccordion = ComponentConfig<typeof theme, AppConfig, 'accordion', 'ui.prose'>;
 export interface ProseAccordionProps {
     type?: 'single' | 'multiple';
     class?: any;
+    ui?: ProseAccordion['slots'] & AccordionProps['ui'];
 }
 export interface ProseAccordionSlots {
     default(props?: {}): any;

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

@@ -10,7 +10,8 @@ import { tv } from "../../utils/tv";
 import UAccordion from "../Accordion.vue";
 const props = defineProps({
   type: { type: String, required: false, default: "multiple" },
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: void 0, required: false }
 });
 const slots = defineSlots();
 const appConfig = useAppConfig();
@@ -36,7 +37,7 @@ onBeforeUpdate(() => rerenderCount.value++);
 </script>
 
 <template>
-  <UAccordion :type="type" :items="items" :unmount-on-hide="false" :class="props.class" :ui="transformUI(ui())">
+  <UAccordion :type="type" :items="items" :unmount-on-hide="false" :class="props.class" :ui="transformUI(ui(), props.ui)">
     <template #content="{ item }">
       <component :is="item.component" />
     </template>

package/dist/runtime/components/prose/Accordion.vue.d.ts

@@ -1,6 +1,12 @@
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/prose/accordion';
+import type { AccordionProps } from '../../types';
+import type { ComponentConfig } from '../../types/tv';
+type ProseAccordion = ComponentConfig<typeof theme, AppConfig, 'accordion', 'ui.prose'>;
 export interface ProseAccordionProps {
     type?: 'single' | 'multiple';
     class?: any;
+    ui?: ProseAccordion['slots'] & AccordionProps['ui'];
 }
 export interface ProseAccordionSlots {
     default(props?: {}): any;

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

@@ -92,50 +92,54 @@ onBeforeUpdate(() => rerenderCount.value++);
 
 <template>
   <DefineTreeTemplate v-slot="{ items, level }">
-    <TreeItem
+    <li
       v-for="(item, index) in items"
       :key="`${level}-${index}`"
-      v-slot="{ isExpanded, isSelected }"
-      :level="level"
-      :value="item"
+      role="presentation"
       :class="level > 1 ? ui.itemWithChildren({ class: props.ui?.itemWithChildren }) : ui.item({ class: props.ui?.item })"
     >
-      <button
-        type="button"
-        :data-expanded="isExpanded"
-        :class="ui.link({ class: props.ui?.link, active: isSelected })"
+      <TreeItem
+        v-slot="{ isExpanded, isSelected }"
+        :level="level"
+        :value="item"
+        as-child
       >
-        <UIcon
-          v-if="item.children?.length"
-          :name="isExpanded ? appConfig.ui.icons.folderOpen : appConfig.ui.icons.folder"
-          :class="ui.linkLeadingIcon({ class: props.ui?.linkLeadingIcon })"
-        />
-        <UCodeIcon
-          v-else
-          :filename="item.label"
-          :class="ui.linkLeadingIcon({ class: props.ui?.linkLeadingIcon })"
-        />
-
-        <span :class="ui.linkLabel({ class: props.ui?.linkLabel })">
-          {{ item.label }}
-        </span>
-
-        <span v-if="item.children?.length" :class="ui.linkTrailing({ class: props.ui?.linkTrailing })">
+        <button
+          type="button"
+          :class="ui.link({ class: props.ui?.link, active: isSelected })"
+        >
           <UIcon
-            :name="appConfig.ui.icons.chevronDown"
-            :class="ui.linkTrailingIcon({ class: props.ui?.linkTrailingIcon })"
+            v-if="item.children?.length"
+            :name="isExpanded ? appConfig.ui.icons.folderOpen : appConfig.ui.icons.folder"
+            :class="ui.linkLeadingIcon({ class: props.ui?.linkLeadingIcon })"
+          />
+          <UCodeIcon
+            v-else
+            :filename="item.label"
+            :class="ui.linkLeadingIcon({ class: props.ui?.linkLeadingIcon })"
           />
-        </span>
-      </button>
 
-      <ul
-        v-if="item.children?.length && isExpanded"
-        role="group"
-        :class="ui.listWithChildren({ class: props.ui?.listWithChildren })"
-      >
-        <ReuseTreeTemplate :items="item.children" :level="level + 1" />
-      </ul>
-    </TreeItem>
+          <span :class="ui.linkLabel({ class: props.ui?.linkLabel })">
+            {{ item.label }}
+          </span>
+
+          <span v-if="item.children?.length" :class="ui.linkTrailing({ class: props.ui?.linkTrailing })">
+            <UIcon
+              :name="appConfig.ui.icons.chevronDown"
+              :class="ui.linkTrailingIcon({ class: props.ui?.linkTrailingIcon })"
+            />
+          </span>
+        </button>
+
+        <ul
+          v-if="item.children?.length && isExpanded"
+          role="group"
+          :class="ui.listWithChildren({ class: props.ui?.listWithChildren })"
+        >
+          <ReuseTreeTemplate :items="item.children" :level="level + 1" />
+        </ul>
+      </TreeItem>
+    </li>
   </DefineTreeTemplate>
 
   <div v-bind="$attrs" :class="ui.root({ class: [props.ui?.root, props.class] })">

package/dist/runtime/components/prose/Collapsible.d.vue.ts

@@ -1,6 +1,6 @@
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/collapsible';
-import type { IconProps } from '../../types';
+import type { IconProps, CollapsibleProps } from '../../types';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCollapsible = ComponentConfig<typeof theme, AppConfig, 'collapsible', 'ui.prose'>;
 export interface ProseCollapsibleProps {
@@ -25,7 +25,7 @@ export interface ProseCollapsibleProps {
      */
     closeText?: string;
     class?: any;
-    ui?: ProseCollapsible['slots'];
+    ui?: ProseCollapsible['slots'] & CollapsibleProps['ui'];
 }
 export interface ProseCollapsibleSlots {
     default(props?: {}): any;

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

@@ -16,7 +16,7 @@ const props = defineProps({
   openText: { type: String, required: false },
   closeText: { type: String, required: false },
   class: { type: null, required: false },
-  ui: { type: null, required: false }
+  ui: { type: void 0, required: false }
 });
 defineSlots();
 const { t } = useLocale();
@@ -25,7 +25,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.collap
 </script>
 
 <template>
-  <UCollapsible :unmount-on-hide="false" :class="props.class" :ui="transformUI(ui)">
+  <UCollapsible :unmount-on-hide="false" :class="props.class" :ui="transformUI(ui, props.ui)">
     <template #default="{ open }">
       <button :class="ui.trigger({ class: props.ui?.trigger })">
         <UIcon :name="icon || appConfig.ui.icons.chevronDown" :class="ui.triggerIcon({ class: props.ui?.triggerIcon })" />

package/dist/runtime/components/prose/Collapsible.vue.d.ts

@@ -1,6 +1,6 @@
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/collapsible';
-import type { IconProps } from '../../types';
+import type { IconProps, CollapsibleProps } from '../../types';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCollapsible = ComponentConfig<typeof theme, AppConfig, 'collapsible', 'ui.prose'>;
 export interface ProseCollapsibleProps {
@@ -25,7 +25,7 @@ export interface ProseCollapsibleProps {
      */
     closeText?: string;
     class?: any;
-    ui?: ProseCollapsible['slots'];
+    ui?: ProseCollapsible['slots'] & CollapsibleProps['ui'];
 }
 export interface ProseCollapsibleSlots {
     default(props?: {}): any;

package/dist/runtime/components/prose/Field.d.vue.ts

@@ -13,7 +13,7 @@ export interface ProseFieldProps {
      */
     name?: string;
     /**
-     * Expected type of the field’s value
+     * Expected type of the field's value
      */
     type?: string;
     /**

package/dist/runtime/components/prose/Field.vue.d.ts

@@ -13,7 +13,7 @@ export interface ProseFieldProps {
      */
     name?: string;
     /**
-     * Expected type of the field’s value
+     * Expected type of the field's value
      */
     type?: string;
     /**

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

@@ -23,6 +23,7 @@ const props = defineProps({
 });
 const appConfig = useAppConfig();
 const [DefineImageTemplate, ReuseImageTemplate] = createReusableTemplate();
+const [DefineZoomedImageTemplate, ReuseZoomedImageTemplate] = createReusableTemplate();
 const open = ref(false);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.img || {} })({
   zoom: props.zoom,
@@ -58,9 +59,19 @@ if (props.zoom) {
     />
   </DefineImageTemplate>
 
+  <DefineZoomedImageTemplate>
+    <component
+      :is="ImageComponent"
+      :src="refinedSrc"
+      :alt="alt"
+      v-bind="$attrs"
+      :class="ui.zoomedImage({ class: [props.ui?.zoomedImage] })"
+    />
+  </DefineZoomedImageTemplate>
+
   <DialogRoot v-if="zoom" v-slot="{ close }" v-model:open="open" :modal="false">
     <DialogTrigger as-child>
-      <Motion :layout-id="layoutId" as-child :transition="{ type: 'spring', bounce: 0.2, duration: 0.4 }">
+      <Motion :layout-id="layoutId" as-child :transition="{ type: 'spring', bounce: 0.15, duration: 0.5, ease: 'easeInOut' }">
         <ReuseImageTemplate />
       </Motion>
     </DialogTrigger>
@@ -70,8 +81,8 @@ if (props.zoom) {
         <Motion v-if="open" :initial="{ opacity: 0 }" :animate="{ opacity: 1 }" :exit="{ opacity: 0 }" :class="ui.overlay({ class: [props.ui?.overlay] })" />
 
         <div v-if="open" :class="ui.content({ class: [props.ui?.content] })" @click="close">
-          <Motion as-child :layout-id="layoutId" :transition="{ type: 'spring', bounce: 0.2, duration: 0.4 }">
-            <ReuseImageTemplate />
+          <Motion as-child :layout-id="layoutId" :transition="{ type: 'spring', bounce: 0.15, duration: 0.5, ease: 'easeInOut' }">
+            <ReuseZoomedImageTemplate />
           </Motion>
         </div>
       </AnimatePresence>

package/dist/runtime/components/prose/Tabs.d.vue.ts

@@ -1,3 +1,8 @@
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/prose/tabs';
+import type { TabsProps } from '../../types';
+import type { ComponentConfig } from '../../types/tv';
+type ProseTabs = ComponentConfig<typeof theme, AppConfig, 'tabs', 'ui.prose'>;
 export interface ProseTabsProps {
     /**
      * The default tab to select.
@@ -13,6 +18,7 @@ export interface ProseTabsProps {
      */
     hash?: string;
     class?: any;
+    ui?: ProseTabs['slots'] & TabsProps['ui'];
 }
 export interface ProseTabsSlots {
     default(props?: {}): any;

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

@@ -12,7 +12,8 @@ const props = defineProps({
   defaultValue: { type: String, required: false, default: "0" },
   sync: { type: String, required: false },
   hash: { type: String, required: false },
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: void 0, required: false }
 });
 const slots = defineSlots();
 const model = defineModel({ type: String });
@@ -69,7 +70,7 @@ onBeforeUpdate(() => rerenderCount.value++);
     :items="items"
     :class="props.class"
     :unmount-on-hide="false"
-    :ui="transformUI(ui())"
+    :ui="transformUI(ui(), props.ui)"
     @update:model-value="onUpdateModelValue"
   >
     <template #content="{ item }">

package/dist/runtime/components/prose/Tabs.vue.d.ts

@@ -1,3 +1,8 @@
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/prose/tabs';
+import type { TabsProps } from '../../types';
+import type { ComponentConfig } from '../../types/tv';
+type ProseTabs = ComponentConfig<typeof theme, AppConfig, 'tabs', 'ui.prose'>;
 export interface ProseTabsProps {
     /**
      * The default tab to select.
@@ -13,6 +18,7 @@ export interface ProseTabsProps {
      */
     hash?: string;
     class?: any;
+    ui?: ProseTabs['slots'] & TabsProps['ui'];
 }
 export interface ProseTabsSlots {
     default(props?: {}): any;

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

@@ -0,0 +1,8 @@
+export * from './defineLocale';
+export * from './defineShortcuts';
+export * from './useFileUpload';
+export * from './useKbd';
+export * from './useOverlay';
+export * from './useResizable';
+export * from './useScrollspy';
+export * from './useToast';

package/dist/runtime/composables/index.js

@@ -0,0 +1,8 @@
+export * from "./defineLocale.js";
+export * from "./defineShortcuts.js";
+export * from "./useFileUpload.js";
+export * from "./useKbd.js";
+export * from "./useOverlay.js";
+export * from "./useResizable.js";
+export * from "./useScrollspy.js";
+export * from "./useToast.js";

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

@@ -6,5 +6,5 @@ export declare const avatarGroupInjectionKey: InjectionKey<ComputedRef<{
 export declare function useAvatarGroup(props: {
     size: AvatarGroupProps['size'];
 }): {
-    size: ComputedRef<"3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | undefined>;
+    size: ComputedRef<"md" | "3xs" | "2xs" | "xs" | "sm" | "lg" | "xl" | "2xl" | "3xl" | undefined>;
 };

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

@@ -1,5 +1,10 @@
+import type { ContentNavigationItem } from '@nuxt/content';
+import type { ContentSearchFile, ContentSearchItem } from '../components/content/ContentSearch.vue';
 declare function _useContentSearch(): {
     open: import("vue").Ref<boolean, boolean>;
+    mapFile: (file: ContentSearchFile, link: ContentNavigationItem, parent?: ContentNavigationItem) => ContentSearchItem;
+    mapNavigationItems: (children: ContentNavigationItem[], files: ContentSearchFile[], parent?: ContentNavigationItem) => ContentSearchItem[];
+    postFilter: (query: string, items: ContentSearchItem[]) => ContentSearchItem[];
 };
 export declare const useContentSearch: typeof _useContentSearch;
 export {};

package/dist/runtime/composables/useContentSearch.js

@@ -1,9 +1,39 @@
 import { ref } from "vue";
 import { createSharedComposable } from "@vueuse/core";
+import { useAppConfig } from "#imports";
 function _useContentSearch() {
   const open = ref(false);
+  const appConfig = useAppConfig();
+  function mapFile(file, link, parent) {
+    const prefix = [...new Set([parent?.title, ...file.titles].filter(Boolean))];
+    return {
+      prefix: prefix?.length ? prefix.join(" > ") + " >" : void 0,
+      label: file.id === link.path ? link.title : file.title,
+      suffix: file.content.replaceAll("<", "&lt;").replaceAll(">", "&gt;"),
+      to: file.id,
+      icon: link.icon || parent?.icon || (file.level > 1 ? appConfig.ui.icons.hash : appConfig.ui.icons.file),
+      level: file.level
+    };
+  }
+  function mapNavigationItems(children, files, parent) {
+    return children.flatMap((link) => {
+      if (link.children?.length) {
+        return mapNavigationItems(link.children, files, link);
+      }
+      return files?.filter((file) => file.id === link.path || file.id.startsWith(`${link.path}#`))?.map((file) => mapFile(file, link, parent)) || [];
+    });
+  }
+  function postFilter(query, items) {
+    if (!query) {
+      return items?.filter((item) => item.level === 1);
+    }
+    return items;
+  }
   return {
-    open
+    open,
+    mapFile,
+    mapNavigationItems,
+    postFilter
   };
 }
 export const useContentSearch = /* @__PURE__ */ createSharedComposable(_useContentSearch);

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

@@ -10,6 +10,6 @@ type Props<T> = {
 };
 export declare function useFieldGroup<T>(props: Props<T>): {
     orientation: ComputedRef<"horizontal" | "vertical" | undefined>;
-    size: ComputedRef<"xs" | "sm" | "md" | "lg" | "xl" | NonNullable<GetObjectField<T, "size">> | undefined>;
+    size: ComputedRef<"md" | "xs" | "sm" | "lg" | "xl" | NonNullable<GetObjectField<T, "size">> | undefined>;
 };
 export {};

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

@@ -1,3 +1,4 @@
+import type { ComponentPublicInstance } from 'vue';
 import type { MaybeRef } from '@vueuse/core';
 export interface UseFileUploadOptions {
     /**
@@ -14,6 +15,6 @@ export interface UseFileUploadOptions {
 export declare function useFileUpload(options: UseFileUploadOptions): {
     isDragging: import("vue").Ref<boolean, boolean>;
     open: () => void;
-    inputRef: import("vue").Ref<HTMLInputElement | undefined, HTMLInputElement | undefined>;
+    inputRef: import("vue").Ref<ComponentPublicInstance | undefined, ComponentPublicInstance | undefined>;
     dropzoneRef: import("vue").Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
 };

package/dist/runtime/composables/useFileUpload.js

@@ -26,7 +26,7 @@ export function useFileUpload(options) {
   const inputRef = ref();
   const dropzoneRef = ref();
   const dataTypes = computed(() => parseAcceptToDataTypes(unref(accept)));
-  const onDrop = (files) => {
+  const onDrop = (files, fromDropZone = false) => {
     if (!files || files.length === 0) {
       return;
     }
@@ -36,6 +36,15 @@ export function useFileUpload(options) {
     if (files.length > 1 && !multiple) {
       files = [files[0]];
     }
+    if (fromDropZone && inputRef.value?.$el) {
+      try {
+        const dt = new DataTransfer();
+        files.forEach((file) => dt.items.add(file));
+        inputRef.value.$el.files = dt.files;
+      } catch (e) {
+        console.warn("Could not sync files to input element:", e);
+      }
+    }
     onUpdate(files);
   };
   const isDragging = ref(false);
@@ -47,18 +56,18 @@ export function useFileUpload(options) {
     fileDialog.open();
   }
   onMounted(() => {
-    const { isOverDropZone } = dropzone ? useDropZone(dropzoneRef, { dataTypes: dataTypes.value, onDrop }) : { isOverDropZone: ref(false) };
+    const { isOverDropZone } = dropzone ? useDropZone(dropzoneRef, { dataTypes: dataTypes.value, onDrop: (files) => onDrop(files, true) }) : { isOverDropZone: ref(false) };
     watch(isOverDropZone, (value) => {
       isDragging.value = value;
     });
     const { onChange, open: open2 } = useFileDialog({
       accept: unref(accept),
       multiple,
-      input: unref(inputRef),
+      input: unref(inputRef)?.$el,
       reset
     });
     fileDialog.open = open2;
-    onChange((fileList) => onDrop(fileList));
+    onChange((fileList) => onDrop(fileList, false));
   });
   return {
     isDragging,

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

@@ -28,7 +28,7 @@ export declare function useFormField<T>(props?: Props<T>, opts?: {
 }): {
     id: ComputedRef<string | undefined>;
     name: ComputedRef<string | undefined>;
-    size: ComputedRef<"xs" | "sm" | "md" | "lg" | "xl" | NonNullable<GetObjectField<T, "size">> | undefined>;
+    size: ComputedRef<"md" | "xs" | "sm" | "lg" | "xl" | NonNullable<GetObjectField<T, "size">> | undefined>;
     color: ComputedRef<"error" | GetObjectField<T, "color"> | undefined>;
     highlight: ComputedRef<boolean | undefined>;
     disabled: ComputedRef<boolean | undefined>;

package/dist/runtime/composables/useKbd.js

@@ -43,7 +43,7 @@ const _useKbd = () => {
     if (["meta", "alt", "ctrl"].includes(value)) {
       return kbdKeysSpecificMap[value];
     }
-    return kbdKeysMap[value] || value.toUpperCase();
+    return kbdKeysMap[value] || value;
   }
   return {
     macOS,

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

@@ -1,11 +1,13 @@
+import type { Ref, InjectionKey } from 'vue';
 import type { ToastProps, ToastEmits } from '../types';
 import type { EmitsToProps } from '../types/utils';
+export declare const toastMaxInjectionKey: InjectionKey<Ref<number | undefined>>;
 export interface Toast extends Omit<ToastProps, 'defaultOpen'>, EmitsToProps<ToastEmits> {
     id: string | number;
     onClick?: (toast: Toast) => void;
 }
 export declare function useToast(): {
-    toasts: import("vue").Ref<Toast[], Toast[]>;
+    toasts: Ref<Toast[], Toast[]>;
     add: (toast: Partial<Toast>) => Toast;
     update: (id: string | number, toast: Omit<Partial<Toast>, "id">) => void;
     remove: (id: string | number) => void;

package/dist/runtime/composables/useToast.js

@@ -1,8 +1,9 @@
-import { ref, nextTick } from "vue";
+import { ref, nextTick, inject } from "vue";
 import { useState } from "#imports";
+export const toastMaxInjectionKey = Symbol("nuxt-ui.toast-max");
 export function useToast() {
   const toasts = useState("toasts", () => []);
-  const maxToasts = 5;
+  const max = inject(toastMaxInjectionKey, void 0);
   const running = ref(false);
   const queue = [];
   const generateId = () => `${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
@@ -14,7 +15,7 @@ export function useToast() {
     while (queue.length > 0) {
       const toast = queue.shift();
       await nextTick();
-      toasts.value = [...toasts.value, toast].slice(-maxToasts);
+      toasts.value = [...toasts.value, toast].slice(-(max?.value ?? 5));
     }
     running.value = false;
   }

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{body{@apply antialiased text-default bg-default scheme-light dark:scheme-dark}:root{--ui-header-height:--spacing(16)}.light,: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:var(--color-white);--ui-bg:var(--color-white);--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);--ui-radius:0.25rem;--ui-container:var(--container-7xl)}.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:var(--color-white);--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:var(--color-white);--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:var(--color-white)}}
+@import "#build/ui.css";@import "./keyframes.css";@source "./components";@variant light (&:where(.light, .light *));@variant dark (&:where(.dark, .dark *));@layer theme{:host,:root{--ui-header-height:--spacing(16)}.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);--ui-radius:0.25rem;--ui-container:80rem}.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/inertia/components/Link.d.vue.ts

@@ -1,6 +1,11 @@
-import type { ButtonHTMLAttributes } from 'vue';
 import type { InertiaLinkProps } from '@inertiajs/vue3';
-interface NuxtLinkProps extends Omit<InertiaLinkProps, 'href' | 'onClick'> {
+import type { ButtonHTMLAttributes, AnchorHTMLAttributes } from '../../types/html';
+export interface LinkProps extends Partial<Omit<InertiaLinkProps, 'href' | 'onClick'>>, /** @vue-ignore */ Omit<ButtonHTMLAttributes, 'type' | 'disabled'>, /** @vue-ignore */ Omit<AnchorHTMLAttributes, 'href' | 'target' | 'rel' | 'type'> {
+    /**
+     * The element or component this component should render as when not a link.
+     * @defaultValue 'button'
+     */
+    as?: any;
     activeClass?: string;
     /**
      * Route Location the link should navigate to when clicked on.
@@ -9,7 +14,7 @@ interface NuxtLinkProps extends Omit<InertiaLinkProps, 'href' | 'onClick'> {
     /**
      * An alias for `to`. If used with `to`, `href` will be ignored
      */
-    href?: NuxtLinkProps['to'];
+    href?: LinkProps['to'];
     /**
      * Forces the link to be considered as external (true) or internal (false). This is helpful to handle edge-cases
      */
@@ -18,14 +23,16 @@ interface NuxtLinkProps extends Omit<InertiaLinkProps, 'href' | 'onClick'> {
      * Where to display the linked URL, as the name for a browsing context.
      */
     target?: '_blank' | '_parent' | '_self' | '_top' | (string & {}) | null;
-    ariaCurrentValue?: string;
-}
-export interface LinkProps extends NuxtLinkProps {
     /**
-     * The element or component this component should render as when not a link.
-     * @defaultValue 'button'
+     * A rel attribute value to apply on the link. Defaults to "noopener noreferrer" for external links.
      */
-    as?: any;
+    rel?: 'noopener' | 'noreferrer' | 'nofollow' | 'sponsored' | 'ugc' | (string & {}) | null;
+    /**
+     * Value passed to the attribute `aria-current` when the link is exact active.
+     *
+     * @defaultValue `'page'`
+     */
+    ariaCurrentValue?: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false';
     /**
      * The type of the button when not a link.
      * @defaultValue 'button'
@@ -51,8 +58,8 @@ export interface LinkSlots {
 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;
-    activeClass: string;
     active: boolean;
+    activeClass: string;
     inactiveClass: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, LinkSlots>;
 declare const _default: typeof __VLS_export;