@flowuent-org/diagramming-core 1.0.8 → 1.1.0

package/dist/out-tsc/packages/diagrams/src/lib/components/DiagramPanel.js

@@ -0,0 +1,162 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Button } from '@mui/material';
+import UndoIcon from '@mui/icons-material/Undo';
+import RedoIcon from '@mui/icons-material/Redo';
+import UploadIcon from '@mui/icons-material/Upload';
+import ZoomInIcon from '@mui/icons-material/ZoomIn';
+import ZoomOutIcon from '@mui/icons-material/ZoomOut';
+import ViewModuleIcon from '@mui/icons-material/ViewModule';
+import AccountTreeIcon from '@mui/icons-material/AccountTree';
+import { useReactFlow, Panel } from '@xyflow/react';
+// Custom controls component that uses useReactFlow
+const CustomControls = ({ onGridLayout, onTreeLayout }) => {
+    const { zoomIn, zoomOut } = useReactFlow();
+    return (_jsxs(Box, { sx: {
+            display: 'flex',
+            alignItems: 'center',
+            gap: 0.5,
+            bgcolor: '#2a2a2a',
+            borderRadius: '8px',
+            padding: '4px 8px',
+            border: '1px solid #404040',
+            boxShadow: '0 2px 8px rgba(0,0,0,0.3)',
+        }, children: [_jsx(Button, { variant: "text", size: "small", onClick: () => zoomOut(), sx: {
+                    minWidth: '32px',
+                    width: '32px',
+                    height: '32px',
+                    padding: 0,
+                    color: '#ffffff',
+                    '&:hover': {
+                        bgcolor: 'rgba(255,255,255,0.1)',
+                        borderRadius: '4px',
+                    },
+                }, children: _jsx(ZoomOutIcon, { sx: { fontSize: '18px' } }) }), _jsx(Box, { sx: {
+                    width: '1px',
+                    height: '24px',
+                    bgcolor: '#404040',
+                    mx: 0.5,
+                } }), _jsx(Button, { variant: "text", size: "small", onClick: () => zoomIn(), sx: {
+                    minWidth: '32px',
+                    width: '32px',
+                    height: '32px',
+                    padding: 0,
+                    color: '#ffffff',
+                    '&:hover': {
+                        bgcolor: 'rgba(255,255,255,0.1)',
+                        borderRadius: '4px',
+                    },
+                }, children: _jsx(ZoomInIcon, { sx: { fontSize: '18px' } }) }), _jsx(Box, { sx: {
+                    width: '1px',
+                    height: '24px',
+                    bgcolor: '#404040',
+                    mx: 0.5,
+                } }), _jsx(Button, { variant: "text", size: "small", onClick: onGridLayout || (() => console.log('Grid layout clicked')), sx: {
+                    minWidth: '32px',
+                    width: '32px',
+                    height: '32px',
+                    padding: 0,
+                    color: '#ffffff',
+                    '&:hover': {
+                        bgcolor: 'rgba(255,255,255,0.1)',
+                        borderRadius: '4px',
+                    },
+                }, children: _jsx(ViewModuleIcon, { sx: { fontSize: '18px' } }) }), _jsx(Button, { variant: "text", size: "small", onClick: onTreeLayout || (() => console.log('Tree layout clicked')), sx: {
+                    minWidth: '32px',
+                    width: '32px',
+                    height: '32px',
+                    padding: 0,
+                    color: '#ffffff',
+                    '&:hover': {
+                        bgcolor: 'rgba(255,255,255,0.1)',
+                        borderRadius: '4px',
+                    },
+                }, children: _jsx(AccountTreeIcon, { sx: { fontSize: '18px' } }) })] }));
+};
+// Divider component for reusability
+const Divider = () => (_jsx(Box, { sx: {
+        width: '1px',
+        height: '24px',
+        bgcolor: '#404040',
+        mx: 0.5,
+    } }));
+export default function DiagramPanel({ historyIndex, historyLength, onUndo, onRedo, onClear, onImport, isSettingsOpen, onToggleSettings, showCustomControls = true, onGridLayout, onTreeLayout, }) {
+    const handleFileImport = (event) => {
+        var _a;
+        const file = (_a = event.target.files) === null || _a === void 0 ? void 0 : _a[0];
+        if (file) {
+            const reader = new FileReader();
+            reader.onload = (e) => {
+                var _a;
+                try {
+                    const data = JSON.parse((_a = e.target) === null || _a === void 0 ? void 0 : _a.result);
+                    if (data.nodes && data.edges) {
+                        onImport(data);
+                    }
+                }
+                catch (error) {
+                    console.error('Error importing diagram:', error);
+                }
+            };
+            reader.readAsText(file);
+        }
+    };
+    return (_jsx(Panel, { position: "top-left", children: _jsxs(Box, { sx: {
+                display: 'flex',
+                alignItems: 'center',
+                gap: 1,
+                marginTop: '30px', // Add top margin to push buttons down
+            }, children: [_jsxs(Box, { sx: {
+                        display: 'flex',
+                        alignItems: 'center',
+                        gap: 0.5,
+                        bgcolor: '#2a2a2a',
+                        borderRadius: '8px',
+                        padding: '4px 8px',
+                        border: '1px solid #404040',
+                        boxShadow: '0 2px 8px rgba(0,0,0,0.3)',
+                    }, children: [_jsx(Button, { variant: "text", size: "small", onClick: onClear, sx: {
+                                minWidth: '32px',
+                                width: '32px',
+                                height: '32px',
+                                padding: 0,
+                                color: '#ffffff',
+                                fontSize: '12px',
+                                '&:hover': {
+                                    bgcolor: 'rgba(255,255,255,0.1)',
+                                    borderRadius: '4px',
+                                },
+                            }, children: "C" }), _jsx(Divider, {}), _jsx(Button, { variant: "text", size: "small", onClick: onUndo, disabled: historyIndex <= 0, sx: {
+                                minWidth: '32px',
+                                width: '32px',
+                                height: '32px',
+                                padding: 0,
+                                color: historyIndex <= 0 ? '#666666' : '#ffffff',
+                                '&:hover': {
+                                    bgcolor: historyIndex <= 0 ? 'transparent' : 'rgba(255,255,255,0.1)',
+                                    borderRadius: '4px',
+                                },
+                            }, children: _jsx(UndoIcon, { sx: { fontSize: '18px' } }) }), _jsx(Button, { variant: "text", size: "small", onClick: onRedo, disabled: historyIndex >= historyLength - 1, sx: {
+                                minWidth: '32px',
+                                width: '32px',
+                                height: '32px',
+                                padding: 0,
+                                color: historyIndex >= historyLength - 1 ? '#666666' : '#ffffff',
+                                '&:hover': {
+                                    bgcolor: historyIndex >= historyLength - 1
+                                        ? 'transparent'
+                                        : 'rgba(255,255,255,0.1)',
+                                    borderRadius: '4px',
+                                },
+                            }, children: _jsx(RedoIcon, { sx: { fontSize: '18px' } }) }), _jsx(Divider, {}), _jsxs(Button, { variant: "text", component: "label", size: "small", sx: {
+                                minWidth: '32px',
+                                width: '32px',
+                                height: '32px',
+                                padding: 0,
+                                color: '#ffffff',
+                                '&:hover': {
+                                    bgcolor: 'rgba(255,255,255,0.1)',
+                                    borderRadius: '4px',
+                                },
+                            }, children: [_jsx(UploadIcon, { sx: { fontSize: '18px' } }), _jsx("input", { type: "file", onChange: handleFileImport, accept: ".json", style: { display: 'none' } })] })] }), showCustomControls && (_jsx(CustomControls, { onGridLayout: onGridLayout, onTreeLayout: onTreeLayout }))] }) }));
+}
+//# sourceMappingURL=DiagramPanel.js.map

