From 8e84c47554964a0eeb02349638ca8235698c43a1 Mon Sep 17 00:00:00 2001
From: Lena Morita <lena@jaguchi.com>
Date: Fri, 16 Aug 2024 06:30:54 +0900
Subject: [PATCH] NumberControl: Add lint rule for 40px size prop usage

---
 .eslintrc.js                                               | 1 +
 .../src/components/line-height-control/README.md           | 7 +++++++
 .../src/components/line-height-control/index.js            | 3 +++
 3 files changed, 11 insertions(+)

diff --git a/.eslintrc.js b/.eslintrc.js
index 2cdbb5c056cb14..c1da0bb18b532b 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -315,6 +315,7 @@ module.exports = {
 						'BorderControl',
 						'DimensionControl',
 						'FontSizePicker',
+						'NumberControl',
 						'ToggleGroupControl',
 					].map( ( componentName ) => ( {
 						// Falsy `__next40pxDefaultSize` without a non-default `size` prop.
diff --git a/packages/block-editor/src/components/line-height-control/README.md b/packages/block-editor/src/components/line-height-control/README.md
index dafad9145022b9..89bcc69622367f 100644
--- a/packages/block-editor/src/components/line-height-control/README.md
+++ b/packages/block-editor/src/components/line-height-control/README.md
@@ -36,6 +36,13 @@ The value of the line height.
 
 A callback function that handles the application of the line height value.
 
+#### `__next40pxDefaultSize`
+
+- **Type:** `boolean`
+- **Default:** `false`
+
+Start opting into the larger default height that will become the default size in a future version.
+
 ## Related components
 
 Block Editor components are components that can be used to compose the UI of your block editor. Thus, they can only be used under a [`BlockEditorProvider`](https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/provider/README.md) in the components tree.
diff --git a/packages/block-editor/src/components/line-height-control/index.js b/packages/block-editor/src/components/line-height-control/index.js
index d605aea3d2ef18..b2c99c03f87840 100644
--- a/packages/block-editor/src/components/line-height-control/index.js
+++ b/packages/block-editor/src/components/line-height-control/index.js
@@ -16,6 +16,8 @@ import {
 } from './utils';
 
 const LineHeightControl = ( {
+	/** Start opting into the larger default height that will become the default size in a future version. */
+	__next40pxDefaultSize = false,
 	value: lineHeight,
 	onChange,
 	__unstableInputWidth = '60px',
@@ -91,6 +93,7 @@ const LineHeightControl = ( {
 		<div className="block-editor-line-height-control">
 			<NumberControl
 				{ ...otherProps }
+				__next40pxDefaultSize={ __next40pxDefaultSize }
 				__unstableInputWidth={ __unstableInputWidth }
 				__unstableStateReducer={ stateReducer }
 				onChange={ handleOnChange }