@openmrs/esm-react-utils 3.2.1-pre.1073 → 3.2.1-pre.1084

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openmrs/esm-react-utils",
-  "version": "3.2.1-pre.1073",
+  "version": "3.2.1-pre.1084",
   "license": "MPL-2.0",
   "description": "React utilities for OpenMRS.",
   "browser": "dist/openmrs-esm-react-utils.js",
@@ -55,11 +55,11 @@
     "react-i18next": "11.x"
   },
   "devDependencies": {
-    "@openmrs/esm-api": "^3.2.1-pre.1073",
-    "@openmrs/esm-config": "^3.2.1-pre.1073",
-    "@openmrs/esm-error-handling": "^3.2.1-pre.1073",
-    "@openmrs/esm-extensions": "^3.2.1-pre.1073",
-    "@openmrs/esm-globals": "^3.2.1-pre.1073",
+    "@openmrs/esm-api": "^3.2.1-pre.1084",
+    "@openmrs/esm-config": "^3.2.1-pre.1084",
+    "@openmrs/esm-error-handling": "^3.2.1-pre.1084",
+    "@openmrs/esm-extensions": "^3.2.1-pre.1084",
+    "@openmrs/esm-globals": "^3.2.1-pre.1084",
     "dayjs": "^1.10.8",
     "i18next": "^19.6.0",
     "react": "^16.13.1",
@@ -68,5 +68,5 @@
     "rxjs": "^6.5.3",
     "unistore": "^3.5.2"
   },
-  "gitHead": "375669d9327f82ab0cc86bc51f1ce626d9ee3430"
+  "gitHead": "c2a5b8ed52049b3e302df8043f42ac57ec3321b1"
 }

package/src/ConfigurableLink.tsx

@@ -1,3 +1,4 @@
+/** @module @category Navigation */
 import React, { MouseEvent, AnchorHTMLAttributes } from "react";
 import { navigate, interpolateUrl } from "@openmrs/esm-config";
 
@@ -27,7 +28,6 @@ export interface ConfigurableLinkProps
  * @param to The target path or URL. Supports interpolation. See [[navigate]]
  * @param children Inline elements within the link
  * @param otherProps Any other valid props for an <a> tag except `href` and `onClick`
