@sunspirytus/xflow-extension 1.0.52

package/es/flowchart-editor-panel/control-map-service/components/edge.js

@@ -0,0 +1,111 @@
+import React, { useState, useEffect } from 'react';
+import { FlowchartFormWrapper } from '../../form-wrapper';
+import { ColorPicker, InputNumberFiled, InputFiled, SelectField } from './fields';
+import { PREFIX, DefaultEdgeConfig, ArrowStrokeMaps, ArrowMaps } from './constants';
+const EdgeComponent = props => {
+    const { config, plugin = {} } = props;
+    const { updateEdge } = plugin;
+    const [edgeConfig, setEdgeConfig] = useState(Object.assign(Object.assign({}, DefaultEdgeConfig), config));
+    useEffect(() => {
+        setEdgeConfig(Object.assign(Object.assign({}, DefaultEdgeConfig), config));
+    }, [config]);
+    const getAttrs = (key, type = 'line') => {
+        var _a;
+        const { attrs = {} } = edgeConfig;
+        return (_a = attrs[type]) === null || _a === void 0 ? void 0 : _a[key];
+    };
+    const getArrowValue = () => {
+        var _a, _b, _c, _d, _e;
+        const { attrs = {} } = edgeConfig;
+        const { line = {} } = attrs;
+        if (((_a = line.sourceMarker) === null || _a === void 0 ? void 0 : _a.name) && ((_b = line.targetMarker) === null || _b === void 0 ? void 0 : _b.name)) {
+            return 'all';
+        }
+        if (!((_c = line.sourceMarker) === null || _c === void 0 ? void 0 : _c.name) && !((_d = line.targetMarker) === null || _d === void 0 ? void 0 : _d.name)) {
+            return 'none';
+        }
+        if ((_e = line.sourceMarker) === null || _e === void 0 ? void 0 : _e.name) {
+            return 'source';
+        }
+        return 'target';
+    };
+    const getSrokeDashValue = () => {
+        const { attrs = {} } = edgeConfig;
+        const { line = {} } = attrs;
+        return line.strokeDasharray ? 'dash' : 'solid';
+    };
+    const onEdgeConfigChange = (key, value, type = 'line') => {
+        var _a, _b;
+        /** 全量更新，简化逻辑 */
+        if (key === 'arrow') {
+            setEdgeConfig(Object.assign(Object.assign({}, edgeConfig), { attrs: Object.assign(Object.assign({}, edgeConfig.attrs), { [type]: Object.assign(Object.assign({}, (_a = edgeConfig.attrs) === null || _a === void 0 ? void 0 : _a[type]), value) }) }));
+        }
+        else {
+            setEdgeConfig(Object.assign(Object.assign({}, edgeConfig), { [key]: value, attrs: Object.assign(Object.assign({}, edgeConfig.attrs), { [type]: Object.assign(Object.assign({}, (_b = edgeConfig.attrs) === null || _b === void 0 ? void 0 : _b[type]), { [key]: value }) }) }));
+        }
+        updateEdge({
+            [key]: value,
+        }, type, key === 'arrow' ? 'arrow' : '');
+    };
+    return (React.createElement("div", { className: `${PREFIX}-panel-body` },
+        React.createElement("div", { className: `${PREFIX}-panel-group` },
+            React.createElement("h5", null, "\u5185\u5BB9"),
+            React.createElement(InputFiled, { label: "\u6807\u7B7E", value: edgeConfig.label, onChange: value => {
+                    onEdgeConfigChange('label', value);
+                } })),
+        React.createElement("h5", { style: { marginBottom: 12 } }, "\u6837\u5F0F"),
+        React.createElement("div", { className: `${PREFIX}-panel-group`, style: { marginBottom: 0 } },
+            React.createElement("h5", null, "\u7EBF"),
+            React.createElement(SelectField, { label: "\u7BAD\u5934", value: getArrowValue(), width: "100%", options: [
+                    {
+                        label: '正向',
+                        value: 'target',
+                    },
+                    {
+                        label: '逆向',
+                        value: 'source',
+                    },
+                    {
+                        label: '双向',
+                        value: 'all',
+                    },
+                    {
+                        label: '无',
+                        value: 'none',
+                    },
+                ], onChange: value => {
+                    onEdgeConfigChange('arrow', ArrowMaps[value], 'line');
+                } }),
+            React.createElement("div", { className: `${PREFIX}-edge-stroke-style` },
+                React.createElement(SelectField, { label: "\u7EBF\u5F62", width: 68, value: getSrokeDashValue(), options: [
+                        {
+                            label: '实线',
+                            value: 'solid',
+                        },
+                        {
+                            label: '虚线',
+                            value: 'dash',
+                        },
+                    ], onChange: value => {
+                        onEdgeConfigChange('strokeDasharray', ArrowStrokeMaps[value], 'line');
+                    } }),
+                React.createElement(InputNumberFiled, { value: getAttrs('strokeWidth'), min: 1, onChange: value => {
+                        onEdgeConfigChange('strokeWidth', value, 'line');
+                    } })),
+            React.createElement(ColorPicker, { label: "\u8FB9\u6846", value: getAttrs('stroke'), onChange: (value) => {
+                    onEdgeConfigChange('stroke', value, 'line');
+                } })),
+        React.createElement("div", { className: `${PREFIX}-panel-group` },
+            React.createElement("h5", null, "\u6807\u7B7E"),
+            React.createElement("div", { className: `${PREFIX}-edge-text-style` },
+                React.createElement(InputNumberFiled, { label: "\u5B57\u53F7", min: 10, width: 68, value: getAttrs('fontSize', 'text') || 12, onChange: value => {
+                        onEdgeConfigChange('fontSize', value, 'text');
+                    } }),
+                React.createElement(ColorPicker, { value: getAttrs('fill', 'text') || '#000', onChange: (value) => {
+                        onEdgeConfigChange('fill', value, 'text');
+                    } })))));
+};
+export const EdgeService = props => {
+    return (React.createElement(FlowchartFormWrapper, Object.assign({}, props, { type: "edge" }), (config, plugin) => React.createElement(EdgeComponent, Object.assign({}, props, { plugin: plugin, config: config }))));
+};
+//# sourceMappingURL=edge.js.map

