@nuxt/ui 4.0.0-alpha.1 → 4.0.0-beta.0

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

@@ -0,0 +1,127 @@
+import type { AppConfig } from '@nuxt/schema';
+import type { EmblaCarouselType, EmblaOptionsType } from 'embla-carousel';
+import type { AutoplayOptionsType } from 'embla-carousel-autoplay';
+import type { AutoScrollOptionsType } from 'embla-carousel-auto-scroll';
+import type { AutoHeightOptionsType } from 'embla-carousel-auto-height';
+import type { ClassNamesOptionsType } from 'embla-carousel-class-names';
+import type { FadeOptionsType } from 'embla-carousel-fade';
+import type { WheelGesturesPluginOptions } from 'embla-carousel-wheel-gestures';
+import theme from '#build/ui/carousel';
+import type { ButtonProps, IconProps } from '../types';
+import type { AcceptableValue } from '../types/utils';
+import type { ComponentConfig } from '../types/tv';
+type Carousel = ComponentConfig<typeof theme, AppConfig, 'carousel'>;
+export type CarouselValue = AcceptableValue;
+export type CarouselItem = CarouselValue | {
+    class?: any;
+    ui?: Pick<Carousel['slots'], 'item'>;
+    [key: string]: any;
+};
+export interface CarouselProps<T extends CarouselItem = CarouselItem> extends Omit<EmblaOptionsType, 'axis' | 'container' | 'slides' | 'direction'> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    /**
+     * Configure the prev button when arrows are enabled.
+     * @defaultValue { size: 'md', color: 'neutral', variant: 'link' }
+     */
+    prev?: ButtonProps;
+    /**
+     * The icon displayed in the prev button.
+     * @defaultValue appConfig.ui.icons.arrowLeft
+     * @IconifyIcon
+     */
+    prevIcon?: IconProps['name'];
+    /**
+     * Configure the next button when arrows are enabled.
+     * @defaultValue { size: 'md', color: 'neutral', variant: 'link' }
+     */
+    next?: ButtonProps;
+    /**
+     * The icon displayed in the next button.
+     * @defaultValue appConfig.ui.icons.arrowRight
+     * @IconifyIcon
+     */
+    nextIcon?: IconProps['name'];
+    /**
+     * Display prev and next buttons to scroll the carousel.
+     * @defaultValue false
+     */
+    arrows?: boolean;
+    /**
+     * Display dots to scroll to a specific slide.
+     * @defaultValue false
+     */
+    dots?: boolean;
+    /**
+     * The orientation of the carousel.
+     * @defaultValue 'horizontal'
+     */
+    orientation?: Carousel['variants']['orientation'];
+    items?: T[];
+    /**
+     * Enable Autoplay plugin
+     * @see https://www.embla-carousel.com/plugins/autoplay/
+     */
+    autoplay?: boolean | AutoplayOptionsType;
+    /**
+     * Enable Auto Scroll plugin
+     * @see https://www.embla-carousel.com/plugins/auto-scroll/
+     */
+    autoScroll?: boolean | AutoScrollOptionsType;
+    /**
+     * Enable Auto Height plugin
+     * @see https://www.embla-carousel.com/plugins/auto-height/
+     */
+    autoHeight?: boolean | AutoHeightOptionsType;
+    /**
+     * Enable Class Names plugin
+     * @see https://www.embla-carousel.com/plugins/class-names/
+     */
+    classNames?: boolean | ClassNamesOptionsType;
+    /**
+     * Enable Fade plugin
+     * @see https://www.embla-carousel.com/plugins/fade/
+     */
+    fade?: boolean | FadeOptionsType;
+    /**
+     * Enable Wheel Gestures plugin
+     * @see https://www.embla-carousel.com/plugins/wheel-gestures/
+     */
+    wheelGestures?: boolean | WheelGesturesPluginOptions;
+    class?: any;
+    ui?: Carousel['slots'];
+}
+export type CarouselSlots<T extends CarouselItem = CarouselItem> = {
+    default(props: {
+        item: T;
+        index: number;
+    }): any;
+};
+export interface CarouselEmits {
+    /**
+     * Emitted when the selected slide changes
+     * @param selectedIndex The index of the selected slide
+     */
+    select: [selectedIndex: number];
+}
+declare const _default: <T extends CarouselItem>(__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<Pick<Partial<{}> & Omit<{
+        readonly onSelect?: ((selectedIndex: number) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onSelect"> & CarouselProps<T> & {}> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{
+        emblaRef: import("vue").Ref<HTMLElement | undefined, HTMLElement | undefined>;
+        emblaApi: import("vue").Ref<EmblaCarouselType | undefined, EmblaCarouselType | undefined>;
+    }>): void;
+    attrs: any;
+    slots: CarouselSlots<T>;
+    emit: (evt: "select", selectedIndex: number) => void;
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T as K]: T[K];
+} & {};

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

