@likec4/diagram 1.41.0 → 1.42.0

package/dist/overlays/relationships-browser/actor.d.ts

@@ -1,13 +1,14 @@
-import { BBox, Fqn, ViewId, NonEmptyArray, RelationId, Color, RelationshipLineType } from '@likec4/core';
-import { EdgeChange, NodeChange, ReactFlowInstance, useStoreApi, GeneralHelpers, ViewportHelperFunctions, ReactFlowState } from '@xyflow/react';
+import { BBox, Fqn, ViewId } from '@likec4/core';
+import { EdgeChange, NodeChange, ReactFlowInstance, ReactFlowState, GeneralHelpers, ViewportHelperFunctions } from '@xyflow/react';
 import { ActorLogicFrom, ActorRefFromLogic, SnapshotFrom, PromiseActorLogic, EventObject, StateMachine, Values, NonReducibleUnknown, MetaObject, ConditionalRequired, InputFrom, RequiredActorOptions, IsNotNever, GetConcreteByKey, AnyActorLogic, RequiredLogicInput, ActorRef, MachineSnapshot, AnyActorRef, StateValue, AnyEventObject, ActionFunction, CancelAction, DoneActorEvent } from 'xstate';
-import { Base } from '../../base';
 import { RelationshipsBrowserTypes } from './_types';
 import { LayoutRelationshipsViewResult } from './layout';
