@eslamdevui/ui 3.2.0-beta.2 → 3.2.1

package/dist/runtime/components/content/ContentSearchButton.vue.d.ts

@@ -1,12 +1,58 @@
-declare const _default: __VLS_WithSlots<import('vue').DefineComponent<ContentSearchButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ContentSearchButtonProps> & Readonly<{}>, {
-  color: 'error' | 'info' | 'primary' | 'secondary' | 'success' | 'warning' | 'neutral'
-  collapsed: boolean
-  tooltip: boolean | TooltipProps
-  kbds: KbdProps['value'][] | KbdProps[]
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, ButtonSlots>
-export default _default
-type __VLS_WithSlots<T, S> = T & {
-  new (): {
-    $slots: S
-  }
-}
+import theme from '#build/ui/content/content-search-button';
+import type { AppConfig } from '@nuxt/schema';
+import type { ButtonProps, ButtonSlots, KbdProps, ComponentConfig, TooltipProps } from '../../types';
+type ContentSearchButton = ComponentConfig<typeof theme, AppConfig, 'contentSearchButton'>;
+export interface ContentSearchButtonProps {
+    /**
+     * The icon displayed in the button.
+     * @defaultValue appConfig.ui.icons.search
+     * @IconifyIcon
+     */
+    icon?: string;
+    /**
+     * The label displayed in the button.
+     * @defaultValue t('contentSearchButton.label')
+     */
+    label?: string;
+    /**
+     * The color of the button.
+     * @defaultValue 'neutral'
+     */
+    color?: ButtonProps['color'];
+    /**
+     * The variant of the button.
+     * Defaults to 'outline' when not collapsed, 'ghost' when collapsed.
+     */
+    variant?: ButtonProps['variant'];
+    size?: ButtonProps['size'];
+    /**
+     * Whether the button is collapsed.
+     * @defaultValue true
+     */
+    collapsed?: boolean;
+    /**
+     * Display a tooltip on the button when is collapsed with the button label.
+     * This has priority over the global `tooltip` prop.
+     */
+    tooltip?: boolean | TooltipProps;
+    /**
+     * The keyboard keys to display in the button.
+     * `{ variant: 'subtle' }`{lang="ts-type"}
+     * @defaultValue ['meta', 'k']
+     */
+    kbds?: KbdProps['value'][] | KbdProps[];
+    ui?: ContentSearchButton['slots'] & ButtonProps['ui'];
+    class?: any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ContentSearchButtonProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ContentSearchButtonProps> & Readonly<{}>, {
+    color: "error" | "info" | "primary" | "secondary" | "success" | "warning" | "neutral";
+    tooltip: boolean | TooltipProps;
+    kbds: KbdProps["value"][] | KbdProps[];
+    collapsed: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ButtonSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/content/ContentSurround.vue

@@ -1,5 +1,5 @@
 <script>
-import theme from "#build/ui-pro/content/content-surround";
+import theme from "#build/ui/content/content-surround";
 </script>
 
 <script setup>
@@ -25,37 +25,37 @@ const [DefineLinkTemplate, ReuseLinkTemplate] = createReusableTemplate({
     direction: String
   }
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.uiPro?.contentSurround || {} })());
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.contentSurround || {} })());
 </script>
 
 <template>
