From 260abca660a688528f10e95d1dbce34dad5caa63 Mon Sep 17 00:00:00 2001
From: Sagar Vora <16315650+sagarvora@users.noreply.github.com>
Date: Sat, 21 Feb 2026 11:35:17 +0530
Subject: [PATCH] perf: avoid layout thrashing in control input toggle

---
 frappe/public/js/frappe/form/controls/base_input.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/frappe/public/js/frappe/form/controls/base_input.js b/frappe/public/js/frappe/form/controls/base_input.js
index 8e78c6cab7..190a8d4de9 100644
--- a/frappe/public/js/frappe/form/controls/base_input.js
+++ b/frappe/public/js/frappe/form/controls/base_input.js
@@ -26,7 +26,7 @@ frappe.ui.form.ControlInput = class ControlInput extends frappe.ui.form.Control
 					</div>
 					<div class="control-input-wrapper">
 						<div class="control-input"></div>
-						<div class="control-value like-disabled-input" style="display: none;"></div>
+						<div class="control-value like-disabled-input hide"></div>
 						<div class="help-box small text-extra-muted hide"></div>
 					</div>
 				</div>
@@ -115,8 +115,8 @@ frappe.ui.form.ControlInput = class ControlInput extends frappe.ui.form.Control
 			let is_fetch_from_read_only = me.read_only_because_of_fetch_from();
 
 			if (me.can_write() && !is_fetch_from_read_only) {
-				me.disp_area && $(me.disp_area).toggle(false);
-				$(me.input_area).toggle(true);
+				me.disp_area && $(me.disp_area).addClass("hide");
+				$(me.input_area).removeClass("hide");
 				me.$input && me.$input.prop("disabled", false);
 				make_input();
 				update_input();
@@ -125,10 +125,10 @@ frappe.ui.form.ControlInput = class ControlInput extends frappe.ui.form.Control
 					make_input();
 					update_input();
 				} else {
-					$(me.input_area).toggle(false);
+					$(me.input_area).addClass("hide");
 					if (me.disp_area) {
 						me.set_disp_area(me.value);
-						$(me.disp_area).toggle(true);
+						$(me.disp_area).removeClass("hide");
 					}
 				}
 				me.$input && me.$input.prop("disabled", true);