@grafloria/element 0.3.20 → 0.3.21

package/src/libs/engine/src/template-library/workflow-templates.js

@@ -1,438 +0,0 @@
-"use strict";
-/**
- * Workflow Node Templates (Phase 4)
- * Pre-built templates for workflow and process diagrams
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.WorkflowTemplates = exports.ActivityTemplate = exports.GatewayTemplate = exports.SubprocessTemplate = exports.EndEventTemplate = exports.StartEventTemplate = exports.DecisionNodeTemplate = exports.ProcessStepTemplate = void 0;
-/**
- * Process Step Template
- * Rectangular process box for workflow diagrams
- */
-exports.ProcessStepTemplate = {
-    id: 'process-step',
-    version: '1.0.0',
-    meta: {
-        name: 'Process Step',
-        description: 'Standard process step for flowcharts',
-        category: 'workflow',
-    },
-    structure: {
-        type: 'process',
-        size: { width: 180, height: 80 },
-        shape: {
-            type: 'rect',
-            cornerRadius: 4,
-            fill: '#e3f2fd',
-            stroke: '#2196f3',
-            strokeWidth: 2,
-        },
-        html: {
-            mode: 'template',
-            template: `
-        <div class="process-step">
-          <div class="process-title">{{data.title}}</div>
-          <div class="process-description">{{data.description}}</div>
-        </div>
-      `,
-            className: 'node-process',
-            style: {
-                display: 'flex',
-                flexDirection: 'column',
-                alignItems: 'center',
-                justifyContent: 'center',
-                width: '100%',
-                height: '100%',
-                padding: '12px',
-                fontFamily: 'system-ui, sans-serif',
-                textAlign: 'center',
-            },
-            events: {
-                click: 'process:clicked',
-                dblclick: 'process:edited',
-            },
-            zIndex: 1,
-        },
-        ports: {
-            enabled: true,
-            defaultVisibility: 'always',
-            top: { enabled: true },
-            right: { enabled: true },
-            bottom: { enabled: true },
-            left: { enabled: true },
-        },
-    },
-    defaultData: {
-        title: 'Process Step',
-        description: 'Description',
-        duration: '',
-        owner: '',
-    },
-};
-/**
- * Decision Node Template
- * Diamond-shaped decision point
- */
-exports.DecisionNodeTemplate = {
-    id: 'decision-node',
-    version: '1.0.0',
-    meta: {
-        name: 'Decision Node',
-        description: 'Diamond-shaped decision point for branching logic',
-        category: 'workflow',
-    },
-    structure: {
-        type: 'decision',
-        size: { width: 120, height: 120 },
-        shape: {
-            type: 'diamond',
-            fill: '#fff3e0',
-            stroke: '#ff9800',
-            strokeWidth: 2,
-        },
-        html: {
-            mode: 'template',
-            template: `
-        <div class="decision-node">
-          <div class="decision-question">{{data.question}}</div>
-        </div>
-      `,
-            className: 'node-decision',
-            style: {
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                width: '100%',
-                height: '100%',
-                padding: '12px',
-                fontFamily: 'system-ui, sans-serif',
-                fontSize: '13px',
-                fontWeight: '600',
-                textAlign: 'center',
-            },
-            events: {
-                click: 'decision:clicked',
-                dblclick: 'decision:edited',
-            },
-            zIndex: 1,
-        },
-        ports: {
-            enabled: true,
-            defaultVisibility: 'always',
-            top: { enabled: true },
-            right: { enabled: true },
-            bottom: { enabled: true },
-            left: { enabled: true },
-        },
-    },
-    defaultData: {
-        question: 'Condition?',
-        type: 'boolean', // boolean, multi-choice
-    },
-};
-/**
- * Start Event Template
- * Circle indicating workflow start
- */
-exports.StartEventTemplate = {
-    id: 'start-event',
-    version: '1.0.0',
-    meta: {
-        name: 'Start Event',
-        description: 'Circle node marking the start of a workflow',
-        category: 'workflow',
-    },
-    structure: {
-        type: 'start',
-        size: { width: 60, height: 60 },
-        shape: {
-            type: 'circle',
-            fill: '#e8f5e9',
-            stroke: '#4caf50',
-            strokeWidth: 3,
-        },
-        html: {
-            mode: 'template',
-            template: `
-        <div class="start-event">
-          <span class="start-icon">▶</span>
-        </div>
-      `,
-            className: 'node-start',
-            style: {
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                width: '100%',
-                height: '100%',
-                fontSize: '20px',
-                color: '#4caf50',
-            },
-            events: {
-                click: 'start:clicked',
-            },
-            zIndex: 1,
-        },
-        ports: {
-            enabled: true,
-            defaultVisibility: 'always',
-            right: { enabled: true },
-            bottom: { enabled: true },
-        },
-    },
-    defaultData: {
-        label: 'Start',
-        trigger: 'manual', // manual, scheduled, event
-    },
-};
-/**
- * End Event Template
- * Circle indicating workflow end
- */
-exports.EndEventTemplate = {
-    id: 'end-event',
-    version: '1.0.0',
-    meta: {
-        name: 'End Event',
-        description: 'Circle node marking the end of a workflow',
-        category: 'workflow',
-    },
-    structure: {
-        type: 'end',
-        size: { width: 60, height: 60 },
-        shape: {
-            type: 'circle',
-            fill: '#ffebee',
-            stroke: '#f44336',
-            strokeWidth: 3,
-        },
-        html: {
-            mode: 'template',
-            template: `
-        <div class="end-event">
-          <span class="end-icon">■</span>
-        </div>
-      `,
-            className: 'node-end',
-            style: {
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                width: '100%',
-                height: '100%',
-                fontSize: '20px',
-                color: '#f44336',
-            },
-            events: {
-                click: 'end:clicked',
-            },
-            zIndex: 1,
-        },
-        ports: {
-            enabled: true,
-            defaultVisibility: 'always',
-            top: { enabled: true },
-            left: { enabled: true },
-        },
-    },
-    defaultData: {
-        label: 'End',
-        result: 'success', // success, failure, cancel
-    },
-};
-/**
- * Subprocess Template
- * Rounded rectangle for subprocess
- */
-exports.SubprocessTemplate = {
-    id: 'subprocess',
-    version: '1.0.0',
-    meta: {
-        name: 'Subprocess',
-        description: 'Subprocess or grouped activity',
-        category: 'workflow',
-    },
-    structure: {
-        type: 'subprocess',
-        size: { width: 200, height: 100 },
-        shape: {
-            type: 'rect',
-            cornerRadius: 12,
-            fill: '#f3e5f5',
-            stroke: '#9c27b0',
-            strokeWidth: 2,
-        },
-        html: {
-            mode: 'template',
-            template: `
-        <div class="subprocess">
-          <div class="subprocess-icon">⊞</div>
-          <div class="subprocess-title">{{data.title}}</div>
-          <div class="subprocess-count">{{data.stepCount}} steps</div>
-        </div>
-      `,
-            className: 'node-subprocess',
-            style: {
-                display: 'flex',
-                flexDirection: 'column',
-                alignItems: 'center',
-                justifyContent: 'center',
-                width: '100%',
-                height: '100%',
-                padding: '12px',
-                fontFamily: 'system-ui, sans-serif',
-                textAlign: 'center',
-            },
-            events: {
-                click: 'subprocess:clicked',
-                dblclick: 'subprocess:expanded',
-            },
-            zIndex: 1,
-        },
-        ports: {
-            enabled: true,
-            defaultVisibility: 'always',
-            top: { enabled: true },
-            right: { enabled: true },
-            bottom: { enabled: true },
-            left: { enabled: true },
-        },
-    },
-    defaultData: {
-        title: 'Subprocess',
-        stepCount: 0,
-        collapsed: true,
-    },
-};
-/**
- * Gateway Template
- * Diamond for parallel/exclusive gateways
- */
-exports.GatewayTemplate = {
-    id: 'gateway',
-    version: '1.0.0',
-    meta: {
-        name: 'Gateway',
-        description: 'Gateway for splitting/joining workflow paths',
-        category: 'workflow',
-    },
-    structure: {
-        type: 'gateway',
-        size: { width: 80, height: 80 },
-        shape: {
-            type: 'diamond',
-            fill: '#fffde7',
-            stroke: '#fbc02d',
-            strokeWidth: 2,
-        },
-        html: {
-            mode: 'template',
-            template: `
-        <div class="gateway">
-          <span class="gateway-icon">{{data.icon}}</span>
-        </div>
-      `,
-            className: 'node-gateway',
-            style: {
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                width: '100%',
-                height: '100%',
-                fontSize: '24px',
-                fontWeight: 'bold',
-            },
-            events: {
-                click: 'gateway:clicked',
-            },
-            zIndex: 1,
-        },
-        ports: {
-            enabled: true,
-            defaultVisibility: 'always',
-            top: { enabled: true },
-            right: { enabled: true },
-            bottom: { enabled: true },
-            left: { enabled: true },
-        },
-    },
-    defaultData: {
-        type: 'parallel', // parallel (+), exclusive (×), inclusive (○)
-        icon: '+',
-    },
-};
-/**
- * Activity Template
- * Rounded rectangle for activity/task
- */
-exports.ActivityTemplate = {
-    id: 'activity',
-    version: '1.0.0',
-    meta: {
-        name: 'Activity',
-        description: 'Activity or task in a workflow',
-        category: 'workflow',
-    },
-    structure: {
-        type: 'activity',
-        size: { width: 160, height: 70 },
-        shape: {
-            type: 'rect',
-            cornerRadius: 8,
-            fill: '#e1f5fe',
-            stroke: '#0288d1',
-            strokeWidth: 2,
-        },
-        html: {
-            mode: 'template',
-            template: `
-        <div class="activity">
-          <div class="activity-icon">{{data.icon}}</div>
-          <div class="activity-name">{{data.name}}</div>
-        </div>
-      `,
-            className: 'node-activity',
-            style: {
-                display: 'flex',
-                alignItems: 'center',
-                gap: '8px',
-                width: '100%',
-                height: '100%',
-                padding: '12px',
-                fontFamily: 'system-ui, sans-serif',
-            },
-            events: {
-                click: 'activity:clicked',
-                dblclick: 'activity:edited',
-            },
-            zIndex: 1,
-        },
-        ports: {
-            enabled: true,
-            defaultVisibility: 'always',
-            top: { enabled: true },
-            right: { enabled: true },
-            bottom: { enabled: true },
-            left: { enabled: true },
-        },
-    },
-    defaultData: {
-        name: 'Activity',
-        icon: '📋',
-        type: 'user', // user, service, script
-        assignee: '',
-    },
-};
-/**
- * Export all workflow templates
- */
-exports.WorkflowTemplates = {
-    ProcessStep: exports.ProcessStepTemplate,
-    DecisionNode: exports.DecisionNodeTemplate,
-    StartEvent: exports.StartEventTemplate,
-    EndEvent: exports.EndEventTemplate,
-    Subprocess: exports.SubprocessTemplate,
-    Gateway: exports.GatewayTemplate,
-    Activity: exports.ActivityTemplate,
-};
-//# sourceMappingURL=workflow-templates.js.map

