@lunit/oui
Version:
Lunit Oncology UI components
34 lines (33 loc) • 2.73 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { Box } from '@mui/material';
import { AnalysisBarSegmentContainer, AnalysisBarOuter, AxisLabels, GraphAxisLabel, GraphScoreIndicator, GraphSegment, } from './AnalysisBar.styled';
import { parseStringValToNumber } from './AnalysisBar.utils';
import HeatmapGraphSVG from './HeatmapGraphIcon/HeatmapGraphSVG';
const Segments = ({ segments, adjustForOnePercent }) => {
if (!segments) {
return null;
}
const combinedWidth = segments.length > 1 ? segments[0].width + segments[1].width : 0;
if (segments?.length === 1 && segments[0].color === 'jet') {
return (_jsx(Box, { sx: { width: '100%', height: '14px', transform: 'scaleY(0.8)' }, children: _jsx(HeatmapGraphSVG, {}) }));
}
return (_jsx(_Fragment, { children: segments?.map((segment, i) => {
if (segment.color === 'jet') {
return _jsx(HeatmapGraphSVG, { width: `${segment.width}%` });
}
return (_jsx(GraphSegment, { color: segment.color, hasAdjustedOnePercentSegment: adjustForOnePercent, isOnePercentSegment: segment.width <= 1, combinedWidth: combinedWidth, width: segment.width, isNextSegment: i === 1 }, i));
}) }));
};
const AnalysisBar = ({ componentType = 'analysisBar', expressionValue, caption, expressionLevels = [], expressionLabels = [], segments, isDimmed = false, }) => {
if (!componentType)
throw new Error("The 'componentType' prop is required.");
if (!expressionLevels.length)
throw new Error("The 'expressionLevels' prop must contain at least one item.");
const hasAdjustedOnePercentSegment = segments?.[0].width <= 1;
return (_jsxs(AnalysisBarOuter, { className: "analysis-bar", isDimmed: isDimmed, children: [_jsxs(AnalysisBarSegmentContainer, { children: [expressionValue && (_jsx(GraphScoreIndicator, { adjustForOnePercent: hasAdjustedOnePercentSegment, value: expressionValue, isJet: segments?.[0].color === 'jet' })), _jsx(Segments, { segments: segments, adjustForOnePercent: hasAdjustedOnePercentSegment })] }), (expressionLevels.length > 0 || caption) && (_jsxs(AxisLabels, { children: [expressionLevels.length > 0 &&
expressionLevels.map((val, i) => {
const adjustedForOnePercent = +val <= 1 && +val > 0;
return (_jsx(GraphAxisLabel, { label: expressionLabels[i] || val, adjustForOnePercent: adjustedForOnePercent, leftPos: parseStringValToNumber(val) }, i));
}), caption && (_jsx(GraphAxisLabel, { label: caption, adjustForOnePercent: hasAdjustedOnePercentSegment, leftPos: 50 }))] }))] }));
};
export default AnalysisBar;