@eventcatalog/visualiser 5.0.1 → 5.1.0

package/dist/export-mermaid-CbER9roE.d.mts

@@ -0,0 +1,23 @@
+import { Node, Edge } from '@xyflow/react';
+
+/**
+ * Mermaid Export Utility
+ * Converts React Flow nodes and edges to Mermaid flowchart syntax. Used by the
+ * visualiser's Mermaid view and by EventCatalog (the `.mermaid` routes, AI Chat
+ * and the MCP server), so every level of a diagram exports the same way.
+ */
+interface MermaidExportOptions {
+    /** Include class definitions for styling */
+    includeStyles?: boolean;
+    /** Direction of the flowchart: LR (left-right), TB (top-bottom), etc. */
+    direction?: "LR" | "TB" | "RL" | "BT";
+}
+/**
+ * Convert React Flow nodes and edges to Mermaid flowchart syntax. Domains,
+ * systems and a flow's lanes are subgraphs around what's in them (nested, as
+ * on the diagram), so every level of a domain or system diagram keeps its
+ * boundaries. Edges between domains are highlighted.
+ */
+declare function convertToMermaid(graphNodes: Node[], graphEdges: Edge[], options?: MermaidExportOptions): string;
+
+export { type MermaidExportOptions as M, convertToMermaid as c };

package/dist/{elk-layout-CpbZ6hB9.d.ts → export-mermaid-xL98eL1l.d.ts}

@@ -57,4 +57,24 @@ declare const layoutWithElk: ({ nodes, edges }: LayoutGraph, { sizeOf }?: {
     sizeOf?: (node: Node) => LayoutSize;
 }) => Promise<LayoutGraph>;
 
-export { type CopiedEdgeRoute as C, type EdgeRoute as E, type LayoutGraph as L, type LayoutSize as a, getNodeSize as g, layoutWithElk as l };
+/**
+ * Mermaid Export Utility
+ * Converts React Flow nodes and edges to Mermaid flowchart syntax. Used by the
+ * visualiser's Mermaid view and by EventCatalog (the `.mermaid` routes, AI Chat
+ * and the MCP server), so every level of a diagram exports the same way.
+ */
+interface MermaidExportOptions {
+    /** Include class definitions for styling */
+    includeStyles?: boolean;
+    /** Direction of the flowchart: LR (left-right), TB (top-bottom), etc. */
+    direction?: "LR" | "TB" | "RL" | "BT";
+}
+/**
+ * Convert React Flow nodes and edges to Mermaid flowchart syntax. Domains,
+ * systems and a flow's lanes are subgraphs around what's in them (nested, as
+ * on the diagram), so every level of a domain or system diagram keeps its
+ * boundaries. Edges between domains are highlighted.
+ */
+declare function convertToMermaid(graphNodes: Node[], graphEdges: Edge[], options?: MermaidExportOptions): string;
+
+export { type CopiedEdgeRoute as C, type EdgeRoute as E, type LayoutGraph as L, type MermaidExportOptions as M, type LayoutSize as a, convertToMermaid as c, getNodeSize as g, layoutWithElk as l };

package/dist/index.d.mts

@@ -4,6 +4,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { C as CopiedEdgeRoute } from './elk-layout-CpbZ6hB9.mjs';
 import * as react from 'react';
 import react__default, { ReactNode, ComponentType } from 'react';
+export { M as MermaidExportOptions, c as convertToMermaid } from './export-mermaid-CbER9roE.mjs';
 
 /**
  * EventCatalog resource mode
@@ -394,6 +395,17 @@ type OpenInStudioRequest = {
 };
 interface NodeGraphProps {
     id: string;
+    /**
+     * Keeps the Mermaid view in the page's URL (`?render=mermaid`), so links open
+     * in it. Only for the visualiser's own pages: not diagrams embedded in docs
+     * or other apps, which can share a page (or an iframe) with others.
+     */
+    syncRenderModeWithUrl?: boolean;
+    /**
+     * The level of detail to open at (1, 2 or 3), rather than the URL's or the
+     * saved one, e.g. the level an MCP client asked for
+     */
+    initialLevel?: 1 | 2 | 3;
     title?: string;
     href?: string;
     hrefLabel?: string;
@@ -473,14 +485,50 @@ interface NodeGraphProps {
     /** Starts a Studio canvas from what the diagram shows (the menu has "Open in Studio" when set) */
     onOpenInStudio?: (request: OpenInStudioRequest) => void;
 }
