wix-style-react
Version:
wix-style-react
32 lines • 1.93 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import { st, classes } from './Header.st.css';
import Heading from '../../Heading';
import Text from '../../Text';
import { DataHooks } from './hooks';
import { isString } from '../../utils/StringUtils';
class Header extends React.PureComponent {
render() {
const { dataHook, title, subtitle, suffix, className } = this.props;
return (React.createElement("div", { "data-hook": dataHook, className: st(classes.root, {}, className) },
React.createElement("div", { className: classes.titleWrapper },
isString(title) ? (React.createElement(Heading, { dataHook: DataHooks.title, size: "medium", children: title, className: classes.title })) : (React.createElement("span", { "data-hook": DataHooks.title }, title)),
subtitle && isString(subtitle) ? (React.createElement(Text, { dataHook: DataHooks.subtitle, children: subtitle, secondary: true })) : (React.createElement("span", { "data-hook": DataHooks.subtitle }, subtitle))),
suffix && (React.createElement("div", { "data-hook": DataHooks.suffix, className: classes.suffix, children: suffix }))));
}
}
Header.displayName = 'Card.Header';
Header.propTypes = {
/** Applies a data-hook HTML attribute to be used in the tests */
dataHook: PropTypes.string,
/** Sets card title text value. Title can also be overridden to any other component. */
title: PropTypes.node.isRequired,
/** Sets card subtitle text value. Subtitle can also be overridden to any other component. */
subtitle: PropTypes.node,
/** Adds an empty container on the right side of a header. Used to store action buttons or other components. */
suffix: PropTypes.node,
/** Specifies a CSS class name to be appended to the component’s root element. */
className: PropTypes.string,
};
export default Header;
//# sourceMappingURL=Header.js.map