@nuxt/ui 4.9.0 → 4.10.0

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

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

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

@@ -2,7 +2,7 @@ import type { VNode } from 'vue';
 import type { ContentNavigationItem } from '@nuxt/content';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/content/content-surround';
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ContentSurround = ComponentConfig<typeof theme, AppConfig, 'contentSurround'>;
 export interface ContentSurroundLink extends ContentNavigationItem {
@@ -57,7 +57,7 @@ declare const __VLS_export: <T extends ContentSurroundLink>(__VLS_props: NonNull
     slots: ContentSurroundSlots<T>;
     emit: {};
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

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

@@ -34,7 +34,7 @@ const [DefineLinkTemplate, ReuseLinkTemplate] = createReusableTemplate({
     direction: String
   }
 });
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.contentSurround || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.contentSurround || {} })());
 const prevIcon = computed(() => props.prevIcon || (dir.value === "rtl" ? appConfig.ui.icons.arrowRight : appConfig.ui.icons.arrowLeft));
 const nextIcon = computed(() => props.nextIcon || (dir.value === "rtl" ? appConfig.ui.icons.arrowLeft : appConfig.ui.icons.arrowRight));
 </script>
@@ -65,7 +65,7 @@ const nextIcon = computed(() => props.nextIcon || (dir.value === "rtl" ? appConf
     <span v-else :class="prefix('hidden sm:block')">&nbsp;</span>
   </DefineLinkTemplate>
 
-  <Primitive v-if="props.surround" :as="props.as" v-bind="$attrs" data-slot="root" :class="ui.root({ class: [props.ui?.root, props.class] })">
+  <Primitive v-if="props.surround" :as="props.as" data-slot="root" v-bind="$attrs" :class="ui.root({ class: [props.ui?.root, props.class] })">
     <ReuseLinkTemplate :link="props.surround[0]" :icon="prevIcon" direction="left" />
     <ReuseLinkTemplate :link="props.surround[1]" :icon="nextIcon" direction="right" />
   </Primitive>

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

@@ -2,7 +2,7 @@ import type { VNode } from 'vue';
 import type { ContentNavigationItem } from '@nuxt/content';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/content/content-surround';
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ContentSurround = ComponentConfig<typeof theme, AppConfig, 'contentSurround'>;
 export interface ContentSurroundLink extends ContentNavigationItem {
@@ -57,7 +57,7 @@ declare const __VLS_export: <T extends ContentSurroundLink>(__VLS_props: NonNull
     slots: ContentSurroundSlots<T>;
     emit: {};
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

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

@@ -3,7 +3,7 @@ import type { VNode } from 'vue';
 import type { TocLink } from '@nuxt/content';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/content/content-toc';
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ContentToc = ComponentConfig<typeof theme, AppConfig, 'contentToc'>;
 export type ContentTocLink = TocLink & {
@@ -92,7 +92,7 @@ declare const __VLS_export: <T extends ContentTocLink>(__VLS_props: NonNullable<
     slots: ContentTocSlots<T>;
     emit: ((evt: "update:open", value: boolean) => void) & ((evt: "move", id: string) => void);
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

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

@@ -3,13 +3,14 @@ import theme from "#build/ui/content/content-toc";
 </script>
 
 <script setup>
-import { computed, onUnmounted } from "vue";
+import { computed, onUnmounted, useTemplateRef, watch, nextTick } from "vue";
 import { CollapsibleRoot, CollapsibleTrigger, CollapsibleContent } from "reka-ui";
 import { reactivePick, createReusableTemplate } from "@vueuse/core";
 import { useRouter, useAppConfig, useNuxtApp } from "#imports";
 import { useComponentProps } from "../../composables/useComponentProps";
 import { useForwardProps } from "../../composables/useForwardProps";
 import { useScrollspy } from "../../composables/useScrollspy";
+import { useScrollShadow } from "../../composables/useScrollShadow";
 import { useLocale } from "../../composables/useLocale";
 import { usePrefix } from "../../composables/usePrefix";
 import { tv } from "../../utils/tv";
@@ -38,6 +39,8 @@ const router = useRouter();
 const appConfig = useAppConfig();
 const { activeHeadings, updateHeadings } = useScrollspy();
 const prefix = usePrefix();
+const contentRef = useTemplateRef("contentRef");
+const { style: scrollShadowStyle } = useScrollShadow(contentRef);
 const [DefineListTemplate, ReuseListTemplate] = createReusableTemplate({
   props: {
     links: Array,
@@ -46,7 +49,7 @@ const [DefineListTemplate, ReuseListTemplate] = createReusableTemplate({
 });
 const [DefineTriggerTemplate, ReuseTriggerTemplate] = createReusableTemplate();
 const [DefineContentTemplate, ReuseContentTemplate] = createReusableTemplate();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.contentToc || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.contentToc || {} })({
   color: props.color,
   highlight: props.highlight,
   highlightVariant: props.highlightVariant,
@@ -67,17 +70,40 @@ function flattenLinksWithLevel(links, level = 0) {
   ]);
 }
 const linkHeight = 1.75;
+const activeIndex = computed(() => {
+  if (!activeHeadings.value?.length) {
+    return -1;
+  }
+  return flattenLinks(props.links || []).findIndex((link) => activeHeadings.value.includes(link.id));
+});
 const indicatorStyle = computed(() => {
   if (!activeHeadings.value?.length) {
     return;
   }
-  const flatLinks = flattenLinks(props.links || []);
-  const activeIndex = flatLinks.findIndex((link) => activeHeadings.value.includes(link.id));
   return {
     "--indicator-size": `${linkHeight * activeHeadings.value.length}rem`,
-    "--indicator-position": activeIndex >= 0 ? `${activeIndex * linkHeight}rem` : "0rem"
+    "--indicator-position": activeIndex.value >= 0 ? `${activeIndex.value * linkHeight}rem` : "0rem"
   };
 });
+watch(activeIndex, (index) => {
+  const container = contentRef.value;
+  if (index < 0 || !container) {
+    return;
+  }
+  nextTick(() => {
+    const link = container.querySelectorAll('a[data-slot="link"]')[index];
+    if (!link) {
+      return;
+    }
+    const containerRect = container.getBoundingClientRect();
+    const linkRect = link.getBoundingClientRect();
+    const linkOffset = linkRect.top - containerRect.top + container.scrollTop;
+    container.scrollTo({
+      top: linkOffset - container.clientHeight / 2 + linkRect.height / 2,
+      behavior: "smooth"
+    });
+  });
+});
 const circuitMaskStyle = computed(() => {
   if (!props.highlight || props.highlightVariant !== "circuit" || !props.links?.length) {
     return;
@@ -174,7 +200,7 @@ onUnmounted(() => {
     </slot>
   </DefineContentTemplate>
 
-  <CollapsibleRoot v-slot="{ open }" v-bind="{ ...rootProps, ...$attrs }" :default-open="props.defaultOpen" data-slot="root" :class="ui.root({ class: [props.ui?.root, props.class] })">
+  <CollapsibleRoot v-slot="{ open }" data-slot="root" v-bind="{ ...rootProps, ...$attrs }" :default-open="props.defaultOpen" :class="ui.root({ class: [props.ui?.root, props.class] })">
     <div data-slot="container" :class="ui.container({ class: props.ui?.container })">
       <div v-if="!!slots.top" data-slot="top" :class="ui.top({ class: props.ui?.top })">
         <slot name="top" :links="props.links" />
@@ -193,7 +219,7 @@ onUnmounted(() => {
           <ReuseTriggerTemplate :open="open" />
         </p>
 
-        <div data-slot="content" :class="ui.content({ class: [props.ui?.content, prefix('hidden lg:flex')] })">
+        <div ref="contentRef" data-slot="content" :class="ui.content({ class: [props.ui?.content, prefix('hidden lg:flex')] })" :style="scrollShadowStyle">
           <ReuseContentTemplate />
         </div>
       </template>

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

@@ -3,7 +3,7 @@ import type { VNode } from 'vue';
 import type { TocLink } from '@nuxt/content';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/content/content-toc';
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ContentToc = ComponentConfig<typeof theme, AppConfig, 'contentToc'>;
 export type ContentTocLink = TocLink & {
@@ -92,7 +92,7 @@ declare const __VLS_export: <T extends ContentTocLink>(__VLS_props: NonNullable<
     slots: ContentTocSlots<T>;
     emit: ((evt: "update:open", value: boolean) => void) & ((evt: "move", id: string) => void);
 }>) => import("vue").VNode & {
-    __ctx?: Awaited<typeof __VLS_setup>;
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };
 type __VLS_PrettifyLocal<T> = (T extends any ? {
     [K in keyof T]: T[K];

package/dist/runtime/components/locale/LocaleSelect.d.vue.ts

@@ -1,4 +1,4 @@
-import type { SelectMenuProps } from '../../types';
+import type { SelectMenuProps } from '../SelectMenu.vue';
 import type { Locale } from '../../types/locale';
 export interface LocaleSelectProps extends Omit<SelectMenuProps<Locale<any>[], 'code', false>, 'items' | 'modelValue'> {
     locales?: Locale<any>[];

package/dist/runtime/components/locale/LocaleSelect.vue

@@ -61,6 +61,8 @@ function getEmojiFlag(locale) {
   const languageToCountry = {
     ar: "sa",
     // Arabic -> Saudi Arabia
+    be: "by",
+    // Belarusian -> Belarus
     bn: "bd",
     // Bengali -> Bangladesh
     ca: "es",
@@ -77,6 +79,8 @@ function getEmojiFlag(locale) {
     // English -> United States (default)
     et: "ee",
     // Estonian -> Estonia
+    eu: "es",
+    // Basque -> Spain
     gl: "es",
     // Galician -> Spain
     he: "il",
@@ -85,6 +89,8 @@ function getEmojiFlag(locale) {
     // Hindi -> India
     hy: "am",
     // Armenian -> Armenia
+    is: "is",
+    // Icelandic -> Iceland
     ja: "jp",
     // Japanese -> Japan
     ka: "ge",
@@ -99,6 +105,8 @@ function getEmojiFlag(locale) {
     // Kyrgyz -> Kyrgyzstan
     lb: "lu",
     // Luxembourgish -> Luxembourg
+    lo: "la",
+    // Lao -> Laos
     ms: "my",
     // Malay -> Malaysia
     nb: "no",

package/dist/runtime/components/locale/LocaleSelect.vue.d.ts

@@ -1,4 +1,4 @@
-import type { SelectMenuProps } from '../../types';
+import type { SelectMenuProps } from '../SelectMenu.vue';
 import type { Locale } from '../../types/locale';
 export interface LocaleSelectProps extends Omit<SelectMenuProps<Locale<any>[], 'code', false>, 'items' | 'modelValue'> {
     locales?: Locale<any>[];

package/dist/runtime/components/prose/A.vue

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

package/dist/runtime/components/prose/Accordion.d.vue.ts

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/accordion';
-import type { AccordionProps } from '../../types';
+import type { AccordionProps } from '../Accordion.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseAccordion = ComponentConfig<typeof theme, AppConfig, 'accordion', 'ui.prose'>;
 export interface ProseAccordionProps {

package/dist/runtime/components/prose/Accordion.vue

@@ -17,7 +17,7 @@ const _props = defineProps({
 const slots = defineSlots();
 const props = useComponentProps("prose.accordion", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.accordion || {} }));
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.accordion || {} }));
 const rerenderCount = ref(1);
 const items = computed(() => {
   rerenderCount.value;

package/dist/runtime/components/prose/Accordion.vue.d.ts

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/accordion';
-import type { AccordionProps } from '../../types';
+import type { AccordionProps } from '../Accordion.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseAccordion = ComponentConfig<typeof theme, AppConfig, 'accordion', 'ui.prose'>;
 export interface ProseAccordionProps {

package/dist/runtime/components/prose/AccordionItem.vue

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

package/dist/runtime/components/prose/Badge.vue

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

package/dist/runtime/components/prose/Blockquote.vue

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

package/dist/runtime/components/prose/Callout.d.vue.ts

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/callout';
-import type { IconProps, LinkProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
+import type { LinkProps } from '../Link.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCallout = ComponentConfig<typeof theme, AppConfig, 'callout', 'ui.prose'>;
 export interface ProseCalloutProps {

package/dist/runtime/components/prose/Callout.vue

@@ -21,7 +21,7 @@ const _props = defineProps({
 defineSlots();
 const props = useComponentProps("prose.callout", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.callout || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.callout || {} })({
   color: props.color,
   to: !!props.to
 }));
@@ -29,7 +29,7 @@ const target = computed(() => props.target || (!!props.to && typeof props.to ===
 </script>
 
 <template>
-  <div :class="ui.base({ class: [props.ui?.base, props.class] })">
+  <div v-bind="!props.to ? $attrs : {}" :class="ui.base({ class: [props.ui?.base, props.class] })">
     <ULink
       v-if="props.to"
       v-bind="{ to: props.to, target, ...$attrs }"

package/dist/runtime/components/prose/Callout.vue.d.ts

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/callout';
-import type { IconProps, LinkProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
+import type { LinkProps } from '../Link.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCallout = ComponentConfig<typeof theme, AppConfig, 'callout', 'ui.prose'>;
 export interface ProseCalloutProps {

package/dist/runtime/components/prose/Card.d.vue.ts

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/card';
-import type { IconProps, LinkProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
+import type { LinkProps } from '../Link.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCard = ComponentConfig<typeof theme, AppConfig, 'card', 'ui.prose'>;
 export interface ProseCardProps {

package/dist/runtime/components/prose/Card.vue

@@ -23,7 +23,7 @@ const _props = defineProps({
 const slots = defineSlots();
 const props = useComponentProps("prose.card", _props);
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.card || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.card || {} })({
   color: props.color,
   to: !!props.to,
   title: !!props.title
@@ -33,7 +33,7 @@ const ariaLabel = computed(() => (props.title || "Card link").trim());
 </script>
 
 <template>
-  <div :class="ui.base({ class: [props.ui?.base, props.class] })">
+  <div v-bind="!props.to ? $attrs : {}" :class="ui.base({ class: [props.ui?.base, props.class] })">
     <ULink
       v-if="props.to"
       :aria-label="ariaLabel"

package/dist/runtime/components/prose/Card.vue.d.ts

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/card';
-import type { IconProps, LinkProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
+import type { LinkProps } from '../Link.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCard = ComponentConfig<typeof theme, AppConfig, 'card', 'ui.prose'>;
 export interface ProseCardProps {

package/dist/runtime/components/prose/CardGroup.vue

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

package/dist/runtime/components/prose/Code.vue

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

package/dist/runtime/components/prose/CodeCollapse.d.vue.ts

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/code-collapse';
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCodeCollapse = ComponentConfig<typeof theme, AppConfig, 'codeCollapse', 'ui.prose'>;
 export interface ProseCodeCollapseProps {

package/dist/runtime/components/prose/CodeCollapse.vue

@@ -22,7 +22,7 @@ const props = useComponentProps("prose.codeCollapse", _props);
 const open = defineModel("open", { type: Boolean, ...{ default: false } });
 const { t } = useLocale();
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.codeCollapse || {} })({
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.codeCollapse || {} })({
   open: open.value
 }));
 </script>

package/dist/runtime/components/prose/CodeCollapse.vue.d.ts

@@ -1,7 +1,7 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/code-collapse';
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCodeCollapse = ComponentConfig<typeof theme, AppConfig, 'codeCollapse', 'ui.prose'>;
 export interface ProseCodeCollapseProps {

package/dist/runtime/components/prose/CodeGroup.vue

@@ -19,7 +19,7 @@ const slots = defineSlots();
 const props = useComponentProps("prose.codeGroup", _props);
 const model = defineModel({ type: String });
 const appConfig = useAppConfig();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.codeGroup || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.codeGroup || {} })());
 const rerenderCount = ref(1);
 const items = computed(() => {
   rerenderCount.value;

package/dist/runtime/components/prose/CodeIcon.d.vue.ts

@@ -1,4 +1,4 @@
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 export interface ProseCodeIconProps {
     icon?: IconProps['name'];
     filename?: string;

package/dist/runtime/components/prose/CodeIcon.vue.d.ts

@@ -1,4 +1,4 @@
-import type { IconProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
 export interface ProseCodeIconProps {
     icon?: IconProps['name'];
     filename?: string;

package/dist/runtime/components/prose/CodePreview.vue

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

package/dist/runtime/components/prose/CodeTree.vue

@@ -25,7 +25,7 @@ const slots = defineSlots();
 const props = useComponentProps("prose.codeTree", _props);
 const appConfig = useAppConfig();
 const [DefineTreeTemplate, ReuseTreeTemplate] = createReusableTemplate();
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.codeTree || {} })());
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.codeTree || {} })());
 const initialPath = props.modelValue ?? props.defaultValue;
 const model = ref(initialPath ? { path: initialPath } : void 0);
 const lastSelectedItem = ref();

package/dist/runtime/components/prose/Collapsible.d.vue.ts

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/collapsible';
-import type { IconProps, CollapsibleProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
+import type { CollapsibleProps } from '../Collapsible.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCollapsible = ComponentConfig<typeof theme, AppConfig, 'collapsible', 'ui.prose'>;
 export interface ProseCollapsibleProps {

package/dist/runtime/components/prose/Collapsible.vue

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

package/dist/runtime/components/prose/Collapsible.vue.d.ts

@@ -1,7 +1,8 @@
 import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/prose/collapsible';
-import type { IconProps, CollapsibleProps } from '../../types';
+import type { IconProps } from '../Icon.vue';
+import type { CollapsibleProps } from '../Collapsible.vue';
 import type { ComponentConfig } from '../../types/tv';
 type ProseCollapsible = ComponentConfig<typeof theme, AppConfig, 'collapsible', 'ui.prose'>;
 export interface ProseCollapsibleProps {

package/dist/runtime/components/prose/Em.vue

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

package/dist/runtime/components/prose/Field.vue

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

package/dist/runtime/components/prose/FieldGroup.vue

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

package/dist/runtime/components/prose/H1.d.vue.ts

@@ -5,6 +5,11 @@ import theme from '#build/ui/prose/h1';
 type ProseH1 = ComponentConfig<typeof theme, AppConfig, 'h1', 'ui.prose'>;
 export interface ProseH1Props {
     id?: string;
+    /**
+     * Wrap the heading in an anchor link when an `id` is present.
+     * @defaultValue false
+     */
+    anchor?: boolean;
     class?: any;
     ui?: ProseH1['slots'];
 }

package/dist/runtime/components/prose/H1.vue

@@ -9,6 +9,7 @@ import { useComponentProps } from "../../composables/useComponentProps";
 import { tv } from "../../utils/tv";
 const _props = defineProps({
   id: { type: String, required: false },
+  anchor: { type: Boolean, required: false },
   class: { type: null, required: false },
   ui: { type: Object, required: false }
 });
@@ -16,8 +17,8 @@ defineSlots();
 const props = useComponentProps("prose.h1", _props);
 const appConfig = useAppConfig();
 const { headings } = useRuntimeConfig().public?.mdc || {};
-const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.h1 || {} })());
-const generate = computed(() => props.id && typeof headings?.anchorLinks === "object" && headings.anchorLinks.h1);
+const ui = computed(() => tv({ extend: theme, ...appConfig.ui?.prose?.h1 || {} })());
+const generate = computed(() => props.id && (props.anchor ?? (typeof headings?.anchorLinks === "boolean" ? headings.anchorLinks : headings?.anchorLinks?.h1) ?? false));
 </script>
 
 <template>

package/dist/runtime/components/prose/H1.vue.d.ts

@@ -5,6 +5,11 @@ import theme from '#build/ui/prose/h1';
 type ProseH1 = ComponentConfig<typeof theme, AppConfig, 'h1', 'ui.prose'>;
 export interface ProseH1Props {
     id?: string;
+    /**
+     * Wrap the heading in an anchor link when an `id` is present.
+     * @defaultValue false
+     */
+    anchor?: boolean;
     class?: any;
     ui?: ProseH1['slots'];
 }