- * @category Navigation
  */
 export const ConfigurableLink: React.FC<ConfigurableLinkProps> = ({
   to,

package/src/UserHasAccess.tsx

@@ -1,3 +1,4 @@
+/** @module @category API */
 import React, { useEffect, useState } from "react";
 import { getCurrentUser, userHasAccess, LoggedInUser } from "@openmrs/esm-api";
 

package/src/createUseStore.ts

@@ -1,3 +1,4 @@
+/** @module @category Store */
 import { useEffect, useMemo, useState } from "react";
 import { Store, BoundAction } from "unistore";
 

package/src/getLifecycle.ts

@@ -1,3 +1,4 @@
+/** @module @category Framework */
 import React from "react";
 import ReactDOM from "react-dom";
 import singleSpaReact from "single-spa-react";

package/src/public.ts

@@ -0,0 +1,26 @@
+export { ExtensionData } from "./ComponentContext";
+export * from "./ConfigurableLink";
+export * from "./createUseStore";
+export * from "./Extension";
+export * from "./ExtensionSlot";
+export * from "./getLifecycle";
+export * from "./useAssignedExtensions";
+export * from "./useAssignedExtensionIds";
+export * from "./useBodyScrollLock";
+export * from "./useConfig";
+export * from "./useConnectedExtensions";
+export * from "./useConnectivity";
+export * from "./usePatient";
+export * from "./useCurrentPatient";
+export * from "./useExtensionSlot";
+export * from "./useExtensionSlotMeta";
+export * from "./useExtensionStore";
+export * from "./useLayoutType";
+export * from "./useLocations";
+export * from "./useOnClickOutside";
+export * from "./UserHasAccess";
+export * from "./useSessionUser";
+export * from "./useStore";
+export * from "./useVisit";
+export * from "./useVisitTypes";
+export * from "./usePagination";

package/src/useAssignedExtensionIds.ts

@@ -1,3 +1,4 @@
+/** @module @category Extension */
 import { useEffect, useState } from "react";
 import { getExtensionStore } from "@openmrs/esm-extensions";
 import { isEqual } from "lodash";

package/src/useAssignedExtensions.ts

@@ -1,3 +1,4 @@
+/** @module @category Extension */
 import { useEffect, useState } from "react";
 import {
   AssignedExtension,

package/src/useBodyScrollLock.ts

@@ -1,3 +1,4 @@
+/** @module @category UI */
 import { useEffect } from "react";
 
 export function useBodyScrollLock(active: boolean) {

package/src/useConfig.ts

@@ -1,3 +1,4 @@
+/** @module @category Config */
 import { useContext, useEffect, useMemo, useState } from "react";
 import {
   getConfigStore,

package/src/useConnectedExtensions.ts

@@ -1,3 +1,4 @@
+/** @module @category Extension */
 import { useMemo } from "react";
 import {
   ConnectedExtension,

package/src/useConnectivity.ts

@@ -1,3 +1,4 @@
+/** @module @category Offline */
 import { subscribeConnectivityChanged } from "@openmrs/esm-globals";
 import { useEffect, useState } from "react";
 

package/src/useCurrentPatient.ts

@@ -1,3 +1,4 @@
+/** @module @category API */
 import { useEffect, useReducer } from "react";
 import { fetchCurrentPatient, PatientUuid } from "@openmrs/esm-api";
 

package/src/useExtensionSlotMeta.ts

@@ -1,3 +1,4 @@
+/** @module @category Extension */
 import { ExtensionMeta } from "@openmrs/esm-extensions";
 import { useMemo } from "react";
 import { useConnectedExtensions } from "./useConnectedExtensions";

package/src/useExtensionStore.ts

@@ -1,3 +1,4 @@
+/** @module @category Extension */
 import { ExtensionStore, getExtensionStore } from "@openmrs/esm-extensions";
 import { createUseStore } from "./createUseStore";
 

package/src/useLayoutType.ts

@@ -1,3 +1,4 @@
+/** @module @category UI */
 import { useEffect, useState } from "react";
 
 export type LayoutType = "tablet" | "phone" | "desktop";

package/src/useLocations.tsx

@@ -1,3 +1,4 @@
+/** @module @category API */
 import { getLocations, Location } from "@openmrs/esm-api";
 import { useState, useEffect } from "react";
 

package/src/useOnClickOutside.test.tsx

@@ -0,0 +1,59 @@
+import React from "react";
+import { render, fireEvent } from "@testing-library/react";
+import { useOnClickOutside } from "./useOnClickOutside";
+
+describe("useOnClickOutside", () => {
+  const handler: (e: Event) => void = jest.fn();
+  afterEach(() => (handler as jest.Mock).mockClear());
+
+  it("should call the handler when clicking outside", () => {
+    // setup
+    const Component: React.FC = ({ children }) => {
+      const ref = useOnClickOutside<HTMLDivElement>(handler);
+      return <div ref={ref}>{children}</div>;
+    };
+    const ref = render(<Component />);
+
+    // act
+    fireEvent.click(ref.container);
+
+    // verify
+    expect(handler).toHaveBeenCalledTimes(1);
+  });
+
+  it("should not call the handler when clicking on the element", () => {
+    // setup
+    const Component: React.FC = ({ children }) => {
+      const ref = useOnClickOutside<HTMLDivElement>(handler);
+      return <div ref={ref}>{children}</div>;
+    };
+    const mutableRef: { current: HTMLDivElement } = { current: undefined };
+    render(
+      <Component>
+        <div ref={mutableRef}></div>
+      </Component>
+    );
+
+    // act
+    fireEvent.click(mutableRef.current);
+
+    // verify
+    expect(handler).not.toHaveBeenCalled();
+  });
+
+  it("should unregister the event listener when unmounted", () => {
+    // setup
+    const Component: React.FC = ({ children }) => {
+      const ref = useOnClickOutside<HTMLDivElement>(handler);
+      return <div ref={ref}>{children}</div>;
+    };
+    const ref = render(<Component />);
+    const spy = jest.spyOn(window, "removeEventListener");
+
+    // act
+    ref.unmount();
+
+    // verify
+    expect(spy).toHaveBeenCalledWith("click", expect.any(Function));
+  });
+});

package/src/useOnClickOutside.tsx

@@ -1,3 +1,4 @@
+/** @module @category UI */
 import { useRef, useEffect } from "react";
 
 export function useOnClickOutside<T extends HTMLElement = HTMLElement>(
@@ -10,7 +11,7 @@ export function useOnClickOutside<T extends HTMLElement = HTMLElement>(
     if (active) {
       const listener = (event: Event) => {
         if (ref?.current?.contains(event.target as Node)) {
-            return;
+          return;
         }
 
         handler(event);

package/src/usePagination.ts

@@ -1,3 +1,4 @@
+/** @module @category UI */
 import { useMemo, useState } from "react";
 
 const defaultResultsPerPage = 10;

package/src/usePatient.ts

@@ -1,7 +1,8 @@
+/** @module @category API */
 import { useEffect, useReducer } from "react";
 import { fetchCurrentPatient, PatientUuid } from "@openmrs/esm-api";
 
-type NullablePatient = fhir.Patient | null;
+export type NullablePatient = fhir.Patient | null;
 
 interface CurrentPatientState {
   patientUuid: string | null;

package/src/useSessionUser.tsx

@@ -1,3 +1,4 @@
+/** @module @category API */
 import { openmrsObservableFetch, SessionUser } from "@openmrs/esm-api";
 import { useState, useEffect } from "react";
 

package/src/useStore.ts

@@ -1,3 +1,4 @@
+/** @module @category Store */
 import { subscribeTo } from "@openmrs/esm-state";
 import { useEffect, useMemo, useState } from "react";
 import { Store } from "unistore";

package/src/useVisit.ts

@@ -1,3 +1,4 @@
+/** @module @category API */
 import {
   defaultVisitCustomRepresentation,
   openmrsFetch,

package/src/useVisitTypes.ts

@@ -1,3 +1,4 @@
+/** @module @category API */
 import { getVisitTypes, VisitType } from "@openmrs/esm-api";
 import { useEffect, useState } from "react";