@coding-flow/flow-design 0.0.1

package/dist/script-components/components/groovy-script-modal.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import { GroovyVariableMapping, ScriptType } from "../typings";
+export interface GroovyScriptModalProps {
+    open: boolean;
+    /** 脚本类型 */
+    type: ScriptType;
+    /** 当前脚本 */
+    script: string;
+    /** 变量映射列表 */
+    variables: GroovyVariableMapping[];
+    /** 确认回调 */
+    onConfirm: (script: string) => void;
+    /** 取消回调 */
+    onCancel: () => void;
+    width?: number | string;
+    /** 弹框标题 */
+    title?: string;
+    /** 自定义内容组件（可选） */
+    content: React.ComponentType<GroovyScriptContent>;
+}
+export interface GroovyScriptContent {
+    /** 脚本类型 */
+    type: ScriptType;
+    /** 当前脚本 */
+    script: string;
+    /** 变量映射列表 */
+    variables: GroovyVariableMapping[];
+    /** 确认回调 */
+    onChange: (script: string) => void;
+}
+/**
+ * 通用脚本配置弹框
+ * 支持普通模式和高级模式切换
+ */
+export declare const GroovyScriptModal: React.FC<GroovyScriptModalProps>;

package/dist/script-components/components/groovy-script-modal.js

@@ -0,0 +1,43 @@
+import { jsx } from "react/jsx-runtime";
+import react from "react";
+import { Modal } from "antd";
+const GroovyScriptContentComponent = (props)=>{
+    const [content, setContent] = react.useState(props.script);
+    const GroovyContent = props.content;
+    react.useImperativeHandle(props.actionRef, ()=>({
+            handleConfirm: ()=>{
+                props.onConfirm(content);
+                props.onCancel();
+            }
+        }), [
+        content
+    ]);
+    return /*#__PURE__*/ jsx(GroovyContent, {
+        type: props.type,
+        script: content,
+        variables: props.variables,
+        onChange: setContent
+    });
+};
+const GroovyScriptModal = (props)=>{
+    const actionRef = react.useRef(null);
+    const width = props.width || 800;
+    const handleOk = ()=>{
+        if (actionRef.current) actionRef.current.handleConfirm();
+    };
+    return /*#__PURE__*/ jsx(Modal, {
+        title: props.title,
+        open: props.open,
+        onCancel: props.onCancel,
+        onOk: handleOk,
+        width: width,
+        okText: "确认",
+        cancelText: "取消",
+        destroyOnHidden: true,
+        children: /*#__PURE__*/ jsx(GroovyScriptContentComponent, {
+            ...props,
+            actionRef: actionRef
+        })
+    });
+};
+export { GroovyScriptModal };

package/dist/script-components/components/groovy-script-preview.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+interface GroovyScriptPreviewProps {
+    script: string;
+    multiline?: boolean;
+}
+export declare const GroovyScriptPreview: React.FC<GroovyScriptPreviewProps>;
+export {};

package/dist/script-components/components/groovy-script-preview.js

@@ -0,0 +1,41 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import "react";
+import { GroovyScriptConvertorUtil } from "@coding-flow/flow-core";
+const GroovyScriptPreview = (props)=>{
+    const multiline = props.multiline || false;
+    const value = GroovyScriptConvertorUtil.getScriptTitle(props.script);
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            multiline && /*#__PURE__*/ jsx("div", {
+                style: {
+                    minHeight: '45px',
+                    padding: '4px 11px',
+                    border: '1px solid #d9d9d9',
+                    borderRadius: '6px',
+                    backgroundColor: value ? '#fff' : '#fafafa',
+                    color: value ? 'rgba(0,0,0,0.88)' : 'rgba(0,0,0,0.25)'
+                },
+                dangerouslySetInnerHTML: {
+                    __html: value
+                }
+            }),
+            !multiline && /*#__PURE__*/ jsx("div", {
+                style: {
+                    flex: 1,
+                    padding: '4px 11px',
+                    backgroundColor: value ? '#fff' : '#fafafa',
+                    border: '1px solid #d9d9d9',
+                    borderRadius: '6px 0 0 6px',
+                    color: value ? 'rgba(0,0,0,0.88)' : 'rgba(0,0,0,0.25)',
+                    whiteSpace: 'nowrap',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis'
+                },
+                dangerouslySetInnerHTML: {
+                    __html: value
+                }
+            })
+        ]
+    });
+};
+export { GroovyScriptPreview };

