From 189b35b1652ffabf67f1f44ab0d8879ab5565a00 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Mon, 9 Sep 2024 19:55:29 +0530
Subject: [PATCH 01/11] replace input with InputControl

---
 .../src/components/link-control/index.js      | 30 +++++++++++--------
 .../components/link-control/search-input.js   |  4 +--
 .../src/components/url-input/index.js         | 14 ++++-----
 3 files changed, 26 insertions(+), 22 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 2024aca998caac..5965ae600ef94d 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -404,20 +404,24 @@ function LinkControl( {
 								createSuggestionButtonText
 							}
 							hideLabelFromVision={ ! showTextControl }
+							// Passing the Button component as a suffix prop
+							suffix={
+								showActions ? null : (
+									<Button
+										// TODO: Switch to true (40px size) if possible
+										__next40pxDefaultSize={ false }
+										onClick={
+											isDisabled ? noop : handleSubmit
+										}
+										label={ __( 'Submit' ) }
+										icon={ keyboardReturn }
+										className="block-editor-link-control__search-submit"
+										aria-disabled={ isDisabled }
+									/>
+								)
+							}
+							props
 						/>
-						{ ! showActions && (
-							<div className="block-editor-link-control__search-enter">
-								<Button
-									// TODO: Switch to `true` (40px size) if possible
-									__next40pxDefaultSize={ false }
-									onClick={ isDisabled ? noop : handleSubmit }
-									label={ __( 'Submit' ) }
-									icon={ keyboardReturn }
-									className="block-editor-link-control__search-submit"
-									aria-disabled={ isDisabled }
-								/>
-							</div>
-						) }
 					</div>
 					{ errorMessage && (
 						<Notice
diff --git a/packages/block-editor/src/components/link-control/search-input.js b/packages/block-editor/src/components/link-control/search-input.js
index 3a5dcd4148e951..2759bc60457cd2 100644
--- a/packages/block-editor/src/components/link-control/search-input.js
+++ b/packages/block-editor/src/components/link-control/search-input.js
@@ -12,7 +12,6 @@ import { URLInput } from '../';
 import LinkControlSearchResults from './search-results';
 import { CREATE_TYPE } from './constants';
 import useSearchHandler from './use-search-handler';
-
 // Must be a function as otherwise URLInput will default
 // to the fetchLinkSuggestions passed in block editor settings
 // which will cause an unintended http request.
@@ -43,6 +42,7 @@ const LinkControlSearchInput = forwardRef(
 			withURLSuggestion = true,
 			createSuggestionButtonText,
 			hideLabelFromVision = false,
+			suffix = null,
 		},
 		ref
 	) => {
@@ -114,7 +114,6 @@ const LinkControlSearchInput = forwardRef(
 				);
 			}
 		};
-
 		return (
 			<div className="block-editor-link-control__search-input-container">
 				<URLInput
@@ -147,6 +146,7 @@ const LinkControlSearchInput = forwardRef(
 						}
 					} }
 					ref={ ref }
+					suffix={ suffix }
 				/>
 				{ children }
 			</div>
