@wordpress/editor 14.48.0 → 14.48.2-next.v.202606191442.0

package/src/components/post-revisions-panel/index.js

@@ -1,161 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	PanelBody,
-	Button,
-	__experimentalHStack as HStack,
-	__experimentalVStack as VStack,
-	privateApis as componentsPrivateApis,
-} from '@wordpress/components';
-import { store as coreStore } from '@wordpress/core-data';
-import { DataViews } from '@wordpress/dataviews';
-import { dateI18n, getDate, humanTimeDiff, getSettings } from '@wordpress/date';
-import { useSelect, useDispatch } from '@wordpress/data';
-import { __ } from '@wordpress/i18n';
-import { authorField } from '@wordpress/fields';
-
-/**
- * Internal dependencies
- */
-import PostLastRevisionCheck from '../post-last-revision/check';
-import { store as editorStore } from '../../store';
-import { unlock } from '../../lock-unlock';
-
-const { Badge: WCBadge } = unlock( componentsPrivateApis );
-const DAY_IN_MILLISECONDS = 86400000;
-const EMPTY_ARRAY = [];
-const defaultLayouts = { activity: true };
-const noop = () => {};
-const paginationInfo = {};
-const view = {
-	type: 'activity',
-	titleField: 'date',
-	fields: [ 'author' ],
-	layout: { density: 'compact' },
-};
-const fields = [
-	{
-		id: 'date',
-		label: __( 'Date' ),
-		render: ( { item, field } ) => {
-			const dateNowInMs = getDate( null ).getTime();
-			const _value = field.getValue( { item } );
-			const date = getDate( _value ?? null );
-			const displayDate =
-				dateNowInMs - date.getTime() > DAY_IN_MILLISECONDS
-					? dateI18n(
-							getSettings().formats.datetimeAbbreviated,
-							date
-					  )
-					: humanTimeDiff( date );
-			return (
-				<time
-					className="editor-post-revisions-panel__revision-date"
-					dateTime={ _value }
-				>
-					{ displayDate }
-				</time>
-			);
-		},
-		enableSorting: false,
-		enableHiding: false,
-	},
-	authorField,
-];
-
-function PostRevisionsPanelContent() {
-	const { setCurrentRevisionId } = unlock( useDispatch( editorStore ) );
-	const {
-		revisionsCount,
-		revisions,
-		revisionKey,
-		isLoading,
-		lastRevisionId,
-	} = useSelect( ( select ) => {
-		const { getCurrentPostId, getCurrentPostType } = select( editorStore );
-		const { getCurrentPostRevisionsCount, getCurrentPostLastRevisionId } =
-			select( editorStore );
-		const { getRevisions, getEntityConfig, isResolving } =
-			select( coreStore );
-		const _postType = getCurrentPostType();
-		const entityConfig = getEntityConfig( 'postType', _postType );
-		const _revisionKey = entityConfig?.revisionKey || 'id';
-		const revisionsQuery = {
-			per_page: 3,
-			orderby: 'date',
-			order: 'desc',
-			_fields: `${ _revisionKey },date,author`,
-		};
-		const query = [
-			'postType',
-			_postType,
-			getCurrentPostId(),
-			revisionsQuery,
-		];
-		const _revisions = getRevisions( ...query );
-		return {
-			revisionsCount: getCurrentPostRevisionsCount(),
-			lastRevisionId: getCurrentPostLastRevisionId(),
-			revisions: _revisions,
-			revisionKey: _revisionKey,
-			isLoading: isResolving( 'getRevisions', query ),
-		};
-	}, [] );
-	return (
-		<PanelBody
-			title={
-				<HStack justify="space-between" align="center" as="span">
-					<span>{ __( 'Revisions' ) }</span>
-					<WCBadge className="editor-post-revisions-panel__revisions-count">
-						{ revisionsCount }
-					</WCBadge>
-				</HStack>
-			}
-			initialOpen={ false }
-		>
-			<VStack className="editor-post-revisions-panel">
-				<DataViews
-					view={ view }
-					onChangeView={ noop }
-					fields={ fields }
-					data={ revisions || EMPTY_ARRAY }
-					isLoading={ isLoading }
-					paginationInfo={ paginationInfo }
-					defaultLayouts={ defaultLayouts }
-					getItemId={ ( item ) => item[ revisionKey ] }
-					isItemClickable={ () => true }
-					onClickItem={ ( item ) => {
-						setCurrentRevisionId( item[ revisionKey ] );
-					} }
-				>
-					<DataViews.Layout />
-				</DataViews>
-				<Button
-					className="editor-post-revisions-panel__view-all"
-					__next40pxDefaultSize
-					variant="secondary"
-					onClick={ () => setCurrentRevisionId( lastRevisionId ) }
-				>
-					{ __( 'View all revisions' ) }
-				</Button>
-			</VStack>
-		</PanelBody>
-	);
-}
-
-export default function PostRevisionsPanel() {
-	const disableVisualRevisions = useSelect(
-		( select ) =>
-			!! select( editorStore ).getEditorSettings().disableVisualRevisions,
-		[]
-	);
-	if ( disableVisualRevisions ) {
-		return null;
-	}
-	return (
-		<PostLastRevisionCheck>
-			<PostRevisionsPanelContent />
-		</PostLastRevisionCheck>
-	);
-}

