wix-style-react
Version:
wix-style-react
38 lines • 1.83 kB
JavaScript
import React, { forwardRef, isValidElement } from 'react';
import PropTypes from 'prop-types';
import Text from '../Text';
import { st, classes } from './SectionHeader.st.css';
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,
}) },
React.createElement("div", { className: st(classes.title, { align }), "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: classes.suffix, "data-hook": "suffix-node" }, suffix))));
});
SectionHeader.displayName = 'SectionHeader';
SectionHeader.propTypes = {
// @ts-ignore
title: PropTypes.node.isRequired,
// @ts-ignore
suffix: PropTypes.element,
dataHook: PropTypes.string,
skin: PropTypes.oneOf(['standard', 'neutral']),
as: PropTypes.oneOf(['span', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6']),
id: PropTypes.string,
'aria-describedby': PropTypes.string,
size: PropTypes.oneOf(['small', 'medium']),
align: PropTypes.oneOf(['start', 'center']),
divider: PropTypes.oneOf(['default', 'top', 'bottom', 'none']),
horizontalPadding: PropTypes.oneOf([
'large',
'medium',
'small',
'tiny',
'xTiny',
'xxTiny',
]),
};
export default SectionHeader;
//# sourceMappingURL=SectionHeader.js.map