@medplum/react 0.9.25 → 0.9.28

package/dist/cjs/styles.css

@@ -468,11 +468,75 @@ input[type='radio']:disabled {
   background: var(--medplum-gray-100);
 }
 
-.medplum-resource-badge {
-  display: inline-flex;
+.modal-dialog {
+  background: var(--medplum-gray-600);
+  border: 0.1px solid var(--medplum-gray-700);
+  color: var(--medplum-foreground);
+  padding: 0;
+  position: absolute;
+  z-index: 21;
+  box-shadow: var(--medplum-shadow) 0 2px 6px;
+  outline: 0;
+}
+
+.modal-dialog a,
+.modal-dialog a:link,
+.modal-dialog a:visited {
+  color: var(--medplum-blue-800);
+  cursor: pointer;
+}
+
+.modal-dialog-bg {
+  background: rgba(0, 0, 0, 0.5);
+  left: 0;
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 20;
+}
+
+.modal-dialog-title {
+  background: var(--medplum-gray-800);
+  color: var(--medplum-surface);
+  cursor: pointer;
+  padding: 6px;
+  display: flex;
+  justify-content: space-between;
   align-items: center;
-  gap: 4px;
-  white-space: nowrap;
+}
+
+.modal-dialog-title-close {
+  cursor: pointer;
+  vertical-align: middle;
+  width: 20px;
+  height: 20px;
+}
+
+.modal-dialog-title-close:hover {
+  background-color: var(--medplum-gray-700);
+}
+
+.modal-dialog-title-close > svg {
+  width: 20px;
+  height: 20px;
+}
+
+.modal-dialog-content {
+  text-align: center;
+  background-color: var(--medplum-surface);
+  padding: 8px;
+}
+
+.modal-dialog-buttons {
+  text-align: right;
+  background-color: var(--medplum-gray-100);
+  border-top: 1px solid var(--medplum-gray-400);
+  padding: 8px;
+}
+
+.modal-dialog-buttons button {
+  padding: 1px 6px;
 }
 
 .medplum-diagnostic-report-header {
@@ -513,6 +577,13 @@ input[type='radio']:disabled {
   margin: 0;
 }
 
+.medplum-resource-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  white-space: nowrap;
+}
+
 table.medplum-table {
   border-collapse: collapse;
   width: 100%;
@@ -797,74 +868,6 @@ table.medplum-diff-table td {
   width: 100%;
 }
 
-.modal-dialog {
-  background: var(--medplum-gray-600);
-  border: 0.1px solid var(--medplum-gray-700);
-  color: var(--medplum-foreground);
-  padding: 0;
-  position: absolute;
-  z-index: 21;
-  box-shadow: var(--medplum-shadow) 0 2px 6px;
-  outline: 0;
-}
-
-.modal-dialog a,
-.modal-dialog a:link,
-.modal-dialog a:visited {
-  color: var(--medplum-blue-800);
-  cursor: pointer;
-}
-
-.modal-dialog-bg {
-  background: rgba(0, 0, 0, 0.5);
-  left: 0;
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 20;
-}
-
-.modal-dialog-title {
-  background: var(--medplum-gray-800);
-  color: var(--medplum-surface);
-  cursor: pointer;
-  padding: 6px;
-  display: flex;
-  justify-content: space-between;
-}
-
-.modal-dialog-title-close {
-  cursor: pointer;
-  vertical-align: middle;
-}
-
-.modal-dialog-title-close:hover {
-  background-color: var(--medplum-gray-700);
-}
-
-.modal-dialog-title-close > svg {
-  width: 20px;
-  height: 20px;
-}
-
-.modal-dialog-content {
-  text-align: center;
-  background-color: var(--medplum-surface);
-  padding: 8px;
-}
-
-.modal-dialog-buttons {
-  text-align: right;
-  background-color: var(--medplum-gray-100);
-  border-top: 1px solid var(--medplum-gray-400);
-  padding: 8px;
-}
-
-.modal-dialog-buttons button {
-  padding: 1px 6px;
-}
-
 .medplum-filter-editor {
   text-align: left;
   width: 900px;
@@ -1316,10 +1319,10 @@ div.medplum-nav-menu-container {
 
 .medplum-questionnaire-builder .section {
   position: relative;
-  margin: 4px;
-  padding: 16px 12px 16px 4px;
+  margin: 4px 4px 4px 0;
+  padding: 4px 12px 16px 2px;
   background-color: var(--medplum-surface);
-  border: 1px solid var(--medplum-gray-300);
+  border: 1px solid var(--medplum-surface);
   border-radius: 8px;
 }
 
@@ -1328,18 +1331,19 @@ div.medplum-nav-menu-container {
 }
 
 .medplum-questionnaire-builder .section.hovering {
-  border-color: var(--medplum-blue-500);
+  border: 1px solid var(--medplum-blue-500);
 }
 
 .medplum-questionnaire-builder .section.editing {
-  margin: 8px 4px 12px 4px;
-  padding: 4px 4px 20px 4px;
+  margin: 8px 4px 12px 0;
+  padding: 4px 4px 20px 12px;
+  border: 1px solid var(--medplum-gray-300);
   border-left: 4px solid var(--medplum-blue-500);
 }
 
 .medplum-questionnaire-builder .section.editing input,
 .medplum-questionnaire-builder .section.editing select {
-  margin: 2px 4px;
+  margin: 2px 4px 2px 0;
 }
 
 .medplum-questionnaire-builder .section > .top-actions {

package/dist/esm/AddressDisplay.js

@@ -0,0 +1,13 @@
+import { formatAddress } from '@medplum/core';
+import React from 'react';
+
+function AddressDisplay(props) {
+    const address = props.value;
+    if (!address) {
+        return null;
+    }
+    return React.createElement(React.Fragment, null, formatAddress(address));
+}
+
+export { AddressDisplay };
+//# sourceMappingURL=AddressDisplay.js.map

package/dist/esm/AddressDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddressDisplay.js","sources":["../../src/AddressDisplay.tsx"],"sourcesContent":["import { formatAddress } from '@medplum/core';\nimport { Address } from '@medplum/fhirtypes';\nimport React from 'react';\n\nexport interface AddressDisplayProps {\n  value?: Address;\n}\n\nexport function AddressDisplay(props: AddressDisplayProps): JSX.Element | null {\n  const address = props.value;\n  if (!address) {\n    return null;\n  }\n\n  return <>{formatAddress(address)}</>;\n}\n"],"names":[],"mappings":";;;AAQM,SAAU,cAAc,CAAC,KAA0B,EAAA;AACvD,IAAA,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC;IAC5B,IAAI,CAAC,OAAO,EAAE;AACZ,QAAA,OAAO,IAAI,CAAC;AACb,KAAA;AAED,IAAA,OAAO,0CAAG,aAAa,CAAC,OAAO,CAAC,CAAI,CAAC;AACvC;;;;"}

package/dist/esm/AddressInput.js

@@ -0,0 +1,69 @@
+import React, { useState, useRef } from 'react';
+import { Input } from './Input.js';
+import { InputRow } from './InputRow.js';
+import { Select } from './Select.js';
+
+function getLine(address, index) {
+    return address && address.line && address.line.length > index ? address.line[index] : '';
+}
+function setLine(address, index, str) {
+    const line = address.line || [];
+    while (line.length <= index) {
+        line.push('');
+    }
+    line[index] = str;
+    return Object.assign(Object.assign({}, address), { line });
+}
+function AddressInput(props) {
+    const [value, setValue] = useState(props.defaultValue || {});
+    const valueRef = useRef();
+    valueRef.current = value;
+    function setValueWrapper(newValue) {
+        setValue(newValue);
+        if (props.onChange) {
+            props.onChange(newValue);
+        }
+    }
+    function setUse(use) {
+        setValueWrapper(Object.assign(Object.assign({}, valueRef.current), { use }));
+    }
+    function setType(type) {
+        setValueWrapper(Object.assign(Object.assign({}, valueRef.current), { type }));
+    }
+    function setLine1(line1) {
+        setValueWrapper(setLine(valueRef.current || {}, 0, line1));
+    }
+    function setLine2(line2) {
+        setValueWrapper(setLine(valueRef.current || {}, 1, line2));
+    }
+    function setCity(city) {
+        setValueWrapper(Object.assign(Object.assign({}, valueRef.current), { city }));
+    }
+    function setState(state) {
+        setValueWrapper(Object.assign(Object.assign({}, valueRef.current), { state }));
+    }
+    function setPostalCode(postalCode) {
+        setValueWrapper(Object.assign(Object.assign({}, valueRef.current), { postalCode }));
+    }
+    return (React.createElement(InputRow, null,
+        React.createElement(Select, { testid: "address-use", defaultValue: value === null || value === void 0 ? void 0 : value.use, onChange: setUse },
+            React.createElement("option", null),
+            React.createElement("option", null, "home"),
+            React.createElement("option", null, "mobile"),
+            React.createElement("option", null, "old"),
+            React.createElement("option", null, "temp"),
+            React.createElement("option", null, "work")),
+        React.createElement(Select, { testid: "address-type", defaultValue: value === null || value === void 0 ? void 0 : value.type, onChange: setType },
+            React.createElement("option", null),
+            React.createElement("option", null, "postal"),
+            React.createElement("option", null, "physical"),
+            React.createElement("option", null, "both")),
+        React.createElement(Input, { placeholder: "Line 1", defaultValue: getLine(value, 0), onChange: setLine1 }),
+        React.createElement(Input, { placeholder: "Line 2", defaultValue: getLine(value, 1), onChange: setLine2 }),
+        React.createElement(Input, { placeholder: "City", defaultValue: value.city, onChange: setCity }),
+        React.createElement(Input, { placeholder: "State", defaultValue: value.state, onChange: setState }),
+        React.createElement(Input, { placeholder: "Postal Code", defaultValue: value.postalCode, onChange: setPostalCode })));
+}
+
+export { AddressInput };
+//# sourceMappingURL=AddressInput.js.map

package/dist/esm/AddressInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddressInput.js","sources":["../../src/AddressInput.tsx"],"sourcesContent":["import { Address } from '@medplum/fhirtypes';\nimport React, { useRef, useState } from 'react';\nimport { Input } from './Input';\nimport { InputRow } from './InputRow';\nimport { Select } from './Select';\n\nfunction getLine(address: Address, index: number): string {\n  return address && address.line && address.line.length > index ? address.line[index] : '';\n}\n\nfunction setLine(address: Address, index: number, str: string): Address {\n  const line: string[] = address.line || [];\n  while (line.length <= index) {\n    line.push('');\n  }\n  line[index] = str;\n  return { ...address, line };\n}\n\nexport interface AddressInputProps {\n  name: string;\n  defaultValue?: Address;\n  onChange?: (value: Address) => void;\n}\n\nexport function AddressInput(props: AddressInputProps): JSX.Element {\n  const [value, setValue] = useState<Address>(props.defaultValue || {});\n\n  const valueRef = useRef<Address>();\n  valueRef.current = value;\n\n  function setValueWrapper(newValue: Address): void {\n    setValue(newValue);\n    if (props.onChange) {\n      props.onChange(newValue);\n    }\n  }\n\n  function setUse(use: string): void {\n    setValueWrapper({ ...valueRef.current, use });\n  }\n\n  function setType(type: string): void {\n    setValueWrapper({ ...valueRef.current, type });\n  }\n\n  function setLine1(line1: string): void {\n    setValueWrapper(setLine(valueRef.current || {}, 0, line1));\n  }\n\n  function setLine2(line2: string): void {\n    setValueWrapper(setLine(valueRef.current || {}, 1, line2));\n  }\n\n  function setCity(city: string): void {\n    setValueWrapper({ ...valueRef.current, city });\n  }\n\n  function setState(state: string): void {\n    setValueWrapper({ ...valueRef.current, state });\n  }\n\n  function setPostalCode(postalCode: string): void {\n    setValueWrapper({ ...valueRef.current, postalCode });\n  }\n\n  return (\n    <InputRow>\n      <Select testid=\"address-use\" defaultValue={value?.use} onChange={setUse}>\n        <option></option>\n        <option>home</option>\n        <option>mobile</option>\n        <option>old</option>\n        <option>temp</option>\n        <option>work</option>\n      </Select>\n      <Select testid=\"address-type\" defaultValue={value?.type} onChange={setType}>\n        <option></option>\n        <option>postal</option>\n        <option>physical</option>\n        <option>both</option>\n      </Select>\n      <Input placeholder=\"Line 1\" defaultValue={getLine(value, 0)} onChange={setLine1} />\n      <Input placeholder=\"Line 2\" defaultValue={getLine(value, 1)} onChange={setLine2} />\n      <Input placeholder=\"City\" defaultValue={value.city} onChange={setCity} />\n      <Input placeholder=\"State\" defaultValue={value.state} onChange={setState} />\n      <Input placeholder=\"Postal Code\" defaultValue={value.postalCode} onChange={setPostalCode} />\n    </InputRow>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/AnnotationInput.js

@@ -0,0 +1,28 @@
+import { createReference } from '@medplum/core';
+import React, { useState, useRef } from 'react';
+import { Input } from './Input.js';
+import { useMedplumProfile } from './MedplumProvider.js';
+
+function AnnotationInput(props) {
+    const author = useMedplumProfile();
+    const [value, setValue] = useState(props.defaultValue || {});
+    const valueRef = useRef();
+    valueRef.current = value;
+    function setText(text) {
+        const newValue = text
+            ? {
+                text,
+                authorReference: author && createReference(author),
+                time: new Date().toISOString(),
+            }
+            : {};
+        setValue(newValue);
+        if (props.onChange) {
+            props.onChange(newValue);
+        }
+    }
+    return (React.createElement(Input, { name: props.name, type: "text", placeholder: "Annotation text", defaultValue: value.text, onChange: setText }));
+}
+
+export { AnnotationInput };
+//# sourceMappingURL=AnnotationInput.js.map

package/dist/esm/AnnotationInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnotationInput.js","sources":["../../src/AnnotationInput.tsx"],"sourcesContent":["import { createReference } from '@medplum/core';\nimport { Annotation } from '@medplum/fhirtypes';\nimport React, { useRef, useState } from 'react';\nimport { Input } from './Input';\nimport { useMedplumProfile } from './MedplumProvider';\n\nexport interface AnnotationInputProps {\n  name: string;\n  defaultValue?: Annotation;\n  onChange?: (value: Annotation) => void;\n}\n\nexport function AnnotationInput(props: AnnotationInputProps): JSX.Element {\n  const author = useMedplumProfile();\n  const [value, setValue] = useState<Annotation>(props.defaultValue || {});\n\n  const valueRef = useRef<Annotation>();\n  valueRef.current = value;\n\n  function setText(text: string): void {\n    const newValue: Annotation = text\n      ? {\n          text,\n          authorReference: author && createReference(author),\n          time: new Date().toISOString(),\n        }\n      : {};\n\n    setValue(newValue);\n    if (props.onChange) {\n      props.onChange(newValue);\n    }\n  }\n\n  return (\n    <Input name={props.name} type=\"text\" placeholder=\"Annotation text\" defaultValue={value.text} onChange={setText} />\n  );\n}\n"],"names":[],"mappings":";;;;;AAYM,SAAU,eAAe,CAAC,KAA2B,EAAA;AACzD,IAAA,MAAM,MAAM,GAAG,iBAAiB,EAAE,CAAC;AACnC,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAa,KAAK,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC;AAEzE,IAAA,MAAM,QAAQ,GAAG,MAAM,EAAc,CAAC;AACtC,IAAA,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC;IAEzB,SAAS,OAAO,CAAC,IAAY,EAAA;QAC3B,MAAM,QAAQ,GAAe,IAAI;AAC/B,cAAE;gBACE,IAAI;AACJ,gBAAA,eAAe,EAAE,MAAM,IAAI,eAAe,CAAC,MAAM,CAAC;AAClD,gBAAA,IAAI,EAAE,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE;AAC/B,aAAA;cACD,EAAE,CAAC;QAEP,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACnB,IAAI,KAAK,CAAC,QAAQ,EAAE;AAClB,YAAA,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;AAC1B,SAAA;KACF;AAED,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAC,MAAM,EAAC,WAAW,EAAC,iBAAiB,EAAC,YAAY,EAAE,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAA,CAAI,EAClH;AACJ;;;;"}

package/dist/esm/AttachmentArrayDisplay.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { AttachmentDisplay } from './AttachmentDisplay.js';
+
+function AttachmentArrayDisplay(props) {
+    return (React.createElement("div", null, props.values &&
+        props.values.map((v, index) => (React.createElement("div", { key: 'attatchment-' + index },
+            React.createElement(AttachmentDisplay, { value: v, maxWidth: props.maxWidth }))))));
+}
+
+export { AttachmentArrayDisplay };
+//# sourceMappingURL=AttachmentArrayDisplay.js.map

package/dist/esm/AttachmentArrayDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttachmentArrayDisplay.js","sources":["../../src/AttachmentArrayDisplay.tsx"],"sourcesContent":["import { Attachment } from '@medplum/fhirtypes';\nimport React from 'react';\nimport { AttachmentDisplay } from './AttachmentDisplay';\n\nexport interface AttachmentArrayDisplayProps {\n  values?: Attachment[];\n  maxWidth?: number;\n}\n\nexport function AttachmentArrayDisplay(props: AttachmentArrayDisplayProps): JSX.Element {\n  return (\n    <div>\n      {props.values &&\n        props.values.map((v, index) => (\n          <div key={'attatchment-' + index}>\n            <AttachmentDisplay value={v} maxWidth={props.maxWidth} />\n          </div>\n        ))}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;AASM,SAAU,sBAAsB,CAAC,KAAkC,EAAA;AACvE,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA,EACG,KAAK,CAAC,MAAM;AACX,QAAA,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,MACxB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,cAAc,GAAG,KAAK,EAAA;AAC9B,YAAA,KAAA,CAAA,aAAA,CAAC,iBAAiB,EAAC,EAAA,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAI,CAAA,CACrD,CACP,CAAC,CACA,EACN;AACJ;;;;"}

package/dist/esm/AttachmentArrayInput.js

@@ -0,0 +1,42 @@
+import React, { useState, useRef } from 'react';
+import { AttachmentDisplay } from './AttachmentDisplay.js';
+import { Button } from './Button.js';
+import { UploadButton } from './UploadButton.js';
+import { killEvent } from './utils/dom.js';
+
+function AttachmentArrayInput(props) {
+    var _a;
+    const [values, setValues] = useState((_a = props.defaultValue) !== null && _a !== void 0 ? _a : []);
+    const valuesRef = useRef();
+    valuesRef.current = values;
+    function setValuesWrapper(newValues) {
+        setValues(newValues);
+        if (props.onChange) {
+            props.onChange(newValues);
+        }
+    }
+    return (React.createElement("table", { style: { width: '100%' } },
+        React.createElement("colgroup", null,
+            React.createElement("col", { width: "90%" }),
+            React.createElement("col", { width: "10%" })),
+        React.createElement("tbody", null,
+            values.map((v, index) => (React.createElement("tr", { key: `${index}-${values.length}` },
+                React.createElement("td", null,
+                    React.createElement(AttachmentDisplay, { value: v, maxWidth: 200 })),
+                React.createElement("td", { className: "medplum-right" },
+                    React.createElement(Button, { onClick: (e) => {
+                            killEvent(e);
+                            const copy = values.slice();
+                            copy.splice(index, 1);
+                            setValuesWrapper(copy);
+                        } }, "Remove"))))),
+            React.createElement("tr", null,
+                React.createElement("td", null),
+                React.createElement("td", { className: "medplum-right" },
+                    React.createElement(UploadButton, { onUpload: (attachment) => {
+                            setValuesWrapper([...valuesRef.current, attachment]);
+                        } }))))));
+}
+
+export { AttachmentArrayInput };
+//# sourceMappingURL=AttachmentArrayInput.js.map

package/dist/esm/AttachmentArrayInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttachmentArrayInput.js","sources":["../../src/AttachmentArrayInput.tsx"],"sourcesContent":["import { Attachment } from '@medplum/fhirtypes';\nimport React, { useRef, useState } from 'react';\nimport { AttachmentDisplay } from './AttachmentDisplay';\nimport { Button } from './Button';\nimport { UploadButton } from './UploadButton';\nimport { killEvent } from './utils/dom';\n\nexport interface AttachmentArrayInputProps {\n  name: string;\n  defaultValue?: Attachment[];\n  arrayElement?: boolean;\n  onChange?: (value: Attachment[]) => void;\n}\n\nexport function AttachmentArrayInput(props: AttachmentArrayInputProps): JSX.Element {\n  const [values, setValues] = useState<Attachment[]>(props.defaultValue ?? []);\n\n  const valuesRef = useRef<Attachment[]>();\n  valuesRef.current = values;\n\n  function setValuesWrapper(newValues: Attachment[]): void {\n    setValues(newValues);\n    if (props.onChange) {\n      props.onChange(newValues);\n    }\n  }\n\n  return (\n    <table style={{ width: '100%' }}>\n      <colgroup>\n        <col width=\"90%\" />\n        <col width=\"10%\" />\n      </colgroup>\n      <tbody>\n        {values.map((v: Attachment, index: number) => (\n          <tr key={`${index}-${values.length}`}>\n            <td>\n              <AttachmentDisplay value={v} maxWidth={200} />\n            </td>\n            <td className=\"medplum-right\">\n              <Button\n                onClick={(e) => {\n                  killEvent(e);\n                  const copy = values.slice();\n                  copy.splice(index, 1);\n                  setValuesWrapper(copy);\n                }}\n              >\n                Remove\n              </Button>\n            </td>\n          </tr>\n        ))}\n        <tr>\n          <td></td>\n          <td className=\"medplum-right\">\n            <UploadButton\n              onUpload={(attachment: Attachment) => {\n                setValuesWrapper([...(valuesRef.current as Attachment[]), attachment]);\n              }}\n            />\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAcM,SAAU,oBAAoB,CAAC,KAAgC,EAAA;;AACnE,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAe,CAAA,EAAA,GAAA,KAAK,CAAC,YAAY,MAAI,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAA,EAAE,CAAC,CAAC;AAE7E,IAAA,MAAM,SAAS,GAAG,MAAM,EAAgB,CAAC;AACzC,IAAA,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC;IAE3B,SAAS,gBAAgB,CAAC,SAAuB,EAAA;QAC/C,SAAS,CAAC,SAAS,CAAC,CAAC;QACrB,IAAI,KAAK,CAAC,QAAQ,EAAE;AAClB,YAAA,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;AAC3B,SAAA;KACF;IAED,QACE,+BAAO,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAA;AAC7B,QAAA,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,IAAA;YACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,KAAK,EAAG,CAAA;AACnB,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,KAAK,EAAA,CAAG,CACV;AACX,QAAA,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA;YACG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAa,EAAE,KAAa,MACvC,KAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAG,EAAE,CAAG,EAAA,KAAK,IAAI,MAAM,CAAC,MAAM,CAAE,CAAA,EAAA;AAClC,gBAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA;oBACE,KAAC,CAAA,aAAA,CAAA,iBAAiB,EAAC,EAAA,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAA,CAAI,CAC3C;gBACL,KAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,SAAS,EAAC,eAAe,EAAA;AAC3B,oBAAA,KAAA,CAAA,aAAA,CAAC,MAAM,EACL,EAAA,OAAO,EAAE,CAAC,CAAC,KAAI;4BACb,SAAS,CAAC,CAAC,CAAC,CAAC;AACb,4BAAA,MAAM,IAAI,GAAG,MAAM,CAAC,KAAK,EAAE,CAAC;AAC5B,4BAAA,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;4BACtB,gBAAgB,CAAC,IAAI,CAAC,CAAC;AACzB,yBAAC,EAGM,EAAA,QAAA,CAAA,CACN,CACF,CACN,CAAC;AACF,YAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA;gBACE,KAAS,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA,CAAA;gBACT,KAAI,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,SAAS,EAAC,eAAe,EAAA;AAC3B,oBAAA,KAAA,CAAA,aAAA,CAAC,YAAY,EACX,EAAA,QAAQ,EAAE,CAAC,UAAsB,KAAI;4BACnC,gBAAgB,CAAC,CAAC,GAAI,SAAS,CAAC,OAAwB,EAAE,UAAU,CAAC,CAAC,CAAC;AACzE,yBAAC,GACD,CACC,CACF,CACC,CACF,EACR;AACJ;;;;"}

package/dist/esm/AttachmentDisplay.js

@@ -0,0 +1,20 @@
+import React from 'react';
+
+function AttachmentDisplay(props) {
+    const value = props.value;
+    const { contentType, url, title } = value !== null && value !== void 0 ? value : {};
+    if (!url) {
+        return null;
+    }
+    return (React.createElement("div", { "data-testid": "attachment-display" },
+        (contentType === null || contentType === void 0 ? void 0 : contentType.startsWith('image/')) && (React.createElement("img", { "data-testid": "attachment-image", style: { maxWidth: props.maxWidth }, src: url, alt: value === null || value === void 0 ? void 0 : value.title })),
+        (contentType === null || contentType === void 0 ? void 0 : contentType.startsWith('video/')) && (React.createElement("video", { "data-testid": "attachment-video", style: { maxWidth: props.maxWidth }, controls: true },
+            React.createElement("source", { type: contentType, src: url }))),
+        contentType === 'application/pdf' && !(title === null || title === void 0 ? void 0 : title.endsWith('.pdf')) && (React.createElement("div", { "data-testid": "attachment-pdf", style: { maxWidth: props.maxWidth, minHeight: 400 } },
+            React.createElement("iframe", { width: "100%", height: "400", src: url + '#navpanes=0', allowFullScreen: true, frameBorder: 0, seamless: true }))),
+        React.createElement("div", { "data-testid": "download-link", style: { padding: '2px 16px 16px 16px' } },
+            React.createElement("a", { href: value === null || value === void 0 ? void 0 : value.url, "data-testid": "attachment-details", target: "_blank", rel: "noopener noreferrer" }, (value === null || value === void 0 ? void 0 : value.title) || 'Download'))));
+}
+
+export { AttachmentDisplay };
+//# sourceMappingURL=AttachmentDisplay.js.map

package/dist/esm/AttachmentDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttachmentDisplay.js","sources":["../../src/AttachmentDisplay.tsx"],"sourcesContent":["import { Attachment } from '@medplum/fhirtypes';\nimport React from 'react';\n\nexport interface AttachmentDisplayProps {\n  value?: Attachment;\n  maxWidth?: number;\n}\n\nexport function AttachmentDisplay(props: AttachmentDisplayProps): JSX.Element | null {\n  const value = props.value;\n  const { contentType, url, title } = value ?? {};\n\n  if (!url) {\n    return null;\n  }\n\n  return (\n    <div data-testid=\"attachment-display\">\n      {contentType?.startsWith('image/') && (\n        <img data-testid=\"attachment-image\" style={{ maxWidth: props.maxWidth }} src={url} alt={value?.title} />\n      )}\n      {contentType?.startsWith('video/') && (\n        <video data-testid=\"attachment-video\" style={{ maxWidth: props.maxWidth }} controls={true}>\n          <source type={contentType} src={url} />\n        </video>\n      )}\n      {contentType === 'application/pdf' && !title?.endsWith('.pdf') && (\n        <div data-testid=\"attachment-pdf\" style={{ maxWidth: props.maxWidth, minHeight: 400 }}>\n          <iframe\n            width=\"100%\"\n            height=\"400\"\n            src={url + '#navpanes=0'}\n            allowFullScreen={true}\n            frameBorder={0}\n            seamless={true}\n          />\n        </div>\n      )}\n      <div data-testid=\"download-link\" style={{ padding: '2px 16px 16px 16px' }}>\n        <a href={value?.url} data-testid=\"attachment-details\" target=\"_blank\" rel=\"noopener noreferrer\">\n          {value?.title || 'Download'}\n        </a>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;AAQM,SAAU,iBAAiB,CAAC,KAA6B,EAAA;AAC7D,IAAA,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;AAC1B,IAAA,MAAM,EAAE,WAAW,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,KAAK,aAAL,KAAK,KAAA,KAAA,CAAA,GAAL,KAAK,GAAI,EAAE,CAAC;IAEhD,IAAI,CAAC,GAAG,EAAE;AACR,QAAA,OAAO,IAAI,CAAC;AACb,KAAA;IAED,QACE,4CAAiB,oBAAoB,EAAA;AAClC,QAAA,CAAA,WAAW,KAAX,IAAA,IAAA,WAAW,KAAX,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,WAAW,CAAE,UAAU,CAAC,QAAQ,CAAC,MAChC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EAAiB,kBAAkB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,aAAL,KAAK,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAL,KAAK,CAAE,KAAK,GAAI,CACzG;QACA,CAAA,WAAW,KAAX,IAAA,IAAA,WAAW,KAAX,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,WAAW,CAAE,UAAU,CAAC,QAAQ,CAAC,MAChC,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,aAAA,EAAmB,kBAAkB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAA;YACvF,KAAQ,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE,GAAG,EAAI,CAAA,CACjC,CACT;AACA,QAAA,WAAW,KAAK,iBAAiB,IAAI,EAAC,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAL,KAAK,CAAE,QAAQ,CAAC,MAAM,CAAC,CAAA,KAC5D,KAAiB,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EAAA,gBAAgB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,SAAS,EAAE,GAAG,EAAE,EAAA;YACnF,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,KAAK,EACZ,GAAG,EAAE,GAAG,GAAG,aAAa,EACxB,eAAe,EAAE,IAAI,EACrB,WAAW,EAAE,CAAC,EACd,QAAQ,EAAE,IAAI,EACd,CAAA,CACE,CACP;QACD,KAAiB,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,aAAA,EAAA,eAAe,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,oBAAoB,EAAE,EAAA;AACvE,YAAA,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAG,IAAI,EAAE,KAAK,KAAA,IAAA,IAAL,KAAK,KAAL,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAK,CAAE,GAAG,iBAAc,oBAAoB,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,EAC5F,EAAA,CAAA,KAAK,KAAA,IAAA,IAAL,KAAK,KAAL,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAK,CAAE,KAAK,KAAI,UAAU,CACzB,CACA,CACF,EACN;AACJ;;;;"}

package/dist/esm/AttachmentInput.js

@@ -0,0 +1,27 @@
+import React, { useState } from 'react';
+import { AttachmentDisplay } from './AttachmentDisplay.js';
+import { Button } from './Button.js';
+import { UploadButton } from './UploadButton.js';
+import { killEvent } from './utils/dom.js';
+
+function AttachmentInput(props) {
+    const [value, setValue] = useState(props.defaultValue);
+    function setValueWrapper(newValue) {
+        setValue(newValue);
+        if (props.onChange) {
+            props.onChange(newValue);
+        }
+    }
+    if (value) {
+        return (React.createElement(React.Fragment, null,
+            React.createElement(AttachmentDisplay, { value: value, maxWidth: 200 }),
+            React.createElement(Button, { onClick: (e) => {
+                    killEvent(e);
+                    setValueWrapper(undefined);
+                } }, "Remove")));
+    }
+    return React.createElement(UploadButton, { onUpload: setValueWrapper });
+}
+
+export { AttachmentInput };
+//# sourceMappingURL=AttachmentInput.js.map

package/dist/esm/AttachmentInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AttachmentInput.js","sources":["../../src/AttachmentInput.tsx"],"sourcesContent":["import { Attachment } from '@medplum/fhirtypes';\nimport React, { useState } from 'react';\nimport { AttachmentDisplay } from './AttachmentDisplay';\nimport { Button } from './Button';\nimport { UploadButton } from './UploadButton';\nimport { killEvent } from './utils/dom';\n\nexport interface AttachmentInputProps {\n  name: string;\n  defaultValue?: Attachment;\n  arrayElement?: boolean;\n  onChange?: (value: Attachment | undefined) => void;\n}\n\nexport function AttachmentInput(props: AttachmentInputProps): JSX.Element {\n  const [value, setValue] = useState(props.defaultValue);\n\n  function setValueWrapper(newValue: Attachment | undefined): void {\n    setValue(newValue);\n    if (props.onChange) {\n      props.onChange(newValue);\n    }\n  }\n\n  if (value) {\n    return (\n      <>\n        <AttachmentDisplay value={value} maxWidth={200} />\n        <Button\n          onClick={(e) => {\n            killEvent(e);\n            setValueWrapper(undefined);\n          }}\n        >\n          Remove\n        </Button>\n      </>\n    );\n  }\n\n  return <UploadButton onUpload={setValueWrapper} />;\n}\n"],"names":[],"mappings":";;;;;;AAcM,SAAU,eAAe,CAAC,KAA2B,EAAA;AACzD,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;IAEvD,SAAS,eAAe,CAAC,QAAgC,EAAA;QACvD,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACnB,IAAI,KAAK,CAAC,QAAQ,EAAE;AAClB,YAAA,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;AAC1B,SAAA;KACF;AAED,IAAA,IAAI,KAAK,EAAE;AACT,QAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;YACE,KAAC,CAAA,aAAA,CAAA,iBAAiB,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,EAAI,CAAA;AAClD,YAAA,KAAA,CAAA,aAAA,CAAC,MAAM,EACL,EAAA,OAAO,EAAE,CAAC,CAAC,KAAI;oBACb,SAAS,CAAC,CAAC,CAAC,CAAC;oBACb,eAAe,CAAC,SAAS,CAAC,CAAC;iBAC5B,EAAA,EAAA,QAAA,CAGM,CACR,EACH;AACH,KAAA;AAED,IAAA,OAAO,oBAAC,YAAY,EAAA,EAAC,QAAQ,EAAE,eAAe,GAAI,CAAC;AACrD;;;;"}

package/dist/{types → esm}/Autocomplete.d.ts

@@ -7,6 +7,7 @@ export interface AutocompleteProps<T> {
     defaultValue?: T[];
     className?: string;
     placeholder?: string;
+    loadOnFocus?: boolean;
     loadOptions: (input: string, signal: AbortSignal) => Promise<T[]>;
     buildUnstructured?: (input: string) => T;
     getId: (item: T) => string;