@medplum/react 0.9.25 → 0.9.28

package/dist/esm/RegisterForm.js

@@ -0,0 +1,121 @@
+import { __awaiter } from './node_modules/tslib/tslib.es6.js';
+import { parseJWTPayload } from '@medplum/core';
+import React, { useState, useEffect } from 'react';
+import { Button } from './Button.js';
+import { Document } from './Document.js';
+import { Form } from './Form.js';
+import { FormSection } from './FormSection.js';
+import { getGoogleClientId, GoogleButton } from './GoogleButton.js';
+import { Input } from './Input.js';
+import { useMedplum } from './MedplumProvider.js';
+import { getIssuesForExpression } from './utils/outcomes.js';
+import { initRecaptcha, getRecaptcha } from './utils/recaptcha.js';
+
+function RegisterForm(props) {
+    const medplum = useMedplum();
+    const googleClientId = getGoogleClientId(props.googleClientId);
+    const recaptchaSiteKey = props.recaptchaSiteKey;
+    const [outcome, setOutcome] = useState();
+    const issues = getIssuesForExpression(outcome, undefined);
+    useEffect(() => initRecaptcha(recaptchaSiteKey), [recaptchaSiteKey]);
+    function handleAuthResponse(registerRequest, partialLogin) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                let login;
+                if (props.type === 'patient') {
+                    login = yield medplum.startNewPatient(registerRequest, partialLogin);
+                }
+                else {
+                    login = yield medplum.startNewProject(registerRequest, partialLogin);
+                }
+                yield medplum.processCode(login.code);
+                props.onSuccess();
+            }
+            catch (err) {
+                setOutcome(err);
+            }
+        });
+    }
+    return (React.createElement(Document, { width: 450 },
+        React.createElement(Form, { style: { maxWidth: 400 }, onSubmit: (formData) => __awaiter(this, void 0, void 0, function* () {
+                try {
+                    const recaptchaToken = yield getRecaptcha(recaptchaSiteKey);
+                    const registerRequest = {
+                        projectId: props.projectId,
+                        projectName: formData.projectName,
+                        firstName: formData.firstName,
+                        lastName: formData.lastName,
+                        email: formData.email,
+                        password: formData.password,
+                        remember: formData.remember === 'true',
+                        recaptchaSiteKey,
+                        recaptchaToken,
+                    };
+                    const userLogin = yield medplum.startNewUser(registerRequest);
+                    handleAuthResponse(registerRequest, userLogin);
+                }
+                catch (err) {
+                    setOutcome(err);
+                }
+            }) },
+            React.createElement("div", { className: "medplum-center" }, props.children),
+            issues && (React.createElement("div", { className: "medplum-input-error" }, issues.map((issue) => {
+                var _a, _b;
+                return (React.createElement("div", { "data-testid": "text-field-error", key: (_a = issue.details) === null || _a === void 0 ? void 0 : _a.text }, (_b = issue.details) === null || _b === void 0 ? void 0 : _b.text));
+            }))),
+            googleClientId && (React.createElement(React.Fragment, null,
+                React.createElement("div", { className: "medplum-signin-google-container" },
+                    React.createElement(GoogleButton, { googleClientId: googleClientId, handleGoogleCredential: (response) => __awaiter(this, void 0, void 0, function* () {
+                            try {
+                                const loginRequest = {
+                                    googleClientId: response.clientId,
+                                    googleCredential: response.credential,
+                                };
+                                const userLogin = yield medplum.startGoogleLogin(loginRequest);
+                                const googleClaims = parseJWTPayload(loginRequest.googleCredential);
+                                const registerRequest = {
+                                    projectId: props.projectId,
+                                    firstName: googleClaims.given_name,
+                                    lastName: googleClaims.family_name,
+                                    email: googleClaims.email,
+                                };
+                                handleAuthResponse(registerRequest, userLogin);
+                            }
+                            catch (err) {
+                                setOutcome(err);
+                            }
+                        }) })),
+                React.createElement("div", { className: "medplum-signin-separator" }, "or"))),
+            React.createElement(FormSection, { title: "First Name", htmlFor: "firstName", outcome: outcome },
+                React.createElement(Input, { name: "firstName", type: "text", testid: "firstName", placeholder: "First name", required: true, autoFocus: true, outcome: outcome })),
+            React.createElement(FormSection, { title: "Last Name", htmlFor: "lastName", outcome: outcome },
+                React.createElement(Input, { name: "lastName", type: "text", testid: "lastName", placeholder: "Last name", required: true, outcome: outcome })),
+            props.type === 'project' && (React.createElement(FormSection, { title: "Project Name", htmlFor: "projectName", outcome: outcome },
+                React.createElement(Input, { name: "projectName", type: "text", testid: "projectName", placeholder: "My Project", required: true, outcome: outcome }))),
+            React.createElement(FormSection, { title: "Email", htmlFor: "email", outcome: outcome },
+                React.createElement(Input, { name: "email", type: "email", testid: "email", placeholder: "name@domain.com", required: true, outcome: outcome })),
+            React.createElement(FormSection, { title: "Password", htmlFor: "password", outcome: outcome },
+                React.createElement(Input, { name: "password", type: "password", testid: "password", autoComplete: "off", required: true, outcome: outcome })),
+            React.createElement("p", { style: { fontSize: '12px', color: '#888' } },
+                "By clicking submit you agree to the Medplum ",
+                React.createElement("a", { href: "https://www.medplum.com/privacy" }, "Privacy\u00A0Policy"),
+                ' and ',
+                React.createElement("a", { href: "https://www.medplum.com/terms" }, "Terms\u00A0of\u00A0Service"),
+                "."),
+            React.createElement("p", { style: { fontSize: '12px', color: '#888' } },
+                "This site is protected by reCAPTCHA and the Google",
+                ' ',
+                React.createElement("a", { href: "https://policies.google.com/privacy" }, "Privacy\u00A0Policy"),
+                ' and ',
+                React.createElement("a", { href: "https://policies.google.com/terms" }, "Terms\u00A0of\u00A0Service"),
+                " apply."),
+            React.createElement("div", { className: "medplum-signin-buttons" },
+                React.createElement("div", null,
+                    React.createElement("input", { type: "checkbox", id: "remember", name: "remember", value: "true" }),
+                    React.createElement("label", { htmlFor: "remember" }, "Remember me")),
+                React.createElement("div", null,
+                    React.createElement(Button, { type: "submit", testid: "submit" }, "Create account"))))));
+}
+
+export { RegisterForm };
+//# sourceMappingURL=RegisterForm.js.map

