import React, { forwardRef, isValidElement } from 'react';
import Text from '../Text';
import { st, classes } from './SectionHeader.st.css.js';
const SectionHeader = forwardRef(({ dataHook, title, suffix, id, 'aria-describedby': ariaDescribedBy, as = 'span', skin = 'standard', size = 'medium', align = 'start', divider = 'default', horizontalPadding = 'large', }, ref) => {
    return (React.createElement("div", { ref: ref, "data-hook": dataHook, className: st(classes.root, {
            skin,
            horizontalPadding,
            divider,
            size,
        }) },
        React.createElement("div", { className: st(classes.title, { align, horizontalPadding }), "data-hook": "title-node" }, isValidElement(title) ? (title) : (React.createElement(Text, { id: id, className: classes.titleText, "aria-describedby": ariaDescribedBy, tagName: as, size: size, weight: "thin", flip: true, ellipsis: true }, title))),
        suffix && (React.createElement("div", { className: st(classes.suffix, { horizontalPadding }), "data-hook": "suffix-node" }, suffix))));
});
SectionHeader.displayName = 'SectionHeader';
export default SectionHeader;
//# sourceMappingURL=SectionHeader.js.map