@flowuent-org/diagramming-core 1.3.10 → 1.4.0

package/apps/diagramming/src/SequenceDiagramData.ts

@@ -1,215 +0,0 @@
-// Define the vertical spacing between messages
-const MESSAGE_SPACING = 80;
-const HEADER_HEIGHT = 50;
-const LIFELINE_START_Y = 100;
-
-// Calculate vertical positions for messages
-const messagePositions = {
-  request: LIFELINE_START_Y + MESSAGE_SPACING,
-  query: LIFELINE_START_Y + MESSAGE_SPACING * 2,
-  dbResponse: LIFELINE_START_Y + MESSAGE_SPACING * 3,
-  clientResponse: LIFELINE_START_Y + MESSAGE_SPACING * 4,
-  selfProcess: LIFELINE_START_Y + MESSAGE_SPACING * 1.5, // For self message example
-};
-
-// Calculate total height needed for the diagram
-const DIAGRAM_HEIGHT = LIFELINE_START_Y + MESSAGE_SPACING * 5;
-
-// Interface for sequence entity node data
-interface SequenceEntityData {
-  label: string;
-  color: string;
-  backgroundColor: string;
-  lifelineLength: number;
-}
-
-// Interface for activation bar node data
-interface ActivationBarData {
-  entityId: string;
-  color: string;
-  borderColor: string;
-  length: number;
-}
-
-// Interface for combined fragment node data
-interface CombinedFragmentData {
-  label: string;
-  conditions: string[];
-}
-
-// Interface for sequence message edge data
-interface SequenceMessageData {
-  label: string;
-  type: 'sync' | 'async' | 'return' | 'self';
-  y: number;
-}
-
-export const sequenceDiagramNodes = [
-  // Entity nodes (participants)
-  {
-    id: 'client',
-    type: 'sequenceEntity',
-    position: { x: 100, y: 50 },
-    data: {
-      label: 'Client',
-      color: '#0066cc',
-      backgroundColor: '#e6f0ff',
-      lifelineLength: DIAGRAM_HEIGHT - LIFELINE_START_Y,
-    },
-    draggable: true,
-  },
-  {
-    id: 'server',
-    type: 'sequenceEntity',
-    position: { x: 350, y: 50 },
-    data: {
-      label: 'Server',
-      color: '#009900',
-      backgroundColor: '#e6ffe6',
-      lifelineLength: DIAGRAM_HEIGHT - LIFELINE_START_Y,
-    },
-    draggable: true,
-  },
-  {
-    id: 'database',
-    type: 'sequenceEntity',
-    position: { x: 600, y: 50 },
-    data: {
-      label: 'Database',
-      color: '#cc0000',
-      backgroundColor: '#ffe6e6',
-      lifelineLength: DIAGRAM_HEIGHT - LIFELINE_START_Y,
-    },
-    draggable: true,
-  },
-
-  // Activation bars
-  {
-    id: 'client-activation',
-    type: 'activationBar',
-    position: { x: 155, y: messagePositions.request },
-    data: {
-      entityId: 'client',
-      color: '#e6f0ff',
-      borderColor: '#0066cc',
-      length: 250,
-    },
-    draggable: true,
-  },
-  {
-    id: 'server-activation',
-    type: 'activationBar',
-    position: { x: 405, y: messagePositions.request },
-    data: {
-      entityId: 'server',
-      color: '#e6ffe6',
-      borderColor: '#009900',
-      length: 210,
-    },
-    draggable: true,
-  },
-  {
-    id: 'database-activation',
-    type: 'activationBar',
-    position: { x: 655, y: messagePositions.query },
-    data: {
-      entityId: 'database',
-      color: '#ffe6e6',
-      borderColor: '#cc0000',
-      length: 90,
-    },
-    draggable: true,
-  },
-
-  // Combined Fragment example
-  {
-    id: 'alt-fragment',
-    type: 'combinedFragment',
-    position: { x: 80, y: 300 },
-    style: { width: 500, height: 150 },
-    data: {
-      label: 'alt',
-      conditions: ['[success]', '[error]'],
-    },
-    draggable: true,
-  },
-];
-
-export const sequenceDiagramEdges = [
-  // 1. Client -> Server Request
-  {
-    id: 'seq-edge1',
-    source: 'client',
-    target: 'server',
-    type: 'sequenceMessage',
-    sourceHandle: 'right',
-    targetHandle: 'left',
-    data: {
-      label: '1. Request',
-      type: 'sync', // synchronous message
-      y: messagePositions.request,
-    },
-    animated: false,
-  },
-  // 2. Server -> Database Query
-  {
-    id: 'seq-edge2',
-    source: 'server',
-    target: 'database',
-    type: 'sequenceMessage',
-    sourceHandle: 'right',
-    targetHandle: 'left',
-    data: {
-      label: '2. Query',
-      type: 'sync', // synchronous message
-      y: messagePositions.query,
-    },
-    animated: false,
-  },
-  // 3. Database -> Server Response
-  {
-    id: 'seq-edge3',
-    source: 'database',
-    target: 'server',
-    type: 'sequenceMessage',
-    sourceHandle: 'left',
-    targetHandle: 'right',
-    data: {
-      label: '3. Response',
-      type: 'return', // return message
-      y: messagePositions.dbResponse,
-    },
-    animated: false,
-  },
-  // 4. Server -> Client Response
-  {
-    id: 'seq-edge4',
-    source: 'server',
-    target: 'client',
-    type: 'sequenceMessage',
-    sourceHandle: 'left',
-    targetHandle: 'right',
-    data: {
-      label: '4. Response',
-      type: 'return', // return message
-      y: messagePositions.clientResponse,
-    },
-    animated: false,
-  },
-  // Self message example
-  {
-    id: 'seq-edge-self',
-    source: 'client',
-    target: 'client',
-    type: 'sequenceMessage',
-    sourceHandle: 'right',
-    targetHandle: 'right',
-    data: {
-      label: 'process()',
-      type: 'self', // self message
-      y: messagePositions.selfProcess,
-    },
-    animated: false,
-  },
-];
-

