@lumina-study/graph/dist/components/Tree/Tree.d.ts

Graph library for Lumina Study

import { Node, Edge, ReactFlowProps } from '@xyflow/react';
import { TreeNodeData, Direction } from '../../types';
import { LayoutOptions } from '../../utils/autoLayout';
export interface TreeProps extends Partial<Omit<ReactFlowProps, 'nodes' | 'edges' | 'nodeTypes' | 'width' | 'height' | 'fitView'>> {
    /**
     * Array of tree nodes to render.
     * If using auto-layout, positions can be omitted or set to {x:0, y:0}
     */
    nodes: Node<TreeNodeData>[] | Omit<Node<TreeNodeData>, 'position'>[];
    /**
     * Array of edges connecting the nodes
     */
    edges?: Edge[];
    /**
     * Width of the tree container
     * @default '100%'
     */
    width?: string | number;
    /**
     * Height of the tree container
     * @default '600px'
     */
    height?: string | number;
    /**
     * Whether to show the background grid
     * @default true
     */
    showBackground?: boolean;
    /**
     * Whether to show the controls (zoom, fit view, etc.)
     * @default true
     */
    showControls?: boolean;
    /**
     * Whether to fit the view to show all nodes on mount
     * @default true
     */
    fitView?: boolean;
    /**
     * Custom node types (TreeNode is registered by default)
     */
    nodeTypes?: ReactFlowProps['nodeTypes'];
    /**
     * Enable auto-layout. When true, node positions are calculated automatically.
     * @default false
     */
    autoLayout?: boolean;
    /**
     * Layout options for auto-layout
     */
    layoutOptions?: LayoutOptions;
    /**
     * Direction for all nodes in the tree (for handle positioning)
     * @default 'ttb'
     */
    direction?: Direction;
}
/**
 * Tree component that wraps ReactFlow with TreeNode integration
 *
 * @example
 * ```tsx
 * import { Tree } from '@lumina-study/graph';
 *
 * const nodes = [
 *   {
 *     id: '1',
 *     type: 'treeNode',
 *     position: { x: 0, y: 0 },
 *     data: { label: 'Node 1', direction: 'ttb' }
 *   }
 * ];
 *
 * <Tree nodes={nodes} />
 * ```
 */
export declare function Tree({ nodes, edges, width, height, showBackground, showControls, fitView, nodeTypes: customNodeTypes, autoLayout: enableAutoLayout, layoutOptions, direction, ...reactFlowProps }: TreeProps): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=Tree.d.ts.map