Export off canvas editor via experiments package

packages/block-editor/src/components/index.js

@@ -71,7 +71,6 @@ export { default as __experimentalLinkControlSearchResults } from './link-contro
 export { default as __experimentalLinkControlSearchItem } from './link-control/search-item';
 export { default as LineHeightControl } from './line-height-control';
 export { default as __experimentalListView } from './list-view';
-export { default as __experimentalOffCanvasEditor } from './off-canvas-editor';
 export { default as MediaReplaceFlow } from './media-replace-flow';
 export { default as MediaPlaceholder } from './media-placeholder';
 export { default as MediaUpload } from './media-upload';

packages/block-editor/src/experiments.js

@@ -8,6 +8,7 @@ import { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/exp
  */
 import * as globalStyles from './components/global-styles';
 import { ExperimentalBlockEditorProvider } from './components/provider';
+import { default as __experimentalOffCanvasEditor } from './components/off-canvas-editor';
 
 export const { lock, unlock } =
 	__dangerousOptInToUnstableAPIsOnlyForCoreModules(
@@ -22,4 +23,5 @@ export const experiments = {};
 lock( experiments, {
 	...globalStyles,
 	ExperimentalBlockEditorProvider,
+	__experimentalOffCanvasEditor,
 } );

packages/block-library/package.json

@@ -46,6 +46,7 @@
 		"@wordpress/dom": "file:../dom",
 		"@wordpress/element": "file:../element",
 		"@wordpress/escape-html": "file:../escape-html",
+		"@wordpress/experiments": "file:../experiments",
 		"@wordpress/hooks": "file:../hooks",
 		"@wordpress/html-entities": "file:../html-entities",
 		"@wordpress/i18n": "file:../i18n",

packages/block-library/src/experiments.js

@@ -0,0 +1,10 @@
+/**
+ * WordPress dependencies
+ */
+import { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/experiments';
+
+export const { lock, unlock } =
+	__dangerousOptInToUnstableAPIsOnlyForCoreModules(
+		'I know using unstable features means my plugin or theme will inevitably break on the next WordPress release.',
+		'@wordpress/block-library'
+	);

packages/block-library/src/navigation/edit/menu-inspector-controls.js

@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import {
-	__experimentalOffCanvasEditor as OffCanvasEditor,
+	experiments as blockEditorExperiments,
 	InspectorControls,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
@@ -21,6 +21,7 @@ import { __ } from '@wordpress/i18n';
 import ManageMenusButton from './manage-menus-button';
 import NavigationMenuSelector from './navigation-menu-selector';
 import { LeafMoreMenu } from '../leaf-more-menu';
+import { unlock } from '../../experiments';
 
 /* translators: %s: The name of a menu. */
 const actionLabel = __( "Switch to '%s'" );
@@ -31,6 +32,9 @@ const ExperimentMainContent = ( {
 	isLoading,
 	isNavigationMenuMissing,
 } ) => {
+	const { __experimentalOffCanvasEditor: OffCanvasEditor } = unlock(
+		blockEditorExperiments
+	);
 	// Provide a hierarchy of clientIds for the given Navigation block (clientId).
 	// This is required else the list view will display the entire block tree.
 	const clientIdsTree = useSelect(

packages/edit-site/src/components/navigation-inspector/navigation-menu.js

@@ -2,12 +2,17 @@
  * WordPress dependencies
  */
 import {
-	__experimentalOffCanvasEditor as OffCanvasEditor,
+	experiments as blockEditorExperiments,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
 import { useEffect } from '@wordpress/element';
 import { useDispatch } from '@wordpress/data';
 
+/**
+ * Internal dependencies
+ */
+import { unlock } from '../../experiments';
+
 const ALLOWED_BLOCKS = {
 	'core/navigation': [
 		'core/navigation-link',
@@ -34,6 +39,10 @@ const ALLOWED_BLOCKS = {
 export default function NavigationMenu( { innerBlocks } ) {
 	const { updateBlockListSettings } = useDispatch( blockEditorStore );
 
+	const { __experimentalOffCanvasEditor: OffCanvasEditor } = unlock(
+		blockEditorExperiments
+	);
+
 	//TODO: Block settings are normally updated as a side effect of rendering InnerBlocks in BlockList
 	//Think through a better way of doing this, possible with adding allowed blocks to block library metadata
 	useEffect( () => {

packages/experiments/src/implementation.js

@@ -18,7 +18,7 @@ const CORE_MODULES_USING_EXPERIMENTS = [
 	'@wordpress/edit-site',
 	'@wordpress/edit-post',
 	'@wordpress/edit-widgets',
-	'@wordpress/edit-navigation',
+	'@wordpress/block-library',
 ];
 
 /**