package/apps/diagramming/src/StateMachineDiagramData.ts

@@ -1,64 +0,0 @@
-// Default nodes for the state machine diagram
-export const stateMachineDefaultNodes = [
-  {
-    id: '1',
-    type: 'InitialStateNode',
-    position: { x: 100, y: 100 },
-    data: { label: '' },
-    width: 20,
-    height: 20,
-    measured: { width: 20, height: 20 },
-  },
-  {
-    id: '2',
-    type: 'StateNode',
-    position: { x: 250, y: 100 },
-    data: { label: 'Idle', activities: ['do / waitForInput'] },
-    width: 150,
-    height: 70,
-    measured: { width: 150, height: 70 },
-  },
-  {
-    id: '3',
-    type: 'StateNode',
-    position: { x: 450, y: 100 },
-    data: { label: 'Processing', activities: ['do / processData'] },
-    width: 150,
-    height: 70,
-    measured: { width: 150, height: 70 },
-  },
-  {
-    id: '4',
-    type: 'FinalStateNode',
-    position: { x: 650, y: 100 },
-    data: { label: '' },
-    width: 30,
-    height: 30,
-    measured: { width: 30, height: 30 },
-  },
-];
-
-// Default edges for the state machine diagram
-export const stateMachineDefaultEdges = [
-  {
-    id: 'e1-2',
-    source: '1',
-    target: '2',
-    type: 'customEdge',
-    data: { label: 'start' },
-  },
-  {
-    id: 'e2-3',
-    source: '2',
-    target: '3',
-    type: 'customEdge',
-    data: { label: 'buttonPress [isValid] / validate' },
-  },
-  {
-    id: 'e3-4',
-    source: '3',
-    target: '4',
-    type: 'customEdge',
-    data: { label: 'complete' },
-  },
-];

package/apps/diagramming/src/UseCaseDiagramData.ts

