@flowuent-org/diagramming-core 1.3.9 → 1.4.0

package/packages/common/src/lib/generateValidationSchema.ts

@@ -1,46 +0,0 @@
-import * as yup from 'yup';
-import { ValidationRules } from '@flowuent-labs/interfaces';
-
-// Function to generate dynamic validation schema
-export const generateValidationSchema = (
-  validation: ValidationRules
-): yup.ObjectSchema<any> => {
-  const schemaObject: { [key: string]: yup.AnySchema } = {};
-
-  for (const fieldName in validation) {
-    const fieldValidators = validation[fieldName];
-    let fieldSchema = yup.mixed() as any;
-
-    fieldValidators.forEach((validator) => {
-      switch (validator) {
-        case 'string':
-          fieldSchema = fieldSchema.concat(yup.string());
-          break;
-        case 'number':
-          fieldSchema = fieldSchema.concat(yup.number());
-          break;
-        case 'boolean':
-          fieldSchema = fieldSchema.concat(yup.boolean());
-          break;
-        case 'required':
-          fieldSchema = fieldSchema.required(`${fieldName} is required`);
-          break;
-        case 'positive':
-          fieldSchema = fieldSchema.positive(
-            `${fieldName} must be a positive number`
-          );
-          break;
-        case 'integer':
-          fieldSchema = fieldSchema.integer(`${fieldName} must be an integer`);
-          break;
-        // Add more validation rules as needed
-        default:
-          break;
-      }
-    });
-
-    schemaObject[fieldName] = fieldSchema;
-  }
-
-  return yup.object().shape(schemaObject);
-};

package/packages/common/tsconfig.json

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "jsx": "react-jsx",
-    "allowJs": false,
-    "esModuleInterop": false,
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ],
-  "extends": "../../tsconfig.base.json"
-}

package/packages/common/tsconfig.lib.json

@@ -1,24 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "types": [
-      "node",
-
-      "@nx/react/typings/cssmodule.d.ts",
-      "@nx/react/typings/image.d.ts"
-    ]
-  },
-  "exclude": [
-    "jest.config.ts",
-    "src/**/*.spec.ts",
-    "src/**/*.test.ts",
-    "src/**/*.spec.tsx",
-    "src/**/*.test.tsx",
-    "src/**/*.spec.js",
-    "src/**/*.test.js",
-    "src/**/*.spec.jsx",
-    "src/**/*.test.jsx"
-  ],
-  "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
-}

package/packages/contexts/.babelrc

@@ -1,12 +0,0 @@
-{
-  "presets": [
-    [
-      "@nx/react/babel",
-      {
-        "runtime": "automatic",
-        "useBuiltIns": "usage"
-      }
-    ]
-  ],
-  "plugins": []
-}

package/packages/contexts/.eslintrc.json

@@ -1,18 +0,0 @@
-{
-  "extends": ["plugin:@nx/react", "../../.eslintrc.json"],
-  "ignorePatterns": ["!**/*"],
-  "overrides": [
-    {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.ts", "*.tsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.js", "*.jsx"],
-      "rules": {}
-    }
-  ]
-}

package/packages/contexts/README.md

