@databiosphere/findable-ui 23.0.0 → 25.0.0

package/lib/hooks/useAuthentication/useFetchTerraNIHProfile.js

@@ -0,0 +1,62 @@
+import { useCallback, useEffect, useState } from "react";
+import { useAuthenticationConfig } from "../useAuthenticationConfig";
+import { LOGIN_STATUS_FAILED } from "./common/constants";
+import { REQUEST_STATUS, } from "./common/entities";
+import { getAuthenticationRequestOptions, initLoginStatus, } from "./common/utils";
+/**
+ * Returns Terra NIH login status from configured endpoint.
+ * @param token - Token.
+ * @returns Terra NIH login status.
+ */
+export const useFetchTerraNIHProfile = (token) => {
+    const authenticationConfig = useAuthenticationConfig();
+    const { terraAuthConfig: { terraNIHProfileEndpoint: endpoint } = {} } = authenticationConfig;
+    const [loginStatus, setLoginStatus] = useState(initLoginStatus(endpoint));
+    // Fetch Terra NIH account profile.
+    const fetchEndpointData = useCallback((endpoint, accessToken) => {
+        fetch(endpoint, getAuthenticationRequestOptions(accessToken))
+            .then((response) => response.json())
+            .then((response) => {
+            if (isResponseError(response)) {
+                setLoginStatus(LOGIN_STATUS_FAILED);
+            }
+            else {
+                setLoginStatus((prevStatus) => ({
+                    ...prevStatus,
+                    isSuccess: isResponseSuccess(response),
+                    requestStatus: REQUEST_STATUS.COMPLETED,
+                    response,
+                }));
+            }
+        })
+            .catch((err) => {
+            console.log(err); // TODO handle error.
+            setLoginStatus(LOGIN_STATUS_FAILED);
+        });
+    }, []);
+    // Fetches Terra NIH account profile.
+    useEffect(() => {
+        if (!token)
+            return;
+        if (!endpoint)
+            return;
+        fetchEndpointData(endpoint, token);
+    }, [endpoint, fetchEndpointData, token]);
+    return loginStatus;
+};
+/**
+ * Returns true if response is an error response.
+ * @param response - Response.
+ * @returns true if response is an error response.
+ */
+function isResponseError(response) {
+    return Boolean(response.statusCode);
+}
+/**
+ * Returns true if the user accepted terms of service version is current.
+ * @param response - Response.
+ * @returns true if response is successful.
+ */
+function isResponseSuccess(response) {
+    return Boolean(response.linkedNihUsername);
+}

package/lib/hooks/useAuthentication/useFetchTerraProfile.d.ts

@@ -0,0 +1,24 @@
+import { LoginStatus } from "./common/entities";
+type Status = LoginStatus<TerraResponse>;
+export interface TerraResponse {
+    enabled: TerraResponseEnabled;
+    userInfo: TerraResponseUserInfo;
+}
+interface TerraResponseEnabled {
+    adminEnabled: boolean;
+    allUsersGroup: boolean;
+    google: boolean;
+    ldap: boolean;
+    tosAccepted: boolean;
+}
+interface TerraResponseUserInfo {
+    userEmail: string;
+    userSubjectId: string;
+}
+/**
+ * Returns Terra profile login status from configured endpoint.
+ * @param token - Token.
+ * @returns Terra profile login status.
+ */
+export declare const useFetchTerraProfile: (token?: string) => Status;
+export {};

package/lib/hooks/useAuthentication/useFetchTerraProfile.js

