@eventcatalog/core 3.0.0-beta.13 → 3.0.0-beta.15

package/dist/analytics/analytics.cjs

@@ -37,7 +37,7 @@ var import_axios = __toESM(require("axios"), 1);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "3.0.0-beta.13";
+var version = "3.0.0-beta.15";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/analytics.js

@@ -1,7 +1,7 @@
 import {
   raiseEvent
-} from "../chunk-TTSVZOOO.js";
-import "../chunk-SXOMOZU7.js";
+} from "../chunk-2OAZAOST.js";
+import "../chunk-PUAOIG2V.js";
 export {
   raiseEvent
 };

package/dist/analytics/log-build.cjs

@@ -106,7 +106,7 @@ var import_axios = __toESM(require("axios"), 1);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "3.0.0-beta.13";
+var version = "3.0.0-beta.15";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/log-build.js

@@ -1,8 +1,8 @@
 import {
   log_build_default
-} from "../chunk-URNXOM2X.js";
-import "../chunk-TTSVZOOO.js";
-import "../chunk-SXOMOZU7.js";
+} from "../chunk-QCA2JO24.js";
+import "../chunk-2OAZAOST.js";
+import "../chunk-PUAOIG2V.js";
 import "../chunk-UPONRQSN.js";
 export {
   log_build_default as default

package/dist/{chunk-TTSVZOOO.js → chunk-2OAZAOST.js}

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-SXOMOZU7.js";
+} from "./chunk-PUAOIG2V.js";
 
 // src/analytics/analytics.js
 import axios from "axios";

package/dist/{chunk-GDNZSDL4.js → chunk-DOIHDKWQ.js}

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-SXOMOZU7.js";
+} from "./chunk-PUAOIG2V.js";
 
 // src/utils/cli-logger.ts
 import pc from "picocolors";

package/dist/{chunk-SXOMOZU7.js → chunk-PUAOIG2V.js}

@@ -1,5 +1,5 @@
 // package.json
-var version = "3.0.0-beta.13";
+var version = "3.0.0-beta.15";
 
 // src/constants.ts
 var VERSION = version;

package/dist/{chunk-URNXOM2X.js → chunk-QCA2JO24.js}

