Disable, hide, or expand categories

You can disable, hide, or expand categories.

Disable categories

A disabled category will not allow a user to open the category and it will be skipped during keyboard navigation.

var category = toolbox.getToolboxItems()[0];
category.setDisabled('true');

When a category is disabled, a 'disabled' property is added to the DOM element, which allows you to control the look of a disabled category.

.blocklyToolboxCategoryContainer[disabled="true"] {
  opacity: .5;
}

A hidden category will not be shown as part of the toolbox.

{
  "kind": "category",
  "name": "...",
  "hidden": "true",
}

<category name="..." hidden="true"></category>

Hidden categories can later be shown via JavaScript.

var category = toolbox.getToolboxItems()[0];
category.hide();
// etc...
category.show();

This only applies to categories which contain other nested categories.

An expanded category will show you its sub categories. By default, nested categories are collapsed, and need to be clicked to be expanded.

{
  "kind": "category",
  "name": "...",
  "expanded": "true",
}

<category name="..." expanded="true"></category>