package/es/flowchart-editor-panel/control-map-service/components/edge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edge.js","sourceRoot":"","sources":["../../../../src/flowchart-editor-panel/control-map-service/components/edge.tsx"],"names":[],"mappings":"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"}

package/es/flowchart-editor-panel/control-map-service/components/fields/color.d.ts

@@ -0,0 +1,7 @@
+export interface IProps {
+    label?: string;
+    value?: string;
+    onChange?: (value: string) => void;
+}
+declare const _default: any;
+export default _default;

package/es/flowchart-editor-panel/control-map-service/components/fields/color.js

@@ -0,0 +1,76 @@
+import React, { useState, useRef, memo } from 'react';
+import { render, createPortal } from 'react-dom';
+import { useXFlowApp } from '@sunspirytus/xflow-core';
+import { Button } from 'antd';
+import { SketchPicker } from 'react-color';
+import { PREFIX } from '../constants';
+const ColorPicker = props => {
+    const { label, value = '', onChange } = props;
+    const [show, setShow] = useState(false);
+    const colorRef = useRef(value);
+    const containerRef = useRef();
+    const { graphProvider } = useXFlowApp();
+    const graphConfig = useRef();
+    graphProvider.getGraphOptions().then(x6GraphConfig => {
+        graphConfig.current = x6GraphConfig;
+    });
+    const PickContainer = () => {
+        return (React.createElement("div", { className: `${PREFIX}-pick-color-container` },
+            React.createElement("div", { className: `${PREFIX}-popover` },
+                React.createElement(SketchPicker, { onChange: color => {
+                        colorRef.current = color.hex;
+                    } }),
+                React.createElement("div", { className: "foolter" },
+                    React.createElement(Button, { onClick: () => {
+                            setShow(false);
+                        } }, "\u53D6\u6D88"),
+                    React.createElement(Button, { type: "primary", onClick: () => {
+                            onChange === null || onChange === void 0 ? void 0 : onChange(colorRef.current);
+                            setShow(false);
+                        } }, "\u786E\u8BA4")))));
+    };
+    const getParentContainerByClassName = (currentEle, className) => {
+        const containers = document.getElementsByClassName(className);
+        if (containers.length === 1) {
+            return containers[0];
+        }
+        let containter = null;
+        let currentNode = currentEle.parentElement;
+        while (!containter) {
+            const current = currentNode.getElementsByClassName(className);
+            if ((current === null || current === void 0 ? void 0 : current.length) > 0) {
+                containter = current[0];
+            }
+            currentNode = currentNode.parentElement;
+        }
+        return containter;
+    };
+    const createPickColorContainer = (visible) => {
+        const existElements = document.getElementsByClassName(`${PREFIX}-pick-color-container`);
+        if (existElements.length) {
+            Array.from(existElements).forEach(ele => {
+                var _a;
+                (_a = ele.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(ele);
+            });
+        }
+        if (!visible) {
+            return;
+        }
+        const div = document.createElement('div');
+        render(createPortal(React.createElement(PickContainer, null), getParentContainerByClassName(containerRef.current, 'flowchart-editor-panel-body')), div);
+    };
+    return (React.createElement("div", { className: "group", ref: containerRef },
+        label && React.createElement("label", null, label),
+        React.createElement("div", { className: `${PREFIX}-color-container`, onClick: () => {
+                setShow(true);
+            } },
+            React.createElement("div", { className: `${PREFIX}-color`, style: {
+                    backgroundColor: value,
+                    height: '100%',
+                } })),
+        createPickColorContainer(show)));
+};
+export default memo(ColorPicker, (pre, next) => {
+    return pre.label === next.label && pre.value === next.value;
+});
+//# sourceMappingURL=color.js.map

package/es/flowchart-editor-panel/control-map-service/components/fields/color.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color.js","sourceRoot":"","sources":["../../../../../src/flowchart-editor-panel/control-map-service/components/fields/color.tsx"],"names":[],"mappings":"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"}

package/es/flowchart-editor-panel/control-map-service/components/fields/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import InputFiled from './input';
+import ColorPicker from './color';
+import InputNumberFiled from './input-number';
+import Size from './size';
+import Position from './position';
+import SelectField from './select';
+export declare const EditorPanels: Record<string, React.FC | React.NamedExoticComponent<any>>;
+export { InputFiled, ColorPicker, InputNumberFiled, Size, Position, SelectField };

package/es/flowchart-editor-panel/control-map-service/components/fields/index.js

@@ -0,0 +1,17 @@
+import 'react';
+import InputFiled from './input';
+import ColorPicker from './color';
+import InputNumberFiled from './input-number';
+import Size from './size';
+import Position from './position';
+import SelectField from './select';
+export const EditorPanels = {
+    InputFiled,
+    ColorPicker,
+    InputNumberFiled,
+    Size,
+    Position,
+    SelectField,
+};
+export { InputFiled, ColorPicker, InputNumberFiled, Size, Position, SelectField };
+//# sourceMappingURL=index.js.map

package/es/flowchart-editor-panel/control-map-service/components/fields/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/flowchart-editor-panel/control-map-service/components/fields/index.ts"],"names":[],"mappings":"AAAA,OAAkB,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,SAAS,CAAA;AAChC,OAAO,WAAW,MAAM,SAAS,CAAA;AACjC,OAAO,gBAAgB,MAAM,gBAAgB,CAAA;AAC7C,OAAO,IAAI,MAAM,QAAQ,CAAA;AACzB,OAAO,QAAQ,MAAM,YAAY,CAAA;AACjC,OAAO,WAAW,MAAM,UAAU,CAAA;AAElC,MAAM,CAAC,MAAM,YAAY,GAA+D;IACtF,UAAU;IACV,WAAW;IACX,gBAAgB;IAChB,IAAI;IACJ,QAAQ;IACR,WAAW;CACZ,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,gBAAgB,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAA"}

package/es/flowchart-editor-panel/control-map-service/components/fields/input-number.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface IProps {
+    label?: string;
+    value?: number;
+    min?: number;
+    width?: number;
+    onChange?: (value: number) => void;
+}
+declare const InputNumberFiled: React.FC<IProps>;
+export default InputNumberFiled;

package/es/flowchart-editor-panel/control-map-service/components/fields/input-number.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { InputNumber } from 'antd';
+import { FormItemHeight } from '../constants';
+const InputNumberFiled = props => {
+    const { label, value, onChange, min, width } = props;
+    return (React.createElement("div", { className: "group" },
+        label && React.createElement("label", null, label),
+        React.createElement(InputNumber, { value: value, min: min, style: {
+                width,
+                height: FormItemHeight,
+            }, onChange: (v) => {
+                onChange === null || onChange === void 0 ? void 0 : onChange(v);
+            } })));
+};
+export default InputNumberFiled;
+//# sourceMappingURL=input-number.js.map

package/es/flowchart-editor-panel/control-map-service/components/fields/input-number.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-number.js","sourceRoot":"","sources":["../../../../../src/flowchart-editor-panel/control-map-service/components/fields/input-number.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,WAAW,EAAE,MAAM,MAAM,CAAA;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAU7C,MAAM,gBAAgB,GAAqB,KAAK,CAAC,EAAE;IACjD,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IACpD,OAAO,CACL,6BAAK,SAAS,EAAC,OAAO;QACnB,KAAK,IAAI,mCAAQ,KAAK,CAAS;QAChC,oBAAC,WAAW,IACV,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;gBACL,KAAK;gBACL,MAAM,EAAE,cAAc;aACvB,EACD,QAAQ,EAAE,CAAC,CAAS,EAAE,EAAE;gBACtB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,CAAA;YACf,CAAC,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,gBAAgB,CAAA"}

package/es/flowchart-editor-panel/control-map-service/components/fields/input.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface IProps {
+    label?: string;
+    value?: string;
+    onChange?: (value: string) => void;
+}
+declare const InputFiled: React.FC<IProps>;
+export default InputFiled;

package/es/flowchart-editor-panel/control-map-service/components/fields/input.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Input } from 'antd';
+import { FormItemHeight } from '../constants';
+const InputFiled = props => {
+    const { label = '标签', value, onChange } = props;
+    return (React.createElement("div", { className: "group" },
+        React.createElement("label", null, label),
+        React.createElement(Input, { value: value, style: {
+                height: FormItemHeight,
+            }, onChange: (e) => {
+                onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value);
+            } })));
+};
+export default InputFiled;
+//# sourceMappingURL=input.js.map