package/dist/script-components/components/sub-process/hooks/use-current-workflow-presenter.d.ts

@@ -0,0 +1,2 @@
+import { CurrentWorkflowPresenter } from "../presenters";
+export declare const useCurrentWorkflowPresenter: () => CurrentWorkflowPresenter;

package/dist/script-components/components/sub-process/hooks/use-current-workflow-presenter.js

@@ -0,0 +1,7 @@
+import { useDesignContext } from "../../../../components/design-panel/hooks/use-design-context.js";
+import { CurrentWorkflowPresenter } from "../presenters/index.js";
+const useCurrentWorkflowPresenter = ()=>{
+    const { state } = useDesignContext();
+    return new CurrentWorkflowPresenter(state.workflow);
+};
+export { useCurrentWorkflowPresenter };

package/dist/script-components/components/sub-process/hooks/use-sub-process-presenter.d.ts

@@ -0,0 +1,3 @@
+import { SubProcessPresenter } from "../presenters";
+import { SubProcessViewProps } from "../typings";
+export declare const useSubProcessPresenter: (props: SubProcessViewProps) => SubProcessPresenter;

package/dist/script-components/components/sub-process/hooks/use-sub-process-presenter.js

@@ -0,0 +1,8 @@
+import react from "react";
+import { SubProcessPresenter } from "../presenters/index.js";
+const useSubProcessPresenter = (props)=>{
+    const ref = react.useRef(void 0);
+    if (!ref.current) ref.current = new SubProcessPresenter(props);
+    return ref.current;
+};
+export { useSubProcessPresenter };

package/dist/script-components/components/sub-process/hooks/use-target-workflow-presenter.d.ts

@@ -0,0 +1,6 @@
+import { TargetWorkflowPresenter } from "../presenters/target-workflow-presenter";
+import { SubProcessViewState } from "../typings";
+export declare const useTargetWorkflowPresenter: () => {
+    state: SubProcessViewState;
+    presenter: TargetWorkflowPresenter;
+};

package/dist/script-components/components/sub-process/hooks/use-target-workflow-presenter.js

@@ -0,0 +1,24 @@
+import react from "react";
+import { TargetWorkflowPresenter } from "../presenters/target-workflow-presenter.js";
+import { SubProcessViewApiImpl } from "../models/index.js";
+const useTargetWorkflowPresenter = ()=>{
+    const ref = react.useRef(void 0);
+    const [state, setState] = react.useState({
+        workflows: [],
+        actions: []
+    });
+    if (!ref.current) {
+        ref.current = new TargetWorkflowPresenter(state, setState, new SubProcessViewApiImpl());
+        ref.current.initState();
+    }
+    react.useEffect(()=>{
+        if (ref.current) ref.current.syncState(state);
+    }, [
+        state
+    ]);
+    return {
+        state,
+        presenter: ref.current
+    };
+};
+export { useTargetWorkflowPresenter };

package/dist/script-components/components/sub-process/index.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { SubProcessViewProps } from "./typings";
+export declare const SubProcessView: React.FC<SubProcessViewProps>;

package/dist/script-components/components/sub-process/index.js

