shelving/ui/block/Title.js

Toolkit for using data in JavaScript.

import { jsx as _jsx } from "react/jsx-runtime";
import { getAlignClass } from "../style/Align.js";
import { getColorClass } from "../style/Color.js";
import { getSpacingClass } from "../style/Spacing.js";
import { getTypographyClass } from "../style/Typography.js";
import { getClass, getModuleClass } from "../util/css.js";
import styles from "./Title.module.css";
/**
 * Page title — renders an `<h1>`.
 * - The most prominent heading on a page; there should normally be exactly one.
 */
export function Title({ level = "1", children, ...variants }) {
    const Element = `h${level}`;
    return (_jsx(Element, { className: getClass(getModuleClass(styles, "title"), getColorClass(variants), getAlignClass(variants), getSpacingClass(variants), getTypographyClass(variants)), children: children }));
}