@visactor/react-vtable/es/table-components/base-component.js

The react version of VTable

import React, { useContext, useEffect } from "react";

import { pickWithout } from "@visactor/vutils";

import RootTableContext from "../context/table";

import { bindEventsToTable } from "../eventsUtils";

import { CustomLayout } from "./custom/custom-layout";

export const createComponent = (componentName, optionName, supportedEvents, isSingle) => {
    const ignoreKeys = [ "id", "updateId", "componentIndex", "children" ], notOptionKeys = supportedEvents ? Object.keys(supportedEvents).concat(ignoreKeys) : ignoreKeys, Comp = props => {
        const context = useContext(RootTableContext), eventsBinded = React.useRef(null), updateId = React.useRef(props.updateId);
        if (props.updateId !== updateId.current) {
            updateId.current = props.updateId;
            !!supportedEvents && bindEventsToTable(context.table, props, eventsBinded.current, supportedEvents) && (eventsBinded.current = props);
        }
        return useEffect((() => () => {
            supportedEvents && bindEventsToTable(context.table, null, eventsBinded.current, supportedEvents);
        }), []), parseCustomChildren(props.children, props.componentId);
    };
    return Comp.displayName = componentName, Comp.parseOption = props => {
        const newComponentOption = pickWithout(props, notOptionKeys);
        if (props.children) {
            const {children: children} = props;
            React.Children.map(children, ((child, index) => {
                parseChild(child, props, newComponentOption, notOptionKeys, props.componentId + "-" + index);
            }));
        }
        return {
            option: newComponentOption,
            optionName: optionName,
            isSingle: isSingle
        };
    }, Comp;
};

function parseChild(child, componentProps, newComponentOption, notOptionKeys, componentId) {
    if ("custom-layout" === child.props.role && (newComponentOption.customLayout = "react-custom-layout", 
    newComponentOption.customLayoutComponentId = componentId), "header-custom-layout" === child.props.role && (newComponentOption.headerCustomLayout = "react-custom-layout", 
    newComponentOption.headerCustomLayoutComponentId = componentId), "ListColumn" === child.type.displayName) {
        newComponentOption.columns || (newComponentOption.columns = []);
        const childOption = pickWithout(child.props, notOptionKeys);
        newComponentOption.columns.push(childOption), childOption.componentId = componentId, 
        child.props.children && React.Children.map(child.props.children, ((child, index) => {
            parseChild(child, componentProps, childOption, notOptionKeys, componentId + "-" + index);
        }));
    }
}

function parseCustomChildren(children, componentId) {
    return isReactElement(children) || Array.isArray(children) ? React.Children.map(children, ((child, index) => child.props.children ? parseCustomChildren(child.props.children, componentId + "-" + index) : "custom-layout" === child.props.role || "header-custom-layout" === child.props.role ? React.createElement(CustomLayout, {
        componentId: componentId
    }, child) : null)) : null;
}

function isReactElement(obj) {
    return obj && obj.$$typeof === Symbol.for("react.element");
}
//# sourceMappingURL=base-component.js.map