@@ -0,0 +1,62 @@
+import { useCallback, useEffect, useState } from "react";
+import { useAuthenticationConfig } from "../useAuthenticationConfig";
+import { LOGIN_STATUS_FAILED } from "./common/constants";
+import { REQUEST_STATUS, } from "./common/entities";
+import { getAuthenticationRequestOptions, initLoginStatus, } from "./common/utils";
+/**
+ * Returns Terra profile login status from configured endpoint.
+ * @param token - Token.
+ * @returns Terra profile login status.
+ */
+export const useFetchTerraProfile = (token) => {
+    const authenticationConfig = useAuthenticationConfig();
+    const { terraAuthConfig: { terraProfileEndpoint: endpoint } = {} } = authenticationConfig;
+    const [loginStatus, setLoginStatus] = useState(initLoginStatus(endpoint));
+    // Fetch Terra profile.
+    const fetchEndpointData = useCallback((endpoint, accessToken) => {
+        fetch(endpoint, getAuthenticationRequestOptions(accessToken))
+            .then((response) => response.json())
+            .then((response) => {
+            if (isResponseError(response)) {
+                setLoginStatus(LOGIN_STATUS_FAILED);
+            }
+            else {
+                setLoginStatus((prevStatus) => ({
+                    ...prevStatus,
+                    isSuccess: isResponseSuccess(response),
+                    requestStatus: REQUEST_STATUS.COMPLETED,
+                    response: response,
+                }));
+            }
+        })
+            .catch((err) => {
+            console.log(err); // TODO handle error.
+            setLoginStatus(LOGIN_STATUS_FAILED);
+        });
+    }, []);
+    // Fetches Terra profile.
+    useEffect(() => {
+        if (!token)
+            return;
+        if (!endpoint)
+            return;
+        fetchEndpointData(endpoint, token);
+    }, [endpoint, fetchEndpointData, token]);
+    return loginStatus;
+};
+/**
+ * Returns true if response is an error response.
+ * @param response - Response.
+ * @returns true if response is an error response.
+ */
+function isResponseError(response) {
+    return Boolean(response.statusCode);
+}
+/**
+ * Returns true if response is enabled.
+ * @param response - Response.
+ * @returns true if response is successful.
+ */
+function isResponseSuccess(response) {
+    return Boolean(response.enabled?.google);
+}

package/lib/hooks/useAuthentication/useFetchTerraTermsOfService.d.ts

@@ -0,0 +1,15 @@
+import { LoginStatus } from "./common/entities";
+type Status = LoginStatus<TerraTermsOfServiceResponse>;
+export interface TerraTermsOfServiceResponse {
+    currentVersion: string;
+    isEnabled: boolean;
+    isGracePeriodEnabled: boolean;
+    userAcceptedVersion?: string;
+}
+/**
+ * Returns Terra terms of service login status from configured endpoint.
+ * @param token - Token.
+ * @returns Terra terms of service login status.
+ */
+export declare const useFetchTerraTermsOfService: (token?: string) => Status;
+export {};

package/lib/hooks/useAuthentication/useFetchTerraTermsOfService.js

@@ -0,0 +1,62 @@
+import { useCallback, useEffect, useState } from "react";
+import { useAuthenticationConfig } from "../useAuthenticationConfig";
+import { LOGIN_STATUS_FAILED } from "./common/constants";
+import { REQUEST_STATUS, } from "./common/entities";
+import { getAuthenticationRequestOptions, initLoginStatus, } from "./common/utils";
+/**
+ * Returns Terra terms of service login status from configured endpoint.
+ * @param token - Token.
+ * @returns Terra terms of service login status.
+ */
+export const useFetchTerraTermsOfService = (token) => {
+    const authenticationConfig = useAuthenticationConfig();
+    const { terraAuthConfig: { termsOfServiceEndpoint: endpoint } = {} } = authenticationConfig;
+    const [loginStatus, setLoginStatus] = useState(initLoginStatus(endpoint));
+    // Fetch Terra terms of service.
+    const fetchEndpointData = useCallback((endpoint, accessToken) => {
+        fetch(endpoint, getAuthenticationRequestOptions(accessToken))
+            .then((response) => response.json())
+            .then((response) => {
+            if (isResponseError(response)) {
+                setLoginStatus(LOGIN_STATUS_FAILED);
+            }
+            else {
+                setLoginStatus((prevStatus) => ({
+                    ...prevStatus,
+                    isSuccess: isResponseSuccess(response),
+                    requestStatus: REQUEST_STATUS.COMPLETED,
+                    response,
+                }));
+            }
+        })
+            .catch((err) => {
+            console.log(err); // TODO handle error.
+            setLoginStatus(LOGIN_STATUS_FAILED);
+        });
+    }, []);
+    // Fetches Terra terms of service.
+    useEffect(() => {
+        if (!token)
+            return;
+        if (!endpoint)
+            return;
+        fetchEndpointData(endpoint, token);
+    }, [endpoint, fetchEndpointData, token]);
+    return loginStatus;
+};
+/**
+ * Returns true if response is an error response.
+ * @param response - Response.
+ * @returns true if response is an error response.
+ */
+function isResponseError(response) {
+    return Boolean(response.statusCode);
+}
+/**
+ * Returns true if the user accepted terms of service version is current.
+ * @param response - Response.
+ * @returns true if response is successful.
+ */
+function isResponseSuccess(response) {
+    return Boolean(response.currentVersion === response.userAcceptedVersion);
+}