@@ -1,7 +0,0 @@
-# common
-
-This library was generated with [Nx](https://nx.dev).
-
-## Running unit tests
-
-Run `nx test common` to execute the unit tests via [Jest](https://jestjs.io).

package/packages/contexts/project.json

@@ -1,8 +0,0 @@
-{
-  "name": "contexts",
-  "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "packages/contexts/src",
-  "projectType": "library",
-  "tags": [],
-  "targets": {}
-}

package/packages/contexts/src/index.ts

@@ -1,2 +0,0 @@
-
-export {};

package/packages/contexts/tsconfig.json

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "jsx": "react-jsx",
-    "allowJs": false,
-    "esModuleInterop": false,
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "files": [],
-  "include": [],
-  "references": [
-    {
-      "path": "./tsconfig.lib.json"
-    }
-  ],
-  "extends": "../../tsconfig.base.json"
-}

package/packages/contexts/tsconfig.lib.json

@@ -1,24 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../dist/out-tsc",
-    "types": [
-      "node",
-
-      "@nx/react/typings/cssmodule.d.ts",
-      "@nx/react/typings/image.d.ts"
-    ]
-  },
-  "exclude": [
-    "jest.config.ts",
-    "src/**/*.spec.ts",
-    "src/**/*.test.ts",
-    "src/**/*.spec.tsx",
-    "src/**/*.test.tsx",
-    "src/**/*.spec.js",
-    "src/**/*.test.js",
-    "src/**/*.spec.jsx",
-    "src/**/*.test.jsx"
-  ],
-  "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
-}

package/packages/diagrams/.babelrc

@@ -1,12 +0,0 @@
-{
-  "presets": [
-    [
-      "@nx/react/babel",
-      {
-        "runtime": "automatic",
-        "useBuiltIns": "usage"
-      }
-    ]
-  ],
-  "plugins": []
-}

package/packages/diagrams/.ctirc

