@cratis/components 0.1.17 → 0.1.19

package/dist/esm/EventModeling/EventModeling.js

@@ -0,0 +1,207 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import React, { useState, useCallback } from 'react';
+import { DEFAULT_ELEMENT_SIZE, calculateOptimalEdges } from './types.js';
+import { Toolbox } from './components/Toolbox.js';
+import { Canvas } from './components/Canvas.js';
+import { CanvasControls } from './components/CanvasControls.js';
+import './EventModeling.css';
+
+const EventModeling = ({ initialState, onStateChange, width = '100%', height = '100vh', }) => {
+    const [state, setState] = useState(initialState || {
+        elements: [],
+        connectors: [],
+    });
+    const [selectedTool, setSelectedTool] = useState('select');
+    const [zoom, setZoom] = useState(1);
+    const [pan, setPan] = useState({ x: 0, y: 0 });
+    const updateState = useCallback((newState) => {
+        setState(newState);
+        onStateChange?.(newState);
+    }, [onStateChange]);
+    const handleZoomChange = useCallback((newZoom) => {
+        setZoom(newZoom);
+    }, []);
+    const handlePanChange = useCallback((newPan) => {
+        setPan(newPan);
+    }, []);
+    const handleAddElement = useCallback((type, x, y) => {
+        console.log('Adding element:', type, 'at', x, y);
+        const size = DEFAULT_ELEMENT_SIZE[type];
+        const newElement = {
+            id: `${type}-${Date.now()}`,
+            type,
+            position: { x, y },
+            size,
+            label: `New ${type.charAt(0).toUpperCase() + type.slice(1)}`,
+        };
+        updateState({
+            ...state,
+            elements: [...state.elements, newElement],
+        });
+        setSelectedTool('select');
+    }, [state, updateState]);
+    const handleUpdateElement = useCallback((id, updates) => {
+        const updatedElements = state.elements.map(el => el.id === id ? { ...el, ...updates } : el);
+        let updatedConnectors = state.connectors;
+        if (updates.position) {
+            updatedConnectors = state.connectors.map(connector => {
+                if (connector.from.elementId === id || connector.to.elementId === id) {
+                    const fromElement = updatedElements.find(el => el.id === connector.from.elementId);
+                    const toElement = updatedElements.find(el => el.id === connector.to.elementId);
+                    if (fromElement && toElement) {
+                        const optimalEdges = calculateOptimalEdges(fromElement, toElement);
+                        return {
+                            ...connector,
+                            from: { elementId: connector.from.elementId, side: optimalEdges.fromSide },
+                            to: { elementId: connector.to.elementId, side: optimalEdges.toSide },
+                        };
+                    }
+                }
+                return connector;
+            });
+        }
+        updateState({
+            ...state,
+            elements: updatedElements,
+            connectors: updatedConnectors,
+        });
+    }, [state, updateState]);
+    const handleDeleteElement = useCallback((id) => {
+        updateState({
+            ...state,
+            elements: state.elements.filter(el => el.id !== id),
+            connectors: state.connectors.filter(conn => conn.from.elementId !== id && conn.to.elementId !== id),
+            selectedElementId: state.selectedElementId === id ? undefined : state.selectedElementId,
+        });
+    }, [state, updateState]);
+    const handleAddConnector = useCallback((connector) => {
+        if (connector.from.elementId === connector.to.elementId) {
+            return;
+        }
+        const fromElement = state.elements.find(el => el.id === connector.from.elementId);
+        const toElement = state.elements.find(el => el.id === connector.to.elementId);
+        if (!fromElement || !toElement) {
+            return;
+        }
+        const optimalEdges = calculateOptimalEdges(fromElement, toElement);
+        const optimizedConnector = {
+            ...connector,
+            from: { elementId: connector.from.elementId, side: optimalEdges.fromSide },
+            to: { elementId: connector.to.elementId, side: optimalEdges.toSide },
+        };
+        const isDuplicate = state.connectors.some(c => c.from.elementId === optimizedConnector.from.elementId &&
+            c.to.elementId === optimizedConnector.to.elementId);
+        if (isDuplicate) {
+            return;
+        }
+        updateState({
+            ...state,
+            connectors: [...state.connectors, optimizedConnector],
+        });
+    }, [state, updateState]);
+    const handleDeleteConnector = useCallback((id) => {
+        updateState({
+            ...state,
+            connectors: state.connectors.filter(conn => conn.id !== id),
+            selectedConnectorId: state.selectedConnectorId === id ? undefined : state.selectedConnectorId,
+        });
+    }, [state, updateState]);
+    const handleSelectElement = useCallback((id) => {
+        updateState({
+            ...state,
+            selectedElementId: id,
+            selectedConnectorId: undefined,
+        });
+    }, [state, updateState]);
+    const handleSelectConnector = useCallback((id) => {
+        updateState({
+            ...state,
+            selectedConnectorId: id,
+            selectedElementId: undefined,
+        });
+    }, [state, updateState]);
+    const handleZoomIn = useCallback(() => {
+        setZoom(prev => Math.min(5, prev * 1.2));
+    }, []);
+    const handleZoomOut = useCallback(() => {
+        setZoom(prev => Math.max(0.1, prev / 1.2));
+    }, []);
+    const handleZoomReset = useCallback(() => {
+        setZoom(1);
+    }, []);
+    const handleFitToView = useCallback(() => {
+        if (state.elements.length === 0) {
+            setZoom(1);
+            return;
+        }
+        let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+        state.elements.forEach(el => {
+            minX = Math.min(minX, el.position.x);
+            minY = Math.min(minY, el.position.y);
+            maxX = Math.max(maxX, el.position.x + el.size.width);
+            maxY = Math.max(maxY, el.position.y + el.size.height);
+        });
+        const padding = 50;
+        const contentWidth = maxX - minX + padding * 2;
+        const contentHeight = maxY - minY + padding * 2;
+        const canvasWidth = window.innerWidth * 0.8;
+        const canvasHeight = window.innerHeight * 0.8;
+        const scaleX = canvasWidth / contentWidth;
+        const scaleY = canvasHeight / contentHeight;
+        const newZoom = Math.min(scaleX, scaleY, 1);
+        setZoom(newZoom);
+    }, [state.elements]);
+    React.useEffect(() => {
+        const handleKeyDown = (e) => {
+            if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) {
+                return;
+            }
+            switch (e.key.toLowerCase()) {
+                case 'v':
+                    setSelectedTool('select');
+                    break;
+                case 'c':
+                    setSelectedTool('command');
+                    break;
+                case 'e':
+                    setSelectedTool('event');
+                    break;
+                case 'r':
+                    setSelectedTool('readmodel');
+                    break;
+                case 'p':
+                    setSelectedTool('process');
+                    break;
+                case 'delete':
+                case 'backspace':
+                    if (state.selectedElementId) {
+                        handleDeleteElement(state.selectedElementId);
+                    }
+                    else if (state.selectedConnectorId) {
+                        handleDeleteConnector(state.selectedConnectorId);
+                    }
+                    break;
+                case '+':
+                case '=':
+                    handleZoomIn();
+                    break;
+                case '-':
+                case '_':
+                    handleZoomOut();
+                    break;
+                case '0':
+                    handleZoomReset();
+                    break;
+                case 'f':
+                    handleFitToView();
+                    break;
+            }
+        };
+        window.addEventListener('keydown', handleKeyDown);
+        return () => window.removeEventListener('keydown', handleKeyDown);
+    }, [state, selectedTool, handleDeleteElement, handleDeleteConnector, handleZoomIn, handleZoomOut, handleZoomReset, handleFitToView]);
+    return (jsxs("div", { className: "event-modeling", style: { width, height }, children: [jsx(Toolbox, { selectedTool: selectedTool, onToolSelect: setSelectedTool }), jsx(Canvas, { state: state, selectedTool: selectedTool, zoom: zoom, pan: pan, onZoomChange: handleZoomChange, onPanChange: handlePanChange, onAddElement: handleAddElement, onUpdateElement: handleUpdateElement, onAddConnector: handleAddConnector, onSelectElement: handleSelectElement, onSelectConnector: handleSelectConnector }), jsx(CanvasControls, { zoom: zoom, onZoomIn: handleZoomIn, onZoomOut: handleZoomOut, onZoomReset: handleZoomReset, onFitToView: handleFitToView })] }));
+};
+
+export { EventModeling };
+//# sourceMappingURL=EventModeling.js.map

