likec4 1.57.0 → 1.59.0

package/react/index.d.mts

@@ -2,13 +2,15 @@ import { Any } from '@likec4/core/types';
 import { AutoLayoutDirection } from '@likec4/core/types';
 import { aux } from '@likec4/core/types';
 import { BBox } from '@likec4/core/types';
-import { BBox as BBox_2 } from '@likec4/core/geometry';
-import { BBox as BBox_3 } from '@likec4/core';
+import { BBox as BBox_2 } from '@likec4/core';
+import { BBox as BBox_3 } from '@likec4/core/geometry';
 import { CamelCasedProperties } from 'type-fest';
 import { Color } from '@likec4/core/types';
+import { ComponentType } from 'react';
 import { ComputedNodeStyle } from '@likec4/core/types';
 import { ComputedNodeStyle as ComputedNodeStyle_2 } from '@likec4/core';
-import { Context as Context_4 } from 'react';
+import { Context as Context_5 } from 'react';
+import { ControlButton } from '@xyflow/react';
 import { CSSProperties } from 'react';
 import { DependencyList } from 'react';
 import { DeploymentFqn } from '@likec4/core/types';
@@ -18,17 +20,19 @@ import { DiagramNode } from '@likec4/core/types';
 import { DiagramNodeDriftReason } from '@likec4/core/types';
 import { DiagramView } from '@likec4/core/types';
 import { DynamicViewDisplayVariant } from '@likec4/core/types';
+import { DynamicViewFlow } from '@likec4/core/types';
 import { Edge } from '@xyflow/react';
-import { EdgeChange } from '@xyflow/system';
-import { EdgeChange as EdgeChange_2 } from '@xyflow/react';
-import { EdgeId } from '@likec4/core/types';
-import { EdgeId as EdgeId_2 } from '@likec4/core';
+import { EdgeChange } from '@xyflow/react';
+import { EdgeChange as EdgeChange_2 } from '@xyflow/system';
+import { EdgeId } from '@likec4/core';
+import { EdgeId as EdgeId_2 } from '@likec4/core/types';
 import { EdgeProps } from '@xyflow/react';
 import { EffectCallback } from 'react';
 import { ElementKind } from '@likec4/core/types';
 import { ElementProps } from '@mantine/core';
 import { ElementShape as ElementShape_2 } from '@likec4/core/types';
 import { ElementStyle } from '@likec4/core/types';
+import { ErrorInfo } from 'react';
 import { Except } from 'type-fest';
 import { ExclusiveUnion } from '@likec4/core/types';
 import { ExclusiveUnion as ExclusiveUnion_2 } from '@likec4/core';
@@ -41,8 +45,9 @@ import { FunctionComponent } from 'react';
 import { HTMLAttributes } from 'react';
 import { HTMLMotionProps } from 'motion/react';
 import { IconUrl } from '@likec4/core/types';
-import { JSX } from 'react/jsx-runtime';
-import { JsxStyleProps } from '@likec4/styles/types';
+import { JSX } from 'react';
+import { JSX as JSX_2 } from 'react/jsx-runtime';
+import { JsxStyleProps } from '../../styled-system/types';
 import { LayoutedProjectsView } from '@likec4/core/compute-view';
 import { LayoutedView } from '@likec4/core/types';
 import { LayoutType } from '@likec4/core/types';
@@ -50,27 +55,33 @@ import { LikeC4Model } from '@likec4/core/model';
 import { LikeC4Project } from '@likec4/core/types';
 import { LikeC4Styles } from '@likec4/core/styles';
 import { LikeC4ViewModel } from '@likec4/core/model';
+import { MantineProviderProps } from '@mantine/core';
 import { MarkdownOrString } from '@likec4/core/types';
 import { MarkdownOrString as MarkdownOrString_2 } from '@likec4/core';
 import { MemoExoticComponent } from 'react';
+import { MiniMapNodeProps } from '@xyflow/react';
+import { MiniMapProps } from '@xyflow/react';
 import { MotionNodeLayoutOptions } from 'motion/react';
 import { MotionStyle } from 'motion/react';
 import { MouseEvent as MouseEvent_2 } from 'react';
-import { NavigationPanelRecipe } from '@likec4/styles/recipes';
+import { NavigationPanelRecipe } from '../../styled-system/recipes';
 import { Node as Node_2 } from '@xyflow/react';
-import { NodeChange } from '@xyflow/system';
-import { NodeChange as NodeChange_2 } from '@xyflow/react';
+import { NodeChange } from '@xyflow/react';
+import { NodeChange as NodeChange_2 } from '@xyflow/system';
 import { NodeId } from '@likec4/core/types';
 import { NodeId as NodeId_3 } from '@likec4/core';
 import { NodeModel } from '@likec4/core/model';
 import { NodeNotation } from '@likec4/core/types';
 import { NodeProps } from '@xyflow/react';
+import { NodeToolbar } from '@xyflow/react';
 import { NodeToolbarProps } from '@xyflow/react';
 import { NonEmptyArray } from '@likec4/core/types';
 import { NonEmptyObject } from 'type-fest';
 import { NonEmptyReadonlyArray } from '@likec4/core/types';
 import { OptionalKeysOf } from 'type-fest';
+import { PanelPosition } from '@xyflow/system';
 import { PartialDeep } from 'type-fest';
+import { Position } from '@xyflow/react';
 import { ProjectId } from '@likec4/core/types';
 import { ProjectId as ProjectId_2 } from '@likec4/core';
 import { PropsWithChildren } from 'react';
@@ -88,9 +99,9 @@ import { RichTextOrEmpty } from '@likec4/core/types';
 import { SetRequired } from 'type-fest';
 import { Simplify } from 'type-fest';
 import { SimplifyDeep } from 'type-fest';
-import { StepEdgeId } from '@likec4/core/types';
-import { StyleContextConsumer } from '@likec4/styles/jsx';
-import { StyleContextProvider } from '@likec4/styles/jsx';
+import { StepPath } from '@likec4/core/types';
+import { StyleContextConsumer } from '../../styled-system/jsx';
+import { StyleContextProvider } from '../../styled-system/jsx';
 import type * as t from '@likec4/core/types';
 import { UnknownLayouted as UnknownLayouted_2 } from '@likec4/core/types';
 import { UnstyledButtonProps } from '@mantine/core';
@@ -98,6 +109,7 @@ import { ViewChange } from '@likec4/core/types';
 import { ViewId } from '@likec4/core/types';
 import { ViewId as ViewId_3 } from '@likec4/core';
 import { Viewport } from '@xyflow/system';
+import { ViewportPortal } from '@xyflow/react';
 import { WhereOperator } from '@likec4/core/types';
 import { Without } from 'type-fest/source/merge-exclusive';
 import { XYPosition } from '@xyflow/system';
@@ -351,6 +363,39 @@ in TInput = NonReducibleUnknown, TSystem extends AnyActorSystem = AnyActorSystem
     getPersistedSnapshot: (snapshot: TSnapshot, options?: unknown) => Snapshot<unknown>;
 }
 