package/lib/hooks/useAuthentication/useTokenClient.d.ts

@@ -0,0 +1,11 @@
+type TokenClient = any;
+export interface UseTokenClient {
+    token: string | undefined;
+    tokenClient: TokenClient | undefined;
+}
+/**
+ * Initializes the token client, sets token from token client callback.
+ * @returns initialized token client.
+ */
+export declare const useTokenClient: () => UseTokenClient;
+export {};

package/lib/hooks/useAuthentication/useTokenClient.js

@@ -0,0 +1,29 @@
+import { useEffect, useState } from "react";
+import { useAuthenticationConfig } from "../useAuthenticationConfig";
+/**
+ * Initializes the token client, sets token from token client callback.
+ * @returns initialized token client.
+ */
+export const useTokenClient = () => {
+    const [token, setToken] = useState();
+    const [tokenClient, setTokenClient] = useState();
+    const authenticationConfig = useAuthenticationConfig();
+    const { googleGISAuthConfig: { clientId, scope } = {} } = authenticationConfig;
+    // Initializes token client - (authorization client id must be configured).
+    useEffect(() => {
+        if (clientId) {
+            setTokenClient(google.accounts.oauth2.initTokenClient({
+                callback: (tokenResponse) => {
+                    const access_token = tokenResponse.access_token;
+                    setToken(access_token);
+                },
+                client_id: clientId,
+                scope,
+            }));
+        }
+    }, [clientId, scope]);
+    return {
+        token,
+        tokenClient,
+    };
+};

package/lib/hooks/useAuthenticationConfig.d.ts

@@ -0,0 +1,6 @@
+import { AuthenticationConfig } from "../config/entities";
+/**
+ * Hook to get the authentication config
+ * @returns @see AuthenticationConfig used in the current config.
+ */
+export declare const useAuthenticationConfig: () => AuthenticationConfig;

package/lib/hooks/useAuthenticationConfig.js

@@ -0,0 +1,14 @@
+import { useConfig } from "./useConfig";
+/**
+ * Hook to get the authentication config
+ * @returns @see AuthenticationConfig used in the current config.
+ */
+export const useAuthenticationConfig = () => {
+    const { config } = useConfig();
+    if (!config.authentication) {
+        return {
+            title: "",
+        };
+    }
+    return config.authentication;
+};

package/lib/hooks/useCategoryConfigs.d.ts

@@ -0,0 +1,6 @@
+import { CategoryConfig } from "../config/entities";
+/**
+ * Returns configured grouped configured categories as a list of configured categories.
+ * @returns a list of configured categories.
+ */
+export declare const useCategoryConfigs: () => CategoryConfig[] | undefined;

package/lib/hooks/useCategoryConfigs.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCategoryConfigs = void 0;
+const react_1 = require("react");
+const useConfig_1 = require("./useConfig");
+/**
+ * Returns configured grouped configured categories as a list of configured categories.
+ * @returns a list of configured categories.
+ */
+const useCategoryConfigs = () => {
+    const { config } = (0, useConfig_1.useConfig)();
+    const { categoryGroupConfigs } = config;
+    return (0, react_1.useMemo)(() => {
+        return categoryGroupConfigs === null || categoryGroupConfigs === void 0 ? void 0 : categoryGroupConfigs.flatMap(({ categoryConfigs }) => categoryConfigs);
+    }, [categoryGroupConfigs]);
+};
+exports.useCategoryConfigs = useCategoryConfigs;

package/lib/hooks/useCategoryFilter.js

