From 9eb668ab30c9f99db8c40727e8fdcaeb5c941739 Mon Sep 17 00:00:00 2001
From: Nick O'Leary <nick.oleary@gmail.com>
Date: Mon, 19 Apr 2021 15:28:17 +0100
Subject: [PATCH] Prevent TypedInput label overflowing element

Also adds title attribute to the button for the label so it gets a tooltip
---
 .../@node-red/editor-client/src/js/ui/common/typedInput.js   | 5 +++++
 .../editor-client/src/sass/ui/common/typedInput.scss         | 4 ++--
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js b/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js
index 5da62c74a..764c6185c 100644
--- a/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js
+++ b/packages/node_modules/@node-red/editor-client/src/js/ui/common/typedInput.js
@@ -773,6 +773,11 @@
                     if (opt.hasValue === false || (opt.showLabel !== false && !opt.icon)) {
                         this.selectLabel.text(opt.label);
                     }
+                    if (opt.label) {
+                        this.selectTrigger.attr("title",opt.label);
+                    } else {
+                        this.selectTrigger.attr("title","");
+                    }
                     if (opt.hasValue === false) {
                         this.selectTrigger.addClass("red-ui-typedInput-full-width");
                     } else {
diff --git a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss
index 14cb3f70e..2b12fffea 100644
--- a/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss
+++ b/packages/node_modules/@node-red/editor-client/src/sass/ui/common/typedInput.scss
@@ -24,7 +24,7 @@
     margin: 0;
     vertical-align: middle;
     box-sizing: border-box;
-    overflow:visible;
+    overflow: hidden;
     position: relative;
     &[disabled] {
         input, button {
@@ -33,7 +33,7 @@
             cursor: not-allowed;
         }
     }
-    
+
     .red-ui-typedInput-input-wrap {
         flex-grow: 1;
     }