import { jsx as _jsx } from "react/jsx-runtime";
import { cnb } from "cnbuilder";
import { forwardRef } from "react";
import { cssUtils } from "../cssUtils.js";
import { bem } from "../utils/bem.js";
const labelStyles = bem("rmd-label");
/**
 * @since 6.0.0
 */ export function label(options) {
    const { className, gap = false, error = false, dense = false, active = false, stacked = false, reversed = false, disabled = false, floating = false, inactive = false, floatingActive = active } = options;
    let textColor;
    if (disabled) {
        textColor = "text-disabled";
    } else if (error) {
        textColor = "error";
    } else if (floating && inactive) {
        textColor = "text-secondary";
    }
    return cnb(labelStyles({
        gap,
        error,
        dense,
        active,
        disabled,
        floating,
        stacked: stacked && !reversed,
        reversed: !stacked && reversed,
        "stacked-reversed": stacked && reversed,
        "floating-dense": floating && dense,
        "floating-active": floating && floatingActive
    }), cssUtils({
        textColor
    }), className);
}
/**
 * **Server Component**
 *
 * Most of the form components already use this `Label` internally when a
 * `label` prop has been provided. You should generally use this component if
 * you need to separate the label from an existing form component or you need to
 * create a custom implementation of a form component.
 *
 * @since 6.0.0 Updated to be usable externally and combines the
 * floating label styles instead of having separate components.
 */ export const Label = /*#__PURE__*/ forwardRef(function Label(props, ref) {
    const { gap = false, error = false, dense = false, active = false, stacked = false, reversed = false, disabled = false, floating = false, inactive = false, floatingActive = active, className, children, ...remaining } = props;
    return /*#__PURE__*/ _jsx("label", {
        ref: ref,
        ...remaining,
        className: label({
            gap,
            error,
            dense,
            active,
            stacked,
            reversed,
            disabled,
            floating,
            floatingActive,
            inactive,
            className
        }),
        children: children
    });
});

//# sourceMappingURL=Label.js.map