@wordpress/block-library 7.13.0 → 7.13.1-next.957ca95e4c.0

package/src/list/v2/deprecated.js

@@ -1,89 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { RichText, useBlockProps } from '@wordpress/block-editor';
-
-/**
- * Internal dependencies
- */
-import initialDeprecations from '../deprecated';
-import { migrateToListV2 } from './migrate';
-
-const v1 = {
-	attributes: {
-		ordered: {
-			type: 'boolean',
-			default: false,
-			__experimentalRole: 'content',
-		},
-		values: {
-			type: 'string',
-			source: 'html',
-			selector: 'ol,ul',
-			multiline: 'li',
-			__unstableMultilineWrapperTags: [ 'ol', 'ul' ],
-			default: '',
-			__experimentalRole: 'content',
-		},
-		type: {
-			type: 'string',
-		},
-		start: {
-			type: 'number',
-		},
-		reversed: {
-			type: 'boolean',
-		},
-		placeholder: {
-			type: 'string',
-		},
-	},
-	supports: {
-		anchor: true,
-		className: false,
-		typography: {
-			fontSize: true,
-			__experimentalFontFamily: true,
-			lineHeight: true,
-			__experimentalFontStyle: true,
-			__experimentalFontWeight: true,
-			__experimentalLetterSpacing: true,
-			__experimentalTextTransform: true,
-			__experimentalDefaultControls: {
-				fontSize: true,
-			},
-		},
-		color: {
-			gradients: true,
-			link: true,
-			__experimentalDefaultControls: {
-				background: true,
-				text: true,
-			},
-		},
-		__unstablePasteTextInline: true,
-		__experimentalSelector: 'ol,ul',
-		__experimentalSlashInserter: true,
-	},
-	save( { attributes } ) {
-		const { ordered, values, type, reversed, start } = attributes;
-		const TagName = ordered ? 'ol' : 'ul';
-
-		return (
-			<TagName { ...useBlockProps.save( { type, reversed, start } ) }>
-				<RichText.Content value={ values } multiline="li" />
-			</TagName>
-		);
-	},
-	migrate: migrateToListV2,
-};
-
-/**
- * New deprecations need to be placed first
- * for them to have higher priority.
- *
- * Old deprecations may need to be updated as well.
- *
- * See block-deprecation.md
- */
-export default [ v1, ...initialDeprecations ];

package/src/list/v2/edit.js