@@ -1,5 +1,4 @@
 import type { AppConfig } from '@nuxt/schema';
-import type { AcceptableValue } from 'reka-ui';
 import type { EmblaCarouselType, EmblaOptionsType } from 'embla-carousel';
 import type { AutoplayOptionsType } from 'embla-carousel-autoplay';
 import type { AutoScrollOptionsType } from 'embla-carousel-auto-scroll';
@@ -9,14 +8,15 @@ import type { FadeOptionsType } from 'embla-carousel-fade';
 import type { WheelGesturesPluginOptions } from 'embla-carousel-wheel-gestures';
 import theme from '#build/ui/carousel';
 import type { ButtonProps, IconProps } from '../types';
+import type { AcceptableValue } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Carousel = ComponentConfig<typeof theme, AppConfig, 'carousel'>;
-interface _CarouselItem {
+export type CarouselValue = AcceptableValue;
+export type CarouselItem = CarouselValue | {
     class?: any;
     ui?: Pick<Carousel['slots'], 'item'>;
     [key: string]: any;
-}
-export type CarouselItem = _CarouselItem | AcceptableValue;
+};
 export interface CarouselProps<T extends CarouselItem = CarouselItem> extends Omit<EmblaOptionsType, 'axis' | 'container' | 'slides' | 'direction'> {
     /**
      * The element or component this component should render as.
@@ -63,32 +63,32 @@ export interface CarouselProps<T extends CarouselItem = CarouselItem> extends Om
     items?: T[];
     /**
      * Enable Autoplay plugin
-     * @link https://www.embla-carousel.com/plugins/autoplay/
+     * @see https://www.embla-carousel.com/plugins/autoplay/
      */
     autoplay?: boolean | AutoplayOptionsType;
     /**
      * Enable Auto Scroll plugin
-     * @link https://www.embla-carousel.com/plugins/auto-scroll/
+     * @see https://www.embla-carousel.com/plugins/auto-scroll/
      */
     autoScroll?: boolean | AutoScrollOptionsType;
     /**
      * Enable Auto Height plugin
-     * @link https://www.embla-carousel.com/plugins/auto-height/
+     * @see https://www.embla-carousel.com/plugins/auto-height/
      */
     autoHeight?: boolean | AutoHeightOptionsType;
     /**
      * Enable Class Names plugin
-     * @link https://www.embla-carousel.com/plugins/class-names/
+     * @see https://www.embla-carousel.com/plugins/class-names/
      */
     classNames?: boolean | ClassNamesOptionsType;
     /**
      * Enable Fade plugin
-     * @link https://www.embla-carousel.com/plugins/fade/
+     * @see https://www.embla-carousel.com/plugins/fade/
      */
     fade?: boolean | FadeOptionsType;
     /**
      * Enable Wheel Gestures plugin
-     * @link https://www.embla-carousel.com/plugins/wheel-gestures/
+     * @see https://www.embla-carousel.com/plugins/wheel-gestures/
      */
     wheelGestures?: boolean | WheelGesturesPluginOptions;
     class?: any;

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

@@ -0,0 +1,59 @@
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/changelog-version';
+import type { BadgeProps, LinkProps, UserProps } from '../types';
+import type { ComponentConfig } from '../types/tv';
+type ChangelogVersion = ComponentConfig<typeof theme, AppConfig, 'changelogVersion'>;
+export interface ChangelogVersionProps {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'article'
+     */
+    as?: any;
+    title?: string;
+    description?: string;
+    /** The date of the changelog version. Can be a string or a Date object. */
+    date?: string | Date;
+    /**
+     * Display a badge on the changelog version.
+     * Can be a string or an object.
+     * `{ color: 'neutral', variant: 'solid' }`{lang="ts-type"}
+     */
+    badge?: string | BadgeProps;
+    /** The authors of the changelog version. */
+    authors?: UserProps[];
+    /** The image of the changelog version. Can be a string or an object. */
+    image?: string | Partial<HTMLImageElement>;
+    /**
+     * Display an indicator dot on the left.
+     * @defaultValue true
+     */
+    indicator?: boolean;
+    to?: LinkProps['to'];
+    target?: LinkProps['target'];
+    onClick?: (event: MouseEvent) => void | Promise<void>;
+    class?: any;
+    ui?: ChangelogVersion['slots'];
+}
+export interface ChangelogVersionSlots {
+    header(props?: {}): any;
+    badge(props?: {}): any;
+    date(props?: {}): any;
+    title(props?: {}): any;
+    description(props?: {}): any;
+    image(props?: {}): any;
+    body(props?: {}): any;
+    footer(props?: {}): any;
+    authors(props?: {}): any;
+    actions(props?: {}): any;
+    indicator(props?: {}): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ChangelogVersionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ChangelogVersionProps> & Readonly<{}>, {
+    as: any;
+    indicator: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChangelogVersionSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,78 @@
+import type { AppConfig } from '@nuxt/schema';
+import type { SpringOptions } from 'motion-v';
+import theme from '#build/ui/changelog-versions';
+import type { ChangelogVersionProps } from '../types';
+import type { ComponentConfig } from '../types/tv';
+type ChangelogVersions = ComponentConfig<typeof theme, AppConfig, 'changelogVersions'>;
+export interface ChangelogVersionsProps<T extends ChangelogVersionProps = ChangelogVersionProps> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    versions?: T[];
+    /**
+     * Display an indicator bar on the left.
+     * @defaultValue true
+     */
+    indicator?: boolean;
+    /**
+     * Enable scrolling motion effect on the indicator bar.
+     * `{ damping: 30, restDelta: 0.001 }`{lang="ts-type"}
+     * @defaultValue true
+     * @see https://motion.dev/docs/vue-transitions#spring
+     */
+    indicatorMotion?: boolean | SpringOptions;
+    class?: any;
+    ui?: ChangelogVersions['slots'];
+}
+export interface ChangelogVersionsSlots<T extends ChangelogVersionProps = ChangelogVersionProps> {
+    default(props?: {}): any;
+    indicator(props?: {}): any;
+    header(props: {
+        version: T;
+    }): any;
+    badge(props: {
+        version: T;
+    }): any;
+    date(props: {
+        version: T;
+    }): any;
+    title(props: {
+        version: T;
+    }): any;
+    description(props: {
+        version: T;
+    }): any;
+    image(props: {
+        version: T;
+    }): any;
+    body(props: {
+        version: T;
+    }): any;
+    footer(props: {
+        version: T;
+    }): any;
+    authors(props: {
+        version: T;
+    }): any;
+    actions(props: {
+        version: T;
+    }): any;
+    indicator(props: {
+        version: T;
+    }): any;
+}
+declare const _default: <T extends ChangelogVersionProps>(__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<Pick<Partial<{}> & Omit<{} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, never> & ChangelogVersionsProps<T> & {}> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: ChangelogVersionsSlots<T>;
+    emit: {};
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T as K]: T[K];
+} & {};

package/dist/runtime/components/ChangelogVersions.vue

@@ -20,7 +20,7 @@ const props = defineProps({
   ui: { type: null, required: false }
 });
 const slots = defineSlots();
-const proxySlots = omit(slots, ["default", "indicator"]);
+const getProxySlots = () => omit(slots, ["default", "indicator"]);
 const appConfig = useAppConfig();
 const springOptions = computed(() => defu(typeof props.indicatorMotion === "object" ? props.indicatorMotion : {}, { damping: 30, restDelta: 1e-3 }));
 const { scrollYProgress } = useScroll();
@@ -45,7 +45,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.changelogVers
           :indicator="!!props.indicator"
           v-bind="version"
         >
-          <template v-for="(_, name) in proxySlots" #[name]>
+          <template v-for="(_, name) in getProxySlots()" #[name]>
             <slot :name="name" v-bind="{ version }" />
           </template>
         </UChangelogVersion>

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

@@ -0,0 +1,67 @@
+import type { AppConfig } from '@nuxt/schema';
+import type { UIMessage } from 'ai';
+import theme from '#build/ui/chat-message';
+import type { AvatarProps, ButtonProps, IconProps } from '../types';
+import type { ComponentConfig } from '../types/tv';
+type ChatMessage = ComponentConfig<typeof theme, AppConfig, 'chatMessage'>;
+export interface ChatMessageProps extends UIMessage {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'article'
+     */
+    as?: any;
+    /**
+     * @IconifyIcon
+     */
+    icon?: IconProps['name'];
+    avatar?: AvatarProps & {
+        [key: string]: any;
+    };
+    /**
+     * @defaultValue 'naked'
+     */
+    variant?: ChatMessage['variants']['variant'];
+    /**
+     * @defaultValue 'left'
+     */
+    side?: ChatMessage['variants']['side'];
+    /**
+     * Display a list of actions under the message.
+     * The `label` will be used in a tooltip.
+     * `{ size: 'xs', color: 'neutral', variant: 'ghost' }`{lang="ts-type"}
+     */
+    actions?: (Omit<ButtonProps, 'onClick'> & {
+        onClick?: (e: MouseEvent, message: UIMessage) => void;
+    })[];
+    /**
+     * Render the message in a compact style.
+     * This is done automatically when used inside a `UChatPalette`{lang="ts-type"}.
+     * @defaultValue false
+     */
+    compact?: boolean;
+    /**
+     * @deprecated Use `parts` instead. (https://ai-sdk.dev/docs/migration-guides/migration-guide-5-0#content--parts-array)
+     * Use to display the content of the message.
+     */
+    content?: string;
+    class?: any;
+    ui?: ChatMessage['slots'];
+}
+export interface ChatMessageSlots {
+    leading(props: {
+        avatar: ChatMessageProps['avatar'];
+    }): any;
+    content(props: ChatMessageProps): any;
+    actions(props: {
+        actions: ChatMessageProps['actions'];
+    }): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ChatMessageProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ChatMessageProps> & Readonly<{}>, {
+    as: any;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChatMessageSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,83 @@
+import type { AppConfig } from '@nuxt/schema';
+import type { UIMessage, ChatStatus } from 'ai';
+import theme from '#build/ui/chat-messages';
+import type { ButtonProps, ChatMessageProps, IconProps } from '../types';
+import type { ComponentConfig } from '../types/tv';
+type ChatMessages = ComponentConfig<typeof theme, AppConfig, 'chatMessages'>;
+export interface ChatMessagesProps {
+    messages?: UIMessage[];
+    status?: ChatStatus;
+    /**
+     * Whether to automatically scroll to the bottom when a message is streaming.
+     * @defaultValue false
+     */
+    shouldAutoScroll?: boolean;
+    /**
+     * Whether to scroll to the bottom on mounted.
+     * @defaultValue true
+     */
+    shouldScrollToBottom?: boolean;
+    /**
+     * Display an auto scroll button.
+     * `{ size: 'md', color: 'neutral', variant: 'outline' }`{lang="ts-type"}
+     * @defaultValue true
+     */
+    autoScroll?: boolean | Partial<ButtonProps>;
+    /**
+     * The icon displayed in the auto scroll button.
+     * @defaultValue appConfig.ui.icons.arrowDown
+     * @IconifyIcon
+     */
+    autoScrollIcon?: IconProps['name'];
+    /**
+     * The `user` messages props.
+     * `{ side: 'right', variant: 'soft' }`{lang="ts-type"}
+     */
+    user?: Pick<ChatMessageProps, 'icon' | 'avatar' | 'variant' | 'side' | 'actions'>;
+    /**
+     * The `assistant` messages props.
+     * `{ side: 'left', variant: 'naked' }`{lang="ts-type"}
+     */
+    assistant?: Pick<ChatMessageProps, 'icon' | 'avatar' | 'variant' | 'side' | 'actions'>;
+    /**
+     * Render the messages in a compact style.
+     * This is done automatically when used inside a `UChatPalette`{lang="ts-type"}.
+     * @defaultValue false
+     */
+    compact?: boolean;
+    /**
+     * The spacing offset for the last message in px. Can be useful when the prompt is sticky for example.
+     * @defaultValue 0
+     */
+    spacingOffset?: number;
+    class?: any;
+    ui?: ChatMessages['slots'];
+}
+export interface ChatMessagesSlots {
+    default(props?: {}): any;
+    indicator(props?: {}): any;
+    viewport(props: {
+        onClick: () => void;
+    }): any;
+    content(props: {
+        message: UIMessage;
+    }): any;
+    leading(props: {
+        message: UIMessage;
+    }): any;
+    actions(props: {
+        message: UIMessage;
+    }): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ChatMessagesProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ChatMessagesProps> & Readonly<{}>, {
+    autoScroll: boolean | Partial<ButtonProps>;
+    shouldAutoScroll: boolean;
+    shouldScrollToBottom: boolean;
+    spacingOffset: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChatMessagesSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ChatMessages.vue

@@ -27,7 +27,7 @@ const props = defineProps({
   ui: { type: null, required: false }
 });
 const slots = defineSlots();
-const proxySlots = omit(slots, ["default", "indicator", "viewport"]);
+const getProxySlots = () => omit(slots, ["default", "indicator", "viewport"]);
 const appConfig = useAppConfig();
 const userProps = toRef(() => defu(props.user, { side: "right", variant: "soft" }));
 const assistantProps = toRef(() => defu(props.assistant, { side: "left", variant: "naked" }));
@@ -166,7 +166,7 @@ onMounted(() => {
         :ref="(el) => registerMessageRef(message.id, el)"
         :compact="compact"
       >
-        <template v-for="(_, name) in proxySlots" #[name]>
+        <template v-for="(_, name) in getProxySlots()" #[name]>
           <slot :name="name" v-bind="{ message }" />
         </template>
       </UChatMessage>
@@ -180,13 +180,13 @@ onMounted(() => {
       :compact="compact"
     >
       <template #content>
-        <div :class="ui.indicator({ class: props.ui?.indicator })">
-          <slot name="indicator">
+        <slot name="indicator">
+          <div :class="ui.indicator({ class: props.ui?.indicator })">
             <span />
             <span />
             <span />
-          </slot>
-        </div>
+          </div>
+        </slot>
       </template>
     </UChatMessage>
 

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

@@ -0,0 +1,24 @@
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/chat-palette';
+import type { ComponentConfig } from '../types/tv';
+type ChatPalette = ComponentConfig<typeof theme, AppConfig, 'chatPalette'>;
+export interface ChatPaletteProps {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    class?: any;
+    ui?: ChatPalette['slots'];
+}
+export interface ChatPaletteSlots {
+    default(props?: {}): any;
+    prompt(props?: {}): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ChatPaletteProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ChatPaletteProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChatPaletteSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,61 @@
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/chat-prompt';
+import type { TextareaProps, TextareaSlots } from '../types';
+import type { ComponentConfig } from '../types/tv';
+type ChatPrompt = ComponentConfig<typeof theme, AppConfig, 'chatPrompt'>;
+export interface ChatPromptProps extends /** @vue-ignore */ Pick<TextareaProps, 'autofocusDelay' | 'autoresizeDelay' | 'maxrows' | 'icon' | 'avatar' | 'loading' | 'loadingIcon'> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'form'
+     */
+    as?: any;
+    /**
+     * The placeholder text for the textarea.
+     * @defaultValue t('chatPrompt.placeholder')
+     */
+    placeholder?: string;
+    autofocus?: TextareaProps['autofocus'];
+    autoresize?: TextareaProps['autoresize'];
+    rows?: TextareaProps['rows'];
+    /**
+     * @defaultValue 'outline'
+     */
+    variant?: ChatPrompt['variants']['variant'];
+    error?: Error;
+    class?: any;
+    ui?: ChatPrompt['slots'] & TextareaProps['ui'];
+}
+export interface ChatPromptEmits {
+    submit: [event: Event];
+    close: [event: Event];
+}
+export interface ChatPromptSlots extends TextareaSlots {
+    header(props?: {}): any;
+    footer(props?: {}): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ChatPromptProps & {
+    modelValue?: string;
+}, {
+    textareaRef: HTMLTextAreaElement | null | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: (event: Event) => any;
+    submit: (event: Event) => any;
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<ChatPromptProps & {
+    modelValue?: string;
+}> & Readonly<{
+    onClose?: ((event: Event) => any) | undefined;
+    onSubmit?: ((event: Event) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    as: any;
+    autofocus: boolean;
+    rows: number;
+    autoresize: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChatPromptSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ChatPrompt.vue

@@ -29,7 +29,7 @@ const model = defineModel({ type: String, ...{ default: "" } });
 const { t } = useLocale();
 const appConfig = useAppConfig();
 const textareaProps = useForwardProps(reactivePick(props, "autofocus", "autoresize", "rows"));
-const proxySlots = omit(slots, ["header", "footer"]);
+const getProxySlots = () => omit(slots, ["header", "footer"]);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.chatPrompt || {} })({
   variant: props.variant
 }));
@@ -67,7 +67,7 @@ defineExpose({
       @keydown.enter.exact.prevent="submit"
       @keydown.esc="blur"
     >
-      <template v-for="(_, name) in proxySlots" #[name]="slotData">
+      <template v-for="(_, name) in getProxySlots()" #[name]="slotData">
         <slot :name="name" v-bind="slotData" />
       </template>
     </UTextarea>