@likec4/diagram 1.0.0-next.2 → 1.0.0

package/dist/theme.css.d.ts

@@ -1,7 +1,15 @@
 export declare const vars: {
+    default: {
+        font: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
     likec4: {
         font: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
-        backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        background: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            pattern: {
+                color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            };
+        };
     };
     compound: {
         font: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -19,10 +27,17 @@ export declare const vars: {
         labelColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         labelBgColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
+    optionsPanel: {
+        top: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        right: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+    };
 };
 export declare const xyvars: {
     background: {
         color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        pattern: {
+            color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        };
     };
     edge: {
         stroke: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -41,4 +56,3 @@ export declare const xyvars: {
         borderRadius: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
 };
-//# sourceMappingURL=theme.css.d.ts.map

package/dist/ui/Camera.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
 declare const CameraMemo: import('react').NamedExoticComponent<object>;
 export default CameraMemo;
-//# sourceMappingURL=Camera.d.ts.map

package/dist/ui/KeepAspectRatio.css.d.ts

@@ -1,2 +1 @@
 export declare const wrapper: string;
-//# sourceMappingURL=KeepAspectRatio.css.d.ts.map

package/dist/ui/KeepAspectRatio.d.ts

@@ -7,4 +7,3 @@ type KeepAspectRatioProps = HTMLAttributes<HTMLDivElement> & {
 };
 export declare function KeepAspectRatio({ children, width, height, enabled, className, style, ...rest }: KeepAspectRatioProps): JSX.Element;
 export {};
-//# sourceMappingURL=KeepAspectRatio.d.ts.map

package/dist/ui/OptionsPanel.css.d.ts

@@ -1,2 +1 @@
 export declare const panel: string;
-//# sourceMappingURL=OptionsPanel.css.d.ts.map

package/dist/ui/OptionsPanel.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
 declare const OptionsPanelMemo: import('react').NamedExoticComponent<object>;
 export default OptionsPanelMemo;
-//# sourceMappingURL=OptionsPanel.d.ts.map

package/dist/ui/index.d.ts

@@ -1,3 +1,2 @@
 export { KeepAspectRatio } from './KeepAspectRatio';
 export { default as OptionsPanel } from './OptionsPanel';
-//# sourceMappingURL=index.d.ts.map

package/dist/ui/options/NodeOptions.d.ts

@@ -18,4 +18,3 @@ export type ColorKey = typeof colors[0]['key'];
 export declare function NodeOptions({ selectedNodeIds }: {
     selectedNodeIds: string[];
 }): JSX.Element | null;
-//# sourceMappingURL=NodeOptions.d.ts.map

package/dist/xyflow/FitviewOnDiagramChange.d.ts

@@ -1,6 +1,2 @@
 /// <reference types="react" />
-/**
- * Fits the view when the view changes and nodes are initialized
- */
-export declare const FitviewOnDiagramChange: import('react').NamedExoticComponent<object>;
-//# sourceMappingURL=FitviewOnDiagramChange.d.ts.map
+export declare const FitViewOnDiagramChange: import('react').MemoExoticComponent<() => JSX.Element | null>;

package/dist/xyflow/SyncWithDiagram.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+/**
+ * Syncs the diagram state with the XYFlow instance
+ */
+export declare const SyncWithDiagram: import('react').MemoExoticComponent<() => null>;

package/dist/xyflow/XYFlowBackground.d.ts

@@ -8,4 +8,3 @@ export type XYBackgroundProps = XYBackgroundVariant | OverrideProperties<Backgro
 export declare const XYFlowBackground: import('react').NamedExoticComponent<{
     background: XYBackgroundProps;
 }>;
-//# sourceMappingURL=XYFlowBackground.d.ts.map

package/dist/xyflow/XYFlowEvents.d.ts

@@ -1,25 +1,15 @@
 import { XYFlowEdge, XYFlowNode } from './types';
-import { Change, LikeC4DiagramEventHandlers } from '../LikeC4Diagram.props';
-import { default as React, PropsWithChildren } from 'react';
-import { EdgeMouseHandler, NodeMouseHandler } from '@xyflow/react';
+import { MouseEvent as ReactMouseEvent } from 'react';
+import { EdgeMouseHandler, NodeMouseHandler, OnMoveEnd } from '@xyflow/react';
 
 type XYFlowEventHandlers = {
-    onNavigateTo: (xynodeId: string, event: React.MouseEvent) => void;
-    onPanelClick: (event: React.MouseEvent) => void;
+    onPaneClick: (event: ReactMouseEvent) => void;
     onNodeContextMenu: NodeMouseHandler<XYFlowNode>;
     onEdgeContextMenu: EdgeMouseHandler<XYFlowEdge>;
-    onPaneContextMenu: (event: React.MouseEvent | MouseEvent) => void;
+    onPaneContextMenu: (event: ReactMouseEvent | MouseEvent) => void;
     onNodeClick: NodeMouseHandler<XYFlowNode>;
     onEdgeClick: EdgeMouseHandler<XYFlowEdge>;
-    onChange: (change: Change) => void;
+    onMoveEnd: OnMoveEnd;
 };
 export declare function useXYFlowEvents(): XYFlowEventHandlers;
-type Props = PropsWithChildren<{
-    eventHandlers: LikeC4DiagramEventHandlers;
-}>;
-/**
- * Bridge between ReactFlow and LikeC4Diagram event handlers
- */
-export declare function XYFlowEventHandlers({ children, eventHandlers }: Props): JSX.Element;
 export {};
-//# sourceMappingURL=XYFlowEvents.d.ts.map

package/dist/xyflow/XYFlowWrapper.d.ts

@@ -1,15 +1,14 @@
 import { XYFlowEdge, XYFlowNode } from './types';
 import { LikeC4DiagramProperties } from '../LikeC4Diagram.props';
-import { Simplify } from 'type-fest';
+import { SetNonNullable, Simplify } from 'type-fest';
 import { CSSProperties, PropsWithChildren } from 'react';
 
-type OnlyExpectedProps = Required<Omit<LikeC4DiagramProperties, 'view' | 'disableHovercards' | 'controls' | 'background' | 'initialWidth' | 'initialHeight' | 'keepAspectRatio'>>;
-type XYFlowWrapperProps = Simplify<PropsWithChildren<OnlyExpectedProps & {
+type OnlyExpectedProps = Required<Pick<LikeC4DiagramProperties, 'className' | 'controls' | 'pannable' | 'zoomable' | 'background'>>;
+type XYFlowWrapperProps = Simplify<PropsWithChildren<SetNonNullable<OnlyExpectedProps> & {
     defaultNodes: XYFlowNode[];
     defaultEdges: XYFlowEdge[];
     style?: CSSProperties | undefined;
 }>>;
-declare function XYFlowWrapper({ className, children, defaultNodes, defaultEdges, fitView, colorMode: colorModeProp, readonly, pannable, zoomable, nodesSelectable, nodesDraggable, fitViewPadding, style }: XYFlowWrapperProps): JSX.Element;
+declare function XYFlowWrapper({ className, children, defaultNodes, defaultEdges, pannable, zoomable, controls, background, style }: XYFlowWrapperProps): JSX.Element;
 export declare const XYFlow: typeof XYFlowWrapper;
 export {};
-//# sourceMappingURL=XYFlowWrapper.d.ts.map

package/dist/xyflow/const.d.ts

@@ -3,5 +3,4 @@ export declare const ZIndexes: {
     readonly Edge: 2;
     readonly Element: 3;
 };
-export declare const MinZoom = 0.2;
-//# sourceMappingURL=const.d.ts.map
+export declare const MinZoom = 0.05;

package/dist/xyflow/diagram-to-xyflow.d.ts

@@ -1,5 +1,7 @@
 import { XYFlowData } from '../xyflow/types';
 import { DiagramView } from '@likec4/core';
 
-export declare function diagramViewToXYFlowData(view: Pick<DiagramView, 'nodes' | 'edges'>, dragEnabled?: boolean): XYFlowData;
-//# sourceMappingURL=diagram-to-xyflow.d.ts.map
+export declare function diagramViewToXYFlowData(view: Pick<DiagramView, 'nodes' | 'edges'>, opts: {
+    draggable: boolean;
+    selectable: boolean;
+}): XYFlowData;

package/dist/xyflow/edges/RelationshipEdge.d.ts

@@ -1,15 +1,18 @@
+import { CSSProperties } from 'react';
 import { EdgeProps } from '@xyflow/react';
 
 export declare const RelationshipEdge: import('react').NamedExoticComponent<EdgeProps<{
     source: string;
     target: string;
-    style?: import("react").CSSProperties;
+    style?: CSSProperties;
     id: string;
+    zIndex?: number;
+    markerEnd?: import("@xyflow/react").EdgeMarkerType;
+    markerStart?: import("@xyflow/react").EdgeMarkerType;
     hidden?: boolean;
     selected?: boolean;
     selectable?: boolean;
     deletable?: boolean;
-    zIndex?: number;
     ariaLabel?: string;
     className?: string;
     focusable?: boolean;
@@ -17,16 +20,13 @@ export declare const RelationshipEdge: import('react').NamedExoticComponent<Edge
     sourceHandle?: string | null;
     targetHandle?: string | null;
     animated?: boolean;
-    markerStart?: import("@xyflow/react").EdgeMarkerType;
-    markerEnd?: import("@xyflow/react").EdgeMarkerType;
     interactionWidth?: number;
-    labelStyle?: import("react").CSSProperties;
+    labelStyle?: CSSProperties;
     labelShowBg?: boolean;
-    labelBgStyle?: import("react").CSSProperties;
+    labelBgStyle?: CSSProperties;
     labelBgPadding?: [number, number];
     labelBgBorderRadius?: number;
     updatable?: import("@xyflow/react").EdgeUpdatable;
     data: import("../types").RelationshipData;
     type: "relationship";
 }>>;
-//# sourceMappingURL=RelationshipEdge.d.ts.map

package/dist/xyflow/edges/edges.css.d.ts

@@ -2,6 +2,7 @@ export declare const container: string;
 export declare const edgePathBg: string;
 export declare const fillStrokeCtx: string;
 export declare const cssEdgePath: string;
+export declare const varLabelX: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+export declare const varLabelY: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 export declare const edgeLabel: string;
 export declare const edgeLabelBody: string;
-//# sourceMappingURL=edges.css.d.ts.map

package/dist/xyflow/edges/utils.d.ts

@@ -1,8 +1,8 @@
-import { XYFlowNode } from '../types';
+import { InternalXYFlowNode } from '../types';
 import { Position, XYPosition } from '@xyflow/react';
 
-export declare function getPointPosition(node: XYFlowNode, intersectionPoint: XYPosition): readonly [number, number, Position];
-export declare function getEdgeParams(source: XYFlowNode, target: XYFlowNode): {
+export declare function getPointPosition(node: InternalXYFlowNode, intersectionPoint: XYPosition): readonly [number, number, Position];
+export declare function getEdgeParams(source: InternalXYFlowNode, target: InternalXYFlowNode): {
     sx: number;
     sy: number;
     tx: number;
@@ -10,4 +10,3 @@ export declare function getEdgeParams(source: XYFlowNode, target: XYFlowNode): {
     sourcePos: Position;
     targetPos: Position;
 };
-//# sourceMappingURL=utils.d.ts.map

package/dist/xyflow/hooks/index.d.ts

@@ -1,37 +1,2 @@
-import { XYFlowNode } from '../types';
-
-export declare const useXYFlow: () => import('@xyflow/react').ReactFlowInstance<XYFlowNode, {
-    source: string;
-    target: string;
-    style?: import("react").CSSProperties;
-    id: string;
-    hidden?: boolean;
-    selected?: boolean;
-    selectable?: boolean;
-    deletable?: boolean;
-    zIndex?: number;
-    ariaLabel?: string;
-    className?: string;
-    focusable?: boolean;
-    label?: import("react").ReactNode;
-    sourceHandle?: string | null;
-    targetHandle?: string | null;
-    animated?: boolean;
-    markerStart?: import("@xyflow/react").EdgeMarkerType;
-    markerEnd?: import("@xyflow/react").EdgeMarkerType;
-    interactionWidth?: number;
-    labelStyle?: import("react").CSSProperties;
-    labelShowBg?: boolean;
-    labelBgStyle?: import("react").CSSProperties;
-    labelBgPadding?: [number, number];
-    labelBgBorderRadius?: number;
-    updatable?: import("@xyflow/react").EdgeUpdatable;
-    data: import("../types").RelationshipData;
-    type: "relationship";
-}>;
-export declare const useXYNodesData: {
-    (nodeId: string): Pick<XYFlowNode, "id" | "type" | "data"> | null;
-    (nodeIds: string[]): Pick<XYFlowNode, "id" | "type" | "data">[];
-};
-export { useLayoutConstraints } from './use-layout-сonstraints';
-//# sourceMappingURL=index.d.ts.map
+export * from './useLayoutConstraints';
+export * from './useXYFlow';

package/dist/xyflow/hooks/{use-layout-/321/201onstraints.d.ts → useLayoutConstraints.d.ts}

@@ -1,11 +1,9 @@
-import { XYFlowInstance, XYFlowNode } from '../types';
-import { RefObject } from 'react';
+import { XYFlowNode } from '../types';
 import { ReactFlowProps } from '@xyflow/react';
 
 type LayoutConstraints = Required<Pick<ReactFlowProps<XYFlowNode>, 'onNodeDragStart' | 'onNodeDrag' | 'onNodeDragStop'>>;
 /**
  * Keeps the layout constraints (parent nodes and children) when dragging a node
  */
-export declare function useLayoutConstraints(xyflow: RefObject<XYFlowInstance | undefined>): LayoutConstraints;
+export declare function useLayoutConstraints(): LayoutConstraints;
 export {};
-//# sourceMappingURL=use-layout-%D1%81onstraints.d.ts.map

package/dist/xyflow/hooks/useXYFlow.d.ts

@@ -0,0 +1,266 @@
+import { XYFlowNode, XYFlowState } from '../types';
+
+export declare const useXYFlow: () => import('@xyflow/react').ReactFlowInstance<XYFlowNode, {
+    source: string;
+    target: string;
+    style?: import("react").CSSProperties;
+    id: string;
+    zIndex?: number;
+    markerEnd?: import("@xyflow/react").EdgeMarkerType;
+    markerStart?: import("@xyflow/react").EdgeMarkerType;
+    hidden?: boolean;
+    selected?: boolean;
+    selectable?: boolean;
+    deletable?: boolean;
+    ariaLabel?: string;
+    className?: string;
+    focusable?: boolean;
+    label?: import("react").ReactNode;
+    sourceHandle?: string | null;
+    targetHandle?: string | null;
+    animated?: boolean;
+    interactionWidth?: number;
+    labelStyle?: import("react").CSSProperties;
+    labelShowBg?: boolean;
+    labelBgStyle?: import("react").CSSProperties;
+    labelBgPadding?: [number, number];
+    labelBgBorderRadius?: number;
+    updatable?: import("@xyflow/react").EdgeUpdatable;
+    data: import("../types").RelationshipData;
+    type: "relationship";
+}>;
+export declare const useXYNodesData: {
+    (nodeId: string): Pick<XYFlowNode, "id" | "type" | "data"> | null;
+    (nodeIds: string[]): Pick<XYFlowNode, "id" | "type" | "data">[];
+};
+export declare function useXYStore<StateSlice = unknown>(selector: (state: XYFlowState) => StateSlice, equalityFn?: (a: StateSlice, b: StateSlice) => boolean): StateSlice;
+export declare const useXYStoreApi: () => {
+    getState: () => import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }>;
+    setState: (partial: import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }> | Partial<import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }>> | ((state: import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }>) => import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }> | Partial<import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }>>), replace?: boolean | undefined) => void;
+    subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }>, prevState: import('@xyflow/react').ReactFlowState<XYFlowNode, {
+        source: string;
+        target: string;
+        style?: import("react").CSSProperties;
+        id: string;
+        zIndex?: number;
+        markerEnd?: import("@xyflow/react").EdgeMarkerType;
+        markerStart?: import("@xyflow/react").EdgeMarkerType;
+        hidden?: boolean;
+        selected?: boolean;
+        selectable?: boolean;
+        deletable?: boolean;
+        ariaLabel?: string;
+        className?: string;
+        focusable?: boolean;
+        label?: import("react").ReactNode;
+        sourceHandle?: string | null;
+        targetHandle?: string | null;
+        animated?: boolean;
+        interactionWidth?: number;
+        labelStyle?: import("react").CSSProperties;
+        labelShowBg?: boolean;
+        labelBgStyle?: import("react").CSSProperties;
+        labelBgPadding?: [number, number];
+        labelBgBorderRadius?: number;
+        updatable?: import("@xyflow/react").EdgeUpdatable;
+        data: import("../types").RelationshipData;
+        type: "relationship";
+    }>) => void) => () => void;
+};
+export type XYStoreApi = ReturnType<typeof useXYStoreApi>;