package/dist/esm/RegisterForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RegisterForm.js","sources":["../../src/RegisterForm.tsx"],"sourcesContent":["import {\n  GoogleCredentialResponse,\n  LoginAuthenticationResponse,\n  NewPatientRequest,\n  NewProjectRequest,\n  parseJWTPayload,\n} from '@medplum/core';\nimport { OperationOutcome } from '@medplum/fhirtypes';\nimport React, { useEffect, useState } from 'react';\nimport { Button } from './Button';\nimport { Document } from './Document';\nimport { Form } from './Form';\nimport { FormSection } from './FormSection';\nimport { getGoogleClientId, GoogleButton } from './GoogleButton';\nimport { Input } from './Input';\nimport { useMedplum } from './MedplumProvider';\nimport { getIssuesForExpression } from './utils/outcomes';\nimport { getRecaptcha, initRecaptcha } from './utils/recaptcha';\nimport './SignInForm.css';\nimport './util.css';\n\nexport interface BaseRegisterFormProps {\n  readonly googleClientId?: string;\n  readonly recaptchaSiteKey: string;\n  readonly children?: React.ReactNode;\n  readonly onSuccess: () => void;\n}\n\nexport interface PatientRegisterFormProps extends BaseRegisterFormProps {\n  readonly type: 'patient';\n  readonly projectId: string;\n}\n\nexport interface ProjectRegisterFormProps extends BaseRegisterFormProps {\n  readonly type: 'project';\n}\n\nexport type RegisterFormProps = PatientRegisterFormProps | ProjectRegisterFormProps;\n\nexport function RegisterForm(props: RegisterFormProps): JSX.Element {\n  const medplum = useMedplum();\n  const googleClientId = getGoogleClientId(props.googleClientId);\n  const recaptchaSiteKey = props.recaptchaSiteKey;\n  const [outcome, setOutcome] = useState<OperationOutcome>();\n  const issues = getIssuesForExpression(outcome, undefined);\n\n  useEffect(() => initRecaptcha(recaptchaSiteKey), [recaptchaSiteKey]);\n\n  async function handleAuthResponse(\n    registerRequest: NewPatientRequest | NewProjectRequest,\n    partialLogin: LoginAuthenticationResponse\n  ): Promise<void> {\n    try {\n      let login;\n      if (props.type === 'patient') {\n        login = await medplum.startNewPatient(registerRequest as NewPatientRequest, partialLogin);\n      } else {\n        login = await medplum.startNewProject(registerRequest as NewProjectRequest, partialLogin);\n      }\n      await medplum.processCode(login.code as string);\n      props.onSuccess();\n    } catch (err) {\n      setOutcome(err as OperationOutcome);\n    }\n  }\n\n  return (\n    <Document width={450}>\n      <Form\n        style={{ maxWidth: 400 }}\n        onSubmit={async (formData: Record<string, string>) => {\n          try {\n            const recaptchaToken = await getRecaptcha(recaptchaSiteKey);\n            const registerRequest = {\n              projectId: (props as PatientRegisterFormProps).projectId,\n              projectName: formData.projectName,\n              firstName: formData.firstName,\n              lastName: formData.lastName,\n              email: formData.email,\n              password: formData.password,\n              remember: formData.remember === 'true',\n              recaptchaSiteKey,\n              recaptchaToken,\n            };\n            const userLogin = await medplum.startNewUser(registerRequest);\n            handleAuthResponse(registerRequest, userLogin);\n          } catch (err) {\n            setOutcome(err as OperationOutcome);\n          }\n        }}\n      >\n        <div className=\"medplum-center\">{props.children}</div>\n        {issues && (\n          <div className=\"medplum-input-error\">\n            {issues.map((issue) => (\n              <div data-testid=\"text-field-error\" key={issue.details?.text}>\n                {issue.details?.text}\n              </div>\n            ))}\n          </div>\n        )}\n        {googleClientId && (\n          <>\n            <div className=\"medplum-signin-google-container\">\n              <GoogleButton\n                googleClientId={googleClientId}\n                handleGoogleCredential={async (response: GoogleCredentialResponse) => {\n                  try {\n                    const loginRequest = {\n                      googleClientId: response.clientId,\n                      googleCredential: response.credential,\n                    };\n                    const userLogin = await medplum.startGoogleLogin(loginRequest);\n                    const googleClaims = parseJWTPayload(loginRequest.googleCredential);\n                    const registerRequest = {\n                      projectId: (props as PatientRegisterFormProps).projectId,\n                      firstName: googleClaims.given_name as string,\n                      lastName: googleClaims.family_name as string,\n                      email: googleClaims.email as string,\n                    };\n                    handleAuthResponse(registerRequest, userLogin);\n                  } catch (err) {\n                    setOutcome(err as OperationOutcome);\n                  }\n                }}\n              />\n            </div>\n            <div className=\"medplum-signin-separator\">or</div>\n          </>\n        )}\n        <FormSection title=\"First Name\" htmlFor=\"firstName\" outcome={outcome}>\n          <Input\n            name=\"firstName\"\n            type=\"text\"\n            testid=\"firstName\"\n            placeholder=\"First name\"\n            required={true}\n            autoFocus={true}\n            outcome={outcome}\n          />\n        </FormSection>\n        <FormSection title=\"Last Name\" htmlFor=\"lastName\" outcome={outcome}>\n          <Input\n            name=\"lastName\"\n            type=\"text\"\n            testid=\"lastName\"\n            placeholder=\"Last name\"\n            required={true}\n            outcome={outcome}\n          />\n        </FormSection>\n        {props.type === 'project' && (\n          <FormSection title=\"Project Name\" htmlFor=\"projectName\" outcome={outcome}>\n            <Input\n              name=\"projectName\"\n              type=\"text\"\n              testid=\"projectName\"\n              placeholder=\"My Project\"\n              required={true}\n              outcome={outcome}\n            />\n          </FormSection>\n        )}\n        <FormSection title=\"Email\" htmlFor=\"email\" outcome={outcome}>\n          <Input\n            name=\"email\"\n            type=\"email\"\n            testid=\"email\"\n            placeholder=\"name@domain.com\"\n            required={true}\n            outcome={outcome}\n          />\n        </FormSection>\n        <FormSection title=\"Password\" htmlFor=\"password\" outcome={outcome}>\n          <Input\n            name=\"password\"\n            type=\"password\"\n            testid=\"password\"\n            autoComplete=\"off\"\n            required={true}\n            outcome={outcome}\n          />\n        </FormSection>\n        <p style={{ fontSize: '12px', color: '#888' }}>\n          By clicking submit you agree to the Medplum <a href=\"https://www.medplum.com/privacy\">Privacy&nbsp;Policy</a>\n          {' and '}\n          <a href=\"https://www.medplum.com/terms\">Terms&nbsp;of&nbsp;Service</a>.\n        </p>\n        <p style={{ fontSize: '12px', color: '#888' }}>\n          This site is protected by reCAPTCHA and the Google{' '}\n          <a href=\"https://policies.google.com/privacy\">Privacy&nbsp;Policy</a>\n          {' and '}\n          <a href=\"https://policies.google.com/terms\">Terms&nbsp;of&nbsp;Service</a> apply.\n        </p>\n        <div className=\"medplum-signin-buttons\">\n          <div>\n            <input type=\"checkbox\" id=\"remember\" name=\"remember\" value=\"true\" />\n            <label htmlFor=\"remember\">Remember me</label>\n          </div>\n          <div>\n            <Button type=\"submit\" testid=\"submit\">\n              Create account\n            </Button>\n          </div>\n        </div>\n      </Form>\n    </Document>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/RequestGroupDisplay.js

@@ -0,0 +1,72 @@
+import { formatDateTime, getReferenceString } from '@medplum/core';
+import React, { useState, useEffect } from 'react';
+import { Button } from './Button.js';
+import { useMedplum } from './MedplumProvider.js';
+import { ResourceName } from './ResourceName.js';
+import { StatusBadge } from './StatusBadge.js';
+import { useResource } from './useResource.js';
+
+function RequestGroupDisplay(props) {
+    var _a;
+    const medplum = useMedplum();
+    const requestGroup = useResource(props.value);
+    const [startedLoading, setStartedLoading] = useState(false);
+    const [responseBundle, setResponseBundle] = useState();
+    useEffect(() => {
+        if (requestGroup && !startedLoading) {
+            medplum.executeBatch(buildBatchRequest(requestGroup)).then(setResponseBundle);
+            setStartedLoading(true);
+        }
+    }, [medplum, requestGroup, startedLoading]);
+    if (!requestGroup || !responseBundle) {
+        return null;
+    }
+    return (React.createElement("div", { className: "medplum-request-group" }, (_a = requestGroup.action) === null || _a === void 0 ? void 0 : _a.map((action, index) => {
+        var _a, _b, _c, _d, _e, _f;
+        const task = action.resource && findBundleEntry(action.resource);
+        const taskInput = (_b = (_a = task === null || task === void 0 ? void 0 : task.input) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.valueReference;
+        const taskOutput = (_d = (_c = task === null || task === void 0 ? void 0 : task.output) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.valueReference;
+        return (React.createElement("div", { className: "medplum-request-group-task", key: `action-${index}` },
+            React.createElement("div", { className: "medplum-request-group-task-checkmark" }, (task === null || task === void 0 ? void 0 : task.status) === 'completed' ? '🗹' : '☐'),
+            React.createElement("div", { className: "medplum-request-group-task-details" },
+                React.createElement("div", { className: "medplum-request-group-task-title" }, action.title),
+                React.createElement("div", null,
+                    "Last edited by\u00A0",
+                    React.createElement(ResourceName, { value: (_e = task === null || task === void 0 ? void 0 : task.meta) === null || _e === void 0 ? void 0 : _e.author }),
+                    "\u00A0on\u00A0",
+                    formatDateTime((_f = task === null || task === void 0 ? void 0 : task.meta) === null || _f === void 0 ? void 0 : _f.lastUpdated)),
+                React.createElement("div", null,
+                    "Status: ",
+                    React.createElement(StatusBadge, { status: (task === null || task === void 0 ? void 0 : task.status) || 'unknown' }))),
+            React.createElement("div", { className: "medplum-request-group-task-actions" },
+                taskInput && !taskOutput && React.createElement(Button, { onClick: () => props.onStart(task, taskInput) }, "Start"),
+                taskInput && taskOutput && (React.createElement(Button, { onClick: () => props.onEdit(task, taskInput, taskOutput) }, "Edit")))));
+    })));
+    function buildBatchRequest(request) {
+        var _a;
+        const batchEntries = [];
+        if (request.action) {
+            for (const action of request.action) {
+                if ((_a = action.resource) === null || _a === void 0 ? void 0 : _a.reference) {
+                    batchEntries.push({ request: { method: 'GET', url: action.resource.reference } });
+                }
+            }
+        }
+        return {
+            resourceType: 'Bundle',
+            type: 'batch',
+            entry: batchEntries,
+        };
+    }
+    function findBundleEntry(reference) {
+        for (const entry of responseBundle === null || responseBundle === void 0 ? void 0 : responseBundle.entry) {
+            if (entry.resource && reference.reference === getReferenceString(entry.resource)) {
+                return entry.resource;
+            }
+        }
+        return undefined;
+    }
+}
+
+export { RequestGroupDisplay };
+//# sourceMappingURL=RequestGroupDisplay.js.map

package/dist/esm/RequestGroupDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RequestGroupDisplay.js","sources":["../../src/RequestGroupDisplay.tsx"],"sourcesContent":["import { formatDateTime, getReferenceString } from '@medplum/core';\nimport { Bundle, BundleEntry, Reference, RequestGroup, Resource, Task } from '@medplum/fhirtypes';\nimport React, { useEffect, useState } from 'react';\nimport { Button } from './Button';\nimport { useMedplum } from './MedplumProvider';\nimport { ResourceName } from './ResourceName';\nimport { StatusBadge } from './StatusBadge';\nimport { useResource } from './useResource';\nimport './RequestGroupDisplay.css';\n\nexport interface RequestGroupDisplayProps {\n  value?: RequestGroup | Reference<RequestGroup>;\n  onStart: (task: Task, input: Reference) => void;\n  onEdit: (task: Task, input: Reference, output: Reference) => void;\n}\n\nexport function RequestGroupDisplay(props: RequestGroupDisplayProps): JSX.Element | null {\n  const medplum = useMedplum();\n  const requestGroup = useResource(props.value);\n  const [startedLoading, setStartedLoading] = useState(false);\n  const [responseBundle, setResponseBundle] = useState<Bundle>();\n\n  useEffect(() => {\n    if (requestGroup && !startedLoading) {\n      medplum.executeBatch(buildBatchRequest(requestGroup)).then(setResponseBundle);\n      setStartedLoading(true);\n    }\n  }, [medplum, requestGroup, startedLoading]);\n\n  if (!requestGroup || !responseBundle) {\n    return null;\n  }\n\n  return (\n    <div className=\"medplum-request-group\">\n      {requestGroup.action?.map((action, index) => {\n        const task = action.resource && findBundleEntry(action.resource as Reference<Task>);\n        const taskInput = task?.input?.[0]?.valueReference;\n        const taskOutput = task?.output?.[0]?.valueReference;\n        return (\n          <div className=\"medplum-request-group-task\" key={`action-${index}`}>\n            <div className=\"medplum-request-group-task-checkmark\">{task?.status === 'completed' ? '🗹' : '☐'}</div>\n            <div className=\"medplum-request-group-task-details\">\n              <div className=\"medplum-request-group-task-title\">{action.title}</div>\n              <div>\n                Last edited by&nbsp;\n                <ResourceName value={task?.meta?.author as Reference} />\n                &nbsp;on&nbsp;\n                {formatDateTime(task?.meta?.lastUpdated)}\n              </div>\n              <div>\n                Status: <StatusBadge status={task?.status || 'unknown'} />\n              </div>\n            </div>\n            <div className=\"medplum-request-group-task-actions\">\n              {taskInput && !taskOutput && <Button onClick={() => props.onStart(task, taskInput)}>Start</Button>}\n              {taskInput && taskOutput && (\n                <Button onClick={() => props.onEdit(task, taskInput, taskOutput)}>Edit</Button>\n              )}\n            </div>\n          </div>\n        );\n      })}\n    </div>\n  );\n\n  function buildBatchRequest(request: RequestGroup): Bundle {\n    const batchEntries = [] as BundleEntry[];\n    if (request.action) {\n      for (const action of request.action) {\n        if (action.resource?.reference) {\n          batchEntries.push({ request: { method: 'GET', url: action.resource.reference } });\n        }\n      }\n    }\n\n    return {\n      resourceType: 'Bundle',\n      type: 'batch',\n      entry: batchEntries,\n    };\n  }\n\n  function findBundleEntry<T extends Resource>(reference: Reference<T>): T | undefined {\n    for (const entry of responseBundle?.entry as BundleEntry[]) {\n      if (entry.resource && reference.reference === getReferenceString(entry.resource)) {\n        return entry.resource as T;\n      }\n    }\n    return undefined;\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/ResourceArrayDisplay.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { ResourcePropertyDisplay } from './ResourcePropertyDisplay.js';
+
+function ResourceArrayDisplay(props) {
+    var _a, _b, _c;
+    const property = props.property;
+    const values = (_a = props.values) !== null && _a !== void 0 ? _a : [];
+    const propertyType = (_c = (_b = property.type) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.code;
+    return (React.createElement(React.Fragment, null, values.map((v, index) => (React.createElement("div", { key: `${index}-${values.length}` },
+        React.createElement(ResourcePropertyDisplay, { arrayElement: true, property: property, propertyType: propertyType, value: v, ignoreMissingValues: props.ignoreMissingValues, link: props.link }))))));
+}
+
+export { ResourceArrayDisplay };
+//# sourceMappingURL=ResourceArrayDisplay.js.map

package/dist/esm/ResourceArrayDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceArrayDisplay.js","sources":["../../src/ResourceArrayDisplay.tsx"],"sourcesContent":["import { PropertyType } from '@medplum/core';\nimport { ElementDefinition } from '@medplum/fhirtypes';\nimport React from 'react';\nimport { ResourcePropertyDisplay } from './ResourcePropertyDisplay';\n\ninterface ResourceArrayDisplayProps {\n  property: ElementDefinition;\n  values: any[];\n  arrayElement?: boolean;\n  ignoreMissingValues?: boolean;\n  link?: boolean;\n}\n\nexport function ResourceArrayDisplay(props: ResourceArrayDisplayProps): JSX.Element {\n  const property = props.property;\n  const values = props.values ?? [];\n  const propertyType = property.type?.[0]?.code as PropertyType;\n  return (\n    <>\n      {values.map((v: any, index: number) => (\n        <div key={`${index}-${values.length}`}>\n          <ResourcePropertyDisplay\n            arrayElement={true}\n            property={property}\n            propertyType={propertyType}\n            value={v}\n            ignoreMissingValues={props.ignoreMissingValues}\n            link={props.link}\n          />\n        </div>\n      ))}\n    </>\n  );\n}\n"],"names":[],"mappings":";;;AAaM,SAAU,oBAAoB,CAAC,KAAgC,EAAA;;AACnE,IAAA,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;IAChC,MAAM,MAAM,GAAG,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,EAAE,CAAC;AAClC,IAAA,MAAM,YAAY,GAAG,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAG,CAAC,CAAC,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAoB,CAAC;IAC9D,QACE,0CACG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAM,EAAE,KAAa,MAChC,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA,MAAM,CAAC,MAAM,CAAE,CAAA,EAAA;AACnC,QAAA,KAAA,CAAA,aAAA,CAAC,uBAAuB,EAAA,EACtB,YAAY,EAAE,IAAI,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE,CAAC,EACR,mBAAmB,EAAE,KAAK,CAAC,mBAAmB,EAC9C,IAAI,EAAE,KAAK,CAAC,IAAI,GAChB,CACE,CACP,CAAC,CACD,EACH;AACJ;;;;"}

package/dist/esm/ResourceArrayInput.js

@@ -0,0 +1,47 @@
+import React, { useState, useRef } from 'react';
+import { Button } from './Button.js';
+import { ResourcePropertyInput } from './ResourcePropertyInput.js';
+import { killEvent } from './utils/dom.js';
+
+function ResourceArrayInput(props) {
+    const [values, setValues] = useState(props.defaultValue && Array.isArray(props.defaultValue) ? props.defaultValue : []);
+    const valuesRef = useRef();
+    valuesRef.current = values;
+    function setValuesWrapper(newValues) {
+        setValues(newValues);
+        if (props.onChange) {
+            props.onChange(newValues);
+        }
+    }
+    return (React.createElement("table", { style: { width: '100%', borderCollapse: 'collapse' } },
+        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(ResourcePropertyInput, { arrayElement: true, property: props.property, name: props.name + '.' + index, defaultValue: v, onChange: (newValue) => {
+                            const copy = [...valuesRef.current];
+                            copy[index] = newValue;
+                            setValuesWrapper(copy);
+                        } })),
+                React.createElement("td", { style: { textAlign: 'right' } },
+                    React.createElement(Button, { onClick: (e) => {
+                            killEvent(e);
+                            const copy = [...valuesRef.current];
+                            copy.splice(index, 1);
+                            setValuesWrapper(copy);
+                        } }, "Remove"))))),
+            React.createElement("tr", null,
+                React.createElement("td", null),
+                React.createElement("td", { style: { textAlign: 'right' } },
+                    React.createElement(Button, { onClick: (e) => {
+                            killEvent(e);
+                            const copy = [...valuesRef.current];
+                            copy.push(undefined);
+                            setValuesWrapper(copy);
+                        } }, "Add"))))));
+}
+
+export { ResourceArrayInput };
+//# sourceMappingURL=ResourceArrayInput.js.map

package/dist/esm/ResourceArrayInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceArrayInput.js","sources":["../../src/ResourceArrayInput.tsx"],"sourcesContent":["import { ElementDefinition } from '@medplum/fhirtypes';\nimport React, { useRef, useState } from 'react';\nimport { Button } from './Button';\nimport { ResourcePropertyInput } from './ResourcePropertyInput';\nimport { killEvent } from './utils/dom';\n\ninterface ResourceArrayInputProps {\n  property: ElementDefinition;\n  name: string;\n  defaultValue?: any[];\n  arrayElement?: boolean;\n  onChange?: (value: any[]) => void;\n}\n\nexport function ResourceArrayInput(props: ResourceArrayInputProps): JSX.Element {\n  const [values, setValues] = useState(\n    props.defaultValue && Array.isArray(props.defaultValue) ? props.defaultValue : []\n  );\n\n  const valuesRef = useRef<any[]>();\n  valuesRef.current = values;\n\n  function setValuesWrapper(newValues: any[]): void {\n    setValues(newValues);\n    if (props.onChange) {\n      props.onChange(newValues);\n    }\n  }\n\n  return (\n    <table style={{ width: '100%', borderCollapse: 'collapse' }}>\n      <colgroup>\n        <col width=\"90%\" />\n        <col width=\"10%\" />\n      </colgroup>\n      <tbody>\n        {values.map((v, index) => (\n          <tr key={`${index}-${values.length}`}>\n            <td>\n              <ResourcePropertyInput\n                arrayElement={true}\n                property={props.property}\n                name={props.name + '.' + index}\n                defaultValue={v}\n                onChange={(newValue: any) => {\n                  const copy = [...(valuesRef.current as any[])];\n                  copy[index] = newValue;\n                  setValuesWrapper(copy);\n                }}\n              />\n            </td>\n            <td style={{ textAlign: 'right' }}>\n              <Button\n                onClick={(e) => {\n                  killEvent(e);\n                  const copy = [...(valuesRef.current as any[])];\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 style={{ textAlign: 'right' }}>\n            <Button\n              onClick={(e) => {\n                killEvent(e);\n                const copy = [...(valuesRef.current as any[])];\n                copy.push(undefined);\n                setValuesWrapper(copy);\n              }}\n            >\n              Add\n            </Button>\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/ResourceBadge.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { Avatar } from './Avatar.js';
+import { ResourceName } from './ResourceName.js';
+
+function ResourceBadge(props) {
+    var _a;
+    return (React.createElement("div", { className: "medplum-resource-badge" },
+        React.createElement(Avatar, { size: (_a = props.size) !== null && _a !== void 0 ? _a : 'small', value: props.value, link: props.link }),
+        React.createElement(ResourceName, { value: props.value, link: props.link })));
+}
+
+export { ResourceBadge };
+//# sourceMappingURL=ResourceBadge.js.map

package/dist/esm/ResourceBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceBadge.js","sources":["../../src/ResourceBadge.tsx"],"sourcesContent":["import { Reference, Resource } from '@medplum/fhirtypes';\nimport React from 'react';\nimport { Avatar } from './Avatar';\nimport { ResourceName } from './ResourceName';\nimport './ResourceBadge.css';\n\nexport interface ResourceBadgeProps {\n  value?: Reference | Resource;\n  size?: 'xsmall' | 'small' | 'medium' | 'large';\n  link?: boolean;\n}\n\nexport function ResourceBadge(props: ResourceBadgeProps): JSX.Element {\n  return (\n    <div className=\"medplum-resource-badge\">\n      <Avatar size={props.size ?? 'small'} value={props.value} link={props.link} />\n      <ResourceName value={props.value} link={props.link} />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAYM,SAAU,aAAa,CAAC,KAAyB,EAAA;;AACrD,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,wBAAwB,EAAA;QACrC,KAAC,CAAA,aAAA,CAAA,MAAM,IAAC,IAAI,EAAE,MAAA,KAAK,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAI,CAAA;AAC7E,QAAA,KAAA,CAAA,aAAA,CAAC,YAAY,EAAC,EAAA,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAI,CAAA,CAClD,EACN;AACJ;;;;"}

package/dist/esm/ResourceBlame.js

@@ -0,0 +1,65 @@
+import React, { useState, useEffect } from 'react';
+import { InputRow } from './InputRow.js';
+import { MedplumLink } from './MedplumLink.js';
+import { useMedplum } from './MedplumProvider.js';
+import { ResourceBadge } from './ResourceBadge.js';
+import { blame } from './utils/blame.js';
+
+function ResourceBlame(props) {
+    var _a, _b;
+    const medplum = useMedplum();
+    const [value, setValue] = useState(props.history);
+    useEffect(() => {
+        if (!props.history && props.resourceType && props.id) {
+            medplum.readHistory(props.resourceType, props.id).then((result) => setValue(result));
+        }
+    }, [medplum, props.history, props.resourceType, props.id]);
+    if (!value) {
+        return React.createElement("div", null, "Loading...");
+    }
+    const resource = (_b = (_a = value.entry) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.resource;
+    const table = blame(value);
+    return (React.createElement("div", { className: "medplum-blame-container" },
+        React.createElement("table", { className: "medplum-blame" },
+            React.createElement("tbody", null, table.map((row, index) => (React.createElement("tr", { key: 'row-' + index, className: row.span > 0 ? 'start-row' : 'normal-row' },
+                row.span > 0 && (React.createElement("td", { className: "details", rowSpan: row.span },
+                    React.createElement(InputRow, { justifyContent: "space-between" },
+                        React.createElement(ResourceBadge, { value: row.meta.author, size: "xsmall", link: true }),
+                        React.createElement(MedplumLink, { to: getVersionUrl(resource, row.meta.versionId) }, getTimeString(row.meta.lastUpdated))))),
+                React.createElement("td", { className: "line-number" }, index + 1),
+                React.createElement("td", { className: "line" },
+                    React.createElement("pre", { className: "line-pre" }, row.value)))))))));
+}
+function getVersionUrl(resource, versionId) {
+    return `/${resource.resourceType}/${resource.id}/_history/${versionId}`;
+}
+function getTimeString(lastUpdated) {
+    const seconds = Math.floor((Date.now() - Date.parse(lastUpdated)) / 1000);
+    const years = Math.floor(seconds / 31536000);
+    if (years > 0) {
+        return pluralizeTime(years, 'year');
+    }
+    const months = Math.floor(seconds / 2592000);
+    if (months > 0) {
+        return pluralizeTime(months, 'month');
+    }
+    const days = Math.floor(seconds / 86400);
+    if (days > 0) {
+        return pluralizeTime(days, 'day');
+    }
+    const hours = Math.floor(seconds / 3600);
+    if (hours > 0) {
+        return pluralizeTime(hours, 'hour');
+    }
+    const minutes = Math.floor(seconds / 60);
+    if (minutes > 0) {
+        return pluralizeTime(minutes, 'minute');
+    }
+    return pluralizeTime(seconds, 'second');
+}
+function pluralizeTime(count, noun) {
+    return `${count} ${count === 1 ? noun : noun + 's'} ago`;
+}
+
+export { ResourceBlame, getTimeString };
+//# sourceMappingURL=ResourceBlame.js.map

package/dist/esm/ResourceBlame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceBlame.js","sources":["../../src/ResourceBlame.tsx"],"sourcesContent":["import { Bundle, Resource, ResourceType } from '@medplum/fhirtypes';\nimport React, { useEffect, useState } from 'react';\nimport { InputRow } from './InputRow';\nimport { MedplumLink } from './MedplumLink';\nimport { useMedplum } from './MedplumProvider';\nimport { ResourceBadge } from './ResourceBadge';\nimport { blame } from './utils/blame';\nimport './ResourceBlame.css';\n\nexport interface ResourceBlameProps {\n  history?: Bundle;\n  resourceType?: ResourceType;\n  id?: string;\n}\n\nexport function ResourceBlame(props: ResourceBlameProps): JSX.Element {\n  const medplum = useMedplum();\n  const [value, setValue] = useState<Bundle | undefined>(props.history);\n\n  useEffect(() => {\n    if (!props.history && props.resourceType && props.id) {\n      medplum.readHistory(props.resourceType, props.id).then((result) => setValue(result));\n    }\n  }, [medplum, props.history, props.resourceType, props.id]);\n\n  if (!value) {\n    return <div>Loading...</div>;\n  }\n\n  const resource = value.entry?.[0]?.resource as Resource;\n  const table = blame(value);\n  return (\n    <div className=\"medplum-blame-container\">\n      <table className=\"medplum-blame\">\n        <tbody>\n          {table.map((row, index) => (\n            <tr key={'row-' + index} className={row.span > 0 ? 'start-row' : 'normal-row'}>\n              {row.span > 0 && (\n                <td className=\"details\" rowSpan={row.span}>\n                  <InputRow justifyContent=\"space-between\">\n                    <ResourceBadge value={row.meta.author} size=\"xsmall\" link={true} />\n                    <MedplumLink to={getVersionUrl(resource, row.meta.versionId as string)}>\n                      {getTimeString(row.meta.lastUpdated as string)}\n                    </MedplumLink>\n                  </InputRow>\n                </td>\n              )}\n              <td className=\"line-number\">{index + 1}</td>\n              <td className=\"line\">\n                <pre className=\"line-pre\">{row.value}</pre>\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  );\n}\n\nfunction getVersionUrl(resource: Resource, versionId: string): string {\n  return `/${resource.resourceType}/${resource.id}/_history/${versionId}`;\n}\n\nexport function getTimeString(lastUpdated: string): string {\n  const seconds = Math.floor((Date.now() - Date.parse(lastUpdated)) / 1000);\n\n  const years = Math.floor(seconds / 31536000);\n  if (years > 0) {\n    return pluralizeTime(years, 'year');\n  }\n\n  const months = Math.floor(seconds / 2592000);\n  if (months > 0) {\n    return pluralizeTime(months, 'month');\n  }\n\n  const days = Math.floor(seconds / 86400);\n  if (days > 0) {\n    return pluralizeTime(days, 'day');\n  }\n\n  const hours = Math.floor(seconds / 3600);\n  if (hours > 0) {\n    return pluralizeTime(hours, 'hour');\n  }\n\n  const minutes = Math.floor(seconds / 60);\n  if (minutes > 0) {\n    return pluralizeTime(minutes, 'minute');\n  }\n\n  return pluralizeTime(seconds, 'second');\n}\n\nfunction pluralizeTime(count: number, noun: string): string {\n  return `${count} ${count === 1 ? noun : noun + 's'} ago`;\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/ResourceDiff.js

@@ -0,0 +1,28 @@
+import { stringify } from '@medplum/core';
+import React from 'react';
+import { diff } from './utils/diff.js';
+
+function ResourceDiff(props) {
+    let originalResource = props.original;
+    let revisedResource = props.revised;
+    if (props.ignoreMeta) {
+        originalResource = Object.assign(Object.assign({}, originalResource), { meta: undefined });
+        revisedResource = Object.assign(Object.assign({}, revisedResource), { meta: undefined });
+    }
+    const original = stringify(originalResource, true).match(/[^\r\n]+/g);
+    const revised = stringify(revisedResource, true).match(/[^\r\n]+/g);
+    const deltas = diff(original, revised);
+    return (React.createElement("pre", { style: { color: 'gray' } }, deltas.map((delta, index) => (React.createElement(ChangeDiff, { key: 'delta' + index, delta: delta })))));
+}
+function ChangeDiff(props) {
+    return (React.createElement(React.Fragment, null,
+        "...",
+        React.createElement("br", null),
+        props.delta.original.lines.length > 0 && (React.createElement("div", { className: "medplum-diff-removed" }, props.delta.original.lines.join('\n'))),
+        props.delta.revised.lines.length > 0 && (React.createElement("div", { className: "medplum-diff-added" }, props.delta.revised.lines.join('\n'))),
+        "...",
+        React.createElement("br", null)));
+}
+
+export { ResourceDiff };
+//# sourceMappingURL=ResourceDiff.js.map

package/dist/esm/ResourceDiff.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceDiff.js","sources":["../../src/ResourceDiff.tsx"],"sourcesContent":["import { stringify } from '@medplum/core';\nimport { Resource } from '@medplum/fhirtypes';\nimport React from 'react';\nimport { Delta, diff } from './utils/diff';\nimport './ResourceDiff.css';\n\nexport interface ResourceDiffProps {\n  original: Resource;\n  revised: Resource;\n  ignoreMeta?: boolean;\n}\n\nexport function ResourceDiff(props: ResourceDiffProps): JSX.Element {\n  let originalResource = props.original;\n  let revisedResource = props.revised;\n\n  if (props.ignoreMeta) {\n    originalResource = { ...originalResource, meta: undefined };\n    revisedResource = { ...revisedResource, meta: undefined };\n  }\n\n  const original = stringify(originalResource, true).match(/[^\\r\\n]+/g) as string[];\n  const revised = stringify(revisedResource, true).match(/[^\\r\\n]+/g) as string[];\n  const deltas = diff(original, revised);\n  return (\n    <pre style={{ color: 'gray' }}>\n      {deltas.map((delta, index) => (\n        <ChangeDiff key={'delta' + index} delta={delta} />\n      ))}\n    </pre>\n  );\n}\n\nfunction ChangeDiff(props: { delta: Delta }): JSX.Element {\n  return (\n    <>\n      ...\n      <br />\n      {props.delta.original.lines.length > 0 && (\n        <div className=\"medplum-diff-removed\">{props.delta.original.lines.join('\\n')}</div>\n      )}\n      {props.delta.revised.lines.length > 0 && (\n        <div className=\"medplum-diff-added\">{props.delta.revised.lines.join('\\n')}</div>\n      )}\n      ...\n      <br />\n    </>\n  );\n}\n"],"names":[],"mappings":";;;;AAYM,SAAU,YAAY,CAAC,KAAwB,EAAA;AACnD,IAAA,IAAI,gBAAgB,GAAG,KAAK,CAAC,QAAQ,CAAC;AACtC,IAAA,IAAI,eAAe,GAAG,KAAK,CAAC,OAAO,CAAC;IAEpC,IAAI,KAAK,CAAC,UAAU,EAAE;AACpB,QAAA,gBAAgB,mCAAQ,gBAAgB,CAAA,EAAA,EAAE,IAAI,EAAE,SAAS,GAAE,CAAC;AAC5D,QAAA,eAAe,mCAAQ,eAAe,CAAA,EAAA,EAAE,IAAI,EAAE,SAAS,GAAE,CAAC;AAC3D,KAAA;AAED,IAAA,MAAM,QAAQ,GAAG,SAAS,CAAC,gBAAgB,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,WAAW,CAAa,CAAC;AAClF,IAAA,MAAM,OAAO,GAAG,SAAS,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,WAAW,CAAa,CAAC;IAChF,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;AACvC,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,EAAA,EAC1B,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,MACvB,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,GAAG,EAAE,OAAO,GAAG,KAAK,EAAE,KAAK,EAAE,KAAK,EAAA,CAAI,CACnD,CAAC,CACE,EACN;AACJ,CAAC;AAED,SAAS,UAAU,CAAC,KAAuB,EAAA;AACzC,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;;QAEE,KAAM,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA,CAAA;AACL,QAAA,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,KACpC,6BAAK,SAAS,EAAC,sBAAsB,EAAA,EAAE,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAO,CACpF;AACA,QAAA,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,KACnC,6BAAK,SAAS,EAAC,oBAAoB,EAAA,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAO,CACjF;;QAED,KAAM,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA,CAAA,CACL,EACH;AACJ;;;;"}

package/dist/esm/ResourceDiffTable.js

@@ -0,0 +1,58 @@
+import { toTypedValue, stringify, getPropertyDisplayName } from '@medplum/core';
+import React, { useState, useEffect } from 'react';
+import { useMedplum } from './MedplumProvider.js';
+import { getValueAndType, ResourcePropertyDisplay } from './ResourcePropertyDisplay.js';
+
+function ResourceDiffTable(props) {
+    const medplum = useMedplum();
+    const [schema, setSchema] = useState();
+    useEffect(() => {
+        medplum.requestSchema(props.original.resourceType).then(setSchema);
+    }, [medplum, props.original.resourceType]);
+    if (!schema) {
+        return null;
+    }
+    const typeSchema = schema.types[props.original.resourceType];
+    if (!typeSchema) {
+        return null;
+    }
+    return (React.createElement("table", { className: "medplum-diff-table" },
+        React.createElement("colgroup", null,
+            React.createElement("col", { style: { width: '30%' } }),
+            React.createElement("col", { style: { width: '35%' } }),
+            React.createElement("col", { style: { width: '35%' } })),
+        React.createElement("thead", null,
+            React.createElement("tr", null,
+                React.createElement("th", null, "Property"),
+                React.createElement("th", null, "Before"),
+                React.createElement("th", null, "After"))),
+        React.createElement("tbody", null, Object.entries(typeSchema.properties).map((entry) => {
+            const key = entry[0];
+            if (key === 'id' || key === 'meta') {
+                return null;
+            }
+            const property = entry[1];
+            const [originalPropertyValue, originalPropertyType] = getValueAndType(toTypedValue(props.original), key);
+            const [revisedPropertyValue, revisedPropertyType] = getValueAndType(toTypedValue(props.revised), key);
+            if (isEmpty(originalPropertyValue) && isEmpty(revisedPropertyValue)) {
+                return null;
+            }
+            if (stringify(originalPropertyValue) === stringify(revisedPropertyValue)) {
+                return null;
+            }
+            return (React.createElement("tr", { key: key },
+                React.createElement("td", null, getPropertyDisplayName(key)),
+                React.createElement("td", { className: "medplum-diff-removed" },
+                    React.createElement(ResourcePropertyDisplay, { property: property, propertyType: originalPropertyType, value: originalPropertyValue, ignoreMissingValues: true })),
+                React.createElement("td", { className: "medplum-diff-added" },
+                    React.createElement(ResourcePropertyDisplay, { property: property, propertyType: revisedPropertyType, value: revisedPropertyValue, ignoreMissingValues: true }))));
+        }))));
+}
+function isEmpty(value) {
+    return (!value ||
+        (Array.isArray(value) && value.length === 0) ||
+        (typeof value === 'object' && Object.keys(value).length === 0));
+}
+
+export { ResourceDiffTable };
+//# sourceMappingURL=ResourceDiffTable.js.map

package/dist/esm/ResourceDiffTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResourceDiffTable.js","sources":["../../src/ResourceDiffTable.tsx"],"sourcesContent":["import { getPropertyDisplayName, IndexedStructureDefinition, stringify, toTypedValue } from '@medplum/core';\nimport { Resource } from '@medplum/fhirtypes';\nimport React, { useEffect, useState } from 'react';\nimport { useMedplum } from './MedplumProvider';\nimport { getValueAndType, ResourcePropertyDisplay } from './ResourcePropertyDisplay';\nimport './ResourceDiff.css';\nimport './ResourceDiffTable.css';\n\nexport interface ResourceDiffTableProps {\n  original: Resource;\n  revised: Resource;\n}\n\nexport function ResourceDiffTable(props: ResourceDiffTableProps): JSX.Element | null {\n  const medplum = useMedplum();\n  const [schema, setSchema] = useState<IndexedStructureDefinition | undefined>();\n\n  useEffect(() => {\n    medplum.requestSchema(props.original.resourceType).then(setSchema);\n  }, [medplum, props.original.resourceType]);\n\n  if (!schema) {\n    return null;\n  }\n\n  const typeSchema = schema.types[props.original.resourceType];\n  if (!typeSchema) {\n    return null;\n  }\n\n  return (\n    <table className=\"medplum-diff-table\">\n      <colgroup>\n        <col style={{ width: '30%' }} />\n        <col style={{ width: '35%' }} />\n        <col style={{ width: '35%' }} />\n      </colgroup>\n      <thead>\n        <tr>\n          <th>Property</th>\n          <th>Before</th>\n          <th>After</th>\n        </tr>\n      </thead>\n      <tbody>\n        {Object.entries(typeSchema.properties).map((entry) => {\n          const key = entry[0];\n          if (key === 'id' || key === 'meta') {\n            return null;\n          }\n\n          const property = entry[1];\n          const [originalPropertyValue, originalPropertyType] = getValueAndType(toTypedValue(props.original), key);\n          const [revisedPropertyValue, revisedPropertyType] = getValueAndType(toTypedValue(props.revised), key);\n          if (isEmpty(originalPropertyValue) && isEmpty(revisedPropertyValue)) {\n            return null;\n          }\n\n          if (stringify(originalPropertyValue) === stringify(revisedPropertyValue)) {\n            return null;\n          }\n\n          return (\n            <tr key={key}>\n              <td>{getPropertyDisplayName(key)}</td>\n              <td className=\"medplum-diff-removed\">\n                <ResourcePropertyDisplay\n                  property={property}\n                  propertyType={originalPropertyType}\n                  value={originalPropertyValue}\n                  ignoreMissingValues={true}\n                />\n              </td>\n              <td className=\"medplum-diff-added\">\n                <ResourcePropertyDisplay\n                  property={property}\n                  propertyType={revisedPropertyType}\n                  value={revisedPropertyValue}\n                  ignoreMissingValues={true}\n                />\n              </td>\n            </tr>\n          );\n        })}\n      </tbody>\n    </table>\n  );\n}\n\nfunction isEmpty(value: unknown): boolean {\n  return (\n    !value ||\n    (Array.isArray(value) && value.length === 0) ||\n    (typeof value === 'object' && Object.keys(value).length === 0)\n  );\n}\n"],"names":[],"mappings":"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"}