sphinx-togglebutton icon indicating copy to clipboard operation
sphinx-togglebutton copied to clipboard

Toggle groups of elements

Open choldgraf opened this issue 3 years ago • 0 comments

This adds toggle groups so that you can define subsets of toggle buttons based on a selector. You can define them like so:

togglebutton_groups = {
  "grouponename": ".groupone-selector",
  "grouptwoname": ".grouptwo-selector"
}

This allows people to define subsets of groups that they want to open/close with distinct buttons. For example, to create two buttons that toggle each group separately:

Toggle group one:

```{toggle-group} grouponename
```

Toggle group two:

```{toggle-group} grouptwoname
```

Toggle all groups:
```{toggle-group}
```

It also updates a bit of the usage documentation to be clearer.

This is meant to make it easier for us to add "toggle input / output" behavior to MyST-NB. We could do so by updating the togglebutton_groups config, like so:

app.config.togglebutton_groups.update({
  "cell-inputs": ".cell.tag_hide-input .cell_input",
  "cell-outputs": ".cell.tag_hide-output .cell_output",
}

and we could then create buttons that trigger each like so:

Toggle cell inputs:

```{toggle-group} cell-inputs
```

Toggle cell outputs:

```{toggle-group} cell-outputs
```

However, in practice I think we should build a header button / dropdown that controls this for us.

To do

  • [ ] Add a test
  • [ ] Do another pass through the javascript to make sure it works as expected
  • [ ] Fix reference examples

choldgraf avatar Feb 10 '22 23:02 choldgraf