package/dist/out-tsc/packages/diagrams/src/lib/components/DiagramPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DiagramPanel.js","sourceRoot":"","sources":["../../../../../../../packages/diagrams/src/lib/components/DiagramPanel.tsx"],"names":[],"mappings":"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"}

package/dist/out-tsc/packages/diagrams/src/lib/components/FunctionModalTooltip.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+const FunctionModalTooltip = memo(({ backgroundColor }) => {
+    const { t } = useTranslation();
+    return (_jsxs(_Fragment, { children: [_jsx("div", { children: _jsx("b", { children: t('createFunctionModal.guidelines.title') }) }), _jsxs("ul", { style: { margin: 0, paddingLeft: 18 }, children: [_jsx("li", { children: t('createFunctionModal.guidelines.uniqueName') }), _jsx("li", { children: t('createFunctionModal.guidelines.arguments') }), _jsx("li", { children: t('createFunctionModal.guidelines.autoGeneration') })] }), _jsx("div", { style: { marginTop: 8 }, children: _jsx("b", { children: t('createFunctionModal.example.title') }) }), _jsxs("div", { style: { fontFamily: 'monospace', fontSize: 13, background: backgroundColor, padding: 6, borderRadius: 4 }, children: [t('createFunctionModal.example.name'), _jsx("br", {}), t('createFunctionModal.example.args'), _jsx("br", {}), t('createFunctionModal.example.code')] })] }));
+});
+FunctionModalTooltip.displayName = 'FunctionModalTooltip';
+export default FunctionModalTooltip;
+//# sourceMappingURL=FunctionModalTooltip.js.map

