Consume useGlobalStylesOutputWithConfig from private-apis

[MAILPOET-6319]

packages/js/email-editor/src/hooks/use-email-css.ts

@@ -1,16 +1,21 @@
+/**
+ * WordPress dependencies
+ */
 import { useMemo } from '@wordpress/element';
 import { useSelect } from '@wordpress/data';
+
+/**
+ * WordPress private dependencies
+ */
+import { useGlobalStylesOutputWithConfig } from '../private-apis';
+
+/**
+ * Internal dependencies
+ */
 import deepmerge from 'deepmerge';
-import {
-	// @ts-expect-error No types for this exist yet.
-	privateApis as blockEditorPrivateApi,
-} from '@wordpress/block-editor';
-import { unlock } from '../lock-unlock';
 import { EmailStyles, storeName } from '../store';
 import { useEmailTheme } from './use-email-theme';
 
-const { useGlobalStylesOutputWithConfig } = unlock( blockEditorPrivateApi );
-
 export function useEmailCss() {
 	const { templateTheme } = useEmailTheme();
 	const { editorTheme } = useSelect(

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

@@ -2,6 +2,7 @@
  * WordPress dependencies
  */
 import {
+	privateApis as blockEditorPrivateApi,
 	// @ts-expect-error No types for this exist yet.
 	privateApis as blockEditorPrivateApis,
 } from '@wordpress/block-editor';
@@ -55,10 +56,16 @@ const unlockGetEnabledClientIdsTree = ( selectHook ) => {
  */
 const { ColorPanel: StylesColorPanel } = unlock( blockEditorPrivateApis );
 
+/**
+ * The useGlobalStylesOutputWithConfig is used to generate the CSS for the email editor content from the style settings.
+ */
+const { useGlobalStylesOutputWithConfig } = unlock( blockEditorPrivateApi );
+
 export {
 	BlockCanvas,
 	Tabs,
 	StylesColorPanel,
 	unlockPatternsRelatedSelectorsFromCoreStore,
 	unlockGetEnabledClientIdsTree,
+	useGlobalStylesOutputWithConfig,
 };