浏览代码

ref(chat): bring in package for text area auto-resizing

master
Leonard Kim 6 年前
父节点
当前提交
09f881c0f5
共有 3 个文件被更改,包括 27 次插入33 次删除
  1. 21
    31
      package-lock.json
  2. 1
    0
      package.json
  3. 5
    2
      react/features/chat/components/web/ChatInput.js

+ 21
- 31
package-lock.json 查看文件

2840
         "blueimp-md5": "^2.10.0",
2840
         "blueimp-md5": "^2.10.0",
2841
         "json3": "^3.3.2",
2841
         "json3": "^3.3.2",
2842
         "lodash": "^4.17.4",
2842
         "lodash": "^4.17.4",
2843
-        "ua-parser-js": "github:amplitude/ua-parser-js#ed538f1"
2843
+        "ua-parser-js": "github:amplitude/ua-parser-js#ed538f16f5c6ecd8357da989b617d4f156dcf35d"
2844
       },
2844
       },
2845
       "dependencies": {
2845
       "dependencies": {
2846
         "ua-parser-js": {
2846
         "ua-parser-js": {
6750
         },
6750
         },
6751
         "ansi-regex": {
6751
         "ansi-regex": {
6752
           "version": "2.1.1",
6752
           "version": "2.1.1",
6753
-          "bundled": true,
6754
-          "optional": true
6753
+          "bundled": true
6755
         },
6754
         },
6756
         "aproba": {
6755
         "aproba": {
6757
           "version": "1.2.0",
6756
           "version": "1.2.0",
6769
         },
6768
         },
6770
         "balanced-match": {
6769
         "balanced-match": {
6771
           "version": "1.0.0",
6770
           "version": "1.0.0",
6772
-          "bundled": true,
6773
-          "optional": true
6771
+          "bundled": true
6774
         },
6772
         },
6775
         "brace-expansion": {
6773
         "brace-expansion": {
6776
           "version": "1.1.11",
6774
           "version": "1.1.11",
6777
           "bundled": true,
6775
           "bundled": true,
6778
-          "optional": true,
6779
           "requires": {
6776
           "requires": {
6780
             "balanced-match": "^1.0.0",
6777
             "balanced-match": "^1.0.0",
6781
             "concat-map": "0.0.1"
6778
             "concat-map": "0.0.1"
6788
         },
6785
         },
6789
         "code-point-at": {
6786
         "code-point-at": {
6790
           "version": "1.1.0",
6787
           "version": "1.1.0",
6791
-          "bundled": true,
6792
-          "optional": true
6788
+          "bundled": true
6793
         },
6789
         },
6794
         "concat-map": {
6790
         "concat-map": {
6795
           "version": "0.0.1",
6791
           "version": "0.0.1",
6796
-          "bundled": true,
6797
-          "optional": true
6792
+          "bundled": true
6798
         },
6793
         },
6799
         "console-control-strings": {
6794
         "console-control-strings": {
6800
           "version": "1.1.0",
6795
           "version": "1.1.0",
6801
-          "bundled": true,
6802
-          "optional": true
6796
+          "bundled": true
6803
         },
6797
         },
6804
         "core-util-is": {
6798
         "core-util-is": {
6805
           "version": "1.0.2",
6799
           "version": "1.0.2",
6902
         },
6896
         },
6903
         "inherits": {
6897
         "inherits": {
6904
           "version": "2.0.3",
6898
           "version": "2.0.3",
6905
-          "bundled": true,
6906
-          "optional": true
6899
+          "bundled": true
6907
         },
6900
         },
6908
         "ini": {
6901
         "ini": {
6909
           "version": "1.3.5",
6902
           "version": "1.3.5",
6913
         "is-fullwidth-code-point": {
6906
         "is-fullwidth-code-point": {
6914
           "version": "1.0.0",
6907
           "version": "1.0.0",
6915
           "bundled": true,
6908
           "bundled": true,
6916
-          "optional": true,
6917
           "requires": {
6909
           "requires": {
6918
             "number-is-nan": "^1.0.0"
6910
             "number-is-nan": "^1.0.0"
6919
           }
6911
           }
6926
         "minimatch": {
6918
         "minimatch": {
6927
           "version": "3.0.4",
6919
           "version": "3.0.4",
6928
           "bundled": true,
6920
           "bundled": true,
6929
-          "optional": true,
6930
           "requires": {
6921
           "requires": {
6931
             "brace-expansion": "^1.1.7"
6922
             "brace-expansion": "^1.1.7"
6932
           }
6923
           }
6933
         },
6924
         },
6934
         "minimist": {
6925
         "minimist": {
6935
           "version": "0.0.8",
6926
           "version": "0.0.8",
6936
-          "bundled": true,
6937
-          "optional": true
6927
+          "bundled": true
6938
         },
6928
         },
6939
         "minipass": {
6929
         "minipass": {
6940
           "version": "2.2.4",
6930
           "version": "2.2.4",
6941
           "bundled": true,
6931
           "bundled": true,
6942
-          "optional": true,
6943
           "requires": {
6932
           "requires": {
6944
             "safe-buffer": "^5.1.1",
6933
             "safe-buffer": "^5.1.1",
6945
             "yallist": "^3.0.0"
6934
             "yallist": "^3.0.0"
6956
         "mkdirp": {
6945
         "mkdirp": {
6957
           "version": "0.5.1",
6946
           "version": "0.5.1",
6958
           "bundled": true,
6947
           "bundled": true,
6959
-          "optional": true,
6960
           "requires": {
6948
           "requires": {
6961
             "minimist": "0.0.8"
6949
             "minimist": "0.0.8"
6962
           }
6950
           }
7029
         },
7017
         },
7030
         "number-is-nan": {
7018
         "number-is-nan": {
7031
           "version": "1.0.1",
7019
           "version": "1.0.1",
7032
-          "bundled": true,
7033
-          "optional": true
7020
+          "bundled": true
7034
         },
7021
         },
7035
         "object-assign": {
7022
         "object-assign": {
7036
           "version": "4.1.1",
7023
           "version": "4.1.1",
7040
         "once": {
7027
         "once": {
7041
           "version": "1.4.0",
7028
           "version": "1.4.0",
7042
           "bundled": true,
7029
           "bundled": true,
7043
-          "optional": true,
7044
           "requires": {
7030
           "requires": {
7045
             "wrappy": "1"
7031
             "wrappy": "1"
7046
           }
7032
           }
7116
         },
7102
         },
7117
         "safe-buffer": {
7103
         "safe-buffer": {
7118
           "version": "5.1.1",
7104
           "version": "5.1.1",
7119
-          "bundled": true,
7120
-          "optional": true
7105
+          "bundled": true
7121
         },
7106
         },
7122
         "safer-buffer": {
7107
         "safer-buffer": {
7123
           "version": "2.1.2",
7108
           "version": "2.1.2",
7147
         "string-width": {
7132
         "string-width": {
7148
           "version": "1.0.2",
7133
           "version": "1.0.2",
7149
           "bundled": true,
7134
           "bundled": true,
7150
-          "optional": true,
7151
           "requires": {
7135
           "requires": {
7152
             "code-point-at": "^1.0.0",
7136
             "code-point-at": "^1.0.0",
7153
             "is-fullwidth-code-point": "^1.0.0",
7137
             "is-fullwidth-code-point": "^1.0.0",
7165
         "strip-ansi": {
7149
         "strip-ansi": {
7166
           "version": "3.0.1",
7150
           "version": "3.0.1",
7167
           "bundled": true,
7151
           "bundled": true,
7168
-          "optional": true,
7169
           "requires": {
7152
           "requires": {
7170
             "ansi-regex": "^2.0.0"
7153
             "ansi-regex": "^2.0.0"
7171
           }
7154
           }
7204
         },
7187
         },
7205
         "wrappy": {
7188
         "wrappy": {
7206
           "version": "1.0.2",
7189
           "version": "1.0.2",
7207
-          "bundled": true,
7208
-          "optional": true
7190
+          "bundled": true
7209
         },
7191
         },
7210
         "yallist": {
7192
         "yallist": {
7211
           "version": "3.0.2",
7193
           "version": "3.0.2",
7212
-          "bundled": true,
7213
-          "optional": true
7194
+          "bundled": true
7214
         }
7195
         }
7215
       }
7196
       }
7216
     },
7197
     },
12398
         "exenv": "^1.2.2"
12379
         "exenv": "^1.2.2"
12399
       }
12380
       }
12400
     },
12381
     },
12382
+    "react-textarea-autosize": {
12383
+      "version": "7.1.0",
12384
+      "resolved": "https://registry.npmjs.org/react-textarea-autosize/-/react-textarea-autosize-7.1.0.tgz",
12385
+      "integrity": "sha512-c2FlR/fP0qbxmlrW96SdrbgP/v0XZMTupqB90zybvmDVDutytUgPl7beU35klwcTeMepUIQEpQUn3P3bdshGPg==",
12386
+      "requires": {
12387
+        "@babel/runtime": "^7.1.2",
12388
+        "prop-types": "^15.6.0"
12389
+      }
12390
+    },
12401
     "react-transform-hmr": {
12391
     "react-transform-hmr": {
12402
       "version": "1.0.4",
12392
       "version": "1.0.4",
12403
       "resolved": "https://registry.npmjs.org/react-transform-hmr/-/react-transform-hmr-1.0.4.tgz",
12393
       "resolved": "https://registry.npmjs.org/react-transform-hmr/-/react-transform-hmr-1.0.4.tgz",

+ 1
- 0
package.json 查看文件

79
     "react-native-webrtc": "github:jitsi/react-native-webrtc#4064c6f2db4f8b961daaaa8dafc6a896d7cfbc43",
79
     "react-native-webrtc": "github:jitsi/react-native-webrtc#4064c6f2db4f8b961daaaa8dafc6a896d7cfbc43",
80
     "react-native-webview": "5.8.1",
80
     "react-native-webview": "5.8.1",
81
     "react-redux": "5.0.7",
81
     "react-redux": "5.0.7",
82
+    "react-textarea-autosize": "7.1.0",
82
     "react-transition-group": "2.4.0",
83
     "react-transition-group": "2.4.0",
83
     "redux": "4.0.0",
84
     "redux": "4.0.0",
84
     "redux-thunk": "2.2.0",
85
     "redux-thunk": "2.2.0",

+ 5
- 2
react/features/chat/components/web/ChatInput.js 查看文件

2
 
2
 
3
 import React, { Component } from 'react';
3
 import React, { Component } from 'react';
4
 import Emoji from 'react-emoji-render';
4
 import Emoji from 'react-emoji-render';
5
+import TextareaAutosize from 'react-textarea-autosize';
5
 import type { Dispatch } from 'redux';
6
 import type { Dispatch } from 'redux';
6
 
7
 
7
 import { translate } from '../../../base/i18n';
8
 import { translate } from '../../../base/i18n';
114
                     </div>
115
                     </div>
115
                 </div>
116
                 </div>
116
                 <div className = 'usrmsg-form'>
117
                 <div className = 'usrmsg-form'>
117
-                    <textarea
118
+                    <TextareaAutosize
118
                         id = 'usermsg'
119
                         id = 'usermsg'
120
+                        inputRef = { this._setTextAreaRef }
121
+                        maxRows = { 5 }
122
+                        minRows = { 2 }
119
                         onChange = { this._onMessageChange }
123
                         onChange = { this._onMessageChange }
120
                         onKeyDown = { this._onDetectSubmit }
124
                         onKeyDown = { this._onDetectSubmit }
121
                         placeholder = { this.props.t('chat.messagebox') }
125
                         placeholder = { this.props.t('chat.messagebox') }
122
-                        ref = { this._setTextAreaRef }
123
                         value = { this.state.message } />
126
                         value = { this.state.message } />
124
                 </div>
127
                 </div>
125
             </div>
128
             </div>

正在加载...
取消
保存