@wordpress/edit-post 7.33.0 → 7.35.0

package/src/components/sidebar/post-pending-status/index.js

@@ -1,27 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	PostPendingStatus as PostPendingStatusForm,
-	PostPendingStatusCheck,
-	privateApis as editorPrivateApis,
-} from '@wordpress/editor';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../../lock-unlock';
-
-const { PostPanelRow } = unlock( editorPrivateApis );
-
-export function PostPendingStatus() {
-	return (
-		<PostPendingStatusCheck>
-			<PostPanelRow>
-				<PostPendingStatusForm />
-			</PostPanelRow>
-		</PostPendingStatusCheck>
-	);
-}
-
-export default PostPendingStatus;

package/src/components/sidebar/post-slug/index.js

@@ -1,17 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { PanelRow } from '@wordpress/components';
-import { PostSlug as PostSlugForm, PostSlugCheck } from '@wordpress/editor';
-
-export function PostSlug() {
-	return (
-		<PostSlugCheck>
-			<PanelRow className="edit-post-post-slug">
-				<PostSlugForm />
-			</PanelRow>
-		</PostSlugCheck>
-	);
-}
-
-export default PostSlug;

package/src/components/sidebar/post-slug/style.scss

@@ -1,5 +0,0 @@
-.edit-post-post-slug {
-	display: flex;
-	flex-direction: column;
-	align-items: stretch;
-}

package/src/components/sidebar/post-status/index.js

@@ -1,88 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { __ } from '@wordpress/i18n';
-import {
-	__experimentalHStack as HStack,
-	PanelBody,
-} from '@wordpress/components';
-import { useDispatch, useSelect } from '@wordpress/data';
-import {
-	PluginPostStatusInfo,
-	PostAuthorPanel,
-	PostSchedulePanel,
-	PostSyncStatus,
-	PostURLPanel,
-	PostTemplatePanel,
-	PostFeaturedImagePanel,
-	store as editorStore,
-	privateApis as editorPrivateApis,
-} from '@wordpress/editor';
-
-/**
- * Internal dependencies
- */
-import PostTrash from '../post-trash';
-import PostSticky from '../post-sticky';
-import PostSlug from '../post-slug';
-import PostFormat from '../post-format';
-import { unlock } from '../../../lock-unlock';
-
-const { PostStatus: PostStatusPanel } = unlock( editorPrivateApis );
-
-/**
- * Module Constants
- */
-const PANEL_NAME = 'post-status';
-
-export default function PostStatus() {
-	const { isOpened, isRemoved } = useSelect( ( select ) => {
-		// We use isEditorPanelRemoved to hide the panel if it was programatically removed. We do
-		// not use isEditorPanelEnabled since this panel should not be disabled through the UI.
-		const { isEditorPanelRemoved, isEditorPanelOpened } =
-			select( editorStore );
-		return {
-			isRemoved: isEditorPanelRemoved( PANEL_NAME ),
-			isOpened: isEditorPanelOpened( PANEL_NAME ),
-		};
-	}, [] );
-	const { toggleEditorPanelOpened } = useDispatch( editorStore );
-
-	if ( isRemoved ) {
-		return null;
-	}
-
-	return (
-		<PanelBody
-			className="edit-post-post-status"
-			title={ __( 'Summary' ) }
-			opened={ isOpened }
-			onToggle={ () => toggleEditorPanelOpened( PANEL_NAME ) }
-		>
-			<PluginPostStatusInfo.Slot>
-				{ ( fills ) => (
-					<>
-						<PostStatusPanel />
-						<PostFeaturedImagePanel withPanelBody={ false } />
-						<PostSchedulePanel />
-						<PostTemplatePanel />
-						<PostURLPanel />
-						<PostSyncStatus />
-						<PostSticky />
-						<PostFormat />
-						<PostSlug />
-						<PostAuthorPanel />
-						{ fills }
-						<HStack
-							style={ {
-								marginTop: '16px',
-							} }
-						>
-							<PostTrash />
-						</HStack>
-					</>
-				) }
-			</PluginPostStatusInfo.Slot>
-		</PanelBody>
-	);
-}

package/src/components/sidebar/post-sticky/index.js

