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

The react version of VTable

"use strict";

var __createBinding = this && this.__createBinding || (Object.create ? function(o, m, k, k2) {
    void 0 === k2 && (k2 = k);
    var desc = Object.getOwnPropertyDescriptor(m, k);
    desc && !("get" in desc ? !m.__esModule : desc.writable || desc.configurable) || (desc = {
        enumerable: !0,
        get: function() {
            return m[k];
        }
    }), Object.defineProperty(o, k2, desc);
} : function(o, m, k, k2) {
    void 0 === k2 && (k2 = k), o[k2] = m[k];
}), __setModuleDefault = this && this.__setModuleDefault || (Object.create ? function(o, v) {
    Object.defineProperty(o, "default", {
        enumerable: !0,
        value: v
    });
} : function(o, v) {
    o.default = v;
}), __importStar = this && this.__importStar || function(mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (null != mod) for (var k in mod) "default" !== k && Object.prototype.hasOwnProperty.call(mod, k) && __createBinding(result, mod, k);
    return __setModuleDefault(result, mod), result;
}, __importDefault = this && this.__importDefault || function(mod) {
    return mod && mod.__esModule ? mod : {
        default: mod
    };
};

Object.defineProperty(exports, "__esModule", {
    value: !0
}), exports.createComponent = void 0;

const react_1 = __importStar(require("react")), vutils_1 = require("@visactor/vutils"), table_1 = __importDefault(require("../context/table")), eventsUtils_1 = require("../eventsUtils"), custom_layout_1 = require("./custom/custom-layout"), createComponent = (componentName, optionName, supportedEvents, isSingle) => {
    const ignoreKeys = [ "id", "updateId", "componentIndex", "children" ], notOptionKeys = supportedEvents ? Object.keys(supportedEvents).concat(ignoreKeys) : ignoreKeys, Comp = props => {
        const context = (0, react_1.useContext)(table_1.default), eventsBinded = react_1.default.useRef(null), updateId = react_1.default.useRef(props.updateId);
        if (props.updateId !== updateId.current) {
            updateId.current = props.updateId;
            !!supportedEvents && (0, eventsUtils_1.bindEventsToTable)(context.table, props, eventsBinded.current, supportedEvents) && (eventsBinded.current = props);
        }
        (0, react_1.useEffect)((() => () => {
            supportedEvents && (0, eventsUtils_1.bindEventsToTable)(context.table, null, eventsBinded.current, supportedEvents);
        }), []);
        return parseCustomChildren(props.children, props.componentId);
    };
    return Comp.displayName = componentName, Comp.parseOption = props => {
        const newComponentOption = (0, vutils_1.pickWithout)(props, notOptionKeys);
        if (props.children) {
            const {children: children} = props;
            react_1.default.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 = (0, vutils_1.pickWithout)(child.props, notOptionKeys);
        newComponentOption.columns.push(childOption), childOption.componentId = componentId, 
        child.props.children && react_1.default.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_1.default.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_1.default.createElement(custom_layout_1.CustomLayout, {
        componentId: componentId
    }, child) : null)) : null;
}

function isReactElement(obj) {
    if (!obj) return !1;
    const reactElement = Symbol.for("react.element"), reactTransitionalElement = Symbol.for("react.transitional.element");
    return obj.$$typeof === reactElement || obj.$$typeof === reactTransitionalElement;
}

//# sourceMappingURL=base-component.js.map
exports.createComponent = createComponent;