@flowuent-org/diagramming-core 1.0.7 → 1.1.0

package/dist/out-tsc/packages/diagrams/src/lib/templates/node-forms/GraphQLForm.js

@@ -0,0 +1,273 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useCallback, memo } from 'react';
+import { Box, Button, TextField, Typography, Stack, IconButton, Divider, Accordion, AccordionSummary, AccordionDetails, Tab, Tabs, } from '@mui/material';
+import { Add as AddIcon, Delete as DeleteIcon, ExpandMore as ExpandMoreIcon } from '@mui/icons-material';
+import { useTranslation } from 'react-i18next';
+import { useFormValidation } from '../../hooks/useFormValidation';
+import GraphQLCustomCodeModal from '../../components/GraphQLCustomCodeModal';
+const GraphQLForm = ({ formData, handleInputChange, handleMultipleInputChanges, }) => {
+    const { t } = useTranslation();
+    const [expandedSections, setExpandedSections] = useState({
+        operation: true,
+        fields: true,
+        arguments: true,
+        variables: true,
+        headers: false,
+    });
+    const [isModalOpen, setModalOpen] = useState(false);
+    const { validationState, setFieldError, setFieldTouched, shouldShowFieldError, getFieldError, clearFieldError, } = useFormValidation();
+    // Handle section expansion - memoized to prevent recreation
+    const handleSectionToggle = useCallback((section) => {
+        setExpandedSections(prev => (Object.assign(Object.assign({}, prev), { [section]: !prev[section] })));
+    }, []);
+    // Handle mode change
+    const handleModeChange = useCallback((event, newMode) => {
+        handleInputChange('mode', newMode);
+    }, [handleInputChange]);
+    // Handle modal
+    const handleModalOpen = useCallback(() => {
+        setModalOpen(true);
+    }, []);
+    const handleModalClose = useCallback(() => {
+        setModalOpen(false);
+    }, []);
+    const handleCustomQueryChange = useCallback((code) => {
+        handleInputChange('customQuery', code);
+    }, [handleInputChange]);
+    // Handle header management
+    const addHeader = useCallback(() => {
+        const newHeaders = [...(formData.headers || []), { key: '', value: '' }];
+        handleInputChange('headers', newHeaders);
+    }, [formData.headers, handleInputChange]);
+    const updateHeader = useCallback((index, field, value) => {
+        const updatedHeaders = [...(formData.headers || [])];
+        updatedHeaders[index] = Object.assign(Object.assign({}, updatedHeaders[index]), { [field]: value });
+        handleInputChange('headers', updatedHeaders);
+    }, [formData.headers, handleInputChange]);
+    const removeHeader = useCallback((index) => {
+        const updatedHeaders = (formData.headers || []).filter((_, i) => i !== index);
+        handleInputChange('headers', updatedHeaders);
+    }, [formData.headers, handleInputChange]);
+    // Handle arguments management
+    const addArgument = useCallback(() => {
+        const newArguments = [...(formData.arguments || []), { key: '', value: '' }];
+        handleInputChange('arguments', newArguments);
+    }, [formData.arguments, handleInputChange]);
+    const updateArgument = useCallback((index, field, value) => {
+        const updatedArguments = [...(formData.arguments || [])];
+        updatedArguments[index] = Object.assign(Object.assign({}, updatedArguments[index]), { [field]: value });
+        handleInputChange('arguments', updatedArguments);
+    }, [formData.arguments, handleInputChange]);
+    const removeArgument = useCallback((index) => {
+        const updatedArguments = (formData.arguments || []).filter((_, i) => i !== index);
+        handleInputChange('arguments', updatedArguments);
+    }, [formData.arguments, handleInputChange]);
+    // Handle fields management
+    const addField = useCallback(() => {
+        const newFields = [...(formData.fields || []), { name: '' }];
+        handleInputChange('fields', newFields);
+    }, [formData.fields, handleInputChange]);
+    const updateField = useCallback((index, field, value) => {
+        const updatedFields = [...(formData.fields || [])];
+        updatedFields[index] = Object.assign(Object.assign({}, updatedFields[index]), { [field]: value });
+        handleInputChange('fields', updatedFields);
+    }, [formData.fields, handleInputChange]);
+    const removeField = useCallback((index) => {
+        const updatedFields = (formData.fields || []).filter((_, i) => i !== index);
+        handleInputChange('fields', updatedFields);
+    }, [formData.fields, handleInputChange]);
+    // Handle variables management
+    const addVariable = useCallback(() => {
+        const newVariables = [...(formData.variables || []), { key: '', value: '', type: 'String' }];
+        handleInputChange('variables', newVariables);
+    }, [formData.variables, handleInputChange]);
+    const updateVariable = useCallback((index, field, value) => {
+        const updatedVariables = [...(formData.variables || [])];
+        updatedVariables[index] = Object.assign(Object.assign({}, updatedVariables[index]), { [field]: value });
+        handleInputChange('variables', updatedVariables);
+    }, [formData.variables, handleInputChange]);
+    const removeVariable = useCallback((index) => {
+        const updatedVariables = (formData.variables || []).filter((_, i) => i !== index);
+        handleInputChange('variables', updatedVariables);
+    }, [formData.variables, handleInputChange]);
+    // Memoized handlers for accordion toggles
+    const handleOperationToggle = useCallback(() => {
+        handleSectionToggle('operation');
+    }, [handleSectionToggle]);
+    const handleFieldsToggle = useCallback(() => {
+        handleSectionToggle('fields');
+    }, [handleSectionToggle]);
+    const handleArgumentsToggle = useCallback(() => {
+        handleSectionToggle('arguments');
+    }, [handleSectionToggle]);
+    const handleVariablesToggle = useCallback(() => {
+        handleSectionToggle('variables');
+    }, [handleSectionToggle]);
+    const handleHeadersToggle = useCallback(() => {
+        handleSectionToggle('headers');
+    }, [handleSectionToggle]);
+    const graphqlFormStyles = {
+        accordion: {
+            backgroundColor: 'transparent',
+            color: '#FFFFFF',
+            '&:before': {
+                backgroundColor: 'transparent',
+            },
+            '& .MuiAccordionSummary-root': {
+                color: '#FFFFFF',
+            },
+        },
+        textField: {
+            '& .MuiOutlinedInput-root': {
+                color: '#FFFFFF',
+                '& fieldset': {
+                    borderColor: '#8E8E93',
+                },
+                '&:hover fieldset': {
+                    borderColor: '#FFFFFF',
+                },
+                '&.Mui-focused fieldset': {
+                    borderColor: '#3688A2',
+                },
+            },
+            '& .MuiInputLabel-root': {
+                color: '#8E8E93',
+                '&.Mui-focused': {
+                    color: '#3688A2',
+                },
+            },
+        },
+    };
+    // Generate GraphQL query preview
+    const generateQueryPreview = useCallback(() => {
+        const operationType = formData.operationType || 'query';
+        const operationName = formData.operationName ? ` ${formData.operationName}` : '';
+        const rootField = formData.rootField || 'field';
+        // Build arguments string
+        const args = (formData.arguments || [])
+            .filter(arg => arg.key && arg.value)
+            .map(arg => `${arg.key}: ${arg.value}`)
+            .join(', ');
+        const argsString = args ? `(${args})` : '';
+        // Build fields string
+        const fields = (formData.fields || [])
+            .filter(field => field.name)
+            .map(field => field.name)
+            .join('\n    ');
+        const fieldsString = fields ? ` {\n    ${fields}\n  }` : '';
+        return `${operationType}${operationName} {\n  ${rootField}${argsString}${fieldsString}\n}`;
+    }, [formData]);
+    return (_jsxs(Stack, { spacing: 2, children: [_jsxs(Tabs, { value: formData.mode || 'normal', onChange: handleModeChange, TabIndicatorProps: { style: { display: 'none' } }, children: [_jsx(Tab, { value: 'normal', label: t('graphqlForm.normal') }), _jsx(Tab, { value: 'advanced', label: t('graphqlForm.advanced') })] }), formData.mode !== 'advanced' && (_jsxs(_Fragment, { children: [_jsxs(Stack, { direction: "row", spacing: 2, children: [_jsx(Box, { sx: { minWidth: 140 }, children: _jsxs("select", { value: formData.operationType || 'query', onChange: (e) => handleInputChange('operationType', e.target.value), style: {
+                                        width: '100%',
+                                        height: '100%',
+                                        padding: '8px 12px',
+                                        backgroundColor: 'transparent',
+                                        color: '#FFFFFF',
+                                        border: '1px solid #8E8E93',
+                                        borderRadius: '4px',
+                                        fontSize: '14px',
+                                        outline: 'none',
+                                        cursor: 'pointer'
+                                    }, onFocus: (e) => {
+                                        e.target.style.borderColor = '#3688A2';
+                                    }, onBlur: (e) => {
+                                        e.target.style.borderColor = '#8E8E93';
+                                    }, children: [_jsx("option", { value: "query", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Query" }), _jsx("option", { value: "mutation", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Mutation" }), _jsx("option", { value: "subscription", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Subscription" })] }) }), _jsx(TextField, { fullWidth: true, label: "GraphQL Endpoint URL", value: formData.url || '', onChange: (e) => handleInputChange('url', e.target.value), placeholder: "https://api.example.com/graphql", sx: graphqlFormStyles.textField })] }), _jsx(TextField, { fullWidth: true, label: "Operation Name (optional)", value: formData.operationName || '', onChange: (e) => handleInputChange('operationName', e.target.value), placeholder: "GetUser", sx: graphqlFormStyles.textField }), _jsx(TextField, { fullWidth: true, label: "Root Field", value: formData.rootField || '', onChange: (e) => handleInputChange('rootField', e.target.value), placeholder: "user, posts, createUser, etc.", sx: graphqlFormStyles.textField }), _jsxs(Accordion, { expanded: expandedSections.operation, onChange: handleOperationToggle, sx: graphqlFormStyles.accordion, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { sx: { color: '#FFFFFF' } }), children: _jsx(Typography, { sx: { color: '#FFFFFF' }, children: "Query Preview" }) }), _jsx(AccordionDetails, { children: _jsx(Box, { sx: {
+                                        backgroundColor: '#1a1a1a',
+                                        padding: 2,
+                                        borderRadius: 1,
+                                        fontFamily: 'monospace',
+                                        fontSize: '14px',
+                                        color: '#FFFFFF',
+                                        whiteSpace: 'pre-wrap',
+                                        border: '1px solid #3a3a3a',
+                                    }, children: generateQueryPreview() }) })] }), _jsxs(Accordion, { expanded: expandedSections.fields, onChange: handleFieldsToggle, sx: graphqlFormStyles.accordion, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { sx: { color: '#FFFFFF' } }), children: _jsx(Typography, { sx: { color: '#FFFFFF' }, children: "Fields to Fetch" }) }), _jsx(AccordionDetails, { children: _jsxs(Stack, { spacing: 1, children: [(formData.fields || []).map((field, index) => (_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(TextField, { label: "Field Name", value: field.name, onChange: (e) => updateField(index, 'name', e.target.value), size: "small", placeholder: "id, name, email, etc.", sx: graphqlFormStyles.textField }), _jsx(IconButton, { onClick: () => removeField(index), sx: { color: '#FF6B6B' }, children: _jsx(DeleteIcon, {}) })] }, index))), _jsx(Button, { startIcon: _jsx(AddIcon, {}), onClick: addField, sx: {
+                                                color: '#3688A2',
+                                                borderColor: '#3688A2',
+                                                '&:hover': {
+                                                    borderColor: '#4A90E2',
+                                                    backgroundColor: 'rgba(54, 136, 162, 0.1)',
+                                                },
+                                            }, variant: "outlined", children: "Add Field" })] }) })] }), _jsxs(Accordion, { expanded: expandedSections.arguments, onChange: handleArgumentsToggle, sx: graphqlFormStyles.accordion, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { sx: { color: '#FFFFFF' } }), children: _jsx(Typography, { sx: { color: '#FFFFFF' }, children: "Arguments / Filters" }) }), _jsx(AccordionDetails, { children: _jsxs(Stack, { spacing: 1, children: [(formData.arguments || []).map((arg, index) => (_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(TextField, { label: "Key", value: arg.key, onChange: (e) => updateArgument(index, 'key', e.target.value), size: "small", placeholder: "id, limit, etc.", sx: graphqlFormStyles.textField }), _jsx(TextField, { label: "Value", value: arg.value, onChange: (e) => updateArgument(index, 'value', e.target.value), size: "small", placeholder: "1, 10, etc.", sx: graphqlFormStyles.textField }), _jsx(IconButton, { onClick: () => removeArgument(index), sx: { color: '#FF6B6B' }, children: _jsx(DeleteIcon, {}) })] }, index))), _jsx(Button, { startIcon: _jsx(AddIcon, {}), onClick: addArgument, sx: {
+                                                color: '#3688A2',
+                                                borderColor: '#3688A2',
+                                                '&:hover': {
+                                                    borderColor: '#4A90E2',
+                                                    backgroundColor: 'rgba(54, 136, 162, 0.1)',
+                                                },
+                                            }, variant: "outlined", children: "Add Argument" })] }) })] }), _jsxs(Accordion, { expanded: expandedSections.variables, onChange: handleVariablesToggle, sx: graphqlFormStyles.accordion, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { sx: { color: '#FFFFFF' } }), children: _jsx(Typography, { sx: { color: '#FFFFFF' }, children: "Variables (optional)" }) }), _jsxs(AccordionDetails, { children: [_jsx(Typography, { variant: "body2", sx: { color: '#8E8E93', mb: 2 }, children: "Variables make your GraphQL queries dynamic. Define variables here and use them in your query arguments. Example: Define variable \"id\" with type \"ID\" and use it in arguments as \"id: $id\"." }), _jsxs(Stack, { spacing: 1, children: [(formData.variables || []).map((variable, index) => (_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(TextField, { label: "Variable Name", value: variable.key, onChange: (e) => updateVariable(index, 'key', e.target.value), size: "small", placeholder: "id (without $)", sx: Object.assign(Object.assign({}, graphqlFormStyles.textField), { flex: 1.5 }) }), _jsx(TextField, { label: "Default Value", value: variable.value, onChange: (e) => updateVariable(index, 'value', e.target.value), size: "small", placeholder: "123, 10, true, etc.", sx: Object.assign(Object.assign({}, graphqlFormStyles.textField), { flex: 1.5 }) }), _jsx(Box, { sx: { minWidth: 80, maxWidth: 80 }, children: _jsxs("select", { value: variable.type, onChange: (e) => updateVariable(index, 'type', e.target.value), style: {
+                                                                width: '100%',
+                                                                height: '40px',
+                                                                padding: '8px 12px',
+                                                                backgroundColor: 'transparent',
+                                                                color: '#FFFFFF',
+                                                                border: '1px solid #8E8E93',
+                                                                borderRadius: '4px',
+                                                                fontSize: '14px',
+                                                                outline: 'none',
+                                                                cursor: 'pointer'
+                                                            }, onFocus: (e) => {
+                                                                e.target.style.borderColor = '#3688A2';
+                                                            }, onBlur: (e) => {
+                                                                e.target.style.borderColor = '#8E8E93';
+                                                            }, children: [_jsx("option", { value: "String", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "String" }), _jsx("option", { value: "Int", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Int" }), _jsx("option", { value: "Float", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Float" }), _jsx("option", { value: "Boolean", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Boolean" }), _jsx("option", { value: "ID", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "ID" })] }) }), _jsx(IconButton, { onClick: () => removeVariable(index), sx: { color: '#FF6B6B' }, children: _jsx(DeleteIcon, {}) })] }, index))), _jsx(Button, { startIcon: _jsx(AddIcon, {}), onClick: addVariable, sx: {
+                                                    color: '#3688A2',
+                                                    borderColor: '#3688A2',
+                                                    '&:hover': {
+                                                        borderColor: '#4A90E2',
+                                                        backgroundColor: 'rgba(54, 136, 162, 0.1)',
+                                                    },
+                                                }, variant: "outlined", children: "Add Variable" })] })] })] }), _jsxs(Accordion, { expanded: expandedSections.headers, onChange: handleHeadersToggle, sx: graphqlFormStyles.accordion, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMoreIcon, { sx: { color: '#FFFFFF' } }), children: _jsx(Typography, { sx: { color: '#FFFFFF' }, children: "Headers" }) }), _jsx(AccordionDetails, { children: _jsxs(Stack, { spacing: 1, children: [(formData.headers || []).map((header, index) => (_jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [_jsx(TextField, { label: "Key", value: header.key, onChange: (e) => updateHeader(index, 'key', e.target.value), size: "small", sx: graphqlFormStyles.textField }), _jsx(TextField, { label: "Value", value: header.value, onChange: (e) => updateHeader(index, 'value', e.target.value), size: "small", sx: graphqlFormStyles.textField }), _jsx(IconButton, { onClick: () => removeHeader(index), sx: { color: '#FF6B6B' }, children: _jsx(DeleteIcon, {}) })] }, index))), _jsx(Button, { startIcon: _jsx(AddIcon, {}), onClick: addHeader, sx: {
+                                                color: '#3688A2',
+                                                borderColor: '#3688A2',
+                                                '&:hover': {
+                                                    borderColor: '#4A90E2',
+                                                    backgroundColor: 'rgba(54, 136, 162, 0.1)',
+                                                },
+                                            }, variant: "outlined", children: "Add Header" })] }) })] }), _jsx(Divider, { sx: { borderColor: '#3a3a3a' } }), _jsx(Typography, { variant: "h6", sx: { color: '#FFFFFF' }, children: "Response Configuration" }), _jsxs(Stack, { direction: "row", spacing: 2, children: [_jsx(TextField, { label: "Response Variable Name", value: formData.responseVariable || '', onChange: (e) => handleInputChange('responseVariable', e.target.value), placeholder: "userData", sx: graphqlFormStyles.textField }), _jsx(Box, { sx: { minWidth: 120 }, children: _jsxs("select", { value: formData.responseDataType || 'Object', onChange: (e) => handleInputChange('responseDataType', e.target.value), style: {
+                                        width: '100%',
+                                        height: '100%',
+                                        padding: '8px 12px',
+                                        backgroundColor: 'transparent',
+                                        color: '#FFFFFF',
+                                        border: '1px solid #8E8E93',
+                                        borderRadius: '4px',
+                                        fontSize: '14px',
+                                        outline: 'none',
+                                        cursor: 'pointer'
+                                    }, onFocus: (e) => {
+                                        e.target.style.borderColor = '#3688A2';
+                                    }, onBlur: (e) => {
+                                        e.target.style.borderColor = '#8E8E93';
+                                    }, children: [_jsx("option", { value: "String", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "String" }), _jsx("option", { value: "Object", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Object" }), _jsx("option", { value: "Array", style: { backgroundColor: '#2a2a2a', color: '#FFFFFF' }, children: "Array" })] }) })] })] })), formData.mode === 'advanced' && (_jsxs(Box, { children: [_jsx(Typography, { variant: "h6", sx: { color: '#8E8E93', mb: 2 }, children: t('graphqlForm.advanced') }), _jsx(Button, { variant: "contained", onClick: handleModalOpen, sx: {
+                            backgroundColor: '#3688A2',
+                            '&:hover': {
+                                backgroundColor: '#2a6b7a',
+                            },
+                        }, children: t('graphqlForm.injectCustomQuery') })] })), _jsx(GraphQLCustomCodeModal, { open: isModalOpen, onClose: handleModalClose, code: formData.customQuery || '', onCodeChange: handleCustomQueryChange, title: t('graphqlForm.customQuery'), description: t('graphqlForm.customQueryDescription'), onSave: handleModalClose })] }));
+};
+// Memoize the component to prevent unnecessary re-renders
+export default memo(GraphQLForm, (prevProps, nextProps) => {
+    // Only re-render if formData actually changes
+    const prevFormData = prevProps.formData;
+    const nextFormData = nextProps.formData;
+    // Check if formData reference is the same (most efficient)
+    if (prevFormData === nextFormData) {
+        return true; // Don't re-render
+    }
+    // Deep comparison for formData changes
+    return (prevFormData.type === nextFormData.type &&
+        prevFormData.mode === nextFormData.mode &&
+        prevFormData.operationType === nextFormData.operationType &&
+        prevFormData.operationName === nextFormData.operationName &&
+        prevFormData.rootField === nextFormData.rootField &&
+        prevFormData.url === nextFormData.url &&
+        JSON.stringify(prevFormData.headers) === JSON.stringify(nextFormData.headers) &&
+        JSON.stringify(prevFormData.arguments) === JSON.stringify(nextFormData.arguments) &&
+        JSON.stringify(prevFormData.fields) === JSON.stringify(nextFormData.fields) &&
+        JSON.stringify(prevFormData.variables) === JSON.stringify(nextFormData.variables) &&
+        prevFormData.responseVariable === nextFormData.responseVariable &&
+        prevFormData.responseDataType === nextFormData.responseDataType &&
+        prevFormData.customQuery === nextFormData.customQuery);
+});
+//# sourceMappingURL=GraphQLForm.js.map