-  <DefineLinkTemplate v-slot="{ link, icon, direction }">
-    <ULink v-if="link" :to="link.path" raw :class="ui.link({ class: [props.ui?.link, link.ui?.link, link.class], direction })">
-      <slot name="link" :link="link">
-        <div :class="ui.linkLeading({ class: [props.ui?.linkLeading, link.ui?.linkLeading] })">
-          <slot name="link-leading" :link="link">
-            <UIcon :name="link.icon || icon" :class="ui.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, link.ui?.linkLeadingIcon], direction })" />
-          </slot>
-        </div>
-
-        <p :class="ui.linkTitle({ class: [props.ui?.linkTitle, link.ui?.linkTitle] })">
-          <slot name="link-title" :link="link">
-            {{ link.title }}
-          </slot>
-        </p>
-
-        <p :class="ui.linkDescription({ class: [props.ui?.linkDescription, link.ui?.linkDescription] })">
-          <slot name="link-description" :link="link">
-            {{ link.description }}
-          </slot>
-        </p>
-      </slot>
-    </ULink>
-    <span v-else class="hidden lg:block">&nbsp;</span>
-  </DefineLinkTemplate>
-
-  <Primitive v-if="surround" :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
-    <ReuseLinkTemplate :link="surround[0]" :icon="prevIcon || appConfig.ui.icons.arrowLeft" direction="left" />
-    <ReuseLinkTemplate :link="surround[1]" :icon="nextIcon || appConfig.ui.icons.arrowRight" direction="right" />
-  </Primitive>
+  <DefineLinkTemplate v-slot="{ link, icon, direction }">
+    <ULink v-if="link" :to="link.path" raw :class="ui.link({ class: [props.ui?.link, link.ui?.link, link.class], direction })">
+      <slot name="link" :link="link">
+        <div :class="ui.linkLeading({ class: [props.ui?.linkLeading, link.ui?.linkLeading] })">
+          <slot name="link-leading" :link="link">
+            <UIcon :name="link.icon || icon" :class="ui.linkLeadingIcon({ class: [props.ui?.linkLeadingIcon, link.ui?.linkLeadingIcon], direction })" />
+          </slot>
+        </div>
+
+        <p :class="ui.linkTitle({ class: [props.ui?.linkTitle, link.ui?.linkTitle] })">
+          <slot name="link-title" :link="link">
+            {{ link.title }}
+          </slot>
+        </p>
+
+        <p :class="ui.linkDescription({ class: [props.ui?.linkDescription, link.ui?.linkDescription] })">
+          <slot name="link-description" :link="link">
+            {{ link.description }}
+          </slot>
+        </p>
+      </slot>
+    </ULink>
+    <span v-else class="hidden lg:block">&nbsp;</span>
+  </DefineLinkTemplate>
+
+  <Primitive v-if="surround" :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <ReuseLinkTemplate :link="surround[0]" :icon="prevIcon || appConfig.ui.icons.arrowLeft" direction="left" />
+    <ReuseLinkTemplate :link="surround[1]" :icon="nextIcon || appConfig.ui.icons.arrowRight" direction="right" />
+  </Primitive>
 </template>

package/dist/runtime/components/content/ContentSurround.vue.d.ts

