From fe2571addb6b628d1adffaf7e11a7f450091c779 Mon Sep 17 00:00:00 2001
From: Frank Elsinga <frank@elsinga.de>
Date: Sat, 18 Oct 2025 01:42:41 +0200
Subject: [PATCH] fix: remove broken max width from Expression properties
 (#1455)

Before vs after should be self-explanatory what motivated me to remove
the max-width.

<img width="1353" height="762" alt="image"
src="https://github.com/user-attachments/assets/eda0ce6c-5187-4496-bc92-6f91d1aaa5ee"
/>

Resolves https://github.com/maplibre/maputnik/issues/1445

---------

Co-authored-by: Harel M <harel.mazor@gmail.com>
---
 CHANGELOG.md                                     | 1 +
 src/components/InputJson.tsx                     | 7 -------
 src/components/_ExpressionProperty.tsx           | 1 -
 src/components/modals/ModalSourcesTypeEditor.tsx | 1 -
 4 files changed, 1 insertion(+), 9 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9eb84397..a2208e28 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@
 
 ### 🐞 Bug fixes
 
+- Fixed the Expression editor (for long expressions) being able to be float under other components further down
 - Fixed an issue when clicking on a popup and then clicking on the map again
 - Fix modal close button possition
 - Fixed an issue with the generation of tranlations
diff --git a/src/components/InputJson.tsx b/src/components/InputJson.tsx
index 52a0e384..02e36c9f 100644
--- a/src/components/InputJson.tsx
+++ b/src/components/InputJson.tsx
@@ -10,7 +10,6 @@ import type { StylePropertySpecification } from "maplibre-gl";
 
 export type InputJsonProps = {
   value: object
-  maxHeight?: number
   className?: string
   onChange(object: object): void
   onFocus?(...args: unknown[]): unknown
@@ -115,16 +114,10 @@ class InputJsonInternal extends React.Component<InputJsonInternalProps, InputJso
   };
 
   render() {
-    const style = {} as {maxHeight?: number};
-    if (this.props.maxHeight) {
-      style.maxHeight = this.props.maxHeight;
-    }
-
     return <div className="json-editor" data-wd-key="json-editor" aria-hidden="true" style={{cursor: "text"}}>
       <div
         className={classnames("codemirror-container", this.props.className)}
         ref={(el) => {this._el = el;}}
-        style={style}
       />
     </div>;
   }
diff --git a/src/components/_ExpressionProperty.tsx b/src/components/_ExpressionProperty.tsx
index 18214306..e7a6db73 100644
--- a/src/components/_ExpressionProperty.tsx
+++ b/src/components/_ExpressionProperty.tsx
@@ -84,7 +84,6 @@ class ExpressionPropertyInternal extends React.Component<ExpressionPropertyInter
         onFocus={this.props.onFocus}
         onBlur={this.props.onBlur}
         value={value}
-        maxHeight={200}
         onChange={this.props.onChange}
       />
     </Block>;
diff --git a/src/components/modals/ModalSourcesTypeEditor.tsx b/src/components/modals/ModalSourcesTypeEditor.tsx
index bdeff843..4d0c9d9b 100644
--- a/src/components/modals/ModalSourcesTypeEditor.tsx
+++ b/src/components/modals/ModalSourcesTypeEditor.tsx
@@ -260,7 +260,6 @@ class GeoJSONSourceFieldJsonEditor extends React.Component<GeoJSONSourceFieldJso
       <Block label={t("GeoJSON")} fieldSpec={latest.source_geojson.data}>
         <FieldJson
           value={this.props.source.data}
-          maxHeight={200}
           lintType="json"
           onChange={data => {
             this.props.onChange({