/*---------------------------------------------------------------------------------------------
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
/** @packageDocumentation
 * @module Widget
 */
import "./ContentRenderer.scss";
import * as React from "react";
import * as ReactDOM from "react-dom";
import { ToolSettingsNodeContext, WidgetContentNodeContext, } from "../base/NineZone";
import { useContainersStore, WidgetContentManagerContext, } from "./ContentManager";
import { useLayout } from "../base/LayoutStore";
/** @internal */
export function WidgetContentRenderers() {
    const widgetContent = React.useContext(WidgetContentNodeContext);
    const toolSettingsContent = React.useContext(ToolSettingsNodeContext);
    const tabIds = useLayout((state) => {
        return Object.keys(state.tabs);
    }, true);
    const toolSettingsTabId = useLayout((state) => state.toolSettings?.tabId);
    return (React.createElement(React.Fragment, null, tabIds.map((tabId) => {
        const children = tabId === toolSettingsTabId ? toolSettingsContent : widgetContent;
        return (React.createElement(WidgetContentRenderer, { key: tabId, tabId: tabId }, children));
    })));
}
/** @internal */
export function WidgetContentRenderer(props) {
    const renderTo = useContainersStore((state) => state.containers[props.tabId]);
    const unloaded = useLayout((state) => !!state.tabs[props.tabId].unloaded);
    const widgetContentManager = React.useContext(WidgetContentManagerContext);
    const container = React.useRef(undefined);
    if (!container.current) {
        container.current = document.createElement("div");
        container.current.classList.add("nz-widget-contentRenderer");
    }
    React.useLayoutEffect(() => {
        if (!widgetContentManager)
            return;
        const parent = renderTo;
        if (parent) {
            while (parent.firstChild) {
                parent.removeChild(parent.firstChild);
            }
            parent.appendChild(container.current);
            widgetContentManager.onRestoreTransientState.raiseEvent(props.tabId);
        }
        return () => {
            for (const child of parent?.children || []) {
                if (child === container.current) {
                    parent.removeChild(child);
                    return;
                }
            }
        };
    }, [renderTo, widgetContentManager, props.tabId]);
    return ReactDOM.createPortal(React.createElement("div", { style: { height: "100%", width: "100%" }, id: `content-container:${props.tabId}` },
        React.createElement(TabIdContext.Provider, { value: props.tabId }, unloaded ? null : props.children)), container.current);
}
/** @internal */
export const TabIdContext = React.createContext(undefined);
TabIdContext.displayName = "nz:TabIdContext";
/** @internal */
export function useTabTransientState(tabId, onSave, onRestore) {
    const widgetContentManager = React.useContext(WidgetContentManagerContext);
    React.useEffect(() => {
        if (!widgetContentManager)
            return;
        return widgetContentManager.onSaveTransientState.addListener((id) => {
            tabId === id && onSave && onSave();
        });
    }, [widgetContentManager, onSave, tabId]);
    React.useEffect(() => {
        if (!widgetContentManager)
            return;
        return widgetContentManager.onRestoreTransientState.addListener((id) => {
            tabId === id && onRestore && onRestore();
        });
    }, [widgetContentManager, onRestore, tabId]);
}
//# sourceMappingURL=ContentRenderer.js.map