package/es/flowchart-editor-panel/control-map-service/components/fields/input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","sourceRoot":"","sources":["../../../../../src/flowchart-editor-panel/control-map-service/components/fields/input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,KAAK,EAAE,MAAM,MAAM,CAAA;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAQ7C,MAAM,UAAU,GAAqB,KAAK,CAAC,EAAE;IAC3C,MAAM,EAAE,KAAK,GAAG,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAC/C,OAAO,CACL,6BAAK,SAAS,EAAC,OAAO;QACpB,mCAAQ,KAAK,CAAS;QACtB,oBAAC,KAAK,IACJ,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;gBACL,MAAM,EAAE,cAAc;aACvB,EACD,QAAQ,EAAE,CAAC,CAAsC,EAAE,EAAE;gBACnD,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;YAC5B,CAAC,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,UAAU,CAAA"}

package/es/flowchart-editor-panel/control-map-service/components/fields/position.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface IProps {
+    x?: number;
+    y?: number;
+    label?: string;
+    onChange?: (key: string, value: number) => void;
+}
+export declare const Item: ({ value, onChangeItem, addonBefore }: {
+    value: any;
+    onChangeItem: any;
+    addonBefore: any;
+}) => any;
+declare const Position: React.FC<IProps>;
+export default Position;

package/es/flowchart-editor-panel/control-map-service/components/fields/position.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { InputNumber } from 'antd';
+import { FormItemHeight } from '../constants';
+export const Item = ({ value, onChangeItem, addonBefore }) => (React.createElement("div", { className: "addon-before-group" },
+    React.createElement(InputNumber, { value: value, style: { height: FormItemHeight, border: 'none' }, onChange: (v) => {
+            onChangeItem(v);
+        } }),
+    React.createElement("span", null, addonBefore)));
+const Position = props => {
+    const { label = '位置', x, y, onChange } = props;
+    return (React.createElement("div", { className: "group" },
+        React.createElement("label", null, label),
+        React.createElement("div", { className: "split" },
+            React.createElement(Item, { addonBefore: "X", value: x, onChangeItem: (value) => {
+                    onChange === null || onChange === void 0 ? void 0 : onChange('x', value);
+                } }),
+            React.createElement(Item, { addonBefore: "Y", value: y, onChangeItem: (value) => {
+                    onChange === null || onChange === void 0 ? void 0 : onChange('y', value);
+                } }))));
+};
+export default Position;
+//# sourceMappingURL=position.js.map