@@ -0,0 +1,71 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import react from "react";
+import { Form, Select } from "antd";
+import { useTargetWorkflowPresenter } from "./hooks/use-target-workflow-presenter.js";
+import { SubProcessOperatorPluginView } from "../../../plugins/view/sub-process-opreator-view.js";
+import { FormDataView } from "../form-data/index.js";
+import { useSubProcessPresenter } from "./hooks/use-sub-process-presenter.js";
+const SubProcessView = (props)=>{
+    const [form] = Form.useForm();
+    const { state, presenter } = useTargetWorkflowPresenter();
+    const subProcessPresenter = useSubProcessPresenter(props);
+    react.useEffect(()=>{
+        if (props.value) {
+            const data = subProcessPresenter.parserScript(props.value);
+            const workId = data.workId;
+            form.resetFields();
+            form.setFieldsValue(data);
+            if (workId) presenter.setCurrentWorkId(workId);
+        }
+    }, [
+        props.value
+    ]);
+    return /*#__PURE__*/ jsx(Fragment, {
+        children: /*#__PURE__*/ jsxs(Form, {
+            form: form,
+            layout: "vertical",
+            onValuesChange: ()=>{
+                const values = form.getFieldsValue();
+                subProcessPresenter.updateScript(values);
+            },
+            children: [
+                /*#__PURE__*/ jsx(Form.Item, {
+                    name: "workId",
+                    label: "发起流程",
+                    children: /*#__PURE__*/ jsx(Select, {
+                        placeholder: "请选择发起流程",
+                        options: state.workflows,
+                        onChange: (value)=>{
+                            presenter.setCurrentWorkId(value);
+                        }
+                    })
+                }),
+                /*#__PURE__*/ jsx(Form.Item, {
+                    name: "actionId",
+                    label: "触发动作",
+                    children: /*#__PURE__*/ jsx(Select, {
+                        placeholder: "请选择触发动作",
+                        options: state.actions.map((item)=>({
+                                key: item.actionId,
+                                value: item.actionId,
+                                label: item.title
+                            }))
+                    })
+                }),
+                /*#__PURE__*/ jsx(Form.Item, {
+                    name: "operatorId",
+                    label: "流程发起人",
+                    children: /*#__PURE__*/ jsx(SubProcessOperatorPluginView, {})
+                }),
+                /*#__PURE__*/ jsx(Form.Item, {
+                    name: "formData",
+                    label: "流程数据",
+                    children: /*#__PURE__*/ jsx(FormDataView, {
+                        form: state.form
+                    })
+                })
+            ]
+        })
+    });
+};
+export { SubProcessView };

package/dist/script-components/components/sub-process/models/index.d.ts

@@ -0,0 +1,5 @@
+import { SubProcessViewApi } from "../typings";
+export declare class SubProcessViewApiImpl implements SubProcessViewApi {
+    options: () => Promise<any>;
+    meta: (workId: string) => Promise<any>;
+}

package/dist/script-components/components/sub-process/models/index.js

@@ -0,0 +1,14 @@
+import { meta, options } from "../../../../api/workflow.js";
+class SubProcessViewApiImpl {
+    options = async ()=>{
+        const res = await options();
+        if (res.success) return res.data.list;
+        return [];
+    };
+    meta = async (workId)=>{
+        const res = await meta(workId);
+        if (res.success) return res.data;
+        return null;
+    };
+}
+export { SubProcessViewApiImpl };

package/dist/script-components/components/sub-process/presenters/current-workflow-presenter.d.ts

@@ -0,0 +1,9 @@
+import { Workflow } from "../../../../components/design-panel/types";
+export declare class CurrentWorkflowPresenter {
+    private readonly workflow;
+    constructor(workflow: Workflow);
+    getOperatorOptions(): {
+        label: string;
+        value: string;
+    }[];
+}

package/dist/script-components/components/sub-process/presenters/current-workflow-presenter.js

@@ -0,0 +1,19 @@
+class CurrentWorkflowPresenter {
+    workflow;
+    constructor(workflow){
+        this.workflow = workflow;
+    }
+    getOperatorOptions() {
+        const options = [];
+        options.push({
+            label: "流程创建人",
+            value: 'request.getCreatedOperatorId()'
+        });
+        options.push({
+            label: "流程审批人",
+            value: 'request.getCurrentOperatorId()'
+        });
+        return options;
+    }
+}
+export { CurrentWorkflowPresenter };

package/dist/script-components/components/sub-process/presenters/index.d.ts

@@ -0,0 +1,3 @@
+export * from './current-workflow-presenter';
+export * from './target-workflow-presenter';
+export * from './sub-process-presenter';

