@eslamdevui/ui 3.2.0 → 3.2.1

package/dist/runtime/components/BlogPost.vue

@@ -0,0 +1,141 @@
+<script>
+import theme from "#build/ui/blog-post";
+</script>
+
+<script setup>
+import { computed } from "vue";
+import { Primitive, useDateFormatter } from "reka-ui";
+import ImageComponent from "#build/ui-image-component";
+import { useLocale, useAppConfig } from "#imports";
+import { getSlotChildrenText } from "../utils";
+import { tv } from "../utils/tv";
+import UUser from "./User.vue";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  as: { type: null, required: false, default: "article" },
+  title: { type: String, required: false },
+  description: { type: String, required: false },
+  date: { type: [String, Date], required: false },
+  badge: { type: [String, Object], required: false },
+  authors: { type: Array, required: false },
+  image: { type: [String, Object], required: false },
+  orientation: { type: null, required: false, default: "vertical" },
+  variant: { type: null, required: false },
+  to: { type: null, required: false },
+  target: { type: [String, Object, null], required: false },
+  onClick: { type: Function, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const slots = defineSlots();
+const { locale } = useLocale();
+const appConfig = useAppConfig();
+const formatter = useDateFormatter(locale.value.code);
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.blogPost || {} })({
+  orientation: props.orientation,
+  variant: props.variant,
+  image: !!props.image,
+  to: !!props.to || !!props.onClick
+}));
+const date = computed(() => {
+  if (!props.date) {
+    return;
+  }
+  try {
+    return formatter.custom(new Date(props.date), { dateStyle: "medium" });
+  } catch {
+    return props.date;
+  }
+});
+const datetime = computed(() => {
+  if (!props.date) {
+    return;
+  }
+  try {
+    return new Date(props.date)?.toISOString();
+  } catch {
+    return void 0;
+  }
+});
+const ariaLabel = computed(() => {
+  const slotText = slots.title && getSlotChildrenText(slots.title());
+  return (slotText || props.title || "Post link").trim();
+});
+</script>
+
+<template>
+  <Primitive :as="as" :data-orientation="orientation" :class="ui.root({ class: [props.ui?.root, props.class] })" @click="onClick">
+    <div v-if="image || !!slots.header" :class="ui.header({ class: props.ui?.header })">
+      <slot name="header">
+        <component
+          :is="ImageComponent"
+          v-bind="typeof image === 'string' ? { src: image, alt: title } : { alt: title, ...image }"
+          :class="ui.image({ class: props.ui?.image, to: !!to })"
+        />
+      </slot>
+    </div>
+
+    <div :class="ui.body({ class: props.ui?.body })">
+      <ULink
+        v-if="to"
+        :aria-label="ariaLabel"
+        v-bind="{ to, target, ...$attrs }"
+        class="focus:outline-none peer"
+        tabindex="-1"
+        raw
+      >
+        <span class="absolute inset-0" aria-hidden="true" />
+      </ULink>
+
+      <slot name="body">
+        <div v-if="date || !!slots.date || (badge || !!slots.badge)" :class="ui.meta({ class: props.ui?.meta })">
+          <slot name="badge">
+            <UBadge v-if="badge" color="neutral" variant="subtle" v-bind="typeof badge === 'string' ? { label: badge } : badge" :class="ui.badge({ class: props.ui?.badge })" />
+          </slot>
+
+          <time v-if="date" :datetime="datetime" :class="ui.date({ class: props.ui?.date })">
+            <slot name="date">
+              {{ date }}
+            </slot>
+          </time>
+        </div>
+
+        <h2 v-if="title || !!slots.title" :class="ui.title({ class: props.ui?.title })">
+          <slot name="title">
+            {{ title }}
+          </slot>
+        </h2>
+
+        <div v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
+          <slot name="description">
+            {{ description }}
+          </slot>
+        </div>
+
+        <div v-if="authors?.length || !!slots.authors" :class="ui.authors({ class: props.ui?.authors })">
+          <slot name="authors">
+            <template v-if="authors?.length">
+              <UAvatarGroup v-if="authors.length > 1">
+                <ULink
+                  v-for="(author, index) in authors"
+                  :key="index"
+                  :to="author.to"
+                  :target="author.target"
+                  :class="ui.avatar({ class: props.ui?.avatar, to: !!author.to })"
+                  raw
+                >
+                  <UAvatar v-bind="author.avatar" />
+                </ULink>
+              </UAvatarGroup>
+              <UUser v-else v-bind="authors[0]" />
+            </template>
+          </slot>
+        </div>
+      </slot>
+    </div>
+
+    <div v-if="!!slots.footer" :class="ui.footer({ class: props.ui?.footer })">
+      <slot name="footer" />
+    </div>
+  </Primitive>
+</template>

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

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

