terra-clinical-result
Version:
The Terra Clinical Result package is a collection of standardized views for presenting clinical results documented to a Patient's Medical Chart, such as Vital Signs, Laboratory Results, and Discretely Documented Values
233 lines (232 loc) • 12 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _bind = _interopRequireDefault(require("classnames/bind"));
var _terraThemeContext = _interopRequireDefault(require("terra-theme-context"));
var _IconModified = _interopRequireDefault(require("terra-icon/lib/icon/IconModified"));
var _IconComment = _interopRequireDefault(require("terra-icon/lib/icon/IconComment"));
var _IconDiamond = _interopRequireDefault(require("terra-icon/lib/icon/IconDiamond"));
var _terraVisuallyHiddenText = _interopRequireDefault(require("terra-visually-hidden-text"));
var _reactIntl = require("react-intl");
var _uuid = require("uuid");
var _observationPropTypes = _interopRequireDefault(require("./proptypes/observationPropTypes"));
var _ResultError = _interopRequireDefault(require("./common/other/_ResultError"));
var _KnownNoData = _interopRequireDefault(require("./common/other/_KnownNoData"));
var _BloodPressureDisplay = _interopRequireDefault(require("./_BloodPressureDisplay"));
var _utils = require("./common/utils");
var _ClinicalResultModule = _interopRequireDefault(require("./ClinicalResult.module.scss"));
var _excluded = ["id", "systolic", "diastolic", "hideUnit", "isTruncated", "hasResultError", "hasResultNoData", "isBloodPressureGrouped", "hideAccessoryDisplays", "intl"];
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var cx = _bind.default.bind(_ClinicalResultModule.default);
var propTypes = {
/**
* Blood Pressure grouped result id
*/
id: _propTypes.default.string,
/**
* Systolic Result for blood pressure.
*/
systolic: _observationPropTypes.default,
/**
* Diastolic Result for blood pressure.
*/
diastolic: _observationPropTypes.default,
/**
* Whether or not the unit of measure should be presented in a series of side-by-side columns of the same unit.
*/
hideUnit: _propTypes.default.bool,
/**
* Whether or not the text should be truncated in display. Restricts clinical result details each to one line.
*/
isTruncated: _propTypes.default.bool,
/**
* Whether or not there is a known error or problem when retrieving or assembling the clinical result data.
*/
hasResultError: _propTypes.default.bool,
/**
* Whether or not the result has a value for a specific datetime.
*/
hasResultNoData: _propTypes.default.bool,
/**
* Whether or not the result should be a group.
*/
isBloodPressureGrouped: _propTypes.default.bool,
/**
* @private
* Used by Flowsheet Result Cell to hide icons because it displays them in different positions.
*/
hideAccessoryDisplays: _propTypes.default.bool,
/**
* Internationalization object with translation APIs. Provided by `injectIntl`.
*/
intl: _propTypes.default.shape({
formatMessage: _propTypes.default.func
})
};
var defaultProps = {
hideUnit: false,
isTruncated: false,
hasResultError: false,
hasResultNoData: false,
isBloodPressureGrouped: false,
hideAccessoryDisplays: false
};
var createConceptDisplays = function createConceptDisplays(compareConceptDisplays) {
if (compareConceptDisplays.systolic && compareConceptDisplays.diastolic) {
if (compareConceptDisplays.systolic === compareConceptDisplays.diastolic) {
return /*#__PURE__*/_react.default.createElement("div", {
className: cx('concept-display')
}, compareConceptDisplays.originalSystolic);
}
return /*#__PURE__*/_react.default.createElement("div", {
className: cx('concept-display')
}, compareConceptDisplays.originalSystolic, ' / ', compareConceptDisplays.originalDiastolic);
}
if (compareConceptDisplays.systolic || compareConceptDisplays.diastolic) {
var conceptDisplayValue = compareConceptDisplays.originalSystolic || compareConceptDisplays.originalDiastolic;
return /*#__PURE__*/_react.default.createElement("div", {
className: cx('concept-display')
}, conceptDisplayValue);
}
return null;
};
var createDatetimeDisplays = function createDatetimeDisplays(compareDatetimeDisplays, idForDatetimeDisplays) {
if (compareDatetimeDisplays.systolic && compareDatetimeDisplays.diastolic) {
if (compareDatetimeDisplays.systolic === compareDatetimeDisplays.diastolic) {
return /*#__PURE__*/_react.default.createElement("div", {
className: cx('datetime-display'),
id: idForDatetimeDisplays
}, compareDatetimeDisplays.originalSystolic);
}
return /*#__PURE__*/_react.default.createElement("div", {
className: cx('datetime-display'),
id: idForDatetimeDisplays
}, compareDatetimeDisplays.originalSystolic, ' / ', compareDatetimeDisplays.originalDiastolic);
}
if (compareDatetimeDisplays.systolic || compareDatetimeDisplays.diastolic) {
var conceptDisplayValue1 = compareDatetimeDisplays.originalSystolic || compareDatetimeDisplays.originalDiastolic;
return /*#__PURE__*/_react.default.createElement("div", {
className: cx('datetime-display'),
id: idForDatetimeDisplays
}, conceptDisplayValue1);
}
return null;
};
var ClinicalResultBloodPressure = function ClinicalResultBloodPressure(props) {
var id = props.id,
systolic = props.systolic,
diastolic = props.diastolic,
hideUnit = props.hideUnit,
isTruncated = props.isTruncated,
hasResultError = props.hasResultError,
hasResultNoData = props.hasResultNoData,
isBloodPressureGrouped = props.isBloodPressureGrouped,
hideAccessoryDisplays = props.hideAccessoryDisplays,
intl = props.intl,
customProps = _objectWithoutProperties(props, _excluded);
var theme = _react.default.useContext(_terraThemeContext.default);
if (hasResultError) {
return /*#__PURE__*/_react.default.createElement(_ResultError.default, null);
}
if (hasResultNoData || !systolic && !diastolic) {
return /*#__PURE__*/_react.default.createElement(_KnownNoData.default, null);
}
var systolicResult = (0, _utils.sanitizeResult)(systolic);
var diastolicResult = (0, _utils.sanitizeResult)(diastolic);
var conceptDisplayElement = createConceptDisplays({
originalSystolic: systolicResult.conceptDisplay,
originalDiastolic: diastolicResult.conceptDisplay,
systolic: systolicResult.cleanedConceptDisplay,
diastolic: diastolicResult.cleanedConceptDisplay
});
var idForDatetimeDisplays = "".concat((0, _uuid.v4)(), "-datetimeDisplay");
var datetimeDisplayElement = createDatetimeDisplays({
originalSystolic: systolicResult.datetimeDisplay,
originalDiastolic: diastolicResult.datetimeDisplay,
systolic: systolicResult.cleanedDatetimeDisplay,
diastolic: diastolicResult.cleanedDatetimeDisplay
}, idForDatetimeDisplays);
var hasModifiedIcon = systolicResult.isModified || diastolicResult.isModified;
var hasCommentIcon = systolicResult.hasComment || diastolicResult.hasComment;
var hasUnverifiedIcon = systolicResult.isUnverified || diastolicResult.isUnverified;
var decoratedResultDisplay = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_BloodPressureDisplay.default, {
result: systolicResult,
hideUnit: hideUnit,
id: id,
type: "Systolic",
diastolicUnit: diastolicResult.cleanedUnit
}), /*#__PURE__*/_react.default.createElement("span", {
key: "Observation-Separator-".concat(systolic ? systolic.eventId : diastolic.eventId),
className: cx('result-display-separator')
}, "/"), /*#__PURE__*/_react.default.createElement(_BloodPressureDisplay.default, {
result: diastolicResult,
hideUnit: hideUnit,
id: id,
type: "Diastolic"
}));
var modifiedIconElement = hasModifiedIcon && !hasUnverifiedIcon ? /*#__PURE__*/_react.default.createElement(_IconModified.default, {
className: cx('icon-modified'),
a11yLabel: intl.formatMessage({
id: 'Terra.clinicalResult.resultModified'
}),
role: "img",
focusable: "true"
}) : null;
var commentIconElement = hasCommentIcon && !hasUnverifiedIcon ? /*#__PURE__*/_react.default.createElement(_IconComment.default, {
className: cx('icon-comment'),
a11yLabel: intl.formatMessage({
id: 'Terra.clinicalResult.resultComment'
}),
role: "img",
focusable: "true"
}) : null;
var unverifiedIconElement = hasUnverifiedIcon ? /*#__PURE__*/_react.default.createElement(_IconDiamond.default, {
className: cx('icon-unverified'),
a11yLabel: intl.formatMessage({
id: 'Terra.clinicalResult.resultUnverified'
}),
role: "img",
focusable: "true"
}) : null;
var iconGroupDisplayElement = null;
if (hasModifiedIcon || hasCommentIcon || hasUnverifiedIcon) {
iconGroupDisplayElement = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, modifiedIconElement, commentIconElement, unverifiedIconElement);
}
var decoratedResultClassnames = cx(['decorated-result-display', {
truncated: isTruncated
}, {
'status-in-error': systolicResult.statusInError || diastolicResult.statusInError
}]);
var idForHiddenText = isBloodPressureGrouped ? "".concat((0, _uuid.v4)(), "-hiddenText") : undefined;
var clinicalResultBloodPressureDisplay = /*#__PURE__*/_react.default.createElement("span", {
role: isBloodPressureGrouped ? 'group' : undefined,
"aria-labelledby": isBloodPressureGrouped ? "".concat(idForHiddenText, " ").concat(idForDatetimeDisplays) : undefined
}, /*#__PURE__*/_react.default.createElement("div", {
className: decoratedResultClassnames
}, /*#__PURE__*/_react.default.createElement("div", {
className: cx('result-display')
}, isBloodPressureGrouped && /*#__PURE__*/_react.default.createElement(_terraVisuallyHiddenText.default, {
id: idForHiddenText,
"aria-hidden": "true",
text: intl.formatMessage({
id: 'Terra.clinicalResult.bloodPressure'
})
}), decoratedResultDisplay, isTruncated ? null : !hideAccessoryDisplays && iconGroupDisplayElement), isTruncated ? !hideAccessoryDisplays && iconGroupDisplayElement : null), !hideAccessoryDisplays && conceptDisplayElement, !hideAccessoryDisplays && datetimeDisplayElement);
var clinicalResultClassnames = (0, _classnames.default)(cx('clinical-result', 'blood-pressure-result', {
truncated: isTruncated
}, theme.className), customProps.className);
return /*#__PURE__*/_react.default.createElement("div", _extends({}, customProps, {
className: clinicalResultClassnames
}), clinicalResultBloodPressureDisplay);
};
ClinicalResultBloodPressure.propTypes = propTypes;
ClinicalResultBloodPressure.defaultProps = defaultProps;
var _default = exports.default = (0, _reactIntl.injectIntl)(ClinicalResultBloodPressure);