@eventcatalog/core 3.0.0-beta.2 → 3.0.0-beta.21

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/asyncapi/[filename].astro

@@ -69,9 +69,21 @@ const pagefindAttributes =
 </VerticalSideBarLayout>
 
 <script is:inline src={js}></script>
-<script define:vars={{ schema: stringified, config }}>
-  const root = document.getElementById('asyncapi');
-  AsyncApiStandalone.hydrate({ schema, config }, root);
+<script is:inline define:vars={{ schema: stringified, config }}>
+  function initAsyncApi() {
+    const root = document.getElementById('asyncapi');
+    if (!root || root.dataset.initialized) return;
+
+    if (typeof AsyncApiStandalone !== 'undefined') {
+      AsyncApiStandalone.render({ schema, config }, root);
+      root.dataset.initialized = 'true';
+    } else {
+      setTimeout(initAsyncApi, 50);
+    }
+  }
+
+  document.addEventListener('astro:page-load', initAsyncApi);
+  initAsyncApi();
 </script>
 
 <style>
@@ -82,6 +94,10 @@ const pagefindAttributes =
       }
     }
 
+    .burger-menu {
+      display: none;
+    }
+
     .aui-root .z-10 {
       z-index: 8;
     }

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/changelog/index.astro

@@ -73,16 +73,16 @@ const logList = await Promise.all(logListPromise);
 
 const getBadge = () => {
   if (props.collection === 'services') {
-    return { backgroundColor: 'pink', textColor: 'pink', content: 'Service', icon: ServerIcon, class: 'text-pink-400' };
+    return { backgroundColor: 'pink', textColor: 'pink', content: 'Service', icon: ServerIcon, class: 'text-pink-600' };
   }
   if (props.collection === 'events') {
-    return { backgroundColor: 'orange', textColor: 'orange', content: 'Event', icon: BoltIcon, class: 'text-orange-400' };
+    return { backgroundColor: 'orange', textColor: 'orange', content: 'Event', icon: BoltIcon, class: 'text-orange-600' };
   }
   if (props.collection === 'commands') {
-    return { backgroundColor: 'blue', textColor: 'blue', content: 'Command', icon: ChatBubbleLeftIcon, class: 'text-blue-400' };
+    return { backgroundColor: 'blue', textColor: 'blue', content: 'Command', icon: ChatBubbleLeftIcon, class: 'text-blue-600' };
   }
   if (props.collection === 'queries') {
-    return { backgroundColor: 'green', textColor: 'green', content: 'Query', icon: MagnifyingGlassIcon, class: 'text-blue-400' };
+    return { backgroundColor: 'green', textColor: 'green', content: 'Query', icon: MagnifyingGlassIcon, class: 'text-green-600' };
   }
   if (props.collection === 'domains') {
     return {
@@ -90,14 +90,14 @@ const getBadge = () => {
       textColor: 'yellow',
       content: 'Domain',
       icon: RectangleGroupIcon,
-      class: 'text-yellow-400',
+      class: 'text-yellow-600',
     };
   }
   if (props.collection === 'containers') {
-    return { backgroundColor: 'blue', textColor: 'blue', content: 'Container', icon: DatabaseIcon, class: 'text-blue-400' };
+    return { backgroundColor: 'blue', textColor: 'blue', content: 'Container', icon: DatabaseIcon, class: 'text-blue-600' };
   }
   if (props.collection === 'flows') {
-    return { backgroundColor: 'teal', textColor: 'teal', content: 'Flow', icon: QueueListIcon, class: 'text-teal-400' };
+    return { backgroundColor: 'teal', textColor: 'teal', content: 'Flow', icon: QueueListIcon, class: 'text-teal-600' };
   }
 };
 

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/graphql/[filename].astro

@@ -36,7 +36,7 @@ if (isRemote) {
 const pageTitle = `${collection} | ${data.name} | GraphQL Schema`.replace(/^\w/, (c) => c.toUpperCase());
 
 const getServiceBadge = () => {
-  return [{ backgroundColor: 'pink', textColor: 'pink', content: 'Service', icon: ServerIcon, class: 'text-pink-400' }];
+  return [{ backgroundColor: 'pink', textColor: 'pink', content: 'Service', icon: ServerIcon, class: 'text-pink-600' }];
 };
 
 const getGraphQLBadge = () => {

package/eventcatalog/src/pages/docs/[type]/[id]/[version]/index.astro

@@ -71,17 +71,17 @@ const getContentBadges = () =>
 
 const getBadge = () => {
   if (props.collection === 'services') {
-    return [{ backgroundColor: 'pink', textColor: 'pink', content: 'Service', icon: ServerIcon, class: 'text-pink-400' }];
+    return [{ backgroundColor: 'pink', textColor: 'pink', content: 'Service', icon: ServerIcon, class: 'text-pink-600' }];
   }
   if (props.collection === 'events') {
-    return [{ backgroundColor: 'orange', textColor: 'orange', content: 'Event', icon: BoltIcon, class: 'text-orange-400' }];
+    return [{ backgroundColor: 'orange', textColor: 'orange', content: 'Event', icon: BoltIcon, class: 'text-orange-600' }];
   }
   if (props.collection === 'commands') {
-    return [{ backgroundColor: 'blue', textColor: 'blue', content: 'Command', icon: ChatBubbleLeftIcon, class: 'text-blue-400' }];
+    return [{ backgroundColor: 'blue', textColor: 'blue', content: 'Command', icon: ChatBubbleLeftIcon, class: 'text-blue-600' }];
   }
   if (props.collection === 'queries') {
     return [
-      { backgroundColor: 'green', textColor: 'green', content: 'Query', icon: MagnifyingGlassIcon, class: 'text-green-400' },
+      { backgroundColor: 'green', textColor: 'green', content: 'Query', icon: MagnifyingGlassIcon, class: 'text-green-600' },
     ];
   }
   if (props.collection === 'domains') {
@@ -91,7 +91,7 @@ const getBadge = () => {
         textColor: 'yellow',
         content: 'Domain',
         icon: RectangleGroupIcon,
-        class: 'text-yellow-400',
+        class: 'text-yellow-600',
       },
     ];
   }

package/eventcatalog/src/pages/docs/teams/[id].mdx.ts

@@ -0,0 +1,36 @@
+// This file exposes the markdown for EventCatalog in the Url
+// For example http://localhost:3000/docs/teams/full-stack loads the Page and http://localhost:3000/docs/teams/full-stack.mdx loads the markdown
+// This is used for the LLMs to load the markdown for the given item (llms.txt);
+
+import type { APIRoute } from 'astro';
+import { getCollection } from 'astro:content';
+import config from '@config';
+import fs from 'fs';
+
+const teams = await getCollection('teams');
+
+export async function getStaticPaths() {
+  // Just return empty array if LLMs are not enabled
+  if (!config.llmsTxt?.enabled) {
+    return [];
+  }
+
+  return teams.map((team) => ({
+    params: { type: 'teams', id: team.data.id },
+    props: { content: team },
+  }));
+}
+
+export const GET: APIRoute = async ({ params, props }) => {
+  // Just return empty array if LLMs are not enabled
+  if (!config.llmsTxt?.enabled) {
+    return new Response('llms.txt is not enabled for this Catalog.', { status: 404 });
+  }
+
+  if (props?.content?.filePath) {
+    const file = fs.readFileSync(props.content.filePath, 'utf8');
+    return new Response(file, { status: 200 });
+  }
+
+  return new Response('Not found', { status: 404 });
+};

package/eventcatalog/src/pages/docs/users/[id].mdx.ts

@@ -0,0 +1,36 @@
+// This file exposes the markdown for EventCatalog in the Url
+// For example http://localhost:3000/docs/users/dboyne loads the Page and http://localhost:3000/docs/users/dboyne.mdx loads the markdown
+// This is used for the LLMs to load the markdown for the given item (llms.txt);
+
+import type { APIRoute } from 'astro';
+import { getCollection } from 'astro:content';
+import config from '@config';
+import fs from 'fs';
+
+const users = await getCollection('users');
+
+export async function getStaticPaths() {
+  // Just return empty array if LLMs are not enabled
+  if (!config.llmsTxt?.enabled) {
+    return [];
+  }
+
+  return users.map((user) => ({
+    params: { type: 'users', id: user.data.id },
+    props: { content: user },
+  }));
+}
+
+export const GET: APIRoute = async ({ params, props }) => {
+  // Just return empty array if LLMs are not enabled
+  if (!config.llmsTxt?.enabled) {
+    return new Response('llms.txt is not enabled for this Catalog.', { status: 404 });
+  }
+
+  if (props?.content?.filePath) {
+    const file = fs.readFileSync(props.content?.filePath, 'utf8');
+    return new Response(file, { status: 200 });
+  }
+
+  return new Response('Not found', { status: 404 });
+};

package/eventcatalog/src/pages/schemas/explorer/_index.data.ts

@@ -0,0 +1,178 @@
+import { isSSR } from '@utils/feature';
+import { HybridPage } from '@utils/page-loaders/hybrid-page';
+import { getEvents } from '@utils/collections/events';
+import { getCommands } from '@utils/collections/commands';
+import { getQueries } from '@utils/collections/queries';
+import { getServices, getSpecificationsForService } from '@utils/collections/services';
+import { getOwner } from '@utils/collections/owners';
+import { buildUrl } from '@utils/url-builder';
+import { resourceFileExists, readResourceFile } from '@utils/resource-files';
+import path from 'path';
+
+// Helper function to enrich owners with full details
+async function enrichOwners(ownersRaw: any[]) {
+  if (!ownersRaw || ownersRaw.length === 0) return [];
+
+  const owners = await Promise.all(ownersRaw.map(getOwner));
+  const filteredOwners = owners.filter((o) => o !== undefined);
+
+  return filteredOwners.map((o) => ({
+    id: o.data.id,
+    name: o.data.name,
+    type: o.collection,
+    href: buildUrl(`/docs/${o.collection}/${o.data.id}`),
+  }));
+}
+
+async function fetchAllSchemas() {
+  // Fetch all messages
+  const events = await getEvents({ getAllVersions: true });
+  const commands = await getCommands({ getAllVersions: true });
+  const queries = await getQueries({ getAllVersions: true });
+
+  // Fetch all services
+  const services = await getServices({ getAllVersions: true });
+
+  // Combine all messages
+  const allMessages = [...events, ...commands, ...queries];
+
+  // Filter messages with schemas and read schema content - only keep essential data
+  const messagesWithSchemas = await Promise.all(
+    allMessages
+      .filter((message) => message.data.schemaPath)
+      .filter((message) => resourceFileExists(message, message.data.schemaPath ?? ''))
+      .map(async (message) => {
+        try {
+          const schemaPath = message.data.schemaPath ?? '';
+          const schemaContent = readResourceFile(message, schemaPath) ?? '';
+          const schemaExtension = path.extname(schemaPath).slice(1);
+          const enrichedOwners = await enrichOwners(message.data.owners || []);
+
+          return {
+            collection: message.collection,
+            data: {
+              id: message.data.id,
+              name: message.data.name,
+              version: message.data.version,
+              summary: message.data.summary,
+              schemaPath: message.data.schemaPath,
+              producers: message.data.producers || [],
+              consumers: message.data.consumers || [],
+              owners: enrichedOwners,
+            },
+            schemaContent,
+            schemaExtension,
+          };
+        } catch (error) {
+          console.error(`Error reading schema for ${message.data.id}:`, error);
+          const enrichedOwners = await enrichOwners(message.data.owners || []);
+          return {
+            collection: message.collection,
+            data: {
+              id: message.data.id,
+              name: message.data.name,
+              version: message.data.version,
+              summary: message.data.summary,
+              schemaPath: message.data.schemaPath,
+              producers: message.data.producers || [],
+              consumers: message.data.consumers || [],
+              owners: enrichedOwners,
+            },
+            schemaContent: '',
+            schemaExtension: 'json',
+          };
+        }
+      })
+  );
+
+  // Filter services with specifications and read spec content - only keep essential data
+  const servicesWithSpecs = await Promise.all(
+    services.map(async (service) => {
+      try {
+        const specifications = getSpecificationsForService(service);
+
+        if (specifications.length === 0) {
+          return null;
+        }
+
+        return await Promise.all(
+          specifications.map(async (spec) => {
+            if (!resourceFileExists(service, spec.path)) {
+              return null;
+            }
+
+            const schemaContent = readResourceFile(service, spec.path) ?? '';
+            const schemaExtension = spec.type;
+            const enrichedOwners = await enrichOwners(service.data.owners || []);
+
+            return {
+              collection: 'services',
+              data: {
+                id: `${service.data.id}`,
+                name: `${service.data.name} - ${spec.name}`,
+                version: service.data.version,
+                summary: service.data.summary,
+                schemaPath: spec.path,
+                owners: enrichedOwners,
+              },
+              schemaContent,
+              schemaExtension,
+              specType: spec.type,
+              specName: spec.name,
+              specFilenameWithoutExtension: spec.filenameWithoutExtension,
+            };
+          })
+        );
+      } catch (error) {
+        console.error(`Error reading specifications for service ${service.data.id}:`, error);
+        return null;
+      }
+    })
+  );
+
+  // Flatten and filter out null values
+  const flatServicesWithSpecs = servicesWithSpecs.flat().filter((service) => service !== null);
+
+  return [...messagesWithSchemas, ...flatServicesWithSpecs];
+}
+
+export class Page extends HybridPage {
+  static get prerender(): boolean {
+    return !isSSR();
+  }
+
+  static async getStaticPaths(): Promise<Array<{ params: any; props: any }>> {
+    if (isSSR()) {
+      return [];
+    }
+
+    const allSchemas = await fetchAllSchemas();
+
+    return [
+      {
+        params: {},
+        props: {
+          schemas: allSchemas,
+        },
+      },
+    ];
+  }
+
+  protected static async fetchData(_params: any) {
+    const allSchemas = await fetchAllSchemas();
+    return {
+      schemas: allSchemas,
+    };
+  }
+
+  protected static hasValidProps(props: any): boolean {
+    return props && props.schemas !== undefined;
+  }
+
+  protected static createNotFoundResponse(): Response {
+    return new Response(null, {
+      status: 404,
+      statusText: 'Schema explorer not found',
+    });
+  }
+}

package/eventcatalog/src/pages/schemas/explorer/index.astro

@@ -1,163 +1,13 @@
 ---
 import VerticalSideBarLayout from '@layouts/VerticalSideBarLayout.astro';
-import { getEvents } from '@utils/collections/events';
-import { getCommands } from '@utils/collections/commands';
-import { getQueries } from '@utils/collections/queries';
-import { getServices, getSpecificationsForService } from '@utils/collections/services';
 import SchemaExplorer from '@components/SchemaExplorer/SchemaExplorer';
 import { isEventCatalogScaleEnabled } from '@utils/feature';
-import { getOwner } from '@utils/collections/owners';
-import { buildUrl } from '@utils/url-builder';
-import fs from 'fs';
-import path from 'path';
+import { Page } from './_index.data';
 
-// Fetch all messages
-const events = await getEvents({ getAllVersions: true });
-const commands = await getCommands({ getAllVersions: true });
-const queries = await getQueries({ getAllVersions: true });
+export const prerender = Page.prerender;
+export const getStaticPaths = Page.getStaticPaths;
 
-// Fetch all services
-const services = await getServices({ getAllVersions: true });
-
-// Combine all messages
-const allMessages = [...events, ...commands, ...queries];
-
-// Helper function to enrich owners with full details
-async function enrichOwners(ownersRaw: any[]) {
-  if (!ownersRaw || ownersRaw.length === 0) return [];
-
-  const owners = await Promise.all(ownersRaw.map(getOwner));
-  const filteredOwners = owners.filter((o) => o !== undefined);
-
-  return filteredOwners.map((o) => ({
-    id: o.data.id,
-    name: o.data.name,
-    type: o.collection,
-    href: buildUrl(`/docs/${o.collection}/${o.data.id}`),
-  }));
-}
-
-// Filter messages with schemas and read schema content - only keep essential data
-const messagesWithSchemas = await Promise.all(
-  allMessages
-    .filter((message) => message.data.schemaPath)
-    // Make sure the file exists
-    .filter((message) => fs.existsSync(path.join(path.dirname(message.filePath ?? ''), message.data.schemaPath ?? '')))
-    .map(async (message) => {
-      try {
-        // Get the schema file path
-        const schemaPath = message.data.schemaPath;
-        const fullSchemaPath = path.join(path.dirname(message.filePath ?? ''), schemaPath ?? '');
-
-        // Read the schema content
-        let schemaContent = '';
-        if (fs.existsSync(fullSchemaPath)) {
-          schemaContent = fs.readFileSync(fullSchemaPath, 'utf-8');
-        }
-
-        // Get schema file extension
-        const schemaExtension = path.extname(schemaPath ?? '').slice(1);
-
-        // Enrich owners with full details
-        const enrichedOwners = await enrichOwners(message.data.owners || []);
-
-        // Only return essential data - strip out markdown, full data objects, etc.
-        return {
-          collection: message.collection,
-          data: {
-            id: message.data.id,
-            name: message.data.name,
-            version: message.data.version,
-            summary: message.data.summary,
-            schemaPath: message.data.schemaPath,
-            producers: message.data.producers || [],
-            consumers: message.data.consumers || [],
-            owners: enrichedOwners,
-          },
-          schemaContent,
-          schemaExtension,
-        };
-      } catch (error) {
-        console.error(`Error reading schema for ${message.data.id}:`, error);
-        const enrichedOwners = await enrichOwners(message.data.owners || []);
-        return {
-          collection: message.collection,
-          data: {
-            id: message.data.id,
-            name: message.data.name,
-            version: message.data.version,
-            summary: message.data.summary,
-            schemaPath: message.data.schemaPath,
-            producers: message.data.producers || [],
-            consumers: message.data.consumers || [],
-            owners: enrichedOwners,
-          },
-          schemaContent: '',
-          schemaExtension: 'json',
-        };
-      }
-    })
-);
-
-// Filter services with specifications and read spec content - only keep essential data
-const servicesWithSpecs = await Promise.all(
-  services.map(async (service) => {
-    try {
-      const specifications = getSpecificationsForService(service);
-
-      // Only include services that have specifications
-      if (specifications.length === 0) {
-        return null;
-      }
-
-      // Process each specification file for this service
-      return await Promise.all(
-        specifications.map(async (spec) => {
-          const specPath = path.join(path.dirname(service.filePath ?? ''), spec.path);
-
-          // Only include if the spec file exists
-          if (!fs.existsSync(specPath)) {
-            return null;
-          }
-
-          const schemaContent = fs.readFileSync(specPath, 'utf-8');
-          // Use spec type (openapi, asyncapi) as the extension for proper labeling
-          const schemaExtension = spec.type;
-
-          // Enrich owners with full details
-          const enrichedOwners = await enrichOwners(service.data.owners || []);
-
-          // Only return essential data - strip out markdown, sends/receives, entities, etc.
-          return {
-            collection: 'services',
-            data: {
-              id: `${service.data.id}`,
-              name: `${service.data.name} - ${spec.name}`,
-              version: service.data.version,
-              summary: service.data.summary,
-              schemaPath: spec.path,
-              owners: enrichedOwners,
-            },
-            schemaContent,
-            schemaExtension,
-            specType: spec.type,
-            specName: spec.name,
-            specFilenameWithoutExtension: spec.filenameWithoutExtension,
-          };
-        })
-      );
-    } catch (error) {
-      console.error(`Error reading specifications for service ${service.data.id}:`, error);
-      return null;
-    }
-  })
-);
-
-// Flatten and filter out null values
-const flatServicesWithSpecs = servicesWithSpecs.flat().filter((service) => service !== null);
-
-// Combine messages and services
-const allSchemas = [...messagesWithSchemas, ...flatServicesWithSpecs];
+const { schemas } = await Page.getData(Astro);
 
 const apiAccessEnabled = isEventCatalogScaleEnabled();
 ---
@@ -167,7 +17,7 @@ const apiAccessEnabled = isEventCatalogScaleEnabled();
     <div class="flex docs-layout w-full h-full">
       <div class="w-full lg:mr-2 pr-8 py-6 flex flex-col h-full">
         <div class="w-full !max-w-none h-full flex flex-col overflow-hidden">
-          <SchemaExplorer client:load schemas={allSchemas as any} apiAccessEnabled={apiAccessEnabled} />
+          <SchemaExplorer client:load schemas={schemas as any} apiAccessEnabled={apiAccessEnabled} />
         </div>
       </div>
     </div>

package/eventcatalog/src/remark-plugins/directives.ts

@@ -30,7 +30,33 @@ export function remarkDirectives() {
           class: `rounded-lg p-4 my-4 ${blockTypes[node.name as keyof typeof blockTypes] || ''}`,
         };
 
-        // Create header div that will contain icon and type
+        // Check if there's a custom title (label) provided via :::note[Custom Title]
+        // In remark-directive, the label is stored in node.children as a paragraph node
+        // with data.directiveLabel = true
+        let titleChildren;
+        let contentChildren;
+
+        const firstChild = node.children && node.children.length > 0 ? node.children[0] : null;
+        const hasCustomTitle = firstChild && firstChild.data?.directiveLabel === true;
+
+        if (hasCustomTitle && firstChild) {
+          // Custom title was provided in the label - it contains markdown parsed as inline content
+          titleChildren = firstChild.children || [
+            { type: 'text', value: node.name.charAt(0).toUpperCase() + node.name.slice(1) },
+          ];
+          contentChildren = node.children.slice(1);
+        } else {
+          // No custom title, use default based on directive name
+          titleChildren = [
+            {
+              type: 'text',
+              value: node.name.charAt(0).toUpperCase() + node.name.slice(1),
+            },
+          ];
+          contentChildren = node.children;
+        }
+
+        // Create header div that will contain icon and title
         const headerNode = {
           type: 'element',
           data: {
@@ -70,7 +96,7 @@ export function remarkDirectives() {
                 },
               ],
             },
-            // Type label
+            // Title (with support for markdown)
             {
               type: 'element',
               data: {
@@ -79,12 +105,7 @@ export function remarkDirectives() {
                   class: '',
                 },
               },
-              children: [
-                {
-                  type: 'text',
-                  value: node.name.charAt(0).toUpperCase() + node.name.slice(1),
-                },
-              ],
+              children: titleChildren,
             },
           ],
         };
@@ -98,7 +119,7 @@ export function remarkDirectives() {
               class: 'prose prose-md w-full !max-w-none ',
             },
           },
