Update Toolbox Interface (#3934)

* Update toolbox interface

core/block_dragger.js

@@ -170,7 +170,7 @@ Blockly.BlockDragger.prototype.startBlockDrag = function(currentDragDeltaXY,
   this.draggingBlock_.moveToDragSurface();
 
   var toolbox = this.workspace_.getToolbox();
-  if (toolbox) {
+  if (toolbox && typeof toolbox.addStyle == 'function') {
     var style = this.draggingBlock_.isDeletable() ? 'blocklyToolboxDelete' :
         'blocklyToolboxGrab';
     toolbox.addStyle(style);
@@ -246,7 +246,7 @@ Blockly.BlockDragger.prototype.endBlockDrag = function(e, currentDragDeltaXY) {
   this.workspace_.setResizesEnabled(true);
 
   var toolbox = this.workspace_.getToolbox();
-  if (toolbox) {
+  if (toolbox && typeof toolbox.removeStyle == 'function') {
     var style = this.draggingBlock_.isDeletable() ? 'blocklyToolboxDelete' :
         'blocklyToolboxGrab';
     toolbox.removeStyle(style);

core/bubble_dragger.js

@@ -107,7 +107,7 @@ Blockly.BubbleDragger.prototype.startBubbleDrag = function() {
   this.draggingBubble_.setDragging && this.draggingBubble_.setDragging(true);
 
   var toolbox = this.workspace_.getToolbox();
-  if (toolbox) {
+  if (toolbox && typeof toolbox.addStyle == 'function') {
     var style = this.draggingBubble_.isDeletable() ? 'blocklyToolboxDelete' :
         'blocklyToolboxGrab';
     toolbox.addStyle(style);
@@ -208,10 +208,11 @@ Blockly.BubbleDragger.prototype.endBubbleDrag = function(
   }
   this.workspace_.setResizesEnabled(true);
 
-  if (this.workspace_.getToolbox()) {
+  var toolbox = this.workspace_.getToolbox();
+  if (toolbox && typeof toolbox.removeStyle == 'function') {
     var style = this.draggingBubble_.isDeletable() ? 'blocklyToolboxDelete' :
         'blocklyToolboxGrab';
-    this.workspace_.getToolbox().removeStyle(style);
+    toolbox.removeStyle(style);
   }
   Blockly.Events.setGroup(false);
 };

core/interfaces/i_styleable.js

@@ -0,0 +1,33 @@
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview The interface for an object that a style can be added to.
+ * @author aschmiedt@google.com (Abby Schmiedt)
+ */
+
+'use strict';
+
+goog.provide('Blockly.IStyleable');
+
+
+/**
+ * Interface for an object that a style can be added to.
+ * @interface
+ */
+Blockly.IStyleable = function() {};
+
+/**
+ * Adds a style on the toolbox. Usually used to change the cursor.
+ * @param {string} style The name of the class to add.
+ */
+Blockly.IStyleable.prototype.addStyle;
+
+/**
+ * Removes a style from the toolbox. Usually used to change the cursor.
+ * @param {string} style The name of the class to remove.
+ */
+Blockly.IStyleable.prototype.removeStyle;

core/interfaces/i_toolbox.js

@@ -76,19 +76,7 @@ Blockly.IToolbox.prototype.clearSelection;
  * Updates the category colours and background colour of selected categories.
  * @return {void}
  */
-Blockly.IToolbox.prototype.updateColourFromTheme;
-
-/**
- * Adds a style on the toolbox. Usually used to change the cursor.
- * @param {string} style The name of the class to add.
- */
-Blockly.IToolbox.prototype.addStyle;
-
-/**
- * Removes a style from the toolbox. Usually used to change the cursor.
- * @param {string} style The name of the class to remove.
- */
-Blockly.IToolbox.prototype.removeStyle;
+Blockly.IToolbox.prototype.refreshTheme;
 
 /**
  * Update the flyout's contents without closing it.  Should be used in response

core/toolbox.js

@@ -30,6 +30,7 @@ goog.require('Blockly.utils.toolbox');
 
 goog.requireType('Blockly.IBlocklyActionable');
 goog.requireType('Blockly.IDeleteArea');
+goog.requireType('Blockly.IStyleable');
 goog.requireType('Blockly.IToolbox');
 
 
@@ -41,6 +42,7 @@ goog.requireType('Blockly.IToolbox');
  * @constructor
  * @implements {Blockly.IBlocklyActionable}
  * @implements {Blockly.IDeleteArea}
+ * @implements {Blockly.IStyleable}
  * @implements {Blockly.IToolbox}
  */
 Blockly.Toolbox = function(workspace) {
@@ -650,7 +652,7 @@ Blockly.Toolbox.prototype.updateColourFromTheme_ = function(opt_tree) {
  * Updates the category colours and background colour of selected categories.
  * @package
  */
-Blockly.Toolbox.prototype.updateColourFromTheme = function() {
+Blockly.Toolbox.prototype.refreshTheme = function() {
   var tree = this.tree_;
   if (tree) {
     this.updateColourFromTheme_(tree);

core/workspace_svg.js

@@ -542,7 +542,7 @@ Blockly.WorkspaceSvg.prototype.refreshTheme = function() {
   // Update current toolbox selection.
   this.refreshToolboxSelection();
   if (this.toolbox_) {
-    this.toolbox_.updateColourFromTheme();
+    this.toolbox_.refreshTheme();
   }
 
   // Re-render if workspace is visible