From b5a6f0bafa5933dd7a823c7223495eaae0e7e25c Mon Sep 17 00:00:00 2001
From: margolisj <1588194+margolisj@users.noreply.github.com>
Date: Tue, 5 Sep 2023 10:46:07 -0400
Subject: [PATCH] FocusableIframe: refactor to TypeScript (#53979)

* First pass on focusable-iframe

* Rm old file and fancy props type.

* Updates changelog

* Removes old JSDocs
---
 packages/components/CHANGELOG.md                      |  1 +
 .../src/focusable-iframe/{index.js => index.tsx}      | 11 +++++++----
 packages/components/src/focusable-iframe/types.ts     |  9 +++++++++
 3 files changed, 17 insertions(+), 4 deletions(-)
 rename packages/components/src/focusable-iframe/{index.js => index.tsx} (76%)
 create mode 100644 packages/components/src/focusable-iframe/types.ts

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
index 362e2d26a3d7be..75b1b8077f1fbb 100644
--- a/packages/components/CHANGELOG.md
+++ b/packages/components/CHANGELOG.md
@@ -19,6 +19,7 @@
 
 -   `Composite`: Convert to TypeScript ([#54028](https://github.com/WordPress/gutenberg/pull/54028)).
 -   `BorderControl`: Refactor unit tests to use `userEvent` ([#54155](https://github.com/WordPress/gutenberg/pull/54155))
+-   `FocusableIframe`: Convert to TypeScript ([#53979](https://github.com/WordPress/gutenberg/pull/53979)).
 
 ## 25.7.0 (2023-08-31)
 
diff --git a/packages/components/src/focusable-iframe/index.js b/packages/components/src/focusable-iframe/index.tsx
similarity index 76%
rename from packages/components/src/focusable-iframe/index.js
rename to packages/components/src/focusable-iframe/index.tsx
index 5c7e6b8edd799d..ba1fae45c2928a 100644
--- a/packages/components/src/focusable-iframe/index.js
+++ b/packages/components/src/focusable-iframe/index.tsx
@@ -3,12 +3,15 @@
  */
 import { useMergeRefs, useFocusableIframe } from '@wordpress/compose';
 import deprecated from '@wordpress/deprecated';
-
 /**
- * @param {Object}                                 props
- * @param {import('react').Ref<HTMLIFrameElement>} props.iframeRef
+ * Internal dependencies
  */
-export default function FocusableIframe( { iframeRef, ...props } ) {
+import type { FocusableIframeProps } from './types';
+
+export default function FocusableIframe( {
+	iframeRef,
+	...props
+}: FocusableIframeProps ) {
 	const ref = useMergeRefs( [ iframeRef, useFocusableIframe() ] );
 	deprecated( 'wp.components.FocusableIframe', {
 		since: '5.9',
diff --git a/packages/components/src/focusable-iframe/types.ts b/packages/components/src/focusable-iframe/types.ts
new file mode 100644
index 00000000000000..456408cb7c1702
--- /dev/null
+++ b/packages/components/src/focusable-iframe/types.ts
@@ -0,0 +1,9 @@
+/**
+ * External dependencies
+ */
+import type { ComponentPropsWithoutRef } from 'react';
+
+export interface FocusableIframeProps
+	extends ComponentPropsWithoutRef< 'iframe' > {
+	iframeRef: React.Ref< HTMLIFrameElement >;
+}