@wordpress/edit-post 7.34.0 → 8.0.0

package/src/components/{header/fullscreen-mode-close/test/index.js → back-button/test/fullscreen-mode-close.js}

@@ -11,7 +11,7 @@ import { useSelect } from '@wordpress/data';
 /**
  * Internal dependencies
  */
-import FullscreenModeClose from '../';
+import FullscreenModeClose from '../fullscreen-mode-close';
 
 jest.mock( '@wordpress/data/src/components/use-select', () => {
 	// This allows us to tweak the returned value on each test.

package/src/components/layout/index.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -10,84 +10,78 @@ import {
 	AutosaveMonitor,
 	LocalAutosaveMonitor,
 	UnsavedChangesWarning,
-	EditorNotices,
 	EditorKeyboardShortcutsRegister,
-	EditorKeyboardShortcuts,
 	EditorSnackbars,
 	store as editorStore,
 	privateApis as editorPrivateApis,
 } from '@wordpress/editor';
 import { useSelect, useDispatch } from '@wordpress/data';
 import {
-	BlockBreadcrumb,
-	BlockToolbar,
 	privateApis as blockEditorPrivateApis,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
-import { ScrollLock } from '@wordpress/components';
 import { useViewportMatch } from '@wordpress/compose';
 import { PluginArea } from '@wordpress/plugins';
-import { __, _x, sprintf } from '@wordpress/i18n';
-import { useState, useEffect, useCallback, useMemo } from '@wordpress/element';
-import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
+import { __, sprintf } from '@wordpress/i18n';
+import { useCallback, useMemo } from '@wordpress/element';
 import { store as noticesStore } from '@wordpress/notices';
 import { store as preferencesStore } from '@wordpress/preferences';
 import { privateApis as commandsPrivateApis } from '@wordpress/commands';
 import { privateApis as coreCommandsPrivateApis } from '@wordpress/core-commands';
 import { privateApis as blockLibraryPrivateApis } from '@wordpress/block-library';
+import { addQueryArgs } from '@wordpress/url';
 
 /**
  * Internal dependencies
  */
-import TextEditor from '../text-editor';
-import VisualEditor from '../visual-editor';
+import BackButton from '../back-button';
 import EditPostKeyboardShortcuts from '../keyboard-shortcuts';
 import InitPatternModal from '../init-pattern-modal';
 import BrowserURL from '../browser-url';
-import Header from '../header';
-import SettingsSidebar from '../sidebar/settings-sidebar';
 import MetaBoxes from '../meta-boxes';
+import PostEditorMoreMenu from '../more-menu';
 import WelcomeGuide from '../welcome-guide';
 import { store as editPostStore } from '../../store';
 import { unlock } from '../../lock-unlock';
-import useCommonCommands from '../../hooks/commands/use-common-commands';
+import useEditPostCommands from '../../commands/use-commands';
+import { usePaddingAppender } from './use-padding-appender';
+import { useShouldIframe } from './use-should-iframe';
 
 const { getLayoutStyles } = unlock( blockEditorPrivateApis );
 const { useCommands } = unlock( coreCommandsPrivateApis );
 const { useCommandContext } = unlock( commandsPrivateApis );
-const {
-	InserterSidebar,
-	ListViewSidebar,
-	ComplementaryArea,
-	FullscreenMode,
-	SavePublishPanels,
-	InterfaceSkeleton,
-	interfaceStore,
-} = unlock( editorPrivateApis );
+const { EditorInterface, FullscreenMode, Sidebar } =
+	unlock( editorPrivateApis );
 const { BlockKeyboardShortcuts } = unlock( blockLibraryPrivateApis );
-
-const interfaceLabels = {
-	/* translators: accessibility text for the editor top bar landmark region. */
-	header: __( 'Editor top bar' ),
-	/* translators: accessibility text for the editor content landmark region. */
-	body: __( 'Editor content' ),
-	/* translators: accessibility text for the editor settings landmark region. */
-	sidebar: __( 'Editor settings' ),
-	/* translators: accessibility text for the editor publish landmark region. */
-	actions: __( 'Editor publish' ),
-	/* translators: accessibility text for the editor footer landmark region. */
-	footer: __( 'Editor footer' ),
-};
+const DESIGN_POST_TYPES = [
+	'wp_template',
+	'wp_template_part',
+	'wp_block',
+	'wp_navigation',
+];
 
 function useEditorStyles() {
-	const { hasThemeStyleSupport, editorSettings } = useSelect(
-		( select ) => ( {
+	const {
+		hasThemeStyleSupport,
+		editorSettings,
+		isZoomedOutView,
+		hasMetaBoxes,
+		renderingMode,
+		postType,
+	} = useSelect( ( select ) => {
+		const { __unstableGetEditorMode } = select( blockEditorStore );
+		const { getCurrentPostType, getRenderingMode } = select( editorStore );
+		const _postType = getCurrentPostType();
+		return {
 			hasThemeStyleSupport:
 				select( editPostStore ).isFeatureActive( 'themeStyles' ),
 			editorSettings: select( editorStore ).getEditorSettings(),
-		} ),
-		[]
-	);
+			isZoomedOutView: __unstableGetEditorMode() === 'zoom-out',
+			hasMetaBoxes: select( editPostStore ).hasMetaBoxes(),
+			renderingMode: getRenderingMode(),
+			postType: _postType,
+		};
+	}, [] );
 
 	// Compute the default styles.
 	return useMemo( () => {
@@ -121,7 +115,24 @@ function useEditorStyles() {
 			} );
 		}
 
-		return hasThemeStyles ? editorSettings.styles : defaultEditorStyles;
+		const baseStyles = hasThemeStyles
+			? editorSettings.styles ?? []
+			: defaultEditorStyles;
+
+		// Add a constant padding for the typewritter effect. When typing at the
+		// bottom, there needs to be room to scroll up.
+		if (
+			! isZoomedOutView &&
+			! hasMetaBoxes &&
+			renderingMode === 'post-only' &&
+			! DESIGN_POST_TYPES.includes( postType )
+		) {
+			baseStyles.push( {
+				css: 'body{padding-bottom: 40vh}',
+			} );
+		}
+
+		return baseStyles;
 	}, [
 		editorSettings.defaultEditorStyles,
 		editorSettings.disableLayoutStyles,
@@ -132,107 +143,56 @@ function useEditorStyles() {
 
 function Layout( { initialPost } ) {
 	useCommands();
-	useCommonCommands();
-
-	const isMobileViewport = useViewportMatch( 'medium', '<' );
-	const isHugeViewport = useViewportMatch( 'huge', '>=' );
+	useEditPostCommands();
 	const isWideViewport = useViewportMatch( 'large' );
-	const isLargeViewport = useViewportMatch( 'medium' );
-
-	const { closeGeneralSidebar } = useDispatch( editPostStore );
+	const paddingAppenderRef = usePaddingAppender();
+	const shouldIframe = useShouldIframe();
 	const { createErrorNotice } = useDispatch( noticesStore );
-	const { setIsInserterOpened } = useDispatch( editorStore );
 	const {
 		mode,
 		isFullscreenActive,
-		isRichEditingEnabled,
 		sidebarIsOpened,
 		hasActiveMetaboxes,
-		previousShortcut,
-		nextShortcut,
 		hasBlockSelected,
-		isInserterOpened,
-		isListViewOpened,
 		showIconLabels,
 		isDistractionFree,
 		showBlockBreadcrumbs,
 		showMetaBoxes,
-		documentLabel,
 		hasHistory,
-		hasBlockBreadcrumbs,
+		isEditingTemplate,
+		isWelcomeGuideVisible,
 	} = useSelect( ( select ) => {
 		const { get } = select( preferencesStore );
-		const { getEditorSettings, getPostTypeLabel } = select( editorStore );
-		const editorSettings = getEditorSettings();
-		const postTypeLabel = getPostTypeLabel();
+		const { getEditorSettings } = select( editorStore );
+		const { isFeatureActive } = select( editPostStore );
 
 		return {
-			showMetaBoxes:
-				select( editorStore ).getRenderingMode() === 'post-only',
-			sidebarIsOpened: !! (
-				select( interfaceStore ).getActiveComplementaryArea( 'core' ) ||
-				select( editorStore ).isPublishSidebarOpened()
-			),
+			mode: select( editorStore ).getEditorMode(),
 			isFullscreenActive:
 				select( editPostStore ).isFeatureActive( 'fullscreenMode' ),
-			isInserterOpened: select( editorStore ).isInserterOpened(),
-			isListViewOpened: select( editorStore ).isListViewOpened(),
-			mode: select( editorStore ).getEditorMode(),
-			isRichEditingEnabled: editorSettings.richEditingEnabled,
 			hasActiveMetaboxes: select( editPostStore ).hasMetaBoxes(),
-			previousShortcut: select(
-				keyboardShortcutsStore
-			).getAllShortcutKeyCombinations( 'core/editor/previous-region' ),
-			nextShortcut: select(
-				keyboardShortcutsStore
-			).getAllShortcutKeyCombinations( 'core/editor/next-region' ),
+			hasBlockSelected:
+				!! select( blockEditorStore ).getBlockSelectionStart(),
 			showIconLabels: get( 'core', 'showIconLabels' ),
 			isDistractionFree: get( 'core', 'distractionFree' ),
 			showBlockBreadcrumbs: get( 'core', 'showBlockBreadcrumbs' ),
-			// translators: Default label for the Document in the Block Breadcrumb.
-			documentLabel: postTypeLabel || _x( 'Document', 'noun' ),
-			hasBlockSelected:
-				!! select( blockEditorStore ).getBlockSelectionStart(),
+			showMetaBoxes:
+				select( editorStore ).getRenderingMode() === 'post-only',
 			hasHistory: !! getEditorSettings().onNavigateToPreviousEntityRecord,
-			hasBlockBreadcrumbs: get( 'core', 'showBlockBreadcrumbs' ),
+			isEditingTemplate:
+				select( editorStore ).getCurrentPostType() === 'wp_template',
+			isWelcomeGuideVisible: isFeatureActive( 'welcomeGuide' ),
 		};
 	}, [] );
 
 	// Set the right context for the command palette
 	const commandContext = hasBlockSelected
 		? 'block-selection-edit'
-		: 'post-editor-edit';
+		: 'entity-edit';
 	useCommandContext( commandContext );
 
 	const styles = useEditorStyles();
 
-	// Inserter and Sidebars are mutually exclusive
-	useEffect( () => {
-		if ( sidebarIsOpened && ! isHugeViewport ) {
-			setIsInserterOpened( false );
-		}
-	}, [ isHugeViewport, setIsInserterOpened, sidebarIsOpened ] );
-	useEffect( () => {
-		if ( isInserterOpened && ! isHugeViewport ) {
-			closeGeneralSidebar();
-		}
-	}, [ closeGeneralSidebar, isInserterOpened, isHugeViewport ] );
-
-	// Local state for save panel.
-	// Note 'truthy' callback implies an open panel.
-	const [ entitiesSavedStatesCallback, setEntitiesSavedStatesCallback ] =
-		useState( false );
-
-	const closeEntitiesSavedStates = useCallback(
-		( arg ) => {
-			if ( typeof entitiesSavedStatesCallback === 'function' ) {
-				entitiesSavedStatesCallback( arg );
-			}
-			setEntitiesSavedStatesCallback( false );
-		},
-		[ entitiesSavedStatesCallback ]
-	);
-
 	// We need to add the show-icon-labels class to the body element so it is applied to modals.
 	if ( showIconLabels ) {
 		document.body.classList.add( 'show-icon-labels' );
@@ -240,35 +200,14 @@ function Layout( { initialPost } ) {
 		document.body.classList.remove( 'show-icon-labels' );
 	}
 
-	const className = classnames( 'edit-post-layout', 'is-mode-' + mode, {
+	const className = clsx( 'edit-post-layout', 'is-mode-' + mode, {
 		'is-sidebar-opened': sidebarIsOpened,
 		'has-metaboxes': hasActiveMetaboxes,
 		'is-distraction-free': isDistractionFree && isWideViewport,
-		'is-entity-save-view-open': !! entitiesSavedStatesCallback,
 		'has-block-breadcrumbs':
-			hasBlockBreadcrumbs && ! isDistractionFree && isWideViewport,
+			showBlockBreadcrumbs && ! isDistractionFree && isWideViewport,
 	} );
 
-	const secondarySidebarLabel = isListViewOpened
-		? __( 'Document Overview' )
-		: __( 'Block Library' );
-
-	const secondarySidebar = () => {
-		if ( mode === 'visual' && isInserterOpened ) {
-			return (
-				<InserterSidebar
-					closeGeneralSidebar={ closeGeneralSidebar }
-					isRightSidebarOpen={ sidebarIsOpened }
-				/>
-			);
-		}
-		if ( mode === 'visual' && isListViewOpened ) {
-			return <ListViewSidebar />;
-		}
-
-		return null;
-	};
-
 	function onPluginAreaError( name ) {
 		createErrorNotice(
 			sprintf(
@@ -281,6 +220,58 @@ function Layout( { initialPost } ) {
 		);
 	}
 
+	const { createSuccessNotice } = useDispatch( noticesStore );
+
+	const onActionPerformed = useCallback(
+		( actionId, items ) => {
+			switch ( actionId ) {
+				case 'move-to-trash':
+					{
+						document.location.href = addQueryArgs( 'edit.php', {
+							trashed: 1,
+							post_type: items[ 0 ].type,
+							ids: items[ 0 ].id,
+						} );
+					}
+					break;
+				case 'duplicate-post':
+					{
+						const newItem = items[ 0 ];
+						const title =
+							typeof newItem.title === 'string'
+								? newItem.title
+								: newItem.title?.rendered;
+						createSuccessNotice(
+							sprintf(
+								// translators: %s: Title of the created post e.g: "Post 1".
+								__( '"%s" successfully created.' ),
+								title
+							),
+							{
+								type: 'snackbar',
+								id: 'duplicate-post-action',
+								actions: [
+									{
+										label: __( 'Edit' ),
+										onClick: () => {
+											const postId = newItem.id;
+											document.location.href =
+												addQueryArgs( 'post.php', {
+													post: postId,
+													action: 'edit',
+												} );
+										},
+									},
+								],
+							}
+						);
+					}
+					break;
+			}
+		},
+		[ createSuccessNotice ]
+	);
+
 	return (
 		<>
 			<FullscreenMode isActive={ isFullscreenActive } />
@@ -290,85 +281,38 @@ function Layout( { initialPost } ) {
 			<LocalAutosaveMonitor />
 			<EditPostKeyboardShortcuts />
 			<EditorKeyboardShortcutsRegister />
-			<EditorKeyboardShortcuts />
 			<BlockKeyboardShortcuts />
-
-			<InterfaceSkeleton
-				isDistractionFree={ isDistractionFree && isWideViewport }
-				className={ className }
-				labels={ {
-					...interfaceLabels,
-					secondarySidebar: secondarySidebarLabel,
-				} }
-				header={
-					<Header
-						setEntitiesSavedStatesCallback={
-							setEntitiesSavedStatesCallback
-						}
-						initialPost={ initialPost }
-					/>
-				}
-				editorNotices={ <EditorNotices /> }
-				secondarySidebar={ secondarySidebar() }
-				sidebar={
-					! isDistractionFree && (
-						<ComplementaryArea.Slot scope="core" />
-					)
-				}
-				notices={ <EditorSnackbars /> }
-				content={
-					<>
-						{ ! isDistractionFree && <EditorNotices /> }
-						{ ( mode === 'text' || ! isRichEditingEnabled ) && (
-							<TextEditor />
-						) }
-						{ ! isLargeViewport && <BlockToolbar hideDragHandle /> }
-						{ isRichEditingEnabled && mode === 'visual' && (
-							<VisualEditor styles={ styles } />
-						) }
-						{ ! isDistractionFree && showMetaBoxes && (
-							<div className="edit-post-layout__metaboxes">
-								<MetaBoxes location="normal" />
-								<MetaBoxes location="advanced" />
-							</div>
-						) }
-						{ isMobileViewport && sidebarIsOpened && (
-							<ScrollLock />
-						) }
-					</>
-				}
-				footer={
-					! isDistractionFree &&
-					! isMobileViewport &&
-					showBlockBreadcrumbs &&
-					isRichEditingEnabled &&
-					mode === 'visual' && (
-						<div className="edit-post-layout__footer">
-							<BlockBreadcrumb rootLabelText={ documentLabel } />
-						</div>
-					)
-				}
-				actions={
-					<SavePublishPanels
-						closeEntitiesSavedStates={ closeEntitiesSavedStates }
-						isEntitiesSavedStatesOpen={
-							entitiesSavedStatesCallback
-						}
-						setEntitiesSavedStatesCallback={
-							setEntitiesSavedStatesCallback
-						}
-						forceIsDirtyPublishPanel={ hasActiveMetaboxes }
-					/>
-				}
-				shortcuts={ {
-					previous: previousShortcut,
-					next: nextShortcut,
-				} }
-			/>
 			<WelcomeGuide />
 			<InitPatternModal />
 			<PluginArea onError={ onPluginAreaError } />
-			{ ! isDistractionFree && <SettingsSidebar /> }
+			{ ! isDistractionFree && (
+				<Sidebar
+					onActionPerformed={ onActionPerformed }
+					extraPanels={
+						! isEditingTemplate && <MetaBoxes location="side" />
+					}
+				/>
+			) }
+			<PostEditorMoreMenu />
+			<BackButton initialPost={ initialPost } />
+			<EditorSnackbars />
+			<EditorInterface
+				className={ className }
+				styles={ styles }
+				forceIsDirty={ hasActiveMetaboxes }
+				contentRef={ paddingAppenderRef }
+				disableIframe={ ! shouldIframe }
+				// We should auto-focus the canvas (title) on load.
+				// eslint-disable-next-line jsx-a11y/no-autofocus
+				autoFocus={ ! isWelcomeGuideVisible }
+			>
+				{ ! isDistractionFree && showMetaBoxes && (
+					<div className="edit-post-layout__metaboxes">
+						<MetaBoxes location="normal" />
+						<MetaBoxes location="advanced" />
+					</div>
+				) }
+			</EditorInterface>
 		</>
 	);
 }

package/src/components/layout/style.scss

@@ -1,28 +1,20 @@
+.editor-visual-editor {
+	flex: 1 0 auto;
+	height: auto;
+}
+
 .edit-post-layout__metaboxes {
 	flex-shrink: 0;
 	clear: both;
 }
 
 // Adjust the position of the notices
-.edit-post-layout .components-editor-notices__snackbar {
+.components-editor-notices__snackbar {
 	position: fixed;
 	right: 0;
-	bottom: 16px;
-	padding-left: 16px;
-	padding-right: 16px;
-}
-
-.is-distraction-free {
-	.components-editor-notices__snackbar {
-		bottom: 16px;
-	}
-}
-
-// Adjust the position of the notices when breadcrumbs are present
-.has-block-breadcrumbs {
-	.components-editor-notices__snackbar {
-		bottom: 40px;
-	}
+	bottom: 24px;
+	padding-left: 24px;
+	padding-right: 24px;
 }
 
 @include editor-left(".edit-post-layout .components-editor-notices__snackbar");

package/src/components/{visual-editor → layout}/use-padding-appender.js

@@ -27,7 +27,7 @@ export function usePaddingAppender() {
 					return;
 				}
 
-				// only handle clicks under the last child
+				// Only handle clicks under the last child.
 				const lastChild = node.lastElementChild;
 				if ( ! lastChild ) {
 					return;
@@ -44,6 +44,12 @@ export function usePaddingAppender() {
 					.select( blockEditorStore )
 					.getBlockOrder( '' );
 				const lastBlockClientId = blockOrder[ blockOrder.length - 1 ];
+
+				// Do nothing when only default block appender is present.
+				if ( ! lastBlockClientId ) {
+					return;
+				}
+
 				const lastBlock = registry
 					.select( blockEditorStore )
 					.getBlock( lastBlockClientId );

package/src/components/layout/use-should-iframe.js

@@ -0,0 +1,40 @@
+/**
+ * WordPress dependencies
+ */
+import { store as editorStore } from '@wordpress/editor';
+import { useSelect } from '@wordpress/data';
+import { store as blocksStore } from '@wordpress/blocks';
+
+/**
+ * Internal dependencies
+ */
+import { store as editPostStore } from '../../store';
+
+const isGutenbergPlugin = globalThis.IS_GUTENBERG_PLUGIN ? true : false;
+
+export function useShouldIframe() {
+	const {
+		isBlockBasedTheme,
+		hasV3BlocksOnly,
+		isEditingTemplate,
+		hasMetaBoxes,
+	} = useSelect( ( select ) => {
+		const { getEditorSettings, getCurrentPostType } = select( editorStore );
+		const { getBlockTypes } = select( blocksStore );
+		const editorSettings = getEditorSettings();
+		return {
+			isBlockBasedTheme: editorSettings.__unstableIsBlockBasedTheme,
+			hasV3BlocksOnly: getBlockTypes().every( ( type ) => {
+				return type.apiVersion >= 3;
+			} ),
+			isEditingTemplate: getCurrentPostType() === 'wp_template',
+			hasMetaBoxes: select( editPostStore ).hasMetaBoxes(),
+		};
+	}, [] );
+
+	return (
+		( ( hasV3BlocksOnly || ( isGutenbergPlugin && isBlockBasedTheme ) ) &&
+			! hasMetaBoxes ) ||
+		isEditingTemplate
+	);
+}

package/src/components/meta-boxes/meta-boxes-area/index.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import classnames from 'classnames';
+import clsx from 'clsx';
 
 /**
  * WordPress dependencies
@@ -48,13 +48,9 @@ function MetaBoxesArea( { location } ) {
 		return select( editPostStore ).isSavingMetaBoxes();
 	}, [] );
 
-	const classes = classnames(
-		'edit-post-meta-boxes-area',
-		`is-${ location }`,
-		{
-			'is-loading': isSaving,
-		}
-	);
+	const classes = clsx( 'edit-post-meta-boxes-area', `is-${ location }`, {
+		'is-loading': isSaving,
+	} );
 
 	return (
 		<div className={ classes }>

package/src/components/{header/more-menu → more-menu}/index.js

@@ -10,10 +10,10 @@ import { displayShortcut } from '@wordpress/keycodes';
 /**
  * Internal dependencies
  */
-import { unlock } from '../../../lock-unlock';
+import { unlock } from '../../lock-unlock';
 import ManagePatternsMenuItem from './manage-patterns-menu-item';
 import WelcomeGuideMenuItem from './welcome-guide-menu-item';
-import EditPostPreferencesModal from '../../preferences-modal';
+import EditPostPreferencesModal from '../preferences-modal';
 
 const { ToolsMoreMenuGroup, ViewMoreMenuGroup } = unlock( editorPrivateApis );
 

package/src/components/{header/more-menu → more-menu}/manage-patterns-menu-item.js

@@ -20,7 +20,7 @@ function ManagePatternsMenuItem() {
 		// The site editor and templates both check whether the user has
 		// edit_theme_options capabilities. We can leverage that here and not
 		// display the manage patterns link if the user can't access it.
-		return canUser( 'read', 'templates' ) ? patternsUrl : defaultUrl;
+		return canUser( 'create', 'templates' ) ? patternsUrl : defaultUrl;
 	}, [] );
 
 	return (

package/src/index.js

@@ -14,13 +14,19 @@ import {
 	registerLegacyWidgetBlock,
 	registerWidgetGroupBlock,
 } from '@wordpress/widgets';
-import { store as editorStore } from '@wordpress/editor';
+import {
+	store as editorStore,
+	privateApis as editorPrivateApis,
+} from '@wordpress/editor';
 
 /**
  * Internal dependencies
  */
-import './hooks';
 import Editor from './editor';
+import { unlock } from './lock-unlock';
+
+const { BackButton: __experimentalMainDashboardButton } =
+	unlock( editorPrivateApis );
 
 /**
  * Initializes and returns an instance of Editor.
@@ -80,7 +86,7 @@ export function initializeEditor(
 	registerCoreBlocks();
 	registerLegacyWidgetBlock( { inserter: false } );
 	registerWidgetGroupBlock( { inserter: false } );
-	if ( process.env.IS_GUTENBERG_PLUGIN ) {
+	if ( globalThis.IS_GUTENBERG_PLUGIN ) {
 		__experimentalRegisterExperimentalCoreBlocks( {
 			enableFSEBlocks: settings.__unstableEnableFullSiteEditingBlocks,
 		} );
@@ -152,8 +158,7 @@ export function reinitializeEditor() {
 	} );
 }
 
-export { default as __experimentalFullscreenModeClose } from './components/header/fullscreen-mode-close';
-export { default as __experimentalMainDashboardButton } from './components/header/main-dashboard-button';
-
+export { default as __experimentalFullscreenModeClose } from './components/back-button/fullscreen-mode-close';
+export { __experimentalMainDashboardButton };
 export { store } from './store';
 export * from './deprecated';