Function createRoot

src/core/createRoot.tsx:17–135

(
    /** @description The DOM node which will serve as the root for this tree. */
    target: HTMLElement | HTMLCanvasElement,

    /** @description Options to configure the tree. */
    options: CreateRootOptions = {},
)

/** Creates a new root for a Pixi React app. */
export function createRoot(
    /** @description The DOM node which will serve as the root for this tree. */
    target: HTMLElement | HTMLCanvasElement,

    /** @description Options to configure the tree. */
    options: CreateRootOptions = {},
)
{
    // Check against mistaken use of createRoot
    let root = roots.get(target);
    let applicationState = (root?.applicationState ?? {
        isInitialised: false,
        isInitialising: false,
    }) as ApplicationState;

    const internalState = root?.internalState ?? {} as InternalState;

    if (root)
    {
        log('warn', 'createRoot should only be called once!');
    }
    else
    {
        applicationState.app = new Application();
        internalState.rootContainer = prepareInstance(applicationState.app.stage) as HostConfig['containerInstance'];
    }

    const fiber = root?.fiber ?? (reconciler as any).createContainer(
        internalState.rootContainer, // container
        ConcurrentRoot, // tag
        null, // hydration callbacks
        false, // isStrictMode
        null, // concurrentUpdatesByDefaultOverride
        '', // identifierPrefix
        console.error, // onUncaughtError
        console.error, // onCaughtError
        console.error, // onRecoverableError
        null, // transitionCallbacks
    );

    if (!root)
    {
        let canvas;

        if (target instanceof HTMLCanvasElement)
        {
            canvas = target;
        }

        if (!canvas)
        {
            canvas = document.createElement('canvas');
            target.innerHTML = '';
            target.appendChild(canvas);
        }

        internalState.canvas = canvas;