import { cnb } from "cnbuilder";
import { box } from "../box/styles.js";
import { cssUtils } from "../cssUtils.js";
import { bem } from "../utils/bem.js";
const styles = bem("rmd-app-bar");
const titleStyles = bem("rmd-app-bar-title");
/**
 * Apply the `className`s for a tree component. This will be type-safe if using
 * typescript.
 *
 * @since 6.0.0
 */ export function appBar(options = {}) {
    const { className, theme = "primary", stacked, height = stacked ? "auto" : "normal", position = "static", pagePosition = "top", scrollbarOffset = position === "fixed", align, grid, gridColumns, gridName, justify, reversed, surfaceColor, disableWrap = true, disablePadding, disableElevation } = options;
    const surface = theme === "surface";
    const clear = theme === "clear";
    return cnb(styles({
        surface,
        [height]: height !== "normal",
        fixed: position !== "static",
        stacked,
        sticky: position === "sticky",
        [pagePosition]: position !== "static",
        elevated: position !== "static" && !disableElevation,
        "scrollbar-offset": scrollbarOffset,
        "static-scrollbar-offset": position === "static" && scrollbarOffset
    }), box({
        align,
        stacked,
        fullWidth: true,
        grid,
        gridColumns,
        gridName,
        justify,
        reversed,
        disableWrap,
        disablePadding
    }), cssUtils({
        backgroundColor: !surface && !clear ? theme : undefined,
        surfaceColor
    }), className);
}
/**
 * Apply the `className`s for a `AppBarTitle` component. This will be type-safe
 * if using typescript.
 *
 * @since 6.0.0
 */ export function appBarTitle(options = {}) {
    const { className, keyline = "small" } = options;
    return cnb(titleStyles({
        keyline: keyline === "list",
        "nav-keyline": keyline === "nav"
    }), className);
}

//# sourceMappingURL=styles.js.map