@nuxt/ui 4.3.0 → 4.5.0

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

@@ -1,6 +1,9 @@
 export interface ProseHrProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseHrProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseHrProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseHrProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseHrProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -5,14 +5,17 @@ import theme from "#build/ui/prose/hr";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 const props = defineProps({
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.hr", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.hr || {} }));
 </script>
 
 <template>
-  <hr :class="ui({ class: props.class })">
+  <hr :class="ui({ class: [uiProp?.base, props.class] })">
 </template>

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

@@ -1,6 +1,9 @@
 export interface ProseHrProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseHrProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseHrProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseHrProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseHrProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -1,7 +1,10 @@
 export interface ProseIconProps {
     name: string;
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseIconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseIconProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseIconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseIconProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -5,16 +5,19 @@ import theme from "#build/ui/prose/icon";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 import UIcon from "../Icon.vue";
 const props = defineProps({
   name: { type: String, required: true },
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.icon", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.icon || {} }));
 </script>
 
 <template>
-  <UIcon :name="name" :class="ui({ class: props.class })" />
+  <UIcon :name="name" :class="ui({ class: [uiProp?.base, props.class] })" />
 </template>

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

@@ -1,7 +1,10 @@
 export interface ProseIconProps {
     name: string;
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseIconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseIconProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseIconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseIconProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -15,6 +15,8 @@ export interface ProseImgProps {
     zoom?: boolean;
     ui?: ProseImg['slots'];
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseImgProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseImgProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseImgProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseImgProps> & Readonly<{}>, {
+    zoom: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -4,12 +4,13 @@ import theme from "#build/ui/prose/img";
 
 <script setup>
 import { ref, computed, useId } from "vue";
-import { withTrailingSlash, withLeadingSlash, joinURL } from "ufo";
 import { DialogRoot, DialogPortal, DialogTrigger } from "reka-ui";
 import { AnimatePresence, Motion } from "motion-v";
 import { useEventListener, createReusableTemplate } from "@vueuse/core";
 import { useRuntimeConfig, useAppConfig } from "#imports";
 import ImageComponent from "#build/ui-image-component";
+import { useComponentUI } from "../../composables/useComponentUI";
+import { resolveBaseURL } from "../../utils";
 import { tv } from "../../utils/tv";
 defineOptions({ inheritAttrs: false });
 const props = defineProps({
@@ -19,9 +20,10 @@ const props = defineProps({
   height: { type: [String, Number], required: false },
   class: { type: null, required: false },
   zoom: { type: Boolean, required: false, default: true },
-  ui: { type: null, required: false }
+  ui: { type: Object, required: false }
 });
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.img", props);
 const [DefineImageTemplate, ReuseImageTemplate] = createReusableTemplate();
 const [DefineZoomedImageTemplate, ReuseZoomedImageTemplate] = createReusableTemplate();
 const open = ref(false);
@@ -29,15 +31,7 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.img ||
   zoom: props.zoom,
   open: open.value
 }));
-const refinedSrc = computed(() => {
-  if (props.src?.startsWith("/") && !props.src.startsWith("//")) {
-    const _base = withLeadingSlash(withTrailingSlash(useRuntimeConfig().app.baseURL));
-    if (_base !== "/" && !props.src.startsWith(_base)) {
-      return joinURL(_base, props.src);
-    }
-  }
-  return props.src;
-});
+const refinedSrc = computed(() => resolveBaseURL(props.src, useRuntimeConfig().app.baseURL));
 const layoutId = computed(() => `${refinedSrc.value}::${useId()}`);
 if (props.zoom) {
   useEventListener(window, "scroll", () => {
@@ -55,7 +49,7 @@ if (props.zoom) {
       :width="width"
       :height="height"
       v-bind="$attrs"
-      :class="ui.base({ class: [props.ui?.base, props.class] })"
+      :class="ui.base({ class: [uiProp?.base, props.class] })"
     />
   </DefineImageTemplate>
 
@@ -65,7 +59,7 @@ if (props.zoom) {
       :src="refinedSrc"
       :alt="alt"
       v-bind="$attrs"
-      :class="ui.zoomedImage({ class: [props.ui?.zoomedImage] })"
+      :class="ui.zoomedImage({ class: [uiProp?.zoomedImage] })"
     />
   </DefineZoomedImageTemplate>
 
@@ -78,9 +72,9 @@ if (props.zoom) {
 
     <DialogPortal>
       <AnimatePresence>
-        <Motion v-if="open" :initial="{ opacity: 0 }" :animate="{ opacity: 1 }" :exit="{ opacity: 0 }" :class="ui.overlay({ class: [props.ui?.overlay] })" />
+        <Motion v-if="open" :initial="{ opacity: 0 }" :animate="{ opacity: 1 }" :exit="{ opacity: 0 }" :class="ui.overlay({ class: [uiProp?.overlay] })" />
 
-        <div v-if="open" :class="ui.content({ class: [props.ui?.content] })" @click="close">
+        <div v-if="open" :class="ui.content({ class: [uiProp?.content] })" @click="close">
           <Motion as-child :layout-id="layoutId" :transition="{ type: 'spring', bounce: 0.15, duration: 0.5, ease: 'easeInOut' }">
             <ReuseZoomedImageTemplate />
           </Motion>

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

@@ -15,6 +15,8 @@ export interface ProseImgProps {
     zoom?: boolean;
     ui?: ProseImg['slots'];
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseImgProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseImgProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseImgProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseImgProps> & Readonly<{}>, {
+    zoom: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -1,7 +1,10 @@
 export interface ProseKbdProps {
     value: string;
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseKbdProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseKbdProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseKbdProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseKbdProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -5,16 +5,19 @@ import theme from "#build/ui/prose/kbd";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 import UKbd from "../Kbd.vue";
 const props = defineProps({
   value: { type: String, required: true },
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.kbd", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.kbd || {} }));
 </script>
 
 <template>
-  <UKbd :value="value" :class="ui({ class: props.class })" />
+  <UKbd :value="value" :class="ui({ class: [uiProp?.base, props.class] })" />
 </template>

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

@@ -1,7 +1,10 @@
 export interface ProseKbdProps {
     value: string;
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
-declare const __VLS_export: import("vue").DefineComponent<ProseKbdProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseKbdProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<ProseKbdProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseKbdProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

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

@@ -1,12 +1,15 @@
 export interface ProseLiProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseLiSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseLiProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseLiProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseLiSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseLiProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseLiProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseLiSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -5,17 +5,20 @@ import theme from "#build/ui/prose/li";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 const props = defineProps({
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 defineSlots();
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.li", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.li || {} }));
 </script>
 
 <template>
-  <li :class="ui({ class: props.class })">
+  <li :class="ui({ class: [uiProp?.base, props.class] })">
     <slot />
   </li>
 </template>

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

@@ -1,12 +1,15 @@
 export interface ProseLiProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseLiSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseLiProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseLiProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseLiSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseLiProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseLiProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseLiSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -1,12 +1,15 @@
 export interface ProseOlProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseOlSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseOlProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseOlProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseOlSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseOlProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseOlProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseOlSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -5,17 +5,20 @@ import theme from "#build/ui/prose/ol";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 const props = defineProps({
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 defineSlots();
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.ol", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.ol || {} }));
 </script>
 
 <template>
-  <ol :class="ui({ class: props.class })">
+  <ol :class="ui({ class: [uiProp?.base, props.class] })">
     <slot />
   </ol>
 </template>

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

@@ -1,12 +1,15 @@
 export interface ProseOlProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseOlSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseOlProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseOlProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseOlSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseOlProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseOlProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseOlSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -1,12 +1,15 @@
 export interface ProsePProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProsePSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -5,17 +5,20 @@ import theme from "#build/ui/prose/p";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 const props = defineProps({
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 defineSlots();
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.p", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.p || {} }));
 </script>
 
 <template>
-  <p :class="ui({ class: props.class })">
+  <p :class="ui({ class: [uiProp?.base, props.class] })">
     <slot />
   </p>
 </template>

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

@@ -1,12 +1,15 @@
 export interface ProsePProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProsePSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -17,9 +17,9 @@ export interface ProsePreProps {
 export interface ProsePreSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePreProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePreProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePreSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePreProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePreProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePreSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -6,6 +6,7 @@ import theme from "#build/ui/prose/pre";
 import { computed } from "vue";
 import { useClipboard } from "@vueuse/core";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { useLocale } from "../../composables/useLocale";
 import { tv } from "../../utils/tv";
 import UCodeIcon from "./CodeIcon.vue";
@@ -19,21 +20,22 @@ const props = defineProps({
   hideHeader: { type: Boolean, required: false },
   meta: { type: String, required: false },
   class: { type: null, required: false },
-  ui: { type: null, required: false }
+  ui: { type: Object, required: false }
 });
 defineSlots();
 const { t } = useLocale();
 const { copy, copied } = useClipboard();
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.pre", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.pre || {} })());
 </script>
 
 <template>
-  <div :class="ui.root({ class: [props.ui?.root], filename: !!filename })">
-    <div v-if="filename && !hideHeader" :class="ui.header({ class: props.ui?.header })">
-      <UCodeIcon :icon="icon" :filename="filename" :class="ui.icon({ class: props.ui?.icon })" />
+  <div :class="ui.root({ class: [uiProp?.root], filename: !!filename })">
+    <div v-if="filename && !hideHeader" :class="ui.header({ class: uiProp?.header })">
+      <UCodeIcon :icon="icon" :filename="filename" :class="ui.icon({ class: uiProp?.icon })" />
 
-      <span :class="ui.filename({ class: props.ui?.filename })">{{ filename }}</span>
+      <span :class="ui.filename({ class: uiProp?.filename })">{{ filename }}</span>
     </div>
 
     <UButton
@@ -42,12 +44,12 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.pre ||
       variant="outline"
       size="sm"
       :aria-label="t('prose.pre.copy')"
-      :class="ui.copy({ class: props.ui?.copy })"
+      :class="ui.copy({ class: uiProp?.copy })"
       tabindex="-1"
       @click="copy(props.code || '')"
     />
 
-    <pre :class="ui.base({ class: [props.ui?.base, props.class] })" v-bind="$attrs"><slot /></pre>
+    <pre :class="ui.base({ class: [uiProp?.base, props.class] })" v-bind="$attrs"><slot /></pre>
   </div>
 </template>
 

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

@@ -17,9 +17,9 @@ export interface ProsePreProps {
 export interface ProsePreSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePreProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePreProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePreSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProsePreProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProsePreProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProsePreSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -9,13 +9,16 @@ export interface ProseStepsProps {
      */
     level?: ProseSteps['variants']['level'];
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseStepsSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStepsProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStepsSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStepsProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStepsSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -5,18 +5,21 @@ import theme from "#build/ui/prose/steps";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 const props = defineProps({
   level: { type: null, required: false },
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 defineSlots();
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.steps", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.steps || {} }));
 </script>
 
 <template>
-  <div :class="ui({ class: props.class, level: props.level })">
+  <div :class="ui({ class: [uiProp?.base, props.class], level: props.level })">
     <slot />
   </div>
 </template>

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

@@ -9,13 +9,16 @@ export interface ProseStepsProps {
      */
     level?: ProseSteps['variants']['level'];
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseStepsSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStepsProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStepsSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStepsProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStepsSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -1,12 +1,15 @@
 export interface ProseStrongProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseStrongSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStrongProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStrongProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStrongSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStrongProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStrongProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStrongSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -5,17 +5,20 @@ import theme from "#build/ui/prose/strong";
 <script setup>
 import { computed } from "vue";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../../composables/useComponentUI";
 import { tv } from "../../utils/tv";
 const props = defineProps({
-  class: { type: null, required: false }
+  class: { type: null, required: false },
+  ui: { type: Object, required: false }
 });
 defineSlots();
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("prose.strong", props);
 const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.prose?.strong || {} }));
 </script>
 
 <template>
-  <strong :class="ui({ class: props.class })">
+  <strong :class="ui({ class: [uiProp?.base, props.class] })">
     <slot />
   </strong>
 </template>

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

@@ -1,12 +1,15 @@
 export interface ProseStrongProps {
     class?: any;
+    ui?: {
+        base?: any;
+    };
 }
 export interface ProseStrongSlots {
     default(props?: {}): any;
 }
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStrongProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStrongProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStrongSlots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ProseStrongProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ProseStrongProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, ProseStrongSlots>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;