package/dist/out-tsc/packages/diagrams/src/lib/components/FunctionModalTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FunctionModalTooltip.js","sourceRoot":"","sources":["../../../../../../../packages/diagrams/src/lib/components/FunctionModalTooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC7B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAM/C,MAAM,oBAAoB,GAAG,IAAI,CAAC,CAAC,EAAE,eAAe,EAA6B,EAAE,EAAE;IACjF,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAC;IAE/B,OAAO,CACH,8BACI,wBAAK,sBAAI,CAAC,CAAC,sCAAsC,CAAC,GAAK,GAAM,EAC7D,cAAI,KAAK,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,aACrC,uBAAK,CAAC,CAAC,2CAA2C,CAAC,GAAM,EACzD,uBAAK,CAAC,CAAC,0CAA0C,CAAC,GAAM,EACxD,uBAAK,CAAC,CAAC,+CAA+C,CAAC,GAAM,IAC5D,EACL,cAAK,KAAK,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,YAAE,sBAAI,CAAC,CAAC,mCAAmC,CAAC,GAAK,GAAM,EACnF,eAAK,KAAK,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,aAC1G,CAAC,CAAC,kCAAkC,CAAC,EAAC,cAAM,EAC5C,CAAC,CAAC,kCAAkC,CAAC,EAAC,cAAM,EAC5C,CAAC,CAAC,kCAAkC,CAAC,IACpC,IACP,CACN,CAAC;AACN,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,WAAW,GAAG,sBAAsB,CAAC;AAE1D,eAAe,oBAAoB,CAAC"}

package/dist/out-tsc/packages/diagrams/src/lib/components/GraphQLCustomCodeModal.js