package/dist/esm/EventModeling/EventModeling.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventModeling.js","sources":["../../../EventModeling/EventModeling.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport React, { useState, useCallback } from 'react';\nimport { EventModelingState, ElementData, Connector, ElementType, DEFAULT_ELEMENT_SIZE, calculateOptimalEdges } from './types';\nimport { Toolbox } from './components/Toolbox';\nimport { Canvas } from './components/Canvas';\nimport { CanvasControls } from './components/CanvasControls';\nimport './EventModeling.css';\n\nexport interface EventModelingProps {\n    initialState?: EventModelingState;\n    onStateChange?: (state: EventModelingState) => void;\n    width?: string;\n    height?: string;\n}\n\nexport const EventModeling: React.FC<EventModelingProps> = ({\n    initialState,\n    onStateChange,\n    width = '100%',\n    height = '100vh',\n}) => {\n    const [state, setState] = useState<EventModelingState>(\n        initialState || {\n            elements: [],\n            connectors: [],\n        }\n    );\n\n    const [selectedTool, setSelectedTool] = useState<ElementType | 'select'>('select');\n    const [zoom, setZoom] = useState(1);\n    const [pan, setPan] = useState({ x: 0, y: 0 });\n\n    const updateState = useCallback((newState: EventModelingState) => {\n        setState(newState);\n        onStateChange?.(newState);\n    }, [onStateChange]);\n\n    const handleZoomChange = useCallback((newZoom: number) => {\n        setZoom(newZoom);\n    }, []);\n\n    const handlePanChange = useCallback((newPan: { x: number; y: number }) => {\n        setPan(newPan);\n    }, []);\n\n    const handleAddElement = useCallback((type: ElementType, x: number, y: number) => {\n        console.log('Adding element:', type, 'at', x, y); // Debug log\n        const size = DEFAULT_ELEMENT_SIZE[type];\n        const newElement: ElementData = {\n            id: `${type}-${Date.now()}`,\n            type,\n            position: { x, y },\n            size,\n            label: `New ${type.charAt(0).toUpperCase() + type.slice(1)}`,\n        };\n\n        updateState({\n            ...state,\n            elements: [...state.elements, newElement],\n        });\n\n        // Auto-switch back to select tool after adding\n        setSelectedTool('select');\n    }, [state, updateState]);\n\n    const handleUpdateElement = useCallback((id: string, updates: Partial<ElementData>) => {\n        const updatedElements = state.elements.map(el =>\n            el.id === id ? { ...el, ...updates } : el\n        );\n\n        // If position changed, update affected connectors to use optimal edges\n        let updatedConnectors = state.connectors;\n        if (updates.position) {\n            updatedConnectors = state.connectors.map(connector => {\n                // Check if this connector involves the moved element\n                if (connector.from.elementId === id || connector.to.elementId === id) {\n                    const fromElement = updatedElements.find(el => el.id === connector.from.elementId);\n                    const toElement = updatedElements.find(el => el.id === connector.to.elementId);\n\n                    if (fromElement && toElement) {\n                        const optimalEdges = calculateOptimalEdges(fromElement, toElement);\n                        return {\n                            ...connector,\n                            from: { elementId: connector.from.elementId, side: optimalEdges.fromSide },\n                            to: { elementId: connector.to.elementId, side: optimalEdges.toSide },\n                        };\n                    }\n                }\n                return connector;\n            });\n        }\n\n        updateState({\n            ...state,\n            elements: updatedElements,\n            connectors: updatedConnectors,\n        });\n    }, [state, updateState]);\n\n    const handleDeleteElement = useCallback((id: string) => {\n        updateState({\n            ...state,\n            elements: state.elements.filter(el => el.id !== id),\n            connectors: state.connectors.filter(\n                conn => conn.from.elementId !== id && conn.to.elementId !== id\n            ),\n            selectedElementId: state.selectedElementId === id ? undefined : state.selectedElementId,\n        });\n    }, [state, updateState]);\n\n    const handleAddConnector = useCallback((connector: Connector) => {\n        // Prevent connecting element to itself\n        if (connector.from.elementId === connector.to.elementId) {\n            return;\n        }\n\n        // Find the elements to calculate optimal edges\n        const fromElement = state.elements.find(el => el.id === connector.from.elementId);\n        const toElement = state.elements.find(el => el.id === connector.to.elementId);\n\n        if (!fromElement || !toElement) {\n            return;\n        }\n\n        // Calculate optimal edges based on positions\n        const optimalEdges = calculateOptimalEdges(fromElement, toElement);\n\n        // Create connector with optimal edges\n        const optimizedConnector: Connector = {\n            ...connector,\n            from: { elementId: connector.from.elementId, side: optimalEdges.fromSide },\n            to: { elementId: connector.to.elementId, side: optimalEdges.toSide },\n        };\n\n        // Prevent duplicate connectors (checking element IDs only, not sides since we auto-adjust)\n        const isDuplicate = state.connectors.some(\n            c => c.from.elementId === optimizedConnector.from.elementId &&\n                 c.to.elementId === optimizedConnector.to.elementId\n        );\n\n        if (isDuplicate) {\n            return;\n        }\n\n        updateState({\n            ...state,\n            connectors: [...state.connectors, optimizedConnector],\n        });\n    }, [state, updateState]);\n\n    const handleDeleteConnector = useCallback((id: string) => {\n        updateState({\n            ...state,\n            connectors: state.connectors.filter(conn => conn.id !== id),\n            selectedConnectorId: state.selectedConnectorId === id ? undefined : state.selectedConnectorId,\n        });\n    }, [state, updateState]);\n\n    const handleSelectElement = useCallback((id: string | undefined) => {\n        updateState({\n            ...state,\n            selectedElementId: id,\n            selectedConnectorId: undefined,\n        });\n    }, [state, updateState]);\n\n    const handleSelectConnector = useCallback((id: string | undefined) => {\n        updateState({\n            ...state,\n            selectedConnectorId: id,\n            selectedElementId: undefined,\n        });\n    }, [state, updateState]);\n\n    const handleZoomIn = useCallback(() => {\n        setZoom(prev => Math.min(5, prev * 1.2));\n    }, []);\n\n    const handleZoomOut = useCallback(() => {\n        setZoom(prev => Math.max(0.1, prev / 1.2));\n    }, []);\n\n    const handleZoomReset = useCallback(() => {\n        setZoom(1);\n    }, []);\n\n    const handleFitToView = useCallback(() => {\n        if (state.elements.length === 0) {\n            setZoom(1);\n            return;\n        }\n\n        // Calculate bounding box of all elements\n        let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;\n        state.elements.forEach(el => {\n            minX = Math.min(minX, el.position.x);\n            minY = Math.min(minY, el.position.y);\n            maxX = Math.max(maxX, el.position.x + el.size.width);\n            maxY = Math.max(maxY, el.position.y + el.size.height);\n        });\n\n        const padding = 50;\n        const contentWidth = maxX - minX + padding * 2;\n        const contentHeight = maxY - minY + padding * 2;\n\n        // Get canvas size (approximate)\n        const canvasWidth = window.innerWidth * 0.8;\n        const canvasHeight = window.innerHeight * 0.8;\n\n        const scaleX = canvasWidth / contentWidth;\n        const scaleY = canvasHeight / contentHeight;\n        const newZoom = Math.min(scaleX, scaleY, 1);\n\n        setZoom(newZoom);\n    }, [state.elements]);\n\n    // Keyboard shortcuts\n    React.useEffect(() => {\n        const handleKeyDown = (e: KeyboardEvent) => {\n            if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) {\n                return;\n            }\n\n            switch (e.key.toLowerCase()) {\n                case 'v':\n                    setSelectedTool('select');\n                    break;\n                case 'c':\n                    setSelectedTool('command');\n                    break;\n                case 'e':\n                    setSelectedTool('event');\n                    break;\n                case 'r':\n                    setSelectedTool('readmodel');\n                    break;\n                case 'p':\n                    setSelectedTool('process');\n                    break;\n                case 'delete':\n                case 'backspace':\n                    if (state.selectedElementId) {\n                        handleDeleteElement(state.selectedElementId);\n                    } else if (state.selectedConnectorId) {\n                        handleDeleteConnector(state.selectedConnectorId);\n                    }\n                    break;\n                case '+':\n                case '=':\n                    handleZoomIn();\n                    break;\n                case '-':\n                case '_':\n                    handleZoomOut();\n                    break;\n                case '0':\n                    handleZoomReset();\n                    break;\n                case 'f':\n                    handleFitToView();\n                    break;\n            }\n        };\n\n        window.addEventListener('keydown', handleKeyDown);\n        return () => window.removeEventListener('keydown', handleKeyDown);\n    }, [state, selectedTool, handleDeleteElement, handleDeleteConnector, handleZoomIn, handleZoomOut, handleZoomReset, handleFitToView]);\n\n    return (\n        <div className=\"event-modeling\" style={{ width, height }}>\n            <Toolbox\n                selectedTool={selectedTool}\n                onToolSelect={setSelectedTool}\n            />\n            <Canvas\n                state={state}\n                selectedTool={selectedTool}\n                zoom={zoom}\n                pan={pan}\n                onZoomChange={handleZoomChange}\n                onPanChange={handlePanChange}\n                onAddElement={handleAddElement}\n                onUpdateElement={handleUpdateElement}\n                onAddConnector={handleAddConnector}\n                onSelectElement={handleSelectElement}\n                onSelectConnector={handleSelectConnector}\n            />\n            <CanvasControls\n                zoom={zoom}\n                onZoomIn={handleZoomIn}\n                onZoomOut={handleZoomOut}\n                onZoomReset={handleZoomReset}\n                onFitToView={handleFitToView}\n            />\n        </div>\n    );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/EventModeling/EventModeling.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { EventModeling } from './EventModeling';
+declare const meta: Meta<typeof EventModeling>;
+export default meta;
+type Story = StoryObj<typeof EventModeling>;
+export declare const Empty: Story;
+export declare const SimpleFlow: Story;
+export declare const ComplexEventModel: Story;
+export declare const WithProcessAutomation: Story;
+//# sourceMappingURL=EventModeling.stories.d.ts.map

package/dist/esm/EventModeling/EventModeling.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventModeling.stories.d.ts","sourceRoot":"","sources":["../../../EventModeling/EventModeling.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CAOpC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAE5C,eAAO,MAAM,KAAK,EAAE,KAKnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KA6CxB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KA+H/B,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAsEnC,CAAC"}

package/dist/esm/EventModeling/EventModeling.stories.js

@@ -0,0 +1,252 @@
+import { EventModeling } from './EventModeling';
+const meta = {
+    title: 'EventModeling',
+    component: EventModeling,
+    parameters: {
+        layout: 'fullscreen',
+    },
+    tags: ['autodocs'],
+};
+export default meta;
+export const Empty = {
+    args: {
+        width: '100%',
+        height: '800px',
+    },
+};
+export const SimpleFlow = {
+    args: {
+        width: '100%',
+        height: '800px',
+        initialState: {
+            elements: [
+                {
+                    id: 'cmd-1',
+                    type: 'command',
+                    position: { x: 100, y: 200 },
+                    size: { width: 200, height: 100 },
+                    label: 'Register User',
+                    description: 'userId, email, name',
+                },
+                {
+                    id: 'evt-1',
+                    type: 'event',
+                    position: { x: 400, y: 200 },
+                    size: { width: 200, height: 100 },
+                    label: 'User Registered',
+                    description: 'userId, email, name, timestamp',
+                },
+                {
+                    id: 'view-1',
+                    type: 'readmodel',
+                    position: { x: 700, y: 200 },
+                    size: { width: 200, height: 100 },
+                    label: 'User Profile',
+                    description: 'userId, email, name, status',
+                },
+            ],
+            connectors: [
+                {
+                    id: 'conn-1',
+                    from: { elementId: 'cmd-1', side: 'right' },
+                    to: { elementId: 'evt-1', side: 'left' },
+                },
+                {
+                    id: 'conn-2',
+                    from: { elementId: 'evt-1', side: 'right' },
+                    to: { elementId: 'view-1', side: 'left' },
+                },
+            ],
+        },
+    },
+};
+export const ComplexEventModel = {
+    args: {
+        width: '100%',
+        height: '800px',
+        initialState: {
+            elements: [
+                {
+                    id: 'cmd-1',
+                    type: 'command',
+                    position: { x: 100, y: 100 },
+                    size: { width: 200, height: 100 },
+                    label: 'Register User',
+                    description: 'email, name, password',
+                },
+                {
+                    id: 'evt-1',
+                    type: 'event',
+                    position: { x: 400, y: 100 },
+                    size: { width: 200, height: 100 },
+                    label: 'User Registered',
+                    description: 'userId, email, name',
+                },
+                {
+                    id: 'view-1',
+                    type: 'readmodel',
+                    position: { x: 700, y: 100 },
+                    size: { width: 200, height: 100 },
+                    label: 'User List',
+                    description: 'All active users',
+                },
+                {
+                    id: 'proc-1',
+                    type: 'process',
+                    position: { x: 420, y: 260 },
+                    size: { width: 80, height: 80 },
+                    label: 'Send Email',
+                },
+                {
+                    id: 'cmd-2',
+                    type: 'command',
+                    position: { x: 560, y: 250 },
+                    size: { width: 200, height: 100 },
+                    label: 'Send Verification',
+                    description: 'userId, email, token',
+                },
+                {
+                    id: 'evt-2',
+                    type: 'event',
+                    position: { x: 860, y: 250 },
+                    size: { width: 200, height: 100 },
+                    label: 'Verification Sent',
+                    description: 'userId, sentAt',
+                },
+                {
+                    id: 'cmd-3',
+                    type: 'command',
+                    position: { x: 100, y: 400 },
+                    size: { width: 200, height: 100 },
+                    label: 'Verify Email',
+                    description: 'token',
+                },
+                {
+                    id: 'evt-3',
+                    type: 'event',
+                    position: { x: 400, y: 400 },
+                    size: { width: 200, height: 100 },
+                    label: 'Email Verified',
+                    description: 'userId, verifiedAt',
+                },
+                {
+                    id: 'view-2',
+                    type: 'readmodel',
+                    position: { x: 700, y: 400 },
+                    size: { width: 200, height: 100 },
+                    label: 'User Profile',
+                    description: 'userId, verified: true',
+                },
+            ],
+            connectors: [
+                {
+                    id: 'conn-1',
+                    from: { elementId: 'cmd-1', side: 'right' },
+                    to: { elementId: 'evt-1', side: 'left' },
+                },
+                {
+                    id: 'conn-2',
+                    from: { elementId: 'evt-1', side: 'right' },
+                    to: { elementId: 'view-1', side: 'left' },
+                },
+                {
+                    id: 'conn-3',
+                    from: { elementId: 'evt-1', side: 'bottom' },
+                    to: { elementId: 'proc-1', side: 'top' },
+                },
+                {
+                    id: 'conn-4',
+                    from: { elementId: 'proc-1', side: 'right' },
+                    to: { elementId: 'cmd-2', side: 'left' },
+                },
+                {
+                    id: 'conn-5',
+                    from: { elementId: 'cmd-2', side: 'right' },
+                    to: { elementId: 'evt-2', side: 'left' },
+                },
+                {
+                    id: 'conn-6',
+                    from: { elementId: 'cmd-3', side: 'right' },
+                    to: { elementId: 'evt-3', side: 'left' },
+                },
+                {
+                    id: 'conn-7',
+                    from: { elementId: 'evt-3', side: 'right' },
+                    to: { elementId: 'view-2', side: 'left' },
+                },
+            ],
+        },
+    },
+};
+export const WithProcessAutomation = {
+    args: {
+        width: '100%',
+        height: '800px',
+        initialState: {
+            elements: [
+                {
+                    id: 'evt-1',
+                    type: 'event',
+                    position: { x: 100, y: 150 },
+                    size: { width: 200, height: 100 },
+                    label: 'Order Placed',
+                    description: 'orderId, amount, items',
+                },
+                {
+                    id: 'view-1',
+                    type: 'readmodel',
+                    position: { x: 400, y: 150 },
+                    size: { width: 200, height: 100 },
+                    label: 'Pending Orders',
+                    description: 'Orders awaiting processing',
+                },
+                {
+                    id: 'proc-1',
+                    type: 'process',
+                    position: { x: 660, y: 160 },
+                    size: { width: 80, height: 80 },
+                    label: 'Process',
+                },
+                {
+                    id: 'cmd-1',
+                    type: 'command',
+                    position: { x: 800, y: 150 },
+                    size: { width: 200, height: 100 },
+                    label: 'Process Payment',
+                    description: 'orderId, amount',
+                },
+                {
+                    id: 'evt-2',
+                    type: 'event',
+                    position: { x: 1100, y: 150 },
+                    size: { width: 200, height: 100 },
+                    label: 'Payment Processed',
+                    description: 'orderId, transactionId',
+                },
+            ],
+            connectors: [
+                {
+                    id: 'conn-1',
+                    from: { elementId: 'evt-1', side: 'right' },
+                    to: { elementId: 'view-1', side: 'left' },
+                },
+                {
+                    id: 'conn-2',
+                    from: { elementId: 'view-1', side: 'right' },
+                    to: { elementId: 'proc-1', side: 'left' },
+                },
+                {
+                    id: 'conn-3',
+                    from: { elementId: 'proc-1', side: 'right' },
+                    to: { elementId: 'cmd-1', side: 'left' },
+                },
+                {
+                    id: 'conn-4',
+                    from: { elementId: 'cmd-1', side: 'right' },
+                    to: { elementId: 'evt-2', side: 'left' },
+                },
+            ],
+        },
+    },
+};
+//# sourceMappingURL=EventModeling.stories.js.map

package/dist/esm/EventModeling/EventModeling.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventModeling.stories.js","sourceRoot":"","sources":["../../../EventModeling/EventModeling.stories.tsx"],"names":[],"mappings":"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"}

package/dist/esm/EventModeling/components/Canvas.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { EventModelingState, ElementType, ElementData, Connector } from '../types';
+export interface CanvasProps {
+    state: EventModelingState;
+    selectedTool: ElementType | 'select';
+    zoom: number;
+    pan: {
+        x: number;
+        y: number;
+    };
+    onZoomChange: (zoom: number) => void;
+    onPanChange: (pan: {
+        x: number;
+        y: number;
+    }) => void;
+    onAddElement: (type: ElementType, x: number, y: number) => void;
+    onUpdateElement: (id: string, updates: Partial<ElementData>) => void;
+    onAddConnector: (connector: Connector) => void;
+    onSelectElement: (id: string | undefined) => void;
+    onSelectConnector: (id: string | undefined) => void;
+}
+export declare const Canvas: React.FC<CanvasProps>;
+//# sourceMappingURL=Canvas.d.ts.map

package/dist/esm/EventModeling/components/Canvas.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Canvas.d.ts","sourceRoot":"","sources":["../../../../EventModeling/components/Canvas.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAExE,OAAO,EAAE,kBAAkB,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,EAAY,MAAM,UAAU,CAAC;AAI7F,MAAM,WAAW,WAAW;IACxB,KAAK,EAAE,kBAAkB,CAAC;IAC1B,YAAY,EAAE,WAAW,GAAG,QAAQ,CAAC;IACrC,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9B,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,WAAW,EAAE,CAAC,GAAG,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACrD,YAAY,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IACrE,cAAc,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IAC/C,eAAe,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAClD,iBAAiB,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CACvD;AAWD,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAufxC,CAAC"}