@carbon/ibm-security
Version:
Carbon for Cloud & Cognitive IBM Security UI components
64 lines (62 loc) • 3.51 kB
JavaScript
import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["children", "element", "subsection", "title", "label", "labelDirection"];
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
/**
* @file Title bar module.
* @copyright IBM Security 2020 - 2021
*/
import classnames from 'classnames';
import PropTypes from 'prop-types';
import React, { createElement } from 'react';
import LayoutModule, { getLayoutModuleProps, layoutModuleNamespace } from '../LayoutModule';
var namespace = 'title-bar';
/**
* Title bar modules provide interchangeable and reliable headings for establishing consistent hierarchies.
*/
var TitleBarModule = function TitleBarModule(_ref) {
var children = _ref.children,
element = _ref.element,
subsection = _ref.subsection,
title = _ref.title,
label = _ref.label,
labelDirection = _ref.labelDirection,
other = _objectWithoutProperties(_ref, _excluded);
return /*#__PURE__*/React.createElement(LayoutModule, _extends({
className: classnames(_defineProperty(_defineProperty({}, "".concat(layoutModuleNamespace, "--").concat(namespace, "--subsection"), subsection), "".concat(layoutModuleNamespace, "--").concat(namespace, "--label"), label)),
namespace: namespace
}, other), /*#__PURE__*/React.createElement("div", {
className: "".concat(layoutModuleNamespace, "--").concat(namespace, "__label-wrapper")
}, label && /*#__PURE__*/React.createElement(LayoutModule, {
namespace: "".concat(namespace, "__label order--").concat(labelDirection)
}, label), /*#__PURE__*/createElement(element, _objectSpread({}, getLayoutModuleProps({
namespace: "".concat(namespace, "__title")
})), title)), children && /*#__PURE__*/React.createElement(LayoutModule, {
className: classnames(_defineProperty({}, "".concat(layoutModuleNamespace, "--").concat(namespace, "__items--subsection"), subsection)),
namespace: "".concat(namespace, "__items")
}, children));
};
TitleBarModule.propTypes = {
/** Provide the items for the `TitleBarModule` */
children: PropTypes.node,
/** Specify the base element to use to build the title */
element: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']),
/** Provide the label for the `TitleBarModule` */
label: PropTypes.string,
/** Provide the labels direction for the `TitleBarModule` */
labelDirection: PropTypes.oneOf(['top', 'bottom']),
/** Specify whether a subsection should be used */
subsection: PropTypes.bool,
/** Provide the title of the `TitleBarModule` */
title: PropTypes.node.isRequired
};
TitleBarModule.defaultProps = {
children: null,
subsection: false,
element: 'h2',
label: null,
labelDirection: 'top'
};
export default TitleBarModule;