@@ -1,59 +1,52 @@
-import type { ContentNavigationItem } from '@nuxt/content'
-import type { AppConfig } from '@nuxt/schema'
-import type { ComponentConfig } from '@nuxt/ui'
-import type theme from '#build/ui-pro/content/content-surround'
-
-type ContentSurround = ComponentConfig<typeof theme, AppConfig, 'contentSurround', 'uiPro'>
-export interface ContentSurroundLink extends ContentNavigationItem {
-  description?: string
-  /**
-   * @IconifyIcon
-   */
-  icon?: string
-  class?: any
-  ui?: Pick<ContentSurround['slots'], 'link' | 'linkLeading' | 'linkLeadingIcon' | 'linkTitle' | 'linkDescription'>
-}
-export interface ContentSurroundProps<T extends ContentSurroundLink = ContentSurroundLink> {
-  /**
-   * The element or component this component should render as.
-   * @defaultValue 'div'
-   */
-  as?: any
-  /**
-   * The icon displayed in the prev link.
-   * @defaultValue appConfig.ui.icons.arrowLeft
-   * @IconifyIcon
-   */
-  prevIcon?: string
-  /**
-   * The icon displayed in the next link.
-   * @defaultValue appConfig.ui.icons.arrowRight
-   * @IconifyIcon
-   */
-  nextIcon?: string
-  surround?: T[]
-  class?: any
-  ui?: ContentSurround['slots']
-}
-type SlotProps<T> = (props: {
-  link: T
-}) => any
-export interface ContentSurroundSlots<T extends ContentSurroundLink = ContentSurroundLink> {
-  'link': SlotProps<T>
-  'link-leading': SlotProps<T>
-  'link-title': SlotProps<T>
-  'link-description': SlotProps<T>
-}
-declare const _default: <T extends ContentSurroundLink>(__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> & ContentSurroundProps<T> & Partial<{}>> & import('vue').PublicProps
-  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void
-  attrs: any
-  slots: ContentSurroundSlots<T>
-  emit: {}
-}>) => import('vue').VNode & {
-  __ctx?: Awaited<typeof __VLS_setup>
-}
-export default _default
-type __VLS_PrettifyLocal<T> = {
-  [K in keyof T]: T[K];
-} & {}
+import theme from '#build/ui/content/content-surround';
+import type { ContentNavigationItem } from '@nuxt/content';
+import type { AppConfig } from '@nuxt/schema';
+import type { ComponentConfig } from '../../types';
+type ContentSurround = ComponentConfig<typeof theme, AppConfig, 'contentSurround'>;
+export interface ContentSurroundLink extends ContentNavigationItem {
+    description?: string;
+    /**
+     * @IconifyIcon
+     */
+    icon?: string;
+    class?: any;
+    ui?: Pick<ContentSurround['slots'], 'link' | 'linkLeading' | 'linkLeadingIcon' | 'linkTitle' | 'linkDescription'>;
+}
+export interface ContentSurroundProps<T extends ContentSurroundLink = ContentSurroundLink> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    /**
+     * The icon displayed in the prev link.
+     * @defaultValue appConfig.ui.icons.arrowLeft
+     * @IconifyIcon
+     */
+    prevIcon?: string;
+    /**
+     * The icon displayed in the next link.
+     * @defaultValue appConfig.ui.icons.arrowRight
+     * @IconifyIcon
+     */
+    nextIcon?: string;
+    surround?: T[];
+    class?: any;
+    ui?: ContentSurround['slots'];
+}
+type SlotProps<T> = (props: {
+    link: T;
+}) => any;
+export interface ContentSurroundSlots<T extends ContentSurroundLink = ContentSurroundLink> {
+    'link': SlotProps<T>;
+    'link-leading': SlotProps<T>;
+    'link-title': SlotProps<T>;
+    'link-description': SlotProps<T>;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ContentSurroundProps<ContentSurroundLink>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ContentSurroundProps<ContentSurroundLink>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ContentSurroundSlots<ContentSurroundLink>>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/content/ContentToc.vue

@@ -1,5 +1,5 @@
 <script>
-import theme from "#build/ui-pro/content/content-toc";
+import theme from "#build/ui/content/content-toc";
 </script>
 
 <script setup>
@@ -30,14 +30,9 @@ const { t } = useLocalePro();
 const router = useRouter();
 const appConfig = useAppConfig();
 const { activeHeadings, updateHeadings } = useScrollspy();
-const [DefineListTemplate, ReuseListTemplate] = createReusableTemplate({
-  props: {
-    links: Array,
-    level: Number
-  }
-});
+const [DefineListTemplate, ReuseListTemplate] = createReusableTemplate();
 const [DefineTriggerTemplate, ReuseTriggerTemplate] = createReusableTemplate();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.uiPro?.contentToc || {} })({
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.contentToc || {} })({
   color: props.color,
   highlight: props.highlight,
   highlightColor: props.highlightColor || props.color
@@ -75,72 +70,89 @@ nuxtApp.hooks.hook("page:transition:finish", () => {
 </script>
 
 <template>
-  <!-- eslint-disable-next-line vue/no-template-shadow -->
-  <DefineListTemplate v-slot="{ links, level }">
-    <ul :class="level > 0 ? ui.listWithChildren({ class: props.ui?.listWithChildren }) : ui.list({ class: props.ui?.list })">
-      <li v-for="(link, index) in links" :key="index" :class="link.children && link.children.length > 0 ? ui.itemWithChildren({ class: [props.ui?.itemWithChildren, link.ui?.itemWithChildren] }) : ui.item({ class: [props.ui?.item, link.ui?.item] })">
-        <a :href="`#${link.id}`" :class="ui.link({ class: [props.ui?.link, link.ui?.link, link.class], active: activeHeadings.includes(link.id) })" @click.prevent="scrollToHeading(link.id)">
-          <slot name="link" :link="link">
-            <span :class="ui.linkText({ class: [props.ui?.linkText, link.ui?.linkText] })">
-              {{ link.text }}
-            </span>
-          </slot>
-        </a>
-
-        <ReuseListTemplate v-if="link.children?.length" :links="link.children" :level="level + 1" />
-      </li>
-    </ul>
-  </DefineListTemplate>
-
-  <DefineTriggerTemplate v-slot="{ open }">
-    <slot name="leading" :open="open" />
-
-    <span :class="ui.title({ class: props.ui?.title })">
-      <slot :open="open">{{ title || t("contentToc.title") }}</slot>
-    </span>
-
-    <span :class="ui.trailing({ class: props.ui?.trailing })">
-      <slot name="trailing" :open="open">
-        <UIcon :name="trailingIcon || appConfig.ui.icons.chevronDown" :class="ui.trailingIcon({ class: props.ui?.trailingIcon })" />
-      </slot>
-    </span>
-  </DefineTriggerTemplate>
-
-  <CollapsibleRoot v-slot="{ open }" v-bind="rootProps" :default-open="defaultOpen" :class="ui.root({ class: [props.ui?.root, props.class] })">
-    <div :class="ui.container({ class: props.ui?.container })">
-      <div v-if="!!slots.top" :class="ui.top({ class: props.ui?.top })">
-        <slot name="top" :links="links" />
-      </div>
-
-      <template v-if="links?.length">
-        <CollapsibleTrigger :class="ui.trigger({ class: 'lg:hidden' })">
-          <ReuseTriggerTemplate :open="open" />
-        </CollapsibleTrigger>
-
-        <CollapsibleContent :class="ui.content({ class: [props.ui?.content, 'lg:hidden'] })">
-          <div v-if="highlight" :class="ui.indicator({ class: props.ui?.indicator })" :style="indicatorStyle" />
-
-          <slot name="content" :links="links">
-            <ReuseListTemplate :links="links" :level="0" />
-          </slot>
-        </CollapsibleContent>
-
-        <p :class="ui.trigger({ class: 'hidden lg:flex' })">
-          <ReuseTriggerTemplate :open="open" />
-        </p>
-
-        <div :class="ui.content({ class: [props.ui?.content, 'hidden lg:flex'] })">
-          <div v-if="highlight" :class="ui.indicator({ class: props.ui?.indicator })" :style="indicatorStyle" />
-
-          <slot name="content" :links="links">
-            <ReuseListTemplate :links="links" :level="0" />
-          </slot>
-        </div>
-      </template>
-
-      <div v-if="!!slots.bottom" :class="ui.bottom({ class: props.ui?.bottom, body: !!slots.top || !!links?.length })">
-        <slot name="bottom" :links="links" />
-      </div>
-    </div>
-  </CollapsibleRoot>
+  <DefineListTemplate v-slot="{ links, level }">
+    <ul
+      :class="level > 0 ? ui.listWithChildren({ class: props.ui?.listWithChildren }) : ui.list({ class: props.ui?.list })"
+    >
+      <li
+        v-for="(link, index) in links"
+        :key="index"
+        :class="link.children && link.children.length > 0 ? ui.itemWithChildren({ class: [props.ui?.itemWithChildren, link.ui?.itemWithChildren] }) : ui.item({ class: [props.ui?.item, link.ui?.item] })"
+      >
+        <a
+          :href="`#${link.id}`"
+          :class="ui.link({ class: [props.ui?.link, link.ui?.link, link.class], active: activeHeadings.includes(link.id) })"
+          @click.prevent="scrollToHeading(link.id)"
+        >
+          <slot name="link" :link="link">
+            <span :class="ui.linkText({ class: [props.ui?.linkText, link.ui?.linkText] })">
+              {{ link.text }}
+            </span>
+          </slot>
+        </a>
+
+        <ReuseListTemplate v-if="link.children?.length" :links="link.children" :level="level + 1" />
+      </li>
+    </ul>
+  </DefineListTemplate>
+
+  <DefineTriggerTemplate v-slot="{ open }">
+    <slot name="leading" :open="open" />
+
+    <span :class="ui.title({ class: props.ui?.title })">
+      <slot :open="open">{{ title || t("contentToc.title") }}</slot>
+    </span>
+
+    <span :class="ui.trailing({ class: props.ui?.trailing })">
+      <slot name="trailing" :open="open">
+        <UIcon
+          :name="trailingIcon || appConfig.ui.icons.chevronDown"
+          :class="ui.trailingIcon({ class: props.ui?.trailingIcon })"
+        />
+      </slot>
+    </span>
+  </DefineTriggerTemplate>
+
+  <CollapsibleRoot
+    v-slot="{ open }"
+    v-bind="rootProps"
+    :default-open="defaultOpen"
+    :class="ui.root({ class: [props.ui?.root, props.class] })"
+  >
+    <div :class="ui.container({ class: props.ui?.container })">
+      <div v-if="!!slots.top" :class="ui.top({ class: props.ui?.top })">
+        <slot name="top" :links="links" />
+      </div>
+
+      <template v-if="links?.length">
+        <CollapsibleTrigger :class="ui.trigger({ class: 'lg:hidden' })">
+          <ReuseTriggerTemplate :open="open" />
+        </CollapsibleTrigger>
+
+        <CollapsibleContent :class="ui.content({ class: [props.ui?.content, 'lg:hidden'] })">
+          <div v-if="highlight" :class="ui.indicator({ class: props.ui?.indicator })" :style="indicatorStyle" />
+
+          <slot name="content" :links="links">
+            <ReuseListTemplate :links="links" :level="0" />
+          </slot>
+        </CollapsibleContent>
+
+        <p :class="ui.trigger({ class: 'hidden lg:flex' })">
+          <ReuseTriggerTemplate :open="open" />
+        </p>
+
+        <div :class="ui.content({ class: [props.ui?.content, 'hidden lg:flex'] })">
+          <div v-if="highlight" :class="ui.indicator({ class: props.ui?.indicator })" :style="indicatorStyle" />
+
+          <slot name="content" :links="links">
+            <ReuseListTemplate :links="links" :level="0" />
+          </slot>
+        </div>
+      </template>
+
+      <div v-if="!!slots.bottom" :class="ui.bottom({ class: props.ui?.bottom })">
+        <slot name="bottom" :links="links" />
+      </div>
+    </div>
+  </CollapsibleRoot>
 </template>

package/dist/runtime/components/content/ContentToc.vue.d.ts

@@ -1,88 +1,86 @@
-import type { CollapsibleRootProps, CollapsibleRootEmits } from 'reka-ui'
-import type { TocLink } from '@nuxt/content'
-import type { AppConfig } from '@nuxt/schema'
-import type { ComponentConfig } from '@nuxt/ui'
-import type theme from '#build/ui-pro/content/content-toc'
-
-type ContentToc = ComponentConfig<typeof theme, AppConfig, 'contentToc', 'uiPro'>
-export type ContentTocLink = TocLink & {
-  class?: any
-  ui?: Pick<ContentToc['slots'], 'item' | 'itemWithChildren' | 'link' | 'linkText'>
-}
-export interface ContentTocProps<T extends ContentTocLink = ContentTocLink> extends Pick<CollapsibleRootProps, 'defaultOpen' | 'open'> {
-  /**
-   * The element or component this component should render as.
-   * @defaultValue 'nav'
-   */
-  as?: any
-  /**
-   * The icon displayed to collapse the content.
-   * @defaultValue appConfig.ui.icons.chevronDown
-   * @IconifyIcon
-   */
-  trailingIcon?: string
-  /**
-   * The title of the table of contents.
-   * @defaultValue t('contentToc.title')
-   */
-  title?: string
-  /**
-   * @defaultValue 'primary'
-   */
-  color?: ContentToc['variants']['color']
-  /**
-   * Display a line next to the active link.
-   * @defaultValue false
-   */
-  highlight?: boolean
-  /**
-   * @defaultValue 'primary'
-   */
-  highlightColor?: ContentToc['variants']['highlightColor']
-  links?: T[]
-  class?: any
-  ui?: ContentToc['slots']
-}
-export type ContentTocEmits = CollapsibleRootEmits & {
-  move: [id: string]
-}
-type SlotProps<T> = (props: {
-  link: T
-}) => any
-export interface ContentTocSlots<T extends ContentTocLink = ContentTocLink> {
-  leading(props: {
-    open: boolean
-  }): any
-  default(props: {
-    open: boolean
-  }): any
-  trailing(props: {
-    open: boolean
-  }): any
-  content(props: {
-    links: T[]
-  }): any
-  link: SlotProps<T>
-  top(props: {
-    links?: T[]
-  }): any
-  bottom(props: {
-    links?: T[]
-  }): any
-}
-declare const _default: <T extends ContentTocLink>(__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 'onUpdate:open'?: ((value: boolean) => any) | undefined
-    readonly 'onMove'?: ((id: string) => any) | undefined
-  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, 'onUpdate:open' | 'onMove'> & ContentTocProps<T> & Partial<{}>> & import('vue').PublicProps
-  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void
-  attrs: any
-  slots: ContentTocSlots<T>
-  emit: ((evt: 'update:open', value: boolean) => void) & ((evt: 'move', id: string) => void)
-}>) => import('vue').VNode & {
-  __ctx?: Awaited<typeof __VLS_setup>
-}
-export default _default
-type __VLS_PrettifyLocal<T> = {
-  [K in keyof T]: T[K];
-} & {}
+import theme from '#build/ui/content/content-toc';
+import type { CollapsibleRootProps, CollapsibleRootEmits } from 'reka-ui';
+import type { TocLink } from '@nuxt/content';
+import type { AppConfig } from '@nuxt/schema';
+import type { ComponentConfig } from '../../types';
+type ContentToc = ComponentConfig<typeof theme, AppConfig, 'contentToc'>;
+export type ContentTocLink = TocLink & {
+    class?: any;
+    ui?: Pick<ContentToc['slots'], 'item' | 'itemWithChildren' | 'link' | 'linkText'>;
+};
+export interface ContentTocProps<T extends ContentTocLink = ContentTocLink> extends Pick<CollapsibleRootProps, 'defaultOpen' | 'open'> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'nav'
+     */
+    as?: any;
+    /**
+     * The icon displayed to collapse the content.
+     * @defaultValue appConfig.ui.icons.chevronDown
+     * @IconifyIcon
+     */
+    trailingIcon?: string;
+    /**
+     * The title of the table of contents.
+     * @defaultValue t('contentToc.title')
+     */
+    title?: string;
+    /**
+     * @defaultValue 'primary'
+     */
+    color?: ContentToc['variants']['color'];
+    /**
+     * Display a line next to the active link.
+     * @defaultValue false
+     */
+    highlight?: boolean;
+    /**
+     * @defaultValue 'primary'
+     */
+    highlightColor?: ContentToc['variants']['highlightColor'];
+    links?: T[];
+    class?: any;
+    ui?: ContentToc['slots'];
+}
+export type ContentTocEmits = CollapsibleRootEmits & {
+    move: [id: string];
+};
+type SlotProps<T> = (props: {
+    link: T;
+}) => any;
+export interface ContentTocSlots<T extends ContentTocLink = ContentTocLink> {
+    leading(props: {
+        open: boolean;
+    }): any;
+    default(props: {
+        open: boolean;
+    }): any;
+    trailing(props: {
+        open: boolean;
+    }): any;
+    content(props: {
+        links: T[];
+    }): any;
+    link: SlotProps<T>;
+    top(props: {
+        links?: T[];
+    }): any;
+    bottom(props: {
+        links?: T[];
+    }): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ContentTocProps<ContentTocLink>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+    move: (id: string) => any;
+}, string, import("vue").PublicProps, Readonly<ContentTocProps<ContentTocLink>> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+    onMove?: ((id: string) => any) | undefined;
+}>, {
+    as: any;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ContentTocSlots<ContentTocLink>>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};