fhir-ui
Version:
React components to display HL7 FHIR data using Material-UI
4,742 lines • 176 kB
JavaScript
import React, { useState, useEffect, Fragment as Fragment$1 } from 'react';
import { Paper, Grid, Card, TextField, Typography, TableHead, TableRow, TableCell, Checkbox, TableSortLabel, Toolbar, Tooltip, IconButton, Table, TableBody, TablePagination, Button, CardContent, FormGroup, FormControlLabel, FormControl, FormLabel, RadioGroup, Radio, CardActions } from '@material-ui/core';
import { makeStyles, lighten } from '@material-ui/core/styles';
import { KeyboardDatePicker } from '@material-ui/pickers';
import moment from 'moment';
import clsx from 'clsx';
import { Delete, Label } from '@material-ui/icons';
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
keys.push.apply(keys, symbols);
}
return keys;
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
if (i % 2) {
ownKeys(Object(source), true).forEach(function (key) {
_defineProperty(target, key, source[key]);
});
} else if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
} else {
ownKeys(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
}
return target;
}
function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
}
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArrayLimit(arr, i) {
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
var _arr = [];
var _n = true;
var _d = false;
var _e = undefined;
try {
for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
}
function _unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}
function _arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
return arr2;
}
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function createCommonjsModule(fn, module) {
return module = { exports: {} }, fn(module, module.exports), module.exports;
}
/** @license React v16.13.1
* react-is.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}var AsyncMode=l;var ConcurrentMode=m;var ContextConsumer=k;var ContextProvider=h;var Element=c;var ForwardRef=n;var Fragment=e;var Lazy=t;var Memo=r;var Portal=d;
var Profiler=g;var StrictMode=f;var Suspense=p;var isAsyncMode=function(a){return A(a)||z(a)===l};var isConcurrentMode=A;var isContextConsumer=function(a){return z(a)===k};var isContextProvider=function(a){return z(a)===h};var isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};var isForwardRef=function(a){return z(a)===n};var isFragment=function(a){return z(a)===e};var isLazy=function(a){return z(a)===t};
var isMemo=function(a){return z(a)===r};var isPortal=function(a){return z(a)===d};var isProfiler=function(a){return z(a)===g};var isStrictMode=function(a){return z(a)===f};var isSuspense=function(a){return z(a)===p};
var isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};var typeOf=z;
var reactIs_production_min = {
AsyncMode: AsyncMode,
ConcurrentMode: ConcurrentMode,
ContextConsumer: ContextConsumer,
ContextProvider: ContextProvider,
Element: Element,
ForwardRef: ForwardRef,
Fragment: Fragment,
Lazy: Lazy,
Memo: Memo,
Portal: Portal,
Profiler: Profiler,
StrictMode: StrictMode,
Suspense: Suspense,
isAsyncMode: isAsyncMode,
isConcurrentMode: isConcurrentMode,
isContextConsumer: isContextConsumer,
isContextProvider: isContextProvider,
isElement: isElement,
isForwardRef: isForwardRef,
isFragment: isFragment,
isLazy: isLazy,
isMemo: isMemo,
isPortal: isPortal,
isProfiler: isProfiler,
isStrictMode: isStrictMode,
isSuspense: isSuspense,
isValidElementType: isValidElementType,
typeOf: typeOf
};
var reactIs_development = createCommonjsModule(function (module, exports) {
if (process.env.NODE_ENV !== "production") {
(function() {
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
// nor polyfill, then a plain number is used for performance.
var hasSymbol = typeof Symbol === 'function' && Symbol.for;
var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
// (unstable) APIs that have been removed. Can we remove the symbols?
var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
function isValidElementType(type) {
return typeof type === 'string' || typeof type === 'function' || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
}
function typeOf(object) {
if (typeof object === 'object' && object !== null) {
var $$typeof = object.$$typeof;
switch ($$typeof) {
case REACT_ELEMENT_TYPE:
var type = object.type;
switch (type) {
case REACT_ASYNC_MODE_TYPE:
case REACT_CONCURRENT_MODE_TYPE:
case REACT_FRAGMENT_TYPE:
case REACT_PROFILER_TYPE:
case REACT_STRICT_MODE_TYPE:
case REACT_SUSPENSE_TYPE:
return type;
default:
var $$typeofType = type && type.$$typeof;
switch ($$typeofType) {
case REACT_CONTEXT_TYPE:
case REACT_FORWARD_REF_TYPE:
case REACT_LAZY_TYPE:
case REACT_MEMO_TYPE:
case REACT_PROVIDER_TYPE:
return $$typeofType;
default:
return $$typeof;
}
}
case REACT_PORTAL_TYPE:
return $$typeof;
}
}
return undefined;
} // AsyncMode is deprecated along with isAsyncMode
var AsyncMode = REACT_ASYNC_MODE_TYPE;
var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
var ContextConsumer = REACT_CONTEXT_TYPE;
var ContextProvider = REACT_PROVIDER_TYPE;
var Element = REACT_ELEMENT_TYPE;
var ForwardRef = REACT_FORWARD_REF_TYPE;
var Fragment = REACT_FRAGMENT_TYPE;
var Lazy = REACT_LAZY_TYPE;
var Memo = REACT_MEMO_TYPE;
var Portal = REACT_PORTAL_TYPE;
var Profiler = REACT_PROFILER_TYPE;
var StrictMode = REACT_STRICT_MODE_TYPE;
var Suspense = REACT_SUSPENSE_TYPE;
var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
function isAsyncMode(object) {
{
if (!hasWarnedAboutDeprecatedIsAsyncMode) {
hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
}
}
return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
}
function isConcurrentMode(object) {
return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
}
function isContextConsumer(object) {
return typeOf(object) === REACT_CONTEXT_TYPE;
}
function isContextProvider(object) {
return typeOf(object) === REACT_PROVIDER_TYPE;
}
function isElement(object) {
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
}
function isForwardRef(object) {
return typeOf(object) === REACT_FORWARD_REF_TYPE;
}
function isFragment(object) {
return typeOf(object) === REACT_FRAGMENT_TYPE;
}
function isLazy(object) {
return typeOf(object) === REACT_LAZY_TYPE;
}
function isMemo(object) {
return typeOf(object) === REACT_MEMO_TYPE;
}
function isPortal(object) {
return typeOf(object) === REACT_PORTAL_TYPE;
}
function isProfiler(object) {
return typeOf(object) === REACT_PROFILER_TYPE;
}
function isStrictMode(object) {
return typeOf(object) === REACT_STRICT_MODE_TYPE;
}
function isSuspense(object) {
return typeOf(object) === REACT_SUSPENSE_TYPE;
}
exports.AsyncMode = AsyncMode;
exports.ConcurrentMode = ConcurrentMode;
exports.ContextConsumer = ContextConsumer;
exports.ContextProvider = ContextProvider;
exports.Element = Element;
exports.ForwardRef = ForwardRef;
exports.Fragment = Fragment;
exports.Lazy = Lazy;
exports.Memo = Memo;
exports.Portal = Portal;
exports.Profiler = Profiler;
exports.StrictMode = StrictMode;
exports.Suspense = Suspense;
exports.isAsyncMode = isAsyncMode;
exports.isConcurrentMode = isConcurrentMode;
exports.isContextConsumer = isContextConsumer;
exports.isContextProvider = isContextProvider;
exports.isElement = isElement;
exports.isForwardRef = isForwardRef;
exports.isFragment = isFragment;
exports.isLazy = isLazy;
exports.isMemo = isMemo;
exports.isPortal = isPortal;
exports.isProfiler = isProfiler;
exports.isStrictMode = isStrictMode;
exports.isSuspense = isSuspense;
exports.isValidElementType = isValidElementType;
exports.typeOf = typeOf;
})();
}
});
var reactIs_development_1 = reactIs_development.AsyncMode;
var reactIs_development_2 = reactIs_development.ConcurrentMode;
var reactIs_development_3 = reactIs_development.ContextConsumer;
var reactIs_development_4 = reactIs_development.ContextProvider;
var reactIs_development_5 = reactIs_development.Element;
var reactIs_development_6 = reactIs_development.ForwardRef;
var reactIs_development_7 = reactIs_development.Fragment;
var reactIs_development_8 = reactIs_development.Lazy;
var reactIs_development_9 = reactIs_development.Memo;
var reactIs_development_10 = reactIs_development.Portal;
var reactIs_development_11 = reactIs_development.Profiler;
var reactIs_development_12 = reactIs_development.StrictMode;
var reactIs_development_13 = reactIs_development.Suspense;
var reactIs_development_14 = reactIs_development.isAsyncMode;
var reactIs_development_15 = reactIs_development.isConcurrentMode;
var reactIs_development_16 = reactIs_development.isContextConsumer;
var reactIs_development_17 = reactIs_development.isContextProvider;
var reactIs_development_18 = reactIs_development.isElement;
var reactIs_development_19 = reactIs_development.isForwardRef;
var reactIs_development_20 = reactIs_development.isFragment;
var reactIs_development_21 = reactIs_development.isLazy;
var reactIs_development_22 = reactIs_development.isMemo;
var reactIs_development_23 = reactIs_development.isPortal;
var reactIs_development_24 = reactIs_development.isProfiler;
var reactIs_development_25 = reactIs_development.isStrictMode;
var reactIs_development_26 = reactIs_development.isSuspense;
var reactIs_development_27 = reactIs_development.isValidElementType;
var reactIs_development_28 = reactIs_development.typeOf;
var reactIs = createCommonjsModule(function (module) {
if (process.env.NODE_ENV === 'production') {
module.exports = reactIs_production_min;
} else {
module.exports = reactIs_development;
}
});
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/
/* eslint-disable no-unused-vars */
var getOwnPropertySymbols = Object.getOwnPropertySymbols;
var hasOwnProperty = Object.prototype.hasOwnProperty;
var propIsEnumerable = Object.prototype.propertyIsEnumerable;
function toObject(val) {
if (val === null || val === undefined) {
throw new TypeError('Object.assign cannot be called with null or undefined');
}
return Object(val);
}
function shouldUseNative() {
try {
if (!Object.assign) {
return false;
}
// Detect buggy property enumeration order in older V8 versions.
// https://bugs.chromium.org/p/v8/issues/detail?id=4118
var test1 = new String('abc'); // eslint-disable-line no-new-wrappers
test1[5] = 'de';
if (Object.getOwnPropertyNames(test1)[0] === '5') {
return false;
}
// https://bugs.chromium.org/p/v8/issues/detail?id=3056
var test2 = {};
for (var i = 0; i < 10; i++) {
test2['_' + String.fromCharCode(i)] = i;
}
var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
return test2[n];
});
if (order2.join('') !== '0123456789') {
return false;
}
// https://bugs.chromium.org/p/v8/issues/detail?id=3056
var test3 = {};
'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
test3[letter] = letter;
});
if (Object.keys(Object.assign({}, test3)).join('') !==
'abcdefghijklmnopqrst') {
return false;
}
return true;
} catch (err) {
// We don't expect any of the above to throw, but better to be safe.
return false;
}
}
var objectAssign = shouldUseNative() ? Object.assign : function (target, source) {
var from;
var to = toObject(target);
var symbols;
for (var s = 1; s < arguments.length; s++) {
from = Object(arguments[s]);
for (var key in from) {
if (hasOwnProperty.call(from, key)) {
to[key] = from[key];
}
}
if (getOwnPropertySymbols) {
symbols = getOwnPropertySymbols(from);
for (var i = 0; i < symbols.length; i++) {
if (propIsEnumerable.call(from, symbols[i])) {
to[symbols[i]] = from[symbols[i]];
}
}
}
}
return to;
};
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
var ReactPropTypesSecret_1 = ReactPropTypesSecret;
var printWarning = function() {};
if (process.env.NODE_ENV !== 'production') {
var ReactPropTypesSecret$1 = ReactPropTypesSecret_1;
var loggedTypeFailures = {};
var has = Function.call.bind(Object.prototype.hasOwnProperty);
printWarning = function(text) {
var message = 'Warning: ' + text;
if (typeof console !== 'undefined') {
console.error(message);
}
try {
// --- Welcome to debugging React ---
// This error was thrown as a convenience so that you can use this stack
// to find the callsite that caused this warning to fire.
throw new Error(message);
} catch (x) {}
};
}
/**
* Assert that the values match with the type specs.
* Error messages are memorized and will only be shown once.
*
* @param {object} typeSpecs Map of name to a ReactPropType
* @param {object} values Runtime values that need to be type-checked
* @param {string} location e.g. "prop", "context", "child context"
* @param {string} componentName Name of the component for error messages.
* @param {?Function} getStack Returns the component stack.
* @private
*/
function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
if (process.env.NODE_ENV !== 'production') {
for (var typeSpecName in typeSpecs) {
if (has(typeSpecs, typeSpecName)) {
var error;
// Prop type validation may throw. In case they do, we don't want to
// fail the render phase where it didn't fail before. So we log it.
// After these have been cleaned up, we'll let them throw.
try {
// This is intentionally an invariant that gets caught. It's the same
// behavior as without this statement except with a better message.
if (typeof typeSpecs[typeSpecName] !== 'function') {
var err = Error(
(componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' +
'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.'
);
err.name = 'Invariant Violation';
throw err;
}
error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret$1);
} catch (ex) {
error = ex;
}
if (error && !(error instanceof Error)) {
printWarning(
(componentName || 'React class') + ': type specification of ' +
location + ' `' + typeSpecName + '` is invalid; the type checker ' +
'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +
'You may have forgotten to pass an argument to the type checker ' +
'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +
'shape all require an argument).'
);
}
if (error instanceof Error && !(error.message in loggedTypeFailures)) {
// Only monitor this failure once because there tends to be a lot of the
// same error.
loggedTypeFailures[error.message] = true;
var stack = getStack ? getStack() : '';
printWarning(
'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')
);
}
}
}
}
}
/**
* Resets warning cache when testing.
*
* @private
*/
checkPropTypes.resetWarningCache = function() {
if (process.env.NODE_ENV !== 'production') {
loggedTypeFailures = {};
}
};
var checkPropTypes_1 = checkPropTypes;
var has$1 = Function.call.bind(Object.prototype.hasOwnProperty);
var printWarning$1 = function() {};
if (process.env.NODE_ENV !== 'production') {
printWarning$1 = function(text) {
var message = 'Warning: ' + text;
if (typeof console !== 'undefined') {
console.error(message);
}
try {
// --- Welcome to debugging React ---
// This error was thrown as a convenience so that you can use this stack
// to find the callsite that caused this warning to fire.
throw new Error(message);
} catch (x) {}
};
}
function emptyFunctionThatReturnsNull() {
return null;
}
var factoryWithTypeCheckers = function(isValidElement, throwOnDirectAccess) {
/* global Symbol */
var ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
var FAUX_ITERATOR_SYMBOL = '@@iterator'; // Before Symbol spec.
/**
* Returns the iterator method function contained on the iterable object.
*
* Be sure to invoke the function with the iterable as context:
*
* var iteratorFn = getIteratorFn(myIterable);
* if (iteratorFn) {
* var iterator = iteratorFn.call(myIterable);
* ...
* }
*
* @param {?object} maybeIterable
* @return {?function}
*/
function getIteratorFn(maybeIterable) {
var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
if (typeof iteratorFn === 'function') {
return iteratorFn;
}
}
/**
* Collection of methods that allow declaration and validation of props that are
* supplied to React components. Example usage:
*
* var Props = require('ReactPropTypes');
* var MyArticle = React.createClass({
* propTypes: {
* // An optional string prop named "description".
* description: Props.string,
*
* // A required enum prop named "category".
* category: Props.oneOf(['News','Photos']).isRequired,
*
* // A prop named "dialog" that requires an instance of Dialog.
* dialog: Props.instanceOf(Dialog).isRequired
* },
* render: function() { ... }
* });
*
* A more formal specification of how these methods are used:
*
* type := array|bool|func|object|number|string|oneOf([...])|instanceOf(...)
* decl := ReactPropTypes.{type}(.isRequired)?
*
* Each and every declaration produces a function with the same signature. This
* allows the creation of custom validation functions. For example:
*
* var MyLink = React.createClass({
* propTypes: {
* // An optional string or URI prop named "href".
* href: function(props, propName, componentName) {
* var propValue = props[propName];
* if (propValue != null && typeof propValue !== 'string' &&
* !(propValue instanceof URI)) {
* return new Error(
* 'Expected a string or an URI for ' + propName + ' in ' +
* componentName
* );
* }
* }
* },
* render: function() {...}
* });
*
* @internal
*/
var ANONYMOUS = '<<anonymous>>';
// Important!
// Keep this list in sync with production version in `./factoryWithThrowingShims.js`.
var ReactPropTypes = {
array: createPrimitiveTypeChecker('array'),
bool: createPrimitiveTypeChecker('boolean'),
func: createPrimitiveTypeChecker('function'),
number: createPrimitiveTypeChecker('number'),
object: createPrimitiveTypeChecker('object'),
string: createPrimitiveTypeChecker('string'),
symbol: createPrimitiveTypeChecker('symbol'),
any: createAnyTypeChecker(),
arrayOf: createArrayOfTypeChecker,
element: createElementTypeChecker(),
elementType: createElementTypeTypeChecker(),
instanceOf: createInstanceTypeChecker,
node: createNodeChecker(),
objectOf: createObjectOfTypeChecker,
oneOf: createEnumTypeChecker,
oneOfType: createUnionTypeChecker,
shape: createShapeTypeChecker,
exact: createStrictShapeTypeChecker,
};
/**
* inlined Object.is polyfill to avoid requiring consumers ship their own
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
*/
/*eslint-disable no-self-compare*/
function is(x, y) {
// SameValue algorithm
if (x === y) {
// Steps 1-5, 7-10
// Steps 6.b-6.e: +0 != -0
return x !== 0 || 1 / x === 1 / y;
} else {
// Step 6.a: NaN == NaN
return x !== x && y !== y;
}
}
/*eslint-enable no-self-compare*/
/**
* We use an Error-like object for backward compatibility as people may call
* PropTypes directly and inspect their output. However, we don't use real
* Errors anymore. We don't inspect their stack anyway, and creating them
* is prohibitively expensive if they are created too often, such as what
* happens in oneOfType() for any type before the one that matched.
*/
function PropTypeError(message) {
this.message = message;
this.stack = '';
}
// Make `instanceof Error` still work for returned errors.
PropTypeError.prototype = Error.prototype;
function createChainableTypeChecker(validate) {
if (process.env.NODE_ENV !== 'production') {
var manualPropTypeCallCache = {};
var manualPropTypeWarningCount = 0;
}
function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {
componentName = componentName || ANONYMOUS;
propFullName = propFullName || propName;
if (secret !== ReactPropTypesSecret_1) {
if (throwOnDirectAccess) {
// New behavior only for users of `prop-types` package
var err = new Error(
'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
'Use `PropTypes.checkPropTypes()` to call them. ' +
'Read more at http://fb.me/use-check-prop-types'
);
err.name = 'Invariant Violation';
throw err;
} else if (process.env.NODE_ENV !== 'production' && typeof console !== 'undefined') {
// Old behavior for people using React.PropTypes
var cacheKey = componentName + ':' + propName;
if (
!manualPropTypeCallCache[cacheKey] &&
// Avoid spamming the console because they are often not actionable except for lib authors
manualPropTypeWarningCount < 3
) {
printWarning$1(
'You are manually calling a React.PropTypes validation ' +
'function for the `' + propFullName + '` prop on `' + componentName + '`. This is deprecated ' +
'and will throw in the standalone `prop-types` package. ' +
'You may be seeing this warning due to a third-party PropTypes ' +
'library. See https://fb.me/react-warning-dont-call-proptypes ' + 'for details.'
);
manualPropTypeCallCache[cacheKey] = true;
manualPropTypeWarningCount++;
}
}
}
if (props[propName] == null) {
if (isRequired) {
if (props[propName] === null) {
return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required ' + ('in `' + componentName + '`, but its value is `null`.'));
}
return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required in ' + ('`' + componentName + '`, but its value is `undefined`.'));
}
return null;
} else {
return validate(props, propName, componentName, location, propFullName);
}
}
var chainedCheckType = checkType.bind(null, false);
chainedCheckType.isRequired = checkType.bind(null, true);
return chainedCheckType;
}
function createPrimitiveTypeChecker(expectedType) {
function validate(props, propName, componentName, location, propFullName, secret) {
var propValue = props[propName];
var propType = getPropType(propValue);
if (propType !== expectedType) {
// `propValue` being instance of, say, date/regexp, pass the 'object'
// check, but we can offer a more precise error message here rather than
// 'of type `object`'.
var preciseType = getPreciseType(propValue);
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'));
}
return null;
}
return createChainableTypeChecker(validate);
}
function createAnyTypeChecker() {
return createChainableTypeChecker(emptyFunctionThatReturnsNull);
}
function createArrayOfTypeChecker(typeChecker) {
function validate(props, propName, componentName, location, propFullName) {
if (typeof typeChecker !== 'function') {
return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside arrayOf.');
}
var propValue = props[propName];
if (!Array.isArray(propValue)) {
var propType = getPropType(propValue);
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));
}
for (var i = 0; i < propValue.length; i++) {
var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret_1);
if (error instanceof Error) {
return error;
}
}
return null;
}
return createChainableTypeChecker(validate);
}
function createElementTypeChecker() {
function validate(props, propName, componentName, location, propFullName) {
var propValue = props[propName];
if (!isValidElement(propValue)) {
var propType = getPropType(propValue);
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement.'));
}
return null;
}
return createChainableTypeChecker(validate);
}
function createElementTypeTypeChecker() {
function validate(props, propName, componentName, location, propFullName) {
var propValue = props[propName];
if (!reactIs.isValidElementType(propValue)) {
var propType = getPropType(propValue);
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement type.'));
}
return null;
}
return createChainableTypeChecker(validate);
}
function createInstanceTypeChecker(expectedClass) {
function validate(props, propName, componentName, location, propFullName) {
if (!(props[propName] instanceof expectedClass)) {
var expectedClassName = expectedClass.name || ANONYMOUS;
var actualClassName = getClassName(props[propName]);
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + actualClassName + '` supplied to `' + componentName + '`, expected ') + ('instance of `' + expectedClassName + '`.'));
}
return null;
}
return createChainableTypeChecker(validate);
}
function createEnumTypeChecker(expectedValues) {
if (!Array.isArray(expectedValues)) {
if (process.env.NODE_ENV !== 'production') {
if (arguments.length > 1) {
printWarning$1(
'Invalid arguments supplied to oneOf, expected an array, got ' + arguments.length + ' arguments. ' +
'A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).'
);
} else {
printWarning$1('Invalid argument supplied to oneOf, expected an array.');
}
}
return emptyFunctionThatReturnsNull;
}
function validate(props, propName, componentName, location, propFullName) {
var propValue = props[propName];
for (var i = 0; i < expectedValues.length; i++) {
if (is(propValue, expectedValues[i])) {
return null;
}
}
var valuesString = JSON.stringify(expectedValues, function replacer(key, value) {
var type = getPreciseType(value);
if (type === 'symbol') {
return String(value);
}
return value;
});
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of value `' + String(propValue) + '` ' + ('supplied to `' + componentName + '`, expected one of ' + valuesString + '.'));
}
return createChainableTypeChecker(validate);
}
function createObjectOfTypeChecker(typeChecker) {
function validate(props, propName, componentName, location, propFullName) {
if (typeof typeChecker !== 'function') {
return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside objectOf.');
}
var propValue = props[propName];
var propType = getPropType(propValue);
if (propType !== 'object') {
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
}
for (var key in propValue) {
if (has$1(propValue, key)) {
var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
if (error instanceof Error) {
return error;
}
}
}
return null;
}
return createChainableTypeChecker(validate);
}
function createUnionTypeChecker(arrayOfTypeCheckers) {
if (!Array.isArray(arrayOfTypeCheckers)) {
process.env.NODE_ENV !== 'production' ? printWarning$1('Invalid argument supplied to oneOfType, expected an instance of array.') : void 0;
return emptyFunctionThatReturnsNull;
}
for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
var checker = arrayOfTypeCheckers[i];
if (typeof checker !== 'function') {
printWarning$1(
'Invalid argument supplied to oneOfType. Expected an array of check functions, but ' +
'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.'
);
return emptyFunctionThatReturnsNull;
}
}
function validate(props, propName, componentName, location, propFullName) {
for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
var checker = arrayOfTypeCheckers[i];
if (checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret_1) == null) {
return null;
}
}
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`.'));
}
return createChainableTypeChecker(validate);
}
function createNodeChecker() {
function validate(props, propName, componentName, location, propFullName) {
if (!isNode(props[propName])) {
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`, expected a ReactNode.'));
}
return null;
}
return createChainableTypeChecker(validate);
}
function createShapeTypeChecker(shapeTypes) {
function validate(props, propName, componentName, location, propFullName) {
var propValue = props[propName];
var propType = getPropType(propValue);
if (propType !== 'object') {
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
}
for (var key in shapeTypes) {
var checker = shapeTypes[key];
if (!checker) {
continue;
}
var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
if (error) {
return error;
}
}
return null;
}
return createChainableTypeChecker(validate);
}
function createStrictShapeTypeChecker(shapeTypes) {
function validate(props, propName, componentName, location, propFullName) {
var propValue = props[propName];
var propType = getPropType(propValue);
if (propType !== 'object') {
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
}
// We need to check all keys in case some are required but missing from
// props.
var allKeys = objectAssign({}, props[propName], shapeTypes);
for (var key in allKeys) {
var checker = shapeTypes[key];
if (!checker) {
return new PropTypeError(
'Invalid ' + location + ' `' + propFullName + '` key `' + key + '` supplied to `' + componentName + '`.' +
'\nBad object: ' + JSON.stringify(props[propName], null, ' ') +
'\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, ' ')
);
}
var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret_1);
if (error) {
return error;
}
}
return null;
}
return createChainableTypeChecker(validate);
}
function isNode(propValue) {
switch (typeof propValue) {
case 'number':
case 'string':
case 'undefined':
return true;
case 'boolean':
return !propValue;
case 'object':
if (Array.isArray(propValue)) {
return propValue.every(isNode);
}
if (propValue === null || isValidElement(propValue)) {
return true;
}
var iteratorFn = getIteratorFn(propValue);
if (iteratorFn) {
var iterator = iteratorFn.call(propValue);
var step;
if (iteratorFn !== propValue.entries) {
while (!(step = iterator.next()).done) {
if (!isNode(step.value)) {
return false;
}
}
} else {
// Iterator will provide entry [k,v] tuples rather than values.
while (!(step = iterator.next()).done) {
var entry = step.value;
if (entry) {
if (!isNode(entry[1])) {
return false;
}
}
}
}
} else {
return false;
}
return true;
default:
return false;
}
}
function isSymbol(propType, propValue) {
// Native Symbol.
if (propType === 'symbol') {
return true;
}
// falsy value can't be a Symbol
if (!propValue) {
return false;
}
// 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'
if (propValue['@@toStringTag'] === 'Symbol') {
return true;
}
// Fallback for non-spec compliant Symbols which are polyfilled.
if (typeof Symbol === 'function' && propValue instanceof Symbol) {
return true;
}
return false;
}
// Equivalent of `typeof` but with special handling for array and regexp.
function getPropType(propValue) {
var propType = typeof propValue;
if (Array.isArray(propValue)) {
return 'array';
}
if (propValue instanceof RegExp) {
// Old webkits (at least until Android 4.0) return 'function' rather than
// 'object' for typeof a RegExp. We'll normalize this here so that /bla/
// passes PropTypes.object.
return 'object';
}
if (isSymbol(propType, propValue)) {
return 'symbol';
}
return propType;
}
// This handles more types than `getPropType`. Only used for error messages.
// See `createPrimitiveTypeChecker`.
function getPreciseType(propValue) {
if (typeof propValue === 'undefined' || propValue === null) {
return '' + propValue;
}
var propType = getPropType(propValue);
if (propType === 'object') {
if (propValue instanceof Date) {
return 'date';
} else if (propValue instanceof RegExp) {
return 'regexp';
}
}
return propType;
}
// Returns a string that is postfixed to a warning about an invalid type.
// For example, "undefined" or "of type array"
function getPostfixForTypeWarning(value) {
var type = getPreciseType(value);
switch (type) {
case 'array':
case 'object':
return 'an ' + type;
case 'boolean':
case 'date':
case 'regexp':
return 'a ' + type;
default:
return type;
}
}
// Returns class name of the object, if any.
function getClassName(propValue) {
if (!propValue.constructor || !propValue.constructor.name) {
return ANONYMOUS;
}
return propValue.constructor.name;
}
ReactPropTypes.checkPropTypes = checkPropTypes_1;
ReactPropTypes.resetWarningCache = checkPropTypes_1.resetWarningCache;
ReactPropTypes.PropTypes = ReactPropTypes;
return ReactPropTypes;
};
function emptyFunction() {}
function emptyFunctionWithReset() {}
emptyFunctionWithReset.resetWarningCache = emptyFunction;
var factoryWithThrowingShims = function() {
function shim(props, propName, componentName, location, propFullName, secret) {
if (secret === ReactPropTypesSecret_1) {
// It is still safe when called from React.
return;
}
var err = new Error(
'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
'Use PropTypes.checkPropTypes() to call them. ' +
'Read more at http://fb.me/use-check-prop-types'
);
err.name = 'Invariant Violation';
throw err;
} shim.isRequired = shim;
function getShim() {
return shim;
} // Important!
// Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.
var ReactPropTypes = {
array: shim,
bool: shim,
func: shim,
number: shim,
object: shim,
string: shim,
symbol: shim,
any: shim,
arrayOf: getShim,
element: shim,
elementType: shim,
instanceOf: getShim,
node: shim,
objectOf: getShim,
oneOf: getShim,
oneOfType: getShim,
shape: getShim,
exact: getShim,
checkPropTypes: emptyFunctionWithReset,
resetWarningCache: emptyFunction
};
ReactPropTypes.PropTypes = ReactPropTypes;
return ReactPropTypes;
};
var propTypes = createCommonjsModule(function (module) {
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
if (process.env.NODE_ENV !== 'production') {
var ReactIs = reactIs;
// By explicitly using `prop-types` you are opting into new development behavior.
// http://fb.me/prop-types-in-prod
var throwOnDirectAccess = true;
module.exports = factoryWithTypeCheckers(ReactIs.isElement, throwOnDirectAccess);
} else {
// By explicitly using `prop-types` you are opting into new production behavior.
// http://fb.me/prop-types-in-prod
module.exports = factoryWithThrowingShims();
}
});
var CustomDatePicker = function CustomDatePicker(_ref) {
var displayDatePicker = _ref.displayDatePicker,
date = _ref.date,
changeState = _ref.changeState,
name = _ref.name,
label = _ref.label,
fieldVariant = _ref.fieldVariant,
className = _ref.className;
if (displayDatePicker) {
var momentDate;
if (typeof date === 'string') {
momentDate = moment(date);
} else {
momentDate = date;
}
return /*#__PURE__*/React.createElement(KeyboardDatePicker, {
name: name,
label: label,
format: "MM/DD/YYYY",
value: momentDate || {},
onChange: changeState,
fullWidth: true,
margin: "normal",
className: className,
inputVariant: fieldVariant || 'standard',
size: "small",
InputLabelProps: {
shrink: true
}
});
}
};
CustomDatePicker.propTypes = {
displayDatePicker: propTypes.bool,
date: propTypes.oneOfType([propTypes.string, propTypes.object]),
changeState: propTypes.func,
name: propTypes.string,
label: propTypes.string
};
var PatientCard = function PatientCard(_ref) {
var patient = _ref.patient,
detailLink = _ref.detailLink,
fieldVariant = _ref.fieldVariant;
var useStyles = makeStyles(function (theme) {
return {
root: {
flexGrow: 1,
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
margin: theme.spacing(1),
marginRight: theme.spacing(3)
},
paper: {
margin: theme.spacing(1)
},
textField: {
marginLeft: theme.spacing(1),
marginRight: theme.spacing(1)
},
link: {
color: theme.palette.primary.main,
textDecoration: 'none',
'&:hover': {
textDecoration: 'underline'
}
},
avatar: {
position: 'relative',
zIndex: 10,
transition: '1s',
width: '100%',
height: '100%',
objectFit: 'cover'
},
photo: {
position: 'relative',
height: '160px',
width: '160px',
left: '-20px',
top: '-30px',
zIndex: 10
},
grid: {
flexGrow: 1
}
};
});
var classes = useStyles();
var _useState = useState({
fullName: '',
familyName: '',
givenName: '',
email: '',
birthdate: {},
gender: '',
avatar: '',
identifier: ''
}),
_useState2 = _slicedToArray(_useState, 2),
currentPatient = _useState2[0],
setCurrentPatient = _useState2[1];
useEffect(function () {
var _patient$name$;
var familyName = Array.isArray(patient.name[0].family) ? patient.name[0].family[0] : patient.name[0].family;
var givenName = Array.isArray(patient.name[0].given) ? patient.name[0].given[0] : patient.name[0].given;
var fullName = ((_patient$name$ = patient.name[0]) === null || _patient$name$ === void 0 ? void 0 : _patient$name$.text) ? patient.name[0].text : givenName + ' ' + familyName;
setCurrentPatient(function (prevPatient) {
var _patient$identifier$, _patient$identifier$2;
return _objectSpread2(_objectSpread2({}, prevPatient), {}, {
fullName: fullName,
familyName: familyName,
givenName: givenName,
email: patient.telecom.map(function (el) {
return el.system === 'email' ? el.value : '';
}).filter(function (el) {
return !!el;
}),
birthdate: patient.birthDate,
gender: patient.gender,
avatar: patient.photo ? patient.photo[0].url : 'https://cdn1.iconfinder.com/data/icons/user-pictures/100/unknown-512.png',
identifier: ((_patient$identifier$ = patient.identifier[0]) === null || _patient$identifier$ === void 0 ? void 0 : _patient$identifier$.value) ? (_patient$identifier$2 = patient.identifier[0]) === null || _patient$identifier$2 === void 0 ? void 0 : _patient$identifier$2.value : patient.id ? patient.id : patient.identifier ? patient.identifier : 'Unknown'
});
});
}, [patient]);
var updateCurrentPatient = function updateCurrentPatient(e) {
e.preventDefault();
setCurrentPatient(function (prevPatient) {
return _objectSpread2(_objectSpread2({}, prevPatient), {}, _defineProperty({}, e.target.name, e.target.value));
});
};
var handleDateChange = function handleDateChange(date) {
setCurrentPatient(function (prevPatient) {
return _objectSpread2(_objectSpread2({}, prevPatient), {}, {
birthdate: date
});
});
};
return /*#__PURE__*/React.createElement(Paper, {
className: classes.paper
}, /*#__PURE__*/React.createElement(Grid, {
container: true,
spacing: 1,
direction: "row"
}, /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Card, {
className: classes.photo
}, /*#__PURE__*/React.createElement("img", {
id: "avatarImage",
src: currentPatient.avatar,
className: classes.avatar
}))), /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: true
}, /*#__PURE__*/React.createElement("form", {
className: classes.root,
noValidate: true,
autoComplete: "off"
}, /*#__PURE__*/React.createElement(Grid, {
container: true,
direction: "row",
spacing: 1
}, /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: 12
}, /*#__PURE__*/React.createElement(TextField, {
id: "patientCardIdInput",
name: "identifier",
label: "Patient ID",
margin: "normal",
className: classes.textField,
value: currentPatient.identifier,
onChange: updateCurrentPatient,
fullWidth: true,
disabled: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: 12,
md: 6
}, /*#__PURE__*/React.createElement(TextField, {
id: "givenNameInput",
name: "givenName",
label: "Given Name",
margin: "normal",
className: classes.textField,
value: currentPatient.givenName,
onChange: updateCurrentPatient,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: 12,
md: 6
}, /*#__PURE__*/React.createElement(TextField, {
id: "familyNameInput",
name: "familyName",
label: "Family Name",
margin: "normal",
className: classes.textField,
value: currentPatient.familyName,
onChange: updateCurrentPatient,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: 12,
md: 6
}, /*#__PURE__*/React.createElement(CustomDatePicker, {
date: currentPatient.birthdate,
displayDatePicker: true,
changeState: handleDateChange,
className: classes.textField,
name: "birthDate",
label: "Birthdate",
fieldVariant: fieldVariant
})), /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: 12,
md: 6
}, /*#__PURE__*/React.createElement(TextField, {
id: "genderInput",
name: "gender",
label: "Gender",
margin: "normal",
className: classes.textField,
value: currentPatient.gender,
onChange: updateCurrentPatient,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
}))), detailLink && /*#__PURE__*/React.createElement(Typography, {
variant: "caption"
}, "Additional patient details are available", /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("a", {
href: "#secondary-heading-and-columns",
className: classes.link
}, "See patient details"))))));
};
PatientCard.propTypes = {
patient: propTypes.object,
detailLink: propTypes.string,
fieldVariant: propTypes.string
};
var TableHeader = function TableHeader(_ref) {
var classes = _ref.classes,
onSelectAllClick = _ref.onSelectAllClick,
order = _ref.order,
orderBy = _ref.orderBy,
numSelected = _ref.numSelected,
rowCount = _ref.rowCount,
onRequestSort = _ref.onRequestSort,
headCells = _ref.headCells;
var createSortHandler = function createSortHandler(property) {
return function (event) {
onRequestSort(event, property);
};
};
return /*#__PURE__*/React.createElement(TableHead, null, /*#__PURE__*/React.createElement(TableRow, null, /*#__PURE__*/React.createElement(TableCell, {
padding: "checkbox"
}, /*#__PURE__*/React.createElement(Checkbox, {
indeterminate: numSelected > 0 && numSelected < rowCount,
checked: numSelected === rowCount,
onChange: onSelectAllClick,
inputProps: {
'aria-label': 'select all patients'
}
})), headCells.map(function (headCell) {
return /*#__PURE__*/React.createElement(TableCell, {
key: headCell.id,
align: headCell.numeric ? 'right' : 'left',
padding: headCell.disablePadding ? 'none' : 'default',
sortDirection: orderBy === headCell.id ? order : false
}, /*#__PURE__*/React.createElement(TableSortLabel, {
active: orderBy === headCell.id,
direction: order,
onClick: createSortHandler(headCell.id)
}, headCell.label, orderBy === headCell.id ? /*#__PURE__*/React.createElement("span", {
className: classes.visuallyHidden
}, order === 'desc' ? 'sorted descending' : 'sorted ascending') : null));
})));
};
TableHeader.propTypes = {
classes: propTypes.object.isRequired,
numSelected: propTypes.number.isRequired,
onRequestSort: propTypes.func.isRequired,
onSelectAllClick: propTypes.func.isRequired,
order: propTypes.oneOf(['asc', 'desc']).isRequired,
orderBy: propTypes.string.isRequired,
rowCount: propTypes.number.isRequired,
headCells: propTypes.arrayOf(propTypes.object).isRequired
};
var useToolbarStyles = makeStyles(function (theme) {
return {
root: {
paddingLeft: theme.spacing(2),
paddingRight: theme.spacing(1)
},
highlight: theme.palette.type === 'light' ? {
color: theme.palette.secondary.main,
backgroundColor: lighten(theme.palette.secondary.light, 0.85)
} : {
color: theme.palette.text.primary,
backgroundColor: theme.palette.secondary.dark
},
title: {
flex: '1 1 100%'
}
};
});
var TableToolbar = function TableToolbar(_ref) {
var selected = _ref.selected,
tableTitle = _ref.tableTitle,
onRemoveRecord = _ref.onRemoveRecord;
var classes = useToolbarStyles();
var numSelected = selected.length;
return /*#__PURE__*/React.createElement(Toolbar, {
className: clsx(classes.root, _defineProperty({}, classes.highlight, numSelected > 0))
}, numSelected > 0 ? /*#__PURE__*/React.createElement(Typography, {
className: classes.title,
color: "inherit",
variant: "subtitle1"
}, numSelected, " selected") : /*#__PURE__*/React.createElement(Typography, {
className: classes.title,
variant: "h6",
id: "tableTitle"
}, tableTitle), numSelected > 0 && /*#__PURE__*/React.createElement(Tooltip, {
title: "Delete"
}, /*#__PURE__*/React.createElement(IconButton, {
"aria-label": "delete",
onClick: function onClick() {
return onRemoveRecord(selected);
}
}, /*#__PURE__*/React.createElement(Delete, null))));
};
TableToolbar.propTypes = {
numSelected: propTypes.number.isRequired,
tableTitle: propTypes.string,
onRemoveRecord: propTypes.func
};
var desc = function desc(a, b, orderBy) {
if (b[orderBy] < a[orderBy]) {
return -1;
}
if (b[orderBy] > a[orderBy]) {
return 1;
}
return 0;
};
var stableSort = function stableSort(array, cmp) {
var stabilizedThis = array.map(function (el, index) {
return [el, index];
});
stabilizedThis.sort(function (a, b) {
var order = cmp(a[0], b[0]);
if (order !== 0) return order;
return a[1] - b[1];
});
return stabilizedThis.map(function (el) {
return el[0];
});
};
var getSorting = function getSorting(order, orderBy) {
return order === 'desc' ? function (a, b) {
return desc(a, b, orderBy);
} : function (a, b) {
return -desc(a, b, orderBy);
};
};
var headCells = [{
id: 'identifier',
numeric: false,
disablePadding: true,
label: 'Patient ID'
}, {
id: 'name',
numeric: false,
disablePadding: true,
label: 'Patient Name'
}, {
id: 'dob',
numeric: false,
disablePadding: false,
label: 'Date of Birth'
}, {
id: 'gender',
numeric: false,
disablePadding: false,
label: 'Gender'
}, {
id: 'phone',
numeric: false,
disablePadding: false,
label: 'Phone'
}, {
id: 'language',
numeric: false,
disablePadding: false,
label: 'Language'
}, {
id: 'organization',
numeric: false,
disablePadding: false,
label: 'Organization'
}];
var useStyles = makeStyles(function (theme) {
return {
root: {
width: '100%',
marginTop: theme.spacing(3)
},
paper: {
width: '100%',
marginBottom: theme.spacing(2)
},
table: {
minWidth: 750
},
tableWrapper: {
overflowX: 'auto'
}
};
});
var PatientTable = function PatientTable(_ref) {
var _ref$patients = _ref.patients,
patients = _ref$patients === void 0 ? [] : _ref$patients,
onRemoveRecord = _ref.onRemoveRecord,
tableTitle = _ref.tableTitle,
tableRowSize = _ref.tableRowSize,
tableHeight = _ref.tableHeight,
stickyHeader = _ref.stickyHeader,
defaultRowsPerPage = _ref.defaultRowsPerPage;
var classes = useStyles();
var _React$useState = React.useState('asc'),
_React$useState2 = _slicedToArray(_React$useState, 2),
order = _React$useState2[0],
setOrder = _React$useState2[1];
var _React$useState3 = React.useState('patientId'),
_React$useState4 = _slicedToArray(_React$useState3, 2),
orderBy = _React$useState4[0],
setOrderBy = _React$useState4[1];
var _React$useState5 = React.useState([]),
_React$useState6 = _slicedToArray(_React$useState5, 2),
selected = _React$useState6[0],
setSelected = _React$useState6[1];
var _React$useState7 = React.useState(0),
_React$useState8 = _slicedToArray(_React$useState7, 2),
page = _React$useState8[0],
setPage = _React$useState8[1];
var _React$useState9 = React.useState(false),
_React$useState10 = _slicedToArray(_React$useState9, 2),
dense = _React$useState10[0],
setDense = _React$useState10[1];
var _React$useState11 = React.useState(defaultRowsPerPage || 5),
_React$useState12 = _slicedToArray(_React$useState11, 2),
rowsPerPage = _React$useState12[0],
setRowsPerPage = _React$useState12[1];
var handleRequestSort = function handleRequestSort(event, property) {
var isDesc = orderBy === property && order === 'desc';
setOrder(isDesc ? 'asc' : 'desc');
setOrderBy(property);
};
var handleSelectAllClick = function handleSelectAllClick(event) {
if (event.target.checked) {
var newSelecteds = patients.map(function (n) {
return n.id;
});
setSelected(newSelecteds);
return;
}
setSelected([]);
};
var handleClick = function handleClick(event, name) {
var selectedIndex = selected.indexOf(name);
var newSelected = [];
if (selectedIndex === -1) {
newSelected = newSelected.concat(selected, name);
} else if (selectedIndex === 0) {
newSelected = newSelected.concat(selected.slice(1));
} else if (selectedIndex === selected.length - 1) {
newSelected = newSelected.concat(selected.slice(0, -1));
} else if (selectedIndex > 0) {
newSelected = newSelected.concat(selected.slice(0, selectedIndex), selected.slice(selectedIndex + 1));
}
setSelected(newSelected);
};
var handleChangePage = function handleChangePage(event, newPage) {
setPage(newPage);
};
var handleChangeRowsPerPage = function handleChangeRowsPerPage(event) {
setRowsPerPage(parseInt(event.target.value, 10));
setPage(0);
};
var isSelected = function isSelected(name) {
return selected.indexOf(name) !== -1;
};
var emptyRows = rowsPerPage - Math.min(rowsPerPage, patients.length - page * rowsPerPage);
return /*#__PURE__*/React.createElement("div", {
className: classes.root
}, /*#__PURE__*/React.createElement(Paper, {
className: classes.paper
}, /*#__PURE__*/React.createElement(TableToolbar, {
selected: selected,
tableTitle: tableTitle,
onRemoveRecord: onRemoveRecord
}), /*#__PURE__*/React.createElement("div", {
className: classes.tableWrapper
}, /*#__PURE__*/React.createElement(Table, {
className: classes.table,
size: tableRowSize,
stickyHeader: stickyHeader,
"aria-label": tableTitle || 'patient-table'
}, /*#__PURE__*/React.createElement(TableHeader, {
classes: classes,
numSelected: selected.length,
order: order,
orderBy: orderBy,
onSelectAllClick: handleSelectAllClick,
onRequestSort: handleRequestSort,
rowCount: patients.length,
headCells: headCells
}), /*#__PURE__*/React.createElement(TableBody, null, stableSort(patients, getSorting(order, orderBy)).slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map(function (row, index) {
var isItemSelected = isSelected(row.id);
var labelId = "enhanced-table-checkbox-".concat(index);
return /*#__PURE__*/React.createElement(TableRow, {
hover: true,
onClick: function onClick(event) {
return handleClick(event, row.id);
},
role: "checkbox",
"aria-checked": isItemSelected,
tabIndex: -1,
key: row.id,
selected: isItemSelected
}, /*#__PURE__*/React.createElement(TableCell, {
padding: "checkbox"
}, /*#__PURE__*/React.createElement(Checkbox, {
checked: isItemSelected,
inputProps: {
'aria-labelledby': labelId
}
})), /*#__PURE__*/React.createElement(TableCell, null, row.identifier[0].value), /*#__PURE__*/React.createElement(TableCell, {
component: "th",
id: labelId,
scope: "row",
padding: "none"
}, row.name[0].text ? row.name[0].text : "".concat(row.name[0].given.join(' '), " ").concat(row.name[0].family)), /*#__PURE__*/React.createElement(TableCell, null, row.birthDate), /*#__PURE__*/React.createElement(TableCell, null, row.gender), /*#__PURE__*/React.createElement(TableCell, null, Array.isArray(row.telecom) && row.telecom.map(function (el) {
return el.system === 'phone' ? el.value : '';
}).filter(function (el) {
return !!el;
})), /*#__PURE__*/React.createElement(TableCell, null, Array.isArray(row.communication) && row.communication[0].language.text), /*#__PURE__*/React.createElement(TableCell, null, row.managingOrganization && row.managingOrganization.reference));
}), emptyRows > 0 && /*#__PURE__*/React.createElement(TableRow, {
style: {
height: (dense ? 33 : 53) * emptyRows
}
}, /*#__PURE__*/React.createElement(TableCell, {
colSpan: 7
}))))), /*#__PURE__*/React.createElement(TablePagination, {
rowsPerPageOptions: [5, 10, 25],
component: "div",
count: patients.length,
rowsPerPage: rowsPerPage,
page: page,
backIconButtonProps: {
'aria-label': 'previous page'
},
nextIconButtonProps: {
'aria-label': 'next page'
},
onChangePage: handleChangePage,
onChangeRowsPerPage: handleChangeRowsPerPage
})));
};
PatientTable.propTypes = {
patients: propTypes.arrayOf(propTypes.object).isRequired,
onRemoveRecord: propTypes.func,
tableTitle: propTypes.string,
tableRowSize: propTypes.string,
tableHeight: propTypes.number,
stickyHeader: propTypes.string,
defaultRowsPerPage: propTypes.number
};
var useStyles$1 = makeStyles(function (theme) {
return {
root: {
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
margin: theme.spacing(1),
marginRight: theme.spacing(3)
},
paper: {
margin: theme.spacing(1)
},
grid: {
flexGrow: 1
},
actionButtons: {
margin: theme.spacing(1)
}
};
});
var PatientDetail = function PatientDetail(_ref) {
var onUpsert = _ref.onUpsert,
onCancel = _ref.onCancel,
onDelete = _ref.onDelete,
patient = _ref.patient,
fieldVariant = _ref.fieldVariant;
var classes = useStyles$1();
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
patientId = _useState2[0],
setPatientId = _useState2[1];
var _useState3 = useState({
resourceType: 'Patient',
name: [{
text: '',
prefix: [''],
family: [''],
given: [''],
suffix: [''],
resourceType: 'HumanName'
}],
active: true,
gender: '',
birthDate: '',
address1: '',
address2: '',
city: '',
state: '',
postalCode: '',
country: '',
photo: [{
url: ''
}],
identifier: [{
use: 'usual',
type: {
coding: [{
system: 'http://hl7.org/fhir/v2/0203',
code: 'MR'
}]
},
value: ''
}],
deceasedBoolean: false,
multipleBirthBoolean: false,
maritalStatus: {
text: ''
},
telecom: [{
use: 'phone'
}],
contact: [],
animal: {
species: {
text: 'Human'
}
},
communication: [{
language: {
text: 'English'
}
}],
careProvider: [{
display: '',
reference: ''
}],
managingOrganization: {
reference: '',
display: ''
}
}),
_useState4 = _slicedToArray(_useState3, 2),
currentPatient = _useState4[0],
setCurrentPatient = _useState4[1];
var _useState5 = useState({
prefix: '',
familyName: '',
givenName: '',
suffix: '',
identifier: '',
deceased: false,
multipleBirth: false,
maritalStatus: '',
species: '',
language: '',
gender: '',
phone: '',
birthDate: {},
photo: ''
}),
_useState6 = _slicedToArray(_useState5, 2),
form = _useState6[0],
setForm = _useState6[1];
useEffect(function () {
dehydratePatientResource(patient);
setPatientId(patient.identifier[0].value);
}, [currentPatient, patientId]);
var dehydratePatientResource = function dehydratePatientResource(patient) {
setForm(function (prevForm) {
var _patient$name$, _patient$name$2, _patient$name$3, _patient$name$4, _patient$identifier$, _patient$identifier$$, _patient$identifier$$2, _patient$address$, _patient$address$2, _patient$address$3, _patient$address$4, _patient$address$5, _patient$address$6, _patient$address$7, _patient$address$8, _patient$address$9, _patient$address$10, _patient$address, _patient$address$11, _patient$address2, _patient$address$12, _patient$address3, _patient$animal, _patient$animal$speci, _patient$communicatio, _patient$communicatio2;
return _objectSpread2(_objectSpread2({}, prevForm), {}, {
prefix: Array.isArray((_patient$name$ = patient.name[0]) === null || _patient$name$ === void 0 ? void 0 : _patient$name$.prefix) ? patient.name[0].prefix[0] : patient.name[0].prefix,
familyName: Array.isArray((_patient$name$2 = patient.name[0]) === null || _patient$name$2 === void 0 ? void 0 : _patient$name$2.family) ? patient.name[0].family[0] : patient.name[0].family,
givenName: Array.isArray((_patient$name$3 = patient.name[0]) === null || _patient$name$3 === void 0 ? void 0 : _patient$name$3.given) ? patient.name[0].given[0] : patient.name[0].given,
suffix: Array.isArray((_patient$name$4 = patient.name[0]) === null || _patient$name$4 === void 0 ? void 0 : _patient$name$4.suffix) ? patient.name[0].suffix[0] : patient.name[0].suffix,
identifier: patient.identifier[0].value,
identifierType: (_patient$identifier$ = patient.identifier[0]) === null || _patient$identifier$ === void 0 ? void 0 : (_patient$identifier$$ = _patient$identifier$.type) === null || _patient$identifier$$ === void 0 ? void 0 : (_patient$identifier$$2 = _patient$identifier$$.coding[0]) === null || _patient$identifier$$2 === void 0 ? void 0 : _patient$identifier$$2.code,
deceased: patient.deceasedBoolean,
multipleBirth: patient.multipleBirthBoolean,
gender: patient.gender,
maritalStatus: patient.maritalStatus.text,
address1: Array.isArray(patient.address) ? Array.isArray((_patient$address$ = patient.address[0]) === null || _patient$address$ === void 0 ? void 0 : _patient$address$.line) ? (_patient$address$2 = patient.address[0]) === null || _patient$address$2 === void 0 ? void 0 : _patient$address$2.line[0] : ((_patient$address$3 = patient.address[0]) === null || _patient$address$3 === void 0 ? void 0 : _patient$address$3.line) ? (_patient$address$4 = patient.address[0]) === null || _patient$address$4 === void 0 ? void 0 : _patient$address$4.line : '' : '',
address2: Array.isArray(patient.address) ? Array.isArray((_patient$address$5 = patient.address[0]) === null || _patient$address$5 === void 0 ? void 0 : _patient$address$5.line) ? (_patient$address$6 = patient.address[0]) === null || _patient$address$6 === void 0 ? void 0 : _patient$address$6.line[1] : ((_patient$address$7 = patient.address[0]) === null || _patient$address$7 === void 0 ? void 0 : _patient$address$7.line) ? (_patient$address$8 = patient.address[0]) === null || _patient$address$8 === void 0 ? void 0 : _patient$address$8.line : '' : '',
city: Array.isArray(patient.address) ? (_patient$address$9 = patient.address[0]) === null || _patient$address$9 === void 0 ? void 0 : _patient$address$9.city : patient.address ? patient.address.line : '',
state: Array.isArray(patient.address) ? (_patient$address$10 = patient.address[0]) === null || _patient$address$10 === void 0 ? void 0 : _patient$address$10.state : patient.address ? (_patient$address = patient.address) === null || _patient$address === void 0 ? void 0 : _patient$address.state : '',
postalCode: Array.isArray(patient.address) ? (_patient$address$11 = patient.address[0]) === null || _patient$address$11 === void 0 ? void 0 : _patient$address$11.postalCode : patient.address ? (_patient$address2 = patient.address) === null || _patient$address2 === void 0 ? void 0 : _patient$address2.postalCode : '',
country: Array.isArray(patient.address) ? (_patient$address$12 = patient.address[0]) === null || _patient$address$12 === void 0 ? void 0 : _patient$address$12.country : patient.address ? (_patient$address3 = patient.address) === null || _patient$address3 === void 0 ? void 0 : _patient$address3.country : '',
species: (_patient$animal = patient.animal) === null || _patient$animal === void 0 ? void 0 : (_patient$animal$speci = _patient$animal.species) === null || _patient$animal$speci === void 0 ? void 0 : _patient$animal$speci.text,
language: Array.isArray(patient.communication) ? (_patient$communicatio = patient.communication[0]) === null || _patient$communicatio === void 0 ? void 0 : (_patient$communicatio2 = _patient$communicatio.language) === null || _patient$communicatio2 === void 0 ? void 0 : _patient$communicatio2.text : '',
photo: patient.photo ? patient.photo[0].url : '',
phone: Array.isArray(patient.telecom) && patient.telecom.map(function (el) {
return el.system === 'phone' ? el.value : '';
}).filter(function (el) {
return !!el;
}),
birthDate: patient.birthDate
});
});
};
var changeState = function changeState(e) {
e.persist && e.persist();
var patientData = currentPatient;
if (moment.isMoment(e)) {
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, {
birthDate: moment(e).format('YYYY-MM-DD')
});
});
patientData.birthDate = moment(e).format('YYYY-MM-DD');
} else {
switch (e.target.name) {
case 'prefix':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.name[0].prefix[0] = e.target.value;
break;
case 'familyName':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.name[0].family[0] = e.target.value;
break;
case 'givenName':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.name[0].given[0] = e.target.value;
break;
case 'suffix':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.name[0].suffix[0] = e.target.value;
break;
case 'identifier':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.identifier[0].value = e.target.value;
break;
case 'deceased':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.deceasedBoolean = e.target.checked;
break;
case 'multipleBirth':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.multipleBirthBoolean = e.target.checked;
break;
case 'gender':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.gender = e.target.value;
break;
case 'maritalStatus':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.maritalStatus.text = e.target.value;
break;
case 'species':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.animal.species.text = e.target.value;
break;
case 'language':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.communication[0].language.text = e.target.value;
break;
case 'photo':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.photo[0].url = e.target.value;
break;
case 'phone':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
patientData.telecom[0].value = e.target.value;
break;
}
}
setCurrentPatient(patientData);
};
var handleSaveButton = function handleSaveButton() {
if (onUpsert) {
onUpsert(currentPatient);
}
};
var handleDeleteButton = function handleDeleteButton() {
if (onDelete) {
onDelete(currentPatient);
}
};
var formButtons;
if (patientId) {
formButtons = /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
id: "updatePatientButton",
onClick: handleSaveButton,
variant: "contained",
color: "primary",
className: classes.actionButtons
}, "Save"), /*#__PURE__*/React.createElement(Button, {
id: "deletePatientButton",
variant: "contained",
onClick: handleDeleteButton,
className: classes.actionButtons
}, "Delete"));
} else {
formButtons = /*#__PURE__*/React.createElement(Button, {
id: "savePatientButton",
variant: "contained",
color: "primary",
onClick: handleSaveButton
}, "Save");
}
return /*#__PURE__*/React.createElement(Card, {
className: classes.paper
}, /*#__PURE__*/React.createElement(CardContent, null, /*#__PURE__*/React.createElement(Grid, {
container: true,
direction: "column",
spacing: 2,
className: classes.grid
}, /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "patientDetailIdInput",
name: "identifier",
label: "Patient ID",
value: form.identifier,
fullWidth: true,
disabled: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(FormGroup, {
row: true,
name: "deceased"
}, /*#__PURE__*/React.createElement(FormControlLabel, {
control: /*#__PURE__*/React.createElement(Checkbox, {
checked: form.deceased,
onChange: changeState,
value: form.deceased,
color: "primary"
}),
label: "Deceased"
}))), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "prefixInput",
name: "prefix",
label: "Prefix",
value: form.prefix,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "givenInput",
name: "givenName",
label: "Given Name",
value: form.givenName,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "familyInput",
name: "familyName",
label: "Family Name",
value: form.familyName,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "suffixInput",
name: "suffix",
label: "Suffix / Maiden",
value: form.suffix,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "maritalStatusInput",
name: "maritalStatus",
label: "Marital Status",
value: form.maritalStatus,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(FormControl, {
component: "fieldset",
className: classes.formControl
}, /*#__PURE__*/React.createElement(FormLabel, {
component: "legend"
}, "Gender"), /*#__PURE__*/React.createElement(RadioGroup, {
"aria-label": "gender",
id: "gender",
name: "gender",
value: form.gender,
onChange: changeState,
row: true
}, /*#__PURE__*/React.createElement(FormControlLabel, {
value: "female",
control: /*#__PURE__*/React.createElement(Radio, null),
label: "Female"
}), /*#__PURE__*/React.createElement(FormControlLabel, {
value: "male",
control: /*#__PURE__*/React.createElement(Radio, null),
label: "Male"
}), /*#__PURE__*/React.createElement(FormControlLabel, {
value: "other",
control: /*#__PURE__*/React.createElement(Radio, null),
label: "Other"
})))), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(CustomDatePicker, {
displayDatePicker: true,
date: form.birthDate,
changeState: changeState,
name: "birthDate",
label: "Birthdate",
fieldVariant: fieldVariant
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(FormGroup, {
row: true,
name: "multipleBirth"
}, /*#__PURE__*/React.createElement(FormControlLabel, {
control: /*#__PURE__*/React.createElement(Checkbox, {
checked: form.multipleBirth,
onChange: changeState,
value: form.multipleBirth,
color: "primary"
}),
label: "Multiple Birth"
}))), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "address1Input",
name: "address1",
label: "Address 1",
value: form.address1,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "address1Input",
name: "address2",
label: "Address 2",
value: form.address2,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "cityInput",
name: "city",
label: "City",
value: form.city,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "stateInput",
name: "state",
label: "State",
value: form.state,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "postalCodeInput",
name: "postalCode",
label: "Postal Code",
value: form.postalCode,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "countryInput",
name: "country",
label: "Country",
value: form.country,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "photoInput",
name: "photo",
label: "Photo",
value: form.photo,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "speciesInput",
name: "species",
label: "Species",
value: form.species,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "languageInput",
name: "language",
label: "Language",
value: form.language,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "phoneInput",
name: "phone",
label: "Phone",
value: form.phone,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})))), /*#__PURE__*/React.createElement(CardActions, null, formButtons));
};
PatientDetail.propTypes = {
patient: propTypes.oneOfType([propTypes.object, propTypes.bool]),
onDelete: propTypes.func,
onUpsert: propTypes.func,
onSave: propTypes.func,
onCancel: propTypes.func,
fieldVariant: propTypes.string
};
var PatientBanner = function PatientBanner(_ref) {
var patient = _ref.patient;
var useStyles = makeStyles(function (theme) {
return {
root: {
display: 'flex'
},
margin: {
margin: theme.spacing(2),
padding: theme.spacing(1)
},
deceasedIndicator: {
position: 'float',
color: 'red',
margin: theme.spacing(1)
}
};
});
var classes = useStyles();
var _useState = useState({
prefix: '',
familyName: '',
givenName: '',
suffix: '',
identifier: '',
deceased: false,
multipleBirth: false,
maritalStatus: '',
species: '',
language: '',
gender: '',
phone: [],
email: [],
birthDate: {},
photo: ''
}),
_useState2 = _slicedToArray(_useState, 2),
currentPatient = _useState2[0],
setCurrentPatient = _useState2[1];
useEffect(function () {
dehydratePatientResource(patient);
}, [patient]);
var dehydratePatientResource = function dehydratePatientResource(patient) {
if (patient && Object.keys(patient).length !== 0) {
setCurrentPatient(function (prevCurrentPatient) {
var _patient$name$, _patient$name$2, _patient$name$3, _patient$name$4, _patient$identifier$, _patient$identifier$$, _patient$identifier$$2, _patient$address$, _patient$address$2, _patient$address$3, _patient$address$4, _patient$address$5, _patient$address$6, _patient$address$7, _patient$address$8, _patient$address$9, _patient$address$10, _patient$address, _patient$address$11, _patient$address2, _patient$address$12, _patient$address3, _patient$animal, _patient$animal$speci, _patient$communicatio, _patient$communicatio2;
return _objectSpread2(_objectSpread2({}, prevCurrentPatient), {}, {
prefix: Array.isArray((_patient$name$ = patient.name[0]) === null || _patient$name$ === void 0 ? void 0 : _patient$name$.prefix) ? patient.name[0].prefix[0] : patient.name[0].prefix,
familyName: Array.isArray((_patient$name$2 = patient.name[0]) === null || _patient$name$2 === void 0 ? void 0 : _patient$name$2.family) ? patient.name[0].family[0] : patient.name[0].family,
givenName: Array.isArray((_patient$name$3 = patient.name[0]) === null || _patient$name$3 === void 0 ? void 0 : _patient$name$3.given) ? patient.name[0].given[0] : patient.name[0].given,
suffix: Array.isArray((_patient$name$4 = patient.name[0]) === null || _patient$name$4 === void 0 ? void 0 : _patient$name$4.suffix) ? patient.name[0].suffix[0] : patient.name[0].suffix,
identifier: patient.identifier[0].value,
identifierType: (_patient$identifier$ = patient.identifier[0]) === null || _patient$identifier$ === void 0 ? void 0 : (_patient$identifier$$ = _patient$identifier$.type) === null || _patient$identifier$$ === void 0 ? void 0 : (_patient$identifier$$2 = _patient$identifier$$.coding[0]) === null || _patient$identifier$$2 === void 0 ? void 0 : _patient$identifier$$2.code,
deceased: patient.deceasedBoolean,
multipleBirth: patient.multipleBirthBoolean,
gender: patient.gender,
maritalStatus: patient.maritalStatus.text,
address1: Array.isArray(patient.address) ? Array.isArray((_patient$address$ = patient.address[0]) === null || _patient$address$ === void 0 ? void 0 : _patient$address$.line) ? (_patient$address$2 = patient.address[0]) === null || _patient$address$2 === void 0 ? void 0 : _patient$address$2.line[0] : ((_patient$address$3 = patient.address[0]) === null || _patient$address$3 === void 0 ? void 0 : _patient$address$3.line) ? (_patient$address$4 = patient.address[0]) === null || _patient$address$4 === void 0 ? void 0 : _patient$address$4.line : '' : '',
address2: Array.isArray(patient.address) ? Array.isArray((_patient$address$5 = patient.address[0]) === null || _patient$address$5 === void 0 ? void 0 : _patient$address$5.line) ? (_patient$address$6 = patient.address[0]) === null || _patient$address$6 === void 0 ? void 0 : _patient$address$6.line[1] : ((_patient$address$7 = patient.address[0]) === null || _patient$address$7 === void 0 ? void 0 : _patient$address$7.line) ? (_patient$address$8 = patient.address[0]) === null || _patient$address$8 === void 0 ? void 0 : _patient$address$8.line : '' : '',
city: Array.isArray(patient.address) ? (_patient$address$9 = patient.address[0]) === null || _patient$address$9 === void 0 ? void 0 : _patient$address$9.city : patient.address ? patient.address.line : '',
state: Array.isArray(patient.address) ? (_patient$address$10 = patient.address[0]) === null || _patient$address$10 === void 0 ? void 0 : _patient$address$10.state : patient.address ? (_patient$address = patient.address) === null || _patient$address === void 0 ? void 0 : _patient$address.state : '',
postalCode: Array.isArray(patient.address) ? (_patient$address$11 = patient.address[0]) === null || _patient$address$11 === void 0 ? void 0 : _patient$address$11.postalCode : patient.address ? (_patient$address2 = patient.address) === null || _patient$address2 === void 0 ? void 0 : _patient$address2.postalCode : '',
country: Array.isArray(patient.address) ? (_patient$address$12 = patient.address[0]) === null || _patient$address$12 === void 0 ? void 0 : _patient$address$12.country : patient.address ? (_patient$address3 = patient.address) === null || _patient$address3 === void 0 ? void 0 : _patient$address3.country : '',
species: (_patient$animal = patient.animal) === null || _patient$animal === void 0 ? void 0 : (_patient$animal$speci = _patient$animal.species) === null || _patient$animal$speci === void 0 ? void 0 : _patient$animal$speci.text,
language: Array.isArray(patient.communication) ? (_patient$communicatio = patient.communication[0]) === null || _patient$communicatio === void 0 ? void 0 : (_patient$communicatio2 = _patient$communicatio.language) === null || _patient$communicatio2 === void 0 ? void 0 : _patient$communicatio2.text : '',
photo: patient.photo ? patient.photo[0].url : '',
phone: Array.isArray(patient.telecom) && patient.telecom.map(function (el) {
return el.system === 'phone' ? el.value : '';
}).filter(function (el) {
return !!el;
}),
email: Array.isArray(patient.telecom) && patient.telecom.map(function (el) {
return el.system === 'email' ? el.value : '';
}).filter(function (el) {
return !!el;
}),
birthDate: patient.birthDate
});
});
}
};
return /*#__PURE__*/React.createElement(Paper, null, /*#__PURE__*/React.createElement(Grid, {
container: true,
spacing: 1,
className: classes.margin
}, /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: 12,
md: 6
}, /*#__PURE__*/React.createElement(Grid, {
container: true,
spacing: 1,
direction: "column"
}, /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Grid, {
container: true,
spacing: 1,
direction: "row"
}, currentPatient.identifier && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Typography, {
variant: "caption"
}, "ID: ", currentPatient.identifier)), currentPatient.mrn && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Typography, {
variant: "caption"
}, "MRN: ", currentPatient.mrn))), /*#__PURE__*/React.createElement(Typography, {
variant: "h4"
}, currentPatient.givenName, " ", currentPatient.middleName, ' ', currentPatient.familyName, ' ', currentPatient.deceasedDateTime && /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("h6", {
className: classes.deceasedIndicator
}, "DECEASED", ' ', moment(currentPatient.deceasedDateTime).format('MM/DD/YYYY @ HH:mm:ss'))))), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Typography, {
variant: "body1"
}, currentPatient.address1, " ", currentPatient.address2), /*#__PURE__*/React.createElement(Typography, {
variant: "body1"
}, currentPatient.city, currentPatient.state && ',', " ", currentPatient.state, ' ', currentPatient.postalCode)))), /*#__PURE__*/React.createElement(Grid, {
item: true,
xs: 12,
md: 6
}, /*#__PURE__*/React.createElement(Grid, {
container: true,
spacing: 1,
direction: "column"
}, /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Typography, {
variant: "body1"
}, "Age: ", moment().diff(currentPatient.birthDate, 'years'), " / Birth Date: ", moment(currentPatient.birthDate).format('MM/DD/YYYY'))), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Typography, {
variant: "body1"
}, "Gender: ", currentPatient.gender)), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Typography, {
variant: "body1"
}, "Email:", ' ', currentPatient.email.length > 0 && currentPatient.email.join(', '))), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(Typography, {
variant: "body1"
}, "Phone:", ' ', currentPatient.phone.length > 0 && currentPatient.phone.join(', ')))))));
};
PatientBanner.propTypes = {
patient: propTypes.object
};
var useStyles$2 = makeStyles({
hideOnPhone: {
visibility: 'visible',
display: 'table'
},
cellHideOnPhone: {
visibility: 'visible',
display: 'table',
paddingTop: '16px',
maxWidth: '120px'
},
cell: {
paddingTop: '16px'
},
root: {
padding: '0px',
position: 'relative'
},
iconStyle: {
marginLeft: 4,
marginRight: 4,
marginTop: 2,
fontSize: '120%'
},
tableTitle: {
margin: 9
}
});
var ObservationTable = function ObservationTable(_ref) {
var hideActionIcons = _ref.hideActionIcons,
onRemoveRecord = _ref.onRemoveRecord,
onRowClick = _ref.onRowClick,
onCellClick = _ref.onCellClick,
hideBarcodes = _ref.hideBarcodes,
hideSubjects = _ref.hideSubjects,
hideDevices = _ref.hideDevices,
hideValue = _ref.hideValue,
hideCode = _ref.hideCode,
multiline = _ref.multiline,
hideComparator = _ref.hideComparator,
hideCheckboxes = _ref.hideCheckboxes,
appWidth = _ref.appWidth,
observations = _ref.observations,
tableTitle = _ref.tableTitle,
stickyHeader = _ref.stickyHeader,
tableRowSize = _ref.tableRowSize,
tableHeight = _ref.tableHeight;
var classes = useStyles$2();
var _useState = useState([]),
_useState2 = _slicedToArray(_useState, 2),
source = _useState2[0],
setSource = _useState2[1];
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
tableRows = _useState4[0],
setTableRows = _useState4[1];
var flattenObservation = function flattenObservation(observation) {
var _observation$category, _observation$category2, _observation$category3, _observation$category4, _observation$code, _observation$code2, _observation$valueQua, _observation$valueQua2, _observation$valueQua3, _observation$componen, _observation$componen2, _observation$componen3, _observation$componen4, _observation$valueQua4, _observation$valueQua5, _observation$valueQua6, _observation$subject, _observation$device, _observation$category5, _result$valueString;
var result = {
id: '',
meta: '',
category: '',
code: '',
valueString: '',
value: '',
observationValue: '',
subject: '',
subjectId: '',
status: '',
device: '',
createdBy: '',
effectiveDateTime: '',
issued: '',
unit: ''
};
result.id = observation.id ? observation.id : observation.id;
result.category = ((_observation$category = observation.category) === null || _observation$category === void 0 ? void 0 : _observation$category.text) ? (_observation$category2 = observation.category) === null || _observation$category2 === void 0 ? void 0 : _observation$category2.text : observation.category && ((_observation$category3 = observation.category[0]) === null || _observation$category3 === void 0 ? void 0 : (_observation$category4 = _observation$category3.coding[0]) === null || _observation$category4 === void 0 ? void 0 : _observation$category4.display);
result.code = ((_observation$code = observation.code) === null || _observation$code === void 0 ? void 0 : _observation$code.text) ? (_observation$code2 = observation.code) === null || _observation$code2 === void 0 ? void 0 : _observation$code2.text : observation.code.coding[0].display;
result.valueString = ((_observation$valueQua = observation.valueQuantity) === null || _observation$valueQua === void 0 ? void 0 : _observation$valueQua.value) ? "".concat((_observation$valueQua2 = observation.valueQuantity) === null || _observation$valueQua2 === void 0 ? void 0 : _observation$valueQua2.value, " ").concat((_observation$valueQua3 = observation.valueQuantity) === null || _observation$valueQua3 === void 0 ? void 0 : _observation$valueQua3.unit) : "".concat(observation.component && ((_observation$componen = observation.component[0]) === null || _observation$componen === void 0 ? void 0 : (_observation$componen2 = _observation$componen.valueQuantity) === null || _observation$componen2 === void 0 ? void 0 : _observation$componen2.value), " ").concat(observation.component && ((_observation$componen3 = observation.component[0]) === null || _observation$componen3 === void 0 ? void 0 : (_observation$componen4 = _observation$componen3.valueQuantity) === null || _observation$componen4 === void 0 ? void 0 : _observation$componen4.unit));
result.comparator = (_observation$valueQua4 = observation.valueQuantity) === null || _observation$valueQua4 === void 0 ? void 0 : _observation$valueQua4.comparator;
result.observationValue = (_observation$valueQua5 = observation.valueQuantity) === null || _observation$valueQua5 === void 0 ? void 0 : _observation$valueQua5.value;
result.unit = (_observation$valueQua6 = observation.valueQuantity) === null || _observation$valueQua6 === void 0 ? void 0 : _observation$valueQua6.unit;
result.subject = (_observation$subject = observation.subject) === null || _observation$subject === void 0 ? void 0 : _observation$subject.reference;
result.subjectId = observation.subject.reference;
result.device = (_observation$device = observation.device) === null || _observation$device === void 0 ? void 0 : _observation$device.display;
result.status = observation.status;
if (observation.effectiveDateTime) {
result.effectiveDateTime = moment(observation.effectiveDateTime).format('YYYY-MM-DD hh:mm a');
}
if (observation.issued) {
result.effectiveDateTime = moment(observation.issued).format('YYYY-MM-DD hh:mm a');
}
result.meta = (_observation$category5 = observation.category) === null || _observation$category5 === void 0 ? void 0 : _observation$category5.text;
if (((_result$valueString = result.valueString) === null || _result$valueString === void 0 ? void 0 : _result$valueString.length) > 0) {
result.value = result.valueString;
} else {
if (result.comparator) {
result.value = "".concat(result.comparator, " ");
}
result.value = "".concat(result.value + result.observationValue, " ").concat(result.unit);
}
return result;
};
var rowClick = function rowClick(id) {
if (onRowClick) {
onRowClick(id);
}
};
var renderActionIconsHeader = function renderActionIconsHeader() {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, "Actions");
}
};
var renderActionIcons = function renderActionIcons(observation) {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, /*#__PURE__*/React.createElement(Label, {
className: classes.iconStyle,
onClick: function onClick() {
return onMetaClick(observation);
}
}), /*#__PURE__*/React.createElement(Delete, {
className: classes.iconStyle,
onClick: function onClick() {
return removeRecord(observation.id);
}
}));
}
};
var removeRecord = function removeRecord(id) {
console.log('Remove observation ', id);
if (onRemoveRecord) {
onRemoveRecord(id);
}
};
var onMetaClick = function onMetaClick(patient) {
if (onRowClick) {
onRowClick(patient);
}
};
var renderBarcode = function renderBarcode(id) {
if (!hideBarcodes) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "barcode"
}, id));
}
};
var renderBarcodeHeader = function renderBarcodeHeader() {
if (!hideBarcodes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "system-id-header"
}, "System ID");
}
};
var renderSubject = function renderSubject(id) {
if (!hideSubjects) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "name"
}, id);
}
};
var renderSubjectHeader = function renderSubjectHeader() {
if (!hideSubjects) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "name-header"
}, "Subject");
}
};
var renderDevice = function renderDevice(device) {
if (!hideDevices) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "device.display"
}, device);
}
};
var renderDeviceHeader = function renderDeviceHeader() {
if (!hideDevices) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "device.display-header"
}, "Device");
}
};
var renderValue = function renderValue(valueString) {
if (!hideValue) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "value"
}, valueString);
}
};
var renderValueHeader = function renderValueHeader() {
if (!hideValue) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "value-header"
}, "Value");
}
};
var renderCodeHeader = function renderCodeHeader() {
if (!hideCode) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "code-header"
}, "Code");
}
};
var renderCode = function renderCode(code, value) {
if (!hideCode) {
if (multiline) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
className: {
fontWeight: 400
}
}, code), " ", /*#__PURE__*/React.createElement("br", null), value);
}
return /*#__PURE__*/React.createElement(TableCell, {
id: "code"
}, code);
}
};
var renderCategoryHeader = function renderCategoryHeader() {
if (multiline === false) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "category-header"
}, "Category");
}
};
var renderCategory = function renderCategory(category) {
if (multiline === false) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "category"
}, category);
}
};
var renderToggleHeader = function renderToggleHeader() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle-header"
}, "Toggle");
}
};
var renderToggle = function renderToggle() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle"
}, /*#__PURE__*/React.createElement(Checkbox, {
defaultChecked: false,
className: classes.root
}));
}
};
useEffect(function () {
var allTableRows = [];
var observationsToRender = [];
if (observations) {
if (observations.length > 0) {
for (var i = 0; i < observations.length; i++) {
observationsToRender.push(flattenObservation(observations[i]));
}
}
}
if (observationsToRender.length === 0) {
console.log('No observations to render');
} else {
for (var j = 0; j < observationsToRender.length; j++) {
if (multiline) {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "observationRow",
key: j,
onClick: rowClick(observationsToRender[j].id)
}, renderToggle(), renderCategory(observationsToRender[j].category), renderCode(observationsToRender[j].code, observationsToRender[j].value), renderValue(observationsToRender[j].value), renderSubject(observationsToRender[j].subject), /*#__PURE__*/React.createElement(TableCell, {
id: "status"
}, observationsToRender[j].status), renderDevice(observationsToRender[j].device), /*#__PURE__*/React.createElement(TableCell, {
id: "date"
}, observationsToRender[j].effectiveDateTime), renderBarcode(observationsToRender[j].id), renderActionIcons(observationsToRender[j])));
} else {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "observationRow",
key: j,
onClick: rowClick(observationsToRender[j].id)
}, renderToggle(), renderCategory(observationsToRender[j].category), renderCode(observationsToRender[j].code), renderValue(observationsToRender[j].value), renderSubject(observationsToRender[j].subject), /*#__PURE__*/React.createElement(TableCell, {
id: "status"
}, observationsToRender[j].status), renderDevice(observationsToRender[j].device), /*#__PURE__*/React.createElement(TableCell, {
id: "date"
}, observationsToRender[j].effectiveDateTime), renderBarcode(observationsToRender[j].id), renderActionIcons(observationsToRender[j])));
}
}
setTableRows(allTableRows);
}
}, [observations]);
return /*#__PURE__*/React.createElement(Fragment$1, null, tableTitle && /*#__PURE__*/React.createElement(Typography, {
variant: "h6",
gutterBottom: true,
className: classes.tableTitle
}, tableTitle), /*#__PURE__*/React.createElement(Paper, {
style: tableHeight ? {
maxHeight: tableHeight,
overflow: 'auto'
} : null
}, /*#__PURE__*/React.createElement(Table, {
className: classes.table,
"aria-labelledby": "observationTable",
size: tableRowSize,
stickyHeader: stickyHeader,
"aria-label": "Observation table"
}, /*#__PURE__*/React.createElement(TableHead, null, /*#__PURE__*/React.createElement(TableRow, null, renderToggleHeader(), renderCategoryHeader(), renderCodeHeader(), renderValueHeader(), renderSubjectHeader(), /*#__PURE__*/React.createElement(TableCell, {
id: "status"
}, "Status"), renderDeviceHeader(), /*#__PURE__*/React.createElement(TableCell, {
id: "date"
}, "Date"), renderBarcodeHeader(), renderActionIconsHeader())), /*#__PURE__*/React.createElement(TableBody, null, tableRows))));
};
ObservationTable.propTypes = {
observations: propTypes.array,
hideCode: propTypes.bool,
hideBarcodes: propTypes.bool,
hideSubjects: propTypes.bool,
hideDevices: propTypes.bool,
hideComparator: propTypes.bool,
hideValue: propTypes.bool,
hideCheckboxes: propTypes.bool,
hideActionIcons: propTypes.bool,
hideIdentifier: propTypes.bool,
enteredInError: propTypes.bool,
multiline: propTypes.bool,
onCellClick: propTypes.func,
onRowClick: propTypes.func,
onRemoveRecord: propTypes.func,
onActionButtonClick: propTypes.func,
actionButtonLabel: propTypes.string,
tableRowSize: propTypes.string,
stickyHeader: propTypes.string,
tableHeight: propTypes.number
};
var useStyles$3 = makeStyles(function (theme) {
return {
root: {
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
margin: theme.spacing(1),
marginRight: theme.spacing(3)
},
paper: {
margin: theme.spacing(1)
},
grid: {
flexGrow: 1
},
actionButtons: {
margin: theme.spacing(1)
}
};
});
var ObservationDetail = function ObservationDetail(_ref) {
var onUpsert = _ref.onUpsert,
onCancel = _ref.onCancel,
onDelete = _ref.onDelete,
observation = _ref.observation,
fieldVariant = _ref.fieldVariant,
hidePatientInputs = _ref.hidePatientInputs,
hideDeviceInputs = _ref.hideDeviceInputs;
var classes = useStyles$3();
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
observationId = _useState2[0],
setObservationId = _useState2[1];
var _useState3 = useState({
resourceType: 'Observation',
status: 'preliminary',
category: {
text: ''
},
effectiveDateTime: '',
subject: {
display: '',
reference: ''
},
performer: [],
device: {
display: '',
reference: ''
},
valueQuantity: {
value: '',
unit: '',
system: 'http://unitsofmeasure.org'
},
valueString: ''
}),
_useState4 = _slicedToArray(_useState3, 2),
currentObservation = _useState4[0],
setCurrentObservation = _useState4[1];
var _useState5 = useState({
category: '',
code: '',
value: '',
comparator: '',
quantity: '',
unit: '',
deviceDisplay: '',
subjectDisplay: '',
subjectReference: '',
effectiveDateTime: '',
effectiveStartDateTime: '',
effectiveEndDateTime: '',
status: '',
loincCode: '',
loincCodeText: '',
loincCodeDisplay: ''
}),
_useState6 = _slicedToArray(_useState5, 2),
form = _useState6[0],
setForm = _useState6[1];
useEffect(function () {
dehydrateObservationResource(observation);
setObservationId(observation.identifier[0].value);
setCurrentObservation(observation);
}, [observation]);
var dehydrateObservationResource = function dehydrateObservationResource(observation) {
setForm(function (prevForm) {
var _observation$category, _observation$category2, _observation$valueQua, _observation$valueQua2, _observation$valueQua3, _observation$valueQua4, _observation$valueQua5, _observation$valueQua6, _observation$valueQua7, _observation$device, _observation$device2, _observation$subject, _observation$subject2, _observation$subject3, _observation$subject4, _observation$code, _observation$code2, _observation$code3, _observation$code4, _observation$code5, _observation$code6, _observation$code7, _observation$code8, _observation$code9, _observation$code10, _observation$code11, _observation$code12;
return _objectSpread2(_objectSpread2({}, prevForm), {}, {
category: observation.category ? ((_observation$category = observation.category[0]) === null || _observation$category === void 0 ? void 0 : _observation$category.coding) ? (_observation$category2 = observation.category[0]) === null || _observation$category2 === void 0 ? void 0 : _observation$category2.coding[0].display : '' : '',
value: (_observation$valueQua = observation.valueQuantity) === null || _observation$valueQua === void 0 ? void 0 : _observation$valueQua.value,
comparator: ((_observation$valueQua2 = observation.valueQuantity) === null || _observation$valueQua2 === void 0 ? void 0 : _observation$valueQua2.comparator) ? (_observation$valueQua3 = observation.valueQuantity) === null || _observation$valueQua3 === void 0 ? void 0 : _observation$valueQua3.comparator : '',
quantity: ((_observation$valueQua4 = observation.valueQuantity) === null || _observation$valueQua4 === void 0 ? void 0 : _observation$valueQua4.quantity) ? (_observation$valueQua5 = observation.valueQuantity) === null || _observation$valueQua5 === void 0 ? void 0 : _observation$valueQua5.quantity : '',
unit: ((_observation$valueQua6 = observation.valueQuantity) === null || _observation$valueQua6 === void 0 ? void 0 : _observation$valueQua6.unit) ? (_observation$valueQua7 = observation.valueQuantity) === null || _observation$valueQua7 === void 0 ? void 0 : _observation$valueQua7.unit : '',
deviceDisplay: ((_observation$device = observation.device) === null || _observation$device === void 0 ? void 0 : _observation$device.display) ? (_observation$device2 = observation.device) === null || _observation$device2 === void 0 ? void 0 : _observation$device2.display : '',
subjectDisplay: ((_observation$subject = observation.subject) === null || _observation$subject === void 0 ? void 0 : _observation$subject.display) ? (_observation$subject2 = observation.subject) === null || _observation$subject2 === void 0 ? void 0 : _observation$subject2.display : '',
subjectReference: ((_observation$subject3 = observation.subject) === null || _observation$subject3 === void 0 ? void 0 : _observation$subject3.reference) ? (_observation$subject4 = observation.subject) === null || _observation$subject4 === void 0 ? void 0 : _observation$subject4.reference : '',
effectiveDateTime: observation.effectiveDateTime ? observation.effectiveDateTime : '',
effectiveStartDateTime: observation.effectivePeriod && observation.effectivePeriod.start ? observation.effectivePeriod.start : '',
effectiveEndDateTime: observation.effectivePeriod && observation.effectivePeriod.end ? observation.effectivePeriod.end : '',
status: observation.status ? observation.status : '',
loincCode: Array.isArray((_observation$code = observation.code) === null || _observation$code === void 0 ? void 0 : _observation$code.coding) ? (_observation$code2 = observation.code) === null || _observation$code2 === void 0 ? void 0 : _observation$code2.coding.filter(function (code) {
return code.system === 'http://loinc.org' ? code.code : 'No LOINC code listed';
})[0].code : Array.isArray((_observation$code3 = observation.code) === null || _observation$code3 === void 0 ? void 0 : _observation$code3.codeable) ? (_observation$code4 = observation.code) === null || _observation$code4 === void 0 ? void 0 : _observation$code4.codeable[0].code : 'No LOINC code listed',
loincCodeText: Array.isArray((_observation$code5 = observation.code) === null || _observation$code5 === void 0 ? void 0 : _observation$code5.coding) ? (_observation$code6 = observation.code) === null || _observation$code6 === void 0 ? void 0 : _observation$code6.coding.filter(function (code) {
return code.system === 'http://loinc.org' ? code.display : 'No LOINC code listed';
})[0].display : Array.isArray((_observation$code7 = observation.code) === null || _observation$code7 === void 0 ? void 0 : _observation$code7.codeable) ? (_observation$code8 = observation.code) === null || _observation$code8 === void 0 ? void 0 : _observation$code8.codeable[0].display : 'No LOINC code listed',
loincCodeDisplay: Array.isArray((_observation$code9 = observation.code) === null || _observation$code9 === void 0 ? void 0 : _observation$code9.coding) ? (_observation$code10 = observation.code) === null || _observation$code10 === void 0 ? void 0 : _observation$code10.coding.filter(function (code) {
return code.system === 'http://loinc.org' ? code.display : 'No LOINC code listed';
})[0].display : Array.isArray((_observation$code11 = observation.code) === null || _observation$code11 === void 0 ? void 0 : _observation$code11.codeable) ? (_observation$code12 = observation.code) === null || _observation$code12 === void 0 ? void 0 : _observation$code12.codeable[0].display : 'No LOINC code listed'
});
});
};
var changeState = function changeState(e) {
e.persist && e.persist();
var observationData = currentObservation;
if (moment.isMoment(e)) {
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, {
effectiveDateTime: moment(e).format('YYYY-MM-DD')
});
});
observationData.effectiveDateTime = moment(e).format('YYYY-MM-DD');
} else {
switch (e.target.name) {
case 'category':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.category[0].coding[0].display = e.target.value;
break;
case 'value':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.valueQuantity.value = e.target.value;
break;
case 'comparator':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
}); // observationData.valueQuantity.comparator = e.target.value
break;
case 'quantity':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.valueQuantity.quantity = e.target.value;
break;
case 'unit':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.valueQuantity.unit = e.target.value;
break;
case 'deviceDisplay':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.device.display = e.target.value;
break;
case 'subjectDisplay':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.subject.display = e.target.value;
break;
case 'subjectReference':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.subject.reference = e.target.value;
break;
case 'status':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.status = e.target.value;
break;
case 'loincCode':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.code.coding[0].code = e.target.value;
break;
case 'loincCodeText':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.code.coding[0].display = e.target.value;
break;
case 'loincCodeDisplay':
setForm(function (prevForm) {
return _objectSpread2(_objectSpread2({}, prevForm), {}, _defineProperty({}, e.target.name, e.target.value));
});
observationData.code.coding[0].display = e.target.value;
break;
}
}
setCurrentObservation(observationData);
};
var handleSaveButton = function handleSaveButton() {
if (onUpsert) {
onUpsert(currentObservation);
}
};
var handleDeleteButton = function handleDeleteButton() {
if (onDelete) {
onDelete(currentObservation);
}
};
var formButtons;
if (observationId) {
formButtons = /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
id: "updateObservationButton",
onClick: handleSaveButton,
variant: "contained",
color: "primary",
className: classes.actionButtons
}, "Save"), /*#__PURE__*/React.createElement(Button, {
id: "deleteObservationButton",
variant: "contained",
onClick: handleDeleteButton,
className: classes.actionButtons
}, "Delete"));
} else {
formButtons = /*#__PURE__*/React.createElement(Button, {
id: "saveObservationButton",
variant: "contained",
color: "primary",
onClick: handleSaveButton
}, "Save");
}
return /*#__PURE__*/React.createElement(Card, {
className: classes.paper
}, /*#__PURE__*/React.createElement(CardContent, null, /*#__PURE__*/React.createElement(Grid, {
container: true,
direction: "column",
spacing: 2,
className: classes.grid
}, /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "loincCodeTextInput",
name: "loincCodeText",
label: "LOINC Code Text",
value: form.loincCodeText,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "loincCodeInput",
name: "loincCode",
label: "LOINC Code",
value: form.loincCode,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "comparatorInput",
name: "comparator",
label: "Comparator",
value: form.comparator,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "valueQuantityInput",
name: "quantity",
label: "Quantity",
value: form.quantity,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "valueQuantityUnitInput",
name: "unit",
label: "Unit",
value: form.unit,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "valueStringInput",
name: "value",
label: "Observation Value",
value: form.value,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "statusInput",
name: "status",
label: "Status",
value: form.status,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), hideDeviceInputs && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "deviceDisplayInput",
name: "deviceDisplay",
label: "Device Name",
value: form.deviceDisplay,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), hideDeviceInputs && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "deviceReferenceInput",
name: "deviceReference",
label: "Device ID",
value: form.deviceReference,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), form.effectiveDateTime && form.effectiveDateTime !== '' && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(CustomDatePicker, {
displayDatePicker: true,
date: form.effectiveDateTime,
changeState: changeState,
name: "effectiveDateTime",
label: "Effective Date",
fieldVariant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), form.effectiveStartDateTime && form.effectiveStartDateTime !== '' && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(CustomDatePicker, {
displayDatePicker: true,
date: form.effectiveStartDateTime,
changeState: changeState,
name: "effectiveStartDateTime",
label: "Effective Start Date",
fieldVariant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), form.effectiveEndDateTime && form.effectiveEndDateTime !== '' && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(CustomDatePicker, {
displayDatePicker: true,
date: form.effectiveEndDateTime,
changeState: changeState,
name: "effectiveEndDateTime",
label: "Effective End Date",
fieldVariant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "categoryTextInput",
name: "category",
label: "Category",
value: form.category,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), !hidePatientInputs && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "subjectDisplayInput",
name: "subjectDisplay",
label: "Subject Name",
value: form.subjectDisplay,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})), !hidePatientInputs && /*#__PURE__*/React.createElement(Grid, {
item: true
}, /*#__PURE__*/React.createElement(TextField, {
id: "subjectIdInput",
name: "subjectReference",
label: "Subject ID",
value: form.subjectReference,
onChange: changeState,
fullWidth: true,
variant: fieldVariant,
size: "small",
InputLabelProps: {
shrink: true
}
})))), /*#__PURE__*/React.createElement(CardActions, null, formButtons));
};
ObservationDetail.propTypes = {
observationId: propTypes.oneOfType([propTypes.string, propTypes.bool]),
observation: propTypes.oneOfType([propTypes.object, propTypes.bool]),
hidePatientInputs: propTypes.bool,
hideDeviceInputs: propTypes.bool,
onInsert: propTypes.func,
onUpsert: propTypes.func,
onRemove: propTypes.func,
onCancel: propTypes.func,
fieldVariant: propTypes.string
};
var useStyles$4 = makeStyles({
hideOnPhone: {
visibility: 'visible',
display: 'table'
},
tableTitle: {
margin: 9
},
cellHideOnPhone: {
visibility: 'visible',
display: 'table',
paddingTop: '16px',
maxWidth: '120px'
},
cell: {
paddingTop: '16px'
},
root: {
padding: '0px',
position: 'relative'
},
iconStyle: {
marginLeft: 4,
marginRight: 4,
marginTop: 2,
fontSize: '120%'
}
});
var AllergyTable = function AllergyTable(_ref) {
var allergies = _ref.allergies,
hideCheckboxes = _ref.hideCheckboxes,
hideCode = _ref.hideCode,
hideRecorder = _ref.hideRecorder,
hideReaction = _ref.hideReaction,
hideCriticality = _ref.hideCriticality,
hideClinicalStatus = _ref.hideClinicalStatus,
hideVerificationStatus = _ref.hideVerificationStatus,
hideActionIcons = _ref.hideActionIcons,
hideIdentifier = _ref.hideIdentifier,
multiline = _ref.multiline,
onCellClick = _ref.onCellClick,
onRowClick = _ref.onRowClick,
onRemoveRecord = _ref.onRemoveRecord,
onActionButtonClick = _ref.onActionButtonClick,
actionButtonLabel = _ref.actionButtonLabel,
tableTitle = _ref.tableTitle,
tableRowSize = _ref.tableRowSize,
stickyHeader = _ref.stickyHeader,
tableHeight = _ref.tableHeight;
var classes = useStyles$4();
var _useState = useState([]),
_useState2 = _slicedToArray(_useState, 2),
source = _useState2[0],
setSource = _useState2[1];
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
tableRows = _useState4[0],
setTableRows = _useState4[1];
var flattenAllergy = function flattenAllergy(allergy) {
var _allergy$code, _allergy$code2, _allergy$patient, _allergy$reaction$, _allergy$reaction$$ma, _allergy$reaction$$ma2, _allergy$recorder;
var result = {
id: '',
meta: '',
category: '',
criticality: '',
code: '',
codeText: '',
subject: '',
clinicalStatus: '',
verificationStatus: '',
recorder: '',
recordedDate: '',
reaction: ''
};
result.id = allergy.id ? allergy.id : allergy.id;
result.category = Array.isArray(allergy.category) ? allergy.category : '';
result.code = Array.isArray((_allergy$code = allergy.code) === null || _allergy$code === void 0 ? void 0 : _allergy$code.coding) ? allergy.code.coding[0].code : '';
result.codeText = Array.isArray((_allergy$code2 = allergy.code) === null || _allergy$code2 === void 0 ? void 0 : _allergy$code2.coding) ? allergy.code.coding[0].display : '';
result.subject = (_allergy$patient = allergy.patient) === null || _allergy$patient === void 0 ? void 0 : _allergy$patient.reference;
result.clinicalStatus = Array.isArray(allergy.clinicalStatus.coding) ? allergy.clinicalStatus.coding[0].display : '';
result.verificationStatus = Array.isArray(allergy.verificationStatus.coding) ? allergy.verificationStatus.coding[0].display : '';
result.criticality = allergy.criticality || '';
result.reaction = Array.isArray(allergy.reaction) ? (_allergy$reaction$ = allergy.reaction[0]) === null || _allergy$reaction$ === void 0 ? void 0 : (_allergy$reaction$$ma = _allergy$reaction$.manifestation[0]) === null || _allergy$reaction$$ma === void 0 ? void 0 : (_allergy$reaction$$ma2 = _allergy$reaction$$ma.coding[0]) === null || _allergy$reaction$$ma2 === void 0 ? void 0 : _allergy$reaction$$ma2.display : '';
result.recorder = ((_allergy$recorder = allergy.recorder) === null || _allergy$recorder === void 0 ? void 0 : _allergy$recorder.reference) || '';
if (allergy.recordedDate) {
result.effectiveDateTime = moment(allergy.recordedDate).format('YYYY-MM-DD hh:mm a');
}
return result;
};
var rowClick = function rowClick(id) {
if (onRowClick) {
onRowClick(id);
}
};
var renderActionIconsHeader = function renderActionIconsHeader() {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, "Actions");
}
};
var renderActionIcons = function renderActionIcons(allergy) {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, /*#__PURE__*/React.createElement(Label, {
className: classes.iconStyle,
onClick: function onClick() {
return onActionButtonClick(allergy);
}
}), /*#__PURE__*/React.createElement(Delete, {
className: classes.iconStyle,
onClick: function onClick() {
return removeRecord(allergy.id);
}
}));
}
};
var removeRecord = function removeRecord(id) {
console.log('Remove allergy ', id);
if (onRemoveRecord) {
onRemoveRecord(id);
}
};
var renderId = function renderId(id) {
if (!hideIdentifier) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "identifier"
}, id));
}
};
var renderIdHeader = function renderIdHeader() {
if (!hideIdentifier) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "id-header"
}, "ID");
}
};
var renderRecorder = function renderRecorder(recorder) {
if (!hideRecorder) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "recorder"
}, recorder);
}
};
var renderRecorderHeader = function renderRecorderHeader() {
if (!hideRecorder) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "recorder-header"
}, "Recorder");
}
};
var renderReaction = function renderReaction(reaction) {
if (!hideReaction) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "reaction"
}, reaction);
}
};
var renderReactionHeader = function renderReactionHeader() {
if (!hideReaction) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "reaction-header"
}, "Reaction");
}
};
var renderRecorderDate = function renderRecorderDate(recorderDate) {
if (!hideRecorder) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "recorder-date"
}, moment(recorderDate).format('MM/DD/YYYY HH:mm:ss'));
}
};
var renderRecorderDateHeader = function renderRecorderDateHeader() {
if (!hideRecorder) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "recorder-date-header"
}, "Date Recorded");
}
};
var renderCriticality = function renderCriticality(criticality) {
if (!hideCriticality) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "criticality"
}, criticality);
}
};
var renderCriticalityHeader = function renderCriticalityHeader() {
if (!hideCriticality) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "criticality-header"
}, "Criticality");
}
};
var renderClinicalStatus = function renderClinicalStatus(clinicalStatus) {
if (!hideClinicalStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "clinicalStatus"
}, clinicalStatus);
}
};
var renderClinicalStatusHeader = function renderClinicalStatusHeader() {
if (!hideClinicalStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "clinicalStatus-header"
}, "Clinical Status");
}
};
var renderVerificationStatus = function renderVerificationStatus(verificationStatus) {
if (!hideVerificationStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "verificationStatus"
}, verificationStatus);
}
};
var renderVerificationStatusHeader = function renderVerificationStatusHeader() {
if (!hideVerificationStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "verificationStatus-header"
}, "Verification Status");
}
};
var renderCodeHeader = function renderCodeHeader() {
if (!hideCode) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "code-header"
}, "Code");
}
};
var renderCode = function renderCode(code, value) {
if (!hideCode) {
if (multiline) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
className: {
fontWeight: 400
}
}, code), " ", /*#__PURE__*/React.createElement("br", null), value);
}
return /*#__PURE__*/React.createElement(TableCell, {
id: "code"
}, code);
}
};
var renderCodeTextHeader = function renderCodeTextHeader() {
if (!hideCode) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "code-header"
}, "Code Text");
}
};
var renderCodeText = function renderCodeText(code, value) {
if (!hideCode) {
if (multiline) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
className: {
fontWeight: 400
}
}, code), " ", /*#__PURE__*/React.createElement("br", null), value);
}
return /*#__PURE__*/React.createElement(TableCell, {
id: "code"
}, code);
}
};
var renderCategoryHeader = function renderCategoryHeader() {
if (multiline === false) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "category-header"
}, "Category");
}
};
var renderCategory = function renderCategory(category) {
if (multiline === false) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "category"
}, category);
}
};
var renderToggleHeader = function renderToggleHeader() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle-header"
}, "Toggle");
}
};
var renderToggle = function renderToggle() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle"
}, /*#__PURE__*/React.createElement(Checkbox, {
defaultChecked: false,
className: classes.root
}));
}
};
useEffect(function () {
var allTableRows = [];
var allergiesToRender = [];
if (allergies) {
if (allergies.length > 0) {
for (var i = 0; i < allergies.length; i++) {
allergiesToRender.push(flattenAllergy(allergies[i]));
}
}
}
if (allergiesToRender.length === 0) {
console.log('No allergies to render');
} else {
for (var j = 0; j < allergiesToRender.length; j++) {
if (multiline) {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "allergyRow",
key: j,
onClick: rowClick(allergiesToRender[j].id)
}, renderToggle(), renderCodeText(allergiesToRender[j].codeText), renderCode(allergiesToRender[j].code), renderCategory(allergiesToRender[j].category), renderClinicalStatus(allergiesToRender[j].clinicalStatus), renderVerificationStatus(allergiesToRender[j].verificationStatus), renderRecorder(allergiesToRender[j].recorder), renderRecorderDate(allergiesToRender[j].recorderDate), renderReaction(allergiesToRender[j].reaction), renderCriticality(allergiesToRender[j].criticality), renderId(allergiesToRender[j].id), renderActionIcons(allergiesToRender[j])));
} else {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "allergyRow",
key: j,
onClick: rowClick(allergiesToRender[j].id)
}, renderToggle(), renderCodeText(allergiesToRender[j].codeText), renderCode(allergiesToRender[j].code), renderCategory(allergiesToRender[j].category), renderClinicalStatus(allergiesToRender[j].clinicalStatus), renderVerificationStatus(allergiesToRender[j].verificationStatus), renderRecorder(allergiesToRender[j].recorder), renderRecorderDate(allergiesToRender[j].recorderDate), renderReaction(allergiesToRender[j].reaction), renderCriticality(allergiesToRender[j].criticality), renderId(allergiesToRender[j].id), renderActionIcons(allergiesToRender[j])));
}
}
setTableRows(allTableRows);
}
}, [allergies]);
return /*#__PURE__*/React.createElement(Fragment$1, null, tableTitle && /*#__PURE__*/React.createElement(Typography, {
variant: "h6",
gutterBottom: true,
className: classes.tableTitle
}, tableTitle), /*#__PURE__*/React.createElement(Paper, {
style: tableHeight ? {
maxHeight: tableHeight,
overflow: 'auto'
} : null
}, /*#__PURE__*/React.createElement(Table, {
className: classes.table,
"aria-labelledby": "allergyTable",
size: tableRowSize,
stickyHeader: stickyHeader,
"aria-label": "Allergy table"
}, /*#__PURE__*/React.createElement(TableHead, null, /*#__PURE__*/React.createElement(TableRow, null, renderToggleHeader(), renderCodeTextHeader(), renderCodeHeader(), renderCategoryHeader(), renderClinicalStatusHeader(), renderVerificationStatusHeader(), renderRecorderHeader(), renderRecorderDateHeader(), renderReactionHeader(), renderCriticalityHeader(), renderIdHeader(), renderActionIconsHeader())), /*#__PURE__*/React.createElement(TableBody, null, tableRows))));
};
AllergyTable.propTypes = {
allergies: propTypes.array,
hideCheckboxes: propTypes.bool,
hideCode: propTypes.bool,
hideRecorder: propTypes.bool,
hideReaction: propTypes.bool,
hideCriticality: propTypes.bool,
hideClinicalStatus: propTypes.bool,
hideVerificationStatus: propTypes.bool,
hideActionIcons: propTypes.bool,
hideIdentifier: propTypes.bool,
multiline: propTypes.bool,
onCellClick: propTypes.func,
onRowClick: propTypes.func,
onRemoveRecord: propTypes.func,
onActionButtonClick: propTypes.func,
actionButtonLabel: propTypes.string,
tableRowSize: propTypes.string,
stickyHeader: propTypes.string,
tableHeight: propTypes.number
};
var useStyles$5 = makeStyles({
hideOnPhone: {
visibility: 'visible',
display: 'table'
},
tableTitle: {
margin: 9
},
cellHideOnPhone: {
visibility: 'visible',
display: 'table',
paddingTop: '16px',
maxWidth: '120px'
},
cell: {
paddingTop: '16px'
},
root: {
padding: '0px',
position: 'relative'
},
iconStyle: {
marginLeft: 4,
marginRight: 4,
marginTop: 2,
fontSize: '120%'
}
});
var ConditionTable = function ConditionTable(_ref) {
var conditions = _ref.conditions,
hideCheckboxes = _ref.hideCheckboxes,
hideCode = _ref.hideCode,
hideAsserter = _ref.hideAsserter,
hideCategory = _ref.hideCategory,
hideClinicalStatus = _ref.hideClinicalStatus,
hideVerificationStatus = _ref.hideVerificationStatus,
hideRecordedDate = _ref.hideRecordedDate,
hideOnsetDateTime = _ref.hideOnsetDateTime,
hideSeverity = _ref.hideSeverity,
hideBodySite = _ref.hideBodySite,
hideEncounter = _ref.hideEncounter,
hideSubject = _ref.hideSubject,
hideEvidence = _ref.hideEvidence,
hideActionIcons = _ref.hideActionIcons,
hideIdentifier = _ref.hideIdentifier,
multiline = _ref.multiline,
onCellClick = _ref.onCellClick,
onRowClick = _ref.onRowClick,
onRemoveRecord = _ref.onRemoveRecord,
onActionButtonClick = _ref.onActionButtonClick,
actionButtonLabel = _ref.actionButtonLabel,
tableTitle = _ref.tableTitle,
tableRowSize = _ref.tableRowSize,
stickyHeader = _ref.stickyHeader,
tableHeight = _ref.tableHeight;
var classes = useStyles$5();
var _useState = useState([]),
_useState2 = _slicedToArray(_useState, 2),
source = _useState2[0],
setSource = _useState2[1];
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
tableRows = _useState4[0],
setTableRows = _useState4[1];
var flattenCondition = function flattenCondition(condition) {
var _condition$category$, _condition$category$$, _condition$code, _condition$code2, _condition$subject, _condition$reaction$, _condition$reaction$$, _condition$reaction$$2, _condition$asserter, _condition$severity, _condition$severity2, _condition$evidence$, _condition$evidence$$, _condition$evidence$$2;
var result = {
id: '',
meta: '',
category: '',
code: '',
codeText: '',
subject: '',
clinicalStatus: '',
verificationStatus: '',
onsetDateTime: '',
recordedDate: '',
severity: '',
bodySite: '',
encounter: '',
asserter: '',
evidence: ''
};
result.id = condition.id ? condition.id : condition.id;
result.category = Array.isArray(condition.category) ? (_condition$category$ = condition.category[0]) === null || _condition$category$ === void 0 ? void 0 : (_condition$category$$ = _condition$category$.coding[0]) === null || _condition$category$$ === void 0 ? void 0 : _condition$category$$.display : '';
result.code = Array.isArray((_condition$code = condition.code) === null || _condition$code === void 0 ? void 0 : _condition$code.coding) ? condition.code.coding[0].code : '';
result.codeText = Array.isArray((_condition$code2 = condition.code) === null || _condition$code2 === void 0 ? void 0 : _condition$code2.coding) ? condition.code.coding[0].display : condition.code.text ? condition.code.text : '';
result.subject = (_condition$subject = condition.subject) === null || _condition$subject === void 0 ? void 0 : _condition$subject.reference;
result.clinicalStatus = Array.isArray(condition.clinicalStatus.coding) ? condition.clinicalStatus.coding[0].code : '';
result.verificationStatus = Array.isArray(condition.verificationStatus.coding) ? condition.verificationStatus.coding[0].code : '';
result.criticality = condition.criticality || '';
result.reaction = Array.isArray(condition.reaction) ? (_condition$reaction$ = condition.reaction[0]) === null || _condition$reaction$ === void 0 ? void 0 : (_condition$reaction$$ = _condition$reaction$.manifestation[0]) === null || _condition$reaction$$ === void 0 ? void 0 : (_condition$reaction$$2 = _condition$reaction$$.coding[0]) === null || _condition$reaction$$2 === void 0 ? void 0 : _condition$reaction$$2.display : '';
result.asserter = ((_condition$asserter = condition.asserter) === null || _condition$asserter === void 0 ? void 0 : _condition$asserter.display) || '';
result.onsetDateTime = condition.onsetDateTime ? moment(condition.onsetDateTime).format('YYYY-MM-DD') : '';
result.severity = Array.isArray((_condition$severity = condition.severity) === null || _condition$severity === void 0 ? void 0 : _condition$severity.coding) ? (_condition$severity2 = condition.severity) === null || _condition$severity2 === void 0 ? void 0 : _condition$severity2.coding[0].display : '';
result.bodySite = Array.isArray(condition.bodySite) ? condition.bodySite[0].coding[0].display : '';
result.encounter = condition.encounter ? condition.encounter.reference : '';
result.evidence = Array.isArray(condition.evidence) ? (_condition$evidence$ = condition.evidence[0]) === null || _condition$evidence$ === void 0 ? void 0 : (_condition$evidence$$ = _condition$evidence$.code[0]) === null || _condition$evidence$$ === void 0 ? void 0 : (_condition$evidence$$2 = _condition$evidence$$.coding[0]) === null || _condition$evidence$$2 === void 0 ? void 0 : _condition$evidence$$2.display : '';
result.recordedDate = condition.recordedDate ? moment(condition.recordedDate).format('YYYY-MM-DD') : '';
return result;
};
var rowClick = function rowClick(id) {
if (onRowClick) {
onRowClick(id);
}
};
var renderActionIconsHeader = function renderActionIconsHeader() {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, "Actions");
}
};
var renderActionIcons = function renderActionIcons(condition) {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, /*#__PURE__*/React.createElement(Label, {
className: classes.iconStyle,
onClick: function onClick() {
return onActionButtonClick(condition);
}
}), /*#__PURE__*/React.createElement(Delete, {
className: classes.iconStyle,
onClick: function onClick() {
return removeRecord(condition.id);
}
}));
}
};
var removeRecord = function removeRecord(id) {
console.log('Remove condition ', id);
if (onRemoveRecord) {
onRemoveRecord(id);
}
};
var renderId = function renderId(id) {
if (!hideIdentifier) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "identifier"
}, id));
}
};
var renderIdHeader = function renderIdHeader() {
if (!hideIdentifier) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "id-header"
}, "ID");
}
};
var renderAsserter = function renderAsserter(asserter) {
if (!hideAsserter) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "asserter"
}, asserter);
}
};
var renderAsserterHeader = function renderAsserterHeader() {
if (!hideAsserter) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "asserter-header"
}, "Asserter");
}
};
var renderBodySite = function renderBodySite(bodySite) {
if (!hideBodySite) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "bodySite"
}, bodySite);
}
};
var renderBodySiteHeader = function renderBodySiteHeader() {
if (!hideBodySite) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "bodySite-header"
}, "Body Site");
}
};
var renderRecordedDate = function renderRecordedDate(recordedDate) {
if (!hideRecordedDate) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "recorded-date"
}, moment(recordedDate).format('MM/DD/YYYY'));
}
};
var renderRecordedDateHeader = function renderRecordedDateHeader() {
if (!hideRecordedDate) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "recorded-date-header"
}, "Date Recorded");
}
};
var renderOnsetDateTime = function renderOnsetDateTime(onsetDateTime) {
if (!hideOnsetDateTime) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "onset-datetime"
}, moment(onsetDateTime).format('MM/DD/YYYY'));
}
};
var renderOnsetDateTimeHeader = function renderOnsetDateTimeHeader() {
if (!hideOnsetDateTime) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "onset-datetime-header"
}, "Onset Date");
}
};
var renderSeverity = function renderSeverity(severity) {
if (!hideSeverity) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "severity"
}, severity);
}
};
var renderSeverityHeader = function renderSeverityHeader() {
if (!hideSeverity) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "severity-header"
}, "Severity");
}
};
var renderEncounter = function renderEncounter(encounter) {
if (!hideEncounter) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "encounter"
}, encounter);
}
};
var renderEncounterHeader = function renderEncounterHeader() {
if (!hideEncounter) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "encounter-header"
}, "Encounter");
}
};
var renderEvidence = function renderEvidence(evidence) {
console.log('renderEvidence Evidence: ', evidence);
if (!hideEvidence) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "evidence"
}, evidence);
}
};
var renderEvidenceHeader = function renderEvidenceHeader() {
if (!hideEvidence) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "evidence-header"
}, "Evidence");
}
};
var renderClinicalStatus = function renderClinicalStatus(clinicalStatus) {
if (!hideClinicalStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "clinicalStatus"
}, clinicalStatus);
}
};
var renderClinicalStatusHeader = function renderClinicalStatusHeader() {
if (!hideClinicalStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "clinicalStatus-header"
}, "Clinical Status");
}
};
var renderVerificationStatus = function renderVerificationStatus(verificationStatus) {
if (!hideVerificationStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "verificationStatus"
}, verificationStatus);
}
};
var renderVerificationStatusHeader = function renderVerificationStatusHeader() {
if (!hideVerificationStatus) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "verificationStatus-header"
}, "Verification Status");
}
};
var renderCodeHeader = function renderCodeHeader() {
if (!hideCode) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "code-header"
}, "Code");
}
};
var renderCode = function renderCode(code, value) {
if (!hideCode) {
if (multiline) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
className: {
fontWeight: 400
}
}, code), " ", /*#__PURE__*/React.createElement("br", null), value);
}
return /*#__PURE__*/React.createElement(TableCell, {
id: "code"
}, code);
}
};
var renderCodeTextHeader = function renderCodeTextHeader() {
if (!hideCode) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "code-header"
}, "Code Text");
}
};
var renderCodeText = function renderCodeText(code, value) {
if (!hideCode) {
if (multiline) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
className: {
fontWeight: 400
}
}, code), " ", /*#__PURE__*/React.createElement("br", null), value);
}
return /*#__PURE__*/React.createElement(TableCell, {
id: "code"
}, code);
}
};
var renderCategoryHeader = function renderCategoryHeader() {
if (multiline === false) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "category-header"
}, "Category");
}
};
var renderCategory = function renderCategory(category) {
if (multiline === false) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "category"
}, category);
}
};
var renderSubjectHeader = function renderSubjectHeader() {
if (!hideSubject) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "subject-header"
}, "Subject");
}
};
var renderSubject = function renderSubject(subject) {
if (!hideSubject) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "subject"
}, subject);
}
};
var renderToggleHeader = function renderToggleHeader() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle-header"
}, "Toggle");
}
};
var renderToggle = function renderToggle() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle"
}, /*#__PURE__*/React.createElement(Checkbox, {
defaultChecked: false,
className: classes.root
}));
}
};
useEffect(function () {
var allTableRows = [];
var conditionsToRender = [];
if (conditions) {
if (conditions.length > 0) {
for (var i = 0; i < conditions.length; i++) {
conditionsToRender.push(flattenCondition(conditions[i]));
}
}
}
if (conditionsToRender.length === 0) {
console.log('No conditions to render');
} else {
for (var j = 0; j < conditionsToRender.length; j++) {
if (multiline) {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "conditionRow",
key: j,
onClick: rowClick(conditionsToRender[j].id)
}, renderToggle(), renderCodeText(conditionsToRender[j].codeText), renderCode(conditionsToRender[j].code), renderCategory(conditionsToRender[j].category), renderClinicalStatus(conditionsToRender[j].clinicalStatus), renderVerificationStatus(conditionsToRender[j].verificationStatus), renderAsserter(conditionsToRender[j].asserter), renderOnsetDateTime(conditionsToRender[j].onsetDateTime), renderRecordedDate(conditionsToRender[j].recordedDate), renderEvidence(conditionsToRender[j].reaction), renderSeverity(conditionsToRender[j].severity), renderBodySite(conditionsToRender[j].bodySite), renderEncounter(conditionsToRender[j].encounter), renderSubject(conditionsToRender[j].subject), renderEvidence(conditionsToRender[j].evidence), renderId(conditionsToRender[j].id), renderActionIcons(conditionsToRender[j])));
} else {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "conditionRow",
key: j,
onClick: rowClick(conditionsToRender[j].id)
}, renderToggle(), renderCodeText(conditionsToRender[j].codeText), renderCode(conditionsToRender[j].code), renderCategory(conditionsToRender[j].category), renderClinicalStatus(conditionsToRender[j].clinicalStatus), renderVerificationStatus(conditionsToRender[j].verificationStatus), renderAsserter(conditionsToRender[j].asserter), renderOnsetDateTime(conditionsToRender[j].onsetDateTime), renderRecordedDate(conditionsToRender[j].recordedDate), renderSeverity(conditionsToRender[j].severity), renderBodySite(conditionsToRender[j].bodySite), renderEncounter(conditionsToRender[j].encounter), renderSubject(conditionsToRender[j].subject), renderEvidence(conditionsToRender[j].evidence), renderId(conditionsToRender[j].id), renderActionIcons(conditionsToRender[j])));
}
}
setTableRows(allTableRows);
}
}, [conditions]);
return /*#__PURE__*/React.createElement(Fragment$1, null, tableTitle && /*#__PURE__*/React.createElement(Typography, {
variant: "h6",
gutterBottom: true,
className: classes.tableTitle
}, tableTitle), /*#__PURE__*/React.createElement(Paper, {
style: tableHeight ? {
maxHeight: tableHeight,
overflow: 'auto'
} : null
}, /*#__PURE__*/React.createElement(Table, {
className: classes.table,
"aria-labelledby": "conditionTable",
size: tableRowSize,
stickyHeader: stickyHeader,
"aria-label": "Condition table"
}, /*#__PURE__*/React.createElement(TableHead, null, /*#__PURE__*/React.createElement(TableRow, null, renderToggleHeader(), renderCodeTextHeader(), renderCodeHeader(), renderCategoryHeader(), renderClinicalStatusHeader(), renderVerificationStatusHeader(), renderAsserterHeader(), renderOnsetDateTimeHeader(), renderRecordedDateHeader(), renderSeverityHeader(), renderBodySiteHeader(), renderEncounterHeader(), renderSubjectHeader(), renderEvidenceHeader(), renderIdHeader(), renderActionIconsHeader())), /*#__PURE__*/React.createElement(TableBody, null, tableRows))));
};
ConditionTable.propTypes = {
conditions: propTypes.array,
hideCheckboxes: propTypes.bool,
hideCode: propTypes.bool,
hideAsserter: propTypes.bool,
hideCategory: propTypes.bool,
hideClinicalStatus: propTypes.bool,
hideVerificationStatus: propTypes.bool,
hideRecordedDate: propTypes.bool,
hideOnsetDateTime: propTypes.bool,
hideSeverity: propTypes.bool,
hideBodySite: propTypes.bool,
hideEncounter: propTypes.bool,
hideSubject: propTypes.bool,
hideEvidence: propTypes.bool,
hideActionIcons: propTypes.bool,
hideIdentifier: propTypes.bool,
multiline: propTypes.bool,
onCellClick: propTypes.func,
onRowClick: propTypes.func,
onRemoveRecord: propTypes.func,
onActionButtonClick: propTypes.func,
actionButtonLabel: propTypes.string,
tableTitle: propTypes.string,
tableRowSize: propTypes.string,
stickyHeader: propTypes.string,
tableHeight: propTypes.number
};
var useStyles$6 = makeStyles({
hideOnPhone: {
visibility: 'visible',
display: 'table'
},
tableTitle: {
margin: 9
},
cellHideOnPhone: {
visibility: 'visible',
display: 'table',
paddingTop: '16px',
maxWidth: '120px'
},
cell: {
paddingTop: '16px'
},
root: {
padding: '0px',
position: 'relative'
},
iconStyle: {
marginLeft: 4,
marginRight: 4,
marginTop: 2,
fontSize: '120%'
}
});
var MedicationTable = function MedicationTable(_ref) {
var medications = _ref.medications,
hideForm = _ref.hideForm,
hideIngredientStrength = _ref.hideIngredientStrength,
hideIngredient = _ref.hideIngredient,
hideUnit = _ref.hideUnit,
hideUnitQuantity = _ref.hideUnitQuantity,
hideCheckboxes = _ref.hideCheckboxes,
hideCode = _ref.hideCode,
hideActionIcons = _ref.hideActionIcons,
hideIdentifier = _ref.hideIdentifier,
multiline = _ref.multiline,
onCellClick = _ref.onCellClick,
onRowClick = _ref.onRowClick,
onRemoveRecord = _ref.onRemoveRecord,
onActionButtonClick = _ref.onActionButtonClick,
actionButtonLabel = _ref.actionButtonLabel,
tableTitle = _ref.tableTitle,
tableRowSize = _ref.tableRowSize,
stickyHeader = _ref.stickyHeader,
tableHeight = _ref.tableHeight;
var classes = useStyles$6();
var _useState = useState([]),
_useState2 = _slicedToArray(_useState, 2),
source = _useState2[0],
setSource = _useState2[1];
var _useState3 = useState([]),
_useState4 = _slicedToArray(_useState3, 2),
tableRows = _useState4[0],
setTableRows = _useState4[1];
var flattenMedication = function flattenMedication(medication) {
var _medication$code, _medication$code2, _medication$subject, _medication$form$codi, _medication$ingredien, _medication$ingredien2, _medication$ingredien3, _medication$ingredien4, _medication$ingredien5, _medication$ingredien6, _medication$ingredien7, _medication$ingredien8, _medication$ingredien9, _medication$ingredien10, _medication$ingredien11, _medication$ingredien12, _medication$ingredien13, _medication$ingredien14;
var result = {
id: '',
meta: '',
code: '',
codeText: '',
subject: '',
form: '',
ingredientStrength: '',
ingredient: '',
unit: '',
unitQuantity: ''
};
result.id = medication.id ? medication.id : medication.id;
result.code = Array.isArray((_medication$code = medication.code) === null || _medication$code === void 0 ? void 0 : _medication$code.coding) ? medication.code.coding[0].code : '';
result.codeText = Array.isArray((_medication$code2 = medication.code) === null || _medication$code2 === void 0 ? void 0 : _medication$code2.coding) ? medication.code.coding[0].display : '';
result.subject = (_medication$subject = medication.subject) === null || _medication$subject === void 0 ? void 0 : _medication$subject.reference;
result.form = medication.form ? (_medication$form$codi = medication.form.coding[0]) === null || _medication$form$codi === void 0 ? void 0 : _medication$form$codi.display : '';
result.ingredient = Array.isArray(medication.ingredient) ? (_medication$ingredien = medication.ingredient[0]) === null || _medication$ingredien === void 0 ? void 0 : (_medication$ingredien2 = _medication$ingredien.itemCodeableConcept) === null || _medication$ingredien2 === void 0 ? void 0 : (_medication$ingredien3 = _medication$ingredien2.coding[0]) === null || _medication$ingredien3 === void 0 ? void 0 : _medication$ingredien3.display : '';
result.ingredientStrength = Array.isArray(medication.ingredient) ? "".concat((_medication$ingredien4 = medication.ingredient[0]) === null || _medication$ingredien4 === void 0 ? void 0 : (_medication$ingredien5 = _medication$ingredien4.strength) === null || _medication$ingredien5 === void 0 ? void 0 : (_medication$ingredien6 = _medication$ingredien5.numerator) === null || _medication$ingredien6 === void 0 ? void 0 : _medication$ingredien6.value, " ").concat((_medication$ingredien7 = medication.ingredient[0].strength) === null || _medication$ingredien7 === void 0 ? void 0 : (_medication$ingredien8 = _medication$ingredien7.numerator) === null || _medication$ingredien8 === void 0 ? void 0 : _medication$ingredien8.code) : '';
result.unit = Array.isArray(medication.ingredient) ? (_medication$ingredien9 = medication.ingredient[0]) === null || _medication$ingredien9 === void 0 ? void 0 : (_medication$ingredien10 = _medication$ingredien9.strength) === null || _medication$ingredien10 === void 0 ? void 0 : (_medication$ingredien11 = _medication$ingredien10.denominator) === null || _medication$ingredien11 === void 0 ? void 0 : _medication$ingredien11.unit : '';
result.unitQuantity = Array.isArray(medication.ingredient) ? (_medication$ingredien12 = medication.ingredient[0]) === null || _medication$ingredien12 === void 0 ? void 0 : (_medication$ingredien13 = _medication$ingredien12.strength) === null || _medication$ingredien13 === void 0 ? void 0 : (_medication$ingredien14 = _medication$ingredien13.denominator) === null || _medication$ingredien14 === void 0 ? void 0 : _medication$ingredien14.value : '';
return result;
};
var rowClick = function rowClick(id) {
if (onRowClick) {
onRowClick(id);
}
};
var renderActionIconsHeader = function renderActionIconsHeader() {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, actionButtonLabel ? actionButtonLabel : 'Actions');
}
};
var renderActionIcons = function renderActionIcons(medication) {
if (!hideActionIcons) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "actionIcons"
}, /*#__PURE__*/React.createElement(Label, {
className: classes.iconStyle,
onClick: function onClick() {
return onActionButtonClick(medication);
}
}), /*#__PURE__*/React.createElement(Delete, {
className: classes.iconStyle,
onClick: function onClick() {
return removeRecord(medication.id);
}
}));
}
};
var removeRecord = function removeRecord(id) {
if (onRemoveRecord) {
onRemoveRecord(id);
}
};
var renderId = function renderId(id) {
if (!hideIdentifier) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "identifier"
}, id));
}
};
var renderIdHeader = function renderIdHeader() {
if (!hideIdentifier) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "id-header"
}, "ID");
}
};
var renderForm = function renderForm(form) {
if (!hideForm) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "form"
}, form));
}
};
var renderFormHeader = function renderFormHeader() {
if (!hideForm) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "form-header"
}, "Form");
}
};
var renderIngredientStrengthHeader = function renderIngredientStrengthHeader() {
if (!hideIngredientStrength) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "ingredientStrength-header"
}, "Medication Strength");
}
};
var renderIngredientStrength = function renderIngredientStrength(ingredientStrength) {
if (!hideIngredientStrength) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "ingredientStrength"
}, ingredientStrength));
}
};
var renderIngredientHeader = function renderIngredientHeader() {
if (!hideIngredient) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "ingredient-header"
}, "Medication");
}
};
var renderIngredient = function renderIngredient(ingredient) {
if (!hideIngredient) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "ingredient"
}, ingredient));
}
};
var renderUnitHeader = function renderUnitHeader() {
if (!hideUnit) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "unit-header"
}, "Unit");
}
};
var renderUnit = function renderUnit(unit) {
if (!hideUnit) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "unit"
}, unit));
}
};
var renderUnitQuantityHeader = function renderUnitQuantityHeader() {
if (!hideUnitQuantity) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "unitQuantity-header"
}, "Unit Quantity");
}
};
var renderUnitQuantity = function renderUnitQuantity(unitQuantity) {
if (!hideUnitQuantity) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
id: "unitQuantity"
}, unitQuantity));
}
};
var renderCodeHeader = function renderCodeHeader() {
if (!hideCode) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "code-header"
}, "Code");
}
};
var renderCode = function renderCode(code, value) {
if (!hideCode) {
if (multiline) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
className: {
fontWeight: 400
}
}, code), " ", /*#__PURE__*/React.createElement("br", null), value);
}
return /*#__PURE__*/React.createElement(TableCell, {
id: "code"
}, code);
}
};
var renderCodeTextHeader = function renderCodeTextHeader() {
if (!hideCode) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "code-header"
}, "Code Text");
}
};
var renderCodeText = function renderCodeText(code, value) {
if (!hideCode) {
if (multiline) {
return /*#__PURE__*/React.createElement(TableCell, null, /*#__PURE__*/React.createElement("span", {
className: {
fontWeight: 400
}
}, code), " ", /*#__PURE__*/React.createElement("br", null), value);
}
return /*#__PURE__*/React.createElement(TableCell, {
id: "code"
}, code);
}
};
var renderToggleHeader = function renderToggleHeader() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle-header"
}, "Toggle");
}
};
var renderToggle = function renderToggle() {
if (!hideCheckboxes) {
return /*#__PURE__*/React.createElement(TableCell, {
id: "toggle"
}, /*#__PURE__*/React.createElement(Checkbox, {
defaultChecked: false,
className: classes.root
}));
}
};
useEffect(function () {
var allTableRows = [];
var medicationsToRender = [];
if (medications) {
if (medications.length > 0) {
for (var i = 0; i < medications.length; i++) {
medicationsToRender.push(flattenMedication(medications[i]));
}
}
}
if (medicationsToRender.length === 0) {
console.log('No medications to render');
} else {
for (var j = 0; j < medicationsToRender.length; j++) {
if (multiline) {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "medicationRow",
key: j,
onClick: rowClick(medicationsToRender[j].id)
}, renderToggle(), renderCodeText(medicationsToRender[j].codeText), renderCode(medicationsToRender[j].code), renderIngredientStrength(medicationsToRender[j].ingredient), renderForm(medicationsToRender[j].ingredientStrength), renderIngredient(medicationsToRender[j].form), renderUnit(medicationsToRender[j].unit), renderUnitQuantity(medicationsToRender[j].unitQuantity), renderId(medicationsToRender[j].id), renderActionIcons(medicationsToRender[j])));
} else {
allTableRows.push( /*#__PURE__*/React.createElement(TableRow, {
id: "medicationRow",
key: j,
onClick: rowClick(medicationsToRender[j].id)
}, renderToggle(), renderCodeText(medicationsToRender[j].codeText), renderCode(medicationsToRender[j].code), renderIngredientStrength(medicationsToRender[j].ingredient), renderForm(medicationsToRender[j].ingredientStrength), renderIngredient(medicationsToRender[j].form), renderUnit(medicationsToRender[j].unit), renderUnitQuantity(medicationsToRender[j].unitQuantity), renderId(medicationsToRender[j].id), renderActionIcons(medicationsToRender[j])));
}
}
setTableRows(allTableRows);
}
}, [medications]);
return /*#__PURE__*/React.createElement(Fragment$1, null, tableTitle && /*#__PURE__*/React.createElement(Typography, {
variant: "h6",
gutterBottom: true,
className: classes.tableTitle
}, tableTitle), /*#__PURE__*/React.createElement(Paper, {
style: tableHeight ? {
maxHeight: tableHeight,
overflow: 'auto'
} : null
}, /*#__PURE__*/React.createElement(Table, {
className: classes.table,
"aria-labelledby": "medicationTable",
size: tableRowSize,
stickyHeader: stickyHeader,
"aria-label": "Medication table"
}, /*#__PURE__*/React.createElement(TableHead, null, /*#__PURE__*/React.createElement(TableRow, null, renderToggleHeader(), renderCodeTextHeader(), renderCodeHeader(), renderIngredientHeader(), renderIngredientStrengthHeader(), renderFormHeader(), renderUnitHeader(), renderUnitQuantityHeader(), renderIdHeader(), renderActionIconsHeader())), /*#__PURE__*/React.createElement(TableBody, null, tableRows))));
};
MedicationTable.propTypes = {
medications: propTypes.array,
hideForm: propTypes.bool,
hideIngredientStrength: propTypes.bool,
hideIngredient: propTypes.bool,
hideUnit: propTypes.bool,
hideUnitQuantity: propTypes.bool,
hideCheckboxes: propTypes.bool,
hideCode: propTypes.bool,
hideActionIcons: propTypes.bool,
hideIdentifier: propTypes.bool,
multiline: propTypes.bool,
onRowClick: propTypes.func,
onRemoveRecord: propTypes.func,
onActionButtonClick: propTypes.func,
actionButtonLabel: propTypes.string,
tableTitle: propTypes.string,
tableRowSize: propTypes.string,
stickyHeader: propTypes.string,
tableHeight: propTypes.number
};
export { AllergyTable, ConditionTable, MedicationTable, ObservationDetail, ObservationTable, PatientBanner, PatientCard, PatientDetail, PatientTable };
//# sourceMappingURL=index.es.js.map