@@ -0,0 +1,93 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useEffect, useRef, useCallback, useMemo } from 'react';
+import { Box, Button, Modal, Stack, TextField, Typography } from '@mui/material';
+import { useTranslation } from 'react-i18next';
+// Memoize the modal styles
+const useModalStyles = () => useMemo(() => ({
+    position: 'absolute',
+    top: '50%',
+    left: '50%',
+    transform: 'translate(-50%, -50%)',
+    width: '80%',
+    maxHeight: 600,
+    overflowY: 'auto',
+    bgcolor: '#232323',
+    color: '#fff',
+    boxShadow: 24,
+    p: 4,
+    borderRadius: 2,
+    '&::-webkit-scrollbar': {
+        width: '10px',
+        background: '#181818',
+    },
+    '&::-webkit-scrollbar-thumb': {
+        background: '#393939',
+        borderRadius: '8px',
+    },
+    scrollbarColor: '#393939 #181818',
+    scrollbarWidth: 'thin',
+}), []);
+const GraphQLCustomCodeModal = React.memo(({ open, onClose, code = '', onCodeChange, title, description, onSave, }) => {
+    const { t } = useTranslation();
+    const fileInputRef = useRef(null);
+    const modalStyles = useModalStyles();
+    const handleImportCode = useCallback((event) => {
+        const file = event.target.files && event.target.files[0];
+        if (file) {
+            const reader = new FileReader();
+            reader.onload = (e) => {
+                var _a;
+                const text = (_a = e.target) === null || _a === void 0 ? void 0 : _a.result;
+                if (typeof text === 'string') {
+                    onCodeChange(text);
+                }
+            };
+            reader.onerror = () => {
+                alert('Failed to read file.');
+            };
+            reader.readAsText(file);
+        }
+        event.target.value = '';
+    }, [onCodeChange]);
+    const handleSave = useCallback(() => {
+        if (typeof onSave === 'function') {
+            onSave();
+        }
+    }, [onSave]);
+    useEffect(() => {
+        if (open) {
+            // Reset any state when modal opens
+        }
+    }, [open]);
+    return (_jsx(Modal, { open: open, onClose: onClose, children: _jsxs(Box, { sx: modalStyles, children: [_jsx(Typography, { variant: "h6", gutterBottom: true, sx: { color: '#fff' }, children: title || t('graphqlForm.customQuery') }), _jsx(Typography, { variant: "body1", sx: { mt: 2, color: '#aaa' }, children: description || t('graphqlForm.customQueryDescription') }), _jsxs(Box, { sx: {
+                        mt: 2,
+                        p: 2,
+                        bgcolor: '#2a2a2a',
+                        borderRadius: 1,
+                        border: '1px solid #444',
+                        fontFamily: 'monospace',
+                        fontSize: '14px'
+                    }, children: [_jsx(Typography, { variant: "body2", sx: { color: '#888', mb: 1 }, children: t('graphqlForm.queryPreview') || 'Query Preview:' }), _jsxs(Box, { sx: { color: '#fff' }, children: [_jsx("span", { style: { color: '#ff79c6' }, children: "query" }), ' ', _jsx("span", { style: { color: '#50fa7b' }, children: "GetUser" }), _jsx("span", { style: { color: '#fff' }, children: "(" }), _jsx("span", { style: { color: '#f1fa8c' }, children: "$userId: ID!" }), _jsxs("span", { style: { color: '#fff' }, children: [") ", '{'] })] }), _jsx(Box, { sx: { mt: 1, color: '#fff' }, children: _jsxs("span", { style: { color: '#fff' }, children: ["  user(id: $userId) ", '{'] }) }), _jsx(Box, { sx: { mt: 1, color: '#fff' }, children: _jsx("span", { style: { color: '#fff' }, children: "    id" }) }), _jsx(Box, { sx: { color: '#fff' }, children: _jsx("span", { style: { color: '#fff' }, children: "    name" }) }), _jsx(Box, { sx: { color: '#fff' }, children: _jsx("span", { style: { color: '#fff' }, children: "    email" }) }), _jsx(Box, { sx: { color: '#fff' }, children: _jsxs("span", { style: { color: '#fff' }, children: ["  ", '}'] }) }), _jsx(Box, { sx: { color: '#fff' }, children: _jsx("span", { style: { color: '#fff' }, children: '}' }) })] }), _jsx(Typography, { variant: "body2", sx: { mt: 2, color: '#aaa', fontStyle: 'italic' }, children: t('graphqlForm.writeCustomQuery') || 'Write your custom GraphQL query below:' }), _jsx(Typography, { variant: "caption", sx: { color: '#666', fontStyle: 'italic', display: 'block', mt: 0.5 }, children: t('graphqlForm.queryNote') || 'Include the complete query, mutation, or subscription with all necessary fields and variables.' }), _jsx(TextField, { multiline: true, rows: 12, fullWidth: true, value: code, onChange: (e) => onCodeChange(e.target.value), placeholder: t('graphqlForm.queryPlaceholder') || `query GetUser($userId: ID!) {
+  user(id: $userId) {
+    id
+    name
+    email
+  }
+}`, sx: {
+                        mt: 2,
+                        '& .MuiInputBase-input': {
+                            color: '#fff',
+                            background: '#232323',
+                            fontFamily: 'monospace',
+                            fontSize: '14px',
+                            lineHeight: 1.5
+                        },
+                        '& .MuiOutlinedInput-root': {
+                            '& fieldset': { borderColor: '#8E8E93' },
+                            '&:hover fieldset': { borderColor: '#fff' },
+                        },
+                    }, InputLabelProps: { style: { color: '#aaa' } }, InputProps: { style: { color: '#fff', background: '#232323' } } }), _jsxs(Stack, { direction: "row", spacing: 2, sx: { mt: 4, justifyContent: 'flex-end' }, children: [_jsx("input", { type: "file", accept: ".graphql,.gql,.txt,.json", style: { display: 'none' }, ref: fileInputRef, onChange: handleImportCode }), _jsx(Button, { variant: "outlined", sx: { color: '#fff', borderColor: '#6c47ff' }, onClick: () => { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, children: t('graphqlForm.importQuery') || 'Import Query' }), _jsx(Button, { variant: "outlined", sx: { color: '#fff', borderColor: '#6c47ff' }, onClick: handleSave, children: t('graphqlForm.saveQuery') || 'Save Query' }), _jsx(Button, { variant: "contained", sx: { background: '#6c47ff', color: '#fff' }, onClick: onClose, children: t('graphqlForm.close') || 'Close' })] })] }) }));
+});
+GraphQLCustomCodeModal.displayName = 'GraphQLCustomCodeModal';
+export default GraphQLCustomCodeModal;
+//# sourceMappingURL=GraphQLCustomCodeModal.js.map

package/dist/out-tsc/packages/diagrams/src/lib/components/GraphQLCustomCodeModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GraphQLCustomCodeModal.js","sourceRoot":"","sources":["../../../../../../../packages/diagrams/src/lib/components/GraphQLCustomCodeModal.tsx"],"names":[],"mappings":"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"}

package/dist/out-tsc/packages/diagrams/src/lib/components/Header.js

@@ -0,0 +1,83 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { AppBar, Toolbar, IconButton, Button, Tabs, Tab, Box, Avatar, ThemeProvider, createTheme, } from '@mui/material';
+import { Home, Share, Person } from '@mui/icons-material';
+const darkTheme = createTheme({
+    palette: {
+        mode: 'dark',
+        primary: {
+            main: '#8b5cf6', // Purple color for the share button
+        },
+        background: {
+            default: '#1a1a1a',
+            paper: '#2a2a2a',
+        },
+    },
+    components: {
+        MuiAppBar: {
+            styleOverrides: {
+                root: {
+                    backgroundColor: '#1a1a1a',
+                    borderBottom: '1px solid #333',
+                },
+            },
+        },
+        MuiTab: {
+            styleOverrides: {
+                root: {
+                    backgroundColor: '#2a2a2a',
+                    color: '#ffffff',
+                    marginRight: '8px',
+                    borderRadius: '8px',
+                    minHeight: '40px',
+                    textTransform: 'none',
+                    '&.Mui-selected': {
+                        backgroundColor: '#3a3a3a',
+                        color: '#ffffff',
+                    },
+                },
+            },
+        },
+        MuiTabs: {
+            styleOverrides: {
+                indicator: {
+                    display: 'none', // Hide the default indicator
+                },
+            },
+        },
+    },
+});
+export default function Header() {
+    const [tabValue, setTabValue] = React.useState(0);
+    const handleTabChange = (event, newValue) => {
+        setTabValue(newValue);
+    };
+    return (_jsx(ThemeProvider, { theme: darkTheme, children: _jsx(AppBar, { position: "static", elevation: 0, sx: {
+                position: 'fixed',
+                top: 0,
+                left: 0,
+            }, children: _jsxs(Toolbar, { sx: { justifyContent: 'space-between', px: 2 }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 2 }, children: [_jsx(IconButton, { onClick: () => {
+                                    window.location.href = '/';
+                                }, sx: {
+                                    color: 'white',
+                                    backgroundColor: '#2a2a2a',
+                                    '&:hover': {
+                                        backgroundColor: '#3a3a3a',
+                                    },
+                                }, children: _jsx(Home, {}) }), _jsxs(Tabs, { value: tabValue, onChange: handleTabChange, sx: { minHeight: '40px' }, children: [_jsx(Tab, { label: "Project Title 1" }), _jsx(Tab, { label: "Project Title 1" }), _jsx(Tab, { label: "Project Title 1" })] })] }), _jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 2 }, children: [_jsx(Button, { variant: "contained", startIcon: _jsx(Share, {}), sx: {
+                                    backgroundColor: '#8b5cf6',
+                                    color: 'white',
+                                    textTransform: 'none',
+                                    borderRadius: '8px',
+                                    px: 3,
+                                    '&:hover': {
+                                        backgroundColor: '#7c3aed',
+                                    },
+                                }, children: "Share" }), _jsx(Avatar, { sx: {
+                                    backgroundColor: '#2a2a2a',
+                                    color: 'white',
+                                    width: 40,
+                                    height: 40,
+                                }, children: _jsx(Person, {}) })] })] }) }) }));
+}
+//# sourceMappingURL=Header.js.map

