Rename NavigatorRoot to NavigatorProvider

docs/manifest.json

@@ -1068,9 +1068,9 @@
 		"parent": "components"
 	},
 	{
-		"title": "NavigatorRoot",
-		"slug": "navigator-root",
-		"markdown_source": "../packages/components/src/navigator/navigator-root/README.md",
+		"title": "NavigatorProvider",
+		"slug": "navigator-provider",
+		"markdown_source": "../packages/components/src/navigator/navigator-provider/README.md",
 		"parent": "components"
 	},
 	{

packages/components/src/index.js

@@ -97,7 +97,7 @@ export { default as __experimentalNavigationGroup } from './navigation/group';
 export { default as __experimentalNavigationItem } from './navigation/item';
 export { default as __experimentalNavigationMenu } from './navigation/menu';
 export {
-	NavigatorRoot as __experimentalNavigatorRoot,
+	NavigatorProvider as __experimentalNavigatorProvider,
 	NavigatorScreen as __experimentalNavigatorScreen,
 	useNavigator as __experimentalUseNavigator,
 } from './navigator';

packages/components/src/navigator/index.js

@@ -1,3 +1,3 @@
-export { default as NavigatorRoot } from './navigator-root';
+export { default as NavigatorProvider } from './navigator-provider';
 export { default as NavigatorScreen } from './navigator-screen';
 export { default as useNavigator } from './use-navigator';

packages/components/src/navigator/navigator-root/README.md → packages/components/src/navigator/navigator-provider/README.md

@@ -1,18 +1,18 @@
-# `NavigatorRoot`
+# `NavigatorProvider`
 
 <div class="callout callout-alert">
 This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
 </div>
 
-The `NavigatorRoot` component allows rendering nested panels or menus (via the [`NavigatorScreen` component](/packages/components/src/navigator/navigator-screen/README.md)) and navigate between these different states (via the `useNavigator` hook). The Global Styles sidebar is an example of this.
+The `NavigatorProvider` component allows rendering nested panels or menus (via the [`NavigatorScreen` component](/packages/components/src/navigator/navigator-screen/README.md)) and navigate between these different states (via the `useNavigator` hook). The Global Styles sidebar is an example of this.
 
 The `Navigator*` family of components is _not_ opinionated in terms of UI, and can be composed with any UI components to navigate between the nested screens.
 
 ## Usage
 
 ```jsx
 import {
-	__experimentalNavigatorRoot as NavigatorRoot,
+	__experimentalNavigatorProvider as NavigatorProvider,
 	__experimentalNavigatorScreen as NavigatorScreen,
 	__experimentalUseNavigator as useNavigator,
 } from '@wordpress/components';
@@ -32,7 +32,7 @@ function NavigatorButton( {
 }
 
 const MyNavigation = () => (
-	<NavigatorRoot initialPath="/">
+	<NavigatorProvider initialPath="/">
 		<NavigatorScreen path="/">
 			<p>This is the home screen.</p>
 			<NavigatorButton isPrimary path="/child">
@@ -46,7 +46,7 @@ const MyNavigation = () => (
 				Go back
 			</NavigatorButton>
 		</NavigatorScreen>
-	</NavigatorRoot>
+	</NavigatorProvider>
 );
 ```
 

packages/components/src/navigator/navigator-root/component.js → packages/components/src/navigator/navigator-provider/component.js

@@ -8,7 +8,7 @@ import { useState } from '@wordpress/element';
  */
 import { NavigatorContext } from '../context';
 
-function NavigatorRoot( { initialPath, children } ) {
+function NavigatorProvider( { initialPath, children } ) {
 	const [ path, setPath ] = useState( { path: initialPath } );
 
 	return (
@@ -18,4 +18,4 @@ function NavigatorRoot( { initialPath, children } ) {
 	);
 }
 
-export default NavigatorRoot;
+export default NavigatorProvider;

packages/components/src/navigator/navigator-screen/README.md

@@ -4,11 +4,11 @@
 This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.
 </div>
 
-The `NavigatorScreen` component represents a single view/screen/panel/menu and is supposed to be used in combination with [the `NavigatorRoot` component](/packages/components/src/navigator/navigator-root/README.md).
+The `NavigatorScreen` component represents a single view/screen/panel/menu and is supposed to be used in combination with [the `NavigatorProvider` component](/packages/components/src/navigator/navigator-provider/README.md).
 
 ## Usage
 
-Refer to [the `NavigatorRoot` component](/packages/components/src/navigator/navigator-root/README.md#usage) for a usage example.
+Refer to [the `NavigatorProvider` component](/packages/components/src/navigator/navigator-provider/README.md#usage) for a usage example.
 
 ## Props
 

packages/components/src/navigator/stories/index.js

@@ -2,11 +2,11 @@
  * Internal dependencies
  */
 import Button from '../../button';
-import { NavigatorRoot, NavigatorScreen, useNavigator } from '../';
+import { NavigatorProvider, NavigatorScreen, useNavigator } from '../';
 
 export default {
 	title: 'Components (Experimental)/Navigator',
-	component: NavigatorRoot,
+	component: NavigatorProvider,
 };
 
 function NavigatorButton( { path, isBack = false, ...props } ) {
@@ -20,7 +20,7 @@ function NavigatorButton( { path, isBack = false, ...props } ) {
 }
 
 const MyNavigation = () => (
-	<NavigatorRoot initialPath="/">
+	<NavigatorProvider initialPath="/">
 		<NavigatorScreen path="/">
 			<p>This is the home screen.</p>
 			<NavigatorButton isPrimary path="/child">
@@ -34,7 +34,7 @@ const MyNavigation = () => (
 				Go back
 			</NavigatorButton>
 		</NavigatorScreen>
-	</NavigatorRoot>
+	</NavigatorProvider>
 );
 
 export const _default = () => {

packages/components/src/navigator/test/index.js

@@ -6,7 +6,7 @@ import { render, screen, fireEvent } from '@testing-library/react';
 /**
  * Internal dependencies
  */
-import { NavigatorRoot, NavigatorScreen, useNavigator } from '../';
+import { NavigatorProvider, NavigatorScreen, useNavigator } from '../';
 
 jest.mock( 'framer-motion', () => {
 	const actual = jest.requireActual( 'framer-motion' );
@@ -47,7 +47,7 @@ const MyNavigation = ( {
 	initialPath = PATHS.HOME,
 	onNavigatorButtonClick,
 } ) => (
-	<NavigatorRoot initialPath={ initialPath }>
+	<NavigatorProvider initialPath={ initialPath }>
 		<NavigatorScreen path={ PATHS.HOME }>
 			<p>This is the home screen.</p>
 			<NavigatorButton
@@ -76,7 +76,7 @@ const MyNavigation = ( {
 		</NavigatorScreen>
 
 		{ /* A `NavigatorScreen` with `path={ PATHS.NOT_FOUND }` is purposefully not included */ }
-	</NavigatorRoot>
+	</NavigatorProvider>
 );
 
 const getNavigationScreenByText = ( text, { throwIfNotFound = true } = {} ) => {

packages/edit-site/src/components/sidebar/global-styles-sidebar.js

@@ -8,7 +8,7 @@ import { map } from 'lodash';
  */
 import {
 	Button,
-	__experimentalNavigatorRoot as NavigatorRoot,
+	__experimentalNavigatorProvider as NavigatorProvider,
 	__experimentalNavigatorScreen as NavigatorScreen,
 	__experimentalUseNavigator as useNavigator,
 	__experimentalItemGroup as ItemGroup,
@@ -257,7 +257,7 @@ export default function GlobalStylesSidebar() {
 				</>
 			}
 		>
-			<NavigatorRoot initialPath="/">
+			<NavigatorProvider initialPath="/">
 				<NavigatorScreen path="/">
 					<StylePreview />
 
@@ -324,7 +324,7 @@ export default function GlobalStylesSidebar() {
 						setSetting={ setSetting }
 					/>
 				) ) }
-			</NavigatorRoot>
+			</NavigatorProvider>
 		</DefaultSidebar>
 	);
 }