@servicetitan/assist-ui/lib/components/header/header.js

ServiceTitan Assist UI Components

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { observer } from 'mobx-react';
import { Button, Flex, Text, Icon } from '@servicetitan/anvil2';
import IconTitanIntelligence from '@servicetitan/anvil2/assets/icons/st/titan_intelligence.svg';
import IconClose from '@servicetitan/anvil2/assets/icons/material/round/close.svg';
import IconDragIndicator from '@servicetitan/anvil2/assets/icons/material/round/drag_indicator.svg';
import IconArrowBackIos from '@servicetitan/anvil2/assets/icons/material/round/arrow_back_ios.svg';
import * as styles from './header.module.less';
import classNames from 'classnames';
export const Header = observer(({ title = 'Assist', onMouseDown, isDraggable, isDragging, onClose, onBack, className = '', }) => {
    return (_jsxs(Flex, { className: classNames(styles.chatHeader, className), children: [_jsxs(Flex, { className: "m-inline-end-1", children: [isDraggable && (_jsx(Flex, { alignSelf: "center", style: { cursor: isDragging ? 'grabbing' : 'grab' }, onMouseDown: onMouseDown !== null && onMouseDown !== void 0 ? onMouseDown : undefined, className: "cursor-grab", children: _jsx(Icon, { svg: IconDragIndicator, size: "large", inherit: true }) })), onBack ? (_jsx(Button, { appearance: "ghost", size: "small", icon: IconArrowBackIos, onClick: onBack })) : (_jsx(Icon, { size: "large", svg: IconTitanIntelligence, color: "var(--color-blue-500)" }))] }), _jsx(Flex, { grow: 1, children: _jsx(Text, { children: title }) }), _jsx(Flex, { children: onClose && (_jsx(Button, { appearance: "ghost", size: "small", icon: IconClose, "aria-label": "close", onClick: onClose })) })] }));
});
//# sourceMappingURL=header.js.map