package/src/components/post-revisions-panel/style.scss

@@ -1,16 +0,0 @@
-.editor-post-revisions-panel {
-	.editor-post-revisions-panel__view-all {
-		justify-content: center;
-	}
-
-	.editor-post-revisions-panel__revision-date {
-		text-transform: uppercase;
-		font-weight: 600;
-		font-size: 12px;
-	}
-}
-
-.editor-post-revisions-panel__revisions-count {
-	margin-top: -4.5px;
-	margin-bottom: -4.5px;
-}

package/src/components/post-title/index.native.js

@@ -1,282 +0,0 @@
-/**
- * External dependencies
- */
-import { View } from 'react-native';
-
-/**
- * WordPress dependencies
- */
-import { Component } from '@wordpress/element';
-import { create, toHTMLString, insert } from '@wordpress/rich-text';
-import { decodeEntities } from '@wordpress/html-entities';
-import { withDispatch, withSelect } from '@wordpress/data';
-import { withFocusOutside } from '@wordpress/components';
-import { withInstanceId, compose } from '@wordpress/compose';
-import { __, sprintf } from '@wordpress/i18n';
-import { pasteHandler } from '@wordpress/blocks';
-import { store as blockEditorStore, RichText } from '@wordpress/block-editor';
-import { store as editorStore } from '@wordpress/editor';
-import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
-
-/** @typedef {import('./types').RichTextValue} RichTextValue */
-
-/**
- * Internal dependencies
- */
-import styles from './style.scss';
-
-/**
- * Inserts content with title
- *
- * This function processes the given content and title, updating the title
- * and content based on certain conditions. If the content is an array of
- * blocks, it will check the first block for a heading or paragraph to use
- * as the title. If the content is a string, it will strip HTML and update
- * the title and content accordingly.
- *
- * @param {string}         title           The post title.
- * @param {Array | string} content         The content to be processed. It can be an array of blocks or a string.
- * @param {Function}       onUpdateTitle   Callback function to update the title.
- * @param {Function}       onUpdateContent Callback function to update the content.
- * @param {RichTextValue}  value           The initial value object, default is an object with empty text.
- */
-export function insertContentWithTitle(
-	title,
-	content,
-	onUpdateTitle,
-	onUpdateContent,
-	value = create( { text: '' } )
-) {
-	if ( ! content.length ) {
-		return;
-	}
-
-	if ( typeof content !== 'string' ) {
-		const [ firstBlock ] = content;
-
-		if (
-			! title &&
-			( firstBlock.name === 'core/heading' ||
-				firstBlock.name === 'core/paragraph' )
-		) {
-			// Strip HTML to avoid unwanted HTML being added to the title.
-			// In the majority of cases it is assumed that HTML in the title
-			// is undesirable.
-			const contentNoHTML = stripHTML( firstBlock.attributes.content );
-			onUpdateTitle( contentNoHTML );
-			onUpdateContent( content.slice( 1 ) );
-		} else {
-			onUpdateContent( content );
-		}
-	} else {
-		// Strip HTML to avoid unwanted HTML being added to the title.
-		// In the majority of cases it is assumed that HTML in the title
-		// is undesirable.
-		const contentNoHTML = stripHTML( content );
-
-		const newValue = insert( value, create( { html: contentNoHTML } ) );
-		onUpdateTitle( toHTMLString( { value: newValue } ) );
-	}
-}
-
-class PostTitle extends Component {
-	constructor( props ) {
-		super( props );
-
-		this.setRef = this.setRef.bind( this );
-		this.onPaste = this.onPaste.bind( this );
-	}
-	componentDidUpdate( prevProps ) {
-		// Unselect if any other block is selected and blur the RichText.
-		if (
-			this.props.isSelected &&
-			! prevProps.isAnyBlockSelected &&
-			this.props.isAnyBlockSelected
-		) {
-			if ( this.richTextRef ) {
-				this.richTextRef.blur();
-			}
-			this.props.onUnselect();
-		}
-	}
-
-	componentDidMount() {
-		if ( this.props.innerRef ) {
-			this.props.innerRef( this );
-		}
-	}
-
-	handleFocusOutside() {
-		this.props.onUnselect();
-	}
-
-	focus() {
-		this.props.onSelect();
-	}
-
-	onPaste( { value, plainText, html } ) {
-		const {
-			title,
-			onInsertBlockAfter: onInsertBlocks,
-			onUpdate,
-		} = this.props;
-
-		const content = pasteHandler( {
-			HTML: html,
-			plainText,
-		} );
-
-		insertContentWithTitle(
-			title,
-			content,
-			onUpdate,
-			onInsertBlocks,
-			value
-		);
-	}
-
-	setRef( richText ) {
-		this.richTextRef = richText;
-	}
-
-	getTitle( title, postType ) {
-		if ( 'page' === postType ) {
-			return ! title
-				? /* translators: accessibility text. empty page title. */
-				  __( 'Page title. Empty' )
-				: sprintf(
-						/* translators: accessibility text. %s: text content of the page title. */
-						__( 'Page title. %s' ),
-						title
-				  );
-		}
-
-		return ! title
-			? /* translators: accessibility text. empty post title. */
-			  __( 'Post title. Empty' )
-			: sprintf(
-					/* translators: accessibility text. %s: text content of the post title. */
-					__( 'Post title. %s' ),
-					title
-			  );
-	}
-
-	render() {
-		const {
-			placeholder,
-			style,
-			title,
-			focusedBorderColor,
-			borderStyle,
-			isDimmed,
-			postType,
-			globalStyles,
-		} = this.props;
-
-		const decodedPlaceholder = decodeEntities( placeholder );
-		const borderColor = this.props.isSelected
-			? focusedBorderColor
-			: 'transparent';
-		const titleStyles = {
-			...style,
-			...( globalStyles?.text && {
-				color: globalStyles.text,
-				placeholderColor: globalStyles.text,
-			} ),
-		};
-
-		return (
-			<View
-				testID="post-title"
-				style={ [
-					styles.titleContainer,
-					borderStyle,
-					{ borderColor },
-					isDimmed && styles.dimmed,
-				] }
-				accessible={ ! this.props.isSelected }
-				accessibilityLabel={ this.getTitle( title, postType ) }
-				accessibilityHint={ __( 'Updates the title.' ) }
-			>
-				<RichText.Raw
-					ref={ this.setRef }
-					accessibilityLabel={ this.getTitle( title, postType ) }
-					tagName="p"
-					tagsToEliminate={ [ 'strong' ] }
-					unstableOnFocus={ this.props.onSelect }
-					onBlur={ this.props.onBlur } // Always assign onBlur as a props.
-					style={ titleStyles }
-					styles={ styles }
-					fontSize={ 24 }
-					lineHeight={ 1 }
-					fontWeight="bold"
-					deleteEnter
-					onChange={ ( value ) => {
-						this.props.onUpdate( value );
-					} }
-					onPaste={ this.onPaste }
-					placeholder={ decodedPlaceholder }
-					value={ title }
-					onSelectionChange={ () => {} }
-					onEnter={ this.props.onEnterPress }
-					disableEditingMenu
-					__unstableIsSelected={ this.props.isSelected }
-					__unstableOnCreateUndoLevel={ () => {} }
-				/>
-			</View>
-		);
-	}
-}
-
-export default compose(
-	withSelect( ( select ) => {
-		const { isPostTitleSelected, getEditedPostAttribute } =
-			select( editorStore );
-		const { getSelectedBlockClientId, getBlockRootClientId, getSettings } =
-			select( blockEditorStore );
-
-		const selectedId = getSelectedBlockClientId();
-		const selectionIsNested = !! getBlockRootClientId( selectedId );
-		const globalStyles =
-			getSettings()?.__experimentalGlobalStylesBaseStyles?.color;
-
-		return {
-			postType: getEditedPostAttribute( 'type' ),
-			title: getEditedPostAttribute( 'title' ),
-			isAnyBlockSelected: !! selectedId,
-			isSelected: isPostTitleSelected(),
-			isDimmed: selectionIsNested,
-			globalStyles,
-		};
-	} ),
-	withDispatch( ( dispatch ) => {
-		const { undo, redo, togglePostTitleSelection, editPost } =
-			dispatch( editorStore );
-
-		const { clearSelectedBlock, insertDefaultBlock, insertBlocks } =
-			dispatch( blockEditorStore );
-
-		return {
-			onEnterPress() {
-				insertDefaultBlock( undefined, undefined, 0 );
-			},
-			onUndo: undo,
-			onRedo: redo,
-			onSelect() {
-				togglePostTitleSelection( true );
-				clearSelectedBlock();
-			},
-			onUnselect() {
-				togglePostTitleSelection( false );
-			},
-			onUpdate( title ) {
-				editPost( { title } );
-			},
-			onInsertBlockAfter( blocks ) {
-				insertBlocks( blocks, 0 );
-			},
-		};
-	} ),
-	withInstanceId,
-	withFocusOutside
-)( PostTitle );

