I refactored a bit and ended up with:

defineOptions({
    layout: SlottedMainLayout([
        { href: home(), label: "Home" },
        { href: login(), label: "Login" },
    ]),
});

// utilities.tsx

import MainLayout from "@/Layouts/MainLayout.vue";
import type { BreadcrumbsItem } from "@/entities.ts";
import Breadcrumbs from "@/Components/Breadcrumbs.vue";

export const SlottedMainLayout = (breadcrumbsItems: BreadcrumbsItem[]) => (h, page) => h(MainLayout, null, {
    default: () => [page],
    breadcrumbs: () => <Breadcrumbs items={breadcrumbsItems} />,
});

It still feels like a weird workaround. However, it seems to work and it's more readable than the initial version, so I'll keep it for now.

I use something like this:

<script setup lang="tsx">

// ...

defineOptions({
    layout: (h, page) => h(MainLayout, null, {
        default: () => [page],
        breadcrumbs: () => (
            <p>Hello World!</p>
        ),
    }),
});

// ...

</script>

It seems to work but it's not pretty. Would be nice if someone could share a better alternative.