package/dist/xyflow/nodes/compound/CompoundNode.css.d.ts

@@ -3,4 +3,3 @@ export declare const cssCompound: string;
 export declare const cssTitle: string;
 export declare const cssIndicator: string;
 export declare const cssNavigateBtn: string;
-//# sourceMappingURL=CompoundNode.css.d.ts.map

package/dist/xyflow/nodes/compound/CompoundNode.d.ts

@@ -4,4 +4,3 @@ import { NodeProps } from '@xyflow/react';
 type CompoundNodeProps = Pick<NodeProps<CompoundXYFlowNode>, 'id' | 'data' | 'width' | 'height' | 'selected'>;
 export declare const CompoundNodeMemo: import('react').NamedExoticComponent<CompoundNodeProps>;
 export {};
-//# sourceMappingURL=CompoundNode.d.ts.map

package/dist/xyflow/nodes/compound/index.d.ts

@@ -1,2 +1 @@
 export { CompoundNodeMemo as CompoundNode } from './CompoundNode';
-//# sourceMappingURL=index.d.ts.map

package/dist/xyflow/nodes/element/ElementIcon.d.ts

@@ -6,6 +6,5 @@ type ElementIconProps = {
     paddingX?: number | undefined;
     paddingY?: number | undefined;
 };
-export declare function ElementIcon({ node, maxWidth, paddingX, paddingY }: ElementIconProps): JSX.Element | null;
+export declare function ElementIcon({ node, paddingY }: ElementIconProps): JSX.Element | null;
 export {};
