@medplum/react 2.0.1 → 2.0.3

package/dist/cjs/index.cjs

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@medplum/core'), require('react'), require('@mantine/core'), require('@tabler/icons'), require('react-router-dom'), require('@mantine/notifications')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@medplum/core', 'react', '@mantine/core', '@tabler/icons', 'react-router-dom', '@mantine/notifications'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.medplum = global.medplum || {}, global.medplum.react = {}), global.medplum.core, global.React, global.mantine.core, global.tabler.icons, global.ReactRouterDOM, global.mantine.notifications));
-})(this, (function (exports, core, React, core$1, icons, reactRouterDom, notifications) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@medplum/core'), require('react'), require('@mantine/core'), require('prop-types'), require('@mantine/notifications')) :
+    typeof define === 'function' && define.amd ? define(['exports', '@medplum/core', 'react', '@mantine/core', 'prop-types', '@mantine/notifications'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.medplum = global.medplum || {}, global.medplum.react = {}), global.medplum.core, global.React, global.mantine.core, global.PropTypes, global.mantine.notifications));
+})(this, (function (exports, core, React, core$1, PropTypes, notifications) { 'use strict';
 
     function AddressDisplay(props) {
         const address = props.value;
@@ -74,6 +74,7 @@
      */
     function MedplumProvider(props) {
         const medplum = props.medplum;
+        const navigate = props.navigate || defaultNavigate;
         const [state, setState] = React.useState({
             profile: medplum.getProfile(),
             loading: false,
@@ -91,6 +92,7 @@
         const medplumContext = {
             ...state,
             medplum,
+            navigate,
         };
         return React.createElement(reactContext.Provider, { value: medplumContext }, props.children);
     }
@@ -107,6 +109,13 @@
     function useMedplum() {
         return useMedplumContext().medplum;
     }
+    /**
+     * Returns the Medplum navigate function.
+     * @returns The Medplum navigate function.
+     */
+    function useMedplumNavigate() {
+        return useMedplumContext().navigate;
+    }
     /**
      * Returns the current Medplum user profile (if signed in).
      * This is a shortcut for useMedplumContext().profile.
@@ -115,6 +124,13 @@
     function useMedplumProfile() {
         return useMedplumContext().profile;
     }
+    /**
+     * The default "navigate" function which simply uses window.location.href.
+     * @param path The path to navigate to.
+     */
+    function defaultNavigate(path) {
+        window.location.assign(path);
+    }
 
     function AnnotationInput(props) {
         const author = useMedplumProfile();
@@ -298,6 +314,601 @@
                 React.createElement(AttachmentDisplay, { value: v, maxWidth: props.maxWidth }))))));
     }
 
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var defaultAttributes = {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: 24,
+      height: 24,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    };
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var __defProp = Object.defineProperty;
+    var __defProps = Object.defineProperties;
+    var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+    var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+    var __hasOwnProp = Object.prototype.hasOwnProperty;
+    var __propIsEnum = Object.prototype.propertyIsEnumerable;
+    var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+    var __spreadValues = (a, b) => {
+      for (var prop in b || (b = {}))
+        if (__hasOwnProp.call(b, prop))
+          __defNormalProp(a, prop, b[prop]);
+      if (__getOwnPropSymbols)
+        for (var prop of __getOwnPropSymbols(b)) {
+          if (__propIsEnum.call(b, prop))
+            __defNormalProp(a, prop, b[prop]);
+        }
+      return a;
+    };
+    var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+    var __objRest = (source, exclude) => {
+      var target = {};
+      for (var prop in source)
+        if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+          target[prop] = source[prop];
+      if (source != null && __getOwnPropSymbols)
+        for (var prop of __getOwnPropSymbols(source)) {
+          if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+            target[prop] = source[prop];
+        }
+      return target;
+    };
+    var createReactComponent = (iconName, iconNamePascal, iconNode) => {
+      const Component = React.forwardRef(
+        (_a, ref) => {
+          var _b = _a, { color = "currentColor", size = 24, stroke = 2, children } = _b, rest = __objRest(_b, ["color", "size", "stroke", "children"]);
+          return React.createElement(
+            "svg",
+            __spreadValues(__spreadProps(__spreadValues({
+              ref
+            }, defaultAttributes), {
+              width: size,
+              height: size,
+              stroke: color,
+              strokeWidth: stroke,
+              className: `tabler-icon tabler-icon-${iconName}`
+            }), rest),
+            [...iconNode.map(([tag, attrs]) => React.createElement(tag, attrs)), ...children || []]
+          );
+        }
+      );
+      Component.propTypes = {
+        color: PropTypes.string,
+        size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+        stroke: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+      };
+      Component.displayName = `${iconNamePascal}`;
+      return Component;
+    };
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconAdjustmentsHorizontal = createReactComponent(
+      "adjustments-horizontal",
+      "IconAdjustmentsHorizontal",
+      [
+        ["path", { d: "M14 6m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", key: "svg-0" }],
+        ["path", { d: "M4 6l8 0", key: "svg-1" }],
+        ["path", { d: "M16 6l4 0", key: "svg-2" }],
+        ["path", { d: "M8 12m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", key: "svg-3" }],
+        ["path", { d: "M4 12l2 0", key: "svg-4" }],
+        ["path", { d: "M10 12l10 0", key: "svg-5" }],
+        ["path", { d: "M17 18m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0", key: "svg-6" }],
+        ["path", { d: "M4 18l11 0", key: "svg-7" }],
+        ["path", { d: "M19 18l1 0", key: "svg-8" }]
+      ]
+    );
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconAlertCircle = createReactComponent("alert-circle", "IconAlertCircle", [
+      ["path", { d: "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0", key: "svg-0" }],
+      ["path", { d: "M12 8l0 4", key: "svg-1" }],
+      ["path", { d: "M12 16l.01 0", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconBleachOff = createReactComponent("bleach-off", "IconBleachOff", [
+      [
+        "path",
+        {
+          d: "M5 19h14m1.986 -1.977a2 2 0 0 0 -.146 -.773l-7.1 -12.25a2 2 0 0 0 -3.5 0l-.815 1.405m-1.488 2.568l-4.797 8.277a2 2 0 0 0 1.75 2.75",
+          key: "svg-0"
+        }
+      ],
+      ["path", { d: "M3 3l18 18", key: "svg-1" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconBleach = createReactComponent("bleach", "IconBleach", [
+      [
+        "path",
+        {
+          d: "M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75",
+          key: "svg-0"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconBoxMultiple = createReactComponent("box-multiple", "IconBoxMultiple", [
+      [
+        "path",
+        {
+          d: "M7 3m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z",
+          key: "svg-0"
+        }
+      ],
+      [
+        "path",
+        {
+          d: "M17 17v2a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2v-10a2 2 0 0 1 2 -2h2",
+          key: "svg-1"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconBracketsContain = createReactComponent("brackets-contain", "IconBracketsContain", [
+      ["path", { d: "M7 4h-4v16h4", key: "svg-0" }],
+      ["path", { d: "M17 4h4v16h-4", key: "svg-1" }],
+      ["path", { d: "M8 16h.01", key: "svg-2" }],
+      ["path", { d: "M12 16h.01", key: "svg-3" }],
+      ["path", { d: "M16 16h.01", key: "svg-4" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconBucketOff = createReactComponent("bucket-off", "IconBucketOff", [
+      [
+        "path",
+        {
+          d: "M5.029 5.036c-.655 .58 -1.029 1.25 -1.029 1.964c0 2.033 3.033 3.712 6.96 3.967m3.788 -.21c3.064 -.559 5.252 -2.029 5.252 -3.757c0 -2.21 -3.582 -4 -8 -4c-1.605 0 -3.1 .236 -4.352 .643",
+          key: "svg-0"
+        }
+      ],
+      [
+        "path",
+        {
+          d: "M4 7c0 .664 .088 1.324 .263 1.965l2.737 10.035c.5 1.5 2.239 2 5 2s4.5 -.5 5 -2c.1 -.3 .252 -.812 .457 -1.535m.862 -3.146c.262 -.975 .735 -2.76 1.418 -5.354a7.45 7.45 0 0 0 .263 -1.965",
+          key: "svg-1"
+        }
+      ],
+      ["path", { d: "M3 3l18 18", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconBucket = createReactComponent("bucket", "IconBucket", [
+      ["path", { d: "M12 7m-8 0a8 4 0 1 0 16 0a8 4 0 1 0 -16 0", key: "svg-0" }],
+      [
+        "path",
+        {
+          d: "M4 7c0 .664 .088 1.324 .263 1.965l2.737 10.035c.5 1.5 2.239 2 5 2s4.5 -.5 5 -2c.333 -1 1.246 -4.345 2.737 -10.035a7.45 7.45 0 0 0 .263 -1.965",
+          key: "svg-1"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconCalendar = createReactComponent("calendar", "IconCalendar", [
+      [
+        "path",
+        {
+          d: "M4 5m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z",
+          key: "svg-0"
+        }
+      ],
+      ["path", { d: "M16 3l0 4", key: "svg-1" }],
+      ["path", { d: "M8 3l0 4", key: "svg-2" }],
+      ["path", { d: "M4 11l16 0", key: "svg-3" }],
+      ["path", { d: "M11 15l1 0", key: "svg-4" }],
+      ["path", { d: "M12 15l0 3", key: "svg-5" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconCheck = createReactComponent("check", "IconCheck", [
+      ["path", { d: "M5 12l5 5l10 -10", key: "svg-0" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconCheckbox = createReactComponent("checkbox", "IconCheckbox", [
+      ["path", { d: "M9 11l3 3l8 -8", key: "svg-0" }],
+      [
+        "path",
+        {
+          d: "M20 12v6a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h9",
+          key: "svg-1"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconCircleMinus = createReactComponent("circle-minus", "IconCircleMinus", [
+      ["path", { d: "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0", key: "svg-0" }],
+      ["path", { d: "M9 12l6 0", key: "svg-1" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconCirclePlus = createReactComponent("circle-plus", "IconCirclePlus", [
+      ["path", { d: "M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0", key: "svg-0" }],
+      ["path", { d: "M9 12l6 0", key: "svg-1" }],
+      ["path", { d: "M12 9l0 6", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconCloudUpload = createReactComponent("cloud-upload", "IconCloudUpload", [
+      [
+        "path",
+        {
+          d: "M7 18a4.6 4.4 0 0 1 0 -9a5 4.5 0 0 1 11 2h1a3.5 3.5 0 0 1 0 7h-1",
+          key: "svg-0"
+        }
+      ],
+      ["path", { d: "M9 15l3 -3l3 3", key: "svg-1" }],
+      ["path", { d: "M12 12l0 9", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconColumns = createReactComponent("columns", "IconColumns", [
+      ["path", { d: "M4 6l5.5 0", key: "svg-0" }],
+      ["path", { d: "M4 10l5.5 0", key: "svg-1" }],
+      ["path", { d: "M4 14l5.5 0", key: "svg-2" }],
+      ["path", { d: "M4 18l5.5 0", key: "svg-3" }],
+      ["path", { d: "M14.5 6l5.5 0", key: "svg-4" }],
+      ["path", { d: "M14.5 10l5.5 0", key: "svg-5" }],
+      ["path", { d: "M14.5 14l5.5 0", key: "svg-6" }],
+      ["path", { d: "M14.5 18l5.5 0", key: "svg-7" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconCurrencyDollar = createReactComponent("currency-dollar", "IconCurrencyDollar", [
+      [
+        "path",
+        {
+          d: "M16.7 8a3 3 0 0 0 -2.7 -2h-4a3 3 0 0 0 0 6h4a3 3 0 0 1 0 6h-4a3 3 0 0 1 -2.7 -2",
+          key: "svg-0"
+        }
+      ],
+      ["path", { d: "M12 3v3m0 12v3", key: "svg-1" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconDots = createReactComponent("dots", "IconDots", [
+      ["path", { d: "M5 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", key: "svg-0" }],
+      ["path", { d: "M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", key: "svg-1" }],
+      ["path", { d: "M19 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconEdit = createReactComponent("edit", "IconEdit", [
+      [
+        "path",
+        {
+          d: "M7 7h-1a2 2 0 0 0 -2 2v9a2 2 0 0 0 2 2h9a2 2 0 0 0 2 -2v-1",
+          key: "svg-0"
+        }
+      ],
+      [
+        "path",
+        {
+          d: "M20.385 6.585a2.1 2.1 0 0 0 -2.97 -2.97l-8.415 8.385v3h3l8.385 -8.415z",
+          key: "svg-1"
+        }
+      ],
+      ["path", { d: "M16 5l3 3", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconEqualNot = createReactComponent("equal-not", "IconEqualNot", [
+      ["path", { d: "M5 10h14", key: "svg-0" }],
+      ["path", { d: "M5 14h14", key: "svg-1" }],
+      ["path", { d: "M5 19l14 -14", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconEqual = createReactComponent("equal", "IconEqual", [
+      ["path", { d: "M5 10h14", key: "svg-0" }],
+      ["path", { d: "M5 14h14", key: "svg-1" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconFileAlert = createReactComponent("file-alert", "IconFileAlert", [
+      ["path", { d: "M14 3v4a1 1 0 0 0 1 1h4", key: "svg-0" }],
+      [
+        "path",
+        {
+          d: "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z",
+          key: "svg-1"
+        }
+      ],
+      ["path", { d: "M12 17l.01 0", key: "svg-2" }],
+      ["path", { d: "M12 11l0 3", key: "svg-3" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconFilePlus = createReactComponent("file-plus", "IconFilePlus", [
+      ["path", { d: "M14 3v4a1 1 0 0 0 1 1h4", key: "svg-0" }],
+      [
+        "path",
+        {
+          d: "M17 21h-10a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v11a2 2 0 0 1 -2 2z",
+          key: "svg-1"
+        }
+      ],
+      ["path", { d: "M12 11l0 6", key: "svg-2" }],
+      ["path", { d: "M9 14l6 0", key: "svg-3" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconFilter = createReactComponent("filter", "IconFilter", [
+      [
+        "path",
+        {
+          d: "M5.5 5h13a1 1 0 0 1 .5 1.5l-5 5.5l0 7l-4 -3l0 -4l-5 -5.5a1 1 0 0 1 .5 -1.5",
+          key: "svg-0"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconListDetails = createReactComponent("list-details", "IconListDetails", [
+      ["path", { d: "M13 5h8", key: "svg-0" }],
+      ["path", { d: "M13 9h5", key: "svg-1" }],
+      ["path", { d: "M13 15h8", key: "svg-2" }],
+      ["path", { d: "M13 19h5", key: "svg-3" }],
+      [
+        "path",
+        {
+          d: "M3 4m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z",
+          key: "svg-4"
+        }
+      ],
+      [
+        "path",
+        {
+          d: "M3 14m0 1a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1z",
+          key: "svg-5"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconMathGreater = createReactComponent("math-greater", "IconMathGreater", [
+      ["path", { d: "M5 18l14 -6l-14 -6", key: "svg-0" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconMathLower = createReactComponent("math-lower", "IconMathLower", [
+      ["path", { d: "M19 18l-14 -6l14 -6", key: "svg-0" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconMessage = createReactComponent("message", "IconMessage", [
+      [
+        "path",
+        {
+          d: "M4 21v-13a3 3 0 0 1 3 -3h10a3 3 0 0 1 3 3v6a3 3 0 0 1 -3 3h-9l-4 4",
+          key: "svg-0"
+        }
+      ],
+      ["path", { d: "M8 9l8 0", key: "svg-1" }],
+      ["path", { d: "M8 13l6 0", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconPin = createReactComponent("pin", "IconPin", [
+      [
+        "path",
+        {
+          d: "M15 4.5l-4 4l-4 1.5l-1.5 1.5l7 7l1.5 -1.5l1.5 -4l4 -4",
+          key: "svg-0"
+        }
+      ],
+      ["path", { d: "M9 15l-4.5 4.5", key: "svg-1" }],
+      ["path", { d: "M14.5 4l5.5 5.5", key: "svg-2" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconPinnedOff = createReactComponent("pinned-off", "IconPinnedOff", [
+      ["path", { d: "M3 3l18 18", key: "svg-0" }],
+      [
+        "path",
+        {
+          d: "M15 4.5l-3.249 3.249m-2.57 1.433l-2.181 .818l-1.5 1.5l7 7l1.5 -1.5l.82 -2.186m1.43 -2.563l3.25 -3.251",
+          key: "svg-1"
+        }
+      ],
+      ["path", { d: "M9 15l-4.5 4.5", key: "svg-2" }],
+      ["path", { d: "M14.5 4l5.5 5.5", key: "svg-3" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconSettings = createReactComponent("settings", "IconSettings", [
+      [
+        "path",
+        {
+          d: "M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z",
+          key: "svg-0"
+        }
+      ],
+      ["path", { d: "M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0", key: "svg-1" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconSortAscending = createReactComponent("sort-ascending", "IconSortAscending", [
+      ["path", { d: "M4 6l7 0", key: "svg-0" }],
+      ["path", { d: "M4 12l7 0", key: "svg-1" }],
+      ["path", { d: "M4 18l9 0", key: "svg-2" }],
+      ["path", { d: "M15 9l3 -3l3 3", key: "svg-3" }],
+      ["path", { d: "M18 6l0 12", key: "svg-4" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconSortDescending = createReactComponent("sort-descending", "IconSortDescending", [
+      ["path", { d: "M4 6l9 0", key: "svg-0" }],
+      ["path", { d: "M4 12l7 0", key: "svg-1" }],
+      ["path", { d: "M4 18l7 0", key: "svg-2" }],
+      ["path", { d: "M15 15l3 3l3 -3", key: "svg-3" }],
+      ["path", { d: "M18 6l0 12", key: "svg-4" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconSquare = createReactComponent("square", "IconSquare", [
+      [
+        "path",
+        {
+          d: "M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z",
+          key: "svg-0"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconTableExport = createReactComponent("table-export", "IconTableExport", [
+      [
+        "path",
+        {
+          d: "M11.5 20h-5.5a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v7.5m-16 -3.5h16m-10 -6v16m4 -1h7m-3 -3l3 3l-3 3",
+          key: "svg-0"
+        }
+      ]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconTrash = createReactComponent("trash", "IconTrash", [
+      ["path", { d: "M4 7l16 0", key: "svg-0" }],
+      ["path", { d: "M10 11l0 6", key: "svg-1" }],
+      ["path", { d: "M14 11l0 6", key: "svg-2" }],
+      [
+        "path",
+        { d: "M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2 -2l1 -12", key: "svg-3" }
+      ],
+      ["path", { d: "M9 7v-3a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v3", key: "svg-4" }]
+    ]);
+
+    /**
+     * @tabler/icons-react v2.3.0 - MIT
+     */
+
+    var IconX = createReactComponent("x", "IconX", [
+      ["path", { d: "M18 6l-12 12", key: "svg-0" }],
+      ["path", { d: "M6 6l12 12", key: "svg-1" }]
+    ]);
+
     function AttachmentButton(props) {
         const medplum = useMedplum();
         const fileInputRef = React.useRef(null);
@@ -373,14 +984,14 @@
                                 copy.splice(index, 1);
                                 setValuesWrapper(copy);
                             } },
-                            React.createElement(icons.IconCircleMinus, null)))))),
+                            React.createElement(IconCircleMinus, null)))))),
                 React.createElement("tr", null,
                     React.createElement("td", null),
                     React.createElement("td", null,
                         React.createElement(AttachmentButton, { onUpload: (attachment) => {
                                 setValuesWrapper([...valuesRef.current, attachment]);
                             } }, (props) => (React.createElement(core$1.ActionIcon, { ...props, title: "Add", size: "sm", color: "green" },
-                            React.createElement(icons.IconCloudUpload, { size: 16 })))))))));
+                            React.createElement(IconCloudUpload, { size: 16 })))))))));
     }
 
     function AttachmentInput(props) {
@@ -402,7 +1013,7 @@
         return (React.createElement(AttachmentButton, { onUpload: setValueWrapper }, (props) => React.createElement(core$1.Button, { ...props }, "Upload...")));
     }
 
-    const useStyles$d = core$1.createStyles(() => ({
+    const useStyles$e = core$1.createStyles(() => ({
         root: {
             '@media (max-width: 800px)': {
                 paddingLeft: 4,
@@ -412,11 +1023,11 @@
     }));
     function Container(props) {
         const { children, ...others } = props;
-        const { classes } = useStyles$d();
+        const { classes } = useStyles$e();
         return (React.createElement(core$1.Container, { className: classes.root, ...others }, children));
     }
 
-    const useStyles$c = core$1.createStyles((theme, { width, fill }) => ({
+    const useStyles$d = core$1.createStyles((theme, { width, fill }) => ({
         paper: {
             maxWidth: width,
             margin: `${theme.spacing.xl}px auto`,
@@ -441,7 +1052,7 @@
     };
     function Panel(props) {
         const { className, children, width, fill, unstyled, ...others } = core$1.useComponentDefaultProps('Panel', defaultProps$1, props);
-        const { classes, cx } = useStyles$c({ width, fill }, { name: 'Panel', unstyled });
+        const { classes, cx } = useStyles$d({ width, fill }, { name: 'Panel', unstyled });
         return (React.createElement(core$1.Paper, { className: cx(classes.paper, className), ...others }, children));
     }
 
@@ -622,19 +1233,22 @@
         if (clientId) {
             return clientId;
         }
-        const origin = window.location.protocol + '//' + window.location.host;
-        const authorizedOrigins = "http://localhost:3000,http://127.0.0.1:3000,http://localhost:6006,http://127.0.0.1:6006,https://app.medplum.com,https://docs.medplum.com,https://storybook.medplum.com,https://graphiql.medplum.com,https://www.medplum.com"?.split(',') ?? [];
-        if (authorizedOrigins.includes(origin)) {
-            return "921088377005-3j1sa10vr6hj86jgmdfh2l53v3mp7lfi.apps.googleusercontent.com";
+        if (typeof window !== 'undefined') {
+            const origin = window.location.protocol + '//' + window.location.host;
+            const authorizedOrigins = "http://localhost:3000,http://127.0.0.1:3000,http://localhost:6006,http://127.0.0.1:6006,https://app.medplum.com,https://docs.medplum.com,https://storybook.medplum.com,https://graphiql.medplum.com,https://www.medplum.com"?.split(',') ?? [];
+            if (authorizedOrigins.includes(origin)) {
+                return "921088377005-3j1sa10vr6hj86jgmdfh2l53v3mp7lfi.apps.googleusercontent.com";
+            }
         }
         return undefined;
     }
 
     function OperationOutcomeAlert(props) {
-        if (!props.issues) {
+        const issues = props.outcome?.issue || props.issues;
+        if (!issues) {
             return null;
         }
-        return (React.createElement(core$1.Alert, { icon: React.createElement(icons.IconAlertCircle, { size: 16 }), color: "red" }, props.issues.map((issue) => (React.createElement("div", { "data-testid": "text-field-error", key: issue.details?.text }, issue.details?.text)))));
+        return (React.createElement(core$1.Alert, { icon: React.createElement(IconAlertCircle, { size: 16 }), color: "red" }, issues.map((issue) => (React.createElement("div", { "data-testid": "text-field-error", key: issue.details?.text }, issue.details?.text)))));
     }
 
     /**
@@ -833,7 +1447,7 @@
             React.createElement(core$1.Center, { sx: { flexDirection: 'column' } }, children),
             React.createElement(OperationOutcomeAlert, { issues: issues }),
             React.createElement(core$1.Stack, { spacing: "xl" },
-                React.createElement(core$1.PasswordInput, { name: "password", type: "password", label: "Password", autoComplete: "off", required: true, error: getErrorsForInput(outcome, 'password') })),
+                React.createElement(core$1.PasswordInput, { name: "password", label: "Password", autoComplete: "off", required: true, error: getErrorsForInput(outcome, 'password') })),
             React.createElement(core$1.Group, { position: "apart", mt: "xl", spacing: 0, noWrap: true },
                 onForgotPassword && (React.createElement(core$1.Anchor, { component: "button", type: "button", color: "dimmed", onClick: onForgotPassword, size: "xs" }, "Forgot password")),
                 React.createElement(core$1.Checkbox, { id: "remember", name: "remember", label: "Remember me", size: "xs", sx: { lineHeight: 1 } }),
@@ -899,7 +1513,7 @@
                 React.createElement(core$1.Center, { sx: { flexDirection: 'column' } },
                     React.createElement(Logo, { size: 32 }),
                     React.createElement(core$1.Title, null, "Enter MFA code")),
-                errorMessage && (React.createElement(core$1.Alert, { icon: React.createElement(icons.IconAlertCircle, { size: 16 }), title: "Error", color: "red" }, errorMessage)),
+                errorMessage && (React.createElement(core$1.Alert, { icon: React.createElement(IconAlertCircle, { size: 16 }), title: "Error", color: "red" }, errorMessage)),
                 React.createElement(core$1.Stack, null,
                     React.createElement(core$1.TextInput, { name: "token", label: "MFA code", required: true })),
                 React.createElement(core$1.Group, { position: "right", mt: "xl" },
@@ -997,7 +1611,7 @@
         'modifierExtension',
     ];
 
-    const useStyles$b = core$1.createStyles((theme) => ({
+    const useStyles$c = core$1.createStyles((theme) => ({
         root: {
             display: 'grid',
             gridTemplateColumns: '30% 70%',
@@ -1018,7 +1632,7 @@
     }));
     function DescriptionList(props) {
         const { children, compact } = props;
-        const { classes, cx } = useStyles$b();
+        const { classes, cx } = useStyles$c();
         return React.createElement("dl", { className: cx(classes.root, { [classes.compact]: compact }) }, children);
     }
     function DescriptionListEntry(props) {
@@ -1110,7 +1724,7 @@
     }
 
     function MedplumLink(props) {
-        const navigate = reactRouterDom.useNavigate();
+        const navigate = useMedplumNavigate();
         const { to, suffix, label, onClick, children, ...rest } = props;
         let href = getHref(to);
         if (suffix) {
@@ -1320,64 +1934,86 @@
         return (React.createElement(core$1.Input.Wrapper, { id: props.htmlFor, label: props.title, description: props.description, error: getErrorsForInput(props.outcome, props.htmlFor) }, props.children));
     }
 
-    const system = {
-        resourceType: 'Device',
-        id: 'system',
-        deviceName: [
-            {
-                name: 'System',
-            },
-        ],
-    };
     /**
      * React Hook to use a FHIR reference.
      * Handles the complexity of resolving references and caching resources.
      * @param value The resource or reference to resource.
      * @returns The resolved resource.
      */
-    function useResource(value) {
+    function useResource(value, setOutcome) {
         const medplum = useMedplum();
-        const [resource, setResource] = React.useState(getInitialResource(medplum, value));
+        const referenceRef = React.useRef(undefined);
+        const resourceRef = React.useRef(undefined);
+        // Parse the input value into a reference and resource
+        parseValue(value, referenceRef, resourceRef);
+        // Priority order:
+        // 1. Cached reference
+        // 2. Resource passed in as-is
+        // 3. Undefined
+        const currentResource = getCurrentValue(medplum, referenceRef, resourceRef);
+        // Keep track of the previous resource
+        // This is used to detect when the resource has changed
+        // We need a React "state" variable to trigger a re-render
+        const [prevResource, forceRerender] = React.useState(currentResource);
+        // Subscribe to changes to the passed-in value
         React.useEffect(() => {
-            let subscribed = true;
-            if (!resource && value && 'reference' in value && value.reference) {
+            if (referenceRef.current) {
                 medplum
-                    .readReference(value)
-                    .then((r) => {
-                    if (subscribed) {
-                        setResource(r);
+                    .readReference(referenceRef.current)
+                    .then((newValue) => {
+                    if (!core.deepEquals(newValue, prevResource)) {
+                        forceRerender(newValue);
                     }
                 })
-                    .catch(() => setResource(undefined));
+                    .catch((err) => {
+                    if (setOutcome) {
+                        setOutcome(err);
+                    }
+                });
             }
-            return (() => (subscribed = false));
-        }, [medplum, resource, value]);
-        return resource;
+        }, [medplum, prevResource, value, setOutcome]);
+        return currentResource;
     }
     /**
-     * Returns the initial resource value based on the input value.
-     * If the input value is a resource, returns the resource.
-     * If the input value is a reference to system, returns the system resource.
-     * If the input value is a reference to a resource available in the cache, returns the resource.
-     * Otherwise, returns undefined.
-     * @param medplum The medplum client.
-     * @param value The resource or reference to resource.
-     * @returns An initial resource if available; undefined otherwise.
+     * Parses the input into a reference and resource.
+     * @param value The input value to parse. Can be either a reference or a resource.
+     * @param referenceRef The output reference.
+     * @param resourceRef The output resource.
      */
-    function getInitialResource(medplum, value) {
+    function parseValue(value, referenceRef, resourceRef) {
+        // Reset the reference and resource
+        referenceRef.current = undefined;
+        resourceRef.current = undefined;
         if (!value) {
-            return undefined;
-        }
-        if ('resourceType' in value) {
-            return value;
+            return;
         }
         if ('reference' in value) {
-            if (value.reference === 'system') {
-                return system;
+            // If the input is a reference then we can use it as-is
+            referenceRef.current = value;
+        }
+        else if ('resourceType' in value) {
+            resourceRef.current = value;
+            if ('id' in value) {
+                // If the input is a resource with an ID, then we can still create a reference
+                referenceRef.current = { reference: value.resourceType + '/' + value.id };
             }
-            return medplum.getCachedReference(value);
         }
-        return undefined;
+    }
+    /**
+     * Returns the best currently available value.
+     * This is ***not*** asynchronous and returns immediately.
+     * It attempts to return the value from the cache, or the resource passed in as-is.
+     * @param medplum The Medplum client.
+     * @param referenceRef The reference.
+     * @param resourceRef The resource.
+     * @returns The currently available value.
+     */
+    function getCurrentValue(medplum, referenceRef, resourceRef) {
+        // Priority order:
+        // 1. Cached reference
+        // 2. Resource passed in as-is
+        // 3. Undefined
+        return (referenceRef.current && medplum.getCachedReference(referenceRef.current)) || resourceRef.current;
     }
 
     function ResourceForm(props) {
@@ -1782,7 +2418,7 @@
                     width: 92,
                 },
             }, onChange: handleCurrencyChange }));
-        return (React.createElement(core$1.TextInput, { type: "number", label: props.label, placeholder: props.placeholder || 'Value', defaultValue: value?.value?.toString() || 'USD', icon: React.createElement(icons.IconCurrencyDollar, { size: 14 }), rightSection: select, rightSectionWidth: 92, onChange: handleValueChange }));
+        return (React.createElement(core$1.TextInput, { type: "number", label: props.label, placeholder: props.placeholder || 'Value', defaultValue: value?.value?.toString() || 'USD', icon: React.createElement(IconCurrencyDollar, { size: 14 }), rightSection: select, rightSectionWidth: 92, onChange: handleValueChange }));
     }
 
     function PeriodInput(props) {
@@ -1811,10 +2447,16 @@
                     ...value,
                     comparator: e.currentTarget.value,
                 }) }),
-            React.createElement(core$1.TextInput, { id: props.name, name: props.name, "data-testid": props.name + '-value', type: "number", step: "any", placeholder: "Value", defaultValue: value?.value?.toString(), onChange: (e) => setValueWrapper({
-                    ...value,
-                    value: tryParseNumber(e.currentTarget.value),
-                }) }),
+            React.createElement(core$1.TextInput, { id: props.name, name: props.name, "data-testid": props.name + '-value', type: "number", placeholder: "Value", defaultValue: value?.value, step: "any", onWheel: (e) => {
+                    if (props.disableWheel) {
+                        e.currentTarget.blur();
+                    }
+                }, onChange: (e) => {
+                    setValueWrapper({
+                        ...value,
+                        value: tryParseNumber(e.currentTarget.value),
+                    });
+                } }),
             React.createElement(core$1.TextInput, { placeholder: "Unit", "data-testid": props.name + '-unit', defaultValue: value?.unit, onChange: (e) => setValueWrapper({
                     ...value,
                     unit: e.currentTarget.value,
@@ -2020,7 +2662,7 @@
                                 copy.splice(index, 1);
                                 setValuesWrapper(copy);
                             } },
-                            React.createElement(icons.IconCircleMinus, null)))))),
+                            React.createElement(IconCircleMinus, null)))))),
                 React.createElement("tr", null,
                     React.createElement("td", null),
                     React.createElement("td", { style: { textAlign: 'right' } },
@@ -2030,7 +2672,7 @@
                                 copy.push(undefined);
                                 setValuesWrapper(copy);
                             } },
-                            React.createElement(icons.IconCirclePlus, null)))))));
+                            React.createElement(IconCirclePlus, null)))))));
     }
 
     const daysOfWeek = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
@@ -2287,7 +2929,7 @@
         })));
     }
 
-    const useStyles$a = core$1.createStyles((theme) => ({
+    const useStyles$b = core$1.createStyles((theme) => ({
         table: {
             width: 350,
             '& th': {
@@ -2332,7 +2974,7 @@
         return date.toLocaleString('default', { month: 'long' }) + ' ' + date.getFullYear();
     }
     function CalendarInput(props) {
-        const { classes } = useStyles$a();
+        const { classes } = useStyles$b();
         const { onChangeMonth, onClick } = props;
         const [month, setMonth] = React.useState(getStartMonth);
         function moveMonth(delta) {
@@ -2415,6 +3057,19 @@
         return false;
     }
 
+    const useStyles$a = core$1.createStyles((theme) => ({
+        noteBody: { fontSize: theme.fontSizes.sm },
+        noteCite: { fontSize: theme.fontSizes.xs, marginBlockStart: 3 },
+        noteRoot: { padding: 5 },
+    }));
+    function NoteDisplay({ value }) {
+        const { classes } = useStyles$a();
+        if (!value) {
+            return null;
+        }
+        return (React.createElement(core$1.Stack, { justify: "flex-start", spacing: "xs" }, value.map((note, index) => note.text && (React.createElement(core$1.Blockquote, { key: `note-${index}`, classNames: { cite: classes.noteCite, body: classes.noteBody, root: classes.noteRoot }, cite: note.authorReference?.display || note.authorString, icon: null }, note.text)))));
+    }
+
     function ResourceName(props) {
         const { value, link, ...rest } = props;
         const resource = useResource(value);
@@ -2507,6 +3162,9 @@
                 border: `0.1px solid ${theme.colors.red[5]}`,
             },
         },
+        noteBody: { fontSize: theme.fontSizes.sm },
+        noteCite: { fontSize: theme.fontSizes.xs, marginBlockStart: 3 },
+        noteRoot: { padding: 5 },
     }));
     function DiagnosticReportDisplay(props) {
         const diagnosticReport = useResource(props.value);
@@ -2514,16 +3172,11 @@
         if (!diagnosticReport) {
             return null;
         }
-        let textContent = '';
+        const specimenNotes = specimen?.note || [];
         if (diagnosticReport.presentedForm && diagnosticReport.presentedForm.length > 0) {
             const pf = diagnosticReport.presentedForm[0];
             if (pf.contentType?.startsWith('text/plain') && pf.data) {
-                textContent = window.atob(pf.data);
-            }
-        }
-        if (specimen?.note) {
-            for (const note of specimen.note) {
-                textContent += note.text + '\n\n';
+                specimenNotes.push({ text: window.atob(pf.data) });
             }
         }
         return (React.createElement(core$1.Stack, null,
@@ -2544,8 +3197,8 @@
                 diagnosticReport.status && (React.createElement("div", null,
                     React.createElement(core$1.Text, { size: "xs", transform: "uppercase", color: "dimmed" }, "Status"),
                     React.createElement(core$1.Text, null, core.capitalize(diagnosticReport.status))))),
-            diagnosticReport.result && React.createElement(ObservationTable, { value: diagnosticReport.result }),
-            textContent && React.createElement("pre", null, textContent.trim())));
+            diagnosticReport.result && (React.createElement(ObservationTable, { hideObservationNotes: props.hideObservationNotes, value: diagnosticReport.result })),
+            specimenNotes.length > 0 && React.createElement(NoteDisplay, { value: specimenNotes })));
     }
     function ObservationTable(props) {
         const { classes } = useStyles$9();
@@ -2558,7 +3211,7 @@
                     React.createElement("th", null, "Interpretation"),
                     React.createElement("th", null, "Category"),
                     React.createElement("th", null, "Status"))),
-            React.createElement("tbody", null, props.value?.map((observation, index) => (React.createElement(ObservationRow, { key: 'obs-' + index, value: observation }))))));
+            React.createElement("tbody", null, props.value?.map((observation, index) => (React.createElement(ObservationRow, { key: `obs-${index}-${observation.id}`, hideObservationNotes: props.hideObservationNotes, value: observation }))))));
     }
     function ObservationRow(props) {
         const { classes, cx } = useStyles$9();
@@ -2566,19 +3219,24 @@
         if (!observation) {
             return null;
         }
+        const displayNotes = !props.hideObservationNotes && observation?.note;
         const critical = isCritical(observation);
-        return (React.createElement("tr", { className: cx({ [classes.criticalRow]: critical }) },
-            React.createElement("td", null,
-                React.createElement(MedplumLink, { to: observation },
-                    React.createElement(CodeableConceptDisplay, { value: observation.code }))),
-            React.createElement("td", null,
-                React.createElement(ObservationValueDisplay, { value: observation })),
-            React.createElement("td", null,
-                React.createElement(ReferenceRangeDisplay, { value: observation.referenceRange })),
-            React.createElement("td", null, observation.interpretation && observation.interpretation.length > 0 && (React.createElement(CodeableConceptDisplay, { value: observation.interpretation[0] }))),
-            React.createElement("td", null, observation.category && observation.category.length > 0 && (React.createElement("ul", null, observation.category.map((concept, index) => (React.createElement("li", { key: `category-${index}` },
-                React.createElement(CodeableConceptDisplay, { value: concept }))))))),
-            React.createElement("td", null, observation.status && React.createElement(StatusBadge, { status: observation.status }))));
+        return (React.createElement(React.Fragment, null,
+            React.createElement("tr", { className: cx({ [classes.criticalRow]: critical }) },
+                React.createElement("td", { rowSpan: displayNotes ? 2 : 1 },
+                    React.createElement(MedplumLink, { to: observation },
+                        React.createElement(CodeableConceptDisplay, { value: observation.code }))),
+                React.createElement("td", null,
+                    React.createElement(ObservationValueDisplay, { value: observation })),
+                React.createElement("td", null,
+                    React.createElement(ReferenceRangeDisplay, { value: observation.referenceRange })),
+                React.createElement("td", null, observation.interpretation && observation.interpretation.length > 0 && (React.createElement(CodeableConceptDisplay, { value: observation.interpretation[0] }))),
+                React.createElement("td", null, observation.category && observation.category.length > 0 && (React.createElement("ul", null, observation.category.map((concept, index) => (React.createElement("li", { key: `category-${index}` },
+                    React.createElement(CodeableConceptDisplay, { value: concept }))))))),
+                React.createElement("td", null, observation.status && React.createElement(StatusBadge, { status: observation.status }))),
+            displayNotes && (React.createElement("tr", null,
+                React.createElement("td", { colSpan: 5 },
+                    React.createElement(NoteDisplay, { value: observation.note }))))));
     }
     function ObservationValueDisplay(props) {
         const obs = props.value;
@@ -2689,7 +3347,10 @@
         if (!schema || !value) {
             return null;
         }
-        return (React.createElement(BackboneElementDisplay, { value: { type: value.resourceType, value }, ignoreMissingValues: props.ignoreMissingValues }));
+        return (React.createElement(BackboneElementDisplay, { value: {
+                type: value.resourceType,
+                value: props.forceUseInput ? props.value : value,
+            }, ignoreMissingValues: props.ignoreMissingValues }));
     }
 
     /**
@@ -2709,7 +3370,7 @@
         }
         render() {
             if (this.state.error) {
-                return (React.createElement(core$1.Alert, { icon: React.createElement(icons.IconAlertCircle, { size: 16 }), title: "Something went wrong", color: "red" }, core.normalizeErrorString(this.state.error)));
+                return (React.createElement(core$1.Alert, { icon: React.createElement(IconAlertCircle, { size: 16 }), title: "Something went wrong", color: "red" }, core.normalizeErrorString(this.state.error)));
             }
             return this.props.children;
         }
@@ -2734,7 +3395,7 @@
                 popupMenuItems && (React.createElement(core$1.Menu, { position: "bottom-end", shadow: "md", width: 200 },
                     React.createElement(core$1.Menu.Target, null,
                         React.createElement(core$1.ActionIcon, { radius: "xl", "aria-label": `Actions for ${core.getReferenceString(props.resource)}` },
-                            React.createElement(icons.IconDots, null))),
+                            React.createElement(IconDots, null))),
                     popupMenuItems))),
             React.createElement(ErrorBoundary, null,
                 padding && React.createElement("div", { style: { padding: '0 16px 16px 16px' } }, props.children),
@@ -2744,20 +3405,20 @@
     /**
      * Sorts an array of resources in place by meta.lastUpdated ascending.
      * @param resources Array of resources.
+     * @param timelineResource Optional primary resource of a timeline view. If specified, the primary resource will be sorted by meta.lastUpdated descending.
      */
-    function sortByDateAndPriority(resources) {
-        resources.sort(resourceDateComparator);
-    }
-    function resourceDateComparator(a, b) {
-        const priority1 = getPriorityScore(a);
-        const priority2 = getPriorityScore(b);
-        if (priority1 > priority2) {
-            return 1;
-        }
-        if (priority1 < priority2) {
-            return -1;
-        }
-        return getTime(a) - getTime(b);
+    function sortByDateAndPriority(resources, timelineResource) {
+        resources.sort((a, b) => {
+            const priority1 = getPriorityScore(a);
+            const priority2 = getPriorityScore(b);
+            if (priority1 > priority2) {
+                return 1;
+            }
+            if (priority1 < priority2) {
+                return -1;
+            }
+            return getTime(a, timelineResource) - getTime(b, timelineResource);
+        });
     }
     function getPriorityScore(resource) {
         const priority = resource.priority;
@@ -2766,18 +3427,21 @@
         }
         return 0;
     }
-    function getTime(resource) {
-        if (resource.resourceType === 'Communication' && resource.sent) {
-            return new Date(resource.sent).getTime();
-        }
-        if ((resource.resourceType === 'DiagnosticReport' ||
-            resource.resourceType === 'Media' ||
-            resource.resourceType === 'Observation') &&
-            resource.issued) {
-            return new Date(resource.issued).getTime();
-        }
-        if (resource.resourceType === 'DocumentReference' && resource.date) {
-            return new Date(resource.date).getTime();
+    function getTime(resource, timelineResource) {
+        if (!isSameResourceType(resource, timelineResource)) {
+            // Only use special case timestamps if not the primary resource of a timeline view.
+            if (resource.resourceType === 'Communication' && resource.sent) {
+                return new Date(resource.sent).getTime();
+            }
+            if ((resource.resourceType === 'DiagnosticReport' ||
+                resource.resourceType === 'Media' ||
+                resource.resourceType === 'Observation') &&
+                resource.issued) {
+                return new Date(resource.issued).getTime();
+            }
+            if (resource.resourceType === 'DocumentReference' && resource.date) {
+                return new Date(resource.date).getTime();
+            }
         }
         const dateTime = resource.meta?.lastUpdated;
         if (!dateTime) {
@@ -2785,6 +3449,9 @@
         }
         return new Date(dateTime).getTime();
     }
+    function isSameResourceType(a, b) {
+        return !!b && a.resourceType === b.resourceType && a.id === b.id;
+    }
 
     const useStyles$7 = core$1.createStyles((theme) => ({
         pinnedComment: {
@@ -2792,8 +3459,8 @@
         },
     }));
     function ResourceTimeline(props) {
-        const navigate = reactRouterDom.useNavigate();
         const medplum = useMedplum();
+        const navigate = useMedplumNavigate();
         const sender = medplum.getProfile();
         const inputRef = React.useRef(null);
         const resource = useResource(props.value);
@@ -2802,28 +3469,38 @@
         const loadTimelineResources = props.loadTimelineResources;
         const itemsRef = React.useRef(items);
         itemsRef.current = items;
-        const loadTimeline = React.useCallback(() => {
-            if (!resource) {
-                setItems([]);
-                setHistory({});
-                return;
-            }
-            loadTimelineResources(medplum, resource).then(handleBatchResponse).catch(console.log);
-        }, [medplum, resource, loadTimelineResources]);
-        React.useEffect(() => {
-            loadTimeline();
-        }, [loadTimeline]);
+        /**
+         * Sorts and sets the items.
+         *
+         * Sorting is primarily a function of meta.lastUpdated, but there are special cases.
+         * When displaying connected resources, for example a Communication in the context of an Encounter,
+         * the Communication.sent time is used rather than Communication.meta.lastUpdated.
+         *
+         * Other examples of special cases:
+         * - DiagnosticReport.issued
+         * - Media.issued
+         * - Observation.issued
+         * - DocumentReference.date
+         *
+         * See "sortByDateAndPriority()" for more details.
+         */
+        const sortAndSetItems = React.useCallback((newItmes) => {
+            sortByDateAndPriority(newItmes, resource);
+            newItmes.reverse();
+            setItems(newItmes);
+        }, [resource]);
         /**
          * Handles a batch request response.
          * @param batchResponse The batch response.
          */
-        function handleBatchResponse(bundles) {
+        const handleBatchResponse = React.useCallback((batchResponse) => {
             const newItems = [];
-            for (const bundle of bundles) {
-                if (!bundle) {
+            for (const settledResult of batchResponse) {
+                if (settledResult.status !== 'fulfilled') {
                     // User may not have access to all resource types
                     continue;
                 }
+                const bundle = settledResult.value;
                 if (bundle.type === 'history') {
                     setHistory(bundle);
                 }
@@ -2833,20 +3510,29 @@
                     }
                 }
             }
-            sortByDateAndPriority(newItems);
-            newItems.reverse();
-            setItems(newItems);
-        }
+            sortAndSetItems(newItems);
+        }, [sortAndSetItems]);
         /**
          * Adds an array of resources to the timeline.
-         * @param resources Array of resources.
+         * @param resource Resource to add.
          */
-        function addResources(resources) {
-            const newItems = [...itemsRef.current, ...resources];
-            sortByDateAndPriority(newItems);
-            newItems.reverse();
-            setItems(newItems);
-        }
+        const addResource = React.useCallback((resource) => sortAndSetItems([...itemsRef.current, resource]), [sortAndSetItems]);
+        /**
+         * Loads the timeline.
+         */
+        const loadTimeline = React.useCallback(() => {
+            let resourceType;
+            let id;
+            if ('resourceType' in props.value) {
+                resourceType = props.value.resourceType;
+                id = props.value.id;
+            }
+            else {
+                [resourceType, id] = props.value.reference?.split('/');
+            }
+            loadTimelineResources(medplum, resourceType, id).then(handleBatchResponse).catch(console.log);
+        }, [medplum, props.value, loadTimelineResources, handleBatchResponse]);
+        React.useEffect(() => loadTimeline(), [loadTimeline]);
         /**
          * Adds a Communication resource to the timeline.
          * @param contentString The comment content.
@@ -2858,9 +3544,7 @@
             }
             medplum
                 .createResource(props.createCommunication(resource, sender, contentString))
-                .then((result) => {
-                addResources([result]);
-            })
+                .then((result) => addResource(result))
                 .catch(console.log);
         }
         /**
@@ -2874,13 +3558,13 @@
             }
             medplum
                 .createResource(props.createMedia(resource, sender, attachment))
-                .then((result) => addResources([result]))
+                .then((result) => addResource(result))
                 .then(() => notifications.updateNotification({
                 id: 'upload-notification',
                 color: 'teal',
                 title: 'Upload complete',
                 message: '',
-                icon: React.createElement(icons.IconCheck, { size: 16 }),
+                icon: React.createElement(IconCheck, { size: 16 }),
                 autoClose: 2000,
             }))
                 .catch((reason) => notifications.updateNotification({
@@ -2888,7 +3572,7 @@
                 color: 'red',
                 title: 'Upload error',
                 message: core.normalizeErrorString(reason),
-                icon: React.createElement(icons.IconFileAlert, { size: 16 }),
+                icon: React.createElement(IconFileAlert, { size: 16 }),
                 autoClose: 2000,
             }));
         }
@@ -2951,10 +3635,14 @@
                         React.createElement(ResourceAvatar, { value: sender }),
                         React.createElement(core$1.TextInput, { name: "text", ref: inputRef, placeholder: "Add comment", style: { width: '100%', maxWidth: 300 } }),
                         React.createElement(core$1.ActionIcon, { type: "submit", radius: "xl", color: "blue", variant: "filled" },
-                            React.createElement(icons.IconMessage, { size: 16 })),
+                            React.createElement(IconMessage, { size: 16 })),
                         React.createElement(AttachmentButton, { onUpload: createMedia, onUploadStart: onUploadStart, onUploadProgress: onUploadProgress }, (props) => (React.createElement(core$1.ActionIcon, { ...props, radius: "xl", color: "blue", variant: "filled" },
-                            React.createElement(icons.IconCloudUpload, { size: 16 })))))))),
+                            React.createElement(IconCloudUpload, { size: 16 })))))))),
             items.map((item) => {
+                if (!item) {
+                    // TODO: Handle null history items for deleted versions.
+                    return null;
+                }
                 const key = `${item.resourceType}/${item.id}/${item.meta?.versionId}`;
                 if (item.resourceType === resource.resourceType && item.id === resource.id) {
                     return (React.createElement(HistoryTimelineItem, { key: key, history: history, resource: item, onDetails: onVersionDetails }));
@@ -2977,14 +3665,14 @@
     function TimelineItemPopupMenu(props) {
         return (React.createElement(core$1.Menu.Dropdown, null,
             React.createElement(core$1.Menu.Label, null, "Resource"),
-            props.onPin && (React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconPin, { size: 14 }), onClick: () => props.onPin(props.resource), "aria-label": `Pin ${core.getReferenceString(props.resource)}` }, "Pin")),
-            props.onUnpin && (React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconPinnedOff, { size: 14 }), onClick: () => props.onUnpin(props.resource), "aria-label": `Unpin ${core.getReferenceString(props.resource)}` }, "Unpin")),
-            props.onDetails && (React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconListDetails, { size: 14 }), onClick: () => props.onDetails(props.resource), "aria-label": `Details ${core.getReferenceString(props.resource)}` }, "Details")),
-            props.onEdit && (React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEdit, { size: 14 }), onClick: () => props.onEdit(props.resource), "aria-label": `Edit ${core.getReferenceString(props.resource)}` }, "Edit")),
+            props.onPin && (React.createElement(core$1.Menu.Item, { icon: React.createElement(IconPin, { size: 14 }), onClick: () => props.onPin(props.resource), "aria-label": `Pin ${core.getReferenceString(props.resource)}` }, "Pin")),
+            props.onUnpin && (React.createElement(core$1.Menu.Item, { icon: React.createElement(IconPinnedOff, { size: 14 }), onClick: () => props.onUnpin(props.resource), "aria-label": `Unpin ${core.getReferenceString(props.resource)}` }, "Unpin")),
+            props.onDetails && (React.createElement(core$1.Menu.Item, { icon: React.createElement(IconListDetails, { size: 14 }), onClick: () => props.onDetails(props.resource), "aria-label": `Details ${core.getReferenceString(props.resource)}` }, "Details")),
+            props.onEdit && (React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEdit, { size: 14 }), onClick: () => props.onEdit(props.resource), "aria-label": `Edit ${core.getReferenceString(props.resource)}` }, "Edit")),
             props.onDelete && (React.createElement(React.Fragment, null,
                 React.createElement(core$1.Menu.Divider, null),
                 React.createElement(core$1.Menu.Label, null, "Danger zone"),
-                React.createElement(core$1.Menu.Item, { color: "red", icon: React.createElement(icons.IconTrash, { size: 14 }), onClick: () => props.onDelete(props.resource), "aria-label": `Delete ${core.getReferenceString(props.resource)}` }, "Delete")))));
+                React.createElement(core$1.Menu.Item, { color: "red", icon: React.createElement(IconTrash, { size: 14 }), onClick: () => props.onDelete(props.resource), "aria-label": `Delete ${core.getReferenceString(props.resource)}` }, "Delete")))));
     }
     function HistoryTimelineItem(props) {
         const previous = getPrevious(props.history, props.resource);
@@ -2995,7 +3683,7 @@
         else {
             return (React.createElement(TimelineItem, { resource: props.resource, padding: true, popupMenuItems: React.createElement(TimelineItemPopupMenu, { ...props }) },
                 React.createElement("h3", null, "Created"),
-                React.createElement(ResourceTable, { value: props.resource, ignoreMissingValues: true })));
+                React.createElement(ResourceTable, { value: props.resource, ignoreMissingValues: true, forceUseInput: true })));
         }
     }
     function getPrevious(history, version) {
@@ -3047,20 +3735,17 @@
     }
 
     function DefaultResourceTimeline(props) {
-        return (React.createElement(ResourceTimeline, { value: props.resource, loadTimelineResources: async (medplum, resource) => {
-                return Promise.all([
-                    medplum.readHistory(resource.resourceType, resource.id),
-                    medplum.search('AuditEvent', '_sort=-_lastUpdated&entity=' + core.getReferenceString(resource)),
-                ]);
+        return (React.createElement(ResourceTimeline, { value: props.resource, loadTimelineResources: async (medplum, resourceType, id) => {
+                return Promise.allSettled([medplum.readHistory(resourceType, id)]);
             } }));
     }
 
     function EncounterTimeline(props) {
-        return (React.createElement(ResourceTimeline, { value: props.encounter, loadTimelineResources: async (medplum, resource) => {
-                return Promise.all([
-                    medplum.readHistory('Encounter', resource.id),
-                    medplum.search('Communication', 'encounter=' + core.getReferenceString(resource)),
-                    medplum.search('Media', 'encounter=' + core.getReferenceString(resource)),
+        return (React.createElement(ResourceTimeline, { value: props.encounter, loadTimelineResources: async (medplum, _resourceType, id) => {
+                return Promise.allSettled([
+                    medplum.readHistory('Encounter', id),
+                    medplum.search('Communication', 'encounter=Encounter/' + id),
+                    medplum.search('Media', 'encounter=Encounter/' + id),
                 ]);
             }, createCommunication: (resource, sender, text) => ({
                 resourceType: 'Communication',
@@ -3968,60 +4653,60 @@
         const { searchParam } = props;
         const code = searchParam.code;
         return (React.createElement(core$1.Menu.Dropdown, null,
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSortAscending, { size: 14 }), onClick: () => props.onSort(searchParam, false) }, "Sort Oldest to Newest"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSortDescending, { size: 14 }), onClick: () => props.onSort(searchParam, true) }, "Sort Newest to Oldest"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSortAscending, { size: 14 }), onClick: () => props.onSort(searchParam, false) }, "Sort Oldest to Newest"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSortDescending, { size: 14 }), onClick: () => props.onSort(searchParam, true) }, "Sort Newest to Oldest"),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT_EQUALS) }, "Does not equal..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT_EQUALS) }, "Does not equal..."),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconMathLower, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.ENDS_BEFORE) }, "Before..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconMathGreater, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.STARTS_AFTER) }, "After..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconBracketsContain, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Between..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconMathLower, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.ENDS_BEFORE) }, "Before..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconMathGreater, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.STARTS_AFTER) }, "After..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconBracketsContain, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Between..."),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconCalendar, { size: 14 }), onClick: () => props.onChange(addTomorrowFilter(props.search, code)) }, "Tomorrow"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconCalendar, { size: 14 }), onClick: () => props.onChange(addTodayFilter(props.search, code)) }, "Today"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconCalendar, { size: 14 }), onClick: () => props.onChange(addYesterdayFilter(props.search, code)) }, "Yesterday"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconCalendar, { size: 14 }), onClick: () => props.onChange(addTomorrowFilter(props.search, code)) }, "Tomorrow"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconCalendar, { size: 14 }), onClick: () => props.onChange(addTodayFilter(props.search, code)) }, "Today"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconCalendar, { size: 14 }), onClick: () => props.onChange(addYesterdayFilter(props.search, code)) }, "Yesterday"),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconCalendar, { size: 14 }), onClick: () => props.onChange(addNextMonthFilter(props.search, code)) }, "Next Month"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconCalendar, { size: 14 }), onClick: () => props.onChange(addThisMonthFilter(props.search, code)) }, "This Month"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconCalendar, { size: 14 }), onClick: () => props.onChange(addLastMonthFilter(props.search, code)) }, "Last Month"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconCalendar, { size: 14 }), onClick: () => props.onChange(addNextMonthFilter(props.search, code)) }, "Next Month"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconCalendar, { size: 14 }), onClick: () => props.onChange(addThisMonthFilter(props.search, code)) }, "This Month"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconCalendar, { size: 14 }), onClick: () => props.onChange(addLastMonthFilter(props.search, code)) }, "Last Month"),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconCalendar, { size: 14 }), onClick: () => props.onChange(addYearToDateFilter(props.search, code)) }, "Year to date"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconCalendar, { size: 14 }), onClick: () => props.onChange(addYearToDateFilter(props.search, code)) }, "Year to date"),
             React.createElement(CommonMenuItems, { ...props })));
     }
     function NumericFilterSubMenu(props) {
         const { searchParam } = props;
         return (React.createElement(core$1.Menu.Dropdown, null,
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSortAscending, { size: 14 }), onClick: () => props.onSort(searchParam, false) }, "Sort Smallest to Largest"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSortDescending, { size: 14 }), onClick: () => props.onSort(searchParam, true) }, "Sort Largest to Smallest"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSortAscending, { size: 14 }), onClick: () => props.onSort(searchParam, false) }, "Sort Smallest to Largest"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSortDescending, { size: 14 }), onClick: () => props.onSort(searchParam, true) }, "Sort Largest to Smallest"),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT_EQUALS) }, "Does not equal..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT_EQUALS) }, "Does not equal..."),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconMathGreater, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.GREATER_THAN) }, "Greater than..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSettings, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.GREATER_THAN_OR_EQUALS) }, "Greater than or equal to..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconMathLower, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.LESS_THAN) }, "Less than..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSettings, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.LESS_THAN_OR_EQUALS) }, "Less than or equal to..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconMathGreater, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.GREATER_THAN) }, "Greater than..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSettings, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.GREATER_THAN_OR_EQUALS) }, "Greater than or equal to..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconMathLower, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.LESS_THAN) }, "Less than..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSettings, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.LESS_THAN_OR_EQUALS) }, "Less than or equal to..."),
             React.createElement(CommonMenuItems, { ...props })));
     }
     function ReferenceFilterSubMenu(props) {
         const { searchParam } = props;
         return (React.createElement(core$1.Menu.Dropdown, null,
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT) }, "Does not equal..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT) }, "Does not equal..."),
             React.createElement(CommonMenuItems, { ...props })));
     }
     function TextFilterSubMenu(props) {
         const { searchParam } = props;
         return (React.createElement(core$1.Menu.Dropdown, null,
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSortAscending, { size: 14 }), onClick: () => props.onSort(searchParam, false) }, "Sort A to Z"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconSortDescending, { size: 14 }), onClick: () => props.onSort(searchParam, true) }, "Sort Z to A"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSortAscending, { size: 14 }), onClick: () => props.onSort(searchParam, false) }, "Sort A to Z"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconSortDescending, { size: 14 }), onClick: () => props.onSort(searchParam, true) }, "Sort Z to A"),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT) }, "Does not equal..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqual, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Equals..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconEqualNot, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.NOT) }, "Does not equal..."),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconBucket, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.CONTAINS) }, "Contains..."),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconBucketOff, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Does not contain..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconBucket, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.CONTAINS) }, "Contains..."),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconBucketOff, { size: 14 }), onClick: () => props.onPrompt(searchParam, core.Operator.EQUALS) }, "Does not contain..."),
             React.createElement(CommonMenuItems, { ...props })));
     }
     function CommonMenuItems(props) {
@@ -4029,10 +4714,10 @@
         const code = searchParam.code;
         return (React.createElement(React.Fragment, null,
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconBleach, { size: 14 }), onClick: () => props.onChange(addMissingFilter(props.search, code)) }, "Missing"),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconBleachOff, { size: 14 }), onClick: () => props.onChange(addMissingFilter(props.search, code, false)) }, "Not missing"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconBleach, { size: 14 }), onClick: () => props.onChange(addMissingFilter(props.search, code)) }, "Missing"),
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconBleachOff, { size: 14 }), onClick: () => props.onChange(addMissingFilter(props.search, code, false)) }, "Not missing"),
             React.createElement(core$1.Menu.Divider, null),
-            React.createElement(core$1.Menu.Item, { icon: React.createElement(icons.IconX, { size: 14 }), onClick: () => props.onClear(searchParam) }, "Clear filters")));
+            React.createElement(core$1.Menu.Item, { icon: React.createElement(IconX, { size: 14 }), onClick: () => props.onClear(searchParam) }, "Clear filters")));
     }
 
     /**
@@ -4307,12 +4992,12 @@
         return (React.createElement("div", { className: classes.root, "data-testid": "search-control" },
             !props.hideToolbar && (React.createElement(core$1.Group, { position: "apart", mb: "xl" },
                 React.createElement(core$1.Group, { spacing: 2 },
-                    React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(icons.IconFilter, { size: iconSize }), onClick: () => setState({ ...stateRef.current, fieldEditorVisible: true }) }, "Fields"),
-                    React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(icons.IconColumns, { size: iconSize }), onClick: () => setState({ ...stateRef.current, filterEditorVisible: true }) }, "Filters"),
-                    props.onNew && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(icons.IconFilePlus, { size: iconSize }), onClick: props.onNew }, "New...")),
-                    !isMobile && props.onExport && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(icons.IconTableExport, { size: iconSize }), onClick: props.onExport }, "Export...")),
-                    !isMobile && props.onDelete && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(icons.IconTrash, { size: iconSize }), onClick: () => props.onDelete(Object.keys(state.selected)) }, "Delete...")),
-                    !isMobile && props.onBulk && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(icons.IconBoxMultiple, { size: iconSize }), onClick: () => props.onBulk(Object.keys(state.selected)) }, "Bulk..."))),
+                    React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(IconFilter, { size: iconSize }), onClick: () => setState({ ...stateRef.current, fieldEditorVisible: true }) }, "Fields"),
+                    React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(IconColumns, { size: iconSize }), onClick: () => setState({ ...stateRef.current, filterEditorVisible: true }) }, "Filters"),
+                    props.onNew && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(IconFilePlus, { size: iconSize }), onClick: props.onNew }, "New...")),
+                    !isMobile && props.onExport && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(IconTableExport, { size: iconSize }), onClick: props.onExport }, "Export...")),
+                    !isMobile && props.onDelete && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(IconTrash, { size: iconSize }), onClick: () => props.onDelete(Object.keys(state.selected)) }, "Delete...")),
+                    !isMobile && props.onBulk && (React.createElement(core$1.Button, { compact: true, variant: buttonVariant, color: buttonColor, leftIcon: React.createElement(IconBoxMultiple, { size: iconSize }), onClick: () => props.onBulk(Object.keys(state.selected)) }, "Bulk..."))),
                 lastResult && (React.createElement(core$1.Text, { size: "xs", color: "dimmed" },
                     getStart$1(search, lastResult.total),
                     "-",
@@ -4332,7 +5017,7 @@
                                         React.createElement(core$1.Group, { position: "apart", noWrap: true },
                                             React.createElement(core$1.Text, { weight: 500, size: "sm" }, buildFieldNameString(field.name)),
                                             React.createElement(core$1.Center, { className: classes.icon },
-                                                React.createElement(icons.IconAdjustmentsHorizontal, { size: 14, stroke: 1.5 }))))),
+                                                React.createElement(IconAdjustmentsHorizontal, { size: 14, stroke: 1.5 }))))),
                                 React.createElement(SearchPopupMenu, { search: props.search, searchParams: field.searchParams, onPrompt: (searchParam, filter) => {
                                         setState({
                                             ...stateRef.current,
@@ -4536,15 +5221,15 @@
     const MemoizedFhirPathTable = React.memo(FhirPathTable);
 
     function PatientTimeline(props) {
-        const loadTimelineResources = React.useCallback((medplum, resource) => {
-            return Promise.all([
-                medplum.readHistory('Patient', resource.id),
-                medplum.search('Communication', 'subject=' + core.getReferenceString(resource)),
-                medplum.search('Device', 'patient=' + core.getReferenceString(resource)),
-                medplum.search('DeviceRequest', 'patient=' + core.getReferenceString(resource)),
-                medplum.search('DiagnosticReport', 'subject=' + core.getReferenceString(resource)),
-                medplum.search('Media', 'subject=' + core.getReferenceString(resource)),
-                medplum.search('ServiceRequest', 'subject=' + core.getReferenceString(resource)),
+        const loadTimelineResources = React.useCallback((medplum, _resourceType, id) => {
+            return Promise.allSettled([
+                medplum.readHistory('Patient', id),
+                medplum.search('Communication', 'subject=Patient/' + id),
+                medplum.search('Device', 'patient=Patient/' + id),
+                medplum.search('DeviceRequest', 'patient=Patient/' + id),
+                medplum.search('DiagnosticReport', 'subject=Patient/' + id),
+                medplum.search('Media', 'subject=Patient/' + id),
+                medplum.search('ServiceRequest', 'subject=Patient/' + id),
             ]);
         }, []);
         return (React.createElement(ResourceTimeline, { value: props.patient, loadTimelineResources: loadTimelineResources, createCommunication: (resource, sender, text) => ({
@@ -4849,7 +5534,6 @@
         function setItems(newResponseItems) {
             const newResponse = {
                 resourceType: 'QuestionnaireResponse',
-                status: 'completed',
                 item: newResponseItems,
             };
             setResponse(newResponse);
@@ -4866,6 +5550,7 @@
                         subject: props.subject,
                         source: core.createReference(source),
                         authored: new Date().toISOString(),
+                        status: 'completed',
                     });
                 }
             } },
@@ -4957,7 +5642,7 @@
             case exports.QuestionnaireItemType.reference:
                 return (React.createElement(ReferenceInput, { name: name, defaultValue: initial?.valueReference, onChange: (newValue) => onChangeAnswer({ valueReference: newValue }) }));
             case exports.QuestionnaireItemType.quantity:
-                return (React.createElement(QuantityInput, { name: name, defaultValue: initial?.valueQuantity, onChange: (newValue) => onChangeAnswer({ valueQuantity: newValue }) }));
+                return (React.createElement(QuantityInput, { name: name, defaultValue: initial?.valueQuantity, onChange: (newValue) => onChangeAnswer({ valueQuantity: newValue }), disableWheel: true }));
             case exports.QuestionnaireItemType.choice:
             case exports.QuestionnaireItemType.openChoice:
                 if (isDropDownChoice(item)) {
@@ -5396,7 +6081,7 @@
                     addGroup({ id: `group-id-${groupId}`, filters: {}, intervals: [] });
                     setGroupId((id) => id + 1);
                 } },
-                React.createElement(icons.IconCirclePlus, null)),
+                React.createElement(IconCirclePlus, null)),
             React.createElement(core$1.Group, { position: "right" },
                 React.createElement(core$1.Button, { type: "submit" }, "Save"))));
         /**
@@ -5469,7 +6154,7 @@
                             killEvent(e);
                             props.onRemoveGroup(intervalGroup);
                         } },
-                        React.createElement(icons.IconCircleMinus, null))),
+                        React.createElement(IconCircleMinus, null))),
                 React.createElement(ReferenceRangeGroupFilters, { intervalGroup: intervalGroup, onChange: props.onChange }),
                 React.createElement(core$1.Divider, null),
                 intervalGroup.intervals.map((interval) => (React.createElement(core$1.Stack, { key: `interval-${interval.id}`, spacing: 'xs' },
@@ -5482,7 +6167,7 @@
                                 killEvent(e);
                                 props.onRemove(intervalGroup.id, interval);
                             } },
-                            React.createElement(icons.IconCircleMinus, null))),
+                            React.createElement(IconCircleMinus, null))),
                     React.createElement(RangeInput, { onChange: (range) => {
                             props.onChange(intervalGroup.id, { ...interval, range });
                         }, key: `range-${interval.id}`, name: `range-${interval.id}`, defaultValue: interval.range })))),
@@ -5495,7 +6180,7 @@
                             },
                         });
                     } },
-                    React.createElement(icons.IconCirclePlus, null)))));
+                    React.createElement(IconCirclePlus, null)))));
     }
     /**
      * Render the "filters" section of the IntervalGroup. Also populates some initial
@@ -5646,7 +6331,7 @@
             const taskInput = task?.input?.[0]?.valueReference;
             const taskOutput = task?.output?.[0]?.valueReference;
             return (React.createElement(React.Fragment, { key: `action-${index}` },
-                React.createElement(core$1.Grid.Col, { span: 1, p: "md" }, task?.status === 'completed' ? React.createElement(icons.IconCheckbox, null) : React.createElement(icons.IconSquare, { color: "gray" })),
+                React.createElement(core$1.Grid.Col, { span: 1, p: "md" }, task?.status === 'completed' ? React.createElement(IconCheckbox, null) : React.createElement(IconSquare, { color: "gray" })),
                 React.createElement(core$1.Grid.Col, { span: 9, p: "xs" },
                     React.createElement(core$1.Text, { weight: 500 }, action.title),
                     action.description && React.createElement("div", null, action.description),
@@ -6134,12 +6819,12 @@
     }
 
     function ServiceRequestTimeline(props) {
-        return (React.createElement(ResourceTimeline, { value: props.serviceRequest, loadTimelineResources: async (medplum, resource) => {
-                return Promise.all([
-                    medplum.readHistory('ServiceRequest', resource.id),
-                    medplum.search('Communication', 'based-on=' + core.getReferenceString(resource)),
-                    medplum.search('Media', '_count=100&based-on=' + core.getReferenceString(resource)),
-                    medplum.search('DiagnosticReport', 'based-on=' + core.getReferenceString(resource)),
+        return (React.createElement(ResourceTimeline, { value: props.serviceRequest, loadTimelineResources: async (medplum, _resourceType, id) => {
+                return Promise.allSettled([
+                    medplum.readHistory('ServiceRequest', id),
+                    medplum.search('Communication', 'based-on=ServiceRequest/' + id),
+                    medplum.search('Media', '_count=100&based-on=ServiceRequest/' + id),
+                    medplum.search('DiagnosticReport', 'based-on=ServiceRequest/' + id),
                 ]);
             }, createCommunication: (resource, sender, text) => ({
                 resourceType: 'Communication',
@@ -6208,6 +6893,7 @@
     exports.MoneyDisplay = MoneyDisplay;
     exports.MoneyInput = MoneyInput;
     exports.ObservationTable = ObservationTable;
+    exports.OperationOutcomeAlert = OperationOutcomeAlert;
     exports.Panel = Panel;
     exports.PatientTimeline = PatientTimeline;
     exports.PlanDefinitionBuilder = PlanDefinitionBuilder;
@@ -6294,6 +6980,7 @@
     exports.toggleSort = toggleSort;
     exports.useMedplum = useMedplum;
     exports.useMedplumContext = useMedplumContext;
+    exports.useMedplumNavigate = useMedplumNavigate;
     exports.useMedplumProfile = useMedplumProfile;
     exports.useResource = useResource;