diff --git a/packages/block-editor/src/components/url-input/index.js b/packages/block-editor/src/components/url-input/index.js
index 9a5c589a44a047..eb17259d0c3063 100644
--- a/packages/block-editor/src/components/url-input/index.js
+++ b/packages/block-editor/src/components/url-input/index.js
@@ -12,6 +12,7 @@ import { UP, DOWN, ENTER, TAB } from '@wordpress/keycodes';
 import {
 	BaseControl,
 	Button,
+	__experimentalInputControl as InputControl,
 	Spinner,
 	withSpokenMessages,
 	Popover,
@@ -24,7 +25,6 @@ import {
 } from '@wordpress/compose';
 import { withSelect } from '@wordpress/data';
 import { isURL } from '@wordpress/url';
-
 /**
  * Internal dependencies
  */
@@ -235,7 +235,8 @@ class URLInput extends Component {
 	}
 
 	onChange( event ) {
-		this.props.onChange( event.target.value );
+		this.props.onChange( event );
+		// this.props.onChange( event.target.value );
 	}
 
 	onFocus() {
@@ -424,7 +425,7 @@ class URLInput extends Component {
 			value = '',
 			hideLabelFromVision = false,
 		} = this.props;
-
+		// console.log( 'Hello', this.props );
 		const {
 			loading,
 			showSuggestions,
@@ -443,7 +444,6 @@ class URLInput extends Component {
 			} ),
 			hideLabelFromVision,
 		};
-
 		const inputProps = {
 			id: inputId,
 			value,
@@ -464,15 +464,15 @@ class URLInput extends Component {
 					? `${ suggestionOptionIdPrefix }-${ selectedSuggestion }`
 					: undefined,
 			ref: this.inputRef,
+			suffix: this.props.suffix,
 		};
-
 		if ( renderControl ) {
 			return renderControl( controlProps, inputProps, loading );
 		}
-
 		return (
 			<BaseControl __nextHasNoMarginBottom { ...controlProps }>
-				<input { ...inputProps } />
+				<InputControl { ...inputProps } __next40pxDefaultSize />
+				{ /* <input { ...inputProps } /> */ }
 				{ loading && <Spinner /> }
 			</BaseControl>
 		);

From 351dbf18388f67f8660caa3cf16e8ebaee057217 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <51887323+rahulharpal1603@users.noreply.github.com>
Date: Wed, 11 Sep 2024 21:55:57 +0530
Subject: [PATCH 02/11] change the code so that the suffix prop remains
 undefined if not assigned any component

---
 .../block-editor/src/components/link-control/search-input.js    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/block-editor/src/components/link-control/search-input.js b/packages/block-editor/src/components/link-control/search-input.js
index 2759bc60457cd2..423de7f78e1358 100644
--- a/packages/block-editor/src/components/link-control/search-input.js
+++ b/packages/block-editor/src/components/link-control/search-input.js
@@ -42,7 +42,7 @@ const LinkControlSearchInput = forwardRef(
 			withURLSuggestion = true,
 			createSuggestionButtonText,
 			hideLabelFromVision = false,
-			suffix = null,
+			suffix,
 		},
 		ref
 	) => {

From d3193d7176b8f8d6067d81c9ad97448cb031fd15 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <51887323+rahulharpal1603@users.noreply.github.com>
Date: Wed, 11 Sep 2024 21:56:31 +0530
Subject: [PATCH 03/11] Update
 packages/block-editor/src/components/link-control/index.js

skips passing a prop when suffix isn't needed.

Co-authored-by: Marco Ciampini <marco.ciampo@gmail.com>
---
 packages/block-editor/src/components/link-control/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 5965ae600ef94d..f7d1c68569cacb 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -406,7 +406,7 @@ function LinkControl( {
 							hideLabelFromVision={ ! showTextControl }
 							// Passing the Button component as a suffix prop
 							suffix={
-								showActions ? null : (
+								showActions ? undefined : (
 									<Button
 										// TODO: Switch to true (40px size) if possible
 										__next40pxDefaultSize={ false }

From 6d975277c55cd11bdde47c814b5d46b98061cb39 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <51887323+rahulharpal1603@users.noreply.github.com>
Date: Wed, 11 Sep 2024 21:59:23 +0530
Subject: [PATCH 04/11] Update index.js

---
 packages/block-editor/src/components/url-input/index.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/block-editor/src/components/url-input/index.js b/packages/block-editor/src/components/url-input/index.js
index eb17259d0c3063..e1066d46aab82b 100644
--- a/packages/block-editor/src/components/url-input/index.js
+++ b/packages/block-editor/src/components/url-input/index.js
@@ -234,9 +234,8 @@ class URLInput extends Component {
 		this.suggestionsRequest = request;
 	}
 
-	onChange( event ) {
-		this.props.onChange( event );
-		// this.props.onChange( event.target.value );
+	onChange( newValue ) {
+		this.props.onChange( newValue );
 	}
 
 	onFocus() {

From 95e9e3ffa36ab9ca5939d8c885ecd24b1de75ef5 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Wed, 11 Sep 2024 23:12:16 +0530
Subject: [PATCH 05/11] minor changes, removed unnecessary comments

---
 packages/block-editor/src/components/url-input/index.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/packages/block-editor/src/components/url-input/index.js b/packages/block-editor/src/components/url-input/index.js
index e1066d46aab82b..1bed810b8d146c 100644
--- a/packages/block-editor/src/components/url-input/index.js
+++ b/packages/block-editor/src/components/url-input/index.js
@@ -424,7 +424,6 @@ class URLInput extends Component {
 			value = '',
 			hideLabelFromVision = false,
 		} = this.props;
-		// console.log( 'Hello', this.props );
 		const {
 			loading,
 			showSuggestions,
@@ -471,7 +470,6 @@ class URLInput extends Component {
 		return (
 			<BaseControl __nextHasNoMarginBottom { ...controlProps }>
 				<InputControl { ...inputProps } __next40pxDefaultSize />
-				{ /* <input { ...inputProps } /> */ }
 				{ loading && <Spinner /> }
 			</BaseControl>
 		);

From 5e2e3cfe55774895ede606318b66a936fb24d84a Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Wed, 11 Sep 2024 23:45:13 +0530
Subject: [PATCH 06/11] retrigger checks


From 93ddf9cca0fbfacd4aa7266d0c3576c7084819e7 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Thu, 12 Sep 2024 11:36:25 +0530
Subject: [PATCH 07/11] added the newlines back for better readability

---
 .../block-editor/src/components/link-control/search-input.js | 2 ++
 packages/block-editor/src/components/url-input/index.js      | 5 +++++
 2 files changed, 7 insertions(+)

diff --git a/packages/block-editor/src/components/link-control/search-input.js b/packages/block-editor/src/components/link-control/search-input.js
index 423de7f78e1358..f41884092e4894 100644
--- a/packages/block-editor/src/components/link-control/search-input.js
+++ b/packages/block-editor/src/components/link-control/search-input.js
@@ -12,6 +12,7 @@ import { URLInput } from '../';
 import LinkControlSearchResults from './search-results';
 import { CREATE_TYPE } from './constants';
 import useSearchHandler from './use-search-handler';
+
 // Must be a function as otherwise URLInput will default
 // to the fetchLinkSuggestions passed in block editor settings
 // which will cause an unintended http request.
@@ -114,6 +115,7 @@ const LinkControlSearchInput = forwardRef(
 				);
 			}
 		};
+
 		return (
 			<div className="block-editor-link-control__search-input-container">
 				<URLInput
diff --git a/packages/block-editor/src/components/url-input/index.js b/packages/block-editor/src/components/url-input/index.js
index 1bed810b8d146c..4ea8966e327a50 100644
--- a/packages/block-editor/src/components/url-input/index.js
+++ b/packages/block-editor/src/components/url-input/index.js
@@ -25,6 +25,7 @@ import {
 } from '@wordpress/compose';
 import { withSelect } from '@wordpress/data';
 import { isURL } from '@wordpress/url';
+
 /**
  * Internal dependencies
  */
@@ -424,6 +425,7 @@ class URLInput extends Component {
 			value = '',
 			hideLabelFromVision = false,
 		} = this.props;
+
 		const {
 			loading,
 			showSuggestions,
@@ -442,6 +444,7 @@ class URLInput extends Component {
 			} ),
 			hideLabelFromVision,
 		};
+
 		const inputProps = {
 			id: inputId,
 			value,
@@ -464,9 +467,11 @@ class URLInput extends Component {
 			ref: this.inputRef,
 			suffix: this.props.suffix,
 		};
+
 		if ( renderControl ) {
 			return renderControl( controlProps, inputProps, loading );
 		}
+
 		return (
 			<BaseControl __nextHasNoMarginBottom { ...controlProps }>
 				<InputControl { ...inputProps } __next40pxDefaultSize />

From b10d627bf18c83f4879929f8fb8f4810654aec4b Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Mon, 16 Sep 2024 00:12:16 +0530
Subject: [PATCH 08/11] Made LinkControl and Social Icons Consistent, fixed the
 auto-fill highlight issue and finally cleaned up the CSS which was irrelevant
 after replacing input tag with InputControl

---
 .../src/components/link-control/index.js      | 26 +++++++++++--------
 .../src/components/link-control/style.scss    | 11 +++++---
 .../src/components/url-input/index.js         |  1 -
 .../src/components/url-input/style.scss       |  8 ------
 .../block-library/src/social-link/edit.js     | 20 +++++++++-----
 5 files changed, 36 insertions(+), 30 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index f7d1c68569cacb..1f678f154d7115 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -12,6 +12,7 @@ import {
 	Notice,
 	TextControl,
 	__experimentalHStack as HStack,
+	__experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useRef, useState, useEffect } from '@wordpress/element';
@@ -407,17 +408,20 @@ function LinkControl( {
 							// Passing the Button component as a suffix prop
 							suffix={
 								showActions ? undefined : (
-									<Button
-										// TODO: Switch to true (40px size) if possible
-										__next40pxDefaultSize={ false }
-										onClick={
-											isDisabled ? noop : handleSubmit
-										}
-										label={ __( 'Submit' ) }
-										icon={ keyboardReturn }
-										className="block-editor-link-control__search-submit"
-										aria-disabled={ isDisabled }
-									/>
+									<InputControlSuffixWrapper variant="control">
+										<Button
+											// TODO: Switch to true (40px size) if possible
+											__next40pxDefaultSize={ false }
+											onClick={
+												isDisabled ? noop : handleSubmit
+											}
+											label={ __( 'Submit' ) }
+											icon={ keyboardReturn }
+											className="block-editor-link-control__search-submit"
+											aria-disabled={ isDisabled }
+											size="small"
+										/>
+									</InputControlSuffixWrapper>
 								)
 							}
 							props
diff --git a/packages/block-editor/src/components/link-control/style.scss b/packages/block-editor/src/components/link-control/style.scss
index b0a5f6af2651b3..d880c1329df7ea 100644
--- a/packages/block-editor/src/components/link-control/style.scss
+++ b/packages/block-editor/src/components/link-control/style.scss
@@ -72,9 +72,8 @@ $block-editor-link-control-number-of-actions: 1;
 		color: $gray-900;
 	}
 
-	input[type="text"],
-	// Specificity overide of URLInput defaults.
-	&.block-editor-url-input input[type="text"].block-editor-url-input__input {
+	input[type="text"]
+	{
 		@include input-control;
 		display: block;
 		border: $border-width solid $gray-600;
@@ -88,6 +87,12 @@ $block-editor-link-control-number-of-actions: 1;
 			padding-right: $grid-unit-20;
 		}
 	}
+	//Specificity override of URL input defaults
+	.components-input-control input[type="text"].components-input-control__input
+	{
+		border:none;
+		width: 100%;
+	}
 }
 
 .block-editor-link-control__search-error {
diff --git a/packages/block-editor/src/components/url-input/index.js b/packages/block-editor/src/components/url-input/index.js
index 4ea8966e327a50..25c033e88749bb 100644
--- a/packages/block-editor/src/components/url-input/index.js
+++ b/packages/block-editor/src/components/url-input/index.js
@@ -449,7 +449,6 @@ class URLInput extends Component {
 			id: inputId,
 			value,
 			required: true,
-			className: 'block-editor-url-input__input',
 			type: 'text',
 			onChange: this.onChange,
 			onFocus: this.onFocus,
diff --git a/packages/block-editor/src/components/url-input/style.scss b/packages/block-editor/src/components/url-input/style.scss
index 5afb22269765e2..efc5edd4965cd2 100644
--- a/packages/block-editor/src/components/url-input/style.scss
+++ b/packages/block-editor/src/components/url-input/style.scss
@@ -32,10 +32,6 @@ $input-size: 300px;
 	&.is-full-width {
 		width: 100%;
 
-		.block-editor-url-input__input[type="text"] {
-			width: 100%;
-		}
-
 		&__suggestions {
 			width: 100%;
 		}
@@ -49,10 +45,6 @@ $input-size: 300px;
 	}
 }
 
-.block-editor-url-input__input[type="text"] {
-	@include input-control;
-}
-
 // Suggestions
 .block-editor-url-input__suggestions {
 	max-height: 200px;
diff --git a/packages/block-library/src/social-link/edit.js b/packages/block-library/src/social-link/edit.js
index 65d85c0400116f..9e73812cc0c869 100644
--- a/packages/block-library/src/social-link/edit.js
+++ b/packages/block-library/src/social-link/edit.js
@@ -22,6 +22,7 @@ import {
 	PanelBody,
 	PanelRow,
 	TextControl,
+	__experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { keyboardReturn } from '@wordpress/icons';
@@ -78,15 +79,20 @@ const SocialLinkURLPopover = ( {
 							}
 							removeBlock( clientId );
 						} }
+						suffix={
+							<InputControlSuffixWrapper variant="control">
+								<Button
+									// TODO: Switch to `true` (40px size) if possible.
+									__next40pxDefaultSize={ false }
+									icon={ keyboardReturn }
+									label={ __( 'Apply' ) }
+									type="submit"
+									size="small"
+								/>
+							</InputControlSuffixWrapper>
+						}
 					/>
 				</div>
-				<Button
-					// TODO: Switch to `true` (40px size) if possible.
-					__next40pxDefaultSize={ false }
-					icon={ keyboardReturn }
-					label={ __( 'Apply' ) }
-					type="submit"
-				/>
 			</form>
 		</URLPopover>
 	);

From 57ed838dcf0dde4561004b95d90fe3486fdd7c61 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Mon, 16 Sep 2024 00:52:46 +0530
Subject: [PATCH 09/11] Lint Issues Fix

---
 .../block-editor/src/components/link-control/style.scss   | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/style.scss b/packages/block-editor/src/components/link-control/style.scss
index d880c1329df7ea..c760bbad73411f 100644
--- a/packages/block-editor/src/components/link-control/style.scss
+++ b/packages/block-editor/src/components/link-control/style.scss
@@ -72,8 +72,7 @@ $block-editor-link-control-number-of-actions: 1;
 		color: $gray-900;
 	}
 
-	input[type="text"]
-	{
+	input[type="text"] {
 		@include input-control;
 		display: block;
 		border: $border-width solid $gray-600;
@@ -88,9 +87,8 @@ $block-editor-link-control-number-of-actions: 1;
 		}
 	}
 	//Specificity override of URL input defaults
-	.components-input-control input[type="text"].components-input-control__input
-	{
-		border:none;
+	.components-input-control input[type="text"].components-input-control__input {
+		border: none;
 		width: 100%;
 	}
 }

From a2ef826c92f7fdedaa339b2d3ebfa911d0671456 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Wed, 18 Sep 2024 13:07:15 +0530
Subject: [PATCH 10/11] More CSS cleanup plus misc cleanup

---
 .../src/components/link-control/index.js      |  5 +--
 .../src/components/link-control/style.scss    | 30 +++-----------
 .../src/components/url-input/style.scss       | 39 ++++++++++---------
 .../block-library/src/social-link/edit.js     |  2 -
 4 files changed, 27 insertions(+), 49 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 1f678f154d7115..f9e2e0bc6d790e 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -384,7 +384,7 @@ function LinkControl( {
 								value={ internalControlValue?.title }
 								onChange={ setInternalTextInputValue }
 								onKeyDown={ handleSubmitWithEnter }
-								size="__unstable-large"
+								__next40pxDefaultSize
 							/>
 						) }
 						<LinkControlSearchInput
@@ -405,13 +405,10 @@ function LinkControl( {
 								createSuggestionButtonText
 							}
 							hideLabelFromVision={ ! showTextControl }
-							// Passing the Button component as a suffix prop
 							suffix={
 								showActions ? undefined : (
 									<InputControlSuffixWrapper variant="control">
 										<Button
-											// TODO: Switch to true (40px size) if possible
-											__next40pxDefaultSize={ false }
 											onClick={
 												isDisabled ? noop : handleSubmit
 											}
diff --git a/packages/block-editor/src/components/link-control/style.scss b/packages/block-editor/src/components/link-control/style.scss
index c760bbad73411f..44a3a8dd2d201b 100644
--- a/packages/block-editor/src/components/link-control/style.scss
+++ b/packages/block-editor/src/components/link-control/style.scss
@@ -57,12 +57,17 @@ $block-editor-link-control-number-of-actions: 1;
 .block-editor-link-control__search-input-wrapper {
 	margin-bottom: $grid-unit-10;
 	position: relative;
+	//Specificity override for URLInput:
+	.block-editor-link-control__search-input-container .block-editor-link-control__field {
+		width: auto;
+	}
 }
 
 // Provides positioning context for search actions
 .block-editor-link-control__search-input-container,
 .block-editor-link-control__search-input-wrapper {
 	position: relative;
+
 }
 
 .block-editor-link-control__field {
@@ -72,37 +77,12 @@ $block-editor-link-control-number-of-actions: 1;
 		color: $gray-900;
 	}
 
-	input[type="text"] {
-		@include input-control;
-		display: block;
-		border: $border-width solid $gray-600;
-		height: $button-size-next-default-40px; // components do not properly support unstable-large yet.
-		margin: 0;
-		padding: $grid-unit-10 $button-size-next-default-40px $grid-unit-10 $grid-unit-20;
-		position: relative;
-		width: 100%;
-
-		.has-actions & {
-			padding-right: $grid-unit-20;
-		}
-	}
-	//Specificity override of URL input defaults
-	.components-input-control input[type="text"].components-input-control__input {
-		border: none;
-		width: 100%;
-	}
 }
 
 .block-editor-link-control__search-error {
 	margin: -$grid-unit-20 * 0.5 $grid-unit-20 $grid-unit-20; // negative margin to bring the error a bit closer to the button
 }
 
-.block-editor-link-control__search-enter {
-	position: absolute;
-	right: 19px; // specific to place the button properly.
-	top: 3px;
-}
-
 .block-editor-link-control__search-actions {
 	padding: $grid-unit-10 $grid-unit-20 $grid-unit-20;
 }
diff --git a/packages/block-editor/src/components/url-input/style.scss b/packages/block-editor/src/components/url-input/style.scss
index efc5edd4965cd2..12a1b8d281e97c 100644
--- a/packages/block-editor/src/components/url-input/style.scss
+++ b/packages/block-editor/src/components/url-input/style.scss
@@ -9,24 +9,27 @@ $input-size: 300px;
 	position: relative;
 	padding: 1px;
 
-	input[type="text"] {
-		width: 100%;
-		@include break-small() {
-			width: $input-size;
-		}
-		padding: $input-padding;
-		margin-left: 0;
-		margin-right: 0;
-
-		/* Fonts smaller than 16px causes mobile safari to zoom. */
-		font-size: $mobile-text-min-font-size;
-		@include break-small {
-			font-size: $default-font-size;
-		}
-
-		&::-ms-clear {
-			display: none;
-		}
+	// input[type="text"] {
+	// 	width: 100%;
+	// 	@include break-small() {
+	// 		width: $input-size;
+	// }
+	// 	padding: $input-padding;
+	// 	margin-left: 0;
+	// 	margin-right: 0;
+
+	// 	/* Fonts smaller than 16px causes mobile safari to zoom. */
+	// 	font-size: $mobile-text-min-font-size;
+	// 	@include break-small {
+	// 		font-size: $default-font-size;
+	// 	}
+
+	// 	&::-ms-clear {
+	// 		display: none;
+	// 	}
+	// }
+	@include break-small() {
+		width: $input-size;
 	}
 
 	&.is-full-width {
diff --git a/packages/block-library/src/social-link/edit.js b/packages/block-library/src/social-link/edit.js
index 9e73812cc0c869..47af181bfe17e8 100644
--- a/packages/block-library/src/social-link/edit.js
+++ b/packages/block-library/src/social-link/edit.js
@@ -82,8 +82,6 @@ const SocialLinkURLPopover = ( {
 						suffix={
 							<InputControlSuffixWrapper variant="control">
 								<Button
-									// TODO: Switch to `true` (40px size) if possible.
-									__next40pxDefaultSize={ false }
 									icon={ keyboardReturn }
 									label={ __( 'Apply' ) }
 									type="submit"

From 9f78165626d5786e36457a6a383b498b43c88df6 Mon Sep 17 00:00:00 2001
From: Rahul Harpal <rahulharpal91@gmail.com>
Date: Wed, 18 Sep 2024 16:24:24 +0530
Subject: [PATCH 11/11] CSS cleanup

---
 .../src/components/link-control/style.scss    |  5 -----
 .../src/components/url-input/style.scss       | 22 ++-----------------
 2 files changed, 2 insertions(+), 25 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/style.scss b/packages/block-editor/src/components/link-control/style.scss
index 44a3a8dd2d201b..16493e1a5aa7f0 100644
--- a/packages/block-editor/src/components/link-control/style.scss
+++ b/packages/block-editor/src/components/link-control/style.scss
@@ -57,17 +57,12 @@ $block-editor-link-control-number-of-actions: 1;
 .block-editor-link-control__search-input-wrapper {
 	margin-bottom: $grid-unit-10;
 	position: relative;
-	//Specificity override for URLInput:
-	.block-editor-link-control__search-input-container .block-editor-link-control__field {
-		width: auto;
-	}
 }
 
 // Provides positioning context for search actions
 .block-editor-link-control__search-input-container,
 .block-editor-link-control__search-input-wrapper {
 	position: relative;
-
 }
 
 .block-editor-link-control__field {
diff --git a/packages/block-editor/src/components/url-input/style.scss b/packages/block-editor/src/components/url-input/style.scss
index 12a1b8d281e97c..155a594bae5f23 100644
--- a/packages/block-editor/src/components/url-input/style.scss
+++ b/packages/block-editor/src/components/url-input/style.scss
@@ -9,27 +9,9 @@ $input-size: 300px;
 	position: relative;
 	padding: 1px;
 
-	// input[type="text"] {
-	// 	width: 100%;
-	// 	@include break-small() {
-	// 		width: $input-size;
-	// }
-	// 	padding: $input-padding;
-	// 	margin-left: 0;
-	// 	margin-right: 0;
-
-	// 	/* Fonts smaller than 16px causes mobile safari to zoom. */
-	// 	font-size: $mobile-text-min-font-size;
-	// 	@include break-small {
-	// 		font-size: $default-font-size;
-	// 	}
-
-	// 	&::-ms-clear {
-	// 		display: none;
-	// 	}
-	// }
 	@include break-small() {
-		width: $input-size;
+		min-width: $input-size;
+		width: auto;
 	}
 
 	&.is-full-width {