feat: add new Operators

packages/core/src/operators/index.ts

@@ -3,7 +3,7 @@
 // 之后可以区分为操作流和数据流
 
 // ================ streams operators ================= //
-export { constValue, sum, proxyData } from './streams';
+export { constValue, sum, proxyData, combine, transform } from './streams';
 
 // ================ values operators ================= //
 export { sumValue } from './values';

packages/core/src/operators/streams/combine.ts

@@ -0,0 +1,23 @@
+import { type Atom } from '../../ModelState/State';
+import { ModelState } from '../..';
+
+export function combine<
+  ObservableSubjectList extends Array<Atom<any>>,
+  AppendObservableSubjectList extends Array<Atom<any>>,
+>(
+  streamSource: ObservableSubjectList,
+  appendSource: AppendObservableSubjectList,
+) {
+  const result = new ModelState<any[]>([]);
+
+  streamSource.forEach((input, index) => {
+    input.subscribe((_value, extraInfo) => {
+      const allValue = [...streamSource, ...appendSource].map(
+        (item) => item.current,
+      );
+      result.update(allValue, extraInfo.concat('combine'));
+    });
+  });
+
+  return result;
+}

packages/core/src/operators/streams/index.ts

@@ -1,3 +1,5 @@
 export { constValue } from './constValue';
 export { proxyData } from './proxyData';
 export { sum } from './sum';
+export { combine } from './combine';
+export { transform } from './transform';

packages/core/src/operators/streams/transform.ts

@@ -0,0 +1,17 @@
+import { type Atom } from '../../ModelState/State';
+import { ModelState } from '../..';
+
+export function transform<StreamValue, ResultValue>(
+  steam: Atom<StreamValue>,
+  action: (value: StreamValue) => ResultValue,
+) {
+  return steam.pipe((observer) => {
+    const result = new ModelState<ResultValue | undefined>(undefined);
+
+    observer.subscribe((value, extra) => {
+      result.update(action(value), extra.concat('transform'));
+    });
+
+    return result;
+  });
+}

packages/flow/src/Diagrams/Operators/CombineOperator/index.tsx