package/es/flowchart-editor-panel/control-map-service/components/fields/position.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"position.js","sourceRoot":"","sources":["../../../../../src/flowchart-editor-panel/control-map-service/components/fields/position.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,WAAW,EAAE,MAAM,MAAM,CAAA;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAS7C,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAC5D,6BAAK,SAAS,EAAC,oBAAoB;IACjC,oBAAC,WAAW,IACV,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,EAAE,MAAM,EAAE,EACjD,QAAQ,EAAE,CAAC,CAAS,EAAE,EAAE;YACtB,YAAY,CAAC,CAAC,CAAC,CAAA;QACjB,CAAC,GACD;IACF,kCAAO,WAAW,CAAQ,CACtB,CACP,CAAA;AAED,MAAM,QAAQ,GAAqB,KAAK,CAAC,EAAE;IACzC,MAAM,EAAE,KAAK,GAAG,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAE9C,OAAO,CACL,6BAAK,SAAS,EAAC,OAAO;QACpB,mCAAQ,KAAK,CAAS;QACtB,6BAAK,SAAS,EAAC,OAAO;YACpB,oBAAC,IAAI,IACH,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,CAAC,EACR,YAAY,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC9B,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,GAAG,EAAE,KAAK,CAAC,CAAA;gBACxB,CAAC,GACD;YACF,oBAAC,IAAI,IACH,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,CAAC,EACR,YAAY,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC9B,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,GAAG,EAAE,KAAK,CAAC,CAAA;gBACxB,CAAC,GACD,CACE,CACF,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,QAAQ,CAAA"}

