feat(toolbox): add ability to specify a toggled label on AbstractButton

react/features/base/toolbox/components/AbstractButton.js

@@ -68,6 +68,11 @@ export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
      */
     label: string;
 
+    /**
+     * The label for this button, when toggled.
+     */
+    toggledLabel: string;
+
     /**
      * The name of the icon of this button, when toggled.
      *
@@ -119,6 +124,19 @@ export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
             || this.iconName;
     }
 
+    /**
+     * Gets the current label, taking the toggled state into account. If no
+     * toggled label is provided, the regular label will also be used in the
+     * toggled state.
+     *
+     * @private
+     * @returns {string}
+     */
+    _getLabel() {
+        return (this._isToggled() ? this.toggledLabel : this.label)
+            || this.label;
+    }
+
     /**
      * Gets the current styles, taking the toggled state into account. If no
      * toggled styles are provided, the regular styles will also be used in the
@@ -179,7 +197,7 @@ export default class AbstractButton<P: Props, S: *> extends Component<P, S> {
             ...this.props,
             accessibilityLabel: this.accessibilityLabel,
             iconName: this._getIconName(),
-            label: this.label,
+            label: this._getLabel(),
             styles: this._getStyles(),
             tooltip: this.tooltip
         };