@@ -1,27 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	PostSticky as PostStickyForm,
-	PostStickyCheck,
-	privateApis as editorPrivateApis,
-} from '@wordpress/editor';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../../lock-unlock';
-
-const { PostPanelRow } = unlock( editorPrivateApis );
-
-export function PostSticky() {
-	return (
-		<PostStickyCheck>
-			<PostPanelRow>
-				<PostStickyForm />
-			</PostPanelRow>
-		</PostStickyCheck>
-	);
-}
-
-export default PostSticky;

package/src/components/sidebar/post-trash/index.js

@@ -1,12 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { PostTrash as PostTrashLink, PostTrashCheck } from '@wordpress/editor';
-
-export default function PostTrash() {
-	return (
-		<PostTrashCheck>
-			<PostTrashLink />
-		</PostTrashCheck>
-	);
-}

package/src/components/sidebar/post-visibility/index.js

@@ -1,88 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { __, sprintf } from '@wordpress/i18n';
-import { Dropdown, Button } from '@wordpress/components';
-import {
-	PostVisibility as PostVisibilityForm,
-	PostVisibilityLabel,
-	PostVisibilityCheck,
-	usePostVisibilityLabel,
-	privateApis as editorPrivateApis,
-} from '@wordpress/editor';
-import { useMemo, useState } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../../lock-unlock';
-
-const { PostPanelRow } = unlock( editorPrivateApis );
-
-export function PostVisibility() {
-	// Use internal state instead of a ref to make sure that the component
-	// re-renders when the popover's anchor updates.
-	const [ popoverAnchor, setPopoverAnchor ] = useState( null );
-	// Memoize popoverProps to avoid returning a new object every time.
-	const popoverProps = useMemo(
-		() => ( {
-			// Anchor the popover to the middle of the entire row so that it doesn't
-			// move around when the label changes.
-			anchor: popoverAnchor,
-			placement: 'bottom-end',
-		} ),
-		[ popoverAnchor ]
-	);
-
-	return (
-		<PostVisibilityCheck
-			render={ ( { canEdit } ) => (
-				<PostPanelRow
-					label={ __( 'Visibility' ) }
-					ref={ setPopoverAnchor }
-				>
-					{ ! canEdit && (
-						<span>
-							<PostVisibilityLabel />
-						</span>
-					) }
-					{ canEdit && (
-						<Dropdown
-							contentClassName="edit-post-post-visibility__dialog"
-							popoverProps={ popoverProps }
-							focusOnMount
-							renderToggle={ ( { isOpen, onToggle } ) => (
-								<PostVisibilityToggle
-									isOpen={ isOpen }
-									onClick={ onToggle }
-								/>
-							) }
-							renderContent={ ( { onClose } ) => (
-								<PostVisibilityForm onClose={ onClose } />
-							) }
-						/>
-					) }
-				</PostPanelRow>
-			) }
-		/>
-	);
-}
-
-function PostVisibilityToggle( { isOpen, onClick } ) {
-	const label = usePostVisibilityLabel();
-	return (
-		<Button
-			__next40pxDefaultSize
-			className="edit-post-post-visibility__toggle"
-			variant="tertiary"
-			aria-expanded={ isOpen }
-			// translators: %s: Current post visibility.
-			aria-label={ sprintf( __( 'Select visibility: %s' ), label ) }
-			onClick={ onClick }
-		>
-			{ label }
-		</Button>
-	);
-}
-
-export default PostVisibility;

package/src/components/sidebar/post-visibility/style.scss

@@ -1,5 +0,0 @@
-.edit-post-post-visibility__dialog .editor-post-visibility {
-	// sidebar width - popover padding - form margin
-	min-width: $sidebar-width - $grid-unit-20 - $grid-unit-20;
-	margin: $grid-unit-10;
-}

package/src/components/sidebar/settings-header/index.js

