updates

docs/frontend_api/widgets_right_panel_widget.js.html

@@ -30,7 +30,10 @@
 
 const WIDGET_TPL = `
 <div class="card widget">
-    <div class="card-header"></div>
+    <div class="card-header">
+        <div class="card-header-title"></div>
+        <div class="card-header-buttons"></div>
+    </div>
 
     <div id="[to be set]" class="body-wrapper">
         <div class="card-body"></div>
@@ -45,9 +48,18 @@ class RightPanelWidget extends NoteContextAwareWidget {
     /** Title to show in the panel. */
     get widgetTitle() { return "Untitled widget"; }
 
+    get widgetButtons() { return []; }
+
     get help() { return {}; }
 
+    constructor() {
+        super();
+
+        this.child(...this.widgetButtons);
+    }
+
     /**
+     * Do not override this method unless you know what you're doing.
      * Do not override this method unless you know what you're doing.
      */
     doRender() {
@@ -60,22 +72,30 @@ class RightPanelWidget extends NoteContextAwareWidget {
 
         this.$body = this.$bodyWrapper.find('.card-body');
 
-        this.$title = this.$widget.find('.card-header');
+        this.$title = this.$widget.find('.card-header .card-header-title');
         this.$title.text(this.widgetTitle);
 
+        this.$buttons = this.$widget.find('.card-header .card-header-buttons');
+        this.$buttons.empty();
+
+        for (const buttonWidget of this.children) {
+            this.$buttons.append(buttonWidget.render());
+        }
+
         this.initialized = this.doRenderBody();
     }
 
     /**
-     * Method used for rendering the body of the widget.
-     * 
+     * Method used for rendering the body of the widget (via existing this.$body)
+     *
      * Your class should override this method.
-     * @returns {JQuery<HTMLElement>} The body of your widget.
+     * @returns {Promise|undefined} if widget needs async operation to initialize, it can return a Promise
      */
     async doRenderBody() {}
 }
 
-export default RightPanelWidget;</code></pre>
+export default RightPanelWidget;
+</code></pre>
         </article>
     </section>