@likec4/diagram 1.8.1 → 1.12.0

package/dist/state/diagramStore.d.ts

@@ -1,1268 +0,0 @@
-import { DiagramNode, DiagramView, ElementKind, ElementNotation, Fqn, NodeId, ViewChange, ViewID } from '@likec4/core';
-import { OnEdgesChange, OnNodesChange } from '@xyflow/react';
-import { MouseEvent as ReactMouseEvent } from 'react';
-import { Simplify } from 'type-fest';
-import { XYStoreApi } from '../hooks/useXYFlow';
-import { ElementIconRenderer, LikeC4DiagramEventHandlers, WhereOperator } from '../LikeC4Diagram.props';
-import { XYFlowEdge, XYFlowInstance, XYFlowNode } from '../xyflow/types';
-
-type RequiredOrNull<T> = {
-    [P in keyof T]-?: NonNullable<T[P]> | null;
-};
-export type DiagramInitialState = {
-    view: DiagramView;
-    readonly: boolean;
-    showElementLinks: boolean;
-    showNavigationButtons: boolean;
-    showNotations: boolean;
-    fitViewEnabled: boolean;
-    fitViewPadding: number;
-    zoomable: boolean;
-    pannable: boolean;
-    nodesDraggable: boolean;
-    nodesSelectable: boolean;
-    experimentalEdgeEditing: boolean;
-    enableFocusMode: boolean;
-    renderIcon: ElementIconRenderer | null;
-    whereFilter: WhereOperator<string, string> | null;
-    enableDynamicViewWalkthrough: boolean;
-    xyflow: XYFlowInstance;
-    xystore: XYStoreApi;
-    getContainer: () => HTMLDivElement | null;
-} & RequiredOrNull<LikeC4DiagramEventHandlers>;
-export type DiagramState = Simplify<DiagramInitialState & {
-    readonly storeDevId: string;
-    xynodes: XYFlowNode[];
-    xyedges: XYFlowEdge[];
-    viewSyncDebounceTimeout: number | null;
-    viewportChanged: boolean;
-    initialized: boolean;
-    isDynamicView: boolean;
-    activeDynamicViewStep: number | null;
-    lastClickedNodeId: string | null;
-    lastClickedEdgeId: string | null;
-    focusedNodeId: string | null;
-    hoveredNodeId: string | null;
-    hoveredEdgeId: string | null;
-    dimmed: ReadonlySet<string>;
-    lastOnNavigate: null | {
-        fromView: ViewID;
-        toView: ViewID;
-        fromNode: NodeId;
-    };
-    navigationHistory: Array<{
-        viewId: ViewID;
-        nodeId: NodeId | null;
-    }>;
-    navigationHistoryIndex: number;
-    updateView: (view: DiagramView) => void;
-    focusOnNode: (nodeId: string) => void;
-    setHoveredNode: (nodeId: string | null) => void;
-    setHoveredEdge: (edgeId: string | null) => void;
-    setLastClickedNode: (nodeId: string | null) => void;
-    setLastClickedEdge: (edgeId: string | null) => void;
-    resetLastClicked: () => void;
-    getElement(id: Fqn): DiagramNode | null;
-    triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-    /**
-     * @returns true if there was pending save layout
-     */
-    cancelSaveManualLayout: () => boolean;
-    scheduleSaveManualLayout: () => void;
-    triggerSaveManualLayout: () => void;
-    triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-    fitDiagram: (duration?: number) => void;
-    goBack: () => void;
-    goForward: () => void;
-    nextDynamicStep: (increment?: number) => void;
-    activateDynamicStep: (step: number) => void;
-    stopDynamicView: () => void;
-    onInit: (xyflow: XYFlowInstance) => void;
-    onNodesChange: OnNodesChange<XYFlowNode>;
-    onEdgesChange: OnEdgesChange<XYFlowEdge>;
-    highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-}>;
-export declare function createDiagramStore(props: DiagramInitialState): import('zustand/traditional').UseBoundStoreWithEqualityFn<Omit<Omit<import('zustand/vanilla').StoreApi<{
-    view: DiagramView;
-    readonly: boolean;
-    showElementLinks: boolean;
-    showNavigationButtons: boolean;
-    showNotations: boolean;
-    fitViewEnabled: boolean;
-    fitViewPadding: number;
-    zoomable: boolean;
-    pannable: boolean;
-    nodesDraggable: boolean;
-    nodesSelectable: boolean;
-    experimentalEdgeEditing: boolean;
-    enableFocusMode: boolean;
-    renderIcon: ElementIconRenderer | null;
-    whereFilter: WhereOperator<string, string> | null;
-    enableDynamicViewWalkthrough: boolean;
-    xyflow: XYFlowInstance;
-    xystore: XYStoreApi;
-    getContainer: () => HTMLDivElement | null;
-    onChange: import('../LikeC4Diagram.props').OnChange | null;
-    onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-    onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-    onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-    onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-    onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-    onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-    onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-    onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-    onBurgerMenuClick: (() => void) | null;
-    onOpenSourceView: (() => void) | null;
-    onOpenSourceElement: ((fqn: Fqn) => void) | null;
-    onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-    readonly storeDevId: string;
-    xynodes: XYFlowNode[];
-    xyedges: XYFlowEdge[];
-    viewSyncDebounceTimeout: number | null;
-    viewportChanged: boolean;
-    initialized: boolean;
-    isDynamicView: boolean;
-    activeDynamicViewStep: number | null;
-    lastClickedNodeId: string | null;
-    lastClickedEdgeId: string | null;
-    focusedNodeId: string | null;
-    hoveredNodeId: string | null;
-    hoveredEdgeId: string | null;
-    dimmed: ReadonlySet<string>;
-    lastOnNavigate: null | {
-        fromView: ViewID;
-        toView: ViewID;
-        fromNode: NodeId;
-    };
-    navigationHistory: Array<{
-        viewId: ViewID;
-        nodeId: NodeId | null;
-    }>;
-    navigationHistoryIndex: number;
-    updateView: (view: DiagramView) => void;
-    focusOnNode: (nodeId: string) => void;
-    setHoveredNode: (nodeId: string | null) => void;
-    setHoveredEdge: (edgeId: string | null) => void;
-    setLastClickedNode: (nodeId: string | null) => void;
-    setLastClickedEdge: (edgeId: string | null) => void;
-    resetLastClicked: () => void;
-    getElement: (id: Fqn) => DiagramNode | null;
-    triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-    cancelSaveManualLayout: () => boolean;
-    scheduleSaveManualLayout: () => void;
-    triggerSaveManualLayout: () => void;
-    triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-    fitDiagram: (duration?: number) => void;
-    goBack: () => void;
-    goForward: () => void;
-    nextDynamicStep: (increment?: number) => void;
-    activateDynamicStep: (step: number) => void;
-    stopDynamicView: () => void;
-    onInit: (xyflow: XYFlowInstance) => void;
-    onNodesChange: OnNodesChange<XYFlowNode>;
-    onEdgesChange: OnEdgesChange<XYFlowEdge>;
-    highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-}>, "subscribe"> & {
-    subscribe: {
-        (listener: (selectedState: {
-            view: DiagramView;
-            readonly: boolean;
-            showElementLinks: boolean;
-            showNavigationButtons: boolean;
-            showNotations: boolean;
-            fitViewEnabled: boolean;
-            fitViewPadding: number;
-            zoomable: boolean;
-            pannable: boolean;
-            nodesDraggable: boolean;
-            nodesSelectable: boolean;
-            experimentalEdgeEditing: boolean;
-            enableFocusMode: boolean;
-            renderIcon: ElementIconRenderer | null;
-            whereFilter: WhereOperator<string, string> | null;
-            enableDynamicViewWalkthrough: boolean;
-            xyflow: XYFlowInstance;
-            xystore: XYStoreApi;
-            getContainer: () => HTMLDivElement | null;
-            onChange: import('../LikeC4Diagram.props').OnChange | null;
-            onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-            onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-            onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-            onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-            onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-            onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onBurgerMenuClick: (() => void) | null;
-            onOpenSourceView: (() => void) | null;
-            onOpenSourceElement: ((fqn: Fqn) => void) | null;
-            onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-            readonly storeDevId: string;
-            xynodes: XYFlowNode[];
-            xyedges: {
-                id: string;
-                type: "relationship";
-                source: string;
-                target: string;
-                sourceHandle?: string | null;
-                targetHandle?: string | null;
-                animated?: boolean;
-                hidden?: boolean;
-                deletable?: boolean;
-                selectable?: boolean;
-                data: import('../xyflow/types').RelationshipData;
-                selected?: boolean;
-                markerStart?: import('@xyflow/react').EdgeMarkerType;
-                markerEnd?: import('@xyflow/react').EdgeMarkerType;
-                zIndex?: number;
-                ariaLabel?: string;
-                interactionWidth?: number;
-                label?: string | import('react').ReactNode;
-                labelStyle?: import('react').CSSProperties;
-                labelShowBg?: boolean;
-                labelBgStyle?: import('react').CSSProperties;
-                labelBgPadding?: [number, number];
-                labelBgBorderRadius?: number;
-                style?: import('react').CSSProperties;
-                className?: string;
-                reconnectable?: boolean | import('@xyflow/react').HandleType;
-                focusable?: boolean;
-            }[];
-            viewSyncDebounceTimeout: number | null;
-            viewportChanged: boolean;
-            initialized: boolean;
-            isDynamicView: boolean;
-            activeDynamicViewStep: number | null;
-            lastClickedNodeId: string | null;
-            lastClickedEdgeId: string | null;
-            focusedNodeId: string | null;
-            hoveredNodeId: string | null;
-            hoveredEdgeId: string | null;
-            dimmed: ReadonlySet<string>;
-            lastOnNavigate: null | {
-                fromView: ViewID;
-                toView: ViewID;
-                fromNode: NodeId;
-            };
-            navigationHistory: Array<{
-                viewId: ViewID;
-                nodeId: NodeId | null;
-            }>;
-            navigationHistoryIndex: number;
-            updateView: (view: DiagramView) => void;
-            focusOnNode: (nodeId: string) => void;
-            setHoveredNode: (nodeId: string | null) => void;
-            setHoveredEdge: (edgeId: string | null) => void;
-            setLastClickedNode: (nodeId: string | null) => void;
-            setLastClickedEdge: (edgeId: string | null) => void;
-            resetLastClicked: () => void;
-            getElement: (id: Fqn) => DiagramNode | null;
-            triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-            cancelSaveManualLayout: () => boolean;
-            scheduleSaveManualLayout: () => void;
-            triggerSaveManualLayout: () => void;
-            triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-            fitDiagram: (duration?: number) => void;
-            goBack: () => void;
-            goForward: () => void;
-            nextDynamicStep: (increment?: number) => void;
-            activateDynamicStep: (step: number) => void;
-            stopDynamicView: () => void;
-            onInit: (xyflow: XYFlowInstance) => void;
-            onNodesChange: OnNodesChange<XYFlowNode>;
-            onEdgesChange: OnEdgesChange<{
-                id: string;
-                type: "relationship";
-                source: string;
-                target: string;
-                sourceHandle?: string | null;
-                targetHandle?: string | null;
-                animated?: boolean;
-                hidden?: boolean;
-                deletable?: boolean;
-                selectable?: boolean;
-                data: import('../xyflow/types').RelationshipData;
-                selected?: boolean;
-                markerStart?: import('@xyflow/react').EdgeMarkerType;
-                markerEnd?: import('@xyflow/react').EdgeMarkerType;
-                zIndex?: number;
-                ariaLabel?: string;
-                interactionWidth?: number;
-                label?: string | import('react').ReactNode;
-                labelStyle?: import('react').CSSProperties;
-                labelShowBg?: boolean;
-                labelBgStyle?: import('react').CSSProperties;
-                labelBgPadding?: [number, number];
-                labelBgBorderRadius?: number;
-                style?: import('react').CSSProperties;
-                className?: string;
-                reconnectable?: boolean | import('@xyflow/react').HandleType;
-                focusable?: boolean;
-            }>;
-            highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-        }, previousSelectedState: {
-            view: DiagramView;
-            readonly: boolean;
-            showElementLinks: boolean;
-            showNavigationButtons: boolean;
-            showNotations: boolean;
-            fitViewEnabled: boolean;
-            fitViewPadding: number;
-            zoomable: boolean;
-            pannable: boolean;
-            nodesDraggable: boolean;
-            nodesSelectable: boolean;
-            experimentalEdgeEditing: boolean;
-            enableFocusMode: boolean;
-            renderIcon: ElementIconRenderer | null;
-            whereFilter: WhereOperator<string, string> | null;
-            enableDynamicViewWalkthrough: boolean;
-            xyflow: XYFlowInstance;
-            xystore: XYStoreApi;
-            getContainer: () => HTMLDivElement | null;
-            onChange: import('../LikeC4Diagram.props').OnChange | null;
-            onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-            onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-            onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-            onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-            onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-            onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onBurgerMenuClick: (() => void) | null;
-            onOpenSourceView: (() => void) | null;
-            onOpenSourceElement: ((fqn: Fqn) => void) | null;
-            onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-            readonly storeDevId: string;
-            xynodes: XYFlowNode[];
-            xyedges: {
-                id: string;
-                type: "relationship";
-                source: string;
-                target: string;
-                sourceHandle?: string | null;
-                targetHandle?: string | null;
-                animated?: boolean;
-                hidden?: boolean;
-                deletable?: boolean;
-                selectable?: boolean;
-                data: import('../xyflow/types').RelationshipData;
-                selected?: boolean;
-                markerStart?: import('@xyflow/react').EdgeMarkerType;
-                markerEnd?: import('@xyflow/react').EdgeMarkerType;
-                zIndex?: number;
-                ariaLabel?: string;
-                interactionWidth?: number;
-                label?: string | import('react').ReactNode;
-                labelStyle?: import('react').CSSProperties;
-                labelShowBg?: boolean;
-                labelBgStyle?: import('react').CSSProperties;
-                labelBgPadding?: [number, number];
-                labelBgBorderRadius?: number;
-                style?: import('react').CSSProperties;
-                className?: string;
-                reconnectable?: boolean | import('@xyflow/react').HandleType;
-                focusable?: boolean;
-            }[];
-            viewSyncDebounceTimeout: number | null;
-            viewportChanged: boolean;
-            initialized: boolean;
-            isDynamicView: boolean;
-            activeDynamicViewStep: number | null;
-            lastClickedNodeId: string | null;
-            lastClickedEdgeId: string | null;
-            focusedNodeId: string | null;
-            hoveredNodeId: string | null;
-            hoveredEdgeId: string | null;
-            dimmed: ReadonlySet<string>;
-            lastOnNavigate: null | {
-                fromView: ViewID;
-                toView: ViewID;
-                fromNode: NodeId;
-            };
-            navigationHistory: Array<{
-                viewId: ViewID;
-                nodeId: NodeId | null;
-            }>;
-            navigationHistoryIndex: number;
-            updateView: (view: DiagramView) => void;
-            focusOnNode: (nodeId: string) => void;
-            setHoveredNode: (nodeId: string | null) => void;
-            setHoveredEdge: (edgeId: string | null) => void;
-            setLastClickedNode: (nodeId: string | null) => void;
-            setLastClickedEdge: (edgeId: string | null) => void;
-            resetLastClicked: () => void;
-            getElement: (id: Fqn) => DiagramNode | null;
-            triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-            cancelSaveManualLayout: () => boolean;
-            scheduleSaveManualLayout: () => void;
-            triggerSaveManualLayout: () => void;
-            triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-            fitDiagram: (duration?: number) => void;
-            goBack: () => void;
-            goForward: () => void;
-            nextDynamicStep: (increment?: number) => void;
-            activateDynamicStep: (step: number) => void;
-            stopDynamicView: () => void;
-            onInit: (xyflow: XYFlowInstance) => void;
-            onNodesChange: OnNodesChange<XYFlowNode>;
-            onEdgesChange: OnEdgesChange<{
-                id: string;
-                type: "relationship";
-                source: string;
-                target: string;
-                sourceHandle?: string | null;
-                targetHandle?: string | null;
-                animated?: boolean;
-                hidden?: boolean;
-                deletable?: boolean;
-                selectable?: boolean;
-                data: import('../xyflow/types').RelationshipData;
-                selected?: boolean;
-                markerStart?: import('@xyflow/react').EdgeMarkerType;
-                markerEnd?: import('@xyflow/react').EdgeMarkerType;
-                zIndex?: number;
-                ariaLabel?: string;
-                interactionWidth?: number;
-                label?: string | import('react').ReactNode;
-                labelStyle?: import('react').CSSProperties;
-                labelShowBg?: boolean;
-                labelBgStyle?: import('react').CSSProperties;
-                labelBgPadding?: [number, number];
-                labelBgBorderRadius?: number;
-                style?: import('react').CSSProperties;
-                className?: string;
-                reconnectable?: boolean | import('@xyflow/react').HandleType;
-                focusable?: boolean;
-            }>;
-            highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-        }) => void): () => void;
-        <U>(selector: (state: {
-            view: DiagramView;
-            readonly: boolean;
-            showElementLinks: boolean;
-            showNavigationButtons: boolean;
-            showNotations: boolean;
-            fitViewEnabled: boolean;
-            fitViewPadding: number;
-            zoomable: boolean;
-            pannable: boolean;
-            nodesDraggable: boolean;
-            nodesSelectable: boolean;
-            experimentalEdgeEditing: boolean;
-            enableFocusMode: boolean;
-            renderIcon: ElementIconRenderer | null;
-            whereFilter: WhereOperator<string, string> | null;
-            enableDynamicViewWalkthrough: boolean;
-            xyflow: XYFlowInstance;
-            xystore: XYStoreApi;
-            getContainer: () => HTMLDivElement | null;
-            onChange: import('../LikeC4Diagram.props').OnChange | null;
-            onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-            onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-            onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-            onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-            onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-            onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-            onBurgerMenuClick: (() => void) | null;
-            onOpenSourceView: (() => void) | null;
-            onOpenSourceElement: ((fqn: Fqn) => void) | null;
-            onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-            readonly storeDevId: string;
-            xynodes: XYFlowNode[];
-            xyedges: {
-                id: string;
-                type: "relationship";
-                source: string;
-                target: string;
-                sourceHandle?: string | null;
-                targetHandle?: string | null;
-                animated?: boolean;
-                hidden?: boolean;
-                deletable?: boolean;
-                selectable?: boolean;
-                data: import('../xyflow/types').RelationshipData;
-                selected?: boolean;
-                markerStart?: import('@xyflow/react').EdgeMarkerType;
-                markerEnd?: import('@xyflow/react').EdgeMarkerType;
-                zIndex?: number;
-                ariaLabel?: string;
-                interactionWidth?: number;
-                label?: string | import('react').ReactNode;
-                labelStyle?: import('react').CSSProperties;
-                labelShowBg?: boolean;
-                labelBgStyle?: import('react').CSSProperties;
-                labelBgPadding?: [number, number];
-                labelBgBorderRadius?: number;
-                style?: import('react').CSSProperties;
-                className?: string;
-                reconnectable?: boolean | import('@xyflow/react').HandleType;
-                focusable?: boolean;
-            }[];
-            viewSyncDebounceTimeout: number | null;
-            viewportChanged: boolean;
-            initialized: boolean;
-            isDynamicView: boolean;
-            activeDynamicViewStep: number | null;
-            lastClickedNodeId: string | null;
-            lastClickedEdgeId: string | null;
-            focusedNodeId: string | null;
-            hoveredNodeId: string | null;
-            hoveredEdgeId: string | null;
-            dimmed: ReadonlySet<string>;
-            lastOnNavigate: null | {
-                fromView: ViewID;
-                toView: ViewID;
-                fromNode: NodeId;
-            };
-            navigationHistory: Array<{
-                viewId: ViewID;
-                nodeId: NodeId | null;
-            }>;
-            navigationHistoryIndex: number;
-            updateView: (view: DiagramView) => void;
-            focusOnNode: (nodeId: string) => void;
-            setHoveredNode: (nodeId: string | null) => void;
-            setHoveredEdge: (edgeId: string | null) => void;
-            setLastClickedNode: (nodeId: string | null) => void;
-            setLastClickedEdge: (edgeId: string | null) => void;
-            resetLastClicked: () => void;
-            getElement: (id: Fqn) => DiagramNode | null;
-            triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-            cancelSaveManualLayout: () => boolean;
-            scheduleSaveManualLayout: () => void;
-            triggerSaveManualLayout: () => void;
-            triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-            fitDiagram: (duration?: number) => void;
-            goBack: () => void;
-            goForward: () => void;
-            nextDynamicStep: (increment?: number) => void;
-            activateDynamicStep: (step: number) => void;
-            stopDynamicView: () => void;
-            onInit: (xyflow: XYFlowInstance) => void;
-            onNodesChange: OnNodesChange<XYFlowNode>;
-            onEdgesChange: OnEdgesChange<{
-                id: string;
-                type: "relationship";
-                source: string;
-                target: string;
-                sourceHandle?: string | null;
-                targetHandle?: string | null;
-                animated?: boolean;
-                hidden?: boolean;
-                deletable?: boolean;
-                selectable?: boolean;
-                data: import('../xyflow/types').RelationshipData;
-                selected?: boolean;
-                markerStart?: import('@xyflow/react').EdgeMarkerType;
-                markerEnd?: import('@xyflow/react').EdgeMarkerType;
-                zIndex?: number;
-                ariaLabel?: string;
-                interactionWidth?: number;
-                label?: string | import('react').ReactNode;
-                labelStyle?: import('react').CSSProperties;
-                labelShowBg?: boolean;
-                labelBgStyle?: import('react').CSSProperties;
-                labelBgPadding?: [number, number];
-                labelBgBorderRadius?: number;
-                style?: import('react').CSSProperties;
-                className?: string;
-                reconnectable?: boolean | import('@xyflow/react').HandleType;
-                focusable?: boolean;
-            }>;
-            highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-        }) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
-            equalityFn?: (a: U, b: U) => boolean;
-            fireImmediately?: boolean;
-        } | undefined): () => void;
-    };
-}, "setState"> & {
-    setState<A extends string | {
-        type: string;
-    }>(partial: {
-        view: DiagramView;
-        readonly: boolean;
-        showElementLinks: boolean;
-        showNavigationButtons: boolean;
-        showNotations: boolean;
-        fitViewEnabled: boolean;
-        fitViewPadding: number;
-        zoomable: boolean;
-        pannable: boolean;
-        nodesDraggable: boolean;
-        nodesSelectable: boolean;
-        experimentalEdgeEditing: boolean;
-        enableFocusMode: boolean;
-        renderIcon: ElementIconRenderer | null;
-        whereFilter: WhereOperator<string, string> | null;
-        enableDynamicViewWalkthrough: boolean;
-        xyflow: XYFlowInstance;
-        xystore: XYStoreApi;
-        getContainer: () => HTMLDivElement | null;
-        onChange: import('../LikeC4Diagram.props').OnChange | null;
-        onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-        onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onBurgerMenuClick: (() => void) | null;
-        onOpenSourceView: (() => void) | null;
-        onOpenSourceElement: ((fqn: Fqn) => void) | null;
-        onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-        readonly storeDevId: string;
-        xynodes: XYFlowNode[];
-        xyedges: {
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }[];
-        viewSyncDebounceTimeout: number | null;
-        viewportChanged: boolean;
-        initialized: boolean;
-        isDynamicView: boolean;
-        activeDynamicViewStep: number | null;
-        lastClickedNodeId: string | null;
-        lastClickedEdgeId: string | null;
-        focusedNodeId: string | null;
-        hoveredNodeId: string | null;
-        hoveredEdgeId: string | null;
-        dimmed: ReadonlySet<string>;
-        lastOnNavigate: null | {
-            fromView: ViewID;
-            toView: ViewID;
-            fromNode: NodeId;
-        };
-        navigationHistory: Array<{
-            viewId: ViewID;
-            nodeId: NodeId | null;
-        }>;
-        navigationHistoryIndex: number;
-        updateView: (view: DiagramView) => void;
-        focusOnNode: (nodeId: string) => void;
-        setHoveredNode: (nodeId: string | null) => void;
-        setHoveredEdge: (edgeId: string | null) => void;
-        setLastClickedNode: (nodeId: string | null) => void;
-        setLastClickedEdge: (edgeId: string | null) => void;
-        resetLastClicked: () => void;
-        getElement: (id: Fqn) => DiagramNode | null;
-        triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-        cancelSaveManualLayout: () => boolean;
-        scheduleSaveManualLayout: () => void;
-        triggerSaveManualLayout: () => void;
-        triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-        fitDiagram: (duration?: number) => void;
-        goBack: () => void;
-        goForward: () => void;
-        nextDynamicStep: (increment?: number) => void;
-        activateDynamicStep: (step: number) => void;
-        stopDynamicView: () => void;
-        onInit: (xyflow: XYFlowInstance) => void;
-        onNodesChange: OnNodesChange<XYFlowNode>;
-        onEdgesChange: OnEdgesChange<{
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }>;
-        highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-    } | Partial<{
-        view: DiagramView;
-        readonly: boolean;
-        showElementLinks: boolean;
-        showNavigationButtons: boolean;
-        showNotations: boolean;
-        fitViewEnabled: boolean;
-        fitViewPadding: number;
-        zoomable: boolean;
-        pannable: boolean;
-        nodesDraggable: boolean;
-        nodesSelectable: boolean;
-        experimentalEdgeEditing: boolean;
-        enableFocusMode: boolean;
-        renderIcon: ElementIconRenderer | null;
-        whereFilter: WhereOperator<string, string> | null;
-        enableDynamicViewWalkthrough: boolean;
-        xyflow: XYFlowInstance;
-        xystore: XYStoreApi;
-        getContainer: () => HTMLDivElement | null;
-        onChange: import('../LikeC4Diagram.props').OnChange | null;
-        onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-        onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onBurgerMenuClick: (() => void) | null;
-        onOpenSourceView: (() => void) | null;
-        onOpenSourceElement: ((fqn: Fqn) => void) | null;
-        onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-        readonly storeDevId: string;
-        xynodes: XYFlowNode[];
-        xyedges: {
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }[];
-        viewSyncDebounceTimeout: number | null;
-        viewportChanged: boolean;
-        initialized: boolean;
-        isDynamicView: boolean;
-        activeDynamicViewStep: number | null;
-        lastClickedNodeId: string | null;
-        lastClickedEdgeId: string | null;
-        focusedNodeId: string | null;
-        hoveredNodeId: string | null;
-        hoveredEdgeId: string | null;
-        dimmed: ReadonlySet<string>;
-        lastOnNavigate: null | {
-            fromView: ViewID;
-            toView: ViewID;
-            fromNode: NodeId;
-        };
-        navigationHistory: Array<{
-            viewId: ViewID;
-            nodeId: NodeId | null;
-        }>;
-        navigationHistoryIndex: number;
-        updateView: (view: DiagramView) => void;
-        focusOnNode: (nodeId: string) => void;
-        setHoveredNode: (nodeId: string | null) => void;
-        setHoveredEdge: (edgeId: string | null) => void;
-        setLastClickedNode: (nodeId: string | null) => void;
-        setLastClickedEdge: (edgeId: string | null) => void;
-        resetLastClicked: () => void;
-        getElement: (id: Fqn) => DiagramNode | null;
-        triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-        cancelSaveManualLayout: () => boolean;
-        scheduleSaveManualLayout: () => void;
-        triggerSaveManualLayout: () => void;
-        triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-        fitDiagram: (duration?: number) => void;
-        goBack: () => void;
-        goForward: () => void;
-        nextDynamicStep: (increment?: number) => void;
-        activateDynamicStep: (step: number) => void;
-        stopDynamicView: () => void;
-        onInit: (xyflow: XYFlowInstance) => void;
-        onNodesChange: OnNodesChange<XYFlowNode>;
-        onEdgesChange: OnEdgesChange<{
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }>;
-        highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-    }> | ((state: {
-        view: DiagramView;
-        readonly: boolean;
-        showElementLinks: boolean;
-        showNavigationButtons: boolean;
-        showNotations: boolean;
-        fitViewEnabled: boolean;
-        fitViewPadding: number;
-        zoomable: boolean;
-        pannable: boolean;
-        nodesDraggable: boolean;
-        nodesSelectable: boolean;
-        experimentalEdgeEditing: boolean;
-        enableFocusMode: boolean;
-        renderIcon: ElementIconRenderer | null;
-        whereFilter: WhereOperator<string, string> | null;
-        enableDynamicViewWalkthrough: boolean;
-        xyflow: XYFlowInstance;
-        xystore: XYStoreApi;
-        getContainer: () => HTMLDivElement | null;
-        onChange: import('../LikeC4Diagram.props').OnChange | null;
-        onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-        onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onBurgerMenuClick: (() => void) | null;
-        onOpenSourceView: (() => void) | null;
-        onOpenSourceElement: ((fqn: Fqn) => void) | null;
-        onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-        readonly storeDevId: string;
-        xynodes: XYFlowNode[];
-        xyedges: {
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }[];
-        viewSyncDebounceTimeout: number | null;
-        viewportChanged: boolean;
-        initialized: boolean;
-        isDynamicView: boolean;
-        activeDynamicViewStep: number | null;
-        lastClickedNodeId: string | null;
-        lastClickedEdgeId: string | null;
-        focusedNodeId: string | null;
-        hoveredNodeId: string | null;
-        hoveredEdgeId: string | null;
-        dimmed: ReadonlySet<string>;
-        lastOnNavigate: null | {
-            fromView: ViewID;
-            toView: ViewID;
-            fromNode: NodeId;
-        };
-        navigationHistory: Array<{
-            viewId: ViewID;
-            nodeId: NodeId | null;
-        }>;
-        navigationHistoryIndex: number;
-        updateView: (view: DiagramView) => void;
-        focusOnNode: (nodeId: string) => void;
-        setHoveredNode: (nodeId: string | null) => void;
-        setHoveredEdge: (edgeId: string | null) => void;
-        setLastClickedNode: (nodeId: string | null) => void;
-        setLastClickedEdge: (edgeId: string | null) => void;
-        resetLastClicked: () => void;
-        getElement: (id: Fqn) => DiagramNode | null;
-        triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-        cancelSaveManualLayout: () => boolean;
-        scheduleSaveManualLayout: () => void;
-        triggerSaveManualLayout: () => void;
-        triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-        fitDiagram: (duration?: number) => void;
-        goBack: () => void;
-        goForward: () => void;
-        nextDynamicStep: (increment?: number) => void;
-        activateDynamicStep: (step: number) => void;
-        stopDynamicView: () => void;
-        onInit: (xyflow: XYFlowInstance) => void;
-        onNodesChange: OnNodesChange<XYFlowNode>;
-        onEdgesChange: OnEdgesChange<{
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }>;
-        highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-    }) => {
-        view: DiagramView;
-        readonly: boolean;
-        showElementLinks: boolean;
-        showNavigationButtons: boolean;
-        showNotations: boolean;
-        fitViewEnabled: boolean;
-        fitViewPadding: number;
-        zoomable: boolean;
-        pannable: boolean;
-        nodesDraggable: boolean;
-        nodesSelectable: boolean;
-        experimentalEdgeEditing: boolean;
-        enableFocusMode: boolean;
-        renderIcon: ElementIconRenderer | null;
-        whereFilter: WhereOperator<string, string> | null;
-        enableDynamicViewWalkthrough: boolean;
-        xyflow: XYFlowInstance;
-        xystore: XYStoreApi;
-        getContainer: () => HTMLDivElement | null;
-        onChange: import('../LikeC4Diagram.props').OnChange | null;
-        onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-        onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onBurgerMenuClick: (() => void) | null;
-        onOpenSourceView: (() => void) | null;
-        onOpenSourceElement: ((fqn: Fqn) => void) | null;
-        onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-        readonly storeDevId: string;
-        xynodes: XYFlowNode[];
-        xyedges: {
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }[];
-        viewSyncDebounceTimeout: number | null;
-        viewportChanged: boolean;
-        initialized: boolean;
-        isDynamicView: boolean;
-        activeDynamicViewStep: number | null;
-        lastClickedNodeId: string | null;
-        lastClickedEdgeId: string | null;
-        focusedNodeId: string | null;
-        hoveredNodeId: string | null;
-        hoveredEdgeId: string | null;
-        dimmed: ReadonlySet<string>;
-        lastOnNavigate: null | {
-            fromView: ViewID;
-            toView: ViewID;
-            fromNode: NodeId;
-        };
-        navigationHistory: Array<{
-            viewId: ViewID;
-            nodeId: NodeId | null;
-        }>;
-        navigationHistoryIndex: number;
-        updateView: (view: DiagramView) => void;
-        focusOnNode: (nodeId: string) => void;
-        setHoveredNode: (nodeId: string | null) => void;
-        setHoveredEdge: (edgeId: string | null) => void;
-        setLastClickedNode: (nodeId: string | null) => void;
-        setLastClickedEdge: (edgeId: string | null) => void;
-        resetLastClicked: () => void;
-        getElement: (id: Fqn) => DiagramNode | null;
-        triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-        cancelSaveManualLayout: () => boolean;
-        scheduleSaveManualLayout: () => void;
-        triggerSaveManualLayout: () => void;
-        triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-        fitDiagram: (duration?: number) => void;
-        goBack: () => void;
-        goForward: () => void;
-        nextDynamicStep: (increment?: number) => void;
-        activateDynamicStep: (step: number) => void;
-        stopDynamicView: () => void;
-        onInit: (xyflow: XYFlowInstance) => void;
-        onNodesChange: OnNodesChange<XYFlowNode>;
-        onEdgesChange: OnEdgesChange<{
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }>;
-        highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-    } | Partial<{
-        view: DiagramView;
-        readonly: boolean;
-        showElementLinks: boolean;
-        showNavigationButtons: boolean;
-        showNotations: boolean;
-        fitViewEnabled: boolean;
-        fitViewPadding: number;
-        zoomable: boolean;
-        pannable: boolean;
-        nodesDraggable: boolean;
-        nodesSelectable: boolean;
-        experimentalEdgeEditing: boolean;
-        enableFocusMode: boolean;
-        renderIcon: ElementIconRenderer | null;
-        whereFilter: WhereOperator<string, string> | null;
-        enableDynamicViewWalkthrough: boolean;
-        xyflow: XYFlowInstance;
-        xystore: XYStoreApi;
-        getContainer: () => HTMLDivElement | null;
-        onChange: import('../LikeC4Diagram.props').OnChange | null;
-        onNavigateTo: import('../LikeC4Diagram.props').OnNavigateTo | null;
-        onNodeClick: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onNodeContextMenu: import('../LikeC4Diagram.props').OnNodeClick | null;
-        onCanvasContextMenu: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onEdgeClick: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onEdgeContextMenu: import('../LikeC4Diagram.props').OnEdgeClick | null;
-        onCanvasClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onCanvasDblClick: import('../LikeC4Diagram.props').OnCanvasClick | null;
-        onBurgerMenuClick: (() => void) | null;
-        onOpenSourceView: (() => void) | null;
-        onOpenSourceElement: ((fqn: Fqn) => void) | null;
-        onOpenSourceRelation: ((id: import('@likec4/core').RelationID) => void) | null;
-        readonly storeDevId: string;
-        xynodes: XYFlowNode[];
-        xyedges: {
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }[];
-        viewSyncDebounceTimeout: number | null;
-        viewportChanged: boolean;
-        initialized: boolean;
-        isDynamicView: boolean;
-        activeDynamicViewStep: number | null;
-        lastClickedNodeId: string | null;
-        lastClickedEdgeId: string | null;
-        focusedNodeId: string | null;
-        hoveredNodeId: string | null;
-        hoveredEdgeId: string | null;
-        dimmed: ReadonlySet<string>;
-        lastOnNavigate: null | {
-            fromView: ViewID;
-            toView: ViewID;
-            fromNode: NodeId;
-        };
-        navigationHistory: Array<{
-            viewId: ViewID;
-            nodeId: NodeId | null;
-        }>;
-        navigationHistoryIndex: number;
-        updateView: (view: DiagramView) => void;
-        focusOnNode: (nodeId: string) => void;
-        setHoveredNode: (nodeId: string | null) => void;
-        setHoveredEdge: (edgeId: string | null) => void;
-        setLastClickedNode: (nodeId: string | null) => void;
-        setLastClickedEdge: (edgeId: string | null) => void;
-        resetLastClicked: () => void;
-        getElement: (id: Fqn) => DiagramNode | null;
-        triggerChangeElementStyle: (change: ViewChange.ChangeElementStyle) => void;
-        cancelSaveManualLayout: () => boolean;
-        scheduleSaveManualLayout: () => void;
-        triggerSaveManualLayout: () => void;
-        triggerOnNavigateTo: (xynodeId: string, event: ReactMouseEvent) => void;
-        fitDiagram: (duration?: number) => void;
-        goBack: () => void;
-        goForward: () => void;
-        nextDynamicStep: (increment?: number) => void;
-        activateDynamicStep: (step: number) => void;
-        stopDynamicView: () => void;
-        onInit: (xyflow: XYFlowInstance) => void;
-        onNodesChange: OnNodesChange<XYFlowNode>;
-        onEdgesChange: OnEdgesChange<{
-            id: string;
-            type: "relationship";
-            source: string;
-            target: string;
-            sourceHandle?: string | null;
-            targetHandle?: string | null;
-            animated?: boolean;
-            hidden?: boolean;
-            deletable?: boolean;
-            selectable?: boolean;
-            data: import('../xyflow/types').RelationshipData;
-            selected?: boolean;
-            markerStart?: import('@xyflow/react').EdgeMarkerType;
-            markerEnd?: import('@xyflow/react').EdgeMarkerType;
-            zIndex?: number;
-            ariaLabel?: string;
-            interactionWidth?: number;
-            label?: string | import('react').ReactNode;
-            labelStyle?: import('react').CSSProperties;
-            labelShowBg?: boolean;
-            labelBgStyle?: import('react').CSSProperties;
-            labelBgPadding?: [number, number];
-            labelBgBorderRadius?: number;
-            style?: import('react').CSSProperties;
-            className?: string;
-            reconnectable?: boolean | import('@xyflow/react').HandleType;
-            focusable?: boolean;
-        }>;
-        highlightByElementNotation: (notation: ElementNotation, onlyOfKind?: ElementKind) => void;
-    }>), replace?: boolean | undefined, action?: A | undefined): void;
-}>;
-export type DiagramZustandStore = ReturnType<typeof createDiagramStore>;
-export type DiagramStoreApi = Readonly<Pick<DiagramZustandStore, 'getState' | 'setState' | 'subscribe'>>;
-export {};