@itwin/itwinui-react
Version:
A react component library for iTwinUI
68 lines (67 loc) • 2.14 kB
JavaScript
import * as React from 'react';
import cx from 'classnames';
import { SvgClose, mergeEventHandlers, Box } from '../../utils/index.js';
import { IconButton } from '../Buttons/IconButton.js';
import { useDialogContext } from './DialogContext.js';
import { useDialogMainContext } from './DialogMainContext.js';
import { DialogTitleBarTitle } from './DialogTitleBarTitle.js';
import { useDialogDragContext } from './DialogDragContext.js';
export const DialogTitleBar = Object.assign(
React.forwardRef((props, ref) => {
let dialogContext = useDialogContext();
let dialogMainContext = useDialogMainContext();
let {
children,
titleText,
isDismissible = dialogContext?.isDismissible,
onClose = dialogContext?.onClose,
isDraggable = dialogContext?.isDraggable,
className,
onPointerDown: onPointerDownProp,
...rest
} = props;
let { onPointerDown } = useDialogDragContext();
let onClick = React.useCallback(
(e) => {
dialogMainContext?.beforeClose();
onClose?.(e);
},
[dialogMainContext, onClose],
);
return React.createElement(
Box,
{
className: cx('iui-dialog-title-bar', className, {
'iui-dialog-title-bar-filled': isDraggable,
}),
ref: ref,
onPointerDown: mergeEventHandlers(onPointerDownProp, onPointerDown),
...rest,
},
children
? children
: React.createElement(
React.Fragment,
null,
React.createElement(DialogTitleBarTitle, null, titleText),
isDismissible &&
React.createElement(
IconButton,
{
size: 'small',
styleType: 'borderless',
onClick: onClick,
'aria-label': 'Close',
'data-iui-shift': 'right',
},
React.createElement(SvgClose, null),
),
),
);
}),
{
Title: DialogTitleBarTitle,
},
);
if ('development' === process.env.NODE_ENV)
DialogTitleBar.displayName = 'Dialog.TitleBar';