import { mergeProps, splitProps } from "solid-js";
import classNames from "./classnames";
import { useBootstrapPrefix } from "./ThemeProvider";
import { Dynamic } from "solid-js/web";
const positionClasses = {
    "top-start": "top-0 start-0",
    "top-center": "top-0 start-50 translate-middle-x",
    "top-end": "top-0 end-0",
    "middle-start": "top-50 start-0 translate-middle-y",
    "middle-center": "top-50 start-50 translate-middle",
    "middle-end": "top-50 end-0 translate-middle-y",
    "bottom-start": "bottom-0 start-0",
    "bottom-center": "bottom-0 start-50 translate-middle-x",
    "bottom-end": "bottom-0 end-0",
};
const defaultProps = {
    as: "div",
};
const ToastContainer = (p) => {
    const [local, props] = splitProps(mergeProps(defaultProps, p), [
        "as",
        "bsPrefix",
        "position",
        "className",
    ]);
    const bsPrefix = useBootstrapPrefix(local.bsPrefix, "toast-container");
    return (<Dynamic component={local.as} {...props} className={classNames(bsPrefix, local.position && `position-absolute ${positionClasses[local.position]}`, local.className)}>
      {props.children}
    </Dynamic>);
};
export default ToastContainer;