package/dist/out-tsc/packages/diagrams/src/lib/templates/node-forms/GraphQLForm.js.map

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

package/dist/out-tsc/packages/diagrams/src/lib/templates/node-forms/IfNodeForm.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect } from 'react';
+import ExpressionInput from '../../atoms/ExpressionInput';
+import { useTranslation } from 'react-i18next';
+import { useFormValidation } from '../../hooks/useFormValidation';
+import { Box, Stack } from '@mui/material';
+export const IfNodeForm = ({ formData, handleInputChange, }) => {
+    const { t } = useTranslation();
+    const { validateIfNodeForm, setFieldTouched, shouldShowFieldError, getFieldError, clearFieldError, validationState, } = useFormValidation();
+    // Validate form when data changes, but only after user interaction
+    useEffect(() => {
+        // Only validate if the field has been touched by the user
+        if (validationState.touched.condition) {
+            // Add a small delay to give users time to type before showing validation errors
+            const timeoutId = setTimeout(() => {
+                validateIfNodeForm(formData);
+            }, 500); // 500ms delay
+            return () => clearTimeout(timeoutId);
+        }
+    }, [formData, validateIfNodeForm, validationState.touched.condition]);
+    const handleConditionChange = useCallback((newValue) => {
+        // Mark the field as touched when user starts typing
+        setFieldTouched('condition', true);
+        // Clear error when user starts typing
+        if (getFieldError('condition')) {
+            clearFieldError('condition');
+        }
+        handleInputChange('condition', newValue);
+    }, [handleInputChange, setFieldTouched, getFieldError, clearFieldError]);
+    // Handle field blur for validation
+    const handleFieldBlur = (fieldName) => {
+        setFieldTouched(fieldName, true);
+    };
+    return (_jsx("div", { children: _jsx(Stack, { spacing: 2, children: _jsx(Box, { children: _jsx(ExpressionInput, { label: t('ifNodeForm.condition'), value: formData.condition, onChange: handleConditionChange, showDataTypeDropdown: true, dataType: formData.conditionDataType || 'String', onDataTypeChange: (dataType) => {
+                        handleInputChange('conditionDataType', dataType);
+                        // Only re-validate if user has interacted with this field
+                        if (validationState.touched.condition) {
+                            setTimeout(() => {
+                                validateIfNodeForm(Object.assign(Object.assign({}, formData), { conditionDataType: dataType }));
+                            }, 100);
+                        }
+                    }, onValidationChange: (isValid, errors) => {
+                        // Clear old validation errors when new validation takes over
+                        if (isValid) {
+                            clearFieldError('condition');
+                        }
+                    } }) }) }) }));
+};
+//# sourceMappingURL=IfNodeForm.js.map