package/dist/script-components/components/sub-process/presenters/index.js

@@ -0,0 +1,3 @@
+export * from "./current-workflow-presenter.js";
+export * from "./target-workflow-presenter.js";
+export * from "./sub-process-presenter.js";

package/dist/script-components/components/sub-process/presenters/sub-process-presenter.d.ts

@@ -0,0 +1,9 @@
+import { SubProcessViewProps } from "../typings";
+export declare class SubProcessPresenter {
+    private readonly props;
+    constructor(props: SubProcessViewProps);
+    parserScript(value: string): any;
+    updateScript(values: any): void;
+    private toFormData;
+    private toScript;
+}

package/dist/script-components/components/sub-process/presenters/sub-process-presenter.js

@@ -0,0 +1,34 @@
+import { GroovyScriptConvertorUtil } from "@coding-flow/flow-core";
+class SubProcessPresenter {
+    props;
+    constructor(props){
+        this.props = props;
+    }
+    parserScript(value) {
+        const meta = GroovyScriptConvertorUtil.getScriptMeta(value);
+        if (meta) return JSON.parse(meta);
+        return {};
+    }
+    updateScript(values) {
+        this.props.onChange(this.toScript(values));
+    }
+    toFormData(values) {
+        if (values && values?.formData) {
+            const formData = JSON.parse(values.formData);
+            const data = formData.dataBody?.data;
+            if (data) return JSON.stringify(data);
+        }
+        return '';
+    }
+    toScript(values) {
+        const meta = JSON.stringify(values);
+        const formData = this.toFormData(values);
+        return `
+        // @SCRIPT_TITLE 子流程配置
+        // @SCRIPT_META ${meta} 
+        def run(request){
+            return request.toCreateRequest('${values.workId}', ${values.operatorId},'${values.actionId}', '${formData}');
+        }`;
+    }
+}
+export { SubProcessPresenter };

package/dist/script-components/components/sub-process/presenters/target-workflow-presenter.d.ts

@@ -0,0 +1,11 @@
+import { SubProcessViewApi, SubProcessViewState } from "../typings";
+import { Dispatch } from "@coding-flow/flow-core";
+export declare class TargetWorkflowPresenter {
+    private state;
+    private readonly dispatch;
+    private readonly api;
+    constructor(state: SubProcessViewState, dispatch: Dispatch<SubProcessViewState>, api: SubProcessViewApi);
+    syncState(state: SubProcessViewState): void;
+    initState(): void;
+    setCurrentWorkId(workId: string): void;
+}

package/dist/script-components/components/sub-process/presenters/target-workflow-presenter.js

@@ -0,0 +1,32 @@
+class TargetWorkflowPresenter {
+    state;
+    dispatch;
+    api;
+    constructor(state, dispatch, api){
+        this.state = state;
+        this.api = api;
+        this.dispatch = dispatch;
+    }
+    syncState(state) {
+        this.state = state;
+    }
+    initState() {
+        this.api.options().then((list)=>{
+            this.dispatch((prevState)=>({
+                    ...prevState,
+                    workflows: list
+                }));
+        });
+    }
+    setCurrentWorkId(workId) {
+        this.api.meta(workId).then((meta)=>{
+            this.dispatch((prevState)=>({
+                    ...prevState,
+                    currentWorkId: workId,
+                    actions: meta.actions,
+                    form: meta.form
+                }));
+        });
+    }
+}
+export { TargetWorkflowPresenter };

package/dist/script-components/components/sub-process/typings/index.d.ts

@@ -0,0 +1,32 @@
+import { FlowForm } from "@coding-flow/flow-types";
+/**
+ *  子流程组件数据
+ */
+export interface SubProcessViewProps {
+    value: string;
+    onChange: (value: string) => void;
+}
+export interface WorkflowMeta {
+    workId: string;
+    actions: ActionOption[];
+    form: FlowForm;
+}
+export interface SubProcessViewState {
+    workflows: WorkflowOption[];
+    actions: ActionOption[];
+    currentWorkId?: string;
+    form?: FlowForm;
+}
+export interface WorkflowOption {
+    label: string;
+    value: string;
+}
+export interface ActionOption {
+    actionId: string;
+    title: string;
+    type: string;
+}
+export interface SubProcessViewApi {
+    options(): Promise<WorkflowOption[]>;
+    meta(workId: string): Promise<WorkflowMeta>;
+}

