@medplum/react 0.9.28 → 0.9.31

package/dist/cjs/styles.css

@@ -172,6 +172,203 @@ select.medplum-select:disabled {
   box-shadow: 0 0 0 2px var(--medplum-blue-200);
 }
 
+.medplum-document {
+  margin: 20px auto 6px auto;
+  padding: 10px;
+  clear: both;
+  text-align: center;
+}
+
+.medplum-document article {
+  background-color: var(--medplum-surface);
+  max-width: 900px;
+  margin: 8px auto 16px auto;
+  padding: 15px 25px;
+  text-align: left;
+  border: 0.1px solid var(--medplum-gray-300);
+  border-radius: 8px;
+  box-shadow: 0 1px 3px 0 var(--medplum-shadow);
+}
+
+.medplum-document h1,
+.medplum-document h2,
+.medplum-document h3 {
+  margin: 12px 0;
+}
+
+.medplum-document p,
+.medplum-document li {
+  line-height: 175%;
+  margin: 8px 0;
+}
+
+@media (max-width: 700px) {
+  .medplum-document {
+    margin: 10px auto 6px auto;
+    padding: 6px;
+  }
+
+  .medplum-document article {
+    padding: 6px 12px;
+  }
+}
+
+.medplum-document img,
+.medplum-document video {
+  width: 100%;
+}
+
+.medplum-document textarea {
+  margin: 0;
+  min-height: 100px;
+  width: 100%;
+}
+
+fieldset.medplum-form-section {
+  border: 0;
+  margin: 6px 0 12px 0;
+  padding: 2px 0 8px 0;
+}
+
+fieldset.medplum-form-section > label,
+fieldset.medplum-form-section > legend {
+  display: block;
+  margin: 1px 0 3px 0;
+  line-height: 1.75;
+  font-weight: 500;
+}
+
+fieldset.medplum-form-section > p {
+  margin: 1px 0 4px 0;
+  padding: 1px 0 4px 0;
+  line-height: 1.75;
+}
+
+.medplum-signin-buttons {
+  display: flex;
+  justify-content: space-between;
+  line-height: 32px;
+}
+
+.medplum-signin-buttons > div {
+  display: flex;
+  align-items: center;
+}
+
+.medplum-signin-buttons a {
+  font-size: 12px;
+  margin-right: 16px;
+}
+
+.medplum-signin-buttons label {
+  font-size: 12px;
+}
+
+.medplum-signin-google-container {
+  padding: 20px 0 10px 0;
+  margin: 20px 0 10px 0;
+  height: 70px;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.medplum-signin-separator {
+  padding: 12px 0;
+  margin: 12px 0;
+  overflow: hidden;
+  text-align: center;
+  font-size: var(--medplum-font-small);
+}
+
+.medplum-signin-separator::before,
+.medplum-signin-separator::after {
+  background-color: var(--medplum-gray-400);
+  content: '';
+  display: inline-block;
+  height: 0.1px;
+  position: relative;
+  vertical-align: middle;
+  width: 50%;
+}
+
+.medplum-signin-separator::before {
+  right: 0.5em;
+  margin-left: -50%;
+}
+
+.medplum-signin-separator::after {
+  left: 0.5em;
+  margin-right: -50%;
+}
+
+.medplum-left {
+  text-align: left;
+}
+
+.medplum-center {
+  text-align: center;
+}
+
+.medplum-right {
+  text-align: right;
+}
+
+.medplum-avatar {
+  padding: 0;
+  width: 32px;
+  height: 32px;
+  min-width: 32px;
+  min-height: 32px;
+  line-height: 32px;
+  user-select: none;
+  border-radius: 50%;
+  overflow: hidden;
+  text-align: center;
+  color: var(--medplum-surface);
+  background-color: var(--medplum-gray-500);
+  font-size: 18px;
+}
+
+.medplum-avatar img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.medplum-avatar.xsmall {
+  width: 20px;
+  height: 20px;
+  min-width: 20px;
+  min-height: 20px;
+  line-height: 20px;
+  font-size: 10px;
+}
+
+.medplum-avatar.small {
+  width: 24px;
+  height: 24px;
+  min-width: 24px;
+  min-height: 24px;
+  line-height: 24px;
+  font-size: 11px;
+}
+
+.medplum-avatar.large {
+  width: 56px;
+  height: 56px;
+  min-width: 56px;
+  min-height: 56px;
+  line-height: 56px;
+  font-size: 28px;
+}
+
+.medplum-avatar > a {
+  color: var(--medplum-surface);
+  text-decoration: none;
+}
+
 .medplum-autocomplete-container {
   border: 0.1px solid var(--medplum-gray-300);
   border-radius: 3px;
@@ -306,60 +503,6 @@ select.medplum-select:disabled {
   color: var(--medplum-gray-500);
 }
 
-.medplum-avatar {
-  padding: 0;
-  width: 32px;
-  height: 32px;
-  min-width: 32px;
-  min-height: 32px;
-  line-height: 32px;
-  user-select: none;
-  border-radius: 50%;
-  overflow: hidden;
-  text-align: center;
-  color: var(--medplum-surface);
-  background-color: var(--medplum-gray-500);
-  font-size: 18px;
-}
-
-.medplum-avatar img {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-
-.medplum-avatar.xsmall {
-  width: 20px;
-  height: 20px;
-  min-width: 20px;
-  min-height: 20px;
-  line-height: 20px;
-  font-size: 10px;
-}
-
-.medplum-avatar.small {
-  width: 24px;
-  height: 24px;
-  min-width: 24px;
-  min-height: 24px;
-  line-height: 24px;
-  font-size: 11px;
-}
-
-.medplum-avatar.large {
-  width: 56px;
-  height: 56px;
-  min-width: 56px;
-  min-height: 56px;
-  line-height: 56px;
-  font-size: 28px;
-}
-
-.medplum-avatar > a {
-  color: var(--medplum-surface);
-  text-decoration: none;
-}
-
 .medplum-checkbox-form-section {
   display: flex;
   justify-content: space-between;
@@ -378,26 +521,6 @@ select.medplum-select:disabled {
   font-weight: 500;
 }
 
-fieldset.medplum-form-section {
-  border: 0;
-  margin: 6px 0 12px 0;
-  padding: 2px 0 8px 0;
-}
-
-fieldset.medplum-form-section > label,
-fieldset.medplum-form-section > legend {
-  display: block;
-  margin: 1px 0 3px 0;
-  line-height: 1.75;
-  font-weight: 500;
-}
-
-fieldset.medplum-form-section > p {
-  margin: 1px 0 4px 0;
-  padding: 1px 0 4px 0;
-  line-height: 1.75;
-}
-
 dl.medplum-description-list {
   display: grid;
   grid-template-columns: 30% 70%;
@@ -816,109 +939,6 @@ table.medplum-diff-table td {
   margin-right: 4px;
 }
 
-.medplum-document {
-  margin: 20px auto 6px auto;
-  padding: 10px;
-  clear: both;
-  text-align: center;
-}
-
-.medplum-document article {
-  background-color: var(--medplum-surface);
-  max-width: 900px;
-  margin: 8px auto 16px auto;
-  padding: 15px 25px;
-  text-align: left;
-  border: 0.1px solid var(--medplum-gray-300);
-  border-radius: 8px;
-  box-shadow: 0 1px 3px 0 var(--medplum-shadow);
-}
-
-.medplum-document h1,
-.medplum-document h2,
-.medplum-document h3 {
-  margin: 12px 0;
-}
-
-.medplum-document p,
-.medplum-document li {
-  line-height: 175%;
-  margin: 8px 0 16px 0;
-}
-
-@media (max-width: 700px) {
-  .medplum-document {
-    margin: 10px auto 6px auto;
-    padding: 6px;
-  }
-
-  .medplum-document article {
-    padding: 6px 12px;
-  }
-}
-
-.medplum-document img,
-.medplum-document video {
-  width: 100%;
-}
-
-.medplum-document textarea {
-  margin: 0;
-  min-height: 100px;
-  width: 100%;
-}
-
-.medplum-filter-editor {
-  text-align: left;
-  width: 900px;
-  max-width: 900px;
-}
-
-.medplum-filter-editor-table {
-  width: 100%;
-  border-collapse: collapse;
-}
-
-.medplum-menu-separator {
-  border-top: 0.1px solid var(--medplum-gray-400);
-  margin: 4px 0;
-  padding: 0;
-}
-
-.medplum-submenu-arrow {
-  color: var(--medplum-foreground);
-  left: auto;
-  padding-right: 6px;
-  position: absolute;
-  right: 0;
-  text-align: right;
-  user-select: none;
-}
-
-.medplum-title-bar {
-  display: flex;
-  width: 100%;
-  height: 50px;
-  padding: 15px;
-  justify-content: space-between;
-  background: var(--medplum-surface);
-  border-bottom: 2px solid var(--medplum-gray-200);
-  color: var(--medplum-gray-800);
-}
-
-.medplum-title-bar > div {
-  display: flex;
-  align-items: center;
-}
-
-.medplum-title-bar h1 {
-  font-size: 14px;
-  font-weight: bold;
-  padding: 0 4px 0 1px;
-  margin: 0 4px 0 1px;
-  color: var(--medplum-gray-800);
-}
-
 .medplum-search-control {
   max-width: 100%;
   overflow: auto;
@@ -1038,6 +1058,57 @@ table.medplum-diff-table td {
   outline: 0;
 }
 
+.medplum-filter-editor {
+  text-align: left;
+  width: 900px;
+  max-width: 900px;
+}
+
+.medplum-filter-editor-table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.medplum-menu-separator {
+  border-top: 0.1px solid var(--medplum-gray-400);
+  margin: 4px 0;
+  padding: 0;
+}
+
+.medplum-submenu-arrow {
+  color: var(--medplum-foreground);
+  left: auto;
+  padding-right: 6px;
+  position: absolute;
+  right: 0;
+  text-align: right;
+  user-select: none;
+}
+
+.medplum-title-bar {
+  display: flex;
+  width: 100%;
+  height: 50px;
+  padding: 15px;
+  justify-content: space-between;
+  background: var(--medplum-surface);
+  border-bottom: 2px solid var(--medplum-gray-200);
+  color: var(--medplum-gray-800);
+}
+
+.medplum-title-bar > div {
+  display: flex;
+  align-items: center;
+}
+
+.medplum-title-bar h1 {
+  font-size: 14px;
+  font-weight: bold;
+  padding: 0 4px 0 1px;
+  margin: 0 4px 0 1px;
+  color: var(--medplum-gray-800);
+}
+
 .medplum-footer {
   text-align: center;
   font-size: 12px;
@@ -1374,76 +1445,6 @@ div.medplum-nav-menu-container {
   color: var(--medplum-blue-500);
 }
 
-.medplum-signin-buttons {
-  display: flex;
-  justify-content: space-between;
-  line-height: 32px;
-}
-
-.medplum-signin-buttons > div {
-  display: flex;
-  align-items: center;
-}
-
-.medplum-signin-buttons a {
-  font-size: 12px;
-  margin-right: 16px;
-}
-
-.medplum-signin-buttons label {
-  font-size: 12px;
-}
-
-.medplum-signin-google-container {
-  padding: 20px 0 10px 0;
-  margin: 20px 0 10px 0;
-  text-align: center;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.medplum-signin-separator {
-  padding: 12px 0;
-  margin: 12px 0;
-  overflow: hidden;
-  text-align: center;
-  font-size: var(--medplum-font-small);
-}
-
-.medplum-signin-separator::before,
-.medplum-signin-separator::after {
-  background-color: var(--medplum-gray-400);
-  content: '';
-  display: inline-block;
-  height: 0.1px;
-  position: relative;
-  vertical-align: middle;
-  width: 50%;
-}
-
-.medplum-signin-separator::before {
-  right: 0.5em;
-  margin-left: -50%;
-}
-
-.medplum-signin-separator::after {
-  left: 0.5em;
-  margin-right: -50%;
-}
-
-.medplum-left {
-  text-align: left;
-}
-
-.medplum-center {
-  text-align: center;
-}
-
-.medplum-right {
-  text-align: right;
-}
-
 .medplum-status {
   padding: 1px 6px;
   font-size: 80%;

package/dist/cjs/test.setup.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/cjs/useResource.d.ts

@@ -0,0 +1,8 @@
+import { Reference, Resource } from '@medplum/fhirtypes';
+/**
+ * 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.
+ */
+export declare function useResource<T extends Resource>(value: Reference<T> | T | undefined): T | undefined;

package/dist/cjs/utils/blame.d.ts

@@ -0,0 +1,8 @@
+import { Bundle, Meta } from '@medplum/fhirtypes';
+export interface BlameRow {
+    id: string;
+    meta: Meta;
+    value: string;
+    span: number;
+}
+export declare function blame(history: Bundle): BlameRow[];

package/dist/cjs/utils/date.d.ts

@@ -0,0 +1,6 @@
+import { Resource } from '@medplum/fhirtypes';
+/**
+ * Sorts an array of resources in place by meta.lastUpdated ascending.
+ * @param resources Array of resources.
+ */
+export declare function sortByDateAndPriority(resources: Resource[]): void;

package/dist/cjs/utils/diff.d.ts

@@ -0,0 +1,16 @@
+export declare function diff(original: string[], revised: string[]): Delta[];
+export interface PathNode {
+    readonly i: number;
+    readonly j: number;
+    readonly prev: PathNode | undefined;
+    readonly snake: boolean;
+}
+export interface Delta {
+    readonly original: Chunk;
+    readonly revised: Chunk;
+    readonly type: 'change' | 'delete' | 'insert';
+}
+export interface Chunk {
+    readonly position: number;
+    readonly lines: string[];
+}

package/dist/cjs/utils/dom.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+/**
+ * Kills a browser event.
+ * Prevents default behavior.
+ * Stops event propagation.
+ * @param e The event.
+ */
+export declare function killEvent(e: Event | React.SyntheticEvent): void;
+/**
+ * Returns true if the element is a checkbox or a table cell containing a checkbox.
+ * Table cells containing checkboxes are commonly accidentally clicked.
+ * @param el The HTML DOM element.
+ * @returns True if the element is a checkbox or a table cell containing a checkbox.
+ */
+export declare function isCheckboxCell(el: Element): boolean;

package/dist/cjs/utils/outcomes.d.ts

@@ -0,0 +1,2 @@
+import { OperationOutcome, OperationOutcomeIssue } from '@medplum/fhirtypes';
+export declare function getIssuesForExpression(outcome: OperationOutcome | undefined, expression: string | undefined): OperationOutcomeIssue[] | undefined;

package/dist/cjs/utils/recaptcha.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Dynamically loads the recaptcha script.
+ * We do not want to load the script on page load unless the user needs it.
+ * @param siteKey The reCAPTCHA site key, available from the reCAPTCHA admin page.
+ */
+export declare function initRecaptcha(siteKey: string): void;
+/**
+ * Starts a request to generate a recapcha token.
+ * @param siteKey The reCAPTCHA site key, available from the reCAPTCHA admin page.
+ * @returns Promise to a recaptcha token for the current user.
+ */
+export declare function getRecaptcha(siteKey: string): Promise<string>;

package/dist/cjs/utils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Dynamically creates a script tag for the specified JavaScript file.
+ * @param src The JavaScript file URL.
+ */
+export declare function createScriptTag(src: string, onload?: () => void): void;

package/dist/esm/Autocomplete.js

@@ -64,6 +64,7 @@ function Autocomplete(props) {
         }
     }
     function handleBlur() {
+        tryAddOption();
         setFocused(false);
         dismissOnDelay();
     }