@openmrs/esm-patient-registration-app 9.2.1-pre.7366 → 9.2.1-pre.7379

package/dist/openmrs-esm-patient-registration-app.js.buildmanifest.json

@@ -274,7 +274,7 @@
       "auxiliaryFiles": [
         "1909.js.map"
       ],
-      "hash": "0a3a461886c747b8",
+      "hash": "cb9195db036705de",
       "childrenByOrder": {}
     },
     {
@@ -425,9 +425,9 @@
       "initial": false,
       "entry": false,
       "recorded": false,
-      "size": 1079,
+      "size": 1123,
       "sizes": {
-        "javascript": 1079
+        "javascript": 1123
       },
       "names": [],
       "idHints": [],
@@ -441,7 +441,7 @@
       "auxiliaryFiles": [
         "3093.js.map"
       ],
-      "hash": "eab6898db01673ff",
+      "hash": "66636912a1f2c12d",
       "childrenByOrder": {}
     },
     {
@@ -549,9 +549,9 @@
       "initial": false,
       "entry": false,
       "recorded": false,
-      "size": 145744,
+      "size": 145685,
       "sizes": {
-        "javascript": 145744
+        "javascript": 145685
       },
       "names": [],
       "idHints": [],
@@ -564,7 +564,7 @@
       "auxiliaryFiles": [
         "3474.js.map"
       ],
-      "hash": "cc533d920d89fd30",
+      "hash": "b0e2dcb908f380c9",
       "childrenByOrder": {}
     },
     {
@@ -594,9 +594,9 @@
       "initial": false,
       "entry": false,
       "recorded": false,
-      "size": 596841,
+      "size": 597050,
       "sizes": {
-        "javascript": 596841
+        "javascript": 597050
       },
       "names": [],
       "idHints": [],
@@ -610,7 +610,7 @@
       "auxiliaryFiles": [
         "3704.js.map"
       ],
-      "hash": "cb411f1211dadc95",
+      "hash": "603c490c2d805be2",
       "childrenByOrder": {}
     },
     {
@@ -967,7 +967,7 @@
       "auxiliaryFiles": [
         "6276.js.map"
       ],
-      "hash": "ddbcca6ebc4f4111",
+      "hash": "1e3285b847288319",
       "childrenByOrder": {}
     },
     {
@@ -1223,7 +1223,7 @@
       "auxiliaryFiles": [
         "7248.js.map"
       ],
-      "hash": "b9e8e09bea0c4d75",
+      "hash": "5aba63d53252cab1",
       "childrenByOrder": {}
     },
     {
@@ -1380,7 +1380,7 @@
       "auxiliaryFiles": [
         "8434.js.map"
       ],
-      "hash": "e6fd472e35a925eb",
+      "hash": "8dd30bb15ddedbb3",
       "childrenByOrder": {}
     },
     {
@@ -1410,10 +1410,10 @@
       "initial": true,
       "entry": true,
       "recorded": false,
-      "size": 2411622,
+      "size": 2411563,
       "sizes": {
         "consume-shared": 168,
-        "javascript": 2389047,
+        "javascript": 2388988,
         "share-init": 336,
         "runtime": 22071
       },
@@ -1430,7 +1430,7 @@
       "auxiliaryFiles": [
         "main.js.map"
       ],
-      "hash": "fe510d869f926ccd",
+      "hash": "65f95418f35ff5b0",
       "childrenByOrder": {}
     },
     {

package/dist/routes.json

@@ -1 +1 @@
-{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":">=2.2.0"},"pages":[{"component":"root","route":"patient-registration","online":true,"offline":true},{"component":"editPatient","routeRegex":"patient\\/([a-zA-Z0-9\\-]+)\\/edit","online":true,"offline":true}],"extensions":[{"component":"addPatientLink","name":"add-patient-action","slot":"top-nav-actions-slot","online":true,"offline":true,"order":30},{"component":"patientPhotoExtension","name":"patient-photo-widget","slot":"patient-photo-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-actions-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-search-actions-slot","online":true,"offline":true}],"modals":[{"name":"cancel-patient-edit-modal","component":"cancelPatientEditModal"},{"name":"delete-identifier-confirmation-modal","component":"deleteIdentifierConfirmationModal"}],"version":"9.2.1-pre.7366"}
+{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":">=2.2.0"},"pages":[{"component":"root","route":"patient-registration","online":true,"offline":true},{"component":"editPatient","routeRegex":"patient\\/([a-zA-Z0-9\\-]+)\\/edit","online":true,"offline":true}],"extensions":[{"component":"addPatientLink","name":"add-patient-action","slot":"top-nav-actions-slot","online":true,"offline":true,"order":30},{"component":"patientPhotoExtension","name":"patient-photo-widget","slot":"patient-photo-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-actions-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-search-actions-slot","online":true,"offline":true}],"modals":[{"name":"cancel-patient-edit-modal","component":"cancelPatientEditModal"},{"name":"delete-identifier-confirmation-modal","component":"deleteIdentifierConfirmationModal"}],"version":"9.2.1-pre.7379"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-patient-registration-app",
-  "version": "9.2.1-pre.7366",
+  "version": "9.2.1-pre.7379",
   "description": "Patient registration microfrontend for O3",
   "browser": "dist/openmrs-esm-patient-registration-app.js",
   "main": "src/index.ts",

package/src/add-patient-link.extension.tsx

@@ -13,8 +13,6 @@ export default function Root() {
     <HeaderGlobalAction
       aria-label={t('addPatient', 'Add patient')}
       aria-labelledby={t('addPatient', 'Add patient')}
-      enterDelayMs={500}
-      name="AddPatientIcon"
       onClick={addPatient}
       className={styles.slotStyles}>
       <UserFollow size={20} />

package/src/declarations.d.ts

@@ -1,7 +1,4 @@
-declare module '@carbon/react';
 declare module '*.scss' {
   const content: { [className: string]: string };
   export default content;
 }
-
-declare type SideNavProps = {};

package/src/patient-registration/field/address/address-field.component.tsx

@@ -74,7 +74,10 @@ export const AddressComponent: React.FC = () => {
   if (addressTemplate && !Object.keys(addressTemplate)?.length) {
     return (
       <AddressComponentContainer>
-        <SkeletonText role="progressbar" />
+        <SkeletonText
+          // @ts-expect-error
+          role="progressbar"
+        />
       </AddressComponentContainer>
     );
   }
@@ -99,7 +102,10 @@ export const AddressComponent: React.FC = () => {
   if (isLoadingFieldOrder) {
     return (
       <AddressComponentContainer>
-        <SkeletonText />
+        <SkeletonText
+          // @ts-expect-error
+          role="progressbar"
+        />
       </AddressComponentContainer>
     );
   }

package/src/patient-registration/field/date-and-time-of-death/date-and-time-of-death.component.tsx

@@ -69,12 +69,7 @@ function DeathTimeField() {
         pattern="^(1[0-2]|0?[1-9]):([0-5]?[0-9])$"
         invalid={!!(deathTimeMeta.touched && deathTimeMeta.error)}
         invalidText={t(deathTimeMeta.error)}>
-        <TimePickerSelect
-          {...deathTimeFormatField}
-          id="time-format-picker"
-          aria-label={t('timeFormat', 'Time Format')}
-          invalid={!!deathTimeFormatMeta.touched && deathTimeFormatMeta.error}
-          invalidText={t(deathTimeFormatMeta.error)}>
+        <TimePickerSelect {...deathTimeFormatField} id="time-format-picker" aria-label={t('timeFormat', 'Time Format')}>
           <SelectItem value="AM" text="AM" />
           <SelectItem value="PM" text="PM" />
         </TimePickerSelect>

package/src/patient-registration/field/dob/dob.component.tsx

@@ -95,7 +95,7 @@ export const DobField: React.FC = () => {
           <div className={styles.dobContentSwitcherLabel}>
             <span className={styles.label01}>{t('dobToggleLabelText', 'Date of birth known?')}</span>
           </div>
-          <ContentSwitcher onChange={onToggle} selectedIndex={dobUnknown ? 1 : 0}>
+          <ContentSwitcher size="md" onChange={onToggle} selectedIndex={dobUnknown ? 1 : 0}>
             <Switch name="known" text={t('yes', 'Yes')} />
             <Switch name="unknown" text={t('no', 'No')} />
           </ContentSwitcher>

package/src/patient-registration/field/id/id-field.component.tsx

@@ -113,7 +113,10 @@ export const Identifiers: React.FC = () => {
         <div className={styles.identifierLabelText}>
           <h4 className={styles.productiveHeading02Light}>{t('idFieldLabelText', 'Identifiers')}</h4>
         </div>
-        <SkeletonText role="progressbar" />
+        <SkeletonText
+          // @ts-expect-error
+          role="progressbar"
+        />
       </div>
     );
   }

package/src/patient-registration/field/name/name-field.component.tsx

@@ -119,6 +119,7 @@ export const NameField = () => {
               </div>
               <ContentSwitcher
                 className={styles.contentSwitcher}
+                size="md"
                 selectedIndex={isPatientUnknown ? 1 : 0}
                 onChange={toggleNameKnown}>
                 <Switch name="known" text={t('yes', 'Yes')} />

package/src/patient-registration/input/combo-input/combo-input.component.tsx

@@ -10,13 +10,14 @@ interface ComboInputProps {
   fieldProps: {
     value: string;
     labelText: string;
+    id?: string;
     [x: string]: any;
   };
   handleInputChange: (newValue: string) => void;
   handleSelection: (newSelection) => void;
 }
 
-const ComboInput: React.FC<ComboInputProps> = ({ entries, fieldProps, handleInputChange, handleSelection }) => {
+const ComboInput: React.FC<ComboInputProps> = ({ entries, name, fieldProps, handleInputChange, handleSelection }) => {
   const [highlightedEntry, setHighlightedEntry] = useState(-1);
   const { value = '' } = fieldProps;
   const [showEntries, setShowEntries] = useState(false);
@@ -38,7 +39,7 @@ const ComboInput: React.FC<ComboInputProps> = ({ entries, fieldProps, handleInpu
   }, [entries, value]);
 
   const handleOptionClick = useCallback(
-    (newSelection: string, e: KeyboardEvent = null) => {
+    (newSelection: string, e: React.KeyboardEvent<HTMLInputElement> | null = null) => {
       e?.preventDefault();
       handleSelection(newSelection);
       setShowEntries(false);
@@ -47,7 +48,7 @@ const ComboInput: React.FC<ComboInputProps> = ({ entries, fieldProps, handleInpu
   );
 
   const handleKeyPress = useCallback(
-    (e: KeyboardEvent) => {
+    (e: React.KeyboardEvent<HTMLInputElement>) => {
       const totalResults = filteredEntries.length ?? 0;
 
       if (e.key === 'Tab') {
@@ -84,6 +85,7 @@ const ComboInput: React.FC<ComboInputProps> = ({ entries, fieldProps, handleInpu
       <Layer>
         <TextInput
           {...fieldProps}
+          id={fieldProps.id || name}
           onChange={(e) => {
             setHighlightedEntry(-1);
             handleInputChange(e.target.value);

package/src/patient-registration/input/custom-input/autosuggest/autosuggest.component.tsx

@@ -1,5 +1,5 @@
 import React, { type HTMLAttributes, useEffect, useRef, useState } from 'react';
-import { Layer, Search, type SearchProps } from '@carbon/react';
+import { Layer, Search } from '@carbon/react';
 import classNames from 'classnames';
 import styles from './autosuggest.scss';
 
@@ -51,7 +51,7 @@ interface SearchProps extends InputPropsBase {
   /**
    * Optional callback called when the search value changes.
    */
-  onChange?(e: { target: HTMLInputElement; type: 'change' }): void;
+  onChange?(e: React.ChangeEvent<HTMLInputElement>): void;
 
   /**
    * Optional callback called when the search value is cleared.
@@ -98,9 +98,9 @@ interface SearchProps extends InputPropsBase {
 }
 
 interface AutosuggestProps extends SearchProps {
-  getDisplayValue: Function;
-  getFieldValue: Function;
-  getSearchResults: (query: string) => Promise<any>;
+  getDisplayValue: (suggestion: any) => string;
+  getFieldValue: (suggestion: any) => string;
+  getSearchResults: (query: string) => Promise<Array<any>>;
   onSuggestionSelected: (field: string, value: string) => void;
   invalid?: boolean | undefined;
   invalidText?: string | undefined;
@@ -128,8 +128,8 @@ export const Autosuggest: React.FC<AutosuggestProps> = ({
     };
   }, [wrapper]);
 
-  const handleClickOutsideComponent = (e) => {
-    if (wrapper.current && !wrapper.current.contains(e.target)) {
+  const handleClickOutsideComponent = (e: MouseEvent) => {
+    if (wrapper.current && !wrapper.current.contains(e.target as Node)) {
       setSuggestions([]);
     }
   };
@@ -147,7 +147,7 @@ export const Autosuggest: React.FC<AutosuggestProps> = ({
     }
   };
 
-  const handleClear = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const handleClear = () => {
     onSuggestionSelected(name, undefined);
   };
 

package/src/patient-registration/patient-registration.test.tsx

@@ -397,8 +397,8 @@ describe('Registering a new patient', () => {
     expect(mockSavePatient).toHaveBeenCalledTimes(1);
     expect(mockSaveEncounter).toHaveBeenCalledTimes(1);
 
-    (expect(mockShowSnackbar).toHaveBeenCalledWith(expect.objectContaining({ subtitle: 'an error message' })),
-      mockSaveEncounter.mockResolvedValue({} as FetchResponse));
+    expect(mockShowSnackbar).toHaveBeenCalledWith(expect.objectContaining({ subtitle: 'an error message' }));
+    mockSaveEncounter.mockResolvedValue({} as FetchResponse);
 
     await user.click(registerPatientButton);
     expect(mockSavePatient).toHaveBeenCalledTimes(2);

package/src/patient-registration/section/patient-relationships/relationships-section.component.tsx

@@ -1,13 +1,5 @@
 import React, { useCallback, useEffect, useId, useState } from 'react';
-import {
-  Button,
-  Layer,
-  Select,
-  SelectItem,
-  InlineNotification,
-  NotificationActionButton,
-  SkeletonText,
-} from '@carbon/react';
+import { ActionableNotification, Button, Layer, Select, SelectItem, SkeletonText } from '@carbon/react';
 import { TrashCan } from '@carbon/react/icons';
 import { FieldArray } from 'formik';
 import { useTranslation } from 'react-i18next';
@@ -147,14 +139,11 @@ const RelationshipView: React.FC<RelationshipViewProps> = ({
       </div>
     </div>
   ) : (
-    <InlineNotification
+    <ActionableNotification
       kind="info"
       title={t('relationshipRemovedText', 'Relationship removed')}
-      actions={
-        <NotificationActionButton onClick={restoreRelationship}>
-          {t('restoreRelationshipActionButton', 'Undo')}
-        </NotificationActionButton>
-      }
+      actionButtonLabel={t('restoreRelationshipActionButton', 'Undo')}
+      onActionButtonClick={restoreRelationship}
     />
   );
 };
@@ -178,11 +167,13 @@ export const RelationshipsSection = () => {
           uuid: type.uuid,
           direction: 'bIsToA',
         };
-        aIsToB.display === bIsToA.display
-          ? tmp.push(aIsToB)
-          : bIsToA.display === 'Patient'
-            ? tmp.push(aIsToB, { display: `Patient (${aIsToB.display})`, uuid: type.uuid, direction: 'bIsToA' })
-            : tmp.push(aIsToB, bIsToA);
+        if (aIsToB.display === bIsToA.display) {
+          tmp.push(aIsToB);
+        } else if (bIsToA.display === 'Patient') {
+          tmp.push(aIsToB, { display: `Patient (${aIsToB.display})`, uuid: type.uuid, direction: 'bIsToA' });
+        } else {
+          tmp.push(aIsToB, bIsToA);
+        }
       });
       setDisplayRelationshipTypes(tmp);
     }
@@ -191,7 +182,10 @@ export const RelationshipsSection = () => {
   if (!relationshipTypes) {
     return (
       <section aria-label="Loading relationships section">
-        <SkeletonText role="progressbar" />
+        <SkeletonText
+          // @ts-expect-error
+          role="progressbar"
+        />
       </section>
     );
   }

package/src/widgets/edit-patient-details-button.component.tsx

@@ -12,7 +12,7 @@ const EditPatientDetailsButton: React.FC<EditPatientDetailsButtonProps> = ({ pat
   const { t } = useTranslation();
   const handleClick = React.useCallback(() => {
     navigate({ to: `\${openmrsSpaBase}/patient/${patientUuid}/edit` });
-    onTransition && onTransition();
+    onTransition?.();
   }, [onTransition, patientUuid]);
 
   return (