package/dist/script-components/components/variable-picker.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { GroovyVariableMapping } from "../typings";
+export interface VariablePickerProps {
+    /** 变量映射列表 */
+    mappings: GroovyVariableMapping[];
+    /** 选中变量回调 */
+    onSelect: (mapping: GroovyVariableMapping) => void;
+}
+/**
+ * 变量选择器组件
+ * 用于在脚本表达式中插入变量
+ */
+export declare const VariablePicker: React.FC<VariablePickerProps>;

package/dist/script-components/components/variable-picker.js

@@ -0,0 +1,134 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import react, { useState } from "react";
+import { Button, Col, Empty, Input, Popover, Row } from "antd";
+import { EditOutlined, SearchOutlined } from "@ant-design/icons";
+const VariablePickerContent = (props)=>{
+    const [searchText, setSearchText] = useState('');
+    const mappings = react.useMemo(()=>{
+        const groups = new Map();
+        for (const mapping of props.mappings){
+            const existing = groups.get(mapping.tag) || [];
+            existing.push(mapping);
+            groups.set(mapping.tag, existing);
+        }
+        return groups;
+    }, []);
+    const handleInputChange = (e)=>{
+        e.stopPropagation();
+        setSearchText(e.target.value);
+    };
+    return /*#__PURE__*/ jsxs("div", {
+        style: {
+            maxHeight: 300,
+            overflowY: 'auto',
+            width: 400
+        },
+        children: [
+            /*#__PURE__*/ jsx(Input, {
+                placeholder: "搜索变量...",
+                prefix: /*#__PURE__*/ jsx(SearchOutlined, {
+                    style: {
+                        color: '#999'
+                    }
+                }),
+                value: searchText,
+                onChange: handleInputChange,
+                allowClear: true,
+                style: {
+                    marginBottom: 8
+                }
+            }),
+            0 === mappings.size && /*#__PURE__*/ jsx(Empty, {
+                description: "未找到匹配的变量",
+                image: Empty.PRESENTED_IMAGE_SIMPLE
+            }),
+            Array.from(mappings.entries()).map(([tag, group])=>/*#__PURE__*/ jsxs(Row, {
+                    gutter: [
+                        8,
+                        8
+                    ],
+                    style: {
+                        width: '100%'
+                    },
+                    children: [
+                        /*#__PURE__*/ jsx(Col, {
+                            span: 24,
+                            style: {
+                                fontWeight: 'bold',
+                                color: '#1890ff'
+                            },
+                            children: /*#__PURE__*/ jsx("span", {
+                                children: tag
+                            })
+                        }),
+                        group.map((mapping, index)=>/*#__PURE__*/ jsxs(Col, {
+                                span: 12,
+                                style: {
+                                    padding: '8px',
+                                    border: '1px solid #f0f0f0',
+                                    borderRadius: 4,
+                                    cursor: 'pointer',
+                                    backgroundColor: '#fff'
+                                },
+                                onClick: ()=>{
+                                    props.onSelect(mapping);
+                                },
+                                children: [
+                                    /*#__PURE__*/ jsx("div", {
+                                        style: {
+                                            fontSize: 14,
+                                            color: '#333',
+                                            fontWeight: 500,
+                                            whiteSpace: 'nowrap',
+                                            overflow: 'hidden',
+                                            textOverflow: 'ellipsis'
+                                        },
+                                        children: mapping.label
+                                    }),
+                                    /*#__PURE__*/ jsx("div", {
+                                        style: {
+                                            fontSize: 12,
+                                            color: '#999',
+                                            marginTop: 4,
+                                            whiteSpace: 'nowrap',
+                                            overflow: 'hidden',
+                                            textOverflow: 'ellipsis'
+                                        },
+                                        children: mapping.expression
+                                    })
+                                ]
+                            }, index))
+                    ]
+                }, tag))
+        ]
+    });
+};
+const VariablePicker = (props)=>{
+    const [visible, setVisible] = react.useState(false);
+    const handleSelect = (mapping)=>{
+        props.onSelect(mapping);
+        setVisible(false);
+    };
+    return /*#__PURE__*/ jsx(Popover, {
+        content: /*#__PURE__*/ jsx(VariablePickerContent, {
+            ...props,
+            onSelect: handleSelect
+        }),
+        open: visible,
+        destroyOnHidden: true,
+        onOpenChange: (visible)=>{
+            setVisible(visible);
+        },
+        trigger: "click",
+        placement: "bottom",
+        getPopupContainer: (trigger)=>trigger.parentElement || document.body,
+        children: /*#__PURE__*/ jsx(Button, {
+            icon: /*#__PURE__*/ jsx(EditOutlined, {}),
+            onClick: ()=>{
+                setVisible(true);
+            },
+            children: "插入变量"
+        })
+    });
+};
+export { VariablePicker };