package/dist/runtime/components/BlogPosts.vue

@@ -0,0 +1,33 @@
+<script>
+import theme from "#build/ui/blog-posts";
+</script>
+
+<script setup>
+import { computed } from "vue";
+import { Primitive } from "reka-ui";
+import { useAppConfig } from "#imports";
+import { tv } from "../utils/tv";
+import UBlogPost from "./BlogPost.vue";
+const props = defineProps({
+  as: { type: null, required: false },
+  posts: { type: Array, required: false },
+  orientation: { type: null, required: false, default: "horizontal" },
+  class: { type: null, required: false }
+});
+defineSlots();
+const appConfig = useAppConfig();
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.blogPosts || {} }));
+</script>
+
+<template>
+  <Primitive :as="as" :data-orientation="orientation" :class="ui({ orientation, class: props.class })">
+    <slot>
+      <UBlogPost
+        v-for="(post, index) in posts"
+        :key="index"
+        :orientation="orientation === 'vertical' ? 'horizontal' : 'vertical'"
+        v-bind="post"
+      />
+    </slot>
+  </Primitive>
+</template>

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

@@ -0,0 +1,30 @@
+import theme from '#build/ui/blog-posts';
+import type { AppConfig } from '@nuxt/schema';
+import type { ComponentConfig, BlogPostProps } from '../types';
+type BlogPosts = ComponentConfig<typeof theme, AppConfig, 'blogPosts'>;
+export interface BlogPostsProps {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    posts?: BlogPostProps[];
+    /**
+     * The orientation of the blog posts.
+     * @defaultValue 'horizontal'
+     */
+    orientation?: BlogPosts['variants']['orientation'];
+    class?: any;
+}
+export interface BlogPostsSlots {
+    default(props?: {}): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<BlogPostsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BlogPostsProps> & Readonly<{}>, {
+    orientation: BlogPosts["variants"]["orientation"];
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, BlogPostsSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ChangelogVersion.vue

@@ -0,0 +1,165 @@
+<script>
+import theme from "#build/ui/changelog-version";
+</script>
+
+<script setup>
+import { computed } from "vue";
+import { Primitive, useDateFormatter } from "reka-ui";
+import { createReusableTemplate } from "@vueuse/core";
+import ImageComponent from "#build/ui-image-component";
+import { useLocale, useAppConfig } from "#imports";
+import { getSlotChildrenText } from "../utils";
+import { tv } from "../utils/tv";
+import UUser from "./User.vue";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  as: { type: null, required: false, default: "article" },
+  title: { type: String, required: false },
+  description: { type: String, required: false },
+  date: { type: [String, Date], required: false },
+  badge: { type: [String, Object], required: false },
+  authors: { type: Array, required: false },
+  image: { type: [String, Object], required: false },
+  indicator: { type: Boolean, required: false, default: true },
+  to: { type: null, required: false },
+  target: { type: [String, Object, null], required: false },
+  onClick: { type: Function, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const slots = defineSlots();
+const { locale } = useLocale();
+const appConfig = useAppConfig();
+const formatter = useDateFormatter(locale.value.code);
+const [DefineLinkTemplate, ReuseLinkTemplate] = createReusableTemplate();
+const [DefineDateTemplate, ReuseDateTemplate] = createReusableTemplate({
+  props: {
+    hidden: {
+      type: Boolean,
+      default: false
+    }
+  }
+});
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.changelogVersion || {} })({
+  to: !!props.to || !!props.onClick
+}));
+const date = computed(() => {
+  if (!props.date) {
+    return;
+  }
+  try {
+    return formatter.custom(new Date(props.date), { dateStyle: "medium" });
+  } catch {
+    return props.date;
+  }
+});
+const datetime = computed(() => {
+  if (!props.date) {
+    return;
+  }
+  try {
+    return new Date(props.date)?.toISOString();
+  } catch {
+    return void 0;
+  }
+});
+const ariaLabel = computed(() => {
+  const slotText = slots.title && getSlotChildrenText(slots.title());
+  return (slotText || props.title || "Version link").trim();
+});
+</script>
+
+<template>
+  <DefineLinkTemplate>
+    <ULink
+      v-if="to"
+      :aria-label="ariaLabel"
+      v-bind="{ to, target, ...$attrs }"
+      class="focus:outline-none peer"
+      tabindex="-1"
+      raw
+    >
+      <span class="absolute inset-0" aria-hidden="true" />
+    </ULink>
+  </DefineLinkTemplate>
+
+  <DefineDateTemplate v-slot="{ hidden }">
+    <time v-if="date" :datetime="datetime" :class="ui.date({ class: props.ui?.date, hidden })">
+      <slot name="date">
+        {{ date }}
+      </slot>
+    </time>
+  </DefineDateTemplate>
+
+  <Primitive :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })" @click="onClick">
+    <div v-if="!!props.indicator || !!slots.indicator" :class="ui.indicator({ class: props.ui?.indicator })">
+      <slot name="indicator">
+        <!-- <ReuseDateTemplate :hidden="false" /> when used inside the indicator slot -->
+        <ReuseDateTemplate :hidden="!!props.indicator" /> <!-- when used elsewhere -->
+
+        <div :class="ui.dot({ class: props.ui?.dot })">
+          <div :class="ui.dotInner({ class: props.ui?.dotInner })" />
+        </div>
+      </slot>
+    </div>
+
+    <div :class="ui.container({ class: props.ui?.container })">
+      <div v-if="!!slots.header || (date || !!slots.date) || (badge || !!slots.badge) || (title || !!slots.title) || (description || !!slots.description) || (image || !!slots.image)" :class="ui.header({ class: props.ui?.header })">
+        <slot name="header">
+          <div v-if="date || !!slots.date || (badge || !!slots.badge)" :class="ui.meta({ class: props.ui?.meta, badge: !!badge || !!slots.badge || !props.indicator })">
+            <slot name="badge">
+              <UBadge v-if="badge" color="neutral" variant="solid" v-bind="typeof badge === 'string' ? { label: badge } : badge" :class="ui.badge({ class: props.ui?.badge })" />
+            </slot>
+
+            <ReuseDateTemplate :hidden="!!props.indicator" />
+          </div>
+
+          <h2 v-if="title || !!slots.title" :class="ui.title({ class: props.ui?.title })">
+            <ReuseLinkTemplate />
+
+            <slot name="title">
+              {{ title }}
+            </slot>
+          </h2>
+
+          <div v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
+            <slot name="description">
+              {{ description }}
+            </slot>
+          </div>
+
+          <div v-if="image || !!slots.image" :class="ui.imageWrapper({ class: props.ui?.imageWrapper })">
+            <slot name="image">
+              <component
+                :is="ImageComponent"
+                v-if="image"
+                v-bind="typeof image === 'string' ? { src: image, alt: title } : { alt: title, ...image }"
+                :class="ui.image({ class: props.ui?.image, to: !!to })"
+              />
+            </slot>
+
+            <ReuseLinkTemplate />
+          </div>
+        </slot>
+      </div>
+
+      <slot name="body" />
+
+      <div v-if="!!slots.footer || (authors?.length || !!slots.authors) || !!slots.actions" :class="ui.footer({ class: props.ui?.footer, body: !!slots.body })">
+        <slot name="footer">
+          <div v-if="authors?.length || !!slots.authors" :class="ui.authors({ class: props.ui?.authors })">
+            <slot name="authors">
+              <UUser
+                v-for="(author, index) in authors"
+                :key="index"
+                v-bind="author"
+              />
+            </slot>
+          </div>
+
+          <slot name="actions" />
+        </slot>
+      </div>
+    </div>
+  </Primitive>
+</template>

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

