@nuxt/ui 4.9.0 → 4.11.0

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

@@ -2,7 +2,8 @@ import type { CheckboxGroupRootProps, CheckboxGroupRootEmits } from 'reka-ui';
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/checkbox-group';
-import type { CheckboxProps } from '../types';
+import type { CheckboxProps } from './Checkbox.vue';
+import type { IconProps } from './Icon.vue';
 import type { AcceptableValue, GetItemKeys, GetModelValue, GetModelValueEmits } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type CheckboxGroup = ComponentConfig<typeof theme, AppConfig, 'checkboxGroup'>;
@@ -12,6 +13,11 @@ export type CheckboxGroupItem = CheckboxGroupValue | {
     description?: string;
     disabled?: boolean;
     value?: string;
+    /**
+     * The icon displayed when checked, or above the label when `indicator` is `hidden`.
+     * @IconifyIcon
+     */
+    icon?: IconProps['name'];
     class?: any;
     ui?: Pick<CheckboxGroup['slots'], 'item'> & Omit<Required<CheckboxProps>['ui'], 'root'>;
     [key: string]: any;
@@ -86,7 +92,7 @@ declare const __VLS_export: <T extends CheckboxGroupItem[], VK extends GetItemKe
     slots: CheckboxGroupSlots<T>;
     emit: ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: import("../types").GetItemValue<T, VK, undefined, import("../types").NestedItem<T>>[]) => 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/CheckboxGroup.vue

@@ -41,16 +41,21 @@ const slots = defineSlots();
 const props = useComponentProps("checkboxGroup", _props);
 const appConfig = useAppConfig();
 const rootProps = useForwardProps(reactivePick(props, "as", "modelValue", "defaultValue", "orientation", "loop", "required"), emits);
-const checkboxProps = useForwardProps(reactivePick(props, "variant", "indicator", "icon"));
+const checkboxProps = useForwardProps(reactivePick(props, "variant", "indicator"));
 const getProxySlots = () => omit(slots, ["legend"]);
-const { emitFormChange, emitFormInput, color, highlight, name, size, id: _id, disabled, ariaAttrs } = useFormField(_props, { bind: false });
+const { emitFormChange, emitFormInput, color: formFieldColor, highlight: formFieldHighlight, name, size: formFieldSize, id: _id, disabled: formFieldDisabled, ariaAttrs } = useFormField(_props, { bind: false });
 const id = _id.value ?? useId();
