@wordpress/block-library 8.19.6 → 8.20.1

package/build-style/style-rtl.css

@@ -923,7 +923,8 @@
   height: 100%;
   max-width: none;
   max-height: none;
-  object-fit: cover;
+  -o-object-fit: cover;
+     object-fit: cover;
   outline: none;
   border: none;
   box-shadow: none;
@@ -1236,7 +1237,8 @@ section.wp-block-cover-image > h2,
   width: 100%;
   height: 100%;
   flex: 1;
-  object-fit: cover;
+  -o-object-fit: cover;
+     object-fit: cover;
 }
 .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-image, .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-item,
 .blocks-gallery-grid:not(.has-nested-images).columns-1 .blocks-gallery-image,
@@ -1430,7 +1432,8 @@ figure.wp-block-gallery.has-nested-images {
   width: 100%;
   flex: 1 0 0%;
   height: 100%;
-  object-fit: cover;
+  -o-object-fit: cover;
+     object-fit: cover;
 }
 .wp-block-gallery.has-nested-images.columns-1 figure.wp-block-image:not(#individual-image) {
   width: 100%;
@@ -1614,8 +1617,6 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
 
 .wp-lightbox-container {
   position: relative;
-  display: flex;
-  flex-direction: column;
 }
 .wp-lightbox-container button {
   border: none;
@@ -1631,10 +1632,6 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   outline: 5px auto -webkit-focus-ring-color;
   outline-offset: 5px;
 }
-.wp-lightbox-container button:hover, .wp-lightbox-container button:focus, .wp-lightbox-container button:not(:hover):not(:active):not(.has-background) {
-  background: none;
-  border: none;
-}
 
 .wp-lightbox-overlay {
   position: fixed;
@@ -1650,20 +1647,11 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
 }
 .wp-lightbox-overlay .close-button {
   position: absolute;
-  top: calc(env(safe-area-inset-top) + 16px);
-  left: calc(env(safe-area-inset-left) + 16px);
+  top: calc(env(safe-area-inset-top) + 20px);
+  left: calc(env(safe-area-inset-left) + 20px);
   padding: 0;
   cursor: pointer;
   z-index: 5000000;
-  min-width: 40px;
-  min-height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.wp-lightbox-overlay .close-button:hover, .wp-lightbox-overlay .close-button:focus, .wp-lightbox-overlay .close-button:not(:hover):not(:active):not(.has-background) {
-  background: none;
-  border: none;
 }
 .wp-lightbox-overlay .lightbox-image-container {
   position: absolute;
@@ -2973,27 +2961,21 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
 .wp-block-post-template-is-layout-constrained > li > .alignright,
 .wp-block-post-template-is-layout-flow > li > .alignright {
   float: left;
-  -webkit-margin-start: 2em;
-          margin-inline-start: 2em;
-  -webkit-margin-end: 0;
-          margin-inline-end: 0;
+  margin-inline-start: 2em;
+  margin-inline-end: 0;
 }
 
 .wp-block-post-template-is-layout-constrained > li > .alignleft,
 .wp-block-post-template-is-layout-flow > li > .alignleft {
   float: right;
-  -webkit-margin-start: 0;
-          margin-inline-start: 0;
-  -webkit-margin-end: 2em;
-          margin-inline-end: 2em;
+  margin-inline-start: 0;
+  margin-inline-end: 2em;
 }
 
 .wp-block-post-template-is-layout-constrained > li > .aligncenter,
 .wp-block-post-template-is-layout-flow > li > .aligncenter {
-  -webkit-margin-start: auto;
-          margin-inline-start: auto;
-  -webkit-margin-end: auto;
-          margin-inline-end: auto;
+  margin-inline-start: auto;
+  margin-inline-end: auto;
 }
 
 .wp-block-query-pagination > .wp-block-query-pagination-next,
@@ -3008,12 +2990,10 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
   margin-right: 0;
 }
 .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-next:last-of-type {
-  -webkit-margin-start: auto;
-          margin-inline-start: auto;
+  margin-inline-start: auto;
 }
 .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-previous:first-child {
-  -webkit-margin-end: auto;
-          margin-inline-end: auto;
+  margin-inline-end: auto;
 }
 .wp-block-query-pagination .wp-block-query-pagination-previous-arrow {
   margin-left: 1ch;
@@ -3154,13 +3134,15 @@ ul.wp-block-rss.is-grid li {
   min-width: 3rem;
   border: 1px solid #949494;
   text-decoration: unset !important;
-  -webkit-appearance: initial;
-          appearance: initial;
+  appearance: initial;
 }
 
 .wp-block-search.wp-block-search__button-only .wp-block-search__button {
   margin-right: 0;
   flex-shrink: 0;
+  max-width: 100%;
+}
+.wp-block-search.wp-block-search__button-only .wp-block-search__button[aria-expanded=true] {
   max-width: calc(100% - 100px);
 }
 
@@ -3890,7 +3872,8 @@ pre.wp-block-verse {
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {
-    object-fit: cover;
+    -o-object-fit: cover;
+       object-fit: cover;
   }
 }
 .wp-block-video.aligncenter {
@@ -4027,7 +4010,6 @@ a[data-fn].fn::after {
 .screen-reader-text {
   border: 0;
   clip: rect(1px, 1px, 1px, 1px);
-  -webkit-clip-path: inset(50%);
   clip-path: inset(50%);
   height: 1px;
   margin: -1px;
@@ -4041,8 +4023,7 @@ a[data-fn].fn::after {
 .screen-reader-text:focus {
   background-color: #ddd;
   clip: auto !important;
-  -webkit-clip-path: none;
-          clip-path: none;
+  clip-path: none;
   color: #444;
   display: block;
   font-size: 1em;

package/build-style/style.css

@@ -930,7 +930,8 @@
   height: 100%;
   max-width: none;
   max-height: none;
-  object-fit: cover;
+  -o-object-fit: cover;
+     object-fit: cover;
   outline: none;
   border: none;
   box-shadow: none;
@@ -1244,7 +1245,8 @@ section.wp-block-cover-image > h2,
   width: 100%;
   height: 100%;
   flex: 1;
-  object-fit: cover;
+  -o-object-fit: cover;
+     object-fit: cover;
 }
 .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-image, .wp-block-gallery:not(.has-nested-images).columns-1 .blocks-gallery-item,
 .blocks-gallery-grid:not(.has-nested-images).columns-1 .blocks-gallery-image,
@@ -1438,7 +1440,8 @@ figure.wp-block-gallery.has-nested-images {
   width: 100%;
   flex: 1 0 0%;
   height: 100%;
-  object-fit: cover;
+  -o-object-fit: cover;
+     object-fit: cover;
 }
 .wp-block-gallery.has-nested-images.columns-1 figure.wp-block-image:not(#individual-image) {
   width: 100%;
@@ -1628,8 +1631,6 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
 
 .wp-lightbox-container {
   position: relative;
-  display: flex;
-  flex-direction: column;
 }
 .wp-lightbox-container button {
   border: none;
@@ -1645,10 +1646,6 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   outline: 5px auto -webkit-focus-ring-color;
   outline-offset: 5px;
 }
-.wp-lightbox-container button:hover, .wp-lightbox-container button:focus, .wp-lightbox-container button:not(:hover):not(:active):not(.has-background) {
-  background: none;
-  border: none;
-}
 
 .wp-lightbox-overlay {
   position: fixed;
@@ -1664,20 +1661,11 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
 }
 .wp-lightbox-overlay .close-button {
   position: absolute;
-  top: calc(env(safe-area-inset-top) + 16px);
-  right: calc(env(safe-area-inset-right) + 16px);
+  top: calc(env(safe-area-inset-top) + 20px);
+  right: calc(env(safe-area-inset-right) + 20px);
   padding: 0;
   cursor: pointer;
   z-index: 5000000;
-  min-width: 40px;
-  min-height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.wp-lightbox-overlay .close-button:hover, .wp-lightbox-overlay .close-button:focus, .wp-lightbox-overlay .close-button:not(:hover):not(:active):not(.has-background) {
-  background: none;
-  border: none;
 }
 .wp-lightbox-overlay .lightbox-image-container {
   position: absolute;
@@ -3003,27 +2991,21 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
 .wp-block-post-template-is-layout-constrained > li > .alignright,
 .wp-block-post-template-is-layout-flow > li > .alignright {
   float: right;
-  -webkit-margin-start: 2em;
-          margin-inline-start: 2em;
-  -webkit-margin-end: 0;
-          margin-inline-end: 0;
+  margin-inline-start: 2em;
+  margin-inline-end: 0;
 }
 
 .wp-block-post-template-is-layout-constrained > li > .alignleft,
 .wp-block-post-template-is-layout-flow > li > .alignleft {
   float: left;
-  -webkit-margin-start: 0;
-          margin-inline-start: 0;
-  -webkit-margin-end: 2em;
-          margin-inline-end: 2em;
+  margin-inline-start: 0;
+  margin-inline-end: 2em;
 }
 
 .wp-block-post-template-is-layout-constrained > li > .aligncenter,
 .wp-block-post-template-is-layout-flow > li > .aligncenter {
-  -webkit-margin-start: auto;
-          margin-inline-start: auto;
-  -webkit-margin-end: auto;
-          margin-inline-end: auto;
+  margin-inline-start: auto;
+  margin-inline-end: auto;
 }
 
 .wp-block-query-pagination > .wp-block-query-pagination-next,
@@ -3040,12 +3022,10 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
   margin-right: 0;
 }
 .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-next:last-of-type {
-  -webkit-margin-start: auto;
-          margin-inline-start: auto;
+  margin-inline-start: auto;
 }
 .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-previous:first-child {
-  -webkit-margin-end: auto;
-          margin-inline-end: auto;
+  margin-inline-end: auto;
 }
 .wp-block-query-pagination .wp-block-query-pagination-previous-arrow {
   margin-right: 1ch;
@@ -3188,13 +3168,15 @@ ul.wp-block-rss.is-grid li {
   min-width: 3rem;
   border: 1px solid #949494;
   text-decoration: unset !important;
-  -webkit-appearance: initial;
-          appearance: initial;
+  appearance: initial;
 }
 
 .wp-block-search.wp-block-search__button-only .wp-block-search__button {
   margin-left: 0;
   flex-shrink: 0;
+  max-width: 100%;
+}
+.wp-block-search.wp-block-search__button-only .wp-block-search__button[aria-expanded=true] {
   max-width: calc(100% - 100px);
 }
 
@@ -3925,7 +3907,8 @@ pre.wp-block-verse {
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {
-    object-fit: cover;
+    -o-object-fit: cover;
+       object-fit: cover;
   }
 }
 .wp-block-video.aligncenter {
@@ -4064,7 +4047,6 @@ a[data-fn].fn::after {
 .screen-reader-text {
   border: 0;
   clip: rect(1px, 1px, 1px, 1px);
-  -webkit-clip-path: inset(50%);
   clip-path: inset(50%);
   height: 1px;
   margin: -1px;
@@ -4078,8 +4060,7 @@ a[data-fn].fn::after {
 .screen-reader-text:focus {
   background-color: #ddd;
   clip: auto !important;
-  -webkit-clip-path: none;
-          clip-path: none;
+  clip-path: none;
   color: #444;
   display: block;
   font-size: 1em;

package/build-style/video/style-rtl.css

@@ -95,7 +95,8 @@
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {
-    object-fit: cover;
+    -o-object-fit: cover;
+       object-fit: cover;
   }
 }
 .wp-block-video.aligncenter {

package/build-style/video/style.css

@@ -95,7 +95,8 @@
 }
 @supports (position: sticky) {
   .wp-block-video [poster] {
-    object-fit: cover;
+    -o-object-fit: cover;
+       object-fit: cover;
   }
 }
 .wp-block-video.aligncenter {

package/build-types/table-of-contents/list.d.ts

@@ -1,12 +1,14 @@
 /**
- * WordPress dependencies
+ * External dependencies
  */
-import type { WPElement } from '@wordpress/element';
+import type { MouseEvent, ReactElement } from 'react';
 /**
  * Internal dependencies
  */
 import type { NestedHeadingData } from './utils';
-export default function TableOfContentsList({ nestedHeadingList, }: {
+export default function TableOfContentsList({ nestedHeadingList, disableLinkActivation, onClick, }: {
     nestedHeadingList: NestedHeadingData[];
-}): WPElement;
+    disableLinkActivation?: boolean;
+    onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
+}): ReactElement;
 //# sourceMappingURL=list.d.ts.map

package/build-types/table-of-contents/list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../src/table-of-contents/list.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAEpD;;GAEG;AACH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAIjD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAE,EAC5C,iBAAiB,GACjB,EAAE;IACF,iBAAiB,EAAE,iBAAiB,EAAE,CAAC;CACvC,GAAI,SAAS,CA6Bb"}
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../src/table-of-contents/list.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAEtD;;GAEG;AACH,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAIjD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAE,EAC5C,iBAAiB,EACjB,qBAAqB,EACrB,OAAO,GACP,EAAE;IACF,iBAAiB,EAAE,iBAAiB,EAAE,CAAC;IACvC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,OAAO,CAAC,EAAE,CAAE,KAAK,EAAE,UAAU,CAAE,iBAAiB,CAAE,KAAM,IAAI,CAAC;CAC7D,GAAI,YAAY,CAgDhB"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "8.19.6",
+	"version": "8.20.1",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -31,36 +31,36 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.42.6",
-		"@wordpress/api-fetch": "^6.39.6",
-		"@wordpress/autop": "^3.42.6",
-		"@wordpress/blob": "^3.42.6",
-		"@wordpress/block-editor": "^12.10.6",
-		"@wordpress/blocks": "^12.19.6",
-		"@wordpress/components": "^25.8.6",
-		"@wordpress/compose": "^6.19.6",
-		"@wordpress/core-data": "^6.19.6",
-		"@wordpress/data": "^9.12.6",
-		"@wordpress/date": "^4.42.6",
-		"@wordpress/deprecated": "^3.42.6",
-		"@wordpress/dom": "^3.42.6",
-		"@wordpress/element": "^5.19.6",
-		"@wordpress/escape-html": "^2.42.6",
-		"@wordpress/hooks": "^3.42.6",
-		"@wordpress/html-entities": "^3.42.6",
-		"@wordpress/i18n": "^4.42.6",
-		"@wordpress/icons": "^9.33.6",
-		"@wordpress/interactivity": "^2.3.6",
-		"@wordpress/keycodes": "^3.42.6",
-		"@wordpress/notices": "^4.10.6",
-		"@wordpress/primitives": "^3.40.6",
-		"@wordpress/private-apis": "^0.24.6",
-		"@wordpress/reusable-blocks": "^4.19.6",
-		"@wordpress/rich-text": "^6.19.6",
-		"@wordpress/server-side-render": "^4.19.6",
-		"@wordpress/url": "^3.43.6",
-		"@wordpress/viewport": "^5.19.6",
-		"@wordpress/wordcount": "^3.42.6",
+		"@wordpress/a11y": "^3.43.0",
+		"@wordpress/api-fetch": "^6.40.0",
+		"@wordpress/autop": "^3.43.0",
+		"@wordpress/blob": "^3.43.0",
+		"@wordpress/block-editor": "^12.11.1",
+		"@wordpress/blocks": "^12.20.1",
+		"@wordpress/components": "^25.9.1",
+		"@wordpress/compose": "^6.20.0",
+		"@wordpress/core-data": "^6.20.1",
+		"@wordpress/data": "^9.13.1",
+		"@wordpress/date": "^4.43.0",
+		"@wordpress/deprecated": "^3.43.0",
+		"@wordpress/dom": "^3.43.0",
+		"@wordpress/element": "^5.20.0",
+		"@wordpress/escape-html": "^2.43.0",
+		"@wordpress/hooks": "^3.43.0",
+		"@wordpress/html-entities": "^3.43.0",
+		"@wordpress/i18n": "^4.43.0",
+		"@wordpress/icons": "^9.34.0",
+		"@wordpress/interactivity": "^2.4.0",
+		"@wordpress/keycodes": "^3.43.0",
+		"@wordpress/notices": "^4.11.1",
+		"@wordpress/primitives": "^3.41.0",
+		"@wordpress/private-apis": "^0.25.0",
+		"@wordpress/reusable-blocks": "^4.20.1",
+		"@wordpress/rich-text": "^6.20.1",
+		"@wordpress/server-side-render": "^4.20.1",
+		"@wordpress/url": "^3.44.0",
+		"@wordpress/viewport": "^5.20.1",
+		"@wordpress/wordcount": "^3.43.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -78,5 +78,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "640c80ab0fb4e0e2bce87e33895939f257e674df"
+	"gitHead": "e17f760ed0dc11cce78157d7c2f2086b1b3c09d8"
 }

package/src/audio/edit.native.js

@@ -30,7 +30,7 @@ import { audio as icon, replace } from '@wordpress/icons';
 import { useState } from '@wordpress/element';
 import { useDispatch, useSelect } from '@wordpress/data';
 import { store as noticesStore } from '@wordpress/notices';
-import { isURL } from '@wordpress/url';
+import { isURL, getProtocol } from '@wordpress/url';
 
 /**
  * Internal dependencies
@@ -73,7 +73,7 @@ function AudioEdit( {
 
 	function onSelectURL( newSrc ) {
 		if ( newSrc !== src ) {
-			if ( isURL( newSrc ) ) {
+			if ( isURL( newSrc ) && /^https?:/.test( getProtocol( newSrc ) ) ) {
 				setAttributes( { src: newSrc, id: undefined } );
 			} else {
 				createErrorNotice( __( 'Invalid URL. Audio file not found.' ) );

package/src/audio/test/edit.native.js

@@ -1,13 +1,20 @@
 /**
  * External dependencies
  */
-import { render } from 'test/helpers';
+import {
+	addBlock,
+	dismissModal,
+	fireEvent,
+	initializeEditor,
+	render,
+	screen,
+	setupCoreBlocks,
+} from 'test/helpers';
 
 /**
  * WordPress dependencies
  */
 import { BlockEdit } from '@wordpress/block-editor';
-import { registerBlockType, unregisterBlockType } from '@wordpress/blocks';
 import {
 	subscribeMediaUpload,
 	sendMediaUpload,
@@ -16,7 +23,7 @@ import {
 /**
  * Internal dependencies
  */
-import { metadata, settings, name } from '../index';
+import { name } from '../index';
 
 // react-native-aztec shouldn't be mocked because these tests are based on
 // snapshot testing where we want to keep the original component.
@@ -42,18 +49,9 @@ const getTestComponentWithContent = ( attributes = {} ) => {
 	);
 };
 
-describe( 'Audio block', () => {
-	beforeAll( () => {
-		registerBlockType( name, {
-			...metadata,
-			...settings,
-		} );
-	} );
-
-	afterAll( () => {
-		unregisterBlockType( name );
-	} );
+setupCoreBlocks( [ 'core/audio' ] );
 
+describe( 'Audio block', () => {
 	it( 'renders placeholder without crashing', () => {
 		const component = getTestComponentWithContent();
 		const rendered = component.toJSON();
@@ -86,4 +84,20 @@ describe( 'Audio block', () => {
 		const rendered = component.toJSON();
 		expect( rendered ).toMatchSnapshot();
 	} );
+
+	it( 'should gracefully handle invalid URLs', async () => {
+		await initializeEditor();
+
+		await addBlock( screen, 'Audio' );
+		fireEvent.press( screen.getByText( 'Insert from URL' ) );
+		fireEvent.changeText(
+			screen.getByPlaceholderText( 'Type a URL' ),
+			'h://wordpress.org/audio.mp3'
+		);
+		dismissModal( screen.getByTestId( 'bottom-sheet' ) );
+
+		expect(
+			screen.getByText( 'Invalid URL. Audio file not found.' )
+		).toBeVisible();
+	} );
 } );

package/src/button/constants.js

@@ -0,0 +1,3 @@
+export const NEW_TAB_REL = 'noreferrer noopener';
+export const NEW_TAB_TARGET = '_blank';
+export const NOFOLLOW_REL = 'nofollow';

package/src/button/edit.js

@@ -3,6 +3,12 @@
  */
 import classnames from 'classnames';
 
+/**
+ * Internal dependencies
+ */
+import { NEW_TAB_TARGET, NOFOLLOW_REL } from './constants';
+import { getUpdatedLinkAttributes } from './get-updated-link-attributes';
+
 /**
  * WordPress dependencies
  */
@@ -32,9 +38,14 @@ import { displayShortcut, isKeyboardEvent } from '@wordpress/keycodes';
 import { link, linkOff } from '@wordpress/icons';
 import { createBlock } from '@wordpress/blocks';
 import { useMergeRefs } from '@wordpress/compose';
-import { prependHTTP } from '@wordpress/url';
 
-const NEW_TAB_REL = 'noreferrer noopener';
+const LINK_SETTINGS = [
+	...LinkControl.DEFAULT_LINK_SETTINGS,
+	{
+		id: 'nofollow',
+		title: __( 'Mark as nofollow' ),
+	},
+];
 
 function WidthPanel( { selectedWidth, setAttributes } ) {
 	function handleChange( newWidth ) {
@@ -92,22 +103,6 @@ function ButtonEdit( props ) {
 
 	const TagName = tagName || 'a';
 
-	function onToggleOpenInNewTab( value ) {
-		const newLinkTarget = value ? '_blank' : undefined;
-
-		let updatedRel = rel;
-		if ( newLinkTarget && ! rel ) {
-			updatedRel = NEW_TAB_REL;
-		} else if ( ! newLinkTarget && rel === NEW_TAB_REL ) {
-			updatedRel = undefined;
-		}
-
-		setAttributes( {
-			linkTarget: newLinkTarget,
-			rel: updatedRel,
-		} );
-	}
-
 	function setButtonText( newText ) {
 		// Remove anchor tags from button text content.
 		setAttributes( { text: newText.replace( /<\/?a[^>]*>/g, '' ) } );
@@ -138,7 +133,8 @@ function ButtonEdit( props ) {
 
 	const [ isEditingURL, setIsEditingURL ] = useState( false );
 	const isURLSet = !! url;
-	const opensInNewTab = linkTarget === '_blank';
+	const opensInNewTab = linkTarget === NEW_TAB_TARGET;
+	const nofollow = !! rel?.includes( NOFOLLOW_REL );
 	const isLinkTag = 'a' === TagName;
 
 	function startEditing( event ) {
@@ -164,8 +160,8 @@ function ButtonEdit( props ) {
 	// Memoize link value to avoid overriding the LinkControl's internal state.
 	// This is a temporary fix. See https://github.com/WordPress/gutenberg/issues/51256.
 	const linkValue = useMemo(
-		() => ( { url, opensInNewTab } ),
-		[ url, opensInNewTab ]
+		() => ( { url, opensInNewTab, nofollow } ),
+		[ url, opensInNewTab, nofollow ]
 	);
 
 	return (
@@ -256,20 +252,25 @@ function ButtonEdit( props ) {
 					<LinkControl
 						value={ linkValue }
 						onChange={ ( {
-							url: newURL = '',
+							url: newURL,
 							opensInNewTab: newOpensInNewTab,
-						} ) => {
-							setAttributes( { url: prependHTTP( newURL ) } );
-
-							if ( opensInNewTab !== newOpensInNewTab ) {
-								onToggleOpenInNewTab( newOpensInNewTab );
-							}
-						} }
+							nofollow: newNofollow,
+						} ) =>
+							setAttributes(
+								getUpdatedLinkAttributes( {
+									rel,
+									url: newURL,
+									opensInNewTab: newOpensInNewTab,
+									nofollow: newNofollow,
+								} )
+							)
+						}
 						onRemove={ () => {
 							unlink();
 							richTextRef.current?.focus();
 						} }
 						forceIsEditingLink={ isEditingURL }
+						settings={ LINK_SETTINGS }
 					/>
 				</Popover>
 			) }