Add anchor support to static blocks

WordPress · Jun 16, 2020 · 883460e · 883460e
1 parent 3f65d98
commit 883460e
Show file tree

Hide file tree

Showing 31 changed files with 74 additions and 19 deletions.
diff --git a/packages/block-library/src/audio/block.json b/packages/block-library/src/audio/block.json
@@ -36,6 +36,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": true,
 		"lightBlockWrapper": true
 	}

diff --git a/packages/block-library/src/button/block.json b/packages/block-library/src/button/block.json
@@ -54,6 +54,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": true,
 		"alignWide": false,
 		"reusable": false,

diff --git a/packages/block-library/src/buttons/block.json b/packages/block-library/src/buttons/block.json
@@ -2,6 +2,7 @@
 	"name": "core/buttons",
 	"category": "design",
 	"supports": {
+		"anchor": true,
 		"align": true,
 		"alignWide": false,
 		"lightBlockWrapper": true

diff --git a/packages/block-library/src/code/block.json b/packages/block-library/src/code/block.json
@@ -9,6 +9,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"html": false,
 		"lightBlockWrapper": true
 	}

diff --git a/packages/block-library/src/column/block.json b/packages/block-library/src/column/block.json
@@ -15,6 +15,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"reusable": false,
 		"html": false,
 		"lightBlockWrapper": true

diff --git a/packages/block-library/src/columns/block.json b/packages/block-library/src/columns/block.json
@@ -7,6 +7,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": [
 			"wide",
 			"full"

diff --git a/packages/block-library/src/cover/block.json b/packages/block-library/src/cover/block.json
@@ -46,6 +46,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": true,
 		"html": false,
 		"lightBlockWrapper": true,

diff --git a/packages/block-library/src/cover/transforms.js b/packages/block-library/src/cover/transforms.js
@@ -13,24 +13,26 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/image' ],
-			transform: ( { caption, url, align, id } ) =>
+			transform: ( { caption, url, align, id, anchor } ) =>
 				createBlock( 'core/cover', {
 					title: caption,
 					url,
 					align,
 					id,
+					anchor,
 				} ),
 		},
 		{
 			type: 'block',
 			blocks: [ 'core/video' ],
-			transform: ( { caption, src, align, id } ) =>
+			transform: ( { caption, src, align, id, anchor } ) =>
 				createBlock( 'core/cover', {
 					title: caption,
 					url: src,
 					align,
 					id,
 					backgroundType: VIDEO_BACKGROUND_TYPE,
+					anchor,
 				} ),
 		},
 	],
@@ -58,12 +60,13 @@ const transforms = {
 					! customGradient
 				);
 			},
-			transform: ( { title, url, align, id } ) =>
+			transform: ( { title, url, align, id, anchor } ) =>
 				createBlock( 'core/image', {
 					caption: title,
 					url,
 					align,
 					id,
+					anchor,
 				} ),
 		},
 		{
@@ -89,12 +92,13 @@ const transforms = {
 					! customGradient
 				);
 			},
-			transform: ( { title, url, align, id } ) =>
+			transform: ( { title, url, align, id, anchor } ) =>
 				createBlock( 'core/video', {
 					caption: title,
 					src: url,
 					id,
 					align,
+					anchor,
 				} ),
 		},
 	],

diff --git a/packages/block-library/src/file/block.json b/packages/block-library/src/file/block.json
@@ -36,6 +36,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": true
 	}
 }
diff --git a/packages/block-library/src/file/transforms.js b/packages/block-library/src/file/transforms.js
@@ -48,6 +48,7 @@ const transforms = {
 					fileName: attributes.caption,
 					textLinkHref: attributes.src,
 					id: attributes.id,
+					anchor: attributes.anchor,
 				} );
 			},
 		},
@@ -60,6 +61,7 @@ const transforms = {
 					fileName: attributes.caption,
 					textLinkHref: attributes.src,
 					id: attributes.id,
+					anchor: attributes.anchor,
 				} );
 			},
 		},
