import { batch, children, createSignal, mergeProps, splitProps } from "solid-js";
import { Overlay as BaseOverlay, } from "solid-bootstrap-core";
import Fade from "./Fade";
import OverlayContext from "./OverlayContext";
const defaultProps = {
    transition: Fade,
    rootClose: false,
    show: false,
    placement: "top",
    popperConfig: {},
};
const Overlay = (p /*outerRef*/) => {
    const [local, outerProps] = splitProps(mergeProps(defaultProps, p), [
        "children" /*overlay*/,
        "transition",
        "popperConfig",
        "ref",
    ]);
    const actualTransition = local.transition === true ? Fade : local.transition || undefined;
    const [wrapperProps, setWrapperProps] = createSignal();
    const [arrowProps, setArrowProps] = createSignal();
    const [metadata, setMetadata] = createSignal();
    const overlayContext = {
        get wrapperProps() {
            return wrapperProps()?.();
        },
        get arrowProps() {
            return arrowProps()?.();
        },
        get metadata() {
            return metadata()?.();
        },
    };
    return (<OverlayContext.Provider value={overlayContext}>
      <BaseOverlay {...outerProps} popperConfig={local.popperConfig} transition={actualTransition}>
        {(wrapperProps, arrowProps, metadata) => {
            batch(() => {
                setWrapperProps(() => wrapperProps);
                setArrowProps(() => arrowProps);
                setMetadata(() => metadata);
            });
            const resolvedChildren = children(() => local.children);
            let el = resolvedChildren();
            while (typeof el === "function")
                el = el();
            return el;
        }}
      </BaseOverlay>
    </OverlayContext.Provider>);
};
export default Overlay;