@@ -0,0 +1,128 @@
+import { type Node } from 'reactflow';
+import { type IGenerationOption } from '../../Compiler/graph';
+import { NodeTypeEnum } from '../../Nodes/NodeTypeEnum';
+import { MetaOperator } from '../Operator';
+import { EndPoint, type ICombineOperatorData } from '../types';
+import { EosOperatorsSymbol } from '../../Compiler/runtime';
+
+export class CombineOperator
+  extends MetaOperator<ICombineOperatorData>
+  implements MetaOperator<ICombineOperatorData>
+{
+  constructor() {
+    super({
+      operatorName: 'Combine',
+      operatorType: 'CombineOperator',
+      nodeType: NodeTypeEnum.Node,
+    });
+  }
+
+  nodeColor?: string | undefined = '#C21292';
+
+  create(): Node<ICombineOperatorData<Record<string, any>>> {
+    return super.create({
+      endPointOptions: {
+        endPointList: [
+          new EndPoint({
+            type: 'group',
+            hint: 'output',
+            children: [
+              new EndPoint({
+                label: 'output',
+                hint: 'output',
+                variableType: 'array',
+                type: 'source',
+              }),
+            ],
+          }),
+          new EndPoint({
+            type: 'group',
+            hint: 'mainInput',
+            label: 'Main Stream',
+            defaultChildData: {
+              hint: 'mainSource',
+              type: 'target',
+            },
+            allowAddAndRemoveChildren: true,
+            children: [
+              new EndPoint({
+                hint: 'mainSource',
+                type: 'target',
+              }),
+            ],
+          }),
+          new EndPoint({
+            type: 'group',
+            hint: 'appendInput',
+            label: 'Append Stream',
+            defaultChildData: {
+              hint: 'appendSource',
+              type: 'target',
+            },
+            allowAddAndRemoveChildren: true,
+            children: [
+              new EndPoint({
+                hint: 'appendSource',
+                type: 'target',
+              }),
+            ],
+          }),
+        ],
+      },
+    });
+  }
+
+  getHintPorts(node: Node<ICombineOperatorData>, hint: string) {
+    return node.data.endPointOptions?.endPointList?.find(
+      (item) => item.hint === hint,
+    )?.children;
+  }
+
+  getMainInputPorts(node: Node<ICombineOperatorData>) {
+    return this.getHintPorts(node, 'mainInput');
+  }
+
+  getAppendInputPorts(node: Node<ICombineOperatorData>) {
+    return this.getHintPorts(node, 'appendInput');
+  }
+
+  generateBlockDeclarations(
+    options: IGenerationOption<ICombineOperatorData>,
+  ): string[] {
+    const { node, formatVariableName, nodeGraph } = options;
+    const handleId =
+      this.getHintPorts(node, 'output')?.find((item) => item.hint === 'output')
+        ?.id || '';
+
+    const mainInputSet = new Set(
+      this.getMainInputPorts(node)?.map((item) => item.id),
+    );
+    const appendInputSet = new Set(
+      this.getAppendInputPorts(node)?.map((item) => item.id),
+    );
+
+    const sourceItems = nodeGraph.findSourceNodes(node.id) || [];
+    const mainInputSourceIds = sourceItems
+      .filter((item) => mainInputSet.has(item.handleId))
+      .map((item) => item.relatedHandleId);
+
+    const appendInputSourceIds = sourceItems
+      .filter((item) => appendInputSet.has(item.handleId))
+      .map((item) => item.relatedHandleId);
+
+    return [
+      `const ${formatVariableName(handleId)} = ${EosOperatorsSymbol}.combine(
+        [${mainInputSourceIds.map((id) => formatVariableName(id)).join(',')}],
+        [${appendInputSourceIds.map((id) => formatVariableName(id)).join(',')}]
+      )`,
+    ];
+  }
+
+  generateBlockOutput(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+
+  generateBlockRelation(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+}

packages/flow/src/Diagrams/Operators/CustomOperator/index.tsx

@@ -67,7 +67,7 @@ export class CustomOperator
 
   constructor() {
     super({
-      operatorName: 'CustomOperator',
+      operatorName: 'Custom',
       operatorType: 'CustomOperator',
       nodeType: NodeTypeEnum.Node,
       endPointOptions: {

packages/flow/src/Diagrams/Operators/EffectOperator/index.tsx

@@ -0,0 +1,46 @@
+import { type Node } from 'reactflow';
+import { type IGenerationOption } from '../../Compiler/graph';
+import { NodeTypeEnum } from '../../Nodes/NodeTypeEnum';
+import { MetaOperator } from '../Operator';
+import { EndPoint, type IEffectOperatorData } from '../types';
+
+export class EffectOperator
+  extends MetaOperator<IEffectOperatorData>
+  implements MetaOperator<IEffectOperatorData>
+{
+  constructor() {
+    super({
+      operatorName: 'Effect',
+      operatorType: 'EffectOperator',
+      nodeType: NodeTypeEnum.Node,
+    });
+  }
+
+  create(): Node<IEffectOperatorData<Record<string, any>>> {
+    return super.create({
+      endPointOptions: {
+        endPointList: [
+          new EndPoint({
+            type: 'target',
+            hint: 'input',
+            label: 'input',
+          }),
+        ],
+      },
+    });
+  }
+
+  nodeColor?: string | undefined = '#F3F8FF';
+
+  generateBlockDeclarations(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+
+  generateBlockOutput(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+
+  generateBlockRelation(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+}

packages/flow/src/Diagrams/Operators/InputOperator/index.tsx

@@ -18,7 +18,7 @@ export class InputOperator
 
   constructor() {
     super({
-      operatorName: 'InputOperator',
+      operatorName: 'Input',
       operatorType: 'InputOperator',
       nodeType: NodeTypeEnum.Node,
     });

packages/flow/src/Diagrams/Operators/Operator.tsx

@@ -6,6 +6,7 @@ import {
   type IMetaOperatorData,
 } from './types';
 import { type IGenerationOption } from '../Compiler/graph';
+import { Input } from 'antd';
 import { pick } from 'lodash';
 
 export abstract class MetaOperator<
@@ -135,7 +136,7 @@ export abstract class MetaOperator<
     }
     return (
       <>
-        <input
+        <Input
           placeholder="input label"
           style={{ width: '100%', maxWidth: 'none' }}
           value={node.data.nodeLabel}

packages/flow/src/Diagrams/Operators/OperatorMap.ts

@@ -28,6 +28,10 @@ export function registerOperator(operator: MetaOperator) {
   OperatorMap.set(operator.operatorType, operator);
 }
 
+export function registerOperators(operators: MetaOperator[]) {
+  Object.values(operators).forEach(registerOperator);
+}
+
 export function getOperatorFromOperatorType<T extends MetaOperator>(
   operatorType: string,
 ) {

packages/flow/src/Diagrams/Operators/OutputOperator/index.tsx

@@ -13,7 +13,7 @@ export class OutputOperator
 
   constructor() {
     super({
-      operatorName: 'OutputOperator',
+      operatorName: 'Output',
       operatorType: 'OutputOperator',
       nodeType: NodeTypeEnum.Node,
     });

packages/flow/src/Diagrams/Operators/StateOperator/ConstStateOperator.tsx

@@ -8,7 +8,7 @@ import { type Node } from 'reactflow';
 export class ConstStateOperator extends StateOperator implements MetaOperator {
   constructor() {
     super();
-    this.defaultOperatorData.operatorName = 'ConstStateOperator';
+    this.defaultOperatorData.operatorName = 'ConstState';
     this.defaultOperatorData.operatorType = 'ConstStateOperator';
   }
 

packages/flow/src/Diagrams/Operators/StateOperator/StateOperator.tsx

@@ -35,7 +35,7 @@ export class StateOperator
 
   constructor() {
     super({
-      operatorName: 'StateOperator',
+      operatorName: 'State',
       operatorType: 'StateOperator',
       nodeType: NodeTypeEnum.Node,
     });

packages/flow/src/Diagrams/Operators/SumOperator/index.tsx

@@ -13,7 +13,7 @@ export class SumOperator
 
   constructor() {
     super({
-      operatorName: 'SumOperator',
+      operatorName: 'Sum',
       operatorType: 'SumOperator',
       nodeType: NodeTypeEnum.Node,
     });

packages/flow/src/Diagrams/Operators/TransformOperator/index.tsx

@@ -0,0 +1,51 @@
+import { type Node } from 'reactflow';
+import { type IGenerationOption } from '../../Compiler/graph';
+import { NodeTypeEnum } from '../../Nodes/NodeTypeEnum';
+import { MetaOperator } from '../Operator';
+import { EndPoint, type ITranformOperatorData } from '../types';
+
+export class TransformOperator
+  extends MetaOperator<ITranformOperatorData>
+  implements MetaOperator<ITranformOperatorData>
+{
+  constructor() {
+    super({
+      operatorName: 'Transform',
+      operatorType: 'TransformOperator',
+      nodeType: NodeTypeEnum.Node,
+    });
+  }
+
+  create(): Node<ITranformOperatorData<Record<string, any>>> {
+    return super.create({
+      endPointOptions: {
+        endPointList: [
+          new EndPoint({
+            type: 'source',
+            hint: 'output',
+            label: 'output',
+          }),
+          new EndPoint({
+            type: 'target',
+            hint: 'input',
+            label: 'input',
+          }),
+        ],
+      },
+    });
+  }
+
+  nodeColor?: string | undefined = '#F3F8FF';
+
+  generateBlockDeclarations(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+
+  generateBlockOutput(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+
+  generateBlockRelation(options: IGenerationOption<any>): string[] {
+    return [];
+  }
+}

packages/flow/src/Diagrams/Operators/index.ts

@@ -3,15 +3,23 @@ import { InputOperator } from './InputOperator';
 import { OutputOperator } from './OutputOperator';
 import { SumOperator } from './SumOperator';
 import { CustomOperator } from './CustomOperator';
+import { CombineOperator } from './CombineOperator';
+import { TransformOperator } from './TransformOperator';
+import { EffectOperator } from './EffectOperator';
 
-import { registerOperator } from './OperatorMap';
+import { registerOperators } from './OperatorMap';
 
-registerOperator(new InputOperator());
-registerOperator(new OutputOperator());
-registerOperator(new CustomOperator());
-registerOperator(new StateOperator());
-registerOperator(new ConstStateOperator());
-registerOperator(new SumOperator());
+registerOperators([
+  new InputOperator(),
+  new OutputOperator(),
+  new CustomOperator(),
+  new StateOperator(),
+  new ConstStateOperator(),
+  new SumOperator(),
+  new CombineOperator(),
+  new TransformOperator(),
+  new EffectOperator(),
+]);
 
 export {
   OperatorMap,