@@ -1,208 +0,0 @@
-{
-  // Stream of cli spinner, you can pass stdout or stderr
-  //
-  // @mode all
-  // @default stdout
-  "spinnerStream": "stdout",
-  // Stream of cli progress, you can pass stdout or stderr
-  //
-  // @mode all
-  // @default stdout
-  "progressStream": "stdout",
-  // Stream of cli reasoner. Reasoner show name conflict error and already exist index.ts file error.
-  // You can pass stdout or stderr
-  //
-  // @mode all
-  // @default stderr
-  "reasonerStream": "stderr",
-  "options": [
-    {
-      // build mode
-      // - create: create an `index.ts` file in each directory
-      // - bundle: bundle all export information in one `index.ts` file
-      "mode": "bundle",
-      // tsconfig.json path: you must pass path with filename, like this "./tsconfig.json"
-      // only work root directory or cli parameter
-      //
-      // @mode all
-      "project": "tsconfig.lib.json",
-      // Export filename, if you not pass this field that use "index.ts" or "index.d.ts"
-      //
-      // @mode create, bundle, remove
-      // @default index.ts
-      "exportFilename": "index.ts",
-      // add ctix comment at first line of creted index.ts file, that remark created from ctix
-      //
-      // @mode create, bundle
-      // @default false
-      "useSemicolon": true,
-      // add ctix comment at first line of creted index.ts file, that remark created from ctix
-      //
-      // @mode create, bundle
-      // @default false
-      "useBanner": false,
-      // If specified as true, adds the created date to the top of the `index.ts` file,
-      // this option only works if the `useBanner` option is enabled
-      //
-      // @mode create, bundle
-      // @default false
-      "useTimestamp": false,
-      // quote mark " or '
-      // @mode create, bundle
-      //
-      // @default '
-      "quote": "'",
-      // Use to add a literal like `"use strict"` to the top. It will be added before the banner.
-      //
-      // @mode create, bundle
-      "directive": "",
-      // keep file extension in export statement path
-      //
-      // if this option set true that see below
-      // export * from './test.ts'
-      //
-      // @mode create, bundle
-      // @default none
-      "fileExt": "none",
-      // overwrite each index.ts file
-      // @mode create, bundle
-      // @default false
-      "overwrite": true,
-      // Create a backup file if the `index.ts` file already exists.
-      // This option only works if the `overwrite` option is enabled.
-      //
-      // @mode create, bundle
-      // @defulat true
-      "backup": false,
-      // When generating the `index.ts` file, decide how you want to generate it
-      //
-      // @mode create, bundle
-      // @default auto
-      "generationStyle": "auto",
-      // A list of files to use when generating the index.ts file. If no value is set,
-      // the value of the include setting set in the tsconfig.json file will be used
-      //
-      // @mode create, bundle
-      "include": [],
-      // A list of files to exclude when generating the index.ts file. If no value is set,
-      // the value of the exclude setting set in the tsconfig.json file is used
-      //
-      // @mode create, bundle
-      "exclude": [
-        "../../node_modules",
-        "../../tmp"
-      ],
-      // Output directory. Default value is same project directory
-      // @mode bundle
-      "output": "./src",
-      // remove with backup file
-      // @mode remove
-      // @default false
-      "removeBackup": true,
-      // answer `yes` to all questions
-      // @mode remove
-      // @default false
-      "forceYes": false
-    },
-    {
-      // build mode
-      // - create: create an `index.ts` file in each directory
-      // - bundle: bundle all export information in one `index.ts` file
-      "mode": "bundle",
-      // tsconfig.json path: you must pass path with filename, like this "./tsconfig.json"
-      // only work root directory or cli parameter
-      //
-      // @mode all
-      "project": "tsconfig.lib.json",
-      // Export filename, if you not pass this field that use "index.ts" or "index.d.ts"
-      //
-      // @mode create, bundle, remove
-      // @default index.ts
-      "exportFilename": "index.ts",
-      // add ctix comment at first line of creted index.ts file, that remark created from ctix
-      //
-      // @mode create, bundle
-      // @default false
-      "useSemicolon": true,
-      // add ctix comment at first line of creted index.ts file, that remark created from ctix
-      //
-      // @mode create, bundle
-      // @default false
-      "useBanner": false,
-      // If specified as true, adds the created date to the top of the `index.ts` file,
-      // this option only works if the `useBanner` option is enabled
-      //
-      // @mode create, bundle
-      // @default false
-      "useTimestamp": false,
-      // quote mark " or '
-      // @mode create, bundle
-      //
-      // @default '
-      "quote": "'",
-      // Use to add a literal like `"use strict"` to the top. It will be added before the banner.
-      //
-      // @mode create, bundle
-      "directive": "",
-      // keep file extension in export statement path
-      //
-      // if this option set true that see below
-      // export * from './test.ts'
-      //
-      // @mode create, bundle
-      // @default none
-      "fileExt": "none",
-      // overwrite each index.ts file
-      // @mode create, bundle
-      // @default false
-      "overwrite": false,
-      // Create a backup file if the `index.ts` file already exists.
-      // This option only works if the `overwrite` option is enabled.
-      //
-      // @mode create, bundle
-      // @defulat true
-      "backup": true,
-      // When generating the `index.ts` file, decide how you want to generate it
-      //
-      // @mode create, bundle
-      // @default auto
-      "generationStyle": "auto",
-      // A list of files to use when generating the index.ts file. If no value is set,
-      // the value of the include setting set in the tsconfig.json file will be used
-      //
-      // @mode create, bundle
-      "include": [
-        "src/**/*.js",
-        "src/**/*.jsx",
-        "src/**/*.ts",
-        "src/**/*.tsx"
-      ],
-      // A list of files to exclude when generating the index.ts file. If no value is set,
-      // the value of the exclude setting set in the tsconfig.json file is used
-      //
-      // @mode create, bundle
-      "exclude": [
-        "jest.config.ts",
-        "src/**/*.spec.ts",
-        "src/**/*.test.ts",
-        "src/**/*.spec.tsx",
-        "src/**/*.test.tsx",
-        "src/**/*.spec.js",
-        "src/**/*.test.js",
-        "src/**/*.spec.jsx",
-        "src/**/*.test.jsx"
-      ],
-      // Output directory. Default value is same project directory
-      // @mode bundle
-      "output": "./src",
-      // remove with backup file
-      // @mode remove
-      // @default false
-      "removeBackup": false,
-      // answer `yes` to all questions
-      // @mode remove
-      // @default false
-      "forceYes": false
-    }
-  ]
-}

package/packages/diagrams/.eslintrc.json