-//# sourceMappingURL=ElementIcon.d.ts.map

package/dist/xyflow/nodes/element/ElementLink.css.d.ts

@@ -1,4 +1,3 @@
 export declare const elementLink: string;
 export declare const trigger: string;
 export declare const linkButton: string;
-//# sourceMappingURL=ElementLink.css.d.ts.map

package/dist/xyflow/nodes/element/ElementLink.d.ts

@@ -3,6 +3,5 @@ import { XYFlowNode } from '../../types';
 type ElementLinkProps = {
     element: XYFlowNode['data']['element'];
 };
-export declare function ElementLink({ element }: ElementLinkProps): JSX.Element | null;
+export declare function ElementLink({ element }: ElementLinkProps): JSX.Element;
 export {};
-//# sourceMappingURL=ElementLink.d.ts.map

package/dist/xyflow/nodes/element/ElementNode.d.ts

@@ -2,7 +2,5 @@ import { ElementXYFlowNode } from '../../types';
 import { NodeProps } from '@xyflow/react';
 
 type ElementNodeProps = NodeProps<ElementXYFlowNode>;
-declare function ElementNode({ id, data: { element }, selected, width, height }: ElementNodeProps): JSX.Element;
-export declare const ElementNodeMemo: typeof ElementNode;
+export declare function ElementNode({ id, data: { element }, dragging, selected, width, height }: ElementNodeProps): JSX.Element;
 export {};