package/dist/out-tsc/packages/diagrams/src/lib/components/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../../../../../packages/diagrams/src/lib/components/Header.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,MAAM,EACN,OAAO,EACP,UAAU,EACV,MAAM,EACN,IAAI,EACJ,GAAG,EACH,GAAG,EACH,MAAM,EACN,aAAa,EACb,WAAW,GACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAE1D,MAAM,SAAS,GAAG,WAAW,CAAC;IAC5B,OAAO,EAAE;QACP,IAAI,EAAE,MAAM;QACZ,OAAO,EAAE;YACP,IAAI,EAAE,SAAS,EAAE,oCAAoC;SACtD;QACD,UAAU,EAAE;YACV,OAAO,EAAE,SAAS;YAClB,KAAK,EAAE,SAAS;SACjB;KACF;IACD,UAAU,EAAE;QACV,SAAS,EAAE;YACT,cAAc,EAAE;gBACd,IAAI,EAAE;oBACJ,eAAe,EAAE,SAAS;oBAC1B,YAAY,EAAE,gBAAgB;iBAC/B;aACF;SACF;QACD,MAAM,EAAE;YACN,cAAc,EAAE;gBACd,IAAI,EAAE;oBACJ,eAAe,EAAE,SAAS;oBAC1B,KAAK,EAAE,SAAS;oBAChB,WAAW,EAAE,KAAK;oBAClB,YAAY,EAAE,KAAK;oBACnB,SAAS,EAAE,MAAM;oBACjB,aAAa,EAAE,MAAM;oBACrB,gBAAgB,EAAE;wBAChB,eAAe,EAAE,SAAS;wBAC1B,KAAK,EAAE,SAAS;qBACjB;iBACF;aACF;SACF;QACD,OAAO,EAAE;YACP,cAAc,EAAE;gBACd,SAAS,EAAE;oBACT,OAAO,EAAE,MAAM,EAAE,6BAA6B;iBAC/C;aACF;SACF;KACF;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,MAAM;IAC5B,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,QAAgB,EAAE,EAAE;QACxE,WAAW,CAAC,QAAQ,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,aAAa,IAAC,KAAK,EAAE,SAAS,YAC7B,KAAC,MAAM,IACL,QAAQ,EAAC,QAAQ,EACjB,SAAS,EAAE,CAAC,EACZ,EAAE,EAAE;gBACF,QAAQ,EAAE,OAAO;gBACjB,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,CAAC;aACR,YAED,MAAC,OAAO,IAAC,EAAE,EAAE,EAAE,cAAc,EAAE,eAAe,EAAE,EAAE,EAAE,CAAC,EAAE,aAErD,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACxD,KAAC,UAAU,IACT,OAAO,EAAE,GAAG,EAAE;oCACZ,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG,CAAC;gCAC7B,CAAC,EACD,EAAE,EAAE;oCACF,KAAK,EAAE,OAAO;oCACd,eAAe,EAAE,SAAS;oCAC1B,SAAS,EAAE;wCACT,eAAe,EAAE,SAAS;qCAC3B;iCACF,YAED,KAAC,IAAI,KAAG,GACG,EAEb,MAAC,IAAI,IACH,KAAK,EAAE,QAAQ,EACf,QAAQ,EAAE,eAAe,EACzB,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,aAEzB,KAAC,GAAG,IAAC,KAAK,EAAC,iBAAiB,GAAG,EAC/B,KAAC,GAAG,IAAC,KAAK,EAAC,iBAAiB,GAAG,EAC/B,KAAC,GAAG,IAAC,KAAK,EAAC,iBAAiB,GAAG,IAC1B,IACH,EAGN,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACxD,KAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,SAAS,EAAE,KAAC,KAAK,KAAG,EACpB,EAAE,EAAE;oCACF,eAAe,EAAE,SAAS;oCAC1B,KAAK,EAAE,OAAO;oCACd,aAAa,EAAE,MAAM;oCACrB,YAAY,EAAE,KAAK;oCACnB,EAAE,EAAE,CAAC;oCACL,SAAS,EAAE;wCACT,eAAe,EAAE,SAAS;qCAC3B;iCACF,sBAGM,EAET,KAAC,MAAM,IACL,EAAE,EAAE;oCACF,eAAe,EAAE,SAAS;oCAC1B,KAAK,EAAE,OAAO;oCACd,KAAK,EAAE,EAAE;oCACT,MAAM,EAAE,EAAE;iCACX,YAED,KAAC,MAAM,KAAG,GACH,IACL,IACE,GACH,GACK,CACjB,CAAC;AACJ,CAAC"}

