azure-devops-ui
Version:
React components for building web UI in Azure DevOps
30 lines (29 loc) • 1.73 kB
JavaScript
import "../../CommonImports";
import "../../Core/core.css";
import "./Panel.css";
import * as React from "react";
import { PanelCloseButtonSize } from '../../Components/Panel/Panel.Props';
import * as Resources from '../../Resources.Layer';
import { Header, TitleSize } from '../../Header';
import { css } from '../../Util';
let closeButtonId = 1;
export const PanelHeader = props => {
const { backButtonProps, description, onDismiss, closeButtonSize, showCloseButton, showSeparator, titleProps = {} } = props;
if (props.children) {
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: css(props.className, "bolt-panel-header flex-noshrink flex-column scroll-hidden") }, props.children),
showSeparator && React.createElement("div", { className: "bolt-panel-separator flex-noshrink" })));
}
const commandBarItems = [];
if (showCloseButton !== false) {
commandBarItems.push({
ariaLabel: Resources.Close,
iconProps: { iconName: closeButtonSize === PanelCloseButtonSize.small ? "Cancel" : "Clear" },
id: `close-button-${closeButtonId++}`,
role: "button",
onActivate: onDismiss,
subtle: true
});
}
return (React.createElement(Header, { backButtonProps: backButtonProps, className: css(props.className, "bolt-panel-header"), commandBarItems: commandBarItems, description: description, separator: showSeparator, title: titleProps.text, titleClassName: titleProps.className, titleId: titleProps.id, titleSize: titleProps.size === undefined ? TitleSize.Large : titleProps.size, titleIconProps: titleProps.iconProps }));
};