@@ -28,6 +28,7 @@ function buildCategoryView(category, categoryValueViews, categoryConfigs) {
     const mapSelectCategoryValue = categoryConfig?.mapSelectCategoryValue || getSelectCategoryValue;
     return {
         annotation: categoryConfig?.annotation,
+        enableChartView: categoryConfig?.enableChartView,
         isDisabled: false,
         key: category.key,
         label: getCategoryLabel(category.key, categoryConfig),

package/lib/hooks/useEntityListRelatedView.d.ts

@@ -0,0 +1,15 @@
+import { SelectedFilterValue } from "../common/entities";
+import { RelatedSearchResult } from "../config/entities";
+import { ListItems, RelatedListItems } from "../providers/exploreState";
+/**
+ * Returns related entity lists filtered by related search results.
+ * @param listItems - Entity list items.
+ * @param relatedSearchResult - Related search result.
+ * @param excludedValues - Selected category values to be excluded from related entity lists.
+ * @returns related entities.
+ */
+export declare function buildRelatedEntityList(listItems: ListItems, relatedSearchResult: RelatedSearchResult | undefined, excludedValues: SelectedFilterValue | undefined): RelatedListItems;
+/**
+ * Updates related entity list.
+ */
+export declare const useEntityListRelatedView: () => void;

package/lib/hooks/useEntityListRelatedView.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useEntityListRelatedView = exports.buildRelatedEntityList = void 0;
+const react_1 = require("react");
+const exploreState_1 = require("../providers/exploreState");
+const useAsync_1 = require("./useAsync");
+const useConfig_1 = require("./useConfig");
+const useExploreState_1 = require("./useExploreState");
+/**
+ * Returns related entity lists filtered by related search results.
+ * @param listItems - Entity list items.
+ * @param relatedSearchResult - Related search result.
+ * @param excludedValues - Selected category values to be excluded from related entity lists.
+ * @returns related entities.
+ */
+function buildRelatedEntityList(listItems, relatedSearchResult, excludedValues) {
+    if (relatedSearchResult) {
+        const { resultKey, searchKey, values } = relatedSearchResult;
+        return listItems === null || listItems === void 0 ? void 0 : listItems.filter((listItem) => {
+            if (values.includes(listItem[resultKey].toLowerCase())) {
+                return !(excludedValues === null || excludedValues === void 0 ? void 0 : excludedValues.includes(listItem[searchKey])); // Exclude any row where any of the selected category values matches the corresponding row value.
+            }
+        });
+    }
+}
+exports.buildRelatedEntityList = buildRelatedEntityList;
+/**
+ * Updates related entity list.
+ */
+const useEntityListRelatedView = () => {
+    var _a;
+    const { entityConfig } = (0, useConfig_1.useConfig)();
+    const { exploreDispatch, exploreState } = (0, useExploreState_1.useExploreState)();
+    const { filterState, listItems } = exploreState;
+    const { listView } = entityConfig;
+    const relatedView = listView === null || listView === void 0 ? void 0 : listView.relatedView;
+    const { relatedSearchFn, resultKey, searchKey } = relatedView || {};
+    const { data: relatedSearchResult, run } = (0, useAsync_1.useAsync)();
+    const selectedCategoryValues = (_a = filterState.find(({ categoryKey }) => categoryKey === searchKey)) === null || _a === void 0 ? void 0 : _a.value;
+    (0, react_1.useEffect)(() => {
+        if (relatedSearchFn) {
+            run(relatedSearchFn(searchKey, resultKey, selectedCategoryValues));
+        }
+    }, [relatedSearchFn, resultKey, run, searchKey, selectedCategoryValues]);
+    (0, react_1.useEffect)(() => {
+        if (relatedSearchFn) {
+            exploreDispatch({
+                payload: {
+                    relatedListItems: buildRelatedEntityList(listItems, relatedSearchResult, selectedCategoryValues),
+                },
+                type: exploreState_1.ExploreActionKind.ProcessRelatedResponse,
+            });
+        }
+    }, [
+        exploreDispatch,
+        listItems,
+        relatedSearchFn,
+        relatedSearchResult,
+        selectedCategoryValues,
+    ]);
+};
+exports.useEntityListRelatedView = useEntityListRelatedView;

package/lib/hooks/useFileManifest/common/buildFileManifestRequestURL.d.ts

@@ -0,0 +1,15 @@
+import { ManifestDownloadFormat } from "../../../apis/azul/common/entities";
+import { Filters } from "../../../common/entities";
+export interface FileManifestRequestURL {
+    requestParams: URLSearchParams;
+    requestURL: string;
+}
+/**
+ * Build up file manifest request params and URL query string for the given search results, catalog and format.
+ * @param url - Data URL.
+ * @param filters - Selected filters.
+ * @param catalog - Configured catalog.
+ * @param manifestFormat - Manifest format.
+ * @returns file manifest request params and URL query string.
+ */
+export declare const buildFileManifestRequestURL: (url: string, filters: Filters, catalog: string, manifestFormat: ManifestDownloadFormat | undefined) => FileManifestRequestURL | undefined;

package/lib/hooks/useFileManifest/common/buildFileManifestRequestURL.js

@@ -0,0 +1,27 @@
+import { AZUL_PARAM, } from "../../../apis/azul/common/entities";
+import { transformFilters } from "../../../apis/azul/common/filterTransformer";
+/**
+ * Build up file manifest request params and URL query string for the given search results, catalog and format.
+ * @param url - Data URL.
+ * @param filters - Selected filters.
+ * @param catalog - Configured catalog.
+ * @param manifestFormat - Manifest format.
+ * @returns file manifest request params and URL query string.
+ */
+export const buildFileManifestRequestURL = (url, filters, catalog, manifestFormat) => {
+    if (!manifestFormat) {
+        return;
+    }
+    // Build request params.
+    const requestParams = new URLSearchParams({
+        [AZUL_PARAM.CATALOG]: catalog,
+        [AZUL_PARAM.FILTERS]: transformFilters(filters),
+        format: manifestFormat,
+    });
+    // Build file manifest URL
+    const requestURL = `${url}fetch/manifest/files?${requestParams.toString()}`;
+    return {
+        requestParams,
+        requestURL,
+    };
+};

package/lib/hooks/useFileManifest/useFileManifestURL.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Returns data URL for the integrations end point.
+ * @returns data URL for the integrations end point.
+ */
+export declare const useFileManifestURL: () => string;

package/lib/hooks/useFileManifest/useFileManifestURL.js

@@ -0,0 +1,11 @@
+import { useConfig } from "../useConfig";
+/**
+ * Returns data URL for the integrations end point.
+ * @returns data URL for the integrations end point.
+ */
+export const useFileManifestURL = () => {
+    const { config } = useConfig();
+    const { dataSource } = config;
+    const { url } = dataSource;
+    return url;
+};

package/lib/hooks/useFileManifest/useRequestFileManifest.d.ts

@@ -0,0 +1,9 @@
+import { ManifestDownloadFormat } from "../../apis/azul/common/entities";
+import { Filters } from "../../common/entities";
+/**
+ * Initializes and fetches file manifest comprising file facets and summary for the given file manifest format.
+ * @param fileManifestFormat - File manifest format.
+ * @param initialFilters - Filters to initialize file manifest request.
+ * @param fileSummaryFacetName - File summary facet name.
+ */
+export declare const useRequestFileManifest: (fileManifestFormat: ManifestDownloadFormat | undefined, initialFilters?: Filters | undefined, fileSummaryFacetName?: string) => void;

package/lib/hooks/useFileManifest/useRequestFileManifest.js

@@ -0,0 +1,37 @@
+import { useEffect, useState } from "react";
+import { FileManifestActionKind } from "../../providers/fileManifestState";
+import { useFileManifestState } from "../useFileManifestState";
+/**
+ * Initializes and fetches file manifest comprising file facets and summary for the given file manifest format.
+ * @param fileManifestFormat - File manifest format.
+ * @param initialFilters - Filters to initialize file manifest request.
+ * @param fileSummaryFacetName - File summary facet name.
+ */
+export const useRequestFileManifest = (fileManifestFormat, initialFilters = [], fileSummaryFacetName) => {
+    // Initial file manifest filter.
+    const [initFilters] = useState(() => initialFilters);
+    // File manifest state.
+    const { fileManifestDispatch } = useFileManifestState();
+    // Fetches file manifest with the given file manifest filters, format.
+    useEffect(() => {
+        fileManifestDispatch({
+            payload: {
+                fileManifestFormat,
+                fileSummaryFacetName,
+                filters: initFilters,
+            },
+            type: FileManifestActionKind.FetchFileManifest,
+        });
+        return () => {
+            fileManifestDispatch({
+                payload: undefined,
+                type: FileManifestActionKind.ClearFileManifest,
+            });
+        };
+    }, [
+        fileManifestDispatch,
+        fileManifestFormat,
+        fileSummaryFacetName,
+        initFilters,
+    ]);
+};

package/lib/hooks/useLayoutState.d.ts

@@ -0,0 +1,6 @@
+import { LayoutStateContextProps } from "../providers/layoutState";
+/**
+ * Returns layout state context.
+ * @returns layout state context.
+ */
+export declare const useLayoutState: () => LayoutStateContextProps;

package/lib/hooks/useLayoutState.js

@@ -0,0 +1,9 @@
+import { useContext } from "react";
+import { LayoutStateContext, } from "../providers/layoutState";
+/**
+ * Returns layout state context.
+ * @returns layout state context.
+ */
+export const useLayoutState = () => {
+    return useContext(LayoutStateContext);
+};

package/lib/hooks/useMenu.d.ts

@@ -0,0 +1,10 @@
+export interface UseMenu {
+    onClose: () => void;
+    onOpen: () => void;
+    open: boolean;
+}
+/**
+ * Menu functionality for menu dropdown.
+ * @returns menu functionality.
+ */
+export declare const useMenu: () => UseMenu;

package/lib/hooks/useMenu.js

@@ -0,0 +1,17 @@
+import { useCallback, useState } from "react";
+/**
+ * Menu functionality for menu dropdown.
+ * @returns menu functionality.
+ */
+export const useMenu = () => {
+    const [open, setOpen] = useState(false);
+    // Closes header menu.
+    const onClose = useCallback(() => {
+        setOpen(false);
+    }, []);
+    // Opens header menu.
+    const onOpen = useCallback(() => {
+        setOpen(true);
+    }, []);
+    return { onClose, onOpen, open };
+};

package/lib/hooks/useMenuWithPosition.d.ts

@@ -0,0 +1,14 @@
+import { MenuProps as MMenuProps } from "@mui/material";
+import { MouseEvent } from "react";
+export interface UseMenuWithPosition {
+    anchorEl: MMenuProps["anchorEl"];
+    onClose: () => void;
+    onOpen: (event: MouseEvent<HTMLElement>) => void;
+    onToggleOpen: (event: MouseEvent<HTMLElement>) => void;
+    open: boolean;
+}
+/**
+ * Menu functionality for menu dropdown, with menu position.
+ * @returns menu functionality.
+ */
+export declare const useMenuWithPosition: () => UseMenuWithPosition;

package/lib/hooks/useMenuWithPosition.js

@@ -0,0 +1,33 @@
+import { useCallback, useMemo, useState } from "react";
+/**
+ * Menu functionality for menu dropdown, with menu position.
+ * @returns menu functionality.
+ */
+export const useMenuWithPosition = () => {
+    const [anchorEl, setAnchorEl] = useState(null);
+    const open = useMemo(() => Boolean(anchorEl), [anchorEl]);
+    // Closes header menu.
+    const onClose = useCallback(() => {
+        setAnchorEl(null);
+    }, []);
+    // Opens header menu.
+    const onOpen = useCallback((event) => {
+        setAnchorEl(event.currentTarget);
+    }, []);
+    // Toggles menu open/close.
+    const onToggleOpen = useCallback((event) => {
+        if (open) {
+            setAnchorEl(null);
+        }
+        else {
+            setAnchorEl(event.currentTarget);
+        }
+    }, [open]);
+    return {
+        anchorEl,
+        onClose,
+        onOpen,
+        onToggleOpen,
+        open,
+    };
+};

package/lib/hooks/useResizeObserver.d.ts

@@ -13,9 +13,10 @@ export type ElementRect = {
  * Element resizing and repositioning observer.
  * @param ref - element to be observed for changes to its size or position.
  * @param onResizeFn - action to be performed when the observed element is resized or repositioned.
+ * @param shouldObserve - boolean flag to determine if the observer should be active.
  * @returns Element size and position properties for the given element.
  */
-export declare function useResizeObserver(ref: RefObject<HTMLElement>, onResizeFn: (entries: ResizeObserverEntry[]) => Partial<ElementRect>): Partial<ElementRect> | undefined;
+export declare function useResizeObserver(ref: RefObject<HTMLElement>, onResizeFn: (entries: ResizeObserverEntry[]) => Partial<ElementRect>, shouldObserve?: boolean): Partial<ElementRect> | undefined;
 /**
  * Return's the observed element's border box size.
  * @param entries - Resize observer entries.