@@ -1,52 +0,0 @@
-// Default nodes for the use case diagram
-export const useCaseDefaultNodes = [
-  {
-    id: 'actor-1',
-    type: 'actor',
-    position: { x: 100, y: 200 },
-    data: { label: 'User' },
-  },
-  {
-    id: 'usecase-1',
-    type: 'usecase',
-    position: { x: 350, y: 200 },
-    data: { label: 'Login' },
-  },
-  {
-    id: 'usecase-2',
-    type: 'usecase',
-    position: { x: 350, y: 350 },
-    data: { label: 'Register' },
-  },
-  {
-    id: 'actor-2',
-    type: 'actor',
-    position: { x: 600, y: 200 },
-    data: { label: 'Admin' },
-  },
-];
-
-// Default edges for the use case diagram
-export const useCaseDefaultEdges = [
-  {
-    id: 'e-actor1-usecase1',
-    source: 'actor-1',
-    target: 'usecase-1',
-    type: 'association',
-    data: { type: 'association' },
-  },
-  {
-    id: 'e-actor1-usecase2',
-    source: 'actor-1',
-    target: 'usecase-2',
-    type: 'association',
-    data: { type: 'association' },
-  },
-  {
-    id: 'e-actor2-usecase1',
-    source: 'actor-2',
-    target: 'usecase-1',
-    type: 'association',
-    data: { type: 'association' },
-  },
-];

package/apps/diagramming/src/cloud-data.ts

