@eventcatalog/core 4.7.11 → 4.8.0

package/dist/analytics/analytics.cjs

@@ -36,7 +36,7 @@ module.exports = __toCommonJS(analytics_exports);
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "4.7.11";
+var version = "4.8.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/analytics.js

@@ -1,7 +1,7 @@
 import {
   raiseEvent
-} from "../chunk-FNV7TXII.js";
-import "../chunk-6GGS5ZKX.js";
+} from "../chunk-EDMVOV4H.js";
+import "../chunk-XDKU675D.js";
 export {
   raiseEvent
 };

package/dist/analytics/log-build.cjs

@@ -140,7 +140,7 @@ var verifyRequiredFieldsAreInCatalogConfigFile = async (projectDirectory) => {
 var import_os = __toESM(require("os"), 1);
 
 // package.json
-var version = "4.7.11";
+var version = "4.8.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/analytics/log-build.js

@@ -1,9 +1,9 @@
 import {
   log_build_default
-} from "../chunk-SQWXIH42.js";
-import "../chunk-FNV7TXII.js";
+} from "../chunk-TRDXMFBW.js";
+import "../chunk-EDMVOV4H.js";
 import "../chunk-K2XIENVT.js";
-import "../chunk-6GGS5ZKX.js";
+import "../chunk-XDKU675D.js";
 import "../chunk-6QENHZZP.js";
 export {
   log_build_default as default

package/dist/{chunk-FNV7TXII.js → chunk-EDMVOV4H.js}

@@ -1,6 +1,6 @@
 import {
   VERSION
-} from "./chunk-6GGS5ZKX.js";
+} from "./chunk-XDKU675D.js";
 
 // src/analytics/analytics.js
 import os from "os";

package/dist/{chunk-RD5TL6VE.js → chunk-JCJYBRLL.js}

