diff --git a/src/TabComplete.js b/src/TabComplete.js
index c49ef19e7f..1a798feba7 100644
--- a/src/TabComplete.js
+++ b/src/TabComplete.js
@@ -132,6 +132,9 @@ class TabComplete {
// they're resuming typing; reset tab complete state vars.
this.tabStruct.completing = false;
this.tabStruct.index = 0;
+ if (this.opts.onStateChange) {
+ this.opts.onStateChange(this.tabStruct.completing);
+ }
return true;
}
return false;
@@ -148,6 +151,9 @@ class TabComplete {
this.tabStruct.index = 0;
// cache starting text
this.tabStruct.original = this.textArea.value;
+ if (this.opts.onStateChange) {
+ this.opts.onStateChange(this.tabStruct.completing);
+ }
}
if (ev.shiftKey) {
diff --git a/src/component-index.js b/src/component-index.js
index 2f89e6d94b..8e87ef65cd 100644
--- a/src/component-index.js
+++ b/src/component-index.js
@@ -65,6 +65,7 @@ module.exports.components['views.rooms.RoomHeader'] = require('./components/view
module.exports.components['views.rooms.RoomList'] = require('./components/views/rooms/RoomList');
module.exports.components['views.rooms.RoomSettings'] = require('./components/views/rooms/RoomSettings');
module.exports.components['views.rooms.RoomTile'] = require('./components/views/rooms/RoomTile');
+module.exports.components['views.rooms.TabCompleteBar'] = require('./components/views/rooms/TabCompleteBar');
module.exports.components['views.settings.ChangeAvatar'] = require('./components/views/settings/ChangeAvatar');
module.exports.components['views.settings.ChangeDisplayName'] = require('./components/views/settings/ChangeDisplayName');
module.exports.components['views.settings.ChangePassword'] = require('./components/views/settings/ChangePassword');
diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js
index 853eda65a7..b7341e4f89 100644
--- a/src/components/structures/RoomView.js
+++ b/src/components/structures/RoomView.js
@@ -90,7 +90,10 @@ module.exports = React.createClass({
// completing at the start of the text
this.tabComplete = new TabComplete({
startingWordSuffix: ": ",
- wordSuffix: " "
+ wordSuffix: " ",
+ onStateChange: (isCompleting) => {
+ this.forceUpdate();
+ }
});
},
@@ -1284,6 +1287,12 @@ module.exports = React.createClass({
);
}
+ else if (this.tabComplete.isTabCompleting()) {
+ var TabCompleteBar = sdk.getComponent('rooms.TabCompleteBar');
+ statusBar = (
+