diff --git a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 b/app/assets/javascripts/discourse/lib/plugin-api.js.es6
index 91603a7f0cc..1bc7638c83d 100644
--- a/app/assets/javascripts/discourse/lib/plugin-api.js.es6
+++ b/app/assets/javascripts/discourse/lib/plugin-api.js.es6
@@ -18,7 +18,8 @@ import { addTagsHtmlCallback } from 'discourse/lib/render-tags';
 import { addUserMenuGlyph } from 'discourse/widgets/user-menu';
 import { addPostClassesCallback } from 'discourse/widgets/post';
 import { addPostTransformCallback } from 'discourse/widgets/post-stream';
-import { queryRegistry } from 'discourse/widgets/widget';
+import { attachAdditionalPanel } from 'discourse/widgets/header';
+
 
 // If you add any methods to the API ensure you bump up this number
 const PLUGIN_API_VERSION = '0.8.6';
@@ -340,14 +341,18 @@ class PluginApi {
    * takes a widget name, a value to toggle on, and a function which returns the attrs for the widget
    * Example:
    * ```javascript
-   * api.addHeaderPanel('widget-name', 'widgetVisible', function(attrs, state) { return {}; });
+   * api.addHeaderPanel('widget-name', 'widgetVisible', function(attrs, state) {
+   *   return { name: attrs.name, description: state.description };
+   * });
    * ```
-   * note that 'toggle' is an attribute on the state of the header widget,
-   * and the attrFn receives the current attrs and state of the header as arguments,
-   * and returns a hash of attrs to pass to the widget
+   * 'toggle' is an attribute on the state of the header widget,
+   *
+   * 'transformAttrs' is a function which is passed the current attrs and state of the widget,
+   * and returns a hash of values to pass to attach
+   *
    **/
-   addHeaderPanel(name, toggle, attrFn) {
-     queryRegistry('header').prototype.attachAdditionalPanel(name, toggle, attrFn);
+   addHeaderPanel(name, toggle, transformAttrs) {
+     attachAdditionalPanel(name, toggle, transformAttrs);
    }
 
   /**
diff --git a/app/assets/javascripts/discourse/widgets/header.js.es6 b/app/assets/javascripts/discourse/widgets/header.js.es6
index ec93b0f230a..c90954978f2 100644
--- a/app/assets/javascripts/discourse/widgets/header.js.es6
+++ b/app/assets/javascripts/discourse/widgets/header.js.es6
@@ -166,6 +166,11 @@ createWidget('header-buttons', {
 
 const forceContextEnabled = ['category', 'user', 'private_messages'];
 
+let additionalPanels = []
+export function attachAdditionalPanel(name, toggle, transformAttrs) {
+  additionalPanels.push({ name, toggle, transformAttrs });
+}
+
 export default createWidget('header', {
   tagName: 'header.d-header.clearfix',
   buildKey: () => `header`,
@@ -186,10 +191,6 @@ export default createWidget('header', {
     return states;
   },
 
-  attachAdditionalPanel(name, toggle, attrFn) {
-    this.additionalPanels.push({ name, toggle, attrFn });
-  },
-
   html(attrs, state) {
     const panels = [this.attach('header-buttons', attrs),
                     this.attach('header-icons', { hamburgerVisible: state.hamburgerVisible,
@@ -219,9 +220,9 @@ export default createWidget('header', {
       panels.push(this.attach('user-menu'));
     }
 
-    this.additionalPanels.map((panel) => {
+    additionalPanels.map((panel) => {
       if (this.state[panel.toggle]) {
-        panels.push(this.attach(panel.name, panel.attrFn.call(this, attrs, state)));
+        panels.push(this.attach(panel.name, panel.transformAttrs.call(this, attrs, state)));
       }
     });