@@ -72,6 +74,7 @@ const transforms = {
 					fileName: attributes.caption,
 					textLinkHref: attributes.url,
 					id: attributes.id,
+					anchor: attributes.anchor,
 				} );
 			},
 		},
@@ -93,6 +96,7 @@ const transforms = {
 					src: attributes.href,
 					caption: attributes.fileName,
 					id: attributes.id,
+					anchor: attributes.anchor,
 				} );
 			},
 		},
@@ -112,6 +116,7 @@ const transforms = {
 					src: attributes.href,
 					caption: attributes.fileName,
 					id: attributes.id,
+					anchor: attributes.anchor,
 				} );
 			},
 		},
@@ -131,6 +136,7 @@ const transforms = {
 					url: attributes.href,
 					caption: attributes.fileName,
 					id: attributes.id,
+					anchor: attributes.anchor,
 				} );
 			},
 		},

diff --git a/packages/block-library/src/gallery/block.json b/packages/block-library/src/gallery/block.json
@@ -77,6 +77,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": true
 	}
 }
diff --git a/packages/block-library/src/heading/transforms.js b/packages/block-library/src/heading/transforms.js
@@ -14,9 +14,10 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content } ) => {
+			transform: ( { content, anchor } ) => {
 				return createBlock( name, {
 					content,
+					anchor,
 				} );
 			},
 		},
@@ -26,7 +27,7 @@ const transforms = {
 			schema: ( { phrasingContentSchema, isPaste } ) => {
 				const schema = {
 					children: phrasingContentSchema,
-					attributes: isPaste ? [] : [ 'style' ],
+					attributes: isPaste ? [] : [ 'style', 'id' ],
 				};
 				return {
 					h1: schema,
@@ -69,9 +70,10 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content } ) => {
+			transform: ( { content, anchor } ) => {
 				return createBlock( 'core/paragraph', {
 					content,
+					anchor,
 				} );
 			},
 		},

diff --git a/packages/block-library/src/image/block.json b/packages/block-library/src/image/block.json
@@ -71,6 +71,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"lightBlockWrapper": true
 	}
 }
diff --git a/packages/block-library/src/image/transforms.js b/packages/block-library/src/image/transforms.js
@@ -85,6 +85,7 @@ const transforms = {
 				const alignMatches = /(?:^|\s)align(left|center|right)(?:$|\s)/.exec(
 					className
 				);
+				const anchor = node.id === '' ? undefined : node.id;
 				const align = alignMatches ? alignMatches[ 1 ] : undefined;
 				const idMatches = /(?:^|\s)wp-image-(\d+)(?:$|\s)/.exec(
 					className
@@ -115,6 +116,7 @@ const transforms = {
 						href,
 						rel,
 						linkClass,
+						anchor,
 					}
 				);
 				return createBlock( 'core/image', attributes );

diff --git a/packages/block-library/src/list/block.json b/packages/block-library/src/list/block.json
@@ -28,6 +28,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"className": false,
 		"__unstablePasteTextInline": true,
 		"lightBlockWrapper": true

diff --git a/packages/block-library/src/list/transforms.js b/packages/block-library/src/list/transforms.js
@@ -61,18 +61,20 @@ const transforms = {
 						),
 						multilineTag: 'li',
 					} ),
