Move Tabs to private and document usage

[MAILPOET-6319]

packages/js/email-editor/src/components/sidebar/header.tsx

@@ -1,10 +1,18 @@
+/**
+ * WordPress dependencies
+ */
 import { __ } from '@wordpress/i18n';
 import * as React from '@wordpress/element';
-import { privateApis as componentsPrivateApis } from '@wordpress/components';
-import { mainSidebarEmailTab, mainSidebarBlockTab } from '../../store';
-import { unlock } from '../../lock-unlock';
 
-const { Tabs } = unlock( componentsPrivateApis );
+/**
+ * WordPress private dependencies
+ */
+import { Tabs } from '../../private-apis';
+
+/**
+ * Internal dependencies
+ */
+import { mainSidebarEmailTab, mainSidebarBlockTab } from '../../store';
 
 export function HeaderTabs( _, ref ) {
 	return (

packages/js/email-editor/src/components/sidebar/sidebar.tsx

@@ -1,6 +1,8 @@
+/**
+ * WordPress dependencies
+ */
 import { __ } from '@wordpress/i18n';
 import { useContext, useRef, useEffect } from '@wordpress/element';
-import { privateApis as componentsPrivateApis } from '@wordpress/components';
 import { useSelect, useDispatch } from '@wordpress/data';
 import {
 	BlockInspector,
@@ -9,6 +11,15 @@ import {
 import { ComplementaryArea } from '@wordpress/interface';
 import { drawerRight } from '@wordpress/icons';
 import { store as editorStore } from '@wordpress/editor';
+
+/**
+ * WordPress private dependencies
+ */
+import { Tabs } from '../../private-apis';
+
+/**
+ * Internal dependencies
+ */
 import {
 	storeName,
 	mainSidebarEmailTab,
@@ -18,12 +29,9 @@ import {
 import { Header } from './header';
 import { EmailSettings } from './email-settings';
 import { TemplateSettings } from './template-settings';
-import { unlock } from '../../lock-unlock';
 
 import './index.scss';
 
-const { Tabs } = unlock( componentsPrivateApis );
-
 type Props = React.ComponentProps< typeof ComplementaryArea >;
 
 function SidebarContent( props: Props ) {

packages/js/email-editor/src/private-apis/index.ts

@@ -3,6 +3,7 @@ import {
 	// @ts-expect-error No types for this exist yet.
 	privateApis as blockEditorPrivateApis,
 } from '@wordpress/block-editor';
+import { privateApis as componentsPrivateApis } from '@wordpress/components';
 
 /**
  * We use the experimental block canvas to render the block editor's canvas.
@@ -13,4 +14,10 @@ const { ExperimentalBlockCanvas: BlockCanvas } = unlock(
 	blockEditorPrivateApis
 );
 
-export { BlockCanvas };
+/**
+ * Tabs are used in the right sidebar header to switch between Email and Block settings.
+ * Tabs should be close to stablization https://github.com/WordPress/gutenberg/pull/61072
+ */
+const { Tabs } = unlock( componentsPrivateApis );
+
+export { BlockCanvas, Tabs };