NavigatorButton: Reuse Button types (#47754)

* `NavigatorButton`: Reuse `Button` types * CHANGELOG * Tweak README
WordPress · Feb 9, 2023 · 4b9cadf · 4b9cadf
1 parent 2a92a88
commit 4b9cadf
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 14 deletions.
diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Internal
+
+-   `NavigatorButton`: Reuse `Button` types ([47754](https://github.com/WordPress/gutenberg/pull/47754)).
+
 ## 23.3.0 (2023-02-01)
 
 ### Deprecations

diff --git a/packages/components/src/button/types.ts b/packages/components/src/button/types.ts
@@ -11,8 +11,11 @@ import type { PopoverProps } from '../popover/types';
 import type { WordPressComponentProps } from '../ui/context/wordpress-component';
 
 export type ButtonProps =
-	| WordPressComponentProps< BaseButtonProps & _ButtonProps, 'button', false >
-	| WordPressComponentProps< BaseButtonProps & AnchorProps, 'a', false >;
+	| WordPressComponentProps< ButtonAsButtonProps, 'button', false >
+	| WordPressComponentProps< ButtonAsAnchorProps, 'a', false >;
+
+export type ButtonAsButtonProps = BaseButtonProps & _ButtonProps;
+export type ButtonAsAnchorProps = BaseButtonProps & AnchorProps;
 
 type BaseButtonProps = {
 	/**

diff --git a/packages/components/src/navigator/navigator-button/README.md b/packages/components/src/navigator/navigator-button/README.md
@@ -35,4 +35,4 @@ The path of the screen to navigate to. The value of this prop needs to be [a val
 
 ### Inherited props
 
-`NavigatorButton` also inherits all of the [`Button` props](/packages/components/src/button/README.md#props), except for `href`.
+`NavigatorButton` also inherits all of the [`Button` props](/packages/components/src/button/README.md#props), except for `href` and `target`.
diff --git a/packages/components/src/navigator/types.ts b/packages/components/src/navigator/types.ts
@@ -3,6 +3,11 @@
  */
 import type { ReactNode } from 'react';
 
+/**
+ * Internal dependencies
+ */
+import type { ButtonAsButtonProps } from '../button/types';
+
 type NavigateOptions = {
 	focusTargetSelector?: string;
 };
@@ -45,17 +50,7 @@ export type NavigatorScreenProps = {
 	children: ReactNode;
 };
 
-type ButtonProps = {
-	// TODO: should also extend `Button` prop types once the `Button` component
-	// is refactored to TypeScript.
-	variant?: 'primary' | 'secondary' | 'tertiary' | 'link';
-};
-export type NavigatorBackButtonProps = Omit< ButtonProps, 'href' > & {
-	/**
-	 * The children elements.
-	 */
-	children: ReactNode;
-};
+export type NavigatorBackButtonProps = ButtonAsButtonProps;
 
 export type NavigatorButtonProps = NavigatorBackButtonProps & {
 	/**
Original file line number	Diff line number	Diff line change
Expand Up		@@ -35,4 +35,4 @@ The path of the screen to navigate to. The value of this prop needs to be [a val

		### Inherited props

		`NavigatorButton` also inherits all of the [`Button` props](/packages/components/src/button/README.md#props), except for `href`.
		`NavigatorButton` also inherits all of the [`Button` props](/packages/components/src/button/README.md#props), except for `href` and `target`.