Elastic: Fix text selection in recipient inputs (#7129)

CHANGELOG

@@ -5,6 +5,7 @@ CHANGELOG Roundcube Webmail
 - Enigma: Fix so using list checkbox selection does not load the key preview frame
 - Password: Make chpass-wrapper.py Python 3 compatible (#7135)
 - Elastic: Fix bug where it was possible to switch editor mode when 'htmleditor' was in 'dont_override' (#7143)
+- Elastic: Fix text selection in recipient inputs (#7129)
 - Fix regression where "Open in new window" action didn't work (#7155)
 - Fix PHP Warning: array_filter() expects parameter 1 to be array, null given in subscriptions_option plugin (#7165)
 - Fix unexpected error message when mail refresh involves folder auto-unsubscribe (#6923)

skins/elastic/styles/widgets/forms.less

@@ -957,7 +957,6 @@ html.ms .propform {
     .name {
         .overflow-ellipsis;
         flex-grow: 1;
-        display: inline-block;
         line-height: 1.1;
         padding: floor(.25 * @page-font-size);
         vertical-align: middle;
@@ -990,6 +989,10 @@ html.ms .propform {
 
     li {
         max-width: 100%;
+
+        &:not(.recipient) {
+            user-select: text;
+        }
     }
 
     input {

skins/elastic/ui.js

@@ -3112,9 +3112,9 @@ function rcube_elastic_ui()
      */
     function recipient_input(obj)
     {
-        var list, input,
+        var list, input, selection = '',
             input_len_update = function() {
-                input.css('width', Math.max(40, input.val().length * 15 + 25));
+                input.css('width', Math.max(5, input.val().length * 15 + 10));
             },
             apply_func = function() {
                 // update the original input
@@ -3207,7 +3207,9 @@ function rcube_elastic_ui()
 
         list = $('<ul>').addClass('form-control recipient-input ac-input rounded-left')
             .append($('<li>').append(input))
-            .on('click', function() { input.focus(); });
+            // "selection" hack to allow text selection in the recipient box or multiple boxes (#7129)
+            .on('mouseup', function () { selection = window.getSelection().toString(); })
+            .on('click', function() { if (!selection.length) input.focus(); });
 
         // Hide the original input/textarea
         // Note: we do not remove the original element, and we do not use