+const color = computed(() => formFieldColor.value ?? props.color);
+const size = computed(() => formFieldSize.value ?? props.size);
+const highlight = computed(() => formFieldHighlight.value ?? props.highlight);
+const disabled = computed(() => formFieldDisabled.value ?? props.disabled);
 const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.checkboxGroup || {} })({
-  size: size.value ?? props.size,
+  size: size.value,
   required: props.required,
   orientation: props.orientation,
-  color: color.value ?? props.color,
+  color: color.value,
   variant: props.variant,
+  highlight: highlight.value,
   disabled: disabled.value
 }));
 function normalizeItem(item) {
@@ -114,6 +119,7 @@ function onUpdate(value) {
         v-for="item in normalizedItems"
         :key="item.value"
         v-bind="{ ...item, ...checkboxProps }"
+        :icon="item.icon ?? props.icon"
         :color="color"
         :highlight="highlight"
         :size="size"

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

@@ -2,7 +2,8 @@ import type { CheckboxGroupRootProps, CheckboxGroupRootEmits } from 'reka-ui';
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/checkbox-group';
-import type { CheckboxProps } from '../types';
+import type { CheckboxProps } from './Checkbox.vue';
+import type { IconProps } from './Icon.vue';
 import type { AcceptableValue, GetItemKeys, GetModelValue, GetModelValueEmits } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type CheckboxGroup = ComponentConfig<typeof theme, AppConfig, 'checkboxGroup'>;
@@ -12,6 +13,11 @@ export type CheckboxGroupItem = CheckboxGroupValue | {
     description?: string;
     disabled?: boolean;
     value?: string;
+    /**
+     * The icon displayed when checked, or above the label when `indicator` is `hidden`.
+     * @IconifyIcon
+     */
+    icon?: IconProps['name'];
     class?: any;
     ui?: Pick<CheckboxGroup['slots'], 'item'> & Omit<Required<CheckboxProps>['ui'], 'root'>;
     [key: string]: any;
@@ -86,7 +92,7 @@ declare const __VLS_export: <T extends CheckboxGroupItem[], VK extends GetItemKe
     slots: CheckboxGroupSlots<T>;
     emit: ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: import("../types").GetItemValue<T, VK, undefined, import("../types").NestedItem<T>>[]) => 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/Chip.vue

@@ -26,7 +26,7 @@ const props = useComponentProps("chip", _props);
 const show = defineModel("show", { type: Boolean, ...{ default: true } });
 const { size } = useAvatarGroup(_props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.chip || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.chip || {} })({
   color: props.color,
   size: size.value ?? props.size,
   position: props.position,
@@ -36,8 +36,8 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.chip || {} })
 </script>
 
 <template>
-  <Primitive :as="props.as" data-slot="root" :class="ui.root({ class: [props.ui?.root, props.class] })">
-    <Slot v-bind="$attrs">
+  <Primitive :as="props.as" :data-slot="$attrs['data-slot'] ?? 'root'" :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <Slot v-bind="{ ...$attrs, 'data-slot': void 0 }">
       <slot />
     </Slot>
 

package/dist/runtime/components/Collapsible.vue

@@ -24,7 +24,7 @@ const slots = defineSlots();
 const props = useComponentProps("collapsible", _props);
 const appConfig = useAppConfig();
 const rootProps = useForwardProps(reactivePick(props, "as", "defaultOpen", "open", "disabled", "unmountOnHide"), emits);
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.collapsible || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.collapsible || {} })());
 </script>
 
 <template>

package/dist/runtime/components/ColorPicker.vue

@@ -41,7 +41,7 @@ const _props = defineProps({
 const props = useComponentProps("colorPicker", _props);
 const modelValue = defineModel({ type: String, ...void 0 });
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.colorPicker || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.colorPicker || {} })({
   size: props.size
 }));
 const pickedColor = computed({

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

@@ -4,7 +4,13 @@ import type { AppConfig } from '@nuxt/schema';
 import type { UseFuseOptions } from '@vueuse/integrations/useFuse';
 import theme from '#build/ui/command-palette';
 import type { UseComponentIconsProps } from '../composables/useComponentIcons';
-import type { AvatarProps, ButtonProps, ChipProps, KbdProps, InputProps, LinkProps, IconProps, LinkPropsKeys } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { ButtonProps } from './Button.vue';
+import type { ChipProps } from './Chip.vue';
+import type { KbdProps } from './Kbd.vue';
+import type { InputProps } from './Input.vue';
+import type { LinkProps, LinkPropsKeys } from './Link.vue';
+import type { IconProps } from './Icon.vue';
 import type { GetItemKeys } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type CommandPalette = ComponentConfig<typeof theme, AppConfig, 'commandPalette'>;
@@ -230,27 +236,27 @@ declare const __VLS_export: <G extends CommandPaletteGroup<T>, T extends Command
     props: import("vue").PublicProps & __VLS_PrettifyLocal<(CommandPaletteProps<G, T> & {
         searchTerm?: string;
     }) & {
+        onLeave?: ((event: Event) => any) | undefined;
         "onUpdate:open"?: ((value: boolean) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: T) => any) | undefined;
         onHighlight?: ((payload: {
             ref: HTMLElement;
             value: T;
         } | undefined) => any) | undefined;
-        "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: T) => 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: CommandPaletteSlots<T, G>;
-    emit: (((evt: "update:open", value: boolean) => void) & ((evt: "update:modelValue", value: T) => void) & ((evt: "highlight", payload: {
+    emit: (((evt: "leave", event: Event) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "highlight", payload: {
         ref: HTMLElement;
         value: T;
-    } | undefined) => void) & ((evt: "entryFocus", event: CustomEvent<any>) => void) & ((evt: "leave", event: Event) => void)) & ((event: "update:searchTerm", value: string) => void);
+    } | undefined) => void) & ((evt: "update:modelValue", value: T) => 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/CommandPalette.vue

@@ -89,7 +89,7 @@ const [DefineItemTemplate, ReuseItemTemplate] = createReusableTemplate({
     }
   }
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.commandPalette || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.commandPalette || {} })({
   size: props.size,
   virtualize: !!props.virtualize
 }));