+declare const _actorLogic: StateMachine<Context_4, Events_4, {}, never, never, {
+    type: "was opened on hover";
+    params: unknown;
+} | {
+    type: "has search query";
+    params: unknown;
+} | {
+    type: "search query is empty";
+    params: unknown;
+}, "open timeout" | "close timeout", "pending" | "idle" | {
+    active: "search" | "opened" | "decide" | "closing";
+}, "active", Input_3, NonReducibleUnknown, EventObject, MetaObject, {
+    id: "navigationPanel";
+    states: {
+        readonly idle: {
+            id: "idle";
+        };
+        readonly pending: {};
+        readonly active: {
+            states: {
+                readonly decide: {};
+                readonly opened: {};
+                readonly search: {};
+                readonly closing: {};
+            };
+        };
+    };
+}>;
+
+declare type ActorLogicMap = {
+    [K in keyof ChildrenActors]: ActorRefFromLogic<ChildrenActors[K]> | undefined;
+};
+
 declare interface ActorOptions<TLogic extends AnyActorLogic> {
     /**
      * The clock that is responsible for setting and clearing timeouts, such as
@@ -509,6 +554,22 @@ declare type ActorRefFromLogic<T extends AnyActorLogic> = ActorRef<SnapshotFrom<
 
 declare type ActorRefLike = Pick<AnyActorRef, 'sessionId' | 'send' | 'getSnapshot'>;
 
+declare const actors: {
+    hotkey: HotkeyActorLogic;
+    overlays: OverlaysActorLogic;
+    search: SearchActorLogic;
+    mediaPrint: MediaPrintActorLogic;
+    editor: EditorActorLogic;
+    navigationPanel: NavigationPanelActorLogic;
+};
+
+declare const actors_2: {
+    hotkey: HotkeyActorLogic_2;
+    applyLatest: PromiseActorLogic<EditorCalls.ApplyLatestToManual.Output, EditorCalls.ApplyLatestToManual.Input, EventObject>;
+    executeChange: PromiseActorLogic<EditorCalls.ExecuteChange.Output, EditorCalls.ExecuteChange.Input, EventObject>;
+    applySemanticLayout: PromiseActorLogic<EditorCalls.ApplySemanticLayout.Output, EditorCalls.ApplySemanticLayout.Input, EventObject>;
+};
+
 declare interface ActorScope<TSnapshot extends Snapshot<unknown>, TEvent extends EventObject, TSystem extends AnyActorSystem = AnyActorSystem, TEmitted extends EventObject = EventObject> {
     self: ActorRef<TSnapshot, TEvent, TEmitted>;
     id: string;
@@ -525,7 +586,7 @@ declare interface ActorSystem<T extends ActorSystemInfo> {
     get: <K extends keyof T['actors']>(key: K) => T['actors'][K] | undefined;
     getAll: () => Partial<T['actors']>;
     inspect: (observer: Observer<InspectionEvent> | ((inspectionEvent: InspectionEvent) => void)) => Subscription;
-    scheduler: Scheduler;
+    scheduler: Scheduler_2;
     getSnapshot: () => {
         _scheduledEvents: Record<string, ScheduledEvent>;
     };
@@ -596,6 +657,12 @@ export declare namespace Base {
     export type Dimmed = 'immediate' | boolean;
 }
 
+/**
+ * Here is a trick to reduce inference types
+ */
+declare interface BaseDiagramMachineLogic<Actors extends Partial<ActorLogicMap> = ActorLogicMap, State extends StateValue = never> extends StateMachine<DiagramContext, DiagramEvents, Actors & Omit<ActorLogicMap, keyof Actors>, ChildrenActor, never, never, never, State, never, Input_4, never, DiagramEmittedEvents, never, never> {
+}
+
 export declare interface BaseEdge<Data extends Record<string, unknown> = Record<string, unknown>, EdgeType extends string = string> extends SetRequired<Edge<Data & BaseEdgeData, EdgeType>, 'type' | 'data'> {
 }
 
@@ -623,6 +690,14 @@ export declare interface BaseEdgeProps<E extends BaseEdge = BaseEdge> extends Ed
 
 export declare type BaseEdgePropsWithData<Data extends Record<string, unknown>> = BaseEdgeProps<BaseEdge<Data>>;
 
+/**
+ * to workaround circular dependency issue between editor and diagram packages
+ */
+declare interface BaseEditorActorLogic<State extends StateValue = any> extends StateMachine<EditorActorContext, EditorActorEvent, inferChildrenRef<typeof actors_2>, inferProvidedActor<typeof actors_2>, never, never, never, State, EditorActorStateTag, EditorActorInput, never, EditorActorEmitedEvent, never, never> {
+}
+
+declare type BaseEditorActorRef = ActorRefFromLogic<BaseEditorActorLogic>;
+
 declare interface BaseInspectionEventProperties {
     rootId: string;
     /**
@@ -657,15 +732,32 @@ export declare interface BaseNodeProps<N extends BaseNode = BaseNode> extends No
 
 export declare type BaseNodePropsWithData<Data extends Record<string, unknown>> = BaseNodeProps<BaseNode<Data>>;
 
+declare type CallbackActorLogic<TEvent extends EventObject, TInput = NonReducibleUnknown, TEmitted extends EventObject = EventObject> = ActorLogic<CallbackSnapshot<TInput>, TEvent, TInput, AnyActorSystem, TEmitted>;
+
+declare type CallbackSnapshot<TInput> = Snapshot<undefined> & {
+    input: TInput;
+};
+
+declare type ChildrenActor = {
+    [K in keyof ChildrenActors]: {
+        id: K;
+        logic: ChildrenActors[K];
+        src: K;
+    };
+}[keyof ChildrenActors];
+
+declare type ChildrenActors = typeof actors;
+
 declare interface Clock {
     setTimeout(fn: (...args: any[]) => void, timeout: number): any;
     clearTimeout(id: any): void;
 }
 
-export declare function CompoundActionButton({ data: { hovered: isHovered, }, icon, onClick, }: CompoundActionButtonProps): JSX.Element;
+export declare function CompoundActionButton({ selected, data: { hovered: isHovered, }, icon, ariaLabel, onClick, }: CompoundActionButtonProps): JSX.Element;
 
 declare type CompoundActionButtonProps = Simplify<BaseNodeProps & {
     icon?: ReactNode;
+    ariaLabel?: string;
     onClick: (e: MouseEvent_2) => void;
 }>;
 
@@ -716,10 +808,11 @@ export declare type CompoundDeploymentNodeProps<A extends Any_5 = Unknown_3> = {
 
 export declare function CompoundDeploymentToolbar(props: Types.NodeProps<'compound-deployment'>): JSX.Element;
 
-export declare function CompoundDetailsButton({ data: { hovered: isHovered, }, icon, onClick, }: CompoundDetailsButtonProps): JSX.Element;
+export declare function CompoundDetailsButton({ selected, data: { hovered: isHovered, }, icon, ariaLabel, onClick, }: CompoundDetailsButtonProps): JSX.Element;
 
 declare type CompoundDetailsButtonProps = Simplify<BaseNodeProps & {
     icon?: ReactNode;
+    ariaLabel?: string;
     onClick: (e: MouseEvent_2) => void;
 }>;
 
@@ -782,10 +875,16 @@ declare type CompoundNodeContainerProps = PropsWithChildren<HTMLAttributes<HTMLD
     nodeProps: BaseNodeProps<BaseNode<RequiredData>>;
 }>;
 
-export declare function CompoundTitle({ data }: CompoundTitleProps): JSX.Element;
+export declare function CompoundTitle({ data, 'aria-hidden': ariaHidden }: CompoundTitleProps): JSX.Element;
 
 declare type CompoundTitleProps = {
     data: RequiredData_2;
+    /**
+     * Opt-in: hide the title from assistive technologies. The main diagram sets
+     * this because the compound node's accessible label already conveys the
+     * title, so re-exposing it here would cause a duplicate announcement.
+     */
+    'aria-hidden'?: boolean | undefined;
 };
 
 declare type Compute<A> = {
@@ -811,7 +910,7 @@ declare interface Context_2 {
     enableSelectSubject: boolean;
     enableChangeScope: boolean;
     xyflow: XYFLowInstance | null;
-    xystore: XYStoreApi_2 | null;
+    xystore: XYStoreApi | null;
     layouted: LayoutRelationshipsViewResult | null;
     navigateFromNode: string | null;
     xynodes: RelationshipsBrowserTypes.Node[];
@@ -822,16 +921,37 @@ declare type Context_3 = Readonly<{
     subject: Subject;
     viewId: ViewId_3;
     xyflow: XYFLowInstance_2 | null;
-    xystore: XYStoreApi_3 | null;
+    xystore: XYStoreApi_2 | null;
     initialized: {
         xydata: boolean;
         xyflow: boolean;
     };
     xynodes: RelationshipDetailsTypes.Node[];
     xyedges: RelationshipDetailsTypes.Edge[];
-    bounds: BBox_3;
+    bounds: BBox_2;
 }>;
 
+declare function Context_4({ input }: {
+    input: Input_3;
+}): Context_4;
+
+declare interface Context_4 {
+    view: LayoutedView;
+    viewModel: CurrentViewModel | null;
+    /**
+     * Who activated the dropdown
+     * (if `click` then the dropdown is always open until dismissed)
+     * @default 'hover'
+     */
+    activatedBy: 'hover' | 'click';
+    /**
+     * The folder that is currently selected in the dropdown
+     * By default it is the root
+     */
+    selectedFolder: string;
+    searchQuery: string;
+}
+
 declare type ContextFactory<TContext extends MachineContext, TActor extends ProvidedActor, TInput, TEvent extends EventObject = EventObject> = ({ spawn, input, self }: {
     spawn: Spawner<TActor>;
     input: TInput;
@@ -856,6 +976,8 @@ export declare function DefaultHandles({ direction }: {
     direction?: AutoLayoutDirection | undefined;
 }): JSX.Element;
 
+export declare function DefaultMantineProvider({ children, theme, ...props }: MantineProviderProps): JSX.Element;
+
 declare type Delay<TDelay extends string> = TDelay | number;
 
 declare type DelayConfig<TContext extends MachineContext, TExpressionEvent extends EventObject, TParams extends ParameterizedObject['params'] | undefined, TEvent extends EventObject> = number | DelayExpr<TContext, TExpressionEvent, TParams, TEvent>;
@@ -904,7 +1026,7 @@ export declare const DeploymentElementActions: ({ extraButtons, ...props }: Depl
 
 declare type DeploymentElementActionsProps = SimplifyDeep<{
     selected?: boolean;
-    data: Pick<Types.DeploymentElementNodeData, 'id' | 'modelFqn' | 'navigateTo'> & BaseNodeData;
+    data: Pick<Types.DeploymentElementNodeData, 'id' | 'modelFqn' | 'navigateTo' | 'title'> & BaseNodeData;
 }> & WithExtraButtons;
 
 export declare function DeploymentElementToolbar(props: Types.NodeProps<'deployment'>): JSX.Element;
@@ -972,25 +1094,24 @@ export declare interface DiagramActorRef extends DiagramMachineRef {
     system: System;
 }
 
-export declare type DiagramActorSnapshot = MachineSnapshot<DiagramContext, DiagramEvents, {
-    overlays: OverlaysActorRef | undefined;
-    search: SearchActorRef | undefined;
-    editor: EditorActorRef | undefined;
-}, any, any, any, {}, {}>;
+export declare type DiagramActorSnapshot = SnapshotFrom<DiagramMachineLogic>;
 
-export declare interface DiagramApi<A extends Any_3 = Unknown_2> {
+export declare class DiagramApi<A extends Any_3 = Unknown_2> {
+    private static cache;
+    static withActor(actorRef: RefObject<DiagramActorRef>): DiagramApi;
     /**
      * React ref to the diagram actor
      */
     readonly ref: RefObject<DiagramActorRef>;
+    private constructor();
     /**
      * @warning Do not use in render phase
      */
-    readonly actor: DiagramActorRef;
+    get actor(): DiagramActorRef;
     /**
      * @warning Do not use in render phase
      */
-    readonly currentView: t.DiagramView<A>;
+    get currentView(): t.DiagramView<A>;
     /**
      * Editor actor reference
      * @warning Do not use in render phase
@@ -1032,7 +1153,7 @@ export declare interface DiagramApi<A extends Any_3 = Unknown_2> {
     /**
      * If running in editor, trigger opening source file
      */
-    openSource(params: OpenSourceParams<A>): void;
+    openSource(params: OpenSourceParams<Unknown_2>): void;
     /**
      * Open element details card
      */
@@ -1099,21 +1220,31 @@ export declare interface DiagramApi<A extends Any_3 = Unknown_2> {
      * @warning Do not use in render phase
      */
     findDiagramEdge(xyedgeId: string): t.DiagramEdge<A> | null;
-    startWalkthrough(): void;
-    walkthroughStep(direction?: 'next' | 'previous'): void;
+    startWalkthrough(stepId?: t.StepPath): void;
+    walkthroughStep(value?: 'next' | 'prev' | {
+        step: t.StepPath;
+    }): void;
     stopWalkthrough(): void;
-    toggleFeature(feature: FeatureName, forceValue?: boolean): void;
+    toggleFeature(feature: TogglableFeature, forceValue?: boolean): void;
     highlightNotation(notation: NodeNotation, kind?: string): void;
     unhighlightNotation(): void;
     openSearch(searchValue?: string): void;
-    triggerChange(viewChange: ViewChange): void;
+    triggerChange(change: ViewChange): void;
     /**
      * Switch dynamic view display variant
      */
     switchDynamicViewVariant(variant: DynamicViewDisplayVariant): void;
+    /**
+     * Toggle sequence flow collapse/expand
+     */
+    toggleSequenceFlow(flowId: t.StepPath): void;
 }
 
-export declare interface DiagramContext extends Input {
+export declare function DiagramContext({ input }: {
+    input: Input_4;
+}): DiagramContext;
+
+export declare interface DiagramContext extends Input_4 {
     xynodes: Types.Node[];
     xyedges: Types.Edge[];
     features: EnabledFeatures;
@@ -1156,8 +1287,12 @@ export declare interface DiagramContext extends Input {
     xyflow: XYFlowInstance | null;
     dynamicViewVariant: DynamicViewDisplayVariant;
     activeWalkthrough: null | {
-        stepId: StepEdgeId;
-        parallelPrefix: string | null;
+        stepId: StepPath;
+        activeFlow: StepPath | null;
+        outlinePanelWidth: number;
+    };
+    collapsedSequenceFlows: {
+        [flowId: StepPath]: boolean;
     };
 }
 
@@ -1194,6 +1329,7 @@ export declare type DiagramEmittedEvents = {
 } | {
     type: 'walkthroughStep';
     edge: Types.Edge;
+    stepId: StepPath;
 } | {
     type: 'walkthroughStopped';
 } | {
@@ -1212,8 +1348,8 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
     instance: XYFlowInstance;
 } | {
     type: 'xyflow.applyChanges';
-    edges?: EdgeChange<Types.Edge>[];
-    nodes?: NodeChange<Types.Node>[];
+    edges?: EdgeChange_2<Types.Edge>[];
+    nodes?: NodeChange_2<Types.Node>[];
 } | {
     type: 'xyflow.viewportMoved';
     viewport: Viewport;
@@ -1235,10 +1371,10 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
     type: 'xyflow.resized';
 } | {
     type: 'xyflow.nodeMouseEnter';
-    node: Types.Node;
+    node: Types.Node | NodeId;
 } | {
     type: 'xyflow.nodeMouseLeave';
-    node: Types.Node;
+    node: Types.Node | NodeId;
 } | {
     type: 'xyflow.edgeMouseEnter';
     edge: Types.Edge;
@@ -1250,7 +1386,7 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
 } | {
     type: 'xyflow.fitDiagram';
     duration?: number;
-    bounds?: BBox_2;
+    bounds?: BBox_3;
 } | {
     type: 'xyflow.setViewport';
     duration?: number;
@@ -1261,15 +1397,17 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
     duration?: number;
 } | {
     type: 'xyflow.centerViewport';
-    edgeId: EdgeId;
+    edgeId: EdgeId_2;
     duration?: number;
+} | {
+    type: 'xyflow.resetSelection';
 } | {
     type: 'update.nodeData';
     nodeId: NodeId;
     data: PartialDeep<Types.NodeData>;
 } | {
     type: 'update.edgeData';
-    edgeId: EdgeId;
+    edgeId: EdgeId_2;
     data: PartialDeep<Types.EdgeData>;
 } | {
     type: 'update.view';
@@ -1283,10 +1421,10 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
     xyedges: Types.Edge[];
 } | {
     type: 'update.view-bounds';
-    bounds: BBox_2;
+    bounds: BBox_3;
 } | {
     type: 'update.inputs';
-    inputs: Partial<Omit<Input, 'view' | 'xystore' | 'dynamicViewVariant' | 'features'>>;
+    inputs: Partial<Omit<Input_4, 'view' | 'xystore' | 'dynamicViewVariant' | 'features'>>;
 } | {
     type: 'update.features';
     features: EnabledFeatures;
@@ -1299,7 +1437,7 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
 } | {
     type: 'open.relationshipDetails';
     params: {
-        edgeId: EdgeId;
+        edgeId: EdgeId_2;
     } | {
         source: Fqn;
         target: Fqn;
@@ -1337,18 +1475,34 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
     variant: DynamicViewDisplayVariant;
 } | {
     type: 'walkthrough.start';
-    stepId?: StepEdgeId;
+    stepId?: StepPath | undefined;
+} | {
+    type: 'walkthrough.step';
+    direction: 'next' | 'prev';
+    stepId?: never;
 } | {
     type: 'walkthrough.step';
-    direction: 'next' | 'previous';
+    stepId: StepPath;
+    direction?: never;
 } | {
     type: 'walkthrough.end';
+} | {
+    type: 'sequence.flow.collapse';
+    flowId: StepPath;
+} | {
+    type: 'sequence.flow.expand';
+    flowId: StepPath;
+} | {
+    type: 'sequence.flow.toggle';
+    flowId: StepPath;
+} | {
+    type: 'sequence.walkthrough.end';
 } | {
     type: 'highlight.node';
     nodeId: NodeId;
 } | {
     type: 'highlight.edge';
-    edgeId: EdgeId;
+    edgeId: EdgeId_2;
 } | {
     type: 'unhighlight.all';
 } | {
@@ -1376,6 +1530,152 @@ export declare type DiagramEvents = HotKeyEvent | MediaPrintEvent | {
     type: 'destroy';
 };
 
+declare const _diagramMachine: StateMachine<DiagramContext, DiagramEvents, {
+    search?: ActorRefFromLogic<SearchActorLogic>;
+    hotkey?: ActorRefFromLogic<HotkeyActorLogic>;
+    overlays?: ActorRefFromLogic<OverlaysActorLogic>;
+    mediaPrint?: ActorRefFromLogic<MediaPrintActorLogic>;
+    editor?: ActorRefFromLogic<EditorActorLogic>;
+    navigationPanel?: ActorRefFromLogic<NavigationPanelActorLogic>;
+}, {
+    src: "search";
+    logic: SearchActorLogic;
+    id: "search";
+} | {
+    src: "hotkey";
+    logic: HotkeyActorLogic;
+    id: "hotkey";
+} | {
+    src: "overlays";
+    logic: OverlaysActorLogic;
+    id: "overlays";
+} | {
+    src: "mediaPrint";
+    logic: MediaPrintActorLogic;
+    id: "mediaPrint";
+} | {
+    src: "editor";
+    logic: EditorActorLogic;
+    id: "editor";
+} | {
+    src: "navigationPanel";
+    logic: NavigationPanelActorLogic;
+    id: "navigationPanel";
+}, never, {
+    type: "isReady";
+    params: unknown;
+} | {
+    type: "enabled: Editor";
+    params: unknown;
+} | {
+    type: "enabled: FitView";
+    params: unknown;
+} | {
+    type: "enabled: FocusMode";
+    params: unknown;
+} | {
+    type: "enabled: Readonly";
+    params: unknown;
+} | {
+    type: "enabled: RelationshipDetails";
+    params: unknown;
+} | {
+    type: "enabled: Search";
+    params: unknown;
+} | {
+    type: "enabled: ElementDetails";
+    params: unknown;
+} | {
+    type: "enabled: OpenSource";
+    params: unknown;
+} | {
+    type: "enabled: DynamicViewWalkthrough";
+    params: unknown;
+} | {
+    type: "enabled: NavigationPanel";
+    params: unknown;
+} | {
+    type: "focus.node: autoUnfocus";
+    params: unknown;
+} | {
+    type: "enabled: Overlays";
+    params: unknown;
+} | {
+    type: "not readonly";
+    params: unknown;
+} | {
+    type: "is dynamic view";
+    params: unknown;
+} | {
+    type: "is dynamic view in sequence variant";
+    params: unknown;
+} | {
+    type: "is same view";
+    params: unknown;
+} | {
+    type: "is another view";
+    params: unknown;
+} | {
+    type: "click: node has modelFqn";
+    params: unknown;
+} | {
+    type: "click: selected node";
+    params: unknown;
+} | {
+    type: "click: same node";
+    params: unknown;
+} | {
+    type: "click: focused node";
+    params: unknown;
+} | {
+    type: "click: node.type = seq-subflow";
+    params: unknown;
+} | {
+    type: "click: node has connections";
+    params: unknown;
+} | {
+    type: "click: selected edge";
+    params: unknown;
+} | {
+    type: "click: active walkthrough step";
+    params: unknown;
+}, never, "final" | "isReady" | "navigating" | "initializing" | {
+    ready: "idle" | "walkthrough" | "focused" | "printing";
+}, string, Input_4, NonReducibleUnknown, DiagramEmittedEvents, MetaObject, {
+    states: {
+        readonly initializing: {};
+        readonly isReady: {};
+        readonly ready: {
+            states: {
+                idle: {
+                    id: string;
+                };
+                focused: {
+                    id: string;
+                };
+                walkthrough: {
+                    id: string;
+                };
+                printing: {
+                    id: string;
+                };
+            };
+        };
+        readonly navigating: {
+            id: string;
+        };
+        readonly final: {};
+    };
+}>;
+
+declare interface DiagramMachineLogic extends BaseDiagramMachineLogic<{
+    overlays: OverlaysActorRef | undefined;
+    search: SearchActorRef | undefined;
+    editor: BaseEditorActorRef | undefined;
+    navigationPanel: NavigationPanelActorRef | undefined;
+}, StateValueFrom<typeof _diagramMachine>> {
+}
+
 declare interface DiagramMachineRef extends ActorRef<DiagramActorSnapshot, DiagramEvents, DiagramEmittedEvents> {
 }
 
@@ -1440,6 +1740,7 @@ declare type EdgeId_3 = t.aux.EdgeId;
 declare interface EditorActorContext {
     viewId: t.ViewId;
     history: LinkedSnapshot | null;
+    redo: LinkedSnapshot | null;
     editing: null | {
         /**
          * The subject of the edit
@@ -1467,6 +1768,10 @@ declare type EditorActorEvent = {
     type: 'change.latest-to-manual';
 } | {
     type: 'change.sync-snapshot';
+} | {
+    type: 'delete.nodes-edges';
+    nodeIds: t.NodeId[];
+    edgeIds: t.EdgeId[];
 } | {
     type: 'view.synched';
 } | {
@@ -1484,10 +1789,7 @@ declare interface EditorActorInput {
     viewId: t.ViewId;
 }
 
-declare interface EditorActorLogic extends StateMachine<EditorActorContext, EditorActorEvent, any, any, any, any, any, {
-    editor: 'idle' | 'moving';
-    syncQueue: 'idle' | 'pending' | 'suspended' | 'process';
-}, EditorActorStateTag, EditorActorInput, any, EditorActorEmitedEvent, any, any> {
+declare interface EditorActorLogic extends BaseEditorActorLogic {
 }
 
 declare interface EditorActorRef extends ActorRef<EditorActorSnapshot, EditorActorEvent, EditorActorEmitedEvent> {
@@ -1497,6 +1799,46 @@ declare type EditorActorSnapshot = SnapshotFrom<EditorActorLogic>;
 
 declare type EditorActorStateTag = 'pending' | 'busy' | 'ai-semantic-layout';
 
+declare namespace EditorCalls {
+    type ApplyLatestToManual = (params: {
+        input: ApplyLatestToManual.Input;
+    }) => Promise<ApplyLatestToManual.Output>;
+    namespace ApplyLatestToManual {
+        type Input = {
+            viewId: t.ViewId;
+            current: t.LayoutedView | undefined;
+        };
+        type Output = {
+            updated: t.LayoutedView;
+        };
+    }
+    type ApplySemanticLayout = (params: {
+        input: ApplySemanticLayout.Input;
+    }) => Promise<ApplySemanticLayout.Output>;
+    namespace ApplySemanticLayout {
+        type Input = {
+            viewId: t.ViewId;
+        };
+        type Output = {};
+    }
+    type ExecuteChange = (params: {
+        input: ExecuteChange.Input;
+    }) => Promise<ExecuteChange.Output>;
+    namespace ExecuteChange {
+        type Input = {
+            viewId: t.ViewId;
+            changes: t.ViewChange[];
+        };
+        /**
+         * Returns the changes that were applied to the view
+         */
+        type Output = {
+            requested: t.ViewChange[];
+            applied: t.ViewChange[];
+        };
+    }
+}
+
 declare type EffectCallback_2 = (...args: any[]) => any;
 
 declare type EffectHook<Callback extends EffectCallback_2 = EffectCallback_2, Deps extends DependencyList | undefined = DependencyList | undefined, RestArgs extends any[] = any[]> = ((...args: [Callback, Deps, ...RestArgs]) => void) | ((...args: [Callback, Deps]) => void);
@@ -1531,6 +1873,7 @@ export declare function ElementActionButtons({ selected, data: { hovered: isHove
 export declare namespace ElementActionButtons {
     export type Item = {
         key?: string;
+        ariaLabel?: string;
         icon?: ReactNode;
         onClick: (e: MouseEvent_2) => void;
     };
@@ -1573,7 +1916,7 @@ export declare function ElementActions({ extraButtons, ...props }: ElementAction
 
 declare type ElementActionsProps = SimplifyDeep<{
     selected?: boolean;
-    data: Pick<Types.ElementNodeData, 'id' | 'modelFqn' | 'navigateTo'> & BaseNodeData;
+    data: Pick<Types.ElementNodeData, 'id' | 'modelFqn' | 'navigateTo' | 'title'> & BaseNodeData;
 }> & WithExtraButtons;
 
 /**
@@ -1595,7 +1938,9 @@ declare type ElementActionsProps = SimplifyDeep<{
  * </ElementData.Root>
  * ```
  */
-export declare function ElementData({ data }: ElementDataProps): JSX.Element;
+export declare function ElementData({ data, 'aria-hidden': ariaHidden }: ElementDataProps & {
+    'aria-hidden'?: boolean | undefined;
+}): JSX.Element;
 
 export declare namespace ElementData {
     var Root: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & ElementDataProps & RefAttributes<HTMLDivElement>>;
@@ -1619,12 +1964,13 @@ declare type ElementDataProps = {
 declare interface ElementDetailsActorRef extends ActorRef<ElementDetailsSnapshot, Events> {
 }
 
-export declare function ElementDetailsButton({ selected, data: { hovered: isHovered, }, icon, onClick, }: ElementDetailsButtonProps): JSX.Element;
+export declare function ElementDetailsButton({ selected, data: { hovered: isHovered, }, icon, ariaLabel, onClick, }: ElementDetailsButtonProps): JSX.Element;
 
 declare type ElementDetailsButtonProps = {
     selected?: boolean;
     data: BaseNodeData;
     icon?: ReactNode;
+    ariaLabel?: string;
     onClick: (e: MouseEvent_2) => void;
 };
 
@@ -1636,9 +1982,18 @@ export declare function ElementDetailsButtonWithHandler(props: {
     };
 }): JSX.Element | null;
 
+declare type ElementDetailsInput = {
+    subject: Fqn;
+    currentView: DiagramView;
+    initiatedFrom?: {
+        node?: NodeId;
+        clientRect?: Rect;
+    };
+};
+
 declare interface ElementDetailsLogic extends StateMachine<Context, Events, {
     [key: `${string}-relationships`]: RelationshipsBrowserActorRef | undefined;
-}, any, any, any, any, any, never, Input_2, any, any, any, any> {
+}, any, any, any, any, any, never, ElementDetailsInput, any, any, any, any> {
 }
 
 declare type ElementDetailsSnapshot = SnapshotFrom<ElementDetailsLogic>;
@@ -1777,6 +2132,78 @@ declare interface ErrorActorEvent<TErrorData = unknown, TId extends string = str
     actorId: TId;
 }
 
+export declare function ErrorBoundary(props: Pick<ErrorBoundaryProps, 'onReset' | 'onError' | 'children'>): JSX.Element;
+
+declare type ErrorBoundaryProps = ErrorBoundaryPropsWithFallback | ErrorBoundaryPropsWithComponent | ErrorBoundaryPropsWithRender;
+
+declare type ErrorBoundaryPropsWithComponent = ErrorBoundarySharedProps & {
+    fallback?: never;
+    /**
+     * React component responsible for returning a fallback UI based on a thrown value.
+     *
+     * ```tsx
+     * <ErrorBoundary FallbackComponent={Fallback} />
+     * ```
+     */
+    FallbackComponent: ComponentType<FallbackProps>;
+    fallbackRender?: never;
+};
+
+declare type ErrorBoundaryPropsWithFallback = ErrorBoundarySharedProps & {
+    /**
+     * Static content to render in place of an error if one is thrown.
+     *
+     * ```tsx
+     * <ErrorBoundary fallback={<div className="text-red">Something went wrong</div>} />
+     * ```
+     */
+    fallback: ReactNode;
+    FallbackComponent?: never;
+    fallbackRender?: never;
+};
+
+declare type ErrorBoundaryPropsWithRender = ErrorBoundarySharedProps & {
+    fallback?: never;
+    FallbackComponent?: never;
+    /**
+     * [Render prop](https://react.dev/reference/react/Children#calling-a-render-prop-to-customize-rendering) function responsible for returning a fallback UI based on a thrown value.
+     *
+     * ```tsx
+     * <ErrorBoundary fallbackRender={({ error, resetErrorBoundary }) => <div>...</div>} />
+     * ```
+     */
+    fallbackRender: (props: FallbackProps) => ReactNode;
+};
+
+declare type ErrorBoundarySharedProps = PropsWithChildren<{
+    /**
+     * Optional callback to enable e.g. logging error information to a server.
+     *
+     * @param error Value that was thrown; typically an instance of `Error`
+     * @param info React "component stack" identifying where the error was thrown
+     */
+    onError?: (error: unknown, info: ErrorInfo) => void;
+    /**
+     * Optional callback to be notified when an error boundary is reset so React can retry the failed render.
+     */
+    onReset?: (details: {
+        reason: "imperative-api";
+        args: unknown[];
+    } | {
+        reason: "keys";
+        prev: unknown[] | undefined;
+        next: unknown[] | undefined;
+    }) => void;
+    /**
+     * When changed, these keys will reset a triggered error boundary.
+     * This can be useful when an error condition may be tied to some specific state (that can be uniquely identified by key).
+     * See the documentation for examples of how to use this prop.
+     */
+    resetKeys?: unknown[];
+}>;
+
+export declare function ErrorFallback({ error, resetErrorBoundary }: FallbackProps): JSX.Element;
+
 declare interface ErrorMachineSnapshot<TContext extends MachineContext, TEvent extends EventObject, TChildren extends Record<string, AnyActorRef | undefined>, TStateValue extends StateValue, TTag extends string, TOutput, TMeta extends MetaObject, TStateSchema extends StateSchema> extends MachineSnapshotBase<TContext, TEvent, TChildren, TStateValue, TTag, TOutput, TMeta, TStateSchema> {
     status: 'error';
     output: undefined;
@@ -1805,7 +2232,7 @@ declare type Events = {
 declare type Events_2 = {
     type: 'xyflow.init';
     instance: XYFLowInstance;
-    store: XYStoreApi_2;
+    store: XYStoreApi;
 } | {
     type: 'xyflow.nodeClick';
     node: RelationshipsBrowserTypes.Node;
@@ -1814,10 +2241,10 @@ declare type Events_2 = {
     edge: RelationshipsBrowserTypes.Edge;
 } | {
     type: 'xyflow.applyNodeChanges';
-    changes: NodeChange_2<RelationshipsBrowserTypes.Node>[];
+    changes: NodeChange<RelationshipsBrowserTypes.Node>[];
 } | {
     type: 'xyflow.applyEdgeChanges';
-    changes: EdgeChange_2<RelationshipsBrowserTypes.Edge>[];
+    changes: EdgeChange<RelationshipsBrowserTypes.Edge>[];
 } | {
     type: 'xyflow.paneClick';
 } | {
@@ -1845,7 +2272,7 @@ declare type Events_2 = {
 } | {
     type: 'fitDiagram';
     duration?: number;
-    bounds?: BBox_3;
+    bounds?: BBox_2;
 } | {
     type: 'navigate.to';
     subject: Fqn_3;
@@ -1868,7 +2295,7 @@ declare type Events_2 = {
 declare type Events_3 = {
     type: 'xyflow.init';
     instance: XYFLowInstance_2;
-    store: XYStoreApi_3;
+    store: XYStoreApi_2;
 } | {
     type: 'xyflow.nodeClick';
     node: RelationshipDetailsTypes.Node;
@@ -1891,10 +2318,10 @@ declare type Events_3 = {
     edges: RelationshipDetailsTypes.Edge[];
 } | {
     type: 'xyflow.applyNodeChanges';
-    changes: NodeChange_2<RelationshipDetailsTypes.Node>[];
+    changes: NodeChange<RelationshipDetailsTypes.Node>[];
 } | {
     type: 'xyflow.applyEdgeChanges';
-    changes: EdgeChange_2<RelationshipDetailsTypes.Edge>[];
+    changes: EdgeChange<RelationshipDetailsTypes.Edge>[];
 } | {
     type: 'xyflow.paneClick';
 } | {
@@ -1909,11 +2336,11 @@ declare type Events_3 = {
 } | {
     type: 'fitDiagram';
     duration?: number;
-    bounds?: BBox_3;
+    bounds?: BBox_2;
 } | {
     type: 'navigate.to';
     params: {
-        edgeId: EdgeId_2;
+        edgeId: EdgeId;
         viewId?: ViewId_3;
     } | {
         source: Fqn_3;
@@ -1924,6 +2351,51 @@ declare type Events_3 = {
     type: 'close';
 };
 
+declare type Events_4 = {
+    type: 'update.inputs';
+    inputs: Input_3;
+} | {
+    type: 'searchQuery.change';
+    value: string;
+} | {
+    type: 'searchQuery.changed';
+} | {
+    type: 'select.folder';
+    folderPath: string;
+} | {
+    type: 'select.view';
+    viewId: ViewId;
+} | {
+    type: 'breadcrumbs.mouseLeave';
+} | {
+    type: 'breadcrumbs.mouseEnter.root';
+} | {
+    type: 'breadcrumbs.mouseLeave.root';
+} | {
+    type: 'breadcrumbs.mouseEnter.folder';
+    folderPath: string;
+} | {
+    type: 'breadcrumbs.mouseLeave.folder';
+    folderPath: string;
+} | {
+    type: 'breadcrumbs.mouseEnter.viewtitle';
+} | {
+    type: 'breadcrumbs.mouseLeave.viewtitle';
+} | {
+    type: 'breadcrumbs.click.root';
+} | {
+    type: 'breadcrumbs.click.folder';
+    folderPath: string;
+} | {
+    type: 'breadcrumbs.click.viewtitle';
+} | {
+    type: 'dropdown.mouseEnter';
+} | {
+    type: 'dropdown.mouseLeave';
+} | {
+    type: 'dropdown.dismiss';
+};
+
 declare interface ExecutableActionObject {
     type: string;
     info: ActionArgs<MachineContext, EventObject, EventObject>;
@@ -1933,6 +2405,11 @@ declare interface ExecutableActionObject {
 
 declare type ExtractEvent<TEvent extends EventObject, TDescriptor extends EventDescriptor<TEvent>> = string extends TEvent['type'] ? TEvent : NormalizeDescriptor<TDescriptor> extends infer TNormalizedDescriptor ? TEvent extends any ? true extends EventDescriptorMatches<TEvent['type'], TNormalizedDescriptor> ? TEvent : never : never : never;
 
+declare type FallbackProps = {
+    error: unknown;
+    resetErrorBoundary: (...args: unknown[]) => void;
+};
+
 export declare type FeatureName = typeof FeatureNames[number];
 
 declare const FeatureNames: readonly ["Controls", "Editor", "AISemanticLayout", "ReadOnly", "FocusMode", "NavigateTo", "ElementDetails", "RelationshipDetails", "RelationshipBrowser", "Search", "NavigationButtons", "Notations", "DynamicViewWalkthrough", "FitView", "CompareWithLatest", "Notes", "Vscode", "ElementTags"];
@@ -1941,13 +2418,13 @@ declare type Fqn_2<A> = t.aux.Fqn<A>;
 
 declare type Fqn_4<A> = t.aux.Fqn<A>;
 
-export declare const FramerMotionConfig: ({ reducedMotion, children, }: PropsWithChildren<{
+export declare function FramerMotionConfig({ reducedMotion, children, }: PropsWithChildren<{
     /**
      * If true, will respect the device prefersReducedMotion setting by switching
      * transform animations off.
      */
-    reducedMotion?: "always" | "never" | "user" | undefined;
-}>) => JSX.Element;
+    reducedMotion?: 'always' | 'never' | 'user' | undefined;
+}>): JSX.Element;
 
 declare type GetConcreteByKey<T, TKey extends keyof T, TValue extends T[TKey]> = T & Record<TKey, TValue>;
 
@@ -1975,12 +2452,18 @@ declare type GuardPredicate<TContext extends MachineContext, TExpressionEvent ex
 
 declare type HistoryValue<TContext extends MachineContext, TEvent extends EventObject> = Record<string, Array<StateNode<TContext, TEvent>>>;
 
+declare interface HotkeyActorLogic extends CallbackActorLogic<AnyEventObject, NonReducibleUnknown, HotKeyEvent> {
+}
+
+declare interface HotkeyActorLogic_2 extends CallbackActorLogic<AnyEventObject, NonReducibleUnknown, HotKeyEvent_2> {
+}
+
 declare type HotKeyEvent = {
     type: 'key.esc' | `key.arrow.${'left' | 'right' | 'up' | 'down'}`;
 };
 
 declare type HotKeyEvent_2 = {
-    type: 'undo';
+    type: 'undo' | 'redo';
 };
 
 declare type IconProps = {
@@ -2023,15 +2506,27 @@ export declare function IconRendererProvider({ value, children, }: PropsWithChil
 export declare function IfEnabled({ feature, children, and, }: PropsWithChildren<{
     feature: FeatureName;
     and?: boolean;
-}>): JSX.Element | null;
+}>): JSX_2.Element | null;
 
 export declare function IfNotEnabled({ feature, children }: PropsWithChildren<{
     feature: FeatureName;
-}>): JSX.Element | null;
+}>): JSX_2.Element | null;
+
+export declare function IfNotReadOnly({ children }: PropsWithChildren): JSX_2.Element | null;
+
+export declare function IfReadOnly({ children }: PropsWithChildren): JSX_2.Element | null;
 
-export declare function IfNotReadOnly({ children }: PropsWithChildren): JSX.Element | null;
+declare type inferChildrenRef<A> = A extends Record<string, AnyActorLogic> ? {
+    [K in keyof A & string]: ActorRefFromLogic<A[K]> | undefined;
+} : never;
 
-export declare function IfReadOnly({ children }: PropsWithChildren): JSX.Element | null;
+declare type inferProvidedActor<A> = A extends Record<string, AnyActorLogic> ? {
+    [K in keyof A & string]: {
+        id: K;
+        logic: A[K];
+        src: K;
+    };
+}[keyof A & string] : never;
 
 declare type InitialContext<TContext extends MachineContext, TActor extends ProvidedActor, TInput, TEvent extends EventObject> = TContext | ContextFactory<TContext, TActor, TInput, TEvent>;
 
@@ -2045,29 +2540,7 @@ declare interface InitialTransitionDefinition<TContext extends MachineContext, T
     guard?: never;
 }
 
-declare interface Input {
-    view: DiagramView;
-    xystore: XYStoreApi;
-    zoomable: boolean;
-    pannable: boolean;
-    nodesDraggable: boolean;
-    nodesSelectable: boolean;
-    fitViewPadding: ViewPaddings;
-    where: WhereOperator | null;
-    dynamicViewVariant?: DynamicViewDisplayVariant | undefined;
-    features?: EnabledFeatures;
-}
-
-declare type Input_2 = {
-    subject: Fqn;
-    currentView: DiagramView;
-    initiatedFrom?: {
-        node?: NodeId;
-        clientRect?: Rect;
-    };
-};
-
-declare type Input_3 = {
+declare type Input = {
     subject: Fqn_3;
     viewId: ViewId_3 | null;
     scope: 'global' | 'view';
@@ -2076,9 +2549,9 @@ declare type Input_3 = {
     enableChangeScope?: boolean;
 };
 
-declare type Input_4 = ExclusiveUnion_2<{
+declare type Input_2 = ExclusiveUnion_2<{
     Edge: {
-        edgeId: EdgeId_2;
+        edgeId: EdgeId;
         viewId: ViewId_3;
     };
     Between: {
@@ -2088,6 +2561,24 @@ declare type Input_4 = ExclusiveUnion_2<{
     };
 }>;
 
+declare interface Input_3 {
+    view: LayoutedView;
+    viewModel: CurrentViewModel | null;
+}
+
+declare interface Input_4 {
+    view: DiagramView;
+    xystore: XYStoreApi_3;
+    zoomable: boolean;
+    pannable: boolean;
+    nodesDraggable: boolean;
+    nodesSelectable: boolean;
+    fitViewPadding: ViewPaddings;
+    where: WhereOperator | null;
+    dynamicViewVariant?: DynamicViewDisplayVariant | undefined;
+    features?: EnabledFeatures;
+}
+
 declare type InputFrom<T> = T extends StateMachine<infer _TContext, infer _TEvent, infer _TChildren, infer _TActor, infer _TAction, infer _TGuard, infer _TDelay, infer _TStateValue, infer _TTag, infer TInput, infer _TOutput, infer _TEmitted, infer _TMeta, infer _TStateSchema> ? TInput : T extends ActorLogic<infer _TSnapshot, infer _TEvent, infer TInput, infer _TSystem, infer _TEmitted> ? TInput : never;
 
 declare interface InspectedActionEvent extends BaseInspectionEventProperties {
@@ -2121,7 +2612,13 @@ declare interface InspectedSnapshotEvent extends BaseInspectionEventProperties {
     snapshot: Snapshot<unknown>;
 }
 
-declare type InspectionEvent = InspectedSnapshotEvent | InspectedEventEvent | InspectedActorEvent | InspectedMicrostepEvent | InspectedActionEvent;
+declare interface InspectedTransitionEvent extends BaseInspectionEventProperties {
+    type: '@xstate.transition';
+    event: AnyEventObject;
+    snapshot: Snapshot<unknown>;
+}
+
+declare type InspectionEvent = InspectedSnapshotEvent | InspectedEventEvent | InspectedActorEvent | InspectedTransitionEvent | InspectedMicrostepEvent | InspectedActionEvent;
 
 declare type InternalMachineImplementations<TTypes extends StateMachineTypes> = {
     actions?: MachineImplementationsActions<TTypes>;
@@ -2340,7 +2837,7 @@ export declare type LikeC4ColorScheme = 'light' | 'dark';
  *
  * Use {@link ReactLikeC4} or {@link LikeC4View} for ready-to-use component
  */
-export declare function LikeC4Diagram<A extends Any = Any>({ onCanvasClick, onCanvasContextMenu, onCanvasDblClick, onEdgeClick, onEdgeContextMenu, onNavigateTo, onNodeClick, onNodeContextMenu, onOpenSource, onLogoClick, onLayoutTypeChange, onInitialized, view, className, controls, fitView, fitViewPadding: _fitViewPadding, pannable, zoomable, background, enableElementTags, enableFocusMode, enableElementDetails, enableRelationshipDetails, enableRelationshipBrowser, enableCompareWithLatest, nodesSelectable, enableNotations, showNavigationButtons, enableDynamicViewWalkthrough, dynamicViewVariant, enableSearch, enableNotes, initialWidth, initialHeight, reduceGraphics, renderIcon, where, reactFlowProps, renderNodes, children, }: LikeC4DiagramProps<A>): JSX.Element;
+export declare function LikeC4Diagram<A extends Any = Any>({ onCanvasClick, onCanvasContextMenu, onCanvasDblClick, onEdgeClick, onEdgeContextMenu, onNavigateTo, onNodeClick, onNodeContextMenu, onOpenSource, onLogoClick, onLayoutTypeChange, onInitialized, view, className, controls, fitView, fitViewPadding: _fitViewPadding, pannable, zoomable, background, enableElementTags, enableFocusMode, enableElementDetails, enableRelationshipDetails, enableRelationshipBrowser, enableCompareWithLatest, nodesSelectable, enableNotations, showNavigationButtons, enableDynamicViewWalkthrough, dynamicViewVariant, enableSearch, enableNotes, initialWidth, initialHeight, reduceGraphics, renderIcon, where, reactFlowProps, renderNodes, children, }: LikeC4DiagramProps<A>): JSX_2.Element;
 
 export declare interface LikeC4DiagramEventHandlers<A extends Any_2 = Unknown> {
     onNavigateTo?: OnNavigateTo<A> | null | undefined;
@@ -2581,7 +3078,7 @@ export declare type LikeC4EditorProviderProps = PropsWithChildren<{
 /**
  * Ensures LikeC4Model context
  */
-export declare function LikeC4ModelProvider({ children, likec4model, }: PropsWithChildren<LikeC4ModelProviderProps>): JSX.Element;
+export declare function LikeC4ModelProvider({ children, likec4model, }: PropsWithChildren<LikeC4ModelProviderProps>): JSX_2.Element;
 
 export declare interface LikeC4ModelProviderProps {
     likec4model: LikeC4Model<any>;
@@ -2592,7 +3089,7 @@ declare type LikeC4ProjectsContext = {
     onProjectChange: (id: ProjectId) => void;
 };
 
-export declare function LikeC4ProjectsOverview({ view, className, onNavigateToProject, ...props }: LikeC4ProjectsOverviewProps): JSX.Element;
+export declare function LikeC4ProjectsOverview({ view, className, onNavigateToProject, ...props }: LikeC4ProjectsOverviewProps): JSX_2.Element;
 
 export declare type LikeC4ProjectsOverviewProps = Simplify<ProjectsOverviewProps & {
     className?: string;
@@ -2602,7 +3099,7 @@ export declare type LikeC4ProjectsOverviewProps = Simplify<ProjectsOverviewProps
 /**
  * Ensures LikeC4Projects context
  */
-export declare function LikeC4ProjectsProvider({ children, projects, onProjectChange: _onProjectChange, }: PropsWithChildren<LikeC4ProjectsProviderProps>): JSX.Element;
+export declare function LikeC4ProjectsProvider({ children, projects, onProjectChange: _onProjectChange, }: PropsWithChildren<LikeC4ProjectsProviderProps>): JSX_2.Element;
 
 export declare interface LikeC4ProjectsProviderProps {
     /**
@@ -2624,7 +3121,7 @@ export declare interface LikeC4ProjectsProviderProps {
  *
  * Component is wrapped in ShadowRoot to isolate styles.
  */
-export declare function LikeC4View<A extends t.aux.Any = t.aux.UnknownLayouted>({ viewId, className, pannable, zoomable, keepAspectRatio, colorScheme, injectFontCss, controls, layoutType: initialLayoutType, background, browser, showNavigationButtons, enableNotations, enableFocusMode, enableDynamicViewWalkthrough, enableElementDetails, enableRelationshipDetails, enableRelationshipBrowser, enableNotes, reduceGraphics, mantineTheme, styleNonce, style, reactFlowProps, renderNodes, children, ...props }: LikeC4ViewProps<A>): JSX.Element;
+export declare function LikeC4View<A extends t.aux.Any = t.aux.UnknownLayouted>({ viewId, className, pannable, zoomable, keepAspectRatio, colorScheme, injectFontCss, controls, layoutType: initialLayoutType, background, browser, showNavigationButtons, enableNotations, enableFocusMode, enableDynamicViewWalkthrough, enableElementDetails, enableRelationshipDetails, enableRelationshipBrowser, enableNotes, reduceGraphics, mantineTheme, styleNonce, style, reactFlowProps, renderNodes, children, ...props }: LikeC4ViewProps<A>): JSX_2.Element;
 
 export declare interface LikeC4ViewProps<A extends t.aux.Any = t.aux.UnknownLayouted> {
     /**
@@ -2815,6 +3312,8 @@ declare type MachineConfig<TContext extends MachineContext, TEvent extends Event
     /** The machine's own version. */
     version?: string;
     output?: Mapper<TContext, DoneStateEvent, TOutput, TEvent> | TOutput;
+    /** Runtime options for machine execution. */
+    options?: MachineOptions;
 }) & (MachineContext extends TContext ? {
     context?: InitialContext<LowInfer<TContext>, TActor, TInput, TEvent>;
 } : {
@@ -2850,6 +3349,32 @@ declare interface MachineImplementationsSimplified<TContext extends MachineConte
     delays: DelayFunctionMap<TContext, TEvent, TAction>;
 }
 
+/**
+ * Runtime options for state machine execution.
+ *
+ * @example
+ *
+ * ```ts
+ * const machine = createMachine({
+ *   // ... machine config
+ *   options: {
+ *     maxIterations: 5000
+ *     // other runtime options can be added here
+ *   }
+ * });
+ * ```
+ */
+declare interface MachineOptions {
+    /**
+     * Maximum number of microsteps allowed before throwing an infinite loop
+     * error. Defaults to `Infinity` (no limit). Set to a finite number to enable
+     * infinite loop detection.
+     *
+     * @default Infinity
+     */
+    maxIterations?: number;
+}
+
 declare type MachineSnapshot<TContext extends MachineContext, TEvent extends EventObject, TChildren extends Record<string, AnyActorRef | undefined>, TStateValue extends StateValue, TTag extends string, TOutput, TMeta extends MetaObject, TStateSchema extends StateSchema> = ActiveMachineSnapshot<TContext, TEvent, TChildren, TStateValue, TTag, TOutput, TMeta, TStateSchema> | DoneMachineSnapshot<TContext, TEvent, TChildren, TStateValue, TTag, TOutput, TMeta, TStateSchema> | ErrorMachineSnapshot<TContext, TEvent, TChildren, TStateValue, TTag, TOutput, TMeta, TStateSchema> | StoppedMachineSnapshot<TContext, TEvent, TChildren, TStateValue, TTag, TOutput, TMeta, TStateSchema>;
 
 declare interface MachineSnapshotBase<TContext extends MachineContext, TEvent extends EventObject, TChildren extends Record<string, AnyActorRef | undefined>, TStateValue extends StateValue, TTag extends string, TOutput, TMeta, TStateSchema extends StateSchema = StateSchema> {
@@ -2953,6 +3478,9 @@ export declare const Markdown: ForwardRefExoticComponent<Omit<Omit< DetailedHTML
     emptyText?: string;
 } & RefAttributes<HTMLDivElement>>;
 
+declare interface MediaPrintActorLogic extends CallbackActorLogic<AnyEventObject, NonReducibleUnknown, MediaPrintEvent> {
+}
+
 declare type MediaPrintEvent = {
     type: 'media.print.on';
 } | {
@@ -2984,7 +3512,7 @@ declare interface NavigationHistoryEntry_2 {
     };
     focusedNode?: NodeId | null;
     dynamicViewVariant?: DynamicViewDisplayVariant | null;
-    activeWalkthrough?: null | StepEdgeId;
+    activeWalkthrough?: null | StepPath;
 }
 
 export declare const NavigationPanel: {
@@ -2995,6 +3523,14 @@ export declare const NavigationPanel: {
     Dropdown: StyleContextConsumer<ForwardRefComponent<"div", HTMLMotionProps<"div">>>;
 };
 
+declare interface NavigationPanelActorLogic extends StateMachine<Context_4, Events_4, any, any, any, any, any, StateValueFrom<typeof _actorLogic>, Tags_3, Input_3, any, any, any, any> {
+}
+
+declare interface NavigationPanelActorRef extends ActorRef<NavigationPanelActorSnapshot, Events_4, never> {
+}
+
+declare type NavigationPanelActorSnapshot = SnapshotFrom<NavigationPanelActorLogic>;
+
 declare type NodeId_2 = t.aux.NodeId;
 
 export declare type NodeRenderers = Partial<CamelCasedProperties<Types.NodeRenderers>>;
@@ -3179,7 +3715,7 @@ export declare type OverlayProps = PropsWithChildren<{
 
 declare namespace Overlays {
     namespace ElementDetails {
-        interface Input extends Input_2 {
+        interface Input extends ElementDetailsInput {
         }
         interface Logic extends ElementDetailsLogic {
         }
@@ -3187,14 +3723,14 @@ declare namespace Overlays {
         }
     }
     namespace RelationshipDetails {
-        type Input = Input_4;
+        type Input = Input_2;
         interface Logic extends RelationshipDetailsLogic {
         }
         interface ActorRef extends RelationshipDetailsActorRef {
         }
     }
     namespace RelationshipsBrowser {
-        interface Input extends Input_3 {
+        interface Input extends Input {
         }
         interface Logic extends RelationshipsBrowserLogic {
         }
@@ -3231,7 +3767,7 @@ declare interface OverlaysContext {
     }>;
 }
 
-declare type OverrideReactFlowProps = Pick<ReactFlowProps<Types.AnyNode, Types.AnyEdge>, 'paneClickDistance' | 'nodeClickDistance' | 'selectionKeyCode' | 'panActivationKeyCode' | 'multiSelectionKeyCode' | 'zoomActivationKeyCode' | 'snapToGrid' | 'snapGrid' | 'onlyRenderVisibleElements' | 'nodesDraggable' | 'nodesFocusable' | 'elementsSelectable' | 'selectNodesOnDrag' | 'panOnDrag' | 'preventScrolling' | 'zoomOnScroll' | 'zoomOnPinch' | 'panOnScroll' | 'panOnScrollSpeed' | 'panOnScrollMode' | 'zoomOnDoubleClick' | 'nodeDragThreshold'>;
+declare type OverrideReactFlowProps = Pick<ReactFlowProps<Types.AnyNode, Types.AnyEdge>, 'paneClickDistance' | 'nodeClickDistance' | 'selectionKeyCode' | 'panActivationKeyCode' | 'multiSelectionKeyCode' | 'zoomActivationKeyCode' | 'snapToGrid' | 'snapGrid' | 'onlyRenderVisibleElements' | 'nodesDraggable' | 'nodesFocusable' | 'elementsSelectable' | 'selectNodesOnDrag' | 'panOnDrag' | 'preventScrolling' | 'zoomOnScroll' | 'zoomOnPinch' | 'panOnScroll' | 'panOnScrollSpeed' | 'panOnScrollMode' | 'zoomOnDoubleClick' | 'nodeDragThreshold' | 'edgesFocusable'>;
 
 export declare type PaddingUnit = 'px' | '%';
 
@@ -3252,7 +3788,7 @@ declare type PickEmittedEvent<T> = T extends DiagramEmittedEvents['type'] ? Diag
  * Picks appropriate bounds from the view,
  * depending on its type and dynamic variant
  */
-export declare function pickViewBounds(view: LayoutedView, dynamicVariant?: DynamicViewDisplayVariant): BBox_2;
+export declare function pickViewBounds(view: LayoutedView, dynamicVariant?: DynamicViewDisplayVariant): BBox_3;
 
 /**
  * PortalToContainer is used to render elements outside the LikeC4DiagramXYFlow, but inside the container.
@@ -3281,6 +3817,16 @@ declare type ProjectsOverviewXYProps = {
     colorScheme?: 'light' | 'dark' | undefined;
 };
 
+declare type PromiseActorLogic<TOutput, TInput = unknown, TEmitted extends EventObject = EventObject> = ActorLogic<PromiseSnapshot<TOutput, TInput>, {
+    type: string;
+    [k: string]: unknown;
+}, TInput, // input
+AnyActorSystem, TEmitted>;
+
+declare type PromiseSnapshot<TOutput, TInput> = Snapshot<TOutput> & {
+    input: TInput | undefined;
+};
+
 declare interface ProvidedActor {
     src: string;
     logic: UnknownActorLogic;
@@ -3293,7 +3839,7 @@ declare interface ProvidedActor {
  *
  * Component is wrapped in ShadowRoot to isolate styles.
  */
-export declare function ReactLikeC4<A extends t.aux.Any = t.aux.UnknownLayouted>({ viewId, layoutType: initialLayoutType, className, colorScheme, injectFontCss, enableNotations, keepAspectRatio, style, mantineTheme, styleNonce, ...props }: ReactLikeC4Props<A>): JSX.Element;
+export declare function ReactLikeC4<A extends t.aux.Any = t.aux.UnknownLayouted>({ viewId, layoutType: initialLayoutType, className, colorScheme, injectFontCss, enableNotations, keepAspectRatio, style, mantineTheme, styleNonce, ...props }: ReactLikeC4Props<A>): JSX_2.Element;
 
 export declare type ReactLikeC4Props<A extends t.aux.Any = t.aux.UnknownLayouted> = {
     viewId: t.aux.ViewId<A>;
@@ -3328,7 +3874,7 @@ export declare type ReactLikeC4Props<A extends t.aux.Any = t.aux.UnknownLayouted
     style?: CSSProperties | undefined;
     mantineTheme?: any;
     /** Function to generate nonce attribute added to all generated `<style />` tags */
-    styleNonce?: string | (() => string) | undefined;
+    styleNonce?: string | (() => string | undefined) | undefined;
     children?: ReactNode | undefined;
 } & Omit<LikeC4DiagramProperties<A>, 'view'> & LikeC4DiagramEventHandlers<A>;
 
@@ -3341,7 +3887,7 @@ declare type RelationId = t.aux.RelationId;
 declare interface RelationshipDetailsActorRef extends ActorRef<RelationshipDetailsSnapshot, Events_3> {
 }
 
-declare interface RelationshipDetailsLogic extends StateMachine<Context_3, Events_3, {}, any, any, any, any, any, Tags_2, Input_4, any, any, any, any> {
+declare interface RelationshipDetailsLogic extends StateMachine<Context_3, Events_3, {}, any, any, any, any, any, Tags_2, Input_2, any, any, any, any> {
 }
 
 declare type RelationshipDetailsSnapshot = SnapshotFrom<RelationshipDetailsLogic>;
@@ -3403,7 +3949,7 @@ declare namespace RelationshipDetailsTypes {
 declare interface RelationshipsBrowserActorRef extends ActorRef<RelationshipsBrowserSnapshot, Events_2> {
 }
 
-declare interface RelationshipsBrowserLogic extends StateMachine<Context_2, Events_2, {}, any, any, any, any, any, Tags, Input_3, any, any, any, any> {
+declare interface RelationshipsBrowserLogic extends StateMachine<Context_2, Events_2, {}, any, any, any, any, any, Tags, Input, any, any, any, any> {
 }
 
 declare type RelationshipsBrowserSnapshot = SnapshotFrom<RelationshipsBrowserLogic>;
@@ -3544,7 +4090,7 @@ declare interface ScheduledEvent {
     target: AnyActorRef;
 }
 
-declare interface Scheduler {
+declare interface Scheduler_2 {
     schedule(source: AnyActorRef, target: AnyActorRef, event: EventObject, delay: number, id: string | undefined): void;
     cancel(source: AnyActorRef, id: string): void;
     cancelAll(actorRef: AnyActorRef): void;
@@ -3581,7 +4127,7 @@ declare type SearchActorSnapshot = SnapshotFrom<SearchActorLogic>;
 
 export declare const searchBodyCss: string;
 
-export declare const SearchContext: Context_4<SearchContextValue | null>;
+export declare const SearchContext: Context_5<SearchContextValue | null>;
 
 declare interface SearchContext_2 {
     openedWithSearch: string | null;
@@ -3608,7 +4154,7 @@ export declare interface SearchContextValue {
 
 export declare function SearchControl({ className, ...others }: SearchControlProps): JSX.Element;
 
-declare interface SearchControlProps extends UnstyledButtonProps, ElementProps<'button'> {
+declare interface SearchControlProps extends Omit<UnstyledButtonProps, 'className'>, ElementProps<'button'> {
 }
 
 export declare const searchDialogCss: string;
@@ -3619,6 +4165,60 @@ export declare const searchDialogCss: string;
  */
 export declare const SearchPanelContent: ForwardRefExoticComponent<RefAttributes<HTMLDivElement>>;
 
+/**
+ * Tuple type for selector and compare function pair
+ */
+declare type SelectAndCompare<A, B> = [
+selector: (snapshot: A) => B,
+compare: (a: B, b: B) => boolean
+];
+
+export declare const selectDiagramContext: <T>(select: (state: DiagramContext) => T, compare?: ((old: NoInfer<T>, next: NoInfer<T>) => boolean) | undefined) => SelectAndCompare< MachineSnapshot<DiagramContext, DiagramEvents, {
+    overlays: OverlaysActorRef | undefined;
+    search: SearchActorRef | undefined;
+    editor: BaseEditorActorRef | undefined;
+    navigationPanel: NavigationPanelActorRef | undefined;
+} & Omit<{
+    hotkey: ActorRefFromLogic<HotkeyActorLogic> | undefined;
+    overlays: ActorRefFromLogic<OverlaysActorLogic> | undefined;
+    search: ActorRefFromLogic<SearchActorLogic> | undefined;
+    mediaPrint: ActorRefFromLogic<MediaPrintActorLogic> | undefined;
+    editor: ActorRefFromLogic<EditorActorLogic> | undefined;
+    navigationPanel: ActorRefFromLogic<NavigationPanelActorLogic> | undefined;
+}, "search" | "overlays" | "editor" | "navigationPanel">, "final" | "isReady" | "navigating" | "ready" | "initializing" | {
+    ready?: NonNullable<"idle" | "walkthrough" | "focused" | "printing">;
+}, never, never, never, never>, T>;
+
+export declare const selectDiagramSnapshot: <T>(select: (state: MachineSnapshot<DiagramContext, DiagramEvents, {
+    overlays: OverlaysActorRef | undefined;
+    search: SearchActorRef | undefined;
+    editor: BaseEditorActorRef | undefined;
+    navigationPanel: NavigationPanelActorRef | undefined;
+} & Omit<{
+    hotkey: ActorRefFromLogic<HotkeyActorLogic> | undefined;
+    overlays: ActorRefFromLogic<OverlaysActorLogic> | undefined;
+    search: ActorRefFromLogic<SearchActorLogic> | undefined;
+    mediaPrint: ActorRefFromLogic<MediaPrintActorLogic> | undefined;
+    editor: ActorRefFromLogic<EditorActorLogic> | undefined;
+    navigationPanel: ActorRefFromLogic<NavigationPanelActorLogic> | undefined;
+}, "search" | "overlays" | "editor" | "navigationPanel">, "final" | "isReady" | "navigating" | "ready" | "initializing" | {
+    ready?: NonNullable<"idle" | "walkthrough" | "focused" | "printing">;
+}, never, never, never, never>) => T, compare?: ((old: NoInfer<T>, next: NoInfer<T>) => boolean) | undefined) => SelectAndCompare< MachineSnapshot<DiagramContext, DiagramEvents, {
+    overlays: OverlaysActorRef | undefined;
+    search: SearchActorRef | undefined;
+    editor: BaseEditorActorRef | undefined;
+    navigationPanel: NavigationPanelActorRef | undefined;
+} & Omit<{
+    hotkey: ActorRefFromLogic<HotkeyActorLogic> | undefined;
+    overlays: ActorRefFromLogic<OverlaysActorLogic> | undefined;
+    search: ActorRefFromLogic<SearchActorLogic> | undefined;
+    mediaPrint: ActorRefFromLogic<MediaPrintActorLogic> | undefined;
+    editor: ActorRefFromLogic<EditorActorLogic> | undefined;
+    navigationPanel: ActorRefFromLogic<NavigationPanelActorLogic> | undefined;
+}, "search" | "overlays" | "editor" | "navigationPanel">, "final" | "isReady" | "navigating" | "ready" | "initializing" | {
+    ready?: NonNullable<"idle" | "walkthrough" | "focused" | "printing">;
+}, never, never, never, never>, T>;
+
 export declare function SequenceActorNode(props: Types.NodeProps<'seq-actor'>): JSX.Element;
 
 export declare function sequenceActorNode<A extends Any_5 = Unknown_3>(component: FC<SequenceActorNodeProps<A>>): Types.NodeRenderer<'seq-actor'>;
@@ -3630,9 +4230,9 @@ export declare type SequenceActorNodeProps<A extends Any_5 = Unknown_3> = {
 
 export declare function SequenceParallelArea(props: Types.NodeProps<'seq-parallel'>): JSX.Element;
 
-declare function setData<E extends WithData<any>>(value: E, state: Partial<E['data']>): E;
+declare function setData<E extends WithData<any>>(value: E, data: Partial<E['data']>): E;
 
-declare function setData<E extends WithData<any>>(state: Partial<NoInfer<E['data']>>): (value: E) => E;
+declare function setData<E extends WithData<any>>(state: Partial<NoInfer<E>['data']>): (value: E) => E;
 
 declare function setDimmed<T extends WithDimmed>(value: T, dimmed: 'immediate' | boolean): T;
 
@@ -3721,6 +4321,8 @@ options?: {
 }
 ], IsNotNever<RequiredActorOptions<TActor>>> : never;
 
+declare type StateFrom<T extends AnyStateMachine | ((...args: any[]) => AnyStateMachine)> = T extends AnyStateMachine ? ReturnType<T['transition']> : T extends (...args: any[]) => AnyStateMachine ? ReturnType<ReturnType<T>['transition']> : never;
+
 declare type StateId<TSchema extends StateSchema, TKey extends string = '(machine)', TParentKey extends string | null = null> = (TSchema extends {
     id: string;
 } ? TSchema['id'] : TParentKey extends null ? TKey : `${TParentKey}.${TKey}`) | (TSchema['states'] extends Record<string, any> ? Values<{
@@ -3737,6 +4339,8 @@ declare class StateMachine<TContext extends MachineContext, TEvent extends Event
     version?: string;
     schemas: unknown;
     implementations: MachineImplementationsSimplified<TContext, TEvent>;
+    /** Runtime options for machine execution. */
+    options: MachineOptions;
     root: StateNode<TContext, TEvent>;
     id: string;
     states: StateNode<TContext, TEvent>['states'];
@@ -4072,6 +4676,8 @@ declare type StatesDefinition<TContext extends MachineContext, TEvent extends Ev
  */
 declare type StateValue = string | StateValueMap;
 
+declare type StateValueFrom<TMachine extends AnyStateMachine> = Parameters<StateFrom<TMachine>['matches']>[0];
+
 declare interface StateValueMap {
     [key: string]: StateValue | undefined;
 }
@@ -4089,7 +4695,7 @@ declare interface StoppedMachineSnapshot<TContext extends MachineContext, TEvent
 declare type StrictViewId<A> = t.aux.StrictViewId<A>;
 
 declare type Subject = {
-    edgeId: EdgeId_2;
+    edgeId: EdgeId;
     source?: never;
     target?: never;
 } | {
@@ -4116,7 +4722,8 @@ declare type System = ActorSystem<{
         diagram: DiagramMachineRef;
         overlays: OverlaysActorRef;
         search: SearchActorRef;
-        editor: EditorActorRef;
+        editor: BaseEditorActorRef;
+        navigationPanel: NavigationPanelActorRef;
     };
 }>;
 
@@ -4124,6 +4731,8 @@ declare type Tags = 'active';
 
 declare type Tags_2 = never;
 
+declare type Tags_3 = 'active';
+
 declare type TODO = any;
 
 declare type TogglableFeature = ('ReadOnly' | 'CompareWithLatest') & FeatureName;
@@ -4224,6 +4833,7 @@ export declare namespace Types {
         height: number;
         type: 'target' | 'source';
         position: 'left' | 'right' | 'top' | 'bottom';
+        hidden?: boolean;
     };
     export type SequenceActorNodeData = Simplify<LeafNodeData & {
         navigateTo: ViewId | null;
@@ -4231,6 +4841,34 @@ export declare namespace Types {
         ports: Array<SequenceActorNodePort>;
         viewHeight: number;
     }>;
+    /**
+     * Represents subflow area in the diagram
+     * `try` and `alt` flows have special handling in the diagram
+     */
+    export type SequenceSubflowData = LeafNodeData & {
+        flowId: StepPath;
+        title: string | undefined;
+        /**
+         * This is first subflow in current flow
+         */
+        isFirst?: boolean | undefined;
+        /**
+         * This is last subflow in current flow
+         */
+        isLast?: boolean | undefined;
+        collapsed: boolean;
+    } & ({
+        flowType: Exclude<DynamicViewFlow.SubFlowType, 'try' | 'alt'>;
+    } | SequenceSubflowData.AltOrTry);
+    export namespace SequenceSubflowData {
+        export type AltOrTry = {
+            flowType: 'try' | 'alt';
+            headerHeight: number;
+        };
+    }
+    /**
+     * @deprecated Use {@link SequenceSubflowData} instead
+     */
     export type SequenceParallelAreaData = Simplify<LeafNodeData & {
         parallelPrefix: string;
     }>;
@@ -4273,10 +4911,11 @@ export declare namespace Types {
     export type DeploymentElementNode = BaseNode<DeploymentElementNodeData, 'deployment'>;
     export type SequenceActorNode = BaseNode<SequenceActorNodeData, 'seq-actor'>;
     export type SequenceParallelArea = BaseNode<SequenceParallelAreaData, 'seq-parallel'>;
+    export type SequenceSubflowArea = BaseNode<SequenceSubflowData, 'seq-subflow'>;
     export type CompoundElementNode = BaseNode<CompoundElementNodeData, 'compound-element'>;
     export type CompoundDeploymentNode = BaseNode<CompoundDeploymentNodeData, 'compound-deployment'>;
     export type ViewGroupNode = BaseNode<ViewGroupNodeData, 'view-group'>;
-    export type AnyNode = ElementNode | DeploymentElementNode | CompoundElementNode | CompoundDeploymentNode | ViewGroupNode | SequenceActorNode | SequenceParallelArea;
+    export type AnyNode = ElementNode | DeploymentElementNode | CompoundElementNode | CompoundDeploymentNode | ViewGroupNode | SequenceActorNode | SequenceParallelArea | SequenceSubflowArea;
     export type NodeType = AnyNode['type'];
     export type NodeData = ExclusiveUnion<{
         ElementNodeData: ElementNodeData;
@@ -4286,6 +4925,7 @@ export declare namespace Types {
         ViewGroupNodeData: ViewGroupNodeData;
         SequenceActorNodeData: SequenceActorNodeData;
         SequenceParallelAreaData: SequenceParallelAreaData;
+        SequenceSubflowAreaData: SequenceSubflowData;
     }>;
     export type Node<Type extends NodeType = NodeType> = Extract<AnyNode, {
         type: Type;
@@ -4294,12 +4934,27 @@ export declare namespace Types {
     export type RelationshipEdgeData = Simplify<BaseEdgeData & NonOptional<Pick<DiagramEdge, 'id' | 'label' | 'labelBBox' | 'technology' | 'points' | 'dir' | 'color' | 'line' | 'head' | 'tail' | 'navigateTo' | 'astPath' | 'drifts'>> & {
         notes: MarkdownOrString | null;
         labelXY: XYPosition | null;
+        isLabelCustomized?: boolean | undefined;
         controlPoints: XYPosition[] | undefined | null;
+        /**
+         * When dynamic view in "diagram" variant
+         * Edges are RelationshipEdgeData - stepnum is used to determine the step number
+         * (backward compatibility)
+         */
+        stepnum?: number;
     }>;
-    export type SequenceStepEdgeData = Simplify<BaseEdgeData & NonOptional<Pick<DiagramEdge, 'id' | 'label' | 'technology' | 'points' | 'dir' | 'color' | 'line' | 'head' | 'tail' | 'navigateTo' | 'astPath' | 'drifts'>> & {
+    export type SequenceStepEdgeData = Simplify<BaseEdgeData & NonOptional<Pick<DiagramEdge, 'label' | 'technology' | 'points' | 'dir' | 'color' | 'line' | 'head' | 'tail' | 'navigateTo' | 'astPath' | 'drifts'>> & {
+        id: StepPath;
+        state?: 'processed' | 'active' | 'skipped' | 'pending' | null;
+        stepnum: number;
+        parentFlow: null | {
+            id: StepPath;
+            type: DynamicViewFlow.SubFlowType;
+        };
         notes: MarkdownOrString | null;
         labelXY: XYPosition | null;
         labelBBox: BBox;
+        isLabelCustomized?: boolean | undefined;
         controlPoints: XYPosition[] | undefined | null;
     }>;
     export type RelationshipEdge = BaseEdge<RelationshipEdgeData, 'relationship'>;
@@ -4381,15 +5036,64 @@ export declare function useCurrentViewModel(): CurrentViewModel;
 
 export declare function useDiagram(): DiagramApi;
 
-export declare function useDiagramActorRef(): DiagramActorRef;
+export declare const useDiagramActorRef: () => DiagramActorRef;
 
 /**
  * Read diagram context
+ * @deprecated use {@link useDiagramSelector}
  */
 export declare function useDiagramContext<T = unknown>(selector: (context: DiagramContext) => T, compare?: (a: NoInfer<T>, b: NoInfer<T>) => boolean, deps?: DependencyList): T;
 
 export declare function useDiagramEventHandlers(): DiagramEventHandlersContext;
 
+export declare const useDiagramSelector: {
+    <T>(select: (state: MachineSnapshot<DiagramContext, DiagramEvents, {
+        overlays: OverlaysActorRef | undefined;
+        search: SearchActorRef | undefined;
+        editor: BaseEditorActorRef | undefined;
+        navigationPanel: NavigationPanelActorRef | undefined;
+    } & Omit<{
+        hotkey: ActorRefFromLogic<HotkeyActorLogic> | undefined;
+        overlays: ActorRefFromLogic<OverlaysActorLogic> | undefined;
+        search: ActorRefFromLogic<SearchActorLogic> | undefined;
+        mediaPrint: ActorRefFromLogic<MediaPrintActorLogic> | undefined;
+        editor: ActorRefFromLogic<EditorActorLogic> | undefined;
+        navigationPanel: ActorRefFromLogic<NavigationPanelActorLogic> | undefined;
+    }, "search" | "overlays" | "editor" | "navigationPanel">, "final" | "isReady" | "navigating" | "ready" | "initializing" | {
+        ready?: NonNullable<"idle" | "walkthrough" | "focused" | "printing">;
+    }, never, never, never, never>) => T): T;
+    <T>(selectorCompare: SelectAndCompare< MachineSnapshot<DiagramContext, DiagramEvents, {
+        overlays: OverlaysActorRef | undefined;
+        search: SearchActorRef | undefined;
+        editor: BaseEditorActorRef | undefined;
+        navigationPanel: NavigationPanelActorRef | undefined;
+    } & Omit<{
+        hotkey: ActorRefFromLogic<HotkeyActorLogic> | undefined;
+        overlays: ActorRefFromLogic<OverlaysActorLogic> | undefined;
+        search: ActorRefFromLogic<SearchActorLogic> | undefined;
+        mediaPrint: ActorRefFromLogic<MediaPrintActorLogic> | undefined;
+        editor: ActorRefFromLogic<EditorActorLogic> | undefined;
+        navigationPanel: ActorRefFromLogic<NavigationPanelActorLogic> | undefined;
+    }, "search" | "overlays" | "editor" | "navigationPanel">, "final" | "isReady" | "navigating" | "ready" | "initializing" | {
+        ready?: NonNullable<"idle" | "walkthrough" | "focused" | "printing">;
+    }, never, never, never, never>, T>): T;
+    <T>(selector: (snapshot: MachineSnapshot<DiagramContext, DiagramEvents, {
+        overlays: OverlaysActorRef | undefined;
+        search: SearchActorRef | undefined;
+        editor: BaseEditorActorRef | undefined;
+        navigationPanel: NavigationPanelActorRef | undefined;
+    } & Omit<{
+        hotkey: ActorRefFromLogic<HotkeyActorLogic> | undefined;
+        overlays: ActorRefFromLogic<OverlaysActorLogic> | undefined;
+        search: ActorRefFromLogic<SearchActorLogic> | undefined;
+        mediaPrint: ActorRefFromLogic<MediaPrintActorLogic> | undefined;
+        editor: ActorRefFromLogic<EditorActorLogic> | undefined;
+        navigationPanel: ActorRefFromLogic<NavigationPanelActorLogic> | undefined;
+    }, "search" | "overlays" | "editor" | "navigationPanel">, "final" | "isReady" | "navigating" | "ready" | "initializing" | {
+        ready?: NonNullable<"idle" | "walkthrough" | "focused" | "printing">;
+    }, never, never, never, never>) => T, compare: (a: T, b: T) => boolean): T;
+};
+
 export declare function useEnabledFeatures(): EnabledFeatures;
 
 /**
@@ -4575,6 +5279,21 @@ declare type WithHovered = {
     };
 };
 
+export declare const xyflow: {
+    readonly ControlButton: typeof ControlButton;
+    readonly MiniMap: {
+        ({ style, className, nodeStrokeColor, nodeColor, nodeClassName, nodeBorderRadius, nodeStrokeWidth, nodeComponent, bgColor, maskColor, maskStrokeColor, maskStrokeWidth, position, onClick, onNodeClick, pannable, zoomable, ariaLabel, inversePan, zoomStep, offsetScale, }: MiniMapProps<Types.AnyNode>): JSX.Element;
+        displayName: string;
+    };
+    readonly MiniMapNode: MemoExoticComponent<({ id, x, y, width, height, style, color, strokeColor, strokeWidth, className, borderRadius, shapeRendering, selected, onClick, }: MiniMapNodeProps) => JSX.Element>;
+    readonly NodeToolbar: typeof NodeToolbar;
+    readonly Panel: ForwardRefExoticComponent< HTMLAttributes<HTMLDivElement> & {
+        position?: PanelPosition;
+    } & RefAttributes<HTMLDivElement>>;
+    readonly Position: typeof Position;
+    readonly ViewportPortal: typeof ViewportPortal;
+};
+
 declare type XYFLowInstance = ReactFlowInstance<RelationshipsBrowserTypes.AnyNode, RelationshipsBrowserTypes.Edge>;
 
 declare type XYFlowInstance = ReactFlowInstance<Types.AnyNode, Types.AnyEdge>;
@@ -4582,18 +5301,18 @@ declare type XYFlowInstance = ReactFlowInstance<Types.AnyNode, Types.AnyEdge>;
 declare type XYFLowInstance_2 = ReactFlowInstance<RelationshipDetailsTypes.AnyNode, RelationshipDetailsTypes.Edge>;
 
 declare type XYStoreApi = {
-    getState: () => XYStoreState;
-    setState: (state: Partial<XYStoreState> | ((state: XYStoreState) => Partial<XYStoreState>)) => void;
-    subscribe: (listener: (state: XYStoreState, prevState: XYStoreState) => void) => () => void;
+    getState: () => XYStoreState_2;
+    setState: (state: XYStoreState_2) => void;
 };
 
 declare type XYStoreApi_2 = {
-    getState: () => XYStoreState_2;
-    setState: (state: XYStoreState_2) => void;
+    getState: () => XYStoreState_3;
 };
 
 declare type XYStoreApi_3 = {
-    getState: () => XYStoreState_3;
+    getState: () => XYStoreState;
+    setState: (state: Partial<XYStoreState> | ((state: XYStoreState) => Partial<XYStoreState>)) => void;
+    subscribe: (listener: (state: XYStoreState, prevState: XYStoreState) => void) => () => void;
 };
 
 export declare type XYStoreState = ReactFlowState<Types.AnyNode, Types.AnyEdge>;