@@ -1,371 +0,0 @@
-import { Node, Edge, MarkerType } from 'reactflow';
-
-export const cloudInitialNodes: Node[] = [
-  {
-    id: 'vpc-ffecabf4-e3e8-409c-8325-08c2b2b5314b',
-    type: 'subnetNode',
-    position: {
-      x: -236.44708755828594,
-      y: 111.93957147373396,
-    },
-    data: {
-      label: 'Virtual Private Cloud',
-      color: 'rgba(97, 218, 251, 0.1)',
-      borderColor: '#61dafb',
-      width: 800,
-      height: 600,
-    },
-    style: {
-      width: 800,
-      height: 600,
-      zIndex: 1,
-    },
-    parentNode: '',
-    width: 800,
-    height: 600,
-    selected: false,
-    positionAbsolute: {
-      x: -236.44708755828594,
-      y: 111.93957147373396,
-    },
-    dragging: false,
-  },
-  {
-    id: 'ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a',
-    type: 'serviceNode',
-    position: {
-      x: 38.55365565814054,
-      y: 249.60912240292595,
-    },
-    data: {
-      service: 'ec2',
-      label: 'EC2',
-      sublabel: 'Instance',
-      handles: ['left', 'right'],
-    },
-    style: {
-      zIndex: 2,
-    },
-    parentNode: 'vpc-ffecabf4-e3e8-409c-8325-08c2b2b5314b',
-    extent: 'parent',
-    width: 112,
-    height: 120,
-    selected: false,
-    positionAbsolute: {
-      x: -197.8934319001454,
-      y: 361.5486938766599,
-    },
-    dragging: false,
-  },
-  {
-    id: 'elastic-beanstalk-5d192e86-6f05-4ac4-99b0-6d4d68e74570',
-    type: 'serviceNode',
-    position: {
-      x: 488.69751989931865,
-      y: 472.6598036440373,
-    },
-    data: {
-      service: 'elastic-beanstalk',
-      label: 'Elastic Beanstalk',
-      handles: ['left', 'right'],
-    },
-    style: {
-      zIndex: 2,
-    },
-    parentNode: 'vpc-ffecabf4-e3e8-409c-8325-08c2b2b5314b',
-    extent: 'parent',
-    width: 184,
-    height: 110,
-    selected: false,
-    positionAbsolute: {
-      x: 252.2504323410327,
-      y: 584.5993751177713,
-    },
-    dragging: false,
-  },
-  {
-    id: 'app-runner-18e66403-dfa8-42eb-ac08-0997b8372482',
-    type: 'serviceNode',
-    position: {
-      x: 492.40798757637947,
-      y: 335.3618456545091,
-    },
-    data: {
-      service: 'app-runner',
-      label: 'App Runner',
-      handles: ['left', 'right'],
-    },
-    style: {
-      zIndex: 2,
-    },
-    parentNode: 'vpc-ffecabf4-e3e8-409c-8325-08c2b2b5314b',
-    extent: 'parent',
-    width: 128,
-    height: 110,
-    selected: false,
-    positionAbsolute: {
-      x: 255.96090001809353,
-      y: 447.3014171282431,
-    },
-    dragging: false,
-  },
-  {
-    id: 'ec2-image-builder-98456f68-96a9-477c-8513-2c0fd0541200',
-    type: 'serviceNode',
-    position: {
-      x: 494.882556570789,
-      y: 9.544179088929923,
-    },
-    data: {
-      service: 'ec2-image-builder',
-      label: 'Ec2 Image Builder',
-      handles: ['left', 'right'],
-    },
-    style: {
-      zIndex: 2,
-    },
-    parentNode: 'vpc-ffecabf4-e3e8-409c-8325-08c2b2b5314b',
-    extent: 'parent',
-    width: 184,
-    height: 110,
-    selected: false,
-    positionAbsolute: {
-      x: 258.43546901250306,
-      y: 121.48375056266389,
-    },
-    dragging: false,
-  },
-  {
-    id: 's3-outposts-e0b14a98-57e5-44ed-bc99-0a0e2723dabc',
-    type: 'serviceNode',
-    position: {
-      x: 492.78908900017734,
-      y: 175.7505751547895,
-    },
-    data: {
-      service: 's3-outposts',
-      label: 'S3',
-      sublabel: 'on Outposts',
-      handles: ['left', 'right'],
-    },
-    style: {
-      zIndex: 2,
-    },
-    parentNode: 'vpc-ffecabf4-e3e8-409c-8325-08c2b2b5314b',
-    extent: 'parent',
-    width: 136,
-    height: 120,
-    selected: false,
-    positionAbsolute: {
-      x: 256.3420014418914,
-      y: 287.69014662852345,
-    },
-    dragging: false,
-  },
-  {
-    id: 'vpc-bb20a60a-e474-4815-9b61-6485c2c2b8ad',
-    type: 'subnetNode',
-    position: {
-      x: -233.2247424672605,
-      y: 731.727084440799,
-    },
-    data: {
-      label: 'Data Layer',
-      color: 'rgba(97, 218, 251, 0.1)',
-      borderColor: '#61dafb',
-      width: 800,
-      height: 240,
-    },
-    style: {
-      width: 800,
-      height: 240,
-      zIndex: 1,
-    },
-    parentNode: '',
-    width: 800,
-    height: 240,
-    selected: true,
-    positionAbsolute: {
-      x: -233.2247424672605,
-      y: 731.727084440799,
-    },
-    dragging: false,
-  },
-  {
-    id: 'aurora-c04a6038-07d9-475a-a3e9-73600b0fff0d',
-    type: 'serviceNode',
-    position: {
-      x: 121.7351725052886,
-      y: 68.66715082594908,
-    },
-    data: {
-      service: 'aurora',
-      label: 'Amazon',
-      sublabel: 'Aurora',
-      handles: ['left', 'right'],
-    },
-    style: {
-      zIndex: 2,
-    },
-    parentNode: 'vpc-bb20a60a-e474-4815-9b61-6485c2c2b8ad',
-    extent: 'parent',
-    width: 100,
-    height: 120,
-    selected: false,
-    positionAbsolute: {
-      x: -108.22010852984704,
-      y: 821.6457345755596,
-    },
-    dragging: false,
-  },
-  {
-    id: 'documentdb-f6405751-7756-49ac-b2e6-a93ebb1ed49a',
-    type: 'serviceNode',
-    position: {
-      x: 484.4609848999129,
-      y: 67.17402618231097,
-    },
-    data: {
-      service: 'documentdb',
-      label: 'Amazon',
-      sublabel: 'DocumentDB',
-      handles: ['left', 'right'],
-    },
-    style: {
-      zIndex: 2,
-    },
-    parentNode: 'vpc-bb20a60a-e474-4815-9b61-6485c2c2b8ad',
-    extent: 'parent',
-    width: 128,
-    height: 120,
-    selected: false,
-    positionAbsolute: {
-      x: 254.50570386477727,
-      y: 820.1526099319215,
-    },
-    dragging: false,
-  },
-];
-
-export const cloudInitialEdges: Edge[] = [
-  {
-    type: 'smoothstep',
-    animated: false,
-    style: {
-      stroke: '#61dafb',
-      strokeWidth: 2,
-    },
-    markerEnd: {
-      type: 'arrowclosed',
-      width: 20,
-      height: 20,
-      color: '#61dafb',
-    },
-    source: 'ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a',
-    sourceHandle: null,
-    target: 'ec2-image-builder-98456f68-96a9-477c-8513-2c0fd0541200',
-    targetHandle: null,
-    id: 'reactflow__edge-ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a-ec2-image-builder-98456f68-96a9-477c-8513-2c0fd0541200',
-    selected: false,
-  },
-  {
-    type: 'smoothstep',
-    animated: false,
-    style: {
-      stroke: '#61dafb',
-      strokeWidth: 2,
-    },
-    markerEnd: {
-      type: 'arrowclosed',
-      width: 20,
-      height: 20,
-      color: '#61dafb',
-    },
-    source: 'ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a',
-    sourceHandle: null,
-    target: 'elastic-beanstalk-5d192e86-6f05-4ac4-99b0-6d4d68e74570',
-    targetHandle: null,
-    id: 'reactflow__edge-ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a-elastic-beanstalk-5d192e86-6f05-4ac4-99b0-6d4d68e74570',
-    selected: false,
-  },
-  {
-    type: 'smoothstep',
-    animated: false,
-    style: {
-      stroke: '#61dafb',
-      strokeWidth: 2,
-    },
-    markerEnd: {
-      type: 'arrowclosed',
-      width: 20,
-      height: 20,
-      color: '#61dafb',
-    },
-    source: 'ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a',
-    sourceHandle: null,
-    target: 'app-runner-18e66403-dfa8-42eb-ac08-0997b8372482',
-    targetHandle: null,
-    id: 'reactflow__edge-ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a-app-runner-18e66403-dfa8-42eb-ac08-0997b8372482',
-    selected: false,
-  },
-  {
-    type: 'smoothstep',
-    animated: false,
-    style: {
-      stroke: '#61dafb',
-      strokeWidth: 2,
-    },
-    markerEnd: {
-      type: 'arrowclosed',
-      width: 20,
-      height: 20,
-      color: '#61dafb',
-    },
-    source: 'ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a',
-    sourceHandle: null,
-    target: 's3-outposts-e0b14a98-57e5-44ed-bc99-0a0e2723dabc',
-    targetHandle: null,
-    id: 'reactflow__edge-ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a-s3-outposts-e0b14a98-57e5-44ed-bc99-0a0e2723dabc',
-    selected: false,
-  },
-  {
-    type: 'smoothstep',
-    animated: false,
-    style: {
-      stroke: '#61dafb',
-      strokeWidth: 2,
-    },
-    markerEnd: {
-      type: 'arrowclosed',
-      width: 20,
-      height: 20,
-      color: '#61dafb',
-    },
-    source: 'ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a',
-    sourceHandle: null,
-    target: 'aurora-c04a6038-07d9-475a-a3e9-73600b0fff0d',
-    targetHandle: null,
-    id: 'reactflow__edge-ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a-aurora-c04a6038-07d9-475a-a3e9-73600b0fff0d',
-    selected: false,
-  },
-  {
-    type: 'smoothstep',
-    animated: false,
-    style: {
-      stroke: '#61dafb',
-      strokeWidth: 2,
-    },
-    markerEnd: {
-      type: 'arrowclosed',
-      width: 20,
-      height: 20,
-      color: '#61dafb',
-    },
-    source: 'ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a',
-    sourceHandle: null,
-    target: 'documentdb-f6405751-7756-49ac-b2e6-a93ebb1ed49a',
-    targetHandle: null,
-    id: 'reactflow__edge-ec2-334d8996-776f-4d4a-b1e4-eb9c433b687a-documentdb-f6405751-7756-49ac-b2e6-a93ebb1ed49a',
-    selected: false,
-  },
-];