How to use the @webiny/app-page-builder/editor/utils.createElement function in @webiny/app-page-builder

onReceived({ source, target, position = null }) {
            let dispatchNew = false;
            let element;
            if (source.path) {
                // $FlowFixMe
                element = cloneElement(source);
            } else {
                dispatchNew = true;
                element = createElement(source.type, {}, target);
            }

            let column;
            if (element.type !== "column") {
                column = createColumn({ elements: [element] });
            }

            // Add new child element
            let row = addElementToParent(column || element, target, position);

            // Recalculate column widths
            row = distributeColumnWidths(row);

            // Dispatch update action
            dispatch(updateElement({ element: row }));

const handleDroppedElement = (source, target, position) => {
    let dispatchNew = false;
    let element;
    
    if (source.path) {
        // $FlowFixMe
        element = cloneElement(source);
    } else {
        dispatchNew = true;
        element = createElement(source.type, {}, target);
    }
    
    target = addElementToParent(element, target, position);
    redux.store.dispatch(updateElement({ element: target }));

    if (source.path) {
        redux.store.dispatch(deleteElement({ element: source }));
    }

    if (dispatchNew) {
        redux.store.dispatch(elementCreated({ element, source }));
    }
};

onReceived({ source, target, position = null }) {
            let dispatchNew = false;
            let element;
            if (source.path) {
                // $FlowFixMe
                element = cloneElement(source);
            } else {
                dispatchNew = true;
                element = createElement(source.type, {}, target);
            }

            const block = addElementToParent(element, target, position);

            // Dispatch update action
            redux.store.dispatch(updateElement({ element: block }));

            // Delete exiting element
            if (source.path) {
                redux.store.dispatch(deleteElement({ element: source }));
            }

            if (dispatchNew) {
                redux.store.dispatch(elementCreated({ element, source }));
            }
        },

);
            }

            if (!get(data, "pageBuilder.page.data")) {
                return null;
            }

            if (!redux.store) {
                redux.initStore({}, { client });
            }

            if (!loading) {
                const { revisions, ...page } = data.pageBuilder.page.data;
                if (!page.content) {
                    page.content = createElement("document");
                }

                if (pageSet !== page.id) {
                    pageSet = page.id;
                    redux.store.dispatch({
                        type: SETUP_EDITOR,
                        payload: getEmptyData(page, revisions)
                    });
                    redux.store.dispatch({ type: "@@redux-undo/INIT" });
                }
            }

            return (