package/dist/out-tsc/packages/diagrams/src/lib/templates/node-forms/IfNodeForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IfNodeForm.js","sourceRoot":"","sources":["../../../../../../../../packages/diagrams/src/lib/templates/node-forms/IfNodeForm.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAU3C,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EACpD,QAAQ,EACR,iBAAiB,GACD,EAAE,EAAE;IACpB,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAC;IAE/B,MAAM,EACJ,kBAAkB,EAClB,eAAe,EACf,oBAAoB,EACpB,aAAa,EACb,eAAe,EACf,eAAe,GAChB,GAAG,iBAAiB,EAAE,CAAC;IAExB,mEAAmE;IACnE,SAAS,CAAC,GAAG,EAAE;QACb,0DAA0D;QAC1D,IAAI,eAAe,CAAC,OAAO,CAAC,SAAS,EAAE,CAAC;YACtC,gFAAgF;YAChF,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;gBAChC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;YAC/B,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,cAAc;YAEvB,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;QACvC,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,kBAAkB,EAAE,eAAe,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC;IAEtE,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,QAAoB,EAAE,EAAE;QACjE,oDAAoD;QACpD,eAAe,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;QAEnC,sCAAsC;QACtC,IAAI,aAAa,CAAC,WAAW,CAAC,EAAE,CAAC;YAC/B,eAAe,CAAC,WAAW,CAAC,CAAC;QAC/B,CAAC;QAED,iBAAiB,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;IAC3C,CAAC,EAAE,CAAC,iBAAiB,EAAE,eAAe,EAAE,aAAa,EAAE,eAAe,CAAC,CAAC,CAAC;IAEzE,mCAAmC;IACnC,MAAM,eAAe,GAAG,CAAC,SAAiB,EAAE,EAAE;QAC5C,eAAe,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,OAAO,CACL,wBACE,KAAC,KAAK,IAAC,OAAO,EAAE,CAAC,YACf,KAAC,GAAG,cACF,KAAC,eAAe,IACd,KAAK,EAAE,CAAC,CAAC,sBAAsB,CAAC,EAChC,KAAK,EAAE,QAAQ,CAAC,SAAS,EACzB,QAAQ,EAAE,qBAAqB,EAC/B,oBAAoB,EAAE,IAAI,EAC1B,QAAQ,EAAE,QAAQ,CAAC,iBAAiB,IAAI,QAAQ,EAChD,gBAAgB,EAAE,CAAC,QAAQ,EAAE,EAAE;wBAC7B,iBAAiB,CAAC,mBAAmB,EAAE,QAAQ,CAAC,CAAC;wBACjD,0DAA0D;wBAC1D,IAAI,eAAe,CAAC,OAAO,CAAC,SAAS,EAAE,CAAC;4BACtC,UAAU,CAAC,GAAG,EAAE;gCACd,kBAAkB,iCAAM,QAAQ,KAAE,iBAAiB,EAAE,QAAQ,IAAG,CAAC;4BACnE,CAAC,EAAE,GAAG,CAAC,CAAC;wBACV,CAAC;oBACH,CAAC,EACD,kBAAkB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;wBACtC,6DAA6D;wBAC7D,IAAI,OAAO,EAAE,CAAC;4BACZ,eAAe,CAAC,WAAW,CAAC,CAAC;wBAC/B,CAAC;oBACH,CAAC,GACD,GAME,GACA,GACJ,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/out-tsc/packages/diagrams/src/lib/templates/node-forms/LetNodeForm.js

