UNPKG

2.8 kBJavaScriptView Raw
1import { __rest } from "tslib";
2import * as React from 'react';
3import modalStyles from '@patternfly/react-styles/css/components/ModalBox/modal-box';
4import { css } from '@patternfly/react-styles';
5import accessibleStyles from '@patternfly/react-styles/css/utilities/Accessibility/accessibility';
6import { capitalize } from '../../helpers';
7import { Tooltip } from '../Tooltip';
8import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
9import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
10import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
11import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
12import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
13import { useIsomorphicLayoutEffect } from '../../helpers';
14export const isVariantIcon = (icon) => ['success', 'danger', 'warning', 'info', 'default'].includes(icon);
15export const ModalBoxTitle = (_a) => {
16 var { className = '', id, title, titleIconVariant, titleLabel = '' } = _a, props = __rest(_a, ["className", "id", "title", "titleIconVariant", "titleLabel"]);
17 const [isTooltipVisible, setIsTooltipVisible] = React.useState(false);
18 const h1 = React.useRef();
19 const label = titleLabel || (isVariantIcon(titleIconVariant) ? `${capitalize(titleIconVariant)} alert:` : titleLabel);
20 const variantIcons = {
21 success: React.createElement(CheckCircleIcon, null),
22 danger: React.createElement(ExclamationCircleIcon, null),
23 warning: React.createElement(ExclamationTriangleIcon, null),
24 info: React.createElement(InfoCircleIcon, null),
25 default: React.createElement(BellIcon, null)
26 };
27 const CustomIcon = !isVariantIcon(titleIconVariant) && titleIconVariant;
28 useIsomorphicLayoutEffect(() => {
29 setIsTooltipVisible(h1.current && h1.current.offsetWidth < h1.current.scrollWidth);
30 }, []);
31 const content = (React.createElement("h1", Object.assign({ id: id, ref: h1, className: css(modalStyles.modalBoxTitle, titleIconVariant && modalStyles.modifiers.icon, className) }, props),
32 titleIconVariant && (React.createElement("span", { className: css(modalStyles.modalBoxTitleIcon) }, isVariantIcon(titleIconVariant) ? variantIcons[titleIconVariant] : React.createElement(CustomIcon, null))),
33 label && React.createElement("span", { className: css(accessibleStyles.screenReader) }, label),
34 React.createElement("span", { className: css(modalStyles.modalBoxTitleText) }, title)));
35 return isTooltipVisible ? (React.createElement(Tooltip, { content: title, isVisible: true }, content)) : (content);
36};
37ModalBoxTitle.displayName = 'ModalBoxTitle';
38//# sourceMappingURL=ModalBoxTitle.js.map
\No newline at end of file