@nuxt/ui 4.0.1 → 4.1.0

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

@@ -69,10 +69,7 @@ export interface ModalSlots {
     description(props?: {}): any;
     actions(props?: {}): any;
     close(props: {
-        close: () => void;
-        ui: {
-            [K in keyof Required<Modal['slots']>]: (props?: Record<string, any>) => string;
-        };
+        ui: Modal['ui'];
     }): any;
     body(props: {
         close: () => void;

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

@@ -52,7 +52,7 @@ export interface NavigationMenuItem extends Omit<LinkProps, 'type' | 'raw' | 'cu
     children?: NavigationMenuChildItem[];
     defaultOpen?: boolean;
     open?: boolean;
-    onSelect?(e: Event): void;
+    onSelect?: (e: Event) => void;
     class?: any;
     ui?: Pick<NavigationMenu['slots'], 'item' | 'linkLeadingAvatarSize' | 'linkLeadingAvatar' | 'linkLeadingIcon' | 'linkLabel' | 'linkLabelExternalIcon' | 'linkTrailing' | 'linkTrailingBadgeSize' | 'linkTrailingBadge' | 'linkTrailingIcon' | 'label' | 'link' | 'content' | 'childList' | 'childLabel' | 'childItem' | 'childLink' | 'childLinkIcon' | 'childLinkWrapper' | 'childLinkLabel' | 'childLinkLabelExternalIcon' | 'childLinkDescription'>;
     [key: string]: any;
@@ -141,18 +141,30 @@ type SlotProps<T extends NavigationMenuItem> = (props: {
     item: T;
     index: number;
     active?: boolean;
+    ui: NavigationMenu['ui'];
 }) => any;
 export type NavigationMenuSlots<A extends ArrayOrNested<NavigationMenuItem> = ArrayOrNested<NavigationMenuItem>, T extends NestedItem<A> = NestedItem<A>> = {
     'item': SlotProps<T>;
     'item-leading': SlotProps<T>;
-    'item-label': SlotProps<T>;
+    'item-label': (props: {
+        item: T;
+        index: number;
+        active?: boolean;
+    }) => any;
     'item-trailing': SlotProps<T>;
-    'item-content': SlotProps<T>;
+    'item-content': SlotProps<T> & {
+        close?: () => void;
+    };
     'list-leading': (props?: {}) => any;
     'list-trailing': (props?: {}) => any;
-} & DynamicSlots<MergeTypes<T>, 'leading' | 'label' | 'trailing' | 'content', {
+} & DynamicSlots<MergeTypes<T>, 'label', {
     index: number;
     active?: boolean;
+    ui: NavigationMenu['ui'];
+}> & DynamicSlots<MergeTypes<T>, 'leading' | 'trailing' | 'content', {
+    index: number;
+    active?: boolean;
+    ui: NavigationMenu['ui'];
 }>;
 declare const __VLS_export: <T extends ArrayOrNested<NavigationMenuItem>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<NavigationMenuProps<T> & {

package/dist/runtime/components/NavigationMenu.vue

@@ -102,8 +102,8 @@ function getAccordionDefaultValue(list, level = 0) {
 
 <template>
   <DefineLinkTemplate v-slot="{ item, active, index }">
-    <slot :name="item.slot || 'item'" :item="item" :index="index">
-      <slot :name="item.slot ? `${item.slot}-leading` : 'item-leading'" :item="item" :active="active" :index="index">
+    <slot :name="item.slot || 'item'" :item="item" :index="index" :active="active" :ui="ui">
+      <slot :name="item.slot ? `${item.slot}-leading` : 'item-leading'" :item="item" :active="active" :index="index" :ui="ui">
         <UAvatar v-if="item.avatar" :size="item.ui?.linkLeadingAvatarSize || props.ui?.linkLeadingAvatarSize || ui.linkLeadingAvatarSize()" v-bind="item.avatar" :class="ui.linkLeadingAvatar({ class: [props.ui?.linkLeadingAvatar, item.ui?.linkLeadingAvatar], active, disabled: !!item.disabled })" />
         <UIcon v-else-if="item.icon" :name="item.icon" :class="ui.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, item.ui?.linkLeadingIcon], active, disabled: !!item.disabled })" />
       </slot>
@@ -119,8 +119,8 @@ function getAccordionDefaultValue(list, level = 0) {
         <UIcon v-if="item.target === '_blank' && externalIcon !== false" :name="typeof externalIcon === 'string' ? externalIcon : appConfig.ui.icons.external" :class="ui.linkLabelExternalIcon({ class: [props.ui?.linkLabelExternalIcon, item.ui?.linkLabelExternalIcon], active })" />
       </span>
 
-      <component :is="orientation === 'vertical' && item.children?.length && !collapsed ? AccordionTrigger : 'span'" v-if="(!collapsed || orientation !== 'vertical') && (item.badge || orientation === 'horizontal' && (item.children?.length || !!slots[item.slot ? `${item.slot}-content` : 'item-content']) || orientation === 'vertical' && item.children?.length || item.trailingIcon || !!slots[item.slot ? `${item.slot}-trailing` : 'item-trailing'])" as="span" :class="ui.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] })" @click.stop.prevent>
-        <slot :name="item.slot ? `${item.slot}-trailing` : 'item-trailing'" :item="item" :active="active" :index="index">
+      <component :is="orientation === 'vertical' && item.children?.length && !collapsed ? AccordionTrigger : 'span'" v-if="(!collapsed || orientation !== 'vertical') && (item.badge !== void 0 || orientation === 'horizontal' && (item.children?.length || !!slots[item.slot ? `${item.slot}-content` : 'item-content']) || orientation === 'vertical' && item.children?.length || item.trailingIcon || !!slots[item.slot ? `${item.slot}-trailing` : 'item-trailing'])" as="span" :class="ui.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] })" @click.stop.prevent>
+        <slot :name="item.slot ? `${item.slot}-trailing` : 'item-trailing'" :item="item" :active="active" :index="index" :ui="ui">
           <UBadge
             v-if="item.badge !== void 0"
             color="neutral"
@@ -159,8 +159,15 @@ function getAccordionDefaultValue(list, level = 0) {
               <ReuseLinkTemplate :item="item" :active="active || item.active" :index="index" />
             </ULinkBase>
 
-            <template #content>
-              <slot :name="item.slot ? `${item.slot}-content` : 'item-content'" :item="item" :active="active || item.active" :index="index">
+            <template #content="{ close }">
+              <slot
+                :name="item.slot ? `${item.slot}-content` : 'item-content'"
+                :item="item"
+                :active="active || item.active"
+                :index="index"
+                :ui="ui"
+                :close="close"
+              >
                 <ul :class="ui.childList({ class: [props.ui?.childList, item.ui?.childList] })">
                   <li :class="ui.childLabel({ class: [props.ui?.childLabel, item.ui?.childLabel] })">
                     {{ get(item, props.labelKey) }}
@@ -195,7 +202,7 @@ function getAccordionDefaultValue(list, level = 0) {
         </component>
 
         <NavigationMenuContent v-if="orientation === 'horizontal' && (item.children?.length || !!slots[item.slot ? `${item.slot}-content` : 'item-content'])" v-bind="contentProps" :class="ui.content({ class: [props.ui?.content, item.ui?.content] })">
-          <slot :name="item.slot ? `${item.slot}-content` : 'item-content'" :item="item" :active="active || item.active" :index="index">
+          <slot :name="item.slot ? `${item.slot}-content` : 'item-content'" :item="item" :active="active || item.active" :index="index" :ui="ui">
             <ul :class="ui.childList({ class: [props.ui?.childList, item.ui?.childList] })">
               <li v-for="(childItem, childIndex) in item.children" :key="childIndex" :class="ui.childItem({ class: [props.ui?.childItem, item.ui?.childItem] })">
                 <ULink v-slot="{ active: childActive, ...childSlotProps }" v-bind="pickLinkProps(childItem)" custom>

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

@@ -52,7 +52,7 @@ export interface NavigationMenuItem extends Omit<LinkProps, 'type' | 'raw' | 'cu
     children?: NavigationMenuChildItem[];
     defaultOpen?: boolean;
     open?: boolean;
-    onSelect?(e: Event): void;
+    onSelect?: (e: Event) => void;
     class?: any;
     ui?: Pick<NavigationMenu['slots'], 'item' | 'linkLeadingAvatarSize' | 'linkLeadingAvatar' | 'linkLeadingIcon' | 'linkLabel' | 'linkLabelExternalIcon' | 'linkTrailing' | 'linkTrailingBadgeSize' | 'linkTrailingBadge' | 'linkTrailingIcon' | 'label' | 'link' | 'content' | 'childList' | 'childLabel' | 'childItem' | 'childLink' | 'childLinkIcon' | 'childLinkWrapper' | 'childLinkLabel' | 'childLinkLabelExternalIcon' | 'childLinkDescription'>;
     [key: string]: any;
@@ -141,18 +141,30 @@ type SlotProps<T extends NavigationMenuItem> = (props: {
     item: T;
     index: number;
     active?: boolean;
+    ui: NavigationMenu['ui'];
 }) => any;
 export type NavigationMenuSlots<A extends ArrayOrNested<NavigationMenuItem> = ArrayOrNested<NavigationMenuItem>, T extends NestedItem<A> = NestedItem<A>> = {
     'item': SlotProps<T>;
     'item-leading': SlotProps<T>;
-    'item-label': SlotProps<T>;
+    'item-label': (props: {
+        item: T;
+        index: number;
+        active?: boolean;
+    }) => any;
     'item-trailing': SlotProps<T>;
-    'item-content': SlotProps<T>;
+    'item-content': SlotProps<T> & {
+        close?: () => void;
+    };
     'list-leading': (props?: {}) => any;
     'list-trailing': (props?: {}) => any;
-} & DynamicSlots<MergeTypes<T>, 'leading' | 'label' | 'trailing' | 'content', {
+} & DynamicSlots<MergeTypes<T>, 'label', {
     index: number;
     active?: boolean;
+    ui: NavigationMenu['ui'];
+}> & DynamicSlots<MergeTypes<T>, 'leading' | 'trailing' | 'content', {
+    index: number;
+    active?: boolean;
+    ui: NavigationMenu['ui'];
 }>;
 declare const __VLS_export: <T extends ArrayOrNested<NavigationMenuItem>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<NavigationMenuProps<T> & {

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

@@ -25,12 +25,19 @@ export interface PageAnchorsProps<T extends PageAnchor = PageAnchor> {
 type SlotProps<T> = (props: {
     link: T;
     active: boolean;
+    ui: PageAnchors['ui'];
 }) => any;
 export interface PageAnchorsSlots<T extends PageAnchor = PageAnchor> {
     'link': SlotProps<T>;
     'link-leading': SlotProps<T>;
-    'link-label': SlotProps<T>;
-    'link-trailing': SlotProps<T>;
+    'link-label'(props: {
+        link: T;
+        active: boolean;
+    }): any;
+    'link-trailing'(props: {
+        link: T;
+        active: boolean;
+    }): any;
 }
 declare const __VLS_export: <T extends PageAnchor>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<PageAnchorsProps<T>> & import("vue").PublicProps;

package/dist/runtime/components/PageAnchors.vue

@@ -28,9 +28,9 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageAnchors |
       <li v-for="(link, index) in links" :key="index" :class="ui.item({ class: [props.ui?.item, link.ui?.item] })">
         <ULink v-slot="{ active, ...slotProps }" v-bind="pickLinkProps(link)" custom>
           <ULinkBase v-bind="slotProps" :class="ui.link({ class: [props.ui?.link, link.ui?.link, link.class], active })">
-            <slot name="link" :link="link" :active="active">
+            <slot name="link" :link="link" :active="active" :ui="ui">
               <div v-if="link.icon || !!slots['link-leading']" :class="ui.linkLeading({ class: [props.ui?.linkLeading, link.ui?.linkLeading], active })">
-                <slot name="link-leading" :link="link" :active="active">
+                <slot name="link-leading" :link="link" :active="active" :ui="ui">
                   <UIcon v-if="link.icon" :name="link.icon" :class="ui.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, link.ui?.linkLeadingIcon], active })" />
                 </slot>
               </div>

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

@@ -25,12 +25,19 @@ export interface PageAnchorsProps<T extends PageAnchor = PageAnchor> {
 type SlotProps<T> = (props: {
     link: T;
     active: boolean;
+    ui: PageAnchors['ui'];
 }) => any;
 export interface PageAnchorsSlots<T extends PageAnchor = PageAnchor> {
     'link': SlotProps<T>;
     'link-leading': SlotProps<T>;
-    'link-label': SlotProps<T>;
-    'link-trailing': SlotProps<T>;
+    'link-label'(props: {
+        link: T;
+        active: boolean;
+    }): any;
+    'link-trailing'(props: {
+        link: T;
+        active: boolean;
+    }): any;
 }
 declare const __VLS_export: <T extends PageAnchor>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<PageAnchorsProps<T>> & import("vue").PublicProps;

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

@@ -55,7 +55,9 @@ export interface PageCardProps {
 export interface PageCardSlots {
     header(props?: {}): any;
     body(props?: {}): any;
-    leading(props?: {}): any;
+    leading(props: {
+        ui: PageCard['ui'];
+    }): any;
     title(props?: {}): any;
     description(props?: {}): any;
     footer(props?: {}): any;

package/dist/runtime/components/PageCard.vue

@@ -80,7 +80,7 @@ const ariaLabel = computed(() => {
         </div>
 
         <div v-if="icon || !!slots.leading" :class="ui.leading({ class: props.ui?.leading })">
-          <slot name="leading">
+          <slot name="leading" :ui="ui">
             <UIcon v-if="icon" :name="icon" :class="ui.leadingIcon({ class: props.ui?.leadingIcon })" />
           </slot>
         </div>

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

@@ -55,7 +55,9 @@ export interface PageCardProps {
 export interface PageCardSlots {
     header(props?: {}): any;
     body(props?: {}): any;
-    leading(props?: {}): any;
+    leading(props: {
+        ui: PageCard['ui'];
+    }): any;
     title(props?: {}): any;
     description(props?: {}): any;
     footer(props?: {}): any;

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

@@ -28,7 +28,9 @@ export interface PageFeatureProps {
     ui?: PageFeature['slots'];
 }
 export interface PageFeatureSlots {
-    leading(props?: {}): any;
+    leading(props: {
+        ui: PageFeature['ui'];
+    }): any;
     title(props?: {}): any;
     description(props?: {}): any;
     default(props?: {}): any;

package/dist/runtime/components/PageFeature.vue

@@ -38,7 +38,7 @@ const ariaLabel = computed(() => {
 <template>
   <Primitive :as="as" :data-orientation="orientation" :class="ui.root({ class: [props.ui?.root, props.class] })" @click="onClick">
     <div v-if="icon || !!slots.leading" :class="ui.leading({ class: props.ui?.leading })">
-      <slot name="leading">
+      <slot name="leading" :ui="ui">
         <UIcon v-if="icon" :name="icon" :class="ui.leadingIcon({ class: props.ui?.leadingIcon })" />
       </slot>
     </div>

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

@@ -28,7 +28,9 @@ export interface PageFeatureProps {
     ui?: PageFeature['slots'];
 }
 export interface PageFeatureSlots {
-    leading(props?: {}): any;
+    leading(props: {
+        ui: PageFeature['ui'];
+    }): any;
     title(props?: {}): any;
     description(props?: {}): any;
     default(props?: {}): any;

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

@@ -26,13 +26,20 @@ export interface PageLinksProps<T extends PageLink = PageLink> {
 type SlotProps<T> = (props: {
     link: T;
     active: boolean;
+    ui: PageLinks['ui'];
 }) => any;
 export interface PageLinksSlots<T extends PageLink = PageLink> {
     'title'(props?: {}): any;
     'link': SlotProps<T>;
     'link-leading': SlotProps<T>;
-    'link-label': SlotProps<T>;
-    'link-trailing': SlotProps<T>;
+    'link-label'(props: {
+        link: T;
+        active: boolean;
+    }): any;
+    'link-trailing'(props: {
+        link: T;
+        active: boolean;
+    }): any;
 }
 declare const __VLS_export: <T extends PageLink>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<PageLinksProps<T>> & import("vue").PublicProps;

package/dist/runtime/components/PageLinks.vue

@@ -35,8 +35,8 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageLinks ||
       <li v-for="(link, index) in links" :key="index" :class="ui.item({ class: [props.ui?.item, link.ui?.item] })">
         <ULink v-slot="{ active, ...slotProps }" v-bind="pickLinkProps(link)" custom>
           <ULinkBase v-bind="slotProps" :class="ui.link({ class: [props.ui?.link, link.ui?.link, link.class], active })">
-            <slot name="link" :link="link" :active="active">
-              <slot name="link-leading" :link="link" :active="active">
+            <slot name="link" :link="link" :active="active" :ui="ui">
+              <slot name="link-leading" :link="link" :active="active" :ui="ui">
                 <UIcon v-if="link.icon" :name="link.icon" :class="ui.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, link.ui?.linkLeadingIcon], active })" />
               </slot>
 

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

@@ -26,13 +26,20 @@ export interface PageLinksProps<T extends PageLink = PageLink> {
 type SlotProps<T> = (props: {
     link: T;
     active: boolean;
+    ui: PageLinks['ui'];
 }) => any;
 export interface PageLinksSlots<T extends PageLink = PageLink> {
     'title'(props?: {}): any;
     'link': SlotProps<T>;
     'link-leading': SlotProps<T>;
-    'link-label': SlotProps<T>;
-    'link-trailing': SlotProps<T>;
+    'link-label'(props: {
+        link: T;
+        active: boolean;
+    }): any;
+    'link-trailing'(props: {
+        link: T;
+        active: boolean;
+    }): any;
 }
 declare const __VLS_export: <T extends PageLink>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<PageLinksProps<T>> & import("vue").PublicProps;

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

@@ -45,7 +45,9 @@ export interface PageSectionProps {
 export interface PageSectionSlots {
     top(props?: {}): any;
     header(props?: {}): any;
-    leading(props?: {}): any;
+    leading(props: {
+        ui: PageSection['ui'];
+    }): any;
     headline(props?: {}): any;
     title(props?: {}): any;
     description(props?: {}): any;

package/dist/runtime/components/PageSection.vue

@@ -44,7 +44,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pageSection |
         <div v-if="!!slots.header || (icon || !!slots.leading) || (headline || !!slots.headline) || (title || !!slots.title) || (description || !!slots.description)" :class="ui.header({ class: props.ui?.header })">
           <slot name="header">
             <div v-if="icon || !!slots.leading" :class="ui.leading({ class: props.ui?.leading })">
-              <slot name="leading">
+              <slot name="leading" :ui="ui">
                 <UIcon v-if="icon" :name="icon" :class="ui.leadingIcon({ class: props.ui?.leadingIcon })" />
               </slot>
             </div>

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

@@ -45,7 +45,9 @@ export interface PageSectionProps {
 export interface PageSectionSlots {
     top(props?: {}): any;
     header(props?: {}): any;
-    leading(props?: {}): any;
+    leading(props: {
+        ui: PageSection['ui'];
+    }): any;
     headline(props?: {}): any;
     title(props?: {}): any;
     description(props?: {}): any;

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

@@ -82,7 +82,9 @@ export interface PaginationSlots {
     prev(props?: {}): any;
     next(props?: {}): any;
     last(props?: {}): any;
-    ellipsis(props?: {}): any;
+    ellipsis(props: {
+        ui: Pagination['ui'];
+    }): any;
     item(props: {
         page: number;
         pageCount: number;

package/dist/runtime/components/Pagination.vue

@@ -76,7 +76,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pagination ||
         </PaginationListItem>
 
         <PaginationEllipsis v-else as-child :class="ui.ellipsis({ class: props.ui?.ellipsis })">
-          <slot name="ellipsis">
+          <slot name="ellipsis" :ui="ui">
             <UButton as="div" :color="color" :variant="variant" :size="size" :icon="ellipsisIcon || appConfig.ui.icons.ellipsis" />
           </slot>
         </PaginationEllipsis>

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

@@ -82,7 +82,9 @@ export interface PaginationSlots {
     prev(props?: {}): any;
     next(props?: {}): any;
     last(props?: {}): any;
-    ellipsis(props?: {}): any;
+    ellipsis(props: {
+        ui: Pagination['ui'];
+    }): any;
     item(props: {
         page: number;
         pageCount: number;

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

@@ -5,12 +5,13 @@ import theme from '#build/ui/popover';
 import type { EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Popover = ComponentConfig<typeof theme, AppConfig, 'popover'>;
-export interface PopoverProps extends PopoverRootProps, Pick<HoverCardRootProps, 'openDelay' | 'closeDelay'> {
+type PopoverMode = 'click' | 'hover';
+export interface PopoverProps<M extends PopoverMode = PopoverMode> extends PopoverRootProps, Pick<HoverCardRootProps, 'openDelay' | 'closeDelay'> {
     /**
      * The display mode of the popover.
      * @defaultValue 'click'
      */
-    mode?: 'click' | 'hover';
+    mode?: M;
     /**
      * The content of the popover.
      * @defaultValue { side: 'bottom', sideOffset: 8, collisionPadding: 8 }
@@ -43,30 +44,30 @@ export interface PopoverProps extends PopoverRootProps, Pick<HoverCardRootProps,
 export interface PopoverEmits extends PopoverRootEmits {
     'close:prevent': [];
 }
-export interface PopoverSlots {
+type SlotProps<M extends PopoverMode = PopoverMode> = [M] extends ['hover'] ? {} : {
+    close: () => void;
+};
+export interface PopoverSlots<M extends PopoverMode = PopoverMode> {
     default(props: {
         open: boolean;
     }): any;
-    content(props?: {}): any;
-    anchor(props?: {}): any;
+    content(props: SlotProps<M>): any;
+    anchor(props: SlotProps<M>): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<PopoverProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (value: boolean) => any;
-    "close:prevent": () => any;
-}, string, import("vue").PublicProps, Readonly<PopoverProps> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    "onClose:prevent"?: (() => any) | undefined;
-}>, {
-    mode: "click" | "hover";
-    portal: boolean | string | HTMLElement;
-    dismissible: boolean;
-    openDelay: number;
-    closeDelay: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PopoverSlots>;
+declare const __VLS_export: <M extends PopoverMode>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<PopoverProps<M> & {
+        "onUpdate:open"?: ((value: boolean) => any) | undefined;
+        "onClose:prevent"?: (() => any) | undefined;
+    }> & import("vue").PublicProps;
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: PopoverSlots<M>;
+    emit: ((evt: "update:open", value: boolean) => void) & ((evt: "close:prevent") => void);
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
 declare const _default: typeof __VLS_export;
 export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T as K]: T[K];
+} & {};

package/dist/runtime/components/Popover.vue

@@ -12,7 +12,7 @@ import { useAppConfig } from "#imports";
 import { usePortal } from "../composables/usePortal";
 import { tv } from "../utils/tv";
 const props = defineProps({
-  mode: { type: String, required: false, default: "click" },
+  mode: { type: null, required: false, default: "click" },
   content: { type: Object, required: false },
   arrow: { type: [Boolean, Object], required: false },
   portal: { type: [Boolean, String], required: false, skipCheck: true, default: true },
@@ -54,18 +54,18 @@ const Component = computed(() => props.mode === "hover" ? HoverCard : Popover);
 </script>
 
 <template>
-  <Component.Root v-slot="{ open }" v-bind="rootProps">
+  <Component.Root v-slot="{ open, close }" v-bind="rootProps">
     <Component.Trigger v-if="!!slots.default || !!reference" as-child :reference="reference" :class="props.class">
       <slot :open="open" />
     </Component.Trigger>
 
     <Component.Anchor v-if="'Anchor' in Component && !!slots.anchor" as-child>
-      <slot name="anchor" />
+      <slot name="anchor" v-bind="close ? { close } : {}" />
     </Component.Anchor>
 
     <Component.Portal v-bind="portalProps">
       <Component.Content v-bind="contentProps" :class="ui.content({ class: [!slots.default && props.class, props.ui?.content] })" v-on="contentEvents">
-        <slot name="content" />
+        <slot name="content" v-bind="close ? { close } : {}" />
 
         <Component.Arrow v-if="!!arrow" v-bind="arrowProps" :class="ui.arrow({ class: props.ui?.arrow })" />
       </Component.Content>

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

@@ -5,12 +5,13 @@ import theme from '#build/ui/popover';
 import type { EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Popover = ComponentConfig<typeof theme, AppConfig, 'popover'>;
-export interface PopoverProps extends PopoverRootProps, Pick<HoverCardRootProps, 'openDelay' | 'closeDelay'> {
+type PopoverMode = 'click' | 'hover';
+export interface PopoverProps<M extends PopoverMode = PopoverMode> extends PopoverRootProps, Pick<HoverCardRootProps, 'openDelay' | 'closeDelay'> {
     /**
      * The display mode of the popover.
      * @defaultValue 'click'
      */
-    mode?: 'click' | 'hover';
+    mode?: M;
     /**
      * The content of the popover.
      * @defaultValue { side: 'bottom', sideOffset: 8, collisionPadding: 8 }
@@ -43,30 +44,30 @@ export interface PopoverProps extends PopoverRootProps, Pick<HoverCardRootProps,
 export interface PopoverEmits extends PopoverRootEmits {
     'close:prevent': [];
 }
-export interface PopoverSlots {
+type SlotProps<M extends PopoverMode = PopoverMode> = [M] extends ['hover'] ? {} : {
+    close: () => void;
+};
+export interface PopoverSlots<M extends PopoverMode = PopoverMode> {
     default(props: {
         open: boolean;
     }): any;
-    content(props?: {}): any;
-    anchor(props?: {}): any;
+    content(props: SlotProps<M>): any;
+    anchor(props: SlotProps<M>): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<PopoverProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (value: boolean) => any;
-    "close:prevent": () => any;
-}, string, import("vue").PublicProps, Readonly<PopoverProps> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-    "onClose:prevent"?: (() => any) | undefined;
-}>, {
-    mode: "click" | "hover";
-    portal: boolean | string | HTMLElement;
-    dismissible: boolean;
-    openDelay: number;
-    closeDelay: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, PopoverSlots>;
+declare const __VLS_export: <M extends PopoverMode>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<PopoverProps<M> & {
+        "onUpdate:open"?: ((value: boolean) => any) | undefined;
+        "onClose:prevent"?: (() => any) | undefined;
+    }> & import("vue").PublicProps;
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: PopoverSlots<M>;
+    emit: ((evt: "update:open", value: boolean) => void) & ((evt: "close:prevent") => void);
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
 declare const _default: typeof __VLS_export;
 export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T as K]: T[K];
+} & {};

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

@@ -87,14 +87,20 @@ export interface PricingPlanProps {
     ui?: PricingPlan['slots'];
 }
 export interface PricingPlanSlots {
-    badge(props?: {}): any;
+    badge(props: {
+        ui: PricingPlan['ui'];
+    }): any;
     title(props?: {}): any;
     description(props?: {}): any;
     price(props?: {}): any;
     discount(props?: {}): any;
-    billing(props?: {}): any;
+    billing(props: {
+        ui: PricingPlan['ui'];
+    }): any;
     features(props?: {}): any;
-    button(props?: {}): any;
+    button(props: {
+        ui: PricingPlan['ui'];
+    }): any;
     header(props?: {}): any;
     body(props?: {}): any;
     footer(props?: {}): any;