@@ -1,49 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { privateApis as componentsPrivateApis } from '@wordpress/components';
-import { __, _x } from '@wordpress/i18n';
-import { useSelect } from '@wordpress/data';
-import { forwardRef } from '@wordpress/element';
-import { store as editorStore } from '@wordpress/editor';
-
-/**
- * Internal dependencies
- */
-import { unlock } from '../../../lock-unlock';
-import { sidebars } from '../settings-sidebar';
-
-const { Tabs } = unlock( componentsPrivateApis );
-
-const SettingsHeader = ( _, ref ) => {
-	const { documentLabel } = useSelect( ( select ) => {
-		const { getPostTypeLabel } = select( editorStore );
-
-		return {
-			// translators: Default label for the Document sidebar tab, not selected.
-			documentLabel: getPostTypeLabel() || _x( 'Document', 'noun' ),
-		};
-	}, [] );
-
-	return (
-		<Tabs.TabList ref={ ref }>
-			<Tabs.Tab
-				tabId={ sidebars.document }
-				// Used for focus management in the SettingsSidebar component.
-				data-tab-id={ sidebars.document }
-			>
-				{ documentLabel }
-			</Tabs.Tab>
-			<Tabs.Tab
-				tabId={ sidebars.block }
-				// Used for focus management in the SettingsSidebar component.
-				data-tab-id={ sidebars.block }
-			>
-				{ /* translators: Text label for the Block Settings Sidebar tab. */ }
-				{ __( 'Block' ) }
-			</Tabs.Tab>
-		</Tabs.TabList>
-	);
-};
-
-export default forwardRef( SettingsHeader );

package/src/components/sidebar/settings-sidebar/index.js