-          children: node.children,
+          children: contentChildren,
         };
 
         // Replace node's children with header and content

package/eventcatalog/src/utils/collections/schemas.ts

@@ -2,6 +2,7 @@ import type { CollectionEntry } from 'astro:content';
 import type { PageTypes } from '@types';
 import path from 'path';
 import { buildUrl } from '@utils/url-builder';
+import { getAbsoluteFilePathForAstroFile } from '@utils/files';
 
 export type Schema = {
   url: string;
@@ -13,12 +14,23 @@ export const getSchemaURL = (resource: CollectionEntry<PageTypes>) => {
   const publicPath = resource?.catalog?.publicPath;
   const schemaFilePath = resource?.data?.schemaPath;
 
-  if (!publicPath || !schemaFilePath) {
+  // No schema file path, return an empty string
+  if (!schemaFilePath) {
+    return;
+  }
+
+  if (!publicPath) {
+    // Then we try and get the absolute file path from the resource
+    const absoluteFilePath = getAbsoluteFilePathForAstroFile(resource.filePath ?? '', schemaFilePath ?? '');
+    if (absoluteFilePath) {
+      return absoluteFilePath;
+    }
+    // Can't find the schema file, return an empty string
     return;
   }
 
   // new URL
-  return path.join(publicPath, schemaFilePath);
+  return path.join(publicPath, schemaFilePath ?? '');
 };
 
 export const getSchemaFormatFromURL = (url: string) => {
@@ -43,17 +55,29 @@ export const getSchemasFromResource = (resource: CollectionEntry<PageTypes>): Sc
       ? specifications.find((spec) => spec.type === 'openapi')?.path
       : specifications?.openapiPath;
     // @ts-ignore
-    const publicPath = resource?.catalog?.publicPath;
+    let publicPath = resource?.catalog?.publicPath;
     const schemas = [];
 
     if (asyncapiPath) {
-      const asyncapiUrl = path.join(publicPath, asyncapiPath);
-      schemas.push({ url: buildUrl(asyncapiUrl), format: 'asyncapi' });
+      if (!publicPath) {
+        // We try and get the absoulate file path from the resource
+        const absoluteFilePath = getAbsoluteFilePathForAstroFile(resource.filePath ?? '', asyncapiPath ?? '');
+        schemas.push({ url: buildUrl(absoluteFilePath), format: 'asyncapi' });
+      } else {
+        // The resource has the public path, so we can use it to build the URL
+        schemas.push({ url: buildUrl(path.join(publicPath, asyncapiPath)), format: 'asyncapi' });
+      }
     }
 
     if (openapiPath) {
-      const openapiUrl = path.join(publicPath, openapiPath);
-      schemas.push({ url: buildUrl(openapiUrl), format: 'openapi' });
+      if (!publicPath) {
+        // We try and get the absoulate file path from the resource
+        const absoluteFilePath = getAbsoluteFilePathForAstroFile(resource.filePath ?? '', openapiPath ?? '');
+        schemas.push({ url: buildUrl(absoluteFilePath), format: 'openapi' });
+      } else {
+        // The resource has the public path, so we can use it to build the URL
+        schemas.push({ url: buildUrl(path.join(publicPath, openapiPath)), format: 'openapi' });
+      }
     }
 
     return schemas;