@@ -1,192 +0,0 @@
-/**
- * External dependencies
- */
-import { last } from 'lodash';
-
-/**
- * WordPress dependencies
- */
-import {
-	BlockControls,
-	useBlockProps,
-	useInnerBlocksProps,
-	store as blockEditorStore,
-} from '@wordpress/block-editor';
-import { ToolbarButton } from '@wordpress/components';
-import { useDispatch, useSelect, useRegistry } from '@wordpress/data';
-import { isRTL, __ } from '@wordpress/i18n';
-import {
-	formatListBullets,
-	formatListBulletsRTL,
-	formatListNumbered,
-	formatListNumberedRTL,
-	formatOutdent,
-	formatOutdentRTL,
-} from '@wordpress/icons';
-import { createBlock } from '@wordpress/blocks';
-import { useCallback, useEffect, Platform } from '@wordpress/element';
-import deprecated from '@wordpress/deprecated';
-
-/**
- * Internal dependencies
- */
-import OrderedListSettings from '../ordered-list-settings';
-import { migrateToListV2 } from './migrate';
-import TagName from './tag-name';
-
-const TEMPLATE = [ [ 'core/list-item' ] ];
-const NATIVE_MARGIN_SPACING = 8;
-
-/**
- * At the moment, deprecations don't handle create blocks from attributes
- * (like when using CPT templates). For this reason, this hook is necessary
- * to avoid breaking templates using the old list block format.
- *
- * @param {Object} attributes Block attributes.
- * @param {string} clientId   Block client ID.
- */
-function useMigrateOnLoad( attributes, clientId ) {
-	const registry = useRegistry();
-	const { updateBlockAttributes, replaceInnerBlocks } =
-		useDispatch( blockEditorStore );
-
-	useEffect( () => {
-		// As soon as the block is loaded, migrate it to the new version.
-
-		if ( ! attributes.values ) {
-			return;
-		}
-
-		const [ newAttributes, newInnerBlocks ] = migrateToListV2( attributes );
-
-		deprecated( 'Value attribute on the list block', {
-			since: '6.0',
-			version: '6.5',
-			alternative: 'inner blocks',
-		} );
-
-		registry.batch( () => {
-			updateBlockAttributes( clientId, newAttributes );
-			replaceInnerBlocks( clientId, newInnerBlocks );
-		} );
-	}, [ attributes.values ] );
-}
-
-function useOutdentList( clientId ) {
-	const { canOutdent } = useSelect(
-		( innerSelect ) => {
-			const { getBlockRootClientId, getBlock } =
-				innerSelect( blockEditorStore );
-			const parentId = getBlockRootClientId( clientId );
-			return {
-				canOutdent:
-					!! parentId &&
-					getBlock( parentId ).name === 'core/list-item',
-			};
-		},
-		[ clientId ]
-	);
-	const { replaceBlocks, selectionChange } = useDispatch( blockEditorStore );
-	const { getBlockRootClientId, getBlockAttributes, getBlock } =
-		useSelect( blockEditorStore );
-
-	return [
-		canOutdent,
-		useCallback( () => {
-			const parentBlockId = getBlockRootClientId( clientId );
-			const parentBlockAttributes = getBlockAttributes( parentBlockId );
-			// Create a new parent block without the inner blocks.
-			const newParentBlock = createBlock(
-				'core/list-item',
-				parentBlockAttributes
-			);
-			const { innerBlocks } = getBlock( clientId );
-			// Replace the parent block with a new parent block without inner blocks,
-			// and make the inner blocks siblings of the parent.
-			replaceBlocks(
-				[ parentBlockId ],
-				[ newParentBlock, ...innerBlocks ]
-			);
-			// Select the last child of the list being outdent.
-			selectionChange( last( innerBlocks ).clientId );
-		}, [ clientId ] ),
-	];
-}
-
-function IndentUI( { clientId } ) {
-	const [ canOutdent, outdentList ] = useOutdentList( clientId );
-	return (
-		<>
-			<ToolbarButton
-				icon={ isRTL() ? formatOutdentRTL : formatOutdent }
-				title={ __( 'Outdent' ) }
-				describedBy={ __( 'Outdent list item' ) }
-				disabled={ ! canOutdent }
-				onClick={ outdentList }
-			/>
-		</>
-	);
-}
-
-function Edit( { attributes, setAttributes, clientId, style } ) {
-	const blockProps = useBlockProps( {
-		...( Platform.isNative && { style } ),
-	} );
-	const innerBlocksProps = useInnerBlocksProps( blockProps, {
-		allowedBlocks: [ 'core/list-item' ],
-		template: TEMPLATE,
-		templateInsertUpdatesSelection: true,
-		...( Platform.isNative && {
-			marginVertical: NATIVE_MARGIN_SPACING,
-			marginHorizontal: NATIVE_MARGIN_SPACING,
-		} ),
-	} );
-	useMigrateOnLoad( attributes, clientId );
-	const { ordered, reversed, start } = attributes;
-
-	const controls = (
-		<BlockControls group="block">
-			<ToolbarButton
-				icon={ isRTL() ? formatListBulletsRTL : formatListBullets }
-				title={ __( 'Unordered' ) }
-				describedBy={ __( 'Convert to unordered list' ) }
-				isActive={ ordered === false }
-				onClick={ () => {
-					setAttributes( { ordered: false } );
-				} }
-			/>
-			<ToolbarButton
-				icon={ isRTL() ? formatListNumberedRTL : formatListNumbered }
-				title={ __( 'Ordered' ) }
-				describedBy={ __( 'Convert to ordered list' ) }
-				isActive={ ordered === true }
-				onClick={ () => {
-					setAttributes( { ordered: true } );
-				} }
-			/>
-			<IndentUI clientId={ clientId } />
-		</BlockControls>
-	);
-
-	return (
-		<>
-			<TagName
-				ordered={ ordered }
-				reversed={ reversed }
-				start={ start }
-				{ ...innerBlocksProps }
-			/>
-			{ controls }
-			{ ordered && (
-				<OrderedListSettings
-					setAttributes={ setAttributes }
-					ordered={ ordered }
-					reversed={ reversed }
-					start={ start }
-				/>
-			) }
-		</>
-	);
-}
-
-export default Edit;

package/src/list/v2/index.js