@@ -1,211 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	BlockInspector,
-	store as blockEditorStore,
-} from '@wordpress/block-editor';
-import { useSelect, useDispatch } from '@wordpress/data';
-import {
-	Platform,
-	useCallback,
-	useContext,
-	useEffect,
-	useRef,
-} from '@wordpress/element';
-import { isRTL, __ } from '@wordpress/i18n';
-import { drawerLeft, drawerRight } from '@wordpress/icons';
-import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
-import {
-	store as editorStore,
-	PageAttributesPanel,
-	PluginDocumentSettingPanel,
-	PluginSidebar,
-	PostDiscussionPanel,
-	PostExcerptPanel,
-	PostLastRevisionPanel,
-	PostTaxonomiesPanel,
-	privateApis as editorPrivateApis,
-} from '@wordpress/editor';
-import { addQueryArgs } from '@wordpress/url';
-
-/**
- * Internal dependencies
- */
-import SettingsHeader from '../settings-header';
-import PostStatus from '../post-status';
-import MetaBoxes from '../../meta-boxes';
-import { store as editPostStore } from '../../../store';
-import { privateApis as componentsPrivateApis } from '@wordpress/components';
-import { unlock } from '../../../lock-unlock';
-
-const { PostCardPanel, PostActions, interfaceStore } =
-	unlock( editorPrivateApis );
-const { Tabs } = unlock( componentsPrivateApis );
-const { PatternOverridesPanel, useAutoSwitchEditorSidebars } =
-	unlock( editorPrivateApis );
-
-const SIDEBAR_ACTIVE_BY_DEFAULT = Platform.select( {
-	web: true,
-	native: false,
-} );
-export const sidebars = {
-	document: 'edit-post/document',
-	block: 'edit-post/block',
-};
-
-function onActionPerformed( actionId, items ) {
-	if ( actionId === 'move-to-trash' ) {
-		const postType = items[ 0 ].type;
-		document.location.href = addQueryArgs( 'edit.php', {
-			post_type: postType,
-		} );
-	}
-}
-
-const SidebarContent = ( { tabName, keyboardShortcut, isEditingTemplate } ) => {
-	const tabListRef = useRef( null );
-	// Because `PluginSidebar` renders a `ComplementaryArea`, we
-	// need to forward the `Tabs` context so it can be passed through the
-	// underlying slot/fill.
-	const tabsContextValue = useContext( Tabs.Context );
-
-	// This effect addresses a race condition caused by tabbing from the last
-	// block in the editor into the settings sidebar. Without this effect, the
-	// selected tab and browser focus can become separated in an unexpected way
-	// (e.g the "block" tab is focused, but the "post" tab is selected).
-	useEffect( () => {
-		const tabsElements = Array.from(
-			tabListRef.current?.querySelectorAll( '[role="tab"]' ) || []
-		);
-		const selectedTabElement = tabsElements.find(
-			// We are purposefully using a custom `data-tab-id` attribute here
-			// because we don't want rely on any assumptions about `Tabs`
-			// component internals.
-			( element ) => element.getAttribute( 'data-tab-id' ) === tabName
-		);
-		const activeElement = selectedTabElement?.ownerDocument.activeElement;
-		const tabsHasFocus = tabsElements.some( ( element ) => {
-			return activeElement && activeElement.id === element.id;
-		} );
-		if (
-			tabsHasFocus &&
-			selectedTabElement &&
-			selectedTabElement.id !== activeElement?.id
-		) {
-			selectedTabElement?.focus();
-		}
-	}, [ tabName ] );
-
-	return (
-		<PluginSidebar
-			identifier={ tabName }
-			header={
-				<Tabs.Context.Provider value={ tabsContextValue }>
-					<SettingsHeader ref={ tabListRef } />
-				</Tabs.Context.Provider>
-			}
-			closeLabel={ __( 'Close Settings' ) }
-			// This classname is added so we can apply a corrective negative
-			// margin to the panel.
-			// see https://github.com/WordPress/gutenberg/pull/55360#pullrequestreview-1737671049
-			className="edit-post-sidebar__panel"
-			headerClassName="edit-post-sidebar__panel-tabs"
-			/* translators: button label text should, if possible, be under 16 characters. */
-			title={ __( 'Settings' ) }
-			toggleShortcut={ keyboardShortcut }
-			icon={ isRTL() ? drawerLeft : drawerRight }
-			isActiveByDefault={ SIDEBAR_ACTIVE_BY_DEFAULT }
-		>
-			<Tabs.Context.Provider value={ tabsContextValue }>
-				<Tabs.TabPanel tabId={ sidebars.document } focusable={ false }>
-					<PostCardPanel
-						actions={
-							<PostActions
-								onActionPerformed={ onActionPerformed }
-							/>
-						}
-					/>
-					{ ! isEditingTemplate && (
-						<>
-							<PostStatus />
-							<PluginDocumentSettingPanel.Slot />
-							<PostLastRevisionPanel />
-							<PostTaxonomiesPanel />
-							<PostExcerptPanel />
-							<PostDiscussionPanel />
-							<PageAttributesPanel />
-							<PatternOverridesPanel />
-							<MetaBoxes location="side" />
-						</>
-					) }
-				</Tabs.TabPanel>
-				<Tabs.TabPanel tabId={ sidebars.block } focusable={ false }>
-					<BlockInspector />
-				</Tabs.TabPanel>
-			</Tabs.Context.Provider>
-		</PluginSidebar>
-	);
-};
-
-const SettingsSidebar = () => {
-	useAutoSwitchEditorSidebars();
-	const { tabName, keyboardShortcut, isEditingTemplate } = useSelect(
-		( select ) => {
-			const shortcut = select(
-				keyboardShortcutsStore
-			).getShortcutRepresentation( 'core/editor/toggle-sidebar' );
-
-			const sidebar =
-				select( interfaceStore ).getActiveComplementaryArea( 'core' );
-			const _isEditorSidebarOpened = [
-				sidebars.block,
-				sidebars.document,
-			].includes( sidebar );
-			let _tabName = sidebar;
-			if ( ! _isEditorSidebarOpened ) {
-				_tabName = !! select(
-					blockEditorStore
-				).getBlockSelectionStart()
-					? sidebars.block
-					: sidebars.document;
-			}
-
-			return {
-				tabName: _tabName,
-				keyboardShortcut: shortcut,
-				isEditingTemplate:
-					select( editorStore ).getCurrentPostType() ===
-					'wp_template',
-			};
-		},
-		[]
-	);
-
-	const { openGeneralSidebar } = useDispatch( editPostStore );
-
-	const onTabSelect = useCallback(
-		( newSelectedTabId ) => {
-			if ( !! newSelectedTabId ) {
-				openGeneralSidebar( newSelectedTabId );
-			}
-		},
-		[ openGeneralSidebar ]
-	);
-
-	return (
-		<Tabs
-			selectedTabId={ tabName }
-			onSelect={ onTabSelect }
-			selectOnMove={ false }
-		>
-			<SidebarContent
-				tabName={ tabName }
-				keyboardShortcut={ keyboardShortcut }
-				isEditingTemplate={ isEditingTemplate }
-			/>
-		</Tabs>
-	);
-};
-
-export default SettingsSidebar;

