import { mergeProps, splitProps, useContext } from "solid-js";
import classNames from "./classnames";
import { useBootstrapPrefix } from "./ThemeProvider";
import PopoverHeader from "./PopoverHeader";
import PopoverBody from "./PopoverBody";
import OverlayContext from "./OverlayContext";
const defaultProps = {
    arrowProps: {},
    placement: "right",
};
const Popover = (p) => {
    const [local, props] = splitProps(mergeProps(defaultProps, p), [
        "bsPrefix",
        "placement",
        "className",
        "style",
        "children",
        "body",
        "arrowProps",
        "popper",
        "show",
    ]);
    const decoratedBsPrefix = useBootstrapPrefix(local.bsPrefix, "popover");
    const [primaryPlacement] = local.placement?.split("-") || [];
    const context = useContext(OverlayContext);
    return (<div role="tooltip" x-placement={primaryPlacement} className={classNames(local.className, decoratedBsPrefix, primaryPlacement && `bs-popover-auto`)} {...props} {...context?.wrapperProps} style={Object.assign({}, local.style, context?.wrapperProps.style)}>
      <div className="popover-arrow" {...local.arrowProps} {...context?.arrowProps}/>
      {local.body ? <PopoverBody>{local.children}</PopoverBody> : local.children}
    </div>);
};
export default Object.assign(Popover, {
    Header: PopoverHeader,
    Body: PopoverBody,
});