package/dist/out-tsc/packages/diagrams/src/lib/components/MiniMapCommon.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { MiniMap } from '@xyflow/react';
+export default function MiniMapCommon() {
+    return (_jsx(MiniMap, { style: {
+            position: 'absolute',
+            bottom: 20,
+            left: 20,
+            width: 150,
+            height: 100,
+            border: '1px solid #404040',
+            backgroundColor: '#2a2a2a',
+            boxShadow: '0 2px 8px rgba(0,0,0,0.3)',
+        }, nodeColor: "#61dafb", nodeStrokeWidth: 1, maskColor: "rgba(42, 42, 42, 0.8)", pannable: true, zoomable: true }));
+}
+//# sourceMappingURL=MiniMapCommon.js.map

package/dist/out-tsc/packages/diagrams/src/lib/components/MiniMapCommon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MiniMapCommon.js","sourceRoot":"","sources":["../../../../../../../packages/diagrams/src/lib/components/MiniMapCommon.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAEvC,MAAM,CAAC,OAAO,UAAU,aAAa;IACnC,OAAO,CACL,KAAC,OAAO,IACN,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,MAAM,EAAE,EAAE;YACV,IAAI,EAAE,EAAE;YACR,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;YACX,MAAM,EAAE,mBAAmB;YAC3B,eAAe,EAAE,SAAS;YAC1B,SAAS,EAAE,2BAA2B;SACvC,EACD,SAAS,EAAC,SAAS,EACnB,eAAe,EAAE,CAAC,EAClB,SAAS,EAAC,uBAAuB,EACjC,QAAQ,EAAE,IAAI,EACd,QAAQ,EAAE,IAAI,GACd,CACH,CAAA;AACH,CAAC"}

