@visactor/react-vrender/es/Stage.js

## Description

var __rest = this && this.__rest || function(s, e) {
    var t = {};
    for (var p in s) Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0 && (t[p] = s[p]);
    if (null != s && "function" == typeof Object.getOwnPropertySymbols) {
        var i = 0;
        for (p = Object.getOwnPropertySymbols(s); i < p.length; i++) e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]) && (t[p[i]] = s[p[i]]);
    }
    return t;
};

import { createStage } from "@visactor/vrender";

import { forwardRef, useLayoutEffect, useRef } from "react";

import React from "react";

import { reconcilor } from "./hostConfig";

import { assertRef } from "./util";

export const Stage = forwardRef(((props, ref) => {
    const {viewBox: viewBox, width: width, height: height, dpr: dpr, background: background, canvasControled: canvasControled, title: title, canvas: canvas, disableDirtyBounds: disableDirtyBounds, beforeRender: beforeRender, afterRender: afterRender, renderStyle: renderStyle, stage3dOptions: stage3dOptions, containerId: containerId, containerTitle: containerTitle, children: children} = props, others = __rest(props, [ "viewBox", "width", "height", "dpr", "background", "canvasControled", "title", "canvas", "disableDirtyBounds", "beforeRender", "afterRender", "renderStyle", "stage3dOptions", "containerId", "containerTitle", "children" ]);
    assertRef(ref);
    const fiberRoot = useRef(), divRef = useRef(null), innerStageRef = useRef(null), stageRef = ref || innerStageRef, initedRef = useRef(!1);
    return useLayoutEffect((() => {
        const stage = createStage({
            viewBox: viewBox,
            width: width,
            height: height,
            dpr: dpr,
            background: background,
            canvasControled: canvasControled,
            title: title,
            autoRender: !0,
            disableDirtyBounds: disableDirtyBounds,
            beforeRender: beforeRender,
            afterRender: afterRender,
            renderStyle: renderStyle,
            canvas: canvas,
            container: divRef.current
        });
        return stage3dOptions && stage.set3dOptions(stage3dOptions), stageRef.current = stage, 
        fiberRoot.current = reconcilor.createContainer(stage, 1, null, !1, !1, ""), () => {
            reconcilor.updateContainer(null, fiberRoot.current, null);
        };
    }), []), useLayoutEffect((() => {
        viewBox && stageRef.current && initedRef.current && stageRef.current.setViewBox(viewBox.x1, viewBox.y1, viewBox.x2 - viewBox.x1, viewBox.y2 - viewBox.y1, !1);
    }), [ stageRef, viewBox, initedRef ]), useLayoutEffect((() => {
        dpr && stageRef.current && initedRef.current && stageRef.current.setDpr(dpr);
    }), [ stageRef, dpr, initedRef ]), useLayoutEffect((() => {
        width > 0 && height > 0 && stageRef.current && initedRef.current && stageRef.current.resize(width, height);
    }), [ width, height, stageRef, initedRef ]), useLayoutEffect((() => {
        initedRef.current = !0, fiberRoot.current && reconcilor.updateContainer(children, fiberRoot.current, null);
    }), [ children ]), React.createElement("div", Object.assign({}, others, {
        id: containerId,
        title: containerTitle,
        ref: divRef
    }));
}));