@wordpress/block-library 9.33.1-next.ff1cebbba.0 → 9.33.1

package/src/code/transforms.js

@@ -7,7 +7,7 @@ import { create, toHTMLString } from '@wordpress/rich-text';
 /**
  * Internal dependencies
  */
-import { getTransformedMetadata } from '../utils/get-transformed-metadata';
+import { getTransformedAttributes } from '../utils/get-transformed-attributes';
 
 const transforms = {
 	from: [
@@ -19,21 +19,24 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content, metadata } ) =>
-				createBlock( 'core/code', {
+			transform: ( attributes ) => {
+				const { content } = attributes;
+				return createBlock( 'core/code', {
+					...getTransformedAttributes( attributes, 'core/code' ),
 					content,
-					metadata: getTransformedMetadata( metadata, 'core/code' ),
-				} ),
+				} );
+			},
 		},
 		{
 			type: 'block',
 			blocks: [ 'core/html' ],
-			transform: ( { content: text, metadata } ) => {
+			transform: ( attributes ) => {
+				const { content: text } = attributes;
 				return createBlock( 'core/code', {
+					...getTransformedAttributes( attributes, 'core/code' ),
 					// The HTML is plain text (with plain line breaks), so
 					// convert it to rich text.
 					content: toHTMLString( { value: create( { text } ) } ),
-					metadata: getTransformedMetadata( metadata, 'core/code' ),
 				} );
 			},
 		},
@@ -60,14 +63,13 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content, metadata } ) =>
-				createBlock( 'core/paragraph', {
+			transform: ( attributes ) => {
+				const { content } = attributes;
+				return createBlock( 'core/paragraph', {
+					...getTransformedAttributes( attributes, 'core/paragraph' ),
 					content,
-					metadata: getTransformedMetadata(
-						metadata,
-						'core/paragraph'
-					),
-				} ),
+				} );
+			},
 		},
 	],
 };

package/src/heading/index.js

@@ -13,7 +13,6 @@ import edit from './edit';
 import metadata from './block.json';
 import save from './save';
 import transforms from './transforms';
-import variations from './variations';
 
 const { name } = metadata;
 
@@ -66,7 +65,6 @@ export const settings = {
 	},
 	edit,
 	save,
-	variations,
 };
 
 export const init = () => initBlock( { name, metadata, settings } );

package/src/heading/transforms.js

@@ -7,7 +7,7 @@ import { createBlock, getBlockAttributes } from '@wordpress/blocks';
  * Internal dependencies
  */
 import { getLevelFromHeadingNodeName } from './shared';