-//# sourceMappingURL=ElementNode.d.ts.map

package/dist/xyflow/nodes/element/ElementShapeSvg.d.ts

@@ -5,10 +5,9 @@ type ElementShapeSvgProps = {
     w: number;
     h: number;
 };
-export declare const ElementShapeSvg: import('react').NamedExoticComponent<ElementShapeSvgProps>;
+export declare function ElementShapeSvg({ shape, w, h }: ElementShapeSvgProps): JSX.Element;
 /**
  * When element is selected, this component is used to render the indicator
  */
-export declare const SelectedIndicator: import('react').NamedExoticComponent<ElementShapeSvgProps>;
+export declare function SelectedIndicator({ shape, w, h }: ElementShapeSvgProps): JSX.Element;
 export {};
-//# sourceMappingURL=ElementShapeSvg.d.ts.map

package/dist/xyflow/nodes/element/element.css.d.ts

@@ -12,4 +12,3 @@ export declare const iconMaxH: `var(--${string})` | `var(--${string}, ${string})
 export declare const elementIcon: string;
 export declare const cssShapeSvg: string;
 export declare const cssNavigateBtn: string;
-//# sourceMappingURL=element.css.d.ts.map

package/dist/xyflow/nodes/element/index.d.ts

@@ -1,2 +1 @@
-export { ElementNodeMemo as ElementNode } from './ElementNode';
-//# sourceMappingURL=index.d.ts.map
+export { ElementNode } from './ElementNode';

package/dist/xyflow/nodes/shared/NavigateToBtn.d.ts

@@ -4,4 +4,3 @@ export type NavigateToBtnProps = {
     className?: string;
 };
 export declare function NavigateToBtn({ xynodeId, className }: NavigateToBtnProps): JSX.Element;
-//# sourceMappingURL=NavigateToBtn.d.ts.map