@fabio.caffarello/react-design-system 1.7.0 → 1.9.0

package/dist/ui/extensions/flow/context/FlowPerformanceContext.d.ts

@@ -0,0 +1,66 @@
+/**
+ * Flow Performance Context
+ *
+ * Context for monitoring and optimizing Flow performance.
+ */
+import type { ReactNode } from 'react';
+/**
+ * Performance Metrics
+ */
+export interface PerformanceMetrics {
+    renderTime: number;
+    nodeCount: number;
+    edgeCount: number;
+    memoryUsage?: number;
+    frameRate?: number;
+    lastUpdate: number;
+}
+/**
+ * Performance Options
+ */
+export interface PerformanceOptions {
+    enableMonitoring?: boolean;
+    enableOptimizations?: boolean;
+    targetFrameRate?: number;
+    maxNodes?: number;
+    maxEdges?: number;
+    virtualizationThreshold?: number;
+}
+/**
+ * Flow Performance Context Value
+ */
+export interface FlowPerformanceContextValue {
+    metrics: PerformanceMetrics;
+    updateMetrics: (metrics: Partial<PerformanceMetrics>) => void;
+    isOptimized: boolean;
+    optimizations: {
+        virtualization: boolean;
+        memoization: boolean;
+        lazyLoading: boolean;
+    };
+    optimize: () => void;
+    resetOptimizations: () => void;
+    startMonitoring: () => void;
+    stopMonitoring: () => void;
+    isMonitoring: boolean;
+    options: PerformanceOptions;
+    setOptions: (options: Partial<PerformanceOptions>) => void;
+}
+/**
+ * Hook to access Flow Performance context
+ */
+export declare function useFlowPerformanceContext(): FlowPerformanceContextValue;
+/**
+ * Flow Performance Provider Props
+ */
+export interface FlowPerformanceProviderProps {
+    children: ReactNode;
+    initialOptions?: PerformanceOptions;
+    onMetricsUpdate?: (metrics: PerformanceMetrics) => void;
+}
+/**
+ * Flow Performance Provider
+ *
+ * Provides performance monitoring and optimization functionality.
+ */
+export declare function FlowPerformanceProvider({ children, initialOptions, onMetricsUpdate, }: FlowPerformanceProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/extensions/flow/context/FlowStyleContext.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Flow Style Context
+ *
+ * Context for managing CSS variables and theming.
+ */
+import type { ReactNode } from 'react';
+import { type FlowThemeVariables, type ThemeMode } from '../styles/flow-theme';
+/**
+ * Flow Style Context Value
+ */
+export interface FlowStyleContextValue {
+    theme: ThemeMode;
+    setTheme: (theme: ThemeMode) => void;
+    variables: FlowThemeVariables;
+    setVariable: (key: keyof FlowThemeVariables, value: string) => void;
+    setVariables: (variables: Partial<FlowThemeVariables>) => void;
+    applyTheme: (theme: ThemeMode, overrides?: Partial<FlowThemeVariables>) => void;
+    resetTheme: () => void;
+    getVariable: (key: keyof FlowThemeVariables) => string;
+    getCSSVariable: (cssVarName: string) => string;
+}
+/**
+ * Hook to access Flow Style context
+ */
+export declare function useFlowStyleContext(): FlowStyleContextValue;
+/**
+ * Optional hook to access Flow Style context (returns undefined if not available)
+ */
+export declare function useFlowStyleContextOptional(): FlowStyleContextValue | undefined;
+/**
+ * Flow Style Provider Props
+ */
+export interface FlowStyleProviderProps {
+    children: ReactNode;
+    initialTheme?: ThemeMode;
+    initialOverrides?: Partial<FlowThemeVariables>;
+    onThemeChange?: (theme: ThemeMode) => void;
+}
+/**
+ * Flow Style Provider
+ *
+ * Provides CSS variables and theming functionality.
+ */
+export declare function FlowStyleProvider({ children, initialTheme, initialOverrides, onThemeChange, }: FlowStyleProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/ui/extensions/flow/context/PlaygroundContext.d.ts

@@ -0,0 +1,60 @@
+/**
+ * Playground Context
+ *
+ * Context for managing global playground state across tabs and steps.
+ */
+import React from 'react';
+import type { Node, Edge } from '@xyflow/react';
+import type { FlowNodeData, FlowEdgeData } from '../organisms/FlowTypes';
+import type { ReactFlowConfig, BackgroundConfig, LayoutConfig } from '../types/playgroundTypes';
+export interface PlaygroundState {
+    nodes: Node<FlowNodeData>[];
+    edges: Edge<FlowEdgeData>[];
+    reactFlowConfig: ReactFlowConfig;
+    backgroundConfig: BackgroundConfig;
+    layoutConfig: LayoutConfig;
+    theme: 'light' | 'dark';
+    selectedNodeId: string | null;
+    selectedEdgeId: string | null;
+    hasPendingChanges: boolean;
+    activeTab?: import('../components/PlaygroundTabs').PlaygroundTabId;
+}
+export interface PlaygroundContextValue extends PlaygroundState {
+    setNodes: (nodes: Node<FlowNodeData>[]) => void;
+    setEdges: (edges: Edge<FlowEdgeData>[]) => void;
+    setReactFlowConfig: (config: ReactFlowConfig) => void;
+    setBackgroundConfig: (config: BackgroundConfig) => void;
+    setLayoutConfig: (config: LayoutConfig) => void;
+    setTheme: (theme: 'light' | 'dark') => void;
+    setSelectedNodeId: (id: string | null) => void;
+    setSelectedEdgeId: (id: string | null) => void;
+    setHasPendingChanges: (hasChanges: boolean) => void;
+    setActiveTab?: (tab: import('../components/PlaygroundTabs').PlaygroundTabId) => void;
+    applyChanges: () => void;
+    discardChanges: () => void;
+    resetToDefaults: () => void;
+    canUndo: boolean;
+    canRedo: boolean;
+    undo: () => void;
+    redo: () => void;
+    searchQuery: string;
+    setSearchQuery: (query: string) => void;
+    searchResults: Array<{
+        type: 'node' | 'edge';
+        id: string;
+        label?: string;
+        metadata?: {
+            variant?: string;
+            nodeType?: string;
+            edgeType?: string;
+            source?: string;
+            target?: string;
+        };
+    }>;
+}
+export interface PlaygroundProviderProps {
+    children: React.ReactNode;
+    initialState?: Partial<PlaygroundState>;
+}
+export declare function PlaygroundProvider({ children, initialState }: PlaygroundProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function usePlaygroundContext(): PlaygroundContextValue;

package/dist/ui/extensions/flow/context/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Flow Contexts
+ *
+ * Context implementations for Flow components.
+ */
+export { FlowContext, useFlowContext, useFlowContextOptional } from '../organisms/FlowContext';
+export { FlowStyleContext, FlowStyleProvider, useFlowStyleContext, useFlowStyleContextOptional } from './FlowStyleContext';
+export { FlowEventContext, FlowEventProvider, useFlowEventContext } from './FlowEventContext';
+export { FlowPerformanceContext, FlowPerformanceProvider, useFlowPerformanceContext } from './FlowPerformanceContext';
+export type { FlowStyleContextValue, FlowStyleProviderProps } from './FlowStyleContext';
+export type { FlowEventContextValue, FlowEventProviderProps, FlowEvent, FlowEventType, FlowEventHandler } from './FlowEventContext';
+export type { FlowPerformanceContextValue, FlowPerformanceProviderProps, PerformanceMetrics, PerformanceOptions } from './FlowPerformanceContext';
+export { PlaygroundProvider, usePlaygroundContext } from './PlaygroundContext';
+export type { PlaygroundState, PlaygroundContextValue, PlaygroundProviderProps } from './PlaygroundContext';

package/dist/ui/extensions/flow/factories/FlowFactory.d.ts

@@ -0,0 +1,81 @@
+/**
+ * Flow Factory
+ *
+ * Main factory for creating flows, nodes, and edges.
+ * Provides a unified interface for flow construction.
+ */
+import type { Node, Edge, XYPosition } from '@xyflow/react';
+import { NodeBuilder } from './builders/NodeBuilder';
+import { EdgeBuilder } from './builders/EdgeBuilder';
+import type { FlowNodeData, FlowEdgeData } from '../organisms/FlowTypes';
+/**
+ * Flow Factory
+ *
+ * Main factory for creating flow elements with fluent API.
+ */
+export declare class FlowFactory {
+    /**
+     * Create a node builder
+     */
+    static node<T extends FlowNodeData = FlowNodeData>(id?: string): NodeBuilder<T>;
+    /**
+     * Create an edge builder
+     */
+    static edge<T extends FlowEdgeData = FlowEdgeData>(source: string, target: string): EdgeBuilder<T>;
+    /**
+     * Create a node using factory method
+     */
+    static createNode<T extends FlowNodeData = FlowNodeData>(type: string, id: string, position: XYPosition, data: T): Node<T>;
+    /**
+     * Create an edge using factory method
+     */
+    static createEdge<T extends FlowEdgeData = FlowEdgeData>(source: string, target: string, id?: string, type?: string, data?: T): Edge<T>;
+    /**
+     * Create multiple nodes
+     */
+    static createNodes<T extends FlowNodeData = FlowNodeData>(nodes: Array<{
+        type: string;
+        id: string;
+        position: XYPosition;
+        data: T;
+    }>): Node<T>[];
+    /**
+     * Create multiple edges
+     */
+    static createEdges<T extends FlowEdgeData = FlowEdgeData>(edges: Array<{
+        source: string;
+        target: string;
+        id?: string;
+        type?: string;
+        data?: T;
+    }>): Edge<T>[];
+    /**
+     * Create a complete flow (nodes and edges)
+     */
+    static createFlow<TNodeData extends FlowNodeData = FlowNodeData, TEdgeData extends FlowEdgeData = FlowEdgeData>(config: {
+        nodes: Array<{
+            type: string;
+            id: string;
+            position: XYPosition;
+            data: TNodeData;
+        }>;
+        edges: Array<{
+            source: string;
+            target: string;
+            id?: string;
+            type?: string;
+            data?: TEdgeData;
+        }>;
+    }): {
+        nodes: Node<TNodeData>[];
+        edges: Edge<TEdgeData>[];
+    };
+    /**
+     * Create a node from template (convenience method)
+     */
+    static nodeFromTemplate<T extends FlowNodeData = FlowNodeData>(type: string, position: XYPosition, data: Partial<T>): Node<T>;
+    /**
+     * Create an edge from template (convenience method)
+     */
+    static edgeFromTemplate<T extends FlowEdgeData = FlowEdgeData>(source: string, target: string, type?: string, data?: Partial<T>): Edge<T>;
+}

package/dist/ui/extensions/flow/factories/builders/EdgeBuilder.d.ts

@@ -0,0 +1,75 @@
+/**
+ * Edge Builder
+ *
+ * Builder pattern for fluent edge construction.
+ */
+import type { Edge, MarkerType } from '@xyflow/react';
+import type { FlowEdgeData, EdgeCustomization } from '../../organisms/FlowTypes';
+/**
+ * Edge Builder
+ *
+ * Fluent builder for creating edges with method chaining.
+ */
+export declare class EdgeBuilder<T extends FlowEdgeData = FlowEdgeData> {
+    private id?;
+    private source;
+    private target;
+    private type;
+    private sourceHandle?;
+    private targetHandle?;
+    private data;
+    private customization?;
+    private animated?;
+    private selected?;
+    private hidden?;
+    private deletable?;
+    private focusable?;
+    private selectable?;
+    private zIndex?;
+    private markerStart?;
+    private markerEnd?;
+    private style?;
+    private className?;
+    private label?;
+    private labelStyle?;
+    private labelBgStyle?;
+    private labelBgPadding?;
+    private labelBgBorderRadius?;
+    private labelShowBg?;
+    constructor(source: string, target: string);
+    withId(id: string): this;
+    withType(type: string): this;
+    withHandles(sourceHandle?: string, targetHandle?: string): this;
+    withData(data: Partial<T>): this;
+    withLabel(label: string | React.ReactNode): this;
+    withLabelStyle(style: React.CSSProperties): this;
+    withLabelBackground(options: {
+        style?: React.CSSProperties;
+        padding?: [number, number];
+        borderRadius?: number;
+        show?: boolean;
+    }): this;
+    withAnimated(animated?: boolean): this;
+    withStyle(style: React.CSSProperties): this;
+    withClassName(className: string): this;
+    withMarkerStart(type: MarkerType, options?: {
+        color?: string;
+        width?: number;
+        height?: number;
+    }): this;
+    withMarkerEnd(type: MarkerType, options?: {
+        color?: string;
+        width?: number;
+        height?: number;
+    }): this;
+    withCustomization(customization: EdgeCustomization): this;
+    withSelection(selected: boolean): this;
+    withInteractivity(options: {
+        selectable?: boolean;
+        deletable?: boolean;
+        focusable?: boolean;
+    }): this;
+    withVisibility(hidden: boolean): this;
+    withZIndex(zIndex: number): this;
+    build(): Edge<T>;
+}

package/dist/ui/extensions/flow/factories/builders/NodeBuilder.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Node Builder
+ *
+ * Builder pattern for fluent node construction.
+ */
+import type { Node, XYPosition, Position } from '@xyflow/react';
+import type { FlowNodeData, NodeCustomization } from '../../organisms/FlowTypes';
+/**
+ * Node Builder
+ *
+ * Fluent builder for creating nodes with method chaining.
+ */
+export declare class NodeBuilder<T extends FlowNodeData = FlowNodeData> {
+    private id;
+    private type;
+    private position;
+    private data;
+    private customization?;
+    private width?;
+    private height?;
+    private parentId?;
+    private extent?;
+    private expandParent?;
+    private selected?;
+    private draggable?;
+    private selectable?;
+    private connectable?;
+    private deletable?;
+    private focusable?;
+    private hidden?;
+    private zIndex?;
+    private sourcePosition?;
+    private targetPosition?;
+    constructor(id?: string);
+    withId(id: string): this;
+    withType(type: string): this;
+    withPosition(position: XYPosition): this;
+    withData(data: Partial<T>): this;
+    withLabel(label: string): this;
+    withDescription(description: string): this;
+    withVariant(variant: FlowNodeData['variant']): this;
+    withSize(size: FlowNodeData['size']): this;
+    withIcon(icon: React.ReactNode): this;
+    withCustomization(customization: NodeCustomization): this;
+    withDimensions(width: number, height: number): this;
+    withParent(parentId: string, options?: {
+        extent?: 'parent' | [number, number, number, number];
+        expandParent?: boolean;
+    }): this;
+    withSelection(selected: boolean): this;
+    withInteractivity(options: {
+        draggable?: boolean;
+        selectable?: boolean;
+        connectable?: boolean;
+        deletable?: boolean;
+        focusable?: boolean;
+    }): this;
+    withVisibility(hidden: boolean): this;
+    withZIndex(zIndex: number): this;
+    withHandlePositions(sourcePosition?: Position, targetPosition?: Position): this;
+    build(): Node<T>;
+}

package/dist/ui/extensions/flow/factories/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Flow Factories
+ *
+ * Factory pattern implementations for Flow components.
+ */
+export { NodeFactory } from '../utils/nodeFactory';
+export { EdgeFactory } from '../utils/edgeFactory';
+export { FlowFactory } from './FlowFactory';
+export { NodeBuilder } from './builders/NodeBuilder';
+export { EdgeBuilder } from './builders/EdgeBuilder';
+export type { NodeTemplate } from '../utils/nodeFactory';
+export type { EdgeTemplate } from '../utils/edgeFactory';

package/dist/ui/extensions/flow/hooks/index.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Flow Hooks
+ *
+ * Custom hooks for Flow components.
+ */
+export { useFlowState } from './useFlowState';
+export { useFlowActions } from './useFlowActions';
+export { useNodeSelection } from './useNodeSelection';
+export { useFlowStyles, useFlowStylesOptional } from './useFlowStyles';
+export { useFlowPerformance } from './useFlowPerformance';
+export { useFlowEvents } from './useFlowEvents';
+export { useFlowUtils } from './useFlowUtils';
+export { useFlowSelection } from './useFlowSelection';
+export { useFlowViewport } from './useFlowViewport';
+export type { UseFlowStylesReturn } from './useFlowStyles';
+export type { UseFlowPerformanceReturn } from './useFlowPerformance';
+export type { UseFlowEventsReturn } from './useFlowEvents';
+export type { UseFlowUtilsReturn } from './useFlowUtils';
+export type { UseFlowSelectionReturn } from './useFlowSelection';
+export type { UseFlowViewportReturn } from './useFlowViewport';
+export { useFlowValidation } from './useFlowValidation';
+export { useAutoLayout } from './useAutoLayout';
+export { useFlowVirtualization } from './useFlowVirtualization';
+export { usePlaygroundHistory } from './usePlaygroundHistory';
+export type { UsePlaygroundHistoryReturn, HistoryState } from './usePlaygroundHistory';
+export { useKeyboardShortcuts, PLAYGROUND_SHORTCUTS } from './useKeyboardShortcuts';
+export type { KeyboardShortcut, UseKeyboardShortcutsOptions } from './useKeyboardShortcuts';
+export { usePlaygroundKeyboardNavigation } from './usePlaygroundKeyboardNavigation';
+export type { PlaygroundKeyboardNavigationOptions } from './usePlaygroundKeyboardNavigation';

package/dist/ui/extensions/flow/hooks/useAutoLayout.d.ts

@@ -0,0 +1,17 @@
+/**
+ * useAutoLayout Hook
+ *
+ * Hook for applying automatic layouts to flows.
+ */
+import type { Node, Edge } from '@xyflow/react';
+import type { LayoutStrategyName, LayoutOptions, LayoutResult } from '../organisms/FlowTypes';
+/**
+ * Hook for automatic layout
+ *
+ * Provides methods to apply layouts automatically.
+ */
+export declare function useAutoLayout(strategy?: LayoutStrategyName): {
+    applyLayout: (customNodes?: Node[], customEdges?: Edge[], options?: LayoutOptions) => Promise<LayoutResult>;
+    getAvailableStrategies: () => string[];
+    currentStrategy: LayoutStrategyName;
+};

package/dist/ui/extensions/flow/hooks/useFlowActions.d.ts

@@ -0,0 +1,26 @@
+/**
+ * useFlowActions Hook
+ *
+ * Hook that uses React Flow's useReactFlow to provide actions.
+ */
+import type { FitViewOptions, ReactFlowJsonObject } from '@xyflow/react';
+/**
+ * Hook for flow actions
+ *
+ * Provides actions for manipulating the flow (zoom, pan, fit view, etc.)
+ */
+export declare function useFlowActions(): {
+    fitView: (options?: FitViewOptions) => void;
+    zoomIn: () => void;
+    zoomOut: () => void;
+    zoomTo: (zoomLevel: number) => void;
+    panTo: (x: number, y: number) => void;
+    getViewport: () => import("@xyflow/system").Viewport;
+    exportToJSON: () => ReactFlowJsonObject;
+    importFromJSON: (json: ReactFlowJsonObject) => void;
+    getNode: (nodeId: string) => import("@xyflow/react").Node | undefined;
+    getNodes: () => import("@xyflow/react").Node[];
+    getEdge: (edgeId: string) => import("@xyflow/react").Edge | undefined;
+    getEdges: () => import("@xyflow/react").Edge[];
+    reactFlowInstance: import("@xyflow/react").ReactFlowInstance<import("@xyflow/react").Node, import("@xyflow/react").Edge>;
+};

package/dist/ui/extensions/flow/hooks/useFlowEvents.d.ts

@@ -0,0 +1,52 @@
+/**
+ * useFlowEvents Hook
+ *
+ * Hook for subscribing to and emitting Flow events.
+ */
+import type { FlowEventType, FlowEvent, FlowEventHandler } from '../context/FlowEventContext';
+/**
+ * Flow Events Hook Return
+ */
+export interface UseFlowEventsReturn {
+    subscribe: <T = unknown>(eventType: FlowEventType, handler: FlowEventHandler<T>) => {
+        unsubscribe: () => void;
+    };
+    unsubscribe: (eventType: FlowEventType, handler: FlowEventHandler) => void;
+    emit: <T = unknown>(eventType: FlowEventType, payload: T, source?: string) => void;
+    once: <T = unknown>(eventType: FlowEventType, handler: FlowEventHandler<T>) => {
+        unsubscribe: () => void;
+    };
+    filter: <T = unknown>(eventType: FlowEventType, predicate: (event: FlowEvent<T>) => boolean, handler: FlowEventHandler<T>) => {
+        unsubscribe: () => void;
+    };
+    getHistory: (eventType?: FlowEventType, limit?: number) => FlowEvent[];
+    clearHistory: () => void;
+    onNodeAdd: (handler: FlowEventHandler<Node>) => {
+        unsubscribe: () => void;
+    };
+    onNodeRemove: (handler: FlowEventHandler<string>) => {
+        unsubscribe: () => void;
+    };
+    onNodeUpdate: (handler: FlowEventHandler<{
+        nodeId: string;
+        data: unknown;
+    }>) => {
+        unsubscribe: () => void;
+    };
+    onEdgeAdd: (handler: FlowEventHandler<Edge>) => {
+        unsubscribe: () => void;
+    };
+    onEdgeRemove: (handler: FlowEventHandler<string>) => {
+        unsubscribe: () => void;
+    };
+    onSelectionChange: (handler: FlowEventHandler<{
+        nodes: Node[];
+        edges: Edge[];
+    }>) => {
+        unsubscribe: () => void;
+    };
+}
+/**
+ * Hook for subscribing to and emitting Flow events
+ */
+export declare function useFlowEvents(): UseFlowEventsReturn;

package/dist/ui/extensions/flow/hooks/useFlowPerformance.d.ts

@@ -0,0 +1,33 @@
+/**
+ * useFlowPerformance Hook
+ *
+ * Hook for monitoring and optimizing Flow performance.
+ */
+import type { PerformanceMetrics, PerformanceOptions } from '../context/FlowPerformanceContext';
+/**
+ * Flow Performance Hook Return
+ */
+export interface UseFlowPerformanceReturn {
+    metrics: PerformanceMetrics;
+    updateMetrics: (metrics: Partial<PerformanceMetrics>) => void;
+    isOptimized: boolean;
+    optimizations: {
+        virtualization: boolean;
+        memoization: boolean;
+        lazyLoading: boolean;
+    };
+    optimize: () => void;
+    resetOptimizations: () => void;
+    startMonitoring: () => void;
+    stopMonitoring: () => void;
+    isMonitoring: boolean;
+    options: PerformanceOptions;
+    setOptions: (options: Partial<PerformanceOptions>) => void;
+    shouldVirtualize: () => boolean;
+    shouldLazyLoad: () => boolean;
+    getPerformanceScore: () => number;
+}
+/**
+ * Hook for monitoring and optimizing Flow performance
+ */
+export declare function useFlowPerformance(): UseFlowPerformanceReturn;

package/dist/ui/extensions/flow/hooks/useFlowSelection.d.ts

@@ -0,0 +1,36 @@
+/**
+ * useFlowSelection Hook
+ *
+ * Hook for advanced selection management.
+ */
+import type { Node, Edge } from '@xyflow/react';
+import type { FlowNodeData, FlowEdgeData } from '../organisms/FlowTypes';
+/**
+ * Flow Selection Hook Return
+ */
+export interface UseFlowSelectionReturn {
+    selectedNodes: Node<FlowNodeData>[];
+    selectedEdges: Edge<FlowEdgeData>[];
+    selectedNodeIds: string[];
+    selectedEdgeIds: string[];
+    hasSelection: boolean;
+    selectionCount: number;
+    selectNode: (nodeId: string, addToSelection?: boolean) => void;
+    selectNodes: (nodeIds: string[], addToSelection?: boolean) => void;
+    deselectNode: (nodeId: string) => void;
+    deselectAllNodes: () => void;
+    selectEdge: (edgeId: string, addToSelection?: boolean) => void;
+    selectEdges: (edgeIds: string[], addToSelection?: boolean) => void;
+    deselectEdge: (edgeId: string) => void;
+    deselectAllEdges: () => void;
+    selectAll: () => void;
+    deselectAll: () => void;
+    isNodeSelected: (nodeId: string) => boolean;
+    isEdgeSelected: (edgeId: string) => boolean;
+    getSelectedNode: (nodeId: string) => Node<FlowNodeData> | undefined;
+    getSelectedEdge: (edgeId: string) => Edge<FlowEdgeData> | undefined;
+}
+/**
+ * Hook for advanced selection management
+ */
+export declare function useFlowSelection(): UseFlowSelectionReturn;

package/dist/ui/extensions/flow/hooks/useFlowState.d.ts

@@ -0,0 +1,28 @@
+/**
+ * useFlowState Hook
+ *
+ * Hook that uses React Flow's native hooks (useNodesState, useEdgesState)
+ * and adds design system functionality.
+ */
+import type { Node, Edge } from '@xyflow/react';
+import type { FlowNodeData, FlowEdgeData } from '../organisms/FlowTypes';
+/**
+ * Hook for managing flow state
+ *
+ * Uses React Flow's native hooks and adds design system methods.
+ */
+export declare function useFlowState<TNodeData extends FlowNodeData = FlowNodeData, TEdgeData extends FlowEdgeData = FlowEdgeData>(initialNodes?: Node<TNodeData>[], initialEdges?: Edge<TEdgeData>[]): {
+    nodes: Node<TNodeData>[];
+    edges: Edge<TEdgeData>[];
+    setNodes: import("react").Dispatch<import("react").SetStateAction<Node<TNodeData>[]>>;
+    setEdges: import("react").Dispatch<import("react").SetStateAction<Edge<TEdgeData>[]>>;
+    onNodesChange: import("@xyflow/react").OnNodesChange<Node<TNodeData>>;
+    onEdgesChange: import("@xyflow/react").OnEdgesChange<Edge<TEdgeData>>;
+    reactFlowInstance: import("@xyflow/react").ReactFlowInstance<Node, Edge>;
+    addNode: (node: Node<TNodeData>) => void;
+    removeNode: (nodeId: string) => void;
+    updateNode: (nodeId: string, data: Partial<TNodeData>) => void;
+    addEdge: (edge: Edge<TEdgeData>) => void;
+    removeEdge: (edgeId: string) => void;
+    updateEdge: (edgeId: string, data: Partial<TEdgeData>) => void;
+};