budibase/packages/client/src/render/renderComponent.js

67 lines
1.6 KiB
JavaScript
Raw Normal View History

export const renderComponent = ({
componentConstructor, uiFunctions,
htmlElement, anchor, props,
initialProps, bb, document,
parentNode}) => {
const func = initialProps._id
? uiFunctions[initialProps._id]
: undefined;
const parentContext = (parentNode && parentNode.context) || {};
let renderedNodes = [];
const render = (context) => {
let componentContext = parentContext;
if(context) {
componentContext = {...componentContext};
componentContext.$parent = parentContext;
}
const thisNode = createTreeNode();
thisNode.context = componentContext;
thisNode.parentNode = parentNode;
thisNode.props = props;
parentNode.children.push(thisNode);
renderedNodes.push(thisNode);
initialProps._bb = bb(thisNode, props);
thisNode.component = new componentConstructor({
target: htmlElement,
props: initialProps,
hydrate:false,
anchor
});
thisNode.rootElement = htmlElement.children[
htmlElement.children.length - 1];
if (initialProps._id) {
thisNode.rootElement.classList.add(`pos-${initialProps._id}`)
}
}
if(func) {
func(render, parentContext);
} else {
render();
}
return renderedNodes;
}
export const createTreeNode = () => ({
context: {},
props: {},
rootElement: null,
parentNode: null,
children: [],
component: null,
unsubscribe: () => {}
});