@eventcatalog/core 2.31.1 → 2.31.3

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 = "2.31.1";
+var version = "2.31.3";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/analytics.js

@@ -1,7 +1,7 @@
 import {
   raiseEvent
-} from "../chunk-GHBJ372G.js";
-import "../chunk-YUINCBLT.js";
+} from "../chunk-34ONBQTK.js";
+import "../chunk-4EXYGKM6.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 = "2.31.1";
+var version = "2.31.3";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/log-build.js

@@ -1,8 +1,8 @@
 import {
   log_build_default
-} from "../chunk-QR5UTYCE.js";
-import "../chunk-GHBJ372G.js";
-import "../chunk-YUINCBLT.js";
+} from "../chunk-KYLVZEB2.js";
+import "../chunk-34ONBQTK.js";
+import "../chunk-4EXYGKM6.js";
 import "../chunk-E7TXTI7G.js";
 export {
   log_build_default as default

package/dist/{chunk-GHBJ372G.js → chunk-34ONBQTK.js}

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

package/dist/{chunk-YUINCBLT.js → chunk-4EXYGKM6.js}

@@ -1,5 +1,5 @@
 // package.json
-var version = "2.31.1";
+var version = "2.31.3";
 
 // src/constants.ts
 var VERSION = version;

package/dist/{chunk-QR5UTYCE.js → chunk-KYLVZEB2.js}

@@ -1,6 +1,6 @@
 import {
   raiseEvent
-} from "./chunk-GHBJ372G.js";
+} from "./chunk-34ONBQTK.js";
 import {
   getEventCatalogConfigFile,
   verifyRequiredFieldsAreInCatalogConfigFile

package/dist/constants.cjs

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

package/dist/constants.js

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-YUINCBLT.js";
+} from "./chunk-4EXYGKM6.js";
 export {
   VERSION
 };

package/dist/eventcatalog.cjs

@@ -157,7 +157,7 @@ var import_axios = __toESM(require("axios"), 1);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "2.31.1";
+var version = "2.31.3";
 
 // src/constants.ts
 var VERSION = version;

package/dist/eventcatalog.js