package/es/flowchart-editor-panel/control-map-service/components/fields/select.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IProps {
+    label?: string;
+    value?: string;
+    options?: {
+        label: string | number;
+        value: string | number;
+    }[];
+    width?: number | string;
+    onChange?: (value: string) => void;
+}
+declare const SelectField: React.FC<IProps>;
+export default SelectField;

package/es/flowchart-editor-panel/control-map-service/components/fields/select.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import { Select } from 'antd';
+import { FormItemHeight } from '../constants';
+const SelectField = props => {
+    const { label = '箭头', value, onChange, options = [], width } = props;
+    return (React.createElement("div", { className: "group" },
+        React.createElement("label", null, label),
+        React.createElement(Select, { size: "small", value: value, style: {
+                width,
+                height: FormItemHeight,
+            }, getPopupContainer: trigger => trigger.parentNode, optionFilterProp: "children", onChange: (v) => {
+                onChange === null || onChange === void 0 ? void 0 : onChange(v);
+            }, filterOption: (input, option) => {
+                const { label: text = '' } = option;
+                if (typeof text === 'string') {
+                    return text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+                }
+                return text.toString().indexOf(input.toLowerCase()) >= 0;
+            }, options: options })));
+};
+export default SelectField;
+//# sourceMappingURL=select.js.map

package/es/flowchart-editor-panel/control-map-service/components/fields/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../../src/flowchart-editor-panel/control-map-service/components/fields/select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,MAAM,CAAA;AAC7B,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAa7C,MAAM,WAAW,GAAqB,KAAK,CAAC,EAAE;IAC5C,MAAM,EAAE,KAAK,GAAG,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IACpE,OAAO,CACL,6BAAK,SAAS,EAAC,OAAO;QACpB,mCAAQ,KAAK,CAAS;QACtB,oBAAC,MAAM,IACL,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;gBACL,KAAK;gBACL,MAAM,EAAE,cAAc;aACvB,EACD,iBAAiB,EAAE,OAAO,CAAC,EAAE,CAAC,OAAO,CAAC,UAAU,EAChD,gBAAgB,EAAC,UAAU,EAC3B,QAAQ,EAAE,CAAC,CAAS,EAAE,EAAE;gBACtB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,CAAC,CAAC,CAAA;YACf,CAAC,EACD,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE;gBAC9B,MAAM,EAAE,KAAK,EAAE,IAAI,GAAG,EAAE,EAAE,GAAG,MAAM,CAAA;gBACnC,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;oBAC5B,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAA;iBAC5D;gBACD,OAAO,IAAI,CAAC,QAAQ,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAA;YAC1D,CAAC,EACD,OAAO,EAAE,OAAO,GAChB,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}

package/es/flowchart-editor-panel/control-map-service/components/fields/size.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface IProps {
+    width?: number;
+    height?: number;
+    label?: string;
+    onChange?: (key: string, value: number) => void;
+}
+declare const Size: React.FC<IProps>;
+export default Size;