@@ -318,7 +318,7 @@ function onSelect(e, item) {
     </ULink>
   </DefineItemTemplate>
 
-  <ListboxRoot v-bind="{ ...rootProps, ...$attrs }" ref="rootRef" :selection-behavior="props.selectionBehavior" data-slot="root" :class="ui.root({ class: [props.ui?.root, props.class] })">
+  <ListboxRoot ref="rootRef" data-slot="root" v-bind="{ ...rootProps, ...$attrs }" :selection-behavior="props.selectionBehavior" :class="ui.root({ class: [props.ui?.root, props.class] })">
     <ListboxFilter v-if="props.input" v-model="searchTerm" as-child>
       <UInput
         variant="none"

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

@@ -4,7 +4,13 @@ import type { AppConfig } from '@nuxt/schema';
 import type { UseFuseOptions } from '@vueuse/integrations/useFuse';
 import theme from '#build/ui/command-palette';
 import type { UseComponentIconsProps } from '../composables/useComponentIcons';
-import type { AvatarProps, ButtonProps, ChipProps, KbdProps, InputProps, LinkProps, IconProps, LinkPropsKeys } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { ButtonProps } from './Button.vue';
+import type { ChipProps } from './Chip.vue';
+import type { KbdProps } from './Kbd.vue';
+import type { InputProps } from './Input.vue';
+import type { LinkProps, LinkPropsKeys } from './Link.vue';
+import type { IconProps } from './Icon.vue';
 import type { GetItemKeys } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type CommandPalette = ComponentConfig<typeof theme, AppConfig, 'commandPalette'>;
@@ -230,27 +236,27 @@ declare const __VLS_export: <G extends CommandPaletteGroup<T>, T extends Command
     props: import("vue").PublicProps & __VLS_PrettifyLocal<(CommandPaletteProps<G, T> & {
         searchTerm?: string;
     }) & {
+        onLeave?: ((event: Event) => any) | undefined;
         "onUpdate:open"?: ((value: boolean) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: T) => any) | undefined;
         onHighlight?: ((payload: {
             ref: HTMLElement;
             value: T;
         } | undefined) => any) | undefined;
-        "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: T) => 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: CommandPaletteSlots<T, G>;
-    emit: (((evt: "update:open", value: boolean) => void) & ((evt: "update:modelValue", value: T) => void) & ((evt: "highlight", payload: {
+    emit: (((evt: "leave", event: Event) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "highlight", payload: {
         ref: HTMLElement;
         value: T;
-    } | undefined) => void) & ((evt: "entryFocus", event: CustomEvent<any>) => void) & ((evt: "leave", event: Event) => void)) & ((event: "update:searchTerm", value: string) => void);
+    } | undefined) => void) & ((evt: "update:modelValue", value: T) => 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/Container.vue

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

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

@@ -2,7 +2,10 @@ import type { ContextMenuRootProps, ContextMenuRootEmits, ContextMenuContentProp
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/context-menu';
-import type { AvatarProps, IconProps, KbdProps, LinkProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { IconProps } from './Icon.vue';
+import type { KbdProps } from './Kbd.vue';
+import type { LinkProps } from './Link.vue';
 import type { ArrayOrNested, DynamicSlots, GetItemKeys, MergeTypes, NestedItem, EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type ContextMenu = ComponentConfig<typeof theme, AppConfig, 'contextMenu'>;
@@ -133,7 +136,7 @@ declare const __VLS_export: <T extends ArrayOrNested<ContextMenuItem>>(__VLS_pro
     slots: ContextMenuSlots<T, NestedItem<T>>;
     emit: (evt: "update:open", payload: boolean) => 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/ContextMenu.vue

@@ -35,7 +35,7 @@ const appConfig = useAppConfig();
 const rootProps = useForwardProps(reactivePick(props, "modal"), emits);
 const contentProps = toRef(() => props.content);
 const getProxySlots = () => omit(slots, ["default"]);
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.contextMenu || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.contextMenu || {} })({
   size: props.size
 }));
 </script>

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

@@ -2,7 +2,10 @@ import type { ContextMenuRootProps, ContextMenuRootEmits, ContextMenuContentProp
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/context-menu';
-import type { AvatarProps, IconProps, KbdProps, LinkProps } from '../types';
+import type { AvatarProps } from './Avatar.vue';
+import type { IconProps } from './Icon.vue';
+import type { KbdProps } from './Kbd.vue';
+import type { LinkProps } from './Link.vue';
 import type { ArrayOrNested, DynamicSlots, GetItemKeys, MergeTypes, NestedItem, EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type ContextMenu = ComponentConfig<typeof theme, AppConfig, 'contextMenu'>;
@@ -133,7 +136,7 @@ declare const __VLS_export: <T extends ArrayOrNested<ContextMenuItem>>(__VLS_pro
     slots: ContextMenuSlots<T, NestedItem<T>>;
     emit: (evt: "update:open", payload: boolean) => 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/ContextMenuContent.d.vue.ts

@@ -2,7 +2,8 @@ import { ContextMenu } from 'reka-ui/namespaced';
 import type { ContextMenuContentProps as RekaContextMenuContentProps } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import type theme from '#build/ui/context-menu';
-import type { ContextMenuItem, ContextMenuSlots, IconProps } from '../types';
+import type { ContextMenuItem, ContextMenuSlots } from './ContextMenu.vue';
+import type { IconProps } from './Icon.vue';
 import type { ArrayOrNested, GetItemKeys } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type ContextMenu = ComponentConfig<typeof theme, AppConfig, 'contextMenu'>;
@@ -45,7 +46,7 @@ declare const __VLS_export: <T extends ArrayOrNested<ContextMenuItem>>(__VLS_pro
     slots: ContextMenuSlots<T>;
     emit: ((evt: "escapeKeyDown", event: KeyboardEvent) => void) & ((evt: "pointerDownOutside", event: import("reka-ui").PointerDownOutsideEvent) => void) & ((evt: "focusOutside", event: import("reka-ui").FocusOutsideEvent) => void) & ((evt: "interactOutside", event: import("reka-ui").PointerDownOutsideEvent | import("reka-ui").FocusOutsideEvent) => void) & ((evt: "closeAutoFocus", event: Event) => 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/ContextMenuContent.vue

@@ -32,6 +32,7 @@ const props = defineProps({
   ui: { type: null, required: true },
   uiOverride: { type: null, required: false },
   loop: { type: Boolean, required: false },
+  memoDependencies: { type: Array, required: false },
   sideFlip: { type: Boolean, required: false },
   alignOffset: { type: Number, required: false },
   alignFlip: { type: Boolean, required: false },

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

@@ -2,7 +2,8 @@ import { ContextMenu } from 'reka-ui/namespaced';
 import type { ContextMenuContentProps as RekaContextMenuContentProps } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import type theme from '#build/ui/context-menu';
-import type { ContextMenuItem, ContextMenuSlots, IconProps } from '../types';
+import type { ContextMenuItem, ContextMenuSlots } from './ContextMenu.vue';
+import type { IconProps } from './Icon.vue';
 import type { ArrayOrNested, GetItemKeys } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type ContextMenu = ComponentConfig<typeof theme, AppConfig, 'contextMenu'>;
@@ -45,7 +46,7 @@ declare const __VLS_export: <T extends ArrayOrNested<ContextMenuItem>>(__VLS_pro
     slots: ContextMenuSlots<T>;
     emit: ((evt: "escapeKeyDown", event: KeyboardEvent) => void) & ((evt: "pointerDownOutside", event: import("reka-ui").PointerDownOutsideEvent) => void) & ((evt: "focusOutside", event: import("reka-ui").FocusOutsideEvent) => void) & ((evt: "interactOutside", event: import("reka-ui").PointerDownOutsideEvent | import("reka-ui").FocusOutsideEvent) => void) & ((evt: "closeAutoFocus", event: Event) => 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/DashboardGroup.d.vue.ts

@@ -18,9 +18,9 @@ declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DashboardGroupProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DashboardGroupProps> & Readonly<{}>, {
     storage: "cookie" | "local";
-    unit: "%" | "rem" | "px";
     storageKey: string;
     persistent: boolean;
+    unit: "%" | "rem" | "px";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, DashboardGroupSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/components/DashboardGroup.vue

@@ -23,7 +23,7 @@ defineSlots();
 const props = useComponentProps("dashboardGroup", _props);
 const nuxtApp = useNuxtApp();
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.dashboardGroup || {} }));
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.dashboardGroup || {} }));
 const sidebarOpen = ref(false);
 const sidebarCollapsed = ref(false);
 provideDashboardContext({

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

@@ -18,9 +18,9 @@ declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DashboardGroupProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DashboardGroupProps> & Readonly<{}>, {
     storage: "cookie" | "local";
-    unit: "%" | "rem" | "px";
     storageKey: string;
     persistent: boolean;
+    unit: "%" | "rem" | "px";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, DashboardGroupSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -2,7 +2,9 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/dashboard-navbar';
 import type { DashboardContext } from '../utils/dashboard';
-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 DashboardNavbar = ComponentConfig<typeof theme, AppConfig, 'dashboardNavbar'>;
 export interface DashboardNavbarProps {

package/dist/runtime/components/DashboardNavbar.vue

@@ -27,7 +27,7 @@ const props = useComponentProps("dashboardNavbar", _props);
 const appConfig = useAppConfig();
 const dashboardContext = useDashboard({});
 const [DefineToggleTemplate, ReuseToggleTemplate] = createReusableTemplate();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.dashboardNavbar || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.dashboardNavbar || {} })());
 </script>
 
 <template>
@@ -43,7 +43,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.dashboardNavb
     </slot>
   </DefineToggleTemplate>
 
-  <Primitive :as="props.as" v-bind="$attrs" data-slot="root" :class="ui.root({ class: [props.ui?.root, props.class] })">
+  <Primitive :as="props.as" data-slot="root" v-bind="$attrs" :class="ui.root({ class: [props.ui?.root, props.class] })">
     <div data-slot="left" :class="ui.left({ class: props.ui?.left })">
       <ReuseToggleTemplate v-if="props.toggleSide === 'left'" />
 

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

@@ -2,7 +2,9 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/dashboard-navbar';
 import type { DashboardContext } from '../utils/dashboard';
-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 DashboardNavbar = ComponentConfig<typeof theme, AppConfig, 'dashboardNavbar'>;
 export interface DashboardNavbarProps {

package/dist/runtime/components/DashboardPanel.vue

@@ -26,7 +26,7 @@ const appConfig = useAppConfig();
 const dashboardContext = useDashboard({ storageKey: "dashboard", unit: "%" });
 const id = `${dashboardContext.storageKey}-panel-${props.id || useId()}`;
 const { el, size, isDragging, onMouseDown, onTouchStart, onDoubleClick } = useResizable(id, toRef(() => ({ ...dashboardContext, ...props })));
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.dashboardPanel || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.dashboardPanel || {} })({
   size: !!size.value
 }));
 </script>
@@ -35,9 +35,9 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.dashboardPane
   <div
     :id="id"
     ref="el"
+    data-slot="root"
     v-bind="$attrs"
     :data-dragging="isDragging"
-    data-slot="root"
     :class="ui.root({ class: [props.ui?.root, props.class] })"
     :style="[size ? { '--width': `${size}${dashboardContext.unit}` } : void 0]"
   >

package/dist/runtime/components/DashboardResizeHandle.vue

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

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

@@ -2,10 +2,14 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/dashboard-search';
 import type { UseFuseOptions } from '@vueuse/integrations/useFuse';
-import type { ButtonProps, ModalProps, CommandPaletteProps, CommandPaletteSlots, CommandPaletteGroup, CommandPaletteItem, LinkPropsKeys, InputProps } from '../types';
+import type { ButtonProps } from './Button.vue';
+import type { ModalProps } from './Modal.vue';
+import type { CommandPaletteProps, CommandPaletteSlots, CommandPaletteGroup, CommandPaletteItem } from './CommandPalette.vue';
+import type { LinkPropsKeys } from './Link.vue';
+import type { InputProps } from './Input.vue';
 import type { ComponentConfig } from '../types/tv';
 type DashboardSearch = ComponentConfig<typeof theme, AppConfig, 'dashboardSearch'>;
-export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPaletteItem> extends Pick<ModalProps, 'title' | 'description' | 'overlay' | 'transition' | 'content' | 'dismissible' | 'fullscreen' | 'modal' | 'portal'>, Pick<CommandPaletteProps<CommandPaletteGroup<T>, T>, 'icon' | 'trailingIcon' | 'selectedIcon' | 'childrenIcon' | 'placeholder' | 'autofocus' | 'loading' | 'loadingIcon' | 'closeIcon' | 'back' | 'backIcon' | 'disabled' | 'highlightOnHover' | 'labelKey' | 'descriptionKey' | 'preserveGroupOrder' | 'virtualize' | 'groups'> {
+export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPaletteItem> extends Pick<ModalProps, 'title' | 'description' | 'overlay' | 'transition' | 'content' | 'dismissible' | 'fullscreen' | 'modal' | 'portal' | 'unmountOnHide'>, Pick<CommandPaletteProps<CommandPaletteGroup<T>, T>, 'icon' | 'trailingIcon' | 'selectedIcon' | 'childrenIcon' | 'placeholder' | 'autofocus' | 'loading' | 'loadingIcon' | 'closeIcon' | 'back' | 'backIcon' | 'disabled' | 'highlightOnHover' | 'labelKey' | 'descriptionKey' | 'preserveGroupOrder' | 'virtualize' | 'groups'> {
     /**
      * @defaultValue 'md'
      */
@@ -80,10 +84,10 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<Dashbo
     "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
 }>, {
     close: boolean | Omit<ButtonProps, LinkPropsKeys>;
+    shortcut: string;
     colorMode: boolean;
-    searchDelay: number;
     fullscreen: boolean;
-    shortcut: string;
+    searchDelay: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, DashboardSearchSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/components/DashboardSearch.vue

@@ -33,6 +33,7 @@ const _props = defineProps({
   fullscreen: { type: Boolean, required: false, default: false },
   modal: { type: Boolean, required: false },
   portal: { type: [Boolean, String], required: false, skipCheck: true },
+  unmountOnHide: { type: Boolean, required: false },
   icon: { type: [String, Boolean], required: false, skipCheck: true },
   trailingIcon: { type: null, required: false },
   selectedIcon: { type: null, required: false },
@@ -63,7 +64,7 @@ const { t } = 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"));
-const modalProps = useForwardProps(reactivePick(props, "overlay", "transition", "content", "dismissible", "fullscreen", "modal", "portal"));
+const modalProps = useForwardProps(reactivePick(props, "overlay", "transition", "content", "dismissible", "fullscreen", "modal", "portal", "unmountOnHide"));
 const inputProps = computed(() => {
   if (props.input === false) {
     return false;
@@ -76,7 +77,7 @@ const fuse = computed(() => defu({}, props.fuse, {
     useTokenSearch: true
   }
 }));
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.dashboardSearch || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.dashboardSearch || {} })({
   size: props.size,
   fullscreen: props.fullscreen
 }));

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

@@ -2,10 +2,14 @@ import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/dashboard-search';
 import type { UseFuseOptions } from '@vueuse/integrations/useFuse';
-import type { ButtonProps, ModalProps, CommandPaletteProps, CommandPaletteSlots, CommandPaletteGroup, CommandPaletteItem, LinkPropsKeys, InputProps } from '../types';
+import type { ButtonProps } from './Button.vue';
+import type { ModalProps } from './Modal.vue';
+import type { CommandPaletteProps, CommandPaletteSlots, CommandPaletteGroup, CommandPaletteItem } from './CommandPalette.vue';
+import type { LinkPropsKeys } from './Link.vue';
+import type { InputProps } from './Input.vue';
 import type { ComponentConfig } from '../types/tv';
 type DashboardSearch = ComponentConfig<typeof theme, AppConfig, 'dashboardSearch'>;
-export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPaletteItem> extends Pick<ModalProps, 'title' | 'description' | 'overlay' | 'transition' | 'content' | 'dismissible' | 'fullscreen' | 'modal' | 'portal'>, Pick<CommandPaletteProps<CommandPaletteGroup<T>, T>, 'icon' | 'trailingIcon' | 'selectedIcon' | 'childrenIcon' | 'placeholder' | 'autofocus' | 'loading' | 'loadingIcon' | 'closeIcon' | 'back' | 'backIcon' | 'disabled' | 'highlightOnHover' | 'labelKey' | 'descriptionKey' | 'preserveGroupOrder' | 'virtualize' | 'groups'> {
+export interface DashboardSearchProps<T extends CommandPaletteItem = CommandPaletteItem> extends Pick<ModalProps, 'title' | 'description' | 'overlay' | 'transition' | 'content' | 'dismissible' | 'fullscreen' | 'modal' | 'portal' | 'unmountOnHide'>, Pick<CommandPaletteProps<CommandPaletteGroup<T>, T>, 'icon' | 'trailingIcon' | 'selectedIcon' | 'childrenIcon' | 'placeholder' | 'autofocus' | 'loading' | 'loadingIcon' | 'closeIcon' | 'back' | 'backIcon' | 'disabled' | 'highlightOnHover' | 'labelKey' | 'descriptionKey' | 'preserveGroupOrder' | 'virtualize' | 'groups'> {
     /**
      * @defaultValue 'md'
      */
@@ -80,10 +84,10 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<Dashbo
     "onUpdate:searchTerm"?: ((value: string) => any) | undefined;
 }>, {
     close: boolean | Omit<ButtonProps, LinkPropsKeys>;
+    shortcut: string;
     colorMode: boolean;
-    searchDelay: number;
     fullscreen: boolean;
-    shortcut: string;
+    searchDelay: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, DashboardSearchSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

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

@@ -1,6 +1,10 @@
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/dashboard-search-button';
-import type { ButtonProps, ButtonSlots, IconProps, KbdProps, TooltipProps, LinkPropsKeys } from '../types';
+import type { ButtonProps, ButtonSlots } from './Button.vue';
+import type { IconProps } from './Icon.vue';
+import type { KbdProps } from './Kbd.vue';
+import type { TooltipProps } from './Tooltip.vue';
+import type { LinkPropsKeys } from './Link.vue';
 import type { ComponentConfig } from '../types/tv';
 type DashboardSearchButton = ComponentConfig<typeof theme, AppConfig, 'dashboardSearchButton'>;
 export interface DashboardSearchButtonProps extends Omit<ButtonProps, LinkPropsKeys | 'icon' | 'label' | 'color' | 'variant'> {
@@ -47,10 +51,10 @@ export interface DashboardSearchButtonProps extends Omit<ButtonProps, LinkPropsK
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DashboardSearchButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DashboardSearchButtonProps> & Readonly<{}>, {
-    color: "error" | "neutral" | "primary" | "secondary" | "success" | "info" | "warning";
-    tooltip: boolean | TooltipProps;
+    color: "error" | "primary" | "secondary" | "success" | "info" | "warning" | "neutral";
     kbds: KbdProps["value"][] | KbdProps[];
     collapsed: boolean;
+    tooltip: boolean | TooltipProps;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ButtonSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/components/DashboardSearchButton.vue

@@ -57,7 +57,7 @@ const { t } = useLocale();
 const appConfig = useAppConfig();
 const { toggleSearch } = useDashboard({ toggleSearch: () => {
 } });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.dashboardSearchButton || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.dashboardSearchButton || {} })({
   collapsed: props.collapsed
 }));
 </script>