@@ -6,15 +6,15 @@ import {
 } from "./chunk-UKJ7F5WR.js";
 import {
   log_build_default
-} from "./chunk-QR5UTYCE.js";
-import "./chunk-GHBJ372G.js";
+} from "./chunk-KYLVZEB2.js";
+import "./chunk-34ONBQTK.js";
 import {
   catalogToAstro,
   checkAndConvertMdToMdx
 } from "./chunk-7SI5EVOX.js";
 import {
   VERSION
-} from "./chunk-YUINCBLT.js";
+} from "./chunk-4EXYGKM6.js";
 import {
   isBackstagePluginEnabled,
   isEventCatalogProEnabled

package/eventcatalog/src/enterprise/custom-documentation/collection.ts

@@ -3,7 +3,7 @@ import { badge, ownerReference } from '../../shared-collections';
 
 export const customPagesSchema = z.object({
   title: z.string(),
-  description: z.string(),
+  summary: z.string(),
   slug: z.string().optional(),
   sidebar: z
     .object({

package/eventcatalog/src/enterprise/custom-documentation/pages/index.astro

@@ -8,6 +8,7 @@ import mdxComponents from '@components/MDX/components';
 import OwnersList from '@components/Lists/OwnersList';
 import { getOwner } from '@utils/collections/owners';
 import CustomDocsNav from '@components/SideNav/CustomDocsNav.astro';
+import { getAdjacentPages } from '../utils/custom-docs';
 
 const props = Astro.props;
 const doc = props.data;
@@ -53,12 +54,7 @@ sidebar.forEach((section: SidebarSection) => {
   }
 });
 
-// Find current page index in flattened items
-const currentIndex = flattenedItems.findIndex((item) => currentSlug === item.slug);
-
-// Get previous and next items
-const prevItem = currentIndex > 0 ? flattenedItems[currentIndex - 1] : null;
-const nextItem = currentIndex < flattenedItems.length - 1 ? flattenedItems[currentIndex + 1] : null;
+const { prev, next } = await getAdjacentPages(currentSlug.replace());
 
 const ownersRaw = doc?.owners || [];
 const owners = await Promise.all<ReturnType<typeof getOwner>>(ownersRaw.map(getOwner));
@@ -83,11 +79,12 @@ const badges = doc?.badges || [];
     </aside>
 
     <!-- Main Content Area - Independent scrolling -->
-    <main class="sidebar-transition w-full max-h-content ml-[22em] 2xl:ml-[24em] mr-80 lg:mr-[26em] max-w-5xl mx-auto">
+    <main class="sidebar-transition w-full max-h-content ml-[22em] 2xl:ml-[24em] mr-80 lg:mr-[20em] max-w-5xl mx-auto">
       <div class="max-w-7xl mx-auto px-6 py-10">
         <div class="border-b border-gray-200 flex justify-between items-start md:pb-6">
           <div>
             <h2 id="doc-page-header" class="text-2xl md:text-4xl font-bold text-black">{doc.title}</h2>
+            <p class="text-lg pt-2 text-gray-500 font-light">{doc.summary}</p>
             {
               badges && (
                 <div class="flex flex-wrap pt-4">
@@ -118,27 +115,27 @@ const badges = doc?.badges || [];
         <div class="py-8 border-t border-gray-200 mt-8">
           <div class="flex flex-col sm:flex-row justify-between w-full gap-4">
             {
-              prevItem && (
+              prev && (
                 <a
-                  href={buildUrl(`/docs/custom/${prevItem.slug}`)}
+                  href={buildUrl(`/docs/custom/${prev.slug}`)}
                   class="group flex flex-col border border-gray-200 rounded-lg p-4 hover:border-gray-300 hover:bg-gray-50 transition-colors w-full sm:w-1/2"
                 >
                   <span class="text-sm text-gray-500 mb-1">Previous</span>
-                  <span class="font-medium group-hover:text-primary-600 transition-colors">{prevItem.label}</span>
+                  <span class="font-medium group-hover:text-primary-600 transition-colors">{prev.label}</span>
                 </a>
               )
             }
 
-            {!prevItem && <div class="w-full sm:w-1/2" />}
+            {!prev && <div class="w-full sm:w-1/2" />}
 
             {
-              nextItem && (
+              next && (
                 <a
-                  href={buildUrl(`/docs/custom/${nextItem.slug}`)}
+                  href={buildUrl(`/docs/custom/${next.slug}`)}
                   class="group flex flex-col items-end text-right border border-gray-200 rounded-lg p-4 hover:border-gray-300 hover:bg-gray-50 transition-colors w-full sm:w-1/2"
                 >
                   <span class="text-sm text-gray-500 mb-1">Next</span>
-                  <span class="font-medium group-hover:text-primary-600 transition-colors">{nextItem.label}</span>
+                  <span class="font-medium group-hover:text-primary-600 transition-colors">{next.label}</span>
                 </a>
               )
             }
@@ -149,7 +146,7 @@ const badges = doc?.badges || [];
 
     <!-- Right Sidebar TOC -->
     <aside
-      class="fixed right-0 top-16 bottom-0 w-96 overflow-y-auto border-l border-gray-100 bg-white p-6 flex-shrink-0 hidden lg:block z-10"
+      class="fixed right-0 top-16 bottom-0 w-80 2xl:w-96 overflow-y-auto border-l border-gray-100 bg-white p-6 flex-shrink-0 hidden lg:block z-10"
     >
       <div>
         <div>
@@ -272,7 +269,6 @@ const badges = doc?.badges || [];
 
       // First try to find headings with IDs
       const headings = prose.querySelectorAll('h1[id], h2[id], h3[id]');
-      console.log('Headings with IDs found:', headings.length);
 
       if (headings.length > 0) {
         headings.forEach((heading) => {
@@ -281,7 +277,6 @@ const badges = doc?.badges || [];
       } else {
         // Fallback: If no headings with IDs found, attach IDs to them
         const allHeadings = prose.querySelectorAll('h1, h2, h3');
-        console.log('Total headings found:', allHeadings.length);
 
         allHeadings.forEach((heading) => {
           // Only add ID if it doesn't exist

package/eventcatalog/src/enterprise/custom-documentation/utils/custom-docs.ts

@@ -29,6 +29,16 @@ type SideBarConfigurationItem = {
   collapsed?: boolean;
 };
 
+type AdjacentPage = {
+  label: string;
+  slug: string;
+};
+
+type AdjacentPages = {
+  prev: AdjacentPage | null;
+  next: AdjacentPage | null;
+};
+
 const DOCS_DIR = 'docs';
 
 /**
@@ -112,6 +122,72 @@ const processSidebarItems = async (items: SideBarConfigurationItem[]): Promise<S
   return processedItems;
 };
 
+/**
+ * Flatten all navigation items into a single array of pages with slugs
+ * This is used to find previous and next pages for navigation
+ */
+const flattenNavigationItems = (items: SidebarItem[]): AdjacentPage[] => {
+  const flatPages: AdjacentPage[] = [];
+
+  const processItem = (item: SidebarItem) => {
+    // Add the current item if it has a slug
+    if (item.slug) {
+      flatPages.push({
+        label: item.label,
+        slug: item.slug,
+      });
+    }
+
+    // Process nested items if they exist
+    if (item.items && item.items.length > 0) {
+      item.items.forEach(processItem);
+    }
+  };
+
+  items.forEach(processItem);
+  return flatPages;
+};
+
+/**
+ * Get the previous and next pages for a given slug
+ * Returns null for prev if it's the first page, and null for next if it's the last page
+ */
+export const getAdjacentPages = async (slug: string): Promise<AdjacentPages> => {
+  const navigationItems = await getNavigationItems();
+  const flatPages = flattenNavigationItems(navigationItems);
+
+  // Normalize the slug by removing 'docs/' prefix if it exists
+  // and ensure consistent formatting with or without leading slash
+  let normalizedSlug = slug;
+  if (normalizedSlug.startsWith('docs/')) {
+    normalizedSlug = normalizedSlug.substring(5); // Remove 'docs/' prefix
+  }
+
+  // Find the current page by comparing normalized slugs
+  const currentIndex = flatPages.findIndex((page) => {
+    // Normalize page slug for comparison
+    let pageSlug = page.slug;
+    if (pageSlug.startsWith('/')) {
+      pageSlug = pageSlug.substring(1);
+    }
+
+    return pageSlug === normalizedSlug;
+  });
+
+  // If page not found, return null for both prev and next
+  if (currentIndex === -1) {
+    return { prev: null, next: null };
+  }
+
+  // Get previous page if it exists
+  const prev = currentIndex > 0 ? flatPages[currentIndex - 1] : null;
+
+  // Get next page if it exists
+  const next = currentIndex < flatPages.length - 1 ? flatPages[currentIndex + 1] : null;
+
+  return { prev, next };
+};
+
 export const getNavigationItems = async (): Promise<SidebarItem[]> => {
   const configuredSidebar = config.customDocs.sidebar;
   return processSidebarItems(configuredSidebar as SideBarConfigurationItem[]);

package/eventcatalog/src/pages/docs/custom/[...path]/index.astro

@@ -16,10 +16,6 @@ export const getStaticPaths = (async () => {
     params: { path: doc.id.replace('docs/', '') },
     props: doc,
   }));
-  console.log(
-    'paths',
-    paths.map((path) => path.params.path)
-  );
   return paths;
 }) satisfies GetStaticPaths;
 

package/eventcatalog/src/pages/docs/custom/index.astro

@@ -0,0 +1,237 @@
+---
+import VerticalSideBarLayout from '@layouts/VerticalSideBarLayout.astro';
+import { Code } from 'astro-expressive-code/components';
+import { isEventCatalogProEnabled } from '@utils/feature';
+
+// Example for folder structure
+const folderStructureExample = `my-catalog/
+  └── docs/
+      ├── getting-started/
+      │   ├── 01-introduction.mdx
+      │   └── 02-quick-start.mdx
+      ├── architecture-decisions/
+      │   ├── 01-what-are-architecture-decisions.mdx
+      │   ├── 02-how-to-create-architecture-decisions.mdx
+      │   ├── published/
+      │   │   ├── 01-adr-001-event-driven.mdx
+      │   │   └── 02-adr-002-api-first.mdx
+      │   └── drafts/
+      │       ├── 01-adr-003-microservices.mdx
+      │       └── 02-adr-004-monolith.mdx
+      └`;
+// Example MDX file content
+const mdxFileExample = `---
+title: Getting Started
+summary: How to get started with our event-driven architecture
+---
+
+# Getting Started with our Event-Driven Architecture
+
+This guide will help you understand how our services communicate using events.
+
+## Prerequisites
+
+- Understanding of basic messaging patterns
+- Node.js installed on your machine
+
+## Key Concepts
+
+Events are the backbone of our architecture. They represent facts that have happened in our system.
+`;
+
+// Example config file
+const configExample = `// eventcatalog.config.js
+  
+module.exports = {
+  // Your existing config...
+  
+  customDocs: {
+    sidebar: [
+      {
+        label: 'Getting Started',
+        badge: {
+          text: 'New', color: 'green'
+        },
+        collapsed: false,
+        items: [
+          { label: 'Introduction', slug: 'getting-started/01-introduction' },
+          { label: 'Quick Start', slug: 'getting-started/02-quick-start' }
+        ]
+      },
+      {
+        label: 'Architecture Decisions',
+        badge: {
+          text: 'New', color: 'green'
+        },
+        collapsed: true,
+        items: [
+          { 
+            label: 'What are Architecture Decisions?', 
+            slug: 'architecture-decisions/01-what-are-architecture-decisions' 
+          },
+          { 
+            label: 'How to Create Architecture Decisions', 
+            slug: 'architecture-decisions/02-how-to-create-architecture-decisions' 
+          },
+          {
+            label: 'Published ADRs',
+            autogenerated: { 
+              directory: 'architecture-decisions/published', 
+              collapsed: true 
+            }
+          },
+          {
+            label: 'Draft ADRs',
+            autogenerated: { 
+              directory: 'architecture-decisions/drafts', 
+              collapsed: true 
+            }
+          }
+        ]
+      }
+    ]
+  }
+}`;
+---
+
+<VerticalSideBarLayout title="Custom Documentation">
+  <body class="min-h-screen font-inter">
+    <main class="container px-8 lg:px-8 mx-auto py-8 max-w-[80em]">
+      <div class="mb-12">
+        <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-6">
+          <div>
+            <div class="flex flex-wrap items-center gap-3 mb-3">
+              <h1 class="text-4xl font-semibold text-gray-900 font-inter">Custom Documentation</h1>
+              <div
+                class="inline-flex items-center px-3 py-1.5 rounded-full text-xs font-medium bg-purple-100 text-purple-800 border border-purple-200 shadow-sm"
+              >
+                Pro feature
+              </div>
+            </div>
+            <p class="text-base mb-0 text-gray-600 max-w-3xl">
+              Add custom documentation to EventCatalog to create a unified source of truth for your team. Document your
+              architecture decisions, patterns, and guidelines.
+            </p>
+          </div>
+          <div class="flex space-x-4 shrink-0">
+            <a
+              href="https://www.eventcatalog.dev/docs/custom-documentation"
+              class="inline-flex items-center justify-center px-5 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50"
+            >
+              Read documentation &rarr;
+            </a>
+            {
+              !isEventCatalogProEnabled() && (
+                <a
+                  href="https://www.eventcatalog.dev/pro/trial"
+                  class="inline-flex items-center justify-center px-5 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-gradient-to-r from-purple-500 to-purple-700 hover:from-purple-600 hover:to-purple-800 shadow-sm"
+                >
+                  Start 14-day trial
+                </a>
+              )
+            }
+          </div>
+        </div>
+      </div>
+
+      <h2 class="text-2xl font-semibold mb-2 text-gray-900">Setup Guide</h2>
+      <p class="text-gray-600 mb-8 max-w-3xl">
+        Custom documentation let's you bring any documentation into EventCatalog. This is useful for documenting your architecture
+        decisions, patterns, and guidelines. Follow these steps to get started:
+      </p>
+
+      <div class="space-y-10 mb-12">
+        <div class="bg-white p-6 rounded-lg shadow-sm border border-gray-200">
+          <div class="flex items-start gap-4">
+            <div
+              class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 text-blue-600 text-lg font-medium shrink-0 mt-1"
+            >
+              1
+            </div>
+            <div class="w-full">
+              <h3 class="text-xl font-semibold text-gray-900 mb-3">Create the content structure</h3>
+              <p class="text-gray-600 mb-4">Create a folder structure in your directory to organize your documentation.</p>
+              <Code code={folderStructureExample} lang="bash" frame="terminal" />
+            </div>
+          </div>
+        </div>
+
+        <div class="bg-white p-6 rounded-lg shadow-sm border border-gray-200">
+          <div class="flex items-start gap-4">
+            <div
+              class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 text-blue-600 text-lg font-medium shrink-0 mt-1"
+            >
+              2
+            </div>
+            <div class="w-full">
+              <h3 class="text-xl font-semibold text-gray-900 mb-3">Add MDX files</h3>
+              <p class="text-gray-600 mb-4">Create MDX files with frontmatter and markdown content.</p>
+              <Code code={mdxFileExample} lang="mdx" frame="terminal" />
+            </div>
+          </div>
+        </div>
+
+        <div class="bg-white p-6 rounded-lg shadow-sm border border-gray-200">
+          <div class="flex items-start gap-4">
+            <div
+              class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 text-blue-600 text-lg font-medium shrink-0 mt-1"
+            >
+              3
+            </div>
+            <div class="w-full">
+              <h3 class="text-xl font-semibold text-gray-900 mb-3">Update your eventcatalog.config.js file</h3>
+              <p class="text-gray-600 mb-4">
+                Add the customDocs configuration to your eventcatalog.config.js file to define your sidebar structure.
+              </p>
+              <Code code={configExample} lang="js" frame="terminal" />
+              <p class="text-gray-600 mt-4">This configuration defines the sidebar structure for your custom documentation:</p>
+              <ul class="list-disc list-inside text-gray-600 mt-2 ml-2 space-y-1">
+                <li>
+                  <strong>label</strong>: The display name for each sidebar section
+                </li>
+                <li>
+                  <strong>badge</strong>: Optional badge to highlight new sections
+                </li>
+                <li>
+                  <strong>collapsed</strong>: Whether the section is collapsed by default
+                </li>
+                <li>
+                  <strong>autogenerated</strong>: Automatically generate sidebar items from a directory
+                </li>
+                <li>
+                  <strong>slug</strong>: Direct link to a specific page
+                </li>
+              </ul>
+            </div>
+          </div>
+        </div>
+
+        <div class="bg-white p-6 rounded-lg shadow-sm border border-gray-200">
+          <div class="flex items-start gap-4">
+            <div
+              class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 text-blue-600 text-lg font-medium shrink-0 mt-1"
+            >
+              4
+            </div>
+            <div class="w-full">
+              <h3 class="text-xl font-semibold text-gray-900 mb-3">Restart EventCatalog</h3>
+              <p class="text-gray-600 mb-4">
+                After configuring your documentation, restart EventCatalog to see your custom documentation.
+              </p>
+              <div class="mb-4">
+                <Code code="npm run dev" lang="bash" frame="terminal" />
+              </div>
+              <p class="text-gray-600 mb-4">
+                Once restarted, you'll see your custom documentation displayed with the sidebar structure you defined:
+              </p>
+              <div class="border border-gray-200 rounded-lg overflow-hidden">
+                <img src="/images/custom-docs-placeholder.png" alt="Example of custom documentation interface" class="w-full" />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+  </body>
+</VerticalSideBarLayout>
+)

package/package.json

@@ -6,7 +6,7 @@
     "url": "https://github.com/event-catalog/eventcatalog.git"
   },
   "type": "module",
-  "version": "2.31.1",
+  "version": "2.31.3",
   "publishConfig": {
     "access": "public"
   },