diff --git a/packages/react/src/hooks/useIonModal.ts b/packages/react/src/hooks/useIonModal.ts
index aee3ea40e40..6b267fc62d6 100644
--- a/packages/react/src/hooks/useIonModal.ts
+++ b/packages/react/src/hooks/useIonModal.ts
@@ -1,6 +1,7 @@
 import type { ModalOptions } from '@ionic/core/components';
 import { modalController } from '@ionic/core/components';
 import { defineCustomElement } from '@ionic/core/components/ion-modal.js';
+import type React from 'react';
 import { useCallback } from 'react';
 
 import type { ReactComponentOrElement } from '../models/ReactComponentOrElement';
@@ -8,14 +9,17 @@ import type { ReactComponentOrElement } from '../models/ReactComponentOrElement'
 import type { HookOverlayOptions } from './HookOverlayOptions';
 import { useOverlay } from './useOverlay';
 
-// TODO(FW-2959): types
-
 /**
  * A hook for presenting/dismissing an IonModal component
  * @param component The component that the modal will show. Can be a React Component, a functional component, or a JSX Element
  * @param componentProps The props that will be passed to the component, if required
  * @returns Returns the present and dismiss methods in an array
  */
+export function useIonModal<T extends object = Record<string, any>>(
+  component: React.ComponentClass<T> | React.FC<T>,
+  componentProps?: T
+): UseIonModalResult;
+export function useIonModal(component: JSX.Element, componentProps?: any): UseIonModalResult;
 export function useIonModal(component: ReactComponentOrElement, componentProps?: any): UseIonModalResult {
   const controller = useOverlay<ModalOptions, HTMLIonModalElement>(
     'IonModal',
diff --git a/packages/react/src/hooks/useIonPopover.ts b/packages/react/src/hooks/useIonPopover.ts
index c63df7b26e0..9bbf354a95e 100644
--- a/packages/react/src/hooks/useIonPopover.ts
+++ b/packages/react/src/hooks/useIonPopover.ts
@@ -1,6 +1,7 @@
 import type { PopoverOptions } from '@ionic/core/components';
 import { popoverController } from '@ionic/core/components';
 import { defineCustomElement } from '@ionic/core/components/ion-popover.js';
+import type React from 'react';
 import { useCallback } from 'react';
 
 import type { ReactComponentOrElement } from '../models/ReactComponentOrElement';
@@ -8,14 +9,17 @@ import type { ReactComponentOrElement } from '../models/ReactComponentOrElement'
 import type { HookOverlayOptions } from './HookOverlayOptions';
 import { useOverlay } from './useOverlay';
 
-// TODO(FW-2959): types
-
 /**
  * A hook for presenting/dismissing an IonPicker component
  * @param component The component that the popover will show. Can be a React Component, a functional component, or a JSX Element
  * @param componentProps The props that will be passed to the component, if required
  * @returns Returns the present and dismiss methods in an array
  */
+export function useIonPopover<T extends object = Record<string, any>>(
+  component: React.ComponentClass<T> | React.FC<T>,
+  componentProps?: T
+): UseIonPopoverResult;
+export function useIonPopover(component: JSX.Element, componentProps?: any): UseIonPopoverResult;
 export function useIonPopover(component: ReactComponentOrElement, componentProps?: any): UseIonPopoverResult {
   const controller = useOverlay<PopoverOptions, HTMLIonPopoverElement>(
     'IonPopover',