@@ -1,6 +1,6 @@
 import {
   logger
-} from "./chunk-45OUURWB.js";
+} from "./chunk-OGZMUG75.js";
 import {
   cleanup,
   getEventCatalogConfigFile

package/dist/{chunk-45OUURWB.js → chunk-OGZMUG75.js}

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

package/dist/{chunk-SQWXIH42.js → chunk-TRDXMFBW.js}

@@ -1,6 +1,6 @@
 import {
   raiseEvent
-} from "./chunk-FNV7TXII.js";
+} from "./chunk-EDMVOV4H.js";
 import {
   countResources,
   serializeCounts

package/dist/{chunk-6GGS5ZKX.js → chunk-XDKU675D.js}

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

package/dist/constants.cjs

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

package/dist/constants.js

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

package/dist/eventcatalog.cjs

@@ -144,7 +144,7 @@ var verifyRequiredFieldsAreInCatalogConfigFile = async (projectDirectory) => {
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "4.7.11";
+var version = "4.8.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/eventcatalog.js

@@ -4,8 +4,8 @@ import {
 import "./chunk-CA4U2JP7.js";
 import {
   log_build_default
-} from "./chunk-SQWXIH42.js";
-import "./chunk-FNV7TXII.js";
+} from "./chunk-TRDXMFBW.js";
+import "./chunk-EDMVOV4H.js";
 import "./chunk-K2XIENVT.js";
 import {
   FederationConflictError,
@@ -31,10 +31,10 @@ import {
 } from "./chunk-B7HCX5HM.js";
 import {
   generate
-} from "./chunk-RD5TL6VE.js";
+} from "./chunk-JCJYBRLL.js";
 import {
   logger
-} from "./chunk-45OUURWB.js";
+} from "./chunk-OGZMUG75.js";
 import {
   resolve_catalog_dependencies_default
 } from "./chunk-LHR4G2UO.js";
@@ -54,7 +54,7 @@ import {
 import "./chunk-W5JQON7Z.js";
 import {
   VERSION
-} from "./chunk-6GGS5ZKX.js";
+} from "./chunk-XDKU675D.js";
 import {
   linkCoreNodeModules,
   resolveInstalledCoreNodeModules

package/dist/generate.cjs

@@ -108,7 +108,7 @@ var getEventCatalogConfigFile = async (projectDirectory) => {
 var import_picocolors = __toESM(require("picocolors"), 1);
 
 // package.json
-var version = "4.7.11";
+var version = "4.8.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/generate.js

@@ -1,8 +1,8 @@
 import {
   generate
-} from "./chunk-RD5TL6VE.js";
-import "./chunk-45OUURWB.js";
-import "./chunk-6GGS5ZKX.js";
+} from "./chunk-JCJYBRLL.js";
+import "./chunk-OGZMUG75.js";
+import "./chunk-XDKU675D.js";
 import "./chunk-6QENHZZP.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 = "4.7.11";
+var version = "4.8.0";
 
 // src/constants.ts
 var VERSION = version;

package/dist/utils/cli-logger.js

@@ -1,7 +1,7 @@
 import {
   logger
-} from "../chunk-45OUURWB.js";
-import "../chunk-6GGS5ZKX.js";
+} from "../chunk-OGZMUG75.js";
+import "../chunk-XDKU675D.js";
 export {
   logger
 };

package/eventcatalog/src/components/MDX/Flow/Flow.astro

@@ -25,15 +25,15 @@ const flow = flowCollection[0];
 
 const { nodes, edges } = await getNodesAndEdges({
   id: id,
-  version: flow.data.version,
+  version: flow?.data.version,
   mode: mode,
 });
 
 // Load and apply saved layout if it exists
-const resourceKey = buildResourceKey('flows', id, flow.data.version);
+const resourceKey = buildResourceKey('flows', id, flow?.data.version);
 const savedLayout = await loadSavedLayout(resourceKey);
 const nodesWithLayout = applyLayoutToNodes(nodes, savedLayout);
-const portalId = `${id}-${flow.data.version}-flow-${randomUUID()}-portal`;
+const portalId = `${id}-${flow?.data.version}-flow-${randomUUID()}-portal`;
 ---
 
 {

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

@@ -439,9 +439,10 @@ export default function NestedSideBar() {
   if (!data || roots.length === 0) {
     return (
       <aside className="flex h-full min-h-0 w-full flex-1 flex-col bg-[rgb(var(--ec-rail-bg))] font-sans">
-        {/* Search skeleton */}
-        <div className="px-4 py-3 border-b border-[rgb(var(--ec-content-border))] bg-[rgb(var(--ec-rail-bg))]">
-          <div className="h-10 bg-[rgb(var(--ec-content-hover))] rounded-xl animate-pulse" />
+        <div className="flex h-[60px] items-center px-6 bg-[rgb(var(--ec-rail-bg)/0.98)] backdrop-blur-sm border-b border-[rgb(var(--ec-content-border))] sticky top-0 z-10">
+          <span className="text-[0.65rem] font-semibold uppercase tracking-[0.18em] text-[rgb(var(--ec-sidebar-text)/0.5)] truncate">
+            All resources
+          </span>
         </div>
         {/* Content skeleton */}
         <div className="p-4 space-y-3">

package/eventcatalog/src/pages/api/search-index.json.ts

@@ -1,5 +1,6 @@
 import type { APIRoute } from 'astro';
 import { getNestedSideBarData } from '@stores/sidebar-store/state';
+import { getSearchIndexNodeEntries } from '@stores/sidebar-store/search-index';
 
 const isDev = import.meta.env.DEV;
 
@@ -18,7 +19,7 @@ const SKIPPED_PREFIXES = ['list:'];
 export const GET: APIRoute = async () => {
   const sidebarData = await getNestedSideBarData();
 
-  const items = Object.entries(sidebarData.nodes).reduce<SearchIndexItemCompact[]>((acc, [key, node]) => {
+  const items = getSearchIndexNodeEntries(sidebarData.nodes).reduce<SearchIndexItemCompact[]>((acc, [key, node]) => {
     if (typeof node === 'string') return acc;
     if (SKIPPED_PREFIXES.some((prefix) => key.startsWith(prefix))) return acc;
     if (!node.title) return acc;

package/eventcatalog/src/stores/sidebar-store/search-index.ts

@@ -0,0 +1,17 @@
+import type { NavigationData, NavNode } from './builders/shared';
+
+const MESSAGE_NODE_PREFIXES = ['event:', 'command:', 'query:'];
+
+export const getSearchIndexNodeEntries = (nodes: NavigationData['nodes']): [string, NavNode | string][] => {
+  const currentMessageTargets = new Set(
+    Object.entries(nodes).flatMap(([key, node]) => {
+      const isMessageAlias = MESSAGE_NODE_PREFIXES.some((prefix) => key.startsWith(prefix));
+      return typeof node === 'string' && isMessageAlias && node.startsWith(`${key}:`) ? [node] : [];
+    })
+  );
+
+  return Object.entries(nodes).filter(([key]) => {
+    const isMessageNode = MESSAGE_NODE_PREFIXES.some((prefix) => key.startsWith(prefix));
+    return !isMessageNode || currentMessageTargets.has(key);
+  });
+};

package/eventcatalog/src/stores/sidebar-store/state.ts

@@ -281,7 +281,7 @@ export const getNestedSideBarData = async (): Promise<NavigationData> => {
     systems,
     agents,
     services,
-    { events, commands, queries },
+    { events: allEvents, commands: allCommands, queries: allQueries },
     containers,
     flows,
     users,
@@ -301,7 +301,7 @@ export const getNestedSideBarData = async (): Promise<NavigationData> => {
     getSystems({ getAllVersions: false }),
     getAgents({ getAllVersions: false }),
     getServices({ getAllVersions: false }),
-    getMessages({ getAllVersions: false }),
+    getMessages({ getAllVersions: true }),
     getContainers({ getAllVersions: false }),
     getFlows({ getAllVersions: false }),
     getUsers(),
@@ -322,7 +322,10 @@ export const getNestedSideBarData = async (): Promise<NavigationData> => {
   const allSubDomainIds = new Set(domains.flatMap((d) => (d.data.domains || []).map((sd: any) => sd.data.id)));
   const rootDomains = domains.filter((d) => !allSubDomainIds.has(d.data.id));
 
-  const messages = [...events, ...commands, ...queries];
+  const events = allEvents.filter((event) => event.data.version === event.data.latestVersion);
+  const commands = allCommands.filter((command) => command.data.version === command.data.latestVersion);
+  const queries = allQueries.filter((query) => query.data.version === query.data.latestVersion);
+  const messages = [...allEvents, ...allCommands, ...allQueries];
 
   const context = {
     agents,
@@ -595,7 +598,12 @@ export const getNestedSideBarData = async (): Promise<NavigationData> => {
     }
   }
 
-  const flowRefsByMessage = buildFlowReferencesByMessage({ flows, events, commands, queries });
+  const flowRefsByMessage = buildFlowReferencesByMessage({
+    flows,
+    events: allEvents,
+    commands: allCommands,
+    queries: allQueries,
+  });
 
   const messageNodes = messagesWithOwners.reduce(
     (acc, { message, owners }) => {

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

@@ -1,6 +1,5 @@
 import { getCollection } from 'astro:content';
 import type { CollectionEntry } from 'astro:content';
-import semver from 'semver';
 import type { CollectionMessageTypes, CollectionTypes } from '@types';
 import { getDomains, getDomainsForService } from './domains';
 import {

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

@@ -1,7 +1,7 @@
 import type { CollectionTypes } from '@types';
 import type { CollectionEntry } from 'astro:content';
-import semver, { coerce, compare, satisfies as satisfiesRange } from 'semver';
 import path from 'node:path';
+import { compareVersions, toComparableVersion, versionSatisfiesRange } from './version-compare';
 
 // --- FILE PATH HELPERS ---
 
@@ -95,12 +95,11 @@ export { isSameVersion } from './version-compare';
  * Sorts versioned items. Latest version first.
  */
 export function sortVersioned<T>(versioned: T[], versionExtractor: (e: T) => string): T[] {
-  // try to coerce semver versions from input version
-  const semverVersions = versioned.map((v) => ({ original: v, semver: coerce(versionExtractor(v)) }));
+  const versions = versioned.map((original) => ({ original, version: versionExtractor(original) }));
 
   // if all versions are semver'ish, use semver to sort them
-  if (semverVersions.every((v) => v.semver != null)) {
-    const sorted = semverVersions.sort((a, b) => compare(b.semver!, a.semver!));
+  if (versions.every(({ version }) => toComparableVersion(version) !== undefined)) {
+    const sorted = versions.sort((a, b) => compareVersions(b.version, a.version)!);
 
     return sorted.map((v) => v.original);
   } else {
@@ -137,9 +136,8 @@ export function sortStringVersions(versions: string[]) {
  * @returns {boolean} Returns true if the version satisfies the range.
  */
 export const satisfies = (version: string, range: string): boolean => {
-  const coercedVersion = coerce(version);
-  if (!coercedVersion) return false;
-  return satisfiesRange(coercedVersion, range);
+  if (version === range) return true;
+  return versionSatisfiesRange(version, range);
 };
 
 export const getItemsFromCollectionByIdAndSemverOrLatest = <T extends { data: { id: string; version: string } }>(
@@ -150,6 +148,9 @@ export const getItemsFromCollectionByIdAndSemverOrLatest = <T extends { data: {
   const filteredCollection = collection.filter((c) => c.data.id == id);
 
   if (version && version != 'latest') {
+    const exactMatches = filteredCollection.filter((item) => item.data.version === version);
+    if (exactMatches.length > 0) return exactMatches;
+
     return filteredCollection.filter((c) => satisfies(c.data.version, version));
   }
 
@@ -282,12 +283,10 @@ export const createVersionedMap = <T extends { data: { id: string; version?: str
 
   // Sort every entry so index [0] is always the latest version
   for (const [key, list] of map.entries()) {
-    list.sort((a, b) => {
-      // specific version sorting logic (fallback to string compare if not valid semver)
-      const vA = a.data.version || '0.0.0';
-      const vB = b.data.version || '0.0.0';
-      return semver.valid(vB) && semver.valid(vA) ? semver.rcompare(vA, vB) : vB.localeCompare(vA);
-    });
+    map.set(
+      key,
+      sortVersioned(list, (item) => item.data.version || '0.0.0')
+    );
   }
   return map;
 };
@@ -319,11 +318,7 @@ export const findInMap = <T extends { data: { version?: string } }>(
   if (exactMatch) return exactMatch;
 
   // Try semver match if not exact
-  if (semver.validRange(version)) {
-    return items.find((i) => semver.satisfies(i.data.version || '0.0.0', version));
-  }
-
-  return undefined;
+  return items.find((i) => satisfies(i.data.version || '0.0.0', version));
 };
 
 /**
@@ -342,13 +337,7 @@ export const versionMatches = (version: string, rangePattern: string): boolean =
   if (version === rangePattern) return true;
 
   // Try semver range matching
-  try {
-    if (semver.validRange(rangePattern)) {
-      return semver.satisfies(version, rangePattern);
-    }
-  } catch (error) {
-    // Invalid semver, fall through
-  }
+  if (satisfies(version, rangePattern)) return true;
 
   // Handle x-patterns like 1.x, 1.2.x
   if (rangePattern.includes('.x')) {

package/eventcatalog/src/utils/collections/version-compare.ts

@@ -1,12 +1,41 @@
-import { coerce, eq } from 'semver';
+import { coerce, compare, satisfies, valid, validRange } from 'semver';
+
+// Keep in sync with packages/sdk/src/internal/versions.ts
+const NUMERIC_VERSION_PATTERN = /^[vV]?\d+(?:\.\d+){0,2}$/;
+
+export function toComparableVersion(version: string | undefined) {
+  if (!version) return undefined;
+
+  const strictVersion = valid(version);
+  if (strictVersion) return strictVersion;
+
+  if (!NUMERIC_VERSION_PATTERN.test(version)) return undefined;
+
+  return coerce(version) ?? undefined;
+}
+
+export function compareVersions(v1: string | undefined, v2: string | undefined): number | undefined {
+  const semverV1 = toComparableVersion(v1);
+  const semverV2 = toComparableVersion(v2);
+
+  if (!semverV1 || !semverV2) return undefined;
+
+  return compare(semverV1, semverV2);
+}
+
+export function versionSatisfiesRange(version: string, range: string) {
+  const comparableVersion = toComparableVersion(version);
+  const comparableRange = validRange(range) ?? validRange(range.replace(/V(?=\d)/g, 'v'));
+
+  if (!comparableVersion || !comparableRange) return false;
+
+  return satisfies(comparableVersion, comparableRange);
+}
 
 export function isSameVersion(v1: string | undefined, v2: string | undefined) {
-  const semverV1 = coerce(v1);
-  const semverV2 = coerce(v2);
+  const comparison = compareVersions(v1, v2);
 
-  if (semverV1 != null && semverV2 != null) {
-    return eq(semverV1, semverV2);
-  }
+  if (comparison !== undefined) return comparison === 0;
 
   return v1 === v2;
 }

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

@@ -1,31 +1,11 @@
 import type { CollectionTypes } from '@types';
 import type { CollectionEntry } from 'astro:content';
-import { coerce, compare, satisfies, validRange } from 'semver';
+import { getItemsFromCollectionByIdAndSemverOrLatest } from './util';
 
 export const getVersionFromCollection = (
   collection: CollectionEntry<CollectionTypes>[],
   id: string,
   version?: string
 ): CollectionEntry<CollectionTypes>[] => {
-  const data = collection;
-  const semverRange = validRange(version);
-
-  if (semverRange) {
-    return data.filter((msg) => msg.data.id == id).filter((msg) => satisfies(msg.data.version, semverRange));
-  }
-
-  const filteredEvents = data.filter((event) => event.data.id === id);
-
-  // Order by semver
-  const sorted = filteredEvents.sort((a, b) => {
-    const semverA = coerce(a.data.version);
-    const semverB = coerce(b.data.version);
-    if (semverA && semverB) {
-      return compare(semverA, semverB);
-    }
-    return a.data.version.localeCompare(b.data.version);
-  });
-
-  // latest version
-  return [sorted[sorted.length - 1]];
+  return getItemsFromCollectionByIdAndSemverOrLatest(collection, id, version);
 };

package/package.json

@@ -7,7 +7,7 @@
   },
   "license": "SEE LICENSE IN LICENSE",
   "type": "module",
-  "version": "4.7.11",
+  "version": "4.8.0",
   "publishConfig": {
     "access": "public"
   },
@@ -119,9 +119,9 @@
     "update-notifier": "^7.3.1",
     "uuid": "^11.1.1",
     "zod": "^4.3.6",
-    "@eventcatalog/linter": "1.1.14",
-    "@eventcatalog/visualiser": "^4.1.3",
-    "@eventcatalog/sdk": "2.27.4"
+    "@eventcatalog/sdk": "2.28.0",
+    "@eventcatalog/linter": "1.1.15",
+    "@eventcatalog/visualiser": "^4.1.3"
   },
   "devDependencies": {
     "@astrojs/check": "^0.9.10",

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

@@ -1,349 +0,0 @@
-'use client';
-
-import { useState, useCallback, useMemo } from 'react';
-import {
-  Search,
-  X,
-  SlidersHorizontal,
-  ChevronRight,
-  Boxes,
-  Server,
-  Zap,
-  MessageSquare,
-  Search as SearchIcon,
-  Database,
-  Waypoints,
-  SquareMousePointer,
-  ListOrdered,
-  ArrowLeftRight,
-  Package,
-  Box,
-  Bot,
-} from 'lucide-react';
-import type { NavNode } from '@stores/sidebar-store/state';
-import { getBadgeClasses } from './utils';
-
-const cn = (...classes: (string | false | undefined)[]) => classes.filter(Boolean).join(' ');
-
-type SearchResult = {
-  nodeKey: string;
-  node: NavNode;
-  matchType: 'name' | 'id';
-};
-
-type Props = {
-  nodes: Record<string, NavNode | string>;
-  onSelectResult: (nodeKey: string, node: NavNode) => void;
-  onSearchChange?: (isSearching: boolean) => void;
-};
-
-export default function SearchBar({ nodes, onSelectResult, onSearchChange }: Props) {
-  const [searchQuery, setSearchQuery] = useState('');
-  const [searchFilters, setSearchFilters] = useState<Set<string>>(new Set());
-  const [showFilterDropdown, setShowFilterDropdown] = useState(false);
-
-  // Pre-process searchable nodes to avoid iterating object on every render
-  // Filter out unversioned keys (e.g., "domain:OrderService") to avoid duplicates with versioned keys (e.g., "domain:OrderService:1.0.0")
-  const searchableNodes = useMemo((): Array<[string, NavNode]> => {
-    const result: Array<[string, NavNode]> = [];
-    for (const [key, node] of Object.entries(nodes)) {
-      // Skip string references (unversioned aliases that point to versioned keys)
-      if (typeof node === 'string') continue;
-      if (node.type === 'group') continue;
-      // Only include versioned keys (those with 3+ parts like "type:id:version")
-      // Unversioned keys (2 parts like "type:id") are aliases to latest version and would cause duplicates
-      const keyParts = key.split(':');
-      if (keyParts.length >= 3) {
-        result.push([key, node]);
-      }
-    }
-    return result;
-  }, [nodes]);
-
-  // Get available badges from nodes
-  const availableBadges = useMemo(() => {
-    const badges = new Set<string>();
-
-    for (const [_, node] of searchableNodes) {
-      if (node.badge) {
-        badges.add(node.badge);
-      }
-    }
-    return badges;
-  }, [searchableNodes]);
-
-  const handleSearchChange = (value: string) => {
-    setSearchQuery(value);
-    onSearchChange?.(value.trim().length > 0);
-  };
-
-  const clearSearch = () => {
-    setSearchQuery('');
-    onSearchChange?.(false);
-  };
-
-  const filterTypes = [
-    { key: 'channel', label: 'Channels', badge: 'Channel', icon: ArrowLeftRight },
-    { key: 'agent', label: 'Agents', badge: 'Agent', icon: Bot },
-    { key: 'command', label: 'Commands', badge: 'Command', icon: MessageSquare },
-    { key: 'container', label: 'Data Stores', badge: 'Container', icon: Database },
-    { key: 'data-product', label: 'Data Products', badge: 'Data Product', icon: Package },
-    { key: 'design', label: 'Designs', badge: 'Design', icon: SquareMousePointer },
-    { key: 'domain', label: 'Domains', badge: 'Domain', icon: Boxes },
-    { key: 'entity', label: 'Entities', badge: 'Entity', icon: Box },
-    { key: 'event', label: 'Events', badge: 'Event', icon: Zap },
-    { key: 'flow', label: 'Flows', badge: 'Flow', icon: Waypoints },
-    { key: 'query', label: 'Queries', badge: 'Query', icon: SearchIcon },
-    { key: 'service', label: 'Services', badge: 'Service', icon: Server },
-  ].filter((filter) => availableBadges.has(filter.badge));
-
-  const toggleSearchFilter = (filterKey: string) => {
-    setSearchFilters((prev) => {
-      const next = new Set(prev);
-      if (next.has(filterKey)) {
-        next.delete(filterKey);
-      } else {
-        next.add(filterKey);
-      }
-      return next;
-    });
-  };
-
-  const searchResults = useCallback((): SearchResult[] => {
-    if (!searchQuery.trim()) return [];
-
-    const query = searchQuery.toLowerCase();
-    const results: SearchResult[] = [];
-
-    const badgeToFilterKey: Record<string, string> = {
-      Agent: 'agent',
-      Domain: 'domain',
-      Service: 'service',
-      Event: 'event',
-      Command: 'command',
-      Query: 'query',
-      Container: 'container',
-      'Data Product': 'data-product',
-      Flow: 'flow',
-      Design: 'design',
-      Channel: 'channel',
-      Entity: 'entity',
-    };
-
-    // Use the memoized array instead of Object.entries(nodes)
-    for (const [key, node] of searchableNodes) {
-      if (searchFilters.size > 0) {
-        const filterKey = node.badge ? badgeToFilterKey[node.badge] : null;
-        if (!filterKey || !searchFilters.has(filterKey)) continue;
-      }
-
-      if (node.title.toLowerCase().includes(query)) {
-        results.push({ nodeKey: key, node, matchType: 'name' });
-        continue;
-      }
-
-      const keyParts = key.split(':');
-      if (keyParts.length >= 3) {
-        const id = keyParts[1].toLowerCase();
-        if (id.includes(query)) {
-          results.push({ nodeKey: key, node, matchType: 'id' });
-        }
-      }
-    }
-
-    return results
-      .sort((a, b) => {
-        const aExact = a.node.title.toLowerCase() === query;
-        const bExact = b.node.title.toLowerCase() === query;
-        if (aExact && !bExact) return -1;
-        if (!aExact && bExact) return 1;
-        return a.node.title.localeCompare(b.node.title);
-      })
-      .slice(0, 20);
-  }, [searchQuery, searchableNodes, searchFilters]);
-
-  const handleSelectResult = (nodeKey: string, node: NavNode) => {
-    onSelectResult(nodeKey, node);
-    clearSearch();
-  };
-
-  const results = searchResults();
-  const showSearchResults = searchQuery.trim().length > 0;
-
-  // Group results by type (badge), sorted alphabetically
-  const groupedResults = useMemo(() => {
-    const groups: Record<string, SearchResult[]> = {};
-
-    for (const result of results) {
-      const badge = result.node.badge || 'Other';
-      if (!groups[badge]) {
-        groups[badge] = [];
-      }
-      groups[badge].push(result);
-    }
-
-    return Object.entries(groups)
-      .sort(([a], [b]) => a.localeCompare(b))
-      .map(([type, typeResults]) => ({ type, results: typeResults }));
-  }, [results]);
-
-  return (
-    <>
-      {/* Search Input */}
-      <div className="px-4 py-3 bg-[rgb(var(--ec-content-bg))] border-b border-[rgb(var(--ec-content-border))]">
-        <div className="flex gap-2">
-          <div className="relative flex-1">
-            <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-[rgb(var(--ec-input-placeholder))]" />
-            <input
-              type="text"
-              placeholder="Search resources..."
-              value={searchQuery}
-              onChange={(e) => handleSearchChange(e.target.value)}
-              className="w-full pl-9! pr-8! py-2.5! text-sm! bg-[rgb(var(--ec-input-bg))]! border! border-[rgb(var(--ec-input-border))]! rounded-xl! focus:outline-hidden! focus:ring-2! focus:ring-[rgb(var(--ec-accent))]! focus:border-transparent! text-[rgb(var(--ec-input-text))]! placeholder:text-[rgb(var(--ec-input-placeholder))]!"
-            />
-            {searchQuery && (
-              <button
-                onClick={clearSearch}
-                className="absolute right-3 top-1/2 -translate-y-1/2 text-[rgb(var(--ec-icon-color))] hover:text-[rgb(var(--ec-icon-hover))]"
-                aria-label="Clear search"
-              >
-                <X className="w-4 h-4" aria-hidden="true" />
-              </button>
-            )}
-          </div>
-          {/* Filter Button */}
-          <div className="relative">
-            <button
-              onClick={() => setShowFilterDropdown(!showFilterDropdown)}
-              className={cn(
-                'flex items-center justify-center w-10 h-10 rounded-xl border transition-colors',
-                searchFilters.size > 0
-                  ? 'bg-[rgb(var(--ec-accent)/0.1)] border-[rgb(var(--ec-accent)/0.3)] text-[rgb(var(--ec-accent))]'
-                  : 'bg-[rgb(var(--ec-input-bg))] border-[rgb(var(--ec-input-border))] text-[rgb(var(--ec-icon-color))] hover:text-[rgb(var(--ec-icon-hover))] hover:bg-[rgb(var(--ec-content-hover))]'
-              )}
-              aria-label="Filter search results"
-              aria-expanded={showFilterDropdown}
-            >
-              <SlidersHorizontal className="w-4 h-4" aria-hidden="true" />
-              {searchFilters.size > 0 && (
-                <span className="absolute -top-1 -right-1 w-4 h-4 bg-[rgb(var(--ec-accent))] text-white text-[10px] font-bold rounded-full flex items-center justify-center">
-                  {searchFilters.size}
-                </span>
-              )}
-            </button>
-
-            {/* Filter Dropdown */}
-            {showFilterDropdown && (
-              <>
-                <div className="fixed inset-0 z-20" onClick={() => setShowFilterDropdown(false)} />
-                <div className="absolute right-0 top-full mt-1 w-48 bg-[rgb(var(--ec-dropdown-bg))] rounded-lg shadow-lg border border-[rgb(var(--ec-dropdown-border))] z-30">
-                  <div className="p-2">
-                    <div className="text-[10px] font-medium text-[rgb(var(--ec-content-text-muted))] uppercase tracking-wide px-2 py-1">
-                      Filter by type
-                    </div>
-                    <div className="flex flex-col gap-0.5 mt-1">
-                      {filterTypes.map((filter) => {
-                        const isActive = searchFilters.has(filter.key);
-                        const Icon = filter.icon;
-                        return (
-                          <button
-                            key={filter.key}
-                            onClick={() => toggleSearchFilter(filter.key)}
-                            className={cn(
-                              'flex items-center justify-between px-2 py-1.5 rounded text-sm transition-colors',
-                              isActive
-                                ? 'bg-[rgb(var(--ec-accent)/0.1)] text-[rgb(var(--ec-accent))]'
-                                : 'text-[rgb(var(--ec-dropdown-text))] hover:bg-[rgb(var(--ec-dropdown-hover))]'
-                            )}
-                          >
-                            <span className="flex items-center gap-2">
-                              <Icon className="w-3 h-3" />
-                              {filter.label}
-                            </span>
-                            {isActive && <span className="text-[rgb(var(--ec-accent))]">✓</span>}
-                          </button>
-                        );
-                      })}
-                    </div>
-                    {searchFilters.size > 0 && (
-                      <>
-                        <div className="border-t border-[rgb(var(--ec-content-border))] my-2" />
-                        <button
-                          onClick={() => {
-                            setSearchFilters(new Set());
-                            setShowFilterDropdown(false);
-                          }}
-                          className="w-full px-2 py-1.5 text-sm text-[rgb(var(--ec-content-text-muted))] hover:text-[rgb(var(--ec-content-text))] hover:bg-[rgb(var(--ec-dropdown-hover))] rounded text-left"
-                        >
-                          Reset filters
-                        </button>
-                      </>
-                    )}
-                  </div>
-                </div>
-              </>
-            )}
-          </div>
-        </div>
-      </div>
-
-      {/* Search Results */}
-      {showSearchResults && (
-        <div className="flex-1 overflow-y-auto bg-[rgb(var(--ec-content-bg))] border-b border-[rgb(var(--ec-content-border))]">
-          <div className="px-3 py-2">
-            <div className="text-[10px] font-medium text-[rgb(var(--ec-content-text-muted))] uppercase tracking-wide mb-2">
-              {results.length > 0 ? `${results.length} result${results.length > 1 ? 's' : ''}` : 'No results'}
-            </div>
-            {groupedResults.length > 0 && (
-              <div className="flex flex-col gap-3">
-                {groupedResults.map(({ type, results: typeResults }) => (
-                  <div key={type}>
-                    <div className="flex items-center gap-2 mb-1">
-                      <span
-                        className={cn(
-                          'px-1.5 py-0.5 text-[8px] font-semibold uppercase tracking-wide rounded',
-                          getBadgeClasses(type)
-                        )}
-                      >
-                        {type}
-                      </span>
-                      <span className="text-[10px] text-[rgb(var(--ec-content-text-muted))]">({typeResults.length})</span>
-                    </div>
-                    <div className="flex flex-col gap-0.5">
-                      {typeResults.map(({ nodeKey, node, matchType }) => (
-                        <button
-                          key={nodeKey}
-                          onClick={() => handleSelectResult(nodeKey, node)}
-                          className="group flex items-center justify-between w-full px-3 py-2 rounded-lg cursor-pointer text-left transition-colors hover:bg-[rgb(var(--ec-content-hover))]"
-                        >
-                          <div className="flex flex-col min-w-0 flex-1">
-                            <span className="text-sm text-[rgb(var(--ec-content-text))] truncate">{node.title}</span>
-                            {matchType === 'id' && (
-                              <span className="text-xs text-[rgb(var(--ec-content-text-muted))] truncate">
-                                ID: {nodeKey.split(':')[2]}
-                              </span>
-                            )}
-                          </div>
-                          <div className="flex items-center gap-2 flex-shrink-0">
-                            {node.pages && node.pages.length > 0 && (
-                              <ChevronRight className="w-4 h-4 text-[rgb(var(--ec-icon-color))] group-hover:text-[rgb(var(--ec-accent))]" />
-                            )}
-                          </div>
-                        </button>
-                      ))}
-                    </div>
-                  </div>
-                ))}
-              </div>
-            )}
-            {results.length === 0 && searchQuery.trim() && (
-              <div className="text-sm text-[rgb(var(--ec-content-text-muted))] py-4 text-center">
-                No resources found for "{searchQuery}"
-              </div>
-            )}
-          </div>
-        </div>
-      )}
-    </>
-  );
-}