package/dist/out-tsc/packages/diagrams/src/lib/components/ResizeIcon.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// ResizeIcon component for node resizing
+function ResizeIcon({ size = 20, color = '#61dafb', hoverColor = '#4fc3f7' }) {
+    return (_jsx("div", { style: {
+            width: '100%', // Fill the entire NodeResizeControl area
+            height: '100%', // Fill the entire NodeResizeControl area
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            borderRadius: '4px',
+            transition: 'all 0.2s ease',
+            backgroundColor: 'rgba(0, 0, 0, 0.9)',
+            border: '2px solid rgba(255, 255, 255, 0.9)',
+            boxShadow: '0 2px 8px rgba(0, 0, 0, 0.5)',
+            cursor: 'se-resize', // Direct cursor specification
+            position: 'absolute',
+            top: 0,
+            left: 0,
+            pointerEvents: 'auto', // Ensure pointer events work
+        }, onMouseEnter: (e) => {
+            const target = e.currentTarget;
+            target.style.backgroundColor = `${hoverColor}80`;
+            target.style.borderColor = hoverColor;
+            target.style.transform = 'scale(1.1)';
+            target.style.boxShadow = `0 4px 12px ${hoverColor}60`;
+            // Force cursor change
+            target.style.cursor = 'se-resize';
+        }, onMouseLeave: (e) => {
+            const target = e.currentTarget;
+            target.style.backgroundColor = 'rgba(0, 0, 0, 0.9)';
+            target.style.borderColor = 'rgba(255, 255, 255, 0.9)';
+            target.style.transform = 'scale(1)';
+            target.style.boxShadow = '0 2px 8px rgba(0, 0, 0, 0.5)';
+            target.style.cursor = 'se-resize';
+        }, title: "Drag to resize", children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", strokeWidth: "3", stroke: "currentColor", fill: "none", strokeLinecap: "round", strokeLinejoin: "round", style: {
+                color: color,
+                pointerEvents: 'none', // Prevent SVG from blocking cursor changes
+            }, children: [_jsx("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }), _jsx("polyline", { points: "16 20 20 20 20 16", strokeWidth: "3" }), _jsx("line", { x1: "14", y1: "14", x2: "20", y2: "20", strokeWidth: "2" }), _jsx("polyline", { points: "8 4 4 4 4 8", strokeWidth: "3" }), _jsx("line", { x1: "4", y1: "4", x2: "10", y2: "10", strokeWidth: "2" }), _jsx("circle", { cx: "12", cy: "12", r: "1", fill: "currentColor", opacity: "0.7" })] }) }));
+}
+export default ResizeIcon;
+//# sourceMappingURL=ResizeIcon.js.map

package/dist/out-tsc/packages/diagrams/src/lib/components/ResizeIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResizeIcon.js","sourceRoot":"","sources":["../../../../../../../packages/diagrams/src/lib/components/ResizeIcon.tsx"],"names":[],"mappings":"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"}

package/dist/out-tsc/packages/diagrams/src/lib/components/SideBar.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+export default function Sidebar({ children }) {
+    return (_jsx(Box, { sx: {
+            width: 350,
+            overflowY: 'auto',
+            height: '100%',
+            bgcolor: '#1a1a1a',
+            color: 'common.white',
+            p: 2,
+            boxSizing: 'border-box',
+            display: 'flex',
+            flexDirection: 'column',
+            // Custom scrollbar styling
+            '&::-webkit-scrollbar': {
+                width: '6px',
+            },
+            '&::-webkit-scrollbar-track': {
+                background: 'transparent',
+            },
+            '&::-webkit-scrollbar-thumb': {
+                background: '#444',
+                borderRadius: '3px',
+                '&:hover': {
+                    background: '#666',
+                },
+            },
+        }, children: children }));
+}
+//# sourceMappingURL=SideBar.js.map

package/dist/out-tsc/packages/diagrams/src/lib/components/SideBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideBar.js","sourceRoot":"","sources":["../../../../../../../packages/diagrams/src/lib/components/SideBar.tsx"],"names":[],"mappings":";AACA,OAAO,GAAG,MAAM,mBAAmB,CAAC;AAMpC,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAAE,QAAQ,EAAgB;IACxD,OAAO,CACL,KAAC,GAAG,IACF,EAAE,EAAE;YACF,KAAK,EAAE,GAAG;YACV,SAAS,EAAE,MAAM;YACjB,MAAM,EAAE,MAAM;YACd,OAAO,EAAE,SAAS;YAClB,KAAK,EAAE,cAAc;YACrB,CAAC,EAAE,CAAC;YACJ,SAAS,EAAE,YAAY;YACvB,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,2BAA2B;YAC3B,sBAAsB,EAAE;gBACtB,KAAK,EAAE,KAAK;aACb;YACD,4BAA4B,EAAE;gBAC5B,UAAU,EAAE,aAAa;aAC1B;YACD,4BAA4B,EAAE;gBAC5B,UAAU,EAAE,MAAM;gBAClB,YAAY,EAAE,KAAK;gBACnB,SAAS,EAAE;oBACT,UAAU,EAAE,MAAM;iBACnB;aACF;SACF,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC"}

package/dist/out-tsc/packages/diagrams/src/lib/components/automation/AutomationAISuggestionNode.js

@@ -0,0 +1,125 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from 'react';
+import { Handle, Position } from '@xyflow/react';
+import { Box, Typography, Chip, Button } from '@mui/material';
+import { getIconByName } from '../../utils/iconMapper';
+import { useTranslation } from 'react-i18next';
+export const AutomationAISuggestionNode = ({ data, selected }) => {
+    var _a, _b, _c;
+    const { t } = useTranslation();
+    const nodeRef = useRef(null);
+    const IconComponent = getIconByName(data.iconName || 'Lightbulb');
+    // Debug logging for node dimensions
+    useEffect(() => {
+        if (nodeRef.current) {
+            const rect = nodeRef.current.getBoundingClientRect();
+            const computedStyle = window.getComputedStyle(nodeRef.current);
+            console.log('AutomationAISuggestionNode Debug:', {
+                nodeId: data.label,
+                actualDimensions: {
+                    width: rect.width,
+                    height: rect.height,
+                    left: rect.left,
+                    top: rect.top
+                },
+                computedStyle: {
+                    width: computedStyle.width,
+                    height: computedStyle.height,
+                    padding: computedStyle.padding,
+                    border: computedStyle.border,
+                    boxShadow: computedStyle.boxShadow,
+                    margin: computedStyle.margin
+                },
+                handlePositions: {
+                    left: '-8px',
+                    right: '-8px'
+                }
+            });
+        }
+    }, [data.label]);
+    return (_jsxs(Box, { ref: nodeRef, sx: {
+            width: '336px',
+            minHeight: '150px',
+            backgroundColor: '#181C25',
+            border: selected ? '2px solid #3b82f6' : '1px solid #1e293b',
+            borderRadius: '12px',
+            color: '#ffffff',
+            position: 'relative',
+            boxShadow: selected ? '0 0 0 2px rgba(59, 130, 246, 0.5)' : '0 4px 8px rgba(0, 0, 0, 0.3)',
+            transition: 'all 0.2s ease',
+            cursor: 'default',
+            overflow: 'hidden',
+        }, children: [_jsxs(Box, { sx: {
+                    backgroundColor: 'rgba(30, 58, 138, 0.8)', // #1E3A8A with 0.8 opacity
+                    padding: '8px 16px',
+                    borderRadius: '12px 12px 0 0',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'space-between'
+                }, children: [_jsx(Typography, { variant: "body2", sx: { color: '#ffffff', fontSize: '12px', fontWeight: 500 }, children: ((_a = data.formData) === null || _a === void 0 ? void 0 : _a.badgeText) || t('automation.aiSuggestionNode.badgeSuggested') }), _jsx(Chip, { label: t('automation.aiSuggestionNode.badgeAI'), size: "small", sx: {
+                            bgcolor: 'rgba(147, 197, 253, 0.15)',
+                            color: '#93C5FD',
+                            height: '20px',
+                            fontSize: '11px',
+                            borderRadius: '10px'
+                        } })] }), _jsxs(Box, { sx: { padding: '16px' }, children: [_jsx(Box, { sx: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', mb: 2 }, children: _jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1.5 }, children: [_jsx(Box, { sx: {
+                                        width: '32px',
+                                        height: '32px',
+                                        backgroundColor: '#0ea5e9',
+                                        borderRadius: '50%',
+                                        display: 'flex',
+                                        alignItems: 'center',
+                                        justifyContent: 'center',
+                                    }, children: _jsx(IconComponent, { sx: { color: 'white', fontSize: '18px' } }) }), _jsx(Typography, { variant: "h6", sx: { fontWeight: 600, fontSize: '16px' }, children: data.label })] }) }), _jsx(Box, { sx: {
+                            backgroundColor: '#1F2937',
+                            borderRadius: '8px',
+                            padding: '12px',
+                            mb: 2,
+                            border: '1px solid #374151'
+                        }, children: _jsx(Box, { sx: {
+                                backgroundColor: 'transparent',
+                                borderRadius: '4px',
+                                padding: '8px',
+                                border: '1px solid #4B5563',
+                                minHeight: '40px',
+                                display: 'flex',
+                                alignItems: 'center'
+                            }, children: _jsx(Typography, { variant: "body2", sx: {
+                                    color: '#9CA3AF',
+                                    fontSize: '12px',
+                                    lineHeight: 1.4,
+                                    m: 0
+                                }, children: data.description }) }) }), _jsxs(Box, { sx: {
+                            backgroundColor: '#1F2937',
+                            borderRadius: '8px',
+                            padding: '12px',
+                            mb: 2,
+                            border: '1px solid #374151'
+                        }, children: [((_b = data.formData) === null || _b === void 0 ? void 0 : _b.mapping) ? (_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', mb: 1 }, children: [_jsx(Typography, { variant: "body2", sx: { color: '#9CA3AF', fontSize: '11px' }, children: data.formData.mapping.from }), _jsxs(Typography, { variant: "body2", sx: { color: '#9CA3AF', fontSize: '11px' }, children: ["\u2192 ", data.formData.mapping.to] })] })) : null, (((_c = data.formData) === null || _c === void 0 ? void 0 : _c.pointers) || []).map((p, i) => (_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1, mb: 0.5 }, children: [_jsx(Box, { sx: { color: '#93C5FD', fontSize: '14px' }, children: "\u2022" }), _jsx(Typography, { variant: "body2", sx: { color: '#E5E7EB', fontSize: '11px' }, children: p })] }, i)))] }), _jsx(Button, { variant: "outlined", fullWidth: true, sx: {
+                            backgroundColor: 'rgba(37, 99, 235, 0.15)', // #2563EB with 0.15 opacity
+                            borderColor: '#2563EB',
+                            color: '#93C5FD',
+                            textTransform: 'none',
+                            fontSize: '13px',
+                            fontWeight: 600,
+                            '&:hover': {
+                                backgroundColor: 'rgba(37, 99, 235, 0.2)',
+                                borderColor: '#2563EB'
+                            }
+                        }, children: t('automation.aiSuggestionNode.addThis') }), _jsx(Box, { sx: { mt: 1 } })] }), _jsx(Handle, { type: "target", position: Position.Left, id: "left", style: {
+                    background: '#3b82f6',
+                    width: '12px',
+                    height: '12px',
+                    border: '2px solid white',
+                    left: '-8px',
+                    opacity: 0,
+                } }), _jsx(Handle, { type: "source", position: Position.Right, id: "right", style: {
+                    background: '#3b82f6',
+                    width: '12px',
+                    height: '12px',
+                    border: '2px solid white',
+                    right: '-8px',
+                    opacity: 0,
+                } })] }));
+};
+//# sourceMappingURL=AutomationAISuggestionNode.js.map