-import { getTransformedMetadata } from '../utils/get-transformed-metadata';
+import { getTransformedAttributes } from '../utils/get-transformed-attributes';
 
 const transforms = {
 	from: [
@@ -16,21 +16,21 @@ const transforms = {
 			isMultiBlock: true,
 			blocks: [ 'core/paragraph' ],
 			transform: ( attributes ) =>
-				attributes.map(
-					( { content, anchor, align: textAlign, metadata } ) =>
-						createBlock( 'core/heading', {
-							content,
-							anchor,
-							textAlign,
-							metadata: getTransformedMetadata(
-								metadata,
-								'core/heading',
-								( { content: contentBinding } ) => ( {
-									content: contentBinding,
-								} )
-							),
-						} )
-				),
+				attributes.map( ( _attributes ) => {
+					const { content, anchor, align: textAlign } = _attributes;
+					return createBlock( 'core/heading', {
+						...getTransformedAttributes(
+							_attributes,
+							'core/heading',
+							( { content: contentBinding } ) => ( {
+								content: contentBinding,
+							} )
+						),
+						content,
+						anchor,
+						textAlign,
+					} );
+				} ),
 		},
 		{
 			type: 'raw',
@@ -91,19 +91,20 @@ const transforms = {
 			isMultiBlock: true,
 			blocks: [ 'core/paragraph' ],
 			transform: ( attributes ) =>
-				attributes.map( ( { content, textAlign: align, metadata } ) =>
-					createBlock( 'core/paragraph', {
-						content,
-						align,
-						metadata: getTransformedMetadata(
-							metadata,
+				attributes.map( ( _attributes ) => {
+					const { content, textAlign: align } = _attributes;
+					return createBlock( 'core/paragraph', {
+						...getTransformedAttributes(
+							_attributes,
 							'core/paragraph',
 							( { content: contentBinding } ) => ( {
 								content: contentBinding,
 							} )
 						),
-					} )
-				),
+						content,
+						align,
+					} );
+				} ),
 		},
 	],
 };

package/src/index.js

@@ -72,6 +72,7 @@ import * as image from './image';
 import * as latestComments from './latest-comments';
 import * as latestPosts from './latest-posts';
 import * as list from './list';
+import * as math from './math';
 import * as listItem from './list-item';
 import * as logInOut from './loginout';
 import * as mediaText from './media-text';
@@ -163,7 +164,6 @@ const getAllBlocks = () => {
 		accordionPanel,
 		archives,
 		audio,
-		breadcrumbs,
 		button,
 		buttons,
 		calendar,
@@ -178,6 +178,7 @@ const getAllBlocks = () => {
 		file,
 		group,
 		html,
+		math,
 		latestComments,
 		latestPosts,
 		mediaText,
@@ -254,13 +255,14 @@ const getAllBlocks = () => {
 		termCount,
 		termDescription,
 		termName,
+		termsQuery,
+		termTemplate,
 		queryTitle,
 		postAuthorBiography,
 	];
 
 	if ( window?.__experimentalEnableBlockExperiments ) {
-		blocks.push( termsQuery );
-		blocks.push( termTemplate );
+		blocks.push( breadcrumbs );
 	}
 
 	if ( window?.__experimentalEnableFormBlocks ) {

package/src/math/block.json

@@ -0,0 +1,21 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"apiVersion": 3,
+	"name": "core/math",
+	"title": "Math",
+	"category": "text",
+	"description": "Display mathematical notation using LaTeX.",
+	"keywords": [ "equation", "formula", "latex", "mathematics" ],
+	"textdomain": "default",
+	"attributes": {
+		"latex": {
+			"type": "string",
+			"role": "content"
+		},
+		"mathML": {
+			"type": "string",
+			"source": "html",
+			"selector": "math"
+		}
+	}
+}

package/src/math/edit.js

@@ -0,0 +1,123 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import {
+	useBlockProps,
+	store as blockEditorStore,
+} from '@wordpress/block-editor';
+import {
+	TextareaControl,
+	Popover,
+	__experimentalVStack as VStack,
+	privateApis as componentsPrivateApis,
+} from '@wordpress/components';
+import { useState, useEffect, useRef } from '@wordpress/element';
+import { useDispatch } from '@wordpress/data';
+
+/**
+ * Internal dependencies
+ */
+import { unlock } from '../lock-unlock';
+
+const { Badge } = unlock( componentsPrivateApis );
+
+export default function MathEdit( { attributes, setAttributes, isSelected } ) {
+	const { latex } = attributes;
+	const [ blockRef, setBlockRef ] = useState();
+	const [ error, setError ] = useState( null );
+	const [ latexToMathML, setLatexToMathML ] = useState();
+	const initialLatex = useRef( attributes.latex );
+	const { __unstableMarkNextChangeAsNotPersistent } =
+		useDispatch( blockEditorStore );
+
+	useEffect( () => {
+		import( '@wordpress/latex-to-mathml' ).then( ( module ) => {
+			setLatexToMathML( () => module.default );
+			if ( initialLatex.current ) {
+				__unstableMarkNextChangeAsNotPersistent();
+				setAttributes( {
+					mathML: module.default( initialLatex.current, {
+						displayMode: true,
+					} ),
+				} );
+			}
+		} );
+	}, [
+		initialLatex,
+		setAttributes,
+		__unstableMarkNextChangeAsNotPersistent,
+	] );
+
+	const blockProps = useBlockProps( {
+		ref: setBlockRef,
+		position: 'relative',
+	} );
+
+	return (
+		<div { ...blockProps }>
+			{ attributes.mathML ? (
+				<math
+					// We can't spread block props on the math element because
+					// it only supports a limited amount of global attributes.
+					// For example, draggable will have no effect.
+					display="block"
+					dangerouslySetInnerHTML={ { __html: attributes.mathML } }
+				/>
+			) : (
+				'\u200B'
+			) }
+			{ isSelected && (
+				<Popover
+					placement="bottom-start"
+					offset={ 8 }
+					anchor={ blockRef }
+					focusOnMount="firstContentElement"
+				>
+					<div style={ { padding: '4px', minWidth: '300px' } }>
+						<VStack spacing={ 1 }>
+							<TextareaControl
+								__nextHasNoMarginBottom
+								__next40pxDefaultSize
+								label={ __( 'LaTeX math syntax' ) }
+								hideLabelFromVision
+								value={ latex }
+								onChange={ ( newLatex ) => {
+									if ( ! latexToMathML ) {
+										setAttributes( { latex: newLatex } );
+										return;
+									}
+									let mathML = '';
+									try {
+										mathML = latexToMathML( newLatex, {
+											displayMode: true,
+										} );
+										setError( null );
+									} catch ( err ) {
+										setError( err.message );
+									}
+									setAttributes( {
+										mathML,
+										latex: newLatex,
+									} );
+								} }
+								placeholder={ __( 'e.g., x^2, \\frac{a}{b}' ) }
+							/>
+							{ error && (
+								<>
+									<Badge
+										intent="error"
+										className="wp-block-math__error"
+									>
+										{ error }
+									</Badge>
+									<style children=".wp-block-math__error .components-badge__content{white-space:normal}" />
+								</>
+							) }
+						</VStack>
+					</div>
+				</Popover>
+			) }
+		</div>
+	);
+}

package/src/math/index.js

@@ -0,0 +1,31 @@
+/**
+ * WordPress dependencies
+ */
+import { math as icon } from '@wordpress/icons';
+
+/**
+ * Internal dependencies
+ */
+import initBlock from '../utils/init-block';
+import edit from './edit';
+import metadata from './block.json';
+import save from './save';
+
+const { name } = metadata;
+
+export { metadata, name };
+
+export const settings = {
+	icon,
+	example: {
+		attributes: {
+			latex: 'x = \\frac{-b \\pm \\sqrt{b^2-4ac}}{2a}',
+			mathML: '<semantics><mrow><mi>x</mi><mo>=</mo><mfrac><mrow><mo lspace="0em" rspace="0em">−</mo><mi>b</mi><mo>±</mo><msqrt><mrow><msup><mi>b</mi><mn>2</mn></msup><mo>−</mo><mn>4</mn><mi>a</mi><mi>c</mi></mrow></msqrt></mrow><mrow><mn>2</mn><mi>a</mi></mrow></mfrac></mrow><annotation encoding="application/x-tex">x = \\frac{-b \\pm \\sqrt{b^2-4ac}}{2a}</annotation></semantics>',
+		},
+		viewportWidth: 300,
+	},
+	edit,
+	save,
+};
+
+export const init = () => initBlock( { name, metadata, settings } );

package/src/math/init.js

@@ -0,0 +1,4 @@
+/**
+ * Internal dependencies
+ */
+export { init, metadata, name, settings } from './index';

package/src/math/save.js

@@ -0,0 +1,20 @@
+/**
+ * WordPress dependencies
+ */
+import { useBlockProps } from '@wordpress/block-editor';
+
+export default function save( { attributes } ) {
+	const { latex, mathML } = attributes;
+
+	if ( ! latex ) {
+		return null;
+	}
+
+	return (
+		<math
+			{ ...useBlockProps.save() }
+			display="block"
+			dangerouslySetInnerHTML={ { __html: mathML } }
+		/>
+	);
+}

package/src/navigation/edit/menu-inspector-controls.js

@@ -111,19 +111,20 @@ function AdditionalBlockContent( { block, insertedBlock, setInsertedBlock } ) {
 			} }
 			onChange={ ( updatedValue ) => {
 				// updateAttributes determines the final state and returns metadata
-				const { isEntityLink } = updateAttributes(
-					updatedValue,
-					setInsertedBlockAttributes( insertedBlock?.clientId ),
-					insertedBlock?.attributes
-				);
+				const { isEntityLink, attributes: updatedAttributes } =
+					updateAttributes(
+						updatedValue,
+						setInsertedBlockAttributes( insertedBlock?.clientId ),
+						insertedBlock?.attributes
+					);
 
 				// Handle URL binding based on the final computed state
 				// Only create bindings for entity links (posts, pages, taxonomies)
 				// Never create bindings for custom links (manual URLs)
 				if ( isEntityLink ) {
-					createBinding();
+					createBinding( updatedAttributes );
 				} else {
-					clearBinding();
+					clearBinding( updatedAttributes );
 				}
 
 				setInsertedBlock( null );

package/src/navigation-link/edit.js

@@ -543,7 +543,10 @@ export default function NavigationLinkEdit( {
 							anchor={ popoverAnchor }
 							onRemove={ removeLink }
 							onChange={ ( updatedValue ) => {
-								const { isEntityLink } = updateAttributes(
+								const {
+									isEntityLink,
+									attributes: updatedAttributes,
+								} = updateAttributes(
 									updatedValue,
 									setAttributes,
 									attributes
@@ -553,9 +556,9 @@ export default function NavigationLinkEdit( {
 								// Only create bindings for entity links (posts, pages, taxonomies)
 								// Never create bindings for custom links (manual URLs)
 								if ( isEntityLink ) {
-									createBinding();
+									createBinding( updatedAttributes );
 								} else {
-									clearBinding();
+									clearBinding( updatedAttributes );
 								}
 							} }
 						/>

package/src/navigation-link/index.php

@@ -202,20 +202,6 @@ function render_block_core_navigation_link( $attributes, $content, $block ) {
 		return '';
 	}
 
-	// Resolve URL binding if present
-	$url = $attributes['url'] ?? '';
-	if ( isset( $attributes['metadata']['bindings']['url']['source'] ) ) {
-		$binding = $attributes['metadata']['bindings']['url'];
-		$source  = get_block_bindings_source( $binding['source'] );
-		if ( $source ) {
-			$source_args  = $binding['args'] ?? array();
-			$resolved_url = $source->get_value( $source_args, $block, 'url' );
-			if ( $resolved_url ) {
-				$url = $resolved_url;
-			}
-		}
-	}
-
 	$font_sizes      = block_core_navigation_link_build_css_font_sizes( $block->context );
 	$classes         = array_merge(
 		$font_sizes['css_classes']
@@ -227,9 +213,9 @@ function render_block_core_navigation_link( $attributes, $content, $block ) {
 	$kind        = empty( $attributes['kind'] ) ? 'post_type' : str_replace( '-', '_', $attributes['kind'] );
 	$is_active   = ! empty( $attributes['id'] ) && get_queried_object_id() === (int) $attributes['id'] && ! empty( get_queried_object()->$kind );
 
-	if ( is_post_type_archive() && ! empty( $url ) ) {
+	if ( is_post_type_archive() && ! empty( $attributes['url'] ) ) {
 		$queried_archive_link = get_post_type_archive_link( get_queried_object()->name );
-		if ( $url === $queried_archive_link ) {
+		if ( $attributes['url'] === $queried_archive_link ) {
 			$is_active = true;
 		}
 	}
@@ -245,8 +231,8 @@ function render_block_core_navigation_link( $attributes, $content, $block ) {
 		'<a class="wp-block-navigation-item__content" ';
 
 	// Start appending HTML attributes to anchor tag.
-	if ( ! empty( $url ) ) {
-		$html .= ' href="' . esc_url( block_core_navigation_link_maybe_urldecode( $url ) ) . '"';
+	if ( isset( $attributes['url'] ) ) {
+		$html .= ' href="' . esc_url( block_core_navigation_link_maybe_urldecode( $attributes['url'] ) ) . '"';
 	}
 
 	if ( $is_active ) {

package/src/navigation-link/link-ui/index.js

@@ -78,10 +78,12 @@ function UnforwardedLinkUI( props, ref ) {
 		name: postType,
 	} );
 
-	// Check if there's a URL binding with the core/entity source
+	// Check if there's a URL binding with the new binding sources
 	// Only enable handleEntities when there's actually a binding present
 	const hasUrlBinding =
-		metadata?.bindings?.url?.source === 'core/entity' && !! id;
+		( metadata?.bindings?.url?.source === 'core/post-data' ||
+			metadata?.bindings?.url?.source === 'core/term-data' ) &&
+		!! id;
 
 	// Memoize link value to avoid overriding the LinkControl's internal state.
 	// This is a temporary fix. See https://github.com/WordPress/gutenberg/issues/50976#issuecomment-1568226407.

package/src/navigation-link/shared/controls.js

@@ -16,6 +16,8 @@ import { useInstanceId } from '@wordpress/compose';
 import { safeDecodeURI } from '@wordpress/url';
 import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
 import { linkOff as unlinkIcon } from '@wordpress/icons';
+import { useDispatch } from '@wordpress/data';
+import { store as blockEditorStore } from '@wordpress/block-editor';
 
 /**
  * Internal dependencies
@@ -79,12 +81,19 @@ export function Controls( { attributes, setAttributes, clientId } ) {
 		attributes,
 	} );
 
+	// Get direct store dispatch to bypass setBoundAttributes wrapper
+	const { updateBlockAttributes } = useDispatch( blockEditorStore );
+
 	const editBoundLink = () => {
-		// Remove the binding
+		// Clear the binding first
 		clearBinding();
 
-		// Clear url and id to allow picking a new entity (keep type and kind)
-		setAttributes( { url: undefined, id: undefined } );
+		// Use direct store dispatch to bypass block bindings safeguards
+		// which prevent updates to bound attributes when calling setAttributes.
+		// setAttributes is actually setBoundAttributes, a wrapper function that
+		// processes attributes through the binding system.
+		// See: packages/block-editor/src/components/block-edit/edit.js
+		updateBlockAttributes( clientId, { url: '', id: undefined } );
 	};
 
 	return (

package/src/navigation-link/shared/index.js

@@ -7,5 +7,8 @@
 
 export { Controls } from './controls';
 export { updateAttributes } from './update-attributes';
-export { useEntityBinding } from './use-entity-binding';
+export {
+	useEntityBinding,
+	buildNavigationLinkEntityBinding,
+} from './use-entity-binding';
 export { LinkUI } from '../link-ui';

package/src/navigation-link/shared/test/update-attributes.test.js

@@ -1153,6 +1153,7 @@ describe( 'updateAttributes', () => {
 
 				expect( result ).toEqual( {
 					isEntityLink: true,
+					attributes: expect.any( Object ),
 				} );
 			} );
 
@@ -1173,6 +1174,7 @@ describe( 'updateAttributes', () => {
 
 				expect( result ).toEqual( {
 					isEntityLink: false,
+					attributes: expect.any( Object ),
 				} );
 			} );
 
@@ -1190,6 +1192,7 @@ describe( 'updateAttributes', () => {
 
 				expect( result ).toEqual( {
 					isEntityLink: false,
+					attributes: expect.any( Object ),
 				} );
 			} );
 
@@ -1215,6 +1218,7 @@ describe( 'updateAttributes', () => {
 				// Should return false because the link was severed and converted to custom
 				expect( result ).toEqual( {
 					isEntityLink: false,
+					attributes: expect.any( Object ),
 				} );
 			} );
 
@@ -1240,6 +1244,7 @@ describe( 'updateAttributes', () => {
 				// Should return true because entity link is preserved
 				expect( result ).toEqual( {
 					isEntityLink: true,
+					attributes: expect.any( Object ),
 				} );
 			} );
 
@@ -1260,6 +1265,7 @@ describe( 'updateAttributes', () => {
 				// mailto links have kind: 'custom', so isEntityLink should be false
 				expect( result ).toEqual( {
 					isEntityLink: false,
+					attributes: expect.any( Object ),
 				} );
 			} );
 
@@ -1280,6 +1286,7 @@ describe( 'updateAttributes', () => {
 				// tel links have kind: 'custom', so isEntityLink should be false
 				expect( result ).toEqual( {
 					isEntityLink: false,
+					attributes: expect.any( Object ),
 				} );
 			} );
 
@@ -1300,6 +1307,7 @@ describe( 'updateAttributes', () => {
 
 				expect( result ).toEqual( {
 					isEntityLink: true,
+					attributes: expect.any( Object ),
 				} );
 			} );
 		} );