-declare const NodeGraph: ({ id, nodes: nodesProp, edges: edgesProp, graph, title: titleProp, href, linkTo, hrefLabel, includeKey: includeKeyProp, footerLabel, linksToVisualiser, links, mode, portalId, showFlowWalkthrough, showSearch: showSearchProp, showMenu, compactSearch, hideAttribution, zoomOnScroll, designId, isChatEnabled, maxTextSize, isDevMode, resourceKey, animated: animatedProp, disableMessageAnimation, overviewGraph, hiddenMessagesGraph, preferenceScope, swimlanes, focusNodeId, focusRequestId, fitRequestId, onNodeClick, onBuildUrl, onNavigate, onSaveLayout, onResetLayout, onOpenInStudio, }: NodeGraphProps) => react_jsx_runtime.JSX.Element | null;
+declare const NodeGraph: ({ id, nodes: nodesProp, edges: edgesProp, graph, title: titleProp, href, linkTo, hrefLabel, includeKey: includeKeyProp, footerLabel, linksToVisualiser, links, syncRenderModeWithUrl, initialLevel, mode, portalId, showFlowWalkthrough, showSearch: showSearchProp, showMenu, compactSearch, hideAttribution, zoomOnScroll, designId, isChatEnabled, maxTextSize, isDevMode, resourceKey, animated: animatedProp, disableMessageAnimation, overviewGraph, hiddenMessagesGraph, preferenceScope, swimlanes, focusNodeId, focusRequestId, fitRequestId, onNodeClick, onBuildUrl, onNavigate, onSaveLayout, onResetLayout, onOpenInStudio, }: NodeGraphProps) => react_jsx_runtime.JSX.Element | null;
+
+type CanvasLevel = {
+    description: string;
+    active: boolean;
+    /** Why the level is greyed out (e.g. the diagram doesn't have it), shown on hover */
+    disabledReason?: string;
+    onSelect: () => void;
+};
+/** A button in a toolbar, with its tooltip (what it does, and why it can't be used when it can't) */
+declare const ToolbarButton: ({ label, hint, active, disabled, onClick, children, }: {
+    label: string;
+    /** Shown under the label on hover */
+    hint?: string;
+    active?: boolean;
+    disabled?: boolean;
+    onClick: () => void;
+    children: ReactNode;
+}) => react_jsx_runtime.JSX.Element;
+/**
+ * How far the canvas is zoomed in, as a percentage. Isolated, so what it's in only re-renders when the zoom changes
+ * (not on every pan). Studio's bar shows it too.
+ */
+declare const ZoomLevel: react.NamedExoticComponent<{
+    className?: string;
+}>;
+declare const ToolbarDivider: () => react_jsx_runtime.JSX.Element;
+/** The frame of a toolbar (e.g. the bar at the bottom of a diagram, or of a Studio canvas), with tooltips */
+declare const Toolbar: ({ children }: {
+    children: ReactNode;
+}) => react_jsx_runtime.JSX.Element;
 
 interface MermaidViewProps {
     nodes: Node[];
     edges: Edge[];
     maxTextSize?: number;
+    /** The diagram's levels of detail, shown in the toolbar as on the diagram */
+    levels?: CanvasLevel[];
+    /** Zoom with the wheel; otherwise only with Ctrl or Cmd held (or a pinch), as on the diagram */
+    zoomOnScroll?: boolean;
+    /** Goes back to the diagram (the toolbar's Mermaid toggle, which is on here) */
+    onShowDiagram?: () => void;
 }
-declare const MermaidView: ({ nodes, edges, maxTextSize, }: MermaidViewProps) => react_jsx_runtime.JSX.Element;
+declare const MermaidView: ({ nodes, edges, maxTextSize, levels, zoomOnScroll, onShowDiagram, }: MermaidViewProps) => react_jsx_runtime.JSX.Element;
 
 /**
  * A diagram's background: dots on the canvas colour (`.react-flow` in styles-core.css), the same wherever a
@@ -488,6 +536,12 @@ declare const MermaidView: ({ nodes, edges, maxTextSize, }: MermaidViewProps) =>
  */
 declare const DiagramBackground: react.NamedExoticComponent<object>;
 