package/es/flowchart-editor-panel/control-map-service/components/fields/size.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { Item } from './position';
+const Size = props => {
+    const { width, height, label = '尺寸', onChange } = props;
+    return (React.createElement("div", { className: "group" },
+        React.createElement("label", null, label),
+        React.createElement("div", { className: "split" },
+            React.createElement(Item, { addonBefore: "W", value: width, onChangeItem: (value) => {
+                    onChange === null || onChange === void 0 ? void 0 : onChange('width', value);
+                } }),
+            React.createElement(Item, { addonBefore: "H", value: height, onChangeItem: (value) => {
+                    onChange === null || onChange === void 0 ? void 0 : onChange('height', value);
+                } }))));
+};
+export default Size;
+//# sourceMappingURL=size.js.map

package/es/flowchart-editor-panel/control-map-service/components/fields/size.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"size.js","sourceRoot":"","sources":["../../../../../src/flowchart-editor-panel/control-map-service/components/fields/size.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AASjC,MAAM,IAAI,GAAqB,KAAK,CAAC,EAAE;IACrC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,GAAG,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAEvD,OAAO,CACL,6BAAK,SAAS,EAAC,OAAO;QACpB,mCAAQ,KAAK,CAAS;QACtB,6BAAK,SAAS,EAAC,OAAO;YACpB,oBAAC,IAAI,IACH,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC9B,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,OAAO,EAAE,KAAK,CAAC,CAAA;gBAC5B,CAAC,GACD;YACF,oBAAC,IAAI,IACH,WAAW,EAAC,GAAG,EACf,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,CAAC,KAAa,EAAE,EAAE;oBAC9B,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,QAAQ,EAAE,KAAK,CAAC,CAAA;gBAC7B,CAAC,GACD,CACE,CACF,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,IAAI,CAAA"}

package/es/flowchart-editor-panel/control-map-service/components/group.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const GroupService: React.FC<any>;

package/es/flowchart-editor-panel/control-map-service/components/group.js

@@ -0,0 +1,50 @@
+import React, { useState, useEffect } from 'react';
+import { DefaultNodeConfig } from '../../../flowchart-node-panel';
+import { FlowchartFormWrapper } from '../../form-wrapper';
+import { InputFiled, ColorPicker, Position, InputNumberFiled, Size } from './fields';
+import { PREFIX } from './constants';
+const GroupComponent = props => {
+    const { config, plugin = {} } = props;
+    const { updateGroup } = plugin;
+    const [groupConfig, setGroupConfig] = useState(Object.assign(Object.assign({}, DefaultNodeConfig), config));
+    const onGroupConfigChange = (key, value) => {
+        setGroupConfig(Object.assign(Object.assign({}, groupConfig), { [key]: value }));
+        updateGroup({
+            [key]: value,
+        });
+    };
+    useEffect(() => {
+        setGroupConfig(Object.assign(Object.assign({}, DefaultNodeConfig), config));
+    }, [config]);
+    return (React.createElement("div", { className: `${PREFIX}-panel-body` },
+        React.createElement("div", { className: `${PREFIX}-panel-group` },
+            React.createElement("h5", null, "\u5185\u5BB9"),
+            React.createElement(InputFiled, { label: "\u6807\u9898", value: groupConfig.label, onChange: value => {
+                    onGroupConfigChange('label', value);
+                } })),
+        React.createElement("div", { className: `${PREFIX}-panel-group` },
+            React.createElement("h5", null, "\u6837\u5F0F"),
+            React.createElement(Position, { x: groupConfig.x, y: groupConfig.y, onChange: (key, value) => {
+                    onGroupConfigChange(key, value);
+                } }),
+            React.createElement(Size, { width: groupConfig.width, height: groupConfig.height, onChange: (key, value) => {
+                    onGroupConfigChange(key, value);
+                } }),
+            React.createElement(ColorPicker, { label: "\u586B\u5145", value: groupConfig.fill, onChange: (value) => {
+                    onGroupConfigChange('fill', value);
+                } }),
+            React.createElement(ColorPicker, { label: "\u8FB9\u6846", value: groupConfig.stroke, onChange: (value) => {
+                    onGroupConfigChange('stroke', value);
+                } }),
+            React.createElement("div", { className: `${PREFIX}-node-text-style` },
+                React.createElement(InputNumberFiled, { label: "\u5B57\u53F7", value: groupConfig.fontSize, width: 68, onChange: value => {
+                        onGroupConfigChange('fontSize', value);
+                    } }),
+                React.createElement(ColorPicker, { value: groupConfig.fontFill, onChange: (value) => {
+                        onGroupConfigChange('fontFill', value);
+                    } })))));
+};
+export const GroupService = props => {
+    return (React.createElement(FlowchartFormWrapper, Object.assign({}, props), (config, plugin) => React.createElement(GroupComponent, Object.assign({}, props, { plugin: plugin, config: config }))));
+};
+//# sourceMappingURL=group.js.map

