likec4 1.56.0 → 1.57.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "likec4",
   "description": "Toolchain for your architecture diagrams",
-  "version": "1.56.0",
+  "version": "1.57.0",
   "license": "MIT",
   "homepage": "https://likec4.dev",
   "author": "Denis Davydkov <denis@davydkov.com>",
@@ -20,11 +20,10 @@
     "graph"
   ],
   "engines": {
-    "node": ">=22.22.0"
+    "node": ">=22.22.3"
   },
   "bugs": "https://github.com/likec4/likec4/issues",
   "type": "module",
-  "bin": "./bin/likec4.mjs",
   "exports": {
     ".": {
       "sources": "./src/index.ts",
@@ -91,9 +90,8 @@
   },
   "dependencies": {
     "@hpcc-js/wasm-graphviz": "1.21.2",
-    "@vitejs/plugin-react": "^6.0.1",
+    "@vitejs/plugin-react": "^6.0.2",
     "bundle-require": "^5.1.0",
-    "react-compiler-runtime": "^1.0.0",
     "esbuild": "0.27.4",
     "fdir": "6.4.0",
     "playwright": "^1.58.2",
@@ -102,38 +100,56 @@
     "std-env": "^3.10.0",
     "type-fest": "^4.41.0",
     "vite-plugin-singlefile": "^2.3.2",
-    "vite": "^8.0.10",
+    "vite": "^8.0.14",
     "yargs": "17.7.2",
     "nano-spawn": "^2.0.0",
-    "@likec4/core": "1.56.0",
+    "use-sync-external-store": "^1.6.0",
+    "react-compiler-runtime": "^1.0.0",
+    "@likec4/core": "1.57.0",
     "@likec4/icons": "1.46.4"
   },
   "peerDependencies": {
+    "@tanstack/ai": "^0.14.0",
+    "@tanstack/ai-anthropic": "^0.8.3",
+    "@tanstack/ai-gemini": "^0.10.0",
+    "@tanstack/ai-openai": "^0.8.2",
+    "@tanstack/ai-ollama": "^0.6.10",
+    "@tanstack/ai-openrouter": "^0.8.2",
     "react": "^18.x || ^19.x",
     "react-dom": "^18.x || ^19.x"
   },
+  "peerDependenciesMeta": {
+    "@tanstack/ai": {
+      "optional": true
+    },
+    "@tanstack/ai-anthropic": {
+      "optional": true
+    },
+    "@tanstack/ai-gemini": {
+      "optional": true
+    },
+    "@tanstack/ai-openai": {
+      "optional": true
+    },
+    "@tanstack/ai-ollama": {
+      "optional": true
+    },
+    "@tanstack/ai-openrouter": {
+      "optional": true
+    }
+  },
   "devDependencies": {
     "langium": "3.5.0",
     "@dagrejs/dagre": "1.1.8",
     "@fontsource-variable/ibm-plex-sans": "^5.2.8",
-    "@mantine/core": "9.1.0",
-    "@mantine/hooks": "9.1.0",
-    "@pandacss/dev": "^1.9.1",
-    "@react-hookz/web": "^25.2.0",
-    "@tabler/icons-react": "3.40.0",
-    "@tanstack/react-router": "^1.114.13",
-    "@tanstack/router-cli": "^1.114.13",
-    "@tanstack/router-vite-plugin": "^1.114.13",
-    "@types/node": "~22.19.17",
+    "@pandacss/dev": "^1.11.1",
+    "@tanstack/ai": "^0.14.0",
+    "@types/node": "~22.19.19",
     "@types/picomatch": "^4.0.3",
-    "@types/react": "19.2.14",
+    "@types/react": "19.2.15",
     "@types/react-dom": "19.2.3",
     "@types/semver": "^7.7.1",
     "@types/yargs": "^17.0.33",
-    "@xstate/react": "6.1.0",
-    "@xstate/store": "3.17.1",
-    "@xyflow/react": "12.10.2",
-    "@xyflow/system": "0.0.76",
     "autoprefixer": "^10.4.27",
     "picomatch": "^4.0.4",
     "birpc": "^4.0.0",
@@ -145,13 +161,10 @@
     "esm-env": "^1.2.2",
     "fast-equals": "^6.0.0",
     "get-port": "^7.1.0",
-    "html-to-image": "1.11.11",
     "is-inside-container": "^1.0.0",
     "json5": "^2.2.3",
     "ky": "^1.14.3",
-    "merge-error-cause": "^5.0.2",
     "mkdirp": "^3.0.1",
-    "motion": "^12.36.0",
     "npm-run-all2": "^8.0.4",
     "p-limit": "7.3.0",
     "nanostores": "1.2.0",
@@ -159,25 +172,24 @@
     "oxlint": "1.59.0",
     "package-manager-detector": "1.6.0",
     "package-up": "^5.0.0",
-    "postcss": "8.5.10",
+    "postcss": "8.5.15",
     "pretty-ms": "^9.3.0",
-    "react": "19.2.4",
-    "react-dom": "19.2.4",
+    "react": "19.2.6",
+    "react-dom": "19.2.6",
     "react-error-boundary": "^6.1.1",
-    "react-resizable-panels": "^4.7.3",
-    "react-shadow": "^20.6.0",
+    "react-resizable-panels": "^4.11.1",
     "remeda": "^2.33.7",
     "semver": "^7.7.4",
     "strip-indent": "^4.1.1",
     "tinyrainbow": "^3.1.0",
     "tsx": "4.21.0",
-    "turbo": "2.9.6",
+    "turbo": "2.9.14",
     "typescript": "5.9.3",
     "ufo": "1.6.3",
-    "tsdown": "^0.21.10",
-    "vite-plugin-dts": "^4.5.4",
+    "tsdown": "^0.22.0",
+    "vite-plugin-dts": "^5.0.1",
     "vitest": "4.1.3",
-    "vscode-jsonrpc": "8.2.1",
+    "vscode-jsonrpc": "8.2.0",
     "vscode-languageserver": "9.0.1",
     "vscode-languageserver-types": "3.17.5",
     "vscode-uri": "3.1.0",
@@ -185,23 +197,22 @@
     "wireit": "0.14.12",
     "zod": "^4.3.6",
     "zx": "8.8.5",
-    "xstate": "5.30.0",
-    "@likec4/leanix-bridge": "1.56.0",
-    "@likec4/log": "1.56.0",
-    "@likec4/config": "1.56.0",
-    "@likec4/language-services": "1.56.0",
-    "@likec4/language-server": "1.56.0",
-    "@likec4/mcp": "1.56.0",
-    "@likec4/devops": "1.42.0",
-    "@likec4/layouts": "1.56.0",
-    "@likec4/vite-plugin": "1.56.0",
-    "@likec4/diagram": "1.56.0",
-    "@likec4/react": "1.56.0",
-    "@likec4/generators": "1.56.0",
-    "@likec4/spa": "1.56.0",
-    "@likec4/style-preset": "1.56.0",
-    "@likec4/styles": "1.56.0",
-    "@likec4/tsconfig": "1.56.0"
+    "@likec4/config": "1.57.0",
+    "@likec4/leanix-bridge": "1.57.0",
+    "@likec4/log": "1.57.0",
+    "@likec4/language-server": "1.57.0",
+    "@likec4/mcp": "1.57.0",
+    "@likec4/language-services": "1.57.0",
+    "@likec4/devops": "1.57.0",
+    "@likec4/diagram": "1.57.0",
+    "@likec4/layouts": "1.57.0",
+    "@likec4/vite-plugin": "1.57.0",
+    "@likec4/react": "1.57.0",
+    "@likec4/spa": "1.57.0",
+    "@likec4/style-preset": "1.57.0",
+    "@likec4/generators": "1.57.0",
+    "@likec4/styles": "1.57.0",
+    "@likec4/tsconfig": "1.57.0"
   },
   "scripts": {
     "typecheck": "tsc --build --verbose",
@@ -231,5 +242,8 @@
     "test:watch": "vitest"
   },
   "types": "dist/index.d.mts",
-  "module": "dist/index.mjs"
+  "module": "dist/index.mjs",
+  "bin": {
+    "likec4": "./bin/likec4.mjs"
+  }
 }

