@atlaskit/page-header
Version:
A page header defines the top of a page. It contains a title and can be optionally combined with breadcrumbs buttons, search, and filters.
44 lines • 1.73 kB
JavaScript
// TODO: Remove this eslint-disable when prop names have been renamed.
// This rule is here as prop name changes are a major as they are used
// by our consumers. This can be done in the next lite-mode conversion.
/* eslint-disable @repo/internal/react/boolean-prop-naming-convention */
import React from 'react';
import ActionsWrapper from './actions-wrapper';
import BottomBar from './bottom-bar';
import OuterWrapper from './outer-wrapper';
import Title from './title';
import TitleContainer from './title-container';
import TitleWrapper from './title-wrapper';
/**
* __Page header__
*
* A page header defines the top of a page. It contains a title and can be optionally combined with
* breadcrumbs buttons, search, and filters.
*
* - [Examples](https://atlassian.design/components/page-header/examples)
* - [Code](https://atlassian.design/components/page-header/code)
* - [Usage](https://atlassian.design/components/page-header/usage)
*/
const PageHeader = ({
innerRef,
breadcrumbs,
actions,
bottomBar,
children,
id,
disableTitleStyles = false,
truncateTitle = false,
testId
}) => {
return /*#__PURE__*/React.createElement(OuterWrapper, null, breadcrumbs, /*#__PURE__*/React.createElement(TitleWrapper, {
truncateTitle: truncateTitle
}, /*#__PURE__*/React.createElement(TitleContainer, {
truncateTitle: truncateTitle
}, disableTitleStyles ? children : /*#__PURE__*/React.createElement(Title, {
ref: innerRef,
truncateTitle: truncateTitle,
id: id,
testId: testId
}, children)), actions && /*#__PURE__*/React.createElement(ActionsWrapper, null, actions)), bottomBar && /*#__PURE__*/React.createElement(BottomBar, null, " ", bottomBar, " "));
};
export default PageHeader;