@@ -0,0 +1,227 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect } from 'react';
+import { Button, Divider, Grid, TextField, Box, IconButton, FormControl, FormLabel, RadioGroup, FormControlLabel, Radio, Typography, Stack, Card, CardContent, } from '@mui/material';
+import DeleteIcon from '@mui/icons-material/Delete';
+import AddIcon from '@mui/icons-material/Add';
+import CodeIcon from '@mui/icons-material/Code';
+import ObjectIcon from '@mui/icons-material/DataObject';
+import ExpressionInput from '../../atoms/ExpressionInput';
+import { useTranslation } from 'react-i18next';
+import { useFormValidation } from '../../hooks/useFormValidation';
+import ValidationError from '../../atoms/ValidationError';
+export const LetNodeForm = ({ formData, handleInputChange, }) => {
+    var _a, _b;
+    const { t } = useTranslation();
+    const { validationState, setFieldError, setFieldTouched, shouldShowFieldError, getFieldError, clearFieldError, } = useFormValidation();
+    // Validate bindings when they change
+    useEffect(() => {
+        // Add a small delay to give users time to type before showing validation errors
+        const timeoutId = setTimeout(() => {
+            let bindingError = null;
+            if (!Array.isArray(formData.bindings)) {
+                bindingError = t('letNodeForm.validation.bindingArrayError');
+            }
+            else if (formData.bindings.length === 0) {
+                bindingError = t('letNodeForm.validation.bindingRequiredError');
+            }
+            else {
+                for (let i = 0; i < formData.bindings.length; i++) {
+                    const [name, expression] = formData.bindings[i];
+                    // Validate the binding name
+                    if (!name || name.trim() === '') {
+                        bindingError = t('letNodeForm.validation.bindingNameEmptyError', { index: i + 1 });
+                        break;
+                    }
+                    if (!/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(name)) {
+                        bindingError = t('letNodeForm.validation.bindingNameInvalidError', { name, index: i + 1 });
+                        break;
+                    }
+                    // Validate the binding expression
+                    if (!expression || (typeof expression === 'string' && expression.trim() === '')) {
+                        bindingError = t('letNodeForm.validation.bindingValueEmptyError', { index: i + 1 });
+                        break;
+                    }
+                }
+            }
+            setFieldError('bindings', bindingError);
+        }, 500); // 500ms delay
+        return () => clearTimeout(timeoutId);
+    }, [formData.bindings, setFieldError]);
+    // Only show general binding errors if at least one binding has been interacted with
+    const shouldShowGeneralBindingError = useCallback(() => {
+        if (!getFieldError('bindings'))
+            return false;
+        // Check if any binding field has been touched
+        return Object.keys(validationState.touched).some(key => key.startsWith('binding_'));
+    }, [getFieldError, validationState.touched]);
+    const handleBindingChange = useCallback((index, type, value) => {
+        const updatedBindings = [...formData.bindings];
+        const currentBinding = [...updatedBindings[index]];
+        updatedBindings[index] = type === 'name'
+            ? [value, currentBinding[1]]
+            : [currentBinding[0], value];
+        handleInputChange('bindings', updatedBindings);
+        // Clear binding error when user starts typing
+        if (getFieldError('bindings')) {
+            clearFieldError('bindings');
+        }
+    }, [formData.bindings, handleInputChange, getFieldError, clearFieldError]);
+    const handleAddBinding = useCallback(() => {
+        const newBinding = ['', ''];
+        const updatedBindings = [...formData.bindings, newBinding];
+        handleInputChange('bindings', updatedBindings);
+    }, [formData.bindings, handleInputChange]);
+    const handleRemoveBinding = useCallback((index) => {
+        const updatedBindings = formData.bindings.filter((_, i) => i !== index);
+        handleInputChange('bindings', updatedBindings);
+    }, [formData.bindings, handleInputChange]);
+    const handleNameChange = useCallback((index, value) => {
+        // Mark the field as touched when user starts typing
+        const fieldKey = `binding_${index}_name`;
+        setFieldTouched(fieldKey, true);
+        // Clear any existing error when user starts typing
+        if (getFieldError('bindings')) {
+            clearFieldError('bindings');
+        }
+        handleBindingChange(index, 'name', value);
+    }, [handleBindingChange, setFieldTouched, getFieldError, clearFieldError]);
+    const handleValueChange = useCallback((index, value) => {
+        // Mark the field as touched when user starts typing
+        const fieldKey = `binding_${index}_value`;
+        setFieldTouched(fieldKey, true);
+        // Clear any existing error when user starts typing
+        if (getFieldError('bindings')) {
+            clearFieldError('bindings');
+        }
+        handleBindingChange(index, 'value', value);
+    }, [handleBindingChange, setFieldTouched, getFieldError, clearFieldError]);
+    const handleFieldBlur = useCallback((fieldName) => {
+        setFieldTouched(fieldName, true);
+    }, [setFieldTouched]);
+    const handleBindingFieldBlur = useCallback((index, type) => {
+        const fieldKey = `binding_${index}_${type}`;
+        setFieldTouched(fieldKey, true);
+    }, [setFieldTouched]);
+    // Object creation handlers
+    const handleObjectPropertyChange = useCallback((index, field, value) => {
+        var _a, _b;
+        const updatedProperties = [...(((_a = formData.objectDefinition) === null || _a === void 0 ? void 0 : _a.properties) || [])];
+        updatedProperties[index] = Object.assign(Object.assign({}, updatedProperties[index]), { [field]: value });
+        handleInputChange('objectDefinition', Object.assign(Object.assign({}, formData.objectDefinition), { variableName: ((_b = formData.objectDefinition) === null || _b === void 0 ? void 0 : _b.variableName) || '', properties: updatedProperties }));
+    }, [formData.objectDefinition, handleInputChange]);
+    const handleAddObjectProperty = useCallback(() => {
+        var _a, _b;
+        const newProperty = { key: '', value: '' };
+        const updatedProperties = [...(((_a = formData.objectDefinition) === null || _a === void 0 ? void 0 : _a.properties) || []), newProperty];
+        handleInputChange('objectDefinition', Object.assign(Object.assign({}, formData.objectDefinition), { variableName: ((_b = formData.objectDefinition) === null || _b === void 0 ? void 0 : _b.variableName) || '', properties: updatedProperties }));
+    }, [formData.objectDefinition, handleInputChange]);
+    const handleRemoveObjectProperty = useCallback((index) => {
+        var _a, _b;
+        const updatedProperties = (((_a = formData.objectDefinition) === null || _a === void 0 ? void 0 : _a.properties) || []).filter((_, i) => i !== index);
+        handleInputChange('objectDefinition', Object.assign(Object.assign({}, formData.objectDefinition), { variableName: ((_b = formData.objectDefinition) === null || _b === void 0 ? void 0 : _b.variableName) || '', properties: updatedProperties }));
+    }, [formData.objectDefinition, handleInputChange]);
+    const handleVariableNameChange = useCallback((value) => {
+        var _a;
+        handleInputChange('objectDefinition', Object.assign(Object.assign({}, formData.objectDefinition), { variableName: value, properties: ((_a = formData.objectDefinition) === null || _a === void 0 ? void 0 : _a.properties) || [] }));
+    }, [formData.objectDefinition, handleInputChange]);
+    const handleCustomCodeChange = useCallback((value) => {
+        handleInputChange('customCode', value);
+    }, [handleInputChange]);
+    // Get field-specific error for individual binding fields
+    const getBindingFieldError = useCallback((index, type) => {
+        const binding = formData.bindings[index];
+        if (!binding)
+            return null;
+        // Only show errors if the field has been interacted with
+        const fieldKey = `binding_${index}_${type}`;
+        if (!validationState.touched[fieldKey]) {
+            return null;
+        }
+        if (type === 'name') {
+            // Replace old validateBindingName with inline validation
+            if (!binding[0] || binding[0].trim() === '') {
+                return t('letNodeForm.validation.bindingNameEmptyError', { index: index + 1 });
+            }
+            if (!/^[a-zA-Z_$][a-zA-Z0-9_$]*$/.test(binding[0])) {
+                return t('letNodeForm.validation.bindingNameInvalidError', { name: binding[0], index: index + 1 });
+            }
+        }
+        else {
+            // Replace old validateBindingValue with inline validation
+            if (!binding[1] || (typeof binding[1] === 'string' && binding[1].trim() === '')) {
+                return t('letNodeForm.validation.bindingValueEmptyError', { index: index + 1 });
+            }
+        }
+        return null;
+    }, [formData.bindings, validationState.touched]);
+    // Check if individual binding field should show error
+    const shouldShowBindingFieldError = useCallback((index, type) => {
+        const error = getBindingFieldError(index, type);
+        return !!error;
+    }, [getBindingFieldError]);
+    return (_jsxs(Box, { sx: { p: 2, backgroundColor: '#1e1e1e', color: 'white', minHeight: '100%' }, children: [_jsxs(FormControl, { component: "fieldset", sx: { mb: 3 }, children: [_jsx(FormLabel, { component: "legend", sx: { mb: 2, color: 'white' }, children: _jsx(Typography, { variant: "h6", sx: { color: 'white' }, children: t('letNodeForm.assignmentMode') }) }), _jsxs(RadioGroup, { value: formData.mode || 'simple', onChange: (e) => handleInputChange('mode', e.target.value), row: true, children: [_jsx(FormControlLabel, { value: "simple", control: _jsx(Radio, { sx: { color: '#1976d2', '&.Mui-checked': { color: '#1976d2' } } }), label: _jsx(Stack, { direction: "row", alignItems: "center", spacing: 1, children: _jsx(Typography, { sx: { color: 'white' }, children: t('letNodeForm.simpleVariables') }) }), sx: { color: 'white' } }), _jsx(FormControlLabel, { value: "object", control: _jsx(Radio, { sx: { color: '#1976d2', '&.Mui-checked': { color: '#1976d2' } } }), label: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, children: [_jsx(ObjectIcon, { fontSize: "small", sx: { color: '#1976d2' } }), _jsx(Typography, { sx: { color: 'white' }, children: t('letNodeForm.objectCreation') })] }), sx: { color: 'white' } }), _jsx(FormControlLabel, { value: "code", control: _jsx(Radio, { sx: { color: '#1976d2', '&.Mui-checked': { color: '#1976d2' } } }), label: _jsxs(Stack, { direction: "row", alignItems: "center", spacing: 1, children: [_jsx(CodeIcon, { fontSize: "small", sx: { color: '#1976d2' } }), _jsx(Typography, { sx: { color: 'white' }, children: t('letNodeForm.customCode') })] }), sx: { color: 'white' } })] })] }), formData.mode === 'simple' && (_jsxs(Box, { children: [formData.bindings.map(([name, expression], index) => (_jsxs(Box, { sx: { mb: 2 }, children: [_jsxs(Grid, { container: true, spacing: 2, alignItems: "center", children: [_jsx(Grid, { item: true, xs: 5, children: _jsxs(Box, { children: [_jsx(TextField, { fullWidth: true, label: t('letNodeForm.bindingName', { index: index + 1 }), value: name, onChange: (e) => handleNameChange(index, e.target.value), onBlur: () => handleBindingFieldBlur(index, 'name'), error: shouldShowBindingFieldError(index, 'name'), sx: {
+                                                        '& .MuiOutlinedInput-root': {
+                                                            backgroundColor: '#2d2d2d',
+                                                            color: 'white',
+                                                            '& fieldset': { borderColor: '#555' },
+                                                            '&:hover fieldset': { borderColor: '#777' },
+                                                            '&.Mui-focused fieldset': { borderColor: '#1976d2' }
+                                                        },
+                                                        '& .MuiInputLabel-root': { color: '#b0b0b0' },
+                                                        '& .MuiInputLabel-root.Mui-focused': { color: '#1976d2' }
+                                                    } }), _jsx(ValidationError, { error: getBindingFieldError(index, 'name'), show: shouldShowBindingFieldError(index, 'name') })] }) }), _jsx(Grid, { item: true, xs: 6, children: _jsxs(Box, { children: [_jsx(ExpressionInput, { label: t('letNodeForm.bindingValue', { index: index + 1 }), value: expression, onChange: (newExpression) => handleValueChange(index, newExpression), onValidationChange: (isValid, errors) => {
+                                                        if (!isValid && errors.length > 0) {
+                                                            setFieldError(`binding_${index}_value`, errors[0]);
+                                                        }
+                                                        else {
+                                                            clearFieldError(`binding_${index}_value`);
+                                                        }
+                                                    } }), _jsx(ValidationError, { error: getBindingFieldError(index, 'value'), show: shouldShowBindingFieldError(index, 'value') })] }) }), _jsx(Grid, { item: true, xs: 1, children: _jsx(IconButton, { onClick: () => handleRemoveBinding(index), color: "error", size: "small", title: t('letNodeForm.removeBinding'), sx: { color: '#f44336' }, children: _jsx(DeleteIcon, {}) }) })] }), shouldShowGeneralBindingError() && (_jsx(Box, { sx: { mt: 1 }, children: _jsx(ValidationError, { error: getFieldError('bindings'), show: true }) })), index < formData.bindings.length - 1 && (_jsx(Divider, { sx: { margin: '16px 0', borderColor: '#555' } }))] }, index))), _jsx(Button, { onClick: handleAddBinding, startIcon: _jsx(AddIcon, {}), variant: "outlined", sx: {
+                            borderColor: '#1976d2',
+                            color: '#1976d2',
+                            '&:hover': {
+                                borderColor: '#1565c0',
+                                backgroundColor: 'rgba(25, 118, 210, 0.1)'
+                            }
+                        }, children: t('letNodeForm.addBinding') })] })), formData.mode === 'object' && (_jsx(Card, { variant: "outlined", sx: { backgroundColor: '#2d2d2d', borderColor: '#555' }, children: _jsxs(CardContent, { sx: { backgroundColor: '#2d2d2d' }, children: [_jsx(Typography, { variant: "h6", gutterBottom: true, sx: { color: 'white' }, children: t('letNodeForm.objectCreation') }), _jsx(TextField, { fullWidth: true, label: t('letNodeForm.variableName'), value: ((_a = formData.objectDefinition) === null || _a === void 0 ? void 0 : _a.variableName) || '', onChange: (e) => handleVariableNameChange(e.target.value), sx: {
+                                mb: 3,
+                                '& .MuiOutlinedInput-root': {
+                                    backgroundColor: '#1e1e1e',
+                                    color: 'white',
+                                    '& fieldset': { borderColor: '#555' },
+                                    '&:hover fieldset': { borderColor: '#777' },
+                                    '&.Mui-focused fieldset': { borderColor: '#1976d2' }
+                                },
+                                '& .MuiInputLabel-root': { color: '#b0b0b0' },
+                                '& .MuiInputLabel-root.Mui-focused': { color: '#1976d2' }
+                            } }), _jsxs(Typography, { variant: "subtitle2", gutterBottom: true, sx: { color: 'white' }, children: [t('letNodeForm.properties'), ":"] }), (((_b = formData.objectDefinition) === null || _b === void 0 ? void 0 : _b.properties) || []).map((property, index) => (_jsx(Box, { children: _jsxs(Grid, { container: true, spacing: 2, alignItems: "center", sx: { mb: 2 }, children: [_jsx(Grid, { item: true, xs: 4, children: _jsx(TextField, { fullWidth: true, label: t('letNodeForm.propertyKey'), value: property.key, onChange: (e) => handleObjectPropertyChange(index, 'key', e.target.value), sx: {
+                                                '& .MuiOutlinedInput-root': {
+                                                    backgroundColor: '#1e1e1e',
+                                                    color: 'white',
+                                                    '& fieldset': { borderColor: '#555' },
+                                                    '&:hover fieldset': { borderColor: '#777' },
+                                                    '&.Mui-focused fieldset': { borderColor: '#1976d2' }
+                                                },
+                                                '& .MuiInputLabel-root': { color: '#b0b0b0' },
+                                                '& .MuiInputLabel-root.Mui-focused': { color: '#1976d2' }
+                                            } }) }), _jsx(Grid, { item: true, xs: 7, children: _jsx(ExpressionInput, { label: t('letNodeForm.propertyValue'), value: property.value, onChange: (newExpression) => handleObjectPropertyChange(index, 'value', newExpression) }) }), _jsx(Grid, { item: true, xs: 1, children: _jsx(IconButton, { onClick: () => handleRemoveObjectProperty(index), color: "error", size: "small", sx: { color: '#f44336' }, children: _jsx(DeleteIcon, {}) }) })] }) }, index))), _jsx(Button, { onClick: handleAddObjectProperty, startIcon: _jsx(AddIcon, {}), variant: "outlined", sx: {
+                                borderColor: '#1976d2',
+                                color: '#1976d2',
+                                '&:hover': {
+                                    borderColor: '#1565c0',
+                                    backgroundColor: 'rgba(25, 118, 210, 0.1)'
+                                }
+                            }, children: t('letNodeForm.addProperty') })] }) })), formData.mode === 'code' && (_jsx(Card, { variant: "outlined", sx: { backgroundColor: '#2d2d2d', borderColor: '#555' }, children: _jsxs(CardContent, { sx: { backgroundColor: '#2d2d2d' }, children: [_jsx(Typography, { variant: "h6", gutterBottom: true, sx: { color: 'white' }, children: t('letNodeForm.customCode') }), _jsx(TextField, { fullWidth: true, multiline: true, rows: 8, label: t('letNodeForm.javascriptCode'), value: formData.customCode || '', onChange: (e) => handleCustomCodeChange(e.target.value), placeholder: t('letNodeForm.codePlaceholder'), sx: {
+                                fontFamily: 'monospace',
+                                '& .MuiOutlinedInput-root': {
+                                    backgroundColor: '#1e1e1e',
+                                    color: 'white',
+                                    '& fieldset': { borderColor: '#555' },
+                                    '&:hover fieldset': { borderColor: '#777' },
+                                    '&.Mui-focused fieldset': { borderColor: '#1976d2' }
+                                },
+                                '& .MuiInputLabel-root': { color: '#b0b0b0' },
+                                '& .MuiInputLabel-root.Mui-focused': { color: '#1976d2' }
+                            } })] }) }))] }));
+};
+//# sourceMappingURL=LetNodeForm.js.map