@@ -1,22 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { list as icon } from '@wordpress/icons';
-
-/**
- * Internal dependencies
- */
-import edit from './edit';
-import save from './save';
-import transforms from './transforms';
-import deprecated from './deprecated';
-
-const settings = {
-	icon,
-	edit,
-	save,
-	transforms,
-	deprecated,
-};
-
-export default settings;

package/src/list/v2/save.js

@@ -1,18 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { InnerBlocks, useBlockProps } from '@wordpress/block-editor';
-
-export default function save( { attributes } ) {
-	const { ordered, reversed, start } = attributes;
-	const TagName = ordered ? 'ol' : 'ul';
-	return (
-		<TagName
-			reversed={ reversed }
-			start={ start }
-			{ ...useBlockProps.save() }
-		>
-			<InnerBlocks.Content />
-		</TagName>
-	);
-}

package/src/list/v2/transforms.js

@@ -1,120 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { createBlock } from '@wordpress/blocks';
-import { create, split, toHTMLString } from '@wordpress/rich-text';
-
-/**
- * Internal dependencies
- */
-import { createListBlockFromDOMElement } from './migrate';
-
-function getListContentSchema( { phrasingContentSchema } ) {
-	const listContentSchema = {
-		...phrasingContentSchema,
-		ul: {},
-		ol: { attributes: [ 'type', 'start', 'reversed' ] },
-	};
-
-	// Recursion is needed.
-	// Possible: ul > li > ul.
-	// Impossible: ul > ul.
-	[ 'ul', 'ol' ].forEach( ( tag ) => {
-		listContentSchema[ tag ].children = {
-			li: {
-				children: listContentSchema,
-			},
-		};
-	} );
-
-	return listContentSchema;
-}
-
-function getListContentFlat( blocks ) {
-	return blocks.flatMap( ( { name, attributes, innerBlocks = [] } ) => {
-		if ( name === 'core/list-item' ) {
-			return [ attributes.content, ...getListContentFlat( innerBlocks ) ];
-		}
-		return getListContentFlat( innerBlocks );
-	} );
-}
-
-const transforms = {
-	from: [
-		{
-			type: 'block',
-			isMultiBlock: true,
-			blocks: [ 'core/paragraph', 'core/heading' ],
-			transform: ( blockAttributes ) => {
-				let childBlocks = [];
-				if ( blockAttributes.length > 1 ) {
-					childBlocks = blockAttributes.map( ( { content } ) => {
-						return createBlock( 'core/list-item', { content } );
-					} );
-				} else if ( blockAttributes.length === 1 ) {
-					const value = create( {
-						html: blockAttributes[ 0 ].content,
-					} );
-					childBlocks = split( value, '\n' ).map( ( result ) => {
-						return createBlock( 'core/list-item', {
-							content: toHTMLString( { value: result } ),
-						} );
-					} );
-				}
-				return createBlock(
-					'core/list',
-					{
-						anchor: blockAttributes.anchor,
-					},
-					childBlocks
-				);
-			},
-		},
-		...[ '*', '-' ].map( ( prefix ) => ( {
-			type: 'prefix',
-			prefix,
-			transform( content ) {
-				return createBlock( 'core/list', {}, [
-					createBlock( 'core/list-item', { content } ),
-				] );
-			},
-		} ) ),
-		...[ '1.', '1)' ].map( ( prefix ) => ( {
-			type: 'prefix',
-			prefix,
-			transform( content ) {
-				return createBlock(
-					'core/list',
-					{
-						ordered: true,
-					},
-					[ createBlock( 'core/list-item', { content } ) ]
-				);
-			},
-		} ) ),
-		{
-			type: 'raw',
-			selector: 'ol,ul',
-			schema: ( args ) => ( {
-				ol: getListContentSchema( args ).ol,
-				ul: getListContentSchema( args ).ul,
-			} ),
-			transform: createListBlockFromDOMElement,
-		},
-	],
-	to: [
-		...[ 'core/paragraph', 'core/heading' ].map( ( block ) => ( {
-			type: 'block',
-			blocks: [ block ],
-			transform: ( _attributes, childBlocks ) => {
-				return getListContentFlat( childBlocks ).map( ( content ) =>
-					createBlock( block, {
-						content,
-					} )
-				);
-			},
-		} ) ),
-	],
-};
-
-export default transforms;