+/**
+ * A diagram's minimap: each node in its resource's colour, and domains and systems as outlined containers with
+ * what's in them inside, as the diagram draws them. The same wherever a diagram is drawn (the visualiser and Studio).
+ */
+declare const DiagramMiniMap: react.NamedExoticComponent<object>;
+
 /**
  * A diagram's legend: how many of each kind of node it shows (and of each domain's, when steps are grouped by
  * domain), with the kind's icon. Clicking an entry hides or shows those nodes. Studio's canvases have the same one.
@@ -508,29 +562,6 @@ declare const LegendPanel: react.NamedExoticComponent<{
     onLegendClick: (key: string) => void;
 }>;
 
-/** A button in a toolbar, with its tooltip (what it does, and why it can't be used when it can't) */
-declare const ToolbarButton: ({ label, hint, active, disabled, onClick, children, }: {
-    label: string;
-    /** Shown under the label on hover */
-    hint?: string;
-    active?: boolean;
-    disabled?: boolean;
-    onClick: () => void;
-    children: ReactNode;
-}) => react_jsx_runtime.JSX.Element;
-/**
- * How far the canvas is zoomed in, as a percentage. Isolated, so what it's in only re-renders when the zoom changes
- * (not on every pan). Studio's bar shows it too.
- */
-declare const ZoomLevel: react.NamedExoticComponent<{
-    className?: string;
-}>;
-declare const ToolbarDivider: () => react_jsx_runtime.JSX.Element;
-/** The frame of a toolbar (e.g. the bar at the bottom of a diagram, or of a Studio canvas), with tooltips */
-declare const Toolbar: ({ children }: {
-    children: ReactNode;
-}) => react_jsx_runtime.JSX.Element;
-
 /** Tooltips for a group of controls (e.g. a toolbar): shown after a moment, then straight away while moving along */
 declare const TipProvider: ({ children }: {
     children: ReactNode;
@@ -1054,21 +1085,6 @@ declare const edgeTypes: {
     step: react.NamedExoticComponent<_xyflow_react.EdgeProps>;
 };
 
-/**
- * Mermaid Export Utility
- * Converts React Flow nodes and edges to Mermaid flowchart syntax
- */
-interface MermaidExportOptions {
-    /** Include class definitions for styling */
-    includeStyles?: boolean;
-    /** Direction of the flowchart: LR (left-right), TB (top-bottom), etc. */
-    direction?: "LR" | "TB" | "RL" | "BT";
-}
-/**
- * Convert React Flow nodes and edges to Mermaid flowchart syntax
- */
-declare function convertToMermaid(graphNodes: Node[], edges: Edge[], options?: MermaidExportOptions): string;
-
 declare const exportNodeGraphForStudio: (data: ReactFlowJsonObject) => ReactFlowJsonObject;
 
 interface BaseCollectionData {
@@ -1135,4 +1151,4 @@ declare const memoNode: <P extends object>(Component: ComponentType<P>) => react
  */
 declare const pauseEdgeAnimations: (canvas: Element | null, paused: boolean) => void | undefined;
 
-export { ACTOR, AGENT, AGENT_TOOL, _default$p as Actor, type ActorNode, type Agent$1 as Agent, _default$j as AgentNode, type AgentTool$1 as AgentTool, _default$k as AgentToolNode, type AgentToolNode as AgentToolNodeType, AnimatedMessageEdge, type BaseNodeData, CHANNEL, COMMAND, type Channel, type ChannelNode, _default$g as Command, type CommandNode, _default$8 as ContextActorNode, type ContextMenuItem, _default$c as CustomNode, DATA, DIAGRAM_FIT_VIEW_OPTIONS, DIAGRAM_MENU, DIAGRAM_MENU_BUTTON, DIAGRAM_MENU_BUTTON_COMPACT, DIAGRAM_MENU_BUTTON_ICON, DIAGRAM_MENU_BUTTON_ICON_COMPACT, DIAGRAM_MENU_ITEM, DIAGRAM_MENU_ITEM_ICON, DIAGRAM_MENU_SEPARATOR, DIAGRAM_MENU_TITLE, type Data, type DataNode, _default$t as DataProductNode, DiagramBackground, _default$a as DomainCardNode, _default$b as DomainNode, type DslGraph, ENTITY_TARGET_HANDLE_ID, EVENT, type EdgeType, _default$d as EntityNode, type EntityProperty, _default$f as Event, type EventCatalogResource, type EventNode, type ExternalSystem, _default$2 as ExternalSystem2Node, type ExternalSystemNode, _default$r as Field, type FieldNode as FieldNodeType, _default$1 as FlowEdge, _default$s as FlowExpandedNode, type FlowGroupBy, type FlowGroupStyle, _default$6 as FlowNode, FocusModeModal, type GraphEdge, type GraphEdgeType, type GraphNode, _default$5 as GroupNode, LabelledDefaultEdge, LabelledSmoothStepEdge, LabelledStepEdge, type LegendEntry, LegendPanel, MESSAGE, type MermaidExportOptions, MermaidView, type Message, _default$u as MessageGroupExpandedNode, type MessageGroupExpandedNodeData, _default$v as MessageGroupNode, type MessageGroupNodeData, type MessageGroupNode as MessageGroupNodeType, _default as MultilineEdgeLabel, type NodeCategory, type NodeConfiguration, _default$w as NodeContextMenu, NodeGraph, type NodeGraphProps, type NodeType, _default$l as Note, type NoteNode, NotesIndicator, type OpenInStudioRequest, OwnerIndicator, QUERY, _default$h as Query, type QueryNode, type RegisteredNode, SERVICE, _default$i as Service, type ServiceNode, type Service as ServiceType, _default$4 as StepNode, _default$x as StepWalkthrough, _default$7 as SystemGroupNode, _default$9 as SystemNode, Tip, TipProvider, Toolbar, ToolbarButton, ToolbarDivider, _default$3 as UserNode, VIEW, type View, type ViewNode, VisualiserSearch, type VisualiserSnapshot, type VisualizerCallbacks, type VisualizerLink, type VisualizerMode, ZoomLevel, _default$o as actorConfig, buildNodeData, convertToMermaid, createEdge, createNode, _default$n as dataNodeConfig, diagramNodeComponents, edgeTypes, _default$e as eventConfig, exportNodeGraphForStudio, _default$m as externalSystemConfig, _default$q as fieldConfig, generateIdForNode, generateIdForNodes, generatedIdForEdge, getColorFromString, getEdgeLabelForMessageAsSource, getEdgeLabelForServiceAsTarget, getEdgeLabelSize, getLegend, getNestedEntityProperties, getPropertyTypeLabel, isFlowGroupBy, layoutGraph, memoNode, nodeComponents, nodeConfigs, normalizeOwners, pauseEdgeAnimations };
+export { ACTOR, AGENT, AGENT_TOOL, _default$p as Actor, type ActorNode, type Agent$1 as Agent, _default$j as AgentNode, type AgentTool$1 as AgentTool, _default$k as AgentToolNode, type AgentToolNode as AgentToolNodeType, AnimatedMessageEdge, type BaseNodeData, CHANNEL, COMMAND, type Channel, type ChannelNode, _default$g as Command, type CommandNode, _default$8 as ContextActorNode, type ContextMenuItem, _default$c as CustomNode, DATA, DIAGRAM_FIT_VIEW_OPTIONS, DIAGRAM_MENU, DIAGRAM_MENU_BUTTON, DIAGRAM_MENU_BUTTON_COMPACT, DIAGRAM_MENU_BUTTON_ICON, DIAGRAM_MENU_BUTTON_ICON_COMPACT, DIAGRAM_MENU_ITEM, DIAGRAM_MENU_ITEM_ICON, DIAGRAM_MENU_SEPARATOR, DIAGRAM_MENU_TITLE, type Data, type DataNode, _default$t as DataProductNode, DiagramBackground, DiagramMiniMap, _default$a as DomainCardNode, _default$b as DomainNode, type DslGraph, ENTITY_TARGET_HANDLE_ID, EVENT, type EdgeType, _default$d as EntityNode, type EntityProperty, _default$f as Event, type EventCatalogResource, type EventNode, type ExternalSystem, _default$2 as ExternalSystem2Node, type ExternalSystemNode, _default$r as Field, type FieldNode as FieldNodeType, _default$1 as FlowEdge, _default$s as FlowExpandedNode, type FlowGroupBy, type FlowGroupStyle, _default$6 as FlowNode, FocusModeModal, type GraphEdge, type GraphEdgeType, type GraphNode, _default$5 as GroupNode, LabelledDefaultEdge, LabelledSmoothStepEdge, LabelledStepEdge, type LegendEntry, LegendPanel, MESSAGE, MermaidView, type Message, _default$u as MessageGroupExpandedNode, type MessageGroupExpandedNodeData, _default$v as MessageGroupNode, type MessageGroupNodeData, type MessageGroupNode as MessageGroupNodeType, _default as MultilineEdgeLabel, type NodeCategory, type NodeConfiguration, _default$w as NodeContextMenu, NodeGraph, type NodeGraphProps, type NodeType, _default$l as Note, type NoteNode, NotesIndicator, type OpenInStudioRequest, OwnerIndicator, QUERY, _default$h as Query, type QueryNode, type RegisteredNode, SERVICE, _default$i as Service, type ServiceNode, type Service as ServiceType, _default$4 as StepNode, _default$x as StepWalkthrough, _default$7 as SystemGroupNode, _default$9 as SystemNode, Tip, TipProvider, Toolbar, ToolbarButton, ToolbarDivider, _default$3 as UserNode, VIEW, type View, type ViewNode, VisualiserSearch, type VisualiserSnapshot, type VisualizerCallbacks, type VisualizerLink, type VisualizerMode, ZoomLevel, _default$o as actorConfig, buildNodeData, createEdge, createNode, _default$n as dataNodeConfig, diagramNodeComponents, edgeTypes, _default$e as eventConfig, exportNodeGraphForStudio, _default$m as externalSystemConfig, _default$q as fieldConfig, generateIdForNode, generateIdForNodes, generatedIdForEdge, getColorFromString, getEdgeLabelForMessageAsSource, getEdgeLabelForServiceAsTarget, getEdgeLabelSize, getLegend, getNestedEntityProperties, getPropertyTypeLabel, isFlowGroupBy, layoutGraph, memoNode, nodeComponents, nodeConfigs, normalizeOwners, pauseEdgeAnimations };

package/dist/index.d.ts

@@ -1,7 +1,8 @@
 import * as _xyflow_react from '@xyflow/react';
 import { Node, Connection, MarkerType, Edge, NodeTypes, EdgeTypes, NodeProps, EdgeProps, ReactFlowJsonObject } from '@xyflow/react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as CopiedEdgeRoute } from './elk-layout-CpbZ6hB9.js';
+import { C as CopiedEdgeRoute } from './export-mermaid-xL98eL1l.js';
+export { M as MermaidExportOptions, c as convertToMermaid } from './export-mermaid-xL98eL1l.js';
 import * as react from 'react';
 import react__default, { ReactNode, ComponentType } from 'react';
 
@@ -394,6 +395,17 @@ type OpenInStudioRequest = {
 };
 interface NodeGraphProps {
     id: string;
+    /**
+     * Keeps the Mermaid view in the page's URL (`?render=mermaid`), so links open
+     * in it. Only for the visualiser's own pages: not diagrams embedded in docs
+     * or other apps, which can share a page (or an iframe) with others.
+     */
+    syncRenderModeWithUrl?: boolean;
+    /**
+     * The level of detail to open at (1, 2 or 3), rather than the URL's or the
+     * saved one, e.g. the level an MCP client asked for
+     */
+    initialLevel?: 1 | 2 | 3;
     title?: string;
     href?: string;
     hrefLabel?: string;
@@ -473,14 +485,50 @@ interface NodeGraphProps {
     /** Starts a Studio canvas from what the diagram shows (the menu has "Open in Studio" when set) */
     onOpenInStudio?: (request: OpenInStudioRequest) => void;
 }
-declare const NodeGraph: ({ id, nodes: nodesProp, edges: edgesProp, graph, title: titleProp, href, linkTo, hrefLabel, includeKey: includeKeyProp, footerLabel, linksToVisualiser, links, mode, portalId, showFlowWalkthrough, showSearch: showSearchProp, showMenu, compactSearch, hideAttribution, zoomOnScroll, designId, isChatEnabled, maxTextSize, isDevMode, resourceKey, animated: animatedProp, disableMessageAnimation, overviewGraph, hiddenMessagesGraph, preferenceScope, swimlanes, focusNodeId, focusRequestId, fitRequestId, onNodeClick, onBuildUrl, onNavigate, onSaveLayout, onResetLayout, onOpenInStudio, }: NodeGraphProps) => react_jsx_runtime.JSX.Element | null;
+declare const NodeGraph: ({ id, nodes: nodesProp, edges: edgesProp, graph, title: titleProp, href, linkTo, hrefLabel, includeKey: includeKeyProp, footerLabel, linksToVisualiser, links, syncRenderModeWithUrl, initialLevel, mode, portalId, showFlowWalkthrough, showSearch: showSearchProp, showMenu, compactSearch, hideAttribution, zoomOnScroll, designId, isChatEnabled, maxTextSize, isDevMode, resourceKey, animated: animatedProp, disableMessageAnimation, overviewGraph, hiddenMessagesGraph, preferenceScope, swimlanes, focusNodeId, focusRequestId, fitRequestId, onNodeClick, onBuildUrl, onNavigate, onSaveLayout, onResetLayout, onOpenInStudio, }: NodeGraphProps) => react_jsx_runtime.JSX.Element | null;
+
+type CanvasLevel = {
+    description: string;
+    active: boolean;
+    /** Why the level is greyed out (e.g. the diagram doesn't have it), shown on hover */
+    disabledReason?: string;
+    onSelect: () => void;
+};
+/** A button in a toolbar, with its tooltip (what it does, and why it can't be used when it can't) */
+declare const ToolbarButton: ({ label, hint, active, disabled, onClick, children, }: {
+    label: string;
+    /** Shown under the label on hover */
+    hint?: string;
+    active?: boolean;
+    disabled?: boolean;
+    onClick: () => void;
+    children: ReactNode;
+}) => react_jsx_runtime.JSX.Element;
+/**
+ * How far the canvas is zoomed in, as a percentage. Isolated, so what it's in only re-renders when the zoom changes
+ * (not on every pan). Studio's bar shows it too.
+ */
+declare const ZoomLevel: react.NamedExoticComponent<{
+    className?: string;
+}>;
+declare const ToolbarDivider: () => react_jsx_runtime.JSX.Element;
+/** The frame of a toolbar (e.g. the bar at the bottom of a diagram, or of a Studio canvas), with tooltips */
+declare const Toolbar: ({ children }: {
+    children: ReactNode;
+}) => react_jsx_runtime.JSX.Element;
 
 interface MermaidViewProps {
     nodes: Node[];
     edges: Edge[];
     maxTextSize?: number;
+    /** The diagram's levels of detail, shown in the toolbar as on the diagram */
+    levels?: CanvasLevel[];
+    /** Zoom with the wheel; otherwise only with Ctrl or Cmd held (or a pinch), as on the diagram */
+    zoomOnScroll?: boolean;
+    /** Goes back to the diagram (the toolbar's Mermaid toggle, which is on here) */
+    onShowDiagram?: () => void;
 }
-declare const MermaidView: ({ nodes, edges, maxTextSize, }: MermaidViewProps) => react_jsx_runtime.JSX.Element;
+declare const MermaidView: ({ nodes, edges, maxTextSize, levels, zoomOnScroll, onShowDiagram, }: MermaidViewProps) => react_jsx_runtime.JSX.Element;
 
 /**
  * A diagram's background: dots on the canvas colour (`.react-flow` in styles-core.css), the same wherever a
@@ -488,6 +536,12 @@ declare const MermaidView: ({ nodes, edges, maxTextSize, }: MermaidViewProps) =>
  */
 declare const DiagramBackground: react.NamedExoticComponent<object>;
 
+/**
+ * A diagram's minimap: each node in its resource's colour, and domains and systems as outlined containers with
+ * what's in them inside, as the diagram draws them. The same wherever a diagram is drawn (the visualiser and Studio).
+ */
+declare const DiagramMiniMap: react.NamedExoticComponent<object>;
+
 /**
  * A diagram's legend: how many of each kind of node it shows (and of each domain's, when steps are grouped by
  * domain), with the kind's icon. Clicking an entry hides or shows those nodes. Studio's canvases have the same one.
@@ -508,29 +562,6 @@ declare const LegendPanel: react.NamedExoticComponent<{
     onLegendClick: (key: string) => void;
 }>;
 
-/** A button in a toolbar, with its tooltip (what it does, and why it can't be used when it can't) */
-declare const ToolbarButton: ({ label, hint, active, disabled, onClick, children, }: {
-    label: string;
-    /** Shown under the label on hover */
-    hint?: string;
-    active?: boolean;
-    disabled?: boolean;
-    onClick: () => void;
-    children: ReactNode;
-}) => react_jsx_runtime.JSX.Element;
-/**
- * How far the canvas is zoomed in, as a percentage. Isolated, so what it's in only re-renders when the zoom changes
- * (not on every pan). Studio's bar shows it too.
- */
-declare const ZoomLevel: react.NamedExoticComponent<{
-    className?: string;
-}>;
-declare const ToolbarDivider: () => react_jsx_runtime.JSX.Element;
-/** The frame of a toolbar (e.g. the bar at the bottom of a diagram, or of a Studio canvas), with tooltips */
-declare const Toolbar: ({ children }: {
-    children: ReactNode;
-}) => react_jsx_runtime.JSX.Element;
-
 /** Tooltips for a group of controls (e.g. a toolbar): shown after a moment, then straight away while moving along */
 declare const TipProvider: ({ children }: {
     children: ReactNode;
@@ -1054,21 +1085,6 @@ declare const edgeTypes: {
     step: react.NamedExoticComponent<_xyflow_react.EdgeProps>;
 };
 
-/**
- * Mermaid Export Utility
- * Converts React Flow nodes and edges to Mermaid flowchart syntax
- */
-interface MermaidExportOptions {
-    /** Include class definitions for styling */
-    includeStyles?: boolean;
-    /** Direction of the flowchart: LR (left-right), TB (top-bottom), etc. */
-    direction?: "LR" | "TB" | "RL" | "BT";
-}
-/**
- * Convert React Flow nodes and edges to Mermaid flowchart syntax
- */
-declare function convertToMermaid(graphNodes: Node[], edges: Edge[], options?: MermaidExportOptions): string;
-
 declare const exportNodeGraphForStudio: (data: ReactFlowJsonObject) => ReactFlowJsonObject;
 
 interface BaseCollectionData {
@@ -1135,4 +1151,4 @@ declare const memoNode: <P extends object>(Component: ComponentType<P>) => react
  */
 declare const pauseEdgeAnimations: (canvas: Element | null, paused: boolean) => void | undefined;
 
-export { ACTOR, AGENT, AGENT_TOOL, _default$p as Actor, type ActorNode, type Agent$1 as Agent, _default$j as AgentNode, type AgentTool$1 as AgentTool, _default$k as AgentToolNode, type AgentToolNode as AgentToolNodeType, AnimatedMessageEdge, type BaseNodeData, CHANNEL, COMMAND, type Channel, type ChannelNode, _default$g as Command, type CommandNode, _default$8 as ContextActorNode, type ContextMenuItem, _default$c as CustomNode, DATA, DIAGRAM_FIT_VIEW_OPTIONS, DIAGRAM_MENU, DIAGRAM_MENU_BUTTON, DIAGRAM_MENU_BUTTON_COMPACT, DIAGRAM_MENU_BUTTON_ICON, DIAGRAM_MENU_BUTTON_ICON_COMPACT, DIAGRAM_MENU_ITEM, DIAGRAM_MENU_ITEM_ICON, DIAGRAM_MENU_SEPARATOR, DIAGRAM_MENU_TITLE, type Data, type DataNode, _default$t as DataProductNode, DiagramBackground, _default$a as DomainCardNode, _default$b as DomainNode, type DslGraph, ENTITY_TARGET_HANDLE_ID, EVENT, type EdgeType, _default$d as EntityNode, type EntityProperty, _default$f as Event, type EventCatalogResource, type EventNode, type ExternalSystem, _default$2 as ExternalSystem2Node, type ExternalSystemNode, _default$r as Field, type FieldNode as FieldNodeType, _default$1 as FlowEdge, _default$s as FlowExpandedNode, type FlowGroupBy, type FlowGroupStyle, _default$6 as FlowNode, FocusModeModal, type GraphEdge, type GraphEdgeType, type GraphNode, _default$5 as GroupNode, LabelledDefaultEdge, LabelledSmoothStepEdge, LabelledStepEdge, type LegendEntry, LegendPanel, MESSAGE, type MermaidExportOptions, MermaidView, type Message, _default$u as MessageGroupExpandedNode, type MessageGroupExpandedNodeData, _default$v as MessageGroupNode, type MessageGroupNodeData, type MessageGroupNode as MessageGroupNodeType, _default as MultilineEdgeLabel, type NodeCategory, type NodeConfiguration, _default$w as NodeContextMenu, NodeGraph, type NodeGraphProps, type NodeType, _default$l as Note, type NoteNode, NotesIndicator, type OpenInStudioRequest, OwnerIndicator, QUERY, _default$h as Query, type QueryNode, type RegisteredNode, SERVICE, _default$i as Service, type ServiceNode, type Service as ServiceType, _default$4 as StepNode, _default$x as StepWalkthrough, _default$7 as SystemGroupNode, _default$9 as SystemNode, Tip, TipProvider, Toolbar, ToolbarButton, ToolbarDivider, _default$3 as UserNode, VIEW, type View, type ViewNode, VisualiserSearch, type VisualiserSnapshot, type VisualizerCallbacks, type VisualizerLink, type VisualizerMode, ZoomLevel, _default$o as actorConfig, buildNodeData, convertToMermaid, createEdge, createNode, _default$n as dataNodeConfig, diagramNodeComponents, edgeTypes, _default$e as eventConfig, exportNodeGraphForStudio, _default$m as externalSystemConfig, _default$q as fieldConfig, generateIdForNode, generateIdForNodes, generatedIdForEdge, getColorFromString, getEdgeLabelForMessageAsSource, getEdgeLabelForServiceAsTarget, getEdgeLabelSize, getLegend, getNestedEntityProperties, getPropertyTypeLabel, isFlowGroupBy, layoutGraph, memoNode, nodeComponents, nodeConfigs, normalizeOwners, pauseEdgeAnimations };
+export { ACTOR, AGENT, AGENT_TOOL, _default$p as Actor, type ActorNode, type Agent$1 as Agent, _default$j as AgentNode, type AgentTool$1 as AgentTool, _default$k as AgentToolNode, type AgentToolNode as AgentToolNodeType, AnimatedMessageEdge, type BaseNodeData, CHANNEL, COMMAND, type Channel, type ChannelNode, _default$g as Command, type CommandNode, _default$8 as ContextActorNode, type ContextMenuItem, _default$c as CustomNode, DATA, DIAGRAM_FIT_VIEW_OPTIONS, DIAGRAM_MENU, DIAGRAM_MENU_BUTTON, DIAGRAM_MENU_BUTTON_COMPACT, DIAGRAM_MENU_BUTTON_ICON, DIAGRAM_MENU_BUTTON_ICON_COMPACT, DIAGRAM_MENU_ITEM, DIAGRAM_MENU_ITEM_ICON, DIAGRAM_MENU_SEPARATOR, DIAGRAM_MENU_TITLE, type Data, type DataNode, _default$t as DataProductNode, DiagramBackground, DiagramMiniMap, _default$a as DomainCardNode, _default$b as DomainNode, type DslGraph, ENTITY_TARGET_HANDLE_ID, EVENT, type EdgeType, _default$d as EntityNode, type EntityProperty, _default$f as Event, type EventCatalogResource, type EventNode, type ExternalSystem, _default$2 as ExternalSystem2Node, type ExternalSystemNode, _default$r as Field, type FieldNode as FieldNodeType, _default$1 as FlowEdge, _default$s as FlowExpandedNode, type FlowGroupBy, type FlowGroupStyle, _default$6 as FlowNode, FocusModeModal, type GraphEdge, type GraphEdgeType, type GraphNode, _default$5 as GroupNode, LabelledDefaultEdge, LabelledSmoothStepEdge, LabelledStepEdge, type LegendEntry, LegendPanel, MESSAGE, MermaidView, type Message, _default$u as MessageGroupExpandedNode, type MessageGroupExpandedNodeData, _default$v as MessageGroupNode, type MessageGroupNodeData, type MessageGroupNode as MessageGroupNodeType, _default as MultilineEdgeLabel, type NodeCategory, type NodeConfiguration, _default$w as NodeContextMenu, NodeGraph, type NodeGraphProps, type NodeType, _default$l as Note, type NoteNode, NotesIndicator, type OpenInStudioRequest, OwnerIndicator, QUERY, _default$h as Query, type QueryNode, type RegisteredNode, SERVICE, _default$i as Service, type ServiceNode, type Service as ServiceType, _default$4 as StepNode, _default$x as StepWalkthrough, _default$7 as SystemGroupNode, _default$9 as SystemNode, Tip, TipProvider, Toolbar, ToolbarButton, ToolbarDivider, _default$3 as UserNode, VIEW, type View, type ViewNode, VisualiserSearch, type VisualiserSnapshot, type VisualizerCallbacks, type VisualizerLink, type VisualizerMode, ZoomLevel, _default$o as actorConfig, buildNodeData, createEdge, createNode, _default$n as dataNodeConfig, diagramNodeComponents, edgeTypes, _default$e as eventConfig, exportNodeGraphForStudio, _default$m as externalSystemConfig, _default$q as fieldConfig, generateIdForNode, generateIdForNodes, generatedIdForEdge, getColorFromString, getEdgeLabelForMessageAsSource, getEdgeLabelForServiceAsTarget, getEdgeLabelSize, getLegend, getNestedEntityProperties, getPropertyTypeLabel, isFlowGroupBy, layoutGraph, memoNode, nodeComponents, nodeConfigs, normalizeOwners, pauseEdgeAnimations };