package/dist/script-components/default-script.d.ts

@@ -0,0 +1,9 @@
+export declare const SCRIPT_DEFAULT_OPERATOR_CREATE = "// @SCRIPT_TITLE \u4EFB\u610F\u4EBA\u5458\n// @SCRIPT_META {\"type\":\"any\"}\ndef run(request){\n    return true;\n}\n";
+export declare const SCRIPT_DEFAULT_OPERATOR_LOAD = "// @SCRIPT_TITLE \u6D41\u7A0B\u521B\u5EFA\u8005  \n// @SCRIPT_META {\"type\":\"creator\"}\ndef run(request){\n    return [request.getCreatedOperatorId()]\n}\n";
+export declare const SCRIPT_DEFAULT_NODE_TITLE = "// @SCRIPT_TITLE \u60A8\u6709\u4E00\u6761\u5F85\u529E\u6D88\u606F\ndef run(request){\n    return \"\u60A8\u6709\u4E00\u6761\u5F85\u529E\u6D88\u606F\"\n}\n        ";
+export declare const SCRIPT_DEFAULT_ERROR_TRIGGER = "// @SCRIPT_TITLE \u56DE\u9000\u81F3\u5F00\u59CB\u8282\u70B9\n// @SCRIPT_META {\"type\":\"node\",\"node\":\"START\"} \ndef run(request){ \n    return request.getStartNode().getId();\n}\n";
+export declare const SCRIPT_DEFAULT_CONDITION = "// @SCRIPT_TITLE \u9ED8\u8BA4\u6761\u4EF6\uFF08\u5141\u8BB8\u6267\u884C\uFF09\ndef run(request){\n    return true;\n}\n";
+export declare const SCRIPT_DEFAULT_ROUTER = "// @SCRIPT_TITLE \u53D1\u8D77\u8282\u70B9\n// @SCRIPT_META {\"node\":\"START\"}\ndef run(request){\n    return request.getStartNode().getId();\n}\n";
+export declare const SCRIPT_DEFAULT_TRIGGER = "// @SCRIPT_TITLE \u793A\u4F8B\u89E6\u53D1\u8282\u70B9\uFF08\u6253\u5370\u89E6\u53D1\u65E5\u5FD7\uFF09 \ndef run(request){ \n    print('hello trigger node.\\n'); \n}\n";
+export declare const SCRIPT_DEFAULT_CUSTOM = "// @SCRIPT_TITLE \u9ED8\u8BA4\u6761\u4EF6 \u89E6\u53D1\u901A\u8FC7\n// @SCRIPT_META {\"trigger\":\"PASS\"}\ndef run(request){ \n    return 'PASS'; \n}\n";
+export declare const SCRIPT_DEFAULT_SUB_PROCESS = "// @SCRIPT_TITLE \u521B\u5EFA\u5F53\u524D\u6D41\u7A0B  \ndef run(request){ \n    return request.toCreateRequest() \n}\n";