package/src/libs/engine/src/templates/NodeFactory.d.ts

@@ -1,118 +0,0 @@
-/**
- * NodeFactory - Creates nodes from templates
- *
- * Handles:
- * - Template-based node creation
- * - Port configuration
- * - Hierarchical structures (parent/child)
- * - Data binding
- * - Metadata management
- *
- * Follows existing NodeModel patterns:
- * - Uses node.setMetadata() for configuration
- * - Uses node.setData() for user data
- * - Adds nodes to diagram
- * - Creates ports following port configuration
- */
-import { TemplateRegistry } from './TemplateRegistry';
-import { DiagramModel } from '../models/DiagramModel';
-import { NodeModel } from '../models/NodeModel';
-export declare class NodeFactory {
-    private templateRegistry;
-    private diagram;
-    constructor(templateRegistry: TemplateRegistry, diagram: DiagramModel);
-    /**
-     * Create node(s) from template
-     *
-     * @param templateId Template identifier
-     * @param data User data to bind to template
-     * @param position Node position in diagram
-     * @returns Root node created from template
-     * @throws Error if template not found or invalid
-     */
-    createFromTemplate(templateId: string, data: Record<string, any>, position: {
-        x: number;
-        y: number;
-    }): NodeModel;
-    /**
-     * Build node tree recursively from structure definition
-     *
-     * @param structure Node structure definition
-     * @param data Data to bind
-     * @param position Position (for root only)
-     * @param parent Parent node (null for root)
-     * @param template Root template reference
-     * @returns Created node
-     */
-    private buildNodeTree;
-    /**
-     * Create ports based on template configuration
-     */
-    private createPorts;
-    /**
-     * Wave 6 (Card 3): build a node's ports from NAMED GROUPS.
-     *
-     * The group definitions are stashed on the node (so they serialize with the
-     * diagram and `resolvePortConfig` can find them), and each member is created
-     * declaring only what it OVERRIDES — side, shape, label config, gating and
-     * data type all flow down from the group.
-     */
-    private createGroupedPorts;
-    /**
-     * Parse size configuration
-     */
-    private parseSize;
-    /**
-     * Apply data bindings to node
-     */
-    private applyDataBindings;
-    /**
-     * Create dynamic children from repeater configuration
-     * Iterates over an array in the data and creates a child node for each item
-     *
-     * @param structure Node structure with repeater config
-     * @param data Parent node data
-     * @param position Position (passed to children)
-     * @param parent Parent node
-     * @param template Root template reference
-     */
-    private createRepeaterChildren;
-    /**
-     * Apply flexbox layout to position children
-     * Extracted from inline code to support both static and repeater children
-     *
-     * @param node Parent node with children to layout
-     */
-    private applyFlexboxLayout;
-    /**
-     * Get nested value from object path (e.g., 'data.user.name')
-     */
-    private getNestedValue;
-    /**
-     * Apply property bindings to node for data-driven properties
-     * Allows conditional properties based on item data
-     *
-     * Example:
-     * propertyBindings: {
-     *   shape: {
-     *     fill: {
-     *       source: 'data.isPrimaryKey',
-     *       map: { 'true': '#e3f2fd', 'false': '#ffffff' }
-     *     }
-     *   }
-     * }
-     *
-     * @param node Node to apply bindings to
-     * @param bindings Property bindings configuration
-     * @param data Data to evaluate bindings against
-     */
-    private applyPropertyBindings;
-    /**
-     * Resolve property value from binding configuration
-     *
-     * @param resolver Property resolver with source path and value map
-     * @param data Data to evaluate against
-     * @returns Resolved property value
-     */
-    private resolvePropertyValue;
-}