import { cnb } from "cnbuilder";
import { bem } from "../utils/bem.js";
import { DISPLAY_NONE_CLASS } from "../utils/isElementVisible.js";
const styles = bem("rmd-dialog");
const containerStyles = bem("rmd-dialog-container");
/**
 * @since 6.0.0
 */ export function dialogContainer(options = {}) {
    const { className, centered, displayNone } = options;
    return cnb(containerStyles({
        centered
    }), displayNone && DISPLAY_NONE_CLASS, className);
}
/** @since 6.0.0 */ export function dialog(options = {}) {
    const { type = "centered", width, fixed = false, outline = type === "full-page", disableBoxShadow, className } = options;
    return cnb(styles({
        fixed,
        outline,
        centered: type === "centered",
        "full-page": type === "full-page",
        "no-box-shadow": type === "centered" && disableBoxShadow,
        "s-width": width === "small",
        "m-width": width === "medium",
        "l-width": width === "large",
        "xl-width": width === "extra-large"
    }), className);
}
/**
 * NOTE: The default `DialogHeader` component uses the `Box` component so the
 * `box` class name utility function or `Box` component will probably be
 * required if using this util
 *
 * @since 6.0.0
 */ export function dialogHeader(options = {}) {
    const { className } = options;
    return cnb(styles("header"), className);
}
/** @since 6.0.0 */ export function dialogContent(options = {}) {
    const { className, disablePadding = false } = options;
    return cnb(styles("content", {
        padded: !disablePadding
    }), className);
}
/** @since 6.0.0 */ export function dialogFooter(options = {}) {
    const { align = "end", className } = options;
    return cnb(styles("footer", {
        flex: align !== "none",
        "flex-v": align === "stacked-start" || align === "stacked-end",
        start: align === "start" || align === "stacked-start",
        between: align === "between",
        end: align === "end" || align === "stacked-end"
    }), className);
}
/** @since 4.0.0 */ export const DEFAULT_DIALOG_TIMEOUT = {
    enter: 200,
    exit: 150
};
/** @since 4.0.0 */ export const DEFAULT_DIALOG_CLASSNAMES = {
    appear: "rmd-dialog--enter",
    appearActive: "rmd-dialog--enter-active",
    enter: "rmd-dialog--enter",
    enterActive: "rmd-dialog--enter-active",
    exit: "rmd-dialog--exit",
    exitActive: "rmd-dialog--exit-active"
};

//# sourceMappingURL=styles.js.map