@@ -0,0 +1,58 @@
+import theme from '#build/ui/changelog-version';
+import type { AppConfig } from '@nuxt/schema';
+import type { BadgeProps, LinkProps, ComponentConfig, UserProps } from '../types';
+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.vue

@@ -0,0 +1,54 @@
+<script>
+import theme from "#build/ui/changelog-versions";
+</script>
+
+<script setup>
+import { computed } from "vue";
+import { Primitive } from "reka-ui";
+import { Motion, useScroll, useSpring } from "motion-v";
+import { defu } from "defu";
+import { omit } from "../utils";
+import { useAppConfig } from "#imports";
+import { tv } from "../utils/tv";
+import UChangelogVersion from "./ChangelogVersion.vue";
+const props = defineProps({
+  as: { type: null, required: false },
+  versions: { type: Array, required: false },
+  indicator: { type: Boolean, required: false, default: true },
+  indicatorMotion: { type: [Boolean, Object], required: false, default: true },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const slots = defineSlots();
+const proxySlots = omit(slots, ["default", "indicator"]);
+const appConfig = useAppConfig();
+const springOptions = computed(() => defu(typeof props.indicatorMotion === "object" ? props.indicatorMotion : {}, { damping: 30, restDelta: 1e-3 }));
+const { scrollY } = useScroll();
+const height = useSpring(scrollY, springOptions);
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.changelogVersions || {} })());
+</script>
+
+<template>
+  <Primitive :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <div v-if="!!props.indicator || !!slots.indicator" :class="ui.indicator({ class: props.ui?.indicator })">
+      <slot name="indicator">
+        <Motion v-if="!!props.indicatorMotion" :class="ui.beam({ class: props.ui?.beam })" :style="{ height }" />
+      </slot>
+    </div>
+
+    <div v-if="versions?.length || !!slots.default" :class="ui.container({ class: props.ui?.container })">
+      <slot>
+        <UChangelogVersion
+          v-for="(version, index) in versions"
+          :key="index"
+          :indicator="!!props.indicator"
+          v-bind="version"
+        >
+          <template v-for="(_, name) in proxySlots" #[name]>
+            <slot :name="name" v-bind="{ version }" />
+          </template>
+        </UChangelogVersion>
+      </slot>
+    </div>
+  </Primitive>
+</template>

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