package/src/components/sidebar/style.scss

@@ -1,18 +0,0 @@
-.components-panel__header.edit-post-sidebar__panel-tabs {
-	padding-left: 0;
-	padding-right: $grid-unit-20;
-
-	.components-button.has-icon {
-		padding: 0;
-		min-width: $icon-size;
-		height: $icon-size;
-
-		@include break-medium() {
-			display: flex;
-		}
-	}
-}
-
-.edit-post-sidebar__panel {
-	margin-top: -1px;
-}

package/src/plugins/copy-content-menu-item/index.js

@@ -1,29 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { MenuItem } from '@wordpress/components';
-import { useSelect, useDispatch } from '@wordpress/data';
-import { __ } from '@wordpress/i18n';
-import { useCopyToClipboard } from '@wordpress/compose';
-import { store as noticesStore } from '@wordpress/notices';
-import { store as editorStore } from '@wordpress/editor';
-
-export default function CopyContentMenuItem() {
-	const { createNotice } = useDispatch( noticesStore );
-	const { getEditedPostAttribute } = useSelect( editorStore );
-
-	function getText() {
-		return getEditedPostAttribute( 'content' );
-	}
-
-	function onSuccess() {
-		createNotice( 'info', __( 'All content copied.' ), {
-			isDismissible: true,
-			type: 'snackbar',
-		} );
-	}
-
-	const ref = useCopyToClipboard( getText, onSuccess );
-
-	return <MenuItem ref={ ref }>{ __( 'Copy all blocks' ) }</MenuItem>;
-}

package/src/plugins/index.js

@@ -1,85 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { MenuItem, VisuallyHidden } from '@wordpress/components';
-import { store as coreStore } from '@wordpress/core-data';
-import { store as editorStore } from '@wordpress/editor';
-import { useSelect } from '@wordpress/data';
-import { external } from '@wordpress/icons';
-import { __ } from '@wordpress/i18n';
-import { registerPlugin } from '@wordpress/plugins';
-import { addQueryArgs } from '@wordpress/url';
-
-/**
- * Internal dependencies
- */
-import CopyContentMenuItem from './copy-content-menu-item';
-import KeyboardShortcutsHelpMenuItem from './keyboard-shortcuts-help-menu-item';
-import ToolsMoreMenuGroup from '../components/header/tools-more-menu-group';
-import WelcomeGuideMenuItem from './welcome-guide-menu-item';
-
-function ManagePatternsMenuItem() {
-	const url = useSelect( ( select ) => {
-		const { canUser } = select( coreStore );
-		const { getEditorSettings } = select( editorStore );
-
-		const isBlockTheme = getEditorSettings().__unstableIsBlockBasedTheme;
-		const defaultUrl = addQueryArgs( 'edit.php', {
-			post_type: 'wp_block',
-		} );
-		const patternsUrl = addQueryArgs( 'site-editor.php', {
-			path: '/patterns',
-		} );
-
-		// 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' ) && isBlockTheme
-			? patternsUrl
-			: defaultUrl;
-	}, [] );
-
-	return (
-		<MenuItem role="menuitem" href={ url }>
-			{ __( 'Manage patterns' ) }
-		</MenuItem>
-	);
-}
-
-registerPlugin( 'edit-post', {
-	render() {
-		return (
-			<>
-				<ToolsMoreMenuGroup>
-					{ ( { onClose } ) => (
-						<>
-							<ManagePatternsMenuItem />
-							<KeyboardShortcutsHelpMenuItem
-								onSelect={ onClose }
-							/>
-							<WelcomeGuideMenuItem />
-							<CopyContentMenuItem />
-							<MenuItem
-								role="menuitem"
-								icon={ external }
-								href={ __(
-									'https://wordpress.org/documentation/article/wordpress-block-editor/'
-								) }
-								target="_blank"
-								rel="noopener noreferrer"
-							>
-								{ __( 'Help' ) }
-								<VisuallyHidden as="span">
-									{
-										/* translators: accessibility text */
-										__( '(opens in a new tab)' )
-									}
-								</VisuallyHidden>
-							</MenuItem>
-						</>
-					) }
-				</ToolsMoreMenuGroup>
-			</>
-		);
-	},
-} );