@@ -1,17 +0,0 @@
-{
-  "ignorePatterns": ["!**/*"],
-  "overrides": [
-    {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.ts", "*.tsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.js", "*.jsx"],
-      "rules": {}
-    }
-  ]
-}

package/packages/diagrams/CUSTOM_ICONS.md

@@ -1,232 +0,0 @@
-# Fully Customizable Icons for Automation Nodes
-
-This document explains how to use fully customizable icons in automation nodes when using the diagramming library as a dependency.
-
-## Overview
-
-The automation nodes support **fully customizable icons** through the `iconName` field in the node data. Unlike traditional icon systems, this library provides **complete control** - users must define their own icon mappings, giving them the flexibility to use any icons from any library.
-
-## How It Works
-
-### 1. Add iconName to Node Data
-
-In your node data structure, add the `iconName` field:
-
-```typescript
-const nodeData = {
-  id: 'my-node',
-  type: 'AutomationStartNode',
-  position: { x: 100, y: 200 },
-  data: {
-    label: 'My Custom Node',
-    description: 'A node with a custom icon',
-    status: 'Ready',
-    backgroundColor: '#1e3a8a',
-    textColor: '#ffffff',
-    borderColor: '#3b82f6',
-    lastRun: 'Never',
-    duration: '0.0s',
-    iconName: 'MyCustomIcon', // Specify your custom icon name
-    // ... other node properties
-  }
-};
-```
-
-### 2. No Default Icons
-
-**Important**: This library comes with **no predefined icons**. Users have complete control and must define their own icon mappings. This approach provides:
-
-- **Maximum Flexibility**: Use any icon from any library
-- **Bundle Size Control**: Only include icons you actually use
-- **No Conflicts**: No predefined icons to override
-- **Complete Customization**: Design your own icon system
-
-### 3. Fallback Behavior
-
-If you don't specify an `iconName` or if the specified icon doesn't exist, the system will show:
-- A placeholder icon (❓) with a tooltip indicating the missing icon name
-- This helps developers identify which icons need to be defined
-
-### 4. Example Usage
-
-Here's a complete example of creating nodes with custom icons:
-
-```typescript
-// First, define your icon mappings
-import { addCustomIcons } from '@flowuent/diagramming-core/lib/utils/iconMapper';
-import { 
-  PlayArrow, 
-  Stop, 
-  Api, 
-  Article,
-  Home,
-  Cloud,
-  Database,
-  Email
-} from '@mui/icons-material';
-
-// Add your custom icons
-addCustomIcons({
-  'PlayArrow': PlayArrow,
-  'Stop': Stop,
-  'Api': Api,
-  'Article': Article,
-  'Home': Home,
-  'Cloud': Cloud,
-  'Database': Database,
-  'Email': Email
-});
-
-// Now create nodes with your custom icons
-const customNode = {
-  id: 'custom-start-node',
-  type: 'AutomationStartNode',
-  position: { x: 50, y: 200 },
-  data: {
-    label: 'Custom Workflow Trigger',
-    description: 'A custom start node with a home icon',
-    status: 'Ready',
-    backgroundColor: '#1e3a8a',
-    textColor: '#ffffff',
-    borderColor: '#3b82f6',
-    lastRun: 'Never',
-    duration: '0.0s',
-    iconName: 'Home', // Your custom icon
-    // ... rest of your node configuration
-  }
-};
-
-// Create an API node with a cloud icon
-const apiNode = {
-  id: 'cloud-api-node',
-  type: 'AutomationApiNode',
-  position: { x: 400, y: 200 },
-  data: {
-    label: 'Cloud API Call',
-    description: 'API call to cloud service',
-    status: 'Ready',
-    backgroundColor: '#1e40af',
-    textColor: '#ffffff',
-    borderColor: '#3b82f6',
-    lastRun: '5 minutes ago',
-    duration: '0.8s',
-    iconName: 'Cloud', // Your custom icon
-    // ... rest of your node configuration
-  }
-};
-```
-
-### 5. Adding Custom Icons
-
-Since there are no default icons, you **must** define your own icon mappings. Here are the different ways to do this:
-
-#### Method 1: Add Individual Icons
-
-```typescript
-import { addCustomIcon } from '@flowuent/diagramming-core/lib/utils/iconMapper';
-import { CustomIcon, AnotherIcon } from '@mui/icons-material';
-
-// Add a single custom icon
-addCustomIcon('CustomIcon', CustomIcon);
-
-// Now you can use it in your node data
-const nodeData = {
-  iconName: 'CustomIcon',
-  // ... other properties
-};
-```
-
-#### Method 2: Add Multiple Icons at Once
-
-```typescript
-import { addCustomIcons } from '@flowuent/diagramming-core/lib/utils/iconMapper';
-import { 
-  CustomIcon, 
-  AnotherIcon, 
-  ThirdIcon 
-} from '@mui/icons-material';
-
-// Add multiple custom icons
-addCustomIcons({
-  'CustomIcon': CustomIcon,
-  'AnotherIcon': AnotherIcon,
-  'ThirdIcon': ThirdIcon
-});
-
-// Now you can use any of these icons
-const nodeData = {
-  iconName: 'CustomIcon', // or 'AnotherIcon', 'ThirdIcon'
-  // ... other properties
-};
-```
-
-#### Method 3: Direct Icon Map Extension
-
-```typescript
-import { iconMap } from '@flowuent/diagramming-core/lib/utils/iconMapper';
-import { CustomIcon } from '@mui/icons-material';
-
-// Directly extend the icon map
-iconMap['CustomIcon'] = CustomIcon;
-```
-
-#### Method 4: Add Icons from Other Libraries
-
-```typescript
-import { addCustomIcon } from '@flowuent/diagramming-core/lib/utils/iconMapper';
-import { FaReact, FaNodeJs } from 'react-icons/fa'; // Font Awesome icons
-
-// Add icons from other libraries
-addCustomIcon('React', FaReact);
-addCustomIcon('NodeJS', FaNodeJs);
-```
-
-#### Method 5: Create Your Own Icon Components
-
-```typescript
-import { addCustomIcon } from '@flowuent/diagramming-core/lib/utils/iconMapper';
-
-// Create a custom icon component
-const MyCustomIcon = (props: any) => (
-  <svg {...props} viewBox="0 0 24 24">
-    <path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
-  </svg>
-);
-
-// Add your custom icon
-addCustomIcon('MyCustomIcon', MyCustomIcon);
-```
-
-## Best Practices
-
-1. **Choose Meaningful Icons**: Select icons that clearly represent the node's function
-2. **Consistency**: Use consistent icon choices across similar node types
-3. **Fallback**: Always test with fallback icons to ensure your nodes work even if custom icons fail
-4. **Performance**: Icons are loaded on-demand, so there's minimal performance impact
-
-## Troubleshooting
-
-### Icon Not Displaying
-- Check that the `iconName` is spelled correctly
-- Verify the icon exists in the available icons list
-- Ensure the icon name matches exactly (case-sensitive)
-
-### TypeScript Errors
-- Make sure you've added `iconName?: string` to your node data interface
-- Import the icon mapper utility if you're extending it
-
-### Custom Icons Not Working
-- Ensure you've properly extended the icon mapper
-- Check that your custom icon component is properly imported
-- Verify the icon component follows Material-UI icon patterns
-
-## Migration Guide
-
-If you're upgrading from a version without configurable icons:
-
-1. Add `iconName?: string` to your node data interfaces
-2. Optionally specify custom icons in your existing node data
-3. Test that fallback icons work correctly
-4. Update your documentation to reflect the new icon capabilities
-
-This feature maintains backward compatibility - existing nodes without `iconName` will continue to work with their default icons.