-import { EdgeMarkerType, HandleType } from '@xyflow/system';
-import { ReactNode, CSSProperties, AriaRole, SVGAttributes } from 'react';
-type XYFLowInstance = ReactFlowInstance<RelationshipsBrowserTypes.Node, RelationshipsBrowserTypes.Edge>;
-export type XYStoreApi = ReturnType<typeof useStoreApi<RelationshipsBrowserTypes.Node, RelationshipsBrowserTypes.Edge>>;
+type XYFLowInstance = ReactFlowInstance<RelationshipsBrowserTypes.AnyNode, RelationshipsBrowserTypes.Edge>;
+type XYStoreState = ReactFlowState<RelationshipsBrowserTypes.AnyNode, RelationshipsBrowserTypes.Edge>;
+type XYStoreApi = {
+    getState: () => XYStoreState;
+    setState: (state: XYStoreState) => void;
+};
 export declare const layouter: PromiseActorLogic<{
     xyedges: RelationshipsBrowserTypes.Edge[];
     xynodes: RelationshipsBrowserTypes.Node[];
@@ -102,7 +103,7 @@ export type Events = {
 } | {
     type: 'close';
 };
-export declare const relationshipsBrowserLogic: StateMachine<Context, Events, {
+declare const _relationshipsBrowserLogic: StateMachine<Context, Events, {
     layouter?: ActorRefFromLogic< PromiseActorLogic<{
         xyedges: RelationshipsBrowserTypes.Edge[];
         xynodes: RelationshipsBrowserTypes.Node[];
@@ -176,49 +177,7 @@ export declare const relationshipsBrowserLogic: StateMachine<Context, Events, {
             <TSrc extends "layouter">(logic: TSrc, ...[options]: {
                 src: "layouter";
                 logic: PromiseActorLogic<{
-                    xyedges: {
-                        id: string;
-                        source: string;
-                        target: string;
-                        sourceHandle?: string | null;
-                        targetHandle?: string | null;
-                        animated?: boolean;
-                        hidden?: boolean;
-                        deletable?: boolean;
-                        selectable?: boolean;
-                        selected?: boolean;
-                        markerStart?: EdgeMarkerType;
-                        markerEnd?: EdgeMarkerType;
-                        zIndex?: number;
-                        ariaLabel?: string;
-                        interactionWidth?: number;
-                        label?: ReactNode;
-                        labelStyle?: CSSProperties;
-                        labelShowBg?: boolean;
-                        labelBgStyle?: CSSProperties;
-                        labelBgPadding?: [number, number];
-                        labelBgBorderRadius?: number;
-                        style?: CSSProperties;
-                        className?: string;
-                        reconnectable?: boolean | HandleType;
-                        focusable?: boolean;
-                        ariaRole?: AriaRole;
-                        domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                        type: "relationship";
-                        data: {
-                            hovered?: boolean;
-                            active?: boolean;
-                            dimmed?: Base.Dimmed;
-                            sourceFqn: Fqn;
-                            targetFqn: Fqn;
-                            relations: NonEmptyArray<RelationId>;
-                            color: Color | undefined;
-                            label: string | null;
-                            navigateTo: ViewId | null;
-                            line: RelationshipLineType;
-                            existsInCurrentView: boolean;
-                        };
-                    }[];
+                    xyedges: RelationshipsBrowserTypes.Edge[];
                     xynodes: RelationshipsBrowserTypes.Node[];
                 }, {
                     subjectId: Fqn;
@@ -231,49 +190,7 @@ export declare const relationshipsBrowserLogic: StateMachine<Context, Events, {
             } extends infer T ? T extends {
                 src: "layouter";
                 logic: PromiseActorLogic<{
-                    xyedges: {
-                        id: string;
-                        source: string;
-                        target: string;
-                        sourceHandle?: string | null;
-                        targetHandle?: string | null;
-                        animated?: boolean;
-                        hidden?: boolean;
-                        deletable?: boolean;
-                        selectable?: boolean;
-                        selected?: boolean;
-                        markerStart?: EdgeMarkerType;
-                        markerEnd?: EdgeMarkerType;
-                        zIndex?: number;
-                        ariaLabel?: string;
-                        interactionWidth?: number;
-                        label?: ReactNode;
-                        labelStyle?: CSSProperties;
-                        labelShowBg?: boolean;
-                        labelBgStyle?: CSSProperties;
-                        labelBgPadding?: [number, number];
-                        labelBgBorderRadius?: number;
-                        style?: CSSProperties;
-                        className?: string;
-                        reconnectable?: boolean | HandleType;
-                        focusable?: boolean;
-                        ariaRole?: AriaRole;
-                        domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                        type: "relationship";
-                        data: {
-                            hovered?: boolean;
-                            active?: boolean;
-                            dimmed?: Base.Dimmed;
-                            sourceFqn: Fqn;
-                            targetFqn: Fqn;
-                            relations: NonEmptyArray<RelationId>;
-                            color: Color | undefined;
-                            label: string | null;
-                            navigateTo: ViewId | null;
-                            line: RelationshipLineType;
-                            existsInCurrentView: boolean;
-                        };
-                    }[];
+                    xyedges: RelationshipsBrowserTypes.Edge[];
                     xynodes: RelationshipsBrowserTypes.Node[];
                 }, {
                     subjectId: Fqn;
@@ -293,49 +210,7 @@ export declare const relationshipsBrowserLogic: StateMachine<Context, Events, {
             } & { [K in RequiredActorOptions<T>]: unknown; }], IsNotNever<RequiredActorOptions<T>>> : never : never : never): ActorRefFromLogic< GetConcreteByKey<{
                 src: "layouter";
                 logic: PromiseActorLogic<{
-                    xyedges: {
-                        id: string;
-                        source: string;
-                        target: string;
-                        sourceHandle?: string | null;
-                        targetHandle?: string | null;
-                        animated?: boolean;
-                        hidden?: boolean;
-                        deletable?: boolean;
-                        selectable?: boolean;
-                        selected?: boolean;
-                        markerStart?: EdgeMarkerType;
-                        markerEnd?: EdgeMarkerType;
-                        zIndex?: number;
-                        ariaLabel?: string;
-                        interactionWidth?: number;
-                        label?: ReactNode;
-                        labelStyle?: CSSProperties;
-                        labelShowBg?: boolean;
-                        labelBgStyle?: CSSProperties;
-                        labelBgPadding?: [number, number];
-                        labelBgBorderRadius?: number;
-                        style?: CSSProperties;
-                        className?: string;
-                        reconnectable?: boolean | HandleType;
-                        focusable?: boolean;
-                        ariaRole?: AriaRole;
-                        domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                        type: "relationship";
-                        data: {
-                            hovered?: boolean;
-                            active?: boolean;
-                            dimmed?: Base.Dimmed;
-                            sourceFqn: Fqn;
-                            targetFqn: Fqn;
-                            relations: NonEmptyArray<RelationId>;
-                            color: Color | undefined;
-                            label: string | null;
-                            navigateTo: ViewId | null;
-                            line: RelationshipLineType;
-                            existsInCurrentView: boolean;
-                        };
-                    }[];
+                    xyedges: RelationshipsBrowserTypes.Edge[];
                     xynodes: RelationshipsBrowserTypes.Node[];
                 }, {
                     subjectId: Fqn;
@@ -780,392 +655,10 @@ export declare const relationshipsBrowserLogic: StateMachine<Context, Events, {
                         }) => {
                             subjectId: Fqn;
                             navigateFromNode: string | null;
-                            xyflow: GeneralHelpers<RelationshipsBrowserTypes.Node, {
-                                id: string;
-                                source: string;
-                                target: string;
-                                sourceHandle?: string | null;
-                                targetHandle?: string | null;
-                                animated?: boolean;
-                                hidden?: boolean;
-                                deletable?: boolean;
-                                selectable?: boolean;
-                                selected?: boolean;
-                                markerStart?: EdgeMarkerType;
-                                markerEnd?: EdgeMarkerType;
-                                zIndex?: number;
-                                ariaLabel?: string;
-                                interactionWidth?: number;
-                                label?: ReactNode;
-                                labelStyle?: CSSProperties;
-                                labelShowBg?: boolean;
-                                labelBgStyle?: CSSProperties;
-                                labelBgPadding?: [number, number];
-                                labelBgBorderRadius?: number;
-                                style?: CSSProperties;
-                                className?: string;
-                                reconnectable?: boolean | HandleType;
-                                focusable?: boolean;
-                                ariaRole?: AriaRole;
-                                domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                type: "relationship";
-                                data: {
-                                    hovered?: boolean;
-                                    active?: boolean;
-                                    dimmed?: Base.Dimmed;
-                                    sourceFqn: Fqn;
-                                    targetFqn: Fqn;
-                                    relations: NonEmptyArray<RelationId>;
-                                    color: Color | undefined;
-                                    label: string | null;
-                                    navigateTo: ViewId | null;
-                                    line: RelationshipLineType;
-                                    existsInCurrentView: boolean;
-                                };
-                            }> & ViewportHelperFunctions & {
+                            xyflow: GeneralHelpers<RelationshipsBrowserTypes.AnyNode, RelationshipsBrowserTypes.Edge> & ViewportHelperFunctions & {
                                 viewportInitialized: boolean;
                             };
-                            xystore: {
-                                getState: () => ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }>;
-                                setState: (partial: ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }> | Partial< ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }>> | ((state: ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }>) => ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }> | Partial< ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }>>), replace?: boolean | undefined) => void;
-                                subscribe: (listener: (state: ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }>, prevState: ReactFlowState<RelationshipsBrowserTypes.Node, {
-                                    id: string;
-                                    source: string;
-                                    target: string;
-                                    sourceHandle?: string | null;
-                                    targetHandle?: string | null;
-                                    animated?: boolean;
-                                    hidden?: boolean;
-                                    deletable?: boolean;
-                                    selectable?: boolean;
-                                    selected?: boolean;
-                                    markerStart?: EdgeMarkerType;
-                                    markerEnd?: EdgeMarkerType;
-                                    zIndex?: number;
-                                    ariaLabel?: string;
-                                    interactionWidth?: number;
-                                    label?: ReactNode;
-                                    labelStyle?: CSSProperties;
-                                    labelShowBg?: boolean;
-                                    labelBgStyle?: CSSProperties;
-                                    labelBgPadding?: [number, number];
-                                    labelBgBorderRadius?: number;
-                                    style?: CSSProperties;
-                                    className?: string;
-                                    reconnectable?: boolean | HandleType;
-                                    focusable?: boolean;
-                                    ariaRole?: AriaRole;
-                                    domAttributes?: Omit< SVGAttributes<SVGGElement>, "id" | "style" | "className" | "role" | "aria-label" | "dangerouslySetInnerHTML">;
-                                    type: "relationship";
-                                    data: {
-                                        hovered?: boolean;
-                                        active?: boolean;
-                                        dimmed?: Base.Dimmed;
-                                        sourceFqn: Fqn;
-                                        targetFqn: Fqn;
-                                        relations: NonEmptyArray<RelationId>;
-                                        color: Color | undefined;
-                                        label: string | null;
-                                        navigateTo: ViewId | null;
-                                        line: RelationshipLineType;
-                                        existsInCurrentView: boolean;
-                                    };
-                                }>) => void) => () => void;
-                            };
+                            xystore: XYStoreApi;
                             update: LayoutRelationshipsViewResult;
                         };
                         readonly onDone: {
@@ -1277,9 +770,10 @@ export declare const relationshipsBrowserLogic: StateMachine<Context, Events, {
         id: "layouter";
     }, never, never, never, never>;
 }>;
-export interface RelationshipsBrowserLogic extends ActorLogicFrom<typeof relationshipsBrowserLogic> {
+export interface RelationshipsBrowserLogic extends ActorLogicFrom<typeof _relationshipsBrowserLogic> {
 }
+export declare const relationshipsBrowserLogic: RelationshipsBrowserLogic;
 export interface RelationshipsBrowserActorRef extends ActorRefFromLogic<RelationshipsBrowserLogic> {
 }
-export type RelationshipsBrowserSnapshot = SnapshotFrom<RelationshipsBrowserActorRef>;
+export type RelationshipsBrowserSnapshot = SnapshotFrom<RelationshipsBrowserLogic>;
 export {};

package/dist/overlays/relationships-browser/actor.js

@@ -6,7 +6,7 @@ import { setup, assign, fromPromise, assertEvent, enqueueActions, cancel, raise
 import { MinZoom, ZIndexes } from '../../base/const.js';
 import { updateEdges } from '../../base/updateEdges.js';
 import { updateNodes } from '../../base/updateNodes.js';
-import { typedSystem } from '../../state/utils.js';
+import { typedSystem } from '../../likec4diagram/state/utils.js';
 import { ViewPadding } from './const.js';
 import { viewToNodesEdge } from './useViewToNodesEdges.js';
 import { Base } from '../../base/types.js';
@@ -112,7 +112,7 @@ const layouter = fromPromise(async ({ input, self, signal }) => {
   await xyflow.setCenter(nextSubjectCenter.x, nextSubjectCenter.y, { zoom });
   return updateXYData();
 });
-const relationshipsBrowserLogic = setup({
+const _relationshipsBrowserLogic = setup({
   types: {
     context: {},
     tags: "",
@@ -176,14 +176,14 @@ const relationshipsBrowserLogic = setup({
       if (bounds) {
         const { width, height } = xystore.getState();
         const viewport = getViewportForBounds(bounds, width, height, MinZoom, maxZoom, ViewPadding);
-        xyflow.setViewport(viewport, duration > 0 ? { duration } : void 0);
+        xyflow.setViewport(viewport, duration > 0 ? { duration } : void 0).catch(console.error);
       } else {
         xyflow.fitView({
           minZoom: MinZoom,
           maxZoom,
           padding: ViewPadding,
           ...duration > 0 && { duration }
-        });
+        }).catch(console.error);
       }
     },
     "xyflow.applyNodeChanges": assign(({ context, event }) => {
@@ -445,5 +445,6 @@ const relationshipsBrowserLogic = setup({
     xynodes: []
   })
 });
+const relationshipsBrowserLogic = _relationshipsBrowserLogic;
 
 export { layouter, relationshipsBrowserLogic };

package/dist/overlays/relationships-browser/const.d.ts

@@ -1,2 +1,6 @@
-import { Padding } from '@xyflow/system';
-export declare const ViewPadding: Padding;
+export declare const ViewPadding: {
+    readonly top: "40px";
+    readonly bottom: "16px";
+    readonly left: "16px";
+    readonly right: "16px";
+};

package/dist/overlays/relationships-browser/custom/ElementActions.d.ts

@@ -1,5 +1,2 @@
-import { NodeProps } from '../../../base/types';
 import { RelationshipsBrowserTypes as Types } from '../_types';
-type ElementActionsProps = NodeProps<Types.ElementNodeData>;
-export declare const ElementActions: (props: ElementActionsProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const ElementActions: (props: Types.NodeProps<"element">) => import("react/jsx-runtime").JSX.Element;