+					anchor: blockAttributes.anchor,
 				} );
 			},
 		},
 		{
 			type: 'block',
 			blocks: [ 'core/quote' ],
-			transform: ( { value } ) => {
+			transform: ( { value, anchor } ) => {
 				return createBlock( 'core/list', {
 					values: toHTMLString( {
 						value: create( { html: value, multilineTag: 'p' } ),
 						multilineTag: 'li',
 					} ),
+					anchor,
 				} );
 			},
 		},
@@ -86,6 +88,7 @@ const transforms = {
 			transform( node ) {
 				const attributes = {
 					ordered: node.nodeName === 'OL',
+					anchor: node.id === '' ? undefined : node.id,
 				};
 
 				if ( attributes.ordered ) {
@@ -157,7 +160,7 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/quote' ],
-			transform: ( { values } ) => {
+			transform: ( { values, anchor } ) => {
 				return createBlock( 'core/quote', {
 					value: toHTMLString( {
 						value: create( {
@@ -167,6 +170,7 @@ const transforms = {
 						} ),
 						multilineTag: 'p',
 					} ),
+					anchor,
 				} );
 			},
 		},

diff --git a/packages/block-library/src/media-text/block.json b/packages/block-library/src/media-text/block.json
@@ -78,6 +78,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": [
 			"wide",
 			"full"

diff --git a/packages/block-library/src/media-text/transforms.js b/packages/block-library/src/media-text/transforms.js
@@ -8,22 +8,24 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/image' ],
-			transform: ( { alt, url, id } ) =>
+			transform: ( { alt, url, id, anchor } ) =>
 				createBlock( 'core/media-text', {
 					mediaAlt: alt,
 					mediaId: id,
 					mediaUrl: url,
 					mediaType: 'image',
+					anchor,
 				} ),
 		},
 		{
 			type: 'block',
 			blocks: [ 'core/video' ],
-			transform: ( { src, id } ) =>
+			transform: ( { src, id, anchor } ) =>
 				createBlock( 'core/media-text', {
 					mediaId: id,
 					mediaUrl: src,
 					mediaType: 'video',
+					anchor,
 				} ),
 		},
 	],
@@ -34,11 +36,12 @@ const transforms = {
 			isMatch: ( { mediaType, mediaUrl } ) => {
 				return ! mediaUrl || mediaType === 'image';
 			},
-			transform: ( { mediaAlt, mediaId, mediaUrl } ) => {
+			transform: ( { mediaAlt, mediaId, mediaUrl, anchor } ) => {
 				return createBlock( 'core/image', {
 					alt: mediaAlt,
 					id: mediaId,
 					url: mediaUrl,
+					anchor,
 				} );
 			},
 		},
@@ -48,10 +51,11 @@ const transforms = {
 			isMatch: ( { mediaType, mediaUrl } ) => {
 				return ! mediaUrl || mediaType === 'video';
 			},
-			transform: ( { mediaId, mediaUrl } ) => {
+			transform: ( { mediaId, mediaUrl, anchor } ) => {
 				return createBlock( 'core/video', {
 					id: mediaId,
 					src: mediaUrl,
+					anchor,
 				} );
 			},
 		},

diff --git a/packages/block-library/src/paragraph/block.json b/packages/block-library/src/paragraph/block.json
@@ -27,6 +27,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"className": false,
 		"lightBlockWrapper": true,
 		"__experimentalColor": {

diff --git a/packages/block-library/src/paragraph/transforms.js b/packages/block-library/src/paragraph/transforms.js
@@ -18,7 +18,7 @@ const transforms = {
 			schema: ( { phrasingContentSchema, isPaste } ) => ( {
 				p: {
 					children: phrasingContentSchema,
-					attributes: isPaste ? [] : [ 'style' ],
+					attributes: isPaste ? [] : [ 'style', 'id' ],
 				},
 			} ),
 			transform( node ) {

diff --git a/packages/block-library/src/preformatted/block.json b/packages/block-library/src/preformatted/block.json
@@ -11,6 +11,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"lightBlockWrapper": true
 	}
 }
diff --git a/packages/block-library/src/preformatted/transforms.js b/packages/block-library/src/preformatted/transforms.js
@@ -8,9 +8,10 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/code', 'core/paragraph' ],
-			transform: ( { content } ) =>
+			transform: ( { content, anchor } ) =>
 				createBlock( 'core/preformatted', {
 					content,
+					anchor,
 				} ),
 		},
 		{

diff --git a/packages/block-library/src/pullquote/block.json b/packages/block-library/src/pullquote/block.json
@@ -28,6 +28,7 @@
 		}
 	},
 	"supports": {
+		"anchor": true,
 		"align": [
 			"left",
 			"right",