Class ReactPart

packages/dockview-react/src/react.ts:75–167

export const ReactPartContext = React.createContext<{}>({});

export class ReactPart<
    P extends object,
    C extends object = {},
> implements IFrameworkPart {
    private _initialProps: Parameters = {};
    private componentInstance?: IPanelWrapperRef;
    private ref?: {
        portal: React.ReactPortal;
        disposable: DockviewIDisposable;
    };
    private disposed = false;

    constructor(
        private readonly parent: HTMLElement,
        private readonly portalStore: ReactPortalStore,
        private readonly component: React.FunctionComponent<P>,
        private readonly parameters: P,
        private readonly context?: C
    ) {
        this.createPortal();
    }

    public update(props: { [index: string]: any }) {
        if (this.disposed) {
            throw new Error('invalid operation: resource is already disposed');
        }

        if (!this.componentInstance) {
            // if the component is yet to be mounted store the props
            this._initialProps = { ...this._initialProps, ...props };
        } else {
            this.componentInstance.update(props);
        }
    }

    private createPortal() {
        if (this.disposed) {
            throw new Error('invalid operation: resource is already disposed');
        }

        if (!isReactComponent(this.component)) {
            /**
             * we know this isn't a React.FunctionComponent so throw an error here.
             * if we do not intercept then React library will throw a very obsure error
             * for the same reason... at least at this point we will emit a sensible stacktrace.
             */
            throw new Error(
                'Dockview: Only React.memo(...), React.ForwardRef(...) and functional components are accepted as components'
            );
        }

        const bridgeComponent = React.createElement(
            React.forwardRef(ReactComponentBridge),
            {
                component: this
                    .component as unknown as React.FunctionComponent<{}>,
                componentProps: this.parameters as unknown as {},
                ref: (element: IPanelWrapperRef) => {