vxe-design/es/flow-design/src/flow-design.js

A PC-based visual designer based on Vxe UI, used for building zero-code and low-code platforms

import { ref, h, reactive } from 'vue';
import { defineVxeComponent } from '../../ui/src/comp';
import XEUtils from 'xe-utils';
export default defineVxeComponent({
    name: 'VxeFlowDesign',
    props: {},
    emits: [],
    setup(props, context) {
        const { slots } = context;
        const xID = XEUtils.uniqueId();
        const refElem = ref();
        const reactData = reactive({});
        const refMaps = {
            refElem
        };
        const computeMaps = {};
        const $xeFlowDesign = {
            xID,
            props,
            context,
            reactData,
            getRefMaps: () => refMaps,
            getComputeMaps: () => computeMaps
        };
        const renderVN = () => {
            const defaultSlot = slots.default;
            return h('div', {
                ref: refElem,
                class: ['vxe-flow-design']
            }, defaultSlot ? defaultSlot({}) : []);
        };
        $xeFlowDesign.renderVN = renderVN;
        return $xeFlowDesign;
    },
    render() {
        return this.renderVN();
    }
});