@@ -1,6 +1,6 @@
 import {
   raiseEvent
-} from "./chunk-TTSVZOOO.js";
+} from "./chunk-2OAZAOST.js";
 import {
   getEventCatalogConfigFile,
   verifyRequiredFieldsAreInCatalogConfigFile

package/dist/{chunk-HVITNJND.js → chunk-XD34X2CH.js}

@@ -1,6 +1,6 @@
 import {
   logger
-} from "./chunk-GDNZSDL4.js";
+} from "./chunk-DOIHDKWQ.js";
 import {
   cleanup,
   getEventCatalogConfigFile

package/dist/constants.cjs

@@ -25,7 +25,7 @@ __export(constants_exports, {
 module.exports = __toCommonJS(constants_exports);
 
 // package.json
-var version = "3.0.0-beta.13";
+var version = "3.0.0-beta.15";
 
 // src/constants.ts
 var VERSION = version;

package/dist/constants.js

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-SXOMOZU7.js";
+} from "./chunk-PUAOIG2V.js";
 export {
   VERSION
 };

package/dist/eventcatalog.cjs

@@ -109,7 +109,7 @@ var verifyRequiredFieldsAreInCatalogConfigFile = async (projectDirectory) => {
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "3.0.0-beta.13";
+var version = "3.0.0-beta.15";
 
 // src/constants.ts
 var VERSION = version;
@@ -921,6 +921,7 @@ program.command("start").description("Serves the contents of your eventcatalog b
   );
   const isEventCatalogStarter = await (0, import_license.isEventCatalogStarterEnabled)();
   const isEventCatalogScale = await (0, import_license.isEventCatalogScaleEnabled)();
+  await copyServerFiles();
   const isServerOutput = await isOutputServer();
   if (isServerOutput) {
     startServerCatalog({

package/dist/eventcatalog.js

@@ -6,8 +6,8 @@ import {
 } from "./chunk-PLNJC7NZ.js";
 import {
   log_build_default
-} from "./chunk-URNXOM2X.js";
-import "./chunk-TTSVZOOO.js";
+} from "./chunk-QCA2JO24.js";
+import "./chunk-2OAZAOST.js";
 import {
   runMigrations
 } from "./chunk-BH3JMNAV.js";
@@ -23,13 +23,13 @@ import {
 } from "./chunk-5VBIXL6C.js";
 import {
   generate
-} from "./chunk-HVITNJND.js";
+} from "./chunk-XD34X2CH.js";
 import {
   logger
-} from "./chunk-GDNZSDL4.js";
+} from "./chunk-DOIHDKWQ.js";
 import {
   VERSION
-} from "./chunk-SXOMOZU7.js";
+} from "./chunk-PUAOIG2V.js";
 import "./chunk-UPONRQSN.js";
 
 // src/eventcatalog.ts
@@ -295,6 +295,7 @@ program.command("start").description("Serves the contents of your eventcatalog b
   );
   const isEventCatalogStarter = await isEventCatalogStarterEnabled();
   const isEventCatalogScale = await isEventCatalogScaleEnabled();
+  await copyServerFiles();
   const isServerOutput = await isOutputServer();
   if (isServerOutput) {
     startServerCatalog({

package/dist/generate.cjs

@@ -73,7 +73,7 @@ var getEventCatalogConfigFile = async (projectDirectory) => {
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "3.0.0-beta.13";
+var version = "3.0.0-beta.15";
 
 // src/constants.ts
 var VERSION = version;

package/dist/generate.js

@@ -1,8 +1,8 @@
 import {
   generate
-} from "./chunk-HVITNJND.js";
-import "./chunk-GDNZSDL4.js";
-import "./chunk-SXOMOZU7.js";
+} from "./chunk-XD34X2CH.js";
+import "./chunk-DOIHDKWQ.js";
+import "./chunk-PUAOIG2V.js";
 import "./chunk-UPONRQSN.js";
 export {
   generate

package/dist/utils/cli-logger.cjs

@@ -36,7 +36,7 @@ module.exports = __toCommonJS(cli_logger_exports);
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "3.0.0-beta.13";
+var version = "3.0.0-beta.15";
 
 // src/constants.ts
 var VERSION = version;

package/dist/utils/cli-logger.js

@@ -1,7 +1,7 @@
 import {
   logger
-} from "../chunk-GDNZSDL4.js";
-import "../chunk-SXOMOZU7.js";
+} from "../chunk-DOIHDKWQ.js";
+import "../chunk-PUAOIG2V.js";
 export {
   logger
 };

package/eventcatalog/src/components/Header.astro

@@ -60,6 +60,7 @@ const repositoryUrl = catalog?.repositoryUrl || 'https://github.com/event-catalo
                   class="flex items-center focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-400 rounded-full"
                   aria-expanded="false"
                   aria-haspopup="true"
+                  aria-label="User menu"
                 >
                   {session.user?.image && !session.user?.image?.includes('googleusercontent.com') ? (
                     <img
@@ -117,16 +118,28 @@ const repositoryUrl = catalog?.repositoryUrl || 'https://github.com/event-catalo
                       <a
                         href="https://discord.com/invite/3rjaZMmrAm"
                         class="block p-1.5 rounded-lg hover:bg-gray-100 transition-colors"
+                        aria-label="Join our Discord community"
                       >
-                        <img src={buildUrl('/icons/discord.svg', true)} class="h-6 w-6  hover:opacity-100 transition-opacity" />
+                        <img
+                          src={buildUrl('/icons/discord.svg', true)}
+                          alt=""
+                          class="h-6 w-6  hover:opacity-100 transition-opacity"
+                          aria-hidden="true"
+                        />
                       </a>
                     </li>
                     <li>
                       <a
                         href="https://github.com/event-catalog/eventcatalog"
                         class="block p-1.5 rounded-lg hover:bg-gray-100 transition-colors"
+                        aria-label="View EventCatalog on GitHub"
                       >
-                        <img src={buildUrl('/icons/github.svg', true)} class="h-6 w-6  hover:opacity-100 transition-opacity" />
+                        <img
+                          src={buildUrl('/icons/github.svg', true)}
+                          alt=""
+                          class="h-6 w-6  hover:opacity-100 transition-opacity"
+                          aria-hidden="true"
+                        />
                       </a>
                     </li>
                   </ul>
@@ -137,10 +150,13 @@ const repositoryUrl = catalog?.repositoryUrl || 'https://github.com/event-catalo
                       <a
                         href={repositoryUrl}
                         class="block p-1.5 rounded-lg hover:bg-gray-100 transition-colors focus:outline-none"
+                        aria-label="View repository on GitHub"
                       >
                         <img
                           src={buildUrl('/icons/github.svg', true)}
+                          alt=""
                           class="h-6 w-6 opacity-70 hover:opacity-100 transition-opacity"
+                          aria-hidden="true"
                         />
                       </a>
                     </li>

package/eventcatalog/src/components/SideNav/NestedSideBar/SearchBar.tsx

@@ -178,8 +178,9 @@ export default function SearchBar({ nodes, onSelectResult, onSearchChange }: Pro
               <button
                 onClick={clearSearch}
                 className="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-gray-600"
+                aria-label="Clear search"
               >
-                <X className="w-4 h-4" />
+                <X className="w-4 h-4" aria-hidden="true" />
               </button>
             )}
           </div>
@@ -193,8 +194,10 @@ export default function SearchBar({ nodes, onSelectResult, onSearchChange }: Pro
                   ? 'bg-purple-50 border-purple-200 text-purple-600'
                   : 'bg-gray-50 border-gray-200 text-gray-400 hover:text-gray-600 hover:bg-gray-100'
               )}
+              aria-label="Filter search results"
+              aria-expanded={showFilterDropdown}
             >
-              <SlidersHorizontal className="w-4 h-4" />
+              <SlidersHorizontal className="w-4 h-4" aria-hidden="true" />
               {searchFilters.size > 0 && (
                 <span className="absolute -top-1 -right-1 w-4 h-4 bg-purple-600 text-white text-[10px] font-bold rounded-full flex items-center justify-center">
                   {searchFilters.size}

package/eventcatalog/src/layouts/Footer.astro

@@ -9,24 +9,27 @@ const { className } = Astro.props;
     showEventCatalogBranding() && (
       <div class="flex justify-between items-center py-8 text-gray-500 text-sm font-light">
         <div class="flex space-x-5">
-          <a href="https://github.com/event-catalog/eventcatalog" target="_blank">
+          <a href="https://github.com/event-catalog/eventcatalog" target="_blank" aria-label="View EventCatalog on GitHub">
             <svg
               class="w-5 h-5 bg-gray-400 hover:bg-primary dark:hover:bg-gray-400"
               style={`mask-image: url("${buildUrl('/icons/github.svg', true)}"); mask-repeat: no-repeat; mask-position: center center;`}
+              aria-hidden="true"
             />
           </a>
-          <a href="https://x.com/event_catalog" target="_blank">
-            <span class="sr-only">x</span>
+          <a href="https://x.com/event_catalog" target="_blank" aria-label="Follow EventCatalog on X (Twitter)">
+            <span class="sr-only">X (Twitter)</span>
             <svg
               class="w-5 h-5 bg-gray-400 hover:bg-primary dark:hover:bg-gray-400"
               style={`mask-image: url("${buildUrl('/icons/x-twitter.svg', true)}"); mask-repeat: no-repeat; mask-position: center center;`}
+              aria-hidden="true"
             />
           </a>
-          <a href="https://www.youtube.com/@event-catalog" target="_blank">
-            <span class="sr-only">x</span>
+          <a href="https://www.youtube.com/@event-catalog" target="_blank" aria-label="Watch EventCatalog on YouTube">
+            <span class="sr-only">YouTube</span>
             <svg
               class="w-5 h-5 bg-gray-400 hover:bg-primary dark:hover:bg-gray-400"
               style={`mask-image: url("${buildUrl('/icons/youtube.svg', true)}"); mask-repeat: no-repeat; mask-position: center center;`}
+              aria-hidden="true"
             />
           </a>
         </div>

package/eventcatalog/src/layouts/VerticalSideBarLayout.astro

@@ -248,15 +248,19 @@ const canPageBeEmbedded = isEmbedEnabled();
                       id={item.id}
                       data-role="nav-item"
                       href={item.href}
+                      aria-label={item.label}
                       class={`p-1.5 inline-block transition-colors duration-200 rounded-lg ${
                         item.current ? 'text-white bg-gray-900' : 'hover:bg-gray-800 hover:text-white text-gray-700'
                       }`}
                     >
                       <div class="has-tooltip">
-                        <span class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 whitespace-nowrap">
+                        <span
+                          class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 whitespace-nowrap"
+                          aria-hidden="true"
+                        >
                           {item.label}
                         </span>
-                        <item.icon className="h-6 w-6" />
+                        <item.icon className="h-6 w-6" aria-hidden="true" />
                       </div>
                     </a>
                   );
@@ -271,13 +275,17 @@ const canPageBeEmbedded = isEmbedEnabled();
                     id={studioNavigationItem[0].id}
                     data-role="nav-item"
                     href={studioNavigationItem[0].href}
+                    aria-label={studioNavigationItem[0].label}
                     class={`p-1.5 inline-block pt-1 pb-1 mt-0 mb-0 transition-colors duration-200 rounded-lg relative ${studioNavigationItem[0].current ? 'text-white bg-gray-900' : 'hover:bg-gray-800 hover:text-white text-gray-700'}`}
                   >
                     <div class="has-tooltip">
-                      <span class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 whitespace-nowrap">
+                      <span
+                        class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 whitespace-nowrap"
+                        aria-hidden="true"
+                      >
                         {studioNavigationItem[0].label}
                       </span>
-                      <SquareDashedMousePointerIcon className="h-6 w-6" />
+                      <SquareDashedMousePointerIcon className="h-6 w-6" aria-hidden="true" />
                     </div>
                   </a>
                 )
@@ -291,17 +299,24 @@ const canPageBeEmbedded = isEmbedEnabled();
                     id={item.id}
                     data-role="nav-item"
                     href={item.href}
+                    aria-label={item.label}
                     class={`p-1.5 inline-block transition-colors duration-200 rounded-lg mb-8 relative ${
                       item.current ? 'text-white bg-gray-900' : 'hover:bg-gray-800 hover:text-white text-gray-700'
                     }`}
                   >
                     <div class="has-tooltip">
-                      <span class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 flex items-center gap-1 whitespace-nowrap">
-                        <Sparkles className="h-3 w-3" /> {item.label}
+                      <span
+                        class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 flex items-center gap-1 whitespace-nowrap"
+                        aria-hidden="true"
+                      >
+                        <Sparkles className="h-3 w-3" aria-hidden="true" /> {item.label}
                       </span>
-                      <item.icon className="h-6 w-6" />
-                      <div class="absolute -top-1 -right-1 bg-gradient-to-r from-amber-400 to-amber-500 rounded-full p-0.5 shadow-lg">
-                        <Sparkles className="h-2 w-2 text-white" />
+                      <item.icon className="h-6 w-6" aria-hidden="true" />
+                      <div
+                        class="absolute -top-1 -right-1 bg-gradient-to-r from-amber-400 to-amber-500 rounded-full p-0.5 shadow-lg"
+                        aria-hidden="true"
+                      >
+                        <Sparkles className="h-2 w-2 text-white" aria-hidden="true" />
                       </div>
                     </div>
                   </a>
@@ -316,13 +331,17 @@ const canPageBeEmbedded = isEmbedEnabled();
                     id="/pro"
                     data-role="nav-item"
                     href={buildUrl('/plans')}
+                    aria-label="Upgrade EventCatalog"
                     class={`p-1.5 inline-block transition-colors duration-200 rounded-lg ${currentPath.includes('/pro') ? 'text-white bg-gray-900' : 'bg-gray-200 hover:bg-gray-800 hover:text-white text-gray-700'}`}
                   >
                     <div class="has-tooltip">
-                      <span class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 whitespace-nowrap">
+                      <span
+                        class="tooltip rounded shadow-lg p-1 text-xs bg-gray-900 text-white ml-10 whitespace-nowrap"
+                        aria-hidden="true"
+                      >
                         Upgrade EventCatalog
                       </span>
-                      <Rocket className="h-6 w-6" />
+                      <Rocket className="h-6 w-6" aria-hidden="true" />
                     </div>
                   </a>
                 </div>

package/eventcatalog/src/pages/_index.astro

@@ -304,6 +304,7 @@ const quickActions = [
             <button
               data-search-trigger
               class="group flex items-center gap-3 w-full px-4 py-3 bg-white border-2 border-gray-200 rounded-lg hover:border-blue-400 hover:shadow-md transition-all cursor-pointer"
+              aria-label="Search events, services, and domains"
             >
               <svg
                 class="w-5 h-5 text-gray-400 group-hover:text-blue-500 transition-colors"
@@ -625,7 +626,7 @@ const quickActions = [
                 target="_blank"
                 class="group inline-flex items-center gap-2 px-5 py-2.5 bg-gray-900 text-white rounded-lg font-medium hover:bg-gray-800 transition-all shadow-sm"
               >
-                <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24">
+                <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
                   <path
                     d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z"
                   ></path>
@@ -637,7 +638,7 @@ const quickActions = [
                 target="_blank"
                 class="group inline-flex items-center gap-2 px-5 py-2.5 bg-white text-gray-900 border border-gray-300 rounded-lg font-medium hover:border-gray-400 hover:bg-gray-50 transition-all"
               >
-                <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24">
+                <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
                   <path
                     fill-rule="evenodd"
                     d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"

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>

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/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/utils/resource-files.ts

@@ -0,0 +1,86 @@
+import fs from 'fs';
+import path from 'path';
+import { isSSR } from '@utils/feature';
+
+/**
+ * Get the absolute base path for a resource item.
+ *
+ * In SSR mode, filePath is relative to the Astro core directory (e.g., "../examples/default/domains/...").
+ * We need to resolve it using PROJECT_DIR to get the correct absolute path.
+ *
+ * In static mode, filePath is resolved correctly by Astro's build context.
+ *
+ * @param item - The resource item with a filePath property
+ * @returns The absolute path to the directory containing the resource
+ */
+export function getResourceBasePath(item: { filePath?: string }): string {
+  if (!item.filePath) {
+    return '';
+  }
+
+  const filePath = item.filePath;
+
+  // In SSR mode, we need to resolve the relative path using PROJECT_DIR
+  if (isSSR()) {
+    const PROJECT_DIR = process.env.PROJECT_DIR || '';
+
+    if (PROJECT_DIR) {
+      // Get the project folder name from PROJECT_DIR (e.g., "default" from ".../examples/default")
+      const projectFolderName = path.basename(PROJECT_DIR);
+
+      // Find the project folder in the relative path and extract everything after it
+      // Pattern: ../examples/default/domains/... -> domains/...
+      const regex = new RegExp(`.*?${projectFolderName}/(.+)$`);
+      const match = filePath.match(regex);
+
+      if (match && match[1]) {
+        // Join PROJECT_DIR with the relative path within the project
+        return path.join(PROJECT_DIR, path.dirname(match[1]));
+      }
+    }
+  }
+
+  // Static mode: resolve directly using Astro's build context
+  return path.dirname(path.resolve(filePath));
+}
+
+/**
+ * Get the absolute path to a file within a resource directory.
+ *
+ * @param item - The resource item with a filePath property
+ * @param relativePath - The relative path to the file (e.g., "schema.json")
+ * @returns The absolute path to the file
+ */
+export function getResourceFilePath(item: { filePath?: string }, relativePath: string): string {
+  const basePath = getResourceBasePath(item);
+  return path.join(basePath, relativePath);
+}
+
+/**
+ * Check if a file exists within a resource directory.
+ *
+ * @param item - The resource item with a filePath property
+ * @param relativePath - The relative path to the file (e.g., "schema.json")
+ * @returns True if the file exists, false otherwise
+ */
+export function resourceFileExists(item: { filePath?: string }, relativePath: string): boolean {
+  const filePath = getResourceFilePath(item, relativePath);
+  return fs.existsSync(filePath);
+}
+
+/**
+ * Read a file from a resource directory.
+ *
+ * @param item - The resource item with a filePath property
+ * @param relativePath - The relative path to the file (e.g., "schema.json")
+ * @returns The file content as a string, or null if the file doesn't exist
+ */
+export function readResourceFile(item: { filePath?: string }, relativePath: string): string | null {
+  const filePath = getResourceFilePath(item, relativePath);
+
+  if (!fs.existsSync(filePath)) {
+    return null;
+  }
+
+  return fs.readFileSync(filePath, 'utf-8');
+}

package/package.json

@@ -6,7 +6,7 @@
     "url": "https://github.com/event-catalog/eventcatalog.git"
   },
   "type": "module",
-  "version": "3.0.0-beta.13",
+  "version": "3.0.0-beta.15",
   "publishConfig": {
     "access": "public"
   },
@@ -147,6 +147,7 @@
     "preview": "astro preview",
     "astro": "astro",
     "start:catalog": "node scripts/start-catalog-locally.js",
+    "start:catalog:server": "node scripts/start-server-locally.js",
     "pagefind": "node scripts/pagefind.js",
     "preview:catalog": "node scripts/preview-catalog-locally.js",
     "generate:catalog": "node scripts/generate-catalog-locally.js",