@@ -0,0 +1,74 @@
+import theme from '#build/ui/changelog-versions';
+import type { AppConfig } from '@nuxt/schema';
+import type { ComponentConfig, ChangelogVersionProps } from '../types';
+import type { SpringOptions } from 'motion-v';
+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: __VLS_WithSlots<import("vue").DefineComponent<ChangelogVersionsProps<ChangelogVersionProps>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ChangelogVersionsProps<ChangelogVersionProps>> & Readonly<{}>, {
+    indicator: boolean;
+    indicatorMotion: boolean | SpringOptions;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ChangelogVersionsSlots<ChangelogVersionProps>>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ChatPalette.vue

@@ -0,0 +1,32 @@
+<script>
+import theme from "#build/ui/chat-palette";
+</script>
+
+<script setup>
+import { computed } from "vue";
+import { Primitive, Slot } from "reka-ui";
+import { useAppConfig } from "#imports";
+import { tv } from "../utils/tv";
+const props = defineProps({
+  as: { type: null, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const slots = defineSlots();
+const appConfig = useAppConfig();
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.chatPalette || {} })());
+</script>
+
+<template>
+  <Primitive :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <div :class="ui.content({ class: props.ui?.content })">
+      <Slot compact>
+        <slot />
+      </Slot>
+    </div>
+
+    <Slot v-if="!!slots.prompt" :class="ui.prompt({ class: props.ui?.prompt })">
+      <slot name="prompt" />
+    </Slot>
+  </Primitive>
+</template>

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

@@ -0,0 +1,24 @@
+import theme from '#build/ui/chat-palette';
+import type { AppConfig } from '@nuxt/schema';
+import type { ComponentConfig } from '../types';
+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;
+    };
+};