package/es/flowchart-editor-panel/control-map-service/components/group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"group.js","sourceRoot":"","sources":["../../../../src/flowchart-editor-panel/control-map-service/components/group.tsx"],"names":[],"mappings":"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"}

package/es/flowchart-editor-panel/control-map-service/components/node.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export interface IConfig {
+    x?: number;
+    y?: number;
+    width?: number;
+    height?: number;
+    label?: string;
+    stroke?: string;
+    fill?: string;
+    fontSize?: number;
+    fontFill?: string;
+}
+export declare const NodeService: React.FC<any>;

package/es/flowchart-editor-panel/control-map-service/components/node.js

@@ -0,0 +1,50 @@
+import React, { useState, useEffect } from 'react';
+import { DefaultNodeConfig } from '../../../flowchart-node-panel';
+import { FlowchartFormWrapper } from '../../form-wrapper';
+import { InputFiled, ColorPicker, Position, InputNumberFiled, Size } from './fields';
+import { PREFIX } from './constants';
+const NodeComponent = props => {
+    const { config, plugin = {} } = props;
+    const { updateNode } = plugin;
+    const [nodeConfig, setNodeConfig] = useState(Object.assign(Object.assign({}, DefaultNodeConfig), config));
+    const onNodeConfigChange = (key, value) => {
+        setNodeConfig(Object.assign(Object.assign({}, nodeConfig), { [key]: value }));
+        updateNode({
+            [key]: value,
+        });
+    };
+    useEffect(() => {
+        setNodeConfig(Object.assign(Object.assign({}, DefaultNodeConfig), config));
+    }, [config]);
+    return (React.createElement("div", { className: `${PREFIX}-panel-body` },
+        React.createElement("div", { className: `${PREFIX}-panel-group` },
+            React.createElement("h5", null, "\u5185\u5BB9"),
+            React.createElement(InputFiled, { label: "\u6807\u9898", value: nodeConfig.label, onChange: value => {
+                    onNodeConfigChange('label', value);
+                } })),
+        React.createElement("div", { className: `${PREFIX}-panel-group` },
+            React.createElement("h5", null, "\u6837\u5F0F"),
+            React.createElement(Position, { x: nodeConfig.x, y: nodeConfig.y, onChange: (key, value) => {
+                    onNodeConfigChange(key, value);
+                } }),
+            React.createElement(Size, { width: nodeConfig.width, height: nodeConfig.height, onChange: (key, value) => {
+                    onNodeConfigChange(key, value);
+                } }),
+            React.createElement(ColorPicker, { label: "\u586B\u5145", value: nodeConfig.fill, onChange: (value) => {
+                    onNodeConfigChange('fill', value);
+                } }),
+            React.createElement(ColorPicker, { label: "\u8FB9\u6846", value: nodeConfig.stroke, onChange: (value) => {
+                    onNodeConfigChange('stroke', value);
+                } }),
+            React.createElement("div", { className: `${PREFIX}-node-text-style` },
+                React.createElement(InputNumberFiled, { label: "\u5B57\u53F7", value: nodeConfig.fontSize, width: 68, onChange: value => {
+                        onNodeConfigChange('fontSize', value);
+                    } }),
+                React.createElement(ColorPicker, { value: nodeConfig.fontFill, onChange: (value) => {
+                        onNodeConfigChange('fontFill', value);
+                    } })))));
+};
+export const NodeService = props => {
+    return (React.createElement(FlowchartFormWrapper, Object.assign({}, props), (config, plugin) => React.createElement(NodeComponent, Object.assign({}, props, { plugin: plugin, config: config }))));
+};
+//# sourceMappingURL=node.js.map

package/es/flowchart-editor-panel/control-map-service/components/node.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"node.js","sourceRoot":"","sources":["../../../../src/flowchart-editor-panel/control-map-service/components/node.tsx"],"names":[],"mappings":"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"}