package/react/index.d.mts

@@ -991,7 +991,21 @@ export declare interface DiagramApi<A extends Any_3 = Unknown_2> {
      * @warning Do not use in render phase
      */
     readonly currentView: t.DiagramView<A>;
+    /**
+     * Editor actor reference
+     * @warning Do not use in render phase
+     */
+    editorActor(): EditorActorRef;
+    /**
+     * Overlays actor reference
+     * @warning Do not use in render phase
+     */
     overlays(): OverlaysActorRef;
+    /**
+     * Search actor reference
+     * @warning Do not use in render phase
+     */
+    searchActor(): SearchActorRef;
     /**
      * Send event to diagram actor
      */
@@ -1425,16 +1439,19 @@ declare type EdgeId_3 = t.aux.EdgeId;
 
 declare interface EditorActorContext {
     viewId: t.ViewId;
-    pendingChanges: t.ViewChange[];
-    history: ReadonlyArray<HistorySnapshot>;
-    /**
-     * The state before editing started
-     */
-    beforeEditing: HistorySnapshot | null;
-    /**
-     * The subject of the edit
-     */
-    editing: 'node' | 'edge' | null;
+    history: LinkedSnapshot | null;
+    editing: null | {
+        /**
+         * The subject of the edit
+         */
+        subject: 'node' | 'edge';
+        /**
+         * The state before editing started
+         */
+        before: Snapshot_2;
+    };
+    syncQueue: Array<SyncOp>;
+    processing: Exclude<SyncOp, 'sync-snapshot'> | null;
 }
 
 declare type EditorActorEmitedEvent = {
@@ -1442,31 +1459,35 @@ declare type EditorActorEmitedEvent = {
 };
 
 declare type EditorActorEvent = {
-    type: 'sync';
-} | {
-    type: 'change';
+    type: 'change.view';
     change: t.ViewChange;
 } | {
-    type: 'edit.start';
-    subject: 'node' | 'edge';
+    type: 'change.semantic-layout';
 } | {
-    type: 'edit.finish';
-    wasChanged?: boolean;
+    type: 'change.latest-to-manual';
 } | {
-    type: 'applyLatestToManual';
+    type: 'change.sync-snapshot';
 } | {
-    type: 'synced';
+    type: 'view.synched';
 } | {
     type: 'cancel';
 } | {
-    type: 'reset';
+    type: 'edit.move.start';
+    subject: 'node' | 'edge';
+} | {
+    type: 'edit.move.end';
+} | {
+    type: 'edit.move.cancel';
 } | HotKeyEvent_2;
 
 declare interface EditorActorInput {
     viewId: t.ViewId;
 }
 
-declare interface EditorActorLogic extends StateMachine<EditorActorContext, EditorActorEvent, any, any, any, any, any, 'idle' | 'editing' | 'pending' | 'afterEdit' | 'applyLatestToManual' | 'executeChanges', any, EditorActorInput, any, EditorActorEmitedEvent, any, any> {
+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 EditorActorRef extends ActorRef<EditorActorSnapshot, EditorActorEvent, EditorActorEmitedEvent> {
@@ -1474,6 +1495,8 @@ declare interface EditorActorRef extends ActorRef<EditorActorSnapshot, EditorAct
 
 declare type EditorActorSnapshot = SnapshotFrom<EditorActorLogic>;
 
+declare type EditorActorStateTag = 'pending' | 'busy' | 'ai-semantic-layout';
+
 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);
@@ -1912,7 +1935,7 @@ declare type ExtractEvent<TEvent extends EventObject, TDescriptor extends EventD
 
 export declare type FeatureName = typeof FeatureNames[number];
 
-declare const FeatureNames: readonly ["Controls", "Editor", "ReadOnly", "FocusMode", "NavigateTo", "ElementDetails", "RelationshipDetails", "RelationshipBrowser", "Search", "NavigationButtons", "Notations", "DynamicViewWalkthrough", "FitView", "CompareWithLatest", "Notes", "Vscode", "ElementTags"];
+declare const FeatureNames: readonly ["Controls", "Editor", "AISemanticLayout", "ReadOnly", "FocusMode", "NavigateTo", "ElementDetails", "RelationshipDetails", "RelationshipBrowser", "Search", "NavigationButtons", "Notations", "DynamicViewWalkthrough", "FitView", "CompareWithLatest", "Notes", "Vscode", "ElementTags"];
 
 declare type Fqn_2<A> = t.aux.Fqn<A>;
 
@@ -1950,14 +1973,6 @@ declare type GuardPredicate<TContext extends MachineContext, TExpressionEvent ex
     _out_TGuard?: TGuard;
 };
 
-declare type HistorySnapshot = {
-    view: t.LayoutedView;
-    change: t.ViewChange.SaveViewSnapshot;
-    xynodes: Types.Node[];
-    xyedges: Types.Edge[];
-    synched: boolean;
-};
-
 declare type HistoryValue<TContext extends MachineContext, TEvent extends EventObject> = Record<string, Array<StateNode<TContext, TEvent>>>;
 
 declare type HotKeyEvent = {
@@ -2518,6 +2533,11 @@ export declare type LikeC4DiagramProps<A extends Any = Any> = PropsWithChildren<
  * Callbacks from LikeC4 Editor.
  */
 export declare interface LikeC4EditorCallbacks {
+    /**
+     * Apply semantic layout to a view (if AI is available)
+     * See vite-plugin settings for more details
+     */
+    applySemanticLayout?: undefined | ((viewId: t.ViewId) => Promise<void>);
     /**
      * Fetch a view by its ID and layout type.
      *
@@ -2783,6 +2803,11 @@ export declare interface LikeC4ViewProps<A extends t.aux.Any = t.aux.UnknownLayo
 
 declare type LinearAlignmentMode = 'Left' | 'Center' | 'Right' | 'Top' | 'Middle' | 'Bottom';
 
+declare type LinkedSnapshot = {
+    head: Snapshot_2;
+    tail: LinkedSnapshot | null;
+};
+
 declare type LowInfer<T> = T & NonNullable<unknown>;
 
 declare type MachineConfig<TContext extends MachineContext, TEvent extends EventObject, TActor extends ProvidedActor = ProvidedActor, TAction extends ParameterizedObject = ParameterizedObject, TGuard extends ParameterizedObject = ParameterizedObject, TDelay extends string = string, TTag extends string = string, TInput = any, TOutput = unknown, TEmitted extends EventObject = EventObject, TMeta extends MetaObject = MetaObject> = (Omit<StateNodeConfig<DoNotInfer<TContext>, DoNotInfer<TEvent>, DoNotInfer<TActor>, DoNotInfer<TAction>, DoNotInfer<TGuard>, DoNotInfer<TDelay>, DoNotInfer<TTag>, DoNotInfer<TOutput>, DoNotInfer<TEmitted>, DoNotInfer<TMeta>>, 'output'> & {
@@ -3089,7 +3114,15 @@ export declare const Overlay: ForwardRefExoticComponent<{
     backdrop?: {
         opacity?: number;
     };
+    /**
+     * Delay before showing the overlay content (in milliseconds) - helps to avoid flickering
+     * Default: `130ms`
+     * If set to `0`, the content will be shown immediately
+     */
     openDelay?: number;
+    /**
+     * Called when the overlay is closed by outside click or escape key
+     */
     onClose: () => void;
     onClick?: never;
 } & {
@@ -3131,7 +3164,15 @@ export declare type OverlayProps = PropsWithChildren<{
     backdrop?: {
         opacity?: number;
     };
+    /**
+     * Delay before showing the overlay content (in milliseconds) - helps to avoid flickering
+     * Default: `130ms`
+     * If set to `0`, the content will be shown immediately
+     */
     openDelay?: number;
+    /**
+     * Called when the overlay is closed by outside click or escape key
+     */
     onClose: () => void;
     onClick?: never;
 }>;
@@ -3576,7 +3617,7 @@ export declare const searchDialogCss: string;
  * The shared search panel content used by both diagram and overview search.
  * Must be rendered inside a SearchContext.Provider.
  */
-export declare const SearchPanelContent: MemoExoticComponent<() => JSX.Element>;
+export declare const SearchPanelContent: ForwardRefExoticComponent<RefAttributes<HTMLDivElement>>;
 
 export declare function SequenceActorNode(props: Types.NodeProps<'seq-actor'>): JSX.Element;
 
@@ -3601,24 +3642,6 @@ declare function setHovered<T extends WithHovered>(value: T, hovered: boolean):
 
 declare function setHovered(hovered: boolean): <T extends WithHovered>(value: T) => T;
 
-declare const ShadowRoot_2: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
-    injectFontCss?: boolean | undefined;
-    styleNonce?: string | (() => string) | undefined;
-    mode?: "open" | "closed";
-    delegatesFocus?: boolean;
-    colorScheme?: "light" | "dark" | undefined;
-    keepAspectRatio?: false | undefined | {
-        width: number;
-        height: number;
-    };
-    /**
-     * Mantine theme override to apply within the shadow root
-     * @see https://mantine.dev/theming/mantine-provider/#theme-prop
-     */
-    theme?: any;
-} & RefAttributes<HTMLDivElement>>;
-export { ShadowRoot_2 as ShadowRoot }
-
 declare type SingleOrArray<T> = readonly T[] | T;
 
 declare type SlotProps = {
@@ -3646,6 +3669,13 @@ declare type Snapshot<TOutput> = {
     error: undefined;
 };
 
+declare type Snapshot_2 = {
+    view: t.LayoutedView;
+    change: t.ViewChange.SaveViewSnapshot;
+    xynodes: Types.Node[];
+    xyedges: Types.Edge[];
+};
+
 declare interface SnapshotEvent<TSnapshot extends Snapshot<unknown> = Snapshot<unknown>> extends EventObject {
     type: `xstate.snapshot.${string}`;
     snapshot: TSnapshot;
@@ -4079,6 +4109,8 @@ declare interface Subscription {
 
 declare const symbolObservable: typeof Symbol.observable;
 
+declare type SyncOp = t.ViewChange | 'sync-snapshot' | 'apply-semantic-layout' | 'apply-latest-to-manual';
+
 declare type System = ActorSystem<{
     actors: {
         diagram: DiagramMachineRef;
@@ -4564,7 +4596,7 @@ declare type XYStoreApi_3 = {
     getState: () => XYStoreState_3;
 };
 
-declare type XYStoreState = ReactFlowState<Types.AnyNode, Types.AnyEdge>;
+export declare type XYStoreState = ReactFlowState<Types.AnyNode, Types.AnyEdge>;
 
 declare type XYStoreState_2 = ReactFlowState<RelationshipsBrowserTypes.AnyNode, RelationshipsBrowserTypes.Edge>;