package/src/components/post-title/style.native.scss

@@ -1,13 +0,0 @@
-
-.titleContainer {
-	padding-left: $block-edge-to-content;
-	padding-right: $block-edge-to-content;
-	padding-top: 6;
-	padding-bottom: 6;
-	margin-top: 12;
-}
-
-.dimmed {
-	opacity: $dimmed-opacity;
-}
-

package/src/components/post-title/test/__snapshots__/index.native.js.snap

@@ -1,25 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`PostTitle does not update title with existing content when pasting HTML 1`] = `
-"<!-- wp:heading -->
-<h2 class="wp-block-heading">Howdy</h2>
-<!-- /wp:heading -->
-
-<!-- wp:heading -->
-<h2 class="wp-block-heading">This is a heading.</h2>
-<!-- /wp:heading -->
-
-<!-- wp:paragraph -->
-<p>This is a paragraph.</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`PostTitle populates empty title with first block content when pasting HTML 1`] = `
-"<!-- wp:heading -->
-<h2 class="wp-block-heading">This is a heading.</h2>
-<!-- /wp:heading -->
-
-<!-- wp:paragraph -->
-<p>This is a paragraph.</p>
-<!-- /wp:paragraph -->"
-`;

package/src/components/post-title/test/index.native.js

@@ -1,78 +0,0 @@
-/**
- * External dependencies
- */
-import {
-	getEditorHtml,
-	getEditorTitle,
-	initializeEditor,
-	pasteIntoRichText,
-	selectRangeInRichText,
-	screen,
-	setupCoreBlocks,
-	within,
-} from 'test/helpers';
-
-setupCoreBlocks();
-
-const HTML_MULTIPLE_TAGS = `<h2>Howdy</h2>
-<h2>This is a heading.</h2>
-<p>This is a paragraph.</p>`;
-
-describe( 'PostTitle', () => {
-	it( 'populates empty title with first block content when pasting HTML', async () => {
-		await initializeEditor( { initialTitle: '' } );
-
-		const postTitle = within(
-			screen.getByTestId( 'post-title' )
-		).getByPlaceholderText( 'Add title' );
-		pasteIntoRichText( postTitle, { html: HTML_MULTIPLE_TAGS } );
-
-		expect( console ).toHaveLogged();
-		expect( getEditorTitle() ).toBe( 'Howdy' );
-		expect( getEditorHtml() ).toMatchSnapshot();
-	} );
-
-	it( 'does not update title with existing content when pasting HTML', async () => {
-		const initialTitle = 'Hello';
-		await initializeEditor( { initialTitle } );
-
-		const postTitle = within(
-			screen.getByTestId( 'post-title' )
-		).getByPlaceholderText( 'Add title' );
-		selectRangeInRichText( postTitle, 0 );
-		pasteIntoRichText( postTitle, { html: HTML_MULTIPLE_TAGS } );
-
-		expect( console ).toHaveLogged();
-		expect( getEditorTitle() ).toBe( initialTitle );
-		expect( getEditorHtml() ).toMatchSnapshot();
-	} );
-
-	it( 'updates title with existing content when pasting text', async () => {
-		await initializeEditor( { initialTitle: 'World' } );
-
-		const postTitle = within(
-			screen.getByTestId( 'post-title' )
-		).getByPlaceholderText( 'Add title' );
-		selectRangeInRichText( postTitle, 0 );
-		pasteIntoRichText( postTitle, { text: 'Hello' } );
-
-		expect( console ).toHaveLogged();
-		expect( getEditorTitle() ).toBe( 'HelloWorld' );
-		expect( getEditorHtml() ).toBe( '' );
-	} );
-
-	it( 'does not add HTML to title when pasting span tag', async () => {
-		const pasteHTML = `<span style="border: 1px solid black">l</span>`;
-		await initializeEditor( { initialTitle: 'Helo' } );
-
-		const postTitle = within(
-			screen.getByTestId( 'post-title' )
-		).getByPlaceholderText( 'Add title' );
-		selectRangeInRichText( postTitle, 2 );
-		pasteIntoRichText( postTitle, { html: pasteHTML } );
-
-		expect( console ).toHaveLogged();
-		expect( getEditorTitle() ).toBe( 'Hello' );
-		expect( getEditorHtml() ).toBe( '' );
-	} );
-} );