diff --git a/client/coral-plugin-flags/FlagButton.js b/client/coral-plugin-flags/FlagButton.js
index 36665e71e..186594bee 100644
--- a/client/coral-plugin-flags/FlagButton.js
+++ b/client/coral-plugin-flags/FlagButton.js
@@ -2,10 +2,11 @@ import React, {Component} from 'react';
 import {I18n} from '../coral-framework';
 import translations from './translations.json';
 import {PopupMenu, Button} from 'coral-ui';
+import onClickOutside from 'react-onclickoutside';
 
 const name = 'coral-plugin-flags';
 
-export default class FlagButton extends Component {
+class FlagButton extends Component {
 
   state = {
     showMenu: false,
@@ -107,6 +108,10 @@ export default class FlagButton extends Component {
     this.setState({otherText: e.target.value});
   }
 
+  handleClickOutside () {
+    this.setState({showMenu: false});
+  }
+
   render () {
     const {flag} = this.props;
     const flagged = flag && flag.current_user;
@@ -180,6 +185,8 @@ export default class FlagButton extends Component {
   }
 }
 
